Skip to content

W
web
提交 dc108972 作者: 龚洪江
操作

修复：作业服务问题

上级 44ca5201
正在显示 包含 1466 行增加 和 1689 行删除
components/NavHeader/index.tsx
import React, { useContext, useEffect, useState } from "react";
import { Avatar, Button, Dropdown, Space, Tabs } from "antd";
import type { TabsProps } from "antd";
import styles from "./index.module.scss";
import { Router, useRouter } from "next/router";
import LoginModal from "~/components/loginModal";
import PublishModal from "./publishModal";
import JoinModal from "./joinModal";
import { UserContext } from "~/lib/userProvider";
import React, { useContext, useEffect, useState } from 'react';
import { Avatar, Button, Dropdown, Space, Tabs } from 'antd';
import type { TabsProps } from 'antd';
import styles from './index.module.scss';
import { Router, useRouter } from 'next/router';
import LoginModal from '~/components/loginModal';
import PublishModal from './publishModal';
import JoinModal from './joinModal';
import { UserContext } from '~/lib/userProvider';
const items: TabsProps["items"] = [
const items: TabsProps['items'] = [
{
key: "/home",
key: '/home',
label: ` 首页 `,
},
{
key: "/jobServices",
key: '/jobServices',
label: `作业服务`,
},
{
key: "/equipmentLeasing",
key: '/equipmentLeasing',
label: `设备租赁`,
},
{
key: "/flyingHandService",
key: '/flyingHandService',
label: `飞手培训`,
},
{
key: "/mall",
key: '/mall',
label: `产品商城`,
},
{
key: "/projectInfo",
key: '/projectInfo',
label: `项目资讯`,
},
{
key: "/forum",
key: '/forum',
label: `社区论坛`,
},
];
......@@ -45,9 +45,8 @@ type Props = {
export default function NavHeader(props: Props) {
const router = useRouter();
const [currentPath, setCurrentPath] = useState("");
const { userInfo, testLogin, logout, setNeedLogin, needLogin } =
useContext(UserContext);
const [currentPath, setCurrentPath] = useState('');
const { userInfo, testLogin, logout, setNeedLogin, needLogin } = useContext(UserContext);
useEffect(() => {
const routerTo = items?.filter((item) => router.route == item.key)[0];
......@@ -56,7 +55,7 @@ export default function NavHeader(props: Props) {
} else {
setCurrentPath(router.route);
}
console.log("currentHash", currentPath);
console.log('currentHash', currentPath);
}, [router.route]);
//导航更改
......@@ -112,7 +111,7 @@ export default function NavHeader(props: Props) {
onTabClick={onChange}
/>
<Space size={16} className={styles.btns}>
<Button type="primary" className={styles.btn1} onClick={onPublish}>
<Button type='primary' className={styles.btn1} onClick={onPublish}>
+ 发布需求
</Button>
<Button className={styles.btn2} onClick={onJoin}>
......@@ -125,33 +124,25 @@ export default function NavHeader(props: Props) {
menu={{
items: [
{
key: "2",
key: '2',
label: (
<div
onClick={() =>
router.push("/personalCenter/servicesOrders")
}
>
<div onClick={() => router.push('/personalCenter/servicesOrders')}>
我的订单
</div>
),
},
{ key: "1", label: <div onClick={onLogout}>退出登录</div> },
{ key: '1', label: <div onClick={onLogout}>退出登录</div> },
],
}}
>
<Avatar
size={36}
style={{ background: "#bdbdbd" }}
src={userInfo.userImg}
></Avatar>
<Avatar size={36} style={{ background: '#bdbdbd' }} src={userInfo.userImg}></Avatar>
</Dropdown>
</div>
) : (
<Button
type="text"
type='text'
onClick={() => setOpenLoginModal(true)}
style={{ fontWeight: "bold", fontSize: 16 }}
style={{ fontWeight: 'bold', fontSize: 16 }}
>
登录
</Button>
......
components/NavHeader/joinModal/api/index.ts
import request, { Response } from "~/api/request"
import request, { Response } from '~/api/request';
export interface ListTagResp {
id: number;
......@@ -11,6 +11,6 @@ export interface ListTagResp {
export default {
//加盟标签列表
listTag: (): Promise<Response<Array<ListTagResp>>> => {
return request('/userapp/cooperation/listTag')
}
}
\ No newline at end of file
return request('/userapp/cooperation/listTag');
},
};
components/NavHeader/joinModal/index.tsx
import { Col, Modal, Row } from "antd";
import Image from "next/image";
import styles from "./index.module.scss";
import img from "./assets/img.png";
import { useContext, useEffect, useState } from "react";
import api, { ListTagResp } from "./api";
import { useRouter } from "next/router";
import { UserContext } from "~/lib/userProvider";
import { Col, Modal, Row } from 'antd';
import Image from 'next/image';
import styles from './index.module.scss';
import img from './assets/img.png';
import { useContext, useEffect, useState } from 'react';
import api, { ListTagResp } from './api';
import { useRouter } from 'next/router';
import { UserContext } from '~/lib/userProvider';
const imgs = [
require("./assets/生产制造商.png"),
require("./assets/品牌企业.png"),
require("./assets/商务公关机构.png"),
require("./assets/无人机自媒体.png"),
require("./assets/投资机构.png"),
require("./assets/飞手团队.png"),
require("./assets/二手服务商.png"),
require("./assets/飞手培训机构.png"),
require("./assets/推广合作商.png"),
require('./assets/生产制造商.png'),
require('./assets/品牌企业.png'),
require('./assets/商务公关机构.png'),
require('./assets/无人机自媒体.png'),
require('./assets/投资机构.png'),
require('./assets/飞手团队.png'),
require('./assets/二手服务商.png'),
require('./assets/飞手培训机构.png'),
require('./assets/推广合作商.png'),
];
type Props = {
......@@ -37,15 +37,15 @@ export default function JoinModal(props: Props) {
const onClickTag = (item: ListTagResp) => {
if (userInfo!.companyAuthStatus) {
router.replace("/JoinPolicy?tagId=" + item.id);
router.replace('/JoinPolicy?tagId=' + item.id);
props.onCancel && props.onCancel();
} else {
router.push("/certification");
}
router.push('/certification');
}
};
return (
<Modal
title="申请合作加盟"
title='申请合作加盟'
open={props.open}
onOk={props.onOk}
onCancel={props.onCancel}
......@@ -53,23 +53,23 @@ export default function JoinModal(props: Props) {
width={460}
footer={null}
>
<Row style={{rowGap: 29, paddingTop: 21, paddingBottom: 21}}>
<Row style={{ rowGap: 29, paddingTop: 21, paddingBottom: 21 }}>
{tagList.map((item, i) => {
return (
<Col
key={item.id}
span={8}
style={{
cursor: "pointer",
cursor: 'pointer',
padding: 0,
textAlign: "center",
textAlign: 'center',
}}
onClick={() => onClickTag(item)}
>
<Image src={imgs[i]} width={64} height={64} alt=""></Image>
<Image src={imgs[i]} width={64} height={64} alt=''></Image>
<div className={styles.identityBtn}>
{item.tagName}
{">"}
{'>'}
</div>
</Col>
);
......
components/NavHeader/publishModal/api/index.ts
import request, { Response } from "~/api/request"
import request, { Response } from '~/api/request';
export interface TypeResp {
id: number;
......@@ -7,26 +7,26 @@ export interface TypeResp {
export interface PublishParams {
publishPhone: number; //手机号
publishName: string; //发布名称
requirementTypeId: number; //需求类型
publishName: string; //发布名称
requirementTypeId: number; //需求类型
requireDescription: string; //需求描述
provinceCode?: string; //省编码
provinceCode?: string; //省编码
}
export default {
/**
* 需求类型
* @returns
* @returns
*/
listType(): Promise<Response<Array<TypeResp>>>{
return request('/release/requirements/listType')
listType(): Promise<Response<Array<TypeResp>>> {
return request('/release/requirements/listType');
},
/**
* 需求发布
* @param params
* @returns
* @param params
* @returns
*/
publish(params: PublishParams): Promise<Response<any>>{
publish(params: PublishParams): Promise<Response<any>> {
return request('/release/requirements/publish', 'post', params);
}
}
\ No newline at end of file
},
};
components/NavHeader/publishModal/index.tsx
import { Button, Form, Input, Modal, Select } from "antd";
import { useContext, useEffect, useState } from "react";
import { CommonContext } from "~/lib/commonProvider";
import { useGeolocation } from "~/lib/hooks";
import api, { PublishParams, TypeResp } from "./api";
import styles from "./index.module.scss";
import {phoneNumber} from '~/lib/validateUtils'
import { Button, Form, Input, Modal, Select } from 'antd';
import { useContext, useEffect, useState } from 'react';
import { CommonContext } from '~/lib/commonProvider';
import { useGeolocation } from '~/lib/hooks';
import api, { PublishParams, TypeResp } from './api';
import styles from './index.module.scss';
import { phoneNumber } from '~/lib/validateUtils';
type Props = {
open?: boolean;
......@@ -14,15 +14,14 @@ type Props = {
export default function PublishModal(props: Props) {
const [types, setTypes] = useState<Array<TypeResp>>([]); //需求类型
const [params, setParams] = useState<PublishParams>({
publishName: "",
publishName: '',
publishPhone: -1,
requireDescription: "",
requireDescription: '',
requirementTypeId: -1,
});
const [form] = Form.useForm();
const position = useGeolocation();
const { reloadRequirements, setReloadRequirements } =
useContext(CommonContext);
const { reloadRequirements, setReloadRequirements } = useContext(CommonContext);
useEffect(() => {
api.listType().then((res) => {
......@@ -31,18 +30,18 @@ export default function PublishModal(props: Props) {
}, []);
const onFinish = (values: any) => {
console.log("Success:", values);
console.log('Success:', values);
values.publishPhone = Number(values.publishPhone);
api
.publish({
...params,
...values,
provinceCode: position?.address?.addressComponent?.adcode
provinceCode: position?.address?.addressComponent?.adcode,
})
.then((res) => {
if (res.code === "200") {
if (res.code === '200') {
props.onCancel && props.onCancel();
window.messageApi.success("发布成功");
window.messageApi.success('发布成功');
setReloadRequirements(!reloadRequirements);
setTimeout(() => {
form.resetFields();
......@@ -52,7 +51,7 @@ export default function PublishModal(props: Props) {
};
const onFinishFailed = (errorInfo: any) => {
console.log("Failed:", errorInfo);
console.log('Failed:', errorInfo);
};
return (
......@@ -60,68 +59,60 @@ export default function PublishModal(props: Props) {
open={props.open}
onOk={props.onOk}
onCancel={props.onCancel}
title="需求发布"
title='需求发布'
className={styles.modal}
width={460}
footer={null}
>
<Form
labelCol={{ span: 5 }}
labelAlign="left"
labelAlign='left'
onFinish={onFinish}
onFinishFailed={onFinishFailed}
form={form}
>
<Form.Item
label="姓名"
name="publishName"
rules={[{ required: true, message: "请输入姓名！" }]}
label='姓名'
name='publishName'
rules={[{ required: true, message: '请输入姓名！' }]}
>
<Input placeholder="输入姓名"></Input>
<Input placeholder='输入姓名'></Input>
</Form.Item>
<Form.Item
label="手机号"
name="publishPhone"
label='手机号'
name='publishPhone'
rules={[
{ required: true, message: "请输入手机号！" },
{ required: true, message: '请输入手机号！' },
{
pattern: /^1\d{10}$/,
message: "很输入11位手机号",
message: '很输入11位手机号',
},
]}
>
<Input
onInput={phoneNumber}
maxLength={11}
allowClear
placeholder="输入手机号"
></Input>
<Input onInput={phoneNumber} maxLength={11} allowClear placeholder='输入手机号'></Input>
</Form.Item>
<Form.Item
label="需求类型"
name="requirementTypeId"
rules={[{ required: true, message: "请选择需求类型！" }]}
label='需求类型'
name='requirementTypeId'
rules={[{ required: true, message: '请选择需求类型！' }]}
>
<Select
placeholder="选择需求类型"
placeholder='选择需求类型'
options={types}
fieldNames={{ label: "typeName", value: "id" }}
fieldNames={{ label: 'typeName', value: 'id' }}
></Select>
</Form.Item>
<Form.Item
name="requireDescription"
rules={[{ required: true, message: "请输入需求描述！" }]}
name='requireDescription'
rules={[{ required: true, message: '请输入需求描述！' }]}
>
<Input.TextArea
placeholder="项目需求描述"
style={{ height: 162 }}
></Input.TextArea>
<Input.TextArea placeholder='项目需求描述' style={{ height: 162 }}></Input.TextArea>
</Form.Item>
<Form.Item>
<Button
type="primary"
htmlType="submit"
style={{ width: "100%", height: 40, borderRadius: 0 }}
type='primary'
htmlType='submit'
style={{ width: '100%', height: 40, borderRadius: 0 }}
>
立即发布
</Button>
......
components/brandSelectSearch/index.tsx
......@@ -56,17 +56,16 @@ const BrandSelectSearch: React.FC<propType> = (props) => {
: _options.map(function (i) {
var _pinyin, _pinyin$at, _pinyin$at$at;
return (_pinyin = pinyin(i.label, {
toneType: "none",
type: "array",
toneType: 'none',
type: 'array',
})) === null || _pinyin === void 0
? void 0
: (_pinyin$at = _pinyin.at(0)) === null || _pinyin$at === void 0
? void 0
: (_pinyin$at$at = _pinyin$at.at(0)) === null ||
_pinyin$at$at === void 0
: (_pinyin$at$at = _pinyin$at.at(0)) === null || _pinyin$at$at === void 0
? void 0
: _pinyin$at$at.toUpperCase();
})
}),
);
// 获取开头字母列表（去重）
const arr = [
......
components/contentBox/index.tsx
import React from "react";
import { Box } from "./styled";
import Left from "./left";
import Right from "./right";
import { BoxProps } from "./interface";
import React from 'react';
import { Box } from './styled';
import Left from './left';
import Right from './right';
import { BoxProps } from './interface';
export default function ContentBox(props: BoxProps) {
return (
<Box>
......
components/contentBox/interface.ts
......@@ -8,7 +8,7 @@ export interface DomType {
export interface WaterfallType {
columns: {
noFor?: boolean;
type?: string,
type?: string;
element: JSX.Element;
}[];
pagination?: JSX.Element;
......
components/contentBox/left/index.tsx
import React, { useEffect } from "react";
import { Empty } from "antd";
import { LeftBox , Box , WaterfallBox } from "./styled";
import { leftBoxProps } from "../interface";
import React, { useEffect } from 'react';
import { Empty } from 'antd';
import { LeftBox, Box, WaterfallBox } from './styled';
import { leftBoxProps } from '../interface';
export default function Left(props: leftBoxProps) {
const { boxIndex, leftRenderDom, leftcontentstyle, leftWaterfallDom } = props;
const { boxIndex, leftRenderDom, leftcontentstyle, leftWaterfallDom } = props;
return (
<LeftBox>
{leftRenderDom?.columns.map((item) => {
......@@ -29,29 +29,33 @@ export default function Left(props: leftBoxProps) {
}
return null;
})}
{
leftWaterfallDom?.columns.length ? <WaterfallBox index={boxIndex} leftcontentstyle={leftcontentstyle}>
{ <div className="left-columns">
{leftWaterfallDom?.columns.map((item) => {
if (!item.noFor && item.type === "left") {
return item.element
}
return null
})}
</div>}
{ <div className="right-columns">
{leftWaterfallDom?.columns.map((item) => {
if (!item.noFor && item.type === "right") {
return item.element
}
return null
})}
</div>}
</WaterfallBox> : null
}
{leftWaterfallDom?.columns.length ? (
<WaterfallBox index={boxIndex} leftcontentstyle={leftcontentstyle}>
{
<div className='left-columns'>
{leftWaterfallDom?.columns.map((item) => {
if (!item.noFor && item.type === 'left') {
return item.element;
}
return null;
})}
</div>
}
{
<div className='right-columns'>
{leftWaterfallDom?.columns.map((item) => {
if (!item.noFor && item.type === 'right') {
return item.element;
}
return null;
})}
</div>
}
</WaterfallBox>
) : null}
{leftRenderDom?.pagination ? leftRenderDom?.pagination : null}
{!leftRenderDom?.columns.length && !leftWaterfallDom?.columns.length? (
<Empty description={"暂无数据"} />
{!leftRenderDom?.columns.length && !leftWaterfallDom?.columns.length ? (
<Empty description={'暂无数据'} />
) : null}
</LeftBox>
);
......
components/contentBox/left/styled.tsx
import styled from "styled-components"
import styled from 'styled-components';
export interface BoxProps {
index:number,
leftcontentstyle?:{
width?:string,
margin?:{
top:number | string,
right:number | string,
bottom:number | string,
left:number | string
}
}
index: number;
leftcontentstyle?: {
width?: string;
margin?: {
top: number | string;
right: number | string;
bottom: number | string;
left: number | string;
};
};
}
export const LeftBox = styled.div`
box-sizing: border-box;
`
box-sizing: border-box;
`;
export const Box = styled.div<BoxProps>`
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
width: ${props => props.leftcontentstyle?.width ? props.leftcontentstyle?.width : "790px"};
.item{
// 每个元素都要设置右边距margin-right（每个元素的左右间隙）
// 同时设置下边距margin-bottom（每个元素的上下间隙）
/* margin: 0 24px 15px 0; */
margin: ${props => props.leftcontentstyle?.margin ? (`${props.leftcontentstyle?.margin.top} ${props.leftcontentstyle?.margin.right} ${props.leftcontentstyle?.margin.bottom} ${props.leftcontentstyle?.margin.left}`) : "0 24px 15px 0"};;
width: calc((100% - ${props => props.index - 1} * ${props => props.leftcontentstyle?.margin ? props.leftcontentstyle?.margin.right : "24px" }) / ${props => props.index});
// 这里一行显示index个，所以是/index，一行显示几个就除以几
// 这里的72px = (分布个数index-1)*间隙20px, 可以根据实际的分布个数和间隙区调整
min-width: calc((100% - ${props => props.index - 1} * ${props => props.leftcontentstyle?.margin ? props.leftcontentstyle?.margin.right : "24px" }) / ${props => props.index});
max-width: calc((100% - ${props => props.index - 1} * ${props => props.leftcontentstyle?.margin ? props.leftcontentstyle?.margin.right : "24px" }) / ${props => props.index});
// 每行最右侧的那个不设置右外边距
&:nth-child(${props => props.index}n + ${props => props.index}) {
margin-right: 0;
}
}
`
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
width: ${(props) => (props.leftcontentstyle?.width ? props.leftcontentstyle?.width : '790px')};
.item {
// 每个元素都要设置右边距margin-right（每个元素的左右间隙）
// 同时设置下边距margin-bottom（每个元素的上下间隙）
/* margin: 0 24px 15px 0; */
margin: ${(props) =>
props.leftcontentstyle?.margin
? `${props.leftcontentstyle?.margin.top} ${props.leftcontentstyle?.margin.right} ${props.leftcontentstyle?.margin.bottom} ${props.leftcontentstyle?.margin.left}`
: '0 24px 15px 0'};
width: calc(
(
100% - ${(props) => props.index - 1} *
${(props) =>
props.leftcontentstyle?.margin ? props.leftcontentstyle?.margin.right : '24px'}
) / ${(props) => props.index}
);
// 这里一行显示index个，所以是/index，一行显示几个就除以几
// 这里的72px = (分布个数index-1)*间隙20px, 可以根据实际的分布个数和间隙区调整
min-width: calc(
(
100% - ${(props) => props.index - 1} *
${(props) =>
props.leftcontentstyle?.margin ? props.leftcontentstyle?.margin.right : '24px'}
) / ${(props) => props.index}
);
max-width: calc(
(
100% - ${(props) => props.index - 1} *
${(props) =>
props.leftcontentstyle?.margin ? props.leftcontentstyle?.margin.right : '24px'}
) / ${(props) => props.index}
);
// 每行最右侧的那个不设置右外边距
&:nth-child(${(props) => props.index}n + ${(props) => props.index}) {
margin-right: 0;
}
}
`;
export const WaterfallBox = styled.div<BoxProps>`
box-sizing: border-box;
display: flex;
width: ${props => props.leftcontentstyle?.width ? props.leftcontentstyle?.width : "790px"};
.item{
// 每个元素都要设置右边距margin-right（每个元素的左右间隙）
// 同时设置下边距margin-bottom（每个元素的上下间隙）
/* margin: 0 24px 15px 0; */
margin: ${props => props.leftcontentstyle?.margin ? (`${props.leftcontentstyle?.margin.top} ${props.leftcontentstyle?.margin.right} ${props.leftcontentstyle?.margin.bottom} ${props.leftcontentstyle?.margin.left}`) : "0 24px 15px 0"};;
/* width: calc(( 100% - ${props => props.index} * ${props => props.leftcontentstyle?.margin ? props.leftcontentstyle?.margin.right : "24px" }) / ${props => props.index});
box-sizing: border-box;
display: flex;
width: ${(props) => (props.leftcontentstyle?.width ? props.leftcontentstyle?.width : '790px')};
.item {
// 每个元素都要设置右边距margin-right（每个元素的左右间隙）
// 同时设置下边距margin-bottom（每个元素的上下间隙）
/* margin: 0 24px 15px 0; */
margin: ${(props) =>
props.leftcontentstyle?.margin
? `${props.leftcontentstyle?.margin.top} ${props.leftcontentstyle?.margin.right} ${props.leftcontentstyle?.margin.bottom} ${props.leftcontentstyle?.margin.left}`
: '0 24px 15px 0'};
/* width: calc(( 100% - ${(props) => props.index} * ${(props) =>
props.leftcontentstyle?.margin ? props.leftcontentstyle?.margin.right : '24px'}) / ${(
props,
) => props.index});
// 这里一行显示index个，所以是/index，一行显示几个就除以几
// 这里的72px = (分布个数index-1)*间隙20px, 可以根据实际的分布个数和间隙区调整
min-width: calc(( 100% - ${props => props.index} * ${props => props.leftcontentstyle?.margin ? props.leftcontentstyle?.margin.right : "24px" }) / ${props => props.index});
max-width: calc(( 100% - ${props => props.index} * ${props => props.leftcontentstyle?.margin ? props.leftcontentstyle?.margin.right : "24px" }) / ${props => props.index}); */
}
.left-columns{
}
.right-columns{
.item{
margin-right: 0;
}
}
`
min-width: calc(( 100% - ${(props) => props.index} * ${(props) =>
props.leftcontentstyle?.margin ? props.leftcontentstyle?.margin.right : '24px'}) / ${(
props,
) => props.index});
max-width: calc(( 100% - ${(props) => props.index} * ${(props) =>
props.leftcontentstyle?.margin ? props.leftcontentstyle?.margin.right : '24px'}) / ${(
props,
) => props.index}); */
}
.left-columns {
}
.right-columns {
.item {
margin-right: 0;
}
}
`;
components/contentBox/right/index.tsx
import React from 'react';
import { Box } from './styled';
import {rightBoxProps} from '../interface';
export default function Right(props:rightBoxProps) {
const { rightRenderDom } = props
return (
<Box>
{
rightRenderDom.columns.map((item)=>item.element)
}
</Box>
)
import { rightBoxProps } from '../interface';
export default function Right(props: rightBoxProps) {
const { rightRenderDom } = props;
return <Box>{rightRenderDom.columns.map((item) => item.element)}</Box>;
}
components/contentBox/right/styled.tsx
import styled from "styled-components";
import styled from 'styled-components';
export const Box = styled.div`
box-sizing: border-box;
......
components/contentBox/styled.tsx
import styled from "styled-components"
import styled from 'styled-components';
export const Box = styled.div`
box-sizing: border-box;
display:flex;
justify-content: space-between;
width:100%;
`
\ No newline at end of file
box-sizing: border-box;
display: flex;
justify-content: space-between;
width: 100%;
`;
components/filter/api/index.ts
import request, { Response } from '~/api/request'
import request, { Response } from '~/api/request';
export interface FilterOptionResp {
id: number
name?: string
appName?: string
id: number;
name?: string;
appName?: string;
}
export interface RegionResp {
childInfo: RegionResp[] | null
id: number
level: number
name: string
pid: number
childInfo: RegionResp[] | null;
id: number;
level: number;
name: string;
pid: number;
}
export interface InfoList {
id: number
directoryId: number
name: string
icon: string
id: number;
directoryId: number;
name: string;
icon: string;
}
export interface TypesResp {
directoryId: number
name: string
categoriesInfoListDTO: InfoList[]
directoryId: number;
name: string;
categoriesInfoListDTO: InfoList[];
}
export default {
category: (): Promise<Response<Array<FilterOptionResp>>> => {
return request('/pms/webProductMall/category')
return request('/pms/webProductMall/category');
},
categoryId: (): Promise<Response<Array<FilterOptionResp>>> => {
return request('/pms/webDevice/category')
return request('/pms/webDevice/category');
},
brand: (): Promise<Response<Array<FilterOptionResp>>> => {
return request('/pms/webDevice/brand')
return request('/pms/webDevice/brand');
},
model: (): Promise<Response<Array<FilterOptionResp>>> => {
return request('/pms/webDevice/model')
return request('/pms/webDevice/model');
},
part: (): Promise<Response<Array<FilterOptionResp>>> => {
return request('/pms/webProductMall/parts')
return request('/pms/webProductMall/parts');
},
quality: (): Promise<Response<Array<FilterOptionResp>>> => {
return request('/pms/webProductMall/quality')
return request('/pms/webProductMall/quality');
},
region: (): Promise<Response<Array<RegionResp>>> => {
return request('/pms/webDevice/getSecondDistrictInfo')
return request('/pms/webDevice/getSecondDistrictInfo');
},
industry: (): Promise<Response<Array<RegionResp>>> => {
return request('/release/work/listAllIndustry')
return request('/release/work/listAllIndustry');
},
appType: (): Promise<Response<Array<RegionResp>>> => {
return request('/release/work/listAllAppType')
return request('/release/work/listAllAppType');
},
deviceBrand: (): Promise<Response<Array<RegionResp>>> => {
return request('/pms/webDevice/deviceBrand')
return request('/pms/webDevice/deviceBrand');
},
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)
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 { useEffect, useState } from 'react'
import styles from '../../index.module.scss'
import api, { RegionResp } from '../../api'
import { Space, Select } from 'antd';
import { useEffect, useState } from 'react';
import styles from '../../index.module.scss';
import api, { RegionResp } from '../../api';
type Props = {
onChange: (item: RegionResp) => void
}
onChange: (item: RegionResp) => void;
};
export default function RegionItem(props: Props) {
const [provinceList, setProvinceList] = useState<RegionResp[]>([])
const [cityList, setCityList] = useState<RegionResp[]>([])
const [selectCity, setSelectCity] = useState<number>()
const [provinceList, setProvinceList] = useState<RegionResp[]>([]);
const [cityList, setCityList] = useState<RegionResp[]>([]);
const [selectCity, setSelectCity] = useState<number>();
useEffect(() => {
api.region().then((res) => {
setProvinceList(res?.result || [])
})
}, [])
setProvinceList(res?.result || []);
});
}, []);
const onProvinceChange = (value: number, item: any) => {
console.log('省', value, item)
setCityList(item.childInfo || [])
setSelectCity(undefined)
props.onChange(item)
}
console.log('省', value, item);
setCityList(item.childInfo || []);
setSelectCity(undefined);
props.onChange(item);
};
const onCityChange = (value: number, item: any) => {
console.log('市', value)
setSelectCity(value)
props.onChange(item)
}
console.log('市', value);
setSelectCity(value);
props.onChange(item);
};
return (
<div className={styles.filterItem}>
<div className={styles.filterItemTitle}>地域：</div>
......@@ -37,14 +37,14 @@ export default function RegionItem(props: Props) {
<Select
bordered={false}
popupMatchSelectWidth={false}
placeholder="选择省"
placeholder='选择省'
onChange={onProvinceChange}
options={provinceList.map((item) => {
return {
...item,
value: item.id,
label: item.name,
}
};
})}
/>
{/* <Select
......@@ -64,5 +64,5 @@ export default function RegionItem(props: Props) {
</Space>
</div>
</div>
)
);
}
components/filter/compoents/resultItem/index.tsx
import { Space, Tag } from 'antd'
import { FilterResult } from '../..'
import styles from '../../index.module.scss'
import { InfoList } from '../../api'
import { Space, Tag } from 'antd';
import { FilterResult } from '../..';
import styles from '../../index.module.scss';
import { InfoList } from '../../api';
type Props = {
data: FilterResult
onDel: (key: string | number) => void
}
data: FilterResult;
onDel: (key: string | number) => void;
};
export default function ResultItem({ data, onDel }: Props) {
return (
<div className={styles.filterItem}>
......@@ -31,7 +31,7 @@ export default function ResultItem({ data, onDel }: Props) {
<Tag
closable
onClose={(e: React.MouseEvent<HTMLElement, MouseEvent>) => {
onDel('provinceId')
onDel('provinceId');
}}
key={data.provinceId.id}
>
......@@ -44,16 +44,16 @@ export default function ResultItem({ data, onDel }: Props) {
<Tag
closable
onClose={(e: React.MouseEvent<HTMLElement, MouseEvent>) => {
onDel(item.id)
onDel(item.id);
}}
key={item.name}
>
{item?.name}
</Tag>
)
);
})}
</Space>
</div>
</div>
)
);
}
components/filter/compoents/typeInfo/index.tsx
import { Space, Button, Select, Collapse } from 'antd'
import styles from '../../index.module.scss'
import api, { FilterOptionResp, InfoList } from '../../api'
import { useState, useEffect } from 'react'
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[]
}
onChange: (id: FilterOptionResp) => void;
typeName: string;
dataValue: InfoList[];
};
export default function CategoryItem(props: Props) {
const [data, setData] = useState<FilterOptionResp[]>([])
const [data, setData] = useState<FilterOptionResp[]>([]);
useEffect(() => {
setData(props.dataValue || [])
}, [])
setData(props.dataValue || []);
}, []);
const onClick = (item: FilterOptionResp) => {
props.onChange({
id: item.id,
name: `${props.typeName}：` + item.name,
})
}
});
};
const showCount = 9 //展示数量
const showCount = 9; //展示数量
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%' }}
>
<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)}
>
<Button type='link' key={item.id} onClick={(e) => onClick(item)}>
{item.name}
</Button>
)
);
})}
</Space>
}
key="1"
key='1'
>
<Space size={40}>
{data.slice(showCount).map((item) => {
return (
<Button
type="link"
key={item.id}
onClick={(e) => onClick(item)}
>
<Button type='link' key={item.id} onClick={(e) => onClick(item)}>
{item.name}
</Button>
)
);
})}
</Space>
</Collapse.Panel>
</Collapse>
</div>
</div>
)
);
}
components/filter/index.tsx
import { FilterOptionResp, RegionResp } from './api'
import ResultItem from './compoents/resultItem'
import RegionItem from './compoents/regionItem'
import styles from './index.module.scss'
import React, {
useEffect,
useState,
forwardRef,
useImperativeHandle,
Ref,
} from 'react'
import { useRouter } from 'next/router'
import TypeInfo from './compoents/typeInfo'
import api, { TypesResp, InfoList } from './api'
import { FilterOptionResp, RegionResp } from './api';
import ResultItem from './compoents/resultItem';
import RegionItem from './compoents/regionItem';
import styles from './index.module.scss';
import React, { useEffect, useState, forwardRef, useImperativeHandle, Ref } from 'react';
import { useRouter } from 'next/router';
import TypeInfo from './compoents/typeInfo';
import api, { TypesResp, InfoList } from './api';
export type AdapterResult = {
categoryId?: any[]
provinceId?: number
}
categoryId?: any[];
provinceId?: number;
};
export type FilterResult = {
categoryId?: InfoList[]
provinceId?: FilterOptionResp
}
categoryId?: InfoList[];
provinceId?: FilterOptionResp;
};
type Props = {
types: string[] //需要包含的筛选条件项
showResultItem: Boolean //显示结果栏
types: string[]; //需要包含的筛选条件项
showResultItem: Boolean; //显示结果栏
onChange: (
filterResult: FilterResult,
adapterFilterResult: AdapterResult //适配器,直接用于接口请求
) => void //筛选条件更改事件
}
adapterFilterResult: AdapterResult, //适配器,直接用于接口请求
) => void; //筛选条件更改事件
};
const Filter = (props: Props, ref: Ref<any>) => {
const router = useRouter()
const router = useRouter();
useImperativeHandle(ref, () => ({
clearRouter: clearRouter,
}))
const [result, setResult] = useState<FilterResult>({})
}));
const [result, setResult] = useState<FilterResult>({});
const onChange = (item: FilterOptionResp, type: string) => {
clearRouter()
let data: { [key: string]: FilterOptionResp[] | FilterOptionResp } = {}
clearRouter();
let data: { [key: string]: FilterOptionResp[] | FilterOptionResp } = {};
if (type === 'categoryId') {
if (result.categoryId) {
data[type] = [...result.categoryId, item]
const map = new Map()
data[type] = [...result.categoryId, item];
const map = new Map();
//去重
data[type] = (data[type] as InfoList[]).filter(
(v) => !map.has(v.id) && map.set(v.id, 1)
)
data[type] = (data[type] as InfoList[]).filter((v) => !map.has(v.id) && map.set(v.id, 1));
} else {
data[type] = [item]
data[type] = [item];
}
} else {
data[type] = item
data[type] = item;
}
setResult({ ...result, ...data })
}
setResult({ ...result, ...data });
};
useEffect(() => {
props.onChange(result, {
categoryId: result.categoryId,
provinceId: result.provinceId?.id,
})
}, [result])
});
}, [result]);
const clearRouter = () => {
if (Object.keys(router.query).length) {
router.query = {}
router.replace(router.pathname)
router.query = {};
router.replace(router.pathname);
}
}
};
const onDel = (key: string | number) => {
clearRouter()
console.log(key)
clearRouter();
console.log(key);
if (Object.prototype.toString.call(key) === '[object String]') {
//@ts-ignore
delete result[key]
delete result[key];
} else {
if (result.categoryId?.length! === 1) {
result.categoryId = undefined
result.categoryId = undefined;
} else if (result.categoryId?.length! >= 2) {
result.categoryId?.map((item, index) => {
if (item.id === key) {
result.categoryId?.splice(index, 1)
result.categoryId?.splice(index, 1);
}
})
});
}
}
setResult({
...result,
})
}
const routerList = [
'/jobServices',
'/equipmentLeasing',
'/flyingHandService',
'/mall',
]
const [typeInfo, setTypeInfo] = useState<Array<TypesResp> | null>()
});
};
const routerList = ['/jobServices', '/equipmentLeasing', '/flyingHandService', '/mall'];
const [typeInfo, setTypeInfo] = useState<Array<TypesResp> | null>();
useEffect(() => {
if (routerList.indexOf(router.pathname) > -1) {
;(async () => {
(async () => {
const res = await api.infoByType({
type: routerList.indexOf(router.pathname) + 1,
})
setTypeInfo(res.result)
});
setTypeInfo(res.result);
//首页跳转自定筛选选中
let queryVal = JSON.parse(JSON.stringify(router.query))
let queryVal = JSON.parse(JSON.stringify(router.query));
if (Object.keys(router.query).length) {
//获取类型的id
const idOfType = res.result
?.map((item) => item.categoriesInfoListDTO)
.flat()
.filter(
(item) => item && item.id === Number(queryVal['categoryId'])
)[0]?.directoryId
.filter((item) => item && item.id === Number(queryVal['categoryId']))[0]?.directoryId;
//获取类型的名称然后拼接
const TypeName = res.result?.filter(
(item) => item.directoryId === idOfType
)[0]?.name
const TypeName = res.result?.filter((item) => item.directoryId === idOfType)[0]?.name;
onChange(
{
id: Number(queryVal['categoryId']),
name: `${
TypeName ? TypeName + '：' + queryVal.name : queryVal.name
}`,
name: `${TypeName ? TypeName + '：' + queryVal.name : queryVal.name}`,
},
'categoryId'
)
'categoryId',
);
}
})()
})();
}
}, [router])
}, [router]);
return (
<>
......@@ -160,17 +139,13 @@ const Filter = (props: Props, ref: Ref<any>) => {
key={item.directoryId}
typeName={item.name}
dataValue={item.categoriesInfoListDTO}
onChange={(item: FilterOptionResp) =>
onChange(item, 'categoryId')
}
onChange={(item: FilterOptionResp) => onChange(item, 'categoryId')}
></TypeInfo>
))}
{props.showResultItem && (
<ResultItem data={result} onDel={onDel}></ResultItem>
)}
{props.showResultItem && <ResultItem data={result} onDel={onDel}></ResultItem>}
</div>
</>
)
}
);
};
export default forwardRef(Filter)
export default forwardRef(Filter);
components/footer/index.tsx
import styles from "./index.module.scss";
import { Image } from "antd";
import errImg from "~/assets/errImg";
import styles from './index.module.scss';
import { Image } from 'antd';
import errImg from '~/assets/errImg';
import img_mmc from './assets/mmc.png';
const qrcodeList = [
{
img: "/assets/mmc.png",
title: "科比特官网",
url: "http://www.mmcuav.cn/",
img: '/assets/mmc.png',
title: '科比特官网',
url: 'http://www.mmcuav.cn/',
},
{
img: "/assets/fuwuhao.png",
title: "云享飞服务号",
img: '/assets/fuwuhao.png',
title: '云享飞服务号',
},
{
img: "/assets/xiaochengxu.png",
title: "云享飞小程序",
img: '/assets/xiaochengxu.png',
title: '云享飞小程序',
},
{
img: "/assets/shequn.png",
title: "官方社群",
img: '/assets/shequn.png',
title: '官方社群',
},
];
......@@ -34,17 +34,16 @@ export default function Footer() {
<div className={styles.qrcodeItem} key={i}>
<Image
style={{
cursor: item.title === "科比特官网" ? "pointer" : "",
cursor: item.title === '科比特官网' ? 'pointer' : '',
}}
onClick={() => {
if (item.title === "科比特官网")
window.location.href = item.url!;
if (item.title === '科比特官网') window.location.href = item.url!;
}}
alt=""
alt=''
className={styles.qrcodeImg}
src={item.img}
fallback={errImg}
preview={item.title !== "科比特官网"}
preview={item.title !== '科比特官网'}
></Image>
<div className={styles.qrcodeTitle}>{item.title}</div>
</div>
......
components/layout/index.tsx
import React, { Suspense } from "react";
import { Layout, Space } from "antd";
import NavHeader from "~/components/NavHeader";
import FooterView from "~/components/footer";
import {useRouter} from 'next/router'
import React, { Suspense } from 'react';
import { Layout, Space } from 'antd';
import NavHeader from '~/components/NavHeader';
import FooterView from '~/components/footer';
import { useRouter } from 'next/router';
import styles from './index.module.scss';
const { Header, Footer, Content } = Layout;
//底部栏固定定位
const includesPage = ["/home","/flyingHandService/detail/[id]"]
const includesPage = ['/home', '/flyingHandService/detail/[id]'];
const homeStyle: React.CSSProperties = {
marginTop:10
}
marginTop: 10,
};
const headerStyle: React.CSSProperties = {
height: "auto",
background: "none",
height: 'auto',
background: 'none',
padding: 0,
lineHeight: "1",
position: "relative",
lineHeight: '1',
position: 'relative',
};
const contentStyle: React.CSSProperties = {
minHeight: 120,
lineHeight: "1",
color: "",
backgroundColor: "",
lineHeight: '1',
color: '',
backgroundColor: '',
width: 1200,
position: "relative",
margin: "0 auto",
position: 'relative',
margin: '0 auto',
};
const footerStyle: React.CSSProperties = {
lineHeight: "1",
lineHeight: '1',
padding: 0,
position: "relative",
position: 'relative',
marginTop: 60,
};
......@@ -43,18 +43,15 @@ type Props = {
layoutStyle?: React.CSSProperties;
contentStyle?: React.CSSProperties;
hideFooter?: boolean;
headerStyle?: React.CSSProperties
headerStyle?: React.CSSProperties;
};
export default function LayoutView(props: Props) {
const router = useRouter()
const router = useRouter();
return (
<Space direction="vertical" style={{ minWidth: "100%" }} size={[0, 48]}>
<Space direction='vertical' style={{ minWidth: '100%' }} size={[0, 48]}>
<Layout
style={Object.assign(
{ minHeight: "100vh", backgroundColor: "#F8F8F8" },
props.layoutStyle
)}
style={Object.assign({ minHeight: '100vh', backgroundColor: '#F8F8F8' }, props.layoutStyle)}
>
<Header style={headerStyle}>
<NavHeader style={props.headerStyle} />
......
components/loginModal/index.tsx
import React, { useContext, useEffect, useState } from "react";
import { Modal, Image } from "antd";
import api from "~/api";
import { UserContext } from "~/lib/userProvider";
import errImg from "~/assets/errImg";
import React, { useContext, useEffect, useState } from 'react';
import { Modal, Image } from 'antd';
import api from '~/api';
import { UserContext } from '~/lib/userProvider';
import errImg from '~/assets/errImg';
type Props = {
open: boolean;
......@@ -10,8 +10,8 @@ type Props = {
};
export default function LoginModal(props: Props) {
const [qrCode, setQrCode] = useState("");
const [randomLoginCode, setRandomLoginCode] = useState("");
const [qrCode, setQrCode] = useState('');
const [randomLoginCode, setRandomLoginCode] = useState('');
const { userInfo, setUserInfo } = useContext(UserContext);
const [timeHandle, setTimeHandle] = useState<NodeJS.Timer | null>(null);
useEffect(() => {
......@@ -28,7 +28,7 @@ export default function LoginModal(props: Props) {
});
} */
if (!props.open) {
setQrCode("");
setQrCode('');
return;
}
......@@ -43,10 +43,10 @@ export default function LoginModal(props: Props) {
randomLoginCode,
})
.then((res) => {
if (res.code == "200") {
setQrCode("data:image/png;base64," + res.result || "");
if (res.code == '200') {
setQrCode('data:image/png;base64,' + res.result || '');
} else {
window.messageApi.error("获取登录二维码失败");
window.messageApi.error('获取登录二维码失败');
}
});
}
......@@ -61,14 +61,14 @@ export default function LoginModal(props: Props) {
randomLoginCode: randomLoginCode,
})
.then((res) => {
if (res.code === "200") {
if (res.code === '200') {
clearInterval(handle);
setTimeHandle(null);
window.localStorage.setItem("token", res.result.token);
window.localStorage.setItem('token', res.result.token);
api.userInfo().then((res) => {
setUserInfo(res.result);
window.messageApi.success("登录成功");
window.messageApi.success('登录成功');
props.onCancel();
window.location.reload();
});
......@@ -87,41 +87,31 @@ export default function LoginModal(props: Props) {
return (
<>
<Modal
open={props.open}
onCancel={props.onCancel}
width={400}
footer={null}
>
<Modal open={props.open} onCancel={props.onCancel} width={400} footer={null}>
<div
style={{
fontSize: 20,
fontFamily: "MicrosoftYaHeiUI-Bold, MicrosoftYaHeiUI",
fontWeight: "bold",
color: "#000",
fontFamily: 'MicrosoftYaHeiUI-Bold, MicrosoftYaHeiUI',
fontWeight: 'bold',
color: '#000',
marginTop: 17,
marginBottom: 48,
textAlign: "center",
textAlign: 'center',
}}
>
欢迎来到云享飞
</div>
<div id="login_container" style={{ margin: "auto", display: "table" }}>
<Image
src={qrCode}
width={150}
height={150}
fallback={errImg}
></Image>
<div id='login_container' style={{ margin: 'auto', display: 'table' }}>
<Image src={qrCode} width={150} height={150} fallback={errImg}></Image>
</div>
<div
style={{
// marginTop: -120,
marginBottom: 52,
fontSize: 14,
fontFamily: "MicrosoftYaHei",
color: "#3E454D",
textAlign: "center",
fontFamily: 'MicrosoftYaHei',
color: '#3E454D',
textAlign: 'center',
}}
>
打开微信扫一扫
......
lib/commonProvider.tsx
import React, { createContext, Dispatch, SetStateAction, useState } from "react";
import React, { createContext, Dispatch, SetStateAction, useState } from 'react';
export const CommonContext = createContext<{
reloadRequirements: boolean; //更新项目需求列表
setReloadRequirements: Dispatch<SetStateAction<boolean>>;
}>({
reloadRequirements: false,
setReloadRequirements: () => {}
setReloadRequirements: () => {},
});
type Props = {
......
lib/hooks.ts
import { useEffect, useState } from "react";
import { useEffect, useState } from 'react';
export function useGeolocation() {
const [position, setPosition] = useState<{
position?: any,
address?: any
position?: any;
address?: any;
} | null>(null);
useEffect(() => {
const AMapLoader = require("@amap/amap-jsapi-loader");
const AMapLoader = require('@amap/amap-jsapi-loader');
window._AMapSecurityConfig = {
securityJsCode: 'd7492300c43c8d3737909b77f2b2c387',
}
};
AMapLoader.load({
key: "87b424e68754efc3ba9d11ae07475091", // 申请好的Web端开发者Key，首次调用 load 时必填
version: "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
plugins: ['AMap.Geolocation', "AMap.Geocoder"], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
key: '87b424e68754efc3ba9d11ae07475091', // 申请好的Web端开发者Key，首次调用 load 时必填
version: '2.0', // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
plugins: ['AMap.Geolocation', 'AMap.Geocoder'], // 需要使用的的插件列表，如比例尺'AMap.Scale'等
})
.then(async (AMap: any) => {
//用户定位
const geolocation = new AMap.Geolocation({
enableHighAccuracy: true,//是否使用高精度定位，默认:true
timeout: 10000, //超过10秒后停止定位，默认：5s
position: 'RB', //定位按钮的停靠位置
enableHighAccuracy: true, //是否使用高精度定位，默认:true
timeout: 10000, //超过10秒后停止定位，默认：5s
position: 'RB', //定位按钮的停靠位置
offset: [10, 20], //定位按钮与设置的停靠位置的偏移量，默认：[10, 20]
zoomToAccuracy: true, //定位成功后是否自动调整地图视野到定位点
zoomToAccuracy: true, //定位成功后是否自动调整地图视野到定位点
});
geolocation.getCurrentPosition(function (status: string, result: any) {
if (status == 'complete') {
onComplete(result)
onComplete(result);
} else {
onError(result)
onError(result);
}
});
//解析定位结果
......@@ -38,33 +37,42 @@ export function useGeolocation() {
console.log('定位成功', data.position);
setPosition({
position: data.position,
address: null
})
address: null,
});
var geocoder = new AMap.Geocoder({
city: '全国' // city 指定进行编码查询的城市，支持传入城市名、adcode 和 citycode
})
city: '全国', // city 指定进行编码查询的城市，支持传入城市名、adcode 和 citycode
});
geocoder.getAddress([data.position.lng, data.position.lat], function (status: string, result: {info: string, regeocode?: {
formattedAddress: string,
addressComponent: {
adcode: string
}
}}) {
console.log('获取地址结果', result)
if (status === 'complete' && result.info === 'OK') {
// result为对应的地理位置详细信息
setPosition({
...position,
address: result.regeocode
})
}else{
setPosition({
...position,
address: null
})
}
})
geocoder.getAddress(
[data.position.lng, data.position.lat],
function (
status: string,
result: {
info: string;
regeocode?: {
formattedAddress: string;
addressComponent: {
adcode: string;
};
};
},
) {
console.log('获取地址结果', result);
if (status === 'complete' && result.info === 'OK') {
// result为对应的地理位置详细信息
setPosition({
...position,
address: result.regeocode,
});
} else {
setPosition({
...position,
address: null,
});
}
},
);
}
//解析定位错误信息
async function onError(data: any) {
......@@ -77,7 +85,7 @@ export function useGeolocation() {
.catch((e: any) => {
console.log(e);
});
}, [])
}, []);
return position
}
\ No newline at end of file
return position;
}
lib/userProvider.tsx
import React, {
createContext,
Dispatch,
SetStateAction,
useEffect,
useState,
} from "react";
import api, { UserInfoResp } from "~/api";
import React, { createContext, Dispatch, SetStateAction, useEffect, useState } from 'react';
import api, { UserInfoResp } from '~/api';
export const UserContext = createContext<{
testLogin: () => void;
......@@ -32,9 +26,7 @@ const UserProvider = ({ children }: Props) => {
useEffect(() => {
try {
setUserInfo(
JSON.parse(window.localStorage.getItem("userInfo") || "") || undefined
);
setUserInfo(JSON.parse(window.localStorage.getItem('userInfo') || '') || undefined);
window.setUserInfo = setUserInfo;
window.setNeedLogin = setNeedLogin;
......@@ -44,15 +36,15 @@ const UserProvider = ({ children }: Props) => {
useEffect(() => {
if (userInfo !== null) {
localStorage.setItem("userInfo", JSON.stringify(userInfo || ""));
localStorage.setItem('userInfo', JSON.stringify(userInfo || ''));
}
}, [userInfo]);
//测试登录
function testLogin() {
api.testAppletLogin().then((res) => {
if (res.code == "200") {
window.localStorage.setItem("token", res.result?.token || "");
if (res.code == '200') {
window.localStorage.setItem('token', res.result?.token || '');
api.userInfo().then((res) => {
setUserInfo(res.result || undefined);
});
......@@ -62,7 +54,7 @@ const UserProvider = ({ children }: Props) => {
//登出
function logout() {
localStorage.setItem("token", "");
localStorage.setItem('token', '');
setUserInfo(undefined);
}
......
lib/validateUtils.ts
// 不能输入数字，其他可惜输入
export const exceptNumber = (val: any) => {
val.target.value = val.target.value
.replace(/1?(\d|([1-9]\d+))(.\d+)?$/g, "")
.replace(/\s/g, "");
val.target.value = val.target.value.replace(/1?(\d|([1-9]\d+))(.\d+)?$/g, '').replace(/\s/g, '');
};
// 只能输入正整数
export const onlyNumberPositive = (val: any) => {
// eslint-disable-next-line eqeqeq
if (val.target.value == 0) {
val.target.value = val.target.value.replace(/0/g, "");
val.target.value = val.target.value.replace(/0/g, '');
}
val.target.value = val.target.value.replace(/\D/g, "");
val.target.value = val.target.value.replace(/\D/g, '');
};
// 不能输入汉字，其他可输入
export const exceptChinese = (val: any) => {
val.target.value = val.target.value
.replace(/[\u4E00-\u9FA5]|[\uFE30-\uFFA0]/g, "")
.replace(/\s/g, "");
.replace(/[\u4E00-\u9FA5]|[\uFE30-\uFFA0]/g, '')
.replace(/\s/g, '');
};
// 只能输入字母和中文，不能输入数字和符号
export const onlyCharacter = (val: any) => {
val.target.value = val.target.value
.replace(/[^a-zA-Z\u4E00-\u9FA5]/g, "")
.replace(/\s/g, "");
val.target.value = val.target.value.replace(/[^a-zA-Z\u4E00-\u9FA5]/g, '').replace(/\s/g, '');
};
// 手机号输入，限制11位
......@@ -33,11 +29,11 @@ export const phoneNumber = (val: any) => {
if (val.target.value.length > 11) {
val.target.value = val.target.value.slice(0, 11);
} else {
val.target.value = val.target.value.replace(/\D/g, "");
val.target.value = val.target.value.replace(/\D/g, '');
}
};
// 开头不能输入空格
export const noSpaceFront = (val: any) => {
val.target.value = val.target.value.replace(/^\s/g, "");
val.target.value = val.target.value.replace(/^\s/g, '');
};
package.json
......@@ -9,9 +9,9 @@
"lint:next": "next lint",
"predev": "ts-node --project ./tsconfig.node.json ./scripts/genAntdCss.tsx",
"prebuild": "cross-env NODE_ENV=production ts-node --project ./tsconfig.node.json ./scripts/genAntdCss.tsx",
"lint": "npx eslint src",
"lint": "npx eslint pages",
"lint:fix": "npm run lint -- --fix",
"prettier": "npx prettier src --check",
"prettier": "npx prettier pages --check",
"prettier:fix": "npm run prettier -- --write",
"format": "npm run prettier:fix && npm run lint:fix"
},
......
pages/JoinPolicy/api/index.ts
import request, { Response } from "~/api/request"
import request, { Response } from '~/api/request';
export interface CooperationApplyParams {
applyName: string,
applyPhone: string,
remark?: string,
userAccountId: number,
cooperationTagId: number
applyName: string;
applyPhone: string;
remark?: string;
userAccountId: number;
cooperationTagId: number;
}
export interface GetTagIdResp {
id: number,
tagName: string,
tagImg: string,
tagDescription: string,
createTime: string
id: number;
tagName: string;
tagImg: string;
tagDescription: string;
createTime: string;
}
export default {
//申请加盟
cooperationApply(params: CooperationApplyParams): Promise<Response<string>> {
return request('/userapp/cooperation/apply', 'post', params)
return request('/userapp/cooperation/apply', 'post', params);
},
//加盟标签相关内容
getTagById(params: { id: number }): Promise<Response<GetTagIdResp>> {
return request('/userapp/cooperation/getTagById', 'get', params)
}
}
\ No newline at end of file
return request('/userapp/cooperation/getTagById', 'get', params);
},
};
pages/JoinPolicy/index.page.tsx
import { Button, Col, Divider, Form, Input, Row } from "antd";
import { useRouter } from "next/router";
import { useEffect, useState } from "react";
import LayoutView from "~/components/layout";
import api from "./api";
import styles from "./index.module.scss";
import { phoneNumber } from "~/lib/validateUtils";
import { Button, Col, Divider, Form, Input, Row } from 'antd';
import { useRouter } from 'next/router';
import { useEffect, useState } from 'react';
import LayoutView from '~/components/layout';
import api from './api';
import styles from './index.module.scss';
import { phoneNumber } from '~/lib/validateUtils';
export default function JoinPolicy() {
const router = useRouter();
const [content, setContent] = useState(""); //福利内容
const [content, setContent] = useState(''); //福利内容
const tagId = Number(router.query.tagId);
useEffect(() => {
......@@ -18,7 +18,7 @@ export default function JoinPolicy() {
id: tagId,
})
.then((res) => {
setContent(res.result?.tagDescription.replaceAll("\n", "<br/>") || "");
setContent(res.result?.tagDescription.replaceAll('\n', '<br/>') || '');
});
}
}, []);
......@@ -31,11 +31,11 @@ export default function JoinPolicy() {
cooperationTagId: tagId,
})
.then((res) => {
console.log("提交结果", res);
if (res.code === "200") {
console.log('提交结果', res);
if (res.code === '200') {
window.messageApi.success('提交成功');
setTimeout(() => {
router.push("/");
router.push('/');
}, 1500);
}
});
......@@ -45,10 +45,10 @@ export default function JoinPolicy() {
<LayoutView>
<div className={styles.banner}></div>
<div
className="page"
className='page'
style={{
background: "#fff",
position: "relative",
background: '#fff',
position: 'relative',
zIndex: 1,
marginTop: 60,
paddingBottom: 63,
......@@ -56,7 +56,7 @@ export default function JoinPolicy() {
>
<div
className={styles.font1}
style={{ textAlign: "center", paddingTop: 40, paddingBottom: 30 }}
style={{ textAlign: 'center', paddingTop: 40, paddingBottom: 30 }}
>
加盟入驻福利
</div>
......@@ -66,48 +66,37 @@ export default function JoinPolicy() {
dangerouslySetInnerHTML={{ __html: content }}
></div>
<Divider />
<div
className={styles.font1}
style={{ textAlign: "center", marginBottom: 28 }}
>
<div className={styles.font1} style={{ textAlign: 'center', marginBottom: 28 }}>
申请加盟入驻
</div>
<Row justify={"center"}>
<Row justify={'center'}>
<Col style={{ width: 400 }}>
<Form labelAlign="left" labelCol={{ span: 5 }} onFinish={onFinish}>
<Form.Item
label="姓名"
name="applyName"
rules={[{ required: true }]}
>
<Input placeholder="请输入姓名"></Input>
<Form labelAlign='left' labelCol={{ span: 5 }} onFinish={onFinish}>
<Form.Item label='姓名' name='applyName' rules={[{ required: true }]}>
<Input placeholder='请输入姓名'></Input>
</Form.Item>
<Form.Item
label="联系方式"
name="applyPhone"
label='联系方式'
name='applyPhone'
rules={[
{ required: true },
{
pattern: /^1\d{10}$/,
message: "很输入11位手机号",
message: '很输入11位手机号',
},
]}
>
<Input
placeholder="请输入手机号"
maxLength={11}
onInput={phoneNumber}
></Input>
<Input placeholder='请输入手机号' maxLength={11} onInput={phoneNumber}></Input>
</Form.Item>
<Form.Item name="remark">
<Input.TextArea placeholder="其它信息"></Input.TextArea>
<Form.Item name='remark'>
<Input.TextArea placeholder='其它信息'></Input.TextArea>
</Form.Item>
<Row justify={"center"}>
<Row justify={'center'}>
<Button
type="primary"
htmlType="submit"
type='primary'
htmlType='submit'
style={{ marginTop: 11, width: 200 }}
size="large"
size='large'
>
提交申请
</Button>
......
pages/_app.page.tsx
import "../public/antd.min.css";
import "../styles/index.scss";
import type { AppProps } from "next/app";
import withTheme from "../theme";
import { message } from "antd";
import { useEffect } from "react";
import Head from "next/head";
import Script from "next/script";
import UserProvider from "~/lib/userProvider";
import CommonProvider from "~/lib/commonProvider";
import '../public/antd.min.css';
import '../styles/index.scss';
import type { AppProps } from 'next/app';
import withTheme from '../theme';
import { message } from 'antd';
import { useEffect } from 'react';
import Head from 'next/head';
import Script from 'next/script';
import UserProvider from '~/lib/userProvider';
import CommonProvider from '~/lib/commonProvider';
export default function App({ Component, pageProps }: AppProps) {
const [messageApi, contextHolder] = message.useMessage();
......@@ -15,9 +15,9 @@ export default function App({ Component, pageProps }: AppProps) {
//全局消息提示
window.messageApi = messageApi;
//@ts-ignore
window.onresize = function(){
window.onresize = function () {
// window.document.querySelector('html')!.style.fontSize = (window.innerWidth / 1920) + 'PX';
}
};
}, []);
return withTheme(
......@@ -25,17 +25,17 @@ export default function App({ Component, pageProps }: AppProps) {
<Head>
<title>云享飞</title>
<meta
name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"
name='viewport'
content='width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no'
></meta>
</Head>
<Script src="https://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></Script>
<Script src='https://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js'></Script>
{contextHolder}
<CommonProvider>
<UserProvider>
<Component {...pageProps} />
</UserProvider>
</CommonProvider>
</>
</>,
);
}
pages/_document.page.tsx
import Document, {
Html,
Head,
Main,
NextScript,
DocumentContext,
} from 'next/document';
import Document, { Html, Head, Main, NextScript, DocumentContext } from 'next/document';
import { ServerStyleSheet } from 'styled-components';
export default class MyDocument extends Document {
static async getInitialProps(ctx: DocumentContext) {
......@@ -24,7 +18,7 @@ export default class MyDocument extends Document {
render() {
return (
<Html lang='en' style={{fontSize: 1}}>
<Html lang='en' style={{ fontSize: 1 }}>
<Head />
<body>
<Main />
......
pages/api/hello.ts
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
import type { NextApiRequest, NextApiResponse } from 'next'
import type { NextApiRequest, NextApiResponse } from 'next';
type Data = {
name: string
}
name: string;
};
export default function handler(
req: NextApiRequest,
res: NextApiResponse<Data>
) {
res.status(200).json({ name: 'John Doe' })
export default function handler(req: NextApiRequest, res: NextApiResponse<Data>) {
res.status(200).json({ name: 'John Doe' });
}
pages/certification/api/index.ts
import request, { Response } from "~/api/request"
import request, { Response } from '~/api/request';
export interface CompanyAuthParams {
companyName: string;
creditCode: string;
licenseImg: string;
userAccountId: number;
authStatus: 1 | 0
authStatus: 1 | 0;
}
export interface FuzzyQueryCompanyResp {
......@@ -38,11 +38,11 @@ export interface Paging {
export default {
//提交企业认证
companyAuth(params: CompanyAuthParams): Promise<Response<string>> {
return request('/userapp/company-auth/add', 'post', params)
return request('/userapp/company-auth/add', 'post', params);
},
//企业工商模糊搜索
fuzzyQueryCompany(params: { searchKey: string }): Promise<Response<FuzzyQueryCompanyResp>> {
return request('/userapp/company-auth/fuzzyQueryCompany', 'get', params);
}
}
\ No newline at end of file
},
};
pages/certification/index.page.tsx
import { LoadingOutlined, PlusOutlined } from "@ant-design/icons";
import {
Col,
Form,
Input,
Row,
Upload,
message,
Button,
Image,
AutoComplete,
} from "antd";
import type { UploadChangeParam } from "antd/es/upload";
import type { RcFile, UploadFile, UploadProps } from "antd/es/upload/interface";
import { useContext, useEffect, useState } from "react";
import Layout from "~/components/layout";
import api from "./api";
import styles from "./index.module.scss";
import gApi from "~/api";
import Router from "next/router";
import { UserContext } from "~/lib/userProvider";
import { LoadingOutlined, PlusOutlined } from '@ant-design/icons';
import { Col, Form, Input, Row, Upload, message, Button, Image, AutoComplete } from 'antd';
import type { UploadChangeParam } from 'antd/es/upload';
import type { RcFile, UploadFile, UploadProps } from 'antd/es/upload/interface';
import { useContext, useEffect, useState } from 'react';
import Layout from '~/components/layout';
import api from './api';
import styles from './index.module.scss';
import gApi from '~/api';
import Router from 'next/router';
import { UserContext } from '~/lib/userProvider';
const beforeUpload = (file: RcFile) => {
const isJpgOrPng =
file.type === "image/jpeg" ||
file.type === "image/png" ||
file.type === "image/bmp" ||
file.type === "image/gif"
file.type === 'image/jpeg' ||
file.type === 'image/png' ||
file.type === 'image/bmp' ||
file.type === 'image/gif';
if (!isJpgOrPng) {
message.error("请上传10M以内的JPG、JPEG、BMP、GIF、PNG格式图片");
message.error('请上传10M以内的JPG、JPEG、BMP、GIF、PNG格式图片');
}
//限制上传10M
const isLt2M = file.size / 1024 / 1024 < 10;
if (!isLt2M) {
message.error("请上传10M以内的JPG、JPEG、BMP、GIF、PNG格式图片");
message.error('请上传10M以内的JPG、JPEG、BMP、GIF、PNG格式图片');
}
return isJpgOrPng && isLt2M;
};
const normFile = (e: any) => {
console.log("Upload event:", e);
console.log('Upload event:', e);
if (Array.isArray(e)) {
return e;
}
......@@ -55,26 +45,22 @@ export default function Certification() {
const [loading, setLoading] = useState(false);
const [imageUrl, setImageUrl] = useState<string>();
const { userInfo, setUserInfo } = useContext(UserContext);
const [enterpriseOptions, setEnterpriseOptions] = useState<
Array<EnterpriseOption>
>([]);
const [enterpriseOptions, setEnterpriseOptions] = useState<Array<EnterpriseOption>>([]);
const [form] = Form.useForm();
const [token, setToken] = useState("");
const [token, setToken] = useState('');
useEffect(() => {
setToken(window.localStorage.getItem("token") || "");
setToken(window.localStorage.getItem('token') || '');
}, []);
//上传change事件
const handleChange: UploadProps["onChange"] = (
info: UploadChangeParam<UploadFile>
) => {
console.log("uploadChange", info);
if (info.file.status === "uploading") {
const handleChange: UploadProps['onChange'] = (info: UploadChangeParam<UploadFile>) => {
console.log('uploadChange', info);
if (info.file.status === 'uploading') {
setLoading(true);
return;
}
if (info.file.status === "done") {
if (info.file.status === 'done') {
// Get this url from response in real world.
setLoading(false);
setImageUrl(info.file.response.result?.[0]);
......@@ -90,9 +76,9 @@ export default function Certification() {
licenseImg: imageUrl,
})
.then((res) => {
console.log("提交结果", res);
if (res.code === "200") {
window.messageApi.success("提交成功,请等待审核");
console.log('提交结果', res);
if (res.code === '200') {
window.messageApi.success('提交成功,请等待审核');
if (userInfo) {
setUserInfo({
...userInfo,
......@@ -100,10 +86,10 @@ export default function Certification() {
});
}
setTimeout(() => {
if (Router.query.type == "back") {
if (Router.query.type == 'back') {
Router.back();
} else {
Router.push("/");
Router.push('/');
}
}, 1000);
}
......@@ -122,7 +108,7 @@ export default function Certification() {
searchKey: text,
})
.then((res) => {
if (res.code === "200") {
if (res.code === '200') {
setEnterpriseOptions(
res.result?.Result?.map((item) => {
return {
......@@ -130,7 +116,7 @@ export default function Certification() {
value: item.Name,
creditCode: item.CreditCode,
};
}) || []
}) || [],
);
} else {
setEnterpriseOptions([]);
......@@ -141,17 +127,17 @@ export default function Certification() {
//选择的企业
const onSelectEnterprise = (value: string, option: EnterpriseOption) => {
form.setFieldValue("creditCode", option.creditCode);
form.setFieldValue('creditCode', option.creditCode);
};
return (
<Layout>
<div className={styles.banner}></div>
<div
className="page"
className='page'
style={{
background: "#fff",
position: "relative",
background: '#fff',
position: 'relative',
zIndex: 1,
marginTop: 60,
}}
......@@ -159,63 +145,56 @@ export default function Certification() {
<div
className={styles.font1}
style={{
padding: "30px 0 23px 31px",
borderBottom: "1px solid RGBA(231, 231, 231, 1)",
padding: '30px 0 23px 31px',
borderBottom: '1px solid RGBA(231, 231, 231, 1)',
}}
>
企业认证{" "}
企业认证{' '}
<span className={styles.font2} style={{ marginLeft: 28 }}>
发布信息需完成以下认证
</span>
</div>
<div>
<Form
form={form}
style={{ padding: "70px 170px 162px 170px" }}
onFinish={onFinish}
>
<Row justify="space-between">
<Form form={form} style={{ padding: '70px 170px 162px 170px' }} onFinish={onFinish}>
<Row justify='space-between'>
<Col span={11}>
<Form.Item
label="企业名称"
name="companyName"
label='企业名称'
name='companyName'
rules={[{ required: true }]}
style={{ borderBottom: "1px solid RGBA(243, 243, 243, 1)" }}
style={{ borderBottom: '1px solid RGBA(243, 243, 243, 1)' }}
>
<AutoComplete
options={enterpriseOptions}
style={{ width: 200 }}
onSelect={onSelectEnterprise}
onSearch={onSearchEnterprise}
placeholder="请输入企业名称"
placeholder='请输入企业名称'
bordered={false}
/>
</Form.Item>
</Col>
<Col span={11}>
<Form.Item
label="企业信用代码"
name="creditCode"
label='企业信用代码'
name='creditCode'
rules={[{ required: true }]}
style={{ borderBottom: "1px solid RGBA(243, 243, 243, 1)" }}
style={{ borderBottom: '1px solid RGBA(243, 243, 243, 1)' }}
>
<Input
bordered={false}
placeholder="请输入企业信用代码"
></Input>
<Input bordered={false} placeholder='请输入企业信用代码'></Input>
</Form.Item>
</Col>
</Row>
<Form.Item
name="licenseImg"
name='licenseImg'
rules={[{ required: true }]}
valuePropName="fileList"
valuePropName='fileList'
getValueFromEvent={normFile}
help={<div style={{ textAlign: "center" }}>请上传营业执照</div>}
help={<div style={{ textAlign: 'center' }}>请上传营业执照</div>}
>
<Upload
name="uploadFile"
listType="picture-card"
name='uploadFile'
listType='picture-card'
className={styles.upload}
showUploadList={false}
action={gApi.imgOss}
......@@ -227,8 +206,8 @@ export default function Certification() {
{imageUrl ? (
<Image
src={imageUrl}
alt="uploadFile"
style={{ width: "100%" }}
alt='uploadFile'
style={{ width: '100%' }}
preview={false}
/>
) : (
......@@ -244,12 +223,12 @@ export default function Certification() {
2.加盖公章的扫描件或复印件支持jpg.jpeg.bmp.gif.png格式图片，大小不超10M。
</div>
<Row justify="center">
<Row justify='center'>
<Button
type="primary"
htmlType="submit"
style={{ marginTop: 20, padding: "0 129px" }}
size="large"
type='primary'
htmlType='submit'
style={{ marginTop: 20, padding: '0 129px' }}
size='large'
>
提交认证
</Button>
......
pages/equipmentLeasing/api/index.tsx
import request, { Response } from '~/api/request'
import request, { Response } from '~/api/request';
export interface ListPageDeviceInfoParams {
brandId?: number
districtId?: number
modelId?: number
pageNo: number
pageSize: number
partsId?: number
productCategoryId?: number
qualityId?: number
brandId?: number;
districtId?: number;
modelId?: number;
pageNo: number;
pageSize: number;
partsId?: number;
productCategoryId?: number;
qualityId?: number;
}
export interface Device {
id: number
goodsName: string
images: string
price: number | null
id: number;
goodsName: string;
images: string;
price: number | null;
}
export interface Advertisement {
id: number
imageUrl: string
id: number;
imageUrl: string;
}
export interface ListPageDeviceInfoResp {
pageNo: 1
pageSize: 10
list: Array<Device>
totalCount: 0
totalPage: 0
pageNo: 1;
pageSize: 10;
list: Array<Device>;
totalCount: 0;
totalPage: 0;
}
export default {
//web-设备租赁-分页
listPageDeviceInfo: (
params: ListPageDeviceInfoParams,
options = {}
options = {},
): Promise<Response<ListPageDeviceInfoResp>> => {
return request('/pms/product/mall/deviceList', 'post', params, options)
return request('/pms/product/mall/deviceList', 'post', params, options);
},
//web-设备租赁-广告
listAdvertisementInfo: (): Promise<Response<Array<Advertisement>>> => {
return request('/pms/webDevice/ad', 'get')
return request('/pms/webDevice/ad', 'get');
},
}
};
pages/equipmentLeasing/detail/api/index.tsx
import request, { Response } from '~/api/request'
import request, { Response } from '~/api/request';
export interface GetWebDeviceDetailParams {
goodsId: number
type: 1
goodsId: number;
type: 1;
}
export interface GetLeaseGoodsParams {
leaseTerm: number //租赁时限：（输入0：1-7天、输入1：8-15天、输入2：16-30天、输入3：30天以上）
productSpecId: number
leaseTerm: number; //租赁时限：（输入0：1-7天、输入1：8-15天、输入2：16-30天、输入3：30天以上）
productSpecId: number;
}
export interface WareImgsType {
id: number
imgUrl: string
imgType: number
id: number;
imgUrl: string;
imgType: number;
}
export interface PriceType {
id: number
cooperationTag: number
price: number
productSpecId: number
leaseTerm: number
id: number;
cooperationTag: number;
price: number;
productSpecId: number;
leaseTerm: number;
}
export interface GetLeaseGoodsResult {
productSpecId: number
type: number | null
leaseTerm: number
specPrice: PriceType[]
productSpecId: number;
type: number | null;
leaseTerm: number;
specPrice: PriceType[];
}
export interface GetWebDeviceDetailResult {
id: number
id: number;
images: {
id: number
imgUrl: string
imgType: number
}[]
goodsVideo: string
goodsVideoId: number
goodsName: string
id: number;
imgUrl: string;
imgType: number;
}[];
goodsVideo: string;
goodsVideoId: number;
goodsName: string;
goodsDetail: {
id: number
goodsDesc: string
content: string | null
remark: string | null
}
directoryId: number
categoryByOne: number
categoryByTwo: null
tag: null
shelfStatus: number
id: number;
goodsDesc: string;
content: string | null;
remark: string | null;
};
directoryId: number;
categoryByOne: number;
categoryByTwo: null;
tag: null;
shelfStatus: number;
goodsSpec: {
productSpecList: GetWebDeviceWareSkuById[]
}[]
productSpecList: GetWebDeviceWareSkuById[];
}[];
otherService?: {
id: number
saleServiceId: string
serviceName: string
}[]
price: number | null
goodsNo: string
id: number;
saleServiceId: string;
serviceName: string;
}[];
price: number | null;
goodsNo: string;
}
export interface PriceList {
id: number
wareInfoId: number
skuInfoId: number
rentPrice: number
minDay: number
maxDay: number
createTime: null
id: number;
wareInfoId: number;
skuInfoId: number;
rentPrice: number;
minDay: number;
maxDay: number;
createTime: null;
}
export interface GetWebDeviceWareSkuById {
id: number
productSpec: number
productSkuId: number
specName: string
specImage: string
partNo: string
versionDesc: string
createTime: string | null
productSpecCPQVO: string | null
id: number;
productSpec: number;
productSkuId: number;
specName: string;
specImage: string;
partNo: string;
versionDesc: string;
createTime: string | null;
productSpecCPQVO: string | null;
}
export interface WebDeviceUpdateParams {
id?: number
inventoryId?: number
inventoryUsage?: string
startDay?: string
endDay?: string
id?: number;
inventoryId?: number;
inventoryUsage?: string;
startDay?: string;
endDay?: string;
}
export default {
//web-设备租赁-详情
listDetailDeviceInfo: (
params: GetWebDeviceDetailParams
params: GetWebDeviceDetailParams,
): Promise<Response<GetWebDeviceDetailResult>> => {
return request('/pms/product/mall/getLeaseGoodsDetail', 'get', params)
return request('/pms/product/mall/getLeaseGoodsDetail', 'get', params);
},
//web-设备租赁-立即租赁
listWareSkuUpdate: (
params: WebDeviceUpdateParams
): Promise<Response<number>> => {
return request('/pms/appDevice/update', 'post', params)
listWareSkuUpdate: (params: WebDeviceUpdateParams): Promise<Response<number>> => {
return request('/pms/appDevice/update', 'post', params);
},
//web-设备租赁-详情-获取设备商品规格价格详情
GoodsPriceDetail: (
params: GetLeaseGoodsParams
): Promise<Response<GetLeaseGoodsResult>> => {
return request('/pms/product/mall/getLeaseGoodsPriceDetail', 'get', params)
GoodsPriceDetail: (params: GetLeaseGoodsParams): Promise<Response<GetLeaseGoodsResult>> => {
return request('/pms/product/mall/getLeaseGoodsPriceDetail', 'get', params);
},
}
};
pages/equipmentLeasing/detail/components/orderForGoods/api/index.tsx
import request, { Response } from '~/api/request'
import request, { Response } from '~/api/request';
export interface GetWebDeviceDetailParams {
actualPay: number
deposit: number
endDate: string
actualPay: number;
deposit: number;
endDate: string;
orderReceipt: {
detailAddress: string
receiptMethod: number
region: string
takeName: string
takePhone: number
}
rentPrice: number
returnDate: string
shouldPay: number
specsId: number
startDate: string
wareDescription: string
wareImg: string
wareInfoId: number
wareNo: string
wareNum: number
wareTitle: string
remark?: string
detailAddress: string;
receiptMethod: number;
region: string;
takeName: string;
takePhone: number;
};
rentPrice: number;
returnDate: string;
shouldPay: number;
specsId: number;
startDate: string;
wareDescription: string;
wareImg: string;
wareInfoId: number;
wareNo: string;
wareNum: number;
wareTitle: string;
remark?: string;
}
export interface WareImgsType {
id: number
imgUrl: string
imgType: number
id: number;
imgUrl: string;
imgType: number;
}
export interface UserAddress {
id: number
takeName: string
takePhone: string
takeRegion: string
takeAddress: string
type: number
id: number;
takeName: string;
takePhone: string;
takeRegion: string;
takeAddress: string;
type: number;
}
export interface GetOrderForGoods {
balance: number
nickName: string
orderNo: string
balance: number;
nickName: string;
orderNo: string;
}
export default {
//web-地址管理-查询用户地址列表-条件查询
listUserAddress: (params: {}): Promise<Response<UserAddress[]>> => {
return request('/oms/user-address/selectList', 'POST', params)
return request('/oms/user-address/selectList', 'POST', params);
},
//web-设备租赁-下单
FeignAddLease: (
params: GetWebDeviceDetailParams
): Promise<Response<GetOrderForGoods>> => {
return request('/oms/RentalOrders/feignAddLease', 'post', params)
FeignAddLease: (params: GetWebDeviceDetailParams): Promise<Response<GetOrderForGoods>> => {
return request('/oms/RentalOrders/feignAddLease', 'post', params);
},
//web-设备租赁-订单支付
OrderPayment: (params: {
orderNo: string
}): Promise<Response<GetOrderForGoods>> => {
return request(`/payment/repocash/orderPayment`, 'get', params)
OrderPayment: (params: { orderNo: string }): Promise<Response<GetOrderForGoods>> => {
return request(`/payment/repocash/orderPayment`, 'get', params);
},
}
};
pages/equipmentLeasing/detail/components/orderForGoods/styled.tsx
import styled from 'styled-components'
import styled from 'styled-components';
export const OrderForGoodsBox = styled.div`
box-sizing: border-box;
......@@ -340,4 +340,4 @@ export const OrderForGoodsBox = styled.div`
line-height: 19px;
}
}
`
`;
pages/equipmentLeasing/detail/components/picture-preview/index.tsx
import React, { useState, useRef } from 'react'
import { Box } from './styled'
import { LeftOutlined, RightOutlined } from '@ant-design/icons'
import { WareImgsType } from '../../api'
import React, { useState, useRef } from 'react';
import { Box } from './styled';
import { LeftOutlined, RightOutlined } from '@ant-design/icons';
import { WareImgsType } from '../../api';
interface ImagesType {
imgList: Array<WareImgsType>
imgList: Array<WareImgsType>;
}
export default function PicturePreview(props: ImagesType) {
const { imgList } = props
const { imgList } = props;
const mask = useRef<HTMLDivElement>(null!)
const moveBox = useRef<HTMLDivElement>(null!)
const big = useRef<HTMLImageElement>(null!)
const [moveLeft, setMoveLeft] = useState(0) // 根据这个值设置图片列表向左偏移
const mask = useRef<HTMLDivElement>(null!);
const moveBox = useRef<HTMLDivElement>(null!);
const big = useRef<HTMLImageElement>(null!);
const [moveLeft, setMoveLeft] = useState(0); // 根据这个值设置图片列表向左偏移
// const imgList = [
// 'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
// 'https://fuss10.elemecdn.com/1/34/19aa98b1fcb2781c4fba33d850549jpeg.jpeg',
......@@ -23,106 +23,83 @@ export default function PicturePreview(props: ImagesType) {
// 'https://fuss10.elemecdn.com/2/11/6535bcfb26e4c79b48ddde44f4b6fjpeg.jpeg'
// ]
const [activeImgIndex, setActiveImgIndex] = useState(0)
const [activeImgIndex, setActiveImgIndex] = useState(0);
// 改变预览图
const handleChangeImg = (index: number) => {
if (index <= moveLeft + 3) setActiveImgIndex(index)
}
if (index <= moveLeft + 3) setActiveImgIndex(index);
};
// 移动缩略图
const handleSlide = (direction: string) => {
//左侧按钮
if (direction == 'left') {
moveLeft == 0 ? setMoveLeft(0) : setMoveLeft((props) => props - 1)
moveLeft == 0 ? setMoveLeft(0) : setMoveLeft((props) => props - 1);
} else {
// 右侧按钮
if (imgList.length > 4) {
moveLeft >= imgList.length - 4
? setMoveLeft(imgList.length - 4)
: setMoveLeft((props) => props + 1)
: setMoveLeft((props) => props + 1);
}
}
}
};
// 图片放大镜
const handleMouseMove = (
event: React.MouseEvent<HTMLDivElement, MouseEvent>
) => {
let left = event.nativeEvent.offsetX - mask.current.offsetWidth / 2
let top = event.nativeEvent.offsetY - mask.current.offsetHeight / 2
const handleMouseMove = (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
let left = event.nativeEvent.offsetX - mask.current.offsetWidth / 2;
let top = event.nativeEvent.offsetY - mask.current.offsetHeight / 2;
// 最右侧和最下侧的临界值
const maxLeft = moveBox.current.offsetWidth - mask.current.offsetWidth
const maxTop = moveBox.current.offsetHeight - mask.current.offsetHeight
const maxLeft = moveBox.current.offsetWidth - mask.current.offsetWidth;
const maxTop = moveBox.current.offsetHeight - mask.current.offsetHeight;
//约束范围
if (left <= 0) left = 0
if (left >= maxLeft) left = maxLeft
if (top <= 0) top = 0
if (top >= maxTop) top = maxTop
if (left <= 0) left = 0;
if (left >= maxLeft) left = maxLeft;
if (top <= 0) top = 0;
if (top >= maxTop) top = maxTop;
// 设置放大范围遮罩层位置
mask.current.style.left = left + 'px'
mask.current.style.top = top + 'px'
mask.current.style.left = left + 'px';
mask.current.style.top = top + 'px';
// 设置大图图片位置，可以用background代替这个方案，有兴趣可以尝试
big.current.style.left = -3 * left + 'px' // 3这个值是 大图除以小图算出来的比例 这里大图是900px 小图是300px
big.current.style.top = -3 * top + 'px'
}
big.current.style.left = -3 * left + 'px'; // 3这个值是 大图除以小图算出来的比例 这里大图是900px 小图是300px
big.current.style.top = -3 * top + 'px';
};
return (
<Box>
<div className="img_wrapper">
<div className="img_content">
<div className='img_wrapper'>
<div className='img_content'>
{/* <!-- 蒙层，绑定鼠标事件 --> */}
<div
className="movebox"
onMouseMove={(e) => handleMouseMove(e)}
ref={moveBox}
></div>
<div className='movebox' onMouseMove={(e) => handleMouseMove(e)} ref={moveBox}></div>
{/* <!-- 主图 --> */}
<img
src={imgList && imgList[activeImgIndex].imgUrl}
className="img_small"
alt=""
/>
<img src={imgList && imgList[activeImgIndex].imgUrl} className='img_small' alt='' />
{/* <!-- 放大区域 --> */}
<div className="mask" ref={mask}></div>
<div className='mask' ref={mask}></div>
{/* <!-- 大图预览图 --> */}
<div className="img_big">
<img
src={imgList && imgList[activeImgIndex].imgUrl}
ref={big}
alt=""
/>
<div className='img_big'>
<img src={imgList && imgList[activeImgIndex].imgUrl} ref={big} alt='' />
</div>
</div>
{/* <!-- 缩略图列表 --> */}
<div className="img_list_wrapper">
<div className='img_list_wrapper'>
{imgList?.length > 4 && (
<LeftOutlined
className="el-icon-arrow-left"
onClick={() => handleSlide('left')}
/>
<LeftOutlined className='el-icon-arrow-left' onClick={() => handleSlide('left')} />
)}
<div className="img_list_content">
<div
className="img_list"
style={{ marginLeft: -moveLeft * 25 + '%' }}
>
<div className='img_list_content'>
<div className='img_list' style={{ marginLeft: -moveLeft * 25 + '%' }}>
{imgList?.map((item, index) => (
<img
onMouseOver={() => handleChangeImg(index)}
key={index}
className={`${activeImgIndex === index ? 'activeImg' : ''}`}
src={item.imgUrl}
alt=""
alt=''
/>
))}
</div>
</div>
{imgList?.length > 4 && (
<RightOutlined
className="el-icon-arrow-right"
onClick={() => handleSlide('right')}
/>
<RightOutlined className='el-icon-arrow-right' onClick={() => handleSlide('right')} />
)}
</div>
</div>
</Box>
)
);
}
pages/equipmentLeasing/detail/components/picture-preview/styled.tsx
import styled from "styled-components"
import styled from 'styled-components';
export const Box = styled.div`
box-sizing: border-box;
.img_wrapper {
width: 300px;
.img_content {
position: relative;
border: 1px solid #f2f2f2;
box-sizing: border-box;
box-sizing: border-box;
.img_wrapper {
width: 300px;
height: 300px;
&:hover{
.img_content {
position: relative;
border: 1px solid #f2f2f2;
box-sizing: border-box;
width: 300px;
height: 300px;
&:hover {
cursor: move;
}
.movebox {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1;
&:hover ~ .img_big {
display: block;
}
}
.mask {
width: 50%;
height: 50%;
position: absolute;
left: 0;
top: 0;
display: none;
background-color: #fedef4;
box-sizing: border-box;
opacity: 0.5;
border: 1px solid #aaa;
cursor: move;
}
.img_small {
width: 100%;
height: 100%;
//object-fit: contain;
}
&:hover .mask {
display: block;
}
.img_big {
background-color: #fff;
z-index: 10;
display: none;
position: absolute;
top: 0;
left: 349px;
box-sizing: border-box;
border: 1px solid #f2f2f2;
width: 450px;
height: 450px;
overflow: hidden;
img {
width: 200%;
height: 200%;
.movebox {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1;
&:hover ~ .img_big {
display: block;
}
}
}
}
.img_list_wrapper {
padding-top: 20px;
width: 300px;
display: flex;
align-items: center;
justify-content: space-between;
.img_list_content {
width: 240px;
overflow: hidden;
.img_list {
display: flex;
flex-wrap: nowrap;
transition: all 0.3s linear;
.mask {
width: 50%;
height: 50%;
position: absolute;
left: 0;
top: 0;
display: none;
background-color: #fedef4;
box-sizing: border-box;
opacity: 0.5;
border: 1px solid #aaa;
cursor: move;
}
.img_small {
width: 100%;
height: 100%;
//object-fit: contain;
}
&:hover .mask {
display: block;
}
.img_big {
background-color: #fff;
z-index: 10;
display: none;
position: absolute;
top: 0;
left: 349px;
box-sizing: border-box;
border: 1px solid #f2f2f2;
width: 450px;
height: 450px;
overflow: hidden;
img {
cursor: pointer;
border: 1px solid #fff;
box-sizing: border-box;
width: 60px;
height: 60px;
}
.activeImg {
border: 1px solid rgb(214, 70, 70);
width: 200%;
height: 200%;
position: absolute;
left: 0;
top: 0;
}
}
}
&::v-deep .el-icon-arrow-left {
cursor: pointer;
font-size: 30px;
width: 30px;
height: 70px;
line-height: 70px;
}
&::v-deep .el-icon-arrow-right {
cursor: pointer;
font-size: 30px;
width: 30px;
height: 70px;
line-height: 70px;
.img_list_wrapper {
padding-top: 20px;
width: 300px;
display: flex;
align-items: center;
justify-content: space-between;
.img_list_content {
width: 240px;
overflow: hidden;
.img_list {
display: flex;
flex-wrap: nowrap;
transition: all 0.3s linear;
img {
cursor: pointer;
border: 1px solid #fff;
box-sizing: border-box;
width: 60px;
height: 60px;
}
.activeImg {
border: 1px solid rgb(214, 70, 70);
}
}
}
&::v-deep .el-icon-arrow-left {
cursor: pointer;
font-size: 30px;
width: 30px;
height: 70px;
line-height: 70px;
}
&::v-deep .el-icon-arrow-right {
cursor: pointer;
font-size: 30px;
width: 30px;
height: 70px;
line-height: 70px;
}
}
}
}
`
\ No newline at end of file
`;
pages/equipmentLeasing/detail/styled.tsx
import styled from 'styled-components'
import styled from 'styled-components';
export const Box = styled.div`
box-sizing: border-box;
......@@ -282,4 +282,4 @@ export const Box = styled.div`
}
}
}
`
`;
pages/equipmentLeasing/index.page.tsx
import { Pagination } from 'antd'
import Image from 'next/image'
import { useRouter } from 'next/router'
import { useContext, useEffect, useRef, useState } from 'react'
import ContentBox from '~/components/contentBox'
import Filter, { AdapterResult, FilterResult } from '~/components/filter'
import Layout from '~/components/layout'
import api, { Advertisement, Device } from './api'
import { Box } from './styled'
import { UserContext } from '~/lib/userProvider'
import { Pagination } from 'antd';
import Image from 'next/image';
import { useRouter } from 'next/router';
import { useContext, useEffect, useRef, useState } from 'react';
import ContentBox from '~/components/contentBox';
import Filter, { AdapterResult, FilterResult } from '~/components/filter';
import Layout from '~/components/layout';
import api, { Advertisement, Device } from './api';
import { Box } from './styled';
import { UserContext } from '~/lib/userProvider';
// 此函数在构建时被调用
export async function getStaticProps() {
//获取筛选数据，进行静态渲染
return {
props: {},
}
};
}
type Props = {}
type Props = {};
export default function EquipmentLeasing(props: Props) {
const { userInfo } = useContext(UserContext)
const router = useRouter()
const [productList, setProductList] = useState(
Array<{ element: JSX.Element }>
)
const [rightProductList, setRightProductList] = useState(
Array<{ element: JSX.Element }>
)
const { userInfo } = useContext(UserContext);
const router = useRouter();
const [productList, setProductList] = useState(Array<{ element: JSX.Element }>);
const [rightProductList, setRightProductList] = useState(Array<{ element: JSX.Element }>);
const leftDom = (item: Device) => {
return (
<div
key={item.id}
className="item"
className='item'
onClick={() => router.push(`/equipmentLeasing/detail/${item.id}`)}
>
<div className="item-top">
<div className="item-top-image">
<Image src={item.images} alt="error" fill />
<div className='item-top'>
<div className='item-top-image'>
<Image src={item.images} alt='error' fill />
</div>
</div>
<div className="item-bottom">
<div className="item-bottom-title" title={item.goodsName}>
<div className='item-bottom'>
<div className='item-bottom-title' title={item.goodsName}>
{item.goodsName}
</div>
{userInfo?.cooperationTagId ? (
<div className="item-bottom-price">
<span className="money">¥{item.price}</span>
<span className="unit">/天起</span>
<div className='item-bottom-price'>
<span className='money'>¥{item.price}</span>
<span className='unit'>/天起</span>
</div>
) : (
<div className="unit">暂无报价</div>
<div className='unit'>暂无报价</div>
)}
</div>
</div>
)
}
);
};
const rightDom = (item: Advertisement) => {
return (
<div key={item.id} className="right-box-item right-item">
<Image src={item.imageUrl} alt="error" fill />
<div key={item.id} className='right-box-item right-item'>
<Image src={item.imageUrl} alt='error' fill />
</div>
)
}
);
};
const [filterResult, setFilterResult] = useState<AdapterResult>({}) //筛选结果
const [count, setCount] = useState(0) //商品总数
const [abort, setAbort] = useState<AbortController | null>(null) //请求中断
const [filterResult, setFilterResult] = useState<AdapterResult>({}); //筛选结果
const [count, setCount] = useState(0); //商品总数
const [abort, setAbort] = useState<AbortController | null>(null); //请求中断
const [pageParams, setPageParams] = useState({
type: 1,
pageNo: 1,
pageSize: 15,
}) //分页器对象
}); //分页器对象
const onPageChange = (page: number, pageSize: number) => {
setPageParams({
...pageParams,
pageNo: page,
})
}
});
};
useEffect(() => {
//中断前一次列表请求
abort?.abort()
setAbort(new AbortController())
}, [filterResult, pageParams])
abort?.abort();
setAbort(new AbortController());
}, [filterResult, pageParams]);
//端口列表请求
useEffect(() => {
let queryVal = JSON.parse(JSON.stringify(router.query))
let rs
let queryVal = JSON.parse(JSON.stringify(router.query));
let rs;
if (Object.keys(queryVal).length) {
rs = { categoryId: [Number(queryVal['categoryId'])] }
rs = { categoryId: [Number(queryVal['categoryId'])] };
}
api
.listPageDeviceInfo(
......@@ -103,45 +99,40 @@ export default function EquipmentLeasing(props: Props) {
},
{
signal: abort?.signal,
}
},
)
.then((res) => {
setProductList(
res.result?.list?.map((item) => {
return { element: leftDom(item) }
}) || []
)
setCount(res.result?.totalCount || 0)
})
}, [abort])
return { element: leftDom(item) };
}) || [],
);
setCount(res.result?.totalCount || 0);
});
}, [abort]);
const onFilterChange = (
filterResult: FilterResult,
adapterFilterResult: AdapterResult
) => {
console.log('filterResult', filterResult, adapterFilterResult)
adapterFilterResult.categoryId = adapterFilterResult.categoryId?.map(
(item) => item.id
)
setFilterResult(adapterFilterResult)
}
const onFilterChange = (filterResult: FilterResult, adapterFilterResult: AdapterResult) => {
console.log('filterResult', filterResult, adapterFilterResult);
adapterFilterResult.categoryId = adapterFilterResult.categoryId?.map((item) => item.id);
setFilterResult(adapterFilterResult);
};
useEffect(() => {
api.listAdvertisementInfo().then((res) => {
setRightProductList(
res.result?.map((item) => {
return { element: rightDom(item) }
}) || []
)
})
}, [])
return { element: rightDom(item) };
}) || [],
);
});
}, []);
useEffect(() => {
let queryVal = JSON.parse(JSON.stringify(router.query))
let queryVal = JSON.parse(JSON.stringify(router.query));
if (Object.keys(router.query).length) {
setFilterResult({ categoryId: [Number(queryVal['categoryId'])] })
setFilterResult({ categoryId: [Number(queryVal['categoryId'])] });
}
}, [router])
}, [router]);
return (
<Layout>
......@@ -161,7 +152,7 @@ export default function EquipmentLeasing(props: Props) {
leftRenderDom={{
columns: productList,
pagination: (
<div className="pagination-page">
<div className='pagination-page'>
<Pagination
current={pageParams.pageNo}
pageSize={pageParams.pageSize}
......@@ -180,5 +171,5 @@ export default function EquipmentLeasing(props: Props) {
</div>
</Box>
</Layout>
)
);
}
pages/equipmentLeasing/styled.tsx
import styled from 'styled-components'
import styled from 'styled-components';
export default function Style() {
return <></>
return <></>;
}
export const Box = styled.div`
......@@ -76,4 +76,4 @@ export const Box = styled.div`
.pagination-page {
text-align: right;
}
`
`;
pages/flyingHandService/api/index.tsx
import request, { Response } from '~/api/request'
import { TypesResp } from '~/components/filter/api'
import request, { Response } from '~/api/request';
import { TypesResp } from '~/components/filter/api';
export interface ListPageFlyingInfoParams {
pageNo: number
pageSize: number
flightSkillsId?: number
licenseId?: number
regionId?: number
pageNo: number;
pageSize: number;
flightSkillsId?: number;
licenseId?: number;
regionId?: number;
}
export interface Flying {
id: number
price: number
supplierName: string
curriculumName: string
free: 0 | 1
curriculumDesc: string
videoUrl: string
surfaceUrl: string
id: number;
price: number;
supplierName: string;
curriculumName: string;
free: 0 | 1;
curriculumDesc: string;
videoUrl: string;
surfaceUrl: string;
}
export interface ListPageFlyingInfoResp {
pageNo: 1
pageSize: 10
list: Array<Flying>
totalCount: 0
totalPage: 0
pageNo: 1;
pageSize: 10;
list: Array<Flying>;
totalCount: 0;
totalPage: 0;
}
export interface SkillsType {
type: string
id: number
skillsName: string
label: string | number
value: string | number
type: string;
id: number;
skillsName: string;
label: string | number;
value: string | number;
}
export interface RegionResp {
childInfo: RegionResp[] | null
id: number
level: number
name: string
pid: number
childInfo: RegionResp[] | null;
id: number;
level: number;
name: string;
pid: number;
}
export interface PilotRegistrationParams {
city?: number
drivingLicense?: number
industryAppAuth?: Array<number>
province?: number
remark?: string
telephone?: string
uavLicenseLevelOne?: number
uavLicenseLevelTwo?: number
city?: number;
drivingLicense?: number;
industryAppAuth?: Array<number>;
province?: number;
remark?: string;
telephone?: string;
uavLicenseLevelOne?: number;
uavLicenseLevelTwo?: number;
}
export default {
//web-飞手培训-分页
listPageJobServicesInfo: (
params: ListPageFlyingInfoParams
params: ListPageFlyingInfoParams,
): Promise<Response<ListPageFlyingInfoResp>> => {
return request(
'/release/curriculum/queryCurriculumInfoList',
'post',
params
)
return request('/release/curriculum/queryCurriculumInfoList', 'post', params);
},
region: (): Promise<Response<Array<RegionResp>>> => {
return request('/pms/webDevice/getSecondDistrictInfo')
return request('/pms/webDevice/getSecondDistrictInfo');
},
PilotLicense: (): Promise<Response<Array<RegionResp>>> => {
return request('/release/curriculum/getDronePilotLicense')
return request('/release/curriculum/getDronePilotLicense');
},
IndustryFlightSkills: (): Promise<Response<Array<SkillsType>>> => {
return request('/release/curriculum/getIndustryFlightSkills')
return request('/release/curriculum/getIndustryFlightSkills');
},
PilotRegistrations: (
params: PilotRegistrationParams
): Promise<Response<Array<SkillsType>>> => {
return request('/release/curriculum/pilotRegistration', 'post', params)
PilotRegistrations: (params: PilotRegistrationParams): Promise<Response<Array<SkillsType>>> => {
return request('/release/curriculum/pilotRegistration', 'post', params);
},
FlightSkills: (params: { type: 3 }): Promise<Response<Array<TypesResp>>> => {
return request('/pms/classify/queryCategoryInfoByType', 'get', params)
return request('/pms/classify/queryCategoryInfoByType', 'get', params);
},
}
};
pages/flyingHandService/detail/[id].page.tsx
import React, { useEffect, useState } from 'react'
import Layout from '~/components/layout'
import { Box } from './styled'
import { Button, Tabs } from 'antd'
import { useRouter } from 'next/router'
import { ParsedUrlQuery } from 'querystring'
import type { TabsProps } from 'antd'
import api, { ListPageFlyingInfoResp } from './api'
import React, { useEffect, useState } from 'react';
import Layout from '~/components/layout';
import { Box } from './styled';
import { Button, Tabs } from 'antd';
import { useRouter } from 'next/router';
import { ParsedUrlQuery } from 'querystring';
import type { TabsProps } from 'antd';
import api, { ListPageFlyingInfoResp } from './api';
const contentStyle: React.CSSProperties = {
width: '100%',
}
};
export default function FlyingDetail() {
const router = useRouter()
const [detail, setDetail] = useState<ListPageFlyingInfoResp | null>()
const router = useRouter();
const [detail, setDetail] = useState<ListPageFlyingInfoResp | null>();
const onChange = (key: string) => {
console.log(key)
}
console.log(key);
};
const items: TabsProps['items'] = [
{
key: '1',
label: `介绍`,
children: (
<div className="body">
<div className="top">
<div className="title">课程简介</div>
<div className="content">{detail?.curriculumDesc}</div>
<div className='body'>
<div className='top'>
<div className='title'>课程简介</div>
<div className='content'>{detail?.curriculumDesc}</div>
</div>
{/* <div className="bottom">详情</div> */}
{detail?.detailContent && (
<div
dangerouslySetInnerHTML={{ __html: detail?.detailContent }}
></div>
<div dangerouslySetInnerHTML={{ __html: detail?.detailContent }}></div>
)}
</div>
),
},
]
];
useEffect(() => {
if (Object.keys(router.query).length) {
api
.listPageJobServicesInfo({ id: Number(router.query.id) })
.then((res) => {
console.log(res)
setDetail(res.result)
})
api.listPageJobServicesInfo({ id: Number(router.query.id) }).then((res) => {
console.log(res);
setDetail(res.result);
});
}
}, [router])
}, [router]);
return (
<Layout contentStyle={contentStyle}>
<Box>
<div className="box">
<div className="box-body">
<video
className="body-video"
controls
src={detail?.videoUrl as string}
/>
<div className='box'>
<div className='box-body'>
<video className='body-video' controls src={detail?.videoUrl as string} />
</div>
<div className="box-bottom">
<div className="left">
<div className="top">{detail?.curriculumName}</div>
<div className="bottom">免费</div>
<div className='box-bottom'>
<div className='left'>
<div className='top'>{detail?.curriculumName}</div>
<div className='bottom'>免费</div>
</div>
<div className="right">
<div className='right'>
{/* <Button
type="primary"
className="btn"
......@@ -78,15 +70,10 @@ export default function FlyingDetail() {
</div>
</div>
</div>
<div className="detail">
<Tabs
className="tabs"
defaultActiveKey="1"
items={items}
onChange={onChange}
/>
<div className='detail'>
<Tabs className='tabs' defaultActiveKey='1' items={items} onChange={onChange} />
</div>
</Box>
</Layout>
)
);
}
pages/flyingHandService/detail/api/index.tsx
import request, { Response } from '~/api/request'
import request, { Response } from '~/api/request';
export interface ListPageFlyingInfoParams {
id: number
id: number;
}
export interface Flying {
id: number
price: number
supplierName: string
curriculumName: string
free: 0 | 1
curriculumDesc: string
videoUrl: string
id: number;
price: number;
supplierName: string;
curriculumName: string;
free: 0 | 1;
curriculumDesc: string;
videoUrl: string;
}
export interface ListPageFlyingInfoResp {
id: number
price: number | null
supplierName: string
curriculumName: string
free: number
flightSkills: number
flightSkillsName1: string
flightSkillsName2: string
curriculumDesc: string
surfaceUrl: string | null
videoUrl: string
detailContent: null
id: number;
price: number | null;
supplierName: string;
curriculumName: string;
free: number;
flightSkills: number;
flightSkillsName1: string;
flightSkillsName2: string;
curriculumDesc: string;
surfaceUrl: string | null;
videoUrl: string;
detailContent: null;
}
export default {
//web-飞手培训-详情
listPageJobServicesInfo: (
params: ListPageFlyingInfoParams
params: ListPageFlyingInfoParams,
): Promise<Response<ListPageFlyingInfoResp>> => {
return request('/release/curriculum/curriculumDetails', 'get', params)
return request('/release/curriculum/curriculumDetails', 'get', params);
},
}
};
pages/flyingHandService/detail/styled.tsx
import styled from 'styled-components'
import styled from 'styled-components';
export default function Style() {
return <></>
return <></>;
}
export const Box = styled.div`
......@@ -104,4 +104,4 @@ export const Box = styled.div`
}
}
}
`
`;
pages/flyingHandService/examination/[id].page.tsx
import React from "react";
import Layout from "~/components/layout";
import { Box } from "./styled";
import BrushQuestionZone from './components/brushQuestionZone'
import MockExam from './components/mockExam'
import { Tabs } from "antd";
import type { TabsProps } from "antd";
import React from 'react';
import Layout from '~/components/layout';
import { Box } from './styled';
import BrushQuestionZone from './components/brushQuestionZone';
import MockExam from './components/mockExam';
import { Tabs } from 'antd';
import type { TabsProps } from 'antd';
export default function ExaminationDateil() {
const onChange = (key: string) => {
console.log(key);
};
const items: TabsProps["items"] = [
const items: TabsProps['items'] = [
{
key: "1",
key: '1',
label: `刷题专区`,
children: <BrushQuestionZone />,
},
{
key: "2",
key: '2',
label: `模拟考试`,
children: <MockExam />,
},
......@@ -26,12 +26,7 @@ export default function ExaminationDateil() {
return (
<Layout>
<Box>
<Tabs
defaultActiveKey="1"
items={items} onChange={onChange}
centered
size="large"
/>
<Tabs defaultActiveKey='1' items={items} onChange={onChange} centered size='large' />
</Box>
</Layout>
);
......
pages/flyingHandService/examination/components/brushQuestionZone/index.tsx
import React,{ useEffect ,useState} from 'react'
import {Box} from './styled'
import {Cascader,Select} from 'antd'
import api, { Flying, SkillsType, RegionResp } from "../../../api";
import Image from 'next/image'
import xt from './assets/xt.png'
interface BrushQuestionZoneType {
}
import React, { useEffect, useState } from 'react';
import { Box } from './styled';
import { Cascader, Select } from 'antd';
import api, { Flying, SkillsType, RegionResp } from '../../../api';
import Image from 'next/image';
import xt from './assets/xt.png';
interface BrushQuestionZoneType {}
export default function BrushQuestionZone() {
const [secondDistrictInfo, setSecondDistrictInfo] = useState(
Array<RegionResp>
);
const [secondDistrictInfo, setSecondDistrictInfo] = useState(Array<RegionResp>);
const [skills, setSkills] = useState(Array<RegionResp>);
const [flightSkillsList, setFlightSkillsList] = useState(Array<SkillsType>);
......@@ -38,16 +34,16 @@ export default function BrushQuestionZone() {
}, []);
return (
<Box>
<div className="title">
<div className='title'>
<Cascader
allowClear
placeholder="地域"
className="selectItem"
size="large"
placeholder='地域'
className='selectItem'
size='large'
fieldNames={{
label: "name",
value: "id",
children: "childInfo",
label: 'name',
value: 'id',
children: 'childInfo',
}}
options={secondDistrictInfo}
// onChange={onChange}
......@@ -55,51 +51,51 @@ export default function BrushQuestionZone() {
/>
<Cascader
allowClear
placeholder="考证"
className="selectItem"
size="large"
placeholder='考证'
className='selectItem'
size='large'
fieldNames={{
label: "licenseType",
value: "id",
children: "childLicenses",
label: 'licenseType',
value: 'id',
children: 'childLicenses',
}}
options={skills}
// onChange={onChange}
changeOnSelect
/>
<Select
className="selectItem"
className='selectItem'
popupMatchSelectWidth={false}
placeholder="技能"
size="large"
placeholder='技能'
size='large'
// onChange={(value) => onProvinceChange(value, "技能")}
options={flightSkillsList}
fieldNames={{ value: "id", label: "skillsName" }}
fieldNames={{ value: 'id', label: 'skillsName' }}
allowClear
/>
<Cascader
allowClear
placeholder="选择课程"
className="selectItem"
placeholder='选择课程'
className='selectItem'
style={{ width: 200 }}
size="large"
size='large'
fieldNames={{
label: "name",
value: "id",
children: "childInfo",
label: 'name',
value: 'id',
children: 'childInfo',
}}
options={secondDistrictInfo}
// onChange={onChange}
changeOnSelect
/>
</div>
<div className="content">
<div className='content'>
{list?.map((item, i) => (
<div key={i} className="item">
<div className="img-box"><Image src={xt.src} fill alt='#'></Image> </div>
<div className="item-content">
第一章 第1节 习题练习习题练习习题练习
<div key={i} className='item'>
<div className='img-box'>
<Image src={xt.src} fill alt='#'></Image>{' '}
</div>
<div className='item-content'>第一章 第1节 习题练习习题练习习题练习</div>
</div>
))}
</div>
......
pages/flyingHandService/examination/components/brushQuestionZone/styled.tsx
import styled from "styled-components";
import styled from 'styled-components';
export default function Style() {
return <></>;
......@@ -8,60 +8,60 @@ export const Box = styled.div`
box-sizing: border-box;
width: 1200px;
height: 859px;
background: #FFFFFF;
background: #ffffff;
border-radius: 6px;
padding: 32px 26px 32px 24px;
.title{
.title {
display: flex;
align-items: center;
height: 60px;
.selectItem {
width: 120px;
width: 120px;
height: 60px;
background-color: #fff;
border-radius: 5px;
color: red;
margin-right: 8px;
.ant-select-selection-placeholder {
color: #000;
line-height: 60px;
text-align: center;
}
.ant-select-selection-item {
line-height: 60px;
text-align: center;
}
.ant-select-selector {
height: 60px;
background-color: #fff;
border-radius: 5px;
color: red;
margin-right: 8px;
.ant-select-selection-placeholder {
color: #000;
line-height: 60px;
text-align: center;
}
.ant-select-selection-item{
line-height: 60px;
text-align: center;
}
.ant-select-selector{
height: 60px;
}
}
}
}
.content{
.content {
display: flex;
flex-wrap: wrap;
margin-top: 32px;
.item {
display: flex;
width: 360px;
height: 100px;
background: #FFFFFF;
border: 1px solid #F0F0F0;
margin: 0 16px 20px 0;
&:nth-child(3n){
display: flex;
width: 360px;
height: 100px;
background: #ffffff;
border: 1px solid #f0f0f0;
margin: 0 16px 20px 0;
&:nth-child(3n) {
margin-right: 0;
}
.img-box{
}
.img-box {
width: 120px;
height: 100px;
background: #E6E6E6;
background: #e6e6e6;
position: relative;
}
.item-content{
}
.item-content {
display: flex;
align-items: center;
flex: 1;
padding: 12px 14px 11px 16px;
}
}
}
}
`
\ No newline at end of file
`;
pages/flyingHandService/examination/components/mockExam/index.tsx
import React , {useEffect,useState} from 'react'
import {Box} from './styled'
import Image from 'next/image'
import kh from './assets/kh.jpg'
interface MockExamType {
}
import React, { useEffect, useState } from 'react';
import { Box } from './styled';
import Image from 'next/image';
import kh from './assets/kh.jpg';
interface MockExamType {}
export default function MockExam() {
const [list, setList] = useState<Array<MockExamType>>();
......@@ -14,15 +12,17 @@ export default function MockExam() {
}, []);
return (
<Box>
<div className="content">
<div className='content'>
{list?.map((item, i) => (
<div key={i} className="item">
<div className="img-box"><Image src={kh.src} fill alt='#'></Image></div>
<div className="item-content">
<div className="top">云飞手行业认证考核</div>
<div className="bottom">
<div className="user-img"></div>
<div className="application">77人报名</div>
<div key={i} className='item'>
<div className='img-box'>
<Image src={kh.src} fill alt='#'></Image>
</div>
<div className='item-content'>
<div className='top'>云飞手行业认证考核</div>
<div className='bottom'>
<div className='user-img'></div>
<div className='application'>77人报名</div>
</div>
</div>
</div>
......
pages/flyingHandService/examination/components/mockExam/styled.tsx
import styled from "styled-components";
import styled from 'styled-components';
export default function Style() {
return <></>;
......@@ -10,61 +10,61 @@ export const Box = styled.div`
background-color: #fff;
min-height: 845px;
border-radius: 6px;
.content{
display: flex;
flex-wrap: wrap;
.item {
.content {
display: flex;
width: 360px;
height: 100px;
background: #FFFFFF;
border: 1px solid #F0F0F0;
margin: 0 16px 20px 0;
&:nth-child(3n){
flex-wrap: wrap;
.item {
display: flex;
width: 360px;
height: 100px;
background: #ffffff;
border: 1px solid #f0f0f0;
margin: 0 16px 20px 0;
&:nth-child(3n) {
margin-right: 0;
}
.img-box{
}
.img-box {
width: 120px;
height: 100px;
background: #E6E6E6;
background: #e6e6e6;
position: relative;
}
.item-content{
}
.item-content {
display: flex;
flex-direction: column;
justify-content: space-between;
flex: 1;
padding: 12px 14px 11px 16px;
.top{
width: 200px;
height: 20px;
font-size: 16px;
font-family: MicrosoftYaHei;
color: #34383F;
line-height: 20px;
letter-spacing: 1px;
-webkit-background-clip: text;
.top {
width: 200px;
height: 20px;
font-size: 16px;
font-family: MicrosoftYaHei;
color: #34383f;
line-height: 20px;
letter-spacing: 1px;
-webkit-background-clip: text;
}
.bottom{
display: flex;
align-items: center;
.user-img{
width: 20px;
height: 20px;
border-radius: 50%;
background-color: pink;
}
.application{
margin-left: 6px;
height: 16px;
font-size: 11px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #FE6000;
line-height: 16px;
}
.bottom {
display: flex;
align-items: center;
.user-img {
width: 20px;
height: 20px;
border-radius: 50%;
background-color: pink;
}
.application {
margin-left: 6px;
height: 16px;
font-size: 11px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #fe6000;
line-height: 16px;
}
}
}
}
}
}
}
`;
pages/flyingHandService/examination/styled.tsx
import styled from "styled-components";
import styled from 'styled-components';
export default function Style() {
return <></>;
......
pages/flyingHandService/styled.tsx
import styled from "styled-components";
import styled from 'styled-components';
export default function Style() {
return <></>;
......
pages/forum/api/index.tsx
import request, { Response } from "~/api/request";
import request, { Response } from '~/api/request';
export interface DynamicListParams {
pageNo: number;
......@@ -22,10 +22,10 @@ export interface Dynamic {
commentCount: number;
likes: boolean;
userBaseInfo: {
id: number,
nickName: string,
userImg: string
}
id: number;
nickName: string;
userImg: string;
};
}
export interface DynamicListResp {
......@@ -52,10 +52,10 @@ export interface ByDynamicResp {
createTime: string;
children: ByDynamicResp[];
userBaseInfoVO: {
id: number,
nickName: string,
userImg: string
}
id: number;
nickName: string;
userImg: string;
};
}
export default {
......@@ -65,23 +65,21 @@ export default {
* @returns
*/
dynamicList(params: DynamicListParams): Promise<Response<DynamicListResp>> {
return request("/release/dynamic/dynamicList", "get", params);
return request('/release/dynamic/dynamicList', 'get', params);
},
//评论
comment(params: CommentParams): Promise<Response<null>> {
return request("/release/dynamic/comment", "post", params);
return request('/release/dynamic/comment', 'post', params);
},
//根据动态查看评论
byDynamic(params: {
dynamicId: number;
}): Promise<Response<Array<ByDynamicResp>>> {
return request("/release/dynamic/byDynamic", "get", params);
byDynamic(params: { dynamicId: number }): Promise<Response<Array<ByDynamicResp>>> {
return request('/release/dynamic/byDynamic', 'get', params);
},
//点赞或取消点赞
likeOrCancel(params: { dynamicId: number }) {
return request("/release/dynamic/likeOrCancel", "get", params);
return request('/release/dynamic/likeOrCancel', 'get', params);
},
};
pages/forum/components/publishMessage/api/index.tsx
import request, { Response } from "~/api/request";
import request, { Response } from '~/api/request';
export interface PublishParams {
lat?: number; //纬度
......@@ -14,6 +14,6 @@ export interface PublishParams {
export default {
//动态发布
publish(params: PublishParams): Promise<Response<null>> {
return request("/release/dynamic/publish", "post", params);
return request('/release/dynamic/publish', 'post', params);
},
};
pages/forum/components/publishMessage/index.tsx
import { PlusOutlined } from "@ant-design/icons";
import { Form, Input, Modal, Upload, Image, Button, Row, Col } from "antd";
import type { RcFile, UploadProps } from "antd/es/upload";
import type { UploadFile } from "antd/es/upload/interface";
import { useContext, useEffect, useState } from "react";
import gApi from "~/api";
import NImage from "next/image";
import api from "./api";
import { useGeolocation } from "~/lib/hooks";
import { UserContext } from "~/lib/userProvider";
import { useToken } from "antd/es/theme/internal";
import { PlusOutlined } from '@ant-design/icons';
import { Form, Input, Modal, Upload, Image, Button, Row, Col } from 'antd';
import type { RcFile, UploadProps } from 'antd/es/upload';
import type { UploadFile } from 'antd/es/upload/interface';
import { useContext, useEffect, useState } from 'react';
import gApi from '~/api';
import NImage from 'next/image';
import api from './api';
import { useGeolocation } from '~/lib/hooks';
import { UserContext } from '~/lib/userProvider';
import { useToken } from 'antd/es/theme/internal';
type Props = {
open: boolean;
......@@ -17,7 +17,7 @@ type Props = {
};
const normFile = (e: any) => {
console.log("Upload event:", e);
console.log('Upload event:', e);
if (Array.isArray(e)) {
return e;
}
......@@ -27,8 +27,8 @@ const normFile = (e: any) => {
export default function PublishMessage(props: Props) {
const [confirmLoading, setConfirmLoading] = useState(false);
const [previewOpen, setPreviewOpen] = useState(false);
const [previewImage, setPreviewImage] = useState("");
const [previewTitle, setPreviewTitle] = useState("");
const [previewImage, setPreviewImage] = useState('');
const [previewTitle, setPreviewTitle] = useState('');
const [fileList, setFileList] = useState<UploadFile[]>([]);
const [showLoading, setShowLoad] = useState(false);
const [form] = Form.useForm();
......@@ -38,7 +38,7 @@ export default function PublishMessage(props: Props) {
useEffect(() => {
setToken(window.localStorage.getItem('token') || '');
}, [])
}, []);
//预览关闭
const handlePreviewCancel = () => setPreviewOpen(false);
......@@ -48,16 +48,14 @@ export default function PublishMessage(props: Props) {
if (file.url) {
setPreviewImage(file.url);
setPreviewOpen(true);
setPreviewTitle(
file.name || file.url!.substring(file.url!.lastIndexOf("/") + 1)
);
setPreviewTitle(file.name || file.url!.substring(file.url!.lastIndexOf('/') + 1));
}
};
//图片上传
const handleChange: UploadProps["onChange"] = (info) => {
console.log("uploadChange", info);
if (info.file.status === "uploading") {
const handleChange: UploadProps['onChange'] = (info) => {
console.log('uploadChange', info);
if (info.file.status === 'uploading') {
let find = fileList.find((item) => {
return item.uid === info.file.uid;
});
......@@ -65,9 +63,9 @@ export default function PublishMessage(props: Props) {
setFileList([...fileList, info.file]);
}
return;
} else if (info.file.status === "done") {
} else if (info.file.status === 'done') {
// Get this url from response in real world.
if (info.file.response.code === "200" && info.file.response.result) {
if (info.file.response.code === '200' && info.file.response.result) {
let fileList1 = fileList.map((item) => {
if (item.uid === info.file.uid) {
info.file.url = info.file.response.result?.[0];
......@@ -77,7 +75,7 @@ export default function PublishMessage(props: Props) {
});
setFileList([...fileList1]);
} else {
window.messageApi.error(info.file.response?.message || "上传失败");
window.messageApi.error(info.file.response?.message || '上传失败');
info.fileList = fileList.filter((item) => {
return item.uid !== info.file.uid;
});
......@@ -98,27 +96,25 @@ export default function PublishMessage(props: Props) {
.publish({
lat: position?.position?.lat, //纬度
lon: position?.position?.lng, //经度
title: "", //标题
title: '', //标题
description: values.description, //描述
userId: userInfo.id, //用户id
mediaVO: {
//发布图片
//@ts-ignore
picture: fileList
.filter((item) => item.url)
.map((item) => item.url),
picture: fileList.filter((item) => item.url).map((item) => item.url),
},
})
.then((res) => {
console.log("提交结果", res);
console.log('提交结果', res);
setShowLoad(false);
if (res.code === "200") {
window.messageApi.success("发布成功");
if (res.code === '200') {
window.messageApi.success('发布成功');
props.onCancel();
props.onOk && props.onOk();
setTimeout(() => {
form.resetFields(["title", "description"]);
form.resetFields(['title', 'description']);
setFileList([]);
}, 500);
}
......@@ -128,35 +124,31 @@ export default function PublishMessage(props: Props) {
return (
<Modal
title=""
title=''
open={props.open}
onCancel={props.onCancel}
width={500}
confirmLoading={confirmLoading}
footer={null}
okButtonProps={{ style: { height: 37, padding: "0 32px", fontSize: 16 } }}
cancelButtonProps={{ style: { display: "none" } }}
okButtonProps={{ style: { height: 37, padding: '0 32px', fontSize: 16 } }}
cancelButtonProps={{ style: { display: 'none' } }}
maskClosable={false}
>
<Form style={{ paddingTop: 32 }} onFinish={onFinish} form={form}>
<Form.Item
name="description"
rules={[{ required: true }]}
help="请输入内容"
>
<Form.Item name='description' rules={[{ required: true }]} help='请输入内容'>
<Input.TextArea
allowClear
showCount
placeholder="输入内容"
placeholder='输入内容'
maxLength={100}
style={{ height: 120, resize: "none" }}
style={{ height: 120, resize: 'none' }}
></Input.TextArea>
</Form.Item>
<Form.Item valuePropName="picture" getValueFromEvent={normFile}>
<Form.Item valuePropName='picture' getValueFromEvent={normFile}>
<Upload
name="uploadFile"
name='uploadFile'
action={gApi.imgOss}
listType="picture-card"
listType='picture-card'
fileList={fileList}
onPreview={handlePreview}
onChange={handleChange}
......@@ -175,27 +167,27 @@ export default function PublishMessage(props: Props) {
title={previewTitle}
footer={null}
onCancel={handlePreviewCancel}
bodyStyle={{ textAlign: "center" }}
bodyStyle={{ textAlign: 'center' }}
>
<Image alt="example" src={previewImage} preview={false} />
<Image alt='example' src={previewImage} preview={false} />
</Modal>
</Form.Item>
<Row justify="space-between" align="middle">
<Row justify='space-between' align='middle'>
<Col>
<NImage
style={{ verticalAlign: "text-top", marginRight: 7 }}
alt=""
src={require("./assets/position.png")}
style={{ verticalAlign: 'text-top', marginRight: 7 }}
alt=''
src={require('./assets/position.png')}
width={14}
height={17}
/>
{position?.address?.formattedAddress || "位置"}
{position?.address?.formattedAddress || '位置'}
</Col>
<Col>
<Button
type="primary"
htmlType="submit"
size="large"
type='primary'
htmlType='submit'
size='large'
style={{ width: 95 }}
loading={showLoading}
>
......
pages/home/styled.tsx
import styled from "styled-components"
import styled from 'styled-components';
export default function Style() {
return <></>;
}
export const Box = styled.div`
box-sizing: border-box;
`
\ No newline at end of file
box-sizing: border-box;
`;
pages/home/waterfallFlowBody/api/index.ts
import request, { Response } from '~/api/request'
import request, { Response } from '~/api/request';
export interface AllType {
categoryName: string
id: number
categoryName: string;
id: number;
}
export interface FilterOptionResp {
type: string
id: number
name: string
type: string;
id: number;
name: string;
}
export interface RegionResp {
childInfo: RegionResp[] | null
id: number
level: number
name: string
pid: number
childInfo: RegionResp[] | null;
id: number;
level: number;
name: string;
pid: number;
}
export const equipmentLeasingApi = {
deviceBrand: (): Promise<Response<Array<FilterOptionResp>>> => {
return request('/pms/webDevice/deviceBrand')
return request('/pms/webDevice/deviceBrand');
},
// deviceCategory: (): Promise<Response<Array<FilterOptionResp>>> => {
// return request("/pms/webDevice/category");
// },
deviceModel: (): Promise<Response<Array<FilterOptionResp>>> => {
return request('/pms/webDevice/deviceModel')
return request('/pms/webDevice/deviceModel');
},
}
};
export interface AppType {
id: number
name: string
appName: string
createTime: string
type: string
id: number;
name: string;
appName: string;
createTime: string;
type: string;
}
export interface IndustryType {
id: number
industryIcon: string
name: string
shortName: string
industryType: string
propagate1: string
propagate2: string
image: string
video: string
type: string
appName: string
id: number;
industryIcon: string;
name: string;
shortName: string;
industryType: string;
propagate1: string;
propagate2: string;
image: string;
video: string;
type: string;
appName: string;
}
export const jobServicesApi = {
listAllAppType: (): Promise<Response<Array<AppType>>> => {
return request('/release/work/listAllAppType')
return request('/release/work/listAllAppType');
},
listAllIndustry: (): Promise<Response<Array<IndustryType>>> => {
return request('/release/work/listAllIndustry')
return request('/release/work/listAllIndustry');
},
}
};
export const mallApi = {
listAllBrand: (): Promise<Response<Array<FilterOptionResp>>> => {
return request('/pms/webDevice/brand')
return request('/pms/webDevice/brand');
},
listAllCategory: (): Promise<Response<Array<FilterOptionResp>>> => {
return request('/pms/webProductMall/category')
return request('/pms/webProductMall/category');
},
listAllParts: (): Promise<Response<Array<FilterOptionResp>>> => {
return request('/pms/webProductMall/parts')
return request('/pms/webProductMall/parts');
},
listAllModel: (): Promise<Response<Array<FilterOptionResp>>> => {
return request('/pms/webDevice/model')
return request('/pms/webDevice/model');
},
listAllQuality: (): Promise<Response<Array<FilterOptionResp>>> => {
return request('/pms/webProductMall/quality')
return request('/pms/webProductMall/quality');
},
}
};
export interface SkillsType {
name: string
type: string
id: number
skillsName: string
licenseType: string
name: string;
type: string;
id: number;
skillsName: string;
licenseType: string;
}
export const flightSkillsApi = {
IndustryFlightSkills: (): Promise<Response<Array<SkillsType>>> => {
return request('/release/curriculum/getIndustryFlightSkills')
return request('/release/curriculum/getIndustryFlightSkills');
},
InDronePilotLicense: (): Promise<Response<Array<SkillsType>>> => {
return request('/release/curriculum/getDronePilotLicense')
return request('/release/curriculum/getDronePilotLicense');
},
}
};
export interface NewsPageType {
id: number
newsTitle: string
newsAuthor: string
userAccountId: number
surfaceImg: string
newsContents: string
createTime: string
updateTime: string | null
id: number;
newsTitle: string;
newsAuthor: string;
userAccountId: number;
surfaceImg: string;
newsContents: string;
createTime: string;
updateTime: string | null;
}
export interface NewsTenderType {
id: number
tenderNewsId: number
tenderInfoNo: string
tenderContent: string
tenderPrice: number
createTime: string
apply: number
id: number;
tenderNewsId: number;
tenderInfoNo: string;
tenderContent: string;
tenderPrice: number;
createTime: string;
apply: number;
}
export interface ListPageNewsInfoResp {
pageNo: number
pageSize: number
list: Array<NewsPageType>
totalCount: number
totalPage: number
pageNo: number;
pageSize: number;
list: Array<NewsPageType>;
totalCount: number;
totalPage: number;
}
export interface ListTenderNewsInfoResp {
pageNo: number
pageSize: number
list: Array<NewsTenderType>
totalCount: number
totalPage: number
pageNo: number;
pageSize: number;
list: Array<NewsTenderType>;
totalCount: number;
totalPage: number;
}
interface ListPageNewsInfoParams {
pageNo: number
pageSize: number
cityCode?: number
date?: string
districtCode?: number
provinceCode?: number
pageNo: number;
pageSize: number;
cityCode?: number;
date?: string;
districtCode?: number;
provinceCode?: number;
}
interface ListTenderNewsInfoParams {
pageNo: number
pageSize: number
cityCode?: number
date?: string
districtCode?: number
provinceCode?: number
pageNo: number;
pageSize: number;
cityCode?: number;
date?: string;
districtCode?: number;
provinceCode?: number;
}
export interface TenderApplyType {
tenderInfoId: number
tenderNewsId: number
userAccountId: number
tenderInfoId: number;
tenderNewsId: number;
userAccountId: number;
}
export const listNewsApi = {
//新闻列表
listNewsPage: (
params: ListPageNewsInfoParams
): Promise<Response<ListPageNewsInfoResp>> => {
return request('/release/industry-news/listNewsPage', 'post', params)
listNewsPage: (params: ListPageNewsInfoParams): Promise<Response<ListPageNewsInfoResp>> => {
return request('/release/industry-news/listNewsPage', 'post', params);
},
//招标列表
listNewTenderInfo: (
params: ListTenderNewsInfoParams
params: ListTenderNewsInfoParams,
): Promise<Response<ListTenderNewsInfoResp>> => {
return request('/release/tender/listNewTenderInfo', 'post', params)
return request('/release/tender/listNewTenderInfo', 'post', params);
},
//web-招标-合作申请提交
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
type: 1 | 2 | 3 | 4;
}
export interface ResHomeCategoriesType {
id: number
categoryName: string
id: number;
categoryName: string;
}
export default {
//新闻列表
HomeCategories: (
params: HomeCategoriesType
): Promise<Response<ResHomeCategoriesType>> => {
return request('/pms/product/mall/getPageHomeCategories', 'get', params)
HomeCategories: (params: HomeCategoriesType): Promise<Response<ResHomeCategoriesType>> => {
return request('/pms/product/mall/getPageHomeCategories', 'get', params);
},
}
};
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论