Blame view

src/pages/procure/components/AddOrModifyDrawer.tsx 5.24 KB
1
import { RESPONSE_CODE } from '@/constants/enum';
2
3
import {
  postOrderErpOrderStagesUpload,
4
  postProcureReturnBillAddOrModify,
5
6
7
8
9
10
11
12
13
14
15
16
  postServiceConstStores,
} from '@/services';
import { enumToSelect } from '@/utils';
import {
  DrawerForm,
  ProFormSelect,
  ProFormText,
  ProFormTextArea,
  ProFormUploadDragger,
} from '@ant-design/pro-components';
import { Button, Form, message } from 'antd';
import { RcFile } from 'antd/es/upload';
17
export default ({ data, type, reloadTable }) => {
18
  const [form] = Form.useForm();
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
  const onfinish = async (values) => {
    const res = await postProcureReturnBillAddOrModify({
      data: values,
    });
    if (res.result === RESPONSE_CODE.SUCCESS) {
      message.success('新增成功');
      reloadTable();
      return true;
    }
    // 不返回不会关闭弹框
  };
  const optType = {
    add: {
      readOnly: false,
      title: '新增采购退货单',
      button: (
        <Button size={'small'} type="primary">
          新增
        </Button>
      ),
      onFinish: onfinish,
    },
    modify: {
      readOnly: false,
      title: '修改采购退货单',
      button: (
        <Button size={'small'} type="link">
          编辑
        </Button>
      ),
      onFinish: onfinish,
    },
    detail: {
      readOnly: true,
      title: '查看采购退货单',
      button: (
        <Button size={'small'} type="link">
          查看
        </Button>
      ),
      onFinish: () => {},
    },
  };
62
63
  return (
    <DrawerForm
64
      title={optType[type].title}
65
66
67
68
69
      resize={{
        onResize() {
          console.log('resize!');
        },
        maxWidth: window.innerWidth * 0.8,
70
        minWidth: 400,
71
72
      }}
      form={form}
73
      trigger={optType[type].button}
74
75
76
77
78
      autoFocusFirstInput
      drawerProps={{
        destroyOnClose: true,
      }}
      submitTimeout={2000}
79
      onFinish={optType[type].onFinish}
80
81
82
83
84
    >
      <ProFormText
        name="consignee"
        label="收货人"
        placeholder="请输入收货人"
85
86
        readonly={optType[type].readOnly}
        initialValue={data?.consignee}
87
88
89
90
91
92
93
94
95
96
97
        rules={[
          {
            required: true,
            message: '请输入收货人',
          },
        ]}
      />
      <ProFormText
        name="phoneNumber"
        label="联系电话"
        placeholder="请输入联系电话"
98
99
        initialValue={data?.phoneNumber}
        readonly={optType[type].readOnly}
100
101
102
103
104
105
106
107
108
109
110
        rules={[
          {
            required: true,
            message: '请输入联系电话',
          },
        ]}
      />
      <ProFormText
        name="address"
        label="收货地址"
        placeholder="请输入收货地址"
111
112
        initialValue={data?.address}
        readonly={optType[type].readOnly}
113
114
115
116
117
118
119
120
121
122
123
        rules={[
          {
            required: true,
            message: '请输入联系电话',
          },
        ]}
      />
      <ProFormTextArea
        name="productDetail"
        label="产品明细"
        placeholder="请输入产品明细"
124
125
        initialValue={data?.productDetail}
        readonly={optType[type].readOnly}
126
127
128
129
130
131
132
133
        rules={[
          {
            required: true,
            message: '请输入联系电话',
          },
        ]}
      ></ProFormTextArea>
      <ProFormSelect
134
        name="sendStoreCode"
135
136
137
138
139
        readonly={optType[type].readOnly}
        fieldProps={{
          labelInValue: false,
        }}
        initialValue={data ? data?.sendStoreCode + '' : null}
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
        label="发货仓库"
        request={async () => {
          const res = await postServiceConstStores();
          return enumToSelect(res.data);
        }}
        rules={[
          {
            required: true,
            message: '请输入联系电话',
          },
        ]}
      ></ProFormSelect>
      <ProFormTextArea
        name="notes"
        label="备注"
155
156
        initialValue={data?.notes}
        readonly={optType[type].readOnly}
157
158
159
160
161
162
        placeholder="请输入备注"
      ></ProFormTextArea>
      <ProFormUploadDragger
        label="附件"
        name="attachmentsFile"
        action="upload.do"
163
        hidden={optType[type].readOnly}
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
        onChange={(info) => {
          const uploadFile = async ({ fileList: newFileList }) => {
            if (newFileList.length > 0) {
              const formData = new FormData();
              formData.append('file', newFileList[0].originFileObj as RcFile);
              const res = await postOrderErpOrderStagesUpload({
                data: formData,
                headers: {
                  'Content-Type':
                    'multipart/form-data; boundary=----WebKitFormBoundarynl6gT1BKdPWIejNq',
                },
              });
              const url = res.data;
              console.log('attachments' + JSON.stringify(url));
              form.setFieldValue('attachments', url);
            } else {
              form.setFieldValue('attachments', null);
            }
          };
          uploadFile(info);
184
185
186
        }}
        max={1}
      />
187
188
189
190
191
192
193
194
195
      <a hidden={!optType[type].readOnly} href={data?.attachments} download>
        下载附件
      </a>
      <ProFormText
        initialValue={data?.attachments}
        name="attachments"
        hidden
      ></ProFormText>
      <ProFormText initialValue={data?.id} name="id" hidden></ProFormText>
196
197
198
    </DrawerForm>
  );
};