From 5d34e14627e5e2c480bfe91ae94be10cc193084a Mon Sep 17 00:00:00 2001 From: 田源 <lastanimals@163.com> Date: 星期四, 25 一月 2024 14:35:27 +0800 Subject: [PATCH] 业务数据类型按钮动态布局 --- Source/UBCS-WEB/src/views/modeling/Business.vue | 119 ++++++++++++++++++++++++++++++++++++++--------------------- 1 files changed, 76 insertions(+), 43 deletions(-) diff --git a/Source/UBCS-WEB/src/views/modeling/Business.vue b/Source/UBCS-WEB/src/views/modeling/Business.vue index 95a2129..f568592 100644 --- a/Source/UBCS-WEB/src/views/modeling/Business.vue +++ b/Source/UBCS-WEB/src/views/modeling/Business.vue @@ -1,30 +1,40 @@ <template> <el-container> - <el-header class="businessHeader" style="height: 40px;padding:0 8px"> - <div> - <el-button v-if="permissionList.addBtn" icon="el-icon-plus" size="small" type="primary" @click="businessAdd"> - 鏂板 - </el-button> - <el-button v-if="permissionList.editBtn" icon="el-icon-edit" size="small" type="primary" @click="businessEdit"> - 淇敼 - </el-button> - <el-button v-if="permissionList.table" icon="el-icon-thumb" size="small" type="primary" - @click="selectFromTable"> 浠庡凡鏈変腑鑾峰彇 - </el-button> - </div> - </el-header> + <!-- <el-header class="businessHeader" style="height: 40px;padding:0 8px">--> + + <!-- </el-header>--> <el-container> - <el-aside width="240px"> + <el-aside style="width: 300px"> <basic-container class="businessTreeContainer"> - <p style="margin-top: 10px;font-weight: 570;font-size: 19px">{{ treeOption.title }}</p> - <avue-tree id="basic" :data="treeData" :option="treeOption" class="businessTree" @node-click="nodeClick"> - <span slot-scope="{ node, data }" class="el-tree-node__label"> - <span> + <div class="app"> + <div style="display: flex;margin-bottom: 10px;justify-content: space-around;"> + <el-button v-if="permissionList.addBtn" plain size="mini" type="primary" + @click="businessAdd"> + 鏂板 + </el-button> + <el-button v-if="permissionList.editBtn" plain size="mini" type="primary" + @click="businessEdit"> + 淇敼 + </el-button> + <el-button v-if="permissionList.table" plain size="mini" + type="primary" @click="selectFromTable"> 浠庡凡鏈変腑鑾峰彇 + </el-button> + </div> + <avue-tree :data="treeData" :option="treeOption" class="businessTree" style="height: 70.3vh" + @node-click="nodeClick"> + <template slot-scope="{ node, data }" class="el-tree-node__label"> + <el-tooltip :content="$createElement('div', { domProps: { innerHTML: node.label } })" class="item" effect="dark" + open-delay="250" + placement="top-start"> + <span> <i :class="(node || {}).level === 2 ? 'el-icon-star-off' : 'el-icon-folder-opened'"></i> {{ (node || {}).label }} </span> - </span> - </avue-tree> + </el-tooltip> + </template> + </avue-tree> + </div> + </basic-container> </el-aside> <el-container> @@ -84,17 +94,17 @@ </template> {{ obj.lifeCycleName ? obj.lifeCycleName + '(' + obj.lifeCycleId + ')' : '' }} </el-descriptions-item> -<!-- <el-descriptions-item :contentStyle="descriptionOption.contentStyle"--> -<!-- :labelStyle="descriptionOption.labelStyle">--> -<!-- <template slot="label">--> -<!-- <i :class="icons.view"></i>--> -<!-- 瑙嗗浘--> -<!-- </template>--> -<!-- <el-tag v-if="obj.viewText" size="small">--> -<!-- {{ obj.viewText }}--> -<!-- </el-tag>--> -<!-- <span v-else></span>--> -<!-- </el-descriptions-item>--> + <!-- <el-descriptions-item :contentStyle="descriptionOption.contentStyle"--> + <!-- :labelStyle="descriptionOption.labelStyle">--> + <!-- <template slot="label">--> + <!-- <i :class="icons.view"></i>--> + <!-- 瑙嗗浘--> + <!-- </template>--> + <!-- <el-tag v-if="obj.viewText" size="small">--> + <!-- {{ obj.viewText }}--> + <!-- </el-tag>--> + <!-- <span v-else></span>--> + <!-- </el-descriptions-item>--> <!-- <el-descriptions-item> <template slot="label"> <i class="el-icon-arrow-down"></i> @@ -122,7 +132,8 @@ </avue-crud> </basic-container> </el-main> - <el-dialog :visible="ref.visible" append-to-body title="浠庢暟鎹簱涓坊鍔�" width="700px" @close="dialoghandelfalse" top="9vh"> + <el-dialog :visible="ref.visible" append-to-body title="浠庢暟鎹簱涓坊鍔�" top="9vh" width="700px" + @close="dialoghandelfalse"> 閫夋嫨棰嗗煙锛� <el-select v-model="domain" placeholder="璇烽�夋嫨" size="small" @change="refOnLoad"> <el-option v-for="item in domainOptions" :key="item.value" :label="item.label" :value="item.value"> @@ -141,7 +152,7 @@ </el-dialog> </el-container> </el-container> - <business-add ref="btmAdd" :btmType="addOption.btmType" :domainOption="domainOptions" :icons="icons" + <business-add ref="btmAdd" :btmType="addOption.btmType" :domainOption="domainOptions" :icons="icons" :type="type" @refreshTable="initTreeOnLoad"> </business-add> </el-container> @@ -160,6 +171,7 @@ name: "Business", data() { return { + type: "", //鐢熷懡鍛ㄦ湡瀵硅瘽妗嗙姸鎬� packageLifeBox: false, //鐗堟湰瑙勫垯鐘舵�� @@ -168,7 +180,7 @@ selectionList: [], treeData: [], treeOption: { - defaultExpandAll: true, + defaultExpandAll: false, title: '涓氬姟绫诲瀷鏍�', addBtn: false, menu: false, @@ -183,8 +195,8 @@ btmType: {}, }, loadOption: { + height: 'auto', border: true, - height: 478, editBtn: false, addBtn: false, menu: false, @@ -359,6 +371,7 @@ businessAdd() { this.$refs.btmAdd.showSubmitDialog = true; this.$refs.btmAdd.btmType = {}; + this.type = 'add'; this.ifRefreshBtmAddRefresh(); }, businessEdit() { @@ -369,6 +382,7 @@ const json = JSON.stringify(this.obj); this.$refs.btmAdd.btmType = JSON.parse(json); this.$refs.btmAdd.showSubmitDialog = true; + this.type = 'edit' this.ifRefreshBtmAddRefresh(); }, ifRefreshBtmAddRefresh() { @@ -378,11 +392,7 @@ } </script> -<style lang="scss"> -#basic { - height: 770px; - border-radius: 10px; -} +<style lang="scss" scoped> .businessCrud > .el-card:nth-of-type(2) > .el-card__body > .avue-crud__menu { display: none !important; @@ -392,6 +402,29 @@ display: none !important; } -.businessTreeContainer > .el-card > .el-card__body { - height: 775px; -}</style> + +.app { + overflow-y: auto; + height: 84.3vh; +} + +// +//.app::-webkit-scrollbar { +// height: 15px; // 绾靛悜婊氬姩鏉� 蹇呭啓 +// background: white; +// border: white; +// width: 10px; +// +//} +// +//// 婊氬姩鏉$殑婊戝潡 +//.app::-webkit-scrollbar-thumb { +// width: 10px; +// height: 10px; +// background-color: #ececec; +// border-radius: 20px; +// border: #ececec; +//} + + +</style> -- Gitblit v1.9.3