1523 lines
71 KiB
TypeScript
1523 lines
71 KiB
TypeScript
import './proj-new.css';
|
||
import { useNavigate, useParams, useSearchParams } from "react-router-dom";
|
||
import { Table, AutoComplete, Button, Flex, Form, Input, message, Modal, Spin, Checkbox, DatePicker, Select } from "antd";
|
||
import { useContext, useEffect, useState, useRef } from "react";
|
||
// import { useLocation } from 'react-router-dom';
|
||
import { get, post } from "../../util/AjaxUtils.ts";
|
||
// import {GlobalContext} from "../../context/GlobalContext.ts";
|
||
import {
|
||
// IProjCharge,
|
||
ProjAdditionalType, ProjChargeType
|
||
} from "../../interfaces/proj/IProj.ts";
|
||
import locale from 'antd/es/date-picker/locale/zh_CN';
|
||
import { GlobalDispatchContext, reloadUser } from "../../context/GlobalContext.ts";
|
||
import BelongPeople from '../../components/BelongPeople/BelongPeople.tsx'
|
||
import ContactPeople from '../../components/ContactPeople/ContactPeople.tsx'
|
||
import dayjs from 'dayjs';
|
||
import SelectCouponModal from '../../components/CouponModal/SelectCouponModal.tsx'
|
||
// import { key } from 'localforage';
|
||
import homes from '../../static/homes.png'
|
||
const { TextArea } = Input;
|
||
// const { TextArea } = Input;
|
||
type ProjInfo = {
|
||
projName: string;
|
||
projIntroduction: string;
|
||
belongPeople: string;
|
||
contacts: string;
|
||
projDevCompleteDate: string;
|
||
coupon?: string;
|
||
projVersion: string;
|
||
backendCodeLang: string;
|
||
envIndustry?: string
|
||
packageName?: string
|
||
};
|
||
import type {
|
||
TableColumnsType,
|
||
TableProps
|
||
} from 'antd';
|
||
interface DataType {
|
||
key: React.Key;
|
||
packageName: string;
|
||
packageMoney: number;
|
||
packageDescription: string;
|
||
packageInfoId: string;
|
||
packageOrderId: string;
|
||
}
|
||
|
||
import { useDispatch,useSelector } from 'react-redux'
|
||
export default function ProjNew() {
|
||
const dispath = useDispatch()
|
||
// 更新redux的套餐包信息
|
||
const getMyPackNum = () => {
|
||
get<any>({
|
||
messageApi,
|
||
url: `/api/proj/servicepkg/packageorder/count/self`,
|
||
onBefore() {
|
||
|
||
},
|
||
onSuccess({ data }) {
|
||
dispath({
|
||
type: 'upPackNum',
|
||
val: {
|
||
ALL: data.ALL,
|
||
MATERIAL: data.MATERIAL,
|
||
}
|
||
})
|
||
},
|
||
onFinally() {
|
||
|
||
}
|
||
})
|
||
}
|
||
const redxuState: any = useSelector(state => state)
|
||
// const [packageType, setPackageType] = useState('')
|
||
const packNum = redxuState.packNum
|
||
const [packselectShow, setPackselectShow] = useState(false)
|
||
const [debounceTimer, setDebounceTimer] = useState<any>(null);
|
||
// 创建一个 ref 来引用推荐列表容器
|
||
const recommendListRef = useRef<HTMLDivElement>(null);
|
||
// const [projNameValue, setProjNameValue] = useState('');
|
||
const [recommendModal, setRecommendModal] = useState(false) //推荐弹窗
|
||
// 土建弹窗输入框内容
|
||
const [recommendInput, setRecommendInput] = useState('')
|
||
// 推荐窗口加载中
|
||
// const [ailoading, setAiloading] = useState(false)
|
||
const [recommendList, setRecommendList] = useState<any[]>([
|
||
// '呵呵呵哒系统',
|
||
// '坐的我屁股疼系统',
|
||
// '坐的腰也非常疼系统',
|
||
// '减肥还是不减肥系统系统',
|
||
// '我要酷酷吃吃吃吃吃吃系统我要酷酷吃吃吃吃吃吃系统我要酷酷吃吃吃吃吃吃系统我要酷酷吃吃吃吃吃吃系统',
|
||
// '晚上吃点啥系统',
|
||
// '晚上吃点啥系统',
|
||
// '晚上吃点啥系统',
|
||
// '晚上吃点啥系统',
|
||
// '晚上吃点啥系统',
|
||
// '晚上吃点啥系统',
|
||
// '晚上吃点啥系统',
|
||
|
||
|
||
]) //推荐系统全称列表
|
||
// 根据输入内容获取标题
|
||
const getRecommendList = () => {
|
||
// // setRecommendList([])
|
||
|
||
post<any>({
|
||
messageApi,
|
||
url: `/api/proj/recommend/list-proj-name/ai`,
|
||
body: {
|
||
prompt: recommendInput
|
||
},
|
||
onBefore() {
|
||
setRecommendLoading(true)
|
||
},
|
||
onSuccess({ data }) {
|
||
if (recommendListRef.current) {
|
||
recommendListRef.current.scrollTop = 0;
|
||
}
|
||
// console.log(data);
|
||
setRecommendList(data)
|
||
|
||
},
|
||
onFinally() {
|
||
setRecommendLoading(false)
|
||
|
||
},
|
||
})
|
||
}
|
||
const [recommendLoading, setRecommendLoading] = useState(false) //推荐系统全称列表加载状态
|
||
const [selectList, setSelectList] = useState<any[]>([]) //联想先择的系统名列表
|
||
// 获取历史项目名称列表
|
||
const getHistoryList = (value: string) => {
|
||
// const encodedValue = encodeURIComponent(value);
|
||
get({
|
||
messageApi,
|
||
url: `/api/proj/recommend/list-proj-name/history`,
|
||
config: {
|
||
params: {
|
||
keywords: value
|
||
}
|
||
},
|
||
onBefore() {
|
||
|
||
},
|
||
onSuccess({ data }: any) {
|
||
// console.log(data);
|
||
setSelectList(data.map((item: any, index: any) => {
|
||
return {
|
||
key: index,
|
||
value: item
|
||
}
|
||
}))
|
||
},
|
||
onFinally() {
|
||
|
||
},
|
||
})
|
||
}
|
||
const [packList, setPackList] = useState<any[]>([]) //服务包列表
|
||
|
||
// const location = useLocation();
|
||
// const { price } = location.state || {};
|
||
// const [showPrice, setShowPrice] = useState(location.state.price) //显示的价格
|
||
const [selectPack, setSelectPack] = useState(false) //是否选择了服务器套餐
|
||
// 是否显示优惠券
|
||
const [couponShow, setcouponShow] = useState(true)
|
||
// const globalContext = useContext(GlobalContext);
|
||
const dateFormat = 'YYYY年MM月DD日';
|
||
const globalDispatchContext = useContext(GlobalDispatchContext);
|
||
const nav = useNavigate();
|
||
const pathParams = useParams();
|
||
const [queryParams] = useSearchParams();
|
||
|
||
const [messageApi, contextHolder] = message.useMessage();
|
||
const [loading, setLoading] = useState<boolean>(false);
|
||
const height = window.innerHeight - 180;
|
||
// 提示结尾是否带关键字弹窗
|
||
// const [hasKeywords, setHasKeywords] = useState<boolean>(false);
|
||
// 创建项目弹窗
|
||
const [isCreateModalOpen, setIsCreateModalOpen] = useState(false);
|
||
const [isEditModalOpen, setIsEditModalOpen] = useState(false);
|
||
const [chargePrice, setChargePrice] = useState(0);
|
||
const [projInfo, setProjInfo] = useState<ProjInfo>({
|
||
projName: '',
|
||
projIntroduction: '',
|
||
belongPeople: '',
|
||
contacts: '',
|
||
projDevCompleteDate: '',
|
||
projVersion: '',
|
||
backendCodeLang: '',
|
||
// packageInfoId: ''
|
||
});
|
||
const [form] = Form.useForm<ProjInfo>();
|
||
// 所属者弹窗
|
||
const [belongModal, setBelongModal] = useState(false)
|
||
// 联系人弹窗
|
||
const [concatModal, setConcatModal] = useState(false)
|
||
// const [belongPeopleName ,setBelongPeopleName] = useState('')
|
||
const [belongPeopleInfo, setBelongPeopleInfo] = useState({
|
||
authorName: '',
|
||
authorType: '',
|
||
authorIdCardType: '',
|
||
authorIdCard: '',
|
||
authorCrcAccount: 0,
|
||
authorId: '',
|
||
authorProvinceCity: '',
|
||
authorCrcAccountPassword: '',
|
||
authorCrcAccountUsername: ''
|
||
})
|
||
const [concatPeopleInfo, setConcatPeopleInfo] = useState({
|
||
applyConcatId: '',
|
||
applyContactCsaNo: '',
|
||
applyContactEmail: '',
|
||
applyContactName: '',
|
||
applyContactPhone: '',
|
||
applyContactCompany: ''
|
||
})
|
||
// 优惠券弹窗
|
||
const [couponModal, setCouponModal] = useState(false)
|
||
// 服务包弹窗
|
||
const [packModal, setPackModal] = useState(false)
|
||
|
||
|
||
// 套餐包弹窗表格信息
|
||
|
||
const [total, setTotal] = useState(0)
|
||
const [nowPackageName, setNowPackageName] = useState('') //临时选择名字
|
||
// const [nowpackageInfoId, setNowpackageInfoId] = useState('') //临时选择包id
|
||
// const [packageInfoId, setPackageInfoId] = useState('') //确定选择包id
|
||
const [nowpackageOrderId, setNowpackageOrderId] = useState('') //临时选择订单id
|
||
const [packageOrderId, setPackageOrderId] = useState('') //确定选择订单id
|
||
const [selectedRowKeys, setSelectedRowKeys] = useState<React.Key[]>([packageOrderId]); //被选择的而项目
|
||
const rowSelection: TableProps<DataType>['rowSelection'] = {
|
||
selectedRowKeys,
|
||
onChange: (selectedRowKeys: React.Key[], selectedRows: DataType[]) => {
|
||
setSelectedRowKeys(selectedRowKeys);
|
||
setNowPackageName(selectedRows[0].packageName)
|
||
// setNowpackageInfoId(selectedRows[0].packageInfoId)
|
||
setNowpackageOrderId(selectedRows[0].packageOrderId)
|
||
},
|
||
|
||
};
|
||
|
||
|
||
const setValue = (value: string) => {
|
||
form.setFieldsValue({
|
||
belongPeople: value
|
||
})
|
||
}
|
||
const setConcatValue = (value: string) => {
|
||
form.setFieldsValue({
|
||
contacts: value
|
||
})
|
||
}
|
||
const [createProjId, setCreateProjId] = useState('');
|
||
const oldlistProjChargeAdditional: string[] = [];
|
||
const [listProjChargeAdditional, setlistProjChargeAdditional] = useState<string[]>([])
|
||
// 是否可用优惠券
|
||
const [hasCoupon, setHasCoupon] = useState(false)
|
||
// 给优惠券栏赋值
|
||
const setCouponTitle = (value: string) => {
|
||
form.setFieldsValue({
|
||
coupon: value
|
||
});
|
||
}
|
||
// 优惠券id
|
||
const [couponId, setCouponId] = useState('')
|
||
|
||
|
||
// 优惠券减的钱数
|
||
const [couponNum, setCouponNum] = useState(0)
|
||
// 查看是否有可用获取优惠券信息
|
||
const getCouponData = () => {
|
||
get({
|
||
messageApi,
|
||
url: `/api/coupon/user/listpage/self`,
|
||
// url: `/api/proj/refund/apply/listpage?applyStatus=${state.type}`,
|
||
config: {
|
||
params: {
|
||
page: 1,
|
||
rows: 10,
|
||
isEffective: 1,
|
||
isUsed: 0,
|
||
}
|
||
},
|
||
onBefore() {
|
||
|
||
},
|
||
onSuccess(data: any) {
|
||
if (data.data.rows.length > 0) {
|
||
setHasCoupon(true)
|
||
}
|
||
},
|
||
onFinally() {
|
||
|
||
},
|
||
})
|
||
}
|
||
//判断是否以“软件”、“系统”、“平台”或“APP”结尾
|
||
function isEndsWithKeywords(str: string) {
|
||
const keywords = ["软件", "系统", "平台", "APP"];
|
||
return keywords.some(keyword => str.endsWith(keyword));
|
||
}
|
||
// 提示信息是否显示
|
||
const [showTip, setShowTip] = useState(false)
|
||
const [page, setPage] = useState(1);
|
||
const packColumns: TableColumnsType<DataType> = [
|
||
{
|
||
title: '序号',
|
||
dataIndex: 'index',
|
||
key: 'packageOrderId',
|
||
align: 'center',
|
||
render: (_text, _record, index) => (page - 1) * 5 + index + 1, // 显示序号，从1开始
|
||
|
||
},
|
||
{
|
||
title: '套餐名称',
|
||
dataIndex: 'packageName',
|
||
key: 'packageOrderId',
|
||
// 居中显示
|
||
align: 'center',
|
||
},
|
||
{
|
||
title: '当前剩余次数',
|
||
dataIndex: 'packageTotalSurplusCount',
|
||
align: 'center',
|
||
key: 'packageOrderId',
|
||
render: (text: number) => {
|
||
return <div>{text} </div>
|
||
}
|
||
},
|
||
{
|
||
title: '下单时间',
|
||
align: 'center',
|
||
dataIndex: 'gmtCreate',
|
||
key: 'packageOrderId',
|
||
// render: (text: string) => {
|
||
// return <div title={text} style={{ width: 200, whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}>{text}</div>
|
||
// }
|
||
},
|
||
];
|
||
|
||
// 获取我得服务包信息
|
||
const getPickList = (page: number) => {
|
||
|
||
get<any>({
|
||
messageApi,
|
||
url: `/api/proj/servicepkg/packageorder/listpage/self`,
|
||
config: {
|
||
params: {
|
||
page: page,
|
||
rows: 5,
|
||
keyong: "keyong",
|
||
packageType: pathParams.projChargeType,
|
||
}
|
||
},
|
||
onBefore() {
|
||
|
||
},
|
||
onSuccess({ data }) {
|
||
// console.log(data);
|
||
// const list = data as any;
|
||
// setSelectList(data.rows)
|
||
setPackList(data.rows)
|
||
setTotal(data.total)
|
||
// const newPackList = data.rows.map((item: any) => {
|
||
// return {
|
||
// value: item.packageInfoId,
|
||
// label: item.packageName,
|
||
// key: item.packageNo,
|
||
// }
|
||
// });
|
||
// //
|
||
// setPackList(newPackList);
|
||
// setHasMore(data.total / 5 > page);
|
||
},
|
||
onFinally() {
|
||
|
||
}
|
||
})
|
||
}
|
||
// useEffect(() => {
|
||
// getPickList();
|
||
// }, [page]);
|
||
// useEffect(() => {
|
||
// if(projInfo.packageInfoId == ''){
|
||
// setPage(1)
|
||
// }
|
||
// },[projInfo.packageInfoId])
|
||
useEffect(() => {
|
||
if(packNum.ALL > 0 && pathParams.projChargeType == 'ALL'){
|
||
setPackselectShow(true)
|
||
}
|
||
if(packNum.MATERIAL > 0 && pathParams.projChargeType == 'MATERIAL'){
|
||
setPackselectShow(true)
|
||
}
|
||
}, [packNum]);
|
||
|
||
const [languageArray, setLanguageArray] = useState<any[]>([]) //语言列表
|
||
useEffect(() => {
|
||
get({
|
||
messageApi: messageApi,
|
||
url: '/api/proj/charge/get',
|
||
onSuccess({ data }) {
|
||
// console.log(data);
|
||
|
||
const charge = data as any;
|
||
// console.log('创建页price',charge.proj.materialAgent);
|
||
|
||
let price = 0;
|
||
switch (pathParams.projChargeType) {
|
||
case ProjChargeType.ALL:
|
||
// price = charge.proj.all;
|
||
price = charge.projTypes[0].price;
|
||
break;
|
||
// case ProjChargeType.MATERIAL_AGENT:
|
||
// price = charge.proj.materialAgent;
|
||
// break;
|
||
// case ProjChargeType.MATERIAL_AGENT_URGENT:
|
||
// price = charge.proj.materialAgentUrgent;
|
||
// break;
|
||
case ProjChargeType.MATERIAL:
|
||
price = charge.projTypes[1].price;
|
||
break;
|
||
case ProjChargeType.FREE:
|
||
price = charge.projTypes[2].price;
|
||
break;
|
||
default:
|
||
messageApi.error({
|
||
type: 'error',
|
||
content: '价格类型错误',
|
||
})
|
||
}
|
||
const pkg = queryParams.get('pkg') == 'true' ? true : false
|
||
const videoDemo = queryParams.get('videoDemo') == 'true' ? true : false
|
||
const urgent = queryParams.get('urgent') == 'true' ? true : false
|
||
if (pkg) {
|
||
price += charge.additional.pkg;
|
||
oldlistProjChargeAdditional.push(ProjAdditionalType.PKG);
|
||
// console.log(listProjChargeAdditional);
|
||
|
||
}
|
||
if (videoDemo) {
|
||
price += charge.additional.videoDemo;
|
||
oldlistProjChargeAdditional.push(ProjAdditionalType.VIDEO_DEMO);
|
||
// console.log(listProjChargeAdditional);
|
||
|
||
}
|
||
if (urgent) {
|
||
price += charge.additional.urgent;
|
||
oldlistProjChargeAdditional.push(ProjAdditionalType.URGENT);
|
||
// console.log(listProjChargeAdditional);
|
||
}
|
||
setChargePrice(price);
|
||
setlistProjChargeAdditional(oldlistProjChargeAdditional)
|
||
// console.log('传递信息pkg:',pkg,'videoDemo:',videoDemo);
|
||
|
||
}
|
||
})
|
||
|
||
// console.log('类型', pathParams.projChargeType);
|
||
if (pathParams.projChargeType == 'FREE') {
|
||
setcouponShow(false)
|
||
}
|
||
getCouponData()
|
||
// console.log('价格', showPrice);
|
||
getPickList(1)
|
||
// console.log()
|
||
get({
|
||
messageApi: messageApi,
|
||
url: 'api/env/custom/list-active-lang',
|
||
onSuccess({ data }:any) {
|
||
|
||
// setDefultLanguage(data[0])
|
||
setLanguageArray(data.map((item:any) => ({ value: item, label: item })));
|
||
// console.log(data[0],data.map((item:any) => ({ value: item, label: item })));
|
||
|
||
}
|
||
})
|
||
|
||
}, []);
|
||
|
||
|
||
return (
|
||
<>
|
||
{contextHolder}
|
||
{/* <Breadcrumb
|
||
items={[
|
||
{title: <Link to={'/'}>首页</Link>},
|
||
{title: <Link to={'/proj-create'}>创建项目</Link>},
|
||
{title: '新建项目'},
|
||
]}
|
||
/> */}
|
||
<div className='projNew' style={{ height: `${height}px`, overflow: 'auto' }}>
|
||
<div className="proj-new">
|
||
{/* <div className="proj-title">请完善项目的基本信息</div> */}
|
||
<div className="proj-form" >
|
||
<Form
|
||
name="basic"
|
||
form={form}
|
||
initialValues={{
|
||
projVersion: 'V1.0',
|
||
backendCodeLang: 'JAVA',
|
||
}} // 添加 initialValues 属性
|
||
layout={'vertical'}
|
||
labelCol={{ span: 24 }}
|
||
wrapperCol={{ span: 24 }}
|
||
style={{ width: '100%' }}
|
||
onFinish={(formData) => {
|
||
// console.log(formData.projName);
|
||
|
||
|
||
setIsCreateModalOpen(true);
|
||
setProjInfo({
|
||
projName: formData.projName,
|
||
projIntroduction: formData.projIntroduction,
|
||
belongPeople: formData.belongPeople,
|
||
contacts: formData.contacts,
|
||
projDevCompleteDate: formData.projDevCompleteDate,
|
||
projVersion: formData.projVersion ? formData.projVersion : 'V1.0',
|
||
backendCodeLang: formData.backendCodeLang,
|
||
// packageInfoId: formData.packageInfoId?formData.packageInfoId : '',
|
||
})
|
||
}}
|
||
autoComplete="off"
|
||
>
|
||
<div style={{
|
||
width: 800,
|
||
marginLeft: 130,
|
||
display: 'flex',
|
||
justifyContent: 'center',
|
||
marginBottom: 30,
|
||
fontWeight: 'bold',
|
||
fontSize: 18,
|
||
marginTop: 5
|
||
}}>
|
||
<img src={homes} width={19} height={19} style={{
|
||
marginTop: 4,
|
||
marginRight: 5,
|
||
}} alt="" />
|
||
<div> 项目信息</div>
|
||
|
||
</div>
|
||
|
||
<div style={{ position: 'relative' }}>
|
||
<div className='formItemOne'>
|
||
<div className='formItem-title oneTitle'>系统全称<span style={{ color: 'red' }}>*</span></div>
|
||
<Form.Item<ProjInfo>
|
||
name="projName"
|
||
rules={[
|
||
{ required: true, message: '请输入系统全称' },
|
||
]}
|
||
>
|
||
|
||
{/* <Input onChange={(e) => {
|
||
// 打印值
|
||
// console.log(e.target.value);
|
||
if (e.target.value) {
|
||
if (isEndsWithKeywords(e.target.value)) {
|
||
setShowTip(false)
|
||
} else {
|
||
setShowTip(true)
|
||
}
|
||
} else {
|
||
setShowTip(false)
|
||
}
|
||
|
||
|
||
}} style={{ background: '#eeeeee', width: '800px', height: '50px', fontSize: '16px' }} placeholder="请输入系统全称 (注：系统全称建议以“软件”、“系统”、“平台”或“APP”结尾)" /> */}
|
||
|
||
<AutoComplete
|
||
className='changeStyle'
|
||
allowClear
|
||
style={{
|
||
// background: '#eeeeee',
|
||
// fontSize: '16px',
|
||
width: '780px',
|
||
height: '42px',
|
||
}}
|
||
placeholder="请输入系统全称 (注：系统全称建议以“软件”、“系统”、“平台”或“APP”结尾)"
|
||
options={selectList}
|
||
onSearch={(value) => {
|
||
// setProjNameValue(value);
|
||
if (value) {
|
||
if (isEndsWithKeywords(value)) {
|
||
setShowTip(false);
|
||
} else {
|
||
setShowTip(true);
|
||
}
|
||
} else {
|
||
setShowTip(false);
|
||
}
|
||
}}
|
||
onChange={(value) => {
|
||
// setProjNameValue(value);
|
||
// console.log(value);
|
||
|
||
if (value) {
|
||
// getHistoryList(value);
|
||
if (isEndsWithKeywords(value)) {
|
||
setShowTip(false);
|
||
} else {
|
||
setShowTip(true);
|
||
}
|
||
// 清除之前的定时器
|
||
if (debounceTimer) {
|
||
clearTimeout(debounceTimer);
|
||
}
|
||
|
||
// 设置新的定时器
|
||
const newTimer = setTimeout(() => {
|
||
getHistoryList(value);
|
||
}, 1000);
|
||
|
||
// 更新定时器 ID
|
||
setDebounceTimer(newTimer);
|
||
} else {
|
||
setShowTip(false);
|
||
setSelectList([])
|
||
}
|
||
}}
|
||
|
||
/>
|
||
|
||
</Form.Item>
|
||
|
||
</div>
|
||
<a
|
||
onClick={() => {
|
||
// form.setFieldsValue({
|
||
// projName: '嘻嘻'
|
||
// });
|
||
setRecommendModal(true)
|
||
setRecommendList([])
|
||
}}
|
||
style={{
|
||
position: 'absolute',
|
||
right: -35,
|
||
top: 10,
|
||
}}>推荐</a>
|
||
<div style={{
|
||
position: 'absolute', left: 165,
|
||
display: showTip ? 'unset' : 'none',
|
||
color: 'green',
|
||
}}>系统全称建议以“软件”、“系统”、“平台”或“APP”结尾</div>
|
||
</div>
|
||
<div style={{
|
||
display: 'flex',
|
||
marginTop: 20
|
||
}}>
|
||
|
||
<div className='formItemOne' style={{ position: 'relative' }}>
|
||
<div className='formItem-title ' style={{
|
||
// position: 'relative',
|
||
// background: 'pink',
|
||
}}>
|
||
产权所属者
|
||
|
||
</div>
|
||
<Form.Item<ProjInfo>
|
||
name="belongPeople"
|
||
rules={[
|
||
// { required: true, message: '请选择/创建知识产权所属者' }
|
||
]}
|
||
>
|
||
<Input style={{ background: '#eeeeee', width: '310px', height: '42px', color: '#3B3B3B' }} placeholder="请选择/创建知识产权所属者" disabled />
|
||
|
||
</Form.Item>
|
||
<div style={{
|
||
display: belongPeopleInfo.authorId ? 'none' : 'unset',
|
||
position: 'absolute', right: 20,
|
||
// fontSize: 16,
|
||
color: " #1F79FF", cursor: 'pointer',
|
||
// background:'pink',
|
||
width: 290,
|
||
textAlign: 'right',
|
||
}} onClick={() => {
|
||
setBelongModal(true)
|
||
}}>选择</div>
|
||
<div style={{
|
||
display: belongPeopleInfo.authorId ? 'unset' : 'none',
|
||
|
||
position: 'absolute', right: 0,
|
||
// fontSize: 16,
|
||
color: " #1F79FF", cursor: 'pointer',
|
||
// background:'pink',
|
||
width: 50,
|
||
textAlign: 'center',
|
||
|
||
}} onClick={() => {
|
||
setValue('')
|
||
setBelongPeopleInfo({
|
||
authorName: '',
|
||
authorType: '',
|
||
authorIdCardType: '',
|
||
authorIdCard: '',
|
||
authorCrcAccount: 0,
|
||
authorId: '',
|
||
authorProvinceCity: '',
|
||
authorCrcAccountUsername: '',
|
||
authorCrcAccountPassword: '',
|
||
})
|
||
}}>取消</div>
|
||
</div>
|
||
<div className='formItemOne' style={{ position: 'relative' }}>
|
||
<div className='formItem-title '>
|
||
产权联系人<span style={{ color: 'red' }}>*</span>
|
||
</div>
|
||
<Form.Item<ProjInfo>
|
||
name="contacts"
|
||
rules={[{ required: true, message: '请选择/创建知识产权联系人' }]}
|
||
>
|
||
<Input style={{ background: '#eeeeee', width: '310px', height: '42px', color: '#3B3B3B' }} placeholder="请选择/创建知识产权联系人" disabled />
|
||
|
||
</Form.Item>
|
||
<div style={{
|
||
position: 'absolute', right: 20,
|
||
// fontSize: 16,
|
||
color: " #1F79FF", cursor: 'pointer',
|
||
width: 290,
|
||
textAlign: 'right',
|
||
|
||
}} onClick={() => {
|
||
setConcatModal(true)
|
||
}}>选择</div>
|
||
</div>
|
||
</div>
|
||
<div style={{
|
||
display: 'flex',
|
||
marginTop: 20
|
||
}}>
|
||
<div className='formItemOne' style={{}}>
|
||
<div className='formItem-title oneTitle'>系统版本<span style={{ color: 'red' }}>*</span></div>
|
||
<Form.Item<ProjInfo>
|
||
name="projVersion"
|
||
|
||
>
|
||
<Input
|
||
|
||
style={{
|
||
// background: '#eeeeee',
|
||
width: '310px', height: '42px',
|
||
// fontSize: '16px'
|
||
}} placeholder="请输入系统版本 (注：默认版本为v1.0)" />
|
||
|
||
</Form.Item>
|
||
|
||
</div>
|
||
<div className='formItemOne' style={{}}>
|
||
<div className='formItem-title oneTitle'>系统语言<span style={{ color: 'red' }}>*</span></div>
|
||
<Form.Item<ProjInfo>
|
||
name="backendCodeLang"
|
||
rules={[
|
||
{ required: true, message: '请选择系统语言' },
|
||
]}
|
||
>
|
||
<Select
|
||
style={{
|
||
width: '310px', height: '42px',
|
||
// fontSize: '16px',
|
||
}}
|
||
placeholder="请选择系统语言"
|
||
className='langselect'
|
||
// defaultValue="JAVA"
|
||
// options={[
|
||
// { value: 'JAVA', label: 'JAVA' },
|
||
// // { value: 'NODE', label: 'NODE(JAVASCRIPT)' },
|
||
// // { value: 'PYTHON', label: 'PYTHON' },
|
||
// // { value: 'GO', label: 'GO' },
|
||
// ]}
|
||
options={languageArray}
|
||
>
|
||
</Select>
|
||
</Form.Item>
|
||
</div>
|
||
</div>
|
||
|
||
<div style={{
|
||
display: 'flex',
|
||
marginTop: 20
|
||
}}>
|
||
|
||
{/* <div className='formItemOne' style={{}}>
|
||
<div className='formItem-title oneTitle'>面向行业/领域*</div>
|
||
<Form.Item<ProjInfo>
|
||
name="envIndustry"
|
||
rules={[
|
||
{ required: true, message: '请选面向行业/领域' },
|
||
]}
|
||
>
|
||
<Select
|
||
style={{ width: '310px', height: '50px', fontSize: '16px', }}
|
||
placeholder="请选面向行业/领域"
|
||
className='langselect'
|
||
// defaultValue="JAVA"
|
||
options={[
|
||
{ value: '1', label: '中小企业' },
|
||
{ value: '2', label: '事业单位' },
|
||
{ value: '3', label: '个人' },
|
||
]}
|
||
>
|
||
</Select>
|
||
</Form.Item>
|
||
</div> */}
|
||
<div className='formItemOne' style={{}}>
|
||
<div className='formItem-title '>
|
||
开发完成时间
|
||
</div>
|
||
<Form.Item<ProjInfo>
|
||
// label="开发完成时间"
|
||
name="projDevCompleteDate"
|
||
// rules={[{ required: true, message: '请输入开发完成时间' }]}
|
||
>
|
||
<DatePicker placeholder="请选择开发完成日期"
|
||
className='detaPicker'
|
||
format={dateFormat}
|
||
locale={locale}
|
||
// style={{ width: '100%' }}
|
||
style={{
|
||
height: '42px', width: '310px',
|
||
// fontSize: 16,
|
||
// background: '#eeeeee',
|
||
}}
|
||
disabledDate={(current) => current && current > dayjs().endOf('day')}
|
||
|
||
/>
|
||
</Form.Item>
|
||
</div>
|
||
{/* 服务包 */}
|
||
<div style={{
|
||
display: couponId || pathParams.projChargeType == 'FREE' ? 'none' : 'unset'
|
||
}}>
|
||
<div className='formItemOne' >
|
||
<div className='formItemOne' style={{ position: 'relative' }}>
|
||
<div className='formItem-title oneTitle'>套餐包</div>
|
||
<Form.Item<ProjInfo>
|
||
name="packageName"
|
||
rules={[
|
||
// { required: true, message: '请选择系统语言' },
|
||
]}
|
||
>
|
||
{/* <Select
|
||
disabled={packList.length > 0 ? false : true}
|
||
style={{ width: '310px', height: '50px', fontSize: '16px', }}
|
||
placeholder={packList.length > 0 ? '请选择服务包' : '暂无服务包'}
|
||
className='langselect'
|
||
// defaultValue="JAVA"
|
||
options={packList}
|
||
allowClear
|
||
onChange={(value) => {
|
||
if (value) {
|
||
setShowPrice(0)
|
||
setSelectPack(true)
|
||
setcouponShow(false)
|
||
} else {
|
||
setShowPrice(location.state.price)
|
||
setSelectPack(false)
|
||
setcouponShow(true)
|
||
}
|
||
|
||
}}
|
||
>
|
||
</Select> */}
|
||
<Input
|
||
className="custom-input"
|
||
style={{
|
||
// background: '#eeeeee',
|
||
// fontSize: 16,
|
||
width: '310px', height: '42px', color: '#3B3B3B'
|
||
}}
|
||
// placeholder={packList.length > 0 ? '请选择套餐包' : '暂无套餐包'}
|
||
placeholder={packselectShow ? '请选择套餐包' : '暂无套餐包'}
|
||
disabled
|
||
/>
|
||
|
||
</Form.Item>
|
||
<div style={{
|
||
position: 'absolute',
|
||
// left: 165,
|
||
left: 158,
|
||
|
||
top: 40,
|
||
// display: showTip ? 'unset' : 'none',
|
||
color: 'red',
|
||
fontSize: 18,
|
||
fontWeight: 'bold',
|
||
}}>注：已购买套餐包的请选择套餐包支付</div>
|
||
<div
|
||
style={{
|
||
display: selectPack ? 'none' : 'unset', position: 'absolute', right: 23,
|
||
// fontSize: 16,
|
||
// color: packList.length ? '#1F79FF' : '#676767', cursor: 'pointer',
|
||
color: packselectShow ? '#1F79FF' : '#676767', cursor: 'pointer',
|
||
// background:'pink',
|
||
width: 290,
|
||
textAlign: 'right',
|
||
}}
|
||
onClick={() => {
|
||
if (packList.length > 0) {
|
||
setPackModal(true)
|
||
setPage(1)
|
||
setSelectedRowKeys([])
|
||
getPickList(1)
|
||
// #1F79FF
|
||
} else {
|
||
messageApi.error('无可用套餐包')
|
||
}
|
||
|
||
}}>选择</div>
|
||
<div style={{ display: selectPack ? 'unset' : 'none', position: 'absolute', right: 23, color: '#1F79FF', cursor: 'pointer' }} onClick={() => {
|
||
// setPackageInfoId('')
|
||
setPackageOrderId('')
|
||
setNowpackageOrderId('')
|
||
setNowPackageName ('')
|
||
|
||
|
||
form.setFieldsValue({
|
||
packageName: ''
|
||
})
|
||
setSelectPack(false)
|
||
// setcouponShow(true)
|
||
setcouponShow(true)
|
||
// setShowPrice(location.state.price)
|
||
}}>取消</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div style={{
|
||
display: 'flex',
|
||
marginTop: 20
|
||
}}>
|
||
|
||
<div style={{ display: couponShow ? 'unset' : 'none' }}>
|
||
<div className='formItemOne' style={{ position: 'relative' }}>
|
||
<div className='formItem-title '>
|
||
优惠券
|
||
</div>
|
||
<Form.Item<ProjInfo>
|
||
name="coupon"
|
||
// rules={[{ required: true, message: '请选择优惠券' }]}
|
||
>
|
||
<Input style={{
|
||
background: '#eeeeee',
|
||
// fontSize: 16,
|
||
width: '310px', height: '42px', color: '#3B3B3B'
|
||
}} placeholder={hasCoupon ? '请选择优惠券' : '暂无可用优惠券'} disabled />
|
||
|
||
</Form.Item>
|
||
<div style={{
|
||
display: couponId ? 'none' : 'unset', position: 'absolute', right: 23,
|
||
// fontSize: 16,
|
||
color: hasCoupon ? '#1F79FF' : '#676767', cursor: 'pointer',
|
||
width: 290,
|
||
textAlign: 'right',
|
||
}} onClick={() => {
|
||
if (hasCoupon) {
|
||
setCouponModal(true)
|
||
// #1F79FF
|
||
} else {
|
||
messageApi.error('无可用优惠券')
|
||
}
|
||
// if (!selectPack) {
|
||
// if (hasCoupon) {
|
||
// setCouponModal(true);
|
||
// } else {
|
||
// messageApi.error('暂无可用优惠券');
|
||
// }
|
||
// } else {
|
||
// messageApi.error('服务包已选择，不可使用优惠券');
|
||
// }
|
||
}}>选择</div>
|
||
<div style={{ display: couponId ? 'unset' : 'none', position: 'absolute', right: 23, fontSize: 16, color: '#1F79FF', cursor: 'pointer' }} onClick={() => {
|
||
setCouponTitle('')
|
||
setCouponId('')
|
||
setCouponNum(0)
|
||
}}>取消</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
{/* <div style={{
|
||
marginLeft: 50,
|
||
// fontWeight: 'bold',
|
||
fontSize: 16,
|
||
marginTop: 5,
|
||
color: 'green',
|
||
fontWeight: 'bold',
|
||
}}>知识产权选择 : </div> */}
|
||
{/* <div style={{
|
||
height: 2,
|
||
background: '#E9E9E9',
|
||
// width: 900,
|
||
marginLeft: 50,
|
||
marginTop: 20,
|
||
marginBottom: 20,
|
||
}}></div> */}
|
||
{/* <div style={{
|
||
width: 800,
|
||
marginLeft: 130,
|
||
display: 'flex',
|
||
justifyContent: 'center',
|
||
marginBottom: 30,
|
||
fontWeight: 'bold',
|
||
fontSize: 18,
|
||
marginTop: 20
|
||
}}>
|
||
<img src={homes} width={19} height={19} style={{
|
||
marginTop: 4,
|
||
marginRight: 5,
|
||
}} alt="" />
|
||
<div> 知识产权</div>
|
||
|
||
</div> */}
|
||
|
||
<div className='software-protocol'>
|
||
<Form.Item
|
||
name="agreement"
|
||
valuePropName="checked"
|
||
rules={[
|
||
{
|
||
validator: (_, value) =>
|
||
value ? Promise.resolve() : Promise.reject(new Error('请阅读并勾选《软件委托开发协议》')),
|
||
},
|
||
]}
|
||
>
|
||
<Checkbox>
|
||
我同意平台 <a onClick={() => {
|
||
window.open('https://www.aimzhu.com/Seda.html')
|
||
}}>《软件委托开发协议》</a>
|
||
</Checkbox>
|
||
</Form.Item>
|
||
</div>
|
||
<div style={{
|
||
height: 2,
|
||
background: '#E9E9E9',
|
||
// width: 900,
|
||
marginLeft: 50,
|
||
marginTop: 20,
|
||
marginBottom: 20,
|
||
}}></div>
|
||
{/* <div className='formItemTwo'>
|
||
<div className='formItem-title '>简单描述</div>
|
||
<Form.Item<ProjInfo>
|
||
name="projIntroduction"
|
||
>
|
||
<TextArea rows={10} style={{ background: '#eeeeee', resize: 'none',width:"328px",height:'220px',fontSize:'16px' }} placeholder="请对系统作出简单的描述，以使可准确生成资料..." />
|
||
</Form.Item>
|
||
</div> */}
|
||
<div style={{ marginTop: '' }}>
|
||
<div style={{
|
||
// background: 'pink',
|
||
display: 'flex',
|
||
justifyContent: 'space-evenly',
|
||
// alignItems: 'center',
|
||
|
||
|
||
}}>
|
||
<div style={{
|
||
fontSize: 30,
|
||
// color:'red',
|
||
fontWeight: 'bold',
|
||
// background:'pink',
|
||
lineHeight: '40px'
|
||
|
||
}}>金额 ：
|
||
<span
|
||
style={{
|
||
color: 'red',
|
||
}}
|
||
>
|
||
{/* {(showPrice / 100 - couponNum) < 0 ? 0 : showPrice / 100 - couponNum} */}
|
||
{selectPack ? 0 : (chargePrice / 100 - couponNum) < 0 ? 0 : chargePrice / 100 - couponNum}
|
||
元</span>
|
||
</div>
|
||
<div style={{
|
||
// background:'skyBlue',
|
||
display: 'flex',
|
||
alignItems: 'center',
|
||
justifyContent: 'space-between',
|
||
// width:200,
|
||
}}>
|
||
<Form.Item>
|
||
<Flex align="center" justify="center" gap="large">
|
||
|
||
<Button type="primary" htmlType="submit"
|
||
size='large'
|
||
// style={{
|
||
// backgroundColor: 'var(--color-primary)', width: '216px',
|
||
// height: '50px', fontSize: '16px', marginLeft: '53px'
|
||
// }}
|
||
// onClick={()=>{
|
||
// // 打印
|
||
|
||
|
||
// }}
|
||
>
|
||
保存并付款
|
||
</Button>
|
||
<Button
|
||
style={{
|
||
marginLeft: 10,
|
||
|
||
}}
|
||
size='large'
|
||
type="default" htmlType="button" onClick={() => {
|
||
nav(-1);
|
||
}}
|
||
>
|
||
返回
|
||
</Button>
|
||
|
||
</Flex>
|
||
</Form.Item>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</Form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<Modal title="提示"
|
||
centered
|
||
okText="确定"
|
||
cancelText="取消"
|
||
open={isCreateModalOpen}
|
||
onOk={() => {
|
||
// console.log('最终',listProjChargeAdditional);
|
||
// console.log(belongPeopleInfo.authorId);
|
||
|
||
post<any>({
|
||
messageApi,
|
||
url: '/api/proj/create',
|
||
body: {
|
||
// packageInfoId: projInfo.packageInfoId,
|
||
projName: projInfo.projName,
|
||
projVersion: projInfo.projVersion,
|
||
backendCodeLang: projInfo.backendCodeLang,
|
||
projChargeType: pathParams.projChargeType,
|
||
listProjChargeAdditional: listProjChargeAdditional,
|
||
// dayjs(formInfo.getFieldValue('projDevCompleteDate')).format(dateFormat),
|
||
projDevCompleteDate: projInfo.projDevCompleteDate ? dayjs(projInfo.projDevCompleteDate).format(dateFormat) : '',
|
||
authorCrcAccount: belongPeopleInfo.authorCrcAccount,
|
||
authorCrcAccountPassword: belongPeopleInfo.authorCrcAccountPassword,
|
||
authorCrcAccountUsername: belongPeopleInfo.authorCrcAccountUsername,
|
||
authorId: belongPeopleInfo.authorId,
|
||
authorIdCard: belongPeopleInfo.authorIdCard,
|
||
authorIdCardType: belongPeopleInfo.authorIdCardType,
|
||
authorName: belongPeopleInfo.authorName,
|
||
authorProvinceCity: belongPeopleInfo.authorProvinceCity,
|
||
authorType: belongPeopleInfo.authorType,
|
||
|
||
applyContactCompany: concatPeopleInfo.applyContactCompany,
|
||
applyContactCsaNo: concatPeopleInfo.applyContactCsaNo,
|
||
applyContactEmail: concatPeopleInfo.applyContactEmail,
|
||
applyContactId: concatPeopleInfo.applyConcatId,
|
||
applyContactName: concatPeopleInfo.applyContactName,
|
||
applyContactPhone: concatPeopleInfo.applyContactPhone,
|
||
couponId: couponId ? couponId : '',
|
||
// packageInfoId: packageInfoId ? packageInfoId : ''
|
||
packageOrderId: packageOrderId ? packageOrderId : '',
|
||
|
||
},
|
||
onBefore() {
|
||
setLoading(true);
|
||
},
|
||
onSuccess({ data }) {
|
||
setIsEditModalOpen(true);
|
||
setCreateProjId(data.data);
|
||
reloadUser(messageApi, globalDispatchContext).then(() => {
|
||
messageApi.success('扣款成功');
|
||
});
|
||
getMyPackNum()
|
||
},
|
||
onFinally() {
|
||
setLoading(false);
|
||
}
|
||
})
|
||
|
||
|
||
setIsCreateModalOpen(false);
|
||
|
||
}}
|
||
onCancel={() => {
|
||
setIsCreateModalOpen(false);
|
||
|
||
|
||
}}>
|
||
<div>该操作会扣除
|
||
{/* {(chargePrice / 100 - couponNum) < 0 ? 0 : chargePrice / 100 - couponNum} */}
|
||
{selectPack ? 0 : (chargePrice / 100 - couponNum) < 0 ? 0 : chargePrice / 100 - couponNum}
|
||
元，确定操作吗？</div>
|
||
</Modal>
|
||
<Modal title="提示"
|
||
okText="确定"
|
||
cancelText="取消"
|
||
centered
|
||
open={isEditModalOpen}
|
||
onOk={() => {
|
||
sessionStorage.setItem('projName', projInfo.projName);
|
||
sessionStorage.setItem('projStatus','编辑')
|
||
if (pathParams.projChargeType == ProjChargeType.ALL) {
|
||
nav(`/proj-eall/${createProjId}`);
|
||
} else if (pathParams.projChargeType == ProjChargeType.FREE) {
|
||
nav(`/proj-efree/${createProjId}`);
|
||
} else {
|
||
nav(`/proj-edit/${createProjId}`);
|
||
}
|
||
}}
|
||
onCancel={() => {
|
||
setIsEditModalOpen(false);
|
||
}}>
|
||
<div>项目创建成功，开始编辑项目？</div>
|
||
</Modal>
|
||
{/* <Modal title="提示"
|
||
okText="更改"
|
||
cancelText="继续"
|
||
open={hasKeywords}
|
||
onOk={() => {
|
||
//Form表单的projName变为空
|
||
form.resetFields(['projName']);
|
||
setHasKeywords(false);
|
||
|
||
}}
|
||
centered
|
||
onCancel={() => {
|
||
setHasKeywords(false);
|
||
setIsCreateModalOpen(true);
|
||
}}>
|
||
<div>系统全称建议以“软件”、“系统”、“平台”或“APP”结尾，是否更改</div>
|
||
</Modal> */}
|
||
<Modal title="选择联系人"
|
||
destroyOnClose
|
||
centered
|
||
open={concatModal}
|
||
width={1200}
|
||
|
||
footer={null}
|
||
onCancel={() => {
|
||
setConcatModal(false)
|
||
|
||
}}>
|
||
|
||
<ContactPeople isShow={true} closeModal={() => { setConcatModal(false) }} setConcatPeopleInfo={setConcatPeopleInfo} concatPeopleInfo={concatPeopleInfo} setConcatValue={setConcatValue}></ContactPeople>
|
||
</Modal>
|
||
<Modal title="选择所属者"
|
||
destroyOnClose
|
||
centered
|
||
open={belongModal}
|
||
width={1200}
|
||
|
||
footer={null}
|
||
onCancel={() => {
|
||
setBelongModal(false)
|
||
|
||
}}>
|
||
|
||
<BelongPeople closeModal={() => { setBelongModal(false) }} setBelongPeopleInfo={setBelongPeopleInfo} belongPeopleInfo={belongPeopleInfo} setValue={setValue} isShow={true}></BelongPeople>
|
||
</Modal>
|
||
<Modal title="选择优惠券"
|
||
destroyOnClose
|
||
centered
|
||
open={couponModal}
|
||
width={809}
|
||
|
||
footer={null}
|
||
onCancel={() => {
|
||
setCouponModal(false)
|
||
|
||
}}>
|
||
<SelectCouponModal
|
||
couponId={couponId}
|
||
setCouponId={(value: string) => {
|
||
setCouponId(value)
|
||
}}
|
||
couponNum={couponNum}
|
||
setCouponNum={(value: number) => {
|
||
setCouponNum(value)
|
||
}}
|
||
setCouponTitle={(value: string) => {
|
||
setCouponTitle(value)
|
||
}}
|
||
closeModal={() => {
|
||
setCouponModal(false)
|
||
}}
|
||
></SelectCouponModal>
|
||
</Modal>
|
||
<Modal title="选择套餐包"
|
||
destroyOnClose
|
||
centered
|
||
open={packModal}
|
||
width={809}
|
||
|
||
footer={null}
|
||
onCancel={() => {
|
||
setPackModal(false)
|
||
setNowPackageName('')
|
||
// setNowpackageInfoId('')
|
||
setNowpackageOrderId('')
|
||
// setPage(1)
|
||
|
||
}}>
|
||
|
||
<div>
|
||
<Table
|
||
columns={packColumns}
|
||
dataSource={packList}
|
||
rowSelection={{
|
||
...rowSelection,
|
||
// selectedRowKeys,
|
||
type: 'radio', // 设置为单选
|
||
// onChange: (selectedRowKeys: React.Key[], selectedRows: DataType[]) => {
|
||
// setSelectedRowKeys(selectedRowKeys);
|
||
|
||
|
||
|
||
// },
|
||
|
||
}}
|
||
pagination={{
|
||
defaultPageSize: 5, // 设置默认一页显示 5 条数据,
|
||
current: page,
|
||
total: total,
|
||
onChange: (page: number) => {
|
||
setPage(page)
|
||
getPickList(page)
|
||
// console.log(page);
|
||
|
||
|
||
}
|
||
}}
|
||
rowKey="packageOrderId"
|
||
onRow={(record) => {
|
||
return {
|
||
onClick: (event: React.MouseEvent<HTMLTableRowElement>) => {
|
||
event.stopPropagation();
|
||
// setPackSelectNo(record.packageInfoId)
|
||
setSelectedRowKeys([record.packageOrderId]);
|
||
setNowPackageName(record.packageName)
|
||
// setNowpackageInfoId(record.packageInfoId)
|
||
setNowpackageOrderId(record.packageOrderId)
|
||
},
|
||
style: { cursor: 'pointer' } // 鼠标显示为小手
|
||
};
|
||
}}
|
||
/>
|
||
<div style={{
|
||
display: 'flex',
|
||
justifyContent: 'flex-end',
|
||
marginTop: 10,
|
||
}}>
|
||
<Button onClick={() => {
|
||
setPackModal(false)
|
||
setNowPackageName('')
|
||
// setNowpackageInfoId('')
|
||
setNowpackageOrderId('')
|
||
}}>取消</Button>
|
||
<Button
|
||
style={{
|
||
marginLeft: 10
|
||
}}
|
||
type="primary"
|
||
onClick={() => {
|
||
if (!nowPackageName) {
|
||
messageApi.error('请选择套餐包')
|
||
return
|
||
}
|
||
// setPickSelectNo(nowPickSelectNo)
|
||
// setShowPrice(0)
|
||
setSelectPack(true)
|
||
setcouponShow(false)
|
||
// setPackageInfoId(nowpackageInfoId)
|
||
setPackageOrderId(nowpackageOrderId)
|
||
form.setFieldsValue({
|
||
packageName: nowPackageName
|
||
})
|
||
|
||
setPackModal(false)
|
||
}}>确定</Button>
|
||
</div>
|
||
</div>
|
||
</Modal>
|
||
<Modal title="推荐系统全称"
|
||
destroyOnClose
|
||
centered
|
||
open={recommendModal}
|
||
width={600}
|
||
|
||
footer={null}
|
||
onCancel={() => {
|
||
setRecommendModal(false)
|
||
|
||
}}>
|
||
<Spin tip="正在生成..." spinning={recommendLoading} >
|
||
<TextArea
|
||
placeholder='请简单介绍您想创建的系统，我们会根据您的描述为您推荐系统全称'
|
||
// 禁止下拉标
|
||
style={{
|
||
resize: 'none',
|
||
height: 133,
|
||
fontSize: 16,
|
||
padding: 20,
|
||
}}
|
||
// 回车事件
|
||
onKeyDown={(e) => {
|
||
if (e.keyCode == 13) {
|
||
// 禁止默认回车事件
|
||
e.preventDefault();
|
||
getRecommendList()
|
||
}
|
||
}}
|
||
onChange={(e) => {
|
||
// console.log(e.target.value);
|
||
setRecommendInput(e.target.value)
|
||
|
||
}}
|
||
/>
|
||
|
||
<div style={{
|
||
display: recommendList.length > 0 ? 'unset' : 'none',
|
||
}}>
|
||
<div style={{
|
||
marginTop: 10,
|
||
fontSize: 16,
|
||
fontWeight: 'bold',
|
||
}}>
|
||
根据描述为您推荐
|
||
</div>
|
||
<div
|
||
ref={recommendListRef}
|
||
style={{
|
||
|
||
display: 'flex',
|
||
alignItems: 'center',
|
||
flexDirection: 'column',
|
||
// background: 'pink',
|
||
paddingBottom: 10,
|
||
height: 300,
|
||
overflowY: 'scroll',
|
||
}}>
|
||
|
||
{
|
||
recommendList.map((item, index) => {
|
||
return (
|
||
<div key={index}
|
||
title={item}
|
||
style={{
|
||
fontSize: 18,
|
||
marginTop: 10,
|
||
cursor: 'pointer',
|
||
width: '100%',
|
||
background: '#F3F3F3',
|
||
padding: 10,
|
||
boxSizing: 'border-box',
|
||
textAlign: 'center',
|
||
// // 禁止换行 唱出部分用...代替
|
||
// whiteSpace: 'nowrap',
|
||
// overflowY: 'hidden',
|
||
// textOverflow: 'ellipsis',
|
||
// lineHeight: '20px',
|
||
}}
|
||
|
||
onClick={() => {
|
||
form.setFieldsValue({
|
||
projName: item
|
||
});
|
||
if (isEndsWithKeywords(item)) {
|
||
setShowTip(false);
|
||
} else {
|
||
setShowTip(true);
|
||
}
|
||
messageApi.success(`已选择${item}`);
|
||
setRecommendModal(false)
|
||
|
||
}}
|
||
>
|
||
{item}
|
||
</div>
|
||
)
|
||
})
|
||
|
||
}
|
||
</div>
|
||
</div>
|
||
<div style={{
|
||
// textAlign: 'right',
|
||
marginTop: 10,
|
||
// background: '#F3F3F3',
|
||
display: 'flex',
|
||
justifyContent: 'space-between',
|
||
alignItems: 'center',
|
||
|
||
}}>
|
||
<div style={{
|
||
fontSize: 16,
|
||
fontWeight: 'bold',
|
||
}}>
|
||
<div><span style={{
|
||
color: 'red',
|
||
}}>提问方式 ： 建筑</span> 行业方面的软件系统</div>
|
||
<div style={{
|
||
color:'#1677ff',
|
||
}}>请按以上方式提问，将“建筑”两字替换</div>
|
||
</div>
|
||
<Button type="primary"
|
||
style={{
|
||
width: 100,
|
||
|
||
}}
|
||
onClick={() => {
|
||
getRecommendList()
|
||
}}
|
||
>{
|
||
recommendList.length > 0 ? '换一批' : '生成'
|
||
}</Button>
|
||
</div>
|
||
|
||
</Spin>
|
||
|
||
</Modal>
|
||
<Spin tip="正在提交..." spinning={loading} fullscreen />
|
||
</>
|
||
)
|
||
} |