From dcf9c9e0410fe1186239e3f8d6f7bdc789c08010 Mon Sep 17 00:00:00 2001 From: lzhe <lzhe@example.com> Date: 星期三, 05 六月 2024 18:00:39 +0800 Subject: [PATCH] 1 --- src/views/home/widgets/components/ver.vue | 183 +++++++++++++++++++++++++++++++++++++++------ 1 files changed, 159 insertions(+), 24 deletions(-) diff --git a/src/views/home/widgets/components/ver.vue b/src/views/home/widgets/components/ver.vue index d3b0d71..2116feb 100644 --- a/src/views/home/widgets/components/ver.vue +++ b/src/views/home/widgets/components/ver.vue @@ -1,41 +1,176 @@ <template> - <el-card shadow="hover" header="鐗堟湰淇℃伅"> - <div style="height: 210px;text-align: center;"> - <img src="img/ver.svg" style="height:140px"/> - <h2 style="margin-top: 15px;">SCUI {{$CONFIG.CORE_VER}}</h2> - <p style="margin-top: 5px;">鏈�鏂扮増鏈� {{ver}}</p> - </div> - <div style="margin-top: 20px;"> - <el-button type="primary" plain round @click="golog">鏇存柊鏃ュ織</el-button> - <el-button type="primary" plain round @click="gogit">gitee</el-button> - </div> - </el-card> + <div> + <el-card shadow="hover" header="蹇嵎鍏ュ彛"> + <ul> + <li v-for="(item,index) in titleList"> + <div @click="goPage(item)">{{item.name}}</div> + </li> + <li><div class="addMenu" @click="showDrawer">+ 娣诲姞鑿滃崟</div></li> + </ul> + </el-card> + <el-drawer title="閫夋嫨鑿滃崟" v-model="drawer" :direction="direction" :before-close="handleClose" size="680"> + <div v-for="(value,key,index) in menuList"> + <div class="parent-children-title">{{key}}</div> + <div class="parent-children"> + <span v-for="(item,index1) in value" @click="addChecked(item,key,index1)" > + <div class="parent-name">{{item.name}}</div> + <div class="triangle-topright" v-if="item.checked"></div> + <el-icon class="icon-topright" v-if="item.checked"><Select /></el-icon> + </span> + </div> + </div> + <div class="drawer-foot"> + <el-button @click="closeDrawer">鍙栨秷</el-button> + <el-button type="primary" @click="drawerConfirm">纭畾</el-button> + </div> + </el-drawer> + </div> </template> <script> + import * as ElementPlusIconsVue from '@element-plus/icons-vue' + let icons = [] + for (const [key, component] of Object.entries(ElementPlusIconsVue)) { + icons.push(key) + } export default { - title: "鐗堟湰淇℃伅", - icon: "el-icon-monitor", - description: "褰撳墠椤圭洰鐗堟湰淇℃伅", + title: "蹇嵎鍏ュ彛", + icon: "el-icon-data-line", + description: "娣诲姞甯哥敤鑿滃崟鍏ュ彛", data() { return { - ver: 'loading...' + direction: "rtl", + titleList: [], + drawer: false, + menuList: {}, + CARD_INFO: [], + firstMenuList: [], //瀛樺偍鍒濆鍖栫殑鏁版嵁 + setCard: [], + workid: "" } }, + components: {...ElementPlusIconsVue}, mounted() { - this.getVer() + this.getCard(); }, methods: { - async getVer(){ - const ver = await this.$API.demo.ver.get() - this.ver = ver.data + drawerConfirm() { + var list = []; + for(var key in this.menuList) { + this.menuList[key].forEach(item=> { + if(item.checked) { + list.push(item.id); + } + }) + } + this.setCard.forEach(item=> { + if(item.cardKey == "Entrance") { + item.textContent = list.join(","); + } + }) + var obj = { + workbenchId: this.workid, + workbenchCardAddVOList: this.setCard + } + this.$HTTP.post(`/api/blade-system/workbench-card/create-workbench-card`,obj).then(res=> { + if(res.code == 200) { + this.drawer = false; + this.menuList = {}; + this.getCard(); //閲嶆柊鑾峰彇蹇嵎鑿滃崟 + } + }) + //console.log(this.setCard,222) }, - golog(){ - window.open("https://gitee.com/lolicode/scui/releases") + getCard() { //鑾峰彇蹇嵎鑿滃崟 + var data = this.$TOOL.data.get("MENU"); + this.workid = data[0].children[0].id; //璁板綍绗竴涓猚hildren鐨刬d + this.$HTTP.get(`/api/blade-system/workbench-card/list?workbenchId=${this.workid}`).then(res=> { + if(res.code == 200) { + this.setCard = res.data; + res.data.forEach(item=> { + if(item.cardKey == "Entrance") { + this.$TOOL.data.set("CARD_INFO", item.textContent); + } + }) + this.init(); //鏍规嵁鑾峰彇鐨勫揩鎹疯彍鍗曞拰鑿滃崟纭畾鏈�鍚庝竴绾у拰鍕鹃�夌姸鎬� + } + }) }, - gogit(){ - window.open("https://gitee.com/lolicode/scui") - } + init() { + this.titleList = []; + var data = this.$TOOL.data.get("MENU"); + this.workid = data[0].children[0].id; //璁板綍绗竴涓猚hildren鐨刬d + if(this.$TOOL.data.get("CARD_INFO") != null) { + this.CARD_INFO = this.$TOOL.data.get("CARD_INFO").split(","); + } + var obj = {}; + //鍙栨渶鍚庝竴绾ц彍鍗� + data.forEach((item,index)=> { + if(item.name != "宸ヤ綔鍙�") { + obj[item.name] = this.getLastLevelNames(item.children); + } + }) + this.menuList = obj; + this.firstMenuList = JSON.parse(JSON.stringify(obj)); //瀛樺偍鍒濆鍖栫殑鏁版嵁 + // 鑾峰彇title + for(var key in this.menuList) { + this.menuList[key].forEach(item=> { + if(item.checked) { + this.titleList.push(item) + } + }) + } + }, + addChecked(item,key,index1) { + this.menuList[key][index1].checked = !this.menuList[key][index1].checked; + }, + goPage(item) { + this.$router.push(item.path); + }, + getLastLevelNames(tree) { + var that = this; + const lastLevelNames = []; + //,checked: this.$TOOL.data.get("CARD_INFO").split(",").include(item.id) + tree.forEach(item => { + if (item.children) { + // 閫掑綊璋冪敤锛屽鐞嗗瓙鑿滃崟椤� + const childLastLevelNames = this.getLastLevelNames(item.children); + // 灏嗗瓙鑿滃崟椤圭殑鏈�搴曞眰鍚嶇О娣诲姞鍒扮粨鏋滀腑 + lastLevelNames.push(...childLastLevelNames); + } else { + // 褰撳墠椤规病鏈夊瓙鑿滃崟椤癸紝鏄渶鍚庝竴灞傦紝娣诲姞鍏跺悕绉� + lastLevelNames.push({name:item.name,id: item.id,checked: that.CARD_INFO.includes(item.id),path: item.path}); + } + }); + + return lastLevelNames; + }, + showDrawer() { + this.drawer = true; + }, + closeDrawer() { + this.menuList = JSON.parse(JSON.stringify(this.firstMenuList)); + this.drawer = false; + }, + handleClose(done) { + this.menuList = JSON.parse(JSON.stringify(this.firstMenuList)); + done(); + } } } </script> +<style scoped> + ul {list-style: none;margin-bottom: 10px;overflow: hidden;} + ul li {float: left;margin-bottom: 8px;} + ul li div,.addMenu{border: 1px solid #409eff;margin-top: 10px;height: 43px;margin-left: 10px;display: flex;align-items: center;justify-content: center;color: #409eff;border-radius: 2px;border-radius: 2px;white-space: nowrap;cursor: pointer;min-width: 112px;} + ul li div:hover {background-color: #ebf4f4;} + .addMenu {border: 1px dashed #409eff;} + ..addMenu:hover {border: 1px dashed #104E8B;} + .parent-children-title {margin-left: 10px;margin-top: 24px;font-weight: 700;font-size: 14px;text-align: left;color: #333;} + .parent-children {display: flex;flex-direction: row;flex-wrap: wrap;justify-content: flex-start;align-items: flex-start;padding-left: 10px;box-sizing: border-box;} + .parent-children span {margin-left: 10px;margin-top: 10px;width: 22%;border: 0.5px solid #20B2AA;border-radius: 2px;height: 43px;display: flex;align-items: center;justify-content: center;cursor: pointer;position: relative;min-width: 112px;} + .parent-children span:hover {border: 1px solid #104E8B;} + .triangle-topright {width: 0;height: 0;border-top: 28px solid #409eff;border-left: 28px solid transparent;position: absolute;right: 0;top: 0;} + .icon-topright {position: absolute;right: 2px;top: 2px;z-index: 2;color: #fff;} + .drawer-foot {text-align: right;margin-top: 8px;margin-bottom: 8px;margin-right: 20px;} +</style> \ No newline at end of file -- Gitblit v1.9.3