From 45a3c06adfa25476b91acdce7bb1b73c05e675c6 Mon Sep 17 00:00:00 2001
From: Ben Lin <maobin001@msn.com>
Date: 星期六, 15 六月 2024 21:28:24 +0800
Subject: [PATCH] 工艺路线,工序行为更新

---
 src/views/tigerprojects/mes/prod/biz_mes_wo/index.vue |  373 +++++++++++++++++++++++++++++++++++++++++++---------
 1 files changed, 307 insertions(+), 66 deletions(-)

diff --git a/src/views/tigerprojects/mes/prod/biz_mes_wo/index.vue b/src/views/tigerprojects/mes/prod/biz_mes_wo/index.vue
index 3da904a..acd731b 100644
--- a/src/views/tigerprojects/mes/prod/biz_mes_wo/index.vue
+++ b/src/views/tigerprojects/mes/prod/biz_mes_wo/index.vue
@@ -1,3 +1,11 @@
+<!--
+ * @Description: 宸ュ崟绠$悊椤甸潰
+ * @Author: Ben Lin
+ * @version: 
+ * @Date: 2024-05-25 00:27:00
+ * @LastEditors: Ben Lin
+ * @LastEditTime: 2024-06-10 23:54:01
+-->
 <template>
   <div>
     <BasicTable @register="registerTable">
@@ -62,41 +70,42 @@
     <Loading :loading="compState.loading" :tip="compState.tip" />
     <WoDrawer @register="registerDrawer" @success="handleSuccess" />
     <WoModal @register="registerWo" @success="handleSuccess" :title="title" :mtitle="mtitle" />
+    <!-- 鑷畾涔夋ā鎬佹锛屽彲浠ヨ嚜瀹氫箟澶氳〃鍗� -->
     <CustModal
       @register="registerCust"
-      @success="handleSuccess"
+      @success="custSuccess"
       :type="cType"
       :detailSlots="dtlSlots"
     >
+      <!-- 鐢ㄦ彃妲借嚜瀹氫箟澶氳〃鍗� -->
       <template #[item.name] v-for="item in dtlSlots" :key="item.name">
-        <BasicForm
-          :schemas="formSchema"
-          :ref="item.name"
-          :labelWidth="100"
-          :showActionButtonGroup="false"
-        >
-          <template #[sitem]="{ field }" v-for="sitem in item.slots" :key="sitem">
+        <BasicForm @register="useFormData[item.name][0]" v-if="useFormData[item.name]">
+          <!-- 鐢ㄦ彃妲借嚜瀹氫箟寮瑰嚭閫夋嫨妗� -->
+          <template #[name]="{ field }" v-for="name in item.slots" :key="name">
             <a-button
               class="mt-1 ml-1"
               size="small"
               @click="handleCustClick(field)"
-              :preIcon="item.preIcons[sitem]"
+              :preIcon="item.preIcons[name]"
+            />
+            <NormalModal
+              @register="useModalData[name][0]"
+              @success="(d, u) => handleEntSuccess(d, u, item.name)"
             />
           </template>
         </BasicForm>
-        <NormalModal
-          @register="registerEntity"
-          @success="(d, u) => handleEntSuccess(d, u, item.name)"
-        />
+        <!-- 鑷畾涔夊唴瀹� -->
+        <div style="height: 200px" id="lfContainer" v-if="isCustEl[item.name]"></div>
       </template>
     </CustModal>
     <RouteViewModal @register="registerRv" @success="RvItemSuccess" />
   </div>
 </template>
 <script lang="ts" setup>
-  import { reactive, unref, h, onMounted, ref, nextTick } from 'vue';
+  import { reactive, unref, h, onMounted, ref, nextTick, Ref } from 'vue';
+  import { Steps, Step, Layout, LayoutContent } from 'ant-design-vue';
   import { BasicTable, useTable, TableAction } from '/@/components/Table';
-  import { BasicForm, FormSchema, FormActionType, FormProps } from '/@/components/Form/index';
+  import { BasicForm, FormSchema, FormActionType, useForm } from '/@/components/Form/index';
   import WoDrawer from './WoDrawer.vue';
   import WoModal from './WoModal.vue';
   import NormalModal from '/@/views/components/NormalModal.vue';
@@ -109,24 +118,35 @@
   import { useMessage } from '/@/hooks/web/useMessage';
   import { useI18n } from '/@/hooks/web/useI18n';
   import { useModal } from '/@/components/Modal';
-  import { getListByPage } from '/@/api/tigerapi/system';
+  import { SaveEntity, getListByPage } from '/@/api/tigerapi/system';
   import { GetSelectSuccess, OpenSelectItem, getFormSchema } from '/@/views/components/data';
+  import LogicFlow from '@logicflow/core';
+  import { getRouteData } from '/@/api/tigerapi/mes/router';
+  import actionRect from '/@/components/FlowChart/src/actionRect';
+  import TestNode from '/@/components/FlowChart/src/TestNode';
+  import CollectNode from '/@/components/FlowChart/src/CollectNode';
+  import AssemblyNode from '/@/components/FlowChart/src/AssemblyNode';
+  import PackingNode from '/@/components/FlowChart/src/PackingNode';
+  import RepairNode from '/@/components/FlowChart/src/RepairNode';
+  import customEdge from '/@/components/FlowChart/src/customEdge';
+  import { BpmnElement } from '@logicflow/extension';
 
   const { t } = useI18n();
+  const ASteps = Steps;
+  const AStep = Step;
   const cType = ref('');
   const title = ref('宸ュ崟瀵煎叆');
-  const ctitle = ref('宸ュ崟涓嬪彂閰嶇疆');
   const mtitle = ref('宸ュ崟鍒楄〃');
   const dtlSlots = ref([] as any[]);
   const selectVals = ref({});
-  const { createMessage } = useMessage();
+  const { createMessage, createErrorModal } = useMessage();
   const [registerDrawer, { openDrawer }] = useDrawer();
   const compState = reactive({
     absolute: false,
     loading: false,
     tip: '鍔犺浇涓�...',
   });
-  const [registerEntity, { openModal: openEntModal }] = useModal();
+  const lfInstance = ref(null) as Ref<LogicFlow | null>;
   const [registerRv, { openModal: openRvModal }] = useModal();
   const [registerWo, { openModal: openWoModal }] = useModal();
   const [registerItemAdd, { openModal: openItemModal }] = useModal();
@@ -152,12 +172,63 @@
     bordered: true,
     showIndexColumn: false,
   });
+  const routeData = ref({
+    nodes: [],
+    edges: [],
+  });
   const formSchema = ref([] as FormSchema[]);
-  const woinfo = ref<Nullable<FormActionType>>(null);
-  const forminfo = ref<Nullable<FormActionType>>(null);
-  const prodinfo = ref<Nullable<FormActionType>>(null);
+  const woSchema = ref([] as FormSchema[]);
+  const prodSchema = ref([] as FormSchema[]);
+  const isCustEl = ref({
+    forminfo: false,
+    woinfo: false,
+    prodinfo: false,
+    rotinfo: true,
+  });
+  //琛ㄥ崟涓彃妲芥覆鏌撴寜閽墦寮�妯℃�佹useModal鏂规硶
+  const useModalData = ref({
+    add: useModal(),
+    set: useModal(),
+    addRot: useModal(),
+    setRot: useModal(),
+  });
+  //鑷畾涔夊琛ㄥ崟瀹炰緥
+  const useFormData = ref({
+    forminfo: useForm({
+      labelWidth: 120,
+      schemas: formSchema,
+      actionColOptions: {
+        span: 24,
+      },
+      showActionButtonGroup: false,
+    }),
+    woinfo: useForm({
+      labelWidth: 120,
+      schemas: woSchema,
+      actionColOptions: {
+        span: 24,
+      },
+      showActionButtonGroup: false,
+    }),
+    prodinfo: useForm({
+      labelWidth: 120,
+      schemas: prodSchema,
+      actionColOptions: {
+        span: 24,
+      },
+      showActionButtonGroup: false,
+    }),
+    // rotinfo: useForm({
+    //   labelWidth: 120,
+    //   schemas: rotSchema,
+    //   actionColOptions: {
+    //     span: 24,
+    //   },
+    //   showActionButtonGroup: false,
+    // }),
+  });
 
-  onMounted(() => {});
+  onMounted(async () => {});
 
   //鏂板
   function addWo() {
@@ -187,58 +258,142 @@
     cType.value = 'BIZ_MES_WO_Config';
     dtlSlots.value = [
       { name: 'woinfo', slots: [], preIcons: {}, title: '宸ュ崟淇℃伅' },
-      { name: 'prodinfo', slots: [], preIcons: {}, title: '浜у搧淇℃伅' },
+      {
+        name: 'prodinfo',
+        slots: ['addRot', 'setRot'],
+        preIcons: { addRot: 'search|svg', setRot: 'config|svg' },
+        title: '浜у搧淇℃伅',
+      },
+      { name: 'rotinfo', slots: ['add'], preIcons: { add: 'search|svg' }, title: '宸ヨ壓淇℃伅' },
     ];
-    formSchema.value = getFormSchema(cType.value);
+    woSchema.value = getFormSchema('woinfo');
+    prodSchema.value = getFormSchema('prodinfo');
+    // rotSchema.value = getFormSchema('rotinfo');
+    //宸ヨ壓璺嚎娓叉煋鍥惧垵濮嬪寲
+    if (lfInstance.value != null) {
+      routeData.value = {
+        nodes: [],
+        edges: [],
+      };
+      const lf = unref(lfInstance)!;
+      lf.render({});
+    }
+    selectVals.value['ROUTE_CODE'] = record.ROUTE_CODE;
     openCustModal(true, {
       isUpdate: true,
       ctype: cType,
       title: '宸ヨ壓閰嶇疆',
       width: '1000px',
+      formEl: useFormData.value, //濡傛灉鏄涓〃鍗曪紝澧炲姞澶氫釜鎻掓Ы
+      formElName: ['woinfo', 'prodinfo', 'rotinfo'], //琛ㄥ崟鎻掓Ы鍚嶇О锛屾敮鎸佸涓〃鍗�
       RowKey: '',
-      formEl: { woinfo: woinfo.value, prodinfo: prodinfo.value }, //濡傛灉鏄涓〃鍗曪紝澧炲姞澶氫釜鎻掓Ы
-      // preIcons: { add: 'search|svg', set: 'config|svg' },
-      // slots: ['add', 'set'], //缁欏脊鍑烘澧炲姞鎻掓Ы鏍囩鏁扮粍
-      ...record,
+      fnName: { BIZ_MES_WO_Config: 'SaveCofig' }, //淇濆瓨鏂规硶鍚�
+      initFnName: { BIZ_MES_WO_Config: 'initRoute' }, //鍒濆鍖栨柟娉曞悕
+      isCustEl: isCustEl.value,
+      others: routeData.value,
+      values: record, //琛ㄥ崟璁板綍
     });
   }
-  //涓嬪彂
+  
+  /**
+   * @description: 涓嬪彂
+   * @param {*} record
+   * @return {*}
+   */  
   function handleRelease(record: Recordable) {
+    if (record.STATUS == 2) {
+      createErrorModal({
+        title: t('璀﹀憡'),
+        content: t('宸ュ崟宸茬粡涓嬪彂锛屼笉鑳藉啀涓嬪彂锛�'),
+        getContainer: () => document.body,
+      });
+      return;
+    }
     cType.value = 'BIZ_MES_WO';
     dtlSlots.value = [
       {
         name: 'forminfo',
         slots: ['add', 'set'],
-        preIcons: { add: 'search|svg', set: 'config|svg' },
+        preIcons: { add: 'search|svg', set: 'config|svg' }, //濡傛灉鏄涓〃鍗曪紝澧炲姞澶氫釜鎻掓Ы銆俿lots鏄脊鍑烘鎸夐挳鐨勬彃妲斤紝preIcons鏄彃妲藉搴旂殑鎸夐挳鍥炬爣
         title: '涓嬪彂閰嶇疆',
       },
-    ]; //濡傛灉鏄涓〃鍗曪紝澧炲姞澶氫釜鎻掓Ы銆俿lots鏄脊鍑烘鎸夐挳鐨勬彃妲斤紝preIcons鏄彃妲藉搴旂殑鎸夐挳鍥炬爣
+    ];
     formSchema.value = getFormSchema(cType.value);
-    nextTick(() => {
-      setTimeout(() => {
-        openCustModal(true, {
-          isUpdate: true, //鏄惁鏇存柊鎿嶄綔
-          ctype: cType, //鏄摢涓〉闈�
-          title: '宸ュ崟涓嬪彂', //鏍囬
-          width: '900px', //寮瑰嚭妗嗗搴�
-          formEl: { forminfo: forminfo.value },
-          formElName: 'forminfo',
-          RowKeys: { add: 'ROUTE_CODE', set: 'ROUTE_CODE' }, //鎻掓Ы鐨勫脊鍑烘閫夋嫨鐨刢ode
-          ...record,
-        });
-      }, 100);
-      closeModal();
-      openCustModal(true, {});
+    openCustModal(true, {
+      isUpdate: true, //鏄惁鏇存柊鎿嶄綔
+      ctype: cType, //鏄摢涓〉闈�
+      title: '宸ュ崟涓嬪彂', //鏍囬
+      width: '900px', //寮瑰嚭妗嗗搴�
+      formEl: useFormData.value,
+      formElName: ['forminfo'], //琛ㄥ崟鎻掓Ы鍚嶇О
+      RowKeys: { add: 'ROUTE_CODE', set: 'ROUTE_CODE' }, //鎻掓Ы鐨勫脊鍑烘閫夋嫨鐨刢ode
+      fnName: { BIZ_MES_WO: 'SaveWoBatch' }, //淇濆瓨鏂规硶鍚�
+      initFnName: {}, //鍒濆鍖栨柟娉曞悕
+      isCustEl: isCustEl.value,
+      values: record, //琛ㄥ崟璁板綍
     });
   }
-  //鍙栨秷涓嬪彂
-  function handleUnRelease(record: Recordable) {}
+  
+  /**
+   * @description: 鍙栨秷涓嬪彂
+   * @param {*} record
+   * @return {*}
+   */  
+  function handleUnRelease(record: Recordable) {
+    if (record.STATUS == 0) {
+      createErrorModal({
+        title: t('璀﹀憡'),
+        content: t('宸ュ崟鏄垵濮嬪寲鐘舵�侊紝涓嶈兘鍙栨秷涓嬪彂锛�'),
+        getContainer: () => document.body,
+      });
+      return;
+    }
+    record.STATUS = 0;
+    SaveEntity(record, true, 'BIZ_MES_WO').then((action) => {
+      if (action.IsSuccessed) {
+        createMessage.success(t('宸插彇娑堜笅鍙�'));
+        reload();
+      } else {
+        createMessage.success(t('鍙栨秷涓嬪彂鎿嶄綔澶辫触'));
+      }
+    });
+  }
   //鏆傚仠
-  function handlePause(record: Recordable) {}
-  //鍒犻櫎
+  function handlePause(record: Recordable) {
+    if (record.STATUS == 0) {
+      createErrorModal({
+        title: t('璀﹀憡'),
+        content: t('宸ュ崟鏄垵濮嬪寲鐘舵�侊紝涓嶈兘鏆傚仠锛�'),
+        getContainer: () => document.body,
+      });
+      return;
+    }
+    if (record.STATUS == 5) {
+      createErrorModal({
+        title: t('璀﹀憡'),
+        content: t('宸ュ崟鏄畬鎴愮姸鎬侊紝涓嶈兘鏆傚仠锛�'),
+        getContainer: () => document.body,
+      });
+      return;
+    }
+    record.STATUS = 4;
+    SaveEntity(record, true, 'BIZ_MES_WO').then((action) => {
+      if (action.IsSuccessed) {
+        createMessage.success(t('宸叉殏鍋�'));
+        reload();
+      } else {
+        createMessage.success(t('鏆傚仠鎿嶄綔澶辫触'));
+      }
+    });
+  }
+  
+  /**
+   * @description: 鍒犻櫎
+   * @param {*} record
+   * @return {*}
+   */  
   function handleDelete(record: Recordable) {
-    const apiAction = DeleteMesWo(record.ID);
-    apiAction.then((action) => {
+    DeleteMesWo(record.ID).then((action) => {
       if (action.IsSuccessed) {
         createMessage.success(t('宸插垹闄�'));
         reload();
@@ -247,7 +402,20 @@
       }
     });
   }
-  //鐐瑰嚮鎵撳紑鐗╂枡鍒楄〃妗�
+  
+  /**
+   * @description: 寮瑰嚭妗嗙‘瀹氳繑鍥�
+   * @param {*} d
+   * @return {*}
+   */  
+  function custSuccess(d) {
+    reload();
+  }
+  
+  /**
+   * @description: 鐐瑰嚮鎵撳紑鐗╂枡鍒楄〃妗�
+   * @return {*}
+   */  
   function handleSelectItem() {
     openItemModal(true, {
       title: '鐗╂枡鍒楄〃',
@@ -282,32 +450,105 @@
     });
   }
 
+  /**
+   * @description: 寮瑰嚭閫夋嫨鐗╂枡妗嗚繑鍥炴垚鍔熸柟娉�
+   * @param {*} d
+   * @param {*} u
+   * @return {*}
+   */  
   function handleItemSuccess(d, u) {
     getForm().setFieldsValue({
       ITEM_CODE: d.values['val'],
     });
   }
-  /* 寮瑰嚭閫夋嫨妗嗛�夋嫨鎴愬姛鍚庝簨浠� */
+  
+  /**
+   * @description: 鍚勮〃鍗曞唴寮瑰嚭閫夋嫨妗嗛�夋嫨鎴愬姛鍚庢柟娉�
+   * @param {*} d
+   * @param {*} u
+   * @param {*} item
+   * @return {*}
+   */  
   function handleEntSuccess(d, u, item) {
     var values = GetSelectSuccess(d, u, cType.value);
     selectVals.value = values; //淇濆瓨寮瑰嚭妗嗛�夋嫨鐨勭粨鏋�
     let _val = {};
     _val[d.returnFieldName] = values[d.returnFieldName];
-    if (item == 'forminfo') {
-      forminfo.value.setFieldsValue(_val);
-    }
-    if (item == 'prodinfo') {
-      prodinfo.value.setFieldsValue(_val);
-    }
-    if (item == 'woinfo') {
-      woinfo.value.setFieldsValue(_val);
+    useFormData.value[item][1].setFieldsValue(_val);
+    if (d.returnFieldName == 'ROUTE_CODE' && cType.value == 'BIZ_MES_WO_Config') {
+      routeData.value = {
+        nodes: [],
+        edges: [],
+      };
+      init(selectVals.value['ROUTE_CODE']);
     }
   }
 
-  /* 寮瑰嚭閫夋嫨妗� */
+  /**
+   * @description: 寮瑰嚭閫夋嫨妗�
+   * @param {*} item
+   * @return {*}
+   */  
   function handleCustClick(item) {
-    // openRvModal(true, {});
-    OpenSelectItem(openEntModal, cType.value, item, [openRvModal], selectVals.value['ID']);
+    //鎵撳紑鑷畾涔夋ā鎬佹
+    OpenSelectItem(
+      useModalData.value[item][1].openModal, //甯﹀叆openModal鏂规硶
+      cType.value,
+      item,
+      [openRvModal],
+      selectVals.value['ROUTE_CODE'],
+    ); //[openRvModal], selectVals.value['ID']杩欐槸鑷畾涔夊弬鏁帮紝鎸夊疄闄呴渶姹�
   }
   function RvItemSuccess(d, u) {}
+
+  async function init(rotId) {
+    LogicFlow.use(BpmnElement);
+    lfInstance.value = new LogicFlow({
+      container: document.querySelector('#lfContainer'),
+      edgeGenerator: (sourceNode) => {
+        // console.log('a');
+        // 璧峰鑺傜偣绫诲瀷 rect 鏃朵娇鐢� 鑷畾涔夌殑杈� custom-edge
+        if (sourceNode.properties.isReturn) return 'custom-edge';
+        // if (sourceNode.type === 'rect') return 'custom-edge';
+        // return 'custom-edge';
+      },
+    });
+    const lf = unref(lfInstance)!;
+    // lf?.setDefaultEdgeType('line');
+    lf.register(customEdge);
+    lf.register(actionRect);
+    lf.register(TestNode);
+    lf.register(CollectNode);
+    lf.register(AssemblyNode);
+    lf.register(PackingNode);
+    lf.register(RepairNode);
+    lf.render({});
+    //閫氳繃宸ヨ壓璺嚎ID鑾峰彇鍥惧舰鏁版嵁锛屽苟娓叉煋
+    var _data = await getRouteData(rotId);
+    console.log('缁勪欢宸叉寕杞�', _data);
+    //宸ヨ壓璺嚎鍏ㄤ俊鎭紝鍖呮嫭Node銆丒dge鍜孉ct
+    // routeConfig.routeData = _data.Data;
+    if (_data.Data != null) {
+      //宸ヨ壓璺嚎涓讳俊鎭�
+      var currRoute = _data.Data.route;
+      _data.Data.nodes.forEach((n) => {
+        n.node.properties = JSON.parse(n.node.properties);
+        routeData.value.nodes.push(n.node);
+      });
+      console.log('111', routeData.value);
+      _data.Data.edges.forEach((e) => {
+        e.edge.properties = JSON.parse(e.edge.properties);
+        routeData.value.edges.push(e.edge);
+      });
+      _data.Data.acts.forEach((act) => {
+        act.node.properties = JSON.parse(act.node.properties);
+        routeData.value.nodes.push(act.node);
+      });
+      console.log('init', unref(lf).getGraphData(), JSON.parse(JSON.stringify(routeData.value)));
+      lf.render(routeData.value);
+      // lf.graphModel.resize(500, 400);
+      lf.graphModel.fitView();
+      lf.graphModel.translateCenter();
+    }
+  }
 </script>

--
Gitblit v1.9.3