// import './proj-edit-step.css'; import { Radio, Cascader, Col, message, Modal, Row, Spin, Table, Space, Select } from "antd"; import { FolderAddOutlined } from '@ant-design/icons'; // import locale from 'antd/es/date-picker/locale/zh_CN'; // import { useParams } from "react-router-dom"; import { useEffect, useState } from "react"; // import { get, put, post, del, downloadUrl } from "../../../util/AjaxUtils.ts"; import { get, put, post, del, // downloadUrl } from "../../util/AjaxUtils.ts"; import { Button, Form, Input } from 'antd'; import { AxiosResponse } from "axios"; import // dayjs, { Dayjs } from 'dayjs'; import type { SearchProps } from 'antd/es/input/Search'; // import type { TableColumnsType } from 'antd'; import { ITree } from "../../interfaces/dict/IDict.ts"; const { Search } = Input; const { Column } = Table; // 基本信息文件类型 type FieldType = { projSubName: string; projVersion: string; projDevCompleteDate: Dayjs; companyName: string; companyNameEn: string; projName: string }; // 所属人信息类型 type BelongPeopleType = { authorName: string; authorIdCardType: string; authorIdCard: string; authorNation: string; authorProvince: string; authorEstablishDate: Dayjs; authorType: string; nameEn: string; isCrcAccount: string; crcAccountPassword: string; crcAccountUsername: string; } // interface DataType { // key: React.Key; // name: string; // age: number; // address: string; // select: boolean; // } interface Option { value?: string | number | null; label: React.ReactNode; children?: Option[]; isLeaf?: boolean; id: string; pId: string; } type propsInfo = { setBelongPeopleInfo?: any belongPeopleInfo?: any setValue?: any isShow?: boolean closeModal?: any }; export default function BelongPeople(props: propsInfo) { // const nav = useNavigate(); // const pathParams = useParams(); const [messageApi, contextHolder] = message.useMessage(); const [formInfo] = Form.useForm(); const [formBelong] = Form.useForm(); const [isLoading, setIsLoading] = useState(false) const [loading] = useState(false); // const [isEditModalOpen, setIsEditModalOpen] = useState(false); const [isNewBelongOpen, setIsNewBelongOpen] = useState(false) const height = window.innerHeight - 200; // const dateFormat = 'YYYY年MM月DD日'; // 点击查看是否显示账号密码 const [checkCrcAccountShow, setCheckCrcAccountShow] = useState('') // 页面显示的所属者信息 const [authorName, setauthorName] = useState('') //所属人姓名 const [authorIdCardType, setauthorIdCardType] = useState('') //所属人证件类型 const [authorIdCard, setauthorIdCard] = useState('') //所属人证件号 const [authorType, setauthorType] = useState('') //所属人类型 const [authorProvinceCity, setauthorProvinceCity] = useState('') //所属人省市 const [authorCrcAccount, setauthorCrcAccount] = useState(0) //是否给账号 0 给 1 不给 // const [authorCrcAccountPassword, setauthorCrcAccountPassword] = useState('') //密码 // const [authorCrcAccountUsername, setauthorCrcAccountUsername] = useState('') //账号 // // 从基本信息中获取到的两个表格默认选择的id 所属者id 联系人id const [authorId, setAuthorId] = useState('') //所属人id // 设置所属者more你选中的行 // const [selectedRowKeys, setSelectedRowKeys] = useState([]); // 所属者搜索关键字 const [keywords, setKeyWords] = useState('') const [type, setType] = useState('') // 表格第几行数据 // const [clom, setClom] = useState('') // 著作人搜索 const belongPeopleSearch: SearchProps['onSearch'] = (value, _e, info) => ( console.log(info?.source, value), setKeyWords(value), getSearchProjOwnerList(value, type) ); // 是否点击了确定 // 表格相关 // rowSelection object indicates the need for row selection // 所属者表格选择触发 const belongRowSelection = { // selectedRowKeys: React.Key[] onChange: (selectedRowKeys: React.Key[], selectedRows: BelongDataType[]) => { console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows); setauthorName(selectedRows[0].name) setauthorIdCardType(selectedRows[0].idCardType) setauthorIdCard(selectedRows[0].idCardNo) setauthorType(selectedRows[0].type) setauthorProvinceCity(selectedRows[0].provinceCity) setauthorCrcAccount(selectedRows[0].isCrcAccount) // setauthorCrcAccountPassword(selectedRows[0].crcAccountPassword) // setauthorCrcAccountUsername(selectedRows[0].crcAccountUsername) setAuthorId(selectedRows[0].projOwnerId) // setClom(String(selectedRowKeys)) // setbelongselectedKeys(selectedRowKeys) // props.setBelongPeopleName(selectedRows[0].name) // props.setBelongPeopleInfo({ // authorName: selectedRows[0].name, // authorType: selectedRows[0].type, // authorIdCardType: selectedRows[0].idCardType, // authorIdCard: selectedRows[0].idCardNo, // authorCrcAccount: selectedRows[0].isCrcAccount, // authorId: selectedRows[0].projOwnerId, // authorProvinceCity: selectedRows[0].provinceCity // }) // props.setValue(selectedRows[0].name) }, }; // 所属人表格数据 const [tableBelongData, setTableBelongData] = useState([]) // const selectedKeys = data.filter(item => item.select).map(item => item.key); // console.log('selectedKeys:', selectedKeys); // 是否提供中国版账号 // 所属者id 关键字 const [projOwnerId, setProjOwnerId] = useState('') // 所属者弹窗数据 const [belongTitle, setbelongTitle] = useState('') const [areaArray, setAreaArray] = useState([]); const listArea = (pId: string) => { return new Promise((resolve) => { get({ messageApi, url: '/api/area/list-area-ztree', config: { params: { id: pId } }, onSuccess({ data }) { resolve(data); } }) }) } const handleOk = () => { // console.log(belongShow); // setBelongShow('') formBelong.validateFields().then(() => { // 如果验证通过,则执行确认操作 // 这里可以放置你的确认操作逻辑 if (belongTitle === '编辑所属者') { upProjOwner() } if (belongTitle === '创建所属者') { newProjOwner() } // 关闭 弹窗 // setIsNewBelongOpen(false) // 初始化数据 formBelong.resetFields(); // 重置表单字段为初始值 }).catch(() => { // 如果验证不通过,可以根据需要处理错误信息 // (errorInfo); }); belongRowSelection // getProjOwnerList() // getSearchProjOwnerList(keywords, type) }; // const [belongselectedKeys,setbelongselectedKeys] = useState(tableBelongData.filter(item => item.projOwnerId === authorId).map(item => item.projOwnerId)); // 获取页面基本信息信息 // const getEditstep = () => { // get({ // messageApi, // url: `/api/proj/get/edit-step2/${pathParams.projId}`, // onSuccess({ data }: AxiosResponse) { // // 获取默认所属人信息 // setauthorName(data.authorName) // setauthorIdCardType(data.authorIdCardType) // setauthorIdCard(data.authorIdCard) // setauthorType(data.authorType) // setauthorProvinceCity(data.authorProvinceCity) // setauthorCrcAccount(data.authorCrcAccount) // setauthorCrcAccountPassword(data.authorCrcAccountPassword) // setauthorCrcAccountUsername(data.authorCrcAccountUsername) // setAuthorId(data.authorId) // console.log('基本信息', data); // formInfo.setFieldsValue({ // projName: data.projName, // projSubName: data.projSubName, // projVersion: data.projVersion, // projDevCompleteDate: data.projDevCompleteDate ? dayjs(data.projDevCompleteDate, 'YYYY-MM-DD') : '', // companyName: data.companyName, // companyNameEn: data.companyNameEn, // }) // } // }) // } // 获取所属者表格 const getProjOwnerList = () => { get({ messageApi, url: `/api/proj-owner/list/self`, onBefore() { setIsLoading(true); }, onSuccess({ data }: AxiosResponse) { console.log('所属者表格', data); setTableBelongData(data) // const selectBelongArray = data.filter(item => item.name === authorName) // console.log('嘻嘻',selectBelongArray); // setSelectedRowKeys(selectBelongArray) }, onFinally() { setIsLoading(false); } }) } // 获取所属表格 带搜索 const getSearchProjOwnerList = (keywords: any, type: any) => { get({ messageApi, url: `/api/proj-owner/list/self?keywords=${keywords}&type=${type}`, onBefore() { setIsLoading(true); }, onSuccess({ data }: AxiosResponse) { console.log('搜索所属者表格', data); setTableBelongData(data) }, onFinally() { setIsLoading(false); } }) } const [belongShow, setBelongShow] = useState('ORGANIZATION') // 编辑所属者 const upProjOwner = () => { const crcAccountPassword = Number(formBelong.getFieldValue('isCrcAccount')) == 1 ? formBelong.getFieldValue('crcAccountPassword') : '' const crcAccountUsername = Number(formBelong.getFieldValue('isCrcAccount')) == 1 ? formBelong.getFieldValue('crcAccountUsername') : '' put({ messageApi, url: `/api/proj-owner/update/${projOwnerId}`, body: { crcAccountPassword: crcAccountPassword, crcAccountUsername: crcAccountUsername, idCardNo: formBelong.getFieldValue('authorIdCard'), // idCardType: formBelong.getFieldValue('authorIdCardType'), idCardType: belongShow == 'PERSONAL' ? 'ID_CARD' : 'BUSINESS_LICENSE', isCrcAccount: Number(formBelong.getFieldValue('isCrcAccount')), name: formBelong.getFieldValue('authorName'), nameEn: formBelong.getFieldValue('nameEn') || '', provinceCity: formBelong.getFieldValue('authorProvince').join(','), type: formBelong.getFieldValue('authorType'), }, onBefore() { }, onSuccess() { // console.log(data); // alert('编辑成功') messageApi.open({ type: 'success', content: '编辑成功' }) // getProjOwnerList() getSearchProjOwnerList(keywords, type) setIsNewBelongOpen(false) }, onFinally() { } }) } // 创建所属者 const newProjOwner = () => { const crcAccountPassword = Number(formBelong.getFieldValue('isCrcAccount')) == 1 ? formBelong.getFieldValue('crcAccountPassword') : '' const crcAccountUsername = Number(formBelong.getFieldValue('isCrcAccount')) == 1 ? formBelong.getFieldValue('crcAccountUsername') : '' post({ messageApi, url: '/api/proj-owner/save', body: { crcAccountPassword: crcAccountPassword, crcAccountUsername: crcAccountUsername, idCardNo: formBelong.getFieldValue('authorIdCard'), // idCardType: formBelong.getFieldValue('authorIdCardType'), idCardType: belongShow == 'PERSONAL' ? 'ID_CARD' : 'BUSINESS_LICENSE', isCrcAccount: Number(formBelong.getFieldValue('isCrcAccount')), name: formBelong.getFieldValue('authorName'), nameEn: formBelong.getFieldValue('nameEn'), provinceCity: formBelong.getFieldValue('authorProvince').join(','), type: formBelong.getFieldValue('authorType'), }, onBefore() { }, onSuccess() { messageApi.success('提交成功') getProjOwnerList() // getSearchProjOwnerList(keywords, type) setIsNewBelongOpen(false) }, onFinally() { } }) } const typeChange = (data: any) => { // console.log(data.target.value); setBelongShow(data.target.value) } const [CrcAccountShow, setCrcAccountShow] = useState('0') const isCrcAccountChange = (data: any) => { // console.log(data.target.value); setCrcAccountShow(data.target.value) } useEffect(() => { // getEditstep() getProjOwnerList() listArea('0').then(data => { console.log('省市1', data); // data.slice(0, 2).map const options: Option[] = data.map(item => { return { value: item.name, label: item.name, isLeaf: !item.isParent, id: item.id, pId: item.pId } }) setAreaArray(options); // console.log('省市2', options); }); }, []) return ( <>
{contextHolder} {/* 首页}, {title: 创建项目}, {title: {nav(-1)}}>编辑项目}, {title: '基本信息'}, ]} /> */}
根据《中国版权登记业务平台软件登记》相关要求,申请人需要再国版权登记业务平台注册并通过实名制认证。 { window.open('https://www.aimzhu.com/Rnsystem.html') }} style={{ color: '#FDB33E' }}>了解实名制认证流程
{ console.log(`selected ${value}`); alert(`selected ${value}`) }} options={[ { value: 'code1', label: '全部状态' }, { value: 'code2', label: '嘿嘿' }, { value: 'code3', label: '嘻嘻' }, ]} defaultValue="code1" />
*/}
{authorName ? (<>
当前所属者:
请选择所属者
{authorName}/{authorType == 'PERSONAL' ? '自然人' : '企业-组织'}/{authorIdCardType == 'ID_CARD' ? '身份证' : '营业执照'}/{authorIdCard}
) : (<>
当前所属者:
请选择所属者
{props.belongPeopleInfo.authorName}/{props.belongPeopleInfo.authorType == 'PERSONAL' ? '自然人' : '企业-组织'}/{props.belongPeopleInfo.authorIdCardType == 'ID_CARD' ? '身份证' : '营业执照'}/{props.belongPeopleInfo.authorIdCard}
)}
{/* 表格 */} {props.isShow ? ( ( record.type === 'PERSONAL' ? '自然人' : '企业/组织' )} /> ( record.idCardType === 'ID_CARD' ? '身份证' : '营业执照' )} /> {/* */} ( { // alert(record.projOwnerId); console.log('text:', text); console.log('record:', record); setProjOwnerId(record.projOwnerId) setbelongTitle('编辑所属者') setBelongShow(record.type) setIsNewBelongOpen(true) // 发起请求给formBelong 表单赋值 setCrcAccountShow(record.isCrcAccount == 1 ? '1' : '0') // 查看账号密码是否显示 formBelong.setFieldsValue({ // 公司名 authorName: record.name, // 公司英文名 nameEn: record.nameEn, // 证件类型 authorIdCardType: record.idCardType ? record.idCardType : 'BUSINESS_LICENSE', // 证件号 authorIdCard: record.idCardNo, // 国籍 // authorNation: '中国', // 地区 authorProvince: record.provinceCity ? record.provinceCity.split(',') : '', // 成立日期 // authorEstablishDate: record.gmtCreate ? dayjs(record.gmtCreate, 'YYYY-MM-DD') : '', // 是否提供平台账号 isCrcAccount: record.isCrcAccount == 1 ? '1' : '0', // 个人/企业 authorType: record.type, // 密码 crcAccountPassword: record.crcAccountPassword, // 账号 crcAccountUsername: record.crcAccountUsername }) }}>编辑 | { // alert(record.projOwnerId); del({ messageApi, url: `/api/proj-owner/remove/${record.projOwnerId}`, onSuccess() { messageApi.success('删除成功'); // getProjOwnerList() getSearchProjOwnerList(keywords, type) } }) }}>删除 | { setbelongTitle('查看所属者') setIsNewBelongOpen(true) // 发起请求给formBelong 表单赋值 formBelong.setFieldsValue({ // 公司名 authorName: record.name, // 公司英文名 nameEn: record.nameEn, // 证件类型 authorIdCardType: record.idCardType ? record.idCardType : 'BUSINESS_LICENSE', // 证件号 authorIdCard: record.idCardNo, // 国籍 // authorNation: '中国', // 地区 authorProvince: record.provinceCity ? record.provinceCity.split(',') : '', // 成立日期 // authorEstablishDate: record.gmtCreate ? dayjs(record.gmtCreate, 'YYYY-MM-DD') : '', // 是否提供平台账号 isCrcAccount: record.isCrcAccount == 1 ? '1' : '0', // 个人/企业 authorType: record.type, // 密码 crcAccountPassword: record.crcAccountPassword, // 账号 crcAccountUsername: record.crcAccountUsername }) // 查看是否显示账号密码 setCheckCrcAccountShow(record.isCrcAccount == 1 ? '1' : '0') }}>查看 )} />
) : ( ( record.type === 'PERSONAL' ? '自然人' : '企业/组织' )} /> ( record.idCardType === 'ID_CARD' ? '身份证' : '营业执照' )} /> {/* */} ( { // alert(record.projOwnerId); console.log('text:', text); console.log('record:', record); setProjOwnerId(record.projOwnerId) setbelongTitle('编辑所属者') setBelongShow(record.type) setIsNewBelongOpen(true) // 发起请求给formBelong 表单赋值 setCrcAccountShow(record.isCrcAccount == 1 ? '1' : '0') formBelong.setFieldsValue({ // 公司名 authorName: record.name, // 公司英文名 nameEn: record.nameEn, // 证件类型 authorIdCardType: record.idCardType ? record.idCardType : 'BUSINESS_LICENSE', // 证件号 authorIdCard: record.idCardNo, // 国籍 // authorNation: '中国', // 地区 authorProvince: record.provinceCity ? record.provinceCity.split(',') : '', // 成立日期 // authorEstablishDate: record.gmtCreate ? dayjs(record.gmtCreate, 'YYYY-MM-DD') : '', // 是否提供平台账号 isCrcAccount: record.isCrcAccount == 1 ? '1' : '0', // 个人/企业 authorType: record.type, // 密码 crcAccountPassword: record.crcAccountPassword, // 账号 crcAccountUsername: record.crcAccountUsername }) }}>编辑 | { // alert(record.projOwnerId); del({ messageApi, url: `/api/proj-owner/remove/${record.projOwnerId}`, onSuccess() { messageApi.success('删除成功'); // getProjOwnerList() getSearchProjOwnerList(keywords, type) } }) }}>删除 | { setbelongTitle('查看所属者') setIsNewBelongOpen(true) // 发起请求给formBelong 表单赋值 formBelong.setFieldsValue({ // 公司名 authorName: record.name, // 公司英文名 nameEn: record.nameEn, // 证件类型 authorIdCardType: record.idCardType ? record.idCardType : 'BUSINESS_LICENSE', // 证件号 authorIdCard: record.idCardNo, // 国籍 // authorNation: '中国', // 地区 authorProvince: record.provinceCity ? record.provinceCity.split(',') : '', // 成立日期 // authorEstablishDate: record.gmtCreate ? dayjs(record.gmtCreate, 'YYYY-MM-DD') : '', // 是否提供平台账号 isCrcAccount: record.isCrcAccount == 1 ? '1' : '0', // 个人/企业 authorType: record.type, // 密码 crcAccountPassword: record.crcAccountPassword, // 账号 crcAccountUsername: record.crcAccountUsername }) setCheckCrcAccountShow(record.isCrcAccount == 1 ? '1' : '0') }}>查看 )} />
)}
{/* 选择创建/编辑/查看所属者弹框 */} { // }} onOk={ handleOk } width={1280} // 确认按钮样式 okButtonProps={{ size: 'large', style: { display: belongTitle == '查看所属者' ? 'none' : 'block' } }} // 返回按钮样式 cancelButtonProps={{ size: 'large' }} onCancel={() => { setIsNewBelongOpen(false) // getProjOwnerList() getSearchProjOwnerList(keywords, type) // setBelongShow('') }} >
{belongTitle}
{ // setIsNewBelongOpen(true); }} autoComplete="off" >
请选择知识产权所属者类型:
企业/组织 自然人
{/* lyp */} {/* {if(formBelong.getFieldValue('authorType')=='ORGANIZATION'){ return( ) }else{ return }} */} {belongShow == '' ? <> : <>
{/*
姓名或公司名称:
*/}
{belongShow == 'PERSONAL' ? '姓名' : '公司名称'}
// label="姓名或公司名称" name="authorName" rules={[{ required: true, message: belongShow == 'PERSONAL' ? '请输入姓名' : '请输入公司名称' }]} >
{belongShow == 'PERSONAL' ? '英文名' : '公司英文名称'}
// label="公司英文名" name="nameEn" // rules={[{ required: true, message: belongShow == 'PERSONAL' ? '请输入英文名' : '请输入公司英文名称' }]} >
证件类型:
name="authorIdCardType" >
}
省市:
// label="省市" name="authorProvince" rules={[{ required: true, message: '请选择省市' }]} > { const targetOption = selectedOptions[selectedOptions.length - 1]; // console.log(targetOption.id); listArea(targetOption.id).then(data => { targetOption.children = data.map(item => { return { value: item.name, label: item.name, isLeaf: true, //二级判断这个 以前不是 以前是 !item.isParent id: item.id, pId: item.pId } }); setAreaArray([ ...areaArray ]) }); }} placeholder="请选择省市" changeOnSelect disabled={belongTitle == '查看所属者' ? true : false} />
是否愿意提供中国版权登记业务平台的账号?
// label="是否愿意提供中国版权登记业务平台的账号?" name="isCrcAccount" rules={[ { required: true, message: '请选择请选择知识产权所属者类型', } ]} style={{ marginTop: '22px', marginLeft: '24px' }} >
提供账号的好处为:可以以知识产权所属者的身份在中国版权登记业务平台上进行软著资料的提交。如果不提供我们将以代理商的身份替知识产权所属者进行提供。提供中国版权登记业务平台账号,会提高审核速度。
{belongTitle == '查看所属者' ? (<>
中国版权登记业务平台用户名
// label="中国版权登记业务平台用户名" name="crcAccountUsername" rules={[ ({ getFieldValue }) => ({ validator(_, value) { if (getFieldValue('isCrcAccount') === '1') { if (!value) { return Promise.reject('请输入账号'); } } return Promise.resolve(); }, }), ]} >
) : (
中国版权登记业务平台用户名
// label="中国版权登记业务平台用户名" name="crcAccountUsername" rules={[ ({ getFieldValue }) => ({ validator(_, value) { if (getFieldValue('isCrcAccount') === '1') { if (!value) { return Promise.reject('请输入账号'); } } return Promise.resolve(); }, }), ]} >
)} {belongTitle == '查看所属者' ? (<>
中国版权登记业务平台密码
// label="中国版权登记业务平台密码" name="crcAccountPassword" rules={[ ({ getFieldValue }) => ({ validator(_, value) { if (getFieldValue('isCrcAccount') === '1') { if (!value) { return Promise.reject('请输入密码'); } } return Promise.resolve(); }, }), ]} >
) : (
中国版权登记业务平台密码
// label="中国版权登记业务平台密码" name="crcAccountPassword" rules={[ ({ getFieldValue }) => ({ validator(_, value) { if (getFieldValue('isCrcAccount') === '1') { if (!value) { return Promise.reject('请输入密码'); } } return Promise.resolve(); }, }), ]} >
)}
) }