Tenlion/system-copyright-react
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'dev' into devbra

Browse Source
This commit is contained in:
lyp 2025-05-21 09:42:29 +08:00
commit 153b4a963b
6 changed files with 465 additions and 125 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

293
src/components/PackageModal/PackageModal.tsx Normal file
View File

@ -0,0 +1,293 @@
import { useState, useEffect, useContext } from 'react'
import { Table, Spin, message, Modal } from 'antd';
import {
get,
} from "../../util/AjaxUtils.ts";
import { getPackageDetail } from '../../request/api.ts'
import { GlobalContext } from "../../context/GlobalContext.ts";
import type {
TableColumnsType,
} from 'antd';
export default function PackageModal() {
interface DataType {
usericId: string;
icPriceMaterial: number;
icPriceAll: number;
createTime: string;
packageOrderId: string;
}
interface DetailType {
orderTitle: string; //项目名称
description: string; //描述
gmtCreate: string; //创建时间
mode: number;//类型 1退回 2使用
}
const [messageApi, contextHolder] = message.useMessage();
const [packList, setPackList] = useState<any[]>([]) //服务包列表
const [packPage, setPackPage] = useState(1) //服务包分页
const [packTotal, setPackTotal] = useState(0) //服务包总数
const [packDetailModal, setPackDetailModal] = useState(false) //服务包详情
const [detailPage, setDetailPage] = useState(1) //服务包详情分页
const [detailTotal, setDetailTotal] = useState(0) //服务包详情总数
const [detailList, setDetailList] = useState<any[]>([]) //服务包详情列表
// const [packageOrderId, setPackageOrderId] = useState('') //服务包id
const [packloading, setPackloading] = useState(false)
// 获取我得服务包信息
const getPickList = (page: number, packageType: string) => {
get<any>({
messageApi,
url: `/api/proj/servicepkg/packageorder/listpage/self`,
config: {
params: {
page: page,
rows: 10,
packageType: packageType
}
},
onBefore() {
setPackloading(true)
},
onSuccess({ data }) {
setPackList(data.rows)
setPackTotal(data.total)
},
onFinally() {
setPackloading(false)
}
})
}
const globalContext = useContext(GlobalContext);
const [packageOrderId, setPackageOrderId] = useState('') //服务包id
// 获取服务包详情
const packageDetail = async (packageOrderId: string, page: number) => {
const res: any = await getPackageDetail(globalContext.user.userId, packageOrderId, { page: page, rows: 10 })
console.log(res);
setDetailList(res.rows)
setDetailTotal(res.total)
}
useEffect(() => {
getPickList(packPage, '')
}, [packPage])
useEffect(() => {
packageDetail(packageOrderId, detailPage)
}, [detailPage])
const packColumns: TableColumnsType<DataType> = [
{
title: '序号',
dataIndex: 'index',
key: 'packageOrderId',
align: 'center',
render: (_text, _record, index) => (packPage - 1) * 10 + index + 1, // 显示序号，从1开始
},
{
title: '套餐名称',
dataIndex: 'packageName',
key: 'packageOrderId',
// 居中显示
align: 'center',
},
// packageType
{
title: '套餐类型',
dataIndex: 'packageInfoAppDTO',
key: 'packageOrderId',
// 居中显示
align: 'center',
render: (text) => {
return <div>{text.packageType == "ALL" ? '全托管' : '写材料'} </div>
}
},
// {
// title: '套餐类型',
// dataIndex: 'packageInfoAppDTO',
// key: 'packageOrderId',
// // 居中显示
// align: 'center',
// render: (text) => {
// return <div>{text} </div>
// }
// },
{
title: '价格',
dataIndex: 'packageTotalMoney',
key: 'packageOrderId',
// 居中显示
align: 'center',
render: (text) => {
return <div>{text / 100}元</div>
}
},
{
title: '剩余次数',
dataIndex: 'packageTotalSurplusCount',
align: 'center',
key: 'packageOrderId',
render: (text: number) => {
return <div>{text} </div>
}
},
{
title: '总次数',
dataIndex: 'packageTotalCount',
align: 'center',
key: 'packageOrderId',
render: (text: any) => {
return <div>{text} </div>
}
},
{
title: '下单时间',
align: 'center',
dataIndex: 'gmtCreate',
key: 'packageOrderId',
// render: (text: string) => {
// return <div title={text} style={{ width: 200, whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}>{text}</div>
// }
},
{
title: '操作',
align: 'center',
dataIndex: 'operate',
key: 'packageOrderId',
render: (_value, record) => {
return <a onClick={() => {
// console.log(record);
setPackDetailModal(true)
packageDetail(record.packageOrderId, 1)
setPackageOrderId(record.packageOrderId)
setDetailPage(1)
}}>查看详情</a>
}
},
];
const detailColums: TableColumnsType<DetailType> = [
{
title: '序号',
dataIndex: 'index',
key: 'packageOrderItemId',
align: 'center',
width: 100,
render: (_text, _record, index) => (detailPage - 1) * 10 + index + 1, // 显示序号，从1开始
},
{
title: '项目名称',
dataIndex: 'orderTitle',
key: 'packageOrderItemId',
align: 'center',
width: 150,
ellipsis: {
showTitle: true,
},
},
{
title: '类型',
dataIndex: 'mode',
key: 'packageOrderItemId',
align: 'center',
width: 120,
render: (text) => {
return <span>
{text == 1 ? '退回' : '使用'}
</span>
}
},
{
title: '创建时间',
dataIndex: 'gmtCreate',
key: 'packageOrderItemId',
align: 'center',
width: 200,
},
{
title: '使用数量',
dataIndex: 'itemUseCount',
key: 'packageOrderItemId',
align: 'center',
width: 100,
},
{
title: '剩余数量',
dataIndex: 'itemCount',
key: 'packageOrderItemId',
align: 'center',
width: 100,
},
{
title: '描述',
dataIndex: 'description',
key: 'packageOrderItemId',
align: 'center',
width: 400,
ellipsis: {
showTitle: true,
},
},
]
return (
<Spin tip="加载中..." spinning={packloading} >
{contextHolder}
<Table
columns={packColumns}
dataSource={packList}
pagination={{
defaultPageSize: 10, // 设置默认一页显示 5 条数据,
current: packPage,
total: packTotal,
onChange: (page: number) => {
setPackPage(page);
getPickList(page, '')
// console.log(page);
}
}}
rowKey="packageOrderId"
/>
<Modal title="套餐包使用详情"
centered
footer={null}
destroyOnClose
open={packDetailModal}
width={1200}
onCancel={() => {
setPackDetailModal(false)
}}>
<Table
columns={detailColums}
dataSource={detailList}
pagination={{
defaultPageSize: 10, // 设置默认一页显示 5 条数据,
current: detailPage,
total: detailTotal,
onChange: (page: number) => {
setDetailPage(page);
packageDetail(packageOrderId, page)
// console.log(page);
}
}}
rowKey="packageOrderItemId"
/>
</Modal>
</Spin>
)
}

39
src/components/balance/BalanceHead.tsx
View File

@ -5,8 +5,11 @@ import { Modal } from 'antd';
import moneyImg from '@theme/img/head/money.png'
import CapitalModal from '../CapitalModal/CapitalModal.tsx';
import RecordModal from '../RecordModal/RecordModal.tsx'
import PackageModal from '../PackageModal/PackageModal.tsx'
import capitalImg from '../../static/capita.png'
import recordImg from '../../static/record.png'
import packImg from '../../static/packimg.png'
export default function BalanceHead() {
const globalContext = useContext(GlobalContext);
// const [isLoading, setIsLoading] = useState(false)
@ -16,6 +19,8 @@ export default function BalanceHead() {
// 分账记录弹窗
const [recordModal, setRecordModal] = useState(false)
// 套餐包使用详情弹窗
const [packageModal, setPackageModal] = useState(false)
return (
<div className="head-item balance-head">
<div className="label">
@ -50,7 +55,7 @@ export default function BalanceHead() {
width: 68,
height: 1,
background: '#EAEAEA',
marginLeft: 18
// marginLeft: 0
}}></div>
<div className='moneyModal-title' onClick={() => {
setRecordModal(true)
@ -62,6 +67,22 @@ export default function BalanceHead() {
分账记录
</div>
</div>
<div style={{
width: 68,
height: 1,
background: '#EAEAEA',
// marginLeft: 18
}}></div>
<div className='moneyModal-title' onClick={() => {
setPackageModal(true)
}}>
<img src={packImg} style={{ marginTop: 1 }} width={20} height={20} alt="" />
<div style={{
marginLeft: 5,
}}>
套餐包使用
</div>
</div>
</div>
</div>
</div>
@ -82,6 +103,7 @@ export default function BalanceHead() {
}}>分账记录</div>
</Modal> */}
<Modal title="资金流水"
centered
footer={null}
destroyOnClose
open={capitalModal}
@ -95,6 +117,7 @@ export default function BalanceHead() {
</Modal>
<Modal title="分账记录"
centered
footer={null}
destroyOnClose
open={recordModal}
@ -107,6 +130,20 @@ export default function BalanceHead() {
<RecordModal></RecordModal>
</Modal>
<Modal title="套餐包使用明细"
centered
footer={null}
destroyOnClose
open={packageModal}
width={1200}
onCancel={() => {
setPackageModal(false)
}}>
<PackageModal></PackageModal>
</Modal>
</div >
)
}

11
src/components/balance/balance-head.css
View File

@ -28,8 +28,8 @@
display: none;
background-color: #ffffff;
position: absolute;
width: 120px;
height: 100px;
/* width: 120px; */
/* height: 100px; */
left: -50px;
top: 40px;
/* border: 1px solid red; */
@ -40,8 +40,8 @@
}
.moneyModal-box {
width: 120px;
height: 100px;
/* width: 120px; */
/* height: 100px; */
display: flex;
flex-direction: column;
justify-content: space-evenly;
@ -70,6 +70,9 @@
font-size: 16px;
color: #333333;
font-weight: 400;
padding:15px 20px ;
/* background-color: pink; */
width: 120px;
}
.transparentBox{
background-color: transparent;

243
src/layout/head/Head.tsx
View File

@ -19,7 +19,9 @@ import BalanceHead from '../../components/balance/BalanceHead.tsx';
import RechargeHead from '../../components/recharge/RechargeHead.tsx';
import {
// Empty,
Dropdown, MenuProps, message, Modal, Space, Spin, Input, Table, Form, Button
Dropdown, MenuProps, message, Modal, Space, Spin, Input,
// Table,
Form, Button
// Form, Button, InputNumber
} from "antd";
// import {
@ -30,16 +32,16 @@ import titleB from '../../static/Phone/titleB.png'
import line from '../../static/Phone/line.png'
import pack from '@theme/img/pack.png'
import PackAgeModal from '../../components/PackageModal/PackageModal.tsx'
// import pack from '@theme/pack.png'
// import type { TableProps, FormProps } from 'antd';
interface DataType {
usericId: string;
icPriceMaterial: number;
icPriceAll: number;
createTime: string;
// interface DataType {
// usericId: string;
// icPriceMaterial: number;
// icPriceAll: number;
// createTime: string;
}
// }
// interface icDataType {
// contactName: string;//联系人姓名
// contactPhone: string;//联系人电话
@ -150,9 +152,9 @@ import ContactPeople from '../../components/ContactPeople/ContactPeople.tsx'
import inv from '../../static/inv.png'
import MyOrder from '../../components/myOrder/MyOrder.tsx'
import NoticeModal from '../../components/NoticeModal/NoticeModal.tsx';
import type {
TableColumnsType,
} from 'antd';
// import type {
// TableColumnsType,
// } from 'antd';
// import { log } from 'console';
// import HeadCouponModal from '../../components/CouponModal/HeadCouponModal.tsx'
export default function Head() {
@ -328,38 +330,38 @@ export default function Head() {
const [packloading, setPackloading] = useState(false)
const [packList, setPackList] = useState<any[]>([]) //服务包列表
const [packPage, setPackPage] = useState(1) //服务包分页
const [packTotal, setPackTotal] = useState(0) //服务包总数
// const [packloading, setPackloading] = useState(false)
// const [packList, setPackList] = useState<any[]>([]) //服务包列表
// const [packPage, setPackPage] = useState(1) //服务包分页
// const [packTotal, setPackTotal] = useState(0) //服务包总数
// const [packageType, setPackageType] = useState('')
// 获取我得服务包信息
const getPickList = (page: number, packageType: string) => {
// const getPickList = (page: number, packageType: string) => {
get<any>({
messageApi,
url: `/api/proj/servicepkg/packageorder/listpage/self`,
config: {
params: {
page: page,
rows: 10,
packageType: packageType
}
},
onBefore() {
setPackloading(true)
},
onSuccess({ data }) {
// get<any>({
// messageApi,
// url: `/api/proj/servicepkg/packageorder/listpage/self`,
// config: {
// params: {
// page: page,
// rows: 10,
// packageType: packageType
// }
// },
// onBefore() {
// setPackloading(true)
// },
// onSuccess({ data }) {
setPackList(data.rows)
setPackTotal(data.total)
// setPackList(data.rows)
// setPackTotal(data.total)
},
onFinally() {
setPackloading(false)
}
})
}
// },
// onFinally() {
// setPackloading(false)
// }
// })
// }
// useEffect(() => {
// console.log('路径',currentUrl);
@ -888,81 +890,81 @@ export default function Head() {
applyContactPhone: '',
applyContactCompany: ''
})
const packColumns: TableColumnsType<DataType> = [
{
title: '序号',
dataIndex: 'index',
key: 'packageOrderId',
align: 'center',
render: (_text, _record, index) => (packPage - 1) * 10 + index + 1, // 显示序号，从1开始
// const packColumns: TableColumnsType<DataType> = [
// {
// title: '序号',
// dataIndex: 'index',
// key: 'packageOrderId',
// align: 'center',
// render: (_text, _record, index) => (packPage - 1) * 10 + index + 1, // 显示序号，从1开始
},
{
title: '套餐名称',
dataIndex: 'packageName',
key: 'packageOrderId',
// 居中显示
align: 'center',
},
// packageType
{
title: '套餐类型',
dataIndex: 'packageInfoAppDTO',
key: 'packageOrderId',
// 居中显示
align: 'center',
render: (text) => {
return <div>{text.packageType == "ALL" ? '全托管' : '写材料'} </div>
}
},
// {
// title: '套餐类型',
// dataIndex: 'packageInfoAppDTO',
// key: 'packageOrderId',
// // 居中显示
// align: 'center',
// render: (text) => {
// return <div>{text} </div>
// }
// },
{
title: '价格',
dataIndex: 'packageTotalMoney',
key: 'packageOrderId',
// 居中显示
align: 'center',
render: (text) => {
return <div>{text / 100}元</div>
}
},
{
title: '剩余次数',
dataIndex: 'packageTotalSurplusCount',
align: 'center',
key: 'packageOrderId',
render: (text: number) => {
return <div>{text} </div>
}
},
{
title: '总次数',
dataIndex: 'packageTotalCount',
align: 'center',
key: 'packageOrderId',
render: (text: any) => {
return <div>{text} </div>
}
},
{
title: '下单时间',
align: 'center',
dataIndex: 'gmtCreate',
key: 'packageOrderId',
// render: (text: string) => {
// return <div title={text} style={{ width: 200, whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}>{text}</div>
// }
},
];
// },
// {
// title: '套餐名称',
// dataIndex: 'packageName',
// key: 'packageOrderId',
// // 居中显示
// align: 'center',
// },
// // packageType
// {
// title: '套餐类型',
// dataIndex: 'packageInfoAppDTO',
// key: 'packageOrderId',
// // 居中显示
// align: 'center',
// render: (text) => {
// return <div>{text.packageType == "ALL" ? '全托管' : '写材料'} </div>
// }
// },
// // {
// // title: '套餐类型',
// // dataIndex: 'packageInfoAppDTO',
// // key: 'packageOrderId',
// // // 居中显示
// // align: 'center',
// // render: (text) => {
// // return <div>{text} </div>
// // }
// // },
// {
// title: '价格',
// dataIndex: 'packageTotalMoney',
// key: 'packageOrderId',
// // 居中显示
// align: 'center',
// render: (text) => {
// return <div>{text / 100}元</div>
// }
// },
// {
// title: '剩余次数',
// dataIndex: 'packageTotalSurplusCount',
// align: 'center',
// key: 'packageOrderId',
// render: (text: number) => {
// return <div>{text} </div>
// }
// },
// {
// title: '总次数',
// dataIndex: 'packageTotalCount',
// align: 'center',
// key: 'packageOrderId',
// render: (text: any) => {
// return <div>{text} </div>
// }
// },
// {
// title: '下单时间',
// align: 'center',
// dataIndex: 'gmtCreate',
// key: 'packageOrderId',
// // render: (text: string) => {
// // return <div title={text} style={{ width: 200, whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}>{text}</div>
// // }
// },
// ];
// 优惠券弹窗
// const [couponModal, setCouponModal] = useState(false)
// const [belongArray,setBelongArray] = useState([])
@ -1237,8 +1239,8 @@ export default function Head() {
onClick: () => {
// setCouponModal(true)
setPackageModal(true)
setPackPage(1);
getPickList(1, '')
// setPackPage(1);
// getPickList(1, '')
// setPackageType('')
}
},
@ -1363,8 +1365,8 @@ export default function Head() {
}}
onClick={() => {
setPackageModal(true)
setPackPage(1);
getPickList(1, '')
// setPackPage(1);
// getPickList(1, '')
}}
>
<img src={pack} width={19} height={19} alt="" />
@ -1642,13 +1644,14 @@ export default function Head() {
destroyOnClose
centered
open={packageModal}
width={1000}
width={1200}
footer={null}
onCancel={() => {
setPackageModal(false)
setPackPage(1);
// setPackPage(1);
}}>
<Spin tip="加载中..." spinning={packloading} >
<PackAgeModal></PackAgeModal>
{/* <Spin tip="加载中..." spinning={packloading} >
<Table
columns={packColumns}
dataSource={packList}
@ -1664,7 +1667,7 @@ export default function Head() {
}}
rowKey="packageOrderId"
/>
</Spin>
</Spin> */}
</Modal>
<Modal title="邀请码"
destroyOnClose

4
src/request/api.ts
View File

@ -31,6 +31,10 @@ export const getInvoiceInfoByinvoiceRechargeId = (invoiceRechargeId: string) =>
// 修改开票信息
export const updateInvoiceInfoByinvoiceRechargeId = (invoiceRechargeId: string, params: any) => request.put(`/operator-plugin/api/invoicerecharge/update/${invoiceRechargeId}`, params)
// 获取套餐包使用详情
export const getPackageDetail = (userId:string,packageOrderId:string,params:any) => request.get(`/operator-plugin/app/packageorderitem/listpagerelease/${userId}?packageOrderId=${packageOrderId}`, { params })
//---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

BIN
src/static/packimg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.2 KiB