From c4e17e16e32f396432303270004883da6ac27161 Mon Sep 17 00:00:00 2001 From: wangting <wangting@vci-tech.com> Date: 星期四, 26 十二月 2024 17:56:27 +0800 Subject: [PATCH] 修改样式,action管理左侧树去掉按钮 --- Source/plt-web/plt-web-ui/src/views/systemModel/mangeModel/index.vue | 246 ++++++++++++++++++++++++++++-------------------- 1 files changed, 143 insertions(+), 103 deletions(-) diff --git a/Source/plt-web/plt-web-ui/src/views/systemModel/mangeModel/index.vue b/Source/plt-web/plt-web-ui/src/views/systemModel/mangeModel/index.vue index ed00511..78eda45 100644 --- a/Source/plt-web/plt-web-ui/src/views/systemModel/mangeModel/index.vue +++ b/Source/plt-web/plt-web-ui/src/views/systemModel/mangeModel/index.vue @@ -2,11 +2,12 @@ <el-container v-loading="createdLoading"> <el-aside> <basic-container> - <div style="max-height: calc(100vh - 170px);overflow: auto"> - <avue-tree :key="refresh" ref="tree" :data="treeData" :option="treeOption" @node-click="nodeClick"> + <div style="max-height: calc(100vh - 150px);overflow: auto"> + <avue-tree :key="refresh" ref="tree" :data="treeData" :option="treeOption" node-key="id" + @node-click="nodeClick"> <span slot-scope="{ node, data }" class="el-tree-node__label"> - <span style="font-size: 15px"> - <i class="el-icon-s-promotion"></i> + <span style="display: flex"> + <icon-show :name="data.icon"></icon-show> {{ (node || {}).label }} </span> </span> @@ -17,83 +18,15 @@ <el-main> <basic-container> - <el-form ref="form" :model="form" label-width="85px" style="height: 79vh"> - <span v-if="form.childType !== 0"> - <el-form-item label="妯″潡鍚嶏細"> - <el-input v-model="form.name" placeholder="璇疯緭鍏ユā鍧楀悕"></el-input> - </el-form-item> - <el-form-item label="妯″潡鍒悕锛�"> - <el-input v-model="form.alias" placeholder="妯″潡鍒悕鐢ㄦ潵璁板綍鏃ュ織浣跨敤"></el-input> - </el-form-item> - <el-form-item label="C/S锛�"> - <el-input v-model="form.pathC" :rows="3" placeholder="璇疯緭鍏/S璺緞" type="textarea"></el-input> - </el-form-item> - <el-form-item label="B/S锛�"> - <el-input v-model="form.path" :rows="3" placeholder="璇疯緭鍏/S璺緞" type="textarea"></el-input> - </el-form-item> - <el-form-item label=".NET锛�"> - <el-input v-model="form.resourceDotNet" :rows="3" placeholder="璇疯緭鍏�.NET" type="textarea"></el-input> - </el-form-item> - <el-form-item label="Mobile锛�"> - <el-input v-model="form.resourceMobile" :rows="3" placeholder="璇疯緭鍏obile" type="textarea"></el-input> - </el-form-item> - <el-form-item label="搴忓彿锛�"> - <el-input v-model="form.sort" placeholder="鏁板瓧锛屾弿杩拌妯″潡鍦ㄥ叾鐖舵ā鍧椾笅鐨勬樉绀洪『搴�"></el-input> - </el-form-item> - <el-form-item label="绠�鍥撅細"> - <el-input v-model="form.source"></el-input> - </el-form-item> - <el-form-item label="鎻忚堪锛�"> - <el-input v-model="form.remark" :rows="3" placeholder="璇疯緭鍏ユ弿杩�" type="textarea"></el-input> - </el-form-item> - <el-form-item label="鏄惁鏈夋晥锛�"> - <el-switch - v-model="form.isValid" - active-color="#13ce66" - inactive-color="#ff4949"> - </el-switch> - <el-link :underline="false" style="margin-left: 20px" type="danger">涓嶇敓鏁堬紙涓嶉�夋嫨锛夋椂锛岃妯″潡鍦ㄥ姛鑳芥ā鍧楁巿鏉冮噷涓嶆樉绀�</el-link> - </el-form-item> - </span> - <span v-if="form.childType === 0"> - <el-form-item label="鍚嶇О锛�"> - <el-input v-model="form.name" :disabled="form.childType === 0" placeholder="璇疯緭鍏ュ悕绉�"></el-input> - </el-form-item> - <el-form-item label="鏍囪瘑锛�"> - <el-input v-model="form.code" :disabled="form.childType === 0" placeholder="璇疯緭鍏ユ爣璇�"></el-input> - </el-form-item> - <el-form-item label="鍒悕锛�"> - <el-input v-model="form.alias" placeholder="璇疯緭鍏ュ埆鍚�"></el-input> - </el-form-item> - <el-form-item label="缂栧彿锛�"> - <el-input v-model="form.sort" :disabled="form.childType === 0" placeholder="璇疯緭鍏ョ紪鍙�"></el-input> - </el-form-item> - <el-form-item label="鎻忚堪锛�"> - <el-input v-model="form.remark" :disabled="form.childType === 0" placeholder="璇疯緭鍏ユ弿杩�"></el-input> - </el-form-item> - <el-form-item label="鏄惁鏈夋晥锛�"> - <el-switch - v-model="form.isValid" - active-color="#13ce66" - inactive-color="#ff4949"> - </el-switch> - - </el-form-item> - </span> - </el-form> - <div v-if="form.childType && form.childType !== 0" class="btnBox"> - <el-button v-if="!addStatus" :disabled="mangeShowBtn ? false : !childTypeBtn" icon="el-icon-plus" plain + <div v-if="(form.childType || form.childType === 0) && !addStatus && !editStatus && form.category !== 1" + class="btnBox"> + <el-button :disabled="(mangeShowBtn || form.childType === 0) ? false : !childTypeBtn" icon="el-icon-plus" + plain size="small" type="primary" @click="addClickHandler">澧炲姞 </el-button> - <el-button v-if="addStatus" icon="el-icon-check" plain size="small" - type="success" @click="addSaveClickHandler">淇濆瓨 - </el-button> - <el-button v-if="!editStatus" :disabled="mangeShowBtn" icon="el-icon-edit" plain size="small" type="primary" + <el-button :disabled="mangeShowBtn" icon="el-icon-edit" plain size="small" type="primary" @click="editClickHandler">淇敼 - </el-button> - <el-button v-if="editStatus" icon="el-icon-check" plain size="small" - type="success" @click="editSaveClickHandler">淇濆瓨 </el-button> <el-button :disabled="mangeShowBtn" icon="el-icon-close" plain size="small" type="danger" @click="delClickHandler">鍒犻櫎 @@ -102,11 +35,11 @@ size="small" type="primary" @click="addMethodsClickHandler">澧炲姞鎿嶄綔绫诲瀷 </el-button> - <el-button v-if="this.form.childType ? mangeShowBtn :true" icon="el-icon-circle-close" plain size="small" + <el-button v-if=" mangeShowBtn" icon="el-icon-circle-close" plain size="small" type="danger" @click="addClickHandler">鍒犻櫎闈炵郴缁熸ā鍧� </el-button> - <el-button v-if="this.form.childType ? mangeShowBtn :true" icon="el-icon-circle-close" plain size="small" + <el-button v-if="mangeShowBtn " icon="el-icon-circle-close" plain size="small" type="danger" @click="addClickHandler">鍒犻櫎涓氬姟妯″潡 </el-button> @@ -119,12 +52,101 @@ <el-button icon="el-icon-upload2" plain size="small" type="primary" @click="sqlClickExportClick">瀵煎嚭sql </el-button> </div> - <div v-if="form.childType === 0" class="btnBox"> + <div v-else-if="(form.childType || form.childType === 0) && (addStatus || editStatus)" class="btnBox"> + <el-button v-if="addStatus" icon="el-icon-check" plain size="small" + type="success" @click="addSaveClickHandler">淇濆瓨 + </el-button> + <el-button v-if="editStatus" icon="el-icon-check" plain size="small" + type="success" @click="editSaveClickHandler">淇濆瓨 + </el-button> + <el-button icon="el-icon-close" plain size="small" + type="danger" @click="addStatus=false;editStatus=false;">鍙栨秷 + </el-button> + </div> + <div v-if="form.category === 1" class="btnBox"> <el-button icon="el-icon-edit" plain size="small" type="primary" @click="updataAliasClickHandler">淇敼鍒悕 </el-button> <el-button icon="el-icon-close" plain size="small" type="danger" @click="deleteOperationClickHandler">鍒犻櫎 </el-button> </div> + <el-form ref="form" :model="form" label-width="85px" size="small" style="max-height: calc(100vh - 200px);overflow: auto;"> + <span v-if="form.category !== 1"> + <el-form-item label="妯″潡鍚嶏細"> + <el-input v-model="form.name" :disabled="!editStatus && !addStatus" placeholder="璇疯緭鍏ユā鍧楀悕"></el-input> + </el-form-item> + <el-form-item label="妯″潡鍒悕锛�"> + <el-input v-model="form.alias" :disabled="!editStatus && !addStatus" placeholder="妯″潡鍒悕鐢ㄦ潵璁板綍鏃ュ織浣跨敤"></el-input> + </el-form-item> + <el-form-item v-if="form.functionType === 0" label="C/S锛�"> + <el-input v-model="form.pathC" :disabled="!editStatus && !addStatus" :rows="2" placeholder="璇疯緭鍏/S璺緞" + type="textarea"></el-input> + </el-form-item> + <el-form-item v-if="form.functionType === 0" label="B/S锛�"> + <el-input v-model="form.path" :disabled="!editStatus && !addStatus" :rows="2" placeholder="璇疯緭鍏/S璺緞" + type="textarea"></el-input> + </el-form-item> + <el-form-item v-if="form.functionType === 0" label=".NET锛�"> + <el-input v-model="form.resourceDotNet" :disabled="!editStatus && !addStatus" :rows="2" + placeholder="璇疯緭鍏�.NET" type="textarea"></el-input> + </el-form-item> + <el-form-item label="搴忓彿锛�"> + <el-input v-model="form.sort" :disabled="!editStatus && !addStatus" + placeholder="鏁板瓧锛屾弿杩拌妯″潡鍦ㄥ叾鐖舵ā鍧椾笅鐨勬樉绀洪『搴�"></el-input> + </el-form-item> + <el-form-item label="鍥炬爣锛�"> + <input-icon v-model="form.source" :disabled="!editStatus && !addStatus" placeholder="璇烽�夋嫨鍥炬爣"> + </input-icon> + </el-form-item> + <el-form-item label="鎻忚堪锛�"> + <el-input v-model="form.remark" :disabled="!editStatus && !addStatus" :rows="3" placeholder="璇疯緭鍏ユ弿杩�" + type="textarea"></el-input> + </el-form-item> + <el-form-item label="鏄惁鑿滃崟锛�"> + <el-switch + v-model="form.functionType" + :active-value="0" + :disabled="!editStatus && !addStatus" + :inactive-value="1" + active-color="#13ce66" + inactive-color="#ff4949"> + </el-switch> + </el-form-item> + <el-form-item label="鏄惁鏈夋晥锛�"> + <el-switch + v-model="form.isValid" + :disabled="!editStatus && !addStatus" + active-color="#13ce66" + inactive-color="#ff4949"> + </el-switch> + <el-link :underline="false" style="margin-left: 20px" type="danger">涓嶇敓鏁堬紙涓嶉�夋嫨锛夋椂锛岃妯″潡鍦ㄥ姛鑳芥ā鍧楁巿鏉冮噷涓嶆樉绀�</el-link> + </el-form-item> + </span> + <span v-if="form.category === 1"> + <el-form-item label="鍚嶇О锛�"> + <el-input v-model="form.name" :disabled="form.category === 1" placeholder="璇疯緭鍏ュ悕绉�"></el-input> + </el-form-item> + <el-form-item label="鏍囪瘑锛�"> + <el-input v-model="form.code" :disabled="form.category === 1" placeholder="璇疯緭鍏ユ爣璇�"></el-input> + </el-form-item> + <el-form-item label="鍒悕锛�"> + <el-input v-model="form.alias" placeholder="璇疯緭鍏ュ埆鍚�"></el-input> + </el-form-item> + <el-form-item label="缂栧彿锛�"> + <el-input v-model="form.sort" :disabled="form.category === 1" placeholder="璇疯緭鍏ョ紪鍙�"></el-input> + </el-form-item> + <el-form-item label="鎻忚堪锛�"> + <el-input v-model="form.remark" :disabled="form.category === 1" placeholder="璇疯緭鍏ユ弿杩�"></el-input> + </el-form-item> + <el-form-item label="鏄惁鏈夋晥锛�"> + <el-switch + v-model="form.isValid" + active-color="#13ce66" + inactive-color="#ff4949"> + </el-switch> + + </el-form-item> + </span> + </el-form> </basic-container> </el-main> <el-dialog @@ -133,7 +155,7 @@ append-to-body="true" class="avue-dialog" title="鎿嶄綔鍒嗙被" - width="60%" + width="500px" > <avue-crud ref="methodsCrud" @@ -142,15 +164,14 @@ :table-loading="methodsLoading" @row-click="rowMethodsClickHandler" @selection-change="selectMethodsChange"> - </avue-crud> <span slot="footer" class="dialog-footer"> - <el-button @click="methodsVisble = false">鍙� 娑�</el-button> <el-button type="primary" @click="methodsSaveClickHandler">淇� 瀛�</el-button> + <el-button @click="methodsVisble = false">鍙� 娑�</el-button> </span> </el-dialog> <!--瀵煎叆 --> - <upload-file ref="upload" fileName="files" :fileType="upFileType" :fileUrl="fileUrl" :tipList="tipList" title="瀵煎叆" + <upload-file ref="upload" :fileType="upFileType" :fileUrl="fileUrl" :tipList="tipList" fileName="files" title="瀵煎叆" @updata="resetFormValue"></upload-file> </el-container> </template> @@ -187,6 +208,7 @@ addBtn: false, menu: false, height: 500, + header: false, column: [ { label: '鎿嶄綔鍒嗙被', @@ -202,6 +224,7 @@ addStatus: false, editStatus: false, nodeRow: {}, + currentClickNode: null, form: {}, treeData: [], treeOption: { @@ -217,7 +240,7 @@ lazy: true, treeLoad: (node, resolve) => { const params = { - parentId: node.level === 0 ? "systemManagmentNode" : node.data.id, + parentId: node.level === 0 ? "system" : node.data.id, modeType: node.level === 0 ? "firstNode" : node.data.modeType, } getSysModelTreeMenuByPID(params).then(res => { @@ -226,7 +249,8 @@ ...item, id: item.id, name: item.name, - leaf: !item.hasChildren + leaf: !item.hasChildren, + icon: item.source || 'iconoir:home' } })) }) @@ -255,10 +279,11 @@ }, methods: { // 鏍戣鐐瑰嚮 - nodeClick(row) { + nodeClick(row, node) { console.log(row.childType); this.form = {...row}; this.nodeRow = {...row}; + this.currentClickNode = node; this.addStatus = false; this.editStatus = false; }, @@ -313,7 +338,7 @@ this.addStatus = false; // this.resetFormValue(); this.form.childType = null; - this.refresh = Math.random(); // 鍒锋柊宸︿晶鏍� + this.handleRefreshTree('add') } }) }, @@ -357,7 +382,7 @@ this.editStatus = false; // this.resetFormValue(); this.form.childType = null; - this.refresh = Math.random(); // 鍒锋柊宸︿晶鏍� + this.handleRefreshTree('edit') } }) }, @@ -372,7 +397,7 @@ delModule(this.form).then(res => { if (res.data.code === 200) { this.$message.success(res.data.msg); - this.resetFormValue(); + this.handleRefreshTree('del') this.addStatus = false; this.editStatus = false; } @@ -390,8 +415,6 @@ exportFunctionSql({isFunction: true}).then(res => { func.downloadFileByBlobHandler(res); this.$message.success('瀵煎嚭鎴愬姛'); - }).catch(err => { - this.$message.error(err); }); }, @@ -403,12 +426,14 @@ // 澧炲姞鎿嶄綔绫诲瀷 addMethodsClickHandler() { this.methodsLoading = true; - getSysModelTreeMenuByPID({parentId: 'sysOptionNode'}).then(res => { - if (res.data.code === 200) { + getSysModelTreeMenuByPID({parentId: 'operateNode'}).then(res => { + if (res.data.code === 200 && res.data.data.length > 0) { this.methodsVisble = true; - const data = res.data.data[0].children; + const data = res.data.data; this.methodsData = data; this.methodsLoading = false; + } else { + this.$message.error('鏈壘鍒板彲澧炲姞鐨勬搷浣滅被鍨�'); } }) }, @@ -431,7 +456,7 @@ this.methodsVisble = false; this.$message.success(res.data.msg); this.form.childType = null; - this.refresh = Math.random(); // 鍒锋柊宸︿晶鏍� + this.handleRefreshTree('add') } }) }, @@ -461,23 +486,21 @@ updateAlias(params).then(res => { if (res.data.code === 200) { this.$message.success(res.data.msg); - this.refresh = Math.random(); // 鍒锋柊宸︿晶鏍� + this.handleRefreshTree('edit') } }) }, // 鍒犻櫎妯″潡涓嬪叧鑱旂殑鎿嶄綔绫诲瀷 deleteOperationClickHandler() { - console.log(this.form); const params = { funcId: this.form.funcId, operId: this.form.operId } delFuncOperation(params).then(res => { - console.log(res); if (res.data.code === 200) { this.$message.success(res.data.msg); - this.resetFormValue(); + this.handleRefreshTree('del'); } }) }, @@ -489,14 +512,30 @@ func.downloadFileByBlobHandler(res); this.createdLoading = false this.$message.success('瀵煎嚭鎴愬姛'); - }).catch(err => { - this.$message.error(err); }) }, // 瀵煎叆 upLoadClickHandler() { this.$refs.upload.visible = true; + }, + + handleRefreshTree(type) { + //type:add\edit\del + if (type == "del") { + this.$refs.tree.remove(this.currentClickNode); + this.currentClickNode = null; + this.form = {}; + } else { + if (this.currentClickNode) { + let node = this.currentClickNode.parent; + node.loaded = false; + node.expand(); + this.$refs.tree.setCurrentNode(this.currentClickNode); + } else { + this.refresh = Math.random(); // 鍒锋柊宸︿晶鏍� + } + } } } } @@ -511,6 +550,7 @@ .btnBox { display: flex; - justify-content: center; + justify-content: left; + margin-bottom: 15px; } </style> -- Gitblit v1.9.3