index.tsx
6.27 KB
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
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
import React, { useEffect, useState } from 'react';
import { Button, Card, ConfigProvider, Form, InputNumber, message, Row, Switch, Space } from 'antd';
import zhCN from 'antd/lib/locale-provider/zh_CN';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { getInfoApi, saveInfoApi, Result } from './api';
import './style.less';
import { history } from 'umi';
import { debounce } from 'lodash';
export default function CollectionFollowSetting() {
const [edit, setEdit] = useState(false);
const [loading, setLoading] = useState<boolean>(true);
const [confirmLoading, setConfirmLoading]= useState<boolean>(false);
const [form] = Form.useForm();
const [stageMinAssignCount, setStageMinAssignCount] = useState<number>(0);
const [dailyMinAssignCount, setDailyMinAssignCount] = useState<number>(0);
const [increaseCount, setIncreaseCount] = useState<number>(0);
const [checked, setChecked] = useState<boolean>(false);
useEffect(() => {
getInfo();
}, []);
const getInfo = () => {
getInfoApi().then(res => {
if (res.data) {
form.setFieldsValue({...res.data});
setDailyMinAssignCount(res.data?.dailyMinAssignCount || 0);
setStageMinAssignCount(res.data?.stageMinAssignCount || 0);
setIncreaseCount(res.data?.increaseCount || 0);
setChecked(res.data.onlineSaleShopAssignClue || false);
}
setLoading(false);
}).catch(error => {
message.error(error.message);
setLoading(false);
});
};
const onCancle = () => {
getInfo();
setEdit(false);
};
const onOk = async () => {
const params: any = await form.validateFields();
const _params: Result = {
exclusiveClueConvertRate: params.exclusiveClueConvertRate,
stageMinAssignCount,
dailyMinAssignCount,
increaseCount,
onlineSaleShopAssignClue: checked,
};
setConfirmLoading(true);
saveInfoApi(_params).then(res => {
message.success(res.result);
setEdit(false);
setConfirmLoading(false);
history.goBack();
}).catch(error => {
message.error(error.message);
setConfirmLoading(false);
});
};
return (
<PageHeaderWrapper title="暂停区域线索站岗分配资格">
<ConfigProvider locale={zhCN}>
<Card style={{paddingLeft: "60px", justifyContent: 'center'}} bordered={false} loading={loading}>
{/* <Spin> */}
<Form
labelCol={{ span: 2 }}
wrapperCol={{ span: 18 }}
form={form}
>
<Form.Item labelCol={{offset: 0}} label="区域站岗分配线索转化率标准" name="exclusiveClueConvertRate" labelAlign="right" rules={[{ required: true, message: '请输入' }]}>
<InputNumber
style={{width: '100%'}}
controls={false}
min={0}
max={100}
formatter={value => `${value}%`}
precision={2}
disabled={!edit}
parser={value => value?.replace('%', '')}
/>
</Form.Item>
<Form.Item labelCol={{offset: 2}} label=" " name="stageMinAssignCount" colon={false} labelAlign="right">
<span>{`(1)每阶段滚动判定，低于"区域站岗分配线索转化率标准"，下一阶段线索每日仅分配`}</span>
<InputNumber
controls={false}
min={0}
disabled={!edit}
value={stageMinAssignCount}
onChange={(e) => setStageMinAssignCount(e || 0)}
formatter={value => `${value}个`}
precision={0}
parser={value => value?.replace('个', '')}
/>
<br />
<span style={{color: "#F4333C"}}>（最低要求）；阶段：1～10号；11～20号；21～月末</span>
</Form.Item>
<Form.Item labelCol={{offset: 2}} className="feewee-settings-form-closeClue" label=" " colon={false}>
<Form.Item colon={false} name="dailyMinAssignCount">
<span>(2)从</span>
<InputNumber
controls={false}
value={dailyMinAssignCount}
onChange={(e) => setDailyMinAssignCount(e || 0)}
min={0}
disabled={!edit}
formatter={value => `${value}个`}
precision={0}
parser={value => value?.replace('个', '')}
/>
<span>线索起，当天区域站岗分配线索跟进数每增加</span>
</Form.Item>
<Form.Item colon={false} name="increaseCount">
<InputNumber
controls={false}
min={0}
value={increaseCount}
onChange={(e) => setIncreaseCount(e || 0)}
formatter={value => `${value}个`}
precision={0}
disabled={!edit}
parser={value => value?.replace('个', '')}
/>
<span>，低于{`"区域站岗分配线索转化率标准"`}，暂停当天资格；</span>
</Form.Item>
</Form.Item>
<Form.Item labelCol={{offset: 0}} label="网销门店是否参与区域线索站岗分配" name="onlineSaleShopAssignClue" labelAlign="right">
<Switch
disabled={!edit}
checked={checked}
checkedChildren="是"
unCheckedChildren="否"
size="default"
onChange={(e) => setChecked(e)}
/>
</Form.Item>
</Form>
<Row justify="space-around" align="middle">
<Space>
{
!edit ? <Button disabled={confirmLoading} type="default" onClick={() => setEdit(true)}>编辑</Button> : <Button disabled={confirmLoading} type="default" onClick={onCancle}>取消</Button>
}
<Button disabled={confirmLoading} loading={confirmLoading} type="primary" onClick={debounce(onOk, 380)}>确认</Button>
<Button disabled={confirmLoading} type="link" onClick={() => { history.goBack(); }}>返回上一级</Button>
</Space>
</Row>
{/* </Spin> */}
</Card>
</ConfigProvider>
</PageHeaderWrapper>
);
}