工艺路线更新

Ben Lin

2024-05-04 60716513758d24159223fdd5962b252b00565bc2

 src/views/tigerprojects/mes/eng/route/index.vue

@@ -59,7 +59,7 @@
  import { IRouteConfig } from './typings/v-form-component';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { useI18n } from '/@/hooks/web/useI18n';
  import { isNullOrEmpty } from '/@/utils/is';
  import { isNullOrEmpty, isNullOrUnDef } from '/@/utils/is';
  import { useRoute } from 'vue-router';
  import { useTabs } from '/@/hooks/web/useTabs';

@@ -78,6 +78,8 @@
    labelCol: {},
    wrapperCol: {},
    currentItem: {} as MES_ROUTE_NODE,
    currentAct: {} as MES_ROUTE_NODE_ACT,
    routeData: {} as RouteData,
    activeKey: 1,
  } as IRouteConfig);
  const currRoute = ref({} as MES_ROUTE);
@@ -91,135 +93,18 @@
  const currRotId = ref(route.params?.id);

  console.log(currRotId.value);
  // const demoData1 = ref({
  //   nodes: [
  //     {
  //       id: '5d82e943-477f-4313-aaff-a736d8caba74',
  //       type: 'rect',
  //       x: 340,
  //       y: 120,
  //       properties: {},
  //       text: {
  //         x: 340,
  //         y: 120,
  //         value: '测试工序',
  //       },
  //     },
  //     {
  //       id: '6e0c6714-69a7-4160-8bda-61f4e6d285dd',
  //       type: 'rect',
  //       x: 560,
  //       y: 120,
  //       properties: {},
  //       text: {
  //         x: 560,
  //         y: 120,
  //         value: '上料工序',
  //       },
  //     },
  //     {
  //       id: '80b2ee17-5a0e-4586-ba28-6ba59fcc0f59',
  //       type: 'rect',
  //       x: 340,
  //       y: 280,
  //       properties: {
  //         isReturn: true,
  //       },
  //       text: {
  //         x: 340,
  //         y: 280,
  //         value: '维修工序',
  //       },
  //     },
  //   ],
  //   edges: [
  //     {
  //       id: 'Flow_0p4u47c',
  //       type: 'bpmn:sequenceFlow',
  //       sourceNodeId: '5d82e943-477f-4313-aaff-a736d8caba74',
  //       targetNodeId: '6e0c6714-69a7-4160-8bda-61f4e6d285dd',
  //       startPoint: {
  //         x: 390,
  //         y: 120,
  //       },
  //       endPoint: {
  //         x: 510,
  //         y: 120,
  //       },
  //       properties: {},
  //       pointsList: [
  //         {
  //           x: 390,
  //           y: 120,
  //         },
  //         {
  //           x: 510,
  //           y: 120,
  //         },
  //       ],
  //     },
  //     {
  //       id: 'Flow_09tu4cm',
  //       type: 'bpmn:sequenceFlow',
  //       sourceNodeId: '5d82e943-477f-4313-aaff-a736d8caba74',
  //       targetNodeId: '80b2ee17-5a0e-4586-ba28-6ba59fcc0f59',
  //       startPoint: {
  //         x: 340,
  //         y: 160,
  //       },
  //       endPoint: {
  //         x: 340,
  //         y: 240,
  //       },
  //       properties: {},
  //       pointsList: [
  //         {
  //           x: 340,
  //           y: 160,
  //         },
  //         {
  //           x: 340,
  //           y: 240,
  //         },
  //       ],
  //     },
  //     {
  //       id: '22226ec4-9960-497d-93cb-6226a3f29b3d',
  //       type: 'custom-edge',
  //       sourceNodeId: '80b2ee17-5a0e-4586-ba28-6ba59fcc0f59',
  //       targetNodeId: '5d82e943-477f-4313-aaff-a736d8caba74',
  //       startPoint: {
  //         x: 351,
  //         y: 240,
  //       },
  //       endPoint: {
  //         x: 351,
  //         y: 160,
  //       },
  //       properties: {},
  //       pointsList: [
  //         {
  //           x: 351,
  //           y: 240,
  //         },
  //         {
  //           x: 351,
  //           y: 160,
  //         },
  //       ],
  //     },
  //   ],
  // });

  if (!isNullOrEmpty(currRotId.value)) {
    setTitle('设计：工艺路线' + currRotId.value);
  }

  async function init(lf) {
    //通过工艺路线ID获取图形数据，并渲染
    var _data = await getRouteData(currRotId.value);
    console.log('组件已挂载', _data);
    //工艺路线全信息，包括Node、Edge和Act
    routeConfig.routeData = _data.Data;
    if (_data.Data != null) {
      //工艺路线主信息
    currRoute.value = _data.Data.route;
      if (!isNullOrEmpty(currRotId.value)) {
        setTitle('设计：工艺路线-' + currRoute.value.ROT_CODE);
      }
    _data.Data.nodes.forEach((n) => {
      n.node.properties = JSON.parse(n.node.properties);
      routeData.value.nodes.push(n.node);
@@ -236,17 +121,10 @@
    console.log('init', unref(lf).getGraphData(), JSON.parse(JSON.stringify(routeData.value)));
    unref(lf).render(routeData.value);
  }
  }

  async function handleSave(lf) {
    console.log('handleSave', unref(lf).getGraphData().nodes[0]);
    if (isNullOrEmpty(currRoute.value.ROT_CODE)) {
      createErrorModal({
        title: t('未选择'),
        content: t('未选择工艺路线或者新增工艺路线'),
        getContainer: () => document.body,
      });
    } else {
      var _routeData: RouteData = {
  const GetRotData = (lf) => {
    var currRotData: RouteData = {
        route: {
          ID: currRoute.value.ID,
          CREATE_TIME: new Date(),
@@ -271,16 +149,20 @@
      var _nodes = unref(lf).getGraphData().nodes as node[];
      var _edges = unref(lf).getGraphData().edges as edge[];
      var _num = 1;
    const diffnodes = routeConfig.routeData.nodes.filter((itemA) =>
      _nodes.some((itemB) => itemB.id === itemA.ID),
    );
    routeConfig.routeData.acts = [];
      _nodes.forEach((n) => {
        if (n.properties.operType && n.properties.operType == 'Action') {
          var act: MES_ROUTE_NODE_ACT = {
            ID: n.id,
            CREATE_TIME: _routeData.route.CREATE_TIME,
          CREATE_TIME: routeConfig.routeData.route.CREATE_TIME,
            CREATE_USER: useUserStore().getUserInfo.userId as string,
            UPDATE_TIME: _routeData.route.UPDATE_TIME,
          UPDATE_TIME: routeConfig.routeData.route.UPDATE_TIME,
            UPDATE_USER: useUserStore().getUserInfo.userId as string,
            GHOST_ROW: false,
            ROT_ID: _routeData.route.ID,
          ROT_ID: routeConfig.routeData.route.ID,
            GPH_TYPE: n.type,
            GPH_X: n.x,
            GPH_Y: n.y,
@@ -295,19 +177,14 @@
            OPTION_3: '',
            OPTION_4: '',
            OPTION_5: '',
            ACT_NAME: `${_routeData.route.ROT_CODE}_${n.text.value}_${_num}`,
          ACT_NAME: `${routeConfig.routeData.route.ROT_CODE}_${n.text.value}_${_num}`,
            NODE_ID: '',
            ACT_TYPE: 0,
            DO_TYPE: 0,
            DO_METHOD: '',
            DO_IF_PASS: '',
            DO_IF_FAIL: '',
            RULE_CODE: '',
            ITEM_CODE: '',
            PROD_CODE: '',
            TEST_CODE: '',
            SAPL_CODE: '',
            LABEL_CODE: '',
          node: {} as node,
          };
          var pnode = [n];
          while (pnode[0].properties.operType == 'Action') {
@@ -317,17 +194,21 @@
              break;
            }
          }
          _routeData.acts.push(act);
        currRotData.acts.push(act);
        routeConfig.routeData.acts.push(act);
        } else {
        var _diffnodes = diffnodes.length > 0 ? diffnodes : routeConfig.routeData.nodes;
        _diffnodes.forEach((nd) => {
          if (nd.ID == n.id) {
          var node: MES_ROUTE_NODE = {
            ID: n.id,
            CREATE_TIME: _routeData.route.CREATE_TIME,
              CREATE_TIME: currRotData.route.CREATE_TIME,
            CREATE_USER: useUserStore().getUserInfo.userId as string,
            UPDATE_TIME: _routeData.route.UPDATE_TIME,
              UPDATE_TIME: currRotData.route.UPDATE_TIME,
            UPDATE_USER: useUserStore().getUserInfo.userId as string,
            GHOST_ROW: false,
            NODE_NAME: `${_routeData.route.ROT_CODE}_${n.text.value}_${_num}`,
            ROT_ID: _routeData.route.ID,
              NODE_NAME: `${currRotData.route.ROT_CODE}_${n.text.value}_${_num}`,
              ROT_ID: currRotData.route.ID,
            SEGMENT: '',
            OPER_CODE: '',
            GPH_TYPE: n.type,
@@ -335,39 +216,50 @@
            GPH_Y: n.y,
            GPH_PROP: JSON.stringify(n.properties),
            GPH_TEXT: n.text.value,
            IS_ACTIVE: 'Y',
            IS_CALC_FPY: 'N',
            CAN_SKIP: 'N',
            REMARK: '',
              IS_ACTIVE: nd.IS_ACTIVE,
              IS_CALC_FPY: nd.IS_CALC_FPY,
              CAN_SKIP: nd.CAN_SKIP,
              REMARK: nd.REMARK,
            AUTH_ORG: '',
            AUTH_PROD: '',
            AUTH_WH: '',
            IS_FIRST_NODE: 'N',
            IS_INPUT: '',
            IS_OUTPUT: '',
              IS_INPUT: nd.IS_INPUT,
              IS_OUTPUT: nd.IS_OUTPUT,
            OPTION_1: '',
            OPTION_2: '',
            OPTION_3: '',
            OPTION_4: '',
            OPTION_5: '',
              node: {} as node,
          };
            nd.GPH_TYPE = n.type;
            nd.GPH_PROP = JSON.stringify(n.properties);
            nd.GPH_TEXT = n.text.value;
            nd.GPH_X = n.x;
            nd.GPH_Y = n.y;
          if (unref(lf).getNodeIncomingNode(n.id).length == 0) {
            node.IS_FIRST_NODE = 'Y';
              nd.IS_FIRST_NODE = 'Y';
          }
          _routeData.nodes.push(node);
            currRotData.nodes.push(node);
          }
        });
        routeConfig.routeData.nodes = _diffnodes;
        }
        _num++;
      });
    routeConfig.routeData.edges = [];
      _edges.forEach((e) => {
        var edge: MES_ROUTE_EDGE = {
          ID: e.id,
          CREATE_TIME: _routeData.route.CREATE_TIME,
        CREATE_TIME: routeConfig.routeData.route.CREATE_TIME,
          CREATE_USER: useUserStore().getUserInfo.userId as string,
          UPDATE_TIME: _routeData.route.UPDATE_TIME,
        UPDATE_TIME: routeConfig.routeData.route.UPDATE_TIME,
          UPDATE_USER: useUserStore().getUserInfo.userId as string,
          GHOST_ROW: false,
          EDGE_NAME: `${_routeData.route.ROT_CODE}_${e.id}`,
          ROT_ID: _routeData.route.ID,
        EDGE_NAME: `${routeConfig.routeData.route.ROT_CODE}_${e.id}`,
        ROT_ID: routeConfig.routeData.route.ID,
          SRC_NODE: e.sourceNodeId,
          TGT_NODE: e.targetNodeId,
          GPH_TYPE: e.type,
@@ -387,13 +279,58 @@
          OPTION_3: '',
          OPTION_4: '',
          OPTION_5: '',
        edge: {} as edge,
        };
        _routeData.edges.push(edge);
      routeConfig.routeData.edges.push(edge);
      currRotData.edges.push(edge);
      });
      await SaveRouteData(_routeData);
    return currRotData;
  };

  /*
   *保存工艺路线事件
   */
  async function handleSave(lf) {
    console.log('handleSave', unref(lf).getGraphData().nodes[0]);
    if (isNullOrEmpty(currRoute.value.ROT_CODE)) {
      createErrorModal({
        title: t('未选择'),
        content: t('未选择工艺路线或者新增工艺路线'),
        getContainer: () => document.body,
      });
    } else {
      var hasError = false;
      unref(lf)
        .getGraphData()
        .nodes.forEach((n) => {
          if (
            unref(lf).getNodeIncomingEdge(n.id).length == 0 &&
            unref(lf).getNodeOutgoingEdge(n.id).length == 0
          ) {
            hasError = true;
          }
        });
      if (hasError) {
        createErrorModal({
          title: t('警告'),
          content: t('有节点未连线，请重新设计工艺路线再保存数据！'),
          getContainer: () => document.body,
        });
      } else {
        var action = await SaveRouteData(GetRotData(lf));
        if (action.IsSuccessed) {
          notification['success']({
            message: '操作成功',
            description: `保存工艺路线：${currRoute.value.ROT_CODE} 成功`,
          });
        }
      }
    }
  }

  /*
   *新增工艺路线弹出模态窗口事件
   */
  async function handleAddlf(lf) {
    // openDrawer(true, {
    //   isUpdate: false,
@@ -405,19 +342,36 @@
    });
  }

  function handleSelect(data) {
  /*
   *点击节点选中事件
   */
  function handleSelect(data, lf) {
    lf.graphModel.clearSelectElements();
    lf.graphModel.getNodeModelById(data.data.id).setSelected(true);
    selectnode.value = data.data;
    routeConfig.currentItem = {
    if (isNullOrUnDef(routeConfig.routeData)) {
      //先初始化routeData
      routeConfig.routeData = {};
      routeConfig.routeData.route = currRoute.value;
      routeConfig.routeData.nodes = [];
      routeConfig.routeData.edges = [];
      routeConfig.routeData.acts = [];
      //再返回具体数据
      routeConfig.routeData = GetRotData(lf);
    }
    var _node = routeConfig.routeData.nodes.filter((x) => x.ID == selectnode.value.id)[0];
    if (isNullOrUnDef(_node)) {
      _node = {
      ID: selectnode.value.id,
      CREATE_TIME: currRoute.value.CREATE_TIME,
      CREATE_USER: useUserStore().getUserInfo.userId as string,
      UPDATE_TIME: currRoute.value.UPDATE_TIME,
      UPDATE_USER: useUserStore().getUserInfo.userId as string,
      GHOST_ROW: false,
      NODE_NAME: 'N001',
        NODE_NAME: `${currRoute.value.ROT_CODE}_${selectnode.value.text.value}_0`,
      ROT_ID: currRoute.value.ID,
      SEGMENT: '',
      OPER_CODE: '',
        OPER_CODE: selectnode.value.type,
      GPH_TYPE: selectnode.value.type,
      GPH_X: selectnode.value.x,
      GPH_Y: selectnode.value.y,
@@ -427,22 +381,83 @@
      IS_CALC_FPY: 'N',
      CAN_SKIP: 'N',
      REMARK: '',
        AUTH_ORG: '',
        AUTH_PROD: '',
        AUTH_WH: '',
        IS_FIRST_NODE: '',
        IS_INPUT: '',
        IS_OUTPUT: '',
        OPTION_1: '',
        OPTION_2: '',
        OPTION_3: '',
        OPTION_4: '',
        OPTION_5: '',
        node: {} as node,
    };
      routeConfig.routeData.nodes.push(_node);
    }
    if (selectnode.value.properties.operType && selectnode.value.properties.operType == 'Action') {
      routeConfig.activeKey = 3;
    } else {
      routeConfig.currentItem = {
        ID: selectnode.value.id,
        CREATE_TIME: currRoute.value.CREATE_TIME,
        CREATE_USER: useUserStore().getUserInfo.userId as string,
        UPDATE_TIME: currRoute.value.UPDATE_TIME,
        UPDATE_USER: useUserStore().getUserInfo.userId as string,
        GHOST_ROW: false,
        NODE_NAME: _node.NODE_NAME ?? '',
        ROT_ID: currRoute.value.ID,
        SEGMENT: _node.SEGMENT,
        OPER_CODE: _node.OPER_CODE,
        GPH_TYPE: selectnode.value.type,
        GPH_X: selectnode.value.x,
        GPH_Y: selectnode.value.y,
        GPH_PROP: '',
        GPH_TEXT: selectnode.value.text.value,
        IS_ACTIVE: _node.IS_ACTIVE,
        IS_CALC_FPY: _node.IS_CALC_FPY,
        CAN_SKIP: _node.CAN_SKIP,
        IS_INPUT: _node.IS_INPUT,
        IS_OUTPUT: _node.IS_OUTPUT,
        REMARK: _node.REMARK,
      };
      routeConfig.isCalcFpy = _node.IS_CALC_FPY == 'Y';
      routeConfig.canSkip = _node.CAN_SKIP == 'Y';
      routeConfig.isInput = _node.IS_INPUT == 'Y';
      routeConfig.isOutput = _node.IS_OUTPUT == 'Y';

    console.log(routeConfig.currentItem);
    routeConfig.activeKey = 2;
    }
  }

  function handleSuccess(lfInstance) {
    unref(lfInstance).render({});
  }

  /*
   *点击画布事件
   */
  function clickBlank() {
    routeConfig.activeKey = 1;
  }

  /*
   *新增工艺路线成功后事件
   */
  async function modalSuccess(lfInstance, route) {
    unref(lfInstance).render({});
    currRoute.value = route;
    currRotId.value = currRoute.value.ID;
    setTitle('设计：工艺路线-' + currRoute.value.ROT_CODE);
    //先初始化routeData
    routeConfig.routeData = {};
    routeConfig.routeData.route = currRoute.value;
    routeConfig.routeData.nodes = [];
    routeConfig.routeData.edges = [];
    routeConfig.routeData.acts = [];
    //再返回具体数据
    routeConfig.routeData = GetRotData(unref(lfInstance));
  }
</script>