first commit
This commit is contained in:
287
滴滴淘/admin/src/pages/PromotionEffect.tsx
Normal file
287
滴滴淘/admin/src/pages/PromotionEffect.tsx
Normal file
@@ -0,0 +1,287 @@
|
||||
import React, { Component } from 'react';
|
||||
import { UserServiceImp } from '@service/userServiceImp';
|
||||
import { connect, ConnectProps, UserModelState, history } from 'umi';
|
||||
import { LoadDemand } from '@annotation/index';
|
||||
import style from '@/assets/less/page/TeamManagement.less';
|
||||
import { Layout, Menu, Breadcrumb, Rate, Row, Col, Select, Input, DatePicker, Button, Table } from 'antd';
|
||||
import NavTitle from "@/components/NavTitle";
|
||||
import { DesktopOutlined,
|
||||
PieChartOutlined,
|
||||
FileOutlined,
|
||||
TeamOutlined,
|
||||
UserOutlined, } from '@ant-design/icons';
|
||||
import { Utils } from '@/core/utils/utils';
|
||||
const { RangePicker } = DatePicker;
|
||||
const { Header, Content, Footer, Sider } = Layout;
|
||||
const { SubMenu } = Menu;
|
||||
const { Option } = Select;
|
||||
|
||||
@LoadDemand
|
||||
export default class PromotionEffect extends Component{
|
||||
|
||||
state = {
|
||||
disabledType: false,
|
||||
params: {
|
||||
text_field: '', // 精确搜索的select
|
||||
text_value: '', // 精确搜索的input值
|
||||
model_type: '', // 一级
|
||||
sub_type: '', // 二级subtype的数组,为空时查询所有
|
||||
dateField: 'create_time', // 时间字段
|
||||
dateRange: '', // 时间段
|
||||
limit: 10, // 每页显示数量
|
||||
page: 1, // 页码
|
||||
loading: false
|
||||
},
|
||||
options: [
|
||||
{
|
||||
value: 'task',
|
||||
label: '任务',
|
||||
children: [
|
||||
{
|
||||
value: '1',
|
||||
label: '任务本金',
|
||||
},
|
||||
{
|
||||
value: '2',
|
||||
label: '任务佣金',
|
||||
},
|
||||
{
|
||||
value: '3',
|
||||
label: '评价佣金',
|
||||
},
|
||||
{
|
||||
value: '4',
|
||||
label: '推广收益',
|
||||
},
|
||||
{
|
||||
value: '5',
|
||||
label: '押款本金',
|
||||
},
|
||||
{
|
||||
value: '6',
|
||||
label: '押款佣金',
|
||||
},
|
||||
{
|
||||
value: '7',
|
||||
label: '押款评价佣金',
|
||||
},
|
||||
{
|
||||
value: '8',
|
||||
label: '快递',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
value: 'charge',
|
||||
label: '充值',
|
||||
children: [
|
||||
{
|
||||
value: '1',
|
||||
label: '银行卡',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
tableCol: [
|
||||
{
|
||||
title: '流水号',
|
||||
dataIndex: 'model_id',
|
||||
key: 'model_id',
|
||||
},
|
||||
{
|
||||
title: '发生金额',
|
||||
dataIndex: 'amount',
|
||||
key: 'amount',
|
||||
},
|
||||
{
|
||||
title: '变化前',
|
||||
dataIndex: 'before_balance',
|
||||
key: 'before_balance',
|
||||
},
|
||||
{
|
||||
title: '变化后',
|
||||
dataIndex: 'after_balance',
|
||||
key: 'after_balance',
|
||||
},
|
||||
{
|
||||
title: '发生时间',
|
||||
dataIndex: 'create_time',
|
||||
key: 'create_time',
|
||||
},
|
||||
{
|
||||
title: '是由',
|
||||
dataIndex: 'sub_type_text',
|
||||
key: 'sub_type_text',
|
||||
},
|
||||
{
|
||||
title: '备注',
|
||||
dataIndex: 'remark',
|
||||
key: 'remark',
|
||||
},
|
||||
],
|
||||
currentTypeIndex: 0,
|
||||
recordListData: [],
|
||||
PageCount: 0, // 总页数
|
||||
}
|
||||
|
||||
async componentDidMount() {
|
||||
await this.recordList()
|
||||
}
|
||||
|
||||
async recordList() {
|
||||
this.setState({ loading: true })
|
||||
let res = await UserServiceImp.recordList(this.state.params);
|
||||
if (res != null && res.hasOwnProperty("list")) {
|
||||
res.list.forEach((val: any, i: number) => {
|
||||
val.before_balance = Utils.conversionMoney(val.before_balance);
|
||||
val.after_balance = Utils.conversionMoney(val.after_balance);
|
||||
val.amount = Utils.conversionMoney(val.amount);
|
||||
val.key = i
|
||||
});
|
||||
this.setState({ recordListData: res.list, PageCount: res.count })
|
||||
}
|
||||
this.setState({ loading: false })
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<NavTitle title="推广效果"></NavTitle>
|
||||
<div className="items">
|
||||
<p className='cTitle'>详情列表</p>
|
||||
<Row>
|
||||
{/*任务编号*/}
|
||||
<Col span={2}>
|
||||
<Select
|
||||
defaultValue="资金流水号"
|
||||
style={{ width: '100%' }}
|
||||
onChange={(value: any) => {
|
||||
this.state.params.text_field = value
|
||||
}}>
|
||||
<Option value="record">资金流水号</Option>
|
||||
<Option value="task">任务编号</Option>
|
||||
<Option value="charge">充值流水号</Option>
|
||||
</Select>
|
||||
</Col>
|
||||
|
||||
{/*输入搜索内容*/}
|
||||
<Col span={4} style={{ marginRight: '10px' }}>
|
||||
<Input
|
||||
placeholder="请输入搜索内容"
|
||||
onChange={e => {
|
||||
if (e.target.value.length != 0) {
|
||||
this.setState({ disabledType: true });
|
||||
this.state.params.model_type = '';
|
||||
this.state.params.sub_type = '';
|
||||
this.state.params.text_value = e.target.value;
|
||||
} else {
|
||||
this.setState({ disabledType: false });
|
||||
}
|
||||
}}
|
||||
/>
|
||||
</Col>
|
||||
|
||||
{/*任务的交易类型*/}
|
||||
<Col span={2}>
|
||||
<Select
|
||||
defaultValue="交易类型"
|
||||
disabled={this.state.disabledType}
|
||||
style={{ width: '100%' }}
|
||||
onChange={(index: any) => {
|
||||
this.state.params.model_type = this.state.options[index]['value'];
|
||||
this.state.params.text_value = '';
|
||||
this.state.params.text_field = '';
|
||||
this.setState({ currentTypeIndex: index });
|
||||
}}>
|
||||
|
||||
{this.state.options.map((val, index) => {
|
||||
return (
|
||||
<Option key={index} value={index}>
|
||||
{val.label}
|
||||
</Option>
|
||||
);
|
||||
})}
|
||||
|
||||
</Select>
|
||||
</Col>
|
||||
|
||||
<Col span={2} style={{ marginRight: '10px' }}>
|
||||
<Select
|
||||
defaultValue="交易类型"
|
||||
disabled={this.state.disabledType}
|
||||
style={{ width: '100%' }}
|
||||
onChange={(value: any) => {
|
||||
this.state.params.sub_type = value;
|
||||
|
||||
this.state.params.text_value = '';
|
||||
this.state.params.text_field = '';
|
||||
}}>
|
||||
|
||||
{this.state.options[this.state.currentTypeIndex]['children'].map((val, index) => {
|
||||
return (
|
||||
<Option key={index} value={val.value}>
|
||||
{val.label}
|
||||
</Option>
|
||||
);
|
||||
})}
|
||||
|
||||
</Select>
|
||||
</Col>
|
||||
|
||||
{/*选择事件范围*/}
|
||||
<Col span={3} style={{ marginRight: '10px' }}>
|
||||
<RangePicker
|
||||
// @ts-ignore
|
||||
onChange={(date: Date, dateString: Array<any>) => {
|
||||
if (dateString.join(' - ') != ' - ') {
|
||||
this.state.params.dateRange = dateString.join(' - ');
|
||||
} else {
|
||||
this.state.params.dateRange = '';
|
||||
}
|
||||
}}/>
|
||||
</Col>
|
||||
|
||||
{/*搜索按钮*/}
|
||||
<Col span={2}>
|
||||
<Button
|
||||
type="primary"
|
||||
onClick={async () => {
|
||||
await this.recordList()
|
||||
}}>
|
||||
搜 索
|
||||
</Button>
|
||||
</Col>
|
||||
|
||||
</Row>
|
||||
<br/>
|
||||
{/*数据展示的表格*/}
|
||||
<div className=''>
|
||||
<Table
|
||||
loading={this.state.loading}
|
||||
dataSource={this.state.recordListData}
|
||||
pagination={{
|
||||
showSizeChanger: true,
|
||||
showQuickJumper: false,
|
||||
current: this.state.params.page,
|
||||
showTotal: () => `共${this.state.PageCount}条`,
|
||||
total: this.state.PageCount,
|
||||
pageSize: this.state.params.limit,
|
||||
onShowSizeChange: async (current, size) => {
|
||||
this.state.params.page = current;
|
||||
this.state.params.limit = size;
|
||||
await this.recordList();
|
||||
},
|
||||
onChange: async (current)=> {
|
||||
this.state.params.page = current;
|
||||
await this.recordList();
|
||||
console.log("current: ", current);
|
||||
}
|
||||
}}
|
||||
columns={this.state.tableCol}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user