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, getSoftUrl } 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: any;
    coupon?: string;
    projVersion: string;
    backendCodeLang: string;
    envIndustry?: string
    packageName?: string
    projSubName?: 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 { state } = useLocation()
    const disable = state && state.type == 'copy' ? true : false
    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: '',
        projSubName: '',
        // 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 })));

            }
        })
        // console.log('嘻嘻嘻',state);
        if (state && state.type == 'copy') {
            // 给表单复值
            form.setFieldsValue({
                'projName': '嘻嘻嘻', //全称
                'contacts': '嘻嘻嘻',//联系人
            })
        }
    }, []);
    // 换名金额
    const [changePrice, setChangePrice] = useState(0)
    // 换名项目原名
    const [changeProjName, setChangeProjName] = useState('')
    // 获取项目信息
    const getProjInfo = (projId: string) => {
        get<any>({
            messageApi: messageApi,
            url: `/api/proj/get/${projId}`,
            onSuccess({ data }) {
                // console.log('项目信息', data);
                if (state.type == 'replace') {
                    setChangePrice(
                        data.pay.servicePackageId ? 0 : (data.pay.payment) / 100)
                }
                setChangeProjName(data.projName)
                // 给表单赋值
                form.setFieldsValue({
                    projName: state.type == 'replace' ? '' : data.projName, //全称
                    projSubName: data.apply.projSubName, //简称
                    projDevCompleteDate: data.apply.projDevCompleteDate ? dayjs(data.apply.projDevCompleteDate, 'YYYY-MM-DD') : '',
                    projVersion: data.apply.projVersion, //版本
                    backendCodeLang: data.apply.envLang,
                    belongPeople: data.apply.authorName,
                    contacts: data.apply.applyContactName,

                })
                setBelongPeopleInfo({
                    authorName: data.apply.authorName,
                    authorType: data.apply.authorType,
                    authorIdCardType: data.apply.authorIdCardType,
                    authorIdCard: data.apply.authorIdCard,
                    authorCrcAccount: data.apply.authorCrcAccount,
                    authorId: data.apply.authorId,
                    authorProvinceCity: data.apply.authorProvinceCity,
                    authorCrcAccountUsername: data.apply.authorCrcAccountUsername,
                    authorCrcAccountPassword: data.apply.authorCrcAccountPassword,
                })
                setConcatPeopleInfo({
                    applyConcatId: data.apply.applyContactId,
                    applyContactCsaNo: data.apply.applyContactCsaNo,
                    applyContactEmail: data.apply.applyContactEmail,
                    applyContactName: data.apply.applyContactName,
                    applyContactPhone: data.apply.applyContactPhone,
                    applyContactCompany: data.apply.applyContactCompany,
                })
            }
        })
    }
    useEffect(() => {
        if (state && state.projId) {
            getProjInfo(state.projId)
        }
    }, [])

    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) => {
                                // const modifiedProjName = formData.projName.replace(/'/g, '');
                                // console.log(modifiedProjName);
                                // const originalProjName = formData.projName;
                                // const modifiedProjName = originalProjName.replace(/'/g, '');

                                // if (originalProjName !== modifiedProjName) {
                                //     messageApi.open({
                                //         type: 'warning',
                                //         content: '禁止使用英文单引号，已去除',
                                //     });
                                //     form.setFieldsValue({ projName: modifiedProjName });
                                // }
                                // return


                                setIsCreateModalOpen(true);
                                setProjInfo({
                                    projName: formData.projName,
                                    // projName: modifiedProjName,
                                    projIntroduction: formData.projIntroduction,
                                    belongPeople: formData.belongPeople,
                                    contacts: formData.contacts,
                                    projDevCompleteDate: formData.projDevCompleteDate,
                                    projVersion: formData.projVersion ? formData.projVersion : 'V1.0',
                                    backendCodeLang: formData.backendCodeLang,
                                    projSubName: formData.projSubName ? formData.projSubName : '',
                                    // packageInfoId: formData.packageInfoId?formData.packageInfoId : '',
                                })
                            }}
                            autoComplete="off"
                        >
                            <div style={{
                                display: state && state.type == 'replace' ? 'unset' : 'none',
                            }}>
                                <div style={{
                                    width: 800,
                                    marginLeft: 130,
                                    display: 'flex',
                                    justifyContent: 'center',
                                    fontSize: 18,
                                    fontWeight: 'bold',
                                    textAlign: 'center',
                                }}>
                                    换名项目: {changeProjName}
                                </div>
                            </div>
                            <div style={{
                                display: state && state.type == 'copy' ? 'unset' : 'none',
                            }}>
                                <div style={{
                                    width: 800,
                                    marginLeft: 130,
                                    display: 'flex',
                                    justifyContent: 'center',
                                    fontSize: 18,
                                    fontWeight: 'bold',
                                }}>
                                    复制项目
                                </div>
                            </div>
                            <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: '请输入系统全称' },
                                            {
                                                max: 80,
                                                message: '系统全称不能超过80个字符'
                                            },
                                            {
                                                pattern: /^[^']*$/,  // 正则表达式：不包含任何英文单引号
                                                message: '系统全称禁止使用英文单引号(\')'
                                            }

                                        ]}
                                    // normalize={(value) => value?.replace(/'/g, '') || ''}
                                    // normalize={(value) => value?.replace(/['"]/g, '') || ''}

                                    >

                                        <AutoComplete

                                            className='changeStyle'
                                            allowClear
                                            style={{
                                                // background: '#eeeeee',
                                                // fontSize: '16px',
                                                width: '780px',
                                                height: '42px',
                                            }}
                                            placeholder="请输入系统全称 (注：系统全称建议以“软件”、“系统”、“平台”或“APP”结尾)"
                                            options={selectList}
                                            onSearch={(value) => {
                                                // setProjNameValue(value);
                                                // 先检查基础规则是否通过
                                                const isBasicValid = value
                                                    && value.length <= 80
                                                    && !/'/.test(value);

                                                if (isBasicValid) {
                                                    // 基础规则通过后，再检查尾部关键词
                                                    setShowTip(!isEndsWithKeywords(value));
                                                } 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([])
                                                }
                                            }}
                                            disabled={disable}
                                        />

                                    </Form.Item>

                                </div>
                                <a

                                    onClick={() => {
                                        // form.setFieldsValue({
                                        //     projName: '嘻嘻'
                                        // });
                                        setRecommendModal(true)
                                        setRecommendList([])
                                    }}
                                    style={{
                                        position: 'absolute',
                                        right: -35,
                                        top: 10,
                                        display: disable ? 'none' : 'unset',
                                    }}>推荐</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'>
                                    <div className='formItem-title oneTitle'>系统简称</div>
                                    <Form.Item<ProjInfo>
                                        name="projSubName"
                                        rules={[
                                            { required: false, message: '请输入系统简称' },
                                            {
                                                validator: async (_, value) => {
                                                    // 获取系统全称的值
                                                    const projName = await form.getFieldValue('projName');

                                                    // 如果系统简称和全称都存在，验证长度
                                                    if (value && projName) {
                                                        if (value.length > projName.length) {
                                                            return Promise.reject(new Error('系统简称长度不能大于系统全称'));
                                                        }
                                                    }
                                                    return Promise.resolve();
                                                }
                                            }

                                        ]}
                                    >
                                        <Input
                                            disabled={disable}
                                            style={{ width: '310px', height: '42px', color: '#3B3B3B' }} placeholder="请输入系统简称" />


                                    </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')}
                                            disabled={disable}
                                        />
                                    </Form.Item>
                                </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={{
                                            width: '310px', height: '42px',
                                            // color: '#3B3B3B'
                                        }} placeholder="请选择/创建知识产权所属者"
                                            disabled={disable}
                                        />

                                    </Form.Item>

                                    <div style={{
                                        display: disable ? 'none' : 'unset',
                                    }}>
                                        <div style={{
                                            display: belongPeopleInfo.authorId ? 'none' : 'unset',
                                            position: 'absolute', right: 0,
                                            // fontSize: 16,
                                            color: " #1F79FF", cursor: 'pointer',
                                            // background:'pink',
                                            width: 310,
                                            textAlign: 'right',
                                            paddingRight: 20,
                                            boxSizing: 'border-box',
                                        }} onClick={() => {
                                            setBelongModal(true)
                                        }}>选择</div>
                                        <div style={{
                                            display: belongPeopleInfo.authorId ? 'unset' : 'none',

                                            position: 'absolute', right: 0,
                                            // fontSize: 16,
                                            color: " #1F79FF",
                                            // cursor: 'pointer',
                                            // background:'pink',
                                            width: 310,

                                            paddingRight: 20,
                                            boxSizing: 'border-box',

                                        }} >
                                            <div
                                                style={{
                                                    // background: 'pink',
                                                    width: 50,
                                                    textAlign: 'center',
                                                    // paddingRight: 20,
                                                    marginLeft: 250,
                                                    cursor: 'pointer',
                                                }}
                                                onClick={() => {
                                                    setValue('')
                                                    setBelongPeopleInfo({
                                                        authorName: '',
                                                        authorType: '',
                                                        authorIdCardType: '',
                                                        authorIdCard: '',
                                                        authorCrcAccount: 0,
                                                        authorId: '',
                                                        authorProvinceCity: '',
                                                        authorCrcAccountUsername: '',
                                                        authorCrcAccountPassword: '',
                                                    })
                                                }}>取消</div>
                                        </div>
                                    </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={disable} />

                                    </Form.Item>
                                    <div style={{
                                        display: disable ? 'none' : 'unset',
                                    }}>
                                        <div style={{
                                            position: 'absolute', right: 0,
                                            // fontSize: 16,
                                            color: " #1F79FF", cursor: 'pointer',
                                            // background:'pink',
                                            width: 310,
                                            textAlign: 'right',
                                            paddingRight: 20,
                                            boxSizing: 'border-box',

                                        }} onClick={() => {
                                            setConcatModal(true)
                                        }}>选择</div>
                                    </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
                                            disabled={disable}
                                            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
                                            disabled={disable}
                                            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 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 style={{
                                display: state && state.type == 'replace' ? 'none' : 'unset',
                            }}>
                                <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 ? '请选择优惠券' : '暂无可用优惠券'} />

                                            </Form.Item>
                                            <div style={{
                                                display: couponId ? 'none' : 'unset',
                                                position: 'absolute', right: 0,
                                                // fontSize: 16,
                                                color: " #1F79FF", cursor: 'pointer',
                                                // background:'pink',
                                                width: 310,
                                                textAlign: 'right',
                                                paddingRight: 20,
                                                boxSizing: 'border-box',
                                            }} 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: 0,
                                                // fontSize: 16,
                                                color: " #1F79FF",
                                                // cursor: 'pointer',
                                                // background:'pink',
                                                width: 310,

                                                paddingRight: 20,
                                                boxSizing: 'border-box'
                                            }} >
                                                <div
                                                    style={{
                                                        // background: 'pink',
                                                        width: 50,
                                                        textAlign: 'center',
                                                        // paddingRight: 20,
                                                        marginLeft: 250,
                                                        cursor: 'pointer',
                                                    }}
                                                    onClick={() => {
                                                        setCouponTitle('')
                                                        setCouponId('')
                                                        setCouponNum(0)
                                                    }} >取消</div>
                                            </div>
                                        </div>
                                    </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: 0,
                                                        // fontSize: 16,
                                                        color: " #1F79FF", cursor: 'pointer',
                                                        // background:'pink',
                                                        width: 310,
                                                        textAlign: 'right',
                                                        paddingRight: 20,
                                                        boxSizing: 'border-box',
                                                    }}
                                                    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: 0,
                                                    // fontSize: 16,
                                                    color: " #1F79FF",
                                                    // cursor: 'pointer',
                                                    // background:'pink',
                                                    width: 310,

                                                    paddingRight: 20,
                                                    boxSizing: 'border-box',
                                                }}

                                                >
                                                    <div
                                                        style={{
                                                            // background: 'pink',
                                                            width: 50,
                                                            textAlign: 'center',
                                                            // paddingRight: 20,
                                                            marginLeft: 250,
                                                            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>
                            </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(getSoftUrl())
                                        }}>《软件委托开发协议》</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} */}
                                            {state && state.type == 'replace' ? changePrice : selectPack ? 0 : (chargePrice / 100 - couponNum) < 0 ? 0 : chargePrice / 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);
                    if (state && state.type == 'replace') {
                        console.log(concatPeopleInfo);
                        // return

                        post<any>({
                            messageApi,
                            url: `/api/proj/rename/proj-id/${state.projId}`,
                            body: {
                                // packageInfoId: projInfo.packageInfoId,
                                projName: projInfo.projName,
                                projSubName: projInfo.projSubName,
                                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 }) {
                                // console.log(data);
                                // return

                                setIsEditModalOpen(true);
                                setCreateProjId(data.data);
                                reloadUser(messageApi, globalDispatchContext).then(() => {
                                    messageApi.success('扣款成功');
                                });
                                getMyPackNum()
                            },
                            onFinally() {
                                setLoading(false);
                            }
                        })
                    }
                    else if (state && state.type == 'copy') {
                        post<any>({
                            messageApi,
                            url: `/api/proj/copy/proj-id/${state.projId}`,
                            body: {
                                // packageInfoId: projInfo.packageInfoId,
                                // projName: projInfo.projName,
                                // projSubName: projInfo.projSubName,
                                // 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 }) {
                                // console.log(data);
                                // return

                                setIsEditModalOpen(true);
                                setCreateProjId(data.data);
                                reloadUser(messageApi, globalDispatchContext).then(() => {
                                    messageApi.success('扣款成功');
                                });
                                getMyPackNum()
                            },
                            onFinally() {
                                setLoading(false);
                            }
                        })
                    }
                    else {
                        post<any>({
                            messageApi,
                            url: '/api/proj/create',
                            body: {
                                // packageInfoId: projInfo.packageInfoId,
                                projName: projInfo.projName,
                                projSubName: projInfo.projSubName,
                                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}
                     */}
                    {state && state.type == 'replace' ? changePrice : 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 />
        </>
    )
}