Skip to content

W
web
提交 0b24ec1d 作者: 曹云
操作

Merge branch 'master' of ssh://git.mmcuav.cn:8222/iuav/csf-web into caoyun

上级 3d05695e 6b960fcd
正在显示 包含 193 行增加 和 204 行删除
components/NavHeader/publishModal/index.tsx
...@@ -23,7 +23,6 @@ export default function PublishModal(props: Props) { ...@@ -23,7 +23,6 @@ export default function PublishModal(props: Props) {
const position = useGeolocation(); const position = useGeolocation();
const { reloadRequirements, setReloadRequirements } = const { reloadRequirements, setReloadRequirements } =
useContext(CommonContext); useContext(CommonContext);
console.log("position", position);
useEffect(() => { useEffect(() => {
api.listType().then((res) => { api.listType().then((res) => {
......
pages/certification/index.page.tsx
...@@ -21,9 +21,13 @@ import Router from "next/router"; ...@@ -21,9 +21,13 @@ import Router from "next/router";
import { UserContext } from "~/lib/userProvider"; import { UserContext } from "~/lib/userProvider";
const beforeUpload = (file: RcFile) => { const beforeUpload = (file: RcFile) => {
const isJpgOrPng = file.type === "image/jpeg" || file.type === "image/png"; const isJpgOrPng =
file.type === "image/jpeg" ||
file.type === "image/png" ||
file.type === "image/bmp" ||
file.type === "image/gif"
if (!isJpgOrPng) { if (!isJpgOrPng) {
message.error("You can only upload JPG/PNG file!"); message.error("请上传10M以内的JPG、JPEG、BMP、GIF、PNG格式图片");
} }
//限制上传10M //限制上传10M
const isLt2M = file.size / 1024 / 1024 < 10; const isLt2M = file.size / 1024 / 1024 < 10;
......
pages/mall/detail/[id].page.tsx
import styles from './index.module.scss' import styles from "./index.module.scss";
import Layout from '~/components/layout' import Layout from "~/components/layout";
import { Space, Image as AImage, Row, Col, Button, Divider, Badge } from 'antd' import { Space, Image as AImage, Row, Col, Button, Divider, Badge } from "antd";
import { useContext, useEffect, useState } from 'react' import { useContext, useEffect, useState } from "react";
import { DownOutlined, RightOutlined } from '@ant-design/icons' import { DownOutlined, RightOutlined } from "@ant-design/icons";
import Image from 'next/image' import Image from "next/image";
import errImg from '~/assets/errImg' import errImg from "~/assets/errImg";
import { useRouter } from 'next/router' import { useRouter } from "next/router";
// Import Swiper React components // Import Swiper React components
import { Swiper, SwiperSlide } from 'swiper/react' import { Swiper, SwiperSlide } from "swiper/react";
import { Navigation } from 'swiper' import { Navigation } from "swiper";
import OrderForGoods from './components/orderForGoods'
// Import Swiper styles // Import Swiper styles
import 'swiper/css' import "swiper/css";
import 'swiper/css/navigation' import "swiper/css/navigation";
import api, { GetLeaseGoodsDetailResp } from './api' import api, { GetLeaseGoodsDetailResp, ProductSpecList } from "./api";
import IntentionModal from './components/intentionModal' import IntentionModal from "./components/intentionModal";
import { UserContext } from '~/lib/userProvider' import { UserContext } from "~/lib/userProvider";
export default function MallDetail() { export default function MallDetail() {
const { userInfo, setNeedLogin } = useContext(UserContext) const { userInfo, setNeedLogin } = useContext(UserContext);
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<GetLeaseGoodsDetailResp | null>(null) //详情数据 const [detail, setDetail] = useState<GetLeaseGoodsDetailResp | null>(null); //详情数据
const [intentionModalOpen, setIntentionModalOpen] = useState(false) //意向弹窗 const [intentionModalOpen, setIntentionModalOpen] = useState(false); //意向弹窗
const [productImg, setProductImg] = useState('') //展示的商品图 const [productImg, setProductImg] = useState(""); //展示的商品图
const [previewIndex, setPreviewIndex] = useState(0); //预览开始索引
const [checkItems, setCheckItems] = useState<ProductSpecList[]>([]); //选中的规格
const [specCount, setSpecCount] = useState(0); //规格数量
useEffect(() => {
if (detail) {
let count = 0;
detail.goodsSpec?.forEach((good) => {
good.productSpecList?.forEach((product) => {
count++;
});
});
setSpecCount(count);
}
}, [detail]);
//打开意向modal //打开意向modal
const openIntentionModal = () => { const openIntentionModal = () => {
if (userInfo) { if (userInfo) {
setIntentionModalOpen(true) setIntentionModalOpen(true);
} else { } else {
setNeedLogin(true) setNeedLogin(true);
}
} }
};
//提交意向 //提交意向
const handleIntentionOk = () => { const handleIntentionOk = () => {
setIntentionModalOpen(false) setIntentionModalOpen(false);
} };
const handleIntentionCancel = () => { const handleIntentionCancel = () => {
setIntentionModalOpen(false) setIntentionModalOpen(false);
} };
useEffect(() => { useEffect(() => {
setId(Number(router.query.id)) setId(Number(router.query.id));
}, [router]) }, [router]);
useEffect(() => { useEffect(() => {
if (id) { if (id) {
...@@ -57,23 +71,12 @@ export default function MallDetail() { ...@@ -57,23 +71,12 @@ export default function MallDetail() {
type: 0, type: 0,
}) })
.then((res) => { .then((res) => {
setDetail(res.result || null) setDetail(res.result || null);
setProductImg(res.result?.images?.[0]?.imgUrl || '') setProductImg(res.result?.images?.[0]?.imgUrl || "");
const wareList = res.result?.goodsSpec.map( });
(item) => item.productSpecList
)
if (wareList) {
const List: any = wareList.flat()
setWareSkuList(List)
}
})
} }
}, [id]) }, [id]);
//订单弹框
const [isorderForGoods, setIsorderForGoods] = useState(false)
const [wareSkuList, setWareSkuList] = useState<any>()
const [mallDetail, setMallDetail] = useState<any>()
return ( return (
<Layout> <Layout>
{/* 意向弹窗 */} {/* 意向弹窗 */}
...@@ -82,26 +85,25 @@ export default function MallDetail() { ...@@ -82,26 +85,25 @@ export default function MallDetail() {
detail={detail} detail={detail}
onOk={handleIntentionOk} onOk={handleIntentionOk}
onCancel={handleIntentionCancel} onCancel={handleIntentionCancel}
setIsorderForGoods={setIsorderForGoods} onChange={(items: ProductSpecList[]) => setCheckItems(items)}
setMallDetail={setMallDetail}
></IntentionModal> ></IntentionModal>
{!isorderForGoods ? ( <div className="page" style={{ marginTop: 20, backgroundColor: "#fff" }}>
<div <div style={{ display: "none" }}>
className="page"
style={{ marginTop: 20, backgroundColor: '#fff' }}
>
<div style={{ display: 'none' }}>
<AImage.PreviewGroup <AImage.PreviewGroup
preview={{ visible, onVisibleChange: (vis) => setVisible(vis) }} preview={{
visible,
onVisibleChange: (vis) => setVisible(vis),
current: previewIndex,
}}
> >
{detail?.images?.map((item) => { {detail?.images?.map((item) => {
return <AImage key={item.id} src={item.imgUrl} /> return <AImage key={item.id} src={item.imgUrl} />;
})} })}
</AImage.PreviewGroup> </AImage.PreviewGroup>
</div> </div>
<Space <Space
size={30} size={30}
style={{ padding: '22px 24px 0', alignItems: 'start' }} style={{ padding: "22px 24px 0", alignItems: "start" }}
> >
{/* 商品图 */} {/* 商品图 */}
<Space size={17} direction="vertical" style={{ width: 300 }}> <Space size={17} direction="vertical" style={{ width: 300 }}>
...@@ -120,10 +122,10 @@ export default function MallDetail() { ...@@ -120,10 +122,10 @@ export default function MallDetail() {
modules={[Navigation]} modules={[Navigation]}
spaceBetween={6} spaceBetween={6}
slidesPerView={5} slidesPerView={5}
onSlideChange={() => console.log('slide change')} onSlideChange={() => console.log("slide change")}
onSwiper={(swiper) => console.log(swiper)} onSwiper={(swiper) => console.log(swiper)}
> >
{detail?.images?.map((item) => { {detail?.images?.map((item, i) => {
return ( return (
<SwiperSlide key={item.id}> <SwiperSlide key={item.id}>
<AImage <AImage
...@@ -132,11 +134,13 @@ export default function MallDetail() { ...@@ -132,11 +134,13 @@ export default function MallDetail() {
height={50} height={50}
src={item.imgUrl} src={item.imgUrl}
fallback={errImg} fallback={errImg}
style={{ cursor: 'pointer' }} style={{ cursor: "pointer" }}
onClick={() => setProductImg(item.imgUrl)} onClick={() => {
setProductImg(item.imgUrl), setPreviewIndex(i);
}}
/> />
</SwiperSlide> </SwiperSlide>
) );
})} })}
</Swiper> </Swiper>
</Space> </Space>
...@@ -152,7 +156,7 @@ export default function MallDetail() { ...@@ -152,7 +156,7 @@ export default function MallDetail() {
size={24} size={24}
direction="vertical" direction="vertical"
style={{ style={{
padding: '24px 40px 0px 0', padding: "24px 40px 0px 0",
width: 470, width: 470,
}} }}
> >
...@@ -163,23 +167,20 @@ export default function MallDetail() { ...@@ -163,23 +167,20 @@ export default function MallDetail() {
选择 选择
</Col> </Col>
<Col flex="auto" className={styles.font4} style={{}}> <Col flex="auto" className={styles.font4} style={{}}>
已选：1件 已选：{checkItems.length}件
</Col> </Col>
</Row> </Row>
</Col> </Col>
<Col> <Col>
<Row align="middle" style={{ cursor: 'pointer' }}> <Row align="middle" style={{ cursor: "pointer" }}>
<Col <Col className={styles.font4} onClick={openIntentionModal}>
className={styles.font4} 共{specCount}种可选
onClick={openIntentionModal}
>
共3种可选
</Col> </Col>
<Col style={{ marginLeft: 9 }}> <Col style={{ marginLeft: 9 }}>
<DownOutlined <DownOutlined
style={{ style={{
fontSize: 12, fontSize: 12,
color: 'RGBA(219, 219, 219, 1)', color: "RGBA(219, 219, 219, 1)",
}} }}
/> />
</Col> </Col>
...@@ -190,13 +191,13 @@ export default function MallDetail() { ...@@ -190,13 +191,13 @@ export default function MallDetail() {
<Col flex="60px" className={styles.font3}> <Col flex="60px" className={styles.font3}>
送至 送至
</Col> </Col>
<Col flex="auto" style={{ cursor: 'pointer' }}> <Col flex="auto" style={{ cursor: "pointer" }}>
<Space size={5}> <Space size={5}>
<Image <Image
alt="" alt=""
width={18} width={18}
height={18} height={18}
src={require('./assets/locate.png')} src={require("./assets/locate.png")}
></Image> ></Image>
<span className={`${styles.font3} ${styles.ellipsis}`}> <span className={`${styles.font3} ${styles.ellipsis}`}>
广东深圳市南山区万科云城创新谷6栋A座… 广东深圳市南山区万科云城创新谷6栋A座…
...@@ -220,10 +221,10 @@ export default function MallDetail() { ...@@ -220,10 +221,10 @@ export default function MallDetail() {
提交意向 提交意向
</Button> </Button>
<Space size={20} style={{ marginLeft: 19 }}> <Space size={20} style={{ marginLeft: 19 }}>
<div style={{ textAlign: 'center', cursor: 'pointer' }}> <div style={{ textAlign: "center", cursor: "pointer" }}>
<Image <Image
alt="" alt=""
src={require('./assets/phone.png')} src={require("./assets/phone.png")}
width={20} width={20}
height={20} height={20}
></Image> ></Image>
...@@ -231,11 +232,11 @@ export default function MallDetail() { ...@@ -231,11 +232,11 @@ export default function MallDetail() {
电话 电话
</div> </div>
</div> </div>
<div style={{ textAlign: 'center', cursor: 'pointer' }}> <div style={{ textAlign: "center", cursor: "pointer" }}>
<Badge count={55} size="small"> <Badge count={55} size="small">
<Image <Image
alt="" alt=""
src={require('./assets/car.png')} src={require("./assets/car.png")}
width={20} width={20}
height={20} height={20}
></Image> ></Image>
...@@ -249,22 +250,14 @@ export default function MallDetail() { ...@@ -249,22 +250,14 @@ export default function MallDetail() {
</Space> </Space>
</Space> </Space>
<Divider className={styles.divider}>商品详情</Divider> <Divider className={styles.divider}>商品详情</Divider>
<div style={{ textAlign: 'center' }}> <div style={{ textAlign: "center" }}>
<div <div
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
__html: detail?.goodsDetail?.content || '', __html: detail?.goodsDetail?.content || "",
}} }}
></div> ></div>
</div> </div>
</div> </div>
) : (
//订单
<OrderForGoods
setIsorderForGoods={setIsorderForGoods}
detailData={detail}
mallDetail={mallDetail}
/>
)}
</Layout> </Layout>
) );
} }
pages/mall/detail/components/intentionModal/index.tsx
import { import { Button, Col, Image, message, Modal, Row, Space } from "antd";
Button, import { useEffect, useState } from "react";
Col, import errImg from "~/assets/errImg";
Image, import { GetLeaseGoodsDetailResp, ProductSpecList } from "../../api";
message, import styles from "./index.module.scss";
Modal, import api from "./api";
Row, import Item from "antd/es/list/Item";
Space,
InputNumber,
} from 'antd'
import { Dispatch, SetStateAction, useEffect, useState } from 'react'
import errImg from '~/assets/errImg'
import { GetLeaseGoodsDetailResp, ProductSpecList } from '../../api'
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?: () => void onOk?: () => void;
onCancel: () => void onCancel: () => void;
detail: GetLeaseGoodsDetailResp | null detail: GetLeaseGoodsDetailResp | null;
setIsorderForGoods: Dispatch<SetStateAction<boolean>> onChange?: (checkItems: ProductSpecList[]) => void;
setMallDetail: Dispatch<SetStateAction<any>> };
}
export default function IntentionModal(props: Props) { export default function IntentionModal(props: Props) {
const [checkedMap, setCheckedMap] = useState<{ string?: boolean }>({}) //通过索引记录选中的产品规格 例: {'1,1': true|false} props.detail?.goodsSpec[1].productSpecList[1] const [checkedMap, setCheckedMap] = useState<{ string?: boolean }>({}); //通过索引记录选中的产品规格 例: {'1,1': true|false} props.detail?.goodsSpec[1].productSpecList[1]
const [checkItems, setCheckItems] = useState<ProductSpecList[]>([]) //选中的规格 const [checkItems, setCheckItems] = useState<ProductSpecList[]>([]); //选中的规格
const [loading, setLoading] = useState(false) //下单中 const [loading, setLoading] = useState(false); //下单中
const [numValue, setNumValue] = useState<number | null>(1) //数量
useEffect(() => { useEffect(() => {
let list: ProductSpecList[] = [] let list: ProductSpecList[] = [];
Object.keys(checkedMap).forEach((key) => { Object.keys(checkedMap).forEach((key) => {
if (checkedMap[key as keyof typeof checkedMap]) { if (checkedMap[key as keyof typeof checkedMap]) {
let arr = key.split(',') let arr = key.split(",");
let item = let item =
props.detail?.goodsSpec[Number(arr[0])].productSpecList[ props.detail?.goodsSpec[Number(arr[0])].productSpecList[
Number(arr[1]) Number(arr[1])
] ];
if (item) { if (item) {
list.push(item) list.push(item);
} }
} }
}) });
setCheckItems(list) setCheckItems(list);
setNumValue(1) props.onChange && props.onChange(list);
}, [checkedMap]) }, [checkedMap]);
//添加规格到购物车 //添加规格到购物车
function addProductSpec(goodsSpecIndex: number, productSpecIndex: number) { function addProductSpec(goodsSpecIndex: number, productSpecIndex: number) {
let temp = {} let temp = {};
//@ts-ignore //@ts-ignore
temp[`${goodsSpecIndex},${productSpecIndex}`] = temp[`${goodsSpecIndex},${productSpecIndex}`] =
//@ts-ignore //@ts-ignore
!checkedMap[`${goodsSpecIndex},${productSpecIndex}`] !checkedMap[`${goodsSpecIndex},${productSpecIndex}`];
setCheckedMap({ setCheckedMap({
...checkedMap, ...checkedMap,
...temp, ...temp,
}) });
}
//数量
const onChangeNum = (value: number | null) => {
console.log('changed', value)
setNumValue(value)
} }
//提交 //提交
function onSubmit() { function onSubmit() {
let buyNum = 0 let buyNum = 0;
let mallSpecIds: number[] = [] let mallSpecIds: number[] = [];
Object.keys(checkedMap).forEach((key) => { Object.keys(checkedMap).forEach((key) => {
if (checkedMap[key as keyof typeof checkedMap]) { if (checkedMap[key as keyof typeof checkedMap]) {
buyNum++ buyNum++;
let arr = key.split(',') let arr = key.split(",");
let specId = let specId =
props.detail?.goodsSpec[Number(arr[0])].productSpecList[ props.detail?.goodsSpec[Number(arr[0])].productSpecList[
Number(arr[1]) Number(arr[1])
].id ].id;
if (specId) { if (specId) {
mallSpecIds.push(specId) mallSpecIds.push(specId);
} }
} }
}) });
if (buyNum > 0) { if (buyNum > 0) {
setLoading(true) setLoading(true);
api api
.commitMallOrder({ .commitMallOrder({
buyNum: numValue || 1, buyNum,
directoryId: 1, directoryId: 1,
goodsInfoId: props.detail!.id, goodsInfoId: props.detail!.id,
mallSpecIds, mallSpecIds,
userAddressId: 1, userAddressId: 1,
}) })
.then((res) => { .then((res) => {
if (res.code == '200') { if (res.code == "200") {
message.success('提交意向成功') message.success("提交意向成功");
//重置为未选中 //重置为未选中
let temp = { let temp = {
...checkedMap, ...checkedMap,
} };
Object.keys(temp).forEach((key) => { Object.keys(temp).forEach((key) => {
temp[key as keyof typeof temp] = false temp[key as keyof typeof temp] = false;
}) });
setCheckedMap(temp) setCheckedMap(temp);
props.onCancel() props.onCancel();
props.setIsorderForGoods(true)
props.setMallDetail({
...res.result,
buyNum: numValue || 1,
directoryId: 1,
goodsInfoId: props.detail!.id,
mallSpecIds,
userAddressId: 1,
})
} else { } else {
} }
setLoading(false) setLoading(false);
}) })
.catch((err) => { .catch((err) => {
message.error('提交意向失败') message.error("提交意向失败");
console.log('err', err) console.log("err", err);
setLoading(false) setLoading(false);
}) });
} }
} }
...@@ -136,20 +111,21 @@ export default function IntentionModal(props: Props) { ...@@ -136,20 +111,21 @@ export default function IntentionModal(props: Props) {
style={{ padding: 0 }} style={{ padding: 0 }}
className={styles.model} className={styles.model}
footer={ footer={
<div style={{ padding: '13px 36px' }}> <div style={{ padding: "13px 36px" }}>
<Button <Button
type="primary" type="primary"
className={styles.font5} className={styles.font5}
style={{ width: '100%', height: 44 }} style={{ width: "100%", height: 44 }}
onClick={onSubmit} onClick={onSubmit}
loading={loading} loading={loading}
disabled={checkItems.length == 0}
> >
提交意向 提交意向
</Button> </Button>
</div> </div>
} }
> >
<Row style={{ padding: '22px 39px 12px 39px' }} wrap={false}> <Row style={{ padding: "22px 39px 12px 39px" }} wrap={false}>
<Col> <Col>
<Image <Image
width={100} width={100}
...@@ -170,12 +146,12 @@ export default function IntentionModal(props: Props) { ...@@ -170,12 +146,12 @@ export default function IntentionModal(props: Props) {
className={`${styles.font2} ${styles.ellipsis2}`} className={`${styles.font2} ${styles.ellipsis2}`}
style={{ marginTop: 7 }} style={{ marginTop: 7 }}
> >
已选:{' '} 已选:{" "}
{checkItems {checkItems
.map((item) => { .map((item) => {
return item.specName return item.specName;
}) })
.join('+')} .join("+")}
</div> </div>
</Col> </Col>
</Row> </Row>
...@@ -193,7 +169,7 @@ export default function IntentionModal(props: Props) { ...@@ -193,7 +169,7 @@ export default function IntentionModal(props: Props) {
> >
{item.goodsSpecName} {item.goodsSpecName}
</div> </div>
<Space size={10} direction="vertical" style={{ width: '100%' }}> <Space size={10} direction="vertical" style={{ width: "100%" }}>
{item.productSpecList?.map((product, productSpecIndex) => { {item.productSpecList?.map((product, productSpecIndex) => {
return ( return (
<Row <Row
...@@ -206,10 +182,10 @@ export default function IntentionModal(props: Props) { ...@@ -206,10 +182,10 @@ export default function IntentionModal(props: Props) {
border: checkedMap[ border: checkedMap[
`${goodsSpecIndex},${productSpecIndex}` `${goodsSpecIndex},${productSpecIndex}`
] ]
? '1px solid #FF552D' ? "1px solid #FF552D"
: '1px solid #d6d6d6', : "1px solid #d6d6d6",
height: 50, height: 50,
cursor: 'pointer', cursor: "pointer",
}} }}
onClick={() => onClick={() =>
addProductSpec(goodsSpecIndex, productSpecIndex) addProductSpec(goodsSpecIndex, productSpecIndex)
...@@ -231,27 +207,14 @@ export default function IntentionModal(props: Props) { ...@@ -231,27 +207,14 @@ export default function IntentionModal(props: Props) {
{product.specName} {product.specName}
</Col> </Col>
</Row> </Row>
) );
})} })}
</Space> </Space>
</div> </div>
) );
})} })}
<div className={styles.numBox}>
<div className={styles.numLeft}>
<div className={styles.label}>租赁数量</div>
</div>
<div className={styles.numRight}>
<InputNumber
min={1}
max={100}
value={numValue}
onChange={onChangeNum}
/>
</div>
</div>
</div> </div>
</div> </div>
</Modal> </Modal>
) );
} }
pages/mall/detail/components/orderForGoods/index.tsx
...@@ -177,7 +177,7 @@ export default function OrderForGoods(props: PropsBox) { ...@@ -177,7 +177,7 @@ export default function OrderForGoods(props: PropsBox) {
</div> </div>
</div> </div>
{mallDetail.orderGoodsProdDetailDTOS.map((item: any) => ( {mallDetail.orderGoodsProdDetailDTOS.map((item: any) => (
<div className="table-body"> <div className="table-body" key={item.id}>
<div className="body-item article" style={{ width: 290 }}> <div className="body-item article" style={{ width: 290 }}>
<div className="image"> <div className="image">
<Image <Image
......
pages/personalCenter/components/sider/index.tsx
...@@ -26,15 +26,15 @@ const items: MenuItem[] = [ ...@@ -26,15 +26,15 @@ const items: MenuItem[] = [
getItem("服务订单", "/personalCenter/servicesOrders"), getItem("服务订单", "/personalCenter/servicesOrders"),
getItem("租赁订单", "/personalCenter/leasingOrders"), getItem("租赁订单", "/personalCenter/leasingOrders"),
getItem("商城订单", "/personalCenter/mallOrders"), getItem("商城订单", "/personalCenter/mallOrders"),
getItem("培训订单", "/personalCenter/trainOrders"), // getItem("培训订单", "/personalCenter/trainOrders"),
]), ]),
getItem("账户信息", "2"), /* getItem("账户信息", "2"),
getItem("优惠券卡包", "3"), getItem("优惠券卡包", "3"),
getItem("福利活动", "4"), getItem("福利活动", "4"),
getItem("身份认证", "5"), getItem("身份认证", "5"),
getItem("客服中心", "6"), getItem("客服中心", "6"),
getItem("推广海报", "7"), getItem("推广海报", "7"),
getItem("副业赚钱", "8"), getItem("副业赚钱", "8"), */
]; ];
type MenuItem = Required<MenuProps>["items"][number]; type MenuItem = Required<MenuProps>["items"][number];
......
pages/personalCenter/leasingOrders/index.page.tsx
...@@ -20,6 +20,7 @@ import api, { LeasingList, ListTranStatusResp } from "./api"; ...@@ -20,6 +20,7 @@ import api, { LeasingList, ListTranStatusResp } from "./api";
import moment from "moment"; import moment from "moment";
import PayModal from "./components/payModal"; import PayModal from "./components/payModal";
import RefundModal from "./components/refundModal"; import RefundModal from "./components/refundModal";
import Moment from 'moment';
const items: TabsProps["items"] = [ const items: TabsProps["items"] = [
{ {
...@@ -221,7 +222,15 @@ export default function LeasingOrders() { ...@@ -221,7 +222,15 @@ export default function LeasingOrders() {
background: "#EBF8FF", background: "#EBF8FF",
}} }}
> >
<div className={styles.font2}>2021-10-21 12:21:10</div> <div className={styles.font2}>
<Space size={10}>
<div>
{Moment(item.startDate).format("YYYY-MM-DD")} 至{" "}
{Moment(item.endDate).format("YYYY-MM-DD")}
</div>
<div>订单编号: {item.orderNo}</div>
</Space>{" "}
</div>
<div className={styles.font3}> <div className={styles.font3}>
{ {
tranStatusMap.find( tranStatusMap.find(
......
pages/personalCenter/mallOrders/index.page.tsx
...@@ -141,8 +141,19 @@ export default function LeasingOrder() { ...@@ -141,8 +141,19 @@ export default function LeasingOrder() {
background: "#EBF8FF", background: "#EBF8FF",
}} }}
> >
<div className={styles.font2}>{item.createTime}</div> <div className={styles.font2}>
<div className={styles.font3}>{tranStatusMap.find(status => status.code === item.statusCode)?.status}</div> <Space size={10}>
<div>{item.createTime}</div>
<div>订单编号: {item.orderNo}</div>
</Space>
</div>
<div className={styles.font3}>
{
tranStatusMap.find(
(status) => status.code === item.statusCode
)?.status
}
</div>
</Row> </Row>
<Row <Row
style={{ minHeight: 100, border: "1px solid #D0EAF5" }} style={{ minHeight: 100, border: "1px solid #D0EAF5" }}
......
pages/personalCenter/servicesOrders/api/index.ts
...@@ -15,6 +15,7 @@ export interface QueryOrderTaskListResp { ...@@ -15,6 +15,7 @@ export interface QueryOrderTaskListResp {
} }
export interface OrderList { export interface OrderList {
id: number;
address: string; address: string;
city: string; city: string;
endTime: string; endTime: string;
...@@ -29,6 +30,7 @@ export interface OrderList { ...@@ -29,6 +30,7 @@ export interface OrderList {
province: string; province: string;
startTime: string; startTime: string;
taskDescription: string; taskDescription: string;
coverPlan: string;
} }
......
pages/personalCenter/servicesOrders/index.page.tsx
...@@ -18,7 +18,7 @@ import LayoutView from "~/components/layout"; ...@@ -18,7 +18,7 @@ import LayoutView from "~/components/layout";
import Sider from "../components/sider"; import Sider from "../components/sider";
import api, { OrderList, GetServiceOrderStatusResp } from "./api"; import api, { OrderList, GetServiceOrderStatusResp } from "./api";
import styles from "./index.module.scss"; import styles from "./index.module.scss";
import Moment from 'moment'; import Moment from "moment";
const items: TabsProps["items"] = [ const items: TabsProps["items"] = [
{ {
...@@ -55,7 +55,9 @@ export default function ServicesOrder() { ...@@ -55,7 +55,9 @@ export default function ServicesOrder() {
const [orderList, setOrderList] = useState<OrderList[]>([]); const [orderList, setOrderList] = useState<OrderList[]>([]);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [orderNo, setOrderNo] = useState<string | undefined>(); const [orderNo, setOrderNo] = useState<string | undefined>();
const [tranStatusMap, setTranStatusMap] = useState<GetServiceOrderStatusResp[]>([]); //订单状态字典 const [tranStatusMap, setTranStatusMap] = useState<
GetServiceOrderStatusResp[]
>([]); //订单状态字典
//获取订单状态字典 //获取订单状态字典
useEffect(() => { useEffect(() => {
...@@ -87,6 +89,7 @@ export default function ServicesOrder() { ...@@ -87,6 +89,7 @@ export default function ServicesOrder() {
} }
) )
.then((res) => { .then((res) => {
console.log(", res.result?.list", res.result?.list);
setOrderList(res.result?.list || []); setOrderList(res.result?.list || []);
setTotal(res.result?.totalCount || 0); setTotal(res.result?.totalCount || 0);
setLoading(false); setLoading(false);
...@@ -132,7 +135,7 @@ export default function ServicesOrder() { ...@@ -132,7 +135,7 @@ export default function ServicesOrder() {
<ul className={styles.orderList} style={{ minHeight: 650 }}> <ul className={styles.orderList} style={{ minHeight: 650 }}>
{orderList.map((item) => { {orderList.map((item) => {
return ( return (
<li key={item.inspectionId} className={styles.orderItem}> <li key={item.id} className={styles.orderItem}>
<Row <Row
justify="space-between" justify="space-between"
align="middle" align="middle"
...@@ -143,8 +146,13 @@ export default function ServicesOrder() { ...@@ -143,8 +146,13 @@ export default function ServicesOrder() {
}} }}
> >
<div className={styles.font2}> <div className={styles.font2}>
{Moment(item.startTime).format("YYYY/MM/DD")} -{" "} <Space size={10}>
{Moment(item.endTime).format("YYYY/MM/DD")} <div>
{Moment(item.startTime).format("YYYY-MM-DD")} 至{" "}
{Moment(item.endTime).format("YYYY-MM-DD")}
</div>
<div>订单编号: {item.orderNo}</div>
</Space>
</div> </div>
<div className={styles.font3}> <div className={styles.font3}>
{ {
...@@ -165,7 +173,7 @@ export default function ServicesOrder() { ...@@ -165,7 +173,7 @@ export default function ServicesOrder() {
height={80} height={80}
preview={false} preview={false}
fallback={errImg} fallback={errImg}
src={item.images[0]} src={item.coverPlan}
></Image> ></Image>
</div> </div>
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论