Skip to content

J
jinfa-platform
Commit 7eefcd4a authored by 前端-黄佳鑫's avatar 前端-黄佳鑫
Browse files
Options

✨ feat(平台营销活动报名): 活动商品选择完善

parent 40215026
Hide whitespace changes
Inline Side-by-side
Showing with 302 additions and 87 deletions
src/pages/transaction/marketingAbility/components/couponItem/index.tsx
View file @ 7eefcd4a
......@@ -26,7 +26,11 @@ const CouponItem = (props) => {
<div className={styles.couponItemRight}>
<div className={styles.couponItemRight_type}>{fieldListData.typeName}</div>
<div className={styles.couponItemRight_info}>{fieldListData.name}</div>
<div className={styles.couponItemRight_date}>{format(fieldListData.effectiveTimeStart)}-{format(fieldListData.effectiveTimeEnd)}</div>
{ fieldListData.effectiveType === 1 ? (
<div className={styles.couponItemRight_date}>{format(fieldListData.effectiveTimeStart)}-{format(fieldListData.effectiveTimeEnd)}</div>
) : (
<div className={styles.couponItemRight_date}>{fieldListData.invalidDay}&nbsp;天</div>
)}
</div>
</Col>
</Row>
......
src/pages/transaction/marketingAbility/components/couponsListLayout/components/productLayout/index.tsx
View file @ 7eefcd4a
......@@ -55,7 +55,7 @@ export interface ProductLayoutProps {
/** 最外层标号 */
index: number,
/** list 数据 */
list: ListProps[],
list: any[],
/** 删除某一个 */
onDeletion: (_index: number) => void,
/** 输入数量或者套餐价格 */
......@@ -73,6 +73,8 @@ const ProductLayout: React.FC<ProductLayoutProps> = (props: any) => {
onEntry(name, Number(e.target.value), _index)
}
console.log(list)
return (
<Fragment>
{/* 套餐价格 */}
......@@ -118,7 +120,7 @@ const ProductLayout: React.FC<ProductLayoutProps> = (props: any) => {
)}
{remind.value !== 1 && (
<div className={style.couponLayout_contenxt}>
<Row style={{ height: '100%' }} wrap={false}>
<Row style={{ height: '100%', marginLeft: 10 }} wrap={false}>
<Col flex='none'>
<div className={style.couponLayout_item_left}>
<p>¥<span>{_item.denomination}</span></p>
......
src/pages/transaction/marketingAbility/components/couponsListLayout/index.tsx
View file @ 7eefcd4a
......@@ -2,7 +2,7 @@ import React, { useEffect, useState } from 'react';
import { Drawer, Button, Form, message } from 'antd';
import { PlusOutlined } from '@ant-design/icons';
import CollapseLayout from './components/collapseLayout';
import { isEmpty } from 'lodash';
import { isArray, isEmpty } from 'lodash';
import ProductLayout from './components/productLayout';
import CouponsLayout from '@/pages/transaction/marketingAbility/selfManagement/readySubmitExamine/components/couponsLayout';
......@@ -24,8 +24,7 @@ type RemindLayoutProps = {
message?: { [key: number]: string },
}
interface ListModalLayoutProps {
idNotInList?: number[],
interface CouponsListLayoutProps {
/** messges */
remind?: RemindLayoutProps,
/** 数据回显 */
......@@ -34,8 +33,6 @@ interface ListModalLayoutProps {
title?: string,
/** 显示隐藏 */
visible?: boolean,
/** 适用商城 */
shopIdList?: number[],
/** 关闭 */
onClose?: () => void,
/** 确定 */
......@@ -48,21 +45,11 @@ interface CouponGroupListProps {
/** 换购门槛优惠门槛数量或金额 */
limitValue?: number,
/** 明细 */
list?: {
id?: number,
/** 活动商品id */
activityGoodsId?: number,
/** 优惠券id */
couponId: number,
/** 优惠券名称 */
couponName: string,
/** 赠送数量 */
num?: number,
}[]
list?: any[]
}
const CouponsListLayout: React.FC<ListModalLayoutProps> = (props: any) => {
const { idNotInList, remind, value, shopIdList, title, visible, onClose, onConfirm } = props;
const CouponsListLayout: React.FC<CouponsListLayoutProps> = (props: any) => {
const { remind, value, title, visible, onClose, onConfirm } = props;
const [form] = Form.useForm();
const [couponSource, setCouponSource] = useState<CouponGroupListProps[]>([]);
const [tableModalVisible, setTableModalVisible] = useState<boolean>(false);
......@@ -83,35 +70,114 @@ const CouponsListLayout: React.FC<ListModalLayoutProps> = (props: any) => {
}
/** 组合数据到dataSource */
const handleComposed = (selectRowRecord?: any) => {
const fields: CouponGroupListProps[] = [...couponSource];
fields[idx].groupNo = (idx + 1);
if (isArray(selectRowRecord)) {
fields[idx].list = [...selectRowRecord]
}
fields.forEach((item, _index) => {
item.list.forEach((_item, __index) => {
form.setFieldsValue({
[`dataSource_${idx}`]: fields[idx].list,
[`limitValue_${_index}`]: item.limitValue,
[`num_${_index}_${__index}`]: _item.num,
})
})
})
setCouponSource(fields);
}
const handleCouponSubmit = (selectRowRecord: any) => {
console.log(selectRowRecord, 10086)
if (isEmpty(selectRowRecord)) {
message.warning(remind.message[1])
return
}
handleComposed(selectRowRecord)
toggle(false);
}
const handleClick = () => {
console.log('提交')
form.validateFields().then(_res => {
if (isEmpty(_res)) {
message.warning(remind.message[2])
return
}
onConfirm(couponSource)
})
}
/** 删除一个 */
const handleDeletion = (index: number) => {
console.log(index)
const fields = [...couponSource];
fields.splice(index, 1);
fields.forEach((item, _index) => {
item.list.forEach((_item, __index) => {
form.setFieldsValue({
[`limitValue_${_index}`]: item.limitValue,
[`num_${_index}_${__index}`]: _item.num,
})
})
})
setCouponSource(fields);
}
/** 选择搭配优惠券 */
const handleCollocation = (_idx: number) => {
const fields = [...couponSource];
fields.forEach((item, _index) => {
item.list.forEach((_item, __index) => {
form.setFieldsValue({
[`limitValue_${_index}`]: item.limitValue,
[`num_${_index}_${__index}`]: _item.num,
})
})
})
setIdx(_idx);
toggle(true)
}
/** 输入一个价格或者数量 */
const handleEntryNumber = (index: number, name: string, num: number, _index?: number) => {
console.log(index, name, num, _index)
const fields: CouponGroupListProps[] = [...couponSource];
if (name === 'limitValue') {
fields[index][name] = Number(num);
} else {
fields[index].list[_index][name] = Number(num);
}
setCouponSource(fields)
}
/** 删除一个赠送优惠券 */
const handleDeletionColloCation = (index: number, _index: number) => {
console.log(index, _index)
const fields: CouponGroupListProps[] = [...couponSource];
fields[index].list.splice(_index, 1);
fields.forEach((item, _index) => {
item.list.forEach((_item, __index) => {
form.setFieldsValue({
[`limitValue_${_index}`]: item.limitValue,
[`num_${_index}_${__index}`]: _item.num,
})
})
})
setCouponSource(fields);
}
useEffect(() => {
const fields = [...value];
fields.forEach((item, _index) => {
item.list.forEach((_item, __index) => {
form.setFieldsValue({
[`dataSource_${_index}`]: fields[_index].list,
[`limitValue_${_index}`]: item.limitValue,
[`num_${_index}_${__index}`]: _item.num,
})
})
})
setCouponSource(value);
}, [value])
return (
<Drawer
width={600}
......@@ -169,6 +235,7 @@ const CouponsListLayout: React.FC<ListModalLayoutProps> = (props: any) => {
visible={tableModalVisible}
onClose={() => toggle(false)}
onSubmit={handleCouponSubmit}
value={couponSource[idx]}
/>
</Drawer>
)
......
src/pages/transaction/marketingAbility/components/listModalLayout/index.tsx
View file @ 7eefcd4a
......@@ -110,8 +110,14 @@ const ListModalLayout: React.FC<ListModalLayoutProps> = (props: any) => {
}
})]
}
form.setFieldsValue({
[`dataSource_${idx}`]: fields[idx].list,
fields.forEach((item, _index) => {
item.list.forEach((_item, __index) => {
form.setFieldsValue({
[`dataSource_${idx}`]: fields[idx].list,
[`limitValue_${_index}`]: item.limitValue,
[`num_${_index}_${__index}`]: _item.num,
})
})
})
setDataSource(fields);
}
......@@ -162,7 +168,6 @@ const ListModalLayout: React.FC<ListModalLayoutProps> = (props: any) => {
const handleDeletion = (index: number) => {
const fields = [...dataSource];
fields.splice(index, 1);
form.resetFields()
fields.forEach((item, _index) => {
item.list.forEach((_item, __index) => {
form.setFieldsValue({
......@@ -195,7 +200,6 @@ const ListModalLayout: React.FC<ListModalLayoutProps> = (props: any) => {
const handleDeletionColloCation = (index: number, _index: number) => {
const fields: GoodsSubsidiaryListProps[] = [...dataSource];
fields[index].list.splice(_index, 1);
form.resetFields()
fields.forEach((item, _index) => {
item.list.forEach((_item, __index) => {
form.setFieldsValue({
......
src/pages/transaction/marketingAbility/selfManagement/readySubmitExamine/components/productListLayout/index.tsx → src/pages/transaction/marketingAbility/components/productListLayout/index.tsx
View file @ 7eefcd4a
......@@ -2,13 +2,14 @@ import React, { useEffect, useMemo, useState } from 'react';
import { Button, message, Table, Form, FormInstance } from 'antd';
import { Columns } from './columns';
import { EventEmitter } from '@umijs/hooks/lib/useEventEmitter'
import CardLayout from '../card';
import CardLayout from '../../selfManagement/readySubmitExamine/components/card';
import { PlusOutlined } from '@ant-design/icons';
import { isEmpty } from 'lodash';
import { PublicApi } from '@/services/api';
import ListModalLayout from '@/pages/transaction/marketingAbility/components/listModalLayout';
import CollocationLayout from '@/pages/transaction/marketingAbility/components/collocationLayout';
import { remindLayout, RemindLayoutProps } from '@/pages/transaction/marketingAbility/paltformSign/readySubmitExamine/components/productListLayout/remind';
import CouponsListLayout from '@/pages/transaction/marketingAbility/components/couponsListLayout';
type optionProps = {
/** key */
......@@ -21,16 +22,20 @@ type optionProps = {
interface ProductListProps {
/** 活动id */
activityId?: number,
activityId?: any,
form?: FormInstance,
/** umi-hooks */
focus$?: EventEmitter<void>,
/** 适用商城 */
shopIdList?: number[],
/** 接口 */
fieldApi?: () => Promise<unknown>,
/** 活动规则 -> 有则不调用form.getFieldValue */
getActivityDefinedBO?: any,
}
const ProductListLayout: React.FC<ProductListProps> = (props: any) => {
const { activityId, form, focus$, shopIdList } = props;
const { activityId, form, focus$, shopIdList, fieldApi, getActivityDefinedBO } = props;
const [value, setValue] = useState<number>(1);
const [productVisible, setProductVisible] = useState<boolean>(false);
const [listModalVisible, setListModalVisible] = useState<boolean>(false);
......@@ -69,15 +74,16 @@ const ProductListLayout: React.FC<ProductListProps> = (props: any) => {
/** 设置搭配 */
const handlCollocation = (record: any) => {
const tableRecord: any = {...record}
if (tableRecord.goodsSubsidiaryGroupList !== undefined) {
const tableRecord: any = { ...record }
if (remind.value !== 1 && tableRecord.couponGroupList !== undefined) {
setCollocation(tableRecord.couponGroupList)
} else if (remind.value === 1 && tableRecord.goodsSubsidiaryGroupList !== undefined) {
setCollocation(tableRecord.goodsSubsidiaryGroupList)
} else {
setCollocation([])
}
setSkuId(tableRecord.skuId)
setListModalVisible(true);
console.log(record)
}
const columns = useMemo(() => {
......@@ -85,7 +91,7 @@ const ProductListLayout: React.FC<ProductListProps> = (props: any) => {
}, [value, dataSource])
const toggle = (flag: boolean) => {
const activityDefinedBO = form.getFieldValue('activityDefinedBO');
const activityDefinedBO = form.getFieldValue('activityDefinedBO') || getActivityDefinedBO;
if (isEmpty(shopIdList)) {
message.warning('请选择适用商城！');
return
......@@ -121,12 +127,12 @@ const ProductListLayout: React.FC<ProductListProps> = (props: any) => {
}
useEffect(() => {
if (activityId) {
PublicApi.getMarketingMerchantActivityDetailGoodsPage({ current: '1', pageSize: '999', activityId }).then(res => {
if (!isEmpty(activityId)) {
fieldApi({ current: '1', pageSize: '999', ...activityId }).then(res => {
if (res.code !== 1000) {
return
}
const activityDefinedBO = form.getFieldValue('activityDefinedBO');
const activityDefinedBO = form.getFieldValue('activityDefinedBO') || getActivityDefinedBO;
if (value === 6) {
setRemind(remindLayout(value, activityDefinedBO.giveType, activityDefinedBO.giftType));
}
......@@ -149,6 +155,7 @@ const ProductListLayout: React.FC<ProductListProps> = (props: any) => {
handlesStFieldsValue()
}, [dataSource])
/** 设置搭配商品 */
const handleConfirm = (params: any) => {
const fields = [...dataSource];
fields.forEach(item => {
......@@ -160,6 +167,18 @@ const ProductListLayout: React.FC<ProductListProps> = (props: any) => {
setDataSource(fields)
}
/** 设置优惠券 */
const handleCouponConfirm = (params: any) => {
const fields = [...dataSource];
fields.forEach(item => {
if (item.skuId === skuId) {
item.couponGroupList = [...params]
}
})
setListModalVisible(false)
setDataSource(fields)
}
return (
<CardLayout
id="productListLayout"
......@@ -187,7 +206,7 @@ const ProductListLayout: React.FC<ProductListProps> = (props: any) => {
onConfirm={handleSelectActiveProducts}
/>
{/* 设置搭配商品 */}
{(!isEmpty(remind) && remind.value !== 1) && (
{(!isEmpty(remind) && remind.value === 1) && (
<ListModalLayout
title={remind.modalTitle}
remind={remind}
......@@ -199,6 +218,17 @@ const ProductListLayout: React.FC<ProductListProps> = (props: any) => {
value={collocation}
/>
)}
{/* 设置优惠券 */}
{(!isEmpty(remind) && remind.value !== 1) && (
<CouponsListLayout
title={remind.modalTitle}
remind={remind}
visible={listModalVisible}
onClose={() => setListModalVisible(false)}
onConfirm={handleCouponConfirm}
value={collocation}
/>
)}
</Form.Item>
</CardLayout>
)
......
src/pages/transaction/marketingAbility/paltformSign/readySubmitExamine/add.tsx
View file @ 7eefcd4a
import React, { Fragment, useCallback, useState } from 'react';
import { Button, message } from 'antd';
import React, { useCallback, useState } from 'react';
import { Button, message, Form } from 'antd';
import { history, Prompt } from 'umi';
import { useEventEmitter } from '@umijs/hooks';
import { Context } from '@/pages/transaction/components/detailLayout/components/context';
import PeripheralLayout from '@/pages/transaction/components/detailLayout';
import ProgressLayout from '@/pages/transaction/components/detailLayout/components/progressLayout';
......@@ -14,8 +15,8 @@ import ActivityUserLayout from '../../components/activityUserLayout';
import DemandLayout from '../../components/demandLayout';
import { PublicApi } from '@/services/api';
import { isEmpty } from 'lodash';
import ProductListLayout from './components/productListLayout';
import { SaveOutlined } from '@ant-design/icons';
import ProductListLayout from '../../components/productListLayout';
const TABLINK = [
{ id: 'progressLayout', title: '流转进度' },
......@@ -30,15 +31,19 @@ const TABLINK = [
const DetialLayout = () => {
const { query: { activityId, signUpId }, pathname } = history.location;
const [path] = useState(pathname.split('/')[pathname.split('/').length - 1]);
const focus$ = useEventEmitter();
const [form] = Form.useForm();
const [loading, setLoading] = useState<boolean>(false)
const [unsaved, setUnsaved] = useState<boolean>(false);
const [productList, setProductList] = useState<any[]>([]);
const [shopIdList, setShopIdList] = useState<number[]>([]);
const format = (text, fmt?: string) => {
return <>{moment(text).format(fmt || "YYYY-MM-DD HH:mm:ss")}</>
}
const [dataSource, setDataSource] = useState<any>({});
const [basicEffect, setBasicEffect] = useState<any>([]);
const [generalEffect, setGeneralEffect] = useState<any>([]);
const [activityDefinedBO, setActivityDefinedBO] = useState<any>({});
const handleBasicEffect = (data: any) => {
setBasicEffect([
......@@ -89,27 +94,50 @@ const DetialLayout = () => {
})
})
data.externalLogStates = externalLogStates;
const option: any = {value: data.activityType};
focus$.emit(option)
setDataSource(data);
handleBasicEffect(data)
handleBasicEffect(data);
setShopIdList(data.shopList.map(item => { return item.shopId }));
setActivityDefinedBO(data.activityDefinedBO)
handleGeneralEffect(data.activityDefinedBO, data.activityType)
}).catch(() => { })
}, [])
useEffect(() => {
fetchDataSource();
// handleGeneralEffect(_data);
}, [])
const handleSubmit = useCallback(async () => {
const params: any = {
activityId,
productList,
}
signUpId !== null && (params.id = signUpId)
if (!isEmpty(productList)) {
form.validateFields().then(res => {
const param: any = {
activityId,
productList: res.productList.map(item => {
if (item.couponGroupList) {
return {
...item,
couponGroupList: item.couponGroupList.map(_item => {
return {
..._item,
list: _item.list.map(__item => {
return {
activityGoodsId: item.productId,
couponId: __item.id,
couponName: __item.name,
num: __item.num,
}
})
}
})
}
}
return item
})
}
signUpId !== null && (param.id = signUpId);
setLoading(true)
const fieldApi = (path === 'add' ? PublicApi.postMarketingPlatformActivitySignupSave : PublicApi.postMarketingPlatformActivitySignupUpdate)
fieldApi({ ...params }).then(res => {
fieldApi({ ...param }).then(res => {
if (res.code !== 1000) {
setLoading(false)
return
......@@ -120,19 +148,9 @@ const DetialLayout = () => {
}).catch(_err => {
setLoading(false)
})
} else {
message.warn('请选择活动商品!')
}
})
}, [productList])
const handleGetDataSoure = (e) => {
if (!unsaved) {
setUnsaved(true)
}
setProductList([...e])
}
return (
<Context.Provider value={dataSource}>
<PeripheralLayout
......@@ -150,7 +168,14 @@ const DetialLayout = () => {
</Button>
}
components={
<Fragment>
<Form
form={form}
onValuesChange={() => {
if (!unsaved) {
setUnsaved(true)
}
}}
>
<ProgressLayout />
<BasicLayout effect={basicEffect} />
<GeneralLayout
......@@ -159,11 +184,12 @@ const DetialLayout = () => {
anchor="activityRuleLayout"
effect={generalEffect}
/>
<ProductListLayout signUpId={signUpId !== 'null' && signUpId} data={dataSource} getDataSource={handleGetDataSoure} />
{/* <ProductListLayout signUpId={signUpId !== 'null' && signUpId} data={dataSource} getDataSource={handleGetDataSoure} /> */}
<ProductListLayout getActivityDefinedBO={activityDefinedBO} activityId={signUpId && {signUpId: signUpId}} form={form} focus$={focus$} shopIdList={shopIdList} fieldApi={PublicApi.getMarketingPlatformActivitySignupDetailGoodsPage} />
<ActivityUserLayout dataScoure={dataSource} />
<DemandLayout storeList={dataSource.shopList} />
<RecordLyout />
</Fragment>
</Form>
}
/>
<Prompt when={unsaved} message="您还有未保存的内容，是否确定要离开？" />
......
src/pages/transaction/marketingAbility/paltformSign/readySubmitExamine/components/productListLayout/remind.ts
View file @ 7eefcd4a
......@@ -32,15 +32,15 @@ export const remindLayout = (int, giveType?, giftType?) => {
label: {
1: '优惠门槛',
2: giveType === 1 ? '元' : '个',
3: '赠送商品',
3: giveType === 1 ? '赠送商品' : '赠送优惠券',
4: '赠送数量',
5: '买',
6: '',
},
message: {
1: '请选择赠送商品!',
2: '请设置赠送商品!',
3: '请选择赠送商品!',
1: giveType === 1 ? '请选择赠送商品!' : '请选择赠送优惠券!',
2: giveType === 1 ? '请设置赠送商品!' : '请设置赠送优惠券!',
3: giveType === 1 ? '请选择赠送商品!' : '请选择赠送优惠券!',
4: '请输入优惠门槛!',
5: '请输入赠送数量!',
}
......
src/pages/transaction/marketingAbility/selfManagement/detail/constants.tsx
View file @ 7eefcd4a
......@@ -286,7 +286,7 @@ export const GeneralEffect = (int, data) => {
return [
{
col: [
{ label: '每日秒杀时间段', extra: `${format(data.startTime, 'HH:mm:ss')}~${format(data.endTime, 'HH:mm:ss')}` },
{ label: '每日秒杀时间段', extra: <>{format(data.startTime, 'HH:mm:ss')}~{format(data.endTime, 'HH:mm:ss')}</>},
{ label: '活动描述', extra: data.describe }
]
},
......@@ -363,13 +363,13 @@ export const GeneralEffect = (int, data) => {
return [
{
col: [
{ label: '抽取用户时间', extra: '' },
{ label: '抽取用户时间', extra: data.extractAttemptUserTime && format(data.extractAttemptUserTime, 'YYYY-MM-DD HH:mm:ss') },
{ label: '活动描述', extra: data.describe },
]
},
{
col: [
{ label: '试用结束时间', extra: '' },
{ label: '试用结束时间', extra: data.attemptEndTime && format(data.attemptEndTime, 'YYYY-MM-DD HH:mm:ss') },
]
}
]
......
src/pages/transaction/marketingAbility/selfManagement/readySubmitExamine/add.tsx
View file @ 7eefcd4a
......@@ -7,7 +7,7 @@ import PeripheralLayout from '@/pages/transaction/components/detailLayout';
import BasicInfoLayout from './components/basicInfoLayout';
import RulesLayout from './components/rulesLayout';
import ShopLayout from './components/shopLayout';
import ProductListLayout from './components/productListLayout';
import ProductListLayout from '../../components/productListLayout';
import PartakeUserLayout from './components/partakeUserLayout';
import moment from 'moment';
import { PublicApi } from '@/services/api';
......@@ -96,7 +96,42 @@ const AddedMarketing = () => {
oldMember: (res.allUser.includes(4) ? 1 : 0),
memberLevelList,
shopList: res.shopList,
productList: res.productList
productList: res.productList.map(item => {
if (item.couponGroupList) {
return {
...item,
couponGroupList: item.couponGroupList.map(_item => {
return {
..._item,
list: _item.list.map(__item => {
return {
activityGoodsId: item.productId,
couponId: __item.id,
couponName: __item.name,
num: __item.num,
}
})
}
})
}
}
return item
})
}
if (res['activityDefinedBO']['assembleTime']) {
params['activityDefinedBO'].assembleTime = Number(moment(res['activityDefinedBO']['assembleTime']).format('x'));
}
if (res['activityDefinedBO']['startTime']) {
params['activityDefinedBO']['startTime'] = Number(moment(res['activityDefinedBO']['startTime']).format('x'));
}
if (res['activityDefinedBO']['endTime']) {
params['activityDefinedBO']['endTime'] = Number(moment(res['activityDefinedBO']['endTime']).format('x'));
}
if (res['activityDefinedBO']['extractAttemptUserTime']) {
params['activityDefinedBO']['extractAttemptUserTime'] = Number(moment(res['activityDefinedBO']['extractAttemptUserTime']).format('x'));
}
if (res['activityDefinedBO']['attemptEndTime']) {
params['activityDefinedBO']['attemptEndTime'] = Number(moment(res['activityDefinedBO']['attemptEndTime']).format('x'));
}
setLoading(true)
path !== 'add' && (params.id = id);
......@@ -126,6 +161,21 @@ const AddedMarketing = () => {
}
})[0]
focus$.emit(option)
if (data['activityDefinedBO']['assembleTime']) {
data['activityDefinedBO']['assembleTime'] = moment(data['activityDefinedBO']['assembleTime']);
}
if (data['activityDefinedBO']['startTime']) {
data['activityDefinedBO']['startTime'] = moment(data['activityDefinedBO']['startTime']);
}
if (data['activityDefinedBO']['endTime']) {
data['activityDefinedBO']['endTime'] = moment(data['activityDefinedBO']['endTime']);
}
if (data['activityDefinedBO']['extractAttemptUserTime']) {
data['activityDefinedBO']['extractAttemptUserTime'] = moment(data['activityDefinedBO']['extractAttemptUserTime']);
}
if (data['activityDefinedBO']['attemptEndTime']) {
data['activityDefinedBO']['attemptEndTime'] = moment(data['activityDefinedBO']['attemptEndTime']);
}
form.setFieldsValue({
allUser: [data.newUser && 1, data.oldUser && 2, data.newMember && 3, data.oldMember && 4],
activityDefinedBO: data.activityDefinedBO,
......@@ -179,7 +229,7 @@ const AddedMarketing = () => {
<BasicInfoLayout form={form} focus$={focus$} />
<RulesLayout form={form} focus$={focus$} />
<ShopLayout onGetShopList={handleGetShopList} onSetShopList={shopList} />
<ProductListLayout activityId={activityId} form={form} focus$={focus$} shopIdList={shopIdList} />
<ProductListLayout activityId={activityId && { activityId: activityId }} form={form} focus$={focus$} shopIdList={shopIdList} fieldApi={PublicApi.getMarketingMerchantActivityDetailGoodsPage} />
<PartakeUserLayout onGetLevel={handleGetLevel} onSetLevel={memberLevelList} setMemberType={memberType} />
</Form>
}
......
src/pages/transaction/marketingAbility/selfManagement/readySubmitExamine/components/couponsLayout/index.tsx
View file @ 7eefcd4a
import React, { useEffect, useState } from 'react';
import { Drawer, Space, Form, Select, Input, Button, Row, Col, Checkbox, Empty } from 'antd';
import { Drawer, Space, Form, Select, Input, Button, Row, Col, Checkbox, Empty, Pagination } from 'antd';
import { CaretDownOutlined } from '@ant-design/icons';
import { PublicApi } from '@/services/api';
import CouponItem from '@/pages/transaction/marketingAbility/components/couponItem';
import styles from './index.less';
import { isEmpty } from 'lodash';
interface CouponsLayoutProps {
/** 显示 */
......@@ -12,10 +13,12 @@ interface CouponsLayoutProps {
onClose?: () => void,
/** 提交 */
onSubmit?: (e: any) => void,
/** 已选择的id */
value?: any,
}
const CouponsLayout: React.FC<CouponsLayoutProps> = (props: any) => {
const { visible, onClose, onSubmit } = props;
const { visible, onClose, onSubmit, value } = props;
const [form] = Form.useForm();
const [state, setState] = useState({
filterSearch: false
......@@ -24,9 +27,11 @@ const CouponsLayout: React.FC<CouponsLayoutProps> = (props: any) => {
current: 1,
pageSize: 10,
})
const [total, setTotal] = useState<number>(0);
const [couponList, setCouponList] = useState<any[]>([]);
const [chekedId, setCheckedId] = useState<number[]>([]); // 已选择的优惠券
const [couponsList, setCouponsList] = useState<any[]>([]);
const [selectCouponList, setSelectCouponList] = useState<any[]>([]); // checkbox 勾选到的数据 需要去重
const [couponsList, setCouponsList] = useState<any[]>([]); // 提交的优惠券
const changeFilterVisible = () => {
setState({
filterSearch: !state.filterSearch,
......@@ -40,8 +45,9 @@ const CouponsLayout: React.FC<CouponsLayoutProps> = (props: any) => {
if (res.code !== 1000) {
return
}
const { data } = res.data
const { data, totalCount } = res.data
setCouponList(data)
setTotal(totalCount)
})
})
}
......@@ -56,7 +62,7 @@ const CouponsLayout: React.FC<CouponsLayoutProps> = (props: any) => {
if (visible) {
handleSubmit()
}
}, [visible])
}, [visible, params])
const handleOnOk = () => {
onSubmit(couponsList)
......@@ -75,17 +81,39 @@ const CouponsLayout: React.FC<CouponsLayoutProps> = (props: any) => {
)
}
const _setCheckList = (_e, item: any) => {
const ids = [...chekedId]
const _setCheckList = (_e, _item) => {
const ids = [...chekedId];
const selcetLits = [...selectCouponList];
if (!ids.includes(_e)) {
setCouponsList([...couponsList, item])
setCheckedId([...chekedId, _e])
setCheckedId([...ids, _e])
setSelectCouponList([...selcetLits, _item])
} else {
setCouponsList(couponsList.filter(_item => _item.couponId !== _e))
setCheckedId(ids.filter(_item => _item !== _e));
setSelectCouponList(selcetLits.filter(_item => _item.id !== _e))
}
}
useEffect(() => {
const newData = selectCouponList.filter(_item => chekedId.includes(_item.id));
console.log(newData, 98)
setCouponsList(newData)
}, [chekedId])
useEffect(() => {
if (!isEmpty(value)) {
const newChekedId = value.list.map((_item: any) => _item.id);
setCheckedId(newChekedId)
setSelectCouponList(value.list)
}
}, [value])
const handlePagination = (page, pageSize) => {
setParams({
current: page,
pageSize: pageSize,
})
}
return (
<Drawer
width={630}
......@@ -93,6 +121,7 @@ const CouponsLayout: React.FC<CouponsLayoutProps> = (props: any) => {
visible={visible}
onClose={onClose}
footer={renderFooter()}
destroyOnClose
>
<Form
form={form}
......@@ -150,6 +179,9 @@ const CouponsLayout: React.FC<CouponsLayoutProps> = (props: any) => {
</Col>
)
})}
<Col span={24} style={{ display: 'flex' ,justifyContent: 'flex-end'}}>
<Pagination size="small" total={total} current={params.current} onChange={handlePagination}/>
</Col>
</Row>
)}
</Form>
......
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