From e358d69fc18870584dd2d9f531910b7838ea27d9 Mon Sep 17 00:00:00 2001 From: wangting <wangting@vci-tech.com> Date: 星期四, 02 一月 2025 09:58:53 +0800 Subject: [PATCH] 调整行点击后的回调 --- Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/uiDefine/index.vue | 745 ++++++++++++++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 684 insertions(+), 61 deletions(-) diff --git a/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/uiDefine/index.vue b/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/uiDefine/index.vue index 308c333..13d9809 100644 --- a/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/uiDefine/index.vue +++ b/Source/plt-web/plt-web-ui/src/views/modelingMenu/ui/uiDefine/index.vue @@ -1,33 +1,17 @@ <template> <el-container> - <el-aside> <basic-container> - <div ref="TreeBox" style="height: calc(100vh - 144px);!important;"> - <div class="headerCon"> - <el-button icon="el-icon-plus" plain size="small" type="primary" @click="addClickHandler">鍒涘缓 - </el-button> - <el-button icon="el-icon-edit" plain size="small" type="primary" @click="editClickHandler">淇敼 - </el-button> - <el-button icon="el-icon-delete" plain size="small" type="danger" @click="delClickHandler">鍒犻櫎 - </el-button> - <el-button icon="el-icon-download" plain size="small" type="primary" @click="exportClickHandler">瀵煎嚭 - </el-button> - <el-button icon="el-icon-upload2" plain size="small" type="primary" @click="uploadClickHandler">瀵煎叆 - </el-button> - <el-button class="smallBtn" plain size="small" type="primary" - @click="checkViewClickHandler">鏌ョ湅浣跨敤鑼冨洿 - </el-button> - </div> + <div ref="TreeBox" style="height: calc(100vh - 154px);!important;"> <!-- 宸︿晶鏍� --> - <div style="height: calc(100vh - 280px);"> - <avue-tree :data="treeData" :option="treeOption" @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> - {{ (node || {}).label }} - </span> - </span> + <div style="height: calc(100vh - 190px);"> + <avue-tree v-loading="loading" :data="treeData" :option="treeOption" @node-click="nodeClick"> + <span slot-scope="{ node, data }" class="el-tree-node__label"> + <span> + <i class="el-icon-s-promotion"></i> + {{ (node || {}).label }} + </span> + </span> </avue-tree> </div> </div> @@ -36,15 +20,689 @@ <el-main> <basic-container> + <avue-crud + ref="crud" + :data="data" + :option="option" + :page.sync="page" + :table-loading="tableLoading" + @size-change="sizeChange" + @current-change="currentChange" + @selection-change="selectChangeHandler" + @search-change="handleSearch" + @search-reset="handleReset" + @row-click="rowClickHandler"> + <template slot="menuLeft"> + <el-button v-if="permissionList.addBtn" icon="el-icon-plus" size="small" type="primary" @click="addHandler"> + 鍒涘缓 + </el-button> + <!--<el-button icon="el-icon-edit" plain size="small" type="primary" @click="editHandler">淇敼</el-button> + <el-button icon="el-icon-delete" plain size="small" type="danger" @click="delHandler">鍒犻櫎</el-button>--> + <el-button v-if="permissionList.importBtn" icon="el-icon-upload2" plain size="small" type="primary" + @click="upLoadClickHandler">瀵煎叆 + </el-button> + <el-button v-if="permissionList.exportBtn" icon="el-icon-download" plain size="small" type="primary" + @click="exportClickHandler">瀵煎嚭 + </el-button> + <el-button v-if="permissionList.RIGHTBtn" icon="el-icon-place" plain size="small" type="primary" + @click="uiAuthorHandler">鎺堟潈 + </el-button> + </template> + <template slot="menu" slot-scope="scope"> + <el-button v-if="permissionList.editBtn" icon="el-icon-edit" size="small" type="text" + @click="rowEditBtnClick(scope.row)">缂栬緫 + </el-button> + <el-button v-if="permissionList.delBtn" icon="el-icon-delete" size="small" type="text" + @click="rowDeleteHandler(scope.row)">鍒犻櫎 + </el-button> + <el-button v-if="permissionList.cloneBtn" icon="el-icon-document-copy" size="small" type="text" + @click="rowCloneHandler(scope.row)">鍏嬮殕 + </el-button> + </template> + <template slot="plName" slot-scope="{row}"> + <el-link type="primary" @click="linkClickHandler(row)">{{ row.plName }}</el-link> + </template> + </avue-crud> + <!-- 鍒涘缓缂栬緫鑷畾涔夊璇濇 --> + <el-dialog + v-dialogDrag + v-loading="dialogLoading" + :close-on-click-modal="false" + :title="dialogType === 'add' ? ' 鍒涘缓 涓婁笅鏂�' : '缂栬緫 涓婁笅鏂�'" + :visible.sync="dialogVisible" + append-to-body="true" + class="avue-dialog" + width="500px" + @close="dialogClose" + > + <el-form ref="form" :model="form" :rules="rules" label-width="95px" size="small"> + <el-form-item label="鍚嶇О锛�" prop="plName"> + <el-input v-model="form.plName"></el-input> + </el-form-item> + <el-form-item label="UI涓婁笅鏂囷細" prop="plCode"> + <el-input v-model="form.plCode"></el-input> + </el-form-item> + <el-form-item label="鏄剧ず锛�" prop="plIsShow"> + <el-checkbox-group v-model="form.plIsShow"> + <el-checkbox label="瀵艰埅鍖�"></el-checkbox> + <el-checkbox label="鎺у埗鍖�"></el-checkbox> + <el-checkbox label="鎿嶄綔鍖�"></el-checkbox> + </el-checkbox-group> + </el-form-item> + <el-form-item label="鎻忚堪锛�" prop="plDesc"> + <el-input v-model="form.plDesc" :rows="5" type="textarea"></el-input> + </el-form-item> + </el-form> + <span slot="footer" class="dialog-footer"> + <el-button @click="dialogClose">鍙� 娑�</el-button> + <el-button type="primary" @click="saveHandler">纭� 瀹�</el-button> + </span> + </el-dialog> + <!-- 鍏嬮殕 --> + <el-dialog + key="cloneDialog" + v-dialogDrag + :visible.sync="cloneDialogVisible" + append-to-body="true" + class="avue-dialog" + title="鍏嬮殕" + width="500px" + @close="cloneDialogClose" + > + <avue-form ref="cloneForm" v-model="cloneForm" :option="cloneOption"></avue-form> + <span slot="footer" class="dialog-footer"> + <el-button @click="cloneDialogClose">鍙� 娑�</el-button> + <el-button type="primary" @click="cloneSaveHandler">纭� 瀹�</el-button> + </span> + </el-dialog> + <!-- 瀵煎嚭 --> + <el-dialog + key="cloneDialog" + v-dialogDrag + :visible.sync="expDialogVisible" + append-to-body="true" + class="avue-dialog" + title="瀵煎嚭" + width="500px" + @close="expDialogVisible=false" + > + <div style="height: 70%;min-height: 300px"> + <avue-tree ref="expTree" :data="expTreeData" :option="expOption"></avue-tree> + </div> + <span slot="footer" class="dialog-footer"> + <el-button @click="expDialogVisible=false">鍙� 娑�</el-button> + <el-button type="primary" @click="exportData">纭� 瀹�</el-button> + </span> + </el-dialog> </basic-container> + <!-- 瀵煎叆 --> + <upload-file ref="upload" :fileData="fileData" :fileType="upFileType" :fileUrl="fileUrl" :tipList="tipList" + title="瀵煎叆" + @updata="getTableList" @upfaildata="upFail"></upload-file> + <!--椤电绐楀彛--> + <el-dialog v-dialogDrag + :append-to-body="true" + :close-on-click-modal="false" + :destroy-on-close="true" + :fullscreen="true" + :title="dialog.title" + :visible.sync="dialog.showDialog" + class="avue-dialog" + @close="dialog.showDialog=false"> + <pl-show :uiDefineData="dialog.uiDefineData"></pl-show> + </el-dialog> + <!--ui鎺堟潈--> + <ui-author ref="uiAuthor"></ui-author> </el-main> </el-container> </template> <script> +import { + getBizTree, + gridUIContextData, + saveUIContextData, + updateUIContextData, + delUIContextData, + cloneUIContextData, + getExpContextTree, + expUIContextData +} from "@/api/UI/uiDefine"; +import basicOption from "@/util/basic-option"; +import func from "@/util/func"; +import plShow from "@/views/modelingMenu/ui/uiDefine/rightRegion/plShow"; +import uiAuthor from "@/views/authority/ui/uiAuthorization/UIDialog" +import {mapGetters} from "vuex"; + export default { - name: "index" + name: "index", + components: {plShow, uiAuthor}, + data() { + return { + loading: false, + dialog: { + showDialog: false, + title: "涓婁笅鏂囪鎯�", + loading: false, + uiDefineData: null + }, + tipList: [], + upFileType: ['xls'], + fileUrl: 'api/uiManagerController/impUIContextData', + fileData: {}, + lastIndex: null, + treeOption: { + height: 'auto', + defaultExpandAll: true, + menu: false, + addBtn: false, + props: { + label: 'text', + value: 'oid', + children: 'children' + } + }, + nodeRow: {}, + treeData: [], + searchParams: { + 'conditionMap[txtName]': '', + 'conditionMap[txtCode]': '', + }, + tableLoading: false, + page: { + currentPage: 1, + pageSize: 50, + total: 0, + pageSizes: [10, 30, 50, 100], + }, + selectList: [], + option: { + ...basicOption, + calcHeight: -50, + addBtn: false, + editBtn: false, + delBtn: false, + searchMenuSpan: 6, + align: 'left', + column: [{ + label: '鍚嶇О', + prop: 'plName', + search: true + }, { + label: 'UI涓婁笅鏂�', + prop: 'plCode', + search: true, + sortable: true, + }, { + label: '瀵艰埅鍖�', + prop: 'plIsShowNavigator', + width: 130, + align: 'center', + formatter: function (row, value) { + if (row.plIsShowNavigator == 0) { + return '涓嶆樉绀�' + } else { + return '鏄剧ず' + } + } + }, { + label: '鎺у埗鍖�', + prop: 'plIsShowForm', + width: 130, + align: 'center', + formatter: function (row, value) { + if (row.plIsShowForm == 0) { + return '涓嶆樉绀�' + } else { + return '鏄剧ず' + } + } + }, { + label: '鎿嶄綔鍖�', + prop: 'plIsShowTab', + width: 130, + align: 'center', + formatter: function (row, value) { + if (row.plIsShowTab == 0) { + return '涓嶆樉绀�' + } else { + return '鏄剧ず' + } + } + }] + }, + data: [], + dialogLoading: false, + dialogVisible: false, + dialogType: '', + form: { + plName: '', + plCode: '', + plIsShow: [], + }, + rules: { + plName: [{ + required: true, + message: '璇疯緭鍏ュ悕绉�', + trigger: 'blur' + }], + plCode: [{ + required: true, + message: '璇疯緭鍏I涓婁笅鏂�', + trigger: 'blur' + }], + plIsShow: [{ + required: true, + message: '璇烽�夋嫨鏄剧ず鍖哄煙', + trigger: 'blur' + }] + }, + cloneDialogVisible: false, + cloneOption: { + submitBtn: false, + emptyBtn: false, + column: [{ + label: '鍏嬮殕鐩爣', + prop: 'cloneTargetName', + span: 24, + type: 'tree', + clearable: true, + dicData: [], + defaultExpandAll: true, + rules: [ + { + required: true, + message: '璇烽�夋嫨鍏嬮殕鐩爣', + trigger: 'blur' + } + ] + }, { + label: 'UI鍚嶇О', + prop: 'cloneName', + span: 24, + type: 'input', + rules: [ + { + required: true, + message: '璇疯緭鍏I鍚嶇О', + trigger: 'blur' + } + ] + }, { + label: 'UI涓婁笅鏂�', + prop: 'cloneContextCode', + span: 24, + type: 'input', + rules: [ + { + required: true, + message: '璇疯緭鍏I涓婁笅鏂�', + trigger: 'blur' + } + ] + }] + }, + cloneForm: { + //鍏嬮殕鐨勬簮瀵硅薄鐨勪俊鎭� + sourcePLUILayout: null, + cloneTargetName: 'n', + cloneName: '', + cloneContextCode: '' + }, + expDialogVisible: false, + expTreeData: [], + expOption: { + height: 'auto', + filter: false, + multiple: true, + defaultExpandAll: true, + menu: false, + addBtn: false, + props: { + label: 'text', + value: 'oid', + children: 'children' + } + } + } + }, + computed: { + ...mapGetters(["permission"]), + permissionList() { + return { + addBtn: this.vaildData(this.permission[this.$route.query.id].ADD, false), + delBtn: this.vaildData(this.permission[this.$route.query.id].DELETE, false), + editBtn: this.vaildData(this.permission[this.$route.query.id].EDIT, false), + exportBtn: this.vaildData(this.permission[this.$route.query.id].EXPORT, false), + importBtn: this.vaildData(this.permission[this.$route.query.id].IMPORT, false), + cloneBtn: this.vaildData(this.permission[this.$route.query.id].clone, false), + RIGHTBtn: this.vaildData(this.permission[this.$route.query.id].RIGHT, false), + }; + }, + }, + created() { + this.getTreeList(); + }, + methods: { + //鏍戣〃鏌ヨ + getTreeList() { + this.loading = true; + getBizTree().then(res => { + this.treeData = [res.data.obj]; + const dicData = res.data.obj.children.map(item => { + item.label = item.attributes.name; + item.value = item.attributes.name; + return item; + }); + this.cloneOption.column[0].dicData = [{ + label: '涓氬姟绫诲瀷鏍�', + value: '涓氬姟绫诲瀷鏍�', + disabled: true, + children: dicData + }]; + this.loading = false; + }).catch(error => { + this.loading = false; + }) + }, + // 鏍戠偣鍑� + nodeClick(row) { + if (row.oid) { + this.nodeRow = row; + this.tableLoading = true; + this.getTableList(); + } + }, + getTableList() { + const params = Object.assign(this.searchParams, { + 'conditionMap[btmName]': this.nodeRow.attributes.name, + }) + gridUIContextData(this.page.currentPage, this.page.pageSize, params).then(res => { + this.data = res.data.data; + this.page.total = res.data.total; + this.$refs.crud.clearSelection(); + this.tableLoading = false; + }) + }, + linkClickHandler(row) { + this.dialog.title = '銆�' + row.plName + ' - ' + row.plCode + '銆戣鎯�' + this.dialog.uiDefineData = row; + this.dialog.showDialog = true; + return false; + this.$router.push({ + path: '/UIDefineShow/:' + row.plOId, + name: row.plName + '璇︽儏' + }); + }, + sizeChange(val) { + this.page.pageSize = val; + }, + // 椤电爜 + currentChange(val) { + this.page.currentPage = val; + }, + // 澶氶�� + selectChangeHandler(row) { + this.selectList = row; + }, + // 鎼滅储 + handleSearch(params, done) { + this.searchParams = { + 'conditionMap[txtName]': params.plName, + 'conditionMap[txtCode]': params.plCode, + }; + this.getTableList() + done(); + }, + + // 閲嶇疆鎼滅储鏉′欢 + handleReset() { + this.searchParams = {}; + this.getTableList(); + }, + // 琛岀偣鍑� + rowClickHandler(row) { + func.rowClickHandler( + row, + this.$refs.crud, + this.lastIndex, + (newIndex) => { + this.lastIndex = newIndex; + }, + () => { + this.selectList = [row]; + } + ); + }, + + //鍒涘缓 + addHandler() { + if (this.nodeRow && this.nodeRow.oid) { + this.form.plIsShow = []; + this.form.plRelatedType = this.nodeRow.attributes.name; + this.dialogType = 'add'; + this.dialogVisible = true; + } else { + this.$message.error('璇烽�夋嫨涓氬姟绫诲瀷'); + } + + }, + editHandler() { + if (this.selectList.length != 0) { + this.rowEditBtnClick(this.selectList[0]); + } else { + this.$message.error('璇烽�夋嫨涓�鏉℃暟鎹繘琛岀紪杈�'); + } + }, + delHandler() { + if (this.selectList.length <= 0) { + this.$message.error('璇疯嚦灏戦�夋嫨涓�鏉℃暟鎹�'); + return; + } + const params = { + oids: this.selectList.map(item => item.plOId).join(',') + } + this.$confirm('鎮ㄧ‘瀹氳鍒犻櫎鎵�閫夋嫨鐨勬暟鎹悧锛�', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + type: 'warning' + }).then(() => { + delUIContextData(params).then(res => { + if (res.data.code === 200) { + this.$message.success('鍒犻櫎鎴愬姛'); + this.getTableList(); + } + }) + }).catch(() => { + this.$message({ + type: 'info', + message: '宸插彇娑堝垹闄�' + }); + }); + }, + + // 鍏抽棴瀵硅瘽妗� + dialogClose() { + this.dialogVisible = false; + this.$refs.form.clearValidate(); + this.form = { + plName: '', + plCode: '', + plDesc: '', + plIsShow: [], + } + }, + // 淇濆瓨UI涓婁笅鏂� + saveHandler() { + this.$refs.form.validate((valid, done) => { + if (valid) { + let params = { + ...this.form + } + if (this.form.plIsShow.includes('瀵艰埅鍖�')) { + params.plIsShowNavigator = 1 + } else { + params.plIsShowNavigator = 0 + } + if (this.form.plIsShow.includes('鎺у埗鍖�')) { + params.plIsShowForm = 1; + } else { + params.plIsShowForm = 0; + } + if (this.form.plIsShow.includes('鎿嶄綔鍖�')) { + params.plIsShowTab = 1; + } else { + params.plIsShowTab = 0; + } + delete params.plIsShow; + if (this.dialogType === 'add') { + saveUIContextData(params).then(res => { + if (res.data.code === 200) { + this.$message.success('娣诲姞鎴愬姛'); + this.dialogClose(); + this.getTableList(); + } + }) + } else if (this.dialogType === 'edit') { + updateUIContextData(params).then(res => { + if (res.data.code === 200) { + this.$message.success('淇敼鎴愬姛'); + this.dialogClose() + this.getTableList(); + } + }) + } + } else { + return false; + } + }); + }, + // 瀵煎嚭 + exportClickHandler() { + if (this.selectList.length <= 0) { + this.$message.error('璇烽�夋嫨鏁版嵁'); + return; + } + const params = { + expDatas: this.selectList.map(item => item.plOId).join(',') + } + getExpContextTree(params).then(res => { + this.expTreeData = [res.data.obj]; + }) + this.expDialogVisible = true; + }, + exportData() { + const params = {} + const checkedDatas = this.$refs.expTree.getCheckedNodes(); + if (checkedDatas.length <= 0) { + this.$message.error('璇烽�夋嫨鏁版嵁'); + return; + } + this.selectList.forEach(item => { + params[item.plOId] = checkedDatas.filter(checkitem => checkitem.parentId == item.plOId).map(checkitem => checkitem.oid).join(',') + }) + expUIContextData(params).then(res => { + func.downloadFileByBlobHandler(res); + this.$message.success('瀵煎嚭鎴愬姛'); + this.expDialogVisible = false; + }); + }, + + // 瀵煎叆 + upLoadClickHandler() { + this.fileData = { + isCovered: false, + selectBtm: this.nodeRow.attributes.name + } + this.$refs.upload.visible = true; + }, + //瀵煎叆澶辫触 + upFail(response) { + + }, + //ui鎺堟潈 + uiAuthorHandler() { + if (this.selectList.length != 1) { + this.$message.error('璇烽�夋嫨涓�鏉℃暟鎹�'); + return; + } + this.$refs.uiAuthor.openDialog(this.nodeRow.attributes.name, this.selectList[0].plCode); + }, + // 缂栬緫鎸夐挳 + rowEditBtnClick(row) { + this.form = { + ...row, + plIsShow: [], + }; + if (row.plIsShowNavigator) { + this.form.plIsShow.push('瀵艰埅鍖�') + } + if (row.plIsShowForm) { + this.form.plIsShow.push('鎺у埗鍖�') + } + if (row.plIsShowTab) { + this.form.plIsShow.push('鎿嶄綔鍖�') + } + this.dialogType = 'edit'; + this.dialogVisible = true; + }, + // 鍒犻櫎鎸夐挳 + rowDeleteHandler(row) { + this.$confirm('鎮ㄧ‘瀹氳鍒犻櫎鎵�閫夋嫨鐨勬暟鎹悧锛�', '鎻愮ず', { + confirmButtonText: '纭畾', + cancelButtonText: '鍙栨秷', + type: 'warning' + }).then(() => { + delUIContextData({oids: row.plOId}).then(res => { + if (res.data.code === 200) { + this.$message.success('鍒犻櫎鎴愬姛'); + this.getTableList(); + } + }) + }).catch(() => { + this.$message({ + type: 'info', + message: '宸插彇娑堝垹闄�' + }); + }); + }, + //鍏嬮殕 + rowCloneHandler(row) { + this.cloneForm = { + sourcePLUILayout: row, + cloneTargetName: '', + cloneName: row.plName + '_copy(0)', + cloneContextCode: row.plCode + '_copy(0)', + } + this.cloneDialogVisible = true; + }, + cloneSaveHandler() { + this.$refs.cloneForm.validate((valid, done) => { + if (valid) { + cloneUIContextData(this.cloneForm).then(res => { + if (res.data.code === 200) { + this.$message.success('鍏嬮殕鎴愬姛'); + this.cloneDialogClose(); + this.getTableList(); + } + }) + } else { + return false; + } + }); + }, + cloneDialogClose() { + this.cloneDialogVisible = false; + this.cloneForm = { + //鍏嬮殕鐨勬簮瀵硅薄鐨勪俊鎭� + sourcePLUILayout: null, + cloneTargetName: '', + cloneName: '', + cloneContextCode: '' + } + } + } } </script> @@ -53,40 +711,5 @@ .el-scrollbar__wrap { overflow: auto !important; } - .headerCon{ - .el-button{ - width: 82px; - } - } } - -.headerCon { - display: flex; - flex-wrap: wrap; - margin-bottom: 5px; - - .el-button + .el-button { - margin-left: 5px; - } - - .el-button { - margin-top: 5px; - } -} - -.headerCon > .el-button:nth-child(4) { - margin-left: 0; -} - -.headerCon > .el-button:nth-child(7) { - margin-left: 0; -} - - -.smallBtn { - width: 82px; - text-align: center; - padding-left: 4.5px; -} - </style> -- Gitblit v1.9.3