From a7021b7620d04b04ffcd084ea07704b37b15be0a Mon Sep 17 00:00:00 2001 From: wangting <wangting@vci-tech.com> Date: 星期一, 13 一月 2025 09:54:32 +0800 Subject: [PATCH] 按钮图标仅验证是图标类型显示方式 --- Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/uiDefine/rightRegion/bottomTable/index.vue | 277 ++++++++++++++++++++++++++++++++---------------------- 1 files changed, 164 insertions(+), 113 deletions(-) diff --git a/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/uiDefine/rightRegion/bottomTable/index.vue b/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/uiDefine/rightRegion/bottomTable/index.vue index 97eef61..7e4965a 100644 --- a/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/uiDefine/rightRegion/bottomTable/index.vue +++ b/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/uiDefine/rightRegion/bottomTable/index.vue @@ -13,20 +13,30 @@ @selection-change="selectChangeHandler" @row-click="rowClickHandler"> <template slot="menuLeft" slot-scope="scope"> - <el-button icon="el-icon-plus" plain size="small" type="primary" - @click="addClickHandler">澧炲姞 - </el-button> - <el-button icon="el-icon-edit-outline" plain size="small" type="primary" - @click="btnDesignClickHandler">鎸夐挳璁捐 + <el-button v-if="permissionChildrenList.UiPageLayoutAddBtn" class="button-custom-icon" plain size="small" type="primary" + @click="addClickHandler"> + <icon-show :name="permissionChildrenList.UiPageLayoutAddBtn.source"></icon-show> + 澧炲姞 </el-button> </template> <template slot="menu" slot-scope="scope"> - <el-button icon="el-icon-edit" size="small" type="text" @click="editBtnClick(scope.row)">缂栬緫 + <el-button v-if="permissionChildrenList.UiPageLayoutDesignBtn" size="small" type="text" + @click="btnDesignClickHandler(scope.row)"> + <icon-show :name="permissionChildrenList.UiPageLayoutDesignBtn.source"></icon-show> + 鎸夐挳璁捐 </el-button> - <el-button icon="el-icon-delete" size="small" type="text" @click="rowDeleteHandler(scope.row)">鍒犻櫎 + <el-button v-if="permissionChildrenList.UiPageLayoutEditBtn" size="small" type="text" @click="editBtnClick(scope.row)"> + <icon-show :name="permissionChildrenList.UiPageLayoutEditBtn.source"></icon-show> + 缂栬緫 </el-button> - <el-button icon="el-icon-document-copy" size="small" type="text" @click="rowCloneHandler(scope.row)">鍏嬮殕 + <el-button v-if="permissionChildrenList.UiPageLayoutDelBtn" size="small" type="text" @click="rowDeleteHandler(scope.row)"> + <icon-show :name="permissionChildrenList.UiPageLayoutDelBtn.source"></icon-show> + 鍒犻櫎 + </el-button> + <el-button v-if="permissionChildrenList.UiPageLayoutCloneBtn" size="small" type="text" @click="rowCloneHandler(scope.row)"> + <icon-show :name="permissionChildrenList.UiPageLayoutCloneBtn.source"></icon-show> + 鍏嬮殕 </el-button> </template> @@ -109,28 +119,28 @@ append-to-body="true" class="avue-dialog" title="閰嶇疆鎸夐挳" - width="75%" - @close="dialogClose"> + width="1200px" + @close="$refs.form.clearValidate();disabledBtn=true;"> <el-container v-loading="dialogLoading"> - <el-header style="height: 40px !important;"> + <el-header style="height: 40px !important;padding-left: 5px;"> <div style="display: flex"> - <el-button :disabled="!disabledBtn" plain size="mini" type="primary" @click="addClickBtnHandler">娣诲姞 + <el-button v-show="disabledBtn" :disabled="!disabledBtn" plain size="mini" type="primary" @click="addClickBtnHandler">娣诲姞 </el-button> - <el-button :disabled="!disabledBtn" plain size="mini" type="primary" @click="editClickBtnHandler">淇敼 + <el-button v-show="disabledBtn" :disabled="!disabledBtn" plain size="mini" type="primary" @click="editClickBtnHandler">淇敼 </el-button> - <el-button :disabled="!disabledBtn" plain size="mini" type="danger" @click="delClickBtnHandler">鍒犻櫎 + <el-button v-show="disabledBtn" :disabled="!disabledBtn" plain size="mini" type="danger" @click="delClickBtnHandler">鍒犻櫎 </el-button> - <el-button :disabled="disabledBtn" plain size="mini" type="primary" @click="saveClickBtnHandler">淇濆瓨 + <el-button v-show="!disabledBtn" :disabled="disabledBtn" plain size="mini" icon="el-icon-check" type="success" @click="saveClickBtnHandler">淇濆瓨 </el-button> - <el-button :disabled="disabledBtn" plain size="mini" type="primary" @click="escClickBtnHandler">鍙栨秷 + <el-button v-show="!disabledBtn" :disabled="disabledBtn" plain size="mini" icon="el-icon-close" type="danger" @click="escClickBtnHandler">鍙栨秷 </el-button> - <el-button plain size="mini" type="primary" @click="changeBottomBtnHandler">璋冩暣涓轰笅绾ф寜閽�</el-button> - <el-button plain size="mini" type="primary" @click="changeTopBtnHandler">璋冩暣涓轰笂绾ф寜閽�</el-button> - <el-button plain size="mini" type="primary" @click="cloneClickBtnHandler">澶嶅埗鍒板叾浠栫粍浠�</el-button> + <el-button v-show="disabledBtn" plain size="mini" type="primary" @click="changeBottomBtnHandler">璋冩暣涓轰笅绾ф寜閽�</el-button> + <el-button v-show="disabledBtn" plain size="mini" type="primary" @click="changeTopBtnHandler">璋冩暣涓轰笂绾ф寜閽�</el-button> + <el-button v-show="disabledBtn" plain size="mini" type="primary" @click="cloneClickBtnHandler">澶嶅埗鍒板叾浠栫粍浠�</el-button> </div> </el-header> <el-container> - <el-aside width="20%"> + <el-aside width="25%"> <basic-container> <div style="height:650px;"> <avue-tree @@ -141,9 +151,10 @@ node-key="value" @node-click="nodeTreeClick"> <span slot-scope="{ node, data }" class="el-tree-node__label"> - <span style="font-size: 14px"> - <i class="el-icon-s-promotion"></i> - {{ (node || {}).label }} + <span style="display: flex"> + <i v-if="data.oId=='parentNode'" class="iconShow el-icon-s-home"></i> + <icon-show v-else :name="data.iconPath"></icon-show> + {{ (node || {}).label }} </span> </span> </avue-tree> @@ -154,30 +165,29 @@ <el-main> <basic-container> <el-divider content-position="left">鍩虹淇℃伅</el-divider> - <el-form ref="form" :model="basicForm" :rules="rules" label-width="90px" size="small" + <el-form ref="form" :model="basicForm" :rules="rules" label-width="100px" size="small" style="margin-top: 20px"> <el-row> - <el-form-item :inline-message='true' label="缂栧彿锛�" prop="seq"> - <el-input-number v-model="basicForm.seq" :disabled="disabledBtn" :max="9999" :min="1" - controls-position="right"></el-input-number> - </el-form-item> + <el-col :span="12"> + <el-form-item :inline-message='true' label="缂栧彿锛�" prop="seq"> + <el-input-number v-model="basicForm.seq" :disabled="disabledBtn" :max="9999" :min="1" + controls-position="right"></el-input-number> + </el-form-item> + </el-col> - <el-form-item :inline-message='true' label="鍚嶇О锛�" prop="label"> - <el-col :span="14"> - <el-input v-model="basicForm.label" :readonly="disabledBtn"></el-input> - </el-col> - </el-form-item> + <el-col :span="12"> + <el-form-item label="鍚嶇О锛�" prop="label"> + <el-input v-model="basicForm.label" :disabled="disabledBtn"></el-input> + </el-form-item> + </el-col> - <el-form-item label="Action锛�" prop="Action"> - <el-col :span="14"> - <div style="display: flex"> - <el-input v-model="basicForm.actionName" :readonly="disabledBtn"></el-input> - <el-button :disabled="disabledBtn" size="mini" style="margin-left: 10px" type="success" - @click="actionFoucus">閫夋嫨 - </el-button> - </div> - </el-col> - </el-form-item> + <el-col :span="12"> + <el-form-item label="Action锛�" prop="actionName"> + <el-input v-model="basicForm.actionName" :disabled="disabledBtn" :clearable="true" @focus="actionFoucus" @clear="clearActionValue"> + <i slot="suffix" class="el-input__icon el-icon-search" style="cursor: pointer" @click="actionFoucus"></i> + </el-input> + </el-form-item> + </el-col> <el-col :span="12"> <el-form-item label="鏄惁鎺堟潈锛�" prop="authorization"> @@ -185,7 +195,8 @@ <el-radio v-model="basicForm.authorization" :disabled="disabledBtn" label="1">鍚�</el-radio> </el-form-item> </el-col> - + <el-col :span="24"> + </el-col> <el-col :span="12"> <el-form-item label="鏄惁鏄剧ず锛�" prop="show"> <el-radio v-model="basicForm.show" :disabled="disabledBtn" label="0">鏄�</el-radio> @@ -193,18 +204,22 @@ </el-form-item> </el-col> - <el-col :span="12"> + <el-col :span="12" v-show="basicForm.show=='0'"> <el-form-item label="鏄剧ず鏂瑰紡锛�" prop="showType"> <el-radio v-model="basicForm.displayMode" :disabled="disabledBtn" label="text">鏂囧瓧</el-radio> <el-radio v-model="basicForm.displayMode" :disabled="disabledBtn" label="image">鍥炬爣</el-radio> - <el-radio v-model="basicForm.displayMode" :disabled="disabledBtn" label="textandimage">鏂囧瓧鍜屽浘鏍� - </el-radio> + <el-radio v-model="basicForm.displayMode" :disabled="disabledBtn" label="textandimage">鏂囧瓧鍜屽浘鏍�</el-radio> + </el-form-item> + </el-col> + <el-col :span="24" v-show="basicForm.show=='0' && (basicForm.displayMode=='image'||basicForm.displayMode=='textandimage')"> + <el-form-item :class="basicForm.displayMode==='image'?'is-required':''" label="鍥炬爣锛�" prop="iconPath"> + <input-icon v-model="basicForm.iconPath" :disabled="disabledBtn"></input-icon> </el-form-item> </el-col> - <el-col :span="12"> + <el-col :span="24"> <el-form-item label="鎻愮ず淇℃伅锛�" prop="desc"> - <el-input v-model="basicForm.desc" :readonly="disabledBtn" type="textarea"></el-input> + <el-input v-model="basicForm.desc" :disabled="disabledBtn" type="textarea"></el-input> </el-form-item> </el-col> @@ -241,7 +256,7 @@ </el-container> </el-container> </el-dialog> - <action-dialog ref="actionDialog" @updataAction="actionSaveHandler"></action-dialog> + <action-dialog ref="actionDialog" @cancelAction="actionCancelHandler" @updataAction="actionSaveHandler"></action-dialog> <clone-dialog ref="cloneDialog" :fromOid="fromOid" :sourceOId="sourceOId" paramsType="tab" type="pageDef"></clone-dialog> <clone-dialog ref="cloneBtnDialog" :fromOid="formBtnOid" :sourceOId="sourceBtnOid" paramsType="pageDef" @@ -268,6 +283,7 @@ } from "@/api/UI/uiDefine"; import actionDialog from '@/views/modelingMenu/ui/Aciton/components/dialog'; import cloneDialog from "@/views/modelingMenu/ui/uiDefine/rightRegion/cloneDialog"; +import {mapGetters} from "vuex"; export default { props: { @@ -357,11 +373,15 @@ editBtn: false, delBtn: false, refreshBtn: false, + dialogWidth:'600', + menuWidth:'140', column: [ { label: '鍚嶇О', prop: 'name', + width:180, span: 24, + overHidden:true, rules: [ { required: true, @@ -373,7 +393,9 @@ { label: '鍊�', prop: 'value', + type:'textarea', span: 24, + overHidden:true, rules: [ { required: true, @@ -391,11 +413,12 @@ label: [ {required: true, message: '璇疯緭鍏ュ悕绉�', trigger: 'blur'}, ], + actionName: [ + {required: true, message: '璇烽�夋嫨Action', trigger: 'change'}, + ], }, // 鎸夐挳璁捐 鍩虹淇℃伅 - basicForm: { - seq: 1 - }, + basicForm: {}, treeData: [], treeOption: { menu: false, @@ -421,10 +444,12 @@ calcHeight: -30, editBtn: false, delBtn: false, + menuWidth:300, column: [ { label: '鍚嶇О', prop: 'name', + width: 220, labelWidth: 110, rules: [ { @@ -437,6 +462,7 @@ { label: '缂栧彿', prop: 'seq', + width:100, labelWidth: 110, hide: false, rules: [ @@ -448,13 +474,13 @@ ], }, { - label: '', + label: 'UI瑙f瀽绫诲瀷', prop: 'uiParser', hide: true, labelWidth: 110, }, { - label: '', + label: '鎵╁睍灞炴��', prop: 'extAttr', hide: true, labelWidth: 110, @@ -840,6 +866,19 @@ lastIndex: null, selectList: [], formDataRow: {}, + defaultForm:{}, + } + }, + computed:{ + ...mapGetters(["permission"]), + permissionChildrenList() { + return { + UiPageLayoutAddBtn: this.vaildData(this.permission[this.$route.query.id].CLSRIGHT, false), + UiPageLayoutEditBtn: this.vaildData(this.permission[this.$route.query.id].DATARIGHT, false), + UiPageLayoutDelBtn: this.vaildData(this.permission[this.$route.query.id].ATTRRIGHT, false), + UiPageLayoutCloneBtn: this.vaildData(this.permission[this.$route.query.id].CLONE, false), + UiPageLayoutDesignBtn: this.vaildData(this.permission[this.$route.query.id].UPLOAD, false), + } } }, watch: { @@ -855,7 +894,6 @@ deep: true } }, - computed: {}, methods: { //鑾峰彇鍒楄〃鏁版嵁 getTableList() { @@ -899,7 +937,7 @@ this.lastIndex = newIndex; }, () => { - this.selectList = []; + this.selectList = [row]; } ); }, @@ -937,7 +975,6 @@ }; }); } - console.log('row',row); this.searchTargerChangeFlag = false; this.$refs.crud.rowEdit(row); }, @@ -971,6 +1008,10 @@ if (row.templateType === '6') { row.SubUIObjType = row.showType; row.showType = ""; + } + if (row.templateType === '5' && this.form.linkType && !this.form.showLinkAbs) { + this.$message.error('璇烽�夋嫨鍙傜収鏍戣缃�'); + return loading(); } const params = { ...row, @@ -1014,24 +1055,6 @@ // 瀵硅瘽妗嗚〃鏍兼坊鍔� formDataAddClickHandler() { - // if (!this.form.eventKey) { - // this.$message.error('璇烽�夋嫨EventKey'); - // return; - // } - // - // if (!this.form.eventValue) { - // this.$message.error('璇疯緭鍏ventValue'); - // return; - // } - // - // if (this.eventData.length >= 1) { - // const eventValueStatus = this.eventData.some(item => item.eventValue === this.form.eventValue); - // - // if (eventValueStatus) { - // this.$message.error('宸插瓨鍦ㄧ浉鍚岀殑 EventValue锛屼笉鑳介噸澶嶆坊鍔�'); - // return; - // } - // } const obj = { index: this.eventData.length, eventKey: this.form.eventKey || 'SelectionEvent', @@ -1123,34 +1146,34 @@ }, // 鎸夐挳璁捐 - btnDesignClickHandler() { - if (this.selectList.length != 1) { + btnDesignClickHandler(row) { + /*if (this.selectList.length != 1) { this.$message.error('璇烽�夋嫨涓�鏉℃暟鎹�'); return; - } + }*/ this.btnDesignVisible = true; - this.formBtnOid = this.selectList[0].id; - this.getTabBtnTree(); + this.formBtnOid = row.id; + this.getTabBtnTree(row); }, // 宸︿晶鏍戣姹� - getTabBtnTree() { + getTabBtnTree(row) { const params = { - pageDefinationOid: this.selectList[0].id + pageDefinationOid: row && row.id ? row.id : this.selectList[0].id } this.treeLoading = true; getTabButtons(params).then(res => { if (res.data.code === 200) { const data = res.data.data; this.treeData = [{ - label: this.selectList[0].name, + label: row && row.id ? row.name : this.selectList[0].name, oId: 'parentNode', disabled: true, children: data }]; this.treeLoading = false; } else { - this.$message.error('璇锋鏌ユ帶鍒跺彴閿欒'); + this.$message.error(res.data.msg); } }) }, @@ -1158,12 +1181,14 @@ // 鎸夐挳璁捐琛岀偣鍑� nodeTreeClick(row) { this.nodeTreeRow = row; + this.defaultForm = {...row}; this.basicForm = {...row}; this.paramsData = row.buttonParams ? Object.entries(row.buttonParams).map(([key, value]) => ({ name: key, value: value })) : []; this.disabledBtn = true; + this.$refs.form.clearValidate(); }, // 鎸夐挳璁捐鍙傛暟淇℃伅鍒犻櫎 @@ -1236,42 +1261,55 @@ this.disabledBtn = true; if (this.saveType === 'add') { this.$refs.Tree.setCurrentKey(null); + this.$refs.form.resetFields(); + }else { + this.basicForm = {...this.defaultForm}; } }, // 鎸夐挳璁捐淇濆瓨 saveClickBtnHandler() { - this.dialogLoading = true; - const saveFunction = this.saveType === 'add' ? addTapButton : updateTapButton; - const bottomParams = {}; - if (this.paramsData.length > 0) { - this.paramsData.forEach(item => { - bottomParams[item.name] = item.value - }) + if (this.basicForm.show == '0' && this.basicForm.displayMode == 'image' && this.basicForm.iconPath == '') { + this.$message.error('璇烽�夋嫨鍥炬爣'); + return; } + this.$refs.form.validate((valid, done) => { + if (valid) { + this.dialogLoading = true; + const saveFunction = this.saveType === 'add' ? addTapButton : updateTapButton; + const bottomParams = {}; + if (this.paramsData.length > 0) { + this.paramsData.forEach(item => { + bottomParams[item.name] = item.value + }) + } + const params = this.saveType === 'add' ? { + ...this.basicForm, + parentId: this.nodeTreeRow.oId === 'parentNode' ? '' : this.nodeTreeRow.parentId, + buttonParams: bottomParams, + tableOId: this.selectList[0].id + } : { + ...this.basicForm, + buttonParams: bottomParams + } - const params = this.saveType === 'add' ? { - ...this.basicForm, - parentId: this.nodeTreeRow.oId === 'parentNode' ? '' : this.nodeTreeRow.parentId, - buttonParams: bottomParams, - tableOId: this.selectList[0].id - } : { - ...this.basicForm, - buttonParams: bottomParams - } - - saveFunction(params).then(res => { - if (res.data.code === 200) { - this.$message.success(res.data.obj); - this.disabledBtn = true; - this.getTabBtnTree(); - this.basicForm = {}; - this.paramsData = []; - this.dialogLoading = false; + saveFunction(params).then(res => { + if (res.data.code === 200) { + this.$message.success(res.data.obj); + this.disabledBtn = true; + this.getTabBtnTree(); + this.paramsData = []; + this.dialogLoading = false; + this.$refs.form.resetFields(); + } + }).catch(err => { + this.dialogLoading = false; + }) + } else { + return false; } - }).catch(err => { - this.dialogLoading = false; - }) + done(); + }); }, // 鎸夐挳璁捐鍒犻櫎 @@ -1330,8 +1368,21 @@ actionSaveHandler(val) { this.$set(this.basicForm, 'actionName', val.plName); this.$set(this.basicForm, 'actionOId', val.plOId); + this.$set(this.basicForm, 'iconPath', val.plImage);//鍥炬爣 + this.$refs.form.clearValidate('Action') + }, + // action閫夋嫨寮圭獥鐩存帴鍏抽棴 + actionCancelHandler() { + if(this.basicForm.actionOId){ + this.$refs.form.clearValidate('Action') + } }, + //娓呴櫎action + clearActionValue(){ + this.$set(this.basicForm, 'actionName', ''); + this.$set(this.basicForm, 'actionOId', ''); + }, // 鎵撳紑鍏嬮殕瀵硅瘽妗� rowCloneHandler(row) { this.fromOid = this.sourceData.plOId; -- Gitblit v1.9.3