From 8a4cdb9531981ce9faba1b1337c207a1ba16656d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=AE=89=E8=99=B9=E7=9D=BF?= <297504645@qq.com> Date: Mon, 17 Jul 2023 14:36:09 +0800 Subject: [PATCH] =?UTF-8?q?=E6=98=8E=E7=BB=86=E6=B7=BB=E5=8A=A0=E5=AD=97?= =?UTF-8?q?=E6=AE=B5=E8=AE=BE=E7=BD=AE=E5=8A=9F=E8=83=BD=E5=B0=81=E8=A3=85?= =?UTF-8?q?=E5=BC=80=E5=8F=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/commonTabel-drawer/index.vue | 65 +++++++++++++++---- .../commonTabel-drawer/style/index.scss | 5 ++ Code/Fe/src/components/rowDrop/index.vue | 47 ++++++++------ Code/Fe/src/mixins/TableHeaderMixins.js | 15 ++++- Code/Fe/src/mixins/TableMixins.js | 23 +------ Code/Fe/src/mixins/mixins.js | 25 +++---- Code/Fe/src/utils/defaultButtons.js | 5 +- .../src/views/interfaceBoard/TestSchool.vue | 1 + 8 files changed, 118 insertions(+), 68 deletions(-) diff --git a/Code/Fe/src/components/commonTabel-drawer/index.vue b/Code/Fe/src/components/commonTabel-drawer/index.vue index cd64cba..f0bd575 100644 --- a/Code/Fe/src/components/commonTabel-drawer/index.vue +++ b/Code/Fe/src/components/commonTabel-drawer/index.vue @@ -66,29 +66,42 @@ :propsData="propsData" > + +
+ 字段设置 + +
+ - - { @@ -343,9 +367,22 @@ export default { }, }, mounted () { + // 点击外部,字段设置弹窗隐藏 + document.addEventListener('click',(e)=>{ + if(!this.rowDropVisible)return + let _class = "rowDropNotHideItem" + let _hasParent = getParentNode(e.target,_class) + let _current_class = e.target._prevClass || e.target.className + let _hasCurrent = _current_class ? String(_current_class).includes(_class) : false + if(!_hasParent && !_hasCurrent){ + this.closeRowDrop() + } + }) }, data () { return { + // table 重新渲染所需key + isUpdate: false, // 明细-字段设置是否显示 rowDropVisible: false, otherData:[], // 切换tabs页赋值 @@ -369,13 +406,17 @@ export default { } }, methods: { - rowDrop(data) { - this.$emit('rowDrop',data) - // this.isUpdate = !this.isUpdate + rowDrop(data,type) { + this.$emit('rowDrop',data,type) + this.isUpdate = !this.isUpdate }, - // 字段设置 + // 明细-字段设置 columnsSettingHandle(){ this.rowDropVisible = !this.rowDropVisible + }, + // 明细-筛选 + detailFiltersHandle(){ + }, // 关闭字段设置 closeRowDrop() { diff --git a/Code/Fe/src/components/commonTabel-drawer/style/index.scss b/Code/Fe/src/components/commonTabel-drawer/style/index.scss index 877fd49..2856abf 100644 --- a/Code/Fe/src/components/commonTabel-drawer/style/index.scss +++ b/Code/Fe/src/components/commonTabel-drawer/style/index.scss @@ -120,3 +120,8 @@ ::v-deep .el-tabs__nav-wrap::after{ content: unset !important; } + +.currenTabel-drawer-mx-header{ + text-align: right; + padding: 0 10px 10px 0; +} \ No newline at end of file diff --git a/Code/Fe/src/components/rowDrop/index.vue b/Code/Fe/src/components/rowDrop/index.vue index 1e7b8a3..449d5a9 100644 --- a/Code/Fe/src/components/rowDrop/index.vue +++ b/Code/Fe/src/components/rowDrop/index.vue @@ -15,7 +15,7 @@ 全选 - +
{ - return false - } - }, - tableColumns: { - type: Array, - default: () => { - return []; - }, - }, + innerMaxHeight:{ + type:String, + default:'calc(90vh - 280px)' + }, + visible: { + type: Boolean, + default: () => { + return false + } + }, + tableColumns: { + type: Array, + default: () => { + return []; + }, + }, + // list_api detail_api detailPage_api list detail detailPage + source:{ + type:String, + default:'list_api' + } }, mounted() { this.historyTableColumns = JSON.parse(JSON.stringify(this.tableColumns)) @@ -92,8 +101,8 @@ export default { cancelButtonClass:'rowDropNotHideItem' }).then(() => { // 先set是为了字段设置按钮可以监听到缓存变化,之后在移除缓存 this.$store.getters.name.userName - localStorage.setItem('tableColumns_' + this.userName + '_' + this.$route.name, JSON.stringify([])) - localStorage.removeItem('tableColumns_' + this.userName + '_' + this.$route.name) + localStorage.setItem('file_Columns_' + this.source + '_' + this.userName + '_' + this.$route.name, JSON.stringify([])) + localStorage.removeItem('file_Columns_' + this.source + '_' +this.userName + '_' + this.$route.name) // let _resetCol = this.$isTableColumns[this.$route.name] let _resetCol = this.historyTableColumns _resetCol.forEach(item => { @@ -101,7 +110,7 @@ export default { }) this.dataList = _resetCol this.initSelectSta() - this.$emit('radio',_resetCol) + this.$emit('radio',_resetCol,this.source) this.close() }).catch(() => { @@ -121,9 +130,9 @@ export default { }, save () { this.$forceUpdate() - this.$emit('radio',this.dataList) + this.$emit('radio',this.dataList,this.source) // 本地缓存 当前用户名 + 路由名称 - localStorage.setItem('tableColumns_' + this.userName + '_' + this.$route.name, JSON.stringify(this.dataList)) + localStorage.setItem('file_Columns_' + this.source + '_' + this.userName + '_' + this.$route.name, JSON.stringify(this.dataList)) }, dragstart(value) { this.oldData = value @@ -194,7 +203,7 @@ $paddingSize:20px; } .transition-wrapper { display: block; - max-height: calc(90vh - 280px); + // max-height: calc(90vh - 280px); overflow: auto; padding: 0 0 $paddingSize $paddingSize; diff --git a/Code/Fe/src/mixins/TableHeaderMixins.js b/Code/Fe/src/mixins/TableHeaderMixins.js index 6a1e19e..62808fb 100644 --- a/Code/Fe/src/mixins/TableHeaderMixins.js +++ b/Code/Fe/src/mixins/TableHeaderMixins.js @@ -297,9 +297,18 @@ export const TableHeaderMixins = { }); } }, - // 表头字段设置 - rowDrop(data) { - this.tableColumns = data + /** + * 表头字段设置 + * @param {*} data 数据 + * @param {*} type 设置来源 + * list_api: 表头来自api的列表 detail_api: 表头来自api列表的明细 + * list: 表头固定的列表 detail: 表头固定列表的明细 + */ + rowDrop(data,type) { + if(!type || type == 'list_api'){ this.apiColumns_Table = data } + if(type && type == 'detail_api'){ this.apiColumns_DetailsTable = data } + if(type && type == 'list'){ this.tableColumns = data } + if(type && type == 'detail'){ this.detailsTableColumns = data } } } } diff --git a/Code/Fe/src/mixins/TableMixins.js b/Code/Fe/src/mixins/TableMixins.js index c3d2d08..5f9b542 100644 --- a/Code/Fe/src/mixins/TableMixins.js +++ b/Code/Fe/src/mixins/TableMixins.js @@ -38,10 +38,6 @@ export const tableMixins = { tableDataDetails:[], //默认tag firstTabs:'xq', - // api的表头原始数据 - apiColumns_Table_copy:null, - apiColumns_DesTions_copy:null, - apiColumns_DetailsTable_copy:null, // api的表头数据 apiColumns_Table:null, apiColumns_DesTions:null, @@ -54,29 +50,14 @@ export const tableMixins = { operationButtonsTable:[{label:'查看详情',name:'info'}] } }, - mounted() { - // 用于api表头的字段设置监听同步 - window.addEventListener('setItemEvent', (item) => { - if (item.key.indexOf('tableColumns') > -1) { - if(JSON.parse(item.newValue).length <= 0){ - this.apiColumns_Table = this.apiColumns_Table_copy[this.$route.name] - }else{ - this.apiColumns_Table = JSON.parse(item.newValue) - } - } - }) - }, methods: { // 获取通过api的表头数据,不可以在初始化处理,因为接口返回问题 initApiColumns(tableColumns_api,tabsDesTions_api,detailsTableColumns_api){ - // 复制一份原始数据(目的:字段设置恢复) - this.apiColumns_Table_copy = JSON.parse(JSON.stringify(tableColumns_api)) - this.apiColumns_DesTions_copy = JSON.parse(JSON.stringify(tabsDesTions_api)) - this.apiColumns_DetailsTable_copy = JSON.parse(JSON.stringify(detailsTableColumns_api)) // 赋值表头数据 this.apiColumns_Table = this.initTableColumns(tableColumns_api[this.$route.name]) this.apiColumns_DesTions = tabsDesTions_api[this.$route.name] - this.apiColumns_DetailsTable = detailsTableColumns_api[this.$route.name] + this.apiColumns_DetailsTable = this.initTableColumns(detailsTableColumns_api[this.$route.name],'detail_api') + }, //渲染数据 paging(callback) { diff --git a/Code/Fe/src/mixins/mixins.js b/Code/Fe/src/mixins/mixins.js index 441c825..d18b46c 100644 --- a/Code/Fe/src/mixins/mixins.js +++ b/Code/Fe/src/mixins/mixins.js @@ -54,11 +54,12 @@ export const mixins = { }, methods: { // 结合默认及缓存中的列表tableColumns数据做初始化 - initTableColumns(){ + initTableColumns(columnsData,type){ let _list_defalut = columnsData ? columnsData : this.$isTableColumns[this.$route.name] + let _type = type ? type : 'list_api' if(!_list_defalut)return - let _local = localStorage.getItem('tableColumns_' + JSON.parse(localStorage.getItem('currentUserInfo')).userName + '_' + this.$route.name) - let _list_local = JSON.parse(localStorage.getItem('tableColumns_' + JSON.parse(localStorage.getItem('currentUserInfo')).userName + '_' + this.$route.name)) + let _local = localStorage.getItem('file_Columns_' + _type + '_' + JSON.parse(localStorage.getItem('currentUserInfo')).userName + '_' + this.$route.name) + let _list_local = JSON.parse(localStorage.getItem('file_Columns_' + _type + '_' + JSON.parse(localStorage.getItem('currentUserInfo')).userName + '_' + this.$route.name)) let _new_list = [] //格式化后的数据 // 如果没有缓存则直接为默认值 if(!_local){ @@ -71,14 +72,16 @@ export const mixins = { else{ // 先处理缓存数据,设置索引 let _locals = {} - _list_local.forEach((localItem,index) => { - localItem.itemIndex = index - if(localItem.showProp && typeof localItem.showProp == 'string'){ - _locals[localItem.showProp] = localItem - }else{ - _locals[localItem.prop] = localItem - } - }) + if(_list_local){ + _list_local.forEach((localItem,index) => { + localItem.itemIndex = index + if(localItem.showProp && typeof localItem.showProp == 'string'){ + _locals[localItem.showProp] = localItem + }else{ + _locals[localItem.prop] = localItem + } + }) + } // 将缓存与默认设置合并,索引同步 let _number = 0 _list_defalut.forEach((defalutItem) => { diff --git a/Code/Fe/src/utils/defaultButtons.js b/Code/Fe/src/utils/defaultButtons.js index d952763..2036d06 100644 --- a/Code/Fe/src/utils/defaultButtons.js +++ b/Code/Fe/src/utils/defaultButtons.js @@ -40,9 +40,10 @@ export function defaultExportBtn(option) { } // 字段设置 -export function defaultFieldSettingBtn(option) { +export function defaultFieldSettingBtn(option,source) { + let _source = source ? source : 'list_api' // todo:监听已经配置过的字段按钮更改状态特殊显示 - let _local = localStorage.getItem('tableColumns_' + JSON.parse(localStorage.getItem('currentUserInfo')).userName + '_' + this.$route.name) + let _local = localStorage.getItem('file_Columns_' + _source + '_' + JSON.parse(localStorage.getItem('currentUserInfo')).userName + '_' + this.$route.name) let _type = '' let _num = 0 if(_local){ diff --git a/Code/Fe/src/views/interfaceBoard/TestSchool.vue b/Code/Fe/src/views/interfaceBoard/TestSchool.vue index b31e52f..6615efd 100644 --- a/Code/Fe/src/views/interfaceBoard/TestSchool.vue +++ b/Code/Fe/src/views/interfaceBoard/TestSchool.vue @@ -28,6 +28,7 @@ >