From 02dbaaa04bc443e860a715cf907bc0fb5c1a7da4 Mon Sep 17 00:00:00 2001 From: ludc Date: 星期二, 11 七月 2023 09:09:34 +0800 Subject: [PATCH] Merge branch 'master' of http://dev.vci-tech.com:1065/r/ubcs --- Source/UBCS-WEB/src/views/modeling/cycle.vue | 254 ++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 200 insertions(+), 54 deletions(-) diff --git a/Source/UBCS-WEB/src/views/modeling/cycle.vue b/Source/UBCS-WEB/src/views/modeling/cycle.vue index 4e3a4d6..3db8c4b 100644 --- a/Source/UBCS-WEB/src/views/modeling/cycle.vue +++ b/Source/UBCS-WEB/src/views/modeling/cycle.vue @@ -1,66 +1,212 @@ <template> - <div> - <p>鐢熷懡鍛ㄦ湡妯″瀷</p> - <el-button @click="tabs=!tabs">杞寲</el-button><br /><br /> - <avue-form @tab-click="handleTabClick" :option="option" v-model="form" @submit="handleSubmit"> - <template slot="group1Header"> - <h4>鑷畾涔夎〃澶�</h4> - </template> - </avue-form> - </div> + <basic-container class=""> + <avue-crud :data="data" :option="option" @refresh-change="search" :table-loading="loading"> + <template slot-scope="scope" slot="menuLeft"> + <el-button + type="primary" + icon="el-icon-plus" + size="small" + @click="openDialog('add', {})" + >鏂板</el-button + > + </template> + <template slot-scope="{ row, index }" slot="menu"> + <el-button + type="text" + icon="el-icon-edit" + size="mini" + @click="openDialog('edit', row)" + >缂栬緫</el-button + > + <el-button + type="text" + icon="el-icon-view" + size="mini" + @click="openDialog('detail', row)" + >棰勮</el-button + > + </template></avue-crud + > + <el-dialog + :visible="visible" + :width="dialogWidth" + :title="title" + append-to-body + :before-close="() => {visible = false}" + top="10vh" + > + <CycleFlow + v-if="visible" + class="cycle_flow" + :type="type" + :chart-data="rowData.data || {}" + :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="" size="mini" @click="visible = false">鍙栨秷</el-button> + </template> + </el-dialog> + </basic-container> </template> <script> +import API from '@/api/modeling/cycle' +import CycleFlow from "@/components/flow-cycle/flowchartEditor.vue"; export default { name: "cycle.vue", - data(){ - return{ - tabs:true, - form:{ - text:'鏂囨湰', - text1:'鏂囨湰1', - text2:'鏂囨湰2', - text3:'鏂囨湰3', + components: { CycleFlow }, + data() { + return { + form: { + page: 1, + limit: 10 }, - } - }, - computed:{ - option(){ - return{ - tabs:this.tabs, - tabsActive:2, - column: [{ - label: '鍐呭1', - prop: 'text1', - }], - group:[ + option: { + border: true, + align: "center", + menuAlign: "center", + menu: true, + delBtn: false, + editBtn: false, + addBtn: false, + column: [ { - icon:'el-icon-info', - label: '鍒嗙粍1', - prop: 'group1', - column: [{ - label: '鍐呭1', - prop: 'text1', - }] - },{ - icon:'el-icon-info', - label: '鍒嗙粍2', - prop: 'group2', - column: [{ - label: '閫夐」鍗�2', - prop: 'text2', - }, { - label: '閫夐」鍗�3', - prop: 'text3', - }] - } - ] + label: "缂栧彿", + prop: "id", + }, + { + label: "鍚嶇О", + prop: "name", + }, + { + label: "璧峰鐘舵��", + prop: "startStatusName", + }, + { + label: "鎻忚堪", + prop: "description", + }, + ], + }, + // data: [ + // { + // name: "鎴戞槸name", + // label: "鎴戞槸label", + // startState: "鎴戞槸startState", + // remark: "鎴戞槸remark", + // data: { + // nodes: [ + // { + // type: "node", + // size: "80*48", + // shape: "flow-rect", + // color: "#1890FF", + // label: "Auditing", + // x: 110.50303650877106, + // y: 59.22389408123915, + // id: "Auditing", + // index: 0, + // }, + // { + // type: "node", + // size: "80*48", + // shape: "flow-rect", + // color: "#1890FF", + // label: "Editing", + // x: 120.87992069414531, + // y: 156.76660542375714, + // id: "Editing", + // index: 1, + // }, + // { + // type: "node", + // size: "80*48", + // shape: "flow-rect", + // color: "#1890FF", + // label: "Released", + // x: 100.12615232339681, + // y: 252.2339399292003, + // id: "Released", + // index: 2, + // }, + // ], + // edges: [ + // { + // source: "Auditing", + // sourceAnchor: 1, + // target: "Released", + // targetAnchor: 1, + // }, + // { + // source: "Editing", + // sourceAnchor: 3, + // target: "Auditing", + // targetAnchor: 3, + // }, + // ], + // }, + // }, + // ], + title: "棰勮鐢熷懡鍛ㄦ湡娴佺▼鍥�", + visible: false, + flowChartNodeItems: [], + rowData: {}, + dialogWidth: "50%", + type: "detail", + loading: false + }; + }, + created() { + this.search() + }, + methods: { + search() { + this.loading = true + API.getList(this.form).then(res => { + this.loading = false + this.data = res.data.data + }) + }, + openDialog(type, row) { + if (type === "detail") { + this.title = "棰勮鐢熷懡鍛ㄦ湡娴佺▼鍥�"; + this.dialogWidth = "50%"; + } else if (type === "edit") { + this.title = "缂栬緫鐢熷懡鍛ㄦ湡娴佺▼鍥�"; + this.dialogWidth = "95%"; + } else if (type === "add") { + this.title = "鏂板鐢熷懡鍛ㄦ湡娴佺▼鍥�"; + this.dialogWidth = "95%"; } - } - } -} + this.type = type; + this.rowData = row; + this.visible = true; + }, + async submit() { + const newRowData = await this.$refs.vueFlowchartEditor.getNewRowData(); + if (!newRowData) { + return; + } + const flowData = this.$refs.vueFlowchartEditor.getFlowData(); + console.log(JSON.stringify(flowData)); + }, + }, +}; </script> -<style scoped> - +<style lang="scss" scoped> +/deep/ .el-dialog__body { + padding: 0 20px; +} +.cycle_flow { + height: 600px !important; + display: flex; + flex-direction: column; + margin: 0; + padding: 0; +} </style> -- Gitblit v1.9.3