18 changed files with 2623 additions and 250 deletions
-
21src/components/TableModule/index.jsx
-
22src/components/TableModule/index.scss
-
6src/pages/FinancialMgm/OrderInquiry/OrderChangeInquiry/index.scss
-
1164src/pages/FinancialMgm/OrderInquiry/ParkingOrderInquiry/index.jsx
-
315src/pages/FinancialMgm/OrderInquiry/ParkingOrderInquiry/index.scss
-
496src/pages/FinancialMgm/OrderInquiry/ReturnOrderInquiry/index.jsx
-
314src/pages/FinancialMgm/OrderInquiry/ReturnOrderInquiry/index.scss
-
154src/pages/InRoadMgm/PersonMgm/MesNotification/loadable.jsx
-
40src/pages/InRoadMgm/RecordInquiry/DisabledCarParkRecordTotal/index.scss
-
56src/pages/InRoadMgm/RecordInquiry/ParkRecordTotal/index.scss
-
5src/pages/OperationCenter/CarMgm/CarAuth/loadable.jsx
-
38src/pages/OperationCenter/CarMgm/CarInfo/index.scss
-
34src/pages/OperationCenter/CarMgm/CarInfo/loadable.jsx
-
38src/pages/OperationCenter/UserMgm/UserInfo/index.scss
-
66src/pages/OperationCenter/UserMgm/UserInfo/loadable.jsx
-
12src/pages/OutRoadMgm/OutSegmentMgm/OutSegment/AddParking.jsx
-
3src/pages/OutRoadMgm/OutSegmentMgm/OutSegment/ConfigParking/MSPages.jsx
-
1src/pages/OutRoadMgm/OutSegmentMgm/OutSegment/loadable.jsx
1164
src/pages/FinancialMgm/OrderInquiry/ParkingOrderInquiry/index.jsx
File diff suppressed because it is too large
View File
File diff suppressed because it is too large
View File
@ -1,15 +1,491 @@ |
|||
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"; |
|||
import { |
|||
message, |
|||
Pagination, |
|||
Table, |
|||
Input, |
|||
Space, |
|||
Modal, |
|||
Button, |
|||
Select, |
|||
Tabs, |
|||
Descriptions, |
|||
Timeline |
|||
} from "antd"; |
|||
import moment from "moment"; |
|||
import ajax from '@/config/ajax.js' |
|||
import { TableModule } from "@/components"; |
|||
import { dictionary } from "@/config/common.js"; |
|||
import "./index.scss"; |
|||
function ReturnOrderInquiry() { |
|||
return <div>ReturnOrderInquiry</div> |
|||
const [memberId, setMemberId] = useState() |
|||
//构建表头 |
|||
const createCol = (label, name, type) => { |
|||
label.length == name.length ? null : console.log('参数缺失', name, label.length, name.length) |
|||
var arr = [] |
|||
label?.map((item, index) => { |
|||
let cm = { |
|||
title: item, |
|||
dataIndex: name[index], |
|||
key: name[index], |
|||
align: "center", |
|||
} |
|||
switch (item) { |
|||
case "序号": |
|||
cm.render = (text, record, index) => index + 1 |
|||
break |
|||
case "退款订单ID": |
|||
case "业务订单ID": |
|||
case "支付订单ID": |
|||
cm.render = (text) => ( |
|||
<> |
|||
<a onClick={() => { |
|||
navigator.clipboard.writeText(`${text}`).then(() => { message.success("已复制到剪切板") }); |
|||
}}>{text}</a> |
|||
</> |
|||
) |
|||
break |
|||
default: break |
|||
} |
|||
arr.push(cm) |
|||
}) |
|||
var obj = { |
|||
title: "操作", |
|||
dataIndex: "operation", |
|||
key: "operation", |
|||
fixed: "right", |
|||
align: "center", |
|||
} |
|||
switch (type) { |
|||
case 2: |
|||
obj.render = (text, record) => (<> |
|||
<span type="primary" style={{ display: 'block', textAlign: 'center' }} onClick={() => { |
|||
setYcddData(record) |
|||
setDetailVisible(true) |
|||
}}> |
|||
<a>详情</a> |
|||
</span> |
|||
</>) |
|||
arr.push(obj) |
|||
break |
|||
case 6: |
|||
obj.render = (text, record) => (<> |
|||
<span type="primary" style={{ display: 'block', textAlign: 'center' }} onClick={() => { |
|||
setTkddVisible(true) |
|||
}}> |
|||
<a>详情</a> |
|||
</span> |
|||
</>) |
|||
arr.push(obj) |
|||
break |
|||
case 7: |
|||
obj.render = (text, record) => (<> |
|||
<span type="primary" style={{ display: 'block', textAlign: 'center' }} onClick={() => { |
|||
setTkddVisible(true) |
|||
}}> |
|||
<a>详情</a> |
|||
</span> |
|||
</>) |
|||
arr.push(obj) |
|||
break |
|||
case 8: |
|||
obj.render = (text, record) => (<> |
|||
<span type="primary" style={{ display: 'block', textAlign: 'center' }} onClick={() => { |
|||
refundSearch(record) |
|||
setTkddVisible(true) |
|||
}}> |
|||
<a>详情</a> |
|||
</span> |
|||
</>) |
|||
arr.push(obj) |
|||
break |
|||
default: break |
|||
} |
|||
return arr |
|||
} |
|||
//退费记录检索条件 |
|||
const formRefundSearch = [ |
|||
{ |
|||
name: "refund_id", |
|||
type: "Input", |
|||
label: "退款订单号", |
|||
placeholder: "请输入退款订单号", |
|||
}, |
|||
{ |
|||
name: "type", |
|||
type: "Select", |
|||
label: "业务订单类型", |
|||
options: dictionary.BusinessOrderType, |
|||
}, |
|||
{ |
|||
name: "park_id", |
|||
type: "Input", |
|||
label: "业务订单ID", |
|||
placeholder: "请输入业务订单ID", |
|||
}, |
|||
{ |
|||
name: "order_id", |
|||
type: "Input", |
|||
label: "支付订单ID", |
|||
placeholder: "请输入支付订单ID", |
|||
}, |
|||
{ |
|||
name: "state", |
|||
type: "Select", |
|||
label: "退款状态", |
|||
options: [ |
|||
{ |
|||
label: "全部", |
|||
value: 0, |
|||
}, |
|||
{ |
|||
label: "待确认", |
|||
value: 1, |
|||
}, |
|||
{ |
|||
label: "退款中", |
|||
value: 2, |
|||
}, |
|||
{ |
|||
label: "已完成", |
|||
value: 3, |
|||
}, |
|||
{ |
|||
label: "退款失败", |
|||
value: 4, |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
name: "reason", |
|||
type: "Select", |
|||
label: "退款原因", |
|||
options: [ |
|||
{ |
|||
label: "全部", |
|||
value: 0, |
|||
}, |
|||
{ |
|||
label: "异常订单处理", |
|||
value: 1, |
|||
}, |
|||
{ |
|||
label: "自动平单退款", |
|||
value: 2, |
|||
}, |
|||
], |
|||
}, |
|||
{ |
|||
name: "flow_id", |
|||
type: "Input", |
|||
label: "渠道流水号", |
|||
placeholder: "请输入渠道流水号", |
|||
}, |
|||
{ |
|||
name: "timePeriod", |
|||
type: "RangePicker", |
|||
label: "时间段", |
|||
defaultTitle: ['退款时间', '至'], |
|||
defaultValue: [moment().subtract(1, "month"), moment()], |
|||
}, |
|||
]; |
|||
|
|||
const [tag, setTag] = useState('1'); |
|||
const [resultData, setResultData] = useState([]) |
|||
const [baseData, setBaseData] = useState({ |
|||
//car_type:2 |
|||
img: '' |
|||
}) |
|||
const [ycddData, setYcddData] = useState([])//异常订单数据 |
|||
const [detailVisible, setDetailVisible] = useState(false); |
|||
const [timesVisible, setTimesVisible] = useState(false); //退款尝试次数展开 |
|||
const [tkddVisible, setTkddVisible] = useState(false); |
|||
const [eaeVisible, setEaeVisible] = useState(false);//出入场图片 |
|||
const [bigpicVisible, setBigpicVisible] = useState(false);//大图展示 |
|||
const [bqVisible, setBqVisible] = useState(false);//流程查看 |
|||
const [bigPic, setBigPic] = useState(); |
|||
const [total, setTotal] = useState(0); |
|||
const [tabKey, setTabKey] = useState("1"); |
|||
function openModal(params) { |
|||
setDetailVisible(true); |
|||
} |
|||
|
|||
//基本信息详情 |
|||
function searchDetail(e) { |
|||
ajax({ |
|||
url: "/api/ope/user/get_base_info", |
|||
type: "get", |
|||
data: { memberId: e.memberId }, |
|||
}).then((res) => { |
|||
let { status, data, total } = res |
|||
if (status == 20000) { |
|||
setBaseData(data) |
|||
setTag('2') |
|||
} else { |
|||
message.error(res.message) |
|||
} |
|||
}) |
|||
|
|||
} |
|||
|
|||
//详情其他模块查询 |
|||
function searchOther(e) { |
|||
var url = '' |
|||
switch (tabKey) { |
|||
case "1": |
|||
url = "" |
|||
break |
|||
case "2": |
|||
url = "/api/bpm/record/get_record_list"//停车记录 |
|||
break |
|||
case "3": |
|||
url = "/api/bpm/record/get_payment_list"//支付记录 |
|||
break |
|||
case "4": |
|||
url = "/api/ope/record/get_recharge_list"//充值記錄 |
|||
break |
|||
case "5": |
|||
url = "/api/bpm/record/get_parking_arrears_list"//欠费记录 |
|||
break |
|||
case "6": |
|||
url = "" |
|||
break |
|||
case "7": |
|||
url = "" |
|||
break |
|||
case "8": |
|||
url = "/api/ope/record/get_refund_list"//退费订单 |
|||
break |
|||
default: break |
|||
} |
|||
if (tabKey == '5' && e && !e?.type) { |
|||
e.type = 1 |
|||
} |
|||
ajax({ |
|||
url: url, |
|||
type: "post", |
|||
data: { ...e, memberId: memberId, startTime: e?.start_time, endTime: e?.end_time }, |
|||
}).then((res) => { |
|||
let { status, data, total } = res |
|||
if (status == 20000) { |
|||
if (data.list) { |
|||
setResultData(data.list) |
|||
setTotal(data.total) |
|||
} else { |
|||
setResultData(data) |
|||
setTotal(total) |
|||
} |
|||
} else { |
|||
setResultData([]) |
|||
message.error(res.message) |
|||
} |
|||
}) |
|||
} |
|||
//退款订单详情 |
|||
function refundSearch(e) { |
|||
ajax({ |
|||
url: "/api/ope/record/get_refund_info", |
|||
type: "get", |
|||
data: { id: e.refund_id }, |
|||
}).then((res) => { |
|||
let { status, data } = res |
|||
if (status == 20000) { |
|||
//setResultData(data) |
|||
setYcddData(data) |
|||
} else { |
|||
message.error(res.message) |
|||
} |
|||
}) |
|||
} |
|||
|
|||
//其他页面渲染 |
|||
function renderTable(columns, arr, dataSource, exportUrl) { |
|||
return ( |
|||
<TableModule |
|||
columns={columns} |
|||
tableData={dataSource} |
|||
formSearch={arr} |
|||
total={total} |
|||
search={searchOther} |
|||
exportUrl={exportUrl} |
|||
rowKey={'id'} |
|||
/> |
|||
); |
|||
} |
|||
|
|||
//退款订单详情 |
|||
const tkddModal = <div className="ltc-box"> |
|||
<div className="ltc-box-title"><div className="text">退款订单:{ycddData?.refund_id}</div><div className="line"></div></div> |
|||
<div className="ltc-content"> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">生成时间</div><div className="new-value">{ycddData?.refund_time || "--"}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">退款状态</div><div className="new-value">{ycddData.refund_state || "--"}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">支付渠道</div><div className="new-value">{ycddData.payment_channels || "--"}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">退款方式</div><div className="new-value">{ycddData.refund_type || "--"}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">应退实付金额</div><div className="new-value">{ycddData.refund_actual_amount || "--"}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">已退实付金额</div><div className="new-value">{ycddData.has_refund_actual_amount || "--"}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">应退优惠金额</div><div className="new-value">{ycddData.refund_discount_amount || "--"}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">已退优惠金额</div><div className="new-value">{ycddData.has_refund_discount_amount || "--"}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">退款尝试次数</div><div className="new-value">{ycddData.try_count || "--"} |
|||
{timesVisible ? |
|||
<a onClick={() => { setTimesVisible(false) }}>收起</a> : |
|||
<a onClick={() => { setTimesVisible(true) }}>查看</a>} |
|||
</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">最近尝试时间</div><div className="new-value">{ycddData.latest_try_time || "--"}</div> |
|||
</div> |
|||
</div> |
|||
{timesVisible ? <> |
|||
<div className="ltc-box-title"><div className="text">退款尝试详情</div><div className="line"></div></div> |
|||
{/* <Table |
|||
columns={formRefundColumns} |
|||
dataSource={ycddData.try_list} |
|||
scroll={{ x: 1000 }} |
|||
className="yisa-table" |
|||
pagination={false} |
|||
rowKey={(record) => record.id} |
|||
/> */} |
|||
</> : |
|||
<> |
|||
<div className="ltc-box-title"><div className="text">支付订单:{ycddData.order_id}</div><div className="line"></div></div> |
|||
<div className="ltc-content"> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">平台商户</div><div className="new-value">{ycddData.payment_operator_name}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">生成时间</div><div className="new-value">{ycddData.payment_create_time}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">支付时间</div><div className="new-value">{ycddData.pay_time}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">支付渠道</div><div className="new-value">{ycddData.payment_equipment}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">优惠金额</div><div className="new-value">{ycddData.discount_amount}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">支付应用</div><div className="new-value">{ycddData.payment_equipment}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">实付金额</div><div className="new-value">{ycddData.paid_in_money}</div> |
|||
</div> |
|||
</div> |
|||
<div className="ltc-box-title"><div className="text">停车订单:{ycddData.park_record_id}</div><div className="line"></div></div> |
|||
<div className="ltc-box-title"><div className="text">车厂详情</div></div> |
|||
<div className="ltc-content"> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">平台商户</div><div className="new-value">{ycddData.payment_operator_name}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">停车场名称</div><div className="new-value">{ycddData?.road_name}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">区域</div><div className="new-value">{ycddData.area_name}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">商户名称</div><div className="new-value">{ycddData.park_operator_name}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">泊位号</div><div className="new-value">{ycddData.berth_code}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">车场类型</div><div className="new-value">{ycddData.road_type}</div> |
|||
</div> |
|||
</div> |
|||
<div className="ltc-box-title"><div className="text">车辆详情</div></div> |
|||
<div className="ltc-content"> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">车牌号</div><div className="new-value">{ycddData.plate_number}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">停车时长</div><div className="new-value">{ycddData.parking_duration}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">入场时间</div><div className="new-value">{ycddData.in_time}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">出场时间</div><div className="new-value">{ycddData.out_time}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">入场记录来源</div><div className="new-value">{ycddData.inSource}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">出场记录来源</div><div className="new-value">{ycddData.outSource}</div> |
|||
</div> |
|||
<div className="ltc-item"> |
|||
<div className="new-item">证据图像</div><div className="new-value"><a onClick={() => { setEaeVisible(true) }}>查看</a></div> |
|||
</div> |
|||
</div> |
|||
</>} |
|||
</div> |
|||
|
|||
useEffect(() => { |
|||
searchOther() |
|||
}, [tabKey]) |
|||
|
|||
return ( |
|||
<> |
|||
|
|||
{renderTable( |
|||
createCol(['序号', '最近尝试时间', '支付渠道', '应退实付（元）', '应退优惠（元）', '退款原因', '退款申请时间', '退款订单ID', '业务订单类型', '业务订单ID', '支付订单类型', '支付订单ID', '渠道流水号', '状态'], |
|||
['index', 'latest_try_time', 'payment_channels_name', 'refund_actual_amount', 'refund_discount_amount', 'reason', 'refund_time', 'payment_order_id', 'parking_type_name', 'park_record_id', 'payment_type_name', 'payment_order_id', 'flow_id', 'state_name'], 8), |
|||
formRefundSearch, |
|||
resultData |
|||
)} |
|||
<Modal |
|||
open={bigpicVisible} |
|||
width={1600} |
|||
title={'图片展示'} |
|||
className="eae-modal" |
|||
onCancel={() => { |
|||
setBigpicVisible(false); |
|||
}} |
|||
footer={false} |
|||
> |
|||
<div> |
|||
<div className="eae-modal-item"> |
|||
<img src={bigPic} width={1500} /> |
|||
</div> |
|||
</div> |
|||
</Modal> |
|||
<Modal |
|||
open={tkddVisible} |
|||
width={1500} |
|||
title={'订单详情'} |
|||
onCancel={() => { |
|||
setTkddVisible(false); |
|||
}} |
|||
footer={[ |
|||
<Button key="back" onClick={() => { |
|||
setTkddVisible(false); |
|||
}}> |
|||
关闭窗口 |
|||
</Button>]} |
|||
> |
|||
{tkddModal} |
|||
{/* {tabKey == '8' ? tkddModal : tabKey == '6' ? tckModal : tabKey == '7' ? cfkModal : null} */} |
|||
|
|||
</Modal> |
|||
</> |
|||
); |
|||
} |
|||
|
|||
export default ReturnOrderInquiry; |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue