Skip to content

M
merchant-manage-ui
Commit 8cdb816f authored by guang.wu's avatar guang.wu
Browse files
Options

fix: 恢复master代码

parent ed2a2896
Show whitespace changes
Inline Side-by-side
Showing with 89 additions and 665 deletions
src/pages/businessCustomer/components/CustomerInfo.jsx
View file @ 8cdb816f
...@@ -15,8 +15,8 @@ import { ...@@ -15,8 +15,8 @@ import {
notification, notification,
} from 'antd'; } from 'antd';
import { ExclamationCircleOutlined } from '@ant-design/icons'; import { ExclamationCircleOutlined } from '@ant-design/icons';
import moment from 'moment';
import { jsonToArray } from '@/utils/utils'; import { jsonToArray } from '@/utils/utils';
import moment from 'moment';
import { layout, mealType, boolOptions, hideOptions, mealSections } from '../staticData/index'; import { layout, mealType, boolOptions, hideOptions, mealSections } from '../staticData/index';
import { import {
apiEnterpriseInfo, apiEnterpriseInfo,
...@@ -33,54 +33,13 @@ const { confirm } = Modal; ...@@ -33,54 +33,13 @@ const { confirm } = Modal;
const CustomerInfo = props => { const CustomerInfo = props => {
const [form] = Form.useForm(); const [form] = Form.useForm();
const [meals, setMeals] = useState({}); const [meals, setMeals] = useState({});
const [selectedMealTypes, setSelectedMealTypes] = useState([]); const [mealTypes, setMealTypes] = useState([]);
const [pickSelfList, setPickSelfList] = useState([]); const [pickSelfList, setPickSelfList] = useState([]);
// 1. 表单展示 // 关闭分组信息弹窗
// const formItem = [ const handleCancel = () => {
// { props.reFresh();
// label: '企业名称', props.handleClose(false);
// name: 'enterpriseName',
// rules: [{ required: true, message: '请输入企业名称' }],
// component: <Input placeholder="请输入企业名称" />,
// },
// 2. 预加载数据, 数据模型转换,用于表单回显
// 3. 表单交互逻辑
// 4. 表单校验
const validateForm = async () => {
const res = await form.validateFields();
console.log(11, res);
// TODO 其他校验
};
// 5. 数据模型转换, 表单到接口的转换, 可以用 lodash
const tranformFormData = data => {};
// 6. 表单关闭
const closeModal = index => {
if (props.onClose && typeof props.onClose === 'function') {
props.onClose(!!index);
}
};
// 7. 表单提交
const sumbitForm = async () => {
const valid = await validateForm();
if (!valid) {
return false;
}
return false;
// const params = tranformFormData(res);
// const resp = await apiNewEnterprise(params);
// if (resp && resp.data) {
// // 保存成功后刷新列表
// closeModal(1);
// notification.success({ message: '保存成功！' });
// }
}; };
// 校验时间 // 校验时间
...@@ -150,7 +109,7 @@ const CustomerInfo = props => { ...@@ -150,7 +109,7 @@ const CustomerInfo = props => {
limit: [], limit: [],
}; };
Object.keys(res.mealLimit[item]).forEach(t => { Object.keys(res.mealLimit[item]).forEach(t => {
if (selectedMealTypes.includes(t)) { if (mealTypes.includes(t)) {
json.limit.push({ json.limit.push({
mealType: t, mealType: t,
limit: res.mealLimit[item][t], limit: res.mealLimit[item][t],
...@@ -173,8 +132,8 @@ const CustomerInfo = props => { ...@@ -173,8 +132,8 @@ const CustomerInfo = props => {
} }
const resp = await api(params); const resp = await api(params);
if (resp && resp.data) { if (resp && resp.data) {
// 保存成功后刷新列表 handleCancel();
closeModal(1); props.reFresh();
notification.success({ message: '保存成功！' }); notification.success({ message: '保存成功！' });
} }
}; };
...@@ -199,30 +158,26 @@ const CustomerInfo = props => { ...@@ -199,30 +158,26 @@ const CustomerInfo = props => {
// 改变餐品类型 (选自助餐必选外卖) // 改变餐品类型 (选自助餐必选外卖)
const onChangeMealType = async ms => { const onChangeMealType = async ms => {
console.log('mealTypes', selectedMealTypes, ms);
try { try {
// 编辑时，取消餐段，提示确认 if (props.id && ms.length < mealTypes.length) {
console.log('props.info :>> ', props.id);
if (props.id && ms.length < selectedMealTypes.length) {
await checkConfirm(); await checkConfirm();
} }
// 取消外卖，必须取消自助餐 // 取消外卖，必须取消自助餐
if (selectedMealTypes.includes('1') && !ms.includes('1')) { if (mealTypes.includes('1') && !ms.includes('1')) {
ms = ms.filter(item => item !== '2'); ms = ms.filter(item => item !== '2');
} }
// 选择自助餐，必须选择外卖 // 选择自助餐，必须选择外卖
if (!selectedMealTypes.includes('1') && ms.includes('2')) { if (!mealTypes.includes('1') && ms.includes('2')) {
ms.push('1'); ms.push('1');
} }
form.setFieldsValue({ form.setFieldsValue({
mealType: ms, mealType: ms,
}); });
setSelectedMealTypes(ms); setMealTypes(ms);
} catch { } catch {
form.setFieldsValue({ form.setFieldsValue({
mealType: selectedMealTypes, mealType: mealTypes,
}); });
} }
}; };
...@@ -242,70 +197,55 @@ const CustomerInfo = props => { ...@@ -242,70 +197,55 @@ const CustomerInfo = props => {
const getInfo = async () => { const getInfo = async () => {
const res = await apiEnterpriseInfo(props.id); const res = await apiEnterpriseInfo(props.id);
if (res && res.data) { if (res && res.data) {
const { const obj = Object.assign({}, res.data);
hideImage, if (res.data.mealTimePeriod && res.data.mealTimePeriod.length) {
hidePrice, const m = moment().format('YYYY-MM-DD');
id, const arr = Object.keys(mealSections);
name, obj.mealTimePeriod = Object.keys(mealSections).map(() => ({}));
mealLimit, res.data.mealTimePeriod.forEach((item, i) => {
mealTimePeriod = [], if (item) {
mealType: type, const index = arr.indexOf(`${item.mealPeriodType}`);
weekPreview, if (index > -1) {
} = res.data; obj.mealTimePeriod[index] = {
const formData = { mealPeriodType: `${item.mealPeriodType}`,
id, time: [moment(`${m} ${item.beginTime}`), moment(`${m} ${item.endTime}`)],
name,
weekPreview,
mealType: type?.map(item => `${item}`) ?? [],
hideInfo: [],
}; };
// 数据模型转换-隐藏信息
if (+hidePrice) {
formData.hideInfo.push('hidePrice');
} }
if (+hideImage) {
formData.hideInfo.push('hideImage');
} }
// 数据模型转换-餐段配置,转为 {餐段:餐段名称}
// 把mealTimePeriod按mealPeriodType转为map
const mealTimePeriodMap = {};
mealTimePeriod.forEach(item => {
mealTimePeriodMap[item.mealPeriodType] = mealSections[item.mealPeriodType];
}); });
setMeals(mealTimePeriodMap); } else {
obj.mealTimePeriod = [];
// 数据模型转换-餐段和时间配置, [{餐段, time}, {}, {}]
const mealTimePeriodArr = Object.keys(mealSections).map(() => ({}));
formData.mealTimePeriod = mealTimePeriodArr;
mealTimePeriod.forEach(item => {
if (!item) return;
const index = Object.keys(mealSections).indexOf(`${item.mealPeriodType}`);
if (index > -1) {
formData.mealTimePeriod[index] = {
mealPeriodType: `${item.mealPeriodType}`,
time: [
moment(`${moment().format('YYYY-MM-DD')} ${item.beginTime}`),
moment(`${moment().format('YYYY-MM-DD')} ${item.endTime}`),
],
};
} }
obj.mealLimit = {};
if (res.data.mealLimit && res.data.mealLimit.length) {
res.data.mealLimit.forEach(item => {
obj.mealLimit[`limit${item.mealPeriodType}`] = {};
item.limit.forEach(limit => {
obj.mealLimit[`limit${item.mealPeriodType}`][limit.mealType] = limit.limit;
}); });
// 数据模型转换-消费限额, 转为{餐段: {餐品类型: 限额}}
const mealLimitMap = {};
mealLimit.forEach(item => {
mealLimitMap[`limit${item.mealPeriodType}`] = {};
item.limit.forEach(t => {
mealLimitMap[`limit${item.mealPeriodType}`][t.mealType] = t.limit;
}); });
}
obj.hideInfo = [];
if (+res.data.hidePrice) {
obj.hideInfo.push('hidePrice');
}
if (+res.data.hideImage) {
obj.hideInfo.push('hideImage');
}
if (res.data.mealType) {
obj.mealType = res.data.mealType.map(item => `${item}`);
} else {
obj.mealType = [];
}
setMealTypes(obj.mealType);
const json = {};
if (res.data.mealTimePeriod) {
res.data.mealTimePeriod.forEach(item => {
json[item.mealPeriodType] = mealSections[item.mealPeriodType];
}); });
formData.mealLimit = mealLimitMap; }
setMeals(json);
setSelectedMealTypes(formData.mealType); form.setFieldsValue(obj);
console.log('formData :>> ', formData);
form.setFieldsValue(formData);
} }
}; };
...@@ -328,13 +268,13 @@ const CustomerInfo = props => { ...@@ -328,13 +268,13 @@ const CustomerInfo = props => {
if (props.id) { if (props.id) {
getInfo(); getInfo();
} else { } else {
setSelectedMealTypes([]); setMealTypes([]);
setMeals({}); setMeals({});
form.resetFields(); form.resetFields();
getPickSelf(); getPickSelf();
} }
} else { } else {
setSelectedMealTypes([]); setMealTypes([]);
setMeals({}); setMeals({});
form.setFieldsValue({}); form.setFieldsValue({});
} }
...@@ -347,8 +287,8 @@ const CustomerInfo = props => { ...@@ -347,8 +287,8 @@ const CustomerInfo = props => {
destroyOnClose destroyOnClose
maskClosable={false} maskClosable={false}
width="900px" width="900px"
onOk={sumbitForm} onOk={handleConfirm}
onCancel={() => closeModal(0)} onCancel={handleCancel}
> >
<Form <Form
name="basicInfo" name="basicInfo"
...@@ -380,10 +320,10 @@ const CustomerInfo = props => { ...@@ -380,10 +320,10 @@ const CustomerInfo = props => {
</Form.Item> </Form.Item>
)} )}
<Form.Item <Form.Item
label="企业截止时间" label="企业截单时间"
name="endOrderTime" name="endOrderTime"
wrapperCol={{ span: 20 }} wrapperCol={{ span: 20 }}
rules={[{ required: true, message: '请输入企业截止时间!' }]} rules={[{ required: true, message: '请输入企业截单时间!' }]}
extra={<span>企业员工下单的截至时间，仅支持正整数，单位为分钟。</span>} extra={<span>企业员工下单的截至时间，仅支持正整数，单位为分钟。</span>}
> >
<InputNumber min={0} max={600} addonAfter="分钟" /> <InputNumber min={0} max={600} addonAfter="分钟" />
...@@ -414,7 +354,7 @@ const CustomerInfo = props => { ...@@ -414,7 +354,7 @@ const CustomerInfo = props => {
> >
{fs => ( {fs => (
<Row key={`row${meal}`}> <Row key={`row${meal}`}>
{selectedMealTypes.map((t, i) => ( {mealTypes.map((t, i) => (
<Col span={7} offset={i ? 1 : 0} key={t}> <Col span={7} offset={i ? 1 : 0} key={t}>
<MealLimit value={t} label={mealType[t]} name={`${t}`} /> <MealLimit value={t} label={mealType[t]} name={`${t}`} />
</Col> </Col>
......
src/pages/businessCustomer/components/CustomerInfoCopy.jsx deleted 100644 → 0
View file @ ed2a2896
import React, { useEffect, useState } from 'react';
import {
Button,
Divider,
Form,
Input,
InputNumber,
Checkbox,
Radio,
Col,
Row,
Modal,
Select,
message,
notification,
} from 'antd';
import { ExclamationCircleOutlined } from '@ant-design/icons';
import moment from 'moment';
import { jsonToArray } from '@/utils/utils';
import { layout, mealType, boolOptions, hideOptions, mealSections } from '../staticData/index';
import {
apiEnterpriseInfo,
apiNewEnterprise,
apiEditEnterprise,
apiEnterprisePickSelf,
} from '../service';
import MealSection from './MealSection';
import MealLimit from './MealLimit';
const CheckboxGroup = Checkbox.Group;
const RadioGroup = Radio.Group;
const { confirm } = Modal;
const CustomerInfo = props => {
const [form] = Form.useForm();
const [meals, setMeals] = useState([]);
const [selectedMealTypes, setSelectedMealTypes] = useState([]);
const [pickSelfList, setPickSelfList] = useState([]);
/*
* 7. 表单关闭
*/
const closeModal = index => {
if (props.onClose && typeof props.onClose === 'function') {
props.onClose(!!index);
}
setSelectedMealTypes([]);
setMeals({});
form.setFieldsValue({
mealLimit: [],
});
};
/*
* 6. 表单提交
*/
const submitForm = async params => {
let api = apiNewEnterprise;
if (props.id) {
params.id = props.id;
api = apiEditEnterprise;
}
const resp = await api(params);
if (resp && resp.data) {
// 保存成功后刷新列表
closeModal(1);
notification.success({ message: '保存成功！' });
}
};
/*
* 5. 表单提交数据处理及校验
*/
const validateForm = async () => {
const res = await form.validateFields();
const params = {
hideImage: 0,
hidePrice: 0,
...res,
};
const arr = [];
res.mealTimePeriod.forEach(item => {
if (item && meals[item.mealPeriodType]) {
const obj = { ...item };
obj.beginTime = moment(obj.time[0]).format('HH:mm');
obj.endTime = moment(obj.time[1]).format('HH:mm');
delete obj.time;
arr.push(obj);
}
});
params.mealTimePeriod = arr;
if (res.hideInfo && res.hideInfo.length) {
params.hidePrice = res.hideInfo.includes('hidePrice') ? 1 : 0;
params.hideImage = res.hideInfo.includes('hideImage') ? 1 : 0;
delete params.hideInfo;
}
const limits = [];
// 处理限额
Object.keys(res.mealLimit).forEach(item => {
const mealPeriodType = item.replace('limit', '');
if (meals[mealPeriodType]) {
const json = {
mealPeriodType,
limit: [],
};
Object.keys(res.mealLimit[item]).forEach(t => {
if (selectedMealTypes.includes(t)) {
json.limit.push({
mealType: t,
limit: res.mealLimit[item][t],
});
}
});
limits.push(json);
}
});
params.mealLimit = limits;
console.log(params, '.....');
// submitForm(params);
};
/*
* 4. 表单交互逻辑
*/
// 校验时间
const checkTime = (arr, curren, curName) => {
let valid = false;
arr.forEach(item => {
if (curren < item.endTime) {
valid = true;
const name = meals[item.mealPeriodType];
}
});
return valid;
};
const validateMeals = () => {
const { mealTimePeriod = [] } = form.getFieldValue();
const arr = [];
let validTime = false;
mealTimePeriod.forEach(item => {
if (item && meals[item.mealPeriodType]) {
const obj = { ...item };
obj.beginTime = moment(obj.time[0]).format('HH:mm');
obj.endTime = moment(obj.time[1]).format('HH:mm');
delete obj.time;
if (checkTime(arr, obj.beginTime, meals[item.mealPeriodType])) {
validTime = true;
}
arr.push(obj);
}
});
if (validTime) {
// eslint-disable-next-line prefer-promise-reject-errors
return Promise.reject('时间段不能交叉！');
}
return Promise.resolve();
};
// 风险提示
const checkConfirm = () => {
const mt = '';
return new Promise((resolve, reject) => {
confirm({
title: '风险提示',
icon: <ExclamationCircleOutlined />,
content: `确定关闭${mt}餐品类型？此餐品类型下关联的商户及商品将一并删除，不可逆请谨慎操作！`,
onOk() {
resolve(1);
},
onCancel() {
reject(new Error());
},
});
});
};
// 改变餐品类型 (选自助餐必选外卖)
const onChangeMealType = async ms => {
try {
// 编辑时，取消餐段，提示确认
if (props.id && ms.length < selectedMealTypes.length) {
await checkConfirm();
}
// 取消外卖，必须取消自助餐
if (selectedMealTypes.includes('1') && !ms.includes('1')) {
ms = ms.filter(item => item !== '2');
}
// 选择自助餐，必须选择外卖
if (!selectedMealTypes.includes('1') && ms.includes('2')) {
ms.push('1');
}
form.setFieldsValue({
mealType: ms,
});
setSelectedMealTypes(ms);
} catch {
form.setFieldsValue({
mealType: selectedMealTypes,
});
}
};
// 改变餐段
const onChangeMealSection = e => {
console.log(e);
const { id, checked, label } = e.target;
const values = Object.assign({}, meals);
if (checked) {
values[id] = label;
} else {
delete values[id];
}
// 判断餐段配置是否都没选
if (Object.keys(values).length === 0) {
form.setFieldsValue({
mealTimePeriod: [],
});
}
setMeals(values);
};
/*
* 3.表单数据处理，
*/
const processMealTimePeriod = mealTimePeriod => {
const mealTimePeriodMap = {};
const mealTimePeriodArr = Object.keys(mealSections).map(() => ({}));
mealTimePeriod.forEach(item => {
const { mealPeriodType, beginTime, endTime } = item;
// 数据模型转换-餐段配置,转为 {餐段:餐段名称}
// 把mealTimePeriod按mealPeriodType转为map
const mealPeriodName = mealSections[mealPeriodType];
mealTimePeriodMap[mealPeriodType] = mealPeriodName;
// 数据模型转换-餐段和时间配置, [{餐段, time}, {}, {}]
const index = Object.keys(mealSections).indexOf(`${mealPeriodType}`);
if (index > -1) {
mealTimePeriodArr[index] = {
mealPeriodType: `${mealPeriodType}`,
time: [
moment(`${moment().format('YYYY-MM-DD')} ${beginTime}`),
moment(`${moment().format('YYYY-MM-DD')} ${endTime}`),
],
};
}
});
return { mealTimePeriodMap, mealTimePeriodArr };
};
// 数据模型转换-消费限额, 转为{餐段: {餐品类型: 限额}}
const processMealLimit = mealLimit => {
const mealLimitMap = {};
mealLimit.forEach(item => {
const { mealPeriodType, limit } = item;
mealLimitMap[`limit${mealPeriodType}`] = limit.reduce(
(acc, t) => ({
...acc,
[t.mealType]: t.limit,
}),
{},
);
});
return mealLimitMap;
};
const processData = data => {
const {
hideImage,
hidePrice,
id,
name,
mealLimit,
mealTimePeriod = [],
mealType: type,
weekPreview,
endOrderTime,
} = data;
const formData = {
id,
name,
weekPreview,
mealType: type?.map(item => `${item}`) ?? [],
hideInfo: [],
endOrderTime,
};
if (+hidePrice) {
formData.hideInfo.push('hidePrice');
}
if (+hideImage) {
formData.hideInfo.push('hideImage');
}
const { mealTimePeriodMap, mealTimePeriodArr } = processMealTimePeriod(mealTimePeriod);
const mealLimitMap = processMealLimit(mealLimit);
formData.mealTimePeriod = mealTimePeriodArr;
formData.mealLimit = mealLimitMap;
formData.mealTimePeriodMap = mealTimePeriodMap;
return formData;
};
/*
* 2. 表单数据获取
*/
// 获取自提点列表
const getPickSelf = async () => {
const res = await apiEnterprisePickSelf({});
if (res && res.data && res.data.records) {
const data = res.data.records;
setPickSelfList(
data.map(item => ({
value: item.id,
label: item.pickselfName,
})),
);
}
};
// 获取表单信息
const getInfo = async () => {
const res = await apiEnterpriseInfo(props.id);
if (res && res.data) {
const formData = processData(res.data);
setSelectedMealTypes(formData.mealType);
setMeals(formData.mealTimePeriodMap);
form.setFieldsValue(formData);
}
};
useEffect(() => {
if (props.visible) {
if (props.id) {
getInfo();
}
}
}, [props.visible]);
/*
* 1. 表单结构
*/
const MealLimitsFormList = item => (
<Form.List name="mealLimit" key={item.name}>
{mealLimitsFields => (
<>
{Object.keys(meals).map(meal => (
<Form.Item
key={`${mealSections[meal]}`}
label={`${mealSections[meal]}订单`}
required
wrapperCol={{ span: 20 }}
>
<Form.List
name={`limit${meal}`}
key={`${meal}limit`}
required
wrapperCol={{ span: 20 }}
>
{mealLimitsFieldsList => (
<Row key={`row${meal}`}>
{selectedMealTypes.map((t, i) => (
<Col span={7} offset={i ? 1 : 0} key={t}>
<MealLimit value={t} label={mealType[t]} name={`${t}`} />
</Col>
))}
</Row>
)}
</Form.List>
</Form.Item>
))}
</>
)}
</Form.List>
);
const formItem = [
{
type: 'Form.Item',
label: '企业名称',
name: 'name',
wrapperCol: { span: 20 },
rules: [{ required: true, message: '请输入企业名称' }],
component: <Input placeholder="请输入企业名称" />,
},
{
type: 'Form.Item',
disabled: props.id,
label: '企业取餐点',
wrapperCol: { span: 20 },
name: 'pickSelfIds',
rules: [{ required: true, message: '请选择企业取餐点' }],
component: (
<Select
options={pickSelfList}
mode="multiple"
showSearch
filterOption={(v, option) =>
(option?.label ?? '').toLowerCase().includes(v.toLowerCase())
}
/>
),
},
{
type: 'Form.Item',
label: '企业截止时间',
wrapperCol: { span: 20 },
name: 'endOrderTime',
rules: [{ required: true, message: '请输入企业截止时间' }],
component: <InputNumber min={0} max={600} addonAfter="分钟" />,
extra: <span>企业员工下单的截至时间，仅支持正整数，单位为分钟。</span>,
},
{
type: 'Form.Item',
label: '餐品类型',
wrapperCol: { span: 20 },
name: 'mealType',
rules: [{ required: true, message: '请选择餐品类型' }],
component: <CheckboxGroup options={jsonToArray(mealType)} onChange={onChangeMealType} />,
},
{
type: 'Form.Item',
label: '餐段配置',
wrapperCol: { span: 12 },
name: 'mealTimePeriod',
rules: [{ required: true, message: '请选择餐段配置' }],
component: (
<MealSection meals={meals} validateMeals={validateMeals} onChange={onChangeMealSection} />
),
},
{
name: 'Divider',
type: 'Divider',
component: '企业单笔消费限额',
},
{
name: 'Form.List',
type: 'Form.List',
component: '',
},
{
type: 'Form.Item',
label: '商品隐藏信息',
wrapperCol: { span: 20 },
name: 'hideInfo',
rules: [{ required: true, message: '请选择商品隐藏信息' }],
component: <CheckboxGroup options={hideOptions} />,
},
{
type: 'Form.Item',
label: '是否周预览',
wrapperCol: { span: 20 },
name: 'weekPreview',
rules: [{ required: true, message: '请选择是否周预览' }],
component: <RadioGroup options={boolOptions} />,
},
];
return (
<Modal
title="企业客户信息"
open={props.visible}
destroyOnClose
maskClosable={false}
width="900px"
onOk={validateForm}
onCancel={() => closeModal(0)}
>
<Form name="basicInfo" initialValues={{ mealTimePeriod: [] }} {...layout} form={form}>
{formItem.map((item, index) => {
if (item.type === 'Divider' && !item.disabled) {
return (
<Divider key={item.name} orientation="left" plain>
{item.component}
</Divider>
);
}
if (item.type === 'Form.Item' && !item.disabled) {
return (
<Form.Item
key={item.name}
label={item.label ?? ''}
name={item.name}
rules={item.rules ?? []}
wrapperCol={item.wrapperCol}
extra={item.extra ?? ''}
>
{item.component}
</Form.Item>
);
}
if (item.type === 'Form.List' && !item.disabled) {
return MealLimitsFormList(item);
}
return null;
})}
</Form>
</Modal>
);
};
export default CustomerInfo;
src/pages/businessCustomer/components/MealLimit.jsx
View file @ 8cdb816f
...@@ -7,9 +7,6 @@ const MealLimit = props => ( ...@@ -7,9 +7,6 @@ const MealLimit = props => (
<Form.Item <Form.Item
label={`${props.label}限额`} label={`${props.label}限额`}
name={props.name} name={props.name}
value={props.value}
labelCol={{ span: 10 }}
wrapperCol={{ span: 14 }}
rules={[ rules={[
{ validator: validateRequired, message: `请输入${props.label}限额` }, { validator: validateRequired, message: `请输入${props.label}限额` },
{ validator: isCheckPriceTwoDecimal, message: '请输入正确的价格' }, { validator: isCheckPriceTwoDecimal, message: '请输入正确的价格' },
......
src/pages/businessCustomer/components/MealSection.jsx
View file @ 8cdb816f
import React from 'react'; import React from 'react';
import { Form, Row, Col, TimePicker, Space } from 'antd'; import { Form, Space, TimePicker } from 'antd';
import { mealSections } from '../staticData/index'; import { mealSections } from '../staticData/index';
import MealCheckbox from './MealCheckbox'; import MealCheckbox from './MealCheckbox';
...@@ -8,32 +8,19 @@ const MealSection = props => ( ...@@ -8,32 +8,19 @@ const MealSection = props => (
{fields => ( {fields => (
<> <>
{Object.keys(mealSections).map((field, i) => ( {Object.keys(mealSections).map((field, i) => (
<Row key={field} align="baseline"> <Space key={field} align="baseline">
<Col span={4}>
<Form.Item label="" name={[i, 'mealPeriodType']}> <Form.Item label="" name={[i, 'mealPeriodType']}>
<MealCheckbox <MealCheckbox changeType={props.onChange} meals={props.meals} field={field} />
changeType={e => props.onChangeSection(e, props)}
meals={props.meals}
field={field}
/>
</Form.Item> </Form.Item>
</Col>
<Col span={18}>
<Form.Item <Form.Item
name={[i, 'time']} name={[i, 'time']}
rules={ rules={
props.meals[field] props.meals[field] ? [{ type: 'array', required: true, message: '请选择!' }] : []
? [
{ type: 'array', required: true, message: '请选择!' },
{ validator: props.validateMeals, message: '时间段不能交叉！' },
]
: []
} }
> >
<TimePicker.RangePicker format="HH:mm" minuteStep={30} /> <TimePicker.RangePicker format="HH:mm" minuteStep={30} />
</Form.Item> </Form.Item>
</Col> </Space>
</Row>
))} ))}
</> </>
)} )}
......
src/pages/businessCustomer/index.jsx
View file @ 8cdb816f
...@@ -3,9 +3,7 @@ import ProTable from '@ant-design/pro-table'; ...@@ -3,9 +3,7 @@ import ProTable from '@ant-design/pro-table';
import { Button } from 'antd'; import { Button } from 'antd';
import { PlusOutlined } from '@ant-design/icons'; import { PlusOutlined } from '@ant-design/icons';
import { customerColumn } from './staticData/index'; import { customerColumn } from './staticData/index';
// import CustomerInfo from './components/CustomerInfoCopy'; import CustomerInfo from './components/CustomerInfo';
// import CustomerInfo from './components/CustomerInfo';
import CustomerInfo from '@/example/proForm/ModalForm/index';
import utilStyle from '@/utils/utils.less'; import utilStyle from '@/utils/utils.less';
import { stringOrObjectTrim } from '@/utils/utils'; import { stringOrObjectTrim } from '@/utils/utils';
import { apiEnterpriseList } from './service'; import { apiEnterpriseList } from './service';
...@@ -31,12 +29,6 @@ const BusinessCustomer = () => { ...@@ -31,12 +29,6 @@ const BusinessCustomer = () => {
setVisible(true); setVisible(true);
}; };
const onClose = refresh => {
console.log(3);
setVisible(false);
refresh && refTable.current.reload();
};
return ( return (
<div className={utilStyle.formPageBox}> <div className={utilStyle.formPageBox}>
<ProTable <ProTable
...@@ -48,6 +40,7 @@ const BusinessCustomer = () => { ...@@ -48,6 +40,7 @@ const BusinessCustomer = () => {
columns={customerColumn({ onEdit })} columns={customerColumn({ onEdit })}
request={params => query({ ...params })} request={params => query({ ...params })}
rowKey={r => r.id} rowKey={r => r.id}
expandIconColumnIndex={10}
bordered bordered
options={false} options={false}
toolBarRender={() => [ toolBarRender={() => [
...@@ -64,7 +57,12 @@ const BusinessCustomer = () => { ...@@ -64,7 +57,12 @@ const BusinessCustomer = () => {
</Button>, </Button>,
]} ]}
/> />
{visible && <CustomerInfo visible={visible} id={id} onClose={onClose} />} <CustomerInfo
visible={visible}
id={id}
reFresh={() => refTable.current.reload()}
handleClose={setVisible}
/>
</div> </div>
); );
}; };
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment