工艺路线，工序行为更新

Ben Lin

2024-06-15 45a3c06adfa25476b91acdce7bb1b73c05e675c6

工艺路线，工序行为更新

 src/api/tigerapi/model/router.ts

@@ -94,17 +94,18 @@
  ACT_NAME: string;
  ROT_ID: string;
  NODE_ID: string;
  // OPER_CODE: string;
  ACT_CODE: string;
  ACT_TYPE: number;
  GPH_TYPE: string;
  GPH_X: number;
  GPH_Y: number;
  GPH_PROP: string;
  GPH_TEXT: string;
  DO_TYPE: number;
  DO_METHOD: string;
  DO_IF_PASS: string;
  DO_IF_FAIL: string;
  NEED_SETUP: number;
  // DO_TYPE: number;
  // DO_METHOD: string;
  // DO_IF_PASS: string;
  // DO_IF_FAIL: string;
  IS_ACTIVE: string;
  // RULE_CODE: string;
  // ITEM_CODE: string;

 src/components/FlowChart/src/AssemblyNode.ts

@@ -53,7 +53,7 @@
class AssemblyNodeModel extends RectNodeModel {
  override setAttributes() {
    const size = this.properties.scale || 1;
    this.width = 100 * size;
    this.width = 110 * size;
    this.height = 80 * size;
  }
  override getTextStyle() {

 src/components/FlowChart/src/CollectNode.ts

@@ -49,7 +49,7 @@
class CollectNodeModel extends RectNodeModel {
  override setAttributes() {
    const size = this.properties.scale || 1;
    this.width = 100 * size;
    this.width = 110 * size;
    this.height = 80 * size;
  }
  override getTextStyle() {

 src/components/FlowChart/src/PackingNode.ts

@@ -61,7 +61,7 @@
class PackingNodeModel extends RectNodeModel {
  override setAttributes() {
    const size = this.properties.scale || 1;
    this.width = 100 * size;
    this.width = 110 * size;
    this.height = 80 * size;
  }
  override getTextStyle() {

 src/components/FlowChart/src/RepairNode.ts

@@ -57,7 +57,7 @@
class RepairNodeModel extends RectNodeModel {
  override setAttributes() {
    const size = this.properties.scale || 1;
    this.width = 100 * size;
    this.width = 110 * size;
    this.height = 80 * size;
  }
  override getTextStyle() {

 src/components/FlowChart/src/TestNode.ts

@@ -1,3 +1,11 @@
/*
 * @Description: file content
 * @Author: your name
 * @version: 
 * @Date: 2024-05-01 15:45:42
 * @LastEditors: your name
 * @LastEditTime: 2024-06-15 18:16:47
 */
import { RectNode, RectNodeModel, h } from '@logicflow/core';

class TestNodeView extends RectNode {
@@ -49,7 +57,7 @@
class TestNodeModel extends RectNodeModel {
  override setAttributes() {
    const size = this.properties.scale || 1;
    this.width = 100 * size;
    this.width = 110 * size;
    this.height = 80 * size;
  }
  override getTextStyle() {

 src/components/FlowChart/src/actionRect.ts

@@ -1,10 +1,18 @@
/*
 * @Description: file content
 * @Author: your name
 * @version: 
 * @Date: 2024-04-30 14:35:47
 * @LastEditors: your name
 * @LastEditTime: 2024-06-15 18:15:59
 */
import { RectNode, RectNodeModel } from '@logicflow/core';

class CustomRectNode extends RectNode {}

class CustomRectModel extends RectNodeModel {
  override setAttributes() {
    this.width = 80;
    this.width = 120;
    this.height = 40;
    this.radius = 20;
  }

 src/views/tigerprojects/mes/eng/route/components/ActionItemProps.vue

@@ -1,94 +1,64 @@
<!--
 * @Description: file content
 * @Author: your name
 * @version: 
 * @Date: 2024-05-01 17:18:49
 * @LastEditors: your name
 * @LastEditTime: 2024-06-15 21:24:19
-->
<!--
 * @Description: 表单项属性，控件属性面板
-->
<template>
  <div class="properties-content">
    <Form class="properties-body" label-align="left" layout="vertical">
      <FormItem label="工艺路线编码" name="工艺路线编码">
        <Input
          :style="{ width: '100%' }"
          v-model:value="mesRoute.ROT_CODE"
          :min="0"
          :step="1"
          :readonly="true"
        />
        <Input :style="{ width: '100%' }" v-model:value="mesRoute.ROT_CODE" :min="0" :step="1" :readonly="true" />
      </FormItem>
      <FormItem label="节点ID" name="节点ID">
        <Input
          :style="{ width: '100%' }"
          v-model:value="routeConfig.currentAct.NODE_ID"
          :min="0"
          :step="1"
          :readonly="true"
        />
        <Input :style="{ width: '100%' }" v-model:value="routeConfig.currentAct.NODE_ID" :min="0" :step="1"
          :readonly="true" />
      </FormItem>
      <FormItem label="行为名称" name="行为名称">
        <Input :style="{ width: '100%' }" v-model:value="routeConfig.currentAct.ACT_NAME" :min="0" :step="1" />
      </FormItem>
      <FormItem label="行为类型" name="行为类型">
        <ApiSelect
          :api="GetEnum"
          :params="{ name: 'MES_ROUTE_NODE_ACT+ACT_TYPEs' }"
          v-model:value="routeConfig.currentAct.ACT_TYPE"
          resultField="Data"
          :label-field="actTypeLable"
          valueField="Value"
          placeholder="请选择行为类型"
        />
      </FormItem>
      <FormItem label="自定义方法类型" name="自定义方法类型">
        <ApiSelect
          :api="GetEnum"
          :params="{ name: 'MES_ROUTE_NODE_ACT+DO_TYPEs' }"
          v-model:value="routeConfig.currentAct.DO_TYPE"
          resultField="Data"
          :label-field="actTypeLable"
          valueField="Value"
          placeholder="请选择行为类型"
        />
        <ApiSelect :api="GetEnum" :params="{ name: 'MES_ROUTE_NODE_ACT+ACT_TYPEs' }"
          v-model:value="routeConfig.currentAct.ACT_TYPE" resultField="Data" :label-field="actTypeLable"
          valueField="Value" placeholder="请选择行为类型" />
      </FormItem>
      <FormItem label="自定义方法(调用方法的全名)" name="自定义方法">
        <Input
          :style="{ width: '100%' }"
          v-model:value="routeConfig.currentAct.DO_METHOD"
          :min="0"
          :step="1"
        />
        <Input :style="{ width: '85%' }" v-model:value="routeConfig.currentAct.ACT_CODE" :min="0" :step="1" />
        <a-button class="mt-1 ml-1" size="small" @click="handleSelectItem(item)" preIcon="search|svg" />
        <NormalModal @register="registerItemAdd" @success="handleItemSuccess" />
      </FormItem>
      <FormItem label="通过时执行(调用方法的全名)" name="通过时执行">
        <Input
          :style="{ width: '100%' }"
          v-model:value="routeConfig.currentAct.DO_IF_PASS"
          :min="0"
          :step="1"
        />
      </FormItem>
      <FormItem label="失败时执行(调用方法的全名)" name="失败时执行">
        <Input
          :style="{ width: '100%' }"
          v-model:value="routeConfig.currentAct.DO_IF_FAIL"
          :min="0"
          :step="1"
        />
      <FormItem label="是否设置才能下发生产(Y/N)" name="是否设置才能下发生产(Y/N)">
        <Select ref="select" v-model:value="routeConfig.currentAct.NEED_SETUP" style="width: 150px"
          :options="needSetupOptions" />
      </FormItem>
      <FormItem label="是否启用" name="是否启用">
        <Select
          ref="select"
          v-model:value="routeConfig.currentAct.IS_ACTIVE"
          style="width: 120px"
          :options="options1"
        />
        <Select ref="select" v-model:value="routeConfig.currentAct.IS_ACTIVE" style="width: 150px"
          :options="options1" />
      </FormItem>
    </Form>
  </div>
</template>
<script lang="ts" setup>
  import { Select, Input, Form, FormItem } from 'ant-design-vue';
import { Select, Input, Form, FormItem, Tag } from 'ant-design-vue';
  import { useRouteDesignState } from '../hooks/useRouteDesignState';
import NormalModal from '/@/views/components/NormalModal.vue';
  import { SelectTypes } from 'ant-design-vue/es/select';
  import { ApiSelect } from '/@/components/Form/index';
  import { ref, unref, watch } from 'vue';
import { h, ref, unref, watch } from 'vue';
  import { useLocale } from '/@/locales/useLocale';
  import { GetEnum } from '/@/api/tigerapi/system';
import { useModal } from '/@/components/Modal';
import { useI18n } from '/@/hooks/web/useI18n';

  const { getLocale } = useLocale();
const { t } = useI18n();
const emit = defineEmits(['changeName']);
const [registerItemAdd, { openModal: openItemModal }] = useModal();
  const { routeConfig, mesRoute } = useRouteDesignState();
  const options1 = ref<SelectTypes['options']>([
    {
@@ -100,21 +70,114 @@
      label: '不启用',
    },
  ]);
const needSetupOptions = ref<SelectTypes['options']>([
  {
    value: 'Y',
    label: '必需设置可下发',
  },
  {
    value: 'N',
    label: '不设置可下发',
  },
]);
  const actTypeLable = unref(getLocale) == 'zh_CN' ? 'Desc' : 'Name';
  watch(
    () => routeConfig.currentAct,
    (newVal, oldVal) => {
      routeConfig.routeData.acts.forEach((r) => {
        if (r.ID == routeConfig.currentAct.ID) {
        if (r.ACT_NAME != newVal.ACT_NAME) {
          r.ACT_NAME = newVal.ACT_NAME;
          console.log(r.ACT_NAME, newVal.ACT_NAME);
          emit('changeName', { id: r.ID, val: r.ACT_NAME });
        }
          r.IS_ACTIVE = newVal.IS_ACTIVE;
          r.ACT_TYPE = newVal.ACT_TYPE;
          r.DO_TYPE = newVal.DO_TYPE;
          r.DO_METHOD = newVal.DO_METHOD;
          r.DO_IF_PASS = newVal.DO_IF_PASS;
          r.DO_IF_FAIL = newVal.DO_IF_FAIL;
        r.ACT_CODE = newVal.ACT_CODE;
        r.NEED_SETUP = newVal.NEED_SETUP;
        // r.DO_TYPE = newVal.DO_TYPE;
        // r.DO_METHOD = newVal.DO_METHOD;
        // r.DO_IF_PASS = newVal.DO_IF_PASS;
        // r.DO_IF_FAIL = newVal.DO_IF_FAIL;
        }
      });
    },
    { deep: true, immediate: true },
  );

function handleSelectItem(item) {
  openItemModal(true, {
    title: '工序行为定义',
    schemas: [
      {
        field: 'ACT_CODE',
        component: 'Input',
        label: '行为编码',
        colProps: {
          span: 12,
        },
      },
    ],
    ItemColumns: [
      {
        title: t('行为编码'),
        dataIndex: 'ACT_CODE',
        resizable: true,
        sorter: true,
        width: 100,
      },
      {
        title: t('行为名称'),
        dataIndex: 'ACT_NAME',
        resizable: true,
        sorter: true,
        width: 100,
      },
      {
        title: t('行为类型'),
        dataIndex: 'ACT_TYPE',
        resizable: true,
        sorter: true,
        width: 100,
        customRender: ({ record }) => {
          const type = record.ACT_TYPE;
          var text = '';
          var color = 'green';
          switch (type) {
            case 0:
              text = '默认行为';
              break;
            case 1:
              color = 'blue';
              text = '扫码验证';
              break;
            case 2:
              color = 'orange';
              text = '组装上料';
              break;
            case 3:
              color = '#707070';
              text = '产品测试';
              break;
            case 4:
              color = '#5927be';
              text = '产品抽检';
              break;
            case 5:
              color = '#27beae';
              text = '标签打印';
              break;
          }
          return h(Tag, { color: color }, () => text);
        },
      },
    ],
    tableName: 'MES_CUSTOM_ACT',
    rowKey: 'ACT_CODE',
  });
}

function handleItemSuccess(d, u) {
  routeConfig.currentAct.ACT_CODE = d.values['val']
}
</script>

 src/views/tigerprojects/mes/eng/route/components/FormItemProps.vue

@@ -5,47 +5,20 @@
  <div class="properties-content">
    <Form class="properties-body" label-align="left" layout="vertical">
      <FormItem label="工艺路线编码" name="工艺路线编码">
        <Input
          :style="{ width: '100%' }"
          v-model:value="mesRoute.ROT_CODE"
          :min="0"
          :step="1"
          :readonly="true"
        />
        <Input :style="{ width: '100%' }" v-model:value="mesRoute.ROT_CODE" :min="0" :step="1" :readonly="true" />
      </FormItem>
      <FormItem label="节点名称" name="节点名称">
        <Input
          :style="{ width: '100%' }"
          v-model:value="routeConfig.currentItem.NODE_NAME"
          :min="0"
          :step="1"
          :readonly="true"
        />
        <Input :style="{ width: '100%' }" v-model:value="routeConfig.currentItem.NODE_NAME" :min="0" :step="1" />
      </FormItem>
      <FormItem label="工段" name="工段">
        <Input
          :style="{ width: '100%' }"
          v-model:value="routeConfig.currentItem.SEGMENT"
          :min="0"
          :step="1"
        />
        <Input :style="{ width: '100%' }" v-model:value="routeConfig.currentItem.SEGMENT" :min="0" :step="1" />
      </FormItem>
      <FormItem label="工序编码" name="工序编码">
        <Input
          :style="{ width: '100%' }"
          v-model:value="routeConfig.currentItem.GPH_TYPE"
          :min="0"
          :step="1"
          :readonly="true"
        />
        <Input :style="{ width: '100%' }" v-model:value="routeConfig.currentItem.GPH_TYPE" :min="0" :step="1" />
      </FormItem>
      <FormItem label="是否启用" name="是否启用">
        <Select
          ref="select"
          v-model:value="routeConfig.currentItem.IS_ACTIVE"
          style="width: 120px"
          :options="options1"
        />
        <Select ref="select" v-model:value="routeConfig.currentItem.IS_ACTIVE" style="width: 120px"
          :options="options1" />
      </FormItem>
      <FormItem label="是否计算直通率" name="是否计算直通率">
        <Switch v-model:checked="routeConfig.isCalcFpy" />
@@ -70,6 +43,7 @@
  import { isNullOrUnDef } from '/@/utils/is';

  const { routeConfig, mesRoute } = useRouteDesignState();
const emit = defineEmits(['changeNodeName']);
  const options1 = ref<SelectTypes['options']>([
    {
      value: 'Y',
@@ -106,6 +80,10 @@
          }
          r.IS_ACTIVE = newVal[4].IS_ACTIVE;
          r.SEGMENT = newVal[4].SEGMENT;
        if (r.NODE_NAME != newVal[4].NODE_NAME) {
          r.NODE_NAME = newVal[4].NODE_NAME;
          emit('changeNodeName', { id: r.ID, val: r.NODE_NAME });
        }
        }
      });
    },

 src/views/tigerprojects/mes/eng/route/components/PropsPanel.vue

@@ -4,7 +4,7 @@
 * @version: 
 * @Date: 2024-04-28 15:15:22
 * @LastEditors: your name
 * @LastEditTime: 2024-06-13 08:50:47
 * @LastEditTime: 2024-06-15 20:26:08
-->
<!--
 * @Description: 右侧属性配置面板
@@ -16,8 +16,8 @@
        <FormProps />
      </TabPane>
      <TabPane :key="2" :tab="title">
        <FormItemProps v-if="IsOper" />
        <ActionItemProps v-if="!IsOper"  />
        <FormItemProps v-if="IsOper"  @changeNodeName="changeNodeName"/>
        <ActionItemProps v-if="!IsOper" @changeName="changeName"/>
      </TabPane>
      <TabPane :key="3" :tab="posttitle" >
        <PostProps ref="postProps" v-if="IsOper" />
@@ -42,6 +42,7 @@
  export interface IPropsPanel {
    changeTab: (key: ChangeTabKey) => void;
  }
  const emit = defineEmits(['changeName', 'changeNodeName']);
  const { routeConfig } = useRouteDesignState();
  const props = defineProps({
    IsOperation: Boolean,
@@ -82,6 +83,14 @@
      postProps.value?.reload();
    }
  }
  
  function changeName(e) {
    emit('changeName', e);
  }

  function changeNodeName(e) {
    emit('changeNodeName', e);
  }
</script>

<style lang="less" scoped>

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

@@ -9,7 +9,8 @@
        style="background: #fafafa; border-left: 1px solid #d9d9d9; padding: 10px"
        :zeroWidthTriggerStyle="{ 'margin-top': '-70px', 'background-color': 'gray' }">
        <PropsPanel ref="propsPanel" :activeKey="routeConfig.activeKey" :IsOperation="IsOperation" :title="title"
          :posttitle="posttitle" :colSlots="colSlots" :crudColSlots="crudColSlots" :entityName="entityName">
          :posttitle="posttitle" :colSlots="colSlots" :crudColSlots="crudColSlots" :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`"
@@ -40,6 +41,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';
@@ -133,7 +135,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) => {
@@ -204,13 +207,15 @@
            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,
            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,7 +242,7 @@
            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: isNullOrEmpty(nd.OPER_CODE)? n.type: nd.OPER_CODE,
@@ -399,7 +404,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}_0`,
      ROT_ID: currRoute.value.ID,
      SEGMENT: '',
      OPER_CODE: selectnode.value.type,
@@ -445,7 +450,8 @@
        AUTH_ORG: '',
        AUTH_PROD: '',
        AUTH_WH: '',
        ACT_NAME: `${routeConfig.routeData.route.ROT_CODE}_${selectnode.value.text.value}_0`,
        ACT_NAME: `${selectnode.value.text.value}_0`,
        ACT_CODE: '',
        ROT_ID: currRoute.value.ID,
        NODE_ID: '',
        ACT_TYPE: 0,
@@ -454,10 +460,11 @@
        GPH_Y: selectnode.value.y,
        GPH_PROP: JSON.stringify(selectnode.value.properties),
        GPH_TEXT: selectnode.value.text.value,
        DO_TYPE: 0,
        DO_METHOD: '',
        DO_IF_PASS: '',
        DO_IF_FAIL: '',
        NEED_SETUP: 0,
        // DO_TYPE: 0,
        // DO_METHOD: '',
        // DO_IF_PASS: '',
        // DO_IF_FAIL: '',
        IS_ACTIVE: '',
        OPTION_1: '',
        OPTION_2: '',
@@ -480,6 +487,7 @@
      AUTH_PROD: '',
      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,
@@ -488,10 +496,11 @@
      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,
      // 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: '',
@@ -501,6 +510,8 @@
      REMARK: '',
      node: {} as node,
    };
    const actModel = lf.getNodeModelById(selectnode.value.id);
    actModel.updateText(routeConfig.currentAct?.ACT_NAME);
  } else {
    //是工序
    IsOperation.value = false;
@@ -527,6 +538,8 @@
      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';
@@ -571,4 +584,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>