Ben Lin
2024-07-24 50111114eb8254fe4d6fc15e9781f2c47e3db74a
src/views/tigerprojects/mes/eng/route/index.vue
@@ -16,11 +16,20 @@
        collapsible
        :reverseArrow="true"
        collapsedWidth="0"
        width="300"
        style="background: #fafafa; border-left: 1px solid #d9d9d9; padding: 10px"
        width="400"
        style="padding: 10px; border-left: 1px solid #d9d9d9; background: #fafafa"
        :zeroWidthTriggerStyle="{ 'margin-top': '-70px', 'background-color': 'gray' }"
      >
        <PropsPanel ref="propsPanel" :activeKey="routeConfig.activeKey">
        <PropsPanel
          ref="propsPanel"
          :activeKey="routeConfig.activeKey"
          :IsOperation="IsOperation"
          :title="title"
          :posttitle="posttitle"
          :entityName="entityName"
          @change-name="changeName"
          @change-node-name="changeNodeName"
        >
          <!-- <template v-for="item of formConfig.schemas" #[`${item.component}Props`]="data">
            <slot
              :name="`${item.component}Props`"
@@ -35,7 +44,7 @@
  </PageWrapper>
</template>
<script lang="ts" setup name="Route_View">
<script lang="ts" setup>
  import { FlowChart } from '/@/components/FlowChart';
  import { PageWrapper } from '/@/components/Page';
  import { SaveRouteData, getRouteData } from '/@/api/tigerapi/mes/router';
@@ -51,6 +60,7 @@
    MES_ROUTE_EDGE,
    MES_ROUTE_NODE_ACT,
    MES_ROUTE,
    nodeText,
  } from '/@/api/tigerapi/model/router';
  import { useUserStore } from '/@/store/modules/user';
  import RouteDrawer from './RouteDrawer.vue';
@@ -64,13 +74,15 @@
  import { useTabs } from '/@/hooks/web/useTabs';
  import LogicFlow from '@logicflow/core';
  defineOptions({ name: 'Route_View' });
  const { refreshPage } = useTabs();
  const [registerDrawer, { openDrawer }] = useDrawer();
  const [registerModal, { openModal }] = useModal();
  const { t } = useI18n();
  const route = useRoute();
  const { setTitle } = useTabs();
  const { notification, createErrorModal } = useMessage();
  const routeConfig = reactive({
  const routeConfig = reactive<IRouteConfig>({
    // 表单配置
    schemas: [],
    layout: 'horizontal',
@@ -82,19 +94,27 @@
    currentAct: {} as MES_ROUTE_NODE_ACT,
    routeData: {} as RouteData,
    activeKey: 1,
  } as IRouteConfig);
  });
  const currRoute = ref({} as MES_ROUTE);
  const routeData = ref({
    nodes: [],
    edges: [],
  });
  provide<Ref<IRouteConfig>>('routeConfig', routeConfig);
  provide<Ref<IRouteConfig>>('routeConfig', routeConfig as unknown as Ref<IRouteConfig>);
  provide<Ref<MES_ROUTE>>('mesRoute', currRoute);
  const selectnode = ref({} as node);
  const currRotId = ref(route.params?.id);
  const colSlots = ref<any>([]);
  const crudColSlots = ref<any>([]);
  const entityName = ref<any>('MES_POSITION');
  const props = defineProps({
    rotId: { type: String, default: '' },
  });
  const IsOperation = ref(false);
  const title = ref('');
  const posttitle = ref('');
  let _num = 1;
  let _numEdge = 1;
  watch(
    () => props.rotId,
    (v) => {
@@ -112,8 +132,16 @@
    },
    { deep: true },
  );
  const currlf = ref(null) as Ref<LogicFlow | null>;
  console.log(currRotId.value);
  onMounted(() => {});
  /**
   * @description: 工艺路线初始化
   * @param {*} lf
   * @return {*}
   */
  async function init(lf) {
    currlf.value = unref(lf);
    //通过工艺路线ID获取图形数据,并渲染
@@ -129,7 +157,8 @@
      }
      _data.Data.nodes.forEach((n) => {
        n.node.properties = JSON.parse(n.node.properties);
        routeData.value.nodes.push(n.node);
        n['node']['text']['value'] = n.NODE_NAME;
        routeData.value.nodes.push(n['node']);
      });
      console.log('111', routeData.value);
      _data.Data.edges.forEach((e) => {
@@ -160,7 +189,7 @@
        ROT_VER: currRoute.value.ROT_VER,
        IS_ACTIVE: currRoute.value.IS_ACTIVE,
        REMARK: currRoute.value.REMARK,
        AUTH_ORG: '',
        AUTH_ORG: useUserStore().getUserInfo.orgCode,
        AUTH_PROD: '',
        AUTH_WH: '',
      },
@@ -170,7 +199,6 @@
    };
    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),
    );
@@ -196,7 +224,7 @@
              GPH_PROP: JSON.stringify(n.properties),
              GPH_TEXT: n.text.value,
              REMARK: a.REMARK,
              AUTH_ORG: '',
              AUTH_ORG: useUserStore().getUserInfo.orgCode,
              AUTH_PROD: '',
              AUTH_WH: '',
              OPTION_1: '',
@@ -204,13 +232,16 @@
              OPTION_3: '',
              OPTION_4: '',
              OPTION_5: '',
              ACT_NAME: `${routeConfig.routeData.route.ROT_CODE}_${n.text.value}_${_num}`,
              ACT_NAME: isNullOrEmpty(a.ACT_NAME) ? `${n.text.value}_${_num}` : a.ACT_NAME,
              ACT_CODE: a.ACT_CODE,
              NEED_SETUP: a.NEED_SETUP,
              NEED_RESET: a.NEED_RESET,
              NODE_ID: a.NODE_ID,
              ACT_TYPE: a.ACT_TYPE,
              DO_TYPE: a.DO_TYPE,
              DO_METHOD: a.DO_METHOD,
              DO_IF_PASS: a.DO_IF_PASS,
              DO_IF_FAIL: a.DO_IF_FAIL,
              // DO_TYPE: a.DO_TYPE,
              // DO_METHOD: a.DO_METHOD,
              // DO_IF_PASS: a.DO_IF_PASS,
              // DO_IF_FAIL: a.DO_IF_FAIL,
              node: {} as node,
              IS_ACTIVE: a.IS_ACTIVE,
            };
@@ -237,10 +268,10 @@
              UPDATE_TIME: currRotData.route.UPDATE_TIME,
              UPDATE_USER: useUserStore().getUserInfo.userId as string,
              GHOST_ROW: false,
              NODE_NAME: `${currRotData.route.ROT_CODE}_${n.text.value}_${_num}`,
              NODE_NAME: isNullOrEmpty(nd.NODE_NAME) ? `${n.text.value}_${_num}` : nd.NODE_NAME,
              ROT_ID: currRotData.route.ID,
              SEGMENT: nd.SEGMENT,
              OPER_CODE: nd.OPER_CODE,
              OPER_CODE: isNullOrEmpty(nd.OPER_CODE) ? n.type : nd.OPER_CODE,
              GPH_TYPE: n.type,
              GPH_X: n.x,
              GPH_Y: n.y,
@@ -250,7 +281,7 @@
              IS_CALC_FPY: nd.IS_CALC_FPY,
              CAN_SKIP: nd.CAN_SKIP,
              REMARK: nd.REMARK,
              AUTH_ORG: '',
              AUTH_ORG: useUserStore().getUserInfo.orgCode,
              AUTH_PROD: '',
              AUTH_WH: '',
              IS_FIRST_NODE: 'N',
@@ -300,7 +331,7 @@
        GPH_PROP: JSON.stringify(e.properties),
        GPH_POTS: JSON.stringify(e.pointsList),
        REMARK: '',
        AUTH_ORG: '',
        AUTH_ORG: useUserStore().getUserInfo.orgCode,
        AUTH_PROD: '',
        AUTH_WH: '',
        EDGE_TYPE: 0,
@@ -313,6 +344,7 @@
      };
      routeConfig.routeData.edges.push(edge);
      currRotData.edges.push(edge);
      _numEdge++;
    });
    return currRotData;
  };
@@ -349,10 +381,7 @@
      } else {
        var action = await SaveRouteData(GetRotData(lf));
        if (action.IsSuccessed) {
          notification['success']({
            message: '操作成功',
            description: `保存工艺路线:${currRoute.value.ROT_CODE} 成功`,
          });
          await refreshPage();
        }
      }
    }
@@ -399,7 +428,7 @@
        UPDATE_TIME: currRoute.value.UPDATE_TIME,
        UPDATE_USER: useUserStore().getUserInfo.userId as string,
        GHOST_ROW: false,
        NODE_NAME: `${currRoute.value.ROT_CODE}_${selectnode.value.text.value}_0`,
        NODE_NAME: `${selectnode.value.text.value}_${_num}`,
        ROT_ID: currRoute.value.ID,
        SEGMENT: '',
        OPER_CODE: selectnode.value.type,
@@ -412,7 +441,7 @@
        IS_CALC_FPY: 'N',
        CAN_SKIP: 'N',
        REMARK: '',
        AUTH_ORG: '',
        AUTH_ORG: useUserStore().getUserInfo.orgCode,
        AUTH_PROD: '',
        AUTH_WH: '',
        IS_FIRST_NODE: '',
@@ -426,11 +455,57 @@
        node: {} as node,
      };
      routeConfig.routeData.nodes.push(_node);
      _num++;
    }
    //是行为
    if (selectnode.value.properties.operType && selectnode.value.properties.operType == 'Action') {
    if (
      selectnode.value.properties['operType'] &&
      selectnode.value.properties['operType'] == 'Action'
    ) {
      var _act = routeConfig.routeData.acts.filter((x) => x.ID == selectnode.value.id)[0];
      routeConfig.activeKey = 3;
      routeConfig.activeKey = 2;
      IsOperation.value = false;
      title.value = '行为';
      posttitle.value = '';
      if (isNullOrUnDef(_act)) {
        _act = {
          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,
          AUTH_ORG: useUserStore().getUserInfo.orgCode,
          AUTH_PROD: '',
          AUTH_WH: '',
          ACT_NAME: `${selectnode.value.text.value}_${_numEdge}`,
          ACT_CODE: '',
          ROT_ID: currRoute.value.ID,
          NODE_ID: '',
          ACT_TYPE: 0,
          GPH_TYPE: selectnode.value.type,
          GPH_X: selectnode.value.x,
          GPH_Y: selectnode.value.y,
          GPH_PROP: JSON.stringify(selectnode.value.properties),
          GPH_TEXT: selectnode.value.text.value,
          NEED_SETUP: 'Y',
          NEED_RESET: 'N',
          // DO_TYPE: 0,
          // DO_METHOD: '',
          // DO_IF_PASS: '',
          // DO_IF_FAIL: '',
          IS_ACTIVE: '',
          OPTION_1: '',
          OPTION_2: '',
          OPTION_3: '',
          OPTION_4: '',
          OPTION_5: '',
          REMARK: '',
          node: {} as node,
        };
        routeConfig.routeData.acts.push(_act);
        _numEdge++;
      }
      routeConfig.currentAct = {
        ID: selectnode.value.id,
        CREATE_TIME: currRoute.value.CREATE_TIME,
@@ -438,10 +513,11 @@
        UPDATE_TIME: currRoute.value.UPDATE_TIME,
        UPDATE_USER: useUserStore().getUserInfo.userId as string,
        GHOST_ROW: false,
        AUTH_ORG: '',
        AUTH_PROD: '',
        AUTH_WH: '',
        AUTH_ORG: _act.AUTH_ORG,
        AUTH_PROD: _act.AUTH_PROD,
        AUTH_WH: _act.AUTH_WH,
        ACT_NAME: _act.ACT_NAME,
        ACT_CODE: _act.ACT_CODE,
        ROT_ID: currRoute.value.ID,
        NODE_ID: _act.NODE_ID,
        ACT_TYPE: _act.ACT_TYPE,
@@ -450,10 +526,12 @@
        GPH_Y: selectnode.value.y,
        GPH_PROP: JSON.stringify(selectnode.value.properties),
        GPH_TEXT: selectnode.value.text.value,
        DO_TYPE: _act.DO_TYPE,
        DO_METHOD: _act.DO_METHOD,
        DO_IF_PASS: _act.DO_IF_PASS,
        DO_IF_FAIL: _act.DO_IF_FAIL,
        NEED_SETUP: _act.NEED_SETUP,
        NEED_RESET: _act.NEED_RESET,
        // DO_TYPE: _act.DO_TYPE,
        // DO_METHOD: _act.DO_METHOD,
        // DO_IF_PASS: _act.DO_IF_PASS,
        // DO_IF_FAIL: _act.DO_IF_FAIL,
        IS_ACTIVE: _act.IS_ACTIVE,
        OPTION_1: '',
        OPTION_2: '',
@@ -463,8 +541,11 @@
        REMARK: '',
        node: {} as node,
      };
      const actModel = lf.getNodeModelById(selectnode.value.id);
      actModel.updateText(routeConfig.currentAct?.ACT_NAME);
    } else {
      //是工序
      IsOperation.value = false;
      routeConfig.currentItem = {
        ID: selectnode.value.id,
        CREATE_TIME: currRoute.value.CREATE_TIME,
@@ -472,6 +553,9 @@
        UPDATE_TIME: currRoute.value.UPDATE_TIME,
        UPDATE_USER: useUserStore().getUserInfo.userId as string,
        GHOST_ROW: false,
        AUTH_ORG: _node.AUTH_ORG,
        AUTH_PROD: _node.AUTH_PROD,
        AUTH_WH: _node.AUTH_WH,
        NODE_NAME: _node.NODE_NAME ?? '',
        ROT_ID: currRoute.value.ID,
        SEGMENT: _node.SEGMENT,
@@ -488,13 +572,19 @@
        IS_OUTPUT: _node.IS_OUTPUT,
        REMARK: _node.REMARK,
      };
      const nodeModel = lf.getNodeModelById(selectnode.value.id);
      nodeModel.updateText(_node.NODE_NAME);
      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;
      setTimeout(() => {
        console.log(routeConfig.currentItem);
        routeConfig.activeKey = 2;
        IsOperation.value = true;
        title.value = '工序';
        posttitle.value = '岗位';
      }, 100);
    }
  }
@@ -507,6 +597,8 @@
   */
  function clickBlank() {
    routeConfig.activeKey = 1;
    title.value = '';
    posttitle.value = '';
  }
  /*
@@ -526,4 +618,25 @@
    //再返回具体数据
    routeConfig.routeData = GetRotData(unref(lfInstance));
  }
  /**
   * @description: 名称改变回调方法,返回后更新节点文本
   * @param {*} e
   * @return {*}
   */
  function changeName(e) {
    console.log(e.val);
    const nodeModel = unref(currlf)?.getNodeModelById(e.id);
    nodeModel?.updateText(e.val);
  }
  /**
   * @description: 名称改变回调方法,返回后更新节点文本
   * @param {*} e
   * @return {*}
   */
  function changeNodeName(e) {
    console.log(e.val);
    const nodeModel = unref(currlf)?.getNodeModelById(e.id);
    nodeModel?.updateText(e.val);
  }
</script>