Commit 1362153c authored by Bill's avatar Bill

Merge branch 'v2' of 10.0.0.22:lingxi/lingxi-business-system into v2

parents a55d2a37 d82acc45
import React, { useState, useRef, useMemo, useEffect } from 'react';
import { history } from 'umi';
import { Drawer, Button, Radio, message, Space, Typography } from 'antd';
import { PlayCircleOutlined, PoweroffOutlined } from '@ant-design/icons';
import { StandardTable } from 'god';
import { PublicApi } from '@/services/api';
import { formatTimeString } from '@/utils'
import { FORM_FILTER_PATH } from '@/formSchema/const';
import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch';
import Search from '@/components/NiceForm/components/Search';
import DateRangePickerUnix from '@/components/NiceForm/components/DateRangePickerUnix'
import Submit from '@/components/NiceForm/components/Submit'
import StatusTag from '@/components/StatusTag'
import * as tableSchemas from './schema';
const options = [
{ label: '平台', value: 1 },
{ label: '商家', value: 2 },
];
interface ActivityDrawerProps {
visible: boolean,
onClose: () => void,
onConfirm?: (record) => void,
selectId?: string
}
const ActivityDrawer: React.FC<ActivityDrawerProps> = (props: ActivityDrawerProps) => {
const { visible, onClose, onConfirm, selectId } = props;
const { query: { shopId, environment } }: any = history.location
const [type, setType] = useState(1);
const [selectedRowKeys, setSelectedRowKeys] = useState<any>(selectId ? [selectId] : []);
const [selectedRows, setSelectedRows] = useState<any>([]);
const ref = useRef<any>({});
const _schema = useMemo(() => {
return tableSchemas[`ActivitySchema${type}`]
}, [type])
useEffect(() => {
setSelectedRowKeys(selectId ? [selectId] : []);
},[selectId])
const columns = [
{
title: '活动信息',
dataIndex: 'name',
key: 'name',
render: (text: any, record: any) => (
<Space direction='horizontal' style={{ width: 300 }}>
<img src={record.templatePicUrl} style={{ width: 40, height: 40, borderRadius: 4 }} />
<Space direction='vertical' style={{ width: 300 }}>
{text}
<Typography.Text type='secondary'>ID:{record.id}</Typography.Text>
</Space>
</Space>
)
},
{
title: '类型',
dataIndex: 'templateName',
key: 'templateName'
},
{
title: '有效期',
dataIndex: 'startTime',
key: 'startTime',
render: (_: any, record: any) => <>
<div><PlayCircleOutlined />&nbsp;{formatTimeString(record.startTime,'YYYY-MM-DD HH:mm')}</div>
<div><PoweroffOutlined />&nbsp;{formatTimeString(record.endTime,'YYYY-MM-DD HH:mm')}</div>
</>
},
{
title: '所属',
dataIndex: 'memberName',
key: 'memberName',
render: (text: any, record: any) => (
<Space direction='vertical'>
<StatusTag title={record.type === 1 ? '平台' : '商家'} type={record.type === 1 ? 'success' : 'primary'} />
{record.type === 2 && <Typography.Text type='secondary'>{text}</Typography.Text>}
</Space>
)
},
]
const _onConfirm = () => {
if (selectedRows.length > 0) {
onConfirm?.(selectedRows[0]);
} else {
message.warning('请选择一条记录')
}
}
const _onRadioChange = (e: any) => {
setType(e.target.value);
ref?.current?.reload();
}
const fetchTableData = async (params: any) => {
const _params = { ...params, environment, type, shopId }
const { data } = await PublicApi.getTemplateWebActivityPageListAdorn(_params);
return data;
}
const rowSelection: any = {
selectedRowKeys,
onChange: (selectedRowKeys, selectedRows) => {
setSelectedRows(selectedRows);
setSelectedRowKeys(selectedRowKeys)
},
type: 'radio'
}
return (
<Drawer
width={1200}
title={'选择活动'}
visible={visible}
onClose={onClose}
footer={
<div style={{ textAlign: 'right', }}>
<Button onClick={onClose} style={{ marginRight: 8 }}>取消</Button>
<Button onClick={_onConfirm} type="primary">确定</Button>
</div>
}
>
<StandardTable
keepAlive={false}
fetchTableData={params => fetchTableData(params)}
columns={columns}
currentRef={ref}
rowSelection={rowSelection}
rowKey={'id'}
formilyLayouts={{
justify: 'space-between'
}}
formilyProps={{
ctx: {
inline: false,
schema: _schema,
effects: ($, actions) => {
useStateFilterSearchLinkageEffect(
$,
actions,
'name',
FORM_FILTER_PATH,
);
},
components: { ModalSearch: Search, DateRangePickerUnix, Submit },
},
layouts: {
order: 1,
span: 16
}
}}
formilyChilds={{
children: (
<div style={{ textAlign: 'right' }}>
<Radio.Group
options={options}
onChange={_onRadioChange}
value={type}
optionType="button"
/>
</div>
),
layouts: {
order: 2,
span: 8
}
}}
/>
</Drawer>
)
}
export default ActivityDrawer;
import { ISchema } from '@formily/antd';
import { FORM_FILTER_PATH } from '@/formSchema/const';
export const ActivitySchema1: ISchema = {
type: 'object',
properties: {
name: {
type: 'string',
'x-component': 'ModalSearch',
'x-component-props': {
placeholder: '搜索',
allowClear: true,
align: 'flex-start',
},
},
[FORM_FILTER_PATH]: {
type: 'object',
'x-component': 'flex-layout',
'x-component-props': {
rowStyle: {
flexWrap: 'nowrap',
justifyContent: 'flex-start',
},
colStyle: {
marginRight: 20,
},
},
properties: {
'[startTime,endTime]': {
type: 'array',
'x-component': 'DateRangePickerUnix',
'x-component-props': {
placeholder: ['开始时间','结束时间'],
allowClear: true,
},
},
sumbit: {
'x-component': 'Submit',
'x-mega-props': {
span: 1,
},
'x-component-props': {
children: '查询',
},
},
},
},
},
};
export const ActivitySchema2: ISchema = {
type: 'object',
properties: {
name: {
type: 'string',
'x-component': 'ModalSearch',
'x-component-props': {
placeholder: '搜索',
allowClear: true,
align: 'flex-start',
},
},
[FORM_FILTER_PATH]: {
type: 'object',
'x-component': 'flex-layout',
'x-component-props': {
rowStyle: {
flexWrap: 'nowrap',
justifyContent: 'flex-start',
},
colStyle: {
marginRight: 20,
},
},
properties: {
memberName: {
type: 'string',
'x-component-props': {
placeholder: '商家名称',
allowClear: true,
},
},
'[startTime,endTime]': {
type: 'array',
'x-component': 'DateRangePickerUnix',
'x-component-props': {
placeholder: ['开始时间','结束时间'],
allowClear: true,
},
},
sumbit: {
'x-component': 'Submit',
'x-mega-props': {
span: 1,
},
'x-component-props': {
children: '查询',
},
},
},
},
},
};
import React, { useState, useRef, useMemo, useEffect } from 'react';
import { history } from 'umi';
import { Drawer, Button, Radio, message, Space, Typography } from 'antd';
import { PlayCircleOutlined, PoweroffOutlined } from '@ant-design/icons';
import { StandardTable } from 'god';
import { PublicApi } from '@/services/api';
import { formatTimeString } from '@/utils'
import { priceFormat } from '@/utils/numberFomat'
import { FORM_FILTER_PATH } from '@/formSchema/const';
import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch';
import Search from '@/components/NiceForm/components/Search';
import Submit from '@/components/NiceForm/components/Submit'
import StatusTag from '@/components/StatusTag'
import CouponPlatformIcon from '@/pages/pageCustomized/icons/coupon_platform.png';
import CouponShopIcon from '@/pages/pageCustomized/icons/coupon_shop.png';
import * as tableSchemas from './schema';
const options = [
{ label: '平台', value: 1 },
{ label: '商家', value: 2 },
];
interface CouponsDrawerProps {
visible: boolean,
onClose: () => void,
onConfirm?: (record) => void,
selectId?: number
}
const CouponsDrawer: React.FC<CouponsDrawerProps> = (props: CouponsDrawerProps) => {
const { visible, onClose, onConfirm, selectId } = props;
const { query: { shopId } }: any = history.location
const [type, setType] = useState(1);
const [selectedRowKeys, setSelectedRowKeys] = useState<any>(selectId ? [selectId] : []);
const [selectedRows, setSelectedRows] = useState<any>([]);
const ref = useRef<any>({});
const _schema = useMemo(() => {
return tableSchemas[`CouponSchema${type}`]
}, [type])
useEffect(() => {
setSelectedRowKeys(selectId ? [selectId] : []);
}, [selectId])
// useEffect(() => {
// ref?.current?.reload();
// }, [type, ref?.current])
const columns = [
{
title: '优惠券信息',
dataIndex: 'name',
key: 'name',
render: (text: any, record: any) => (
<Space direction='horizontal' style={{ width: 300 }}>
<img src={record.type === 1 ? CouponPlatformIcon : CouponShopIcon} style={{ width: 40, height: 40, borderRadius: 4 }} />
<Space direction='vertical' style={{ width: 300 }}>
{text}
<Typography.Text type='secondary'>ID:{record.id}</Typography.Text>
</Space>
</Space>
)
},
{
title: '类型',
dataIndex: 'typeName',
key: 'typeName'
},
{
title: '领劵方式',
dataIndex: 'getWayName',
key: 'getWayName'
},
{
title: '面额',
dataIndex: 'denomination',
key: 'denomination',
render: (text: any) => (
<span style={{ color: '#D32F2F' }}>¥ {priceFormat(text)}</span>
)
},
{
title: '使用条件',
dataIndex: 'useConditionMoney',
key: 'useConditionMoney',
render: (text: any) => (
`满 ${text} 元使用`
)
},
{
title: '有效期',
dataIndex: 'releaseTimeEnd',
key: 'releaseTimeEnd',
render: (_: any, record: any) => <>
<div><PlayCircleOutlined />&nbsp;{formatTimeString(record.releaseTimeStart, 'YYYY-MM-DD HH:mm')}</div>
<div><PoweroffOutlined />&nbsp;{formatTimeString(record.releaseTimeEnd, 'YYYY-MM-DD HH:mm')}</div>
</>
},
{
title: '所属',
dataIndex: 'belongName',
key: 'belongName',
render: (text: any, record: any) => (
<Space direction='vertical'>
<StatusTag title={record.type === 1 ? '平台' : '商家'} type={record.type === 1 ? 'success' : 'primary'} />
{record.type === 2 && <Typography.Text type='secondary'>{text}</Typography.Text>}
</Space>
)
},
]
const _onConfirm = () => {
if (selectedRows.length > 0) {
onConfirm?.({ ...selectedRows[0] });
} else {
message.warning('请选择一条记录')
}
}
const _onRadioChange = (e: any) => {
setType(e.target.value);
ref?.current?.reload();
}
const fetchTableData = async (params: any) => {
const _params = { ...params, shopId };
let _fetch: any;
switch (type) {
case 1:
_fetch = PublicApi.getMarketingCouponPlatformActivityPageSelectPage
break;
case 2:
_fetch = PublicApi.getMarketingCouponPlatformActivityPageSelectMerchantPage
break;
}
const { data } = await _fetch(_params);
return data;
}
const rowSelection: any = {
selectedRowKeys,
onChange: (selectedRowKeys, selectedRows) => {
setSelectedRows(selectedRows);
setSelectedRowKeys(selectedRowKeys)
},
type: 'radio'
}
return (
<Drawer
width={1200}
title={'选择优惠券'}
visible={visible}
onClose={onClose}
footer={
<div style={{ textAlign: 'right', }}>
<Button onClick={onClose} style={{ marginRight: 8 }}>取消</Button>
<Button onClick={_onConfirm} type="primary">确定</Button>
</div>
}
>
<StandardTable
keepAlive={false}
fetchTableData={params => fetchTableData(params)}
columns={columns}
currentRef={ref}
rowSelection={rowSelection}
rowKey={'id'}
formilyLayouts={{
justify: 'space-between'
}}
formilyProps={{
ctx: {
inline: false,
schema: _schema,
effects: ($, actions) => {
useStateFilterSearchLinkageEffect(
$,
actions,
'id',
FORM_FILTER_PATH,
);
},
components: { ModalSearch: Search, Submit },
},
layouts: {
order: 1,
span: 16
}
}}
formilyChilds={{
children: (
<div style={{ textAlign: 'right' }}>
<Radio.Group
options={options}
onChange={_onRadioChange}
value={type}
optionType="button"
/>
</div>
),
layouts: {
order: 2,
span: 8
}
}}
/>
</Drawer>
)
}
export default CouponsDrawer;
import { ISchema } from '@formily/antd';
import { FORM_FILTER_PATH } from '@/formSchema/const';
export const CouponSchema1: ISchema = {
type: 'object',
properties: {
id: {
type: 'string',
'x-component': 'ModalSearch',
'x-component-props': {
placeholder: '搜索',
allowClear: true,
align: 'flex-start',
},
},
[FORM_FILTER_PATH]: {
type: 'object',
'x-component': 'flex-layout',
'x-component-props': {
rowStyle: {
flexWrap: 'nowrap',
justifyContent: 'flex-start',
},
colStyle: {
marginRight: 20,
},
},
properties: {
name: {
type: 'string',
'x-component-props': {
placeholder: '优惠劵名称',
allowClear: true,
},
},
sumbit: {
'x-component': 'Submit',
'x-mega-props': {
span: 1,
},
'x-component-props': {
children: '查询',
},
},
},
},
},
};
export const CouponSchema2: ISchema = {
type: 'object',
properties: {
id: {
type: 'string',
'x-component': 'ModalSearch',
'x-component-props': {
placeholder: '搜索',
allowClear: true,
align: 'flex-start',
},
},
[FORM_FILTER_PATH]: {
type: 'object',
'x-component': 'flex-layout',
'x-component-props': {
rowStyle: {
flexWrap: 'nowrap',
justifyContent: 'flex-start',
},
colStyle: {
marginRight: 20,
},
},
properties: {
name: {
type: 'string',
'x-component-props': {
placeholder: '优惠劵名称',
allowClear: true,
},
},
memberName: {
type: 'string',
'x-component-props': {
placeholder: '商家名称',
allowClear: true,
},
},
sumbit: {
'x-component': 'Submit',
'x-mega-props': {
span: 1,
},
'x-component-props': {
children: '查询',
},
},
},
},
},
};
......@@ -135,5 +135,48 @@
}
}
}
&-activity {
height: 56px;
border: 1px solid #EDEEEF;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0 8px;
position: relative;
img {
width: 40px;
height: 40px;
border-radius: 4px;
margin-right: 8px;
}
&-right {
flex: 1;
display: flex;
flex-direction: column;
font-size: 12px;
&-top {
flex: 1;
color: #303133;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
&-bottom {
flex: 1;
color: #91959B;
}
}
&-tag{
position: absolute;
right: 0;
top: -3px;
}
}
}
}
......@@ -3,10 +3,13 @@ import { Input, Select, Row, Col, Button, Tooltip } from 'antd';
import { PlusCircleOutlined, DeleteOutlined } from '@ant-design/icons';
import { changeProps } from '@lingxi-disign/core';
import { PublicApi } from '@/services/api';
import UploadImage from '@/components/UploadImage';
import StatusTag from '@/components/StatusTag'
import { priceFormat } from '@/utils/numberFomat';
import MixDrawer from '../../../../Drawers/MixDrawer';
import MixDrawer from '@/pages/pageCustomized/Drawers/MixDrawer';
import ActivityDrawer from '@/pages/pageCustomized/Drawers/ActivityDrawer';
import styles from './index.less';
......@@ -79,8 +82,22 @@ const RedirectTypeList_B = [
const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) => {
const { name, img, id, type, property = 2, selectedKey } = props;
const [mixVisible, setMixVisible] = useState<boolean>(false);
const [actVisible, setActVisible] = useState<boolean>(false);
const [record, setRecord] = useState<any>();
const _fetch: any = useMemo(() => {
switch (type) {
case 1:
case 3:
return PublicApi.getProductCommodityGetCommodity
case 2:
return PublicApi.getTemplateWebActivityPageGet
case 4:
return PublicApi.getTemplateWebMemberShopWebFindById
}
return async () => { }
}, [type])
const _isNull = (list) => {
let _flag = true;
for (let key in list) {
......@@ -92,8 +109,22 @@ const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) =>
}
useEffect(() => {
setRecord('');
}, [type])
switch (type) {
case 1:
case 2:
case 3:
case 4:
id && _fetch?.({ id: id }).then((res) => {
if (res.code === 1000) {
setRecord(res.data)
}
}).catch(_ => setRecord(''));
break;
default:
setRecord('')
break;
}
}, [_fetch, id, type])
const _selectOption = useMemo(() => {
if (property === 1) {
......@@ -106,6 +137,20 @@ const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) =>
const _recordDetail = useMemo(() => {
if (record) {
if (type === 2) {
return (
<div className={styles['banner-record-activity']}>
<img src={record?.templatePicUrl} />
<div className={styles['banner-record-activity-right']}>
<Tooltip title={record?.name}>
<div className={styles['banner-record-activity-right-top']}>{record?.name}</div>
</Tooltip>
{record?.type === 2 && <div className={styles['banner-record-activity-right-bottom']}>{record?.memberName}</div>}
</div>
<div className={styles['banner-record-activity-tag']}><StatusTag title={record?.type === 1 ? '平台' : '商家'} type={record?.type === 1 ? 'success' : 'primary'} /></div>
</div>
)
}
if (type === 3) {
return (
<div className={styles['banner-record-integral']}>
......@@ -114,7 +159,7 @@ const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) =>
<Tooltip title={record?.name}>
<div className={styles['banner-record-integral-right-top']}>{record?.name}</div>
</Tooltip>
<div className={styles['banner-record-integral-right-bottom']}>{priceFormat(record?.unitPrice['0-0'])} 积分</div>
<div className={styles['banner-record-integral-right-bottom']}>{priceFormat(record?.unitPrice?.['0-0'])} 积分</div>
</div>
</div>
)
......@@ -166,8 +211,15 @@ const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) =>
setMixVisible(false);
}
const _onActClose = () => {
setActVisible(false);
}
const _onChoose = () => {
switch (type) {
case 2:
setActVisible(true);
break;
case 3:
case 4:
setMixVisible(true);
......@@ -178,6 +230,12 @@ const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) =>
const _onChooseConfirm = (record) => {
setRecord(record);
switch (type) {
case 2:
changeProps({
props: Object.assign({ ...props }, { id: record.id, isnull: _isNull([name, img, type]) })
});
_onActClose();
break;
case 3:
case 4:
changeProps({
......@@ -250,6 +308,12 @@ const BannerClient: React.FC<BannerClientProps> = (props: BannerClientProps) =>
onConfirm={_onChooseConfirm}
visible={mixVisible}
/>
<ActivityDrawer
selectId={id}
visible={actVisible}
onClose={_onActClose}
onConfirm={_onChooseConfirm}
/>
</div>
)
}
......
import React from 'react';
import React, { useState, useEffect } from 'react';
import { Button } from 'antd';
import { changeProps } from '@lingxi-disign/core';
import moment from 'moment';
import { formatTimeString } from '@/utils'
import { priceFormat } from '@/utils/numberFomat'
import { PublicApi } from '@/services/api';
import CouponsDrawer from '@/pages/pageCustomized/Drawers/CouponsDrawer';
import styles from './index.less';
const MarketingCardCoupon = () => {
interface MarketingCardCouponProps {
id?: number,
type?: number,
// 当前选中组件的key
selectedKey?: any,
}
const MarketingCardCoupon: React.FC<MarketingCardCouponProps> = (props: MarketingCardCouponProps) => {
const { id, type, selectedKey } = props;
const [drawerVisible, setDrawerVisible] = useState(false);
const [record, setRecord] = useState<any>();
const _onClose = () => {
setDrawerVisible(false);
}
useEffect(() => {
if (id && id != record?.id) {
PublicApi.postMarketingCouponPlatformActivityPageSelectDetail({ couponList: [{ couponType: type, id: id }] }).then((res) => {
if (res.code === 1000) {
setRecord(res.data[0]);
}
}).catch(err => console.log(err))
}else if(!id){
setRecord('');
}
}, [id, type])
const _onChooseConfirm = (record) => {
setRecord(record);
changeProps({
title: record?.name,
props: Object.assign({ ...props }, { ...record, expiredDay: moment(record?.releaseTimeEnd || moment()).diff(moment(), 'days'), isnull: false })
})
_onClose();
}
return (
<div className={styles['marketingCardCoupon']}>
<Button>选择</Button>
<Button onClick={() => { setDrawerVisible(true) }}>选择</Button>
<div className={styles['marketingCardCoupon-box']}>
<div className={styles['marketingCardCoupon-box-label']}>优惠券ID:</div>
<div className={styles['marketingCardCoupon-box-content']}></div>
<div className={styles['marketingCardCoupon-box-content']}>{record?.id}</div>
</div>
<div className={styles['marketingCardCoupon-box']}>
<div className={styles['marketingCardCoupon-box-label']}>优惠券名称:</div>
<div className={styles['marketingCardCoupon-box-content']}></div>
<div className={styles['marketingCardCoupon-box-content']}>{record?.name}</div>
</div>
<div className={styles['marketingCardCoupon-box']}>
<div className={styles['marketingCardCoupon-box-label']}>类型:</div>
<div className={styles['marketingCardCoupon-box-content']}></div>
<div className={styles['marketingCardCoupon-box-content']}>{record?.typeName}</div>
</div>
<div className={styles['marketingCardCoupon-box']}>
<div className={styles['marketingCardCoupon-box-label']}>领劵方式:</div>
<div className={styles['marketingCardCoupon-box-content']}></div>
<div className={styles['marketingCardCoupon-box-content']}>{record?.getWayName}</div>
</div>
<div className={styles['marketingCardCoupon-box']}>
<div className={styles['marketingCardCoupon-box-label']}>商家名称:</div>
<div className={styles['marketingCardCoupon-box-content']}></div>
<div className={styles['marketingCardCoupon-box-content']}>{record?.belongName}</div>
</div>
<div className={styles['marketingCardCoupon-box']}>
<div className={styles['marketingCardCoupon-box-label']}>面额:</div>
<div className={styles['marketingCardCoupon-box-content']}></div>
<div className={styles['marketingCardCoupon-box-content']}>{record?.denomination ? `¥ ${priceFormat(record?.denomination)}` : ''}</div>
</div>
<div className={styles['marketingCardCoupon-box']}>
<div className={styles['marketingCardCoupon-box-label']}>使用条件:</div>
<div className={styles['marketingCardCoupon-box-content']}></div>
<div className={styles['marketingCardCoupon-box-content']}>{record?.useConditionMoney ? `满 ${record?.useConditionMoney} 元使用` : ''}</div>
</div>
<div className={styles['marketingCardCoupon-box']}>
<div className={styles['marketingCardCoupon-box-label']}>有效期:</div>
<div className={styles['marketingCardCoupon-box-content']}></div>
<div className={styles['marketingCardCoupon-box-content']}>{record?.releaseTimeStart ? `${formatTimeString(record?.releaseTimeStart)} 至 ${formatTimeString(record?.releaseTimeEnd)}` : ''}</div>
</div>
<CouponsDrawer
visible={drawerVisible}
onClose={_onClose}
onConfirm={_onChooseConfirm}
selectId={id}
/>
</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