import { PageContainer } from '@ant-design/pro-layout' ; import type { ProColumns } from '@ant-design/pro-table' ; import ProTable from '@ant-design/pro-table' ; import { Badge , Card , Descriptions , Divider } from 'antd' ; import type { FC } from 'react' ; import React from 'react' ; import { useRequest } from 'umi' ; import type { BasicGood , BasicProgress } from './data.d' ; import { queryBasicProfile } from './service' ; import styles from './style.less' ; const progressColumns = [ { title : '时间' , dataIndex : 'time' , key : 'time' , } , { title : '当前进度' , dataIndex : 'rate' , key : 'rate' , } , { title : '状态' , dataIndex : 'status' , key : 'status' , render : ( text ) => { if ( text === 'success' ) { return < Badge status = "success" text = "成功" / > ; } return < Badge status = "processing" text = "进行中" / > ; } , } , { title : '操作员ID' , dataIndex : 'operator' , key : 'operator' , } , { title : '耗时' , dataIndex : 'cost' , key : 'cost' , } , ] ; const PAGE_NAME_UPPER_CAMEL_CASE = ( ) => { const { data , loading } = useRequest ( ( ) => { return queryBasicProfile ( ) ; } ) ; const { basicGoods , basicProgress } = data || { basicGoods : [ ] , basicProgress : [ ] , } ; let goodsData = [ ] ; if ( basicGoods . length ) { let num = 0 ; let amount = 0 ; basicGoods . forEach ( ( item ) => { num += Number ( item . num ) ; amount += Number ( item . amount ) ; } ) ; goodsData = basicGoods . concat ( { id : '总计' , num , amount , } ) ; } const renderContent = ( value , _ , index ) => { const obj = { children : value , props : { } , } ; if ( index === basicGoods . length ) { obj . props . colSpan = 0 ; } return obj ; } ; const goodsColumns = [ { title : '商品编号' , dataIndex : 'id' , key : 'id' , render : ( text , _ , index ) => { if ( index < basicGoods . length ) { return < span > { text } < /span>; } return { children : < span style = { { fontWeight : 600 } } > 总计 < /span>, props : { colSpan : 4 , } , } ; } , } , { title : '商品名称' , dataIndex : 'name' , key : 'name' , render : renderContent , } , { title : '商品条码' , dataIndex : 'barcode' , key : 'barcode' , render : renderContent , } , { title : '单价' , dataIndex : 'price' , key : 'price' , align : 'right' as 'left' | 'right' | 'center' , render : renderContent , } , { title : '数量（件）' , dataIndex : 'num' , key : 'num' , align : 'right' as 'left' | 'right' | 'center' , render : ( text , _ , index ) => { if ( index < basicGoods . length ) { return text ; } return < span style = { { fontWeight : 600 } } > { text } < /span>; } , } , { title : '金额' , dataIndex : 'amount' , key : 'amount' , align : 'right' as 'left' | 'right' | 'center' , render : ( text , _ , index ) => { if ( index < basicGoods . length ) { return text ; } return < span style = { { fontWeight : 600 } } > { text } < /span>; } , } , ] ; return ( < PageContainer > < Card bordered = { false } > < Descriptions title = "退款申请" style = { { marginBottom : 32 } } > < Descriptions . Item label = "取货单号" > 1000000000 < /Descriptions.Item> < Descriptions . Item label = "状态" > 已取货 < /Descriptions.Item> < Descriptions . Item label = "销售单号" > 1234123421 < /Descriptions.Item> < Descriptions . Item label = "子订单" > 3214321432 < /Descriptions.Item> < /Descriptions> < Divider style = { { marginBottom : 32 } } /> < Descriptions title = "用户信息" style = { { marginBottom : 32 } } > < Descriptions . Item label = "用户姓名" > 付小小 < /Descriptions.Item> < Descriptions . Item label = "联系电话" > 18100000000 < /Descriptions.Item> < Descriptions . Item label = "常用快递" > 菜鸟仓储 < /Descriptions.Item> < Descriptions . Item label = "取货地址" > 浙江省杭州市西湖区万塘路18号 < /Descriptions.Item> < Descriptions . Item label = "备注" > 无 < /Descriptions.Item> < /Descriptions> < Divider style = { { marginBottom : 32 } } /> < div className = { styles . title } > 退货商品 < /div> < ProTable style = { { marginBottom : 24 } } pagination = { false } search = { false } loading = { loading } options = { false } toolBarRender = { false } dataSource = { goodsData } columns = { goodsColumns } rowKey = "id" / > < div className = { styles . title } > 退货进度 < /div> < ProTable style = { { marginBottom : 16 } } pagination = { false } loading = { loading } search = { false } options = { false } toolBarRender = { false } dataSource = { basicProgress } columns = { progressColumns } / > < /Card> < /PageContainer>); } ; export default PAGE_NAME_UPPER_CAMEL_CASE ;