办理

src/api/flow/index.js

@@ -79,3 +79,12 @@ export function flowList(type,params,isLoading = false) {
     isLoading
   })
 }
+
+//流转
+export function assign(flow_id, data) {
+ return request({
+   method: 'post',
+   url: `/api/oa/flow/assign/${flow_id}`,
+   data
+ })
+}

src/views/flow/components/assign.vue

@@ -2,8 +2,9 @@
   <div>
     <el-dialog
       :title="title"
+      width="920px"
       :visible.sync="visible"
-      fullscreen
+      :fullscreen="$store.getters.device === 'mobile'"
       append-to-body
       :show-close="false"
     >
@@ -29,7 +30,7 @@
           <div class="next-nodes__label">下一节点</div>
 
           <div>
-            <el-radio-group v-model="form.next_node_id">
+            <el-radio-group v-model="form.next_node_id" @change="pickUsers = node2Users.get(form.next_node_id)">
               <el-radio v-for="node in node.nextNodes" :label="node.id">{{ node.name }}</el-radio>
             </el-radio-group>
           </div>
@@ -41,12 +42,17 @@
           <div class="users__label">承办人员</div>
 
           <div>
-
+            <el-radio-group v-model="form.user_id">
+              <div v-for="group in pickUsers" :key="group.id">
+                <div class="group-name">{{ group.name }}</div>
+                <el-radio v-for="user in group.users" :label="user.id">{{ user.name }}</el-radio>
+              </div>
+            </el-radio-group>
           </div>
         </div>
       </div>
       <span slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="$emit('update:visible',false)"
+        <el-button type="primary" @click="submit"
           >确 定</el-button
         >
       </span>
@@ -55,7 +61,7 @@
 </template>
 
 <script>
-import { getNextNodeUsers } from "@/api/flow";
+import { getNextNodeUsers, assign } from "@/api/flow";
 
 export default {
   props: {
@@ -78,21 +84,34 @@ export default {
         next_node_id: "",
       },
 
-      node2Users: new Map()
+      node2Users: new Map(),
+      pickUsers: [],
     };
   },
   methods: {
     async getNextNodesUsers() {
       try {
-
-        const res = await Promise.all(this.node?.nextNodes?.map(node => getNextNodeUsers({
+        const nodeIds = this.node?.nextNodes?.map(node => node.id);
+        const res = await Promise.all(nodeIds.map(nodeId => getNextNodeUsers({
           id: this.result.id,
-          next_node_id: node.id,
+          next_node_id: nodeId,
         },false)));
-        console.log(res)
+
+        res.forEach((group, index) => {
+          this.node2Users.set(nodeIds[index], group.users)
+        })
       } catch (err) {
         console.error(err)
       }
+    },
+
+    async submit() {
+      try {
+        await assign(this.result.id, this.form)
+        this.$router.push("/flow/list");
+      } catch(err) {
+
+      }
     }
   },
   computed: {
@@ -104,14 +123,21 @@ export default {
     },
   },
   watch: {
-    node: {
-      handler:function (newVal) {
-        if(newVal && newVal.nextNodes && newVal.nextNodes?.length > 0) {
+    // node: {
+    //   handler:function (newVal) {
+    //     if(newVal && newVal.nextNodes && newVal.nextNodes?.length > 0) {
+    //       this.getNextNodesUsers()
+    //     }
+    //   },
+    //   immediate: true
+    // },
+    visible(newVal) {
+      if(newVal) {
+        if(this.node && this.node.nextNodes && this.node.nextNodes?.length > 0) {
           this.getNextNodesUsers()
         }
       }
-    },
-    immediate: true
+    }
   },
   created() {}
 };
@@ -126,5 +152,15 @@ export default {
     font-weight: 600;
     color: #666;
   }
+  .group-name {
+    font-weight: 600;
+    font-size: 13px;
+    color: #98a6ad;
+    line-height: 2;
+  }
+}
+.dialog-footer {
+  display: flex;
+  justify-content: center;
 }
 </style>

src/views/flow/create.vue

@@ -62,7 +62,7 @@
       </div>
     </el-card>
 
-    <assign ref="assign" :visible.sync="isShowAssign" :config="config"></assign>
+    <assign ref="assign" :visible.sync="isShowAssign" :config="config" :result="result"></assign>
 
     <el-backtop></el-backtop>
   </div>
@@ -73,7 +73,7 @@ import DesktopForm from "./DesktopForm.vue";
 import MobileForm from "./MobileForm.vue";
 import assign from "./components/assign.vue";
 import {create, fieldConfig, preConfig,} from "@/api/flow";
-import {deepCopy} from "@/utils";
+import { deepCopy } from "@/utils";
 
 export default {
   components: {
@@ -183,10 +183,6 @@ export default {
               break;
             case "assign":
               this.isShowAssign = true;
-              // await getNextNodeUsers({
-              //   id: res.id,
-              //   next_node_id: this.config?.currentNode?.nextNodes[0]?.id,
-              // });
               break;
           }
         } catch (err) {

src/views/flow/list.vue

@@ -82,9 +82,12 @@
             :custom-config="{ mode: 'popup' }"
             :data="list"
           >
-            <vxe-column field="name" title="Name"></vxe-column>
-            <vxe-column field="role" title="Role"></vxe-column>
-            <vxe-column field="sex" title="Sex"></vxe-column>
+            <vxe-column field="title" title="工作名称"></vxe-column>
+            <vxe-column width="80" align="center" field="id" title="流水号"></vxe-column>
+            <vxe-column field="custom_model.name" title="流程名称"></vxe-column>
+            <vxe-column width="200" align="center" field="created_at" title="发起日期" :formatter="({ cellValue }) => $moment(cellValue).format('YYYY-MM-DD HH:mm:ss')"></vxe-column>
+            <vxe-column width="100" align="center" field="status" title="当前状态"></vxe-column>
+
           </vxe-table>
 
           <el-pagination