Commit 6b3a0258 authored by 前端-许佳敏's avatar 前端-许佳敏
parents f8d8c2ff ed7914cf
......@@ -22,7 +22,6 @@
# mockStatic
/.idea
src/services/index.ts
config/base.config.json
/src/services/index.ts
......
import React, { Component, useEffect, useState, ReactNode, useRef } from 'react';
import { Row, Col, Modal, Tooltip, Input, Select, Button, Popconfirm, Card, Tag, Badge, Steps, } from 'antd'
import { Row, Col, Modal,Table, Tooltip, Input, Select, Button, Popconfirm, Card, Tag, Badge, Steps, } from 'antd'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import { EyeOutlined, ClockCircleOutlined, UpOutlined, DownOutlined, StopOutlined, CheckSquareOutlined } from '@ant-design/icons'
import { StandardTable } from 'god'
import { ColumnType } from 'antd/lib/table/interface'
import ConfirmModal from './confirmModal'
import {history} from 'umi'
import { history } from 'umi'
import { PublicApi } from '@/services/api'
import moment from 'moment'
import style from './index.less'
import statuStyle from '../colorTag'
const { Step } = Steps
const data = [
{
......@@ -19,11 +22,44 @@ const data = [
status: 2,
},
];
interface dataInfoType{
status: any;
digest?: any;
logisticsOrderNo:string;
companyName: string;
invoicesTime: any,
detailList: Array<any>,
logList: Array<any>,
totalCarton: number,
totalVolume: number,
totalWeight: number,
freightPrice: number,
settlementWay: string
}
const detailInfo: React.FC<{}> = () => {
const ref = useRef({})
const ref = useRef<any>({})
let [isextraOption, setIsextraOption] = useState(false)
let [dataInfo, setdataInfo] = useState<any>({
status: '',
digest: '',
logisticsOrderNo:'',
companyName:'',
invoicesTime:'',
detailList:[],
logList:[],
totalCarton: 0,
totalVolume: 0,
totalWeight: 0,
freightPrice: 0,
settlementWay: ''
})
const [id, setid] = useState(history.location.query.id)
let [visible, setvisible] = useState(false)
const [pagination, setPagination] = useState({
current: 1,
pageSize: 10
})
const [detailData, setDetailData] = useState<any>({
step: {
current: 0,
......@@ -48,15 +84,15 @@ const detailInfo: React.FC<{}> = () => {
base: {
title: '基本信息',
leftElem: [
{ title: '对应发货单号:', key: '' },
{ title: '对应订单号/售后单:', key: '' }
{ title: '对应发货单号:', key: 'shipmentOrderNo',value: dataInfo.shipmentOrderNo },
{ title: '对应订单号/售后单:', key: '',value: dataInfo.invoicesNo }
],
centerElem: [
{ title: '收货方:', key: '' },
{ title: '收货地址:', key: '' }
{ title: '收货方:', key: '',value: dataInfo.receiverName },
{ title: '收货地址:', key: '',value: dataInfo.receiverFullAddress }
],
rightElem: [
{ title: '发货地址:', key: '' }
{ title: '发货地址:', key: '',value:dataInfo.shipperFullAddress }
],
elem: [
......@@ -65,117 +101,168 @@ const detailInfo: React.FC<{}> = () => {
freight: {
title: '运费',
leftElem: [
{ title: '运费:', key: 'freight' },
{ title: '结算方式:', key: '' }
{ title: '运费:', key: 'freight',value: dataInfo.freightPrice },
{ title: '结算方式:', key: '',value: dataInfo.settlementWay }
]
}
}
const columns1: ColumnType<any>[] = [
{
title: 'ID',
dataIndex: 'id',
dataIndex: 'productId',
align: 'center',
key: 'id',
key: 'productId',
},
{
title: '商品名称',
dataIndex: 'role',
dataIndex: 'productName',
align: 'center',
key: 'role',
key: 'productName',
width: 240
},
{
title: '品类',
dataIndex: 'role2',
dataIndex: 'categoryName',
align: 'center',
key: 'role3',
key: 'categoryName',
},
{
title: '品牌',
dataIndex: 'role1',
dataIndex: 'brandName',
align: 'center',
key: 'role2',
key: 'brandName',
},
{
title: '单位',
dataIndex: 'role3',
dataIndex: 'unitName',
align: 'center',
key: 'role3',
key: 'unitName',
},
{
title: '数量',
dataIndex: 'role3',
dataIndex: 'amount',
align: 'center',
key: 'role3',
key: 'amount',
},
{
title: '箱数',
dataIndex: 'role3',
dataIndex: 'carton',
align: 'center',
key: 'role3',
key: 'carton',
},
{
title: '重量 (KG)',
dataIndex: 'role3',
dataIndex: 'weight',
align: 'center',
key: 'role3',
key: 'weight',
},
{
title: '体积 (M3)',
dataIndex: 'role3',
dataIndex: 'volume',
align: 'center',
key: 'role3',
key: 'volume',
}
];
const columns: ColumnType<any>[] = [
{
title: '序号',
dataIndex: 'id',
dataIndex: 'operatorRoleId',
align: 'center',
key: 'id',
key: 'operatorRoleId',
},
{
title: '操作角色',
dataIndex: 'role',
dataIndex: 'operatorRoleName',
align: 'center',
key: 'role',
key: 'operatorRoleName',
},
{
title: '状态',
dataIndex: 'status',
align: 'center',
align: 'left',
key: 'status',
render: (text: any, record: any) => {
render: (text: number, record: any) => {
let component: ReactNode = null;
component = <Badge color="#FFC400" text="待审核" />;
text === 1 ? component = <Badge status='default' text="待提交" />:
text === 2 ? component = <Badge status='processing' text="待确认" />:
text === 3 ? component = <Badge status='success' text="接受物流单" />:
component = <Badge status='error' text="不接受物流单" />
return component;
},
},
{
title: '操作',
dataIndex: 'operation',
dataIndex: 'type',
align: 'center',
key: 'operation',
key: 'type',
render: (text: number ,record:any) =>
<>{text === 1 ?'提交物流单':'确认物流单'}</>
},
{
title: '操作时间',
dataIndex: 'opTime',
dataIndex: 'operateTime',
align: 'center',
key: 'opTime',
},
key: 'operateTime',
render:(text: any, record: any) => <>{moment(text).format('YYYY-MM-DD HH:mm:ss')}</>
},
{
title: '审核意见',
dataIndex: 'suggest',
dataIndex: 'remark',
align: 'center',
key: 'suggest',
key: 'remark',
width: 300
},
];
//在这做逻辑判断 判断路由 是由哪个页面进来的
useEffect(() => {
let pathname = history.location.pathname
if(pathname === '/memberCenter/logisticsAbility/logisticsResult/toOrderComfirmDeatil'){
setIsextraOption(true)
const id = history.location.query.id
setid(id)
if (pathname === '/memberCenter/logisticsAbility/logisticsSubmit/orderSubmitDeatil') {
PublicApi.getLogisticsOrderSubmitGet({ id: id }).then(res => {
setdataInfo(res.data)
let current = 0
if(res.data.status <= 2){
current = 0
}else if(res.data.status == 3 || res.data.status == 4){
current = 1
}
setDetailData({...detailData,'step.current': current})
})
}
if (pathname === '/memberCenter/logisticsAbility/logisticsResult/orderResultDeatil') {
PublicApi.getLogisticsOrderConfirmGet({ id: id }).then(res => {
setdataInfo(res.data)
let current = 0
if(res.data.status <= 2){
current = 0
}else if(res.data.status == 3 || res.data.status == 4){
current = 1
}
setDetailData({...detailData,'step.current': current})
})
}
//待确认物流单
if (pathname === '/memberCenter/logisticsAbility/logisticsResult/toOrderComfirmDeatil') {
PublicApi.getLogisticsOrderWaitConfirmGet({ id: id }).then(res => {
setdataInfo(res.data)
let current = 0
if(res.data.status == 1){
current = 0
}else if(res.data.status == 2){
current = 0
setIsextraOption(true)
}else if(res.data.status == 3 || res.data.status == 4){
current = 1
}
setDetailData({...detailData,'step.current': current})
})
}
return () => {
......@@ -183,16 +270,27 @@ const detailInfo: React.FC<{}> = () => {
}, [])
const fetchData = (params: any) => {
return new Promise((resolve, reject) => {
const queryResult = data.find(v => v.key === params.keywords);
setTimeout(() => {
resolve({
code: 200,
message: '',
data: queryResult ? [queryResult] : data,
});
}, 1000);
PublicApi.getLogisticsOrderWaitSubmitPageOrderLog({...params,orderId:id}).then(res => {
if(res.code === 1000){
resolve(res.data)
}
})
// const queryResult = data.find(v => v.key === params.keywords);
// setTimeout(() => {
// resolve({
// code: 200,
// message: '',
// data: dataInfo.detailList//dataInfo.logList
// });
// }, 1000);
});
};
const handleModalOK = () => {
setvisible(false)
ref.current.reload()
}
return (
<PageHeaderWrapper
......@@ -202,8 +300,8 @@ const detailInfo: React.FC<{}> = () => {
<div className={style['headerTop']}>
<div className={style['headerTop-prefix']}></div>
<div className={style['headerTop-name']}>
物流单号:WL0954548
</div>
物流单号:{dataInfo.logisticsOrderNo}
</div>
<div className={style[`levelIcon${'1'}`]}></div>
</div>
</>
......@@ -226,22 +324,27 @@ const detailInfo: React.FC<{}> = () => {
<div className={style['headerMain-left']}>
<div className={style['headerMain-left-option']}>
<div>单据摘要:</div>
<div>xxxx</div>
<div>{dataInfo.digest}</div>
</div>
<div className={style['headerMain-left-option']}>
<div>物流服务商:</div>
<div>xxx</div>
<div>{dataInfo.companyName}</div>
</div>
<div className={style['headerMain-left-option']}>
<div>单据时间:</div>
<div>
<Tag color="green">2020-09-09 12:58:25</Tag>
<Tag color="green">{moment(dataInfo.invoicesTime).format('YYYY-MM-DD HH:mm:ss')}</Tag>
</div>
</div>
<div className={style['headerMain-left-option']}>
<div>外部状态:</div>
<div>
<Tag color="gold">待审核</Tag>
{
dataInfo.status == 1?<><span style={statuStyle.default}>待提交</span></>:
dataInfo.status == 2?<><span style={statuStyle.confirm}>待确认</span></>:
dataInfo.status == 3?<><span style={statuStyle.success}>接受物流单</span></>:
<><span style={statuStyle.warn}>不接受物流单</span></>
}
</div>
</div>
</div>
......@@ -280,10 +383,12 @@ const detailInfo: React.FC<{}> = () => {
(item: any, index: number) => {
return (
<div className={style['cols-main']} key={index}>
<div className={style['cols-main-options']}>
<div className={style['cols-main-options']} style={{flex:'1.5 1'}}>
{item.title}
</div>
<div className={style['cols-main-options']}>张三</div>
<div className={style['cols-main-options']}>
<Button type='link'>{item.value}</Button>
</div>
</div>
);
},
......@@ -297,7 +402,7 @@ const detailInfo: React.FC<{}> = () => {
<div className={style['cols-main-options']}>
{item.title}
</div>
<div className={style['cols-main-options']}>张三</div>
<div className={style['cols-main-options']}>{item.value}</div>
</div>
);
......@@ -312,7 +417,7 @@ const detailInfo: React.FC<{}> = () => {
<div className={style['cols-main-options']}>
{item.title}
</div>
<div className={style['cols-main-options']}>张三</div>
<div className={style['cols-main-options']}>{item.value}</div>
</div>
);
......@@ -340,28 +445,21 @@ const detailInfo: React.FC<{}> = () => {
<div className={style['mainCol-title']}>
物流单明细
</div>
<StandardTable
tableProps={{
pagination: false,
}}
columns={columns1}
currentRef={ref}
fetchTableData={(params: any) => fetchData(params)}
/>
<Table dataSource={dataInfo.detailList} columns={columns1} pagination={false} />
<Row style={{ marginTop: '26px' }}>
<Col span={9} push={15}>
<Row align='middle' justify='center' gutter={[16, 16]}>
<Col span={8} >
<div>总箱数(箱)</div>
<div className={style.count}>700</div>
<div className={style.count}>{dataInfo.totalCarton}</div>
</Col>
<Col span={8} >
<div>总重量(KG)</div>
<div className={style.count}>700</div>
<div className={style.count}>{dataInfo.totalWeight}</div>
</Col>
<Col span={8} >
<div>总体积(M3)</div>
<div className={style.count}>700</div>
<div className={style.count}>{dataInfo.totalVolume}</div>
</Col>
</Row>
......@@ -385,11 +483,12 @@ const detailInfo: React.FC<{}> = () => {
{
item.key === 'freight' ?
<div className={style['cols-main-options']}>
1000.00
<Input addonBefore=" ¥ " defaultValue="1000" />
{item.value}
{/* <Input addonBefore=" ¥ " defaultValue={100} /> */}
</div>
: <div className={style['cols-main-options']}>
张三
{item.value}
</div>
}
</div>
......@@ -406,20 +505,23 @@ const detailInfo: React.FC<{}> = () => {
外部流转记录
</div>
<StandardTable
tableProps={{
}}
columns={columns}
tableProps={{rowKey:'id'}}
currentRef={ref}
columns={columns}
fetchTableData={(params: any) => fetchData(params)}
/>
{/* <Table dataSource={dataInfo.logList} columns={columns} pagination={pagination} /> */}
</Col>
</Row>
<ConfirmModal
<ConfirmModal
id={id}
dialogVisible={visible}
onCancel={() => setvisible(false)}
/>
onOK = {() =>handleModalOK}
/>
</PageHeaderWrapper>
)
......
......@@ -2,8 +2,8 @@
* @Author: LeeJiancong
* @Date: 2020-07-18 15:55:51
* @LastEditors: LeeJiancong
* @LastEditTime: 2020-07-31 19:23:51
*/
* @LastEditTime: 2020-08-03 15:56:17
*/
import React, { useState, useEffect, useRef, ReactNode } from 'react';
import { Card, Button, Row, Col, Tooltip, Input, Select, Tag, Space } from 'antd'
import { UpOutlined, DownOutlined, EyeOutlined } from '@ant-design/icons'
......@@ -14,9 +14,10 @@ import style from './index.less'
import { history } from 'umi'
import { hidden } from 'chalk';
import { PublicApi } from '@/services/api';
import {timeRange} from '@/utils/index'
import { timeRange } from '@/utils/index'
import statuStyle from '../colorTag'
import moment from 'moment'
import { TimeList, statusList, outSideStatusList } from '../statusList'
import moment from 'moment'
let { Option } = Select
export interface listProps {
title?: ReactNode,
......@@ -42,7 +43,7 @@ interface paramsType {
invoicesTimeEnd?: any;
status?: number | string;
companyId?: any;
shipperId?:any;
shipperId?: any;
}
......@@ -50,49 +51,6 @@ const orderSearchList: React.FC<listProps> = (props) => {
console.log(props)
const ref = useRef<any>({})
const [selectRow, setSelectRow] = useState<Item[]>([])
const TimeList = [
{
label: '单据时间(全部)', value: 0
},
{
label: '今天', value: 1
},
{
label: '一周内', value: 2
},
{
label: '一个月内', value: 3
},
{
label: '三个月内', value: 4
},
{
label: '六个月内', value: 5
},
{
label: '一年内', value: 6
},
{
label: '一年前', value: 7
}
]
const outSideStatusList = [
{
label: '外部状态(全部)', value: ''
},
{
label: '待提交', value: 1
},
{
label: '待确认', value: 2
},
{
label: '接受物流单', value: 3
},
{
label: '不接受物流单', value: 4
}
]
const [selectedRowKeys, setSelectedRowKeys] = useState<Array<string>>([])
const [companyList, setcompanyList] = useState([])
const [shipperAddressList, setshipperAddressList] = useState([])
......@@ -100,36 +58,36 @@ const orderSearchList: React.FC<listProps> = (props) => {
const [selectTableRow, setSelectTableRow] = useState<any>([])
let [selectedTableRowKeys, setSelectedTableRowKeys] = useState<Array<number>>([])
const [TimeRange, setTimeRange] = useState<number>(0)
const [searchForm, setSearchForm] = props.type === '1' ?
useState<paramsType>({
logisticsOrderNo: '',
invoicesNo: '',
invoicesTimeStart: '',
invoicesTimeEnd: '',
status: '',
companyId :''
}):
useState<paramsType>({
logisticsOrderNo: '',
invoicesNo: '',
invoicesTimeStart: '',
invoicesTimeEnd: '',
status: '',
shipperId :''
})
const [searchForm, setSearchForm] = props.type === '1' ?
useState<paramsType>({
logisticsOrderNo: '',
invoicesNo: '',
invoicesTimeStart: '',
invoicesTimeEnd: '',
status: '',
companyId: ''
}) :
useState<paramsType>({
logisticsOrderNo: '',
invoicesNo: '',
invoicesTimeStart: '',
invoicesTimeEnd: '',
status: '',
shipperId: ''
})
/**
* @description: 先查询参数再 分页参数
* @param {type}
* @return:
*/
const fetchData = (params: any) => {
console.log('参数',params)
console.log('参数', params)
if (props.type === '1') {
return new Promise((resolve, reject) => {
PublicApi.getLogisticsOrderSubmitPage({
...searchForm,
...params
})
.then(res => {
resolve(res.data)
......@@ -157,20 +115,20 @@ const orderSearchList: React.FC<listProps> = (props) => {
*/
useEffect(() => {
console.log(searchForm)
if(props.type === '1'){
if (props.type === '1') {
PublicApi.getLogisticsSelectListCompany().then(res => {
if (res.code === 1000) {
setcompanyList(res.data)
}
})
}else{//收货
} else {//收货
PublicApi.getLogisticsShipperAddressPage().then(res => {
if (res.code === 1000) {
let list = []
res.data.data.forEach((item:any) => {
res.data.data.forEach((item: any) => {
list.push({
value:item.id,
label:item.shipperName
value: item.id,
label: item.shipperName
})
})
setshipperAddressList(list)
......@@ -215,10 +173,10 @@ const orderSearchList: React.FC<listProps> = (props) => {
key: 'invoicesNo'
},
{
title: props.type == '1'?'物流服务商':'发货方',
title: props.type == '1' ? '物流服务商' : '发货方',
align: 'center',
dataIndex: props.type == '1'?'companyName':'shipperName',
key: props.type == '1'?'companyName':'shipperName',
dataIndex: props.type == '1' ? 'companyName' : 'shipperName',
key: props.type == '1' ? 'companyName' : 'shipperName',
// className: props.type == '1' ? '' : style['hidden']
},
......@@ -251,13 +209,16 @@ const orderSearchList: React.FC<listProps> = (props) => {
align: 'left',
dataIndex: 'invoicesTime',
key: 'invoicesTime',
render: (text:any) => <>{moment(text).format('YYYY-MM-DD HH:mm:ss')}</>
render: (text: any) => <>{moment(text).format('YYYY-MM-DD HH:mm:ss')}</>
},
{
title: '外部状态',
align: 'center',
align: 'left',
dataIndex: 'status',
key: 'status',
filters: statusList,
filterMultiple: false,
onFilter: (value, record) => record.status === value,
render: (_: any, reconds) => {
let component: ReactNode = null
if (reconds.status == 3) {
......@@ -277,6 +238,10 @@ const orderSearchList: React.FC<listProps> = (props) => {
]
const statusFilter = (value: any, record: any) => {
console.log(value, record)
}
const rowSelection: TableRowSelection<any> = {
type: 'checkbox',
selectedRowKeys: selectedTableRowKeys,
......@@ -297,9 +262,9 @@ const orderSearchList: React.FC<listProps> = (props) => {
* @param {type}
* @return:
*/
const handleChange = (key:any,val:any) => {
const handleChange = (key: any, val: any) => {
let obj = {}
switch(key){
switch (key) {
case 'logisticsOrderNo':
obj = { ...searchForm, logisticsOrderNo: val }
break;
......@@ -322,12 +287,12 @@ const orderSearchList: React.FC<listProps> = (props) => {
}
const changeTimeRange = (val:any) => {
const changeTimeRange = (val: any) => {
console.log(val)
setTimeRange(val)
let timeRanges = timeRange(val)
console.log('更新',val)
console.log('选项:',val,'时间:',timeRanges)
console.log('更新', val)
console.log('选项:', val, '时间:', timeRanges)
// setSearchForm({
// ...searchForm,
// invoicesTimeStart: timeRanges.st,
......@@ -362,7 +327,7 @@ const orderSearchList: React.FC<listProps> = (props) => {
<PageHeaderWrapper title='快递单查询'>
<Card>
<StandardTable
tableProps={{rowKey:'id'}}
tableProps={{ rowKey: 'id' }}
columns={columns}
currentRef={ref}
formAlign='left'
......@@ -374,13 +339,13 @@ const orderSearchList: React.FC<listProps> = (props) => {
<Row>
<Col span={12}>
<Tooltip trigger={['focus']} placement='top'
title={props.type === '1' ? '输入物流单号进行搜索' : '输入物流单号、发货方进行搜索'}>
title={'输入物流单号进行搜索'}>
<Input.Search
style={{ width: '232px' }}
value={searchForm.logisticsOrderNo}
placeholder='搜索'
onChange={(e) => setSearchForm({ ...searchForm, logisticsOrderNo: e.target.value })}
onSearch={(val) => handleChange('logisticsOrderNo',val)}
onSearch={(val) => handleChange('logisticsOrderNo', val)}
/>
</Tooltip>
<Button className={style['filter-btn']} onClick={() => setIsSearch(isSearch = !isSearch)}>
......@@ -397,39 +362,39 @@ const orderSearchList: React.FC<listProps> = (props) => {
{
props.type === '1' ?
<>
<Input.Search
style={{ width: '232px' }}
value={searchForm.invoicesNo}
placeholder='输入对应单号进行搜索'
onChange={(e) => setSearchForm({ ...searchForm, invoicesNo: e.target.value })}
onSearch={(val) => handleChange('invoicesNo',val)}
/>
<Select
className={style.select}
showSearch
value={searchForm.companyId}
onChange={(val) => handleChange('companyId',val)}
optionFilterProp='children'
filterOption={(input, option) =>
option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
}
>
<Option value=''>物流服务商(全部)</Option>
{
companyList.map((item, index) => {
return <Option value={item.id}>{item.name}</Option>
})
}
</Select>
<>
<Input.Search
style={{ width: '232px' }}
value={searchForm.invoicesNo}
placeholder='输入对应单号进行搜索'
onChange={(e) => setSearchForm({ ...searchForm, invoicesNo: e.target.value })}
onSearch={(val) => handleChange('invoicesNo', val)}
/>
<Select
className={style.select}
showSearch
value={searchForm.companyId}
onChange={(val) => handleChange('companyId', val)}
optionFilterProp='children'
filterOption={(input, option) =>
option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
}
>
<Option value=''>物流服务商(全部)</Option>
{
companyList.map((item, index) => {
return <Option value={item.id}>{item.name}</Option>
})
}
</Select>
</>
:
<Select
className={style.select}
showSearch
value={searchForm.shipperId}
onChange={(val) => handleChange('shipperId',val)}
onChange={(val) => handleChange('shipperId', val)}
optionFilterProp='children'
filterOption={(input, option) =>
option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
......@@ -437,41 +402,28 @@ const orderSearchList: React.FC<listProps> = (props) => {
>
<Option value=''>发货方(全部)</Option>
{
shipperAddressList.map((item,index) => {
return <Option key={index} value={item.value}>{item.label}</Option>
shipperAddressList.map((item, index) => {
return <Option key={index} value={item.value}>{item.label}</Option>
})
}
</Select>
}
<Select
className={style.select}
value={TimeRange}
onChange={(val) =>{
setTimeRange(val),
setSearchForm({
...searchForm,
invoicesTimeStart: timeRange(val).st,
invoicesTimeEnd: timeRange(val).et
})
}
}
>
{
TimeList.map((item,index) => {
return <Option key={index} value={item.value}>{item.label}</Option>
})
}
</Select>
<Select
className={style.select}
value={searchForm.status}
onChange={(val) => handleChange('status',val)}
value={TimeRange}
onChange={(val) => {
setTimeRange(val),
setSearchForm({
...searchForm,
invoicesTimeStart: timeRange(val).st,
invoicesTimeEnd: timeRange(val).et
})
}
}
>
{
outSideStatusList.map((item,index) => {
TimeList.map((item, index) => {
return <Option key={index} value={item.value}>{item.label}</Option>
})
}
......
import React, { Component, useState, useEffect,useRef } from 'react';
import { Modal, Button, Form,Row,Col,Tooltip,Input,Select } from 'antd'
import {UpOutlined, DownOutlined} from '@ant-design/icons'
import {StandardTable} from 'god'
import { ColumnType,TableRowSelection} from 'antd/lib/table/interface'
import React, { Component, useState, useEffect, useRef } from 'react';
import { Modal, Button, Form, Row, Col, Tooltip, Input, Select, Space } from 'antd'
import { UpOutlined, DownOutlined } from '@ant-design/icons'
import { StandardTable } from 'god'
import { ColumnType, TableRowSelection } from 'antd/lib/table/interface'
import style from '../components/index.less'
import { PublicApi} from '@/services/api'
let {Option} = Select
export interface Params {
import { PublicApi } from '@/services/api'
let { Option } = Select
export interface Params {
title: string;
type: number,
type: number,//1 选择订单 2发货单 3选择商品
columns: Array<any>;
dialogVisible: boolean;
onCancel: Function;
......@@ -17,10 +17,10 @@ export interface Params {
interface Item {
key: string;
}
interface filterItem{
interface filterItem {
name?: string;
brandName?:string;
customerCategory?:string,
brandName?: string;
customerCategory?: string,
status?: any
}
......@@ -30,75 +30,75 @@ const listDialog: React.FC<Params> = (props) => {
const [selectedRowKeys, setSelectedRowKeys] = useState<Array<string>>([])
let [isSearch, setIsSearch] = useState(false)
let [filterParams, setfilterParams] = useState<filterItem>({
name:'',
name: '',
})
const [searchForm, setSearchForm] = useState({
searName: '',
buyer:'',//收货商
buyer: '',//收货商
dateSelect: '',
outSideStatus: '',
TimeRange: ''
})
const TimeList = [
{
label:'单据时间(全部)',value: ''
label: '单据时间(全部)', value: ''
},
{
label:'今天',value:1
label: '今天', value: 1
},
{
label:'一周内',value:2
label: '一周内', value: 2
},
{
label:'一个月内',value:3
label: '一个月内', value: 3
},
{
label:'三个月内',value:4
label: '三个月内', value: 4
},
{
label:'六个月内',value:5
label: '六个月内', value: 5
},
{
label:'一年内',value: 6
label: '一年内', value: 6
},
{
label:'一年前',value: 7
label: '一年前', value: 7
}
]
const outSideStatusList = [
{
label:'外部状态(全部)',value: ''
label: '外部状态(全部)', value: ''
},
{
label:'待提交',value: 1
label: '待提交', value: 1
},
{
label:'待确认',value: 2
label: '待确认', value: 2
},
{
label:'接受物流单',value: 3
label: '接受物流单', value: 3
},
{
label:'不接受物流单',value: 4
label: '不接受物流单', value: 4
}
]
const handleCancel = () => {
}
const handletOk = (values:any) => {
const handletOk = (values: any) => {
console.log(values)
props.onCancel()
}
const data = [
{
id:'123',
key:'123',
name:'1231',
id: '123',
key: '123',
name: '1231',
}
]
const fetchData = (params:any) => {
if(props.type === 3){
return new Promise((resolve,reject) => {
PublicApi.getProductCommodityGetCommodityList({...params}).then(res => {
const fetchData = (params: any) => {
if (props.type === 3) {
return new Promise((resolve, reject) => {
PublicApi.getProductCommodityGetCommodityList({ ...params }).then(res => {
resolve(res.data)
})
})
......@@ -116,8 +116,8 @@ const listDialog: React.FC<Params> = (props) => {
// })
}
useEffect(() => {
return () => {
}
}, [])
......@@ -161,113 +161,105 @@ const listDialog: React.FC<Params> = (props) => {
fetchTableData={(params: any) => fetchData(params)}
controlRender={
<>
<Row>
<Col span={24}>
{
//选择订单
<Row>
<Col span={24}>
{
//选择订单
props.type === 1 &&
<Select
style={{
marginRight:'16px'
}}
value={searchForm.buyer}
onChange={(val) => setSearchForm({ ...searchForm, buyer: val })}
>
<Option value=''>单据来源:订单</Option>
<Option value='1'>待审核</Option>
<Option value='2'>审核通过</Option>
<Option value='3'>审核不通过</Option>
</Select>
}
{
//选择商品
style={{
marginRight: '16px'
}}
value={searchForm.buyer}
onChange={(val) => setSearchForm({ ...searchForm, buyer: val })}
>
<Option value=''>单据来源:订单</Option>
<Option value='1'>订单</Option>
<Option value='2'>换货时申请单(退货发货)</Option>
<Option value='3'>换货申请单(换货发货)</Option>
<Option value='4'>退货申请单</Option>
</Select>
}
{
//选择商品
props.type === 3 &&
<Select
style={{
marginRight:'16px'
}}
value={searchForm.buyer}
onChange={(val) => setSearchForm({ ...searchForm, buyer: val })}
>
<Option value=''>来源:发货单</Option>
<Option value='1'>待审核</Option>
<Option value='2'>审核通过</Option>
<Option value='3'>审核不通过</Option>
</Select>
}
<Tooltip trigger={['focus']} placement='top'
title={props.type === 1? '输入物流单号、订单号进行搜索':'输入物流单号、发货方进行搜索' }>
<Input.Search
style={{ width: '232px' }}
value={searchForm.searName}
placeholder='搜索'
onChange={(e) => setSearchForm({ ...searchForm, searName: e.target.value })}
onSearch={() => handleSearch}
/>
</Tooltip>
<Button className={style['filter-btn']} onClick={() => setIsSearch(isSearch = !isSearch) }>
高级筛选{isSearch ? <UpOutlined /> : <DownOutlined />}
</Button>
<Button className={style.selectBtn} onClick={() => handleReset()}>重置</Button>
</Col>
</Row>
<Row style={{margin: '16px 0'}}>
{
isSearch &&
style={{
marginRight: '16px'
}}
value={searchForm.buyer}
onChange={(val) => setSearchForm({ ...searchForm, buyer: val })}
>
<Option value=''>来源:发货单</Option>
<Option value='1'>发货单</Option>
<Option value='2'>订单/售后单</Option>
</Select>
}
<Tooltip trigger={['focus']} placement='top'
title={props.type === 2 ? '输入物流单号进行搜索' : '输入物流单号、发货方进行搜索'}>
<Input.Search
style={{ width: '232px' }}
value={searchForm.searName}
placeholder='搜索'
onChange={(e) => setSearchForm({ ...searchForm, searName: e.target.value })}
onSearch={() => handleSearch}
/>
</Tooltip>
<Button className={style['filter-btn']} onClick={() => setIsSearch(isSearch = !isSearch)}>
高级筛选{isSearch ? <UpOutlined /> : <DownOutlined />}
</Button>
<Button className={style.selectBtn} onClick={() => handleReset()}>重置</Button>
</Col>
</Row>
<Row style={{ margin: '16px 0' }}>
{
isSearch &&
<Col>
{
props.type === 1?
<Select
className={style.select}
value={searchForm.buyer}
onChange={(val) => setSearchForm({ ...searchForm, buyer: val })}
>
<Option value=''>物流服务商(全部)</Option>
<Option value='1'>待审核</Option>
<Option value='2'>审核通过</Option>
<Option value='3'>审核不通过</Option>
</Select>
:
<Select
className={style.select}
value={searchForm.buyer}
onChange={(val) => setSearchForm({ ...searchForm, buyer: val })}
>
<Option value=''>发货方(全部)</Option>
<Option value='1'>待审核</Option>
<Option value='2'>审核通过</Option>
<Option value='3'>审核不通过</Option>
</Select>
<Space size={16}>
{
props.type === 1 ?
<Select
className={style.select}
value={searchForm.buyer}
onChange={(val) => setSearchForm({ ...searchForm, buyer: val })}
>
<Option value=''>物流服务商(全部)</Option>
<Option value='1'>待审核</Option>
<Option value='2'>审核通过</Option>
<Option value='3'>审核不通过</Option>
</Select>
:
<Select
className={style.select}
value={searchForm.buyer}
onChange={(val) => setSearchForm({ ...searchForm, buyer: val })}
>
<Option value=''>发货方(全部)</Option>
<Option value='1'>待审核</Option>
<Option value='2'>审核通过</Option>
<Option value='3'>审核不通过</Option>
</Select>
}
}
<Select
className={style.select}
value={searchForm.TimeRange}
onChange={(val) => setSearchForm({ ...searchForm, TimeRange: val })}
>
{
TimeList.map((item) => {
return <Option value={item.value}>{item.label}</Option>
})
}
</Select>
<Select
className={style.select}
value={searchForm.outSideStatus}
onChange={(val) => setSearchForm({ ...searchForm, outSideStatus: val })}
>
{
outSideStatusList.map((item) => {
return <Option value={item.value}>{item.label}</Option>
})
}
</Select>
<Select
className={style.select}
value={searchForm.TimeRange}
onChange={(val) => setSearchForm({ ...searchForm, TimeRange: val })}
>
{
TimeList.map((item) => {
return <Option value={item.value}>{item.label}</Option>
})
}
</Select>
</Space>
</Col>
}
</Row>
}
</Row>
</>
}
......
.btn-wrap .ant-input-group .ant-input-group-addon {
.selectBtn {
padding: 0 !important;
}
.ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-group-wrapper .ant-input-wrapper .ant-input-group-addon,
.ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .selectBtn .ant-input-wrapper .ant-input-group-addon,
.ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .ant-input-group-wrapper .ant-input-group .ant-input-group-addon,
.ant-form-item-control .ant-form-item-control-input .ant-form-item-control-input-content .selectBtn .ant-input-group .ant-input-group-addon {
padding: 0 !important;
}
.btn-wrap{
.ant-input-group{
.ant-input-group-addon{
padding: 0 !important;
.selectBtn{
padding: 0 !important;
}
.ant-form-item-control{
.ant-form-item-control-input{
.ant-form-item-control-input-content{
.ant-input-group-wrapper, .selectBtn{
.ant-input-wrapper ,.ant-input-group{
.ant-input-group-addon{
padding: 0 !important;
}
}
}
}
}
}
}
\ No newline at end of file
......@@ -69,7 +69,7 @@ const { Option } = Select;
const defaultValue = 'lucy'
const company: React.FC<{}> = () => {
//hook只能写在函数组件的顶级作用域
const ref = useRef({})
const ref = useRef<any>({})
const [menuForm] = Form.useForm();
const [headerTitle, setHeaderTitle] = useState('新建物流公司')
const [Code, setCode] = useState('')
......@@ -224,7 +224,7 @@ const company: React.FC<{}> = () => {
}
]}
>
<Input className={style['btn-wrap']} disabled maxLength={20} addonAfter={selectBtn}/>
<Input className={style['selectBtn']} disabled maxLength={20} addonAfter={selectBtn}/>
</Form.Item>
:
<Form.Item
......
/*
* @Date: 2020-07-13 15:01:40
* @LastEditors: LeeJiancong
* @LastEditTime: 2020-07-30 10:06:44
* @LastEditTime: 2020-08-03 16:52:53
*/
import React, { ReactNode, useRef } from 'react'
......@@ -50,7 +50,7 @@ const fetchData = (params?: any) => {
}
const Company: React.FC<{}> = () => {
const ref = useRef({})
const ref = useRef<any>({})
const columns: ColumnType<any>[] = [
{
......
......@@ -2,7 +2,7 @@
* @Author: LeeJiancong
* @Date: 2020-07-15 10:31:55
* @LastEditors: LeeJiancong
* @LastEditTime: 2020-07-28 10:56:07
* @LastEditTime: 2020-08-03 17:59:56
*/
import React, { Component, useState, useEffect } from 'react';
import ReactDOM from 'react-dom'
......@@ -175,7 +175,7 @@ const diaLogForm: React.FC<ListProps> = (props) => {
setOptions(TelCodeList)
})
const getAllCode = setTimeout(()=> {
PublicApi.getWarehouseAreaByPcodeAll({ pcode: '100000' }).then(res => {
PublicApi.getManageAreaByPcodeAll({ pcode: '100000' }).then(res => {
let list = []
res.data.forEach((item: any, index: number) => {
list.push({ label: item.name, value: `${item.code}-${item.name}` })
......@@ -259,7 +259,7 @@ const diaLogForm: React.FC<ListProps> = (props) => {
state.value = ''
let list = []
let pcode = value && value.split('-').length > 1 ? value.split('-')[0] : value
PublicApi.getWarehouseAreaByPcodeAll({ pcode: pcode }).then(res => {
PublicApi.getManageAreaByPcodeAll({ pcode: pcode }).then(res => {
res.data.forEach((item: any, index: number) => {
// list.push({ label: item.name, value: item.code })
list.push({ label: item.name, value: `${item.code}-${item.name}` })
......@@ -277,7 +277,7 @@ const diaLogForm: React.FC<ListProps> = (props) => {
state.value = ''
let list = []
let pcode = value && value.split('-').length > 1 ? value.split('-')[0] : value
PublicApi.getWarehouseAreaByPcodeAll({ pcode: pcode }).then(res => {
PublicApi.getManageAreaByPcodeAll({ pcode: pcode }).then(res => {
res.data.forEach((item: any, index: number) => {
// list.push({ label: item.name, value: item.code })
list.push({ label: item.name, value: `${item.code}-${item.name}` })
......
......@@ -2,7 +2,7 @@
* @Author: LeeJiancong
* @Date: 2020-07-15 10:31:55
* @LastEditors: LeeJiancong
* @LastEditTime: 2020-07-30 19:37:57
* @LastEditTime: 2020-08-03 18:02:39
*/
import React, { Component, useState, useEffect } from 'react';
import ReactDOM from 'react-dom'
......@@ -105,7 +105,7 @@ const diaLogForm: React.FC<ListProps> = (props) => {
}
// console.log(id,typeof id,history.location.query.isSee,typeof history.location.query.isSee)
setHeaderTitle(`${_title}运费模板`)
PublicApi.getWarehouseAreaByPcodeAll({ pcode: '100000' }).then(res => {
PublicApi.getManageAreaByPcodeAll({ pcode: '100000' }).then(res => {
let list = []
res.data.forEach((item: any, index: number) => {
list.push({ label: item.name, value: Number(item.code) })
......@@ -152,10 +152,7 @@ const diaLogForm: React.FC<ListProps> = (props) => {
history.goBack()
},1000)
}
const addStyle = {
padding: '2px 0',
textAlign: 'center'
}
const onSearch = () => {
}
......@@ -335,7 +332,8 @@ const diaLogForm: React.FC<ListProps> = (props) => {
operations: {
title: '操作'
},
renderAddition: () => <div style={addStyle}>+添加指定地区</div>,
renderAddition: () =>
<div style={{padding: '2px 0',textAlign: 'center'}}>+添加指定地区</div>,
renderMoveDown: () => null,
renderMoveUp: () => null,
renderRemove: (idx: any) => {
......
......@@ -2,7 +2,7 @@
* @Author: LeeJiancong
* @Date: 2020-07-14 15:07:34
* @LastEditors: LeeJiancong
* @LastEditTime: 2020-07-24 20:08:29
* @LastEditTime: 2020-08-03 11:19:53
*/
import React, { Component, ReactNode, useRef, useState } from 'react'
import { history } from 'umi'
......@@ -111,7 +111,7 @@ const EditableCell: React.FC<EditableCellProps> = ({
*/
const Template: React.FC<ListProps> = (props) => {
console.log(props)
const ref = useRef({})
const ref = useRef<any>({})
const [form] = Form.useForm();
const [table, setTable] = useState([])
const [editingKey, setEditingKey] = useState('');
......
......@@ -2,7 +2,7 @@
* @Author: LeeJiancong
* @Date: 2020-07-14 15:07:34
* @LastEditors: LeeJiancong
* @LastEditTime: 2020-07-31 19:27:46
* @LastEditTime: 2020-08-03 15:48:15
*/
import React, { Component, ReactNode, useRef, useState, useEffect } from 'react'
import { history } from 'umi'
......@@ -28,6 +28,7 @@ import { PublicApi } from '@/services/api'
import { timeRange} from '@/utils/index'
import moment from 'moment'
import statuStyle from '../colorTag'
import {TimeList,outSideStatusList,statusList} from '../statusList'
import style from '../components/index.less'
const { Option } = Select
const data = [
......@@ -143,49 +144,7 @@ const OrderList: React.FC<ListProps> = (props) => {
invoicesTimeStart: '',
invoicesTimeEnd: ''
})
const TimeList = [
{
label: '单据时间(全部)', value: 0
},
{
label: '今天', value: 1
},
{
label: '一周内', value: 2
},
{
label: '一个月内', value: 3
},
{
label: '三个月内', value: 4
},
{
label: '六个月内', value: 5
},
{
label: '一年内', value: 6
},
{
label: '一年前', value: 7
}
]
const outSideStatusList = [
{
label: '外部状态(全部)', value: ''
},
{
label: '待提交', value: 1
},
{
label: '待确认', value: 2
},
{
label: '接受物流单', value: 3
},
{
label: '不接受物流单', value: 4
}
]
const columns: ColumnType<any>[] = [
{
title: '物流单号',
......@@ -240,9 +199,12 @@ const OrderList: React.FC<ListProps> = (props) => {
},
{
title: '外部状态',
align: 'center',
align: 'left',
dataIndex: 'status',
key: 'status',
filters: statusList,
filterMultiple: false,
onFilter:(value,record) => record.status === value,
render: (text: any, record: any) => {
let component: ReactNode = null
if (text == 3) {
......@@ -398,17 +360,6 @@ const OrderList: React.FC<ListProps> = (props) => {
})
}
</Select>
<Select
className={style.select}
value={searchForm.status}
onChange={(val) => setSearchForm({ ...searchForm, status: val })}
>
{
outSideStatusList.map((item,index) => {
return <Option key={index} value={item.value}>{item.label}</Option>
})
}
</Select>
</Space>
</Col>
}
......
......@@ -2,9 +2,9 @@
* @Author: LeeJiancong
* @Date: 2020-07-28 11:25:30
* @LastEditors: LeeJiancong
* @LastEditTime: 2020-07-30 17:37:44
* @LastEditTime: 2020-08-03 16:48:12
*/
import React, { Component, useEffect, useRef, useState } from 'react'
import React, { Component, useEffect, useRef, useState,ReactNode } from 'react'
import { Card, Row, Col, Tabs, Button, Input as SelectInput, Badge } from 'antd'
import { LinkOutlined } from '@ant-design/icons'
import { StandardTable } from 'god'
......@@ -82,17 +82,17 @@ const Deatail: React.FC<{}> = () => {
},
{
title: '状态',
align: 'center',
align: 'left',
dataIndex: 'name',
key: 'name',
render: (_: any, record) => {
return (
<>
<Badge color="#6C9CEB" text='待确认' />
<Badge status='error' text='不接受物流单' />
</>
)
}
render: (text: number, record: any) => {
let component: ReactNode = null;
text === 1 ? component = <Badge status='default' text="待提交" />:
text === 2 ? component = <Badge status='processing' text="待确认" />:
text === 3 ? component = <Badge status='success' text="接受物流单" />:
component = <Badge status='error' text="不接受物流单" />
return component;
},
},
{
title: '操作',
......
......@@ -2,7 +2,7 @@
* @Author: LeeJiancong
* @Date: 2020-07-14 15:07:34
* @LastEditors: LeeJiancong
* @LastEditTime: 2020-07-31 19:35:54
* @LastEditTime: 2020-08-03 15:49:51
*/
import React, { Component, ReactNode, useRef, useState, useEffect } from 'react'
import { history } from 'umi'
......@@ -26,6 +26,7 @@ import { IFormFilter, IButtonFilter } from 'god/dist/src/standard-table/TableCon
import { PublicApi } from '@/services/api'
import style from '../components/index.less'
import statuStyle from '../colorTag'
import {TimeList,outSideStatusList,statusList} from '../statusList'
import moment from 'moment'
import { timeRange } from '@/utils/index'
import Index from '@/pages';
......@@ -57,49 +58,7 @@ const data = [
interface Item {
key: string
}
const TimeList = [
{
label: '单据时间(全部)', value: 0
},
{
label: '今天', value: 1
},
{
label: '一周内', value: 2
},
{
label: '一个月内', value: 3
},
{
label: '三个月内', value: 4
},
{
label: '六个月内', value: 5
},
{
label: '一年内', value: 6
},
{
label: '一年前', value: 7
}
]
const outSideStatusList = [
{
label: '外部状态(全部)', value: ''
},
{
label: '待提交', value: 1
},
{
label: '待确认', value: 2
},
{
label: '接受物流单', value: 3
},
{
label: '不接受物流单', value: 4
}
]
//父页面传递来的参数
export interface ListProps {
}
......@@ -200,9 +159,12 @@ const OrderList: React.FC<ListProps> = (props) => {
},
{
title: '外部状态',
align: 'center',
align: 'left',
dataIndex: 'status',
key: 'status',
filters: statusList,
filterMultiple: false,
onFilter:(value,record) => record.status === value,
render: (text: any, reconds: any) => {
let component: ReactNode = null
if (text == 3) {
......@@ -239,7 +201,9 @@ const OrderList: React.FC<ListProps> = (props) => {
删除
</Button>
</Popconfirm>
<Button type='link'>提交</Button>
<Popconfirm title="确定要提交吗?" okText="是" cancelText="否" onConfirm={() => handleSubmit(record.id)}>
<Button type='link'>提交</Button>
</Popconfirm>
</>
}
......@@ -286,11 +250,17 @@ const OrderList: React.FC<ListProps> = (props) => {
})
}
const handleDelete = (id: number | string) => {
const handleDelete = (id: number) => {
PublicApi.postLogisticsOrderWaitSubmitDelete({ id: id }).then(res => {
ref.current.reload()
})
}
const handleSubmit = (id:number) => {
PublicApi.postLogisticsOrderWaitSubmitSubmit({id:id}).then(res => {
ref.current.reload()
})
}
const handleSee = (id: number) => {
history.push(`/memberCenter/logisticsAbility/logisticsSubmit/orderSubmitDeatil?id=${id}`)
}
......
/*
* @Author: LeeJiancong
* @Date: 2020-08-01 11:06:09
* @LastEditors: LeeJiancong
* @LastEditTime: 2020-08-01 11:07:49
*/
export const TimeList = [
{
label: '单据时间(全部)', value: 0
},
{
label: '今天', value: 1
},
{
label: '一周内', value: 2
},
{
label: '一个月内', value: 3
},
{
label: '三个月内', value: 4
},
{
label: '六个月内', value: 5
},
{
label: '一年内', value: 6
},
{
label: '一年前', value: 7
}
]
export const outSideStatusList = [
{
label: '外部状态(全部)', value: ''
},
{
label: '待提交', value: 1
},
{
label: '待确认', value: 2
},
{
label: '接受物流单', value: 3
},
{
label: '不接受物流单', value: 4
}
]
export const statusList = [
{
text: '待提交', value: 1
},
{
text: '待确认', value: 2
},
{
text: '接受物流单', value: 3
},
{
text: '不接受物流单', value: 4
}
]
\ No newline at end of file
import React, { useState, useEffect, useRef } from 'react';
import { history } from 'umi';
import {
Tooltip,
Input,
Select,
Button,
Card,
Dropdown,
Menu,
Row,
Col,
Popconfirm,
} from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { Tooltip, Input, Button, Card, Row, Col, Popconfirm } from 'antd';
import {
PlusOutlined,
EyeOutlined,
UpOutlined,
DeleteOutlined,
DownOutlined,
PlayCircleOutlined,
PauseCircleOutlined,
} from '@ant-design/icons';
import { StandardTable } from 'god';
import { ColumnType } from 'antd/lib/table/interface';
import style from './index.less';
const BillsType: React.FC<{}> = () => {
return <div>BillsType</div>;
const data = [
{
key: '1',
id: '1',
no: 'DJ001',
name: '进货入库单',
direction: 1,
status: 1,
},
{
key: '2',
id: '2',
no: 'DJ002',
name: '退货入库单',
direction: 2,
status: 2,
},
];
const billsType: React.FC<{}> = () => {
const ref = useRef({});
const [searchName, setSearchName] = useState('');
const columns: ColumnType<any>[] = [
{
title: 'ID',
dataIndex: 'id',
align: 'center',
key: 'id',
},
{
title: '单据类型编号',
dataIndex: 'no',
align: 'center',
key: 'no',
},
{
title: '单据名称',
dataIndex: 'name',
align: 'center',
key: 'name',
render: (text: any, record: any) => {
return (
<span className="commonPickColor" onClick={() => history.push('')}>
{text}&nbsp;
<EyeOutlined />
</span>
);
},
},
{
title: '方向',
dataIndex: 'direction',
align: 'center',
key: 'direction',
render: (text: any, record: any) => {
return (
<span>
{text}
{record.direction === 1 ? ' +' : ' -'}
</span>
);
},
},
{
title: '状态',
dataIndex: 'status',
align: 'center',
key: 'status',
sorter: true,
render: (text: any, record: any) => {
return (
<Popconfirm
title="确定要执行这个操作?"
onConfirm={() => console.log('...')}
onCancel={() => console.log('...')}
okText="是"
cancelText="否"
>
<Button
type="link"
onClick={() => console.log('???')}
style={
record.status === 1 ? { color: '#00B37A' } : { color: 'red' }
}
>
{record.status === 1 ? (
<>
有效 <PlayCircleOutlined />
</>
) : (
<>
无效 <PauseCircleOutlined />
</>
)}
</Button>
</Popconfirm>
);
},
},
{
title: '操作',
dataIndex: 'option',
align: 'center',
render: (record: any) => (
<>
<Button type="link" onClick={record => history.push('')}>
编辑
</Button>
<Popconfirm
title="确定要执行这个操作?"
onConfirm={() => console.log('...')}
onCancel={() => console.log('...')}
okText="是"
cancelText="否"
>
<Button type="link">删除</Button>
</Popconfirm>
</>
),
},
];
// 模拟请求
const fetchData = (params: any) => {
return new Promise((resolve, reject) => {
const queryResult = data.find(v => v.key === params.keywords);
setTimeout(() => {
resolve({
code: 200,
message: '',
data: queryResult ? [queryResult] : data,
});
}, 1000);
});
};
const handleReset = () => {};
return (
<PageHeaderWrapper>
<Card>
<StandardTable
tableProps={{ rowKey: 'id' }}
columns={columns}
currentRef={ref}
fetchTableData={(params: any) => fetchData(params)}
controlRender={
<Row>
<Col span={12}>
<Button
type="primary"
onClick={() =>
history.push(
'/memberCenter/memberAbility/manage/addMember?type=add',
)
}
>
<PlusOutlined />
新建
</Button>
</Col>
<Col span={12} style={{ textAlign: 'right' }}>
<Tooltip
trigger={['focus']}
placement="top"
title={<span>输入单据名称进行搜索</span>}
>
<Input.Search
style={{ width: '232px' }}
value={searchName}
placeholder="搜索"
onChange={e => setSearchName(e.target.value)}
/>
</Tooltip>
<Button
style={{ marginLeft: '16px' }}
onClick={() => handleReset()}
>
重置
</Button>
</Col>
</Row>
}
/>
</Card>
</PageHeaderWrapper>
);
};
export default BillsType;
export default billsType;
import React, { useState, useEffect, useRef } from 'react';
import { history } from 'umi';
import {
Tooltip,
Input,
Select,
Button,
Card,
Dropdown,
Menu,
Row,
Col,
Popconfirm,
} from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { Tooltip, Input, Button, Card, Row, Col, Popconfirm } from 'antd';
import {
PlusOutlined,
EyeOutlined,
UpOutlined,
DeleteOutlined,
DownOutlined,
PlayCircleOutlined,
PauseCircleOutlined,
} from '@ant-design/icons';
import { StandardTable } from 'god';
import { ColumnType } from 'antd/lib/table/interface';
import style from './index.less';
const data = [
{
key: '1',
id: '1',
name: '广州成品仓',
address: '广东省广州市海珠区新港东路1068号中洲中心北塔6楼',
person: '蒯美政',
phoneMobile: '185 2929 5432',
status: 1,
},
{
key: '2',
id: '2',
name: '广州成品仓',
address: '广东省广州市海珠区新港东路1068号中洲中心北塔6楼',
person: '蒯美政',
phoneMobile: '185 2929 5432',
status: 2,
},
];
const WareHouse: React.FC<{}> = () => {
return <div>warehouse</div>;
const ref = useRef({});
const [searchName, setSearchName] = useState('');
const columns: ColumnType<any>[] = [
{
title: 'ID',
dataIndex: 'id',
align: 'center',
key: 'id',
},
{
title: '仓库名称',
dataIndex: 'name',
align: 'center',
key: 'name',
render: (text: any, record: any) => {
return (
<span className="commonPickColor" onClick={() => history.push('')}>
{text}&nbsp;
<EyeOutlined />
</span>
);
},
},
{
title: '仓库地址',
dataIndex: 'address',
align: 'center',
key: 'address',
},
{
title: '仓库负责人',
dataIndex: 'person',
align: 'center',
key: 'person',
},
{
title: '联系电话',
dataIndex: 'phoneMobile',
align: 'center',
key: 'phoneMobile',
},
{
title: '状态',
dataIndex: 'status',
align: 'center',
key: 'status',
sorter: true,
render: (text: any, record: any) => {
return (
<Popconfirm
title="确定要执行这个操作?"
onConfirm={() => console.log('...')}
onCancel={() => console.log('...')}
okText="是"
cancelText="否"
>
<Button
type="link"
onClick={() => console.log('???')}
style={
record.status === 1 ? { color: '#00B37A' } : { color: 'red' }
}
>
{record.status === 1 ? (
<>
有效 <PlayCircleOutlined />
</>
) : (
<>
无效 <PauseCircleOutlined />
</>
)}
</Button>
</Popconfirm>
);
},
},
{
title: '操作',
dataIndex: 'option',
align: 'center',
render: (record: any) => (
<>
<Button type="link" onClick={record => history.push('')}>
编辑
</Button>
<Popconfirm
title="确定要执行这个操作?"
onConfirm={() => console.log('...')}
onCancel={() => console.log('...')}
okText="是"
cancelText="否"
>
<Button type="link">删除</Button>
</Popconfirm>
</>
),
},
];
// 模拟请求
const fetchData = (params: any) => {
return new Promise((resolve, reject) => {
const queryResult = data.find(v => v.key === params.keywords);
setTimeout(() => {
resolve({
code: 200,
message: '',
data: queryResult ? [queryResult] : data,
});
}, 1000);
});
};
const handleReset = () => {};
return (
<PageHeaderWrapper>
<Card>
<StandardTable
tableProps={{ rowKey: 'id' }}
columns={columns}
currentRef={ref}
fetchTableData={(params: any) => fetchData(params)}
controlRender={
<Row>
<Col span={12}>
<Button
type="primary"
onClick={() =>
history.push(
'/memberCenter/memberAbility/manage/addMember?type=add',
)
}
>
<PlusOutlined />
新建
</Button>
</Col>
<Col span={12} style={{ textAlign: 'right' }}>
<Tooltip
trigger={['focus']}
placement="top"
title={<span>输入仓库名称进行搜索</span>}
>
<Input.Search
style={{ width: '232px' }}
value={searchName}
placeholder="搜索"
onChange={e => setSearchName(e.target.value)}
/>
</Tooltip>
<Button
style={{ marginLeft: '16px' }}
onClick={() => handleReset()}
>
重置
</Button>
</Col>
</Row>
}
/>
</Card>
</PageHeaderWrapper>
);
};
export default WareHouse;
This source diff could not be displayed because it is too large. You can view the blob instead.
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