From 9f9ae3e0253f2d657b6b337d62d269394d04ee09 Mon Sep 17 00:00:00 2001 From: surprise <15810472099@163.com> Date: 星期五, 17 十一月 2023 14:29:08 +0800 Subject: [PATCH] 版本更新 --- src/views/layer/layerManage.vue | 620 ++++++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 487 insertions(+), 133 deletions(-) diff --git a/src/views/layer/layerManage.vue b/src/views/layer/layerManage.vue index b6a0806..dfbe13c 100644 --- a/src/views/layer/layerManage.vue +++ b/src/views/layer/layerManage.vue @@ -1,39 +1,20 @@ <template> - <div - v-drag - class="layerBox" - > + <div v-drag class="layerBox"> <div class="layerTitle"> <div class="tileLeft"> - <div - @click="setCloseLayer" - class="titleImg" - > + <div @click="setCloseLayer" class="titleImg"> <ArrowLeft /> </div> <div class="titleLable">鍥惧眰绠$悊</div> </div> - <div - class="titleImg set" - @click="layerSetBox" - > + <div class="titleImg set" @click="layerSetBox"> <Setting /> </div> </div> <div class="layerContent"> - <el-tree - node-key="id" - :props="props" - :highlight-current="false" - :current-node-key="selectedNodeId" - :data="treeData" - :expand-on-click-node="false" - show-checkbox - @check="handleCheckChange" - ref="estreeRef" - v-if="treeData.length" - :default-checked-keys="DefaultId" - > + <el-tree node-key="id" :props="props" :highlight-current="false" :current-node-key="selectedNodeId" :data="treeData" + :default-expanded-keys="defaultExpanded" :expand-on-click-node="false" show-checkbox @check="handleCheckChange" + ref="estreeRef" v-if="treeData.length" :default-checked-keys="DefaultId"> <template #default="{ node, data }"> <span class="custom-tree-node"> <span class="label">{{ node.label }}</span> @@ -42,11 +23,8 @@ <a style="margin-left: 8px" @click="remove(node, data)"> Delete </a> - </span> --> - <span - class="button" - v-if="data.type == 2 || data.type == 3" - > + </span>--> + <span class="button" v-if="!data.isTemporaryLayer"> <el-dropdown trigger="click"> <span class="el-dropdown-link"> <el-icon class="el-icon--right"> @@ -55,8 +33,21 @@ </span> <template #dropdown> <el-dropdown-menu> - <el-dropdown-item @click.native="clickdropdown(1, data)">璇︾粏</el-dropdown-item> - <el-dropdown-item @click.native="clickdropdown(2, data)">灞炴��</el-dropdown-item> + <el-dropdown-item v-if="data.type != 6 && data.isLayer == 1" + @click.native="clickdropdown(1, data)">璇︾粏</el-dropdown-item> + <el-dropdown-item v-if="data.type == 6 && data.isLayer == 1">鍒犻櫎</el-dropdown-item> + <el-dropdown-item v-if="data.type == 3 && data.isLayer == 1" + @click.native="clickdropdown(2, data)">灞炴��</el-dropdown-item> + <el-dropdown-item v-if="data.isLayer == 0" + @click.native="clickdropdown(3, data)">閫忔槑搴�</el-dropdown-item> + <el-dropdown-item v-if="data.shpType == 'temporaryLayer'" + @click.native="clickdTemporary(1, data)">缂栬緫</el-dropdown-item> + <el-dropdown-item v-if="data.shpType == 'temporaryLayer'" + @click.native="clickdTemporary(2, data)">鍒犻櫎</el-dropdown-item> + <el-dropdown-item v-if="data.shpType == 'temporaryLayer'" + @click.native="clickdTemporary(3, data)">瀹氫綅</el-dropdown-item> + <el-dropdown-item v-if="data.shpType == 'temporaryLayer'" + @click.native="clickdTemporary(4, data)">涓嬭浇鎴恠hp</el-dropdown-item> </el-dropdown-menu> </template> </el-dropdown> @@ -66,23 +57,10 @@ </el-tree> </div> </div> - <layer-set - v-if="layerSetIsshow" - @SETstate="SETstate" - :layerTree="treeData" - @addlayer="addlayer" - @delLayer="delLayer" - ></layer-set> - <attribute-list - v-show="layerAttributeIsshow" - :layerData="layerObjData" - @spatialClose="setSpatialClose" - ></attribute-list> - <layer-detail - :layerData="layerObjData" - v-if="layerDetailIsshow" - @detailClose="detailClose" - ></layer-detail> + <layer-set v-if="layerSetIsshow" @SETstate="SETstate" :layerTree="treeData" @addlayer="addlayer" @delLayer="delLayer" + @onSubmit="editLayer"></layer-set> + <attribute-list v-if="layerAttributeIsshow" :layerData="layerObjData" @spatialClose="setSpatialClose"></attribute-list> + <layer-detail :layerData="layerObjData" v-if="layerDetailIsshow" @detailClose="detailClose"></layer-detail> </template> <script lang="ts" setup> @@ -94,66 +72,34 @@ defineProps, defineEmits, nextTick, + watch, } from "vue"; import layerSet from "./layerSet"; import attributeList from "./attributeList"; import layerDetail from "./layerDetail"; import { useStore } from "vuex"; // 寮曞叆useStore 鏂规硶 -import { perms_selectLayers } from "@/api/api"; +import { + perms_selectLayers, + mark_selectByPageAndCount, + mark_insert, + mark_deletes, + mark_update, +} from "@/api/api"; import server from "@/assets/js/Map/server"; import { ElMessage } from "element-plus"; +import temporaryTool from "@/assets/js/Map/temporaryTools"; +import json from "@/assets/js/colorValue"; +import menuTool from "@/assets/js/Map/menuTool"; const store = useStore(); // 璇ユ柟娉曠敤浜庤繑鍥瀞tore 瀹炰緥 const stretchValue = ref(""); - +const emits = defineEmits(["setCloseLayer"]); let estreeRef = ref(); - +const setLayer = ref(); const transparence = ref(0); var treeData = ref([]); var layerListData = ref([]); -let menuOption = reactive([ - { - id: 1, - name: "娴嬭瘯", - isShow: false, - checkedAll: false, - type: 1, - parentId: null, - }, - { - id: 2, - layerState: false, - name: "鍥惧眰鍚嶇О", - layerUrl: "", - type: 2, - parentId: 1, - }, - { - id: 3, - layerState: false, - name: "鍥惧眰鑿滃崟", - layerUrl: "", - type: 1, - parentId: 1, - }, - { - id: 5, - layerState: false, - name: "鍥惧眰鍚嶇О11", - layerUrl: "", - type: 2, - parentId: 3, - }, - { - id: 4, - name: "娴嬭瘯1", - isShow: false, - checkedAll: true, - layerState: false, - type: 1, - parentId: null, - }, -]); - +let menuOption = reactive([]); +const defaultExpanded = ref([]); const layerSetIsshow = ref(false); const layerAttributeIsshow = ref(false); const layerDetailIsshow = ref(false); @@ -164,9 +110,9 @@ const layerObjData = ref(null); // 褰撳墠閫変腑鐨勮妭鐐� id const selectedNodeId = ref(null as any); //鍋氱被鍨嬫柇瑷�澶勭悊 -const emits = defineEmits(["setCloseLayer"]); + //榛樿閫変腑id -const DefaultId = ref([15]); +const DefaultId = ref([]); //鍥惧眰璁剧疆寮规 const layerSetBox = () => { layerSetIsshow.value = !layerSetIsshow.value; @@ -176,22 +122,134 @@ layerSetIsshow.value = res; }; const setCloseLayer = () => { + store.state.setLayerManager = false; emits("setCloseLayer", false); +}; +const temporary = ref(new Date().getTime()); +const clickdTemporary = async (res, data) => { + if (res == 1) { + let son = estreeRef.value.getCheckedKeys(); + if (son.indexOf(data.id) < 0) { + return ElMessage(data.cnName + "鍥惧眰娌℃湁鍕鹃��,鏃犳硶杩涜缂栬緫"); + } + if (store.state.editTemporaryId) { + var id = store.state.editTemporaryId; + var edit_id = sgworld.Creator.SimpleGraphic.SimpleGraphicObj.indexOf(id); + if (edit_id > -1) { + sgworld.Creator.SimpleGraphic.SimpleGraphicObj.splice(edit_id, 1); + store.state.editTemporaryId = null; + } + } + store.state.editTemporaryId = data.id; + sgworld.Creator.SimpleGraphic.SimpleGraphicObj.push(data.id); + sgworld.Creator.SimpleGraphic.edit(true, { + editProp: false, + tipText: { + ActiveText: "鐐瑰嚮婵�娲荤紪杈�", + }, + enableDelete: false, + }); + } else if (res == 2) { + var layerId = []; + layerId.push(data.sid); + const data1 = await mark_deletes({ ids: layerId.toString() }); + if (data1.code != 200) return; + temporaryTool.removeTemporaryLayer(data); + + // estreeRef.value.setCheckedKeys(checkedKeys, true); + // for (var i in keys) { + // checkedKeys.push(keys[i]); + // } + var keys = estreeRef.value.getCheckedKeys(); + var val = treeData.value[0].children; + for (var i = 0; i < val.length; i++) { + if (val[i].id == data.id) { + val.splice(i, 1); + } + } + + var std = []; + for (var i in keys) { + var layer_res = estreeRef.value.getNode(keys[i]).data; + if (layer_res.shpType && layer_res.shpType == 'temporaryLayer') { + std.push(keys[i]); + } else if (layer_res.isLayer == 1) { + std.push(keys[i]); + } + } + estreeRef.value.setCheckedKeys([], true); + console.log(data.id); + nextTick(() => { + console.log(std); + estreeRef.value.setCheckedKeys(std, true); + }); + } else if (res == 3) { + let son = estreeRef.value.getCheckedKeys(); + if (son.indexOf(data.id) < 0) { + return ElMessage(data.cnName + "鍥惧眰娌℃湁鍕鹃��,鏃犳硶杩涜瀹氫綅"); + } + temporaryTool.locationTemporaryLayer(data); + } else if (res == 4) { +debugger + } }; //閫夋嫨鍥惧眰 const handleCheckChange = (data, checked) => { layerAttributeIsshow.value = false; layerDetailIsshow.value = false; - - let isCheck = checked.checkedKeys.indexOf(data.id) > -1; - // this.setVisiable(data, isCheck); + // let isCheck = checked.checkedKeys.indexOf(data.id) > -1; let son = estreeRef.value.getCheckedNodes(); - store.commit("SET_CHECKLAYER", son); - setVisiable(data, isCheck); + temporaryTool.removeTemporaryLayerAll(); + server.delLayerAll(); + var alphaGroup = []; + var idGroup = []; + for (var i in server.layerList) { + const layerData = server.layerList[i]; + if (layerData.layerData && layerData.id != server.wmsLayerId) { + alphaGroup.push(layerData.layerData.alpha); + idGroup.push(layerData.layerData.id); + } + } + server.delLayerAll(); - // server.addLayer(layerArr, isCheck); + var setGeoWms = []; + var geoUrl = null; + var layerTreeDate = estreeRef.value.getCheckedNodes().reverse(); + for (var i in layerTreeDate) { + var layerArr = layerTreeDate[i]; + if (layerArr.shpType && layerArr.shpType == "temporaryLayer") { + temporaryTool.addTemporaryTool(layerArr); + } else { + if (layerArr.isLayer == 1) { + if (layerArr.category == 2 && layerArr.type == 3) { + if (layerArr.tab != "moon:geo_mappable_unit") { + var id = layerArr.id; + if (idGroup.indexOf(id) > -1) { + var alpha = alphaGroup[idGroup.indexOf(id)]; + if (alpha == 1) { + setGeoWms.push(layerArr.tab); + geoUrl = layerArr.url; + } else { + server.setAddGeoWmsLayer(layerArr, alpha); + } + } else { + setGeoWms.push(layerArr.tab); + geoUrl = layerArr.url; + } + } + } else { + server.addTreeData(layerArr); + } + } + } + } + if (setGeoWms.length > 0) { + server.addGeoServerMmsLayers(setGeoWms, geoUrl); + } + + menuTool.setImageLayerChange(); }; const setVisiable = (treeNode, checked) => { if (checked !== undefined) { @@ -208,7 +266,7 @@ } if (!treeNode.isAdd) { - server.addTreeData(treeNode); + // server.addTreeData(treeNode); return; } }; @@ -217,32 +275,94 @@ DefaultId.value.forEach((v) => { if (e.id == v) { setVisiable(e, true); - } else { - if (e.children) { - defaultLayer(e.children); - } + // return; } }); }); }; const clickdropdown = (res, e) => { - if (!e.checked) { - return ElMessage.error("璇峰厛鍕鹃�夊浘灞�"); - } layerAttributeIsshow.value = false; layerDetailIsshow.value = false; - layerObjData.value = e; - if (res == 2) { - layerAttributeIsshow.value = true; - } else { - layerDetailIsshow.value = true; - } + nextTick(() => { + layerObjData.value = e; + store.state.spatialTitle = e.cnName; + if (res == 2) { + layerAttributeIsshow.value = true; + store.state.tab = e; + } else if (res == 3) { + let son = estreeRef.value.getCheckedKeys(); + var layerId = getCheckedLayerPID(e, son); + if (layerId.length <= 0) { + return ElMessage.error("璇峰厛鍕鹃�夊浘灞�"); + } + layerDetailIsshow.value = true; + store.state.layerGroups = { + id: e.id, + layerIds: layerId, + }; + } else { + var val = estreeRef.value!.getCheckedKeys(false); + if (val.indexOf(e.id) > -1) { + layerDetailIsshow.value = true; + } else { + return ElMessage.error("璇峰厛鍕鹃�夊浘灞�"); + } + } + }); }; +const getCheckedLayerPID = (res, result) => { + var temp = []; + var ids = result; + + let forFn = (data) => { + if (data.children) { + data.children.forEach((item) => { + if (item.children) { + forFn(item); + } else { + if (ids.indexOf(item.id) > -1) { + temp.push(item); + } + } + }); + } else { + if (ids.indexOf(data.id) > -1) { + temp.push(data); + } + } + }; + + forFn(res); + return temp; +}; + +const getCheckedLayerChildren = (res) => { + var temp2 = []; + let forFn = (data) => { + if (data.children) { + data.children.forEach((item) => { + if (item.children) { + forFn(item); + } else { + temp2.push(item); + } + }); + } else { + temp2.push(data); + } + }; + forFn(res); + return temp2; +}; + const setSpatialClose = (res) => { layerAttributeIsshow.value = res; }; const detailClose = (res) => { - layerDetailIsshow.value = res; + if (res.type == 0) { + estreeRef.value.getNode(store.state.layerGroups.id).data.alpha = res.val; + } + layerDetailIsshow.value = res.flag; }; //缂栬緫鍥惧眰鏍� const addlayer = (res) => { @@ -252,7 +372,16 @@ node = estreeRef.value.getNode(e); } }); + + var checKey = estreeRef.value.getCheckedKeys(); + let checkid = []; + for (var i in checKey) { + if (estreeRef.value.getNode(checKey[i]).data.isLayer == 1) { + checkid.push(checKey[i]) + } + } // 灏嗗彉鍔ㄤ箣鍓嶇殑node澶囦唤 + estreeRef.value.setCheckedKeys([], true); let copyNode = { ...node }; copyNode.previousSibling = { ...node.previousSibling }; copyNode.nextSibling = { ...node.nextSibling }; @@ -278,30 +407,124 @@ estreeRef.value.insertAfter(copyNode.data, copyNode.nextSibling.data); } } + estreeRef.value.setCheckedKeys(checkid, true); }; //鍒犻櫎鍥惧眰鏍� const delLayer = (res) => { // menuOption = menuOption.filter((item) => { // return item.id != res; // }); - // console.log(res); - // console.log(menuOption); // treeData = handleTree(menuOption, "id", "pid", "children"); }; +const editLayer = () => { + var layer = store.state.chekNowLayers; + var std = []; + for (var i in layer) { + if (layer[i].isLayer == 1) { + std.push(layer[i].id) + } + } + estreeRef.value.setCheckedKeys([], true); + nextTick(() => { + estreeRef.value.setCheckedKeys(std, true); + }) +} +const setRestLayerData = () => { + let son = estreeRef.value.getCheckedNodes().reverse(); + + var setGeoWms = []; + var geoUrl = null; + for (var i in son) { + var layerArr = son[i]; + console.log(layerArr.isLayer); + layerArr.checked = true; + if (layerArr.category == 2 && layerArr.type == 3) { + if (layerArr.tab != "moon:geo_mappable_unit") { + setGeoWms.push(layerArr.tab); + geoUrl = layerArr.url; + // server.addTreeData(layerArr); + } + } else { + server.addTreeData(layerArr); + } + } + if (setGeoWms.length > 0) { + server.addGeoServerMmsLayers(setGeoWms, geoUrl); + } + store.commit("SET_CHECKLAYER", son); +}; const getLayer = async () => { + store.state.restLayer = false; + // server.delLayerAll(); const dt = await perms_selectLayers(); if (dt.code == 200) { - treeData.value = setTreeData(dt.result).sort(function (a, b) { - return a.sort - b.sort; + var va_data = dt.result.filter((res) => { + if (res.isLayer == 0) { + res.alpha = 1; + } + return res; }); + treeData.value = setTreeData(va_data).sort(function (a, b) { + return a.orderNum - b.orderNum; + }); + const comperLayer = await mark_selectByPageAndCount({ + pageIndex: 1, + pageSize: 100000, + name: null, + }); + var children = []; + if (comperLayer.code == 200 && comperLayer.result) { + for (var i in comperLayer.result) { + var layer = comperLayer.result[i] + if (layer.wkt && layer.wkt.indexOf("shpType") > -1 && layer.wkt.indexOf("shpType") > -1) { + + var slayer = JSON.parse(comperLayer.result[i].wkt); + + slayer.sid = comperLayer.result[i].id; + children.push(slayer); + + } + } + } + + treeData.value.unshift({ + cnName: "鑷畾涔夊浘灞�", + level: 1, + pid: 0, + isLayer: 0, + type: 6, + id: temporary.value, + isTemporaryLayer: true, + children: children, + }); + + var std = []; + var terrainId = null; + var adLayer = []; + dt.result.filter((res) => { + if (res.isLayer == 1 && res.isShow == 1) { + if (res.type == 1 && res.data == 2) { + if (!terrainId) { + terrainId = res.id; + std.push(res.id); + adLayer.push(res); + } + } else { + std.push(res.id); + adLayer.push(res); + } + } + }); + DefaultId.value = std; //娣诲姞榛樿閫変腑鍥惧眰 layerListData.value = dt.result; - defaultLayer(treeData.value); + defaultLayer(dt.result); + nextTick(() => { let son = estreeRef.value.getCheckedNodes(); - + setRestLayerData(); store.commit("SET_CHECKLAYER", son); }); } @@ -315,7 +538,7 @@ let branchArr = cloneData.filter((child) => father.id == child.pid); if (branchArr.length > 0) { branchArr.sort(function (a, b) { - return a.sort - b.sort; + return a.orderNum - b.orderNum; }); } @@ -325,8 +548,118 @@ return father.pid == 0; // 杩斿洖涓�绾ц彍鍗� }); } -getLayer(); -onMounted(() => {}); +const addTemporaryLayer = async (res) => { + var obj = { + name: res.cnName, + wkt: JSON.stringify(res), + }; + var checkedKeys = estreeRef.value.getCheckedKeys(); + const data = await mark_insert(obj); + if (data.code != 200 || !data.result) return; + store.state.temporaryLayer = null; + res.sid = data.result; + treeData.value[0].children.push(res); + + + nextTick(() => { + var std = [res.id]; + for (var i in checkedKeys) { + var layer_res = estreeRef.value.getNode(checkedKeys[i]).data; + if (layer_res.shpType && layer_res.shpType == 'temporaryLayer') { + std.push(checkedKeys[i]); + } else if (layer_res.isLayer == 1) { + std.push(checkedKeys[i]); + } + } + estreeRef.value.setCheckedKeys([], true); + estreeRef.value.setCheckedKeys(std, true); + temporaryTool.addTemporaryTool(res); + }); +}; +const editTemporaryLayerName = (res) => { + if (!store.state.editTemporaryId) return; + var id = store.state.editTemporaryId; + var val = treeData.value[0].children; + + for (var i = 0; i < val.length; i++) { + if (val[i].id == id) { + val[i].cnName = res; + setEditLayerChange(val[i]); + } + } + defaultExpanded.value = [treeData.value[0].id]; +}; +const editTemporaryBackById = (res) => { + var obj = temporaryTool.getEntityObj(res); + var val = treeData.value[0].children; + var checkedKeys = estreeRef.value.getCheckedKeys(); + if (checkedKeys.indexOf(temporary.value) > -1) { + checkedKeys.splice(checkedKeys.indexOf(temporary.value), 1); + } + for (var i = 0; i < val.length; i++) { + if (val[i].id == res) { + obj.sid = val[i].sid; + val[i] = obj; + setEditLayerChange(obj); + } + } + nextTick(() => { + estreeRef.value.setCheckedKeys(checkedKeys, true); + }); +}; +const setEditLayerChange = async (res) => { + var obj = { + id: res.sid, + name: res.cnName, + wkt: JSON.stringify(res), + }; + const data = await mark_update(obj); + if (data.code != 200) return; +}; +watch( + () => store.state.restLayer, + (nVal, oVal) => { + if (nVal) { + + setRestLayerData(); + } + }, + { deep: true } +); +watch( + () => store.state.temporaryLayer, + (nVal, oVal) => { + if (nVal) { + + addTemporaryLayer(nVal); + } + }, + { deep: true } +); +watch( + () => store.state.editTemporarName, + (nVal, oVal) => { + if (nVal) { + + editTemporaryLayerName(nVal); + } + }, + { deep: true } +); +watch( + () => store.state.editTemporaryback, + (nVal, oVal) => { + if (nVal) { + + editTemporaryBackById(nVal); + } + }, + { deep: true } +); + +onMounted(() => { + window.setLayer = getLayer; +}); </script> <style lang="less" scoped> @@ -335,6 +668,8 @@ height: 680px; background: rgba(7, 8, 14, 0.8); box-shadow: inset 0px 10px 40px 10px rgba(38, 47, 71, 1); + z-index: 40; + .layerTitle { width: calc(100% - 27px); height: 42px; @@ -346,6 +681,7 @@ padding-left: 7px; padding-right: 20px; color: white; + .tileLeft { height: 100%; display: flex; @@ -358,6 +694,7 @@ color: #ffffff; } } + .titleImg { width: 20px; height: 100%; @@ -365,31 +702,38 @@ align-items: center; color: rgba(104, 156, 255, 1); } + .set { cursor: pointer; } } + .layerContent { height: 625px; padding: 0 8px; overflow: auto; overflow-y: auto; } + .layerContent::-webkit-scrollbar { width: 8px; } + .layerContent::-webkit-scrollbar-thumb { border-radius: 10px; background: rgba(0, 0, 0, 0.2); } + .layerContent::-webkit-scrollbar-track { border-radius: 0; background: rgba(0, 0, 0, 0); } + .el-tree { width: 100%; overflow-y: auto; } + .layerContent .el-tree-node__content { overflow: hidden; } @@ -416,6 +760,7 @@ flex-shrink: 0; } } + .dropdown_box { position: relative; } @@ -423,9 +768,11 @@ /deep/.el-select-dropdown__item { font-size: 12px !important; } + .el-tree { background: transparent; } + /deep/ .el-tree-node { background: #0d131d; color: #ffffff; @@ -434,29 +781,33 @@ margin-top: 3px; padding: 8px; } -/deep/ .el-tree-node:focus > .el-tree-node__content { + +/deep/ .el-tree-node:focus>.el-tree-node__content { background: transparent; } + /deep/ .el-tree-node__content:hover { background: #0d131d; } + /deep/ .el-tree-node__children { background: #1e2a3d; + .el-tree-node { background: #1e2a3d; margin-top: 0; padding: 4px; } } -/deep/ - .el-tree--highlight-current - .el-tree-node.is-current - > .el-tree-node__content { + +/deep/ .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content { background: rgba(104, 156, 255, 0.5) !important; } + .highlight { background: rgba(104, 156, 255, 0.5) !important; } + // .custom-tree-node { // flex: 1; // display: flex; @@ -471,10 +822,12 @@ box-shadow: inset 0px 10px 40px 10px rgba(38, 47, 71, 1); color: #fff; border: 0; + /deep/ .el-dropdown-menu__item { color: #fff; } } + /deep/ .el-dropdown-menu__item:not(.is-disabled):focus { background-color: rgba(104, 156, 255, 0.5); @@ -485,6 +838,7 @@ .el-popper.is-light { border: 1px solid rgba(7, 8, 14, 0.8) !important; } + .el-scrollbar { border: 0 !important; } -- Gitblit v1.9.3