| | |
| | | <el-collapse v-model="activeNames"> |
| | | <el-collapse-item name="1" class="el-collapse-item__wrap"> |
| | | <template slot="title"> |
| | | <span |
| | | :class=" |
| | | title === '同步库' |
| | | ? 'iconfont icontongbuku_v' |
| | | : 'iconfont iconbendiku_v' |
| | | " |
| | | style="font-size: 32px" |
| | | ></span> |
| | | <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> |
| | | <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> |
| | | <!-- <i |
| | | class="el-icon-circle-plus-outline ml10" |
| | | style="font-size: 20px; color: #3d68e1" |
| | | |
| | | ></i> --> |
| | | <!-- <span |
| | | class="m5" |
| | | style="font-size: 14px; color: #3d68e1" |
| | | @click.stop="add('sync')" |
| | | v-if="isShow('library:set')" |
| | | >新增</span |
| | | > --> |
| | | <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> |
| | | </el-tooltip> |
| | | </template> |
| | | <div class="max-height"> |
| | | <el-row |
| | |
| | | </p> |
| | | </el-col> |
| | | <el-col :span="10" :offset="1"> |
| | | <!-- <el-switch |
| | | :active-value="1" |
| | | :inactive-value="0" |
| | | v-model="item.enable" |
| | | size="small" |
| | | style="margin-top: -7px" |
| | | :disabled="isDisabled(item)" |
| | | @change="setEnable(item)" |
| | | > |
| | | |
| | | </el-switch> --> |
| | | <!-- <div class="status-dot"></div> --> |
| | | <div |
| | | class="status-dot" |
| | | :class="item.enable == 1 ? 'status-dot-active' : ''" |
| | | :style="item.enable == 1 ? { background: '#4E94FF' } : {}" |
| | | ></div> |
| | | <!-- <el-tooltip |
| | | content="编辑" |
| | | placement="top" |
| | | popper-class="atooltip" |
| | | > |
| | | <span |
| | | class="iconfont iconbianji iconStyle1" |
| | | @click.stop="edit(item, 'sync')" |
| | | v-if="isShow('library:set')" |
| | | ></span> |
| | | </el-tooltip> --> |
| | | <!-- <el-tooltip |
| | | content="删除" |
| | | placement="top" |
| | | popper-class="atooltip" |
| | | > |
| | | <span |
| | | class="iconfont iconshanchu iconStyle1" |
| | | style="color: #e74c3c" |
| | | v-if="isShow('library:set')" |
| | | @click.stop="deleteBase(item.id)" |
| | | ></span> |
| | | </el-tooltip> --> |
| | | </el-col> |
| | | <el-col |
| | | :span="24" |
| | |
| | | </el-collapse-item> |
| | | <el-collapse-item name="2" class="el-collapse-item__wrap"> |
| | | <template slot="title"> |
| | | <span class="iconfont iconbendiku_v" style="font-size: 32px"></span> |
| | | <img src="/images/library/本地库2.png" alt="" srcset="" /> |
| | | <span class="m5">{{ titleB }}</span> |
| | | <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> |
| | | |
| | | <!-- <i |
| | | class="el-icon-circle-plus-outline ml10" |
| | | style="font-size: 20px; color: #3d68e1" |
| | | |
| | | ></i> --> |
| | | <!-- <span |
| | | class="m5" |
| | | style="font-size: 14px; color: #3d68e1" |
| | | @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 |
| | |
| | | </p> |
| | | </el-col> |
| | | <el-col :span="10" :offset="1"> |
| | | <!-- <el-switch |
| | | :active-value="1" |
| | | :inactive-value="0" |
| | | v-model="item.enable" |
| | | size="small" |
| | | style="margin-top: -7px" |
| | | :disabled="isDisabled(item)" |
| | | @change="setEnable(item)" |
| | | ></el-switch> --> |
| | | <div |
| | | class="status-dot" |
| | | :class="item.enable == 1 ? 'status-dot-active' : ''" |
| | | :style="item.enable == 1 ? { background: '#4E94FF' } : {}" |
| | | ></div> |
| | | |
| | | <!-- <el-tooltip |
| | | content="编辑" |
| | | placement="top" |
| | | popper-class="atooltip" |
| | | > |
| | | <span |
| | | class="iconfont iconbianji iconStyle1" |
| | | @click.stop="edit(item, 'local')" |
| | | v-if="isShow('library:set')" |
| | | ></span> |
| | | </el-tooltip> --> |
| | | <!-- <el-tooltip |
| | | content="删除" |
| | | placement="top" |
| | | popper-class="atooltip" |
| | | > |
| | | <span |
| | | class="iconfont iconshanchu iconStyle1" |
| | | style="color: #e74c3c" |
| | | v-if="isShow('library:set')" |
| | | @click.stop="deleteBase(item.id)" |
| | | ></span> |
| | | </el-tooltip> --> |
| | | </el-col> |
| | | <el-col |
| | | :span="24" |
| | |
| | | <div class="time-end"> |
| | | {{ item.endTime ? item.endTime : "永久有效" }} |
| | | </div> |
| | | <!-- {{ item.startTime }}~{{ |
| | | item.endTime ? item.endTime : "永久有效" |
| | | }} --> |
| | | </el-col> |
| | | </el-row> |
| | | </div> |
| | |
| | | }; |
| | | }, |
| | | computed: { |
| | | // eslint-disable-next-line vue/return-in-computed-property |
| | | isAdmin() { |
| | | if ( |
| | | sessionStorage.getItem("userInfo") && |
| | |
| | | }, |
| | | methods: { |
| | | isShow(authority) { |
| | | if (this.isAdmin) { |
| | | return true; |
| | | } else if (this.buttonAuthority.indexOf("," + authority + ",") > -1) { |
| | | return true; |
| | | } else { |
| | | return false; |
| | | } |
| | | return ( |
| | | this.isAdmin || this.buttonAuthority.indexOf("," + authority + ",") > -1 |
| | | ); |
| | | }, |
| | | async init() { |
| | | async init(typ) { |
| | | await this.BaseManageData.querySyncTables(); |
| | | this.syncTableList = this.BaseManageData.syncTables; |
| | | this.defaultShow(); |
| | | if (typ) { |
| | | this.$emit("getList"); |
| | | } else { |
| | | this.defaultShow(); |
| | | } |
| | | await this.BaseManageData.queryLocalTables(); |
| | | this.localTableList = this.BaseManageData.localTables; |
| | | this.defaultShow(); |
| | | }, |
| | | handleChange(val) { |
| | | console.log(val); |
| | | }, |
| | | async setEnable(item) { |
| | | let res = await updateDbTableStatus({ |
| | | id: item.id, |
| | | enable: item.enable, |
| | | }); |
| | | if (res.success === true) { |
| | | this.$notify({ |
| | | type: "success", |
| | | message: "底库成功变更生效状态!", |
| | | }); |
| | | if (typ) { |
| | | this.$emit("getList"); |
| | | } else { |
| | | this.$notify({ |
| | | type: "error", |
| | | message: "底库变更生效状态失败!", |
| | | }); |
| | | this.defaultShow(); |
| | | } |
| | | }, |
| | | add(type) { |
| | | this.$emit("changeShow", null, type); |
| | | }, |
| | | isDisabled(item) { |
| | | var flag = true; |
| | | if (this.isShow("library:set")) { |
| | | if (item.endTime == "") { |
| | | flag = false; |
| | | } else { |
| | | flag = !this.$moment(new Date()).isBetween( |
| | | item.startTime, |
| | | item.endTime |
| | | ); |
| | | } |
| | | } |
| | | return flag; |
| | | 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; |
| | | // 调用切换右侧面板的函数并且切换父组件中isSelected的值让另一个组件清除被选中状态 |
| | | // this.$emit('clearSelected') |
| | | this.clickBase = item; |
| | | this.$emit("getList", item, type); |
| | | }, |
| | | edit(item, type) { |
| | | this.$emit("changeShow", item, type); |
| | | }, |
| | | deleteBase(id) { |
| | | debugger; |
| | | let token = |
| | | sessionStorage.getItem("loginedInfo") && |
| | | JSON.parse(sessionStorage.getItem("loginedInfo")).access_token; |
| | | this.$confirm("提示:确定删除底库?", { |
| | | center: true, |
| | | cancelButtonClass: "comfirm-class-cancle", |
| | | confirmButtonClass: "comfirm-class-sure", |
| | | }).then(() => { |
| | | fetch(`/data/api-v/dbtable/deleteDBtablesById?id=${id}`, { |
| | | method: "GET", |
| | | headers: { |
| | | "Content-Type": "application/json", |
| | | Authorization: token, |
| | | }, |
| | | }) |
| | | .then((res) => { |
| | | return res.json(); |
| | | }) |
| | | .then((res) => { |
| | | if (res.success) { |
| | | this.$notify({ |
| | | type: "success", |
| | | message: "底库删除成功!", |
| | | }); |
| | | } |
| | | this.init(); |
| | | }) |
| | | .catch((err) => { |
| | | this.$notify({ |
| | | type: "error", |
| | | message: err, |
| | | }); |
| | | }); |
| | | }); |
| | | }, |
| | | // 默认显示第一个库的数据 |
| | | defaultShow() { |
| | |
| | | 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: "234px", |
| | | default: "224px", |
| | | type: String, |
| | | }, |
| | | title: { |
| | |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: right; |
| | | width: auto; |
| | | float: right; |
| | | margin-right: 10px; |
| | | } |
| | |
| | | font-size: 14px; |
| | | } |
| | | .out-div { |
| | | // overflow: hidden auto; |
| | | max-height: 100%; |
| | | height: 100%; |
| | | .el-collapse-item__header { |
| | | position: relative; |
| | | } |
| | | .el-collapse-item__wrap { |
| | | will-change: height; |
| | | background-color: #fff; |
| | |
| | | display: none; |
| | | } |
| | | .el-row { |
| | | border-radius: 9px; background: rgba(239, 241, 245, 0.35); |
| | | |
| | | border-radius: 9px; |
| | | background: rgba(239, 241, 245, 0.35); |
| | | margin-bottom: 4px; |
| | | min-height: 72px; |
| | | box-sizing: border-box; |
| | | padding: 10px 5px; |
| | | } |
| | | .time-start { |
| | | display: inline-block; |
| | |
| | | display: inline-block; |
| | | } |
| | | .activeRow { |
| | | background: #4e94ff; |
| | | background: var(--colorCard); |
| | | color: #fff; |
| | | .time-start { |
| | | color: #e9e9e9; |
| | |
| | | .time-end { |
| | | color: #e9e9e9; |
| | | } |
| | | .status-dot { |
| | | .status-dot-active { |
| | | background: #fff !important; |
| | | } |
| | | } |