From 182aed85616f7ac60d0ffb02e4feac5661b80e0c Mon Sep 17 00:00:00 2001 From: zhangzengfei <zhangzengfei@smartai.com> Date: 星期三, 08 六月 2022 10:40:21 +0800 Subject: [PATCH] 修复初始化页面 --- src/pages/library/components/baseList.vue | 254 ++++++++++++++++++++------------------------------ 1 files changed, 102 insertions(+), 152 deletions(-) diff --git a/src/pages/library/components/baseList.vue b/src/pages/library/components/baseList.vue index 106d8ce..ef99051 100644 --- a/src/pages/library/components/baseList.vue +++ b/src/pages/library/components/baseList.vue @@ -1,33 +1,25 @@ <template> - <div - :style="listWidth ? `width:${listWidth};` : ''" - class="out-div el-menu-vertical-demo" - > + <div :style="listWidth ? `width:${listWidth};` : ''" class="out-div el-menu-vertical-demo"> <el-collapse v-model="activeNames"> <el-collapse-item name="1" class="el-collapse-item__wrap"> <template slot="title"> - <img v-if="title === '鍚屾搴�'" src="/images/library/鍚屾搴�2.png" alt="" srcset=""> - <img v-else src="/images/library/鏈湴搴�2.png" alt="" srcset=""> + <img v-if="title === '鍚屾搴�'" src="/images/library/鍚屾搴�2.png" alt="" srcset="" /> + <img v-else src="/images/library/鏈湴搴�2.png" alt="" srcset="" /> <span class="m5">{{ title }}</span> - <el-tooltip - content="娣诲姞鍚屾搴�" - placement="top" - > + <el-tooltip content="娣诲姞鍚屾搴�" placement="top"> <!-- popper-class="atooltip" --> - <span - class="iconfont icontianjiaku-09" - style=" - font-size: 22px; - color: #666666; - position: absolute; - right: 10px; - " - @click.stop="add('sync')" - v-if="isShow('library:set')" - ></span> + <span + class="iconfont icontianjiaku-09" + style=" + font-size: 22px; + color: #666666; + position: absolute; + right: 10px; + " + @click.stop="add('sync')" + v-if="isShow('library:set')" + ></span> </el-tooltip> - - </template> <div class="max-height"> <el-row @@ -37,33 +29,17 @@ @click.native="clickCategory(index, 'sync', item)" :class="{ activeRow: categoryIndex == 'sync' + index }" > - <el-col - :span="12" - :class="item.bwType === '1' ? 'c-red' : 'c-green'" - > - <p - style="text-align: left; margin-left: 5px" - class="name-ellipsis" - :title="item.tableName" - > - <span - class="iconfont iconrenyuanku-09" - v-if="item.tableType == 'person'" - ></span> - <span - class="iconfont iconcheliangku-09" - v-if="item.tableType == 'car'" - ></span> - <span style="font-size: 14px; font-weight: bold"> - {{ item.tableName }}</span - > + <el-col :span="12" :class="item.bwType === '1' ? 'c-red' : 'c-green'"> + <p style="text-align: left; margin-left: 5px" class="name-ellipsis" :title="item.tableName"> + <span class="iconfont iconrenyuanku-09" v-if="item.tableType == 'person'"></span> + <span class="iconfont iconcheliangku-09" v-if="item.tableType == 'car'"></span> + <span style="font-size: 14px; font-weight: bold"> {{ item.tableName }}</span> </p> </el-col> <el-col :span="10" :offset="1"> - <div class="status-dot" - :class="item.enable == 1 ?'status-dot-active':''" + :class="item.enable == 1 ? 'status-dot-active' : ''" :style="item.enable == 1 ? { background: '#4E94FF' } : {}" ></div> </el-col> @@ -87,26 +63,21 @@ </el-collapse-item> <el-collapse-item name="2" class="el-collapse-item__wrap"> <template slot="title"> - <img src="/images/library/鏈湴搴�2.png" alt="" srcset=""> + <img src="/images/library/鏈湴搴�2.png" alt="" srcset="" /> <span class="m5">{{ titleB }}</span> - <el-tooltip - content="娣诲姞鍚屾搴�" - placement="top" - - > - <span - class="iconfont icontianjiaku-09" - style=" - font-size: 22px; - color: #666666; - position: absolute; - right: 10px; - " - @click.stop="add('local')" - v-if="isShow('library:set')" - ></span> + <el-tooltip content="娣诲姞鍚屾搴�" placement="top"> + <span + class="iconfont icontianjiaku-09" + style=" + font-size: 22px; + color: #666666; + position: absolute; + right: 10px; + " + @click.stop="add('local')" + v-if="isShow('library:set')" + ></span> </el-tooltip> - </template> <div class="max-height"> <el-row @@ -116,31 +87,17 @@ @click.native="clickCategory(index, 'local', item)" :class="{ activeRow: categoryIndex == 'local' + index }" > - <el-col - :span="12" - :class="item.bwType === '1' ? 'c-red' : 'c-green'" - > - <p - style="text-align: left; margin-left: 5px" - class="name-ellipsis" - :title="item.tableName" - > - <span - class="iconfont iconrenyuanku-09" - v-if="item.tableType == 'person'" - ></span> - <span - class="iconfont iconcheliangku-09" - v-if="item.tableType == 'car'" - ></span> + <el-col :span="12" :class="item.bwType === '1' ? 'c-red' : 'c-green'"> + <p style="text-align: left; margin-left: 5px" class="name-ellipsis" :title="item.tableName"> + <span class="iconfont iconrenyuanku-09" v-if="item.tableType == 'person'"></span> + <span class="iconfont iconcheliangku-09" v-if="item.tableType == 'car'"></span> <span> {{ item.tableName }}</span> </p> </el-col> <el-col :span="10" :offset="1"> - <div class="status-dot" - :class="item.enable == 1 ?'status-dot-active':''" + :class="item.enable == 1 ? 'status-dot-active' : ''" :style="item.enable == 1 ? { background: '#4E94FF' } : {}" ></div> </el-col> @@ -166,7 +123,7 @@ </div> </template> <script> -import { updateDbTableStatus } from "@/api/baseLibrary"; +import { updateDbTableStatus } from "@/api/baseLibrary" export default { name: "baseList", data() { @@ -176,122 +133,113 @@ categoryIndex: "", syncTableList: [], localTableList: [], - clickBase: {}, // 褰撳墠鐐瑰嚮鐨勫簳搴撳璞� - }; + clickBase: {} // 褰撳墠鐐瑰嚮鐨勫簳搴撳璞� + } }, computed: { isAdmin() { - if ( - sessionStorage.getItem("userInfo") && - sessionStorage.getItem("userInfo") !== "" - ) { - let loginName = JSON.parse(sessionStorage.getItem("userInfo")).username; - return loginName === "superadmin" || loginName === "basic"; + if (sessionStorage.getItem("userInfo") && sessionStorage.getItem("userInfo") !== "") { + let loginName = JSON.parse(sessionStorage.getItem("userInfo")).username + return loginName === "superadmin" || loginName === "basic" } - return false; - }, + return false + } }, mounted() { - this.init(); + this.init() }, methods: { isShow(authority) { - return ( - this.isAdmin || this.buttonAuthority.indexOf("," + authority + ",") > -1 - ); + return this.isAdmin || this.buttonAuthority.indexOf("," + authority + ",") > -1 }, - async init() { - await this.BaseManageData.querySyncTables(); - this.syncTableList = this.BaseManageData.syncTables; - this.defaultShow(); - await this.BaseManageData.queryLocalTables(); - this.localTableList = this.BaseManageData.localTables; - this.defaultShow(); + async init(typ) { + await this.BaseManageData.querySyncTables() + this.syncTableList = this.BaseManageData.syncTables + if (typ) { + this.clickLast(typ) + } else { + this.defaultShow() + } + await this.BaseManageData.queryLocalTables() + this.localTableList = this.BaseManageData.localTables + if (typ) { + this.clickLast(typ) + } else { + this.defaultShow() + } }, add(type) { - this.$emit("changeShow", null, type); + this.$emit("changeShow", null, type) + }, + clickLast(type) { + // this.$nextTick(() => { + + // }); + this.clickCategory(this.syncTableList.length - 1, type, this.syncTableList[this.syncTableList.length - 1]) }, clickCategory(index, type, item) { - this.categoryIndex = type + index; + this.categoryIndex = type + index // 璋冪敤鍒囨崲鍙充晶闈㈡澘鐨勫嚱鏁板苟涓斿垏鎹㈢埗缁勪欢涓璱sSelected鐨勫�艰鍙︿竴涓粍浠舵竻闄よ閫変腑鐘舵�� - this.clickBase = item; - this.$emit("getList", item, type); + this.clickBase = item + this.$emit("getList", item, type) + console.log("clickCategory", item, type) }, // 榛樿鏄剧ず绗竴涓簱鐨勬暟鎹� defaultShow() { if (this.syncTableList && this.syncTableList.length) { - this.clickCategory(0, "sync", this.syncTableList[0]); + this.clickCategory(0, "sync", this.syncTableList[0]) } else { if (this.localTableList && this.localTableList.length) { - this.clickCategory(0, "local", this.syncTableList[0]); + this.clickCategory(0, "local", this.syncTableList[0]) } } }, // 娣诲姞鏃堕棿姣旇緝鍑芥暟 dateParse(dateString) { - var SEPARATOR_BAR = "-"; - var SEPARATOR_SLASH = "/"; - var SEPARATOR_DOT = "."; - var dateArray; + var SEPARATOR_BAR = "-" + var SEPARATOR_SLASH = "/" + var SEPARATOR_DOT = "." + var dateArray if (dateString.indexOf(SEPARATOR_BAR) > -1) { - dateArray = dateString.split(SEPARATOR_BAR); + dateArray = dateString.split(SEPARATOR_BAR) } else if (dateString.indexOf(SEPARATOR_SLASH) > -1) { - dateArray = dateString.split(SEPARATOR_SLASH); + dateArray = dateString.split(SEPARATOR_SLASH) } else { - dateArray = dateString.split(SEPARATOR_DOT); + dateArray = dateString.split(SEPARATOR_DOT) } - return new Date(dateArray[0], dateArray[1] - 1, dateArray[2]); + return new Date(dateArray[0], dateArray[1] - 1, dateArray[2]) }, isEmpty(str) { if (!str || str === undefined || str === null) { - return true; + return true } else { - return false; + return false } - }, - // dateCompare(dateString, compareDateString) { - // // dateString:褰撳墠鏃堕棿 - // // compareDateString:闇�瑕佹瘮杈冪殑鏃堕棿 - // if (this.isEmpty(dateString)) { - // return; - // } - // if (this.isEmpty(compareDateString)) { - // return 1; - // } - // var dateTime = this.dateParse(dateString).getTime(); - // var compareDateTime = this.dateParse(compareDateString).getTime(); - // if (compareDateTime > dateTime) { - // return 1; - // } else if (compareDateTime === dateTime) { - // return 0; - // } else { - // return -1; - // } - // }, + } }, props: { listWidth: { default: "224px", - type: String, + type: String }, title: { default: "鍚屾搴�", - type: String, + type: String }, titleB: { default: "鏈湴搴�", - type: String, + type: String }, isSelected: { default: false, - type: Boolean, + type: Boolean }, type: { default: "", - type: String, - }, - }, -}; + type: String + } + } +} </script> <style lang="scss"> .iconStyle1 { @@ -333,9 +281,10 @@ font-size: 14px; } .out-div { - max-height: 100%; height: 100%; - .el-collapse-item__header{ - position:relative; + max-height: 100%; + height: 100%; + .el-collapse-item__header { + position: relative; } .el-collapse-item__wrap { will-change: height; @@ -351,7 +300,8 @@ .el-row { border-radius: 9px; background: rgba(239, 241, 245, 0.35); - margin-bottom: 4px; min-height: 72px; + margin-bottom: 4px; + min-height: 72px; box-sizing: border-box; padding: 10px 5px; } -- Gitblit v1.8.0