bpa
/
BPA.KitChen.Web
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 1 Wiki Activity
Browse Source

买满减现活动

tags/小炒逻辑变更前
yangwenhua 2 years ago
parent
f08d387bbc
commit
c8a9db1187
1 changed files with 371 additions and 9 deletions
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +371
    -9
      src/pages/activity/activityStart/components/FullDecrement/index.jsx

+ 371
- 9
src/pages/activity/activityStart/components/FullDecrement/index.jsx View File

@@ -1,15 +1,126 @@
import React, { useState } from "react";
import { Form, Button, Input, Image, InputNumber, DatePicker, Upload } from 'antd';
import React, { useState, useEffect } from "react";
import { Form, Button, Input, Image, InputNumber, DatePicker, Upload, Checkbox, Row, Col, Select, message } from 'antd';
import styles from "../../index.less";
import { MinusCircleOutlined, PlusOutlined, UploadOutlined } from '@ant-design/icons';
import startAPI from "../../service";
import axios from 'axios';
import moment from "moment";

const activityConfigArray = [
{
"configId": null,
"operator": null,
"value1": [],
"value2": null,
"activity_Id": null,
"configuration_Id": "2B0F88D6-EDA0-4AAC-BB0B-DD34F3245C17",
"configurationName": "日参与次数限制",
"configurationRule": "每日参与次数",
"valueType": 1,
"configurationValueCount": 1
},
{
"configId": null,
"operator": null,
"value1": [],
"value2": null,
"activity_Id": null,
"configuration_Id": "8AC2A2BA-BB6E-4566-B147-ACF798146BBD",
"configurationName": "星期限制",
"configurationRule": "包含的星期",
"valueType": 2,
"configurationValueCount": 1
},
{
"configId": null,
"operator": null,
"value1": [],
"value2": null,
"activity_Id": null,
"configuration_Id": "9620CCF9-679E-44B1-B8FF-9B6F511208FA",
"configurationName": "消费金额",
"configurationRule": "单笔订单消费金额",
"valueType": 1,
"configurationValueCount": 1
},
{
"configId": null,
"operator": null,
"value1": [],
"value2": null,
"activity_Id": null,
"configuration_Id": "AF62B336-15A6-453B-AD4A-61EB7D43B99B",
"configurationName": "商品种类限制",
"configurationRule": "包含的商品种类",
"valueType": 2,
"configurationValueCount": 1
},
{
"configId": null,
"operator": null,
"value1": [],
"value2": null,
"activity_Id": null,
"configuration_Id": "ECBACC1C-6BA8-498E-BDE4-6A012881E0E7",
"configurationName": "门店限制",
"configurationRule": "包含的门店",
"valueType": 2,
"configurationValueCount": 1
},
{
"configId": null,
"operator": null,
"value1": [],
"value2": null,
"activity_Id": null,
"configuration_Id": "F06DEAD8-DDB8-4B27-94E9-389DE9AC155D",
"configurationName": "总参与次数限制",
"configurationRule": "总参与次数",
"valueType": 1,
"configurationValueCount": 1
}
]

/**
* 买满减现
* @returns
*/
const FullDecrement = () => {

const [couponInfo, SetCouponInfo] = useState([]);
const [couponForm] = Form.useForm();
const [form] = Form.useForm();
const [imgurl, setimgUrl] = useState(null);
/** 适用商品类型范围 */
const [applyGoodType, setApplyGoodType] = useState([]);

/**
* 适用商品范围
*/
const onFetchGoodsType = async () => {
const response = await startAPI.GetGoodsType();
if (response.statusCode === 200) {
const array = [];
Object.keys(response.data).forEach(item => {
array.push({
id: item,
name: response.data[item]
})
})
setApplyGoodType(array);
}
}

/** 适用门店范围 */
const [applicableStore, setApplicableStore] = useState([]);

/**
* 获取适用店铺
*/
const GetStores = async () => {
const response = await startAPI.GetStores();
if (response.statusCode === 200) {
setApplicableStore(response.data);
}
}

const uploadProp = {
name: 'file',
@@ -59,7 +170,7 @@ const FullDecrement = () => {
onProgress({ percent: Math.round(loaded / total * 100).toFixed(2) }, file);
},
}).then(response => {
couponForm.setFieldsValue({ activityImg: r.seeUrl });
form.setFieldsValue({ activityImg: r.seeUrl });
if (response.status == 200 || response.statusText == 'OK') {
setimgUrl(r.seeUrl)
}
@@ -70,9 +181,87 @@ const FullDecrement = () => {
},
};

/**
* 提交
* @param {*} values
*/
const onSubmitActivity = async (values) => {
values.activityType = 2;
values.activityRewards.forEach(item => {
item.id = "";
item.activityInfo_Id = "";
})
values.activityStartTime = moment(values.activityStartAndEndTime[0]).format('YYYY-MM-DD');
values.activityEndTime = moment(values.activityStartAndEndTime[1]).format('YYYY-MM-DD');
values.status = 0;
values.isShow = 1;
values.isDeleted = 0;
values.consumptionType = 0;
values.isGiftGoodsParticipate = 0;
values.activityConfiguration = [];
values.activityConfig.forEach(config => {
const findConfig = activityConfigArray.find(item => item.configuration_Id === config);
if (findConfig) {
findConfig.configId = [findConfig.configuration_Id];
if (findConfig.configurationName === '日参与次数限制') {
findConfig.operator = values.dayOperator;
findConfig.value1 = values.dayValue;
} else if (findConfig.configurationName === '星期限制') {
findConfig.operator = values.weekOperator;
findConfig.value1 = values.weekValue;
} else if (findConfig.configurationName === '消费金额') {
findConfig.operator = values.amountOperator;
findConfig.value1 = values.amountValue;
} else if (findConfig.configurationName === '商品种类限制') {
findConfig.operator = values.goodsTypeOperator;
findConfig.value1 = values.goodsTypeValue;
} else if (findConfig.configurationName === '门店限制') {
findConfig.operator = values.storeOperator;
findConfig.value1 = values.storeValue;
} else if (findConfig.configurationName === '总参与次数限制') {
findConfig.operator = values.totalOperator;
findConfig.value1 = values.totalValue;
}
values.activityConfiguration.push(findConfig);
}
});
delete values.activityConfig;
delete values.activityStartAndEndTime;

delete values.amountOperator;
delete values.amountValue;

delete values.dayOperator;
delete values.dayValue;

delete values.goodsTypeOperator;
delete values.goodsTypeValue;

delete values.storeOperator;
delete values.storeValue;

delete values.totalOperator;
delete values.totalValue;

delete values.weekOperator;
delete values.weekValue;
const response = await startAPI.FastAddActivity(values);
if (response.statusCode === 200) {
message.success('新建活动成功！');
form.resetFields();
} else {
message.error(response.errors || '创建失败 请重试！');
}
}

useEffect(() => {
onFetchGoodsType();
GetStores();
}, []);

return <div className={styles.activity_form_container} >
<Form
form={couponForm}
form={form}
name="basic"
labelCol={{
span: 3,
@@ -81,7 +270,7 @@ const FullDecrement = () => {
remember: true,
}}
onFinish={(values) => {
console.log('values', values);
onSubmitActivity(values);
}}
layout="vertical"
autoComplete="off"
@@ -156,7 +345,7 @@ const FullDecrement = () => {
</Form.Item>

<Form.Item
name="activityStartTime"
name="activityStartAndEndTime"
label="起止时间"
rules={[{ required: true }]}
>
@@ -185,12 +374,185 @@ const FullDecrement = () => {
</Upload>
</Form.Item>

<Form.Item name="isAutoSend" label="参与方式" rules={[{ required: true }]}>
<Select placeholder="请选择参与方式">
<Select.Option value="0">点击参与（需要用户主动点击）</Select.Option>
<Select.Option value="1">自动参与（满足特定条件自动参与）</Select.Option>
</Select>
</Form.Item>

<Form.Item name="activityConfig" label="活动配置" rules={[{ required: true, message: '请至少选择一个活动配置！' }]}>
<Checkbox.Group style={{
width: '100%',
}}>
<Row>
{
activityConfigArray.map((config, index) => {
return <Col key={index} span={24} style={{ marginBottom: '10px', display: 'flex', alignItems: 'center' }}>
<Checkbox style={{ minWidth: '230px' }} value={config.configuration_Id}>{config.configurationName}：{config.configurationRule}</Checkbox>
{index === 0 && (
<>
<Form.Item
name="dayOperator"
noStyle
>
<Select style={{ width: 80, margin: '0 20px' }} size='Small' placeholder="条件">
<Select.Option value=">">大于</Select.Option>
<Select.Option value="<">小于</Select.Option>
<Select.Option value="==">等于</Select.Option>
<Select.Option value=">=and<=">包含</Select.Option>
</Select>
</Form.Item>
<Form.Item
name="dayValue"
noStyle
>
<Input style={{ width: 280 }} placeholder="每日参与次数" />
</Form.Item>
</>
)}
{index === 1 && (
<>
<Form.Item
name="weekOperator"
noStyle
>
<Select style={{ width: 80, margin: '0 20px' }} size='Small' placeholder="条件">
<Select.Option value=">">大于</Select.Option>
<Select.Option value="<">小于</Select.Option>
<Select.Option value="==">等于</Select.Option>
<Select.Option value=">=and<=">包含</Select.Option>
</Select>
</Form.Item>
<Form.Item
name="weekValue"
noStyle
>
<Select style={{ width: 280 }} size='Small' mode="multiple" placeholder="星期">
<Select.Option value="1">星期一</Select.Option>
<Select.Option value="2">星期二</Select.Option>
<Select.Option value="3">星期三</Select.Option>
<Select.Option value="4">星期四</Select.Option>
<Select.Option value="5">星期五</Select.Option>
<Select.Option value="6">星期六</Select.Option>
<Select.Option value="0">星期日</Select.Option>
</Select>
</Form.Item>
</>
)}
{index === 2 && (
<>
<Form.Item
name="amountOperator"
noStyle
>
<Select style={{ width: 80, margin: '0 20px' }} size='Small' placeholder="条件">
<Select.Option value=">">大于</Select.Option>
<Select.Option value="<">小于</Select.Option>
<Select.Option value="==">等于</Select.Option>
<Select.Option value=">=and<=">包含</Select.Option>
</Select>
</Form.Item>
<Form.Item
name="amountValue"
noStyle
>
<Input style={{ width: 280 }} placeholder="消费金额" />
</Form.Item>
</>
)}
{index === 3 && (
<>
<Form.Item
name="goodsTypeOperator"
noStyle
>
<Select style={{ width: 80, margin: '0 20px' }} size='Small' placeholder="条件">
<Select.Option value=">">大于</Select.Option>
<Select.Option value="<">小于</Select.Option>
<Select.Option value="==">等于</Select.Option>
<Select.Option value=">=and<=">包含</Select.Option>
</Select>
</Form.Item>
<Form.Item
name="goodsTypeValue"
noStyle
>
<Select style={{ width: 280 }} size='Small' placeholder="商品种类" mode="multiple">
{
applyGoodType.map(item => {
return <Select.Option value={item.id} key={item.id}>
{item.name}
</Select.Option>
})
}
</Select>
</Form.Item>
</>
)}
{index === 4 && (
<>
<Form.Item
name="storeOperator"
noStyle
>
<Select style={{ width: 80, margin: '0 20px' }} size='Small' placeholder="条件">
<Select.Option value=">">大于</Select.Option>
<Select.Option value="<">小于</Select.Option>
<Select.Option value="==">等于</Select.Option>
<Select.Option value=">=and<=">包含</Select.Option>
</Select>
</Form.Item>
<Form.Item
name="storeValue"
noStyle
>
<Select style={{ width: 280 }} size='Small' mode="multiple" placeholder="门店">
{
applicableStore.map(item => {
return <Select.Option value={item.id} key={item.id}>
{item.name}
</Select.Option>
})
}
</Select>
</Form.Item>
</>
)}
{index === 5 && (
<>
<Form.Item
name="totalOperator"
noStyle
>
<Select style={{ width: 80, margin: '0 20px' }} size='Small' placeholder="条件">
<Select.Option value=">">大于</Select.Option>
<Select.Option value="<">小于</Select.Option>
<Select.Option value="==">等于</Select.Option>
<Select.Option value=">=and<=">包含</Select.Option>
</Select>
</Form.Item>
<Form.Item
name="totalValue"
noStyle
>
<Input style={{ width: 280 }} placeholder="总次数" />
</Form.Item>
</>
)}
</Col>
})
}
</Row>
</Checkbox.Group>
</Form.Item>

<Form.Item>
<Button type="primary" htmlType="submit">
提交
</Button>
<Button style={{ marginLeft: '20px' }} onClick={() => {
couponForm.resetFields();
form.resetFields();
setimgUrl(null);
}}>
重置


Write Preview
Loading…
Cancel
Save