|
@@ -9,17 +9,30 @@ import TelephoneFormItem from './TelephoneFormItem'
|
|
|
import { validateEnum } from '@/pages/Customer/Company/components/AddCompany/CompanyFormItem'
|
|
import { validateEnum } from '@/pages/Customer/Company/components/AddCompany/CompanyFormItem'
|
|
|
|
|
|
|
|
const AddClient = props => {
|
|
const AddClient = props => {
|
|
|
- const { visible, onCancel, reload, onConfirm, dataId, dataType, defaultValues, sourceList, ...resetModalProps } =
|
|
|
|
|
- props
|
|
|
|
|
-
|
|
|
|
|
|
|
+ const {
|
|
|
|
|
+ visible,
|
|
|
|
|
+ onCancel,
|
|
|
|
|
+ reload,
|
|
|
|
|
+ onConfirm,
|
|
|
|
|
+ dataId,
|
|
|
|
|
+ dataType,
|
|
|
|
|
+ defaultValues,
|
|
|
|
|
+ sourceList,
|
|
|
|
|
+ ...resetModalProps
|
|
|
|
|
+ } = props
|
|
|
|
|
+ const dispatch = useDispatch()
|
|
|
const [formRef] = Form.useForm()
|
|
const [formRef] = Form.useForm()
|
|
|
const layout = {
|
|
const layout = {
|
|
|
layout: 'horizontal',
|
|
layout: 'horizontal',
|
|
|
labelCol: { flex: '100px' }
|
|
labelCol: { flex: '100px' }
|
|
|
}
|
|
}
|
|
|
- const [showDataItem, setShowDataItem] = useState(false)
|
|
|
|
|
- const [validStatusFtl, setValidStatusFtl] = useState('')
|
|
|
|
|
- const dispatch = useDispatch()
|
|
|
|
|
|
|
+
|
|
|
|
|
+ const [state, setState] = useState({
|
|
|
|
|
+ validStatusFtl: '',
|
|
|
|
|
+ confirmLoading: false,
|
|
|
|
|
+ extraConfirmLoading: false
|
|
|
|
|
+ })
|
|
|
|
|
+
|
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
|
if (visible && !sourceList?.length) {
|
|
if (visible && !sourceList?.length) {
|
|
|
dispatch({
|
|
dispatch({
|
|
@@ -52,21 +65,24 @@ const AddClient = props => {
|
|
|
formRef
|
|
formRef
|
|
|
?.validateFields()
|
|
?.validateFields()
|
|
|
.then(async values => {
|
|
.then(async values => {
|
|
|
|
|
+ setState({ ...state, [dataId ? 'extraConfirmLoading' : 'confirmLoading']: true })
|
|
|
try {
|
|
try {
|
|
|
const success = await onConfirm(values)
|
|
const success = await onConfirm(values)
|
|
|
if (success) {
|
|
if (success) {
|
|
|
!isNullOrUnDef(reload) && reload()
|
|
!isNullOrUnDef(reload) && reload()
|
|
|
formRef?.resetFields()
|
|
formRef?.resetFields()
|
|
|
setTimeout(() => {
|
|
setTimeout(() => {
|
|
|
- setValidStatusFtl('')
|
|
|
|
|
|
|
+ setState({ ...state, validStatusFtl: '' })
|
|
|
onCancel()
|
|
onCancel()
|
|
|
}, 80)
|
|
}, 80)
|
|
|
}
|
|
}
|
|
|
- } catch (error) {}
|
|
|
|
|
|
|
+ } finally {
|
|
|
|
|
+ setState({ ...state, [dataId ? 'extraConfirmLoading' : 'confirmLoading']: false })
|
|
|
|
|
+ }
|
|
|
})
|
|
})
|
|
|
.catch(({ values }) => {
|
|
.catch(({ values }) => {
|
|
|
if ('telephone' in values && !values.telephone) {
|
|
if ('telephone' in values && !values.telephone) {
|
|
|
- setValidStatusFtl(validateEnum.Error)
|
|
|
|
|
|
|
+ setState({ ...state, validStatusFtl: validateEnum.Error })
|
|
|
}
|
|
}
|
|
|
})
|
|
})
|
|
|
}
|
|
}
|
|
@@ -84,29 +100,31 @@ const AddClient = props => {
|
|
|
<Button type="default" className="mr-2" onClick={onCancel}>
|
|
<Button type="default" className="mr-2" onClick={onCancel}>
|
|
|
取消
|
|
取消
|
|
|
</Button>
|
|
</Button>
|
|
|
- <Button type="primary" onClick={handleOnOk}>
|
|
|
|
|
|
|
+ <Button type="primary" onClick={handleOnOk} loading={state.confirmLoading}>
|
|
|
确认
|
|
确认
|
|
|
</Button>
|
|
</Button>
|
|
|
{dataId ? (
|
|
{dataId ? (
|
|
|
<Button
|
|
<Button
|
|
|
type="primary"
|
|
type="primary"
|
|
|
className="ml-2"
|
|
className="ml-2"
|
|
|
|
|
+ loading={state.extraConfirmLoading}
|
|
|
onClick={() => {
|
|
onClick={() => {
|
|
|
- setShowDataItem(true)
|
|
|
|
|
const values = {}
|
|
const values = {}
|
|
|
if (dataType === ChangeCompMap.BUSINESS.key) {
|
|
if (dataType === ChangeCompMap.BUSINESS.key) {
|
|
|
values.businessId = dataId
|
|
values.businessId = dataId
|
|
|
}
|
|
}
|
|
|
formRef?.setFieldsValue(values)
|
|
formRef?.setFieldsValue(values)
|
|
|
handleOnOk()
|
|
handleOnOk()
|
|
|
- }}>
|
|
|
|
|
|
|
+ }}
|
|
|
|
|
+ >
|
|
|
添加并关联
|
|
添加并关联
|
|
|
</Button>
|
|
</Button>
|
|
|
) : null}
|
|
) : null}
|
|
|
</div>
|
|
</div>
|
|
|
- }>
|
|
|
|
|
|
|
+ }
|
|
|
|
|
+ >
|
|
|
<Form {...layout} form={formRef} onValuesChange={handleChange} initialValues={defaultValues}>
|
|
<Form {...layout} form={formRef} onValuesChange={handleChange} initialValues={defaultValues}>
|
|
|
- {showDataItem ? <ProFormText name={`${dataType}Id`} hidden /> : null}
|
|
|
|
|
|
|
+ {dataId ? <ProFormText name={`${dataType}Id`} hidden /> : null}
|
|
|
<ProFormText
|
|
<ProFormText
|
|
|
name="clientName"
|
|
name="clientName"
|
|
|
label="姓名"
|
|
label="姓名"
|
|
@@ -133,12 +151,18 @@ const AddClient = props => {
|
|
|
<Form.Item
|
|
<Form.Item
|
|
|
label="手机"
|
|
label="手机"
|
|
|
name="telephone"
|
|
name="telephone"
|
|
|
- validateStatus={validStatusFtl}
|
|
|
|
|
|
|
+ validateStatus={state.validStatusFtl}
|
|
|
hasFeedback
|
|
hasFeedback
|
|
|
- rules={[{ required: true, message: '请输入手机号码' }]}>
|
|
|
|
|
- <TelephoneFormItem validateFn={status => setValidStatusFtl(status)} />
|
|
|
|
|
|
|
+ rules={[{ required: true, message: '请输入手机号码' }]}
|
|
|
|
|
+ >
|
|
|
|
|
+ <TelephoneFormItem validateFn={status => setState({ ...state, validStatusFtl: status })} />
|
|
|
</Form.Item>
|
|
</Form.Item>
|
|
|
- <ProFormText label="电话" name="phone" rules={[{ message: '请输入电话/座机号' }]} placeholder="" />
|
|
|
|
|
|
|
+ <ProFormText
|
|
|
|
|
+ label="电话"
|
|
|
|
|
+ name="phone"
|
|
|
|
|
+ rules={[{ message: '请输入电话/座机号' }]}
|
|
|
|
|
+ placeholder=""
|
|
|
|
|
+ />
|
|
|
</Col>
|
|
</Col>
|
|
|
<Col span={12}>
|
|
<Col span={12}>
|
|
|
<ProFormText label="昵称" name="niceName" placeholder="" />
|
|
<ProFormText label="昵称" name="niceName" placeholder="" />
|