chenglb
1 year ago
12 changed files with 30932 additions and 207 deletions
-
29716public/static/css/antd.dark.min.css
-
25src/assets/css/base.scss
-
8src/components/FormSliderPicker/index.jsx
-
2src/pages/InRoadMgm/PersonMgm/PersonInfo/loadable.jsx
-
283src/pages/OperationCenter/OperationSales/CouponMgm/CouponDistribute/Add.jsx
-
192src/pages/OperationCenter/OperationSales/CouponMgm/CouponDistribute/index.scss
-
290src/pages/OperationCenter/OperationSales/CouponMgm/CouponDistribute/loadable.jsx
-
8src/pages/OperationCenter/OperationSales/CouponMgm/CouponRules/index.scss
-
8src/pages/OperationCenter/OperationSales/CouponMgm/CouponRules/loadable.jsx
-
160src/pages/OperationCenter/OperationSales/CouponMgm/WriteOffStat/index.scss
-
284src/pages/OperationCenter/OperationSales/CouponMgm/WriteOffStat/loadable.jsx
-
163src/pages/OperationCenter/OperationSales/CouponMgm/WriteOffStat/loadable_bk.jsx
29716
public/static/css/antd.dark.min.css
File diff suppressed because it is too large
View File
File diff suppressed because it is too large
View File
@ -0,0 +1,283 @@ |
|||||
|
import React, { useEffect, useState } from "react"; |
||||
|
import { |
||||
|
Descriptions, |
||||
|
Modal, |
||||
|
Form, |
||||
|
Input, |
||||
|
DatePicker, |
||||
|
Select, |
||||
|
Row, |
||||
|
Checkbox, |
||||
|
Col, |
||||
|
Button, |
||||
|
Space, |
||||
|
message, |
||||
|
} from "antd"; |
||||
|
import ajax from "@/services"; |
||||
|
import { PlusOutlined , DeleteOutlined ,MinusCircleOutlined } from '@ant-design/icons'; |
||||
|
function Add(props) { |
||||
|
const [form] = Form.useForm(); |
||||
|
const { |
||||
|
visible, |
||||
|
setShowEdit=()=>{}, |
||||
|
record = {} |
||||
|
} = props; |
||||
|
const [couponList, setCouponList] = useState([{ key: createKey() }]); |
||||
|
|
||||
|
function createKey() { |
||||
|
return Math.random().toString(36).substr(2, 5); |
||||
|
} |
||||
|
|
||||
|
|
||||
|
function createCoupon(itemKey) { |
||||
|
let _couponList = couponList.concat({ key: createKey() }); |
||||
|
setCouponList(_couponList); |
||||
|
} |
||||
|
function delCoupon(itemKey) { |
||||
|
let _couponList = couponList.filter((item) => { |
||||
|
return item.key !== itemKey; |
||||
|
}); |
||||
|
setCouponList(_couponList); |
||||
|
} |
||||
|
|
||||
|
function onChange({ rule_id, num, total, itemKey }) { |
||||
|
let _couponList = couponList.map((item) => { |
||||
|
if (item.key === itemKey) { |
||||
|
item.num = num; |
||||
|
item.total = total; |
||||
|
item.rule_id = rule_id; |
||||
|
} |
||||
|
return item; |
||||
|
}); |
||||
|
setCouponList(_couponList); |
||||
|
console.log(_couponList); |
||||
|
} |
||||
|
|
||||
|
function submit() { |
||||
|
|
||||
|
form |
||||
|
.validateFields() |
||||
|
.then((values) => { |
||||
|
|
||||
|
console.log(values, 'submit values') |
||||
|
let params = { |
||||
|
...values, |
||||
|
// activity_time: values.activity_time.map((item) => { |
||||
|
// return item.format("YYYY-MM-DD"); |
||||
|
// }), |
||||
|
rule: couponList.map((item) => { |
||||
|
return { |
||||
|
rule_id: item.rule_id, |
||||
|
num: item.num |
||||
|
}; |
||||
|
}), |
||||
|
}; |
||||
|
// ajax.handleActivityInsert(params).then((res) => { |
||||
|
// if (res.status === 20000) { |
||||
|
// message.success("添加成功"); |
||||
|
// close(); |
||||
|
// form.resetFields(); |
||||
|
// } |
||||
|
// }); |
||||
|
}) |
||||
|
|
||||
|
.catch((err) => { |
||||
|
console.log(err); |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
return ( |
||||
|
// <Modal |
||||
|
// title="添加" |
||||
|
// open={visible} |
||||
|
// onCancel={close} |
||||
|
// width={1200} |
||||
|
// destroyOnClose |
||||
|
// onOk={submit} |
||||
|
// > |
||||
|
<Form form={form} initialValues={{coupon: [{key:createKey()}]}} > |
||||
|
<Form.Item |
||||
|
label="活动名称" |
||||
|
name="activity_name" |
||||
|
rules={[{ required: true }]} |
||||
|
> |
||||
|
<Input style={{ width: "20%" }} /> |
||||
|
</Form.Item> |
||||
|
|
||||
|
{/* <Form.Item label="关联优惠券" required> |
||||
|
{couponList.map((item, index) => { |
||||
|
return ( |
||||
|
<CouponComponent |
||||
|
key={index} |
||||
|
index={index} |
||||
|
itemKey={item.key} |
||||
|
create={createCoupon} |
||||
|
delFunc={delCoupon} |
||||
|
onChange={onChange} |
||||
|
/> |
||||
|
); |
||||
|
})} |
||||
|
</Form.Item> */} |
||||
|
<Form.List name="coupon" label="关联优惠券"> |
||||
|
{(fields, { add, remove }) => ( |
||||
|
<> |
||||
|
{fields.map(({ key, name, ...restField } , index) => ( |
||||
|
<Space |
||||
|
key={key} |
||||
|
style={{ |
||||
|
display: 'flex', |
||||
|
// alignItems:"center" |
||||
|
}} |
||||
|
align="baseline" |
||||
|
> |
||||
|
{/* { |
||||
|
index != 0 ? <span style={{visibility:'hidden'}}>* 关联优惠券:</span> : null |
||||
|
} */} |
||||
|
<Form.Item |
||||
|
{...restField} |
||||
|
name={[name, 'rule_id']} |
||||
|
// noStyle = {index == 0 ? false :true} |
||||
|
label="关联优惠券" |
||||
|
rules={[{required: true,message: '请选择优惠券名称'}]} |
||||
|
> |
||||
|
<Select options={[{label: "优惠券1",value: "1",}]} style={{width: '200px'}}/> |
||||
|
</Form.Item> |
||||
|
|
||||
|
<Form.Item |
||||
|
{...restField} |
||||
|
name={[name, 'num']} |
||||
|
rules={[ {required: true,message: '请输入张数', } ]} |
||||
|
> |
||||
|
<Input addonAfter="张" /> |
||||
|
</Form.Item> |
||||
|
{/* <Button type="dashed" onClick={() => add()} block icon={<PlusOutlined />}> |
||||
|
添加 |
||||
|
</Button> */} |
||||
|
<PlusOutlined onClick={() => add()} /> |
||||
|
{ |
||||
|
index != 0 ? <MinusCircleOutlined onClick={() => remove(name)} /> : null |
||||
|
} |
||||
|
|
||||
|
</Space> |
||||
|
))} |
||||
|
</> |
||||
|
)} |
||||
|
</Form.List> |
||||
|
|
||||
|
<Form.Item |
||||
|
label="发放群组" |
||||
|
name="sending_type" |
||||
|
rules={[{ required: true }]} |
||||
|
> |
||||
|
{/* <Input style={{ width: "20%" }} /> */} |
||||
|
<Select |
||||
|
style={{ width: "20%" }} |
||||
|
options={[{label: '按用户标签', value: '1'},{label: "按手机", value: "2"}]} |
||||
|
></Select> |
||||
|
</Form.Item> |
||||
|
<Form.Item noStyle shouldUpdate={(prevValues, curValues) => prevValues.sending_type == '1'}> |
||||
|
{({getFieldValue}) => { |
||||
|
return ( |
||||
|
<> |
||||
|
|
||||
|
{ |
||||
|
getFieldValue('sending_type') == '1' ? |
||||
|
<Form.Item name="tag" rules={[{ required: true ,message: "请选择用户标签" }]} > |
||||
|
<Select |
||||
|
style={{ width: "20%" , marginLeft: "80px"}} |
||||
|
options={[{label: '已认证用户标签', value: '1'}]} |
||||
|
></Select> |
||||
|
</Form.Item> |
||||
|
: null |
||||
|
} |
||||
|
</> |
||||
|
|
||||
|
); |
||||
|
}} |
||||
|
</Form.Item> |
||||
|
<Form.Item noStyle shouldUpdate={(prevValues, curValues) => prevValues.sending_type == '2'}> |
||||
|
{({getFieldValue}) => { |
||||
|
// console.log(formData,'formData') |
||||
|
return ( |
||||
|
<> |
||||
|
{ |
||||
|
getFieldValue('sending_type') == '2' ? |
||||
|
<Form.Item name="phones" > |
||||
|
<Input style={{ width: "20%" }} style={{display: "none"}} /> |
||||
|
<div className="batch-upload">批量上传</div> |
||||
|
</Form.Item> |
||||
|
: null |
||||
|
} |
||||
|
</> |
||||
|
); |
||||
|
}} |
||||
|
</Form.Item> |
||||
|
<Form.Item |
||||
|
label="推送通知" |
||||
|
name="push_type" |
||||
|
rules={[{ required: true ,message: '请选择推送通知方式' }]} > |
||||
|
<Checkbox.Group |
||||
|
options={[{label: '车主端', value: '1'},{label: "短信推送", value: "2"}]} |
||||
|
|
||||
|
/> |
||||
|
</Form.Item> |
||||
|
|
||||
|
<Form.Item > |
||||
|
<Button type="primary" htmlType="submit" onClick={submit}>提交</Button> |
||||
|
<Button htmlType="button" onClick={()=>{setShowEdit(false)}}>取消</Button> |
||||
|
</Form.Item> |
||||
|
</Form> |
||||
|
// </Modal> |
||||
|
); |
||||
|
} |
||||
|
|
||||
|
//关联优惠券输入组件 |
||||
|
function CouponComponent(props) { |
||||
|
const { index, create, delFunc, itemKey, onChange } = props; |
||||
|
|
||||
|
return ( |
||||
|
// <Form // 会有嵌套的问题, 所以不能这么用, 要用form list |
||||
|
// onValuesChange={(_, { rule_id, num, total }) => { |
||||
|
// onChange({ rule_id, num, total, itemKey }); |
||||
|
// }} |
||||
|
// > |
||||
|
<Row gutter={[16]}> |
||||
|
<Col span={4}> |
||||
|
<Form.Item name="rule_id"> |
||||
|
<Select |
||||
|
options={[ |
||||
|
{ |
||||
|
label: "优惠券1", |
||||
|
value: "1", |
||||
|
}, |
||||
|
]} |
||||
|
/> |
||||
|
</Form.Item> |
||||
|
</Col> |
||||
|
{/* <Col span={3}> |
||||
|
<Form.Item name="num"> |
||||
|
<Input addonAfter="张/次" /> |
||||
|
</Form.Item> |
||||
|
</Col> */} |
||||
|
<Col span={3}> |
||||
|
<Form.Item name="num"> |
||||
|
<Input addonAfter="张" /> |
||||
|
</Form.Item> |
||||
|
</Col> |
||||
|
<Col span={3}> |
||||
|
<Form.Item> |
||||
|
{index === 0 ? ( |
||||
|
<Button type="primary" onClick={() => create(itemKey)}> |
||||
|
添加 |
||||
|
</Button> |
||||
|
) : ( |
||||
|
<Button onClick={() => delFunc(itemKey)}>删除</Button> |
||||
|
)} |
||||
|
</Form.Item> |
||||
|
</Col> |
||||
|
</Row> |
||||
|
// </Form> |
||||
|
); |
||||
|
} |
||||
|
|
||||
|
export default Add; |
||||
@ -1,41 +1,257 @@ |
|||||
|
|
||||
import React, { useState, useRef, useEffect } from "react"; |
import React, { useState, useRef, useEffect } from "react"; |
||||
// import { message, Pagination, Table, Space, Modal, } from "antd"; |
|
||||
// import { dictionary, utils } from "@/config/common"; |
|
||||
// import moment from 'moment' |
|
||||
// import { useSessionStorageState, useUpdateEffect, useSize, useUpdate } from 'ahooks'; |
|
||||
// import ajax from "@/services" |
|
||||
// import { FormInput, FormSelect, OptionPanel, ResultPanel, FormSliderPicker, AreaCascader, ImgResize, ImgZoom, } from "@/components" |
|
||||
// import "./index.scss"; |
|
||||
// import errorImg from "@/assets/images/layout/error.png" |
|
||||
// import { useLocation } from "react-router-dom"; |
|
||||
//序号 活动名称 关联优惠券 发放类型 优惠券发行量 发放人 发放时间 操作 |
|
||||
// "distributeActivityId": "1814526898382030336", |
|
||||
// "activityName": "测试7月", |
|
||||
// "publishAmount": 1, |
|
||||
// "publishGroup": 1, |
|
||||
// "tags": "19863728685", |
|
||||
// "couponPushMode": "0,1", |
|
||||
// "creatorId": "1778431623577298073", |
|
||||
// "creatorName": "刘玉锋", |
|
||||
// "createdTime": "2023-07-21 11:24:23", |
|
||||
// "updatedTime": "2023-07-21 11:24:23", |
|
||||
// "D": 0, |
|
||||
// "couponRuleActivities": [ |
|
||||
// { |
|
||||
// "couponRuleActivityId": "1814526897934783600", |
|
||||
// "activityId": "1814526898382030336", |
|
||||
// "couponRuleId": "1814526830922149594", |
|
||||
// "publishAmount": 1, |
|
||||
// "receiveAmount": 1, |
|
||||
// "usedAmount": 0, |
|
||||
// "onceReceive": 1, |
|
||||
// "createdTime": "2023-07-21 11:24:22", |
|
||||
// "updatedTime": "2023-07-21 11:24:22", |
|
||||
// "couponName": "7月停车优惠券" |
|
||||
// } |
|
||||
// ], |
|
||||
function CouponDistribute() { |
|
||||
return <div>CouponDistribute</div> |
|
||||
|
import { FormSliderPicker, ExportBtn, ResultFlowResult ,FormInput } from "@/components" |
||||
|
import { Select, Input, Button, Table, message, Pagination} from 'antd' |
||||
|
import { |
||||
|
pageSizeOptions |
||||
|
} from '@/config/character.config.js' |
||||
|
import moment from "moment"; |
||||
|
import "./index.scss"; |
||||
|
import { SearchOutlined, PlusOutlined } from '@ant-design/icons'; |
||||
|
import Add from "./Add" |
||||
|
import ajax from '@/services/OperationCenter/OperationSales/index' |
||||
|
|
||||
|
function CouponDistribute(props) { |
||||
|
// const configData = props.sysConfig["lib-deploy"] || {}; |
||||
|
const [ajaxLoading, setAjaxLoading] = useState(false) |
||||
|
|
||||
|
const [resultData, setResultData] = useState({ |
||||
|
list: [], |
||||
|
total: 0, |
||||
|
// export_url: '', |
||||
|
// process_url: "" |
||||
|
}) |
||||
|
const parameter = { |
||||
|
pn: 1, |
||||
|
size: Number(pageSizeOptions[0]), // 每页条数 |
||||
|
activity_name: "", |
||||
|
} |
||||
|
const [formData, setFormData] = useState(parameter) |
||||
|
const [lastFormData, setLastFormData] = useState(formData) |
||||
|
const lastFormDataRef = useRef(formData) |
||||
|
const [couponNameOptions, setCouponNameOptions] = useState([]) |
||||
|
const [showEdit ,setShowEdit] = useState(false) |
||||
|
const [handleStatus ,setHandleStatus] = useState('1') // 1 添加 2 查看 |
||||
|
const [checkData, setCheckData] = useState({}) |
||||
|
const columns = [ |
||||
|
{ |
||||
|
title: '序号', |
||||
|
dataIndex: 'id', |
||||
|
key: 'id', |
||||
|
width: 150, |
||||
|
}, |
||||
|
{ |
||||
|
title: '活动名称', |
||||
|
dataIndex: 'activity_name', |
||||
|
key: 'activity_name', |
||||
|
// width: 150, |
||||
|
ellipsis: true, |
||||
|
align: 'center' |
||||
|
}, |
||||
|
{ |
||||
|
title: '关联优惠券', |
||||
|
dataIndex: 'association_coupon', |
||||
|
key: 'association_coupon', |
||||
|
// width: 150, |
||||
|
ellipsis: true, |
||||
|
align: 'center' |
||||
|
}, |
||||
|
{ |
||||
|
title: '发放类型', |
||||
|
dataIndex: 'sending_type', |
||||
|
key: 'sending_type', |
||||
|
// width: 150, |
||||
|
ellipsis: true, |
||||
|
align: 'center' |
||||
|
}, |
||||
|
{ |
||||
|
title: '优惠券发行量', |
||||
|
dataIndex: 'issue_num', |
||||
|
key: 'issue_num', |
||||
|
// width: 150, |
||||
|
ellipsis: true, |
||||
|
align: 'center' |
||||
|
}, |
||||
|
{ |
||||
|
title: '发放人', |
||||
|
dataIndex: 'send', |
||||
|
key: 'send', |
||||
|
// width: 150, |
||||
|
ellipsis: true, |
||||
|
align: 'center' |
||||
|
}, |
||||
|
{ |
||||
|
title: '发放时间', |
||||
|
dataIndex: 'send_time', |
||||
|
key: 'send_time', |
||||
|
// width: 150, |
||||
|
ellipsis: true, |
||||
|
align: 'center' |
||||
|
}, |
||||
|
{ |
||||
|
title: '操作', |
||||
|
key: 'action', |
||||
|
render: (_, record)=>{ |
||||
|
return ( |
||||
|
<span onClick={()=>{setShowEdit(true) ; setHandleStatus('2') ; setCheckData(record)}}>查看</span> |
||||
|
) |
||||
|
} |
||||
|
} |
||||
|
]; |
||||
|
|
||||
|
const getData = (data)=>{ |
||||
|
setAjaxLoading(true) |
||||
|
ajax.getDistributionList(data ? data : formData).then((res)=>{ |
||||
|
setAjaxLoading(false) |
||||
|
if(res.status == 20000){ |
||||
|
setResultData(res.data) |
||||
|
}else{ |
||||
|
setResultData({ |
||||
|
list: [], |
||||
|
total: 0, |
||||
|
}) |
||||
|
message.error(res.message) |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
//切换分页 |
||||
|
const changePn = (pn, length) => { |
||||
|
if (lastFormData.page_size === length) { |
||||
|
setLastFormData(Object.assign({}, lastFormData, { pn: pn })) |
||||
|
lastFormDataRef.current = Object.assign({}, lastFormData, { pn: pn }) |
||||
|
getData(Object.assign({}, lastFormData, { pn: pn })) |
||||
|
} |
||||
|
} |
||||
|
//切换每页条数 |
||||
|
const changeLength = (pn, length) => { |
||||
|
setFormData(Object.assign({}, formData, { pn: 1, size: length })) |
||||
|
setLastFormData(Object.assign({}, lastFormData, { pn: 1, size: length })) |
||||
|
lastFormDataRef.current = Object.assign({}, lastFormData, { pn: 1, size: length }) |
||||
|
getData(Object.assign({}, lastFormData, { pn: 1, size: length })) |
||||
|
} |
||||
|
//检索数据 |
||||
|
const getSearchData = (data = formData) => { |
||||
|
getData(data) |
||||
|
} |
||||
|
//重置数据 |
||||
|
const getResetData = () => { |
||||
|
setFormData({ |
||||
|
...parameter |
||||
|
}) |
||||
|
getData({ ...parameter }) |
||||
|
} |
||||
|
|
||||
|
// 获取优惠券类型选项 |
||||
|
const getCouponOptions = ()=>{ |
||||
|
ajax.getCouponOptions().then(res => { |
||||
|
if (res.status == 20000) { |
||||
|
setCouponNameOptions(res.data) |
||||
|
} else { |
||||
|
message.error(res.message) |
||||
|
} |
||||
|
}).catch(err => { |
||||
|
console.log(err) |
||||
|
}).finally(()=>{ |
||||
|
|
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
useEffect(() => { |
||||
|
getData() |
||||
|
getCouponOptions() |
||||
|
}, []) |
||||
|
|
||||
|
return <> |
||||
|
<div className="coupon-distribute"> |
||||
|
{ |
||||
|
!showEdit ? |
||||
|
<> |
||||
|
<div className="coupon-distribute-search"> |
||||
|
<label className="search">查询条件</label> |
||||
|
<FormInput |
||||
|
yisaLabel="活动名称" |
||||
|
placeholder="输入活动名称" |
||||
|
value={formData.activity_name} |
||||
|
showClose={true} |
||||
|
onChange={e => { setFormData({ activity_name: e.target.value }) } } |
||||
|
/> |
||||
|
<div className="timePicker yisa-search"> |
||||
|
|
||||
|
<div className="btnBox"> |
||||
|
<Button type="primary" className="yisa-btn" icon={<SearchOutlined />} onClick={() => { getSearchData() }}> |
||||
|
查询 |
||||
|
</Button> |
||||
|
<Button type="primary" className="yisa-btn" icon={<PlusOutlined />} onClick={() => { setShowEdit(true) ; setHandleStatus('1') }}> |
||||
|
添加 |
||||
|
</Button> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div className="coupon-distribute-result"> |
||||
|
<div className="result"> |
||||
|
<span className="font">共检索到<em>{resultData.total}</em>条结果</span> |
||||
|
<ResultFlowResult ajaxLoad={ajaxLoading} resultData={resultData.list ? resultData.list : []}> |
||||
|
<Table |
||||
|
bordered |
||||
|
className='yisa-table' |
||||
|
dataSource={resultData.list} |
||||
|
columns={columns} |
||||
|
pagination={false} |
||||
|
loading={ajaxLoading} |
||||
|
rowKey = {(record)=>record.id} |
||||
|
/> |
||||
|
<Pagination |
||||
|
className="pagination-common" |
||||
|
showSizeChanger |
||||
|
showQuickJumper |
||||
|
showTotal={() => `共 ${resultData.total} 条`} |
||||
|
total={resultData.total} |
||||
|
current={lastFormData.pn} |
||||
|
pageSize={lastFormData.size} |
||||
|
pageSizeOptions={pageSizeOptions} |
||||
|
onChange={changePn} |
||||
|
onShowSizeChange={changeLength} |
||||
|
/> |
||||
|
</ResultFlowResult> |
||||
|
</div> |
||||
|
</div> |
||||
|
</> |
||||
|
: |
||||
|
<div className="edit-container custom-edit-wrapper"> |
||||
|
<div className="back-row"> |
||||
|
<span onClick={()=>{setShowEdit(false)}}>< 返回</span>   { handleStatus == '1' ? "添加活动" : "活动详情"} |
||||
|
</div> |
||||
|
{ |
||||
|
handleStatus == '1' ? <div className="add-component"><Add setShowEdit={setShowEdit}/></div> |
||||
|
: |
||||
|
<div className="detail-container"> |
||||
|
<div className="detail-row"> |
||||
|
<span className="detail-title">活动名称: </span><span className="detail-value">{checkData.activity_name}</span> |
||||
|
</div> |
||||
|
<div className="detail-row"> |
||||
|
<span className="detail-title">关联优惠券: </span> |
||||
|
{ |
||||
|
checkData.coupon.map((item, index)=>{ |
||||
|
return <span key={index} className="detail-value">{item.name}/{item.num}张 </span> |
||||
|
}) |
||||
|
} |
||||
|
</div> |
||||
|
<div className="detail-row"> |
||||
|
<span className="detail-title">发放群组: </span><span className="detail-value">{checkData.sending_type == '1' ? "按用户标签" : "按手机号"}</span> |
||||
|
</div> |
||||
|
<div className="detail-row"> |
||||
|
<span className="detail-title">推送通知: </span><span className="detail-value">{checkData.activity_name}</span> |
||||
|
</div> |
||||
|
</div> |
||||
|
} |
||||
|
|
||||
|
</div> |
||||
|
} |
||||
|
|
||||
|
|
||||
|
</div> |
||||
|
|
||||
|
</> |
||||
} |
} |
||||
|
|
||||
export default CouponDistribute; |
export default CouponDistribute; |
||||
@ -0,0 +1,163 @@ |
|||||
|
import React, { useState, useRef, useEffect } from "react"; |
||||
|
import { message, Pagination, Table, Space, Modal, } from "antd"; |
||||
|
import { dictionary, utils } from "@/config/common"; |
||||
|
// import moment from 'moment' |
||||
|
import { useSetState, useSessionStorageState, useUpdateEffect, useSize, useUpdate } from 'ahooks'; |
||||
|
// import ajax from "@/services" |
||||
|
// import { FormInput, FormSelect, OptionPanel, ResultPanel, FormSliderPicker, AreaCascader, ImgResize, ImgZoom, } from "@/components" |
||||
|
// import "./index.scss"; |
||||
|
// import errorImg from "@/assets/images/layout/error.png" |
||||
|
// import { useLocation } from "react-router-dom"; |
||||
|
import ajax from '@/services/OperationCenter/OperationSales/index' |
||||
|
import { FormInput, FormSelect, ResultFlow } from "@/components" |
||||
|
import "./index.scss"; |
||||
|
|
||||
|
function WriteOffStat() { |
||||
|
const [resultData, setResultData] = useState([]) |
||||
|
const [loading, setLoading] = useState(false) |
||||
|
const [defaultParams, setDefaultParams] = useSessionStorageState('writeOffStat_formData',{ |
||||
|
defaultValue:{} |
||||
|
}) |
||||
|
const [pageData, setPageData] = useSetState({ // 分页参数 |
||||
|
pn: defaultParams?.pn || 1, |
||||
|
page_size:defaultParams?.page_size || 20, |
||||
|
}) |
||||
|
const [formData, setFormData] = useSetState({ |
||||
|
name: defaultParams ? defaultParams.name : '', |
||||
|
status: defaultParams ? defaultParams.status : '', |
||||
|
coupon_type: defaultParams ? defaultParams.coupon_type : '', |
||||
|
}) |
||||
|
const getCountList = ()=>{ |
||||
|
ajax.getCountList().then((res)=>{ |
||||
|
if(res.status == 20000){ |
||||
|
setResultData(res.data) |
||||
|
}else{ |
||||
|
|
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
const columns = [ |
||||
|
{ |
||||
|
title: '序号', |
||||
|
dataIndex: 'id', |
||||
|
key: 'id', |
||||
|
width: 150, |
||||
|
}, |
||||
|
{ |
||||
|
title: '优惠券名称', |
||||
|
dataIndex: 'name', |
||||
|
key: 'name', |
||||
|
// width: 150, |
||||
|
ellipsis: true, |
||||
|
align: 'center' |
||||
|
}, |
||||
|
{ |
||||
|
title: '优惠券类型', |
||||
|
dataIndex: 'type', |
||||
|
key: 'type', |
||||
|
// width: 150, |
||||
|
ellipsis: true, |
||||
|
align: 'center' |
||||
|
}, |
||||
|
{ |
||||
|
title: '领取量', |
||||
|
dataIndex: 'get_num', |
||||
|
key: 'get_num', |
||||
|
// width: 150, |
||||
|
ellipsis: true, |
||||
|
align: 'center' |
||||
|
}, |
||||
|
{ |
||||
|
title: '使用量', |
||||
|
dataIndex: 'use_num', |
||||
|
key: 'use_num', |
||||
|
// width: 150, |
||||
|
ellipsis: true, |
||||
|
align: 'center' |
||||
|
}, |
||||
|
{ |
||||
|
title: '核销总额', |
||||
|
dataIndex: 'total', |
||||
|
key: 'total', |
||||
|
// width: 150, |
||||
|
ellipsis: true, |
||||
|
align: 'center' |
||||
|
} |
||||
|
]; |
||||
|
|
||||
|
const onShowSizeChange = (current, pageSize) => { |
||||
|
let pn |
||||
|
if (pageData.page_size == pageSize) { |
||||
|
pn = current |
||||
|
} else { |
||||
|
pn = 1 |
||||
|
} |
||||
|
setPageData({ |
||||
|
pn: pn, |
||||
|
page_size: pageSize, |
||||
|
}) |
||||
|
} |
||||
|
useEffect(()=>{ |
||||
|
getCountList() |
||||
|
},[]) |
||||
|
return ( |
||||
|
<> |
||||
|
<div className="inroad-search-container off-detail"> |
||||
|
<div className="left-search"> |
||||
|
<div className="title">查询条件</div> |
||||
|
<FormInput |
||||
|
yisaLabel="优惠券名称" |
||||
|
placeholder="输入优惠券名称" |
||||
|
value="aaa" |
||||
|
showClose={true} |
||||
|
onChange={e => { } } |
||||
|
/> |
||||
|
</div> |
||||
|
<div className="right-list"> |
||||
|
<ResultFlow |
||||
|
hasLoad={true} |
||||
|
loading={loading} |
||||
|
resultData={resultData.list} |
||||
|
message={"暂无数据"} |
||||
|
> |
||||
|
<div className="total-row-wrapper"> |
||||
|
{/* <ExportBtn {...exportParams} ><div className="export-content">导出</div></ExportBtn> */} |
||||
|
<span className="number-wrapper"> |
||||
|
<span className="letter">共查询到</span> |
||||
|
<span className="total-number"> {resultData.total} </span> |
||||
|
<span className="letter">条结果</span> |
||||
|
</span> |
||||
|
</div> |
||||
|
<div className="table-wrap"> |
||||
|
<Table |
||||
|
rowKey='id' |
||||
|
columns={columns} |
||||
|
className="yisa-table" |
||||
|
dataSource={resultData.list} |
||||
|
loading={loading} |
||||
|
pagination={false} |
||||
|
></Table> |
||||
|
</div> |
||||
|
<div> |
||||
|
<Pagination |
||||
|
className="pagination-common" |
||||
|
showSizeChanger={true} |
||||
|
showQuickJumper={true} |
||||
|
// showTotal={() => `共 ${total_records} 条`} |
||||
|
total={resultData.total} |
||||
|
current={pageData.pn} |
||||
|
pageSize={pageData.page_size} |
||||
|
pageSizeOptions={dictionary?.pageSizeOptions} |
||||
|
onChange={onShowSizeChange} |
||||
|
onShowSizeChange={onShowSizeChange} |
||||
|
/> |
||||
|
</div> |
||||
|
</ResultFlow> |
||||
|
</div> |
||||
|
</div> |
||||
|
</> |
||||
|
) |
||||
|
} |
||||
|
|
||||
|
|
||||
|
export default WriteOffStat; |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue