From 7d05c69630d066c0992368423f90e440e3638f91 Mon Sep 17 00:00:00 2001 From: 田源 <lastanimals@163.com> Date: 星期日, 29 九月 2024 11:01:51 +0800 Subject: [PATCH] 整合代码 --- Source/UBCS-WEB/src/views/modeling/cycle.vue | 241 ++++++++++++++++++++++++++++++++++++++++------- 1 files changed, 203 insertions(+), 38 deletions(-) diff --git a/Source/UBCS-WEB/src/views/modeling/cycle.vue b/Source/UBCS-WEB/src/views/modeling/cycle.vue index 7c171f6..5194d87 100644 --- a/Source/UBCS-WEB/src/views/modeling/cycle.vue +++ b/Source/UBCS-WEB/src/views/modeling/cycle.vue @@ -5,17 +5,32 @@ :option="option" :page="page" :table-loading="loading" + :permission="permissionList" + selection + @size-change="search('size', ...arguments)" + @current-change="search('current', ...arguments)" @refresh-change="search" @search-change="search('search', ...arguments)" @search-reset="search('reset', ...arguments)" + @selection-change="selectionChange" > <template slot-scope="scope" slot="menuLeft"> <el-button type="primary" icon="el-icon-plus" size="small" + v-if="permissionList.addBtn" @click="openDialog('add', {})" >鏂板</el-button + > + <el-button + type="danger" + icon="el-icon-delete" + size="small" + @click="batchDel()" + v-if="selectedData.length > 0" + :loading="delLoading" + >鍒犻櫎</el-button > </template> <template slot-scope="{ row, index }" slot="menu"> @@ -23,6 +38,8 @@ type="text" icon="el-icon-edit" size="mini" + v-if="permissionList.editBtn" + :loading="row.editLoading" @click="openDialog('edit', row)" >缂栬緫</el-button > @@ -30,8 +47,20 @@ type="text" icon="el-icon-view" size="mini" + v-if="permissionList.openBtn" + :loading="row.detailLoading" @click="openDialog('detail', row)" >棰勮</el-button + > + <el-button + class="btn_link_del" + type="text" + icon="el-icon-delete" + size="mini" + v-if="permissionList.delBtn" + :loading="row.delLoading" + @click="rowDel(row)" + >鍒犻櫎</el-button > </template></avue-crud > @@ -51,14 +80,20 @@ v-if="visible" class="cycle_flow" :type="type" - :chart-data="rowData.data || {}" + :chart-data="nodesEdgesData" :chart-data-node-items="flowChartNodeItems" :rowData="rowData" ref="vueFlowchartEditor" @save-data="save" /> <template #footer v-if="type !== 'detail'"> - <el-button type="primary" size="mini" @click="submit">淇濆瓨</el-button> + <el-button + type="primary" + size="mini" + @click="submit" + :loading="submitLoading" + >淇濆瓨</el-button + > <el-button type="" size="mini" @click="visible = false">鍙栨秷</el-button> </template> </el-dialog> @@ -68,6 +103,7 @@ <script> import API from "@/api/modeling/cycle"; import CycleFlow from "@/components/flow-cycle/flowchartEditor.vue"; +import {mapGetters} from "vuex"; export default { name: "cycle.vue", components: { CycleFlow }, @@ -78,10 +114,15 @@ pageSize: 10, total: 0, currentPage: 1, - layout: "total, sizes, prev, pager, next, jumper" + layout: "total, sizes, prev, pager, next, jumper", }, option: { - searchMenuSpan: 12, + height:'auto', + calcHeight:20, + columnBtn:false, + tip:false, + selection: true, + searchMenuSpan: 6, searchMenuPosition: "right", border: true, align: "center", @@ -94,6 +135,7 @@ { label: "缂栧彿", prop: "id", + search: true, }, { label: "鍚嶇О", @@ -102,7 +144,7 @@ }, { label: "璧峰鐘舵��", - prop: "startStatusName", + prop: "startStatus", search: true, }, { @@ -116,10 +158,25 @@ visible: false, flowChartNodeItems: [], rowData: {}, + nodesEdgesData: {}, dialogWidth: "50%", type: "detail", loading: false, + delLoading: false, + submitLoading: false, + selectedData: [], }; + }, + computed:{ + ...mapGetters(["permission"]), + permissionList(){ + return{ + addBtn: this.vaildData(this.permission.modeling_cycle.cycle_add,false), + delBtn: this.vaildData(this.permission.modeling_cycle.cycle_delete,false), + editBtn: this.vaildData(this.permission.modeling_cycle.cycle_edit,false), + openBtn: this.vaildData(this.permission.modeling_cycle.cycle_open,false), + } + }, }, created() { this.search("search", {}); @@ -134,14 +191,18 @@ total: 0, currentPage: 1, }; + } else if (type === "size") { + this.page.pageSize = params; + } else if (type === "current") { + this.page.currentPage = params; } this.loading = true; - console.log( - Object.assign({}, params, this.page), - "Object.assign({}, params, this.page)" - ); - const { limit, page } = this.page; - API.getList(Object.assign({}, params, { limit, page })).then((res) => { + API.getList( + Object.assign({}, params, { + size: this.page.pageSize, + current: this.page.currentPage, + }) + ).then((res) => { this.loading = false; this.data = res.data.data.records; this.page.total = res.data.data.total; @@ -150,45 +211,146 @@ }); }, openDialog(type, row) { - if (type === "detail") { - this.title = "棰勮鐢熷懡鍛ㄦ湡娴佺▼鍥�"; - this.dialogWidth = "50%"; - } else if (type === "edit") { + this.type = type; + if (type === "edit") { + this.$set(row, "editLoading", true); this.title = "缂栬緫鐢熷懡鍛ㄦ湡娴佺▼鍥�"; this.dialogWidth = "95%"; - } else if (type === "add") { + } else if (type === "detail") { + this.$set(row, "detailLoading", true); + this.title = "棰勮鐢熷懡鍛ㄦ湡娴佺▼鍥�"; + this.dialogWidth = "50%"; + } + if (type !== "add") { + API.detail({ id: row.id }).then((res) => { + this.$set(row, "detailLoading", false); + this.$set(row, "editLoading", false); + this.rowData = row; + const nodes = res.data.data.nodes.map((item) => { + item.label = item.id; + item.index = item.indexNum; + item.x = Number(item.x); + item.y = Number(item.y); + return item; + }); + const edges = res.data.data.edges.map((item) => { + item.label = item.name; + item.width = 80; + item.height = 48; + item.index = 1; + item.index = item.indexNum; + return item; + }); + this.nodesEdgesData = { nodes, edges }; + this.visible = true; + console.log('nodesEdgesData',this.nodesEdgesData) + }); + } else { + this.nodesEdgesData = {}; + this.rowData = {}; this.title = "鏂板鐢熷懡鍛ㄦ湡娴佺▼鍥�"; this.dialogWidth = "95%"; + this.visible = true; } - this.type = type; - this.rowData = row; - this.visible = true; + }, + // 閫変腑鏁版嵁 + selectionChange(selectedData) { + this.selectedData = selectedData; + }, + // 鍒犻櫎 + rowDel(row) { + this.$confirm("纭鍒犻櫎璇ユ潯鏁版嵁?", "鎻愮ず", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning", + }).then(() => { + this.$set(row, "delLoading", true); + API.del({ oid: row.oid, id: row.id }) + .then((res) => { + this.$set(row, "delLoading", false); + if (res.data.code === 200) { + this.$message.success("鍒犻櫎鎴愬姛锛�"); + this.search(); + } + }) + .catch(() => { + this.$set(row, "delLoading", false); + }); + }); + }, + batchDel() { + this.$confirm("纭鍒犻櫎鎵�閫夋暟鎹�?", "鎻愮ず", { + confirmButtonText: "纭畾", + cancelButtonText: "鍙栨秷", + type: "warning", + }).then(() => { + const data = this.selectedData.map((item) => { + return { + id: item.id, + oid: item.oid, + }; + }); + this.delLoading = true; + API.del(data, true) + .then((res) => { + this.delLoading = false; + if (res.data.code === 200) { + this.$message.success("鍒犻櫎鎴愬姛锛�"); + this.search(); + } + }) + .catch(() => { + this.delLoading = false; + }); + }); }, async submit() { const newRowData = await this.$refs.vueFlowchartEditor.getNewRowData(); - console.log(newRowData, 'newRowDatanewRowData'); if (!newRowData) { return; } - const flowData = this.$refs.vueFlowchartEditor.getFlowData(); - let params = { - ...flowData, - ...newRowData + // const edgeEvents = this.$refs.vueFlowchartEditor.getEdgesEvents(); + const flowData = await this.$refs.vueFlowchartEditor.getFlowData(); + if (Array.isArray(flowData.nodes)) { + flowData.nodes = flowData.nodes.map((item) => { + item.name = item.id; + item.indexNum = item.index; + return item; + }); } - console.log(flowData, newRowData); - API.add(params).then(res => { - console.log(res, 'res'); - }) - }, - }, - watch: { - page: { - deep: true, - immediate: true, - handler(newV) { - this.page.page = newV.currentPage; - this.page.limit = newV.pageSize; - }, + if (Array.isArray(flowData.edges)) { + flowData.edges = flowData.edges.map((item) => { + item.name = item.label; + item.indexNum = item.index; + // item.events = edgeEvents[item.id] || []; + return item; + }); + } + let params = { + ...newRowData, + ...flowData, + }; + + this.submitLoading = true; + let APIFun = API.add; + if (this.type === "edit") { + APIFun = API.edit; + // this.$delete(params, "id"); + } + APIFun(params) + .then((res) => { + this.submitLoading = false; + if (res.data.code === 200) { + this.$message.success( + this.type === "edit" ? "淇敼鎴愬姛锛�" : "鏂板鎴愬姛锛�" + ); + this.visible = false; + this.search(); + } + }) + .catch(() => { + this.submitLoading = false; + }); }, }, }; @@ -205,4 +367,7 @@ margin: 0; padding: 0; } +.btn_link_del { + color: red; +} </style> -- Gitblit v1.9.3