Skip to content

W
web
提交 36e0e3c6 作者: 曹云
操作

合并代码

上级 881406e1 e898a067
正在显示 包含 1899 行增加 和 91 行删除
api/request.ts
...@@ -105,7 +105,7 @@ export default function request(url: string, method: String = 'get', data?: any, ...@@ -105,7 +105,7 @@ export default function request(url: string, method: String = 'get', data?: any,
if (data.code !== '200') { if (data.code !== '200') {
//未登录判断 //未登录判断
if(data.code === '5008'){ if(data.code === '5008' || data.code === '2014'){
loginErrorMsg(); loginErrorMsg();
window.logout(); window.logout();
}else{ }else{
......
components/NavHeader/index.tsx
...@@ -39,17 +39,21 @@ const items: TabsProps["items"] = [ ...@@ -39,17 +39,21 @@ const items: TabsProps["items"] = [
}, },
]; ];
export default function NavHeader() { type Props = {
style?: React.CSSProperties;
};
export default function NavHeader(props: Props) {
const router = useRouter(); const router = useRouter();
const [currentPath, setCurrentPath] = useState(""); const [currentPath, setCurrentPath] = useState("");
const { userInfo, testLogin, logout, setNeedLogin, needLogin } = const { userInfo, testLogin, logout, setNeedLogin, needLogin } =
useContext(UserContext); useContext(UserContext);
useEffect(() => { useEffect(() => {
const routerTo = items?.filter(item=>router.route.includes(item.key))[0] const routerTo = items?.filter((item) => router.route == item.key)[0];
if (routerTo) { if (routerTo) {
setCurrentPath(routerTo?.key!); setCurrentPath(routerTo?.key!);
}else{ } else {
setCurrentPath(router.route); setCurrentPath(router.route);
} }
console.log("currentHash", currentPath); console.log("currentHash", currentPath);
...@@ -75,7 +79,7 @@ export default function NavHeader() { ...@@ -75,7 +79,7 @@ export default function NavHeader() {
if (!userInfo) { if (!userInfo) {
setOpenLoginModal(true); setOpenLoginModal(true);
} else { } else {
setOpenPublishModal(true); setOpenPublishModal(true);
} }
} }
...@@ -97,7 +101,7 @@ export default function NavHeader() { ...@@ -97,7 +101,7 @@ export default function NavHeader() {
}, [needLogin]); }, [needLogin]);
return ( return (
<div className={styles.navHeader}> <div className={styles.navHeader} style={props.style}>
<div className={styles.nav}> <div className={styles.nav}>
<div className={styles.logo}></div> <div className={styles.logo}></div>
<Tabs <Tabs
...@@ -121,9 +125,25 @@ export default function NavHeader() { ...@@ -121,9 +125,25 @@ export default function NavHeader() {
menu={{ menu={{
items: [ items: [
{ {
key: "3",
label: (
<div
onClick={() =>
router.push("/personalCenter/leasingOrders")
}
>
租赁订单
</div>
),
},
{
key: "2", key: "2",
label: ( label: (
<div onClick={() => router.push("/personalCenter/mallOrders")}> <div
onClick={() =>
router.push("/personalCenter/mallOrders")
}
>
我的订单 我的订单
</div> </div>
), ),
......
components/layout/index.tsx
...@@ -43,6 +43,7 @@ type Props = { ...@@ -43,6 +43,7 @@ type Props = {
layoutStyle?: React.CSSProperties; layoutStyle?: React.CSSProperties;
contentStyle?: React.CSSProperties; contentStyle?: React.CSSProperties;
hideFooter?: boolean; hideFooter?: boolean;
headerStyle?: React.CSSProperties
}; };
export default function LayoutView(props: Props) { export default function LayoutView(props: Props) {
...@@ -56,7 +57,7 @@ export default function LayoutView(props: Props) { ...@@ -56,7 +57,7 @@ export default function LayoutView(props: Props) {
)} )}
> >
<Header style={headerStyle}> <Header style={headerStyle}>
<NavHeader /> <NavHeader style={props.headerStyle} />
</Header> </Header>
<Content className={styles.content} style={props.contentStyle}> <Content className={styles.content} style={props.contentStyle}>
{props.children} {props.children}
......
pages/certification/index.page.tsx
...@@ -12,9 +12,9 @@ import { ...@@ -12,9 +12,9 @@ import {
} from "antd"; } from "antd";
import type { UploadChangeParam } from "antd/es/upload"; import type { UploadChangeParam } from "antd/es/upload";
import type { RcFile, UploadFile, UploadProps } from "antd/es/upload/interface"; import type { RcFile, UploadFile, UploadProps } from "antd/es/upload/interface";
import { useContext, useState } from "react"; import { useContext, useEffect, useState } from "react";
import Layout from "~/components/layout"; import Layout from "~/components/layout";
import api, { } from "./api"; import api from "./api";
import styles from "./index.module.scss"; import styles from "./index.module.scss";
import gApi from "~/api"; import gApi from "~/api";
import Router from "next/router"; import Router from "next/router";
...@@ -55,6 +55,11 @@ export default function Certification() { ...@@ -55,6 +55,11 @@ export default function Certification() {
Array<EnterpriseOption> Array<EnterpriseOption>
>([]); >([]);
const [form] = Form.useForm(); const [form] = Form.useForm();
const [token, setToken] = useState("");
useEffect(() => {
setToken(window.localStorage.getItem("token") || "");
}, []);
//上传change事件 //上传change事件
const handleChange: UploadProps["onChange"] = ( const handleChange: UploadProps["onChange"] = (
...@@ -91,11 +96,11 @@ export default function Certification() { ...@@ -91,11 +96,11 @@ export default function Certification() {
}); });
} }
setTimeout(() => { setTimeout(() => {
if (Router.query.type == 'back'){ if (Router.query.type == "back") {
Router.back(); Router.back();
}else{ } else {
Router.push("/"); Router.push("/");
} }
}, 1000); }, 1000);
} }
}); });
...@@ -213,6 +218,7 @@ export default function Certification() { ...@@ -213,6 +218,7 @@ export default function Certification() {
beforeUpload={beforeUpload} beforeUpload={beforeUpload}
onChange={handleChange} onChange={handleChange}
maxCount={1} maxCount={1}
headers={{ token: token }}
> >
{imageUrl ? ( {imageUrl ? (
<Image <Image
......
pages/forum/components/publishMessage/index.tsx
...@@ -2,12 +2,13 @@ import { PlusOutlined } from "@ant-design/icons"; ...@@ -2,12 +2,13 @@ import { PlusOutlined } from "@ant-design/icons";
import { Form, Input, Modal, Upload, Image, Button, Row, Col } from "antd"; import { Form, Input, Modal, Upload, Image, Button, Row, Col } from "antd";
import type { RcFile, UploadProps } from "antd/es/upload"; import type { RcFile, UploadProps } from "antd/es/upload";
import type { UploadFile } from "antd/es/upload/interface"; import type { UploadFile } from "antd/es/upload/interface";
import { useContext, useState } from "react"; import { useContext, useEffect, useState } from "react";
import gApi from "~/api"; import gApi from "~/api";
import NImage from "next/image"; import NImage from "next/image";
import api from "./api"; import api from "./api";
import { useGeolocation } from "~/lib/hooks"; import { useGeolocation } from "~/lib/hooks";
import { UserContext } from "~/lib/userProvider"; import { UserContext } from "~/lib/userProvider";
import { useToken } from "antd/es/theme/internal";
type Props = { type Props = {
open: boolean; open: boolean;
...@@ -33,6 +34,11 @@ export default function PublishMessage(props: Props) { ...@@ -33,6 +34,11 @@ export default function PublishMessage(props: Props) {
const [form] = Form.useForm(); const [form] = Form.useForm();
const { userInfo, setNeedLogin } = useContext(UserContext); const { userInfo, setNeedLogin } = useContext(UserContext);
const position = useGeolocation(); const position = useGeolocation();
const [token, setToken] = useState('');
useEffect(() => {
setToken(window.localStorage.getItem('token') || '');
}, [])
//预览关闭 //预览关闭
const handlePreviewCancel = () => setPreviewOpen(false); const handlePreviewCancel = () => setPreviewOpen(false);
...@@ -155,6 +161,7 @@ export default function PublishMessage(props: Props) { ...@@ -155,6 +161,7 @@ export default function PublishMessage(props: Props) {
onPreview={handlePreview} onPreview={handlePreview}
onChange={handleChange} onChange={handleChange}
maxCount={1} maxCount={1}
headers={{ token: token }}
> >
{fileList.length >= 8 ? null : ( {fileList.length >= 8 ? null : (
<div> <div>
......
pages/mall/detail/[id].page.tsx
...@@ -13,7 +13,7 @@ import { Navigation } from "swiper"; ...@@ -13,7 +13,7 @@ import { Navigation } from "swiper";
// Import Swiper styles // Import Swiper styles
import "swiper/css"; import "swiper/css";
import "swiper/css/navigation"; import "swiper/css/navigation";
import api, { GetAppGoodsInfoDetailResult } from "./api"; import api, { GetLeaseGoodsDetailResp } from "./api";
import IntentionModal from "./components/intentionModal"; import IntentionModal from "./components/intentionModal";
import { UserContext } from "~/lib/userProvider"; import { UserContext } from "~/lib/userProvider";
...@@ -22,7 +22,7 @@ export default function MallDetail() { ...@@ -22,7 +22,7 @@ export default function MallDetail() {
const [visible, setVisible] = useState(false); //商品图预览 const [visible, setVisible] = useState(false); //商品图预览
const router = useRouter(); const router = useRouter();
const [id, setId] = useState<number | null>(null); const [id, setId] = useState<number | null>(null);
const [detail, setDetail] = useState<GetAppGoodsInfoDetailResult | null>( const [detail, setDetail] = useState<GetLeaseGoodsDetailResp | null>(
null null
); //详情数据 ); //详情数据
const [intentionModalOpen, setIntentionModalOpen] = useState(false); //意向弹窗 const [intentionModalOpen, setIntentionModalOpen] = useState(false); //意向弹窗
...@@ -53,8 +53,9 @@ export default function MallDetail() { ...@@ -53,8 +53,9 @@ export default function MallDetail() {
useEffect(() => { useEffect(() => {
if (id) { if (id) {
api api
.getAppGoodsInfoDetail({ .getLeaseGoodsDetail({
id: id, goodsId: id,
type: 0
}) })
.then((res) => { .then((res) => {
setDetail(res.result || null); setDetail(res.result || null);
...@@ -132,7 +133,7 @@ export default function MallDetail() { ...@@ -132,7 +133,7 @@ export default function MallDetail() {
className={`${styles.font2} ${styles.ellipsis}`} className={`${styles.font2} ${styles.ellipsis}`}
style={{ height: 22 }} style={{ height: 22 }}
> >
{detail?.goodsDesc} {detail?.goodsDetail?.goodsDesc}
</div> </div>
<Space <Space
size={24} size={24}
......
pages/mall/detail/api/index.ts
import request, { Response } from "~/api/request" import request, { Response } from "~/api/request"
export interface GetAppGoodsInfoDetailParams { export interface GetLeaseGoodsDetailParams {
id: number goodsId: number,
type: 1 | 0, //租赁：1 销售商品：0
} }
export interface GetAppGoodsInfoDetailResult { export interface GetLeaseGoodsDetailResp {
id: number; id: number;
pid?: number; images: Image[];
goodsName?: string; goodsVideo?: any;
shareFlyServiceId?: number; goodsVideoId?: any;
repoId?: number; goodsName: string;
goodsSpec?: GoodsSpec[]; goodsNo: string;
images?: Image[]; goodsDetail: GoodsDetail;
goodsVideo?: string; directoryId: number;
goodsVideoId?: number; categoryByOne: number;
goodsDetail?: GoodsDetail; categoryByTwo?: any;
sortTypeId?: number; tag?: any;
masterTypeId?: number; shelfStatus: number;
slaveTypeId?: number; goodsSpec: GoodsSpec[];
tag?: string; otherService: OtherService[];
shelfStatus?: number; price?: any;
otherService?: OtherService[];
question?: Question[];
goodsDesc?: string
} }
export interface GoodsDetail { export interface OtherService {
id: number;
goodsDesc: string;
content: string;
remark?: any;
}
export interface Image {
id: number; id: number;
imgUrl: string; saleServiceId: number;
imgType: number; serviceName: string;
} }
export interface GoodsSpec { export interface GoodsSpec {
id: number; id: number;
goodsSpecName: string; goodsSpecName: string;
goodsTypeId: number; categoryId: number;
typeName: string; typeName: string;
skuId: number; skuId: number;
brandInfoId: number; brandInfoId?: any;
skuName: string; skuName: string;
productSpecList: ProductSpec[]; productSpecList: ProductSpecList[];
industrySpecList?: any; industrySpecList?: any;
chooseType: number; chooseType: number;
skuUnitId: number; skuUnitId: number;
unitName: string; unitName: string;
must: number; must: number;
flag?: any; flag: number;
} }
export interface ProductSpec { export interface ProductSpecList {
id: number; id: number;
productSpec: number; productSpec: number;
productSkuId: number; productSkuId: number;
...@@ -64,26 +55,46 @@ export interface ProductSpec { ...@@ -64,26 +55,46 @@ export interface ProductSpec {
partNo: string; partNo: string;
versionDesc: string; versionDesc: string;
createTime?: any; createTime?: any;
productSpecCPQVO?: any; productSpecCPQVO: ProductSpecCPQVO;
} }
export interface Question { export interface ProductSpecCPQVO {
answer: string, productSpecId: number;
id: number, type: number;
question: string leaseTerm?: any;
specPrice: any[];
} }
//其他服务: 1:免费配送，2：专业飞手培训2日， 3：半年保修， 4：一年保修 export interface GoodsDetail {
export interface OtherService { id: number;
id: number, goodsDesc: string;
saleServiceId: number, content: string;
serviceName: string remark?: any;
}
export interface Image {
id: number;
imgUrl: string;
imgType: number;
}
interface CommitMallOrderParams {
buyNum: number;
directoryId: number;
goodsInfoId: number;
mallSpecIds: any[];
remark: string;
userAddressId: number;
} }
export default { export default {
//web-获取商品详细信息--共多少种选择 //web-获取商品详细信息--共多少种选择
getAppGoodsInfoDetail(params: GetAppGoodsInfoDetailParams): Promise<Response<GetAppGoodsInfoDetailResult>> { getLeaseGoodsDetail(params: GetLeaseGoodsDetailParams): Promise<Response<GetLeaseGoodsDetailResp>> {
return request('/pms/webProductMall/getAppGoodsInfoDetail', 'get', params) return request('/pms/product/mall/getLeaseGoodsDetail', 'get', params)
},
//提交订单V1.0.0
commitMallOrder(params: CommitMallOrderParams){
return request('/oms/app-order/commitMallOrder', 'post', params);
} }
} }
\ No newline at end of file
pages/mall/detail/components/intentionModal/api/index.ts 0 → 100644
import request from "~/api/request"
interface CommitMallOrderParams {
buyNum: number;
directoryId: number;
goodsInfoId: number;
mallSpecIds: any[];
remark?: string;
userAddressId: number;
}
export default {
//提交订单V1.0.0
commitMallOrder(params: CommitMallOrderParams) {
return request("/oms/app-order/commitMallOrder", 'post', params);
}
}
\ No newline at end of file
pages/mall/detail/components/intentionModal/index.tsx
import { Button, Col, Image, Modal, Row, Space } from "antd"; import { Button, Col, Image, message, Modal, Row, Space } from "antd";
import { useState } from "react"; import { useEffect, useState } from "react";
import errImg from "~/assets/errImg"; import errImg from "~/assets/errImg";
import { GetAppGoodsInfoDetailResult } from "../../api"; import { GetLeaseGoodsDetailResp, ProductSpecList } from "../../api";
import styles from "./index.module.scss"; import styles from "./index.module.scss";
import api from "./api";
import Item from "antd/es/list/Item";
type Props = { type Props = {
open?: boolean; open?: boolean;
onOk?: (e: React.MouseEvent<HTMLButtonElement>) => void; onOk?: () => void;
onCancel: (e: React.MouseEvent<HTMLButtonElement>) => void; onCancel: () => void;
detail: GetAppGoodsInfoDetailResult | null; detail: GetLeaseGoodsDetailResp | null;
}; };
export default function IntentionModal(props: Props) { export default function IntentionModal(props: Props) {
const [checkedMap, setCheckedMap] = useState<{ string?: boolean }>({}); //通过索引记录选中的产品规格 例: {'1,1': true|false} const [checkedMap, setCheckedMap] = useState<{ string?: boolean }>({}); //通过索引记录选中的产品规格 例: {'1,1': true|false} props.detail?.goodsSpec[1].productSpecList[1]
const [checkItems, setCheckItems] = useState<ProductSpecList[]>([]); //选中的规格
const [loading, setLoading] = useState(false); //下单中
useEffect(() => {
let list: ProductSpecList[] = [];
Object.keys(checkedMap).forEach((key) => {
if (checkedMap[key as keyof typeof checkedMap]) {
let arr = key.split(",");
let item =
props.detail?.goodsSpec[Number(arr[0])].productSpecList[
Number(arr[1])
];
if (item) {
list.push(item);
}
}
});
setCheckItems(list);
}, [checkedMap]);
//添加规格到购物车 //添加规格到购物车
function addProductSpec(goodsSpecIndex: number, productSpecIndex: number) { function addProductSpec(goodsSpecIndex: number, productSpecIndex: number) {
...@@ -27,6 +48,59 @@ export default function IntentionModal(props: Props) { ...@@ -27,6 +48,59 @@ export default function IntentionModal(props: Props) {
}); });
} }
//提交
function onSubmit() {
let buyNum = 0;
let mallSpecIds: number[] = [];
Object.keys(checkedMap).forEach((key) => {
if (checkedMap[key as keyof typeof checkedMap]) {
buyNum++;
let arr = key.split(",");
let specId =
props.detail?.goodsSpec[Number(arr[0])].productSpecList[
Number(arr[1])
].id;
if (specId) {
mallSpecIds.push(specId);
}
}
});
if (buyNum > 0) {
setLoading(true);
api
.commitMallOrder({
buyNum,
directoryId: 1,
goodsInfoId: props.detail!.id,
mallSpecIds,
userAddressId: 1,
})
.then((res) => {
if (res.code == "200") {
message.success("提交意向成功");
//重置为未选中
let temp = {
...checkedMap
};
Object.keys(temp).forEach((key) => {
temp[key as keyof typeof temp] = false;
});
setCheckedMap(temp);
props.onCancel();
}else{
}
setLoading(false);
})
.catch((err) => {
message.error("提交意向失败");
console.log("err", err);
setLoading(false);
});
}
}
return ( return (
<Modal <Modal
open={props.open} open={props.open}
...@@ -41,6 +115,8 @@ export default function IntentionModal(props: Props) { ...@@ -41,6 +115,8 @@ export default function IntentionModal(props: Props) {
type="primary" type="primary"
className={styles.font5} className={styles.font5}
style={{ width: "100%", height: 44 }} style={{ width: "100%", height: 44 }}
onClick={onSubmit}
loading={loading}
> >
提交意向 提交意向
</Button> </Button>
...@@ -68,7 +144,12 @@ export default function IntentionModal(props: Props) { ...@@ -68,7 +144,12 @@ export default function IntentionModal(props: Props) {
className={`${styles.font2} ${styles.ellipsis2}`} className={`${styles.font2} ${styles.ellipsis2}`}
style={{ marginTop: 7 }} style={{ marginTop: 7 }}
> >
已选: 已选:{" "}
{checkItems
.map((item) => {
return item.specName;
})
.join("+")}
</div> </div>
</Col> </Col>
</Row> </Row>
......
pages/mall/index.page.tsx
...@@ -40,7 +40,7 @@ export default function Mall(props: Props) { ...@@ -40,7 +40,7 @@ export default function Mall(props: Props) {
setAbort(new AbortController()) setAbort(new AbortController())
}, [filterResult, pageParams]) }, [filterResult, pageParams])
//端口列表请求 //商品列表请求
useEffect(() => { useEffect(() => {
if (!abort) { if (!abort) {
return return
......
pages/personalCenter/components/sider/index.tsx
...@@ -24,7 +24,7 @@ function getItem( ...@@ -24,7 +24,7 @@ function getItem(
const items: MenuItem[] = [ const items: MenuItem[] = [
getItem("我的订单", "1", undefined, [ getItem("我的订单", "1", undefined, [
getItem("服务订单", "/personalCenter/servicesOrders"), getItem("服务订单", "/personalCenter/servicesOrders"),
getItem("租赁订单", "1-1"), getItem("租赁订单", "/personalCenter/leasingOrders"),
getItem("商城订单", "/personalCenter/mallOrders"), getItem("商城订单", "/personalCenter/mallOrders"),
getItem("培训订单", "1-2"), getItem("培训订单", "1-2"),
]), ]),
......
pages/personalCenter/leasingOrders/api/index.ts 0 → 100644
import request, { Response } from "~/api/request"
export interface ListPageWechatOrderParams {
buyerAccount?: string;
endTime?: string;
orderNo?: string;
pageNo: number;
pageSize: number;
startTime?: string;
tranStatus?: string;
wareNo?: string;
wareTitle?: string;
}
export interface ListPageWechatOrderResp {
pageNo: number;
pageSize: number;
list: LeasingList[];
totalCount: number;
totalPage: number;
}
export interface LeasingList {
id: number;
orderNo: string;
createTime?: any;
wareInfoId?: any;
wareNo?: any;
wareTitle: string;
wareImg: string;
skuInfoId?: any;
skuTitle?: any;
repoAccountId?: any;
uid?: any;
buyerName?: any;
buyerPhone?: any;
unitPrice?: any;
wareNum: number;
shouldPay: number;
actualPay: number;
orderType?: any;
deposit?: any;
rentPrice?: any;
startDate?: any;
endDate?: any;
payDay?: any;
tranStatus: string;
exWare?: any;
remark?: any;
pfRemark?: any;
shutReason?: any;
payNo?: any;
payTime?: any;
sendWareTime?: any;
receipt: Receipt;
orderRefund?: any;
express?: any;
refundExpress?: any;
vcus?: any;
returnTime?: any;
couponId?: any;
specsId?: any;
balance?: any;
doing?: any;
waiting?: any;
leaseOrderStatus?: any;
nickName?: any;
wareDescription?: any;
}
interface Receipt {
id: number;
receiptMethod: number;
takeName: string;
takePhone: string;
region: string;
detailAddress: string;
repoName?: any;
repoAddress?: any;
bookPhone?: any;
sendExCode?: any;
sendExNo?: any;
sendAddress?: any;
renMethod?: any;
renPhone?: any;
renName?: any;
renExCode?: any;
renExNo?: any;
renAddress?: any;
renRepoName?: any;
renRepoAddr?: any;
renRepoPhone?: any;
}
export interface ListTranStatusResp {
status: string;
doing: string;
waiting: string;
leaseOrderStatus: string;
}
export default {
//订单分页列表
listPageWechatOrder(params: ListPageWechatOrderParams, options?: any): Promise<Response<ListPageWechatOrderResp>> {
return request('/oms/RentalOrders/listPageWechatOrder', 'post', params, options)
},
//订单状态-字典
listTranStatus(): Promise<Response<ListTranStatusResp[]>> {
return request('/oms/RentalOrders/listTranStatus', 'get');
}
}
\ No newline at end of file
pages/personalCenter/leasingOrders/components/confirmReceiptModal/api/index.ts 0 → 100644
import request, { Response } from "~/api/request"
export interface OrderDetailResp {
id: number;
orderNo: string;
createTime: number;
wareInfoId: number;
wareNo: string;
wareTitle: string;
wareImg: string;
skuInfoId?: any;
skuTitle?: any;
repoAccountId: number;
uid: string;
buyerName?: any;
buyerPhone: string;
unitPrice: number;
wareNum: number;
shouldPay: number; //应付款金额
actualPay: number; //实收款金额
orderType?: any;
deposit: number;
rentPrice: number;
startDate: number;
endDate: number;
payDay: number;
tranStatus: string;
exWare?: any;
remark: string;
pfRemark?: any;
shutReason?: any;
payNo?: any;
payTime?: any;
sendWareTime?: any;
receipt: Receipt;
orderRefund?: any;
express?: any;
refundExpress?: any;
vcus?: any;
returnTime?: any;
couponId?: any;
specsId?: any;
balance?: any;
doing: string;
waiting: string;
leaseOrderStatus: string;
nickName: string;
wareDescription: string;
}
interface Receipt {
id: number;
receiptMethod: number;
takeName: string;
takePhone: string;
region: string;
detailAddress: string;
repoName?: any;
repoAddress?: any;
bookPhone?: any;
sendExCode?: any;
sendExNo?: any;
sendAddress?: any;
renMethod?: any;
renPhone?: any;
renName?: any;
renExCode?: any;
renExNo?: any;
renAddress?: any;
renRepoName?: any;
renRepoAddr?: any;
renRepoPhone?: any;
}
export default {
//订单详情
orderDetail(params: {
orderNo: string
}): Promise<Response<OrderDetailResp>>{
return request('/oms/RentalOrders/orderDetail', 'get', params);
}
}
\ No newline at end of file
pages/personalCenter/leasingOrders/components/confirmReceiptModal/index.module.scss 0 → 100644
.font1 {
font-size: 36px;
font-family: Arial-BoldMT, Arial;
font-weight: normal;
color: #ff440e;
line-height: 42px;
}
.font2 {
font-size: 18px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #ff440e;
line-height: 25px;
}
.font3 {
font-size: 15px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #959595;
line-height: 21px;
}
.font4 {
font-size: 15px;
font-family: ArialMT;
color: #282828;
line-height: 21px;
}
.font5 {
font-size: 18px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #000000;
line-height: 25px;
}
.btn {
background: linear-gradient(90deg, #ff552d 0%, #ff812d 100%);
border-radius: 6px;
height: 40px;
font-size: 16px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #ffffff;
line-height: 22px;
width: 100%;
}
pages/personalCenter/leasingOrders/components/confirmReceiptModal/index.tsx 0 → 100644
import { Button, Col, Divider, Modal, Row } from "antd";
import { useContext, useEffect, useState } from "react";
import { UserContext } from "~/lib/userProvider";
import api, { OrderDetailResp } from "./api";
import styles from "./index.module.scss";
function formatNumber(num: number) {
return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
type Props = {
open?: boolean;
onOk?: () => void;
onCancel?: () => void;
orderNo?: string;
};
export default function PayModal(props: Props) {
const [data, setData] = useState<OrderDetailResp | null>(null);
const { userInfo } = useContext(UserContext);
useEffect(() => {
if (props.orderNo) {
api.orderDetail({ orderNo: props.orderNo }).then((res) => {
setData(res.result || null);
});
} else {
setData(null);
}
}, [props.orderNo]);
return (
<>
<Modal
width={420}
open={props.open}
onOk={props.onOk}
onCancel={props.onCancel}
title={
<>
<div style={{ textAlign: "center" }} className={styles.font5}>
租赁付款
</div>
</>
}
footer={
<Button
type="primary"
className={styles.btn}
style={{ marginTop: 43 }}
>
立即付款
</Button>
}
>
<div
style={{ marginTop: 16, marginBottom: 34, textAlign: "center" }}
className={styles.font1}
>
{formatNumber(data?.shouldPay || 0)}{" "}
<span
className={styles.font2}
style={{ transform: "translateY(-3px)", display: "inline-block" }}
>
元
</span>
</div>
<Row gutter={[0, 16]}>
<Col span={6} className={styles.font3}>
云仓账号
</Col>
<Col span={18} className={styles.font4}>
UID{userInfo?.uid}
</Col>
<Col span={6} className={styles.font3}>
付款方式
</Col>
<Col span={18} className={styles.font4}>
充值余额（可用:¥2000000）
</Col>
</Row>
</Modal>
</>
);
}
pages/personalCenter/leasingOrders/components/payModal/api/index.ts 0 → 100644
import request, { Response } from "~/api/request"
export interface OrderDetailResp {
id: number;
orderNo: string;
createTime: number;
wareInfoId: number;
wareNo: string;
wareTitle: string;
wareImg: string;
skuInfoId?: any;
skuTitle?: any;
repoAccountId: number;
uid: string;
buyerName?: any;
buyerPhone: string;
unitPrice: number;
wareNum: number;
shouldPay: number; //应付款金额
actualPay: number; //实收款金额
orderType?: any;
deposit: number;
rentPrice: number;
startDate: number;
endDate: number;
payDay: number;
tranStatus: string;
exWare?: any;
remark: string;
pfRemark?: any;
shutReason?: any;
payNo?: any;
payTime?: any;
sendWareTime?: any;
receipt: Receipt;
orderRefund?: any;
express?: any;
refundExpress?: any;
vcus?: any;
returnTime?: any;
couponId?: any;
specsId?: any;
balance?: any;
doing: string;
waiting: string;
leaseOrderStatus: string;
nickName: string;
wareDescription: string;
}
interface Receipt {
id: number;
receiptMethod: number;
takeName: string;
takePhone: string;
region: string;
detailAddress: string;
repoName?: any;
repoAddress?: any;
bookPhone?: any;
sendExCode?: any;
sendExNo?: any;
sendAddress?: any;
renMethod?: any;
renPhone?: any;
renName?: any;
renExCode?: any;
renExNo?: any;
renAddress?: any;
renRepoName?: any;
renRepoAddr?: any;
renRepoPhone?: any;
}
export interface UserWalletResp {
id: number;
repoAccountId: number;
cashAmt: number;
cashPaid: number;
cashFreeze: number;
remark?: any;
phoneNum?: any;
userName?: any;
nickName?: any;
portType?: any;
uid?: any;
}
export default {
//订单详情
orderDetail(params: {
orderNo: string
}): Promise<Response<OrderDetailResp>> {
return request('/oms/RentalOrders/orderDetail', 'get', params);
},
//获取用户钱包
userWallet(): Promise<Response<UserWalletResp>> {
return request('/payment/repocash/userWallet')
},
//租赁——订单支付
orderPayment(params: { orderNo: string }) {
return request('/payment/repocash/orderPayment', 'post', params)
}
}
\ No newline at end of file
pages/personalCenter/leasingOrders/components/payModal/index.module.scss 0 → 100644
.font1 {
font-size: 36px;
font-family: Arial-BoldMT, Arial;
font-weight: normal;
color: #ff440e;
line-height: 42px;
}
.font2 {
font-size: 18px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #ff440e;
line-height: 25px;
}
.font3 {
font-size: 15px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #959595;
line-height: 21px;
}
.font4 {
font-size: 15px;
font-family: ArialMT;
color: #282828;
line-height: 21px;
}
.font5 {
font-size: 18px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #000000;
line-height: 25px;
}
.btn {
background: linear-gradient(90deg, #ff552d 0%, #ff812d 100%);
border-radius: 6px;
height: 40px;
font-size: 16px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #ffffff;
line-height: 22px;
width: 100%;
}
pages/personalCenter/leasingOrders/components/payModal/index.tsx 0 → 100644
import { Button, Col, Divider, message, Modal, Row } from "antd";
import { useContext, useEffect, useState } from "react";
import { UserContext } from "~/lib/userProvider";
import api, { OrderDetailResp, UserWalletResp } from "./api";
import styles from "./index.module.scss";
function formatNumber(num: number) {
return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
type Props = {
open?: boolean;
onOk?: () => void;
onCancel?: () => void;
orderNo?: string;
};
export default function PayModal(props: Props) {
const [data, setData] = useState<OrderDetailResp | null>(null);
const { userInfo } = useContext(UserContext);
const [wallet, setWallet] = useState<UserWalletResp | null>(null); //钱包
const [loading, setLoading] = useState(false); //付款按钮loading
useEffect(() => {
if (props.open) {
api.userWallet().then((res) => {
setWallet(res.result || null);
});
}
}, [props.open]);
useEffect(() => {
if (props.orderNo) {
api.orderDetail({ orderNo: props.orderNo }).then((res) => {
setData(res.result || null);
});
} else {
setData(null);
}
}, [props.orderNo]);
function onPay() {
if (props.orderNo) {
setLoading(true);
api
.orderPayment({
orderNo: props.orderNo,
})
.then((res) => {
if (res.code == "200") {
message.success("付款成功");
setTimeout(() => {
props.onCancel && props.onCancel();
setLoading(false);
}, 1000);
}else{
res.message && message.error(res.message);
setLoading(false);
}
}).catch(err=> {
setLoading(false);
});
}
}
return (
<>
<Modal
width={420}
open={props.open}
onOk={props.onOk}
onCancel={props.onCancel}
title={
<>
<div style={{ textAlign: "center" }} className={styles.font5}>
租赁付款
</div>
</>
}
footer={
<Button
type="primary"
className={styles.btn}
style={{ marginTop: 43 }}
onClick={onPay}
loading={loading}
>
立即付款
</Button>
}
>
<div
style={{ marginTop: 16, marginBottom: 34, textAlign: "center" }}
className={styles.font1}
>
{formatNumber(data?.shouldPay || 0)}{" "}
<span
className={styles.font2}
style={{ transform: "translateY(-3px)", display: "inline-block" }}
>
元
</span>
</div>
<Row gutter={[0, 16]}>
<Col span={6} className={styles.font3}>
云仓账号
</Col>
<Col span={18} className={styles.font4}>
UID{userInfo?.uid}
</Col>
<Col span={6} className={styles.font3}>
付款方式
</Col>
<Col span={18} className={styles.font4}>
充值余额（可用:¥{wallet?.cashAmt}）
</Col>
</Row>
</Modal>
</>
);
}
pages/personalCenter/leasingOrders/components/refundModal/api/index.ts 0 → 100644
import request, { Response } from "~/api/request"
export interface OrderDetailResp {
id: number;
orderNo: string;
createTime: number;
wareInfoId: number;
wareNo: string;
wareTitle: string;
wareImg: string;
skuInfoId?: any;
skuTitle?: any;
repoAccountId: number;
uid: string;
buyerName?: any;
buyerPhone: string;
unitPrice: number;
wareNum: number;
shouldPay: number; //应付款金额
actualPay: number; //实收款金额
orderType?: any;
deposit: number;
rentPrice: number;
startDate: number;
endDate: number;
payDay: number;
tranStatus: string;
exWare?: any;
remark: string;
pfRemark?: any;
shutReason?: any;
payNo?: any;
payTime?: any;
sendWareTime?: any;
receipt: Receipt;
orderRefund?: any;
express?: any;
refundExpress?: any;
vcus?: any;
returnTime?: any;
couponId?: any;
specsId?: any;
balance?: any;
doing: string;
waiting: string;
leaseOrderStatus: string;
nickName: string;
wareDescription: string;
}
interface Receipt {
id: number;
receiptMethod: number;
takeName: string;
takePhone: string;
region: string;
detailAddress: string;
repoName?: any;
repoAddress?: any;
bookPhone?: any;
sendExCode?: any;
sendExNo?: any;
sendAddress?: any;
renMethod?: any;
renPhone?: any;
renName?: any;
renExCode?: any;
renExNo?: any;
renAddress?: any;
renRepoName?: any;
renRepoAddr?: any;
renRepoPhone?: any;
}
export interface UserWalletResp {
id: number;
repoAccountId: number;
cashAmt: number;
cashPaid: number;
cashFreeze: number;
remark?: any;
phoneNum?: any;
userName?: any;
nickName?: any;
portType?: any;
uid?: any;
}
export default {
//订单详情
orderDetail(params: {
orderNo: string
}): Promise<Response<OrderDetailResp>> {
return request('/oms/RentalOrders/orderDetail', 'get', params);
},
//获取用户钱包
userWallet(): Promise<Response<UserWalletResp>> {
return request('/payment/repocash/userWallet')
},
//租赁——订单支付
orderPayment(params: { orderNo: string }) {
return request('/payment/repocash/orderPayment', 'post', params)
}
}
\ No newline at end of file
pages/personalCenter/leasingOrders/components/refundModal/index.module.scss 0 → 100644
.font1 {
font-size: 36px;
font-family: Arial-BoldMT, Arial;
font-weight: normal;
color: #ff440e;
line-height: 42px;
}
.font2 {
font-size: 18px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #ff440e;
line-height: 25px;
}
.font3 {
font-size: 15px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #959595;
line-height: 21px;
}
.font4 {
font-size: 15px;
font-family: ArialMT;
color: #282828;
line-height: 21px;
}
.font5 {
font-size: 18px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #000000;
line-height: 25px;
}
.btn {
background: linear-gradient(90deg, #ff552d 0%, #ff812d 100%);
border-radius: 6px;
height: 40px;
font-size: 16px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #ffffff;
line-height: 22px;
width: 100%;
}
pages/personalCenter/leasingOrders/components/refundModal/index.tsx 0 → 100644
import { Button, Col, Divider, message, Modal, Row } from "antd";
import { useContext, useEffect, useState } from "react";
import { UserContext } from "~/lib/userProvider";
import api, { OrderDetailResp, UserWalletResp } from "./api";
import styles from "./index.module.scss";
function formatNumber(num: number) {
return num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
type Props = {
open?: boolean;
onOk?: () => void;
onCancel?: () => void;
orderNo?: string;
};
export default function RefundModal(props: Props) {
const [data, setData] = useState<OrderDetailResp | null>(null);
const { userInfo } = useContext(UserContext);
const [wallet, setWallet] = useState<UserWalletResp | null>(null); //钱包
const [loading, setLoading] = useState(false); //付款按钮loading
useEffect(() => {
if (props.open) {
api.userWallet().then((res) => {
setWallet(res.result || null);
});
}
}, [props.open]);
useEffect(() => {
if (props.orderNo) {
api.orderDetail({ orderNo: props.orderNo }).then((res) => {
setData(res.result || null);
});
} else {
setData(null);
}
}, [props.orderNo]);
function onPay() {
if (props.orderNo) {
setLoading(true);
api
.orderPayment({
orderNo: props.orderNo,
})
.then((res) => {
if (res.code == "200") {
message.success("付款成功");
setTimeout(() => {
props.onCancel && props.onCancel();
setLoading(false);
}, 1000);
} else {
res.message && message.error(res.message);
setLoading(false);
}
})
.catch((err) => {
setLoading(false);
});
}
}
return (
<>
<Modal
width={420}
open={props.open}
onOk={props.onOk}
onCancel={props.onCancel}
title={
<>
<div style={{ textAlign: "center" }} className={styles.font5}>
租赁付款
</div>
</>
}
footer={
<Button
type="primary"
className={styles.btn}
style={{ marginTop: 43 }}
onClick={onPay}
loading={loading}
>
立即付款
</Button>
}
>
<div
style={{ marginTop: 16, marginBottom: 34, textAlign: "center" }}
className={styles.font1}
>
{formatNumber(data?.shouldPay || 0)}{" "}
<span
className={styles.font2}
style={{ transform: "translateY(-3px)", display: "inline-block" }}
>
元
</span>
</div>
<Row gutter={[0, 16]}>
<Col span={6} className={styles.font3}>
云仓账号
</Col>
<Col span={18} className={styles.font4}>
UID{userInfo?.uid}
</Col>
<Col span={6} className={styles.font3}>
付款方式
</Col>
<Col span={18} className={styles.font4}>
充值余额（可用:¥{wallet?.cashAmt}）
</Col>
</Row>
</Modal>
</>
);
}
pages/personalCenter/leasingOrders/index.module.scss 0 → 100644
@import "~/styles/mixins.scss";
.font1 {
font-size: 14px;
font-family: MicrosoftYaHei;
color: #9b9b9b;
line-height: 19px;
}
.font2 {
font-size: 12px;
font-family: Arial-BoldMT, Arial;
font-weight: normal;
color: #626262;
line-height: 14px;
}
.font3 {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #6c6c6c;
line-height: 20px;
}
.font4 {
font-size: 14px;
font-family: ArialMT;
color: #141414;
line-height: 16px;
}
.font5 {
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #929295;
line-height: 17px;
}
.font6 {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #070707;
line-height: 20px;
}
.font7 {
font-size: 13px;
font-family: MicrosoftYaHeiUI-Bold, MicrosoftYaHeiUI;
font-weight: bold;
color: #070707;
line-height: 16px;
}
.btn1 {
border-radius: 16px;
border: 1px solid #ff552d;
padding: 6px 16px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #ff552d;
line-height: 20px;
}
.btn2 {
border-radius: 16px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #ffffff;
line-height: 20px;
padding: 6px 16px;
}
pages/personalCenter/mallOrders/api/index.ts 0 → 100644
import request, { Response } from "~/api/request"
export interface ListPageParams {
keyword?: string,
showType: number,
pageNo: number;
pageSize: number;
}
export interface ListPageResp {
pageNo: number;
pageSize: number;
list: OrderList[];
totalCount: number;
totalPage: number;
}
export interface OrderList {
id: number;
orderNo: string;
orderMainImg: string;
orderName: string;
totalBuyNum: number;
orderAmount: number;
statusCode: number;
signStatus?: any;
operationName?: any;
operationId?: any;
deliveryTime?: any;
contractNo?: any;
userAccountId: number;
uid?: any;
userName?: any;
phoneNum?: any;
payMethod: number;
contractSignedWay?: any;
createTime: string;
recMallUserName?: any;
ogSkuSpecDTOList: OgSkuSpecDTOList[];
remark: string;
creditPeriod?: any;
entName?: any;
saleId?: any;
saleName?: any;
tagName?: any;
realNameAuth?: any;
realPayAmount?: any;
subAmount?: any;
shareId?: any;
shareStatus: number;
deductAmount?: any;
discountAmount?: any;
realityAmount?: any;
shutReason?: any;
mallOrderProdListDTOList: MallOrderProdListDTOList[];
mremark?: any;
}
interface MallOrderProdListDTOList {
id: number;
goodsInfoId: number;
productName: string;
model?: any;
prodSkuSpecName: string;
prodSkuSpecImage: string;
partNo: string;
versionDesc: string;
buyNum: number;
unitPrice: number;
skuSpecAmount: number;
}
interface OgSkuSpecDTOList {
id: number;
directoryId: number;
shopCarId?: any;
skuSpecName: string;
}
export interface ListStatusResp {
status: string;
code: number;
nextCode: number;
}
export default {
//v1.0.0订单列表-查询
listPage(params: ListPageParams, options: any): Promise<Response<ListPageResp>> {
return request('/oms/app-order/listPage', 'get', params, options)
},
//订单状态-字典
listStatus(): Promise<Response<ListStatusResp[]>> {
return request('/oms/mallorder/listStatus', 'get');
}
}
\ No newline at end of file
pages/personalCenter/mallOrders/index.module.scss
@import "~/styles/mixins.scss";
.font1 { .font1 {
font-size: 14px; font-size: 14px;
font-family: MicrosoftYaHei; font-family: MicrosoftYaHei;
color: #9b9b9b; color: #9b9b9b;
line-height: 19px; line-height: 19px;
} }
.font2 {
font-size: 12px;
font-family: Arial-BoldMT, Arial;
font-weight: normal;
color: #626262;
line-height: 14px;
}
.font3 {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #6c6c6c;
line-height: 20px;
}
.font4 {
font-size: 14px;
font-family: ArialMT;
color: #141414;
line-height: 16px;
}
.font5 {
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #929295;
line-height: 17px;
}
.btn1 {
border-radius: 16px;
border: 1px solid #ff552d;
padding: 6px 16px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #ff552d;
line-height: 20px;
}
.btn2 {
border-radius: 16px;
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #ffffff;
line-height: 20px;
padding: 6px 16px;
}
pages/personalCenter/mallOrders/index.page.tsx
import { TabsProps, Tabs } from "antd"; import {
import {useRouter} from "next/router"; TabsProps,
Tabs,
Row,
Col,
Image,
Space,
Button,
Spin,
Pagination,
Empty,
} from "antd";
import { useRouter } from "next/router";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import errImg from "~/assets/errImg";
import Right from "~/components/contentBox/right";
import LayoutView from "~/components/layout"; import LayoutView from "~/components/layout";
import Sider from "../components/sider"; import Sider from "../components/sider";
import api, { OrderList, ListStatusResp } from "./api";
import styles from "./index.module.scss"; import styles from "./index.module.scss";
const onChange = (key: string) => {
console.log(key);
};
const items: TabsProps["items"] = [ const items: TabsProps["items"] = [
{ {
key: "",
label: `全部`,
},
{
key: "0",
label: `意向沟通`,
},
{
key: "1", key: "1",
label: `Tab 1`, label: `签约付款`,
children: `Content of Tab Pane 1`,
}, },
{ {
key: "2", key: "2",
label: `Tab 2`, label: `待发货`,
children: `Content of Tab Pane 2`,
}, },
{ {
key: "3", key: "3",
label: `Tab 3`, label: `待收货`,
children: `Content of Tab Pane 3`,
}, },
]; ];
export default function MallOrder() { export default function LeasingOrder() {
const router = useRouter(); const router = useRouter();
const [pageParams, setPageParams] = useState({
pageNo: 1,
pageSize: 5,
}); //分页器对象
const [total, setTotal] = useState(0); //总数
const [abort, setAbort] = useState<AbortController | null>(null); //请求中断对你
const [tabKey, setTabKey] = useState("");
const [orderList, setOrderList] = useState<OrderList[]>([]);
const [loading, setLoading] = useState(false);
const [orderNo, setOrderNo] = useState<string | undefined>();
const [tranStatusMap, setTranStatusMap] = useState<ListStatusResp[]>([]); //订单状态字典
//获取订单状态字典
useEffect(() => {
api.listStatus().then((res) => {
setTranStatusMap(res.result || []);
});
}, []);
useEffect(() => {
//中断前一次列表请求
abort?.abort();
setAbort(new AbortController());
}, [pageParams]);
//商品列表请求
useEffect(() => {
if (!abort) {
return;
}
setLoading(true);
api
.listPage(
{
...pageParams,
showType: Number(tabKey),
},
{
signal: abort?.signal,
}
)
.then((res) => {
setOrderList(res.result?.list || []);
setTotal(res.result?.totalCount || 0);
setLoading(false);
});
}, [abort]);
const onPageChange = (page: number, pageSize: number) => {
setPageParams({
...pageParams,
pageNo: page,
});
};
const onTabsChange = (key: string) => {
setTabKey(key);
setPageParams({
...pageParams,
pageNo: 1,
});
setTotal(0);
};
return ( return (
<> <>
<LayoutView <LayoutView
layoutStyle={{ backgroundColor: "#fff" }} layoutStyle={{ backgroundColor: "#fff" }}
contentStyle={{ width: 1000, marginLeft: 526 }} contentStyle={{ width: 1000, marginLeft: 526 }}
headerStyle={{ borderBottom: "1px solid #e2e2e2" }}
> >
<Sider <Sider
style={{ style={{
position: "absolute", position: "absolute",
left: -37, left: -37,
top: 15,
transform: "translateX(-100%)", transform: "translateX(-100%)",
}} }}
selectedKeys={[router.pathname]} selectedKeys={[router.pathname]}
></Sider> ></Sider>
<div> <div style={{ paddingTop: 19 }}>
<div className={styles.font1}>商城订单</div> <div className={styles.font1}>商城订单</div>
<Tabs defaultActiveKey="1" items={items} onChange={onChange} /> <Tabs activeKey={tabKey} items={items} onChange={onTabsChange} />
<Spin spinning={loading} delay={500}>
<ul className={styles.orderList} style={{ minHeight: 650 }}>
{orderList.map((item) => {
return (
<li key={item.id} className={styles.orderItem}>
<Row
justify="space-between"
align="middle"
style={{
height: 30,
padding: "0 26px 0 16px",
background: "#EBF8FF",
}}
>
<div className={styles.font2}>{item.createTime}</div>
<div className={styles.font3}>{tranStatusMap.find(status => status.code === item.statusCode)?.status}</div>
</Row>
<Row
style={{ minHeight: 100, border: "1px solid #D0EAF5" }}
>
<Col style={{ width: 380 }}>
<Row>
<div style={{ margin: "10px 10px 0 16px" }}>
<Image
width={80}
height={80}
preview={false}
fallback={errImg}
src={item.orderMainImg}
></Image>
</div>
<div style={{ marginTop: 12 }}>
<div className={`ellipsis1 ${styles.font4}`}>
{item.orderName}
</div>
{item.mallOrderProdListDTOList.map((spec) => {
return (
<div
key={spec.id}
className={styles.font5}
style={{ marginTop: 5 }}
>
{spec.prodSkuSpecName}: {spec.productName}
</div>
);
})}
</div>
</Row>
</Col>
<Col
style={{
width: 270,
borderLeft: "1px solid #D0EAF5",
borderRight: "1px solid #D0EAF5",
}}
>
<Row
justify={"center"}
align="middle"
style={{ height: "100%" }}
>
数量: {item.totalBuyNum}件
</Row>
</Col>
<Col flex={"auto"} style={{}}>
<Space
size={7}
style={{
float: "right",
marginTop: 20,
marginRight: 24,
}}
>
<Button className={styles.btn1}>取消订单</Button>
<Button className={styles.btn2} type="primary">
查看合同
</Button>
</Space>
</Col>
</Row>
</li>
);
})}
{orderList.length === 0 && (
<Empty
style={{
paddingTop: 20,
width: "100%",
textAlign: "center",
}}
></Empty>
)}
</ul>
</Spin>
<Pagination
current={pageParams.pageNo}
showSizeChanger={false}
showQuickJumper
total={total}
pageSize={pageParams.pageSize}
onChange={onPageChange}
hideOnSinglePage={true}
style={{ marginTop: 20 }}
></Pagination>
</div> </div>
</LayoutView> </LayoutView>
</> </>
......
styles/index.scss
@import "./reset.scss"; @import "./reset.scss";
@import "./mixins.scss";
body { body {
background-color: rgb(248, 248, 248) background-color: rgb(248, 248, 248)
...@@ -75,3 +76,19 @@ body { ...@@ -75,3 +76,19 @@ body {
.ant-tag-close-icon { .ant-tag-close-icon {
font-size: 10px !important; font-size: 10px !important;
} }
.ellipsis1{
@include ellipsis(1);
}
.ellipsis2{
@include ellipsis(2);
}
.ellipsis3{
@include ellipsis(3);
}
.ellipsis4{
@include ellipsis(4);
}
\ No newline at end of file
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论