Commit 52187b79 authored by LeeJiancong's avatar LeeJiancong

对接物流单详情

parent 748a7e58
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({})
let [isextraOption, setIsextraOption] = useState(false)
let [dataInfo, setdataInfo] = useState<dataInfoType>({
status: '',
digest: '',
logisticsOrderNo:'',
companyName:'',
invoicesTime:'',
detailList:[],
logList:[],
totalCarton: 0,
totalVolume: 0,
totalWeight: 0,
freightPrice: 0,
settlementWay: ''
})
const [id, setid] = useState('')
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,80 +101,80 @@ 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: '状态',
......@@ -159,23 +195,65 @@ const detailInfo: React.FC<{}> = () => {
},
{
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'){
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') {
setIsextraOption(true)
PublicApi.getLogisticsOrderWaitConfirmGet({ 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})
})
}
return () => {
......@@ -188,11 +266,12 @@ const detailInfo: React.FC<{}> = () => {
resolve({
code: 200,
message: '',
data: queryResult ? [queryResult] : data,
data: dataInfo.detailList//dataInfo.logList
});
}, 1000);
});
};
return (
<PageHeaderWrapper
......@@ -202,8 +281,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 +305,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>
......@@ -283,7 +367,9 @@ 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']}>
<Button type='link'>{item.value}</Button>
</div>
</div>
);
},
......@@ -297,7 +383,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 +398,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 +426,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 +464,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>
......@@ -405,21 +485,16 @@ const detailInfo: React.FC<{}> = () => {
<div className={style['mainCol-title']}>
外部流转记录
</div>
<StandardTable
tableProps={{
<Table dataSource={dataInfo.logList} columns={columns} pagination={pagination} />
}}
columns={columns}
currentRef={ref}
fetchTableData={(params: any) => fetchData(params)}
/>
</Col>
</Row>
<ConfirmModal
<ConfirmModal
id={id}
dialogVisible={visible}
onCancel={() => setvisible(false)}
/>
/>
</PageHeaderWrapper>
)
......
......@@ -2,7 +2,7 @@
* @Author: LeeJiancong
* @Date: 2020-07-18 15:55:51
* @LastEditors: LeeJiancong
* @LastEditTime: 2020-07-31 19:23:51
* @LastEditTime: 2020-08-01 11:09:05
*/
import React, { useState, useEffect, useRef, ReactNode } from 'react';
import { Card, Button, Row, Col, Tooltip, Input, Select, Tag, Space } from 'antd'
......@@ -16,6 +16,7 @@ import { hidden } from 'chalk';
import { PublicApi } from '@/services/api';
import {timeRange} from '@/utils/index'
import statuStyle from '../colorTag'
import {TimeList,statusList,outSideStatusList} from '../statusList'
import moment from 'moment'
let { Option } = Select
export interface listProps {
......@@ -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([])
......@@ -258,6 +216,9 @@ const orderSearchList: React.FC<listProps> = (props) => {
align: 'center',
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,
......
......@@ -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-01 11:10:57
*/
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: '物流单号',
......@@ -243,6 +202,9 @@ const OrderList: React.FC<ListProps> = (props) => {
align: 'center',
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) {
......
......@@ -2,7 +2,7 @@
* @Author: LeeJiancong
* @Date: 2020-07-14 15:07:34
* @LastEditors: LeeJiancong
* @LastEditTime: 2020-07-31 20:20:19
* @LastEditTime: 2020-08-01 11:12:49
*/
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 {
}
......@@ -203,6 +162,9 @@ const OrderList: React.FC<ListProps> = (props) => {
align: 'center',
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) {
......
/*
* @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
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