工艺路线，工序行为更新

Ben Lin

2024-06-15 45a3c06adfa25476b91acdce7bb1b73c05e675c6

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

@@ -1,120 +1,183 @@
<!--
 * @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 { useRouteDesignState } from '../hooks/useRouteDesignState';
  import { SelectTypes } from 'ant-design-vue/es/select';
  import { ApiSelect } from '/@/components/Form/index';
  import { ref, unref, watch } from 'vue';
  import { useLocale } from '/@/locales/useLocale';
  import { GetEnum } from '/@/api/tigerapi/system';
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 { 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 { routeConfig, mesRoute } = useRouteDesignState();
  const options1 = 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) {
          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;
const { getLocale } = useLocale();
const { t } = useI18n();
const emit = defineEmits(['changeName']);
const [registerItemAdd, { openModal: openItemModal }] = useModal();
const { routeConfig, mesRoute } = useRouteDesignState();
const options1 = ref<SelectTypes['options']>([
  {
    value: 'Y',
    label: '启用',
  },
  {
    value: 'N',
    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 });
        }
      });
    },
    { deep: true, immediate: true },
  );
        r.IS_ACTIVE = newVal.IS_ACTIVE;
        r.ACT_TYPE = newVal.ACT_TYPE;
        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>