feat:折叠按钮样式修改

src/views/perfManage/kpiCReport/index.vue

@@ -43,7 +43,7 @@ import { writeSheet } from '@/utils/execl-utils';
 import saveAs from 'file-saver';
 import { generateColorRGBA } from '@/utils/generate-utils';
 import { OptionsType, WS } from '@/plugins/ws-websocket';
-import { LineOutlined, InfoCircleOutlined, EyeOutlined, EyeInvisibleOutlined } from '@ant-design/icons-vue';
+import { LineOutlined, InfoCircleOutlined, EyeOutlined, EyeInvisibleOutlined, UpOutlined } from '@ant-design/icons-vue';
 import { useRoute } from 'vue-router';
 import dayjs, { Dayjs } from 'dayjs';
 import useLayoutStore from '@/store/modules/layout';
@@ -1194,6 +1194,17 @@ onBeforeUnmount(() => {
       <!-- 插槽-卡片左侧侧 -->
       <template #title>
         <a-space :size="8" align="center">
+          <a-button
+            v-show="!tableState.showTable"
+            type="default"
+            @click="toggleChartVisibility"
+            class="chart-toggle-btn"
+            :title="isChartVisible ? 'hide' : 'show'"
+          >
+            <DownOutlined v-if="isChartVisible"  />
+            <RightOutlined v-else />
+            <span style="margin-left: 4px;">{{ isChartVisible ? 'Expand Graph' : 'Collapse Graph' }}</span>
+          </a-button>
           <a-button
             type="primary"
             :loading="tableState.loading"
@@ -1292,17 +1303,6 @@ onBeforeUnmount(() => {
               size="small"
             />
           </a-form-item>
-          <a-button
-            v-show="!tableState.showTable"
-            type="primary"
-            @click="toggleChartVisibility"
-            class="chart-toggle-btn"
-            :title="isChartVisible ? 'hide' : 'show'"
-          >
-            <EyeOutlined v-if="isChartVisible" />
-            <EyeInvisibleOutlined v-else />
-            <span style="margin-left: 4px;">{{ isChartVisible ? 'Foldable the chart' : 'Expand the chart' }}</span>
-          </a-button>
         </a-form>
       </template>