From e181f04c642204e79749af93fa921875ff6c21ba Mon Sep 17 00:00:00 2001
From: baoshiwei <baoshiwei@shlanbao.cn>
Date: 星期二, 20 五月 2025 10:46:35 +0800
Subject: [PATCH] refactor(qms): 重构趋势图展示逻辑

---
 src/components/RightToolbar/index.vue |   81 +++++++++++++++++++++-------------------
 1 files changed, 42 insertions(+), 39 deletions(-)

diff --git a/src/components/RightToolbar/index.vue b/src/components/RightToolbar/index.vue
index 0f4219f..e8c9d65 100644
--- a/src/components/RightToolbar/index.vue
+++ b/src/components/RightToolbar/index.vue
@@ -1,27 +1,29 @@
 <template>
   <div class="top-right-btn" :style="style">
     <el-row>
-      <el-tooltip class="item" effect="dark" :content="showSearch ? '闅愯棌鎼滅储' : '鏄剧ず鎼滅储'" placement="top" v-if="search">
+      <el-tooltip v-if="search" class="item" effect="dark" :content="showSearch ? '闅愯棌鎼滅储' : '鏄剧ず鎼滅储'" placement="top">
         <el-button circle icon="Search" @click="toggleSearch()" />
       </el-tooltip>
       <el-tooltip class="item" effect="dark" content="鍒锋柊" placement="top">
         <el-button circle icon="Refresh" @click="refresh()" />
       </el-tooltip>
-      <el-tooltip class="item" effect="dark" content="鏄剧ず/闅愯棌鍒�" placement="top" v-if="columns">
-        <el-popover placement="bottom" trigger="click">
-          <div class="tree-header">鏄剧ず/闅愯棌鍒�</div>
-          <el-tree
-            ref="columnRef"
-            :data="columns"
-            show-checkbox
-            @check="columnChange"
-            node-key="key"
-            :props="{ label: 'label', children: 'children' }"
-          ></el-tree>
-          <template #reference>
-            <el-button circle icon="Menu" />
-          </template>
-        </el-popover>
+      <el-tooltip v-if="columns" class="item" effect="dark" content="鏄剧ず/闅愯棌鍒�" placement="top">
+        <div class="show-btn">
+          <el-popover placement="bottom" trigger="click">
+            <div class="tree-header">鏄剧ず/闅愯棌鍒�</div>
+            <el-tree
+              ref="columnRef"
+              :data="columns"
+              show-checkbox
+              node-key="key"
+              :props="{ label: 'label', children: 'children' }"
+              @check="columnChange"
+            ></el-tree>
+            <template #reference>
+              <el-button circle icon="Menu" />
+            </template>
+          </el-popover>
+        </div>
       </el-tooltip>
     </el-row>
   </div>
@@ -31,51 +33,49 @@
 import { propTypes } from '@/utils/propTypes';
 
 const props = defineProps({
-    showSearch: propTypes.bool.def(true),
-    columns: {
-        type: Array as PropType<FieldOption[]>,
-    },
-    search: propTypes.bool.def(true),
-    gutter: propTypes.number.def(10),
-})
+  showSearch: propTypes.bool.def(true),
+  columns: propTypes.fieldOption,
+  search: propTypes.bool.def(true),
+  gutter: propTypes.number.def(10)
+});
 
 const columnRef = ref<ElTreeInstance>();
 const emits = defineEmits(['update:showSearch', 'queryTable']);
 
 const style = computed(() => {
-    const ret: any = {};
-    if (props.gutter) {
-        ret.marginRight = `${props.gutter / 2}px`;
-    }
-    return ret;
+  const ret: any = {};
+  if (props.gutter) {
+    ret.marginRight = `${props.gutter / 2}px`;
+  }
+  return ret;
 });
 
 // 鎼滅储
 function toggleSearch() {
-    emits("update:showSearch", !props.showSearch);
+  emits('update:showSearch', !props.showSearch);
 }
 
 // 鍒锋柊
 function refresh() {
-    emits("queryTable");
+  emits('queryTable');
 }
 
 // 鏇存敼鏁版嵁鍒楃殑鏄剧ず鍜岄殣钘�
 function columnChange(...args: any[]) {
   props.columns?.forEach((item) => {
     item.visible = args[1].checkedKeys.includes(item.key);
-  })
+  });
 }
 
 // 鏄鹃殣鍒楀垵濮嬮粯璁ら殣钘忓垪
 onMounted(() => {
-    props.columns?.forEach((item) => {
-        if (item.visible) {
-          columnRef.value?.setChecked(item.key, true, false);
-            // value.value.push(item.key);
-        }
-    })
-})
+  props.columns?.forEach((item) => {
+    if (item.visible) {
+      columnRef.value?.setChecked(item.key, true, false);
+      // value.value.push(item.key);
+    }
+  });
+});
 </script>
 
 <style lang="scss" scoped>
@@ -91,9 +91,12 @@
 .my-el-transfer {
   text-align: center;
 }
-.tree-header{
+.tree-header {
   width: 100%;
   line-height: 24px;
   text-align: center;
 }
+.show-btn {
+  margin-left: 12px;
+}
 </style>

--
Gitblit v1.9.3