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

增加发票管理

Browse Source
This commit is contained in:
WenC 2024-04-02 18:45:46 +08:00
parent 44eca6fbdf
commit 0ac3163e79
18 changed files with 592 additions and 101 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/App.tsx
View File

@ -6,11 +6,12 @@ import {
GlobalData,
GlobalDataAction,
GlobalDataActionType,
GlobalDispatchContext
GlobalDispatchContext,
} from "./context/GlobalContext.ts";
import {Reducer, useReducer} from "react";
const App: React.FC = () => {
const globalDataReducer = (state: GlobalData, action: GlobalDataAction) => {
if (action.type == GlobalDataActionType.REFRESH_SELF) {
if(action.user) {

36
src/components/card/CardProj.tsx
View File

@ -3,7 +3,7 @@ import {
CheckOutlined,
ClockCircleOutlined,
CloseCircleOutlined,
CreditCardOutlined,
CreditCardOutlined, DeleteOutlined,
DownloadOutlined, DownOutlined,
EditOutlined,
EyeOutlined,
@ -24,10 +24,10 @@ export default function CardProj(props: { item: IProj }) {
const nav = useNavigate();
const data = props.item;
const [messageApi, messageContext] = useMessage();
const [projCategoryId, setProjCategoryId] = useState(data.projCategoryId);
const [projCategoryName, setProjCategoryName] = useState(data.projCategoryName);
const indexListContext = useContext(IndexListContext);
/**
* 生成状态
*/
@ -110,7 +110,6 @@ export default function CardProj(props: { item: IProj }) {
return (
<>
{messageContext}
<div className="card-proj">
<div className="title">
<div className="left">
@ -181,26 +180,32 @@ export default function CardProj(props: { item: IProj }) {
url: `/api/proj/update-category/${data.projId}/${e.key}`,
onSuccess() {
messageApi.success('修改成功');
setProjCategoryId(e.key);
setProjCategoryName(span.innerText);
}
});
}
}}>
<span onClick={() => {
put<any>({
messageApi,
url: `/api/proj/cancel-category/${data.projId}`,
onSuccess() {
messageApi.success('取消成功');
setProjCategoryName('');
}
});
}}>
<a href="/#">{projCategoryName ? projCategoryName : '无目录'}</a>
<span>
<a href="/#">{projCategoryId ? projCategoryName : '无目录'}</a>
<DownOutlined/>
</span>
</Dropdown>
{
projCategoryId ? (
<DeleteOutlined title="移除目录" onClick={() => {
put<any>({
messageApi,
url: `/api/proj/cancel-category/${data.projId}`,
onSuccess() {
messageApi.success('取消成功');
setProjCategoryId('');
setProjCategoryName('');
}
});
}}/>
) : <></>
}
</div>
</div>
</div>
@ -217,6 +222,7 @@ export default function CardProj(props: { item: IProj }) {
</ConfigProvider>
</div>
</div>
{messageContext}
</>
)
}

194
src/components/invoice/InvoiceList.tsx Normal file
View File

@ -0,0 +1,194 @@
import {Button, Dropdown, MenuProps, Modal, Table, TableProps, Tag} from "antd";
import {PlusOutlined} from "@ant-design/icons";
import {useEffect, useState} from "react";
import {get} from "../../util/AjaxUtils.ts";
import {IListPage} from "../../interfaces/listpage/IListPage.ts";
import useMessage from "antd/es/message/useMessage";
import InvoiceSave from "./InvoiceSave.tsx";
enum InvoiceStatusEnum {
PENDING = 'PENDING',
COMPLETE = 'COMPLETE',
FAILED = 'FAILED',
CANCEL = 'CANCEL',
}
type DataType = {
examineOpinion: string;
examineUserId: string;
examineUserUsername: string;
gmtCreate: string;
gmtExamine: string;
invoiceAccount: string;
invoiceAddress: string;
invoiceAmount: number;
invoiceBank: string;
invoiceFileList: string[];
invoiceFiles: string;
invoiceId: string;
invoiceNo: string;
invoiceNote: string;
invoicePhone: string;
invoiceStatus: InvoiceStatusEnum;
invoiceTitle: string;
orderIds: string[];
}
export default function InvoiceList() {
const [messageApi, messageContext] = useMessage();
const [page, setPage] = useState(1);
const [total, setTotal] = useState(0);
const [dataArray, setDataArray] = useState<DataType[]>([]);
const columns: TableProps<DataType>['columns'] = [
{
title: '名称',
dataIndex: 'invoiceTitle',
align: 'center',
width: 180
},
{
title: '纳税人识别号',
dataIndex: 'invoiceNo',
align: 'center',
width: 180
},
{
title: '地址',
dataIndex: 'invoiceAddress',
align: 'center',
width: 180
},
{
title: '电话',
dataIndex: 'invoicePhone',
align: 'center',
width: 180
},
{
title: '开户行',
dataIndex: 'invoiceBank',
align: 'center',
width: 180
},
{
title: '开户行账号',
dataIndex: 'invoiceAccount',
align: 'center',
width: 180
},
{
title: '金额',
dataIndex: 'invoiceAmount',
align: 'center',
width: 160,
render: (value) => {
return (value / 100).toFixed(2)
}
},
{
title: '备注',
dataIndex: 'invoiceNote',
align: 'center',
width: 180
},
{
title: '创建时间',
dataIndex: 'gmtCreate',
align: 'center',
width: 180
},
{
title: '状态',
dataIndex: 'invoiceStatus',
align: 'center',
width: 100,
fixed: 'right',
render: (value) => {
if(value === InvoiceStatusEnum.PENDING) {
return <Tag color="magenta">待审核</Tag>
}
if(value === InvoiceStatusEnum.COMPLETE) {
return <Tag color="green">已开票</Tag>
}
if(value === InvoiceStatusEnum.FAILED) {
return <Tag color="red">失败</Tag>
}
if(value === InvoiceStatusEnum.CANCEL) {
return <Tag color="cyan">已取消</Tag>
}
}
},
{
title: '操作',
dataIndex: 'operate',
align: 'center',
width: 120,
fixed: 'right',
render: (value, record) => {
if(record.invoiceStatus == InvoiceStatusEnum.COMPLETE) {
const items: MenuProps['items'] = [];
record.invoiceFileList.forEach((item, index) => {
items.push({
key: index,
label: (
<a href={item} download target="_blank">下载发票{index + 1}</a>
)
});
})
return (
<Dropdown menu={{ items }} placement="bottom" arrow>
<Button type="link">下载发票</Button>
</Dropdown>
)
}
}
},
]
useEffect(() => {
get<IListPage<DataType>>({
messageApi,
url: '/api/invoice/listpage/self',
config: {
params: {
page: page,
rows: 20
}
},
onSuccess({data}) {
setPage(data.page);
setTotal(data.total);
setDataArray(data.rows);
}
})
}, [page]);
return (
<>
<div className="invoice-list-container">
<div className="mod-list">
<div className="table-btn-group" style={{marginBottom: '15px'}}>
<Button value="small" onClick={() => {
}}><PlusOutlined/> 新增</Button>
</div>
<Table columns={columns} dataSource={dataArray} pagination={
{
pageSize: 20,
onChange: (currentPage) => {
setPage(currentPage);
}
}
} scroll={{y: 500}} bordered key="dataTable" rowKey="invoiceId"/>
</div>
</div>
<Modal open={true}
title="申请开票"
>
<InvoiceSave />
</Modal>
{messageContext}
</>
)
}

207
src/components/invoice/InvoiceSave.tsx Normal file
View File

@ -0,0 +1,207 @@
import {Button, Divider, Form, Input, Radio, Space} from "antd";
import {useState} from "react";
type FormFieldType = {
invoiceTitle: string;
invoiceNo: number;
invoiceAddress: string;
invoicePhone: string;
invoiceAccount: string;
invoiceBank: string;
content: string;
rate: string;
type: string;
}
export default function InvoiceSave() {
const [form] = Form.useForm<FormFieldType>();
const [isSaveInvoiceInfo, setIsSaveInvoiceInfo] = useState(0);
return (
<>
<Form
name="basic"
initialValues={{remember: true}}
form={form}
>
<Divider orientation="left" plain>开票信息</Divider>
<table className="pay-table">
<colgroup>
<col width="120"/>
<col/>
</colgroup>
<tbody>
<tr>
<td className="table-label">公司名称 *</td>
<td>
<Form.Item
name="invoiceTitle"
style={{marginBottom: '0'}}
rules={[{required: true, message: '请输入公司名称'}]}
>
<Input placeholder="请输入公司名称"/>
</Form.Item>
</td>
</tr>
<tr>
<td className="table-label">纳税人识别号 *</td>
<td>
<Form.Item
name="invoiceNo"
style={{marginBottom: '0'}}
rules={[{required: true, message: '请输入纳税人识别号'}]}
>
<Input placeholder="请输入纳税人识别号"/>
</Form.Item>
</td>
</tr>
<tr>
<td className="table-label">公司地址 *</td>
<td>
<Form.Item
name="invoiceAddress"
style={{marginBottom: '0'}}
rules={[{required: true, message: '请输入公司地址'}]}
>
<Input placeholder="请输入公司地址"/>
</Form.Item>
</td>
</tr>
<tr>
<td className="table-label">联系电话 *</td>
<td>
<Form.Item
name="invoicePhone"
style={{marginBottom: '0'}}
rules={[{required: true, message: '请输入联系电话'}]}
>
<Input placeholder="请输入联系电话"/>
</Form.Item>
</td>
</tr>
<tr>
<td className="table-label">开户行 *</td>
<td>
<Form.Item
name="invoiceAccount"
style={{marginBottom: '0'}}
rules={[{required: true, message: '请输入开户行'}]}
>
<Input placeholder="请输入开户行"/>
</Form.Item>
</td>
</tr>
<tr>
<td className="table-label">开户行账号 *</td>
<td>
<Form.Item
name="invoiceBank"
style={{marginBottom: '0'}}
rules={[{required: true, message: '请输入开户行账号'}]}
>
<Input placeholder="请输入开户行账号"/>
</Form.Item>
</td>
</tr>
<tr>
<td className="table-label">开票内容 *</td>
<td>
<Form.Item
name="content"
style={{marginBottom: '0'}}
rules={[{required: true, message: '请选择开票内容'}]}
>
<Radio.Group>
<Space direction="vertical">
<Radio value={1}>A</Radio>
<Radio value={2}>B</Radio>
<Radio value={3}>C</Radio>
<Radio value={4}>D</Radio>
</Space>
</Radio.Group>
</Form.Item>
</td>
</tr>
<tr>
<td className="table-label">开票税率 *</td>
<td>
<Form.Item
name="rate"
style={{marginBottom: '0'}}
rules={[{required: true, message: '请选择开票税率'}]}
>
<Radio.Group>
<Radio value={1}>A</Radio>
<Radio value={2}>B</Radio>
<Radio value={3}>C</Radio>
<Radio value={4}>D</Radio>
</Radio.Group>
</Form.Item>
</td>
</tr>
<tr>
<td className="table-label">发票类型 *</td>
<td>
<Form.Item
name="type"
style={{marginBottom: '0'}}
rules={[{required: true, message: '请选择发票类型'}]}
>
<Radio.Group>
<Radio value={1}>A</Radio>
<Radio value={2}>B</Radio>
<Radio value={3}>C</Radio>
<Radio value={4}>D</Radio>
</Radio.Group>
</Form.Item>
</td>
</tr>
<tr>
<td className="table-label">保存开票信息 *</td>
<td>
<Radio.Group defaultValue={isSaveInvoiceInfo} onChange={(e) => {
setIsSaveInvoiceInfo(e.target.value)
}}>
<Radio value={0}>否</Radio>
<Radio value={1}>是</Radio>
</Radio.Group>
</td>
</tr>
</tbody>
</table>
<Divider orientation="left" plain>开票内容</Divider>
<table className="pay-table">
<colgroup>
<col width="120"/>
<col/>
</colgroup>
<tbody>
<tr>
<td className="table-label">开票金额 *</td>
<td>
<div>
<span>￥</span>
<span style={{fontSize: '20px', fontWeight: 'bold'}}>300</span>
<Button type="link" size="small">请选择需要开票的订单</Button>
</div>
</td>
</tr>
<tr>
<td className="table-label">开票备注</td>
<td>
<Form.Item
name="invoiceBank"
style={{marginBottom: '0'}}
rules={[{required: true, message: '请输入开票备注'}]}
>
<Input.TextArea placeholder="请输入开票备注" rows={4}/>
</Form.Item>
</td>
</tr>
</tbody>
</table>
</Form>
</>
);
}

12
src/components/list/ListProj.tsx
View File

@ -68,8 +68,8 @@ export default function ListProj() {
</div>
)
}
return projs.map((item, index) => {
return <CardProj item={item} key={`proj${index}`}/>;
return projs.map((item) => {
return <CardProj item={item} key={new Date().getTime() + ':' + item.projId}/>;
});
}
@ -77,9 +77,11 @@ export default function ListProj() {
}
useEffect(() => {
reqData(page);
renderCategory();
}, [indexListContext.status, indexListContext.categorys, indexListContext.category, keywords, page])
if (indexListContext.categorys) {
reqData(page);
renderCategory();
}
}, [indexListContext.status, indexListContext.categoryChangeCount, indexListContext.category, keywords, page])
const renderStatus = () => {
if (indexListContext.status == 'ALL') {

18
src/components/menu/MenuTree.tsx
View File

@ -25,10 +25,12 @@ export default function MenuTree(props: IMenuTree) {
if (item.isEdit) {
return (
<>
<CheckOutlined className="icon" onClick={() => {
<CheckOutlined className="icon" onClick={(e) => {
e.stopPropagation();
props.handleEditSaveClick(item);
}}/>
<CloseOutlined className="icon" onClick={() => {
<CloseOutlined className="icon" onClick={(e) => {
e.stopPropagation();
props.handleEditCancelClick(item);
}}/>
</>
@ -36,13 +38,16 @@ export default function MenuTree(props: IMenuTree) {
}
return (
<>
<EditOutlined className="icon" onClick={() => {
<EditOutlined className="icon" onClick={(e) => {
e.stopPropagation();
props.handleEditClick(item);
}}/>
<PlusOutlined className="icon" onClick={() => {
<PlusOutlined className="icon" onClick={(e) => {
e.stopPropagation();
props.handleAddClick(item);
}}/>
<CloseOutlined className="icon" onClick={() => {
<CloseOutlined className="icon" onClick={(e) => {
e.stopPropagation();
props.handleRemoveClick(item, index, parent);
}}/>
</>
@ -85,7 +90,8 @@ export default function MenuTree(props: IMenuTree) {
const lis = children.map((item, index) => {
const renderChildrenMenu = renderMenu(item.children, item);
return (
<li className={item.active ? 'active' : ''} key={item.id} onClick={() => {
<li className={item.active ? 'active' : ''} key={item.id} onClick={(e) => {
e.stopPropagation();
props.handleClick(item);
}}>
<div className="menu-title">

2
src/components/menu/MenuTreeWithTopButton.tsx
View File

@ -194,7 +194,7 @@ export default function MenuTreeWithTopButton() {
...menuTreeArray
])
indexListDispatchContext({
type: IndexListDataType.CATEGORY,
type: IndexListDataType.CATEGORY_DELETE,
value: menus2Dropdowns(menuTreeArray)
})
}

0
src/route/password/PasswordChange.tsx → src/components/password/PasswordChange.tsx
View File

67
src/route/payment/Payment.tsx → src/components/payment/Payment.tsx
View File

@ -10,16 +10,16 @@ import {
message,
Radio,
Spin,
Upload, UploadFile, UploadProps
Upload, UploadProps
} from "antd";
import {
ReloadOutlined
} from '@ant-design/icons'
import {useEffect, useState} from "react";
import {useEffect, useRef, useState} from "react";
import locale from 'antd/locale/zh_CN';
import dayjs from 'dayjs';
import 'dayjs/locale/zh-cn';
import {DevUserId, downloadUrl, get, post, uploadImageUrl} from "../../util/AjaxUtils.ts";
import {DevUserId, get, post, uploadImageUrl} from "../../util/AjaxUtils.ts";
import {UploadOutlined} from "@ant-design/icons";
import useMessage from "antd/es/message/useMessage";
import {errorImage} from "../../util/CommonUtil.ts";
@ -70,7 +70,7 @@ export default function Payment(props: IPaymentProps) {
const [isRechargeMoneyEdit, setIsRechargeMoneyEdit] = useState(false);
const [isLoading, setIsLoading] = useState(false);
const [rechargeVoucherArray, setRechargeVoucherArray] = useState<string[]>([]);
const [thirdParty, setThirdParty] = useState('');
const [thirdParty, setThirdParty] = useState<ThirdPartyEnum | null>();
const [accountRechargeId, setAccountRechargeId] = useState('');
const [thirdPartyPayUrl, setThirdPartyPayUrl] = useState('');
const [paySystemBank, setPaySystemBank] = useState<PaySystemBank>({
@ -83,14 +83,18 @@ export default function Payment(props: IPaymentProps) {
const [countdownTime, setCountdownTime] = useState('');
const [isCountdownTimeout, setIsCountdownTimeout] = useState(false);
const moneyRange: number[] = [0.01, 2000];
let countdownInterval: number = -1;
const countdownIntervalRef = useRef<number | undefined>();
const [refreshQrCodeCount, setRefreshQrCodeCount] = useState(0);
/**
* 倒计时
*/
const countdown = () => {
if (countdownInterval > -1) {
clearInterval(countdownInterval);
if (countdownIntervalRef.current) {
clearInterval(countdownIntervalRef.current);
}
if (thirdParty == ThirdPartyEnum.DGZZ) {
return;
}
const Time = new Date().getTime();
// 设定计时器的时间为60秒
@ -108,11 +112,11 @@ export default function Payment(props: IPaymentProps) {
if (distance <= 0) {
setCountdownTime('已失效');
setIsCountdownTimeout(true);
clearInterval(countdownInterval);
clearInterval(countdownIntervalRef.current);
}
}
// 每秒更新一次计时器
countdownInterval = setInterval(() => {
countdownIntervalRef.current = setInterval(() => {
updateCountdown();
}, 1000);
}
@ -131,10 +135,7 @@ export default function Payment(props: IPaymentProps) {
onSuccess({data}) {
setAccountRechargeId(data.accountRechargeId);
setThirdPartyPayUrl(data.thirdPartyPayUrl);
clearInterval(countdownInterval);
if (thirdParty != ThirdPartyEnum.DGZZ) {
countdown();
}
countdown();
},
onFinally() {
setIsLoading(false);
@ -153,14 +154,16 @@ export default function Payment(props: IPaymentProps) {
}
useEffect(() => {
form.setFieldsValue({
thirdParty: ThirdPartyEnum.DGZZ,
rechargeMoney: 300
})
setThirdParty(ThirdPartyEnum.DGZZ);
getPaySystemBank();
if (!thirdParty) {
getPaySystemBank();
form.setFieldsValue({
thirdParty: ThirdPartyEnum.DGZZ,
rechargeMoney: 300
})
setThirdParty(ThirdPartyEnum.DGZZ)
}
getPay();
}, []);
}, [thirdParty, isRechargeMoneyEdit, refreshQrCodeCount]);
const renderMoney = () => {
@ -178,7 +181,6 @@ export default function Payment(props: IPaymentProps) {
messageApi.error(`金额最大为${moneyRange[1]}`)
}
setIsRechargeMoneyEdit(false);
getPay();
}}>确定</Button>
</div>
)
@ -277,6 +279,18 @@ export default function Payment(props: IPaymentProps) {
</Form.Item>
</td>
</tr>
<tr>
<td className="table-label">银行账号 *</td>
<td>
<Form.Item
name="orgNumber"
style={{marginBottom: '0'}}
rules={[{required: true, message: '请输入银行账号'}]}
>
<Input placeholder="请输入银行账号"/>
</Form.Item>
</td>
</tr>
<tr>
<td className="table-label">打款时间 *</td>
<td>
@ -286,9 +300,10 @@ export default function Payment(props: IPaymentProps) {
rules={[{required: true, message: '请选择打款时间'}]}
>
<ConfigProvider locale={locale}>
<DatePicker showTime placeholder="请选择打款时间" onChange={(_date, dateString) => {
form.setFieldValue('rechargeFinalTime', dateString);
}}/>
<DatePicker showTime placeholder="请选择打款时间"
onChange={(_date, dateString) => {
form.setFieldValue('rechargeFinalTime', dateString);
}}/>
</ConfigProvider>
</Form.Item>
</td>
@ -351,7 +366,7 @@ export default function Payment(props: IPaymentProps) {
{
isCountdownTimeout ? (
<div className="qr-timeout" onClick={() => {
getPay()
setRefreshQrCodeCount(refreshQrCodeCount + 1);
}}>
<ReloadOutlined/>
<span className="label">点击刷新</span>
@ -372,7 +387,6 @@ export default function Payment(props: IPaymentProps) {
initialValues={{remember: true}}
form={form}
onFinish={() => {
post<any>({
messageApi,
url: `/api/pay/pay-account-recharge/${accountRechargeId}`,
@ -406,7 +420,6 @@ export default function Payment(props: IPaymentProps) {
<Radio.Group onChange={(e) => {
form.setFieldValue('thirdParty', e.target.value);
setThirdParty(e.target.value);
getPay();
}} defaultValue="a">
<Radio value="微信">微信</Radio>
<Radio value="支付宝">支付宝</Radio>

0
src/route/payment/payment.css → src/components/payment/payment.css
View File

34
src/components/recharge/RechargeHead.tsx
View File

@ -1,14 +1,36 @@
import './recharge-head.css';
import Payment from "../payment/Payment.tsx";
import {Modal} from "antd";
import {useState} from "react";
export default function RechargeHead() {
const handleRecharge = () => {
console.log('充值');
}
const [isPaymentModalOpen, setIsPaymentModalOpen] = useState(false);
return (
<div className="head-item recharge-head">
<span onClick={handleRecharge}>充值</span>
</div>
<>
<div className="head-item recharge-head">
<span onClick={() => {
setIsPaymentModalOpen(true);
}}>充值</span>
</div>
<Modal open={isPaymentModalOpen}
title="充值"
onCancel={() => {
setIsPaymentModalOpen(false);
}}
footer={false}
>
<Payment
handleConfirm={() => {
setIsPaymentModalOpen(false);
}}
handleCancel={() => {
setIsPaymentModalOpen(false);
}}
/>
</Modal>
</>
)
}

0
src/route/user/UserEdit.tsx → src/components/user/UserEdit.tsx
View File

27
src/context/GlobalContext.ts
View File

@ -1,4 +1,6 @@
import {createContext, Dispatch} from "react";
import {get} from "../util/AjaxUtils.ts";
import {MessageInstance} from "antd/es/message/interface";
export enum GlobalDataActionType {
REFRESH_SELF
@ -11,6 +13,28 @@ export interface User {
hasUserInfo: boolean;
}
export function reloadUser(messageApi: MessageInstance, globalDispatchContext: Dispatch<GlobalDataAction>) {
return new Promise<any>(resolve => {
get<any>({
messageApi,
url: '/api/user-info/get-user-self',
onSuccess({data}) {
globalDispatchContext({
type: GlobalDataActionType.REFRESH_SELF,
user: {
balance: (Math.floor(data.accountMoney) / 100).toFixed(2),
nickname: data.nickname,
username: data.username,
hasUserInfo: data.hasUserInfo,
}
})
resolve(data);
}
})
})
}
export interface GlobalData {
user: User;
}
@ -28,4 +52,5 @@ export const GlobalContext = createContext<GlobalData>({
hasUserInfo: false
}
});
export const GlobalDispatchContext = createContext<Dispatch<GlobalDataAction>>(() => {});
export const GlobalDispatchContext = createContext<Dispatch<GlobalDataAction>>(() => {
});

7
src/context/IndexListContext.ts
View File

@ -5,7 +5,8 @@ export enum IndexListDataType {
PROJ,
AGENT,
CATEGORY,
CATEGORY_CHANGE
CATEGORY_CHANGE,
CATEGORY_DELETE
}
export interface ListData {
@ -13,6 +14,7 @@ export interface ListData {
status?: string;
category?: string;
categorys?: MenuProps['items'];
categoryChangeCount: number;
}
export interface ListAction {
@ -22,7 +24,8 @@ export interface ListAction {
export const IndexListContext = createContext<ListData>({
type: IndexListDataType.PROJ
type: IndexListDataType.PROJ,
categoryChangeCount: 0
})
export const IndexListDispatchContext = createContext<Dispatch<ListAction>>(() => {

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

@ -2,14 +2,14 @@ import './head.css'
import BalanceHead from '../../components/balance/BalanceHead.tsx';
import RechargeHead from '../../components/recharge/RechargeHead.tsx';
import {Divider, Dropdown, MenuProps, message, Modal, Space, Spin} from "antd";
import {DownOutlined, UserOutlined, KeyOutlined, LogoutOutlined} from "@ant-design/icons";
import {DownOutlined, UserOutlined, KeyOutlined, LogoutOutlined, AccountBookOutlined} from "@ant-design/icons";
import {useContext, useEffect, useState} from "react";
import {get, put} from "../../util/AjaxUtils.ts";
import {GlobalContext, GlobalDataActionType, GlobalDispatchContext} from "../../context/GlobalContext.ts";
import UserEdit from "../../route/user/UserEdit.tsx";
import PasswordChange from "../../route/password/PasswordChange.tsx";
import {put} from "../../util/AjaxUtils.ts";
import {GlobalContext, GlobalDispatchContext, reloadUser} from "../../context/GlobalContext.ts";
import UserEdit from "../../components/user/UserEdit.tsx";
import PasswordChange from "../../components/password/PasswordChange.tsx";
import headRightBg from '../../assets/head-right-bg.png';
import Payment from "../../route/payment/Payment.tsx";
import InvoiceList from "../../components/invoice/InvoiceList.tsx";
export default function Head() {
@ -22,24 +22,11 @@ export default function Head() {
const [isPasswordModalOpen, setIsPasswordModalOpen] = useState(false);
useEffect(() => {
get<any>({
messageApi,
url: '/api/user-info/get-user-self',
onSuccess({data}) {
globalDispatchContext({
type: GlobalDataActionType.REFRESH_SELF,
user: {
balance: (Math.floor(data.accountMoney) / 100).toFixed(2),
nickname: data.nickname,
username: data.username,
hasUserInfo: data.hasUserInfo,
}
})
if(!data.hasUserInfo) {
setIsSelfModalOpen(true);
}
reloadUser(messageApi, globalDispatchContext).then((data) => {
if (!data.hasUserInfo) {
setIsSelfModalOpen(true);
}
})
});
}, [globalContext.user]);
const items: MenuProps['items'] = [
@ -47,7 +34,7 @@ export default function Head() {
key: 'userinfo',
label: (
<div className="dropdown-item">
<UserOutlined />
<UserOutlined/>
<span className="title">个人信息</span>
</div>
),
@ -59,7 +46,7 @@ export default function Head() {
key: 'changePass',
label: (
<div className="dropdown-item">
<KeyOutlined />
<KeyOutlined/>
<span className="title">修改密码</span>
</div>
),
@ -67,11 +54,23 @@ export default function Head() {
setIsPasswordModalOpen(true);
}
},
{
key: 'invoice',
label: (
<div className="dropdown-item">
<AccountBookOutlined />
<span className="title">发票管理</span>
</div>
),
onClick: () => {
// nav('/invoice-list');
}
},
{
key: 'logout',
label: (
<div className="dropdown-item">
<LogoutOutlined />
<LogoutOutlined/>
<span className="title">退出系统</span>
</div>
),
@ -108,12 +107,12 @@ export default function Head() {
title="个人信息"
footer={false}
onCancel={() => {
if(!globalContext.user.hasUserInfo) {
if (!globalContext.user.hasUserInfo) {
messageApi.info('请完善个人信息');
return;
}
setIsSelfModalOpen(false)
}} >
}}>
<UserEdit handleConfirm={(data) => {
modal.confirm({
title: '提示',
@ -150,7 +149,7 @@ export default function Head() {
footer={false}
onCancel={() => {
setIsPasswordModalOpen(false)
}} >
}}>
<PasswordChange handleConfirm={(data) => {
modal.confirm({
title: '提示',
@ -183,10 +182,11 @@ export default function Head() {
}}/>
</Modal>
<Modal open={true}
title="充值"
title="发票管理"
width={1100}
footer={false}
>
<Payment/>
<InvoiceList/>
</Modal>
<Spin tip="正在提交..." spinning={loading} fullscreen/>
{contextHolder}

14
src/route/index/Index.tsx
View File

@ -6,7 +6,7 @@ import MenuWithTopButton from "../../components/menu/MenuWithTopButton.tsx";
import MenuTreeWithTopButton from "../../components/menu/MenuTreeWithTopButton.tsx";
import ListProj from "../../components/list/ListProj.tsx";
import ListProjAgent from "../../components/list/ListProjAgent.tsx";
import {Breadcrumb, MenuProps} from 'antd';
import {Breadcrumb, Button, MenuProps} from 'antd';
import {
IndexListContext,
IndexListDataType,
@ -28,8 +28,14 @@ export default function Index() {
state.status = action.value as string;
} else if (action.type == IndexListDataType.CATEGORY) {
state.categorys = action.value as MenuProps['items'];
state.categoryChangeCount++;
} else if (action.type == IndexListDataType.CATEGORY_CHANGE) {
state.category = action.value as string
state.category = action.value as string;
state.categoryChangeCount++;
} else if (action.type == IndexListDataType.CATEGORY_DELETE) {
state.categorys = action.value as MenuProps['items'];
state.category = '';
state.categoryChangeCount++;
}
return {
...state
@ -37,7 +43,8 @@ export default function Index() {
}
const [listData, dispatch] = useReducer<Reducer<ListData, ListAction>>(listReducer, {
type: IndexListDataType.PROJ
type: IndexListDataType.PROJ,
categoryChangeCount: 0
});
const [projMenu, setProjMenu] = useState<IMenuWithTopButton>({
@ -126,6 +133,7 @@ export default function Index() {
list={agentMenu.list}
handleListItem={agentMenu.handleListItem}
/>
<Button>发票管理</Button>
</div>
<div className="right">
{

7
src/route/proj/ProjNew.tsx
View File

@ -1,9 +1,10 @@
import './proj-new.css';
import {Link, useNavigate, useParams, useSearchParams} from "react-router-dom";
import {Breadcrumb, Button, Flex, Form, Input, message, Modal, Spin} from "antd";
import {useEffect, useState} from "react";
import {useContext, useEffect, useState} from "react";
import {get, post} from "../../util/AjaxUtils.ts";
import {IProjCharge, ProjAdditionalType, ProjChargeType} from "../../interfaces/proj/IProj.ts";
import {GlobalDispatchContext, reloadUser} from "../../context/GlobalContext.ts";
const {TextArea} = Input;
@ -13,6 +14,7 @@ type ProjInfo = {
};
export default function ProjNew() {
const globalDispatchContext = useContext(GlobalDispatchContext);
const nav = useNavigate();
const pathParams = useParams();
const [queryParams] = useSearchParams();
@ -156,6 +158,9 @@ export default function ProjNew() {
onSuccess({data}) {
setIsEditModalOpen(true);
setCreateProjId(data.data);
reloadUser(messageApi, globalDispatchContext).then(() => {
messageApi.success('扣款成功');
});
},
onFinally() {
setLoading(false);

3
src/route/router.tsx
View File

@ -145,6 +145,5 @@ export const router = createHashRouter([
{
path: '/agent-result/:orderId',
element: <AgentResult />
}
// ], {basename: import.meta.env.BASE_URL})
},
])