From 0c6473bcff72275f79cbc14843937ed8b26c6801 Mon Sep 17 00:00:00 2001
From: loulijun2021 <1694218219@qq.com>
Date: 星期三, 04 一月 2023 16:41:03 +0800
Subject: [PATCH] 1.优化列展示功能
---
src/layout/components/Navbar.vue | 2 +-
src/components/DndList/index.vue | 29 ++++++++++++++++++-----------
src/layout/components/Sidebar/index.vue | 4 ++--
src/components/ThemePicker/index.vue | 1 -
src/layout/components/Settings/index.vue | 4 ----
5 files changed, 21 insertions(+), 19 deletions(-)
diff --git a/src/components/DndList/index.vue b/src/components/DndList/index.vue
index abb23e6..828d0b3 100644
--- a/src/components/DndList/index.vue
+++ b/src/components/DndList/index.vue
@@ -9,7 +9,10 @@
<draggable :set-data="setData" :list="list1" class="dragArea" animation="300" @end="draggableEnded">
<div v-for="item in list1" :key="item.id" class="list-complete-item">
<div style="display: flex">
- <div style="width: 20px;height: 20px;margin-right: 4px;cursor:move"><i class="el-icon-rank" /></div>
+ <div style="width: 20px;height: 20px;margin-right: 4px;cursor:move;"><i
+ style="font-weight: bolder"
+ class="el-icon-rank"
+ /></div>
<el-checkbox :label="item.label" class="list-complete-item-handle" />
</div>
<div>
@@ -58,8 +61,9 @@
data() {
return {
checkedList: this.list1.map(i => i.show ? i.label : '').filter(i => i !== ''), // 鍒楀睍绀哄��
+ checkedListDefault: [...this.list1], // 閲嶇疆榛樿鍊糒ist
checkedListDefaultLabel: this.list1.map(i => i.show ? i.label : '').filter(i => i !== ''), // 閲嶇疆榛樿鍊糽abel
- // checkedListDefaultFixed: this.list1.map(i => i.show ? i.label : '').filter(i => i !== ''), // 閲嶇疆榛樿鍊糵ixed
+ checkedListDefaultFixed: this.list1.map(i => i.fixed), // 閲嶇疆榛樿鍊糵ixed
checkedAll: true
}
},
@@ -76,8 +80,12 @@
// 閲嶇疆
resetColumn() {
this.checkedList = this.checkedListDefaultLabel
+ this.list1.sort((a, b) => a.id - b.id)// 鎺掑簭
this.list1.forEach((i, j) => {
i.show = !!this.checkedListDefaultLabel.includes(i.label)
+ })
+ this.checkedListDefaultFixed.forEach((i, j) => {
+ this.list1[j].fixed = i
})
this.$emit('tableColumnUpdate', this.checkedListDefaultLabel)
},
@@ -96,26 +104,25 @@
},
// 鍥哄畾鍒板乏渚�
fixedToLeft(val) {
- console.log('fixedToLeft', val)
- this.list1.find(i => i.label === val).fixed = this.list1.find(i => i.label === val).fixed !== 'left' ? 'left' : false
+ if (this.list1.find(i => i.label === val).show) {
+ this.list1.find(i => i.label === val).fixed = this.list1.find(i => i.label === val).fixed !== 'left' ? 'left' : false
+ }
this.$emit('tableColumnUpdate', this.checkedList)
},
// 鍥哄畾鍒板彸渚�
fixedToRight(val) {
- console.log('fixedToRight', val)
- this.list1.find(i => i.label === val).fixed = this.list1.find(i => i.label === val).fixed !== 'right' ? 'right' : false
+ if (this.list1.find(i => i.label === val).show) {
+ this.list1.find(i => i.label === val).fixed = this.list1.find(i => i.label === val).fixed !== 'right' ? 'right' : false
+ }
this.$emit('tableColumnUpdate', this.checkedList)
},
// 鎷栧姩缁撴潫浜嬩欢
draggableEnded({ to, from, item, clone, oldIndex, newIndex }) {
- console.log(to, from, item, clone, oldIndex, newIndex)
-
- // console.log(this.list1, 123456789)
+ // console.log(to, from, item, clone, oldIndex, newIndex)
this.$emit('tableColumnUpdate', this.list1, true)// 浼犵粰鐖风埛 isCopyTrue:澶嶅�肩粰鐖风埛
},
// 澶氶�夋鍊兼敼鍙樹簨浠�
checkedListChange(val) {
- console.log(val, 1)
this.checkedAll = val.length !== 0
this.list1.forEach((i, j) => {
i.show = !!val.includes(i.label)
@@ -148,7 +155,7 @@
.dragArea {
margin-top: 15px;
min-height: 50px;
- padding-bottom: 30px;
+ //padding-bottom: 30px;
}
}
}
diff --git a/src/components/ThemePicker/index.vue b/src/components/ThemePicker/index.vue
index 0326942..28c5f66 100644
--- a/src/components/ThemePicker/index.vue
+++ b/src/components/ThemePicker/index.vue
@@ -35,7 +35,6 @@
if (typeof val !== 'string') return
const themeCluster = this.getThemeCluster(val.replace('#', ''))
const originalCluster = this.getThemeCluster(oldVal.replace('#', ''))
- console.log(themeCluster, originalCluster)
const $message = this.$message({
message: ' 姝ｅ湪鍒囨崲涓婚',
diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue
index 27aa23e..bd8c27d 100644
--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@@ -202,7 +202,7 @@
return path
},
variables() {
- console.log(variables, 2333)
+ // console.log(variables, 2333)
// 鍏堣緭鍑鸿繖涓獀ariables鍊� 鐒跺悗淇敼鍏跺睘鎬у��
variables.menuActiveText = this.$store.state.settings.theme
// background: rgb(48, 65, 86);
diff --git a/src/layout/components/Settings/index.vue b/src/layout/components/Settings/index.vue
index 6f82418..3502a32 100644
--- a/src/layout/components/Settings/index.vue
+++ b/src/layout/components/Settings/index.vue
@@ -52,7 +52,6 @@
style="width: 120px;"
placeholder="璇烽�夋嫨"
size="mini"
- @change="animationTypeChange"
>
<el-option
v-for="item in animationTypeArr"
@@ -153,9 +152,6 @@
key: 'theme',
value: val
})
- },
- animationTypeChange(val) {
- console.log(val, 1)
}
}
}
diff --git a/src/layout/components/Sidebar/index.vue b/src/layout/components/Sidebar/index.vue
index cf71e45..a9f4534 100644
--- a/src/layout/components/Sidebar/index.vue
+++ b/src/layout/components/Sidebar/index.vue
@@ -89,10 +89,10 @@
return this.$store.state.settings.sidebarLogo
},
variables() {
- console.log(variables, 2333)
+ // console.log(variables, 2333)
// 鍏堣緭鍑鸿繖涓獀ariables鍊� 鐒跺悗淇敼鍏跺睘鎬у��
variables.menuActiveText = this.$store.state.settings.theme
- console.log(!this.$store.state.settings.menuIsHorizontal && !this.$store.state.settings.leftBackgroundColorValue, 1)
+ // console.log(!this.$store.state.settings.menuIsHorizontal && !this.$store.state.settings.leftBackgroundColorValue, 1)
if ((!this.$store.state.settings.menuIsHorizontal && !this.$store.state.settings.leftBackgroundColorValue)) {
variables.menuHover = '#eee'
}
--
Gitblit v1.9.3