Ben Lin
2024-05-04 60716513758d24159223fdd5962b252b00565bc2
src/views/tigerprojects/mes/eng/route/components/FormItemProps.vue
@@ -3,52 +3,109 @@
-->
<template>
  <div class="properties-content">
    <div class="properties-body" v-if="itemProps">
      <Empty class="hint-box" v-if="!itemProps" description="未选择控件" />
      <Form v-else label-align="left" layout="vertical">
        <div v-for="item of baseFormItemProps" :key="item.name">
          <FormItem :label="item.label" v-if="showProps(item.exclude)">
            <component
              class="component-props"
              v-bind="item.componentProps"
              :is="item.component"
              v-model:value="formConfig.currentItem[item.name]"
            />
          </FormItem>
        </div>
      </Form>
    </div>
    <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"
        />
      </FormItem>
      <FormItem label="节点名称" name="节点名称">
        <Input
          :style="{ width: '100%' }"
          v-model:value="routeConfig.currentItem.NODE_NAME"
          :min="0"
          :step="1"
          :readonly="true"
        />
      </FormItem>
      <FormItem label="工段" name="节点名称">
        <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"
        />
      </FormItem>
      <FormItem label="是否启用" name="是否启用">
        <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" />
      </FormItem>
      <FormItem label="是否允许跳站" name="是否允许跳站">
        <Switch v-model:checked="routeConfig.canSkip" />
      </FormItem>
      <FormItem label="是否投入站" name="是否投入站">
        <Switch v-model:checked="routeConfig.isInput" />
      </FormItem>
      <FormItem label="是否产出站" name="是否产出站">
        <Switch v-model:checked="routeConfig.isOutput" />
      </FormItem>
    </Form>
  </div>
</template>
<script lang="ts" setup>
  import { computed, ref, watch } from 'vue';
  import { Empty, Input, Form, FormItem, Switch, Checkbox, Col } from 'ant-design-vue';
  import { Select, Switch, Input, Form, FormItem } from 'ant-design-vue';
  import { useRouteDesignState } from '../hooks/useRouteDesignState';
  import { SelectTypes } from 'ant-design-vue/es/select';
  import { ref, watch } from 'vue';
  import { isNullOrUnDef } from '/@/utils/is';
  const itemProps = ref(true);
  const baseFormItemProps = ref([]);
  // watch(
  //   () => formConfig.value,
  //   () => {
  //     if (formConfig.value.currentItem) {
  //       formConfig.value.currentItem.itemProps = formConfig.value.currentItem.itemProps || {};
  //       formConfig.value.currentItem.itemProps.labelCol =
  //         formConfig.value.currentItem.itemProps.labelCol || {};
  //       formConfig.value.currentItem.itemProps.wrapperCol =
  //         formConfig.value.currentItem.itemProps.wrapperCol || {};
  //     }
  //   },
  //   { deep: true, immediate: true },
  // );
  // const showProps = (exclude: string[] | undefined) => {
  //   if (!exclude) {
  //     return true;
  //   }
  //   return isArray(exclude) ? !exclude.includes(formConfig.value.currentItem!.component) : true;
  // };
  const { routeConfig, mesRoute } = useRouteDesignState();
  const options1 = ref<SelectTypes['options']>([
    {
      value: 'Y',
      label: '启用',
    },
    {
      value: 'N',
      label: '不启用',
    },
  ]);
  // const controlPropsList = computed(() => {
  //   return baseFormItemControlAttrs.filter((item) => {
  //     return showProps(item.exclude);
  //   });
  // });
  watch(
    [
      () => routeConfig.isCalcFpy,
      () => routeConfig.canSkip,
      () => routeConfig.isInput,
      () => routeConfig.isOutput,
    ],
    (newVal, oldVal) => {
      routeConfig.routeData.nodes.forEach((r) => {
        if (r.ID == routeConfig.currentItem.ID) {
          if (oldVal[0] != newVal[0] && !isNullOrUnDef(oldVal[0])) {
            r.IS_CALC_FPY = newVal[0] ? 'Y' : 'N';
          }
          if (oldVal[1] != newVal[1] && !isNullOrUnDef(oldVal[1])) {
            r.CAN_SKIP = newVal[1] ? 'Y' : 'N';
          }
          if (oldVal[2] != newVal[2] && !isNullOrUnDef(oldVal[2])) {
            r.IS_INPUT = newVal[2] ? 'Y' : 'N';
          }
          if (oldVal[3] != newVal[3] && !isNullOrUnDef(oldVal[3])) {
            r.IS_OUTPUT = newVal[3] ? 'Y' : 'N';
          }
        }
      });
    },
    { deep: true, immediate: true },
  );
</script>