system-copyright-react/src/route/AppElectron/AppEdit.tsx
2025-05-29 17:02:18 +08:00

444 lines
18 KiB
TypeScript

import { useState, useEffect } from 'react'
import EditAppInfo from './components/EditAppInfo/EditAppInfo';
// import EditAppDes from './components/EditAppDes/EditAppDes';
import EditAppFiles from './components/EditAppFiles/EditAppFiles';
// import EditAppFunction from './components/EditAppFunction/EditAppFunction';
// import EditBelongPeople from './components/EditBelongPeople/EditBelongPeople';
import AppInfo from './components/AppInfo/AppInfo';
import AppCompany from './components/AppCompany/AppCompany';
import { useParams } from 'react-router-dom'
import {
runSystemList, bigClassList,
// twoClass,
// fileDetail
} from '../../request/api'
// import { showImage } from '../../request/request'
import './app-edit.css'
import {
RightOutlined
} from '@ant-design/icons';
import {
message,
Spin,
} from 'antd';
import { appOrderDetail } from '../../request/api'
export default function AppEdit() {
const [messageApi, contextHolder] = message.useMessage();
const pathParams = useParams();
const appOrderId = pathParams.appOrderId;
const [systemList, setSystemList] = useState<any[]>([]); // 运行系统选项
const [bigClass, setBigClass] = useState<any[]>([]); // 软件分类(大类)选项
// const [smallClass, setSmallClass] = useState<any[]>([]); // 软件分类(小类)选项
// 获取运行系统选项
const getRunSystemList = async () => {
try {
const res: any = await runSystemList();
// console.log('运行系统选项', res.map((item: any) => {
// return {
// label: item.dataName,
// value: item.dataName,
// }
// }));
setSystemList(res.map((item: any) => {
return {
label: item.dataName,
value: item.dataName,
}
}))
} 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 getBigClassList = async () => {
try {
const res: any = await bigClassList();
// console.log('大类选项', res.map((item: any) => {
// return {
// label: item.dataName,
// value: item.dataId,
// }
// }));
setBigClass(res.map((item: any) => {
return {
label: item.dataName,
value: item.dataId,
}
}))
} 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 getSmallClassList = async (id: string) => {
// try {
// const res: any = await twoClass(id);
// console.log('小类', res);
// setSmallClass(res.map((item: any) => {
// return {
// label: item.dataId,
// value: item.dataName,
// }
// }))
// } 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 [loading, setLoading] = useState(false);
const [editProcess, setEditProcess] = useState(1);
// 企业/机构认证
const [companyInfo, setCompanyInfo] = useState<any>({
companyName: '', // 企业名称
companyNumber: '', // 企业统一社会信用代码
companyPhoto: '', // 企业照片
companyAuth: '',//授权书
});
const [checkStatus, setCheckStatus] = useState<any>('') //审核状态
// 软件基本信息
const [appInfo, setAppInfo] = useState<any>({
appName: '', // 项目名称
subName: '', // 软件简称
versionName: '', // 版本号
packageName: '', // 包名APPID
systemName: '', // 运行系统
bigClassify: '', // 软件分类(大类)
// bigClassifyName: '',
subClassify: '', // 软件分类(小类)
// subClassifyName: '',
developWay: '', // 开发方式
completeTime: '', // 开发完成时期
projOwnerName: '',//著作权人姓名
projOwnerIdentity: '',//著作权人证件号
projOwnerId: '',//著作权人信息ID
getFile: '',//获取文件
})
// 材料信息
const [filesInfo, setFilesInfo] = useState<any>({
sourceCodeDocFile: '',//源码
softwareDocFile: '',//软件
})
const [checkRemark, setCheckRemark] = useState('') //未通过原因
// 文件想想请
// const [fileList, setFileList] = useState<any[]>([]);
// 获取详情
const getAppOrderDetail = async () => {
try {
setLoading(true)
const res: any = await appOrderDetail(appOrderId);
// console.log('详情', res);
setCompanyInfo({
companyName: res.companyName, // 企业名称
companyNumber: res.companyNumber, // 企业统一社会信用代码
companyPhoto: res.companyPhoto, // 企业照片
companyAuth: res.companyAuth,//授权书
})
setAppInfo({
appName: res.appName, // 项目名称
subName: res.subName, // 软件简称
versionName: res.versionName, // 版本号
packageName: res.packageName, // 包名APPID
systemName: res.systemName, // 运行系统
bigClassify: res.bigClassify, // 软件分类(大类)
subClassify: res.subClassify, // 软件分类(小类)
developWay: res.developWay, // 开发方式
completeTime: res.completeTime, // 开发完成时期
projOwnerName: res.projOwnerName,//著作权人姓名
projOwnerIdentity: res.projOwnerIdentity,//著作权人证件号
projOwnerId: res.projOwnerId,//著作权人信息ID
getFile: res.getFile,//获取文件
// bigClassifyName: res.bigClassifyName,
// subClassifyName: res.subClassifyName,
})
setFilesInfo({
sourceCodeDocFile: res.sourceCodeDocFile,//源码
softwareDocFile: res.softwareDocFile,//软件
})
setEditProcess(Number(res.appOrderProgress) + 1)
setCheckStatus(res.checkStatus)
setCheckRemark(res.checkRemark)
// const fileres: any = await fileDetail(res.getFile)
// console.log('文件详情', fileres);
// setFileList([
// {
// uid: fileres[0].fileId,
// name: fileres[0].fileName,
// status: 'done',
// url: showImage(fileres[0].fileId)
// }
// ])
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)
}
} finally {
setLoading(false)
}
}
// 进度
// 获取详情
useEffect(() => {
getAppOrderDetail()
//获取进度
// setEditProcess(1)
getRunSystemList()
getBigClassList()
// if (appInfo.bigClassify) {
// getSmallClassList(appInfo.bigClassify)
// }
}, []);
const height = window.innerHeight - 180;
return (
<Spin tip="加载中..." size="small" spinning={loading}>
<div className='appEdit' style={{ height: `${height}px`, overflow: 'auto' }}>
{contextHolder}
<div className='editProcessBox'>
<div className='editProcess' >
<div className='editProcessNum'
style={{
background: editProcess >= 1 ? '#3B60E8' : '',
color: editProcess >= 1 ? '#fff' : '#B1B1B1',
borderColor: editProcess >= 1 ? '' : '#B1B1B1'
}}
>1</div>
<div className='editProcessTitle'
style={{
color: editProcess >= 1 ? '#353535' : '#878787',
fontWeight: editProcess >= 1 ? 'bold' : 'normal'
}}
>/</div>
</div>
<div className='editright'><RightOutlined /></div>
<div className='editProcess'>
<div className='editProcessNum' style={{
background: editProcess >= 2 ? '#3B60E8' : '',
color: editProcess >= 2 ? '#fff' : '#B1B1B1',
borderColor: editProcess >= 2 ? '' : '#B1B1B1'
}}>2</div>
<div className='editProcessTitle'
style={{
color: editProcess >= 2 ? '#353535' : '#878787',
fontWeight: editProcess >= 2 ? 'bold' : 'normal'
}}
></div>
</div>
<div className='editright'><RightOutlined /></div>
<div className='editProcess'>
<div className='editProcessNum' style={{
background: editProcess >= 3 ? '#3B60E8' : '',
color: editProcess >= 3 ? '#fff' : '#B1B1B1',
borderColor: editProcess >= 3 ? '' : '#B1B1B1'
}}>3</div>
<div className='editProcessTitle'
style={{
color: editProcess >= 3 ? '#353535' : '#878787',
fontWeight: editProcess >= 3 ? 'bold' : 'normal'
}}
></div>
</div>
<div className='editright'><RightOutlined /></div>
<div className='editProcess'>
<div className='editProcessNum' style={{
background: editProcess >= 4 ? '#3B60E8' : '',
color: editProcess >= 4 ? '#fff' : '#B1B1B1',
borderColor: editProcess >= 4 ? '' : '#B1B1B1'
}}>4</div>
<div className='editProcessTitle'
style={{
color: editProcess >= 4 ? '#353535' : '#878787',
fontWeight: editProcess >= 4 ? 'bold' : 'normal'
}}
>
{/* 功能特点 */}
</div>
</div>
{/* <div className='editright'><RightOutlined /></div>
<div className='editProcess'>
<div className='editProcessNum' style={{
background: editProcess >= 5 ? '#3B60E8' : '',
color: editProcess >= 5 ? '#fff' : '#B1B1B1',
borderColor: editProcess >= 5 ? '' : '#B1B1B1'
}}>5</div>
<div className='editProcessTitle'
style={{
color: editProcess >= 5 ? '#353535' : '#878787',
fontWeight: editProcess >= 5 ? 'bold' : 'normal'
}}
>著作权人</div>
</div>
<div className='editright'><RightOutlined /></div>
<div className='editProcess'>
<div className='editProcessNum' style={{
background: editProcess >= 6 ? '#3B60E8' : '',
color: editProcess >= 6 ? '#fff' : '#B1B1B1',
borderColor: editProcess >= 6 ? '' : '#B1B1B1'
}}>6</div>
<div className='editProcessTitle'
style={{
color: editProcess >= 6 ? '#353535' : '#878787',
fontWeight: editProcess >= 6 ? 'bold' : 'normal'
}}
>填报完成</div>
</div> */}
</div>
<div className='editFormBox'>
<div style={{
display: editProcess == 1 ? 'block' : 'none'
}}>
<AppCompany
appOrderId={appOrderId}
companyInfo={companyInfo}
setCompanyInfo={
(val: any) => {
setCompanyInfo(val)
}
}
setEditProcess={
(num: number) => {
setEditProcess(num)
}
}></AppCompany>
{/* <EditAppInfo setEditProcess={
(num: number) => {
setEditProcess(num)
}
}></EditAppInfo> */}
</div>
<div style={{
display: editProcess == 2 ? 'block' : 'none'
}}>
<EditAppInfo
appOrderId={appOrderId}
bigClass={bigClass}
systemList={systemList}
// smallClass={smallClass}
// fileList={fileList}
appInfo={appInfo}
setAppInfo={
(val: any) => {
setAppInfo(val)
}
}
setEditProcess={
(num: number) => {
setEditProcess(num)
}
}></EditAppInfo>
{/* <EditAppDes setEditProcess={
(num: number) => {
setEditProcess(num)
}
}></EditAppDes> */}
</div>
<div style={{
display: editProcess == 3 ? 'block' : 'none'
}}>
<EditAppFiles
appOrderId={appOrderId}
filesInfo={filesInfo}
setFilesInfo={
(val: any) => {
setFilesInfo(val)
}
}
setEditProcess={
(num: number) => {
setEditProcess(num)
}
}></EditAppFiles>
</div>
<div style={{
display: editProcess == 4 ? 'block' : 'none'
}}>
{/* <EditAppFunction setEditProcess={
(num: number) => {
setEditProcess(num)
}
}></EditAppFunction> */}
<AppInfo
checkStatus={checkStatus}
setCheckStatus={(value:string)=>{
setCheckStatus(value)
}}
appOrderId={appOrderId}
companyInfo={companyInfo}
appInfo={appInfo}
filesInfo={filesInfo}
setEditProcess={
(num: number) => {
setEditProcess(num)
}
}
checkRemark={checkRemark}
></AppInfo>
</div>
{/* <div style={{
display: editProcess == 5 ? 'block' : 'none'
}}>
<EditBelongPeople setEditProcess={
(num: number) => {
setEditProcess(num)
}
}></EditBelongPeople>
</div>
<div style={{
display: editProcess == 6 ? 'block' : 'none'
}}>
<AppInfo setEditProcess={
(num: number) => {
setEditProcess(num)
}
}></AppInfo>
</div> */}
</div>
</div>
</Spin>
)
}