Skip to content

W
web-ci-test
提交 e5010826 作者: 翁进城
操作

Merge branch 'master' into feature/chuck

上级 581dd0cb 976c4da9
正在显示 包含 1415 行增加 和 476 行删除
components/NavHeader/index.tsx
...@@ -125,23 +125,11 @@ export default function NavHeader(props: Props) { ...@@ -125,23 +125,11 @@ export default function NavHeader(props: Props) {
menu={{ menu={{
items: [ items: [
{ {
key: "3",
label: (
<div
onClick={() =>
router.push("/personalCenter/leasingOrders")
}
>
租赁订单
</div>
),
},
{
key: "2", key: "2",
label: ( label: (
<div <div
onClick={() => onClick={() =>
router.push("/personalCenter/mallOrders") router.push("/personalCenter/servicesOrders")
} }
> >
我的订单 我的订单
......
components/filter/api/index.ts
import request, { Response } from "~/api/request"; import request, { Response } from '~/api/request'
export interface FilterOptionResp { export interface FilterOptionResp {
id: number; id: number
name?: string; name?: string
appName?: string; appName?: string
} }
export interface RegionResp { export interface RegionResp {
childInfo: RegionResp[] | null; childInfo: RegionResp[] | null
id: number; id: number
level: number; level: number
name: string; name: string
pid: number; pid: number
}
export interface InfoList {
id: number
directoryId: number
name: string
icon: string
}
export interface TypesResp {
directoryId: number
name: string
categoriesInfoListDTO: InfoList[]
} }
export default { export default {
category: (): Promise<Response<Array<FilterOptionResp>>> => { category: (): Promise<Response<Array<FilterOptionResp>>> => {
return request("/pms/webProductMall/category"); return request('/pms/webProductMall/category')
}, },
categoryId: (): Promise<Response<Array<FilterOptionResp>>> => { categoryId: (): Promise<Response<Array<FilterOptionResp>>> => {
return request("/pms/webDevice/category"); return request('/pms/webDevice/category')
}, },
brand: (): Promise<Response<Array<FilterOptionResp>>> => { brand: (): Promise<Response<Array<FilterOptionResp>>> => {
return request("/pms/webDevice/brand"); return request('/pms/webDevice/brand')
}, },
model: (): Promise<Response<Array<FilterOptionResp>>> => { model: (): Promise<Response<Array<FilterOptionResp>>> => {
return request("/pms/webDevice/model"); return request('/pms/webDevice/model')
}, },
part: (): Promise<Response<Array<FilterOptionResp>>> => { part: (): Promise<Response<Array<FilterOptionResp>>> => {
return request("/pms/webProductMall/parts"); return request('/pms/webProductMall/parts')
}, },
quality: (): Promise<Response<Array<FilterOptionResp>>> => { quality: (): Promise<Response<Array<FilterOptionResp>>> => {
return request("/pms/webProductMall/quality"); return request('/pms/webProductMall/quality')
}, },
region: (): Promise<Response<Array<RegionResp>>> => { region: (): Promise<Response<Array<RegionResp>>> => {
return request("/pms/webDevice/getSecondDistrictInfo"); return request('/pms/webDevice/getSecondDistrictInfo')
}, },
industry: (): Promise<Response<Array<RegionResp>>> => { industry: (): Promise<Response<Array<RegionResp>>> => {
return request("/release/work/listAllIndustry"); return request('/release/work/listAllIndustry')
}, },
appType: (): Promise<Response<Array<RegionResp>>> => { appType: (): Promise<Response<Array<RegionResp>>> => {
return request("/release/work/listAllAppType"); return request('/release/work/listAllAppType')
}, },
deviceBrand: (): Promise<Response<Array<RegionResp>>> => { deviceBrand: (): Promise<Response<Array<RegionResp>>> => {
return request("/pms/webDevice/deviceBrand"); return request('/pms/webDevice/deviceBrand')
}, },
deviceModel: (): Promise<Response<Array<RegionResp>>> => { deviceModel: (): Promise<Response<Array<RegionResp>>> => {
return request("/pms/webDevice/deviceModel"); return request('/pms/webDevice/deviceModel')
}, },
}; infoByType: (params: {
type: number
}): Promise<Response<Array<TypesResp>>> => {
return request('/pms/classify/queryCategoryInfoByType', 'get', params)
},
}
components/filter/compoents/regionItem/index.tsx
import { Space, Select } from "antd"; import { Space, Select } from 'antd'
import { useEffect, useState } from "react"; import { useEffect, useState } from 'react'
import styles from "../../index.module.scss"; import styles from '../../index.module.scss'
import api, { RegionResp } from "../../api"; import api, { RegionResp } from '../../api'
type Props = { type Props = {
onChange: (item: RegionResp) => void; onChange: (item: RegionResp) => void
}; }
export default function RegionItem(props: Props) { export default function RegionItem(props: Props) {
const [provinceList, setProvinceList] = useState<RegionResp[]>([]); const [provinceList, setProvinceList] = useState<RegionResp[]>([])
const [cityList, setCityList] = useState<RegionResp[]>([]); const [cityList, setCityList] = useState<RegionResp[]>([])
const [selectCity, setSelectCity] = useState<number>() const [selectCity, setSelectCity] = useState<number>()
useEffect(() => { useEffect(() => {
api.region().then((res) => { api.region().then((res) => {
setProvinceList(res?.result || []); setProvinceList(res?.result || [])
}); })
}, []); }, [])
const onProvinceChange = (value: number, item: any) => { const onProvinceChange = (value: number, item: any) => {
console.log("省", value, item); console.log('省', value, item)
setCityList(item.childInfo || []); setCityList(item.childInfo || [])
setSelectCity(undefined); setSelectCity(undefined)
props.onChange(item); props.onChange(item)
}; }
const onCityChange = (value: number, item: any) => { const onCityChange = (value: number, item: any) => {
console.log("市", value); console.log('市', value)
setSelectCity(value); setSelectCity(value)
props.onChange(item); props.onChange(item)
}; }
return ( return (
<div className={styles.filterItem}> <div className={styles.filterItem}>
<div className={styles.filterItemTitle}>地域：</div> <div className={styles.filterItemTitle}>地域：</div>
...@@ -44,7 +44,7 @@ export default function RegionItem(props: Props) { ...@@ -44,7 +44,7 @@ export default function RegionItem(props: Props) {
...item, ...item,
value: item.id, value: item.id,
label: item.name, label: item.name,
}; }
})} })}
/> />
{/* <Select {/* <Select
...@@ -64,5 +64,5 @@ export default function RegionItem(props: Props) { ...@@ -64,5 +64,5 @@ export default function RegionItem(props: Props) {
</Space> </Space>
</div> </div>
</div> </div>
); )
} }
components/filter/compoents/resultItem/index.tsx
import { Space, Tag } from "antd"; import { Space, Tag } from 'antd'
import { FilterResult } from "../.."; import { FilterResult } from '../..'
import styles from "../../index.module.scss"; import styles from '../../index.module.scss'
import { InfoList } from '../../api'
type Props = { type Props = {
data: FilterResult; data: FilterResult
onDel: (key: string) => void; onDel: (key: string | number) => void
}; }
export default function ResultItem({data, onDel}: Props) { export default function ResultItem({ data, onDel }: Props) {
return ( return (
<div className={styles.filterItem}> <div className={styles.filterItem}>
<div className={styles.filterItemTitle}>已选：</div> <div className={styles.filterItemTitle}>已选：</div>
<div className={styles.filterItemMain}> <div className={styles.filterItemMain}>
<Space size={10}> <Space size={10}>
{data && {data.provinceId && (
Object.keys(data).map((key) => { // Object.keys(data).map((key) => {
//@ts-ignore // //@ts-ignore
let item = data[key]; // let item = data[key]
// return (
// <Tag
// closable
// onClose={(e: React.MouseEvent<HTMLElement, MouseEvent>) => {
// onDel(key)
// }}
// key={key}
// >
// {item?.name}
// </Tag>
// )
// })
<Tag
closable
onClose={(e: React.MouseEvent<HTMLElement, MouseEvent>) => {
onDel('provinceId')
}}
key={data.provinceId.id}
>
{data.provinceId.name}
</Tag>
)}
{data.categoryId &&
data.categoryId.map((item: InfoList, index) => {
return ( return (
<Tag <Tag
closable closable
onClose={(e: React.MouseEvent<HTMLElement, MouseEvent>) => { onClose={(e: React.MouseEvent<HTMLElement, MouseEvent>) => {
onDel(key); onDel(item.id)
}} }}
key={key} key={item.name}
> >
{item?.name} {item?.name}
</Tag> </Tag>
); )
})} })}
</Space> </Space>
</div> </div>
</div> </div>
); )
} }
components/filter/compoents/typeInfo/index.tsx 0 → 100644
import { Space, Button, Select, Collapse } from 'antd'
import styles from '../../index.module.scss'
import api, { FilterOptionResp, InfoList } from '../../api'
import { useState, useEffect } from 'react'
type Props = {
onChange: (id: FilterOptionResp) => void
typeName: string
dataValue: InfoList[]
}
export default function CategoryItem(props: Props) {
const [data, setData] = useState<FilterOptionResp[]>([])
useEffect(() => {
setData(props.dataValue || [])
}, [])
const onClick = (item: FilterOptionResp) => {
props.onChange({
id: item.id,
name: `${props.typeName}：` + item.name,
})
}
const showCount = 14; //展示数量
return (
<div className={styles.filterItem}>
<div className={styles.filterItemTitle}>{props.typeName}：</div>
<div
className={`${styles.filterItemMain} ${
data.length <= showCount && styles.disabled
}`}
>
<Collapse
ghost
collapsible="icon"
expandIconPosition="end"
style={{ width: "100%" }}
>
<Collapse.Panel
header={
<Space size={[40, 0]}>
{data.slice(0, showCount).map((item) => {
return (
<Button
type="link"
key={item.id}
onClick={(e) => onClick(item)}
>
{item.name}
</Button>
);
})}
</Space>
}
key="1"
>
<Space size={40}>
{data.slice(showCount).map((item) => {
return (
<Button
type="link"
key={item.id}
onClick={(e) => onClick(item)}
>
{item.name}
</Button>
);
})}
</Space>
</Collapse.Panel>
</Collapse>
</div>
</div>
);
}
components/filter/index.module.scss
...@@ -31,6 +31,7 @@ ...@@ -31,6 +31,7 @@
flex: 1; flex: 1;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
overflow: hidden;
&.disabled { &.disabled {
:global .ant-collapse-expand-icon { :global .ant-collapse-expand-icon {
......
pages/equipmentLeasing/detail/[id].page.tsx
...@@ -52,12 +52,10 @@ export default function EquipmentLeasingDetail() { ...@@ -52,12 +52,10 @@ export default function EquipmentLeasingDetail() {
api api
.listDetailDeviceInfo({ .listDetailDeviceInfo({
goodsId: id, goodsId: id,
type: 1,
}) })
.then((res) => { .then((res) => {
setDetail(res.result || null) setDetail(res.result || null)
console.log(
res.result?.goodsSpec.map((item) => item.productSpecList).flat()
)
const wareList = res.result?.goodsSpec.map( const wareList = res.result?.goodsSpec.map(
(item) => item.productSpecList (item) => item.productSpecList
) )
...@@ -70,6 +68,7 @@ export default function EquipmentLeasingDetail() { ...@@ -70,6 +68,7 @@ export default function EquipmentLeasingDetail() {
}, [id]) }, [id])
//租赁弹框 //租赁弹框
const [visible, setVisible] = useState(false)
const [isModalOpen, setIsModalOpen] = useState(false) const [isModalOpen, setIsModalOpen] = useState(false)
const [isModalDateOpen, setIsModalDateOpen] = useState(false) const [isModalDateOpen, setIsModalDateOpen] = useState(false)
const [loading, setLoading] = useState(false) const [loading, setLoading] = useState(false)
...@@ -77,7 +76,7 @@ export default function EquipmentLeasingDetail() { ...@@ -77,7 +76,7 @@ export default function EquipmentLeasingDetail() {
const [form] = Form.useForm() const [form] = Form.useForm()
const [formDate] = Form.useForm() const [formDate] = Form.useForm()
const tagsData = [ const tagsData = [
{ label: '3-7天', disable: false }, { label: '1-7天', disable: false },
{ label: '8-15天', disable: false }, { label: '8-15天', disable: false },
{ label: '16-30天', disable: false }, { label: '16-30天', disable: false },
{ label: '30天以上', disable: false }, { label: '30天以上', disable: false },
...@@ -92,7 +91,7 @@ export default function EquipmentLeasingDetail() { ...@@ -92,7 +91,7 @@ export default function EquipmentLeasingDetail() {
if (wareSkuList?.length) { if (wareSkuList?.length) {
setSelectedTags(wareSkuList[0].id) setSelectedTags(wareSkuList[0].id)
form.setFieldValue('id', wareSkuList[0].id) form.setFieldValue('id', wareSkuList[0].id)
setSelectedTagsData('3-7天') setSelectedTagsData('1-7天')
form.setFieldValue('date', '3-7天') form.setFieldValue('date', '3-7天')
} }
} else { } else {
...@@ -152,7 +151,6 @@ export default function EquipmentLeasingDetail() { ...@@ -152,7 +151,6 @@ export default function EquipmentLeasingDetail() {
const nextWareSkuList = checked const nextWareSkuList = checked
? tag ? tag
: wareSkuList?.filter((t) => t.id !== tag)[0].id : wareSkuList?.filter((t) => t.id !== tag)[0].id
console.log('You are interested in: ', nextWareSkuList)
setSelectedTags(nextWareSkuList) setSelectedTags(nextWareSkuList)
form.setFieldValue('id', tag) form.setFieldValue('id', tag)
} }
...@@ -167,7 +165,6 @@ export default function EquipmentLeasingDetail() { ...@@ -167,7 +165,6 @@ export default function EquipmentLeasingDetail() {
const nextSelectedTags = checked const nextSelectedTags = checked
? tag ? tag
: tagsData.filter((t) => t.label !== tag)[0].label : tagsData.filter((t) => t.label !== tag)[0].label
console.log('You are interested in: ', nextSelectedTags)
setSelectedTagsData(nextSelectedTags) setSelectedTagsData(nextSelectedTags)
form.setFieldValue('date', tag) form.setFieldValue('date', tag)
} }
...@@ -274,6 +271,7 @@ export default function EquipmentLeasingDetail() { ...@@ -274,6 +271,7 @@ export default function EquipmentLeasingDetail() {
onOk={handleOk} onOk={handleOk}
onCancel={handleCancel} onCancel={handleCancel}
getContainer={false} getContainer={false}
maskClosable={false}
footer={[ footer={[
<Button <Button
style={{ width: '100%', height: 44 }} style={{ width: '100%', height: 44 }}
...@@ -287,11 +285,29 @@ export default function EquipmentLeasingDetail() { ...@@ -287,11 +285,29 @@ export default function EquipmentLeasingDetail() {
]} ]}
> >
<div className="title"> <div className="title">
<div className="left"></div> <div className="left">
<AImage
preview={{ visible: false }}
src={detail?.images[0].imgUrl}
onClick={() => setVisible(true)}
/>
<div style={{ display: 'none' }}>
<AImage.PreviewGroup
preview={{
visible,
onVisibleChange: (vis) => setVisible(vis),
}}
>
{detail?.images.map((item) => (
<AImage key={item.id} src={item.imgUrl} />
))}
</AImage.PreviewGroup>
</div>
</div>
<div className="right"> <div className="right">
<div className="top"> <div className="top">
<span className="tag">¥</span> <span className="tag">¥</span>
<span className="money">{detail?.price}</span> <span className="money">{detail?.price || 0}</span>
<span className="unit">/天</span> <span className="unit">/天</span>
</div> </div>
<div className="bottom">渠道免押金</div> <div className="bottom">渠道免押金</div>
...@@ -301,7 +317,7 @@ export default function EquipmentLeasingDetail() { ...@@ -301,7 +317,7 @@ export default function EquipmentLeasingDetail() {
form={form} form={form}
layout="vertical" layout="vertical"
name="application" name="application"
initialValues={{ modifier: 'public' }} initialValues={{ num: 1 }}
className="form-data" className="form-data"
> >
<Form.Item <Form.Item
...@@ -349,16 +365,10 @@ export default function EquipmentLeasingDetail() { ...@@ -349,16 +365,10 @@ export default function EquipmentLeasingDetail() {
<div className="num-box"> <div className="num-box">
<div className="num-left"> <div className="num-left">
<div className="label">租赁数量</div> <div className="label">租赁数量</div>
<div className="inventory">库存9件</div>
</div> </div>
<div className="num-right"> <div className="num-right">
<Form.Item style={{ flex: 1, marginRight: 16 }} name="num"> <Form.Item style={{ flex: 1, marginRight: 16 }} name="num">
<InputNumber <InputNumber min={1} max={10} onChange={onChangeNum} />
min={1}
max={10}
defaultValue={1}
onChange={onChangeNum}
/>
</Form.Item> </Form.Item>
</div> </div>
</div> </div>
...@@ -371,6 +381,7 @@ export default function EquipmentLeasingDetail() { ...@@ -371,6 +381,7 @@ export default function EquipmentLeasingDetail() {
onOk={handleOkDate} onOk={handleOkDate}
onCancel={handleCancel} onCancel={handleCancel}
getContainer={false} getContainer={false}
maskClosable={false}
width={420} width={420}
footer={[ footer={[
<Button <Button
...@@ -412,8 +423,8 @@ export default function EquipmentLeasingDetail() { ...@@ -412,8 +423,8 @@ export default function EquipmentLeasingDetail() {
<div className="bottom-item"> <div className="bottom-item">
<div className="label">租金合计</div> <div className="label">租金合计</div>
<div className="price"> <div className="price">
<div className="left">¥700</div> <div className="left">¥{detail?.price! * days! || 0}</div>
<div className="right">(日均175)</div> {/* <div className="right">(日均175)</div> */}
</div> </div>
</div> </div>
</Modal> </Modal>
...@@ -424,6 +435,9 @@ export default function EquipmentLeasingDetail() { ...@@ -424,6 +435,9 @@ export default function EquipmentLeasingDetail() {
shopDetail={shopDetail} shopDetail={shopDetail}
days={days} days={days}
detailData={detail} detailData={detail}
wareSkuList={wareSkuList?.filter(
(item) => item.id === form.getFieldValue('id')
)}
/> />
)} )}
</Layout> </Layout>
......
pages/equipmentLeasing/detail/api/index.tsx
...@@ -2,6 +2,11 @@ import request, { Response } from '~/api/request' ...@@ -2,6 +2,11 @@ import request, { Response } from '~/api/request'
export interface GetWebDeviceDetailParams { export interface GetWebDeviceDetailParams {
goodsId: number goodsId: number
type: 1
}
export interface GetLeaseGoodsParams {
leaseTerm: number //租赁时限：（输入0：1-7天、输入1：8-15天、输入2：16-30天、输入3：30天以上）
productSpecId: number
} }
export interface WareImgsType { export interface WareImgsType {
...@@ -9,7 +14,20 @@ export interface WareImgsType { ...@@ -9,7 +14,20 @@ export interface WareImgsType {
imgUrl: string imgUrl: string
imgType: number imgType: number
} }
export interface PriceType {
id: number
cooperationTag: number
price: number
productSpecId: number
leaseTerm: number
}
export interface GetLeaseGoodsResult {
productSpecId: number
type: number | null
leaseTerm: number
specPrice: PriceType
}
export interface GetWebDeviceDetailResult { export interface GetWebDeviceDetailResult {
id: number id: number
images: { images: {
...@@ -85,4 +103,10 @@ export default { ...@@ -85,4 +103,10 @@ export default {
): Promise<Response<number>> => { ): Promise<Response<number>> => {
return request('/pms/appDevice/update', 'post', params) return request('/pms/appDevice/update', 'post', params)
}, },
//web-设备租赁-详情-获取设备商品规格价格详情
GoodsPriceDetail: (
params: GetLeaseGoodsParams
): Promise<Response<GetLeaseGoodsResult>> => {
return request('/pms/product/mall/getLeaseGoodsPriceDetail', 'get', params)
},
} }
pages/equipmentLeasing/detail/components/orderForGoods/api/index.tsx
...@@ -40,9 +40,10 @@ export interface UserAddress { ...@@ -40,9 +40,10 @@ export interface UserAddress {
type: number type: number
} }
export interface GetWebDeviceWareSkuById { export interface GetOrderForGoods {
balance: number balance: number
nickName: string nickName: string
orderNo: string
} }
export default { export default {
...@@ -53,7 +54,13 @@ export default { ...@@ -53,7 +54,13 @@ export default {
//web-设备租赁-下单 //web-设备租赁-下单
FeignAddLease: ( FeignAddLease: (
params: GetWebDeviceDetailParams params: GetWebDeviceDetailParams
): Promise<Response<GetWebDeviceWareSkuById[]>> => { ): Promise<Response<GetOrderForGoods>> => {
return request('/pms/appDevice/listWareSkuById', 'post', params) return request('/oms/RentalOrders/feignAddLease', 'post', params)
},
//web-设备租赁-订单支付
OrderPayment: (params: {
orderNo: string
}): Promise<Response<GetOrderForGoods>> => {
return request(`/payment/repocash/orderPayment`, 'get', params)
}, },
} }
pages/equipmentLeasing/detail/components/orderForGoods/index.tsx
import React, { useEffect, useState } from 'react' import React, { useContext, useEffect, useState } from 'react'
import { OrderForGoodsBox } from './styled' import { OrderForGoodsBox } from './styled'
import type { FormInstance, RadioChangeEvent } from 'antd' import type { FormInstance, RadioChangeEvent } from 'antd'
import { Button, Radio, Space, Input, message } from 'antd' import { Button, Radio, Space, Input, message, Modal, Image } from 'antd'
import api, { UserAddress } from './api' import api, { UserAddress, GetOrderForGoods } from './api'
import moment from 'moment' import moment from 'moment'
import { ShopDetail } from '../../[id].page' import { ShopDetail } from '../../[id].page'
import { GetWebDeviceDetailResult } from '../../api' import { GetWebDeviceDetailResult, GetWebDeviceWareSkuById } from '../../api'
import { UserContext } from '~/lib/userProvider'
const { TextArea } = Input const { TextArea } = Input
interface PropsBox { interface PropsBox {
...@@ -13,14 +14,17 @@ interface PropsBox { ...@@ -13,14 +14,17 @@ interface PropsBox {
detailData?: GetWebDeviceDetailResult | null detailData?: GetWebDeviceDetailResult | null
days?: number days?: number
shopDetail?: ShopDetail shopDetail?: ShopDetail
wareSkuList?: GetWebDeviceWareSkuById[]
} }
export default function OrderForGoods(props: PropsBox) { export default function OrderForGoods(props: PropsBox) {
const { setIsorderForGoods, shopDetail, days, detailData } = props const { setIsorderForGoods, shopDetail, days, detailData, wareSkuList } =
props
const [value, setValue] = useState(1) const [value, setValue] = useState(1)
const [areaValue, setAreaValue] = useState<string>() const [areaValue, setAreaValue] = useState<string>()
const [list, setList] = useState<Array<UserAddress> | null>() const [list, setList] = useState<Array<UserAddress> | null>()
const [detail, setDetail] = useState<ShopDetail>() const [detail, setDetail] = useState<ShopDetail>()
const onChange = (e: RadioChangeEvent) => { const onChange = (e: RadioChangeEvent) => {
console.log('radio checked', e.target.value) console.log('radio checked', e.target.value)
setValue(e.target.value) setValue(e.target.value)
...@@ -29,20 +33,10 @@ export default function OrderForGoods(props: PropsBox) { ...@@ -29,20 +33,10 @@ export default function OrderForGoods(props: PropsBox) {
setValue(index) setValue(index)
} }
const detailSumbit = () => { const detailSumbit = () => {
message.success('提交成功') if (detailData && shopDetail && list && wareSkuList) {
console.log(shopDetail)
console.log(list![value])
console.log(areaValue)
console.log(detailData)
console.log(list![value].takeAddress)
console.log(list![value].takeRegion)
console.log(list![value].takeName)
console.log(Number(list![value].takePhone))
if (detailData && shopDetail && list) {
const pushList = { const pushList = {
actualPay: shopDetail.num * detailData.price!, // actualPay: shopDetail.num * detailData.price!,
actualPay: 100,
deposit: 0, deposit: 0,
endDate: moment(new Date(shopDetail.dateDetail[1])).format( endDate: moment(new Date(shopDetail.dateDetail[1])).format(
'YYYY-MM-DD' 'YYYY-MM-DD'
...@@ -54,12 +48,14 @@ export default function OrderForGoods(props: PropsBox) { ...@@ -54,12 +48,14 @@ export default function OrderForGoods(props: PropsBox) {
takeName: list[value].takeName, takeName: list[value].takeName,
takePhone: Number(list[value].takePhone), takePhone: Number(list[value].takePhone),
}, },
rentPrice: shopDetail.num * detailData.price!, // rentPrice: shopDetail.num * detailData.price!,
returnDate: moment(new Date(shopDetail.dateDetail[1])).format( rentPrice: 100,
'YYYY-MM-DD' returnDate: moment(
), new Date(shopDetail.dateDetail[1]).getTime() + 864e5
shouldPay: shopDetail.num * detailData.price!, ).format('YYYY-MM-DD'),
specsId: shopDetail.id, // shouldPay: shopDetail.num * detailData.price!,
shouldPay: 100,
specsId: wareSkuList[0].productSpec,
startDate: moment(new Date(shopDetail.dateDetail[0]!)).format( startDate: moment(new Date(shopDetail.dateDetail[0]!)).format(
'YYYY-MM-DD' 'YYYY-MM-DD'
), ),
...@@ -73,10 +69,15 @@ export default function OrderForGoods(props: PropsBox) { ...@@ -73,10 +69,15 @@ export default function OrderForGoods(props: PropsBox) {
} }
api.FeignAddLease(pushList).then((res) => { api.FeignAddLease(pushList).then((res) => {
console.log(res) if (res.code === '200') {
message.success('提交成功')
setPaymentDetail(res.result)
setIsPaymentOpen(true)
} else {
message.error(res.message)
}
}) })
} }
// setIsorderForGoods(false)
} }
useEffect(() => { useEffect(() => {
...@@ -100,6 +101,39 @@ export default function OrderForGoods(props: PropsBox) { ...@@ -100,6 +101,39 @@ export default function OrderForGoods(props: PropsBox) {
setDetail(shopDetail) setDetail(shopDetail)
} }
}, []) }, [])
//图片预览
const [visible, setVisible] = useState(false)
//付款
const { userInfo } = useContext(UserContext)
const [loading, setLoading] = useState(false)
const [isPaymentOpen, setIsPaymentOpen] = useState(false)
const [paymentDetail, setPaymentDetail] = useState<GetOrderForGoods | null>()
const handleCancel = () => {
setIsPaymentOpen(false)
}
const handleOkPayment = () => {
setLoading(true)
if (paymentDetail?.orderNo) {
const date = new FormData()
api.OrderPayment({ orderNo: paymentDetail?.orderNo }).then((res) => {
if (res.code === '200') {
message.success('付款成功')
setLoading(false)
setIsorderForGoods(false)
handleCancel()
} else {
message.error(res.message)
setLoading(false)
}
})
} else {
message.error('出错了')
setLoading(false)
}
}
return ( return (
<OrderForGoodsBox> <OrderForGoodsBox>
<div className="address"> <div className="address">
...@@ -162,21 +196,33 @@ export default function OrderForGoods(props: PropsBox) { ...@@ -162,21 +196,33 @@ export default function OrderForGoods(props: PropsBox) {
</div> </div>
<div className="table-body"> <div className="table-body">
<div className="body-item article" style={{ width: 290 }}> <div className="body-item article" style={{ width: 290 }}>
<div className="image"></div> <div className="image">
<div className="right"> <Image
<div className="top"> preview={{ visible: false }}
智多星航电版智多星航电版智多星航电版智多 src={wareSkuList![0].specImage}
</div> onClick={() => setVisible(true)}
<div className="bottom"> />
商品简介商品简介商品简介商品简介商品简介 <div style={{ display: 'none' }}>
<Image.PreviewGroup
preview={{
visible,
onVisibleChange: (vis) => setVisible(vis),
}}
>
<Image src={wareSkuList![0].specImage} />
</Image.PreviewGroup>
</div> </div>
</div> </div>
<div className="right">
<div className="top">{wareSkuList![0].specName}</div>
<div className="bottom">{wareSkuList![0].versionDesc}</div>
</div>
</div> </div>
<div className="body-item" style={{ width: 130 }}> <div className="body-item" style={{ width: 130 }}>
800.00/天 {detailData?.price || 0}
</div> </div>
<div className="body-item" style={{ width: 130 }}> <div className="body-item" style={{ width: 130 }}>
1 {shopDetail?.num || 1}
</div> </div>
<div className="body-item lease-term" style={{ width: 300 }}> <div className="body-item lease-term" style={{ width: 300 }}>
{moment(new Date(shopDetail?.dateDetail[0]!)).format( {moment(new Date(shopDetail?.dateDetail[0]!)).format(
...@@ -188,7 +234,7 @@ export default function OrderForGoods(props: PropsBox) { ...@@ -188,7 +234,7 @@ export default function OrderForGoods(props: PropsBox) {
)} )}
</div> </div>
<div className="body-item total-price" style={{ width: 135 }}> <div className="body-item total-price" style={{ width: 135 }}>
800.00 {detailData?.price! * shopDetail?.num! || 0}
</div> </div>
</div> </div>
</div> </div>
...@@ -210,14 +256,14 @@ export default function OrderForGoods(props: PropsBox) { ...@@ -210,14 +256,14 @@ export default function OrderForGoods(props: PropsBox) {
<div className="label">运费：</div> <div className="label">运费：</div>
<div className="value">邮寄到付,由客户自己承担</div> <div className="value">邮寄到付,由客户自己承担</div>
</div> </div>
<div className="price">200.00</div> <div className="price">0.00</div>
</div> </div>
<div className="bottom"> <div className="bottom">
<div className="font"> <div className="font">
<div className="label">押金：</div> <div className="label">押金：</div>
<div className="value">渠道商可免押金</div> <div className="value">渠道商可免押金</div>
</div> </div>
<div className="price">1000.00</div> <div className="price">0.00</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -230,9 +276,9 @@ export default function OrderForGoods(props: PropsBox) { ...@@ -230,9 +276,9 @@ export default function OrderForGoods(props: PropsBox) {
</div> </div>
<div className="bottom"> <div className="bottom">
<div className="value">寄送至</div> <div className="value">寄送至</div>
<div className="value-content"> {list ? (
广东省深圳市南山区国际创谷6栋国际创谷6 <div className="value-content">{list![value].takeAddress}</div>
</div> ) : null}
</div> </div>
</div> </div>
<div className="detail-sumbit"> <div className="detail-sumbit">
...@@ -242,6 +288,31 @@ export default function OrderForGoods(props: PropsBox) { ...@@ -242,6 +288,31 @@ export default function OrderForGoods(props: PropsBox) {
</div> </div>
</div> </div>
</div> </div>
<Modal
wrapClassName="Payment"
open={isPaymentOpen}
onOk={handleOkPayment}
onCancel={handleCancel}
getContainer={false}
maskClosable={false}
width={420}
footer={[
<Button
style={{ width: '100%', height: 44 }}
key="submit"
type="primary"
loading={loading}
onClick={handleOkPayment}
>
立即付款
</Button>,
]}
>
<div className="title">￥{detailData?.price! * days!}</div>
<div>云享飞账号： {userInfo?.uid}</div>
<div>付款方式： 可用(￥{paymentDetail?.balance})</div>
</Modal>
</OrderForGoodsBox> </OrderForGoodsBox>
) )
} }
pages/equipmentLeasing/detail/components/orderForGoods/styled.tsx
...@@ -300,4 +300,13 @@ export const OrderForGoodsBox = styled.div` ...@@ -300,4 +300,13 @@ export const OrderForGoodsBox = styled.div`
} }
} }
} }
.Payment {
.title {
text-align: center;
font-size: 26px;
font-family: MicrosoftYaHeiUI-Bold, MicrosoftYaHeiUI;
font-weight: bold;
color: #ff552d;
}
}
` `
pages/equipmentLeasing/detail/styled.tsx
...@@ -234,12 +234,6 @@ export const Box = styled.div` ...@@ -234,12 +234,6 @@ export const Box = styled.div`
color: #121212; color: #121212;
margin-right: 5px; margin-right: 5px;
} }
.inventory {
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #acacac;
}
} }
} }
} }
......
pages/equipmentLeasing/index.page.tsx
...@@ -19,7 +19,6 @@ type Props = {} ...@@ -19,7 +19,6 @@ type Props = {}
export default function EquipmentLeasing(props: Props) { export default function EquipmentLeasing(props: Props) {
const router = useRouter() const router = useRouter()
const filter = useRef<any>()
const [productList, setProductList] = useState( const [productList, setProductList] = useState(
Array<{ element: JSX.Element }> Array<{ element: JSX.Element }>
) )
...@@ -85,12 +84,9 @@ export default function EquipmentLeasing(props: Props) { ...@@ -85,12 +84,9 @@ export default function EquipmentLeasing(props: Props) {
//端口列表请求 //端口列表请求
useEffect(() => { useEffect(() => {
let queryVal = JSON.parse(JSON.stringify(router.query)) let queryVal = JSON.parse(JSON.stringify(router.query))
const idArr = filter.current.idArr
let rs let rs
for (const key in queryVal) { if (Object.keys(queryVal).length) {
if (idArr.includes(key)) { rs = { categoryId: [Number(queryVal['categoryId'])] }
rs = { [key]: router.query[key] }
}
} }
api api
.listPageDeviceInfo( .listPageDeviceInfo(
...@@ -118,6 +114,9 @@ export default function EquipmentLeasing(props: Props) { ...@@ -118,6 +114,9 @@ export default function EquipmentLeasing(props: Props) {
adapterFilterResult: AdapterResult adapterFilterResult: AdapterResult
) => { ) => {
console.log('filterResult', filterResult, adapterFilterResult) console.log('filterResult', filterResult, adapterFilterResult)
adapterFilterResult.categoryId = adapterFilterResult.categoryId?.map(
(item) => item.id
)
setFilterResult(adapterFilterResult) setFilterResult(adapterFilterResult)
} }
...@@ -133,13 +132,8 @@ export default function EquipmentLeasing(props: Props) { ...@@ -133,13 +132,8 @@ export default function EquipmentLeasing(props: Props) {
useEffect(() => { useEffect(() => {
let queryVal = JSON.parse(JSON.stringify(router.query)) let queryVal = JSON.parse(JSON.stringify(router.query))
if (router.query) { if (Object.keys(router.query).length) {
const idArr = filter.current.idArr setFilterResult({ categoryId: [Number(queryVal['categoryId'])] })
for (const key in queryVal) {
if (idArr.includes(key)) {
setFilterResult({ [key]: router.query[key] })
}
}
} }
}, [router]) }, [router])
...@@ -150,7 +144,6 @@ export default function EquipmentLeasing(props: Props) { ...@@ -150,7 +144,6 @@ export default function EquipmentLeasing(props: Props) {
types={['地域', '设备品牌', '设备型号']} types={['地域', '设备品牌', '设备型号']}
showResultItem showResultItem
onChange={onFilterChange} onChange={onFilterChange}
ref={filter}
></Filter> ></Filter>
<div style={{ paddingTop: 13 }}> <div style={{ paddingTop: 13 }}>
<ContentBox <ContentBox
......
pages/flyingHandService/api/index.tsx
import request, { Response } from '~/api/request'; import request, { Response } from '~/api/request'
import { TypesResp } from '~/components/filter/api'
export interface ListPageFlyingInfoParams { export interface ListPageFlyingInfoParams {
pageNo: number, pageNo: number
pageSize: number, pageSize: number
flightSkillsId?:number, flightSkillsId?: number
licenseId?:number, licenseId?: number
regionId?:number regionId?: number
} }
export interface Flying { export interface Flying {
id: number, id: number
price: number, price: number
supplierName: string, supplierName: string
curriculumName: string, curriculumName: string
free: 0 | 1, free: 0 | 1
curriculumDesc: string, curriculumDesc: string
videoUrl: string videoUrl: string
} }
export interface ListPageFlyingInfoResp { export interface ListPageFlyingInfoResp {
pageNo: 1, pageNo: 1
pageSize: 10, pageSize: 10
list: Array<Flying>, list: Array<Flying>
totalCount: 0, totalCount: 0
totalPage: 0 totalPage: 0
} }
export interface SkillsType { export interface SkillsType {
type: string; type: string
id: number, id: number
skillsName: string, skillsName: string
label:string | number, label: string | number
value:string | number value: string | number
} }
export interface RegionResp { export interface RegionResp {
childInfo: RegionResp[] | null, childInfo: RegionResp[] | null
id: number, id: number
level: number, level: number
name: string, name: string
pid: number pid: number
} }
export interface PilotRegistrationParams { export interface PilotRegistrationParams {
city?: number, city?: number
drivingLicense?: number, drivingLicense?: number
industryAppAuth?: Array<number>, industryAppAuth?: Array<number>
province?: number, province?: number
remark?: string, remark?: string
telephone?: string, telephone?: string
uavLicenseLevelOne?: number, uavLicenseLevelOne?: number
uavLicenseLevelTwo?: number uavLicenseLevelTwo?: number
} }
export default { export default {
//web-作业服务-分页 //web-飞手培训-分页
listPageJobServicesInfo: (params: ListPageFlyingInfoParams): Promise<Response<ListPageFlyingInfoResp>> => { listPageJobServicesInfo: (
return request('/release/curriculum/queryCurriculumInfoList', 'post', params) params: ListPageFlyingInfoParams
): Promise<Response<ListPageFlyingInfoResp>> => {
return request(
'/release/curriculum/queryCurriculumInfoList',
'post',
params
)
}, },
region: (): Promise<Response<Array<RegionResp>>> => { region: (): Promise<Response<Array<RegionResp>>> => {
return request('/pms/webDevice/getSecondDistrictInfo'); return request('/pms/webDevice/getSecondDistrictInfo')
}, },
PilotLicense: (): Promise<Response<Array<RegionResp>>> => { PilotLicense: (): Promise<Response<Array<RegionResp>>> => {
return request('/release/curriculum/getDronePilotLicense'); return request('/release/curriculum/getDronePilotLicense')
}, },
IndustryFlightSkills: (): Promise<Response<Array<SkillsType>>> => { IndustryFlightSkills: (): Promise<Response<Array<SkillsType>>> => {
return request('/release/curriculum/getIndustryFlightSkills'); return request('/release/curriculum/getIndustryFlightSkills')
}, },
PilotRegistrations: (params:PilotRegistrationParams): Promise<Response<Array<SkillsType>>> => { PilotRegistrations: (
return request('/release/curriculum/pilotRegistration',"post",params); params: PilotRegistrationParams
): Promise<Response<Array<SkillsType>>> => {
return request('/release/curriculum/pilotRegistration', 'post', params)
}, },
} FlightSkills: (params: { type: 3 }): Promise<Response<Array<TypesResp>>> => {
\ No newline at end of file return request('/pms/classify/queryCategoryInfoByType', 'get', params)
},
}
pages/flyingHandService/index.page.tsx
...@@ -20,10 +20,10 @@ import { UserContext } from '~/lib/userProvider' ...@@ -20,10 +20,10 @@ import { UserContext } from '~/lib/userProvider'
import { phoneNumber } from '~/lib/validateUtils' import { phoneNumber } from '~/lib/validateUtils'
import api, { Flying, RegionResp, SkillsType } from './api' import api, { Flying, RegionResp, SkillsType } from './api'
import { Box } from './styled' import { Box } from './styled'
import { TypesResp } from '~/components/filter/api'
interface FilterInfoParams { interface FilterInfoParams {
regionId?: number provinceId?: number
flightSkillsId?: number categoryId?: any[]
licenseId?: number
} }
export default function FlyingHandService() { export default function FlyingHandService() {
...@@ -45,8 +45,10 @@ export default function FlyingHandService() { ...@@ -45,8 +45,10 @@ export default function FlyingHandService() {
) )
const [skills, setSkills] = useState(Array<RegionResp>) const [skills, setSkills] = useState(Array<RegionResp>)
const [skillsDefault, setSkillsDefault] = useState<Array<number>>() const [skillsDefault, setSkillsDefault] = useState<Array<number>>()
const [flightSkillsList, setFlightSkillsList] = useState(Array<SkillsType>) const [flightSkillsList, setFlightSkillsList] = useState<Array<SkillsType>>()
const [flightDefault, setFlightDefault] = useState<number | null>() const [flightDefault, setFlightDefault] = useState<number | null>()
const [selectOption, setSelectOption] = useState<Array<TypesResp> | null>()
const [selectDefault, setSelectDefault] = useState<number | null>()
const leftDom = (item: Flying) => { const leftDom = (item: Flying) => {
return ( return (
<div <div
...@@ -153,12 +155,35 @@ export default function FlyingHandService() { ...@@ -153,12 +155,35 @@ export default function FlyingHandService() {
} }
} }
const onSelectChange = (value: number, item: TypesResp) => {
clearRouter()
console.log(value)
if (value) {
setSelectDefault(value)
} else {
setSelectDefault(undefined)
}
setFilterParams((props) => {
if (props?.categoryId && value) {
return {
...props,
categoryId: [...props.categoryId, Number(value)],
}
}
return {
...props,
categoryId: value ? [Number(value)] : undefined,
}
})
}
const onProvinceChange = (value: number) => { const onProvinceChange = (value: number) => {
clearRouter() clearRouter()
if (value) { if (value) {
setFlightDefault(value) setFlightDefault(value)
} else { } else {
setFlightDefault(null) setFlightDefault(undefined)
} }
setFilterParams((props) => { setFilterParams((props) => {
return { return {
...@@ -194,7 +219,7 @@ export default function FlyingHandService() { ...@@ -194,7 +219,7 @@ export default function FlyingHandService() {
setFilterParams((props) => { setFilterParams((props) => {
return { return {
...props, ...props,
regionId: value || undefined, provinceId: value || undefined,
} }
}) })
} }
...@@ -208,16 +233,21 @@ export default function FlyingHandService() { ...@@ -208,16 +233,21 @@ export default function FlyingHandService() {
api.region().then((res) => { api.region().then((res) => {
setSecondDistrictInfo(res.result || []) setSecondDistrictInfo(res.result || [])
}) })
api.PilotLicense().then((res) => { // api.PilotLicense().then((res) => {
setSkills(res.result || []) // setSkills(res.result || [])
}) // })
api.IndustryFlightSkills().then((res) => { // api.IndustryFlightSkills().then((res) => {
const list = res.result?.map((item) => { // const list = res.result?.map((item) => {
item.label = item.skillsName // item.label = item.skillsName
item.value = item.id // item.value = item.id
return item // return item
}) // })
setFlightSkillsList(list || []) // setFlightSkillsList(list || [])
// })
api.FlightSkills({ type: 3 }).then((res) => {
console.log(res)
setSelectOption(res.result)
}) })
}, []) }, [])
...@@ -313,7 +343,7 @@ export default function FlyingHandService() { ...@@ -313,7 +343,7 @@ export default function FlyingHandService() {
onChange={onChangeRegion} onChange={onChangeRegion}
changeOnSelect changeOnSelect
/> */} /> */}
<Select {/* <Select
className="selectItem" className="selectItem"
bordered={false} bordered={false}
popupMatchSelectWidth={false} popupMatchSelectWidth={false}
...@@ -323,35 +353,21 @@ export default function FlyingHandService() { ...@@ -323,35 +353,21 @@ export default function FlyingHandService() {
options={secondDistrictInfo} options={secondDistrictInfo}
fieldNames={{ value: 'id', label: 'name' }} fieldNames={{ value: 'id', label: 'name' }}
allowClear allowClear
/> /> */}
<Cascader {/* {selectOption?.map((item) => (
allowClear <Select
placeholder="考证" key={item.directoryId}
bordered={false} className="selectItem"
className="selectItem" bordered={false}
size="large" popupMatchSelectWidth={false}
fieldNames={{ placeholder={item.name}
label: 'licenseType', size="large"
value: 'id', onChange={(value) => onSelectChange(value, item)}
children: 'childLicenses', options={item.categoriesInfoListDTO}
}} fieldNames={{ value: 'id', label: 'name' }}
options={skills} allowClear
onChange={(value) => onChange(value)} />
changeOnSelect ))} */}
value={skillsDefault}
/>
<Select
className="selectItem"
bordered={false}
popupMatchSelectWidth={false}
placeholder="技能"
size="large"
onChange={(value) => onProvinceChange(value)}
options={flightSkillsList}
fieldNames={{ value: 'id', label: 'skillsName' }}
allowClear
value={flightDefault}
/>
</Space> </Space>
</div> </div>
<Button <Button
......
pages/home/waterfallFlowBody/api/index.ts
import request, { Response } from "~/api/request"; import request, { Response } from '~/api/request'
export interface AllType { export interface AllType {
type?: string; categoryName: string
id?: number; id: number
name?: string;
appName?: string;
createTime?: string;
industryIcon?: string;
shortName?: null;
industryType?: null;
propagate1?: string;
propagate2?: string;
image?: string;
video?: string;
newsTitle?: string;
newsAuthor?: string;
userAccountId?: number;
surfaceImg?: string;
newsContents?: string;
updateTime?: string | null;
tenderNewsId?: number;
tenderInfoNo?: string;
tenderContent?: string;
tenderPrice?: number;
apply?: number;
skillsName?: string;
} }
export interface FilterOptionResp { export interface FilterOptionResp {
type: string; type: string
id: number; id: number
name: string; name: string
} }
export interface RegionResp { export interface RegionResp {
childInfo: RegionResp[] | null; childInfo: RegionResp[] | null
id: number; id: number
level: number; level: number
name: string; name: string
pid: number; pid: number
} }
export const equipmentLeasingApi = { export const equipmentLeasingApi = {
deviceBrand: (): Promise<Response<Array<FilterOptionResp>>> => { deviceBrand: (): Promise<Response<Array<FilterOptionResp>>> => {
return request("/pms/webDevice/deviceBrand"); return request('/pms/webDevice/deviceBrand')
}, },
// deviceCategory: (): Promise<Response<Array<FilterOptionResp>>> => { // deviceCategory: (): Promise<Response<Array<FilterOptionResp>>> => {
// return request("/pms/webDevice/category"); // return request("/pms/webDevice/category");
// }, // },
deviceModel: (): Promise<Response<Array<FilterOptionResp>>> => { deviceModel: (): Promise<Response<Array<FilterOptionResp>>> => {
return request("/pms/webDevice/deviceModel"); return request('/pms/webDevice/deviceModel')
}, },
}; }
export interface AppType { export interface AppType {
id: number; id: number
name: string; name: string
appName: string; appName: string
createTime: string; createTime: string
type: string; type: string
} }
export interface IndustryType { export interface IndustryType {
id: number; id: number
industryIcon: string; industryIcon: string
name: string; name: string
shortName: string; shortName: string
industryType: string; industryType: string
propagate1: string; propagate1: string
propagate2: string; propagate2: string
image: string; image: string
video: string; video: string
type: string; type: string
appName: string; appName: string
} }
export const jobServicesApi = { export const jobServicesApi = {
listAllAppType: (): Promise<Response<Array<AppType>>> => { listAllAppType: (): Promise<Response<Array<AppType>>> => {
return request("/release/work/listAllAppType"); return request('/release/work/listAllAppType')
}, },
listAllIndustry: (): Promise<Response<Array<IndustryType>>> => { listAllIndustry: (): Promise<Response<Array<IndustryType>>> => {
return request("/release/work/listAllIndustry"); return request('/release/work/listAllIndustry')
}, },
}; }
export const mallApi = { export const mallApi = {
listAllBrand: (): Promise<Response<Array<FilterOptionResp>>> => { listAllBrand: (): Promise<Response<Array<FilterOptionResp>>> => {
return request("/pms/webDevice/brand"); return request('/pms/webDevice/brand')
}, },
listAllCategory: (): Promise<Response<Array<FilterOptionResp>>> => { listAllCategory: (): Promise<Response<Array<FilterOptionResp>>> => {
return request("/pms/webProductMall/category"); return request('/pms/webProductMall/category')
}, },
listAllParts: (): Promise<Response<Array<FilterOptionResp>>> => { listAllParts: (): Promise<Response<Array<FilterOptionResp>>> => {
return request("/pms/webProductMall/parts"); return request('/pms/webProductMall/parts')
}, },
listAllModel: (): Promise<Response<Array<FilterOptionResp>>> => { listAllModel: (): Promise<Response<Array<FilterOptionResp>>> => {
return request("/pms/webDevice/model"); return request('/pms/webDevice/model')
}, },
listAllQuality: (): Promise<Response<Array<FilterOptionResp>>> => { listAllQuality: (): Promise<Response<Array<FilterOptionResp>>> => {
return request("/pms/webProductMall/quality"); return request('/pms/webProductMall/quality')
}, },
}; }
export interface SkillsType { export interface SkillsType {
name: string; name: string
type: string; type: string
id: number; id: number
skillsName: string; skillsName: string
licenseType:string licenseType: string
} }
export const flightSkillsApi = { export const flightSkillsApi = {
IndustryFlightSkills: (): Promise<Response<Array<SkillsType>>> => { IndustryFlightSkills: (): Promise<Response<Array<SkillsType>>> => {
return request("/release/curriculum/getIndustryFlightSkills"); return request('/release/curriculum/getIndustryFlightSkills')
}, },
InDronePilotLicense: (): Promise<Response<Array<SkillsType>>> => { InDronePilotLicense: (): Promise<Response<Array<SkillsType>>> => {
return request("/release/curriculum/getDronePilotLicense"); return request('/release/curriculum/getDronePilotLicense')
}, },
}; }
export interface NewsPageType { export interface NewsPageType {
id: number; id: number
newsTitle: string; newsTitle: string
newsAuthor: string; newsAuthor: string
userAccountId: number; userAccountId: number
surfaceImg: string; surfaceImg: string
newsContents: string; newsContents: string
createTime: string; createTime: string
updateTime: string | null; updateTime: string | null
} }
export interface NewsTenderType { export interface NewsTenderType {
id: number; id: number
tenderNewsId: number; tenderNewsId: number
tenderInfoNo: string; tenderInfoNo: string
tenderContent: string; tenderContent: string
tenderPrice: number; tenderPrice: number
createTime: string; createTime: string
apply: number; apply: number
} }
export interface ListPageNewsInfoResp { export interface ListPageNewsInfoResp {
pageNo: number; pageNo: number
pageSize: number; pageSize: number
list: Array<NewsPageType>; list: Array<NewsPageType>
totalCount: number; totalCount: number
totalPage: number; totalPage: number
} }
export interface ListTenderNewsInfoResp { export interface ListTenderNewsInfoResp {
pageNo: number; pageNo: number
pageSize: number; pageSize: number
list: Array<NewsTenderType>; list: Array<NewsTenderType>
totalCount: number; totalCount: number
totalPage: number; totalPage: number
} }
interface ListPageNewsInfoParams { interface ListPageNewsInfoParams {
pageNo: number; pageNo: number
pageSize: number; pageSize: number
cityCode?: number; cityCode?: number
date?: string; date?: string
districtCode?: number; districtCode?: number
provinceCode?: number; provinceCode?: number
} }
interface ListTenderNewsInfoParams { interface ListTenderNewsInfoParams {
pageNo: number; pageNo: number
pageSize: number; pageSize: number
cityCode?: number; cityCode?: number
date?: string; date?: string
districtCode?: number; districtCode?: number
provinceCode?: number; provinceCode?: number
} }
export interface TenderApplyType{ export interface TenderApplyType {
tenderInfoId: number, tenderInfoId: number
tenderNewsId: number, tenderNewsId: number
userAccountId: number userAccountId: number
} }
...@@ -185,16 +163,33 @@ export const listNewsApi = { ...@@ -185,16 +163,33 @@ export const listNewsApi = {
listNewsPage: ( listNewsPage: (
params: ListPageNewsInfoParams params: ListPageNewsInfoParams
): Promise<Response<ListPageNewsInfoResp>> => { ): Promise<Response<ListPageNewsInfoResp>> => {
return request("/release/industry-news/listNewsPage", "post", params); return request('/release/industry-news/listNewsPage', 'post', params)
}, },
//招标列表 //招标列表
listNewTenderInfo: ( listNewTenderInfo: (
params: ListTenderNewsInfoParams params: ListTenderNewsInfoParams
): Promise<Response<ListTenderNewsInfoResp>> => { ): Promise<Response<ListTenderNewsInfoResp>> => {
return request("/release/tender/listNewTenderInfo", "post", params); return request('/release/tender/listNewTenderInfo', 'post', params)
}, },
//web-招标-合作申请提交 //web-招标-合作申请提交
tenderApply: (params: TenderApplyType): Promise<Response<number>> => { tenderApply: (params: TenderApplyType): Promise<Response<number>> => {
return request('/release/tender/apply', 'post', params) return request('/release/tender/apply', 'post', params)
} },
}
export interface HomeCategoriesType {
type: 1 | 2 | 3 | 4
}
export interface ResHomeCategoriesType {
id: number
categoryName: string
}
export default {
//新闻列表
HomeCategories: (
params: HomeCategoriesType
): Promise<Response<ResHomeCategoriesType>> => {
return request('/pms/product/mall/getPageHomeCategories', 'get', params)
},
} }
pages/jobServices/index.page.tsx
import React, { useEffect, useState , useRef } from "react"; import React, { useEffect, useState, useRef } from 'react'
import { Box } from "./styled"; import { Box } from './styled'
import { Pagination } from "antd"; import { Pagination } from 'antd'
import Layout from "~/components/layout"; import Layout from '~/components/layout'
import ContentBox from "~/components/contentBox"; import ContentBox from '~/components/contentBox'
import { useRouter } from "next/router"; import { useRouter } from 'next/router'
import Filter, { FilterResult, AdapterResult } from "~/components/filter"; import Filter, { FilterResult, AdapterResult } from '~/components/filter'
import api, { Job } from "./api"; import api, { Job } from './api'
import Image from "next/image"; import Image from 'next/image'
// 此函数在构建时被调用 // 此函数在构建时被调用
export async function getServerSideProps() { export async function getServerSideProps() {
return { return {
props: {}, props: {},
}; }
} }
interface ImageListType {} interface ImageListType {}
export default function JobServices() { export default function JobServices() {
const router = useRouter(); const router = useRouter()
const filter = useRef<any>()
const [list, setList] = useState([ const [list, setList] = useState([
"https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/540X844-2(1).jpg", 'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/540X844-2(1).jpg',
// "https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/665512fd-12e6-49a9-93c1-f9dcd0e82083.jpg", // "https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/file/665512fd-12e6-49a9-93c1-f9dcd0e82083.jpg",
]); ])
const [productList, setProductList] = useState( const [productList, setProductList] = useState(
Array<{ element: JSX.Element }> Array<{ element: JSX.Element }>
); )
const [rightDomList, setRightDomList] = useState( const [rightDomList, setRightDomList] = useState(
Array<{ element: JSX.Element }> Array<{ element: JSX.Element }>
); )
const leftDom = (item: Job) => { const leftDom = (item: Job) => {
return ( return (
<div <div
...@@ -43,7 +42,7 @@ export default function JobServices() { ...@@ -43,7 +42,7 @@ export default function JobServices() {
{/* <div className="com">{item.teamName}</div> */} {/* <div className="com">{item.teamName}</div> */}
</div> </div>
<div className="value-right"> <div className="value-right">
<span className="money">¥{item.price}</span>{" "} <span className="money">¥{item.price}</span>{' '}
<span className="unit">/平</span> <span className="unit">/平</span>
</div> </div>
</div> </div>
...@@ -56,49 +55,46 @@ export default function JobServices() { ...@@ -56,49 +55,46 @@ export default function JobServices() {
<div className="com">{item.teamName}</div> <div className="com">{item.teamName}</div>
</div> </div>
</div> </div>
); )
}; }
const rightDom = (item: string) => { const rightDom = (item: string) => {
return ( return (
<div className="right-box-item advertisement" key={item}> <div className="right-box-item advertisement" key={item}>
<Image src={item} alt="error" width={260} height={420} /> <Image src={item} alt="error" width={260} height={420} />
</div> </div>
); )
}; }
const [filterResult, setFilterResult] = useState<AdapterResult>({}); //筛选结果 const [filterResult, setFilterResult] = useState<AdapterResult>({}) //筛选结果
const [pageParams, setPageParams] = useState({ const [pageParams, setPageParams] = useState({
pageNo: 1, pageNo: 1,
pageSize: 14, pageSize: 14,
}); //分页器对象 }) //分页器对象
const [count, setCount] = useState(0); //商品总数 const [count, setCount] = useState(0) //商品总数
const [abort, setAbort] = useState<AbortController | null>(null); //请求中断 const [abort, setAbort] = useState<AbortController | null>(null) //请求中断
const onPageChange = (page: number, pageSize: number) => { const onPageChange = (page: number, pageSize: number) => {
setPageParams({ setPageParams({
...pageParams, ...pageParams,
pageNo: page, pageNo: page,
}); })
}; }
useEffect(() => { useEffect(() => {
//中断前一次列表请求 //中断前一次列表请求
abort?.abort(); abort?.abort()
setAbort(new AbortController()); setAbort(new AbortController())
}, [filterResult, pageParams]); }, [filterResult, pageParams])
//端口列表请求 //端口列表请求
useEffect(() => { useEffect(() => {
let queryVal = JSON.parse(JSON.stringify(router.query)); let queryVal = JSON.parse(JSON.stringify(router.query))
const idArr = filter.current.idArr
let rs let rs
for (const key in queryVal) { if (Object.keys(queryVal).length) {
if (idArr.includes(key)) { rs = { categoryId: [Number(queryVal['categoryId'])] }
rs = {[key]:router.query[key]}
}
} }
api api
.listPageJobServicesInfo( .listPageJobServicesInfo(
...@@ -114,49 +110,46 @@ export default function JobServices() { ...@@ -114,49 +110,46 @@ export default function JobServices() {
.then((res) => { .then((res) => {
setProductList( setProductList(
res.result?.list?.map((item) => { res.result?.list?.map((item) => {
return { element: leftDom(item) }; return { element: leftDom(item) }
}) || [] }) || []
); )
setCount(res.result?.totalCount || 0); setCount(res.result?.totalCount || 0)
}); })
}, [abort]); }, [abort])
const onFilterChange = ( const onFilterChange = (
filterResult: FilterResult, filterResult: FilterResult,
adapterFilterResult: AdapterResult adapterFilterResult: AdapterResult
) => { ) => {
console.log("filterResult", filterResult, adapterFilterResult); console.log('filterResult', filterResult, adapterFilterResult)
setFilterResult(adapterFilterResult); adapterFilterResult.categoryId = adapterFilterResult.categoryId?.map(
}; (item) => item.id
)
setFilterResult(adapterFilterResult)
}
useEffect(() => { useEffect(() => {
setRightDomList( setRightDomList(
list.map((item) => { list.map((item) => {
return { element: rightDom(item) }; return { element: rightDom(item) }
}) })
); )
}, []); }, [])
useEffect(() => { useEffect(() => {
let queryVal = JSON.parse(JSON.stringify(router.query)); let queryVal = JSON.parse(JSON.stringify(router.query))
if (router.query) { if (Object.keys(router.query).length) {
const idArr = filter.current.idArr setFilterResult({ categoryId: [Number(queryVal['categoryId'])] })
for (const key in queryVal) {
if (idArr.includes(key)) {
setFilterResult({ [key]:router.query[key] });
}
}
} }
}, [router]); }, [router])
return ( return (
<Layout> <Layout>
<Box> <Box>
<Filter <Filter
types={["地域", "行业", "应用"]} types={['地域', '行业', '应用']}
showResultItem showResultItem
onChange={onFilterChange} onChange={onFilterChange}
ref={filter}
></Filter> ></Filter>
<div style={{ marginTop: 10 }}> <div style={{ marginTop: 10 }}>
<ContentBox <ContentBox
...@@ -179,12 +172,12 @@ export default function JobServices() { ...@@ -179,12 +172,12 @@ export default function JobServices() {
}} }}
rightRenderDom={{ columns: rightDomList }} rightRenderDom={{ columns: rightDomList }}
leftcontentstyle={{ leftcontentstyle={{
width: "924px", width: '924px',
margin: { top: 0, right: "10px", bottom: "10px", left: 0 }, margin: { top: 0, right: '10px', bottom: '10px', left: 0 },
}} }}
/> />
</div> </div>
</Box> </Box>
</Layout> </Layout>
); )
} }
pages/mall/api/index.ts
import request, { Response } from '~/api/request'; import request, { Response } from '~/api/request'
export interface DeviceListParams { export interface DeviceListParams {
categoryId?: any[]; categoryId?: any[];
...@@ -24,8 +24,8 @@ export interface DeviceListResp { ...@@ -24,8 +24,8 @@ export interface DeviceListResp {
} }
export interface Ad { export interface Ad {
id: number; id: number
imageUrl: string; bannerImg: string
} }
export default { export default {
...@@ -34,7 +34,9 @@ export default { ...@@ -34,7 +34,9 @@ export default {
return request('/pms/product/mall/deviceList', 'post', params, options) return request('/pms/product/mall/deviceList', 'post', params, options)
}, },
//产品商城广告位 //产品商城广告位
ad: (): Promise<Response<Array<Ad>>> => { listBannerImg: () => {
return request('/pms/webProductMall/ad') return request('/release/module/listBannerImg', 'get', {
} moduleCode: 'PRODUCT_MARKETP'
} })
\ No newline at end of file },
}
pages/mall/index.page.tsx
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from 'react'
import { Empty, Pagination, Image, Spin } from "antd"; import { Empty, Pagination, Image, Spin } from 'antd'
import Layout from "~/components/layout"; import Layout from '~/components/layout'
import styles from "./index.module.scss"; import styles from './index.module.scss'
import { useRouter } from "next/router"; import { useRouter } from 'next/router'
import Filter, { AdapterResult, FilterResult } from "~/components/filter"; import Filter, { AdapterResult, FilterResult } from '~/components/filter'
import api, { Ad, Goods } from "./api"; import api, { Ad, Goods } from './api'
import errImg from "~/assets/errImg"; import errImg from '~/assets/errImg'
// 此函数在构建时被调用 // 此函数在构建时被调用
export async function getServerSideProps() { export async function getServerSideProps() {
return { return {
props: {}, props: {},
}; }
} }
type Props = {}; type Props = {}
export default function Mall(props: Props) { export default function Mall(props: Props) {
const router = useRouter(); const router = useRouter()
const [productList, setProductList] = useState<Array<Goods>>([]); //商品列表 const [productList, setProductList] = useState<Array<Goods>>([]) //商品列表
const [filterResult, setFilterResult] = useState<AdapterResult>({}); //筛选结果 const [filterResult, setFilterResult] = useState<AdapterResult>({}) //筛选结果
const [pageParams, setPageParams] = useState({ const [pageParams, setPageParams] = useState<{
pageNo: number
pageSize: number
}>({
pageNo: 1, pageNo: 1,
pageSize: 15, pageSize: 15,
}); //分页器对象 }) //分页器对象
const [count, setCount] = useState(0); //商品总数 const [count, setCount] = useState(0) //商品总数
const [abort, setAbort] = useState<AbortController | null>(null); //请求中断对你 const [abort, setAbort] = useState<AbortController | null>(null) //请求中断对象
const [adList, setAdList] = useState<Array<Ad>>([]); //广告列表 const [adList, setAdList] = useState<Array<Ad>>([]) //广告列表
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false)
useEffect(() => { useEffect(() => {
//中断前一次列表请求 //中断前一次列表请求
abort?.abort(); abort?.abort()
setAbort(new AbortController()); setAbort(new AbortController())
}, [filterResult, pageParams]); }, [filterResult, pageParams])
//商品列表请求 //商品列表请求
useEffect(() => { useEffect(() => {
if (!abort) { if (!abort) {
return; return
} }
setLoading(true); setLoading(true)
api api
.deviceList( .deviceList(
{ {
provinceId: filterResult.districtId,
type: 0, type: 0,
...pageParams, ...pageParams,
...filterResult,
}, },
{ {
signal: abort?.signal, signal: abort?.signal,
...@@ -57,34 +60,37 @@ export default function Mall(props: Props) { ...@@ -57,34 +60,37 @@ export default function Mall(props: Props) {
setCount(res.result?.totalCount || 0); setCount(res.result?.totalCount || 0);
setLoading(false); setLoading(false);
}); });
}, [abort]); }, [abort])
//广告请求 //广告请求
useEffect(() => { useEffect(() => {
api.ad().then((res) => { api.listBannerImg().then((res) => {
setAdList(res.result || []); setAdList(res.result || []);
}); });
}, []); }, [])
const onFilterChange = ( const onFilterChange = (
filterResult: FilterResult, filterResult: FilterResult,
adapterFilterResult: AdapterResult adapterFilterResult: AdapterResult
) => { ) => {
console.log("filterResult", filterResult, adapterFilterResult); console.log('filterResult', filterResult, adapterFilterResult)
setFilterResult(adapterFilterResult); adapterFilterResult.categoryId = adapterFilterResult.categoryId?.map(
}; (item) => item.id
)
setFilterResult(adapterFilterResult)
}
const onPageChange = (page: number, pageSize: number) => { const onPageChange = (page: number, pageSize: number) => {
setPageParams({ setPageParams({
...pageParams, ...pageParams,
pageNo: page, pageNo: page,
}); })
}; }
return ( return (
<Layout> <Layout>
<div className="page" style={{ paddingTop: "18px" }}> <div className="page" style={{ paddingTop: "18px" }}>
<Filter <Filter
types={["类目", "地域", "品牌", "部件" /* "型号", "成色" */]} types={["地域"]}
showResultItem showResultItem
onChange={onFilterChange} onChange={onFilterChange}
></Filter> ></Filter>
...@@ -151,7 +157,7 @@ export default function Mall(props: Props) { ...@@ -151,7 +157,7 @@ export default function Mall(props: Props) {
<Image <Image
key={item.id} key={item.id}
className={styles.ad} className={styles.ad}
src={item.imageUrl} src={item.bannerImg}
width={189} width={189}
height={295} height={295}
preview={false} preview={false}
......
pages/personalCenter/components/sider/index.tsx
...@@ -26,7 +26,7 @@ const items: MenuItem[] = [ ...@@ -26,7 +26,7 @@ const items: MenuItem[] = [
getItem("服务订单", "/personalCenter/servicesOrders"), getItem("服务订单", "/personalCenter/servicesOrders"),
getItem("租赁订单", "/personalCenter/leasingOrders"), getItem("租赁订单", "/personalCenter/leasingOrders"),
getItem("商城订单", "/personalCenter/mallOrders"), getItem("商城订单", "/personalCenter/mallOrders"),
getItem("培训订单", "1-2"), getItem("培训订单", "/personalCenter/trainOrders"),
]), ]),
getItem("账户信息", "2"), getItem("账户信息", "2"),
getItem("优惠券卡包", "3"), getItem("优惠券卡包", "3"),
......
pages/personalCenter/servicesOrders/api/index.ts 0 → 100644
import request, { Response } from "~/api/request"
export interface QueryOrderTaskListParams {
orderStatus?: number;
pageNo: number;
pageSize: number;
}
export interface QueryOrderTaskListResp {
pageNo: number;
pageSize: number;
list: OrderList[];
totalCount: number;
totalPage: number;
}
export interface OrderList {
address: string;
city: string;
endTime: string;
images: any[];
inspectionId: number;
lat: number;
lon: number;
orderAmt: number;
orderName: string;
orderNo: string;
province: string;
startTime: string;
taskDescription: string;
}
export interface ListStatusResp {
status: string;
code: number;
nextCode: number;
}
export default {
//查询服务订单列表
queryOrderTaskList(params: QueryOrderTaskListParams, options: any): Promise<Response<QueryOrderTaskListResp>> {
return request('/pms/serviceOrderTask/queryOrderTaskList', 'post', params, options)
},
//订单状态-字典
listStatus(): Promise<Response<ListStatusResp[]>> {
return request('/oms/mallorder/listStatus', 'get');
}
}
\ No newline at end of file
pages/personalCenter/servicesOrders/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;
}
.font6 {
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/servicesOrders/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, QueryOrderTaskListResp } 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 ServicesOrder() { export default function ServicesOrder() {
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<QueryOrderTaskListResp[]>([]); //订单状态字典
//获取订单状态字典
useEffect(() => {
api.listStatus().then((res) => {
// setTranStatusMap(res.result || []);
});
}, []);
useEffect(() => {
//中断前一次列表请求
abort?.abort();
setAbort(new AbortController());
}, [pageParams]);
//商品列表请求
useEffect(() => {
if (!abort) {
return;
}
setLoading(true);
api
.queryOrderTaskList(
{
...pageParams,
orderStatus: 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.inspectionId} className={styles.orderItem}>
<Row
justify="space-between"
align="middle"
style={{
height: 30,
padding: "0 26px 0 16px",
background: "#EBF8FF",
}}
>
<div className={styles.font2}>
{item.startTime} - {item.endTime}
</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.images[0]}
></Image>
</div>
<div style={{ marginTop: 12 }}>
<div className={`ellipsis1 ${styles.font4}`}>
{item.orderName}
</div>
</div>
</Row>
</Col>
<Col
style={{
width: 270,
borderLeft: "1px solid #D0EAF5",
borderRight: "1px solid #D0EAF5",
}}
>
<Row
justify={"center"}
align="middle"
style={{ height: "100%" }}
>
预付金额:{" "}
<span className={styles.font6}>¥{item.orderAmt}</span>
</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>
</> </>
......
pages/personalCenter/trainOrders/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/trainOrders/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: 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/trainOrders/index.page.tsx 0 → 100644
import {
TabsProps,
Tabs,
Row,
Col,
Image,
Space,
Button,
Spin,
Pagination,
Empty,
} from "antd";
import { useRouter } from "next/router";
import { useEffect, useState } from "react";
import errImg from "~/assets/errImg";
import Right from "~/components/contentBox/right";
import LayoutView from "~/components/layout";
import Sider from "../components/sider";
import api, { OrderList, ListStatusResp } from "./api";
import styles from "./index.module.scss";
const items: TabsProps["items"] = [
{
key: "",
label: `全部`,
},
{
key: "0",
label: `待付款`,
},
{
key: "1",
label: `待验收`,
},
{
key: "2",
label: `已完成`,
},
{
key: "3",
label: `已取消`,
},
];
export default function TrainOrder() {
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 (
<>
<LayoutView
layoutStyle={{ backgroundColor: "#fff" }}
contentStyle={{ width: 1000, marginLeft: 526 }}
headerStyle={{ borderBottom: "1px solid #e2e2e2" }}
>
<Sider
style={{
position: "absolute",
left: -37,
top: 15,
transform: "translateX(-100%)",
}}
selectedKeys={[router.pathname]}
></Sider>
<div style={{ paddingTop: 19 }}>
<div className={styles.font1}>培训订单</div>
<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>
</div>
</Row>
</Col>
<Col
style={{
width: 270,
borderLeft: "1px solid #D0EAF5",
borderRight: "1px solid #D0EAF5",
}}
>
<Row
justify={"center"}
align="middle"
style={{ height: "100%" }}
>
预付金额:{" "}
<span className={styles.font6}>
¥{item.totalBuyNum}
</span>
</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>
</LayoutView>
</>
);
}
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论