Blame view

src/pages/cas/afterSaleConfiguration/manhoursProportionConfig/components/ConfigModal.tsx 2.78 KB
41800697   杜志良   feature: 新增门店机修组工...
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
  import React, { useState, useEffect } from "react";

  import "@ant-design/compatible/assets/index.css";

  import { Alert, Modal, Form, message, InputNumber } from "antd";

  import { ListResult, SaveParams, saveApi, Staff } from "../api";

  

  const FormItem = Form.Item;

  const maxFormProps = {

    labelCol: { span: 6 },

    wrapperCol: { span: 14 },

  };

  

  interface Props {

    visible: boolean;

    onCancel: () => any;

    detail?: ListResult;

  }

  

  export default function ConfigModal({ visible, onCancel, detail }: Props) {

    const [form] = Form.useForm();

    console.log("detail", detail);

  

    const [confirmLoading, setConfirmLoading] = useState<boolean>(false);

  

    useEffect(() => {

      if (visible) {

        form.resetFields();

        // init form values

        const initialValues: any = {};

        detail?.userInfoVOS?.forEach((user: Staff) => {

          initialValues[user.staffId] = user.manHoursProp;

        });

        form.setFieldsValue(initialValues);

      }

    }, [visible]);

  

    function handleSubmit(fieldsValue: any) {

      const configItems = detail!.userInfoVOS.map((user: Staff) => ({

        id: user.id,

        staffId: user.staffId,

        staffName: user.staffName,

        manHoursProp: fieldsValue[user.staffId],

      }));

      const sum = configItems.reduce((acc: number, cur: Staff) => acc + cur.manHoursProp, 0);

      if (sum !== 1) {

        message.error("所有人员分成占比之和必须等于1");

        return;

      }

  

      const params: SaveParams = {

        shopId: detail!.shopId,

        shopName: detail!.shopName,

        teamId: detail!.teamId,

        teamName: detail!.teamName,

        userInfoVOS: configItems,

      };

  

      setConfirmLoading(true);

      saveApi(params)

        .then(() => {

          message.success("配置成功!");

          setConfirmLoading(false);

          onCancel();

        })

        .catch((e) => {

          setConfirmLoading(false);

          message.error(e.message);

        });

    }

  

    return (

      <Modal

        title="配置机修组工时分成比例"

        width={640}

        open={visible}

        confirmLoading={confirmLoading}

        onOk={() => form.submit()}

        onCancel={onCancel}

      >

        <Alert message="每人分成占比以小数表示,所有人员分成占比之和必须等于1" type="info" style={{ marginBottom: 20 }} />

  

        <Form form={form} onFinish={handleSubmit}>

          {detail?.userInfoVOS?.map((user: Staff) => (

            <FormItem

              key={user.id}

              name={user.staffId}

              label={user.staffName}

              rules={[{ required: true, message: "必填" }]}

              {...maxFormProps}

            >

              <InputNumber style={{ width: 200 }} max={1} min={0} step={0.1} defaultValue={user.manHoursProp} />

            </FormItem>

          ))}

        </Form>

      </Modal>

    );

  }