liu
3 天以前 91eff4781fa4142d1f62d30a0fa1de5cae424eaf
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
<script lang="ts" setup>
import type { VbenFormSchema } from '#/adapter/form';
import type { MesPdProjectApi } from '#/api/mes/pd/project';
 
import { computed, ref } from 'vue';
 
import { useVbenModal } from '#/packages/effects/common-ui/src';
 
import { message } from 'ant-design-vue';
 
import { useVbenForm } from '#/adapter/form';
import { auditPdProject } from '#/api/mes/pd/project';
 
const emit = defineEmits(['success']);
 
const pass = ref(true); // true=审核通过 / false=审核不通过
const rowData = ref<MesPdProjectApi.Project>();
const getTitle = computed(() => (pass.value ? '审核通过' : '审核不通过'));
 
const [Form, formApi] = useVbenForm({
  commonConfig: {
    componentProps: {
      class: 'w-full',
    },
    formItemClass: 'col-span-1',
    labelWidth: 90,
  },
  wrapperClass: 'grid-cols-1',
  layout: 'horizontal',
  schema: [],
  showDefaultActions: false,
});
 
/** 审核表单字段:不通过时必须填写原因 */
function useAuditSchema(): VbenFormSchema[] {
  return [
    {
      fieldName: 'reviewRemark',
      label: '审核意见',
      component: 'Textarea',
      formItemClass: 'col-span-1',
      componentProps: {
        rows: 3,
        placeholder: pass.value
          ? '请输入审核意见(可选)'
          : '请输入不通过原因(必填)',
      },
      rules: pass.value ? '' : 'required',
    },
  ];
}
 
const [Modal, modalApi] = useVbenModal({
  async onConfirm() {
    const { valid } = await formApi.validate();
    if (!valid) {
      return;
    }
    modalApi.lock();
    const values = await formApi.getValues();
    try {
      await auditPdProject(rowData.value!.id!, pass.value, values.reviewRemark);
      await modalApi.close();
      emit('success');
      message.success(pass.value ? '审核通过' : '已退回,可修改后重新提交');
    } finally {
      modalApi.unlock();
    }
  },
  async onOpenChange(isOpen: boolean) {
    if (!isOpen) {
      rowData.value = undefined;
      return;
    }
    const data = modalApi.getData<{
      pass: boolean;
      row: MesPdProjectApi.Project;
    }>();
    rowData.value = data.row;
    pass.value = data.pass;
    formApi.setState({ schema: useAuditSchema() });
    formApi.resetForm();
  },
});
</script>
 
<template>
  <Modal :title="getTitle" class="w-2/5">
    <div v-if="rowData" class="mx-4 mb-4 text-sm text-gray-600">
      <div>任务编码:{{ rowData.taskCode }}</div>
      <div>任务名称:{{ rowData.taskName }}</div>
      <div>产品名称:{{ rowData.productName }}</div>
    </div>
    <Form class="mx-4" />
  </Modal>
</template>