绑定手机号
This commit is contained in:
lyp
parent
74a2c6d6b5
commit
ab5b4d5443
47
package-lock.json
generated
47
package-lock.json
generated
@ -10,10 +10,12 @@
|
||||
"dependencies": {
|
||||
"@ant-design/cssinjs": "^1.19.1",
|
||||
"antd": "^5.20.3",
|
||||
"antd-img-crop": "^4.24.0",
|
||||
"axios": "^1.6.7",
|
||||
"event-source-polyfill": "^1.0.31",
|
||||
"localforage": "^1.10.0",
|
||||
"match-sorter": "^6.3.4",
|
||||
"moment": "^2.30.1",
|
||||
"pinyin-pro": "^3.19.6",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
@ -1919,6 +1921,20 @@
|
||||
"react-dom": ">=16.9.0"
|
||||
}
|
||||
},
|
||||
"node_modules/antd-img-crop": {
|
||||
"version": "4.24.0",
|
||||
"resolved": "https://registry.npmmirror.com/antd-img-crop/-/antd-img-crop-4.24.0.tgz",
|
||||
"integrity": "sha512-RqY/XqvmUnHlj7oLV2kN/ytdZdHUFAZyM3TN+QlTlLrze1Q74isAePgG+QTkLAbrkR9L/IgVRpjsuH/nevpU7Q==",
|
||||
"dependencies": {
|
||||
"react-easy-crop": "^5.2.0",
|
||||
"tslib": "^2.8.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"antd": ">=4.0.0",
|
||||
"react": ">=16.8.0",
|
||||
"react-dom": ">=16.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/argparse": {
|
||||
"version": "2.0.1",
|
||||
"resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz",
|
||||
@ -3131,6 +3147,14 @@
|
||||
"url": "https://github.com/sponsors/isaacs"
|
||||
}
|
||||
},
|
||||
"node_modules/moment": {
|
||||
"version": "2.30.1",
|
||||
"resolved": "https://registry.npmmirror.com/moment/-/moment-2.30.1.tgz",
|
||||
"integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==",
|
||||
"engines": {
|
||||
"node": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/ms": {
|
||||
"version": "2.1.2",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
|
||||
@ -3167,6 +3191,11 @@
|
||||
"integrity": "sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/normalize-wheel": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/normalize-wheel/-/normalize-wheel-1.0.1.tgz",
|
||||
"integrity": "sha512-1OnlAPZ3zgrk8B91HyRj+eVv+kS5u+Z0SCsak6Xil/kmgEia50ga7zfkumayonZrImffAxPU/5WcyGhzetHNPA=="
|
||||
},
|
||||
"node_modules/object-path": {
|
||||
"version": "0.6.0",
|
||||
"resolved": "https://registry.npmjs.org/object-path/-/object-path-0.6.0.tgz",
|
||||
@ -3968,6 +3997,19 @@
|
||||
"react": "^18.2.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-easy-crop": {
|
||||
"version": "5.4.1",
|
||||
"resolved": "https://registry.npmmirror.com/react-easy-crop/-/react-easy-crop-5.4.1.tgz",
|
||||
"integrity": "sha512-Djtsi7bWO75vkKYkVxNRrJWY69pXLahIAkUN0mmt9cXNnaq2tpG59ctSY6P7ipJgBc7COJDRMRuwb2lYwtACNQ==",
|
||||
"dependencies": {
|
||||
"normalize-wheel": "^1.0.1",
|
||||
"tslib": "^2.0.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.4.0",
|
||||
"react-dom": ">=16.4.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-is": {
|
||||
"version": "18.2.0",
|
||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz",
|
||||
@ -4380,6 +4422,11 @@
|
||||
"typescript": ">=4.2.0"
|
||||
}
|
||||
},
|
||||
"node_modules/tslib": {
|
||||
"version": "2.8.1",
|
||||
"resolved": "https://registry.npmmirror.com/tslib/-/tslib-2.8.1.tgz",
|
||||
"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w=="
|
||||
},
|
||||
"node_modules/type-check": {
|
||||
"version": "0.4.0",
|
||||
"resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
|
||||
|
||||
@ -12,10 +12,12 @@
|
||||
"dependencies": {
|
||||
"@ant-design/cssinjs": "^1.19.1",
|
||||
"antd": "^5.20.3",
|
||||
"antd-img-crop": "^4.24.0",
|
||||
"axios": "^1.6.7",
|
||||
"event-source-polyfill": "^1.0.31",
|
||||
"localforage": "^1.10.0",
|
||||
"match-sorter": "^6.3.4",
|
||||
"moment": "^2.30.1",
|
||||
"pinyin-pro": "^3.19.6",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
|
||||
14
src/App.css
14
src/App.css
@ -0,0 +1,14 @@
|
||||
.phoneBox{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.phoneBoxInput{
|
||||
display: flex;
|
||||
}
|
||||
.phoneBoxTitle{
|
||||
font-size: 16px;
|
||||
margin-right: 10px;
|
||||
line-height: 42px;
|
||||
/* color: #929292; */
|
||||
}
|
||||
212
src/App.tsx
212
src/App.tsx
@ -2,6 +2,7 @@
|
||||
// 引入Provider
|
||||
import { Provider } from 'react-redux';
|
||||
// 引入仓库
|
||||
import './App.css'
|
||||
import store from './store';
|
||||
import Head from './layout/head/Head.tsx';
|
||||
import Body from './layout/body/Body.tsx';
|
||||
@ -14,13 +15,19 @@ import {
|
||||
GlobalDispatchContext,
|
||||
} from "./context/GlobalContext.ts";
|
||||
import React, { Reducer, useReducer, useState, useEffect } from "react";
|
||||
|
||||
import { getCode, checkPhone,updatePhone } from './request/api.ts'
|
||||
import {
|
||||
message
|
||||
message,
|
||||
Modal,
|
||||
Form,
|
||||
Button,
|
||||
Input
|
||||
} from 'antd';
|
||||
import { get } from "./util/AjaxUtils.ts";
|
||||
const App: React.FC = () => {
|
||||
const [isTokenFetched, setIsTokenFetched] = useState(false);
|
||||
const [isUpdateWxUsernamePhone, setIsUpdateWxUsernamePhone] = useState(false); // 绑定手机号号弹窗
|
||||
const [form] = Form.useForm<any>();
|
||||
const globalDataReducer = (state: GlobalData, action: GlobalDataAction) => {
|
||||
if (action.type == GlobalDataActionType.REFRESH_SELF) {
|
||||
if (action.user) {
|
||||
@ -44,7 +51,98 @@ const App: React.FC = () => {
|
||||
hasUserInfo: false
|
||||
}
|
||||
});
|
||||
const [messageApi] = message.useMessage();
|
||||
const [userId, setUserId] = useState(''); // 验证码ID
|
||||
const [messageApi, messageContext] = message.useMessage();
|
||||
const submit = async(phone:any,code:any) => {
|
||||
try{
|
||||
const formData = new URLSearchParams();
|
||||
formData.append('userId', userId);
|
||||
formData.append('phone', phone);
|
||||
formData.append('smsCode', code);
|
||||
|
||||
const res = await updatePhone(formData.toString());
|
||||
console.log(res);
|
||||
|
||||
}catch (error: any) {
|
||||
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
const onFinish = async (values: any) => {
|
||||
// console.log('Success:', values);
|
||||
try {
|
||||
const res = await checkPhone(values.phone)
|
||||
console.log(res);
|
||||
if(res.data == 'SUCCESS'){
|
||||
submit(values.phone,values.smsCode)
|
||||
}else{
|
||||
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: '手机号已被绑定,请更换手机号',
|
||||
});
|
||||
}
|
||||
|
||||
} catch (error: any) {
|
||||
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
const [countdown, setCountdown] = useState(0); // 倒计时状态
|
||||
|
||||
const sendCode = async () => {
|
||||
try {
|
||||
// 验证手机号输入项
|
||||
await form.validateFields(['phone']);
|
||||
|
||||
setCountdown(120);
|
||||
console.log('发送验证码');
|
||||
const timer = setInterval(() => {
|
||||
setCountdown((prevCountdown) => {
|
||||
if (prevCountdown > 0) {
|
||||
return prevCountdown - 1;
|
||||
} else {
|
||||
clearInterval(timer);
|
||||
return 0;
|
||||
}
|
||||
});
|
||||
}, 1000);
|
||||
// 获取表单phone的值
|
||||
// const phone = form.getFieldValue('phone');
|
||||
await getCode(form.getFieldValue('phone'))
|
||||
|
||||
} catch (error: any) {
|
||||
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// const nav = useNavigate();
|
||||
useEffect(() => {
|
||||
|
||||
@ -52,6 +150,13 @@ const App: React.FC = () => {
|
||||
messageApi,
|
||||
url: '/api/user-info/get-user-self',
|
||||
onSuccess({ data }: any) {
|
||||
console.log('嘻嘻嘻', data);
|
||||
// setIsUpdateWxUsernamePhone(data.isUpdateWxUsernamePhone);
|
||||
// if (data.isUpdateWxUsernamePhone == 1) {
|
||||
if (data.isUpdateWxUsernamePhone == 1) {
|
||||
setIsUpdateWxUsernamePhone(true);
|
||||
}
|
||||
setUserId(data.userId);
|
||||
// const currentToken = sessionStorage.getItem('token');
|
||||
sessionStorage.setItem('token', data.accessToken);
|
||||
const token = sessionStorage.getItem('token');
|
||||
@ -82,7 +187,7 @@ const App: React.FC = () => {
|
||||
if (isTokenFetched) {
|
||||
return (
|
||||
<div>
|
||||
|
||||
{messageContext}
|
||||
<Provider store={store}>
|
||||
<GlobalContext.Provider value={globalData}>
|
||||
<GlobalDispatchContext.Provider value={dispatch}>
|
||||
@ -92,7 +197,106 @@ const App: React.FC = () => {
|
||||
</GlobalDispatchContext.Provider>
|
||||
</GlobalContext.Provider>
|
||||
</Provider>
|
||||
<Modal
|
||||
title="绑定手机号"
|
||||
okText="确认"
|
||||
cancelText="取消"
|
||||
destroyOnClose={true}
|
||||
footer={null}
|
||||
open={isUpdateWxUsernamePhone}
|
||||
// onOk={() => {
|
||||
// setOrderDetailModal(false)
|
||||
// }}
|
||||
onCancel={() => {
|
||||
setIsUpdateWxUsernamePhone(false);
|
||||
}}
|
||||
width={500}
|
||||
centered
|
||||
|
||||
>
|
||||
<div className='phoneBox'>
|
||||
<Form name="Form"
|
||||
form={form}
|
||||
onFinish={onFinish}
|
||||
initialValues={{ softWare: '' }}
|
||||
// style={{ maxWidth: 600 }}
|
||||
>
|
||||
<div className='phoneBoxInput'>
|
||||
<div className='phoneBoxTitle'>手机号<span style={{ color: 'red' }}>*</span></div>
|
||||
<Form.Item name="phone" label="" rules={[{ required: true, message: '请输入手机号' },
|
||||
{
|
||||
pattern: /^1[3-9]\d{9}$/,
|
||||
message: '请输入有效的手机号'
|
||||
}
|
||||
]}>
|
||||
<Input style={{
|
||||
width: '300px',
|
||||
height: '42px',
|
||||
}} placeholder="请输入手机号" />
|
||||
</Form.Item>
|
||||
</div>
|
||||
<div className='phoneBoxInput' style={{
|
||||
position: 'relative',
|
||||
// backgroundColor:'pink',
|
||||
}}>
|
||||
<div className='phoneBoxTitle'>验证码<span style={{ color: 'red' }}>*</span></div>
|
||||
<Form.Item name="smsCode" label="" rules={[{ required: true, message: '请输入验证码' }]}>
|
||||
<Input style={{
|
||||
width: '300px',
|
||||
height: '42px',
|
||||
}} placeholder="请输入验证码" />
|
||||
</Form.Item>
|
||||
{countdown === 0 ? (
|
||||
<div
|
||||
style={{
|
||||
position: 'absolute',
|
||||
right: '0',
|
||||
top: '0',
|
||||
width: '90px',
|
||||
height: '42px',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
display: 'flex',
|
||||
cursor: 'pointer',
|
||||
color: '#929292',
|
||||
paddingRight: 10,
|
||||
}}
|
||||
onClick={sendCode}
|
||||
>
|
||||
发送验证码
|
||||
</div>
|
||||
) : (
|
||||
<div
|
||||
style={{
|
||||
position: 'absolute',
|
||||
right: '0',
|
||||
top: '0',
|
||||
width: '90px',
|
||||
height: '42px',
|
||||
justifyContent: 'center',
|
||||
alignItems: 'center',
|
||||
display: 'flex',
|
||||
color: '#929292',
|
||||
paddingRight: 10,
|
||||
}}
|
||||
>
|
||||
倒计时 {countdown} 秒
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div>
|
||||
<Form.Item>
|
||||
<Button type="primary" htmlType="submit">
|
||||
提交
|
||||
</Button>
|
||||
</Form.Item>
|
||||
</div>
|
||||
|
||||
</Form>
|
||||
</div>
|
||||
</Modal>
|
||||
</div>
|
||||
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@ -1,15 +1,75 @@
|
||||
import { useState, useEffect } from 'react'
|
||||
import {
|
||||
Spin
|
||||
} from 'antd';
|
||||
import './order-detail-modal.css'
|
||||
import OrderInfo from '../../components/OrderDetailModal/components/OrderInfo/OrderInfo'
|
||||
import GoodsInfo from '../../components/OrderDetailModal/components/GoodsInfo/GoodsInfo'
|
||||
import Copyright from '../../components/OrderDetailModal/components/Copyright/Copyright'
|
||||
import Authorize from '../../components/OrderDetailModal/components/Authorize/Authorize'
|
||||
import File from '../../components/OrderDetailModal/components/File/File'
|
||||
import Result from '../../components/OrderDetailModal/components/Result/Result'
|
||||
export default function OrderDetailModal() {
|
||||
import useMessage from "antd/es/message/useMessage";
|
||||
import { orderDetail } from '../../request/api'
|
||||
// import Result from '../../components/OrderDetailModal/components/Result/Result'
|
||||
export default function OrderDetailModal(props: any) {
|
||||
const [messageApi, messageContext] = useMessage();
|
||||
const height = window.innerHeight - 180;
|
||||
const [activeKey, setActiveKey] = useState('roder') //tap栏选项 默认选第一个
|
||||
const [loading, setLoading] = useState(false)
|
||||
|
||||
// 订单信息
|
||||
// const orderInfo = {
|
||||
// orderPrice: '11', //订单金额
|
||||
// orderStatus: '过户已完成', //订单状态
|
||||
// orderTime: '2024-04-25 15:34:10', //下单时间
|
||||
// payTime: '2024-04-25 15:34:10', //付款时间
|
||||
// cardTime: '2024-04-25 15:34:10', //下证时间
|
||||
// evaluateTime: '2024-04-25 15:34:10',//评价时间
|
||||
// orderRate: 3, //评价星级
|
||||
// rateText: '喜喜喜喜喜喜喜喜喜喜哈哈哈哈' //评价内容
|
||||
// }
|
||||
const [orderInfo, setOrderInfo] = useState({
|
||||
payMoney: 0, //金额
|
||||
orderStatus: '', //订单状态
|
||||
createTime: '',//下单时间
|
||||
payTime: '',//付款时间
|
||||
produceTime: '',//下证时间
|
||||
successTime: '',//评价时间
|
||||
evaluateLevel: 0,//评价星级
|
||||
evaluateRemark: ''//评价内容
|
||||
})
|
||||
const [goodsInfo, setGoodsInfo] = useState({
|
||||
goodsPhoto: '',//软著图片
|
||||
goodsName: '',//软著名称
|
||||
goodsNumber: '',//软著编号
|
||||
goodsSubName: '',//软著简称
|
||||
goodsVersion: '',//软著版本
|
||||
goodsGetTime: '',//取得时间
|
||||
goodsDevelop: '',//开发语言
|
||||
goodsGetType: '',//获取方式
|
||||
goodsOpenPrice: '',//售卖价格
|
||||
goodsStatusTime: '',//上架时间
|
||||
goodsDescription: ''//软著说明
|
||||
})
|
||||
// 著作权人信息
|
||||
const [copyrightInfo, setCopyrightInfo] = useState({
|
||||
type: '',//类型
|
||||
name: '',//姓名
|
||||
city: '',//城市
|
||||
phone: '',//电话
|
||||
idcardType: '',//证件类型
|
||||
idcard: '',//证件号码
|
||||
|
||||
})
|
||||
// 受让人信息
|
||||
const [authorizeInfo, setAuthorizeInfo] = useState({
|
||||
type: '',//类型
|
||||
name: '',//姓名
|
||||
city: '',//城市
|
||||
phone: '',//电话
|
||||
idcardType: '',//证件类型
|
||||
idcard: '',//证件号码
|
||||
})
|
||||
// tab栏 标题数组
|
||||
const tapTitleArray = [
|
||||
{
|
||||
@ -22,75 +82,107 @@ export default function OrderDetailModal() {
|
||||
title: '著作权商品信息',
|
||||
className: activeKey == 'goodsInfo' ? 'orderDetailTop-title tapActive' : 'orderDetailTop-title'
|
||||
},
|
||||
{
|
||||
key: 'copyright',
|
||||
title: ' 著作权人信息',
|
||||
className: activeKey == 'copyright' ? 'orderDetailTop-title tapActive' : 'orderDetailTop-title'
|
||||
},
|
||||
{
|
||||
key: 'authorize',
|
||||
title: '受权人信息',
|
||||
className: activeKey == 'authorize' ? 'orderDetailTop-title tapActive' : 'orderDetailTop-title'
|
||||
},
|
||||
(props.user == 'sell' ?
|
||||
{
|
||||
key: 'copyright',
|
||||
title: '著作权人信息 ',
|
||||
className: activeKey === 'copyright' ? 'orderDetailTop-title tapActive' : 'orderDetailTop-title'
|
||||
}
|
||||
: {}),
|
||||
(
|
||||
props.user == 'buy' ?
|
||||
{
|
||||
key: 'authorize',
|
||||
title: '受让人信息',
|
||||
className: activeKey == 'authorize' ? 'orderDetailTop-title tapActive' : 'orderDetailTop-title'
|
||||
}
|
||||
: {}
|
||||
),
|
||||
|
||||
{
|
||||
key: 'file',
|
||||
title: '资料补充',
|
||||
className: activeKey == 'file' ? 'orderDetailTop-title tapActive' : 'orderDetailTop-title'
|
||||
},
|
||||
{
|
||||
key: 'result',
|
||||
title: '过户结果',
|
||||
className: activeKey == 'result' ? 'orderDetailTop-title tapActive borderRight' : 'orderDetailTop-title borderRight'
|
||||
className: activeKey == 'file' ? 'orderDetailTop-title tapActive borderRight' : 'orderDetailTop-title borderRight'
|
||||
},
|
||||
// {
|
||||
// key: 'result',
|
||||
// title: '过户结果',
|
||||
// className: activeKey == 'result' ? 'orderDetailTop-title tapActive borderRight' : 'orderDetailTop-title borderRight'
|
||||
// },
|
||||
]
|
||||
// 订单信息
|
||||
const orderInfo = {
|
||||
orderPrice: '11', //订单金额
|
||||
orderStatus: '过户已完成', //订单状态
|
||||
orderTime: '2024-04-25 15:34:10', //下单时间
|
||||
payTime: '2024-04-25 15:34:10', //付款时间
|
||||
cardTime: '2024-04-25 15:34:10', //下证时间
|
||||
evaluateTime: '2024-04-25 15:34:10',//评价时间
|
||||
orderRate: 3, //评价星级
|
||||
rateText: '喜喜喜喜喜喜喜喜喜喜哈哈哈哈' //评价内容
|
||||
const getOrderDetail = async () => {
|
||||
try {
|
||||
setLoading(true)
|
||||
const res: any = await orderDetail(props.orderId)
|
||||
setLoading(false)
|
||||
// console.log(res)
|
||||
setOrderInfo({
|
||||
...res
|
||||
})
|
||||
setGoodsInfo({
|
||||
...res.goodsDTO
|
||||
})
|
||||
setCopyrightInfo({
|
||||
...res.sellUserDTO
|
||||
})
|
||||
setAuthorizeInfo({
|
||||
...res.buyUserDTO
|
||||
})
|
||||
|
||||
|
||||
} catch (error: any) {
|
||||
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
useEffect(() => {
|
||||
// 发起请求获取订单信息 发送给其他组件
|
||||
|
||||
getOrderDetail()
|
||||
}, [])
|
||||
return (
|
||||
<div style={{ width: 1200, maxHeight: `${height}px`, minHeight: "680px" }}>
|
||||
<div className='orderDetailTop'>
|
||||
{tapTitleArray.map((item) => {
|
||||
return (
|
||||
<div key={item.key} className={item.className} onClick={() => {
|
||||
setActiveKey(item.key)
|
||||
}}>
|
||||
{item.title}
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
<div className='orderDetailBot'>
|
||||
<div style={{ display: activeKey == 'roder' ? 'block' : 'none' }}>
|
||||
<OrderInfo orderInfo={orderInfo}></OrderInfo>
|
||||
<Spin tip="正在加载..." size="small" spinning={loading}>
|
||||
<div style={{ width: 1200, maxHeight: `${height}px`, minHeight: "680px" }}>
|
||||
{messageContext}
|
||||
<div className='orderDetailTop'>
|
||||
{tapTitleArray.map((item:any) => {
|
||||
return (
|
||||
<div key={item.key} className={item.className} onClick={() => {
|
||||
setActiveKey(item.key)
|
||||
}}>
|
||||
{item.title}
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
<div style={{ display: activeKey == 'goodsInfo' ? 'block' : 'none' }}>
|
||||
<GoodsInfo ></GoodsInfo>
|
||||
</div>
|
||||
<div style={{ display: activeKey == 'copyright' ? 'block' : 'none' }}>
|
||||
<Copyright ></Copyright>
|
||||
</div>
|
||||
<div style={{ display: activeKey == 'authorize' ? 'block' : 'none' }}>
|
||||
<Authorize ></Authorize>
|
||||
</div>
|
||||
<div style={{ display: activeKey == 'file' ? 'block' : 'none' }}>
|
||||
<File ></File>
|
||||
</div>
|
||||
<div style={{ display: activeKey == 'result' ? 'block' : 'none' }}>
|
||||
<div className='orderDetailBot'>
|
||||
<div style={{ display: activeKey == 'roder' ? 'block' : 'none' }}>
|
||||
<OrderInfo orderInfo={orderInfo}></OrderInfo>
|
||||
</div>
|
||||
<div style={{ display: activeKey == 'goodsInfo' ? 'block' : 'none' }}>
|
||||
<GoodsInfo goodsInfo={goodsInfo} ></GoodsInfo>
|
||||
</div>
|
||||
<div style={{ display: activeKey == 'copyright' ? 'block' : 'none' }}>
|
||||
<Copyright copyrightInfo={copyrightInfo}></Copyright>
|
||||
</div>
|
||||
<div style={{ display: activeKey == 'authorize' ? 'block' : 'none' }}>
|
||||
<Authorize authorizeInfo={authorizeInfo} ></Authorize>
|
||||
</div>
|
||||
<div style={{ display: activeKey == 'file' ? 'block' : 'none' }}>
|
||||
<File user={props.user} orderId={props.orderId}></File>
|
||||
</div>
|
||||
{/* <div style={{ display: activeKey == 'result' ? 'block' : 'none' }}>
|
||||
<Result ></Result>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Spin>
|
||||
)
|
||||
}
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
|
||||
import { Input } from "antd";
|
||||
export default function Authorize() {
|
||||
export default function Authorize(props:any) {
|
||||
const authorizeInfo = props.authorizeInfo
|
||||
return (
|
||||
<div className="copyright">
|
||||
<div className='copyright-input'>
|
||||
@ -8,7 +9,7 @@ export default function Authorize() {
|
||||
类别
|
||||
</div>
|
||||
<Input
|
||||
value={''}
|
||||
value={authorizeInfo.type}
|
||||
disabled
|
||||
style={{
|
||||
width: 400,
|
||||
@ -24,7 +25,7 @@ export default function Authorize() {
|
||||
姓名或名称
|
||||
</div>
|
||||
<Input
|
||||
value={'嘻嘻'}
|
||||
value={authorizeInfo.name}
|
||||
disabled
|
||||
style={{
|
||||
width: 400,
|
||||
@ -40,7 +41,7 @@ export default function Authorize() {
|
||||
所在城市
|
||||
</div>
|
||||
<Input
|
||||
value={''}
|
||||
value={authorizeInfo.city}
|
||||
disabled
|
||||
style={{
|
||||
width: 400,
|
||||
@ -56,7 +57,7 @@ export default function Authorize() {
|
||||
联系电话
|
||||
</div>
|
||||
<Input
|
||||
value={''}
|
||||
value={authorizeInfo.phone}
|
||||
disabled
|
||||
style={{
|
||||
width: 400,
|
||||
@ -72,7 +73,7 @@ export default function Authorize() {
|
||||
证件类型
|
||||
</div>
|
||||
<Input
|
||||
value={''}
|
||||
value={authorizeInfo.idcardType}
|
||||
disabled
|
||||
style={{
|
||||
width: 400,
|
||||
@ -88,7 +89,7 @@ export default function Authorize() {
|
||||
证件号码
|
||||
</div>
|
||||
<Input
|
||||
value={''}
|
||||
value={authorizeInfo.idcard}
|
||||
disabled
|
||||
style={{
|
||||
width: 400,
|
||||
|
||||
@ -1,7 +1,10 @@
|
||||
|
||||
import './copyright.css'
|
||||
import { Input } from "antd";
|
||||
export default function Copyright() {
|
||||
export default function Copyright(props:any) {
|
||||
const copyrightInfo = props.copyrightInfo
|
||||
|
||||
|
||||
return (
|
||||
<div className="copyright">
|
||||
<div className='copyright-input'>
|
||||
@ -9,7 +12,7 @@ export default function Copyright() {
|
||||
类别
|
||||
</div>
|
||||
<Input
|
||||
value={'法人'}
|
||||
value={copyrightInfo.type}
|
||||
disabled
|
||||
style={{
|
||||
width: 400,
|
||||
@ -25,7 +28,7 @@ export default function Copyright() {
|
||||
姓名或名称
|
||||
</div>
|
||||
<Input
|
||||
value={''}
|
||||
value={copyrightInfo.name}
|
||||
disabled
|
||||
style={{
|
||||
width: 400,
|
||||
@ -41,7 +44,7 @@ export default function Copyright() {
|
||||
所在城市
|
||||
</div>
|
||||
<Input
|
||||
value={''}
|
||||
value={copyrightInfo.city}
|
||||
disabled
|
||||
style={{
|
||||
width: 400,
|
||||
@ -57,7 +60,7 @@ export default function Copyright() {
|
||||
联系电话
|
||||
</div>
|
||||
<Input
|
||||
value={''}
|
||||
value={copyrightInfo.phone}
|
||||
disabled
|
||||
style={{
|
||||
width: 400,
|
||||
@ -73,7 +76,7 @@ export default function Copyright() {
|
||||
证件类型
|
||||
</div>
|
||||
<Input
|
||||
value={''}
|
||||
value={copyrightInfo.idcardType}
|
||||
disabled
|
||||
style={{
|
||||
width: 400,
|
||||
@ -89,7 +92,7 @@ export default function Copyright() {
|
||||
证件号码
|
||||
</div>
|
||||
<Input
|
||||
value={''}
|
||||
value={copyrightInfo.idcard}
|
||||
disabled
|
||||
style={{
|
||||
width: 400,
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
.copyright{
|
||||
width: 1100px;
|
||||
width: 1150px;
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
@ -1,73 +1,120 @@
|
||||
// import React from 'react'
|
||||
import { Table, Space } from "antd"
|
||||
import { useEffect, useState } from 'react'
|
||||
import { Table, Space, Modal } from "antd"
|
||||
import { sellSupplementList, buySupplementList, supplementDetail } from '../../../../request/api'
|
||||
const { Column } = Table;
|
||||
export default function File() {
|
||||
const data = [
|
||||
{
|
||||
id:'123',
|
||||
fileTitle:'嘻嘻嘻嘻嘻嘻嘻',
|
||||
fileConent:'资料内容',
|
||||
time:'2024-05-14 15:05:56',
|
||||
status:'卖家待补充/买家待补充',
|
||||
},
|
||||
{
|
||||
id:"012",
|
||||
fileTitle:'哈哈哈哈',
|
||||
fileConent:'资料内容',
|
||||
time:'2024-05-14 15:05:56',
|
||||
status:'卖家待补充/买家待补充',
|
||||
},
|
||||
{
|
||||
|
||||
fileTitle:'嘎嘎嘎嘎嘎嘎嘎嘎嘎嘎1',
|
||||
fileConent:'资料内容',
|
||||
time:'2024-05-14 15:05:56',
|
||||
status:'卖家待补充/买家待补充',
|
||||
},
|
||||
{
|
||||
fileTitle:'嘎嘎嘎嘎嘎嘎嘎嘎嘎嘎2',
|
||||
fileConent:'资料内容',
|
||||
time:'2024-05-14 15:05:56',
|
||||
status:'卖家待补充/买家待补充',
|
||||
},
|
||||
{
|
||||
fileTitle:'嘎嘎嘎嘎嘎嘎嘎嘎嘎嘎3',
|
||||
fileConent:'资料内容',
|
||||
time:'2024-05-14 15:05:56',
|
||||
status:'卖家待补充/买家待补充',
|
||||
},
|
||||
{
|
||||
fileTitle:'嘎嘎嘎嘎嘎嘎嘎嘎嘎嘎4',
|
||||
fileConent:'资料内容',
|
||||
time:'2024-05-14 15:05:56',
|
||||
status:'卖家待补充/买家待补充',
|
||||
},
|
||||
{
|
||||
fileTitle:'嘎嘎嘎嘎嘎嘎嘎嘎嘎嘎5',
|
||||
fileConent:'资料内容',
|
||||
time:'2024-05-14 15:05:56',
|
||||
status:'卖家待补充/买家待补充',
|
||||
},
|
||||
{
|
||||
fileTitle:'嘎嘎嘎嘎嘎嘎嘎嘎嘎嘎6',
|
||||
fileConent:'资料内容',
|
||||
time:'2024-05-14 15:05:56',
|
||||
status:'卖家待补充/买家待补充',
|
||||
},
|
||||
import useMessage from "antd/es/message/useMessage";
|
||||
export default function File(props: any) {
|
||||
const [messageApi, messageContext] = useMessage();
|
||||
const [correctionId, setCorrectionId] = useState('') // 点击查看内容选中的id
|
||||
// 补充资料弹窗
|
||||
const [isModalVisible, setIsModalVisible] = useState(false)
|
||||
const [page, setPage] = useState(1) // 当前页码
|
||||
const [total, setTotal] = useState(0) // 总条数
|
||||
const [data, setData] = useState([])
|
||||
const getSellSupplementList = async () => {
|
||||
try {
|
||||
const res: any = await sellSupplementList({
|
||||
orderId: props.orderId,
|
||||
page: page,
|
||||
rows: 10
|
||||
})
|
||||
setPage(res.page)
|
||||
setTotal(res.total)
|
||||
console.log(res);
|
||||
setData(res.rows)
|
||||
// let newData:any = [];
|
||||
// for (let i = 0; i < 10; i++) {
|
||||
// newData = newData.concat(res.rows);
|
||||
// }
|
||||
// setData(newData);
|
||||
|
||||
} catch (error: any) {
|
||||
|
||||
]
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
const getBuySupplementList = async () => {
|
||||
try {
|
||||
const res: any = await buySupplementList({
|
||||
orderId: props.orderId,
|
||||
page: page,
|
||||
rows: 10
|
||||
})
|
||||
setPage(res.page)
|
||||
setTotal(res.total)
|
||||
// console.log(res);
|
||||
setData(res.rows)
|
||||
} catch (error: any) {
|
||||
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
const getSupplementDetail = async (id: string) => {
|
||||
try {
|
||||
const res: any = await supplementDetail(id)
|
||||
console.log(res);
|
||||
|
||||
} catch (error: any) {
|
||||
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
useEffect(() => {
|
||||
if (props.user == 'sell') {
|
||||
getSellSupplementList()
|
||||
} else if (props.user == 'buy') {
|
||||
getBuySupplementList()
|
||||
}
|
||||
}, [page])
|
||||
return (
|
||||
<div>
|
||||
{messageContext}
|
||||
<Table
|
||||
// scroll={{ y: `${height - 190}px` }}
|
||||
dataSource={data}
|
||||
pagination={{
|
||||
defaultPageSize: 5, // 设置默认一页显示 5 条数据
|
||||
}}
|
||||
// pagination={{
|
||||
// defaultPageSize: 5, // 设置默认一页显示 5 条数据
|
||||
// }}
|
||||
scroll={{ y: 480 }}
|
||||
pagination={
|
||||
{
|
||||
pageSize: 10,
|
||||
total: total,
|
||||
onChange: (currentPage) => {
|
||||
setPage(currentPage);
|
||||
},
|
||||
showSizeChanger: false,
|
||||
current: page
|
||||
|
||||
}
|
||||
}
|
||||
// pagination={false} // 不显示分页
|
||||
style={{ textAlign: 'center' }} // 设置表格内容居中显示
|
||||
rowKey="fileTitle" // 指定数据项的唯一标识符
|
||||
rowKey="orderId" // 指定数据项的唯一标识符
|
||||
>
|
||||
<Column
|
||||
width={70}
|
||||
@ -76,29 +123,42 @@ export default function File() {
|
||||
)} align="center" />
|
||||
<Column
|
||||
title="资料主题"
|
||||
dataIndex="fileTitle"
|
||||
dataIndex="correctionTitle"
|
||||
align="center"
|
||||
width={200}
|
||||
render={(text) => (
|
||||
<div style={{ overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }} title={text}>{text}</div>
|
||||
)}
|
||||
// render={(text) => (
|
||||
// <span style={{ color: '#1B8BD2', fontSize: '16px', fontWeight: '700' }}>{text}</span>
|
||||
// )}
|
||||
/>
|
||||
<Column
|
||||
title="资料内容"
|
||||
dataIndex="fileConent"
|
||||
dataIndex="correctionRemark"
|
||||
align="center"
|
||||
width={300}
|
||||
render={(text) => (
|
||||
<div style={{ overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }} title={text}>{text}</div>
|
||||
)}
|
||||
/>
|
||||
<Column
|
||||
title="发起时间"
|
||||
dataIndex="time"
|
||||
width={200}
|
||||
dataIndex="createTime"
|
||||
align="center"
|
||||
// ellipsis
|
||||
/>
|
||||
<Column
|
||||
title="状态"
|
||||
dataIndex="status"
|
||||
dataIndex={props.user == 'sell' ? "sellId" : "buyId"}
|
||||
align="center"
|
||||
width={100}
|
||||
render={(text) => (
|
||||
<span style={{ color: '#DD0000', fontSize: '16px', fontWeight: '700' }}>{text}</span>
|
||||
<>
|
||||
<span style={{ color: '#DD0000', fontSize: '16px', fontWeight: '700', display: text == '' ? 'unset' : 'none' }}>待补充</span>
|
||||
<span style={{ color: 'green', fontSize: '16px', fontWeight: '700', display: text == '' ? 'none' : 'unset' }}>已补充</span>
|
||||
</>
|
||||
)}
|
||||
/>
|
||||
|
||||
@ -106,16 +166,35 @@ export default function File() {
|
||||
<Column
|
||||
align="center"
|
||||
title="操作"
|
||||
width={100}
|
||||
render={(_text, record: any) => (
|
||||
<Space size="middle">
|
||||
<span className='transaction-order-table-btn' onClick={() => {
|
||||
console.log(record);
|
||||
console.log(record.correctionId);
|
||||
setCorrectionId(record.correctionId)
|
||||
getSupplementDetail(record.correctionId)
|
||||
setIsModalVisible(true)
|
||||
|
||||
}}>查看内容</span>
|
||||
|
||||
</Space>
|
||||
)}
|
||||
/>
|
||||
</Table>
|
||||
<Modal title={'补充'}
|
||||
destroyOnClose={true}
|
||||
open={isModalVisible}
|
||||
footer={null} // 将 footer 设置为 null 来隐藏自带按钮
|
||||
width={1152}
|
||||
onCancel={() => {
|
||||
setIsModalVisible(false);
|
||||
}}
|
||||
centered
|
||||
>
|
||||
<div>
|
||||
{correctionId}
|
||||
</div>
|
||||
</Modal>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@ -1,14 +1,16 @@
|
||||
import './GoodsInfo.css'
|
||||
import { Input, Image } from "antd";
|
||||
import testImg from '../../../../static/test.jpg'
|
||||
// import testImg from '../../../../static/test.jpg'
|
||||
import { showImage } from '../../../../request/request'
|
||||
const { TextArea } = Input;
|
||||
|
||||
export default function GoodsInfo() {
|
||||
export default function GoodsInfo(props: any) {
|
||||
const goodsInfo = props.goodsInfo
|
||||
return (
|
||||
<div className='goodsInfo'>
|
||||
<div className='goodsInfo-left'>
|
||||
<div className='goodsInfo-img'>
|
||||
<Image src={testImg} width={'100%'} height={'100%'} preview={{
|
||||
<Image src={showImage(goodsInfo.goodsPhoto)} width={'100%'} height={'100%'} preview={{
|
||||
mask: <div>点击放大软著证书</div>,
|
||||
}}></Image>
|
||||
</div>
|
||||
@ -22,7 +24,7 @@ export default function GoodsInfo() {
|
||||
软著名称
|
||||
</div>
|
||||
<Input
|
||||
value={'嘻嘻嘻嘻嘻嘻嘻嘻嘻嘻嘻嘻嘻嘻嘻嘻嘻'}
|
||||
value={goodsInfo.goodsName}
|
||||
disabled
|
||||
style={{
|
||||
width: 280,
|
||||
@ -38,6 +40,7 @@ export default function GoodsInfo() {
|
||||
软著简称
|
||||
</div>
|
||||
<Input
|
||||
value={goodsInfo.goodsSubName}
|
||||
disabled
|
||||
style={{
|
||||
width: 280,
|
||||
@ -53,6 +56,7 @@ export default function GoodsInfo() {
|
||||
软著证号
|
||||
</div>
|
||||
<Input
|
||||
value={goodsInfo.goodsNumber}
|
||||
disabled
|
||||
style={{
|
||||
width: 280,
|
||||
@ -67,6 +71,8 @@ export default function GoodsInfo() {
|
||||
软著版本
|
||||
</div>
|
||||
<Input
|
||||
value={goodsInfo.goodsVersion}
|
||||
|
||||
disabled
|
||||
style={{
|
||||
width: 280,
|
||||
@ -81,6 +87,8 @@ export default function GoodsInfo() {
|
||||
取得时间
|
||||
</div>
|
||||
<Input
|
||||
value={goodsInfo.goodsGetTime}
|
||||
|
||||
disabled
|
||||
style={{
|
||||
width: 280,
|
||||
@ -95,6 +103,7 @@ export default function GoodsInfo() {
|
||||
开发语言
|
||||
</div>
|
||||
<Input
|
||||
value={goodsInfo.goodsDevelop}
|
||||
disabled
|
||||
style={{
|
||||
width: 280,
|
||||
@ -109,6 +118,7 @@ export default function GoodsInfo() {
|
||||
获取方式
|
||||
</div>
|
||||
<Input
|
||||
value={goodsInfo.goodsGetType}
|
||||
disabled
|
||||
style={{
|
||||
width: 280,
|
||||
@ -123,6 +133,7 @@ export default function GoodsInfo() {
|
||||
售卖价格
|
||||
</div>
|
||||
<Input
|
||||
value={goodsInfo.goodsOpenPrice}
|
||||
disabled
|
||||
style={{
|
||||
width: 280,
|
||||
@ -137,6 +148,7 @@ export default function GoodsInfo() {
|
||||
上架时间
|
||||
</div>
|
||||
<Input
|
||||
value={goodsInfo.goodsStatusTime}
|
||||
disabled
|
||||
style={{
|
||||
width: 280,
|
||||
@ -146,12 +158,13 @@ export default function GoodsInfo() {
|
||||
background: '#F5F5F9'
|
||||
}}></Input>
|
||||
</div>
|
||||
|
||||
|
||||
<div className='goodsInfo-input'>
|
||||
<div className='goodsinfo-title'>
|
||||
软著详情
|
||||
</div>
|
||||
<TextArea
|
||||
value={goodsInfo.goodsDescription}
|
||||
disabled
|
||||
style={{
|
||||
width: 700,
|
||||
|
||||
@ -25,7 +25,7 @@ export default function OrderInfo(props: any) {
|
||||
color: "#5C5C5C",
|
||||
height: 42,
|
||||
background: '#F5F5F9',
|
||||
}} value={orderInfo.orderPrice}></Input>
|
||||
}} value={orderInfo.payMoney}></Input>
|
||||
</div>
|
||||
<div className='orderInfo'>
|
||||
<div className='orderInfo-title'>订单状态</div>
|
||||
@ -49,7 +49,7 @@ export default function OrderInfo(props: any) {
|
||||
height: 42,
|
||||
background: '#F5F5F9',
|
||||
color: "#5C5C5C"
|
||||
}} value={orderInfo.orderTime}></Input>
|
||||
}} value={orderInfo.createTime}></Input>
|
||||
</div>
|
||||
<div className='orderInfo'>
|
||||
<div className='orderInfo-title'>付款时间</div>
|
||||
@ -73,7 +73,7 @@ export default function OrderInfo(props: any) {
|
||||
height: 42,
|
||||
background: '#F5F5F9',
|
||||
color: "#5C5C5C"
|
||||
}} value={orderInfo.cardTime}></Input>
|
||||
}} value={orderInfo.produceTime}></Input>
|
||||
</div>
|
||||
<div className='orderInfo'>
|
||||
<div className='orderInfo-title'>评价时间</div>
|
||||
@ -85,26 +85,27 @@ export default function OrderInfo(props: any) {
|
||||
height: 42,
|
||||
background: '#F5F5F9',
|
||||
color: "#5C5C5C"
|
||||
}} value={orderInfo.evaluateTime}></Input>
|
||||
}} value={orderInfo.successTime}></Input>
|
||||
</div>
|
||||
<div className='orderInfo orderInfoRate'>
|
||||
<div className='orderInfo-title'>订单评价</div>
|
||||
<Rate allowHalf disabled value={orderInfo.orderRate} />
|
||||
<Rate allowHalf disabled value={orderInfo.evaluateLevel} />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div className='orderInfo' style={{ padding: '0 16px 0 18px', width: 1100, }}>
|
||||
<div className='orderInfo' style={{ padding: '0 16px 0 18px', width: 1150, }}>
|
||||
<div className='orderInfo-title'>评价内容</div>
|
||||
<TextArea
|
||||
disabled
|
||||
style={{
|
||||
width: '100%',
|
||||
// width: 1100,
|
||||
height: 150,
|
||||
fontSize: 16,
|
||||
color: "#5C5C5C",
|
||||
resize: 'none',
|
||||
background: '#F5F5F9'
|
||||
}} value={orderInfo.rateText}></TextArea>
|
||||
}} value={orderInfo.evaluateRemark}></TextArea>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
.orderDetailBot-order {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 1100px;
|
||||
width: 1150px;
|
||||
/* background-color: red; */
|
||||
flex-wrap: wrap;
|
||||
/* margin-top: 42px; */
|
||||
@ -11,6 +11,7 @@
|
||||
.orderInfo {
|
||||
display: flex;
|
||||
margin-bottom: 29px;
|
||||
|
||||
/* position: relative; */
|
||||
/* align-items: center; */
|
||||
}
|
||||
|
||||
@ -19,7 +19,7 @@ export default function MenuWithTopButton(props: IMenuWithTopButton) {
|
||||
setMenuItem(
|
||||
props.list.map((m) => {
|
||||
if (getMenuActive()) {
|
||||
if (getMenuActive() == m.path) {
|
||||
if (getMenuActive() == m.id) {
|
||||
m['active'] = true
|
||||
} else {
|
||||
m['active'] = false
|
||||
@ -33,14 +33,57 @@ export default function MenuWithTopButton(props: IMenuWithTopButton) {
|
||||
const list = menuItem.map((item, index) => (
|
||||
// 创建项目下三个选项
|
||||
<li className={item.active ? 'active' : ''} key={item.id} onClick={(e) => {
|
||||
props.handleListItem(e, index, item);
|
||||
if (item.path) {
|
||||
setMenuActive(item.path)
|
||||
props.handleListItem(e, index, item);
|
||||
// if (item.path) {
|
||||
// setMenuActive(item.id)
|
||||
|
||||
navigate(item.path);
|
||||
// navigate(item.path);
|
||||
// }
|
||||
setMenuActive(item.id)
|
||||
if (item.id == 'PRODUCT') {
|
||||
navigate('/product-release', {
|
||||
state: {
|
||||
sellKeywords: props.sellKeywords,
|
||||
sellBelongType: props.sellBelongType,
|
||||
sellDate: props.sellDate,
|
||||
language: props.language,
|
||||
sellBoxtype: props.sellBoxtype
|
||||
}
|
||||
})
|
||||
}
|
||||
if (item.id == 'TRABSACTION') {
|
||||
navigate('/transaction-order', {
|
||||
state: {
|
||||
sellStatrtTime: props.sellStatrtTime,
|
||||
sellEndTime: props.sellEndTime,
|
||||
sellOrderStatus: props.sellOrderStatus,
|
||||
sellOrderKeywords: props.sellOrderKeywords,
|
||||
}
|
||||
})
|
||||
}
|
||||
if (item.id == 'COPYRIGHT') {
|
||||
navigate('/copyright-goods', {
|
||||
state: {
|
||||
copyrightKeywords: props.copyrightKeywords,
|
||||
minPrice: props.minPrice,
|
||||
maxPrice: props.maxPrice,
|
||||
sort: props.sort,
|
||||
copyrightDate: props.copyrightDate,
|
||||
copyrightLanguage: props.copyrightLanguage,
|
||||
copyrightType: props.copyrightType,
|
||||
}
|
||||
})
|
||||
}
|
||||
if (item.id == 'TRADING') {
|
||||
navigate('/trading-goods', {
|
||||
state: {
|
||||
tradingKeywords: props.tradingKeywords,
|
||||
tradingStartTime: props.tradingStartTime,
|
||||
tradingEndTime: props.tradingEndTime,
|
||||
tradingStatus: props.tradingStatus,
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// navigate('/home');
|
||||
|
||||
}}>
|
||||
@ -57,9 +100,7 @@ export default function MenuWithTopButton(props: IMenuWithTopButton) {
|
||||
return (
|
||||
<div className="menu-with-bot-button">
|
||||
{/* button 是三个黄色按钮 */}
|
||||
<div className='bot' onClick={(e) => {
|
||||
props.button.handle(e);
|
||||
}}>
|
||||
<div className='bot' >
|
||||
<div className='bot-lift'>
|
||||
{/* <img src={serveImg} alt="" /> */}
|
||||
<div className='sell-buy' style={{ display: props.button.name == '我要卖' ? 'block' : 'none' }}>卖</div>
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
import {MouseEvent} from "react";
|
||||
import { MouseEvent } from "react";
|
||||
|
||||
export interface IMenuListItem {
|
||||
id: string;
|
||||
icon?: string;
|
||||
name: string;
|
||||
active?: boolean;
|
||||
path?:string
|
||||
path?: string
|
||||
}
|
||||
|
||||
export interface IMenuButton {
|
||||
@ -19,19 +19,44 @@ export interface IMenuWithTopButton {
|
||||
list: Array<IMenuListItem>;
|
||||
|
||||
handleListItem(e: MouseEvent<HTMLLIElement>, index: number, item: IMenuListItem): void;
|
||||
keywords?:string;
|
||||
type?:string ;
|
||||
chargeAdditionals?:string;
|
||||
tagDataId?:string;
|
||||
authorId?:string;
|
||||
refunKeywords?:string
|
||||
applyStatus?:string
|
||||
payStatus?:string
|
||||
correctionKeywords?:string
|
||||
correctionNumType?:string
|
||||
correctionType?:string
|
||||
correctionApplyStatus?:string
|
||||
tagCor?:string
|
||||
keywords?: string;
|
||||
type?: string;
|
||||
chargeAdditionals?: string;
|
||||
tagDataId?: string;
|
||||
authorId?: string;
|
||||
refunKeywords?: string
|
||||
applyStatus?: string
|
||||
payStatus?: string
|
||||
correctionKeywords?: string
|
||||
correctionNumType?: string
|
||||
correctionType?: string
|
||||
correctionApplyStatus?: string
|
||||
tagCor?: string
|
||||
// disableBelongpeople?:any
|
||||
// enableBelongpeople?:any
|
||||
sellBelongType?: any,
|
||||
sellDate?: any,
|
||||
language?: any,
|
||||
sellBoxtype?: any,
|
||||
sellKeywords?: any,
|
||||
sellStatrtTime?: any,
|
||||
sellEndTime?: any,
|
||||
sellOrderStatus?: any,
|
||||
sellOrderKeywords?: any,
|
||||
|
||||
|
||||
|
||||
copyrightKeywords?: any,
|
||||
minPrice?: any,
|
||||
maxPrice?: any,
|
||||
sort?: any,
|
||||
copyrightDate?: any,
|
||||
copyrightLanguage?: any,
|
||||
copyrightType?: any,
|
||||
|
||||
tradingKeywords?: any,
|
||||
tradingStartTime?: any,
|
||||
tradingEndTime?: any,
|
||||
tradingStatus?: any,
|
||||
|
||||
}
|
||||
@ -1,25 +1,26 @@
|
||||
import request from './request'
|
||||
import {request,newRequest} from './request'
|
||||
// import newRequest from './request'
|
||||
// 获取登录标志
|
||||
export const getLoginflag = (userId:string) => request.get(`/operator-plugin/app/contentcensusrelease/log?requestUrl=网页USER${userId}`)
|
||||
export const getLoginflag = (userId: string) => request.get(`/operator-plugin/app/contentcensusrelease/log?requestUrl=网页USER${userId}`)
|
||||
// 获取开票记录列表
|
||||
export const getInvoiceRecordList = (userId:string,params: any) => request.get(`/operator-plugin/api/invoicerecharge/listpage/${userId}`,{params})
|
||||
export const getInvoiceRecordList = (userId: string, params: any) => request.get(`/operator-plugin/api/invoicerecharge/listpage/${userId}`, { params })
|
||||
// 获取开票信息数组
|
||||
export const getInvoiceList = (userId:string,params: any) => request.get(`/operator-plugin/api/invoice-config/listpage/${userId}`,{params})
|
||||
export const getInvoiceList = (userId: string, params: any) => request.get(`/operator-plugin/api/invoice-config/listpage/${userId}`, { params })
|
||||
|
||||
// 新增开票信息
|
||||
export const addInvoiceInfo = (userId:string,params:any) => request.post(`/operator-plugin/api/invoice-config/save/${userId}`,params)
|
||||
export const addInvoiceInfo = (userId: string, params: any) => request.post(`/operator-plugin/api/invoice-config/save/${userId}`, params)
|
||||
// 获取开票信息
|
||||
export const getInvoiceInfo = (invoiceId: string) => request.get(`/operator-plugin/api/invoice-config/get/${invoiceId}`)
|
||||
//更新开票信息
|
||||
export const updateInvoiceInfo = (invoiceId: string,params:any) => request.put(`/operator-plugin/api/invoice-config/update/${invoiceId}`,params)
|
||||
export const updateInvoiceInfo = (invoiceId: string, params: any) => request.put(`/operator-plugin/api/invoice-config/update/${invoiceId}`, params)
|
||||
// 删除开票信息
|
||||
export const deleteInvoiceInfo = (invoiceId: string) => request.delete(`/operator-plugin/api/invoice-config/remove/${invoiceId}`)
|
||||
// 获取可申请开票的充值记录列表
|
||||
export const getRechargeRecordList = (userId:string,params: any) => request.get(`/operator-plugin/api/invoicerecharge/recharge-listpage/${userId}/not`,{params})
|
||||
export const getRechargeRecordList = (userId: string, params: any) => request.get(`/operator-plugin/api/invoicerecharge/recharge-listpage/${userId}/not`, { params })
|
||||
//获取开票的充值记录(点击查看开票的充值记录)
|
||||
export const getInvoiceRechargeList = (invoiceRechargeId:string,params:any) => request.get(`/operator-plugin/api/invoicerecharge/listpage-byid/${invoiceRechargeId}`,{params})
|
||||
export const getInvoiceRechargeList = (invoiceRechargeId: string, params: any) => request.get(`/operator-plugin/api/invoicerecharge/listpage-byid/${invoiceRechargeId}`, { params })
|
||||
// 提交开票申请
|
||||
export const submitInvoiceApply = (userId:string,params:any) => request.post(`/operator-plugin/api/invoicerecharge/save/${userId}`,params)
|
||||
export const submitInvoiceApply = (userId: string, params: any) => request.post(`/operator-plugin/api/invoicerecharge/save/${userId}`, params)
|
||||
// 查看开票信息
|
||||
export const getInvoiceInfoById = (invoiceRechargeId: string) => request.get(`/operator-plugin/api/invoicerecharge/get/${invoiceRechargeId}`)
|
||||
// 取消开票
|
||||
@ -27,4 +28,63 @@ export const cancelInvoice = (invoiceRechargeId: string) => request.put(`/operat
|
||||
// 获取开票信息
|
||||
export const getInvoiceInfoByinvoiceRechargeId = (invoiceRechargeId: string) => request.get(`/operator-plugin/api/invoicerecharge/get/${invoiceRechargeId}`)
|
||||
// 修改开票信息
|
||||
export const updateInvoiceInfoByinvoiceRechargeId = (invoiceRechargeId: string,params:any) => request.put(`/operator-plugin/api/invoicerecharge/update/${invoiceRechargeId}`,params)
|
||||
export const updateInvoiceInfoByinvoiceRechargeId = (invoiceRechargeId: string, params: any) => request.put(`/operator-plugin/api/invoicerecharge/update/${invoiceRechargeId}`, params)
|
||||
|
||||
|
||||
|
||||
// 买卖商品接口
|
||||
// 获取商品列表
|
||||
export const getGoodsList = (params: any) => request.get(`/aishop/api/goods/listpage`, { params })
|
||||
// 获取开发语言
|
||||
export const getLanguageList = () => request.get(`/aishop/api/data/listbyparentid/f8bf7112-623c-494c-ad29-ccef5cfe2e1f`)
|
||||
// 获取软著类型
|
||||
export const getSoftTypeList = () => request.get(`/aishop/api/data/listbyparentid/0b00884a-f7a2-425f-93e5-599fbaad4bde`)
|
||||
// 获取商品详情
|
||||
export const getGoodsDetail = (goodsId: string) => request.get(`/aishop/api/goods/get/${goodsId}`)
|
||||
// 获取证件类型
|
||||
export const getCertificateTypeList = () => request.get(`/aishop/api/data/listbyparentid/ce3ded65-68ed-4f42-89da-de1b813b8f7e`)
|
||||
// 获取省份
|
||||
export const getProvinceList = () => request.get(`/aishop/api/area/listbyparentid/0`)
|
||||
// 获取市
|
||||
export const getCityList = (provinceId: string) => request.get(`/aishop/api/area/listbyparentid/${provinceId}`)
|
||||
|
||||
// 新增商品
|
||||
export const addGoods = (params: any) => request.post(`/aishop/api/goods/save`, params)
|
||||
// 修改商品
|
||||
export const updateGoods = (goodsId: string, params: any) => request.put(`/aishop/api/goods/update/${goodsId}`, params)
|
||||
|
||||
// 提交审核
|
||||
export const submitAudit = (goodsId: string) => request.put(`/aishop/api/goods/sub-check/${goodsId}`)
|
||||
|
||||
// 商品上架
|
||||
export const putOnShelf = (goodsId: string) => request.put(`/aishop/api/goods/publish/${goodsId}`)
|
||||
// 商品下架
|
||||
export const putOffShelf = (goodsId: string) => request.put(`/aishop/api/goods/no-publish/${goodsId}`)
|
||||
// 删除商品
|
||||
export const deleteGoods = (goodsId: string) => request.delete(`/aishop/api/goods/remove/${goodsId}`)
|
||||
// 我要卖订单分页列表
|
||||
export const getSellOrderList = (params: any) => request.get(`/aishop/api/order/listpage-sell`, { params })
|
||||
// 我要买订单分页列表
|
||||
export const getBuyOrderList = (params: any) => request.get(`/aishop/api/order/listpage-buy`, { params })
|
||||
// 获取订单详情
|
||||
export const orderDetail = (orderId: string) => request.get(`/aishop/api/order/get/${orderId}`)
|
||||
|
||||
// 获取卖家补充资料列表
|
||||
export const sellSupplementList = (params: any) => request.get(`/aishop/api/correction/listpage-sell`, { params })
|
||||
|
||||
// 获取买家补充资料列表
|
||||
export const buySupplementList = (params: any) => request.get(`/aishop/api/correction/listpage-buy`, { params })
|
||||
// 获取补充资料详情
|
||||
export const supplementDetail = (correctionId: string) => request.get(`/aishop/api/correction/get/${correctionId}`)
|
||||
// 获取可以买的商品列表
|
||||
export const buyGoodsList = (params: any) => request.get(`/aishop/api/goodsonline/listpage`, { params })
|
||||
|
||||
|
||||
|
||||
// 绑定手机号接口
|
||||
// 获取验证码
|
||||
export const getCode = (phone: number) => request.get(`/operator/api/verify/code/send/${phone}`)
|
||||
// 验证手机号是否可用
|
||||
export const checkPhone = (phone: number) => request.get(`/operator/api/user-wx-update-username/check-phone/${phone}`)
|
||||
// 更新手机号
|
||||
export const updatePhone = (params:any) => newRequest.post(`/operator/oauth/wx/update/phone`, params)
|
||||
|
||||
@ -1,6 +1,11 @@
|
||||
import axios from "axios";
|
||||
const baseURL = 'http://192.168.0.115:8099';
|
||||
// const baseURL = 'http://192.168.0.115:8099'; // 开票功能baseUrl
|
||||
// const baseURL = 'http://192.168.0.115:8081'; //买卖功能baseUrl
|
||||
|
||||
const baseURL = 'http://192.168.0.15:8091'; //绑定手机号baseUrl
|
||||
|
||||
// const baseURL = 'https://www.aimzhu.com';
|
||||
|
||||
const request = axios.create({
|
||||
baseURL: baseURL,
|
||||
timeout: 5000,
|
||||
@ -23,10 +28,37 @@ request.interceptors.response.use(
|
||||
},
|
||||
(err) => Promise.reject(err)
|
||||
);
|
||||
const newRequest = axios.create({
|
||||
baseURL: baseURL,
|
||||
timeout: 5000,
|
||||
});
|
||||
newRequest.interceptors.request.use(
|
||||
(config) => {
|
||||
// 有token带token
|
||||
|
||||
return config;
|
||||
},
|
||||
|
||||
(err) => Promise.reject(err)
|
||||
);
|
||||
newRequest.interceptors.response.use(
|
||||
(res) => {
|
||||
return res.data;
|
||||
},
|
||||
(err) => Promise.reject(err)
|
||||
);
|
||||
|
||||
// 下载发票
|
||||
export const downloadInvoice = (id: string) => {
|
||||
return `${baseURL}/operator-plugin/route/file/download/false/${id}`
|
||||
};
|
||||
|
||||
export default request
|
||||
// 显示图片
|
||||
export const showImage = (fileId: string, isDownload?: boolean) => {
|
||||
return `${baseURL}/aishop/route/file/download/${isDownload == false}/${fileId}`
|
||||
}
|
||||
// 上传图片
|
||||
export const uploadImageUrl = () => {
|
||||
return `${baseURL}/aishop/api/file/v2/upload-image`
|
||||
}
|
||||
// export default request
|
||||
export { newRequest ,request};
|
||||
@ -1,347 +1,221 @@
|
||||
import './copyrightG-goods.css'
|
||||
import {
|
||||
Select, DatePicker, Button, Table,
|
||||
// Select, DatePicker, Button,
|
||||
Table,
|
||||
// message,
|
||||
Space, Empty, Pagination, InputNumber
|
||||
Space,
|
||||
Pagination,
|
||||
// InputNumber
|
||||
Spin,
|
||||
Modal,
|
||||
Image
|
||||
} from 'antd';
|
||||
import type { InputNumberProps } from 'antd';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
import dayjs, { } from 'dayjs';
|
||||
import { buyGoodsList } from '../../request/api'
|
||||
// import type { InputNumberProps } from 'antd';
|
||||
// import type { TableColumnsType } from 'antd';
|
||||
import { SearchOutlined, ClearOutlined } from '@ant-design/icons';
|
||||
import type { DatePickerProps } from 'antd';
|
||||
import locale from 'antd/es/date-picker/locale/zh_CN';
|
||||
import { useState } from 'react';
|
||||
// import { SearchOutlined, ClearOutlined } from '@ant-design/icons';
|
||||
// import type { DatePickerProps } from 'antd';
|
||||
// import locale from 'antd/es/date-picker/locale/zh_CN';
|
||||
import { useState, useEffect } from 'react';
|
||||
import useMessage from "antd/es/message/useMessage";
|
||||
const { Column } = Table;
|
||||
export default function CopyrightGgoods() {
|
||||
const [messageApi, messageContext] = useMessage();
|
||||
const height = window.innerHeight - 180;
|
||||
const [goodsId, setGoodsId] = useState<any>() //商品ID
|
||||
const [goodsDetailModal, setGoodsDetailModal] = useState(false) //订单详情
|
||||
|
||||
// const [messageApi, contextHolder] = message.useMessage();
|
||||
const dateFormat = 'YYYY年MM月DD日';
|
||||
const [minPrice, setMinPrice] = useState<any>() //最低价格
|
||||
const [maxPrice, setMaxPrice] = useState<any>() //最高价格
|
||||
const [date, setDate] = useState<any>() //获取时间
|
||||
const [sort, setSort] = useState<any>() //排序
|
||||
const [language, setLanguage] = useState<any>() //开发语言
|
||||
const [type, setType] = useState<any>() //软著类型
|
||||
const [page, setPage] = useState(1) //分页
|
||||
// 更改最低价格
|
||||
const minPriceChange: InputNumberProps['onChange'] = (value) => {
|
||||
console.log('changed', value);
|
||||
setMinPrice(value)
|
||||
};
|
||||
// 更改最高价格
|
||||
const maxPriceChange: InputNumberProps['onChange'] = (value) => {
|
||||
console.log('changed', value);
|
||||
setMaxPrice(value)
|
||||
};
|
||||
// 更改价格排序
|
||||
const sortChange = (value: string) => {
|
||||
console.log(`selected ${value}`)
|
||||
setSort(value)
|
||||
// const dateFormat = 'YYYY-MM-DD';
|
||||
// const [minPrice, setMinPrice] = useState<any>() //最低价格
|
||||
// const [maxPrice, setMaxPrice] = useState<any>() //最高价格
|
||||
// const [date, setDate] = useState<any>() //获取时间
|
||||
// const [sort, setSort] = useState<any>() //排序
|
||||
// const [language, setLanguage] = useState<any>() //开发语言
|
||||
// const [type, setType] = useState<any>() //软著类型
|
||||
const [page, setPage] = useState(1) //页
|
||||
const [total, setTotal] = useState(0) //总条数
|
||||
const [loading, setLoading] = useState(false) //加载中
|
||||
const { state } = useLocation()
|
||||
const copyrightKeywords = state ? state.copyrightKeywords : ''; // 版权关键字
|
||||
const minPrice = state ? state.minPrice : ''; // 最低价格
|
||||
const maxPrice = state ? state.maxPrice : ''; // 最高价格
|
||||
const sort = state ? state.sort : ''; // 排序
|
||||
const copyrightDate = state ? state.copyrightDate : ''; // 版权日期
|
||||
const copyrightLanguage = state ? state.copyrightLanguage : ''; // 开发语言
|
||||
const copyrightType = state ? state.copyrightType : ''; // 软著类型
|
||||
|
||||
|
||||
const [data, setData] = useState([]); // 表格数据
|
||||
const getBuyGoodsList = async (page: number) => {
|
||||
try {
|
||||
setLoading(true)
|
||||
const res: any = await buyGoodsList({
|
||||
page: page,
|
||||
rows: 10,
|
||||
keywords: copyrightKeywords ? copyrightKeywords : '', // 版权关键字
|
||||
priceRangeStart: minPrice ? minPrice : '', // 最低价格
|
||||
priceRangeEnd: maxPrice ? maxPrice : '', // 最高价格
|
||||
priceOrder: sort ? sort : '', // 排序
|
||||
goodsGetTime: copyrightDate ? dayjs(copyrightDate).year() : '', // 版权日期
|
||||
goodsDevelop: copyrightLanguage ? copyrightLanguage : '', // 开发语言
|
||||
goodsType: copyrightType ? copyrightType.join(',') : '', // 软著类型
|
||||
})
|
||||
console.log(res);
|
||||
|
||||
setLoading(false)
|
||||
setPage(res.page)
|
||||
setData(res.rows)
|
||||
setTotal(res.total)
|
||||
setLoading(false)
|
||||
|
||||
} catch (error: any) {
|
||||
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
// 更改开发语言
|
||||
const languageChange = (value: string) => {
|
||||
console.log(`selected ${value}`)
|
||||
setLanguage(value)
|
||||
}
|
||||
// 软著类型更改
|
||||
const typeChange = (value: string) => {
|
||||
console.log(`selected ${value}`);
|
||||
setType(value)
|
||||
}
|
||||
// 获取时间更改
|
||||
const dateChange: DatePickerProps['onChange'] = (date, dateString) => {
|
||||
console.log(date, dateString);
|
||||
setDate(date)
|
||||
};
|
||||
// 点击搜索
|
||||
const onSearch = () => {
|
||||
|
||||
useEffect(() => {
|
||||
console.log('copyrightKeywords', copyrightKeywords);
|
||||
console.log('minPrice', minPrice);
|
||||
console.log('maxPrice', maxPrice);
|
||||
console.log('sort', sort);
|
||||
console.log('copyrightDate', copyrightDate);
|
||||
console.log('copyrightLanguage', copyrightLanguage);
|
||||
console.log('copyrightType', copyrightType);
|
||||
|
||||
if (copyrightDate) {
|
||||
console.log('sellDate', dayjs(copyrightDate).year());
|
||||
}
|
||||
setPage(1)
|
||||
console.log(minPrice, maxPrice, date, sort, language, type);
|
||||
|
||||
}
|
||||
// 初始化搜索条件
|
||||
const init = () => {
|
||||
setMinPrice(undefined)
|
||||
setMaxPrice(undefined)
|
||||
setDate(undefined)
|
||||
setSort(undefined)
|
||||
setLanguage(undefined)
|
||||
setType(undefined)
|
||||
}
|
||||
// 点击清除
|
||||
const clearKeyWords = () => {
|
||||
setPage(1)
|
||||
init()
|
||||
}
|
||||
interface DataType {
|
||||
name: string
|
||||
short: string
|
||||
number: string
|
||||
price: string
|
||||
version: string
|
||||
time: string
|
||||
language: string
|
||||
}
|
||||
|
||||
const data: DataType[] = [
|
||||
{
|
||||
name: '智能管理系统',
|
||||
short: '简称',
|
||||
number: '312345678912345617891',
|
||||
price: '5.00',
|
||||
version: '1-1-1',
|
||||
time: '2020-04-19 15：42:21',
|
||||
language: 'java'
|
||||
},
|
||||
{
|
||||
name: '商城管理系统',
|
||||
short: '简称',
|
||||
number: '11234567891234567892',
|
||||
price: '5.00',
|
||||
version: '1-1-1',
|
||||
time: '2020-04-19 15：42:21',
|
||||
language: 'java'
|
||||
},
|
||||
{
|
||||
name: 'xx系统',
|
||||
short: '简称',
|
||||
number: '21234567891234567893',
|
||||
price: '5.00',
|
||||
version: '1-1-1',
|
||||
time: '2020-04-19 15：42:21',
|
||||
language: 'java'
|
||||
},
|
||||
{
|
||||
name: 'xx系统',
|
||||
short: '简称',
|
||||
number: '21234567891234567894',
|
||||
price: '5.00',
|
||||
version: '1-1-1',
|
||||
time: '2020-04-19 15：42:21',
|
||||
language: 'java'
|
||||
},
|
||||
{
|
||||
name: 'xx系统',
|
||||
short: '简称',
|
||||
number: '21234567891234567895',
|
||||
price: '5.00',
|
||||
version: '1-1-1',
|
||||
time: '2020-04-19 15：42:21',
|
||||
language: 'java'
|
||||
},
|
||||
{
|
||||
name: 'xx系统',
|
||||
short: '简称',
|
||||
number: '21234567891234567896',
|
||||
price: '5.00',
|
||||
version: '1-1-1',
|
||||
time: '2020-04-19 15：42:21',
|
||||
language: 'java'
|
||||
},
|
||||
{
|
||||
name: 'xx系统',
|
||||
short: '简称',
|
||||
number: '21234567891234567897',
|
||||
price: '5.00',
|
||||
version: '1-1-1',
|
||||
time: '2020-04-19 15：42:21',
|
||||
language: 'java'
|
||||
},
|
||||
{
|
||||
name: 'xx系统',
|
||||
short: '简称',
|
||||
number: '21234567891234567898',
|
||||
price: '5.00',
|
||||
version: '1-1-1',
|
||||
time: '2020-04-19 15：42:21',
|
||||
language: 'java'
|
||||
},
|
||||
{
|
||||
name: 'xx系统',
|
||||
short: '简称',
|
||||
number: '21234567891234567899',
|
||||
price: '5.00',
|
||||
version: '1-1-1',
|
||||
time: '2020-04-19 15：42:21',
|
||||
language: 'java'
|
||||
},
|
||||
{
|
||||
name: 'xx系统',
|
||||
short: '简称',
|
||||
number: '21234567891234567890',
|
||||
price: '5.00',
|
||||
version: '1-1-1',
|
||||
time: '2020-04-19 15：42:21',
|
||||
language: 'java'
|
||||
},
|
||||
];
|
||||
|
||||
|
||||
getBuyGoodsList(1)
|
||||
}, [state])
|
||||
|
||||
return (
|
||||
<div className='copyrightG-goods' style={{ height: `${height}px`, overflow: 'auto' }}>
|
||||
{messageContext}
|
||||
{/* {contextHolder} */}
|
||||
<div className='copyrightG-goods-search'>
|
||||
<InputNumber placeholder="最低价格" min={0}
|
||||
style={{
|
||||
width: 100,
|
||||
// height: 36,
|
||||
marginRight: 12
|
||||
}}
|
||||
value={minPrice}
|
||||
onChange={minPriceChange}
|
||||
/>
|
||||
至
|
||||
<InputNumber placeholder="最高价格" min={0} style={{
|
||||
width: 100,
|
||||
// height: 36,
|
||||
marginRight: 12,
|
||||
marginLeft: 12
|
||||
}}
|
||||
value={maxPrice}
|
||||
onChange={maxPriceChange}
|
||||
/>
|
||||
|
||||
<DatePicker placeholder="软著获取时间"
|
||||
style={{ width: 198, height: 36, marginRight: 12 }}
|
||||
format={dateFormat}
|
||||
locale={locale}
|
||||
onChange={dateChange}
|
||||
value={date}
|
||||
/>
|
||||
<Select
|
||||
// defaultValue="lucy"
|
||||
placeholder='价格排序'
|
||||
style={{ width: 100, height: 36, marginRight: 12 }}
|
||||
onChange={sortChange}
|
||||
options={[
|
||||
{ value: 'rise', label: '升序' },
|
||||
{ value: 'drop', label: '降序' },
|
||||
]}
|
||||
value={sort}
|
||||
/>
|
||||
<Select
|
||||
// defaultValue="lucy"
|
||||
placeholder='选择开发语言'
|
||||
style={{ width: 198, height: 36, marginRight: 12 }}
|
||||
onChange={languageChange}
|
||||
options={[
|
||||
{ value: 'java', label: 'java' },
|
||||
{ value: 'php', label: 'php' },
|
||||
]}
|
||||
value={language}
|
||||
/>
|
||||
<Select
|
||||
// defaultValue="lucy"
|
||||
placeholder='选择软著类型'
|
||||
style={{ width: 198, height: 36, marginRight: 12 }}
|
||||
onChange={typeChange}
|
||||
options={[
|
||||
{ value: 'person', label: '个人' },
|
||||
{ value: 'lucy', label: '公司' },
|
||||
]}
|
||||
value={type}
|
||||
/>
|
||||
<Button type="primary"
|
||||
style={{
|
||||
height: 36,
|
||||
// backgroundColor: '#FF9F08'
|
||||
}}
|
||||
|
||||
icon={<SearchOutlined />}
|
||||
onClick={onSearch}
|
||||
>
|
||||
搜索
|
||||
</Button>
|
||||
<Button
|
||||
style={{
|
||||
height: 36,
|
||||
marginLeft: 10,
|
||||
// backgroundColor: '#FF9F08'
|
||||
}}
|
||||
icon={<ClearOutlined />}
|
||||
onClick={clearKeyWords}
|
||||
>
|
||||
清除
|
||||
</Button>
|
||||
</div>
|
||||
<div className='copyrightG-goods-table'>
|
||||
{/* 表格 */}
|
||||
{data.length == 0 ? (
|
||||
{/* {data.length == 0 ? (
|
||||
<div className='nodata' style={{ height: `${height - 93}px` }}>
|
||||
<Empty
|
||||
description={
|
||||
'暂无数据'
|
||||
} />
|
||||
</div>) : (
|
||||
<div>
|
||||
<div style={{ height: `${height - 130}px` }}>
|
||||
<Table
|
||||
scroll={{ y: `${height - 190}px` }}
|
||||
dataSource={data}
|
||||
pagination={false} // 不显示分页
|
||||
style={{ textAlign: 'center' }} // 设置表格内容居中显示
|
||||
rowKey="number" // 指定数据项的唯一标识符
|
||||
>
|
||||
<Column
|
||||
width={70}
|
||||
title="序号" render={(_text, _record, index: number) => (
|
||||
index + 1
|
||||
)} align="center" />
|
||||
<Column
|
||||
title="软著名称"
|
||||
dataIndex="name"
|
||||
align="center"
|
||||
render={(text) => (
|
||||
<span style={{ color: '#1B8BD2', fontSize: '16px', fontWeight: '700' }}>{text}</span>
|
||||
)}
|
||||
/>
|
||||
<Column
|
||||
title="软著简称"
|
||||
dataIndex="short"
|
||||
align="center"
|
||||
/>
|
||||
<Column
|
||||
title="软著证号"
|
||||
dataIndex="number"
|
||||
align="center"
|
||||
// ellipsis
|
||||
/>
|
||||
<Column title="售价" dataIndex="price" align="center"
|
||||
render={(text) => (
|
||||
<span style={{ color: '#FF5D15', fontSize: '24px', fontWeight: '700' }}>{text}</span>
|
||||
)} />
|
||||
<Column title="软著版本" dataIndex="version" align="center" />
|
||||
<Column title="软著取得时间" dataIndex="time" align="center" />
|
||||
<Column title="软著开发语言" dataIndex="language" align="center" />
|
||||
{/* <Column title="实名认证状态" dataIndex="address" key="key" /> */}
|
||||
<Column
|
||||
align="center"
|
||||
title="软著电子版"
|
||||
render={(_text, record: any) => (
|
||||
<Space size="middle">
|
||||
<span className='copyrightG-goods-table-btn' onClick={() => {
|
||||
console.log(record.number);
|
||||
</div>) : ( */}
|
||||
{/* <div> */}
|
||||
<Spin tip="正在加载..." size="small" spinning={loading}>
|
||||
<div style={{ height: `${height - 80}px` }}>
|
||||
|
||||
<Table
|
||||
scroll={{ y: `${height - 150}px` }}
|
||||
dataSource={data}
|
||||
pagination={false} // 不显示分页
|
||||
style={{ textAlign: 'center' }} // 设置表格内容居中显示
|
||||
rowKey="goodsId" // 指定数据项的唯一标识符
|
||||
locale={{ emptyText: '暂无数据' }}
|
||||
>
|
||||
<Column
|
||||
width={70}
|
||||
title="序号" render={(_text, _record, index: number) => (
|
||||
index + 1
|
||||
)} align="center" />
|
||||
<Column
|
||||
title="软著名称"
|
||||
dataIndex="goodsName"
|
||||
align="center"
|
||||
render={(text) => (
|
||||
<span style={{ color: '#1B8BD2', fontSize: '16px', fontWeight: '700' }}>{text}</span>
|
||||
)}
|
||||
/>
|
||||
{/* <Column
|
||||
title="软著简称"
|
||||
dataIndex="short"
|
||||
align="center"
|
||||
/> */}
|
||||
<Column
|
||||
title="软著证号"
|
||||
dataIndex="goodsNumber"
|
||||
align="center"
|
||||
// ellipsis
|
||||
/>
|
||||
<Column title="售价" dataIndex="goodsOpenPrice" align="center"
|
||||
render={(text) => (
|
||||
<span style={{ color: '#FF5D15', fontSize: '24px', fontWeight: '700' }}>{text}</span>
|
||||
)} />
|
||||
<Column title="软著版本" dataIndex="goodsVersion" align="center" />
|
||||
<Column title="软著取得时间" dataIndex="goodsGetTime" align="center" />
|
||||
<Column title="软著开发语言" dataIndex="goodsDevelop" align="center" />
|
||||
{/* <Column title="实名认证状态" dataIndex="address" key="key" /> */}
|
||||
<Column
|
||||
align="center"
|
||||
title="操作"
|
||||
render={(_text, record: any) => (
|
||||
<Space size="middle">
|
||||
<span className='copyrightG-goods-table-btn' onClick={() => {
|
||||
// console.log(record.goodsId);
|
||||
setGoodsId(record.goodsId)
|
||||
setGoodsDetailModal(true)
|
||||
}}>查看详情</span>
|
||||
</Space>
|
||||
)}
|
||||
/>
|
||||
</Table>
|
||||
|
||||
}}>预览</span>
|
||||
</Space>
|
||||
)}
|
||||
/>
|
||||
</Table>
|
||||
</div>
|
||||
{/* defaultCurrent: 默认当前页数 total:数据总数 defaultPageSize:'页面显示几条' */}
|
||||
<div className='product-release-pagination' >
|
||||
<Pagination
|
||||
showSizeChanger={false}
|
||||
defaultCurrent={page} total={20} defaultPageSize={10} onChange={(page) => {
|
||||
console.log(page)
|
||||
setPage(page)
|
||||
}} />
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
|
||||
</Spin>
|
||||
{/* defaultCurrent: 默认当前页数 total:数据总数 defaultPageSize:'页面显示几条' */}
|
||||
<div className='product-release-pagination' >
|
||||
<Pagination
|
||||
showSizeChanger={false}
|
||||
current={page} total={total} defaultPageSize={10} onChange={(page) => {
|
||||
console.log(page)
|
||||
setPage(page)
|
||||
}} />
|
||||
</div>
|
||||
</div>
|
||||
{/* )} */}
|
||||
<Modal
|
||||
title="著作权商品信息"
|
||||
okText="确认"
|
||||
cancelText="取消"
|
||||
destroyOnClose={true}
|
||||
footer={null}
|
||||
open={goodsDetailModal}
|
||||
// onOk={() => {
|
||||
// setOrderDetailModal(false)
|
||||
// }}
|
||||
onCancel={() => {
|
||||
setGoodsDetailModal(false)
|
||||
}}
|
||||
width={1250}
|
||||
centered
|
||||
|
||||
>
|
||||
商品详情{goodsId}
|
||||
<div className='goodsDetail'>
|
||||
<div className='goodsDetailImg'>
|
||||
<Image></Image>
|
||||
</div>
|
||||
<div className='goodsDetailInputBox'>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</Modal>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
.copyrightG-goods {
|
||||
margin-top: 18px;
|
||||
background-color: rgb(255, 255, 255);
|
||||
padding: 21px 19px 0px 26px;
|
||||
padding: 0px 19px 0px 19px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
|
||||
@ -1,189 +1,304 @@
|
||||
// import React from 'react'
|
||||
import './product-release.css'
|
||||
import {
|
||||
Select, DatePicker, Button,
|
||||
// Select, DatePicker, Button,
|
||||
// message,
|
||||
// Checkbox,
|
||||
Empty, Switch, Modal, Pagination
|
||||
Empty,
|
||||
// Switch,
|
||||
Modal, Pagination, Image,
|
||||
Spin
|
||||
} from 'antd';
|
||||
import { getGoodsList, submitAudit, putOnShelf, putOffShelf, deleteGoods } from '../../request/api'
|
||||
import { showImage } from '../../request/request'
|
||||
import EditModal from './components/EditModal/EditModal'
|
||||
import useMessage from "antd/es/message/useMessage";
|
||||
// import type { CheckboxProps } from 'antd';
|
||||
import {
|
||||
// SearchOutlined,
|
||||
ClearOutlined } from '@ant-design/icons';
|
||||
import type { DatePickerProps } from 'antd';
|
||||
import locale from 'antd/es/date-picker/locale/zh_CN';
|
||||
// import {
|
||||
// // SearchOutlined,
|
||||
// ClearOutlined
|
||||
// } from '@ant-design/icons';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
// import type { DatePickerProps } from 'antd';
|
||||
// import locale from 'antd/es/date-picker/locale/zh_CN';
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import dayjs, { } from 'dayjs';
|
||||
export default function ProductRelease() {
|
||||
const [messageApi, messageContext] = useMessage();
|
||||
const { state } = useLocation()
|
||||
// const dateFormat = 'YYYY年MM月DD日';
|
||||
const sellBelongType = state ? state.sellBelongType : ''; // 所属人类型
|
||||
const sellDate = state ? state.sellDate : ''; // 日期
|
||||
// const sellDate = state?dayjs(state.sellDate).format(dateFormat) : ''; // 日期
|
||||
const language = state ? state.language : ''; // 开发者语言
|
||||
const sellBoxtype = state ? state.sellBoxtype : ''; //软著类型
|
||||
const sellKeywords = state ? state.sellKeywords : ''; // 搜索关键字
|
||||
useEffect(() => {
|
||||
// console.log('sellBelongType', sellBelongType);
|
||||
// console.log('sellDate', sellDate);
|
||||
// console.log('language', language);
|
||||
// console.log('sellBoxtype', sellBoxtype);
|
||||
// console.log('sellKeywords', sellKeywords);
|
||||
// if (sellDate) {
|
||||
// console.log('sellDate', dayjs(sellDate).year());
|
||||
// }
|
||||
setPage(1)
|
||||
getGoodsDate(1)
|
||||
}, [state])
|
||||
const height = window.innerHeight - 180;
|
||||
// const [messageApi, contextHolder] = message.useMessage();
|
||||
const dateFormat = 'YYYY年MM月DD日';
|
||||
const [belongType, setBelongType] = useState<any>() // 所属人类型
|
||||
const [date, setDate] = useState<any>() // 日期
|
||||
const [language, setLanguage] = useState<any>() // 开发者语言
|
||||
const [type, setType] = useState<any>() //软著类型
|
||||
|
||||
// const [belongType, setBelongType] = useState<any>() // 所属人类型
|
||||
// const [date, setDate] = useState<any>() // 日期
|
||||
// const [language, setLanguage] = useState<any>() // 开发者语言
|
||||
// const [type, setType] = useState<any>() //软著类型
|
||||
const [page, setPage] = useState(1) // 分页
|
||||
const [total, setTotal] = useState(0) // 总条数
|
||||
const [editModalOpen, setEditModalOpen] = useState(false) // 控制编辑弹窗
|
||||
const [delModalOpen, setDelModalOpen] = useState(false) // 控制删除弹窗
|
||||
const [sellModalOpen, setSellModalOpen] = useState(false) // 控制出售弹窗
|
||||
|
||||
// 更改所属人类型
|
||||
const belongTypeChange = (value: string) => {
|
||||
console.log(`selected ${value}`);
|
||||
setBelongType(value)
|
||||
}
|
||||
// 更改日期
|
||||
const onChange: DatePickerProps['onChange'] = (date, dateString) => {
|
||||
console.log(date, dateString);
|
||||
setDate(date)
|
||||
// dayjs(formInfo.getFieldValue('projDevCompleteDate')).format(dateFormat),
|
||||
console.log('日期', dayjs(date).format(dateFormat));
|
||||
const [sellModalOpen, setSellModalOpen] = useState(false) // 控制上架弹窗
|
||||
const [offModalOpen, setOffModalOpen] = useState(false) // 控制下架弹窗
|
||||
const [id, setId] = useState<any>('') // 编辑id
|
||||
const [loading, setLoading] = useState(false) // 加载
|
||||
|
||||
|
||||
const [data, setData] = useState<any>([])
|
||||
// 点击编辑
|
||||
const edit = (item: any) => {
|
||||
// console.log(item.goodsId);
|
||||
setEditModalOpen(true)
|
||||
setId(item.goodsId)
|
||||
};
|
||||
// 选择开发者语言
|
||||
const selectLanguage = (value: string) => {
|
||||
setLanguage(value)
|
||||
}
|
||||
// 选择软著类型
|
||||
const selectType = (value: string) => {
|
||||
setType(value)
|
||||
}
|
||||
// 初始化搜索条件
|
||||
const init = () => {
|
||||
setBelongType(undefined)
|
||||
setDate(undefined)
|
||||
setLanguage(undefined)
|
||||
setType(undefined)
|
||||
}
|
||||
// 点击搜索
|
||||
// const searchKeyWords = () => {
|
||||
// setPage(1)
|
||||
// console.log(
|
||||
// // dayjs(date).format(dateFormat)
|
||||
// belongType, language, date, type
|
||||
// );
|
||||
// if (date) {
|
||||
// console.log(dayjs(date).format(dateFormat));
|
||||
// }
|
||||
// }
|
||||
// 删除id
|
||||
const [delId, setDelId] = useState('')
|
||||
// 删除商品名字
|
||||
const [delName, setDelName] = useState('')
|
||||
// 点击删除
|
||||
const del = (item: any) => {
|
||||
// console.log(item.order);
|
||||
setDelId(item.goodsId)
|
||||
setDelName(item.goodsName)
|
||||
setDelModalOpen(true)
|
||||
};
|
||||
// 点击确定删除
|
||||
const delOk = async () => {
|
||||
try {
|
||||
await deleteGoods(delId)
|
||||
// setData((prevData: any) => {
|
||||
// return prevData.filter((dataItem: any) => dataItem.goodsId !== delId)
|
||||
// })
|
||||
|
||||
// 点击清除
|
||||
const clearKeyWords = () => {
|
||||
init()
|
||||
setPage(1)
|
||||
// 重新获取数据
|
||||
}
|
||||
setDelModalOpen(false)
|
||||
messageApi.open({
|
||||
type: 'success',
|
||||
content: '删除成功',
|
||||
})
|
||||
getGoodsDate(page)
|
||||
|
||||
// 选框选择时触发事件
|
||||
// const checkChange = (e: any, item: any) => {
|
||||
// console.log(`checked = ${e.target.checked}`);
|
||||
// console.log(e);
|
||||
// if (e.target.checked == true) {
|
||||
// console.log(item.order);
|
||||
// }
|
||||
// };
|
||||
// 开关滑动触发
|
||||
const opneChange = (e: any, item: any) => {
|
||||
// 开启
|
||||
if (e) {
|
||||
console.log('开启', item.order);
|
||||
// 关闭
|
||||
} else {
|
||||
console.log('关闭', item.order);
|
||||
} catch (error: any) {
|
||||
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
// 下架id
|
||||
const [offId, setOffId] = useState('')
|
||||
// 下架商品名字
|
||||
const [offName, setOffName] = useState('')
|
||||
// 点击下架
|
||||
const off = (item: any) => {
|
||||
setOffId(item.goodsId)
|
||||
setOffName(item.goodsName)
|
||||
setOffModalOpen(true)
|
||||
};
|
||||
// 点击确定下架
|
||||
const offOk = async () => {
|
||||
try {
|
||||
await putOffShelf(offId)
|
||||
|
||||
setData((prevData: any) => {
|
||||
return prevData.map((dataItem: any) => {
|
||||
if (dataItem.goodsId === sellId) {
|
||||
return {
|
||||
...dataItem,
|
||||
goodsStatus: 0
|
||||
};
|
||||
}
|
||||
return dataItem;
|
||||
});
|
||||
|
||||
})
|
||||
setOffModalOpen(false)
|
||||
messageApi.open({
|
||||
type: 'success',
|
||||
content: '下架成功',
|
||||
})
|
||||
} catch (error: any) {
|
||||
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
// 上架id
|
||||
const [sellId, setSellId] = useState('')
|
||||
// 上架商品名字
|
||||
const [sellName, setSellName] = useState('')
|
||||
// 点击上架
|
||||
const sell = (item: any) => {
|
||||
setSellId(item.goodsId)
|
||||
setSellName(item.goodsName)
|
||||
setSellModalOpen(true)
|
||||
};
|
||||
// 点击确定上架
|
||||
const sellOk = async () => {
|
||||
try {
|
||||
await putOnShelf(sellId)
|
||||
setData((prevData: any) => {
|
||||
return prevData.map((dataItem: any) => {
|
||||
if (dataItem.goodsId === sellId) {
|
||||
return {
|
||||
...dataItem,
|
||||
goodsStatus: '1'
|
||||
};
|
||||
}
|
||||
return dataItem;
|
||||
});
|
||||
|
||||
})
|
||||
setSellModalOpen(false)
|
||||
messageApi.open({
|
||||
type: 'success',
|
||||
content: '上架成功',
|
||||
})
|
||||
} catch (error: any) {
|
||||
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 点击编辑
|
||||
const edit = (item: any) => {
|
||||
console.log(item.order);
|
||||
setEditModalOpen(true)
|
||||
const [submitModalOpen, setSubmitModalOpen] = useState(false) // 控制提交审核弹窗
|
||||
const [submitId, setSubmitId] = useState('') // 提交审核id
|
||||
const [submitName, setSubmitName] = useState('') // 提交审核名字
|
||||
// 点击提交审核
|
||||
const submit = async (item: any) => {
|
||||
// console.log(item);
|
||||
setSubmitName(item.goodsName)
|
||||
setSubmitId(item.goodsId)
|
||||
setSubmitModalOpen(true)
|
||||
};
|
||||
// 点击删除
|
||||
const del = (item: any) => {
|
||||
console.log(item.order);
|
||||
setDelModalOpen(true)
|
||||
};
|
||||
// 点击出售
|
||||
const sell = (item: any) => {
|
||||
console.log(item.order);
|
||||
setSellModalOpen(true)
|
||||
};
|
||||
// 点击提交
|
||||
const submit = (item: any) => {
|
||||
console.log(item.order);
|
||||
};
|
||||
const data: any = [
|
||||
{
|
||||
order: '122',
|
||||
time1: '2020-04-19 11:51:03',
|
||||
img: 'xxx',
|
||||
name: 'xxxx系统',
|
||||
v: '1-1-v',
|
||||
price: '5.00',
|
||||
time2: '2020-04-19 11:51:03',
|
||||
open: '0',
|
||||
status: '平台已审核',
|
||||
},
|
||||
{
|
||||
order: '123',
|
||||
time1: '2020-04-19 11:51:03',
|
||||
img: 'xxx',
|
||||
name: 'xxxx系统',
|
||||
v: '1-1-v',
|
||||
price: '5.00',
|
||||
time2: '2020-04-19 11:51:03',
|
||||
open: '1',
|
||||
status: '平台已审核',
|
||||
},
|
||||
{
|
||||
order: '124',
|
||||
time1: '2020-04-19 11:51:03',
|
||||
img: 'xxx',
|
||||
name: 'xxxx系统',
|
||||
v: '1-1-v',
|
||||
price: '5.00',
|
||||
time2: '2020-04-19 11:51:03',
|
||||
open: '0',
|
||||
status: '平台已审核',
|
||||
},
|
||||
{
|
||||
order: '125',
|
||||
time1: '2020-04-19 11:51:03',
|
||||
img: 'xxx',
|
||||
name: 'xxxx系统',
|
||||
v: '1-1-v',
|
||||
price: '5.00',
|
||||
time2: '2020-04-19 11:51:03',
|
||||
open: '0',
|
||||
status: '平台已审核',
|
||||
},
|
||||
{
|
||||
order: '126',
|
||||
time1: '2020-04-19 11:51:03',
|
||||
img: 'xxx',
|
||||
name: 'xxxx系统',
|
||||
v: '1-1-v',
|
||||
price: '5.00',
|
||||
time2: '2020-04-19 11:51:03',
|
||||
open: '0',
|
||||
status: '平台已审核',
|
||||
},
|
||||
// 点击确定提交
|
||||
const submitAuditOk = async () => {
|
||||
try {
|
||||
await submitAudit(submitId)
|
||||
setData((prevData: any) => {
|
||||
return prevData.map((dataItem: any) => {
|
||||
if (dataItem.goodsId === submitId) {
|
||||
return {
|
||||
...dataItem,
|
||||
goodsCheckStatus: 1
|
||||
};
|
||||
}
|
||||
return dataItem;
|
||||
});
|
||||
});
|
||||
setSubmitModalOpen(false)
|
||||
messageApi.open({
|
||||
type: 'success',
|
||||
content: '提交审核成功',
|
||||
})
|
||||
} catch (error: any) {
|
||||
|
||||
];
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
const getGoodsDate = async (page: number) => {
|
||||
try {
|
||||
setLoading(true)
|
||||
const res: any = await getGoodsList({
|
||||
page: page,
|
||||
rows: 10,
|
||||
// sellBelongType: sellBelongType,
|
||||
// sellDate: sellDate,
|
||||
// language: language,
|
||||
// sellBoxtype: sellBoxtype,
|
||||
// sellKeywords: sellKeywords,
|
||||
keywords: sellKeywords ? sellKeywords : '',
|
||||
goodsLeaderType: sellBelongType ? sellBelongType : '',
|
||||
goodsGetTime: sellDate ? dayjs(sellDate).year() : '',
|
||||
goodsDevelop: language ? language : '',
|
||||
goodsType: sellBoxtype ? sellBoxtype.join(',') : '',
|
||||
})
|
||||
|
||||
setPage(res.page)
|
||||
setData(res.rows)
|
||||
setTotal(res.total)
|
||||
setLoading(false)
|
||||
// console.log(res);
|
||||
if (res.rows.length <= 0) {
|
||||
if (page > 1) {
|
||||
setPage(page - 1)
|
||||
getGoodsDate(page - 1)
|
||||
}
|
||||
}
|
||||
} catch (error: any) {
|
||||
|
||||
if (error.response) {
|
||||
const data = error.response.data;
|
||||
messageApi.open({
|
||||
type: 'error',
|
||||
content: data.msg ? data.msg : `${data.path}(${data.status})`,
|
||||
});
|
||||
} else {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
|
||||
|
||||
}, [])
|
||||
getGoodsDate(page)
|
||||
}, [page])
|
||||
|
||||
|
||||
return (
|
||||
<div className='product-release' style={{ height: `${height}px`, overflow: 'auto' }}>
|
||||
{messageContext}
|
||||
{/* {contextHolder} */}
|
||||
<div className='product-release-search'>
|
||||
{/* <div className='product-release-search'>
|
||||
<Select
|
||||
// defaultValue="lucy"
|
||||
placeholder='请选择所属者类型'
|
||||
style={{ width: 198, height: 36, marginRight: 12 }}
|
||||
onChange={belongTypeChange}
|
||||
@ -200,7 +315,6 @@ export default function ProductRelease() {
|
||||
value={date}
|
||||
/>
|
||||
<Select
|
||||
// defaultValue="lucy"
|
||||
placeholder='请选择所开发者语言'
|
||||
style={{ width: 198, height: 36, marginRight: 12 }}
|
||||
onChange={selectLanguage}
|
||||
@ -211,7 +325,6 @@ export default function ProductRelease() {
|
||||
value={language}
|
||||
/>
|
||||
<Select
|
||||
// defaultValue="lucy"
|
||||
placeholder='请选择软著类型'
|
||||
style={{ width: 198, height: 36, marginRight: 12 }}
|
||||
onChange={selectType}
|
||||
@ -221,15 +334,6 @@ export default function ProductRelease() {
|
||||
]}
|
||||
value={type}
|
||||
/>
|
||||
{/* <Button type="primary"
|
||||
style={{
|
||||
height: 36,
|
||||
// backgroundColor: '#FF9F08'
|
||||
}}
|
||||
onClick={searchKeyWords}
|
||||
icon={<SearchOutlined />}>
|
||||
搜索
|
||||
</Button> */}
|
||||
<Button
|
||||
style={{
|
||||
height: 36,
|
||||
@ -241,97 +345,138 @@ export default function ProductRelease() {
|
||||
>
|
||||
清除
|
||||
</Button>
|
||||
</div>
|
||||
</div> */}
|
||||
<div>
|
||||
{/* 表格 */}
|
||||
<div className='product-release-table' style={{ height: `${height - 130}px` }}>
|
||||
{data.length == 0 ? (
|
||||
<div className='nodata' style={{ height: `${height - 93}px` }}>
|
||||
<Empty
|
||||
description={
|
||||
'暂无数据'
|
||||
} />
|
||||
</div>) : (
|
||||
<div style={{ height: `${height - 130}px`, overflow: 'auto', position: 'relative' }}>
|
||||
<table style={{ width: '100%', borderCollapse: 'collapse' }}>
|
||||
<thead >
|
||||
<tr style={{ background: '#F7F7F7', height: 32, fontSize: 14 }}>
|
||||
<th style={{ width: 50 }}>序号</th>
|
||||
<th style={{ width: 110 }}></th>
|
||||
<th>软著名称</th>
|
||||
<th>软著版本</th>
|
||||
<th>售卖价格</th>
|
||||
<th>截止售卖时间</th>
|
||||
<th>著作权上架</th>
|
||||
<th>平台审核</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody style={{ color: '#888888' }}>
|
||||
{data.map((item: any, index: any) => {
|
||||
return (
|
||||
<React.Fragment key={item.order}>
|
||||
<tr style={{ height: 15 }}>
|
||||
<td colSpan={9} style={{ border: 'none' }}>
|
||||
<div className='product-release-table' style={{ height: `${height - 80}px` }}>
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
<tr style={{ background: '#F7F7F7', height: 45 }}>
|
||||
<td colSpan={9}>
|
||||
{/* <Checkbox style={{ marginLeft: 16 }} onChange={
|
||||
(event) => checkChange(event, item)
|
||||
}></Checkbox> */}
|
||||
<span style={{ marginLeft: 55 }}>
|
||||
编号: {item.order}
|
||||
</span>
|
||||
<span style={{ marginLeft: 45 }}>
|
||||
软著取得时间: {item.time1}
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr style={{ textAlign: 'center', height: 110 }}>
|
||||
<td>{index + 1}</td>
|
||||
<td className='product-release-table-img-td'>
|
||||
<div className='product-release-table-img'>
|
||||
{item.img}
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div className='product-release-table-name'>
|
||||
{item.name}
|
||||
</div>
|
||||
<div>
|
||||
(接口软著)
|
||||
</div>
|
||||
</td>
|
||||
<td>{item.v}</td>
|
||||
<td style={{ fontSize: 24, color: '#FF5D15' }}>{item.price}</td>
|
||||
<td>{item.time2}</td>
|
||||
<td>
|
||||
<Switch checkedChildren="On" unCheckedChildren="Off" onChange={(e) => { opneChange(e, item) }} defaultChecked={item.open == 0 ? false : true} />
|
||||
</td>
|
||||
<td>{item.status}</td>
|
||||
<td>
|
||||
<span className='product-release-table-btn' onClick={() => {
|
||||
edit(item)
|
||||
}}>编辑</span>
|
||||
<span className='product-release-table-btn product-btn' onClick={() => del(item)}>删除</span>
|
||||
<span className='product-release-table-btn product-btn' onClick={() => sell(item)}>出售</span>
|
||||
<span className='product-release-table-btn product-btn' onClick={() => submit(item)}>提交审核</span>
|
||||
</td>
|
||||
</tr>
|
||||
</React.Fragment>
|
||||
<Spin tip="正在加载..." size="small" spinning={loading}>
|
||||
<div style={{ height: `${height - 80}px`, overflow: 'auto', position: 'relative' }}>
|
||||
{data.length <= 0 ? (
|
||||
<div className='nodata' style={{ height: `${height - 93}px` }}>
|
||||
<Empty
|
||||
description={
|
||||
'暂无数据'
|
||||
} />
|
||||
</div>) : (
|
||||
<table style={{ width: '100%', borderCollapse: 'collapse' }}>
|
||||
<thead >
|
||||
<tr style={{ background: '#F7F7F7', height: 32, fontSize: 14 }}>
|
||||
<th style={{ width: 50 }}>序号</th>
|
||||
<th style={{ width: 110 }}></th>
|
||||
<th>软著名称</th>
|
||||
<th>软著版本</th>
|
||||
<th>售卖价格</th>
|
||||
<th>截止售卖时间</th>
|
||||
{/* <th>著作权上架</th> */}
|
||||
<th>平台审核</th>
|
||||
<th>操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody style={{ color: '#888888' }}>
|
||||
{data.map((item: any, index: any) => {
|
||||
return (
|
||||
<React.Fragment key={item.goodsId}>
|
||||
<tr style={{ height: 15 }}>
|
||||
<td colSpan={9} style={{ border: 'none' }}>
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
<tr style={{ background: '#F7F7F7', height: 45 }}>
|
||||
<td colSpan={9}>
|
||||
{/* <Checkbox style={{ marginLeft: 16 }} onChange={
|
||||
(event) => checkChange(event, item)
|
||||
}></Checkbox> */}
|
||||
<span style={{ marginLeft: 55 }}>
|
||||
编号 : {item.goodsNumber}
|
||||
</span>
|
||||
<span style={{ marginLeft: 45 }}>
|
||||
软著取得时间 : {item.goodsGetTime}
|
||||
</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr style={{ textAlign: 'center', height: 110, maxWidth: 110 }}>
|
||||
<td>{index + 1}</td>
|
||||
<td className='product-release-table-img-td'>
|
||||
<div className='product-release-table-img'>
|
||||
<Image src={showImage(item.goodsPhoto, false)} height={90} preview={{
|
||||
mask: '查看', // 设置点击放大时显示的文字
|
||||
|
||||
}}></Image>
|
||||
</div>
|
||||
</td>
|
||||
<td className='product-release-table-name-td'>
|
||||
|
||||
{item.goodsName}
|
||||
{/* {item.goodsName}
|
||||
{item.goodsName}
|
||||
{item.goodsName}
|
||||
{item.goodsName}
|
||||
{item.goodsName} */}
|
||||
|
||||
{/* <div>
|
||||
(接口软著)
|
||||
</div> */}
|
||||
</td>
|
||||
<td>{item.goodsVersion}</td>
|
||||
<td style={{ fontSize: 24, color: '#FF5D15' }}>{item.goodsPrice}</td>
|
||||
<td>{item.goodsLastTime}</td>
|
||||
{/* <td>
|
||||
<Switch checkedChildren="On" unCheckedChildren="Off" onChange={(e) => { opneChange(e, item) }} defaultChecked={item.open == 0 ? false : true} />
|
||||
</td> */}
|
||||
|
||||
<td style={{
|
||||
fontWeight: 'bold',
|
||||
}}>
|
||||
{item.goodsCheckStatus == '0' ?
|
||||
<span style={{ color: 'red' }}> 未通过 </span>
|
||||
: item.goodsCheckStatus == '1' ?
|
||||
<span style={{ color: 'skyBlue' }}> 审核中 </span>
|
||||
: item.goodsCheckStatus == '2' ?
|
||||
<span style={{ color: 'green' }}> 已通过 </span>
|
||||
: '未提交'}</td>
|
||||
<td style={{
|
||||
width: 250,
|
||||
}}>
|
||||
<div>
|
||||
<span className='product-release-table-btn' onClick={() => {
|
||||
edit(item)
|
||||
}}>编辑</span>
|
||||
<span className='product-release-table-btn product-btn' style={{
|
||||
display: item.goodsCheckStatus == '1' || item.goodsCheckStatus == '2' ? 'none' : 'unset'
|
||||
}} onClick={() => submit(item)}>提交审核</span>
|
||||
<span className='product-release-table-btn product-btn ' style={{
|
||||
// 已经上架的不显示
|
||||
display: item.goodsStatus == 0 ? 'unset' : 'none'
|
||||
|
||||
}} onClick={() => del(item)}>删除</span>
|
||||
<span className='product-release-table-btn product-btn ' style={{
|
||||
display: item.goodsStatus == '0' && item.goodsCheckStatus == '2' ? 'unset' : 'none'
|
||||
}} onClick={() => sell(item)}>上架</span>
|
||||
<span className='product-release-table-btn product-btn '
|
||||
style={{
|
||||
display: item.goodsStatus == '0' ? 'none' : 'unset'
|
||||
}}
|
||||
onClick={() => off(item)}>下架</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</React.Fragment>
|
||||
|
||||
)
|
||||
})}
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
)
|
||||
}
|
||||
|
||||
)
|
||||
})}
|
||||
|
||||
</tbody>
|
||||
</table>
|
||||
{/* <div style={{ height: 10 }}></div> */}
|
||||
|
||||
</div>
|
||||
</Spin>
|
||||
|
||||
)}
|
||||
{/* )} */}
|
||||
|
||||
</div>
|
||||
|
||||
@ -340,7 +485,7 @@ export default function ProductRelease() {
|
||||
<div className='product-release-pagination'>
|
||||
<Pagination
|
||||
showSizeChanger={false}
|
||||
defaultCurrent={page} total={20} defaultPageSize={10} onChange={(page) => {
|
||||
current={page} total={total} defaultPageSize={10} onChange={(page) => {
|
||||
// console.log(page)
|
||||
setPage(page)
|
||||
}} />
|
||||
@ -356,10 +501,14 @@ export default function ProductRelease() {
|
||||
onCancel={() => {
|
||||
setEditModalOpen(false);
|
||||
}}
|
||||
centered
|
||||
>
|
||||
<div style={{ height: `${height - 20}px`, overflow: 'auto', borderTop: '1px solid #e8e8e8' }}>
|
||||
<EditModal closeModal={() => { setEditModalOpen(false) }} ></EditModal>
|
||||
</div>
|
||||
{/* <div style={{ height: `${height - 20}px`, overflow: 'auto', borderTop: '1px solid #e8e8e8' }}> */}
|
||||
<EditModal closeModal={() => { setEditModalOpen(false) }}
|
||||
getGoodsDate={getGoodsDate}
|
||||
id={id}
|
||||
></EditModal>
|
||||
{/* </div> */}
|
||||
</Modal>
|
||||
{/* 删除弹窗 */}
|
||||
<Modal title="删除"
|
||||
@ -368,7 +517,8 @@ export default function ProductRelease() {
|
||||
destroyOnClose={true}
|
||||
open={delModalOpen}
|
||||
onOk={() => {
|
||||
setDelModalOpen(false)
|
||||
// setDelModalOpen(false)
|
||||
delOk()
|
||||
}}
|
||||
onCancel={() => {
|
||||
setDelModalOpen(false)
|
||||
@ -384,17 +534,18 @@ export default function ProductRelease() {
|
||||
width: 700,
|
||||
marginTop: 20
|
||||
}}>
|
||||
删除后这条信息将不被保存，确定删除吗？
|
||||
删除后这条信息将不被保存，确定删除{delName}吗？
|
||||
</div>
|
||||
</Modal>
|
||||
{/* 出售弹窗 */}
|
||||
<Modal title="出售"
|
||||
<Modal title="上架"
|
||||
okText="确认"
|
||||
cancelText="取消"
|
||||
destroyOnClose={true}
|
||||
open={sellModalOpen}
|
||||
onOk={() => {
|
||||
setSellModalOpen(false)
|
||||
// setSellModalOpen(false)
|
||||
sellOk()
|
||||
}}
|
||||
onCancel={() => {
|
||||
setSellModalOpen(false)
|
||||
@ -410,7 +561,60 @@ export default function ProductRelease() {
|
||||
width: 700,
|
||||
marginTop: 20
|
||||
}}>
|
||||
确定出售接口管理系统的软件著作权证吗？
|
||||
确定将{sellName}上架吗？
|
||||
</div>
|
||||
</Modal>
|
||||
<Modal title="下架"
|
||||
okText="确认"
|
||||
cancelText="取消"
|
||||
destroyOnClose={true}
|
||||
open={offModalOpen}
|
||||
onOk={() => {
|
||||
// setSellModalOpen(false)
|
||||
offOk()
|
||||
}}
|
||||
onCancel={() => {
|
||||
setOffModalOpen(false)
|
||||
}}
|
||||
okButtonProps={{ style: { background: '#28915A', color: 'white' } }}
|
||||
style={{
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
height: `${height}px`,
|
||||
}}>
|
||||
<div style={{
|
||||
width: 700,
|
||||
marginTop: 20
|
||||
}}>
|
||||
确定将{offName}下架吗？
|
||||
</div>
|
||||
</Modal>
|
||||
<Modal title="提交审核"
|
||||
okText="确认"
|
||||
cancelText="取消"
|
||||
destroyOnClose={true}
|
||||
open={submitModalOpen}
|
||||
onOk={() => {
|
||||
submitAuditOk()
|
||||
|
||||
}}
|
||||
onCancel={() => {
|
||||
|
||||
setSubmitModalOpen(false)
|
||||
}}
|
||||
// okButtonProps={{ style: { background: 'red', color: 'white' } }}
|
||||
style={{
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
height: `${height}px`,
|
||||
}}>
|
||||
<div style={{
|
||||
width: 700,
|
||||
marginTop: 20
|
||||
}}>
|
||||
确定将{submitName}提交审核吗?
|
||||
</div>
|
||||
</Modal>
|
||||
</div>
|
||||
|
||||
@ -26,12 +26,14 @@
|
||||
|
||||
.editModal-img-box {
|
||||
width: 489px;
|
||||
height: 50px;
|
||||
height: 154px;
|
||||
background: #F8F8F8;
|
||||
border-radius: 5px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0 20px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.css-dev-only-do-not-override-1ae8k9u.ant-select-outlined.ant-select-multiple .ant-select-selection-item {
|
||||
@ -52,4 +54,4 @@
|
||||
border: 0;
|
||||
background: #E1E1E1;
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,8 +1,9 @@
|
||||
.product-release {
|
||||
margin-top: 18px;
|
||||
background-color: rgb(255, 255, 255);
|
||||
padding: 21px 19px 0px 26px;
|
||||
padding: 0px 19px 0px 19px;
|
||||
box-sizing: border-box;
|
||||
/* background: skyblue; */
|
||||
}
|
||||
|
||||
.product-release-table {
|
||||
@ -15,10 +16,10 @@
|
||||
}
|
||||
|
||||
.product-release-table-img {
|
||||
width: 74px;
|
||||
/* width: 74px;
|
||||
height: 74px;
|
||||
background: #F5F5F5;
|
||||
margin-left: 20px;
|
||||
margin-left: 20px; */
|
||||
}
|
||||
|
||||
.product-release-table table tbody td {
|
||||
@ -33,11 +34,20 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.product-release-table-name {
|
||||
.product-release-table-name-td {
|
||||
max-width: 130px;
|
||||
font-size: 16px;
|
||||
color: #1B8BD2;
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
/* .product-release-table-name {
|
||||
font-size: 16px;
|
||||
color: #1B8BD2;
|
||||
text-align: center ;
|
||||
|
||||
background-color: red;
|
||||
} */
|
||||
|
||||
.product-release-table-btn {
|
||||
cursor: pointer;
|
||||
@ -57,6 +67,7 @@
|
||||
right: 30px;
|
||||
width:calc(100vw - 280px); */
|
||||
background: rgb(255, 255, 255);
|
||||
/* background: pink; */
|
||||
z-index: 2;
|
||||
|
||||
}
|
||||
|
||||
@ -1,163 +1,88 @@
|
||||
import './trading-goods.css'
|
||||
import {
|
||||
Select, DatePicker, Button, Table,
|
||||
// Select, DatePicker, Button,
|
||||
Table,
|
||||
// message,
|
||||
Space, Empty, Pagination,
|
||||
Modal
|
||||
Space, Pagination,
|
||||
Modal,
|
||||
Spin
|
||||
} from 'antd';
|
||||
// import type { TableColumnsType } from 'antd';
|
||||
import { SearchOutlined, ClearOutlined } from '@ant-design/icons';
|
||||
import type { DatePickerProps } from 'antd';
|
||||
import locale from 'antd/es/date-picker/locale/zh_CN';
|
||||
import { useState } from 'react';
|
||||
// import { SearchOutlined, ClearOutlined } from '@ant-design/icons';
|
||||
// import type { DatePickerProps } from 'antd';
|
||||
// import locale from 'antd/es/date-picker/locale/zh_CN';
|
||||
import { getBuyOrderList } from '../../request/api'
|
||||
import { useState, useEffect } from 'react';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
import File from '../../components/OrderDetailModal/components/File/File'
|
||||
const { Column } = Table;
|
||||
import OrderDetail from '../../components/OrderDetailModal/OrderDetailModal'
|
||||
import dayjs, { } from 'dayjs';
|
||||
export default function TradingGoods() {
|
||||
const height = window.innerHeight - 180;
|
||||
// const [messageApi, contextHolder] = message.useMessage();
|
||||
const dateFormat = 'YYYY年MM月DD日';
|
||||
const [startTime, setStartTime] = useState<any>() //开始时间
|
||||
const [endTime, setEndTime] = useState<any>() //结束时间
|
||||
const [orderStatus, setOrderStatus] = useState<any>() //订单状态
|
||||
const dateFormat = 'YYYY-MM-DD';
|
||||
const [page, setPage] = useState(1) //分页
|
||||
const [total, setTotal] = useState(0) // 总条数
|
||||
const [orderDetailModal, setOrderDetailModal] = useState(false) //订单详情弹窗
|
||||
// 更改开始时间
|
||||
const startTimeChange: DatePickerProps['onChange'] = (date, dateString) => {
|
||||
console.log(date, dateString);
|
||||
setStartTime(date)
|
||||
};
|
||||
// 更改结束时间
|
||||
const endTimeChange: DatePickerProps['onChange'] = (date, dateString) => {
|
||||
console.log(date, dateString);
|
||||
setEndTime(date)
|
||||
};
|
||||
// 订单状态更改
|
||||
const orderStatusChange = (value: string) => {
|
||||
console.log(`selected ${value}`);
|
||||
setOrderStatus(value)
|
||||
const { state } = useLocation()
|
||||
const tradingKeywords = state ? state.tradingKeywords : ''
|
||||
const tradingStartTime = state ? state.tradingStartTime : ''
|
||||
const tradingEndTime = state ? state.tradingEndTime : ''
|
||||
const tradingStatus = state ? state.tradingStatus : ''
|
||||
const [orderId, setOrderId] = useState('') // 订单ID
|
||||
const [loading, setLoading] = useState(false) // 加载中
|
||||
const [fileModal, setFileModal] = useState(false) //补充资料弹窗
|
||||
const [data, setData] = useState<any[]>([]); // 表格数据
|
||||
|
||||
const getDataList = async (page: number) => {
|
||||
setLoading(true)
|
||||
const res: any = await getBuyOrderList({
|
||||
page: page,
|
||||
rows: 10,
|
||||
|
||||
})
|
||||
setLoading(false)
|
||||
// console.log(res.rows);
|
||||
setData(res.rows)
|
||||
// console.log(res.rows[0].goodsDTO.goodsName)
|
||||
setPage(res.page)
|
||||
setTotal(res.total)
|
||||
|
||||
}
|
||||
// 点击搜索
|
||||
const onSearch = () => {
|
||||
useEffect(() => {
|
||||
console.log('tradingKeywords', tradingKeywords);
|
||||
console.log('tradingStartTime', tradingStartTime);
|
||||
console.log('tradingEndTime', tradingEndTime);
|
||||
console.log('tradingStatus', tradingStatus);
|
||||
|
||||
|
||||
if (tradingStartTime) {
|
||||
console.log('tradingStartTime', dayjs(tradingStartTime).format(dateFormat));
|
||||
}
|
||||
getDataList(1)
|
||||
setPage(1)
|
||||
console.log(startTime, endTime, orderStatus);
|
||||
}
|
||||
// 初始化搜索条件
|
||||
const init = () => {
|
||||
setPage(1)
|
||||
setStartTime(undefined)
|
||||
setEndTime(undefined)
|
||||
setOrderStatus(undefined)
|
||||
}
|
||||
// 点击清除
|
||||
const clearKeyWords = () => {
|
||||
init()
|
||||
}
|
||||
interface DataType {
|
||||
index?: number
|
||||
order: string
|
||||
name: string
|
||||
price: string
|
||||
status: string
|
||||
time1: string
|
||||
time2: string
|
||||
}
|
||||
}, [state])
|
||||
|
||||
const data: DataType[] = [
|
||||
{
|
||||
|
||||
order: '123111111111',
|
||||
name: '后台管理系统',
|
||||
price: '5.00',
|
||||
status: '过户',
|
||||
time1: '2020-04-19 15:42:21',
|
||||
time2: '2020-04-19 15:42:21',
|
||||
},
|
||||
{
|
||||
|
||||
order: '12345',
|
||||
name: '后台管理系统',
|
||||
price: '5.00',
|
||||
status: '过户',
|
||||
time1: '2020-04-19 15:42:21',
|
||||
time2: '2020-04-19 15:42:21',
|
||||
},
|
||||
{
|
||||
order: '1235678',
|
||||
name: '后台管理系统',
|
||||
price: '5.00',
|
||||
status: '过户',
|
||||
time1: '2020-04-19 15:42:21',
|
||||
time2: '2020-04-19 15:42:21',
|
||||
},
|
||||
|
||||
];
|
||||
useEffect(() => {
|
||||
getDataList(page)
|
||||
// 获取数据
|
||||
}, [page])
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<div className='trading-goods' style={{ height: `${height}px`, overflow: 'hidden' }}>
|
||||
{/* {contextHolder} */}
|
||||
<div className='trading-goods-search'>
|
||||
<DatePicker placeholder="开始时间"
|
||||
style={{ width: 198, height: 36, marginRight: 12 }}
|
||||
format={dateFormat}
|
||||
locale={locale}
|
||||
onChange={startTimeChange}
|
||||
value={startTime}
|
||||
/>
|
||||
<DatePicker placeholder="结束时间"
|
||||
style={{ width: 198, height: 36, marginRight: 12 }}
|
||||
format={dateFormat}
|
||||
locale={locale}
|
||||
onChange={endTimeChange}
|
||||
value={endTime}
|
||||
/>
|
||||
<Select
|
||||
placeholder='选择订单状态'
|
||||
style={{ width: 198, height: 36, marginRight: 12 }}
|
||||
onChange={orderStatusChange}
|
||||
options={[
|
||||
{ value: 'xixi', label: '嘻嘻' },
|
||||
{ value: 'hehe', label: '呵呵' },
|
||||
]}
|
||||
value={orderStatus}
|
||||
/>
|
||||
<Button type="primary"
|
||||
style={{
|
||||
height: 36,
|
||||
// backgroundColor: '#FF9F08'
|
||||
}}
|
||||
|
||||
icon={<SearchOutlined />}
|
||||
onClick={onSearch}
|
||||
>
|
||||
搜索
|
||||
</Button>
|
||||
<Button
|
||||
style={{
|
||||
height: 36,
|
||||
marginLeft: 10,
|
||||
// backgroundColor: '#FF9F08'
|
||||
}}
|
||||
icon={<ClearOutlined />}
|
||||
onClick={clearKeyWords}
|
||||
>
|
||||
清除
|
||||
</Button>
|
||||
</div>
|
||||
<div className='trading-goods-table'>
|
||||
{/* 表格 */}
|
||||
{data.length == 0 ? (
|
||||
<div className='nodata' style={{ height: `${height - 93}px` }}>
|
||||
<Empty
|
||||
description={
|
||||
'暂无数据'
|
||||
} />
|
||||
</div>) : (
|
||||
<div>
|
||||
<div style={{ height: `${height - 130}px` }}>
|
||||
|
||||
<div>
|
||||
<Spin tip="正在加载..." size="small" spinning={loading}>
|
||||
<div style={{ height: `${height - 80}px` }}>
|
||||
|
||||
<Table
|
||||
scroll={{ y: `${height - 190}px` }}
|
||||
scroll={{ y: `${height - 150}px` }}
|
||||
dataSource={data}
|
||||
// pagination={{
|
||||
// defaultPageSize: 10, // 设置默认一页显示 5 条数据
|
||||
@ -165,44 +90,70 @@ export default function TradingGoods() {
|
||||
pagination={false} // 不显示分页
|
||||
style={{ textAlign: 'center' }} // 设置表格内容居中显示
|
||||
rowKey="order" // 指定数据项的唯一标识符
|
||||
locale={{ emptyText: '暂无数据' }}
|
||||
>
|
||||
<Column title="序号"
|
||||
fixed="left"
|
||||
width={70}
|
||||
render={(_text, _record, index: number) => (
|
||||
index + 1
|
||||
)} align="center" />
|
||||
<Column
|
||||
title="订单编号"
|
||||
dataIndex="order"
|
||||
dataIndex="orderNumber"
|
||||
align="center"
|
||||
width={210}
|
||||
fixed="left"
|
||||
/>
|
||||
<Column
|
||||
title="软著名称"
|
||||
dataIndex="name"
|
||||
dataIndex="goodsDTO"
|
||||
fixed="left"
|
||||
align="center"
|
||||
width={200}
|
||||
render={(text) => (
|
||||
<span style={{ color: '#1B8BD2', fontSize: '16px', fontWeight: '700' }}>{text}</span>
|
||||
<div style={{ color: '#1B8BD2', fontSize: '16px', fontWeight: '700', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }} title={text.goodsName}>{text.goodsName}</div>
|
||||
)}
|
||||
/>
|
||||
<Column title="订单价格" dataIndex="price" align="center"
|
||||
<Column title="订单价格" dataIndex="payMoney" align="center"
|
||||
width={110}
|
||||
render={(text) => (
|
||||
<span style={{ color: '#FF5D15', fontSize: '24px', fontWeight: '700' }}>{text}</span>
|
||||
)} />
|
||||
<Column title="订单状态" dataIndex="status" align="center" />
|
||||
<Column title="下单时间" dataIndex="time1" align="center" />
|
||||
<Column title="付款时间" dataIndex="time2" align="center" />
|
||||
<Column title="订单状态" dataIndex="orderStatus" align="center"
|
||||
width={120}
|
||||
render={(text) => (
|
||||
<div style={{
|
||||
fontWeight: '700',
|
||||
}}>
|
||||
<span style={{ display: text == '0' ? 'unset' : 'none' }}>订单已取消</span>
|
||||
<span style={{ display: text == '1' ? 'unset' : 'none' }}>买家待付款</span>
|
||||
<span style={{ display: text == '2' ? 'unset' : 'none' }}>待填写资料</span>
|
||||
<span style={{ display: text == '3' ? 'unset' : 'none' }}>过户进行中</span>
|
||||
<span style={{ display: text == '4' ? 'unset' : 'none' }}>过户已完成</span>
|
||||
<span style={{ display: text == '5' ? 'unset' : 'none' }}>买家已评价</span>
|
||||
<span style={{ display: text == '6' ? 'unset' : 'none' }}>发票已开具</span>
|
||||
</div>
|
||||
)} />
|
||||
<Column title="下单时间" dataIndex="createTime" align="center" width={160} />
|
||||
<Column title="付款时间" dataIndex="payTime" align="center" width={160} />
|
||||
{/* <Column title="实名认证状态" dataIndex="address" key="key" /> */}
|
||||
<Column
|
||||
align="center"
|
||||
title="操作"
|
||||
fixed="right"
|
||||
width={200}
|
||||
|
||||
render={(_text, record: any) => (
|
||||
<Space size="middle">
|
||||
<span className='trading-goods-table-btn' onClick={() => {
|
||||
console.log(record.order);
|
||||
|
||||
<span className='transaction-order-table-btn' onClick={() => {
|
||||
// console.log(record.orderId);
|
||||
setOrderId(record.orderId)
|
||||
setFileModal(true)
|
||||
}}>补充资料</span>
|
||||
<span className='trading-goods-table-btn' onClick={() => {
|
||||
console.log(record.order);
|
||||
// console.log(record.orderId);
|
||||
setOrderId(record.orderId)
|
||||
setOrderDetailModal(true)
|
||||
}}>
|
||||
订单详情
|
||||
@ -211,18 +162,20 @@ export default function TradingGoods() {
|
||||
)}
|
||||
/>
|
||||
</Table>
|
||||
|
||||
</div>
|
||||
{/* defaultCurrent: 默认当前页数 total:数据总数 defaultPageSize:'页面显示几条' */}
|
||||
<div className='product-release-pagination' >
|
||||
<Pagination
|
||||
showSizeChanger={false}
|
||||
defaultCurrent={page} total={20} defaultPageSize={10} onChange={(page) => {
|
||||
console.log(page)
|
||||
setPage(page)
|
||||
}} />
|
||||
</div>
|
||||
</Spin>
|
||||
{/* defaultCurrent: 默认当前页数 total:数据总数 defaultPageSize:'页面显示几条' */}
|
||||
<div className='product-release-pagination' >
|
||||
<Pagination
|
||||
showSizeChanger={false}
|
||||
current={page} total={total} defaultPageSize={10} onChange={(page) => {
|
||||
console.log(page)
|
||||
setPage(page)
|
||||
}} />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<Modal
|
||||
title="订单详情"
|
||||
@ -244,7 +197,25 @@ export default function TradingGoods() {
|
||||
justifyContent: 'center',
|
||||
height: `${height}px`,
|
||||
}}>
|
||||
<OrderDetail></OrderDetail>
|
||||
<OrderDetail orderId={orderId} user={'buy'}></OrderDetail>
|
||||
</Modal>
|
||||
<Modal
|
||||
title="补充资料"
|
||||
okText="确认"
|
||||
cancelText="取消"
|
||||
destroyOnClose={true}
|
||||
footer={null}
|
||||
open={fileModal}
|
||||
// onOk={() => {
|
||||
// setOrderDetailModal(false)
|
||||
// }}
|
||||
onCancel={() => {
|
||||
setFileModal(false)
|
||||
}}
|
||||
width={1150}
|
||||
centered
|
||||
>
|
||||
<File user={'buy'} orderId={orderId}></File>
|
||||
</Modal>
|
||||
</div>
|
||||
)
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
.trading-goods {
|
||||
margin-top: 18px;
|
||||
background-color: rgb(255, 255, 255);
|
||||
padding: 21px 19px 21px 26px;
|
||||
padding: 0px 19px 0px 19px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.trading-goods-table{
|
||||
|
||||
@ -1,270 +1,176 @@
|
||||
// import React from 'react'
|
||||
import './transaction-order.css'
|
||||
import {
|
||||
Select, DatePicker, Button, Table,
|
||||
// Select, DatePicker, Button,
|
||||
Table,
|
||||
// message,
|
||||
Space, Empty, Pagination, Modal
|
||||
Space, Pagination, Modal,
|
||||
Spin
|
||||
} from 'antd';
|
||||
import dayjs, { } from 'dayjs';
|
||||
import { getSellOrderList } from '../../request/api'
|
||||
import File from '../../components/OrderDetailModal/components/File/File'
|
||||
// import type { TableColumnsType } from 'antd';
|
||||
import { SearchOutlined, ClearOutlined } from '@ant-design/icons';
|
||||
import type { DatePickerProps } from 'antd';
|
||||
import locale from 'antd/es/date-picker/locale/zh_CN';
|
||||
// import { SearchOutlined, ClearOutlined } from '@ant-design/icons';
|
||||
// import type { DatePickerProps } from 'antd';
|
||||
// import locale from 'antd/es/date-picker/locale/zh_CN';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useLocation } from 'react-router-dom';
|
||||
const { Column } = Table;
|
||||
import OrderDetail from '../../components/OrderDetailModal/OrderDetailModal'
|
||||
export default function TransactionOrder() {
|
||||
const height = window.innerHeight - 180;
|
||||
// const [messageApi, contextHolder] = message.useMessage();
|
||||
const dateFormat = 'YYYY年MM月DD日';
|
||||
const [startTime, setStartTime] = useState<any>(undefined) // 开始时间
|
||||
const [endTime, setEndTime] = useState<any>(undefined) // 结束时间
|
||||
const [orderStatus, setOrderStatus] = useState<any>(undefined) // 订单状态
|
||||
const dateFormat = 'YYYY-MM-DD';
|
||||
const [loading, setLoading] = useState(false) // 加载中
|
||||
// const [startTime, setStartTime] = useState<any>(undefined) // 开始时间
|
||||
// const [endTime, setEndTime] = useState<any>(undefined) // 结束时间
|
||||
// const [orderStatus, setOrderStatus] = useState<any>(undefined) // 订单状态
|
||||
const [page, setPage] = useState(1) //分页
|
||||
const [total, setTotal] = useState(0) // 总条数
|
||||
const [orderDetailModal, setOrderDetailModal] = useState(false) //订单详情弹窗
|
||||
// 更改开始时间
|
||||
const stratTimeChange: DatePickerProps['onChange'] = (date, dateString) => {
|
||||
console.log(date, dateString);
|
||||
setStartTime(date)
|
||||
};
|
||||
// 更改结束时间
|
||||
const endTimeChange: DatePickerProps['onChange'] = (date, dateString) => {
|
||||
console.log(date, dateString);
|
||||
setEndTime(date)
|
||||
};
|
||||
// 更改订单状态
|
||||
const orderStatusChange = (value: string) => {
|
||||
console.log(`selected ${value}`);
|
||||
setOrderStatus(value)
|
||||
}
|
||||
// 初始化搜索条件
|
||||
const init = () => {
|
||||
setStartTime(undefined)
|
||||
setEndTime(undefined)
|
||||
setOrderStatus(undefined)
|
||||
}
|
||||
// 点击清除
|
||||
const clearKeyWords = () => {
|
||||
setPage(1)
|
||||
init()
|
||||
}
|
||||
// 点击搜索
|
||||
const onSearch = () => {
|
||||
setPage(1)
|
||||
console.log(orderStatus, startTime, endTime);
|
||||
if (startTime) {
|
||||
console.log('开始时间', dayjs(startTime).format(dateFormat));
|
||||
}
|
||||
}
|
||||
interface DataType {
|
||||
index?: number
|
||||
order: string
|
||||
name: string
|
||||
price: string
|
||||
status: string
|
||||
time1: string
|
||||
time2: string
|
||||
}
|
||||
|
||||
const data: DataType[] = [
|
||||
{
|
||||
|
||||
order: '456789',
|
||||
name: 'xx系统',
|
||||
price: '5.00',
|
||||
status: '过户',
|
||||
time1: '2020-04-19 15：42:21',
|
||||
time2: '2020-04-19 15：42:21 ',
|
||||
},
|
||||
{
|
||||
|
||||
order: '12646498484',
|
||||
name: 'xxxxxxxxxxxxx系统',
|
||||
price: '5.00',
|
||||
status: '过户',
|
||||
time1: '2020-04-19 15：42:21',
|
||||
time2: '2020-04-19 15：42:21 ',
|
||||
},
|
||||
{
|
||||
order: '9444984894',
|
||||
name: 'xx系统',
|
||||
price: '5.00',
|
||||
status: '过户',
|
||||
time1: '2020-04-19 15：42:21',
|
||||
time2: '2020-04-19 15：42:21 ',
|
||||
},
|
||||
{
|
||||
order: '94449848941',
|
||||
name: 'xx系统',
|
||||
price: '5.00',
|
||||
status: '过户',
|
||||
time1: '2020-04-19 15：42:21',
|
||||
time2: '2020-04-19 15：42:21 ',
|
||||
},
|
||||
{
|
||||
order: '94449848942',
|
||||
name: 'xx系统',
|
||||
price: '5.00',
|
||||
status: '过户',
|
||||
time1: '2020-04-19 15：42:21',
|
||||
time2: '2020-04-19 15：42:21 ',
|
||||
},
|
||||
{
|
||||
order: '94449848943',
|
||||
name: 'xx系统',
|
||||
price: '5.00',
|
||||
status: '过户',
|
||||
time1: '2020-04-19 15：42:21',
|
||||
time2: '2020-04-19 15：42:21 ',
|
||||
},
|
||||
{
|
||||
order: '94449848944',
|
||||
name: 'xx系统',
|
||||
price: '5.00',
|
||||
status: '过户',
|
||||
time1: '2020-04-19 15：42:21',
|
||||
time2: '2020-04-19 15：42:21 ',
|
||||
},
|
||||
{
|
||||
order: '94449848945',
|
||||
name: 'xx系统',
|
||||
price: '5.00',
|
||||
status: '过户',
|
||||
time1: '2020-04-19 15：42:21',
|
||||
time2: '2020-04-19 15：42:21 ',
|
||||
},
|
||||
{
|
||||
order: '94449848946',
|
||||
name: 'xx系统',
|
||||
price: '5.00',
|
||||
status: '过户',
|
||||
time1: '2020-04-19 15：42:21',
|
||||
time2: '2020-04-19 15：42:21 ',
|
||||
},
|
||||
{
|
||||
order: '94449848947',
|
||||
name: 'xx系统',
|
||||
price: '5.00',
|
||||
status: '过户',
|
||||
time1: '2020-04-19 15：42:21',
|
||||
time2: '2020-04-19 15：42:21 ',
|
||||
},
|
||||
|
||||
|
||||
];
|
||||
|
||||
const [fileModal, setFileModal] = useState(false) //补充资料
|
||||
const { state } = useLocation()
|
||||
const sellStatrtTime = state ? state.sellStatrtTime : ''; // 开始时间
|
||||
const sellEndTime = state ? state.sellEndTime : ''; // 结束时间
|
||||
const sellOrderStatus = state ? state.sellOrderStatus : ''; // 订单状态
|
||||
const sellOrderKeywords = state ? state.sellOrderKeywords : ''; // 订单关键字
|
||||
const [orderId, setOrderId] = useState('') // 订单ID
|
||||
useEffect(() => {
|
||||
|
||||
getDataList(1)
|
||||
setPage(1)
|
||||
}, [state])
|
||||
|
||||
interface DataType {
|
||||
index: number
|
||||
orderNumber: string
|
||||
goodsDTO: {
|
||||
goodsName: string
|
||||
},
|
||||
payMoney: number
|
||||
orderStatus: string
|
||||
createTime: string
|
||||
payTime: string
|
||||
orderId: string
|
||||
}
|
||||
|
||||
|
||||
const [data, setData] = useState<DataType[]>([]); // 表格数据
|
||||
const getDataList = async (page: number) => {
|
||||
setLoading(true)
|
||||
const res: any = await getSellOrderList({
|
||||
page: page,
|
||||
rows: 10,
|
||||
keywords: sellOrderKeywords ? sellOrderKeywords : '', // 关键字
|
||||
startTime: sellStatrtTime ? dayjs(sellStatrtTime).format(dateFormat) : '', // 开始时间
|
||||
endTime: sellEndTime ? dayjs(sellEndTime).format(dateFormat) : '', // 结束时间
|
||||
orderStatus: sellOrderStatus ? sellOrderStatus : '' // 订单状态
|
||||
})
|
||||
setLoading(false)
|
||||
// console.log(res.rows);
|
||||
setData(res.rows)
|
||||
// console.log(res.rows[0].goodsDTO.goodsName)
|
||||
setPage(res.page)
|
||||
setTotal(res.total)
|
||||
|
||||
}
|
||||
useEffect(() => {
|
||||
getDataList(page)
|
||||
// 获取数据
|
||||
}, [])
|
||||
}, [page])
|
||||
|
||||
return (
|
||||
<div className='transaction-order' style={{ height: `${height}px`, overflow: 'hidden' }}>
|
||||
{/* {contextHolder} */}
|
||||
<div className='transaction-order-search'>
|
||||
<DatePicker placeholder="开始时间"
|
||||
style={{ width: 198, height: 36, marginRight: 12 }}
|
||||
format={dateFormat}
|
||||
locale={locale}
|
||||
onChange={stratTimeChange}
|
||||
value={startTime}
|
||||
/>
|
||||
<DatePicker placeholder="结束时间"
|
||||
style={{ width: 198, height: 36, marginRight: 12 }}
|
||||
format={dateFormat}
|
||||
locale={locale}
|
||||
onChange={endTimeChange}
|
||||
value={endTime}
|
||||
|
||||
/>
|
||||
<Select
|
||||
// defaultValue="lucy"
|
||||
placeholder='选择订单状态'
|
||||
style={{ width: 198, height: 36, marginRight: 12 }}
|
||||
onChange={orderStatusChange}
|
||||
options={[
|
||||
{ value: 'person', label: '过户' },
|
||||
{ value: 'lucy', label: '未过户' },
|
||||
]}
|
||||
value={orderStatus}
|
||||
/>
|
||||
<Button type="primary"
|
||||
style={{
|
||||
height: 36,
|
||||
// backgroundColor: '#FF9F08'
|
||||
}}
|
||||
onClick={onSearch}
|
||||
icon={<SearchOutlined />}>
|
||||
搜索
|
||||
</Button>
|
||||
<Button
|
||||
style={{
|
||||
height: 36,
|
||||
marginLeft: 10,
|
||||
// backgroundColor: '#FF9F08'
|
||||
}}
|
||||
icon={<ClearOutlined />}
|
||||
onClick={clearKeyWords}
|
||||
>
|
||||
清除
|
||||
</Button>
|
||||
</div>
|
||||
<div className='transaction-order-table'>
|
||||
{/* 表格 */}
|
||||
{data.length == 0 ? (<div className='nodata' style={{ height: `${height - 93}px` }}>
|
||||
{/* {data.length <= 0 ? (<div className='nodata' style={{ height: `${height - 93}px` }}>
|
||||
<Empty
|
||||
description={
|
||||
'暂无数据'
|
||||
} />
|
||||
</div>) : (
|
||||
<div>
|
||||
<div style={{ height: `${height - 130}px` }}>
|
||||
</div>) : ( */}
|
||||
<div>
|
||||
<Spin tip="正在加载..." size="small" spinning={loading}>
|
||||
<div style={{ height: `${height - 80}px` }}>
|
||||
|
||||
<Table
|
||||
scroll={{ y: `${height - 190}px` }}
|
||||
bordered
|
||||
scroll={{ y: `${height - 150}px` }}
|
||||
// rowSelection={{
|
||||
// type: 'checkbox',
|
||||
// }}
|
||||
dataSource={data}
|
||||
pagination={false} // 不显示分页
|
||||
style={{ textAlign: 'center' }} // 设置表格内容居中显示
|
||||
rowKey="order" // 指定数据项的唯一标识符
|
||||
rowKey="orderId" // 指定数据项的唯一标识符
|
||||
// columns={column}
|
||||
locale={{ emptyText: '暂无数据' }}
|
||||
>
|
||||
<Column title="序号"
|
||||
fixed="left"
|
||||
width={70}
|
||||
render={(_text, _record, index: number) => (
|
||||
index + 1
|
||||
)} align="center" />
|
||||
<Column
|
||||
title="订单编号"
|
||||
dataIndex="order"
|
||||
dataIndex="orderNumber"
|
||||
align="center"
|
||||
width={210}
|
||||
fixed="left"
|
||||
/>
|
||||
<Column
|
||||
title="软著名称"
|
||||
dataIndex="name"
|
||||
dataIndex="goodsDTO"
|
||||
fixed="left"
|
||||
align="center"
|
||||
width={200}
|
||||
render={(text) => (
|
||||
<span style={{ color: '#1B8BD2', fontSize: '16px', fontWeight: '700' }}>{text}</span>
|
||||
<div style={{ color: '#1B8BD2', fontSize: '16px', fontWeight: '700', overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }} title={text.goodsName}>{text.goodsName}</div>
|
||||
)}
|
||||
/>
|
||||
<Column title="订单价格" dataIndex="price" align="center"
|
||||
<Column title="订单价格" dataIndex="payMoney" align="center"
|
||||
width={110}
|
||||
render={(text) => (
|
||||
<span style={{ color: '#FF5D15', fontSize: '24px', fontWeight: '700' }}>{text}</span>
|
||||
)} />
|
||||
<Column title="订单状态" dataIndex="status" align="center" />
|
||||
<Column title="下单时间" dataIndex="time1" align="center" />
|
||||
<Column title="付款时间" dataIndex="time2" align="center" />
|
||||
<Column title="订单状态" dataIndex="orderStatus" align="center"
|
||||
width={120}
|
||||
render={(text) => (
|
||||
<div style={{
|
||||
fontWeight: '700',
|
||||
}}>
|
||||
<span style={{ display: text == '0' ? 'unset' : 'none' }}>订单已取消</span>
|
||||
<span style={{ display: text == '1' ? 'unset' : 'none' }}>买家待付款</span>
|
||||
<span style={{ display: text == '2' ? 'unset' : 'none' }}>待填写资料</span>
|
||||
<span style={{ display: text == '3' ? 'unset' : 'none' }}>过户进行中</span>
|
||||
<span style={{ display: text == '4' ? 'unset' : 'none' }}>过户已完成</span>
|
||||
<span style={{ display: text == '5' ? 'unset' : 'none' }}>买家已评价</span>
|
||||
<span style={{ display: text == '6' ? 'unset' : 'none' }}>发票已开具</span>
|
||||
</div>
|
||||
)} />
|
||||
<Column title="下单时间" dataIndex="createTime" align="center" width={160} />
|
||||
<Column title="付款时间" dataIndex="payTime" align="center" width={160} />
|
||||
{/* <Column title="实名认证状态" dataIndex="address" key="key" /> */}
|
||||
<Column
|
||||
align="center"
|
||||
title="操作"
|
||||
fixed="right"
|
||||
width={200}
|
||||
|
||||
render={(_text, record: any) => (
|
||||
<Space size="middle">
|
||||
<span className='transaction-order-table-btn' onClick={() => {
|
||||
console.log(record.order);
|
||||
|
||||
// console.log(record.orderId);
|
||||
setOrderId(record.orderId)
|
||||
setFileModal(true)
|
||||
}}>补充资料</span>
|
||||
<span className='trading-goods-table-btn' onClick={() => {
|
||||
console.log(record.order);
|
||||
// console.log(record.orderId);
|
||||
setOrderId(record.orderId)
|
||||
setOrderDetailModal(true)
|
||||
}}>
|
||||
订单详情
|
||||
@ -273,18 +179,20 @@ export default function TransactionOrder() {
|
||||
)}
|
||||
/>
|
||||
</Table>
|
||||
|
||||
</div>
|
||||
{/* defaultCurrent: 默认当前页数 total:数据总数 defaultPageSize:'页面显示几条' */}
|
||||
<div className='product-release-pagination' >
|
||||
<Pagination
|
||||
showSizeChanger={false}
|
||||
defaultCurrent={page} total={20} defaultPageSize={10} onChange={(page) => {
|
||||
console.log(page)
|
||||
setPage(page)
|
||||
}} />
|
||||
</div>
|
||||
</Spin>
|
||||
{/* defaultCurrent: 默认当前页数 total:数据总数 defaultPageSize:'页面显示几条' */}
|
||||
<div className='product-release-pagination' >
|
||||
<Pagination
|
||||
showSizeChanger={false}
|
||||
current={page} total={total} defaultPageSize={10} onChange={(page) => {
|
||||
console.log(page)
|
||||
setPage(page)
|
||||
}} />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
{/* )} */}
|
||||
|
||||
|
||||
|
||||
@ -302,14 +210,34 @@ export default function TransactionOrder() {
|
||||
onCancel={() => {
|
||||
setOrderDetailModal(false)
|
||||
}}
|
||||
|
||||
style={{
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
height: `${height}px`,
|
||||
}}>
|
||||
<OrderDetail></OrderDetail>
|
||||
width={1250}
|
||||
centered
|
||||
// style={{
|
||||
// display: 'flex',
|
||||
// alignItems: 'center',
|
||||
// justifyContent: 'center',
|
||||
// height: `${height}px`,
|
||||
// }}
|
||||
>
|
||||
<OrderDetail orderId={orderId} user={'sell'}></OrderDetail>
|
||||
</Modal>
|
||||
<Modal
|
||||
title="补充资料"
|
||||
okText="确认"
|
||||
cancelText="取消"
|
||||
destroyOnClose={true}
|
||||
footer={null}
|
||||
open={fileModal}
|
||||
// onOk={() => {
|
||||
// setOrderDetailModal(false)
|
||||
// }}
|
||||
onCancel={() => {
|
||||
setFileModal(false)
|
||||
}}
|
||||
width={1150}
|
||||
centered
|
||||
>
|
||||
<File user={'sell'} orderId={orderId}></File>
|
||||
</Modal>
|
||||
</div>
|
||||
)
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
.transaction-order {
|
||||
margin-top: 18px;
|
||||
background-color: rgb(255, 255, 255);
|
||||
padding: 21px 19px 21px 26px;
|
||||
padding: 0px 19px 0px 19px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.transaction-order-table{
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1,15 +1,17 @@
|
||||
.clearIcon{
|
||||
background-color:#c7c7c7 ;
|
||||
.clearIcon {
|
||||
background-color: #c7c7c7;
|
||||
}
|
||||
.clearIcon:hover{
|
||||
background-color:#868686 ;
|
||||
|
||||
.clearIcon:hover {
|
||||
background-color: #868686;
|
||||
}
|
||||
|
||||
@media (min-width: 1671px) {
|
||||
.mediaBox{
|
||||
.mediaBox {
|
||||
height: 15px;
|
||||
width: 230px;
|
||||
}
|
||||
|
||||
|
||||
.index {
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
@ -24,7 +26,7 @@
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 999;
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
@ -271,10 +273,11 @@
|
||||
}
|
||||
|
||||
@media (max-width: 1670px) {
|
||||
.mediaBox{
|
||||
.mediaBox {
|
||||
height: 15px;
|
||||
width: 230px;
|
||||
}
|
||||
|
||||
.index {
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
@ -535,10 +538,11 @@
|
||||
}
|
||||
|
||||
@media (max-width: 1550px) {
|
||||
.mediaBox{
|
||||
.mediaBox {
|
||||
height: 15px;
|
||||
width: 150px;
|
||||
}
|
||||
|
||||
.index {
|
||||
height: 100vh;
|
||||
display: flex;
|
||||
@ -682,8 +686,8 @@
|
||||
.belongpeopleName {
|
||||
color: #313131;
|
||||
width: 230px;
|
||||
/* 修改 */
|
||||
width: 190px;
|
||||
/* 修改 */
|
||||
width: 190px;
|
||||
height: 40px;
|
||||
text-align: left;
|
||||
font-size: 16px;
|
||||
@ -762,9 +766,10 @@
|
||||
display: none;
|
||||
}
|
||||
|
||||
.mediaSearch{
|
||||
.mediaSearch {
|
||||
margin-left: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.nowPosition {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -819,5 +824,9 @@
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.css-dev-only-do-not-override-11lehqq.ant-select-multiple .ant-select-selection-overflow {
|
||||
/* width: 100px!important; */
|
||||
flex-wrap: noWrap !important;
|
||||
text-overflow: ellipsis !important;
|
||||
overflow: hidden !important;
|
||||
}
|
||||
BIN
src/static/ruanzhu.jpg
Normal file
BIN
src/static/ruanzhu.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.5 MiB |
@ -16,7 +16,7 @@ export const WebSocketBaseUrl: string = 'ws://192.168.0.15:7025/copyright';
|
||||
// export const WebSocketBaseUrl: string = '/copyright';
|
||||
|
||||
export const DevUserId: string = '80d3365e-0597-4988-979e-18ef1c3ec671'; // 18634604067
|
||||
// export const DevUserId: string = 'eb9a82a6-6ed3-4ba0-90e6-d836cefff915'; // 15042810561 密码123456
|
||||
// export const DevUserId: string = '6fb8e783-243c-4eec-8d98-c9b1c8aeaa00'; // 15042810561 密码123456
|
||||
// export const DevUserId: string = 'c2438eb8-2685-49a9-bf02-5111a5192d96'; // 18647109157
|
||||
// export const DevUserId: string = '';
|
||||
// export const DevUserId = localStorage.getItem('userId')? localStorage.getItem('userId') : '';
|
||||
@ -119,7 +119,7 @@ export function get<T>(req: Req<T>) {
|
||||
req.onFinally?.();
|
||||
})
|
||||
}
|
||||
// 优惠券规则
|
||||
// 优惠券规则.
|
||||
export function getCouponUrl() {
|
||||
axios.get("https://www.aimzhu.com/operator/app/agreementportal/getrelease/89c4ca41-a44e-4ae2-bad3-6fa6536dd453")
|
||||
.then((data:any) => {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user