From 949b3dfe9912f46c79ce7754e5faf61135ec4d6a Mon Sep 17 00:00:00 2001 From: wangting <675591594@qq.com> Date: 星期四, 24 十月 2024 10:47:51 +0800 Subject: [PATCH] 调整action弹窗 --- Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/uiDefine/rightRegion/bottomTable/index.vue | 511 ++++++++++++++++++++++++++++++++------------------------ 1 files changed, 289 insertions(+), 222 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 bba8a82..00148aa 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 @@ -3,6 +3,8 @@ <avue-crud ref="crud" v-model="form" + :before-close="beforeClose" + :before-open="beforeOpen" :data="data" :option="option" :table-loading="tableLoading" @@ -18,6 +20,15 @@ </el-button> <el-button icon="el-icon-edit-outline" plain size="small" type="primary" @click="btnDesignClickHandler">鎸夐挳璁捐 + </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> + <el-button icon="el-icon-delete" size="small" type="text" @click="rowDeleteHandler(scope.row)">鍒犻櫎 + </el-button> + <el-button icon="el-icon-document-copy" size="small" type="text" @click="rowCloneHandler(scope.row)">鍏嬮殕 </el-button> </template> @@ -38,7 +49,6 @@ </template> </avue-crud> </template> - <!-- 鍒囨崲鎼滅储绫诲瀷 婧愬璞� 鐩爣瀵硅薄鏄剧ずlabel鍒囨崲 --> <template slot="showTypeLabel" slot-scope="{}"> @@ -70,9 +80,9 @@ </el-button> <el-button :disabled="disabledBtn" plain size="mini" type="primary" @click="escClickBtnHandler">鍙栨秷 </el-button> - <el-button plain size="mini" type="primary">璋冩暣涓轰笅绾ф寜閽�</el-button> - <el-button plain size="mini" type="primary">璋冩暣涓轰笂绾ф寜閽�</el-button> - <el-button plain size="mini" type="primary">澶嶅埗鍒板叾浠栫粍浠�</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> </div> </el-header> <el-container> @@ -126,7 +136,7 @@ </el-form-item> <el-col :span="12"> - <el-form-item label="鏄惁鎺堟潈锛�" prop="resource"> + <el-form-item label="鏄惁鎺堟潈锛�" prop="authorization"> <el-radio v-model="basicForm.authorization" :disabled="disabledBtn" label="0">鏄�</el-radio> <el-radio v-model="basicForm.authorization" :disabled="disabledBtn" label="1">鍚�</el-radio> </el-form-item> @@ -188,6 +198,10 @@ </el-container> </el-dialog> <action-dialog ref="actionDialog" @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" + type="tabButton"></clone-dialog> </div> </template> @@ -196,14 +210,17 @@ import func from "@/util/func"; import { getPLPageDefinations, - getBtmDatasByPage, - getPortalVIDatasByPage, - getQTInfoDatasByPage, getTabButtons, addTapButton, - updateTapButton, getTabByContextIdAndType + updateTapButton, + addPageDefination, + deleteTabButton, + delPageDefination, + joinBtn, + exitBtn } from "@/api/UI/uiDefine"; -import actionDialog from '@/views/modelingMenu/ui/uiDefine/rightRegion/bottomTable/components/action'; +import actionDialog from '@/views/modelingMenu/ui/Aciton/components/dialog'; +import cloneDialog from "@/views/modelingMenu/ui/uiDefine/rightRegion/cloneDialog"; export default { props: { @@ -218,12 +235,17 @@ } }, components: { - actionDialog + actionDialog, + cloneDialog }, name: "index", data() { return { - paramsForm:{}, + formBtnOid: '', + sourceBtnOid: '', + sourceOId: '', + fromOid: '', + paramsForm: {}, eventOption: { ...basicOption, addBtn: false, @@ -344,6 +366,8 @@ addBtn: false, index: true, calcHeight: -30, + editBtn: false, + delBtn: false, column: [ { label: '鍚嶇О', @@ -415,7 +439,10 @@ return val; }, change: (val) => { - console.log(val); + const list = ['showType', 'linkType', 'templateId', 'SubUILayout', 'searchObjType', 'queryTemplateName', 'controlPath', 'expandCols', 'rootContent', 'showAbs', 'showLinkAbs', 'separator'] + list.forEach(item => { + this.form[item] = ""; + }) const searchTarger = this.option.column.find(item => item.prop === 'searchTarger'); // 鑾峰彇鎼滅储绫诲瀷閰嶇疆椤� searchTarger.display = true; // 鍒囨崲榛樿灞曠ず鎼滅储绫诲瀷 // 妯℃澘绫诲瀷涓鸿〃鏍� @@ -442,7 +469,7 @@ dicData: [ { label: '涓嶆樉绀�', - value: '1' + value: '3' }, { label: '鏄剧ず瑙掕壊', @@ -450,7 +477,7 @@ }, { label: '鏄剧ずFolder', - value: '3', + value: '1', }, ], }, @@ -480,6 +507,11 @@ const obj = this.option.group[0].column.find(item => item.prop === 'linkType'); obj.display = val.value !== '1'; } + // 鍒囨崲娓呯┖妯℃澘绫诲瀷 + const list = ['showType', 'linkType', 'templateId', 'SubUILayout', 'queryTemplateName', 'searchObjType']; + list.forEach(item => { + this.form[item] = ''; + }) } }, { @@ -497,155 +529,75 @@ { label: '婧愬璞�', prop: 'showType', - type: 'table', - display: false, + type: 'select', + cascader: ['linkType', 'templateId', 'SubUILayout', 'searchObjType', 'queryTemplateName'], placeholder: "璇疯緭鍏ュ唴瀹�", + dicUrl: '/api/uiManagerController/getBtmDatasByPage?page=1&limit=-1', + filterable: true, props: { label: 'name', - value: 'name' + value: 'name', + desc: 'label' }, - children: { - border: true, - column: [{ - label: '鍚嶇О', - search: true, - searchSpan: 24, - prop: 'name' - }, { - label: '鏍囩', - prop: 'label' - }], - }, - onLoad: ({page, value, data}, callback) => { - //page鍒嗛〉 - // 涓嶇鏄悳绱� 杩樻槸棣栨鍔犺浇閮戒細瑙﹀彂page 鎵�浠ュ彧闇�瑕佹嬁page瀛樺湪涓庡惁杩涜璇锋眰灏卞彲浠� 濡傛灉鍐嶅幓鍒ゆ柇data鎼滅储 鎴栬�卾alue鍒濇鍔犺浇灏变細閲嶅璇锋眰 - if (page) { - const params = { - "conditionMap[filterInputValue]": value ? value.name : '' - }; - getBtmDatasByPage(page.currentPage, page.pageSize, params).then(res => { - callback({ - total: res.data.total, - data: res.data.data - }) - }) + rules: [ + { + required: true, + message: '璇烽�夋嫨鍐呭', + trigger: 'change' } - }, + ], }, { label: '閾炬帴绫诲瀷', prop: 'linkType', - type: 'table', + type: 'select', display: false, + filterable: true, props: { - label: 'viName', - value: 'viName' + label: 'name', + value: 'name', + desc: 'tag' }, - children: { - border: true, - column: [{ - label: '鍚嶇О', - search: true, - searchSpan: 24, - prop: 'viName' - }, { - label: '绫诲瀷', - prop: 'viType' - }], - }, - onLoad: ({page, value, data}, callback) => { - if (page) { - const params = { - "conditionMap[selectBtmType]": this.form.showType, - "conditionMap[filterInputValue]": data ? data.viName : '', - }; - getPortalVIDatasByPage(page.currentPage, page.pageSize, params).then(res => { - console.log(res); - callback({ - total: res.data.total, - data: res.data.data - }) - }) - } - }, + dicUrl: '/api/uiManagerController/getLinkDatasByPage?page=1&limit=-1&conditionMap[selectBtmType]={{key}}', }, { label: '閫夋嫨妯℃澘', - prop: 'showTypea', + prop: 'templateId', display: false, - type: 'table', + type: 'select', + filterable: true, + dicUrl: '/api/uiManagerController/getPortalVIDatasByPage?page=1&limit=-1&conditionMap[selectBtmType]={{key}}', + rules: [ + { + required: true, + message: '璇烽�夋嫨妯℃澘', + trigger: 'submit' + } + ], props: { label: 'viName', - value: 'viName' - }, - children: { - border: true, - column: [{ - label: '鍚嶇О', - search: true, - searchSpan: 24, - prop: 'viName' - }, { - label: '绫诲瀷', - prop: 'viType' - }], - }, - onLoad: ({page, value, data}, callback) => { - if (page) { - const params = { - "conditionMap[selectBtmType]": this.form.showType, - "conditionMap[filterInputValue]": data ? data.viName : '', - }; - getPortalVIDatasByPage(page.currentPage, page.pageSize, params).then(res => { - console.log(res); - callback({ - total: res.data.total, - data: res.data.data - }) - }) - } + value: 'viName', + desc: 'viType' }, }, { label: 'UI瀹氫箟', - prop: 'UI', - type: 'table', + prop: 'SubUILayout', + type: 'select', + filterable: true, display: false, props: { label: 'qtName', - value: 'qtName' + value: 'qtName', + desc: 'btmName' }, - children: { - border: true, - column: [{ - label: '鍚嶇О', - search: true, - searchSpan: 24, - prop: 'qtName' - }, { - label: '绫诲瀷', - prop: 'btmName' - }], - }, - onLoad: ({page, value, data}, callback) => { - if (page) { - const params = { - "conditionMap[selectBtmType]": this.form.showType, - "conditionMap[filterInputValue]": data ? data.qtName : '', - }; - getQTInfoDatasByPage(page.currentPage, page.pageSize, params).then(res => { - callback({ - total: res.data.total, - data: res.data.data - }) - }) - } - }, + dicUrl: '/api/uiManagerController/getUILayoutDatasByPage?page=1&limit=-1&conditionMap[selectBtmType]={{key}}', }, { label: '鏌ヨ绫诲瀷', prop: 'searchType', display: false, + value: '1', type: 'radio', span: 24, dicData: [ @@ -662,112 +614,60 @@ { label: '鏌ヨ瀵硅薄绫诲瀷', prop: 'searchObjType', - type: 'table', + type: 'select', display: false, labelWidth: 100, props: { label: 'qtName', - value: 'qtName' + value: 'qtName', + desc: 'btmName' }, - children: { - border: true, - column: [{ - label: '鍚嶇О', - search: true, - searchSpan: 24, - prop: 'qtName' - }, { - label: '绫诲瀷', - prop: 'btmName' - }], - }, - onLoad: ({page, value, data}, callback) => { - if (page) { - const params = { - "conditionMap[selectBtmType]": this.form.showType, - "conditionMap[filterInputValue]": data ? data.qtName : '', - }; - getQTInfoDatasByPage(page.currentPage, page.pageSize, params).then(res => { - callback({ - total: res.data.total, - data: res.data.data - }) - }) - } - }, + dicUrl: '/api/uiManagerController/getLinkDatasByPage?page=1&limit=-1&conditionMap[selectBtmType]=',// cs绔湁闂 鏆傛椂涓嶅睍绀哄唴瀹� }, { label: '鏌ヨ妯℃澘', - prop: 'showTypes', - type: 'table', + prop: 'queryTemplateName', + type: 'select', + filterable: true, display: false, props: { label: 'qtName', - value: 'qtName' + value: 'qtName', + desc: 'btmName' }, - children: { - border: true, - column: [{ - label: '鍚嶇О', - search: true, - searchSpan: 24, - prop: 'qtName' - }, { - label: '绫诲瀷', - prop: 'btmName' - }], - }, - onLoad: ({page, value, data}, callback) => { - if (page) { - const params = { - "conditionMap[selectBtmType]": this.form.showType, - "conditionMap[filterInputValue]": data ? data.qtName : '', - }; - getQTInfoDatasByPage(page.currentPage, page.pageSize, params).then(res => { - callback({ - total: res.data.total, - data: res.data.data - }) - }) - } - }, + dicUrl: '/api/uiManagerController/getQTInfoDatasByPage?page=1&limit=-1&conditionMap[selectBtmType]={{key}}', }, { label: '鎺у埗璺緞', - prop: 'kzlj', + prop: 'controlPath', display: false, type: 'textarea', + span: 24, rows: 3 }, { - label: '鏍硅妭鐐规樉绀鸿〃杈惧紡', - prop: 'genjiedian', + label: '鏍戠粨鏋勫睍寮�鍒�', + prop: 'expandCols', + labelWidth: 110, display: false, - labelWidth: 135, - span: 24 - }, - { - label: '鏍戣妭鐐规樉绀鸿〃杈惧紡', - prop: 'shujiedian', - display: false, - labelWidth: 135, - span: 24 + span: 12 }, { label: '鍙傜収鏍戣缃�', - prop: 'canzhaoshu', + prop: 'showLinkAbs', display: false, }, { label: '鍒嗛殧绗�', - prop: 'fgf', + prop: 'separator', display: false, }, { label: '灞曞紑鏂瑰紡', - prop: 'zkfs', + prop: 'expandMode', display: false, type: 'radio', + value: '1', dicData: [ { label: '閫愮骇灞曞紑', @@ -775,9 +675,23 @@ }, { label: '鍏ㄩ儴灞曞紑', - value: '2' + value: '0' } ] + }, + { + label: '鏍硅妭鐐规樉绀鸿〃杈惧紡', + prop: 'rootContent', + display: false, + labelWidth: 135, + span: 12 + }, + { + label: '鏍戣妭鐐规樉绀鸿〃杈惧紡', + prop: 'showAbs', + display: false, + labelWidth: 135, + span: 12 }, ] }, @@ -806,7 +720,7 @@ sourceData: { handler(val) { if (val && val.plOId) { - this.getTableList() + this.getTableList(); } else { this.data = []; } @@ -829,6 +743,7 @@ this.tableLoading = false; }) }, + // 鏍规嵁涓嶅悓鍊煎尯鍒嗙被鍨� templateTypeValueHandler(val) { const componentMap = { @@ -871,6 +786,93 @@ return; } this.$refs.crud.rowAdd(); + }, + + // 缂栬緫鎵撳紑琛ㄥ崟鍓� + beforeOpen(done, type) { + if (type === 'edit') { + this.form.showType = 'Ludc'; + this.$set(this.form, 'showType', 'Ludc'); + // this.$set(this.option.group[0].column[0],'value','Ludc'); + // this.option.group[0].column[0].value = 'Ludc'; + done(); + } else { + done(); + } + }, + + // 澧炲姞鍏抽棴瀵硅瘽妗� 娓呯┖event鏁扮粍 + beforeClose(done) { + this.eventData = []; + done(); + }, + + // 淇敼 + editBtnClick(row) { + this.eventData = []; + if (row.eventKey && row.eventValue) { + let keys = row.eventKey.split(','); + let values = row.eventValue.split(','); + + this.eventData = keys.map((key, index) => { + return { + index: this.eventData.length, + eventKey: key.trim(), + eventValue: values[index], + $cellEdit: true + }; + }); + } + this.$refs.crud.rowEdit(row); + console.log(this.form); + }, + + // 鍒犻櫎 + rowDeleteHandler(row) { + console.log(row); + this.$confirm('鎮ㄧ‘瀹氳鍒犻櫎鎵�閫夋嫨鐨勬暟鎹悧锛�', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + type: 'warning' + }).then(() => { + const params = { + oids: row.id + } + delPageDefination(params).then(res => { + if (res.data.code === 200) { + this.$message.success('鍒犻櫎鎴愬姛'); + this.getTableList(); + } + }) + }).catch(() => { + this.$message({ + type: 'info', + message: '宸插彇娑堝垹闄�' + }); + }); + }, + + // 淇濆瓨 + rowSaveHandler(row, done, loading) { + if (row.templateType === '6') { + row.SubUIObjType = row.showType; + row.showType = ""; + } + console.log(this.sourceData); + const params = { + ...row, + tabPageOId: this.sourceData.plOId + } + addPageDefination(params).then(res => { + console.log(res); + if (res.data.code === 200) { + this.$message.success(res.data.obj); + this.getTableList(); + done(); + } + }).catch(err => { + loading(); + }) }, // 瀵硅瘽妗嗚〃鏍艰鐐瑰嚮 @@ -924,7 +926,7 @@ // 妯℃澘绫诲瀷涓鸿〃鏍� templateTypeTable(val) { if (!val) return; - this.updateDisplay(val, ['showType', 'showTypea', 'showTypes']); + this.updateDisplay(val, ['showType', 'templateId', 'queryTemplateName']); }, // 妯℃澘绫诲瀷涓鸿嚜瀹氫箟妯℃澘 @@ -932,19 +934,19 @@ if (!val) return; const searchTarger = this.option.column.find(item => item.prop === 'searchTarger'); // 鑾峰彇鎼滅储绫诲瀷閰嶇疆椤� searchTarger.display = false; // 涓嶅睍绀烘悳绱㈢被鍨� - this.updateDisplay(val, ['kzlj']); + this.updateDisplay(val, ['controlPath']); }, // 妯℃澘绫诲瀷涓烘爲琛� templateTypeTreeTable(val) { if (!val) return; - this.updateDisplay(val, ['showType', 'showTypea', 'showTypes', 'zkl', 'zkfs']); + this.updateDisplay(val, ['showType', 'templateId', 'queryTemplateName', 'expandCols', 'zkfs']); }, // 妯℃澘绫诲瀷涓鸿〃鍗� templateTypeForm(val) { if (!val) return; - this.updateDisplay(val, ['showType', 'showTypea', 'showTypes']); + this.updateDisplay(val, ['showType', 'templateId', 'queryTemplateName']); }, // 妯℃澘绫诲瀷涓烘爲 @@ -952,7 +954,7 @@ if (!val) return; const searchTarger = this.option.column.find(item => item.prop === 'searchTarger'); // 鑾峰彇鎼滅储绫诲瀷閰嶇疆椤� searchTarger.display = false; // 涓嶅睍绀烘悳绱㈢被鍨� - this.updateDisplay(val, ['showType', 'showTypes', 'genjiedian', 'shujiedian', 'canzhaoshu', 'fgf', 'zkfs', 'linkType']); + this.updateDisplay(val, ['showType', 'queryTemplateName', 'rootContent', 'showAbs', 'showLinkAbs', 'separator', 'expandMode', 'linkType']); }, // 妯℃澘绫诲瀷涓篣I瀹氫箟 @@ -960,7 +962,7 @@ if (!val) return; const searchTarger = this.option.column.find(item => item.prop === 'searchTarger'); // 鑾峰彇鎼滅储绫诲瀷閰嶇疆椤� searchTarger.display = false; // 涓嶅睍绀烘悳绱㈢被鍨� - this.updateDisplay(val, ['showType', 'UI', 'searchType', 'searchObjType', 'showTypes']); + this.updateDisplay(val, ['showType', 'SubUILayout', 'searchType', 'searchObjType', 'queryTemplateName']); }, // 鏌ユ壘鏁扮粍涓璞$储寮� @@ -988,11 +990,6 @@ } }, - // 鎸夐挳璁捐鍏抽棴瀵硅瘽妗� - dialogClose() { - - }, - // 鎸夐挳璁捐 btnDesignClickHandler() { if (this.selectList.length != 1) { @@ -1000,6 +997,7 @@ return; } this.btnDesignVisible = true; + this.formBtnOid = this.selectList[0].id; this.getTabBtnTree(); }, @@ -1015,6 +1013,7 @@ this.treeData = [{ label: this.selectList[0].name, oId: 'parentNode', + disabled: true, children: data }]; this.treeLoading = false; @@ -1118,7 +1117,6 @@ bottomParams[item.name] = item.value }) } - ; const params = this.saveType === 'add' ? { ...this.basicForm, @@ -1160,7 +1158,15 @@ cancelButtonText: '鍙栨秷', type: 'warning' }).then(() => { - + deleteTabButton(this.nodeTreeRow).then(res => { + // console.log(res); + if (res.data.code === 200) { + this.$message.success('鍒犻櫎鎴愬姛'); + this.getTabBtnTree(); + this.basicForm = {}; + this.paramsData = []; + } + }) }).catch(() => { this.$message({ type: 'info', @@ -1169,17 +1175,78 @@ }); }, + // 澶嶅埗鍒板叾浠栫粍浠� + cloneClickBtnHandler() { + if (func.isEmptyObject(this.nodeTreeRow)) { + this.$message.error('璇烽�夋嫨鑺傜偣杩涜澶嶅埗'); + return; + } + if (this.nodeTreeRow.oId === "parentNode") { + this.$message.error('椤跺眰鑺傜偣涓嶅厑璁稿鍒�'); + return; + } + this.sourceBtnOid = this.nodeTreeRow.oId; + this.$refs.cloneBtnDialog.openDialog(this.nodeTreeRow); + }, + // 閫夋嫨action actionFoucus() { - this.$refs.actionDialog.btnActionVisible = true; + this.$refs.actionDialog.openDialog(); }, // 淇濆瓨action actionSaveHandler(val) { this.$set(this.basicForm, 'actionName', val.plName); this.$set(this.basicForm, 'actionOId', val.plOId); + }, + + // 鎵撳紑鍏嬮殕瀵硅瘽妗� + rowCloneHandler(row) { + console.log(row); + this.fromOid = this.sourceData.plOId; + this.sourceOId = row.id; + this.$refs.cloneDialog.openDialog(row); + }, + + // 璋冩暣涓轰笅绾ф寜閽� + changeBottomBtnHandler() { + if (func.isEmptyObject(this.nodeTreeRow)) { + this.$message.error('璇烽�夋嫨鑺傜偣杩涜淇敼'); + return; + } + + if (this.nodeTreeRow.oId === "parentNode") { + this.$message.error('椤跺眰鑺傜偣涓嶅厑璁歌皟鏁�'); + return; + } + joinBtn(this.nodeTreeRow).then(res => { + // console.log(res); + if (res.data.code === 200) { + this.$message.success(res.data.obj); + this.getTabBtnTree(); + } + }) + }, + + // 璋冩暣涓轰笂绾ф寜閽� + changeTopBtnHandler() { + if (func.isEmptyObject(this.nodeTreeRow)) { + this.$message.error('璇烽�夋嫨鑺傜偣杩涜淇敼'); + return; + } + + if (this.nodeTreeRow.oId === "parentNode") { + this.$message.error('椤跺眰鑺傜偣涓嶅厑璁歌皟鏁�'); + return; + } + exitBtn(this.nodeTreeRow).then(res => { + if (res.data.code === 200) { + this.$message.success(res.data.obj); + this.getTabBtnTree(); + } + }) } - } + }, } </script> -- Gitblit v1.9.3