修改菜单树无法展开问题

src/components/icon/index.vue

@@ -10,7 +10,7 @@ export default defineComponent({
             required: true
         },
         size: {
-            type: String,
+            type: [String, Number],
             default: '18px'
         },
         color: {
@@ -21,7 +21,7 @@ export default defineComponent({
     setup(props) {
         const iconStyle = computed((): CSSProperties => {
             const { size, color } = props
-            let s = `${size.replace('px', '')}px`
+            const s = `${String(size).replace('px', '')}px`
             return {
                 fontSize: s,
                 color: color

src/components/icon/svg/index.vue

@@ -10,7 +10,7 @@ import { computed, type CSSProperties } from 'vue'
 import { isExternal } from '@/utils/common'
 interface Props {
     name: string
-    size: string
+    size: string | number
     color: string
 }
 
@@ -20,7 +20,7 @@ const props = withDefaults(defineProps<Props>(), {
     color: '#000000',
 })
 
-const s = `${props.size.replace('px', '')}px`
+const s = `${String(props.size).replace('px', '')}px`
 const iconName = computed(() => `#${props.name}`)
 const iconStyle = computed((): CSSProperties => {
     return {

src/components/table/defaultAttribute.ts

@@ -7,10 +7,11 @@ export const defaultAttribute: VxeTableProps = {
     stripe: true,
     size: 'small',
     columnConfig: { resizable: true, useKey: true },
-    rowConfig: { isCurrent: true, isHover: true },
+    rowConfig: { isCurrent: true, isHover: true, keyField: 'id' },
     scrollX: { scrollToLeftOnChange: true },
-    scrollY: { scrollToTopOnChange: true, enabled: true, gt: 100 },
+    scrollY: { enabled: false },
-    customConfig: { enabled: true, allowFixed: false, showFooter: false, immediate: true ,mode:'default'},
+    // 注意：全局不要默认开启 treeConfig，会与 stripe 冲突；树表在页面自行配置
+    customConfig: { enabled: true, allowFixed: false, showFooter: false, immediate: true, mode: 'default' },
     showOverflow: 'tooltip',
     showHeaderOverflow: false
 }

src/styles/vxeTable.scss

@@ -81,14 +81,17 @@
 .vxe-modal--wrapper {
     z-index: 5000 !important;
 }
-// .vxe-table--body .vxe-body--row:nth-child(even) {
+/* 斑马纹：新版 vxe 背景画在 column 上，默认条纹色 #fafafa 几乎看不见 */
-//     background-color: #f9f9f9;
+:root {
-//     // background-color: var(--el-color-primary-light-9);
+    --vxe-ui-table-row-striped-background-color: #fafafa;
-// }
+    --vxe-ui-table-row-hover-striped-background-color: #eef1f6;
-
+}
-// .vxe-table--body .vxe-body--row:nth-child(odd) {
+.vxe-table--render-default .vxe-body--row.row--stripe > .vxe-body--column {
-//     background-color: #ffffff;
+    background-color: var(--vxe-ui-table-row-striped-background-color);
-// }
+}
+.vxe-table--render-default .vxe-body--row.row--hover.row--stripe > .vxe-body--column {
+    background-color: var(--vxe-ui-table-row-hover-striped-background-color);
+}
 .default-theme.splitpanes--vertical > .splitpanes__splitter,
 .default-theme .splitpanes--vertical > .splitpanes__splitter {
     width: 10px !important;

src/views/pqs/harmonicMonitoring/area/harmonicDistortionRate/index.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="default-main online">
         <div class="online_header">
-            <TableHeader date-picker area ref="tableHeaderRef">
+            <TableHeader date-picker area ref="tableHeaderRef" showCustomColumn>
                 <template #select>
                     <el-form-item label="统计类型">
                         <el-select
@@ -101,7 +101,7 @@
                         ref="tableRef"
                         :tree-config="{ transform: true, parentField: 'uPid', rowField: 'uId' }"
                         :scroll-y="{ enabled: true }"
-                        v-if="activeName == 0"
+                    
                     />
                 </el-tab-pane>
                 <el-tab-pane :name="1" :lazy="true" label="谐波畸变率统计图">

src/views/setting/dictionary/tree/index.vue

@@ -1,14 +1,19 @@
 <template>
-    <div class='default-main'>
+    <div class="default-main">
-        <div class='custom-table-header'>
+        <div class="custom-table-header">
             <div class="title">字典树列表</div>
-            <el-button :icon='Plus' type='primary' @click='addMenu'>新增字典类型</el-button>
+            <el-button :icon="Plus" type="primary" @click="addMenu">新增字典类型</el-button>
         </div>
-        <Table ref='tableRef' />
+        <Table
-        <PopupForm ref='popupFormRef'></PopupForm>
+            ref="tableRef"
+            :row-config="{ isCurrent: true, isHover: true, keyField: 'id' }"
+            :tree-config="{ children: 'children', reserve: true }"
+            :scroll-y="{ enabled: false }"
+        />
+        <PopupForm ref="popupFormRef"></PopupForm>
     </div>
 </template>
-<script setup lang='ts'>
+<script setup lang="ts">
 import { Plus } from '@element-plus/icons-vue'
 import { ref, onMounted, provide } from 'vue'
 import TableStore from '@/utils/tableStore'
@@ -23,10 +28,10 @@ defineOptions({
 
 const popupFormRef = ref()
 const tableStore = new TableStore({
-    showPage:false,
+    showPage: false,
     url: '/system-boot/dictTree/queryTree',
     method: 'GET',
-    publicHeight:60,
+    publicHeight: 60,
     column: [
         { title: '字典名称', field: 'name', treeNode: true, align: 'left' },
         // { title: '排序', field: 'sort',width:'80'  },
@@ -49,7 +54,8 @@ const tableStore = new TableStore({
             }
         },
         {
-             title: '操作',fixed: 'right',
+            title: '操作',
+            fixed: 'right',
             width: '180',
             render: 'buttons',
 

src/views/system/auth/department/index.vue

@@ -13,7 +13,11 @@
                 show-word-limit
             />
         </div>
-        <Table />
+        <Table
+            :row-config="{ isCurrent: true, isHover: true, keyField: 'id' }"
+            :tree-config="{ children: 'children', reserve: true }"
+            :scroll-y="{ enabled: false }"
+        />
         <PopupForm ref="popupFormRef" @init="tableStore.index()"></PopupForm>
         <PopupPoint ref="popupPointRef"></PopupPoint>
     </div>
@@ -77,7 +81,8 @@ const tableStore = new TableStore({
             }
         },
         {
-             title: '操作',fixed: 'right',
+            title: '操作',
+            fixed: 'right',
             align: 'center',
             width: '180',
             render: 'buttons',
@@ -126,7 +131,7 @@ const tableStore = new TableStore({
                                 })
                             })
                         } else {
-                             ElMessageBox.confirm('是否确认删除该部门', '提示', {
+                            ElMessageBox.confirm('是否确认删除该部门', '提示', {
                                 confirmButtonText: '确认删除',
                                 cancelButtonText: '取消',
                                 type: 'warning'
@@ -149,7 +154,7 @@ const tableStore = new TableStore({
                         return row.children.length > 0
                     },
                     click: row => {
-                        popupPointRef.value.open( row)
+                        popupPointRef.value.open(row)
                     }
                 }
             ]

src/views/system/auth/menu/menu.vue

@@ -12,7 +12,12 @@
             />
             <el-button :icon="Plus" type="primary" @click="addMenu" class="ml10">新增</el-button>
         </div>
-        <Table @currentChange="currentChange" />
+        <Table
+            @currentChange="currentChange"
+            :row-config="{ isCurrent: true, isHover: true, keyField: 'id' }"
+            :tree-config="{ children: 'children', reserve: true }"
+            :scroll-y="{ enabled: false }"
+        />
         <popupMenu ref="popupRef" @init="emits('init')"></popupMenu>
     </div>
 </template>