Skip to content

M
merchant-manage-ui
Commit 93dae43d authored by 李腾's avatar 李腾
Browse files
Options

feat: 完善多物流发货逻辑

parent 0752b7b3
Show whitespace changes
Inline Side-by-side
Showing with 190 additions and 104 deletions
src/pages/orderManage/pendingDeliveryOrder/components/MultiLogisticsModal/index.jsx
View file @ 93dae43d
......@@ -6,29 +6,64 @@ import styles from './index.less';
const FormComponent = (props, ref) => {
const { record = {}, companys = [] } = props;
const { mchOrderSkuVoList } = record;
const { mchOrderSkuVoList, packageList } = record;
const [form] = Form.useForm();
const [skuInfoList, setSkuInfoList] = useState(mchOrderSkuVoList.map(item => ({})));
const [addPackageList, setAddPackageList] = useState({
expressCompanyCode: null,
expressCompanyName: '',
expressNo: '',
serialNumber: '',
skuInfoList: mchOrderSkuVoList.map(item => ({})),
});
const [initPackageList, setInitPackageList] = useState(() => {
if (packageList.length === 0) {
return [
{
skuInfoList: mchOrderSkuVoList.map(item => ({ skuNo: [item.skuNo], quantity: 1 })),
},
];
}
return packageList.map(item => ({
...item,
skuInfoList: mchOrderSkuVoList.map((skuInfo, index) => {
console.log(item.skuInfoList);
const editData = item.skuInfoList[index];
if (editData) {
return {
...editData,
};
}
return {};
}),
}));
});
// eslint-disable-next-line consistent-return
const onCheckSkuInfoList = async (_, names) => {
const count = names.filter(item => {
console.log('sku', item.skuNo);
return item.skuNo && item.skuNo.length;
}).length;
if (count === 0) {
return Promise.reject(new Error('至少选择一个商品'));
}
};
const formLayout = {
labelCol: { span: 0 },
wrapperCol: { span: 24 },
};
const formRules = {
skuInfoList: [{ validator: onCheckSkuInfoList }],
expressCompanyCode: [{ required: true, message: '请选择物流公司' }],
expressNo: [{ required: true, message: '请填写物流单号' }],
serialNumber: [{ required: true, message: '请填写序列号' }],
};
useEffect(() => {
console.log(companys, record.mchOrderSkuVoList);
// setSkuInfoList(mchOrderSkuVoList.map(item=>{
// return {
// skuId: item.orderSkuId,
// quantity: 1
// }
// }))
console.log(initPackageList);
console.log(companys, mchOrderSkuVoList);
}, [record]);
useImperativeHandle(ref, () => ({
......@@ -36,37 +71,31 @@ const FormComponent = (props, ref) => {
}));
const getSkuOptions = (index, parentIndex) => {
const { skuId, skuName } = mchOrderSkuVoList[index];
const packageList = form.getFieldValue('packageList');
const updateFormValue = value => {
packageList[parentIndex].skuInfoList[index].skuId = value;
console.log(packageList);
// form.setFieldsValue({
// packageList,
// })
};
const { skuNo, skuName } = mchOrderSkuVoList[index];
return (
<Checkbox onChange={() => updateFormValue(skuId)} value={skuId}>
{skuName}
</Checkbox>
<Checkbox.Group>
<Checkbox value={skuNo}>{skuName}</Checkbox>
</Checkbox.Group>
);
};
const SkuFormList = skuProps => {
const { skuFields, parentFields } = skuProps;
return skuFields.map(field => {
console.log(111111111, field, parentFields);
const { skuFields, parentFields, errors } = skuProps;
return (
<div className={styles['sku-list-box']}>
{skuFields.map(field => (
<div className={styles['sku-list']}>
<Form.Item className={styles['sku-list__goods-name']} name={[field.name, 'skuId']}>
<Form.Item className={styles['sku-list__goods-name']} name={[field.name, 'skuNo']}>
{getSkuOptions(field.name, parentFields.name)}
</Form.Item>
<Form.Item className={styles['sku-list__goods-count']} name={[field.name, 'quantity']}>
<Input type="number" placeholder="请输入数量" />
<Input type="number" placeholder="数量" />
</Form.Item>
</div>
))}
<Form.ErrorList errors={errors} />
</div>
);
});
};
return (
......@@ -74,25 +103,21 @@ const FormComponent = (props, ref) => {
form={form}
{...formLayout}
initialValues={{
packageList: [
{
skuInfoList,
},
],
packageList: initPackageList,
}}
>
<Form.List name="packageList" rules={[]}>
{(fields, { add, remove }, { errors }) => (
<>
{fields.map((field, index) => (
<>
<React.Fragment key={field.key}>
<Form.List name={[field.name, 'skuInfoList']}>
{skuFields => (
<div className={styles['sku-list-module']}>
<Form.List name={[field.name, 'skuInfoList']} rules={formRules.skuInfoList}>
{(skuFields, actions, { errors: err }) => (
<SkuFormList
key={index.toString()}
skuFields={skuFields}
parentFields={field}
errors={err}
/>
)}
</Form.List>
......@@ -112,28 +137,16 @@ const FormComponent = (props, ref) => {
<Form.Item name={[field.name, 'serialNumber']} rules={formRules.serialNumber}>
<Input placeholder="请填写序列号" />
</Form.Item>
</React.Fragment>
</>
</div>
))}
<div className={styles.operation}>
<PlusCircleOutlined
onClick={() => {
const packageList = form.getFieldValue('packageList');
console.log(packageList);
const currentPackageList = form.getFieldValue('packageList');
console.log(currentPackageList);
form.setFieldsValue({
packageList: [
...packageList,
{
expressCompanyCode: '',
skuInfoList: [
{
skuId: '',
quantity: 1,
},
],
},
],
packageList: [...currentPackageList, addPackageList],
});
}}
/>
......@@ -158,6 +171,20 @@ const UpdateStatusModal = (props, ref) => {
const [confirmLoading, setConfirmLoading] = useState(false);
const [record, setRecord] = useState();
// 提交前处理数据结构将skuNo的值从[skuNo]=>skuNo
const onFilterParams = packageList => {
const currentPackageList = JSON.parse(JSON.stringify(packageList));
return currentPackageList.map(item => {
const { skuInfoList } = item;
return {
...item,
skuInfoList: skuInfoList
.filter(skuInfo => skuInfo.skuNo.length)
.map(skuInfo => ({ ...skuInfo, skuNo: skuInfo.skuNo[0] })),
};
});
};
const open = item => {
setVisible(true);
setRecord(item);
......@@ -171,7 +198,7 @@ const UpdateStatusModal = (props, ref) => {
const onOk = () => {
formRef.current.form.validateFields().then(values => {
console.log('fieldsValue :>>', values);
console.log('fieldsValue :>>', onFilterParams(values.packageList));
});
};
......
src/pages/orderManage/pendingDeliveryOrder/components/MultiLogisticsModal/index.less
View file @ 93dae43d
.sku-list {
.sku-list-module {
margin-bottom: 20px;
padding: 10px 20px;
border: 1px solid #f2f2f2;
}
.sku-list-box {
padding-bottom: 10px;
.sku-list {
display: flex;
// padding-bottom: 19px;
&__goods-name {
flex: 1;
margin-bottom: 0 !important;
}
&__goods-count {
width: 100px;
margin-bottom: 5px !important;
}
}
}
......
src/pages/orderManage/pendingDeliveryOrder/index.jsx
View file @ 93dae43d
......@@ -21,6 +21,7 @@ import {
getLogistics,
downOrder,
getJDLogisticsInfo,
apiQueryOrderInfo,
} from './service';
const { confirm } = Modal;
......@@ -403,20 +404,24 @@ const TableList = props => {
marginBottom: '10px',
}}
onClick={async () => {
const skuListData = await getGoods(record?.orderId);
let logisticsData = [{}];
setSkuList(skuListData);
const data = await getLogistics(record?.orderId);
logisticsData = data.map(item => ({
selectedGoods: item?.skus?.map(sku => sku?.orderSkuId),
selectedCompany: item.expressCompanyCode
? `${item?.expressCompanyCode}-${item?.expressCompanyName}`
: null,
orderNum: item?.deliveryNo,
}));
// const skuListData = await getGoods(record?.orderId);
// let logisticsData = [{}];
// setSkuList(skuListData);
// const data = await getLogistics(record?.orderId);
// logisticsData = data.map(item => ({
// selectedGoods: item?.skus?.map(sku => sku?.orderSkuId),
// selectedCompany: item.expressCompanyCode
// ? `${item?.expressCompanyCode}-${item?.expressCompanyName}`
// : null,
// orderNum: item?.deliveryNo,
// }));
// setLogisticsData(logisticsData);
// handleModalVisible(true);
multiLogisticsModalRef.current.open(record);
const res = await apiQueryOrderInfo({
orderNo: record.orderNo,
});
multiLogisticsModalRef.current.open({ ...record, packageList: res.packageList });
}}
>
{props.type === 2 ? '更新物流信息' : '填写物流信息'}
......
src/pages/orderManage/pendingDeliveryOrder/service.js
View file @ 93dae43d
......@@ -151,3 +151,45 @@ export function apiDelayDeliverGoods(data) {
prefix: config.kdspApi,
});
}
// 查询多物流订单信息
//
export function apiQueryOrderInfo(params) {
return new Promise(resolve => {
setTimeout(() => {
resolve({
packageList: [
{
expressCompanyCode: 'yunda',
expressCompanyName: '',
expressNo: 'YUNDA012345678',
serialNumber: '0011223344',
skuInfoList: [
{
skuNo: ['529355424931841'],
quantity: '2',
},
{
skuNo: ['530724210084865'],
quantity: '12',
},
],
},
{
expressCompanyCode: 'yunda',
expressCompanyName: '',
expressNo: 'YUNDA012345678',
serialNumber: '0011223344',
skuInfoList: [
{
skuNo: ['529355424931841'],
quantity: '2',
},
],
},
],
});
}, 1000);
});
// return request.get('/api/merchants/orders/deliveries/packages/detail', params)
}
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