Skip to content

M
minio-scs
提交 602953d2 作者: yueyang.lv
操作

合并分支 'developer/lyy' 到 'master' 

关闭 withCredentials

查看合并请求 minio/saturn-minio-console!4
上级 b76d038f e7867a9e
正在显示 包含 210 行增加 和 80 行删除
src/screens/Console/Saturn/components/Drawer/index.tsx
......@@ -16,7 +16,11 @@ export default function SaturnDrawer({
}: DrawProps) {
return (
<Drawer anchor={anchor} open={visible} onClose={containerProps.onCancel}>
<DrawerContainer width={width} {...containerProps}>
<DrawerContainer
width={width}
style={{ height: "100%" }}
{...containerProps}
>
{children}
</DrawerContainer>
</Drawer>
......
src/screens/Console/Saturn/components/DrawerContainer/index.module.css
.container {
display: flex;
flex-direction: column;
height: 100%;
margin: 0 auto;
max-height: 100%;
}
.header {
background-color: #fff;
......@@ -18,6 +18,7 @@
.content {
flex: 1;
overflow-y: auto;
background-color: #fff;
}
......
src/screens/Console/Saturn/components/Form/index.tsx 0 → 100644
import { Box } from "@mui/material";
export default function Form() {
return <Box></Box>;
}
src/screens/Console/Saturn/components/Modal/index.tsx
......@@ -16,8 +16,14 @@ export default function SaturnModal({
onClose={containerProps.onCancel}
closeAfterTransition
>
<Box>
<DrawerContainer {...containerProps}>{children}</DrawerContainer>
<Box style={{ width: "100%", height: "100%" }}>
<DrawerContainer
{...containerProps}
width={width}
style={{ marginTop: 50, ...containerProps.style }}
>
{children}
</DrawerContainer>
</Box>
</Modal>
);
......
src/screens/Console/Saturn/components/ValidateCodeInput/index.tsx
......@@ -59,7 +59,7 @@ function SendButton({ phone, sendType }: SendButtonProps) {
interface IProps extends SendButtonProps {
label?: string;
name?: string;
value: string;
value: string | number;
onChange: (
value: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>
) => void;
......
src/screens/Console/Saturn/constants/index.ts
......@@ -137,3 +137,25 @@ export const V_CODE_SEND = {
} as const;
/** 验证码发送类型枚举 */
export type V_CODE_SEND_TYPE = TypeOfValue<typeof V_CODE_SEND>["value"];
/** 发票类型 */
export const INVOICE = {
/** 增值税普通发票 */
VAT_NORMAL: {
value: 1,
cname: "增值税普通发票",
},
} as const;
/** 发票类型枚举 */
export type INVOICE_TYPE = TypeOfValue<typeof INVOICE>["value"];
/** 发票状态 */
export const INVOICE_STATUS = {
/** 处理中 */
PENDING: {
value: 1,
cname: "处理中",
},
} as const;
/** 发票类型枚举 */
export type INVOICE_STATUS_TYPE = TypeOfValue<typeof INVOICE_STATUS>["value"];
src/screens/Console/Saturn/pages/Contract/index.tsx
......@@ -16,6 +16,8 @@ import PageLayout from "../../../Common/Layout/PageLayout";
import PageHeader from "../../../Common/PageHeader/PageHeader";
import styles from "./index.module.css";
import { ApplyContractRequestBody } from "../../services/interface";
import { applyContract } from "../../services";
import message from "../../../../../utils/message";
const steps = [
{
......@@ -49,8 +51,8 @@ type FormValue = ApplyContractRequestBody;
class DrawerState {
visible: boolean = false;
form: FormValue = {
phone: "",
desc: "",
phone: 0,
};
}
......@@ -61,15 +63,19 @@ const Contact: React.FC = () => {
setDrawer((state) => ({ ...state, visible: false }));
};
const drawerShowHandler = () => {
setDrawer((state) => ({ ...state, visible: true }));
setDrawer({ ...new DrawerState(), visible: true });
};
const submitHandler = (e: React.FormEvent<HTMLFormElement>) => {
console.log(e);
console.log(drawer.form);
e.preventDefault();
applyContract(drawer.form).then((res) => {
message.success("提交成功");
drawerHideHandler();
});
};
const updateValueHandler = (key: keyof FormValue, value: string) => {
const updateValueHandler = (key: keyof FormValue, value: string | number) => {
setDrawer((state) => ({
...state,
form: {
......@@ -159,9 +165,9 @@ const Contact: React.FC = () => {
fullWidth
label="联系人手机"
name="phone"
value={drawer.form.phone}
value={drawer.form.phone || ""}
onChange={(e) => {
updateValueHandler("phone", e.target.value);
updateValueHandler("phone", Number(e.target.value));
}}
></TextField>
<TextField
......
src/screens/Console/Saturn/pages/Cost/Recharge.tsx
......@@ -190,6 +190,7 @@ const CostRecharge: React.FC = () => {
visible={offlinePayModal.visible}
onCancel={offlineModalHide}
title="支付中心"
width={700}
>
<Typography>
<p>支付方式： 暂支持转账汇款 </p>
......
src/screens/Console/Saturn/pages/Invoice/index.tsx
import React, { useState, useEffect } from "react";
import { Box, Button, TextField, Alert } from "@mui/material";
import React, { useState, useEffect, createRef } from "react";
import { Box, Button, TextField, Alert, MenuItem } from "@mui/material";
import { DataGrid, GridColDef } from "@mui/x-data-grid";
import PageLayout from "../../../Common/Layout/PageLayout";
import PageHeader from "../../../Common/PageHeader/PageHeader";
import Drawer from "../../components/Drawer";
import type { Pagination } from "../../types";
type TableItem = any;
import { applyInvoice, getInvoiceList } from "../../services";
import { ApplyInvoiceRequestBody, InvoiceItem } from "../../services/interface";
import { INVOICE, INVOICE_STATUS_TYPE } from "../../constants";
import message from "../../../../../utils/message";
type TableItem = InvoiceItem;
type FormValue = ApplyInvoiceRequestBody;
const columns: GridColDef<TableItem>[] = [
{
field: "id",
headerName: "ID",
width: 220,
disableColumnMenu: true,
},
{
field: "date",
field: "title",
headerName: "发票抬头",
width: 130,
disableColumnMenu: true,
sortable: false,
},
{
field: "transaction_type",
field: "type",
headerName: "发票类型",
sortable: false,
width: 130,
disableColumnMenu: true,
renderCell(params) {
return Object.values(INVOICE).find((i) => i.value === params.value).cname;
},
},
{
field: "transaction_source",
field: "address_name",
headerName: "收件人姓名",
sortable: false,
width: 130,
......@@ -37,28 +46,28 @@ const columns: GridColDef<TableItem>[] = [
},
{
field: "transaction_money",
field: "address",
headerName: "邮寄地址",
sortable: false,
width: 130,
disableColumnMenu: true,
},
{
field: "account_balance",
field: "phone",
headerName: "联系方式",
sortable: false,
// width: 130,
width: 130,
disableColumnMenu: true,
},
{
field: "account_balance1",
field: "desc",
headerName: "发票备注",
sortable: false,
// width: 130,
disableColumnMenu: true,
},
{
field: "account_balance2",
field: "status",
headerName: "状态",
sortable: false,
// width: 130,
......@@ -68,8 +77,14 @@ const columns: GridColDef<TableItem>[] = [
class InvoiceDrawer {
visible: boolean = false;
id?: string;
data?: TableItem;
form: FormValue = {
title: "",
type: INVOICE.VAT_NORMAL.value,
address_name: "",
address: "",
phone: "",
desc: "",
};
}
const Invoice: React.FC = () => {
......@@ -80,12 +95,13 @@ const Invoice: React.FC = () => {
total: 0,
});
const [list, setList] = useState<TableItem[]>([]);
const formRef = createRef<HTMLFormElement>();
const getList = () => {
// getCostList({ ...searchForm, ...pagination }).then((res) => {
// setList(res.data.list || []);
// setPagination((state) => ({ ...state, total: res.data.total }));
// });
getInvoiceList({ ...pagination }).then((res) => {
setList(res.data.list || []);
setPagination((state) => ({ ...state, total: res.data.total }));
});
};
useEffect(() => {
......@@ -96,11 +112,6 @@ const Invoice: React.FC = () => {
setPagination((state) => ({ ...state, page: page + 1 }));
};
const commonFormItemProps: any = {
margin: "normal",
fullWidth: true,
};
const drawerHideHandler = () => {
setDrawer(new InvoiceDrawer());
};
......@@ -108,6 +119,39 @@ const Invoice: React.FC = () => {
setDrawer((state) => ({ ...state, visible: true }));
};
const createFieldProps = (
name: keyof FormValue
): React.ComponentProps<typeof TextField> => {
return {
fullWidth: true,
margin: "normal",
name,
value: drawer.form[name],
onChange: (e) => {
setDrawer((state) => ({
...state,
form: {
...state.form,
[name]: e.target.value,
},
}));
},
};
};
const submitHandler = (e: React.FormEvent) => {
e.preventDefault();
applyInvoice(drawer.form).then((res) => {
message.success("提交成功");
drawerHideHandler();
if (pagination.current === 1) {
getList();
} else {
setPagination((state) => ({ ...state, current: 1 }));
}
});
};
return (
<>
<PageHeader label="发票管理"></PageHeader>
......@@ -134,45 +178,53 @@ const Invoice: React.FC = () => {
<Drawer
visible={drawer.visible}
onCancel={drawerHideHandler}
title={drawer.id ? "修改发票" : "申请开票"}
title="申请开票"
onConfirm={() => {
formRef.current.requestSubmit();
}}
>
<Box component="form">
<Box component="form" ref={formRef} onSubmit={submitHandler}>
<Alert color="warning" icon={false}>
土星云仅提供纸质发票，我们将在收到申请后 7
个工作日内为您开具并用快递邮寄给您。
</Alert>
<TextField
required
label="发票抬头"
{...commonFormItemProps}
{...createFieldProps("title")}
></TextField>
<TextField
required
label="发票类型"
{...commonFormItemProps}
{...createFieldProps("type")}
select
></TextField>
>
{Object.values(INVOICE).map((option) => (
<MenuItem key={option.value} value={option.value}>
{option.cname}
</MenuItem>
))}
</TextField>
<TextField
required
label="收件人姓名"
{...commonFormItemProps}
{...createFieldProps("address_name")}
></TextField>
<TextField
required
label="邮寄地址"
{...commonFormItemProps}
{...createFieldProps("address")}
></TextField>
<TextField
required
label="联系方式"
{...commonFormItemProps}
{...createFieldProps("phone")}
></TextField>
<TextField
required
label="发票备注"
{...commonFormItemProps}
{...createFieldProps("desc")}
multiline
minRows={3}
></TextField>
</Box>
</Drawer>
......
src/screens/Console/Saturn/pages/UserInfo/components/Company.tsx
......@@ -21,8 +21,8 @@ function Company({ userInfo }: IProps) {
legal_person: "",
certificates_url: "",
legal_id_card: "",
legal_phone: "",
code: "",
legal_phone: 0,
code: 0,
});
const submitHandler = useCallback(
(e: React.FormEvent<HTMLFormElement>) => {
......@@ -39,7 +39,9 @@ function Company({ userInfo }: IProps) {
[form]
);
const createFieldProps = (name: keyof FormValue) => {
const createFieldProps = (
name: keyof FormValue
): React.ComponentProps<typeof TextField> => {
return {
fullWidth: true,
name,
......@@ -53,30 +55,6 @@ function Company({ userInfo }: IProps) {
};
};
const CustomField = ({
name,
label,
required = true,
}: {
label;
name: keyof FormValue;
required?: boolean;
}) => (
<TextField
fullWidth
label={label}
required={required}
name={name}
value={form[name]}
onChange={(e) => {
setForm((state) => ({
...state,
[name]: e.target.value,
}));
}}
/>
);
return (
<Box
component="form"
......@@ -147,13 +125,13 @@ function Company({ userInfo }: IProps) {
<FormControl fullWidth required>
<ValidateCodeInput
label="验证码"
value={form.code}
value={form.code || ""}
phone={userInfo?.phone || ""}
sendType={V_CODE_SEND.COMPANY_AUTH.value}
onChange={(e) => {
setForm((state) => ({
...state,
code: e.target.value,
code: Number(e.target.value),
}));
}}
></ValidateCodeInput>
......
src/screens/Console/Saturn/services/index.ts
......@@ -13,9 +13,12 @@ import {
PersonalAuthRequestBody,
CompanyAuthRequestBody,
ApplyContractRequestBody,
ApplyInvoiceRequestBody,
InvoiceItem,
} from "./interface";
import { Pagination, Sort } from "../types";
import { SORT } from "../constants";
import { options2Pagination } from "../utils";
/** 登陆 */
export function userLogin(
......@@ -49,8 +52,7 @@ export function getCostList(
options?: Pagination & Sort
): ResultListPromise<CostItem> {
return request.post("/api/user/bill/list", {
page: options?.current || 1,
page_size: options?.pageSize || 10,
...options2Pagination(options),
sort: options?.sort || SORT.DESC.value,
});
}
......@@ -87,3 +89,19 @@ export function applyContract(
): ResultPromise<null> {
return request.post("/api/user/ApplyForContract", data);
}
/** 发票申请 */
export function applyInvoice(
data: ApplyInvoiceRequestBody
): ResultPromise<null> {
return request.post("/api/user/ApplyForInvoice", data);
}
/** 发票列表 */
export function getInvoiceList(
options?: Pagination
): ResultListPromise<InvoiceItem> {
return request.post("/api/user/InvoiceList", {
...options2Pagination(options),
});
}
src/screens/Console/Saturn/services/interface.ts
......@@ -4,6 +4,8 @@ import {
PERSONAL_CER_TYPE,
COMPANY_CER_TYPE,
V_CODE_SEND_TYPE,
INVOICE_TYPE,
INVOICE_STATUS_TYPE,
} from "../constants";
export interface ListResult<T extends Record<string, any>> {
total: number;
......@@ -110,9 +112,9 @@ export class CompanyAuthRequestBody {
/** 法定代表人身份证号 */
legal_id_card: string;
/** 法定代表人手机号码 */
legal_phone: string;
legal_phone: number;
/** 验证码 */
code: string;
code: number;
}
/** 发送验证码 */
......@@ -126,7 +128,30 @@ export class SendCodeRequestBody {
/** 合同申请 */
export class ApplyContractRequestBody {
/** 手机号 */
phone: string;
phone: number;
/** 备注 */
desc: string;
}
/** 申请发票 */
export type ApplyInvoiceRequestBody = Omit<InvoiceItem, "id" | "status">;
/** 发票 */
export interface InvoiceItem {
/** 发票 ID */
id: string;
/** 状态 */
status: INVOICE_STATUS_TYPE;
/** 发票抬头 */
title: string;
/** 发票类型 1.增值税普通发票 */
type: INVOICE_TYPE;
/** 收件人姓名 */
address_name: string;
/** 邮寄地址 */
address: string;
/** 联系方式 */
phone: string;
/** 发票备注 */
desc: string;
}
src/screens/Console/Saturn/services/request.ts
......@@ -51,7 +51,7 @@ class Request {
methods,
data,
}: RequestHandlerOptions): SuperAgentRequest {
let req = superagent(methods, this.formateUrl(url)).withCredentials();
let req = superagent(methods, this.formateUrl(url));
if (data) {
if (methods === METHOD.GET) {
......
src/screens/Console/Saturn/utils/index.ts
import { SORT, SORT_TYPE, SORT_CODE_TYPE } from "../constants";
import { Pagination } from "../types";
/** 将 sort 的值 变成 desc / asc */
export const sortValue2TypeCode = (sort: SORT_TYPE) => {
......@@ -18,3 +19,15 @@ export function toNewTab(url) {
link.click();
link.remove();
}
interface Options2PaginationOptions {
current?: Pagination["current"];
pageSize?: Pagination["pageSize"];
[key: string]: any;
}
export function options2Pagination(options?: Options2PaginationOptions) {
return {
page: options?.current ?? 1,
page_size: options?.pageSize ?? 10,
};
}
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论