4 天以前 2271982de09628a04da06630c4ab690ef64fbfab
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
<script lang="ts" setup>
  import type { VbenFormSchema } from "#/adapter/form";
  import type { MesProBagCodeApi } from "#/api/mes/pro/bagCode";
 
  import { useVbenModal } from "@vben/common-ui";
  import { MesProBatchStatusEnum } from "@vben/constants";
 
  import { message } from "ant-design-vue";
 
  import { useVbenForm } from "#/adapter/form";
  import { generateBagCodes } from "#/api/mes/pro/bagCode";
  import { getBatchSimpleList } from "#/api/mes/pro/batch";
 
  defineOptions({ name: "MesProBagCodeGenerateForm" });
 
  const emit = defineEmits(["success"]);
 
  /** 构建表单(批次下拉选项由外部加载注入) */
  function buildSchema(batchOptions: { label: string; value: number }[]): VbenFormSchema[] {
    return [
      {
        fieldName: "batchId",
        label: "生产批次",
        component: "Select",
        componentProps: {
          options: batchOptions,
          optionFilterProp: "label",
          placeholder: "请选择生产中的批次",
          showSearch: true,
        },
        rules: "selectRequired",
      },
      {
        fieldName: "count",
        label: "生成袋数",
        component: "InputNumber",
        componentProps: {
          class: "!w-full",
          min: 1,
          placeholder: "请输入需要生成的袋码数量",
          precision: 0,
        },
        rules: "required",
      },
      {
        fieldName: "remark",
        label: "备注",
        component: "Textarea",
        componentProps: {
          placeholder: "请输入备注",
          rows: 2,
        },
      },
    ];
  }
 
  const [Form, formApi] = useVbenForm({
    commonConfig: {
      componentProps: {
        class: "w-full",
      },
      labelWidth: 100,
    },
    layout: "horizontal",
    schema: [],
    showDefaultActions: false,
  });
 
  const [Modal, modalApi] = useVbenModal({
    async onConfirm() {
      const { valid } = await formApi.validate();
      if (!valid) return;
      modalApi.lock();
      try {
        const values =
          (await formApi.getValues()) as MesProBagCodeApi.GenerateParams;
        await generateBagCodes(values);
        message.success(`已成功生成 ${values.count} 条袋码`);
        emit("success");
        await modalApi.close();
      } finally {
        modalApi.unlock();
      }
    },
    async onOpenChange(isOpen: boolean) {
      if (!isOpen) return;
      modalApi.lock();
      try {
        // 仅生产中的批次允许生成袋码
        const batches = await getBatchSimpleList();
        const options = batches
          .filter(
            (batch) => batch.status === MesProBatchStatusEnum.PRODUCING
          )
          .map((batch) => ({
            label: batch.code!,
            value: batch.id!,
          }));
        await formApi.setState({ schema: buildSchema(options) });
      } finally {
        modalApi.unlock();
      }
    },
  });
</script>
 
<template>
  <Modal title="生成袋码数据包" class="w-2/5">
    <Form class="mx-4" />
  </Modal>
</template>