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