This commit is contained in:
lyp 2025-08-28 17:17:33 +08:00
parent 630ce73deb
commit 7d670ba2d6
10 changed files with 698 additions and 3 deletions

View File

@ -34,6 +34,11 @@ import line from '../../static/Phone/line.png'
import pack from '@theme/img/pack.png'
import PackAgeModal from '../../components/PackageModal/PackageModal.tsx'
import active from '../../static/active.gif'
import qusetionImg from '../../static/aiUse/qusetion.png'
import yesImg from '../../static/aiUse/yes.png'
import noImg from '../../static/aiUse/no.png'
import tipImg from '../../static/aiUse/tip.png'
// import pack from '@theme/pack.png'
// import type { TableProps, FormProps } from 'antd';
// interface DataType {
@ -124,7 +129,8 @@ import active from '../../static/active.gif'
// },
// ];
import { DownOutlined, UserOutlined, QuestionCircleOutlined, BellOutlined, KeyOutlined, LogoutOutlined, GiftOutlined, AccountBookOutlined, ContainerOutlined, MenuFoldOutlined, UsergroupAddOutlined, TableOutlined } from "@ant-design/icons";
import { DownOutlined, UserOutlined, QuestionCircleOutlined, BellOutlined, KeyOutlined, LogoutOutlined, GiftOutlined, AccountBookOutlined, ContainerOutlined, MenuFoldOutlined, UsergroupAddOutlined, TableOutlined, UpOutlined } from "@ant-design/icons";
import {
useContext, useEffect, useState,
useRef
@ -158,7 +164,228 @@ import NoticeModal from '../../components/NoticeModal/NoticeModal.tsx';
// } from 'antd';
// import { log } from 'console';
// import HeadCouponModal from '../../components/CouponModal/HeadCouponModal.tsx'
import aiUseNameBg from '../../static/aiUse/useNameback.png'
import closeImg from '../../static/aiUse/close.png'
import searchImg from '../../static/aiUse/search.png'
export default function Head() {
const aiNameArray = [
// {
// key:'',
// name: '',
// title: '',
// text: '',
// example: [
// {
// icon: '',
// title: '',
// text: ''
// }
// ]
// },
{
key: '1',
name: '字数要求',
title: '软著名称的字数要求是什么?',
text: '软著名称需要控制在8-30个汉字之间。过短的名称无法准确描述软件功能过长的名称不便于管理和使用。',
example: [
{
icon: 'yes',
title: '智能客户关系管理系统',
text: '10个汉字'
},
{
icon: 'no',
title: 'CRM系统',
text: '3个汉字过短'
},
{
icon: 'no',
title: '基于人工智能和大数据技术的企业级客户关系管理与营销自动化综合业务处理系统',
text: '35个汉字过长'
}
]
},
{
key: '2',
name: '结尾词规范',
title: '软著名称必须以什么词汇结尾?',
text: `软著名称应该以'软件'、'系统'、'平台'、'APP软件'、'APP'或'小程序软件'等词汇结尾,明确标识这是一个软件作品。`,
example: [
{
icon: 'yes',
title: '在线教育管理系统',
text: ''
},
{
icon: 'yes',
title: '电商交易平台',
text: ''
},
{
icon: 'yes',
title: '移动支付APP软件',
text: ''
},
{
icon: 'no',
title: '智能客服助手',
text: '缺少规范结尾词'
},
]
},
{
key: '3',
name: '品牌名称',
title: '软著名称可以包含品牌名吗?',
text: '如果软著名称包含品牌名、商标名或公司名,可能需要提供相应的商标注册证明或授权文件。建议使用通用性描述,避免特定品牌词汇。',
example: [
{
icon: 'tip',
title: '微信小程序开发平台',
text: `包含'微信'品牌名`,
},
{
icon: 'yes',
title: '社交小程序开发平台',
text: '使用通用描述'
},
]
},
{
key: '4',
name: '广告法限制',
title: '哪些词汇可能违反广告法?',
text: `避免使用绝对化、最高级的表述,如'国家级'、'世界级'、'第一'、'唯一'、'最佳'、'最强'、'完美'、'极致'等词汇。这些词汇可能违反广告法相关规定。`,
example: [
{
icon: 'no',
title: '全国最强的财务管理系统',
text: ''
},
{
icon: 'no',
title: '世界顶级的AI智能平台',
text: ''
},
{
icon: 'yes',
title: '高效财务管理系统',
text: ''
},
{
icon: 'yes',
title: '智能化业务处理平台',
text: ''
},
]
},
{
key: '5',
name: '政府机构词汇',
title: '可以使用政府相关的词汇吗?',
text: `不建议直接使用'全国'、'中国'、'国家'、'市政'、'国际'等政府机构或官方属性词汇,除非有相关资质证明。建议使用中性化的表述。`,
example: [
{
icon: 'tip',
title: '全国统一税务管理系统',
text: ''
},
{
icon: 'tip',
title: '中国智慧城市平台',
text: ''
},
{
icon: 'yes',
title: '企业税务管理系统',
text: ''
},
{
icon: 'yes',
title: '智慧城市解决方案平台',
text: ''
},
]
},
{
key: '6',
name: '特殊行业',
title: '涉及特殊行业需要注意什么?',
text: `如果软著名称涉及金融、医疗、教育、游戏、直播等特殊行业,可能需要提供相应的行业资质证明文件,如支付许可证、医疗器械许可、办学许可证、游戏版号等。`,
example: [
{
icon: 'tip',
title: '互联网医院诊疗系统',
text: '需要医疗资质'
},
{
icon: 'tip',
title: '在线支付交易平台',
text: '需要支付许可'
},
{
icon: 'tip',
title: '网络游戏运营系统',
text: '需要游戏版号'
},
{
icon: 'tip',
title: 'K12在线教育平台',
text: '需要办学许可'
},
]
},
{
key: '7',
name: 'AI相关',
title: 'AI相关的软著名称有什么要求',
text: `AI、人工智能、机器学习、深度学习等相关词汇属于特殊技术领域可能需要提供相应的技术资质或说明文件。建议明确具体的应用场景。`,
example: [
{
icon: 'tip',
title: '通用人工智能系统',
text: '范围过于宽泛'
},
{
icon: 'yes',
title: '客服机器人智能问答系统',
text: ''
},
{
icon: 'yes',
title: '图像识别算法应用平台',
text: ''
},
]
},
{
key: '8',
name: '常见问题',
title: '如何提高软著名称通过率?',
text: '1、确保字数在8-30个汉字2、使用规范结尾词3、避免品牌名和极端词汇4、明确描述软件功能5、如涉及特殊行业准备相关资质文件。',
example: [
{
icon: 'yes',
title: '企业人力资源管理系统',
text: ''
},
{
icon: 'yes',
title: '移动端商品展示APP软件',
text: ''
},
{
icon: 'yes',
title: '在线文档协作平台',
text: ''
},
]
},
]
const dispath = useDispatch()
@ -1304,6 +1531,61 @@ export default function Head() {
]
// Ai预审软件名称工具弹窗-------------------------------------------------------------------------
const [aiUseNameModal, setAiUseNameModal] = useState(false)
const [componentKey, setComponentKey] = useState(1); // 控制组件重新加载的 key
const [aiUseName, setAiUseName] = useState('') // 软件名称
const [clostNameExampleArray, setClostNameExampleArray] = useState<any[]>([])
// 初始化Ai预审软件名称工具弹窗
const initAiUseNameModal = () => {
setClostNameExampleArray([])
setComponentKey(1)
setAiUseName('')
}
const [aiUseNameSpin, setAiUseNameSpin] = useState(false)
const [useShow, setUseShow] = useState(false)
const useShowRef = useRef<HTMLDivElement>(null);
const useItem: MenuProps['items'] = [
{
key: '1',
label: (
<div className="dropdown-item">
{/* <UserOutlined /> */}
<div
>Ai预审软件名称</div>
<div style={{
color: '#999',
fontSize: 12,
}}
></div>
</div>
),
onClick: () => {
// setUseModal(true)
setAiUseNameModal(true)
setComponentKey(0)
}
},
{
key: '2',
label: (
<div className="dropdown-item">
{/* <UserOutlined /> */}
<div
>AI软著矩阵规划</div>
<div style={{
color: '#999',
fontSize: 12,
}}
>AI生成软善项目矩阵</div>
</div>
),
onClick: () => {
}
},
];
return (
<>
@ -1338,12 +1620,27 @@ export default function Head() {
})
dispath({
type: 'onClickActivity',
val: !clickActivity,
val: !clickActivity,
})
}}
>
<img src={active} alt="" height={36} />
</div>
<div style={{ display: 'flex', alignContent: 'center', padding: '0', cursor: 'pointer', marginRight: 20 }}>
<Dropdown menu={{ items: useItem }}>
<Space>
<span style={{
// color: 'var(--color-kefu)',
}}></span>
<DownOutlined style={{
// color: 'var(--color-kefu)',
}} />
</Space>
</Dropdown>
</div>
<div className='kf' onClick={() => {
setkfModal(true)
}}>
@ -2467,6 +2764,338 @@ export default function Head() {
</Spin>
</Modal> */}
{/* <Modal open={useModal}
centered
title="Ai预审软件名称"
width={1000}
footer={false}
onCancel={() => setUseModal(false)}
destroyOnClose
>
<Spin tip="Ai预审软件名称中..." spinning={useSpin}>
<div style={{
height: 600,
background: 'skyblue',
overflowY: 'auto',
}}>
<div style={{
height: 300,
background: 'pink',
}}></div>
<Button onClick={() => {
setUseSpin(true)
setTimeout(() => {
setUseSpin(false)
setUseShow(true)
message.success('生成成功')
setTimeout(() => {
useShowRef.current?.scrollIntoView({ behavior: 'smooth', block: 'start' });
}, 10);
}, 3000)
}}> Ai预审软件名称</Button>
<div
ref={useShowRef}
style={{
height: 500,
background: 'red',
display: useShow ? 'block' : 'none'
}}>
</div>
<div style={{
height: 500,
background: 'yellow',
}}>
</div>
</div>
</Spin>
</Modal> */}
<div style={{
width: '100vw',
height: '100vh',
position: 'fixed',
top: 0,
left: 0,
background: 'rgba(0,0,0,0.5)',
display: aiUseNameModal ? 'block' : 'none',
zIndex: 101,
}}
key={componentKey} >
<div style={{
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
width: '100vw',
height: '100vh',
}}>
<div
style={{
width: '1000px',
height: '700px',
background: '#FFFAF3',
overflowY: 'auto',
borderRadius: 10,
// backgroundImage: `url(${aiUseNameBg})`,
// backgroundSize: '100% 400px',
backgroundRepeat: 'no-repeat',
position: 'relative',
}}>
<div style={{
position: 'sticky',
top: 20,
right: 20,
cursor: 'pointer',
float: 'right',
zIndex: 10,
}}
title='关闭'
onClick={() => {
setAiUseNameModal(false)
initAiUseNameModal()
}}
>
<img src={closeImg} width={18} height={18} alt="" />
</div>
<div style={{
width: '100%',
height: '340px',
backgroundImage: `url(${aiUseNameBg})`,
backgroundSize: '100% 400px',
backgroundRepeat: 'no-repeat',
paddingTop: 200,
boxSizing: 'border-box',
}}>
<div style={
{
padding: '0 100px',
boxSizing: 'border-box',
// marginTop: 200,
}
}>
<div style={{
width: '100%',
height: 120,
background: 'white',
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
borderRadius: 10,
}}>
<Input style={{
width: '500px',
height: 50,
fontSize: 18,
border: '2px solid #FFDAB6',
borderRadius: 8,
// outline: 'none',
padding: '0 20px',
boxSizing: 'border-box',
transition: 'border-color 0.2s',
}}
value={aiUseName}
onChange={(e) => {
setAiUseName(e.target.value)
}}
placeholder='请输入您的软件名称'
allowClear
></Input>
<Button style={{
width: 150,
height: 50,
background: '#FC971C',
color: '#fff',
fontSize: 18,
borderRadius: 10,
marginLeft: 20,
}}
onClick={() => {
if (aiUseName) {
setTimeout(() => {
setUseShow(true)
message.success('生成成功')
setTimeout(() => {
useShowRef.current?.scrollIntoView({ behavior: 'smooth', block: 'start' });
}, 10);
}, 3000)
}else{
message.error('请输入软件名称')
}
}}
>
<img src={searchImg} alt="" width={18} height={20} /></Button>
</div>
</div>
</div>
<div style={
{
padding: '0 100px 20px 100px',
boxSizing: 'border-box',
// marginTop: 200,
}
}>
<div style={{
height: 20,
marginTop: -20,
}}
ref={useShowRef}
>
</div>
<div className='aiUseNameResultBox'
style={{
display: useShow ? 'block' : 'none'
}}
>111</div>
<div className='aiUseNameQusetionBox'>
<div style={{
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center',
}}>
<div style={{
fontSize: 18,
display: 'flex',
alignItems: 'center',
fontWeight: 700,
}}>
<img src={qusetionImg} width={15} height={16} alt="" style={{
marginTop: 5,
marginRight: 5,
}} />
</div>
<div style={{
color: '#929292',
}}>
</div>
</div>
{
// 循环aiNameArray这个数组
aiNameArray.map((item) => {
return (
<div className='aiUseNameQusetion' key={item.key}>
<div style={{
// background:'red',
cursor: 'pointer'
}}
onClick={() => {
// 查询clostNameExampleArray这个数组中是否有item.key 如果有的话从这个数组去除 如果没有的话加入这个数组
setClostNameExampleArray(prev => {
if (prev.includes(item.key)) {
// 已存在则移除
return prev.filter(exampleArrayItem => exampleArrayItem !== item.key);
} else {
// 不存在则添加
return [...prev, item.key];
}
});
}}
>
<div className='aiUseNameQusetionTop'>
<div style={{
display: 'flex',
alignItems: 'center',
}}>
<div className='aiUseNameQusetionLabel'>{item.name}</div>
<div className='aiUseNameQusetionContent'>{item.title}</div>
</div>
<div style={{
color: '#A9A9A9'
}}>
{
clostNameExampleArray.includes(item.key) ?
<DownOutlined /> : <UpOutlined />
}
</div>
</div>
<div className='aiUseNameQusetionCen'>{item.text}</div>
</div>
<div style={{
display: clostNameExampleArray.includes(item.key) ? 'none' : 'unset',
}}>
<div className='aiUseNameQusetionBot'>
<div></div>
{
item.example.map((exampleItem, index) => {
return (
<div className='aiUseNameQusetionItem' key={index}>
<div className='aiUseNameQusetionDian'>
</div>
<div className='aiUseNameQusetionIcon' >
<img src={
exampleItem.icon == 'yes' ?
yesImg :
exampleItem.icon == 'no' ?
noImg :
exampleItem.icon == 'tip' ?
tipImg : ''
} width={18} height={18} alt="" />
</div>
<div className='aiUseNameQusetionTitle'>
{exampleItem.title}
</div>
<div className='aiUseNameQusetionText' style={{
display: exampleItem.text ? 'unset' : 'none',
color: exampleItem.icon == 'yes' ? '#51CF66' :
exampleItem.icon == 'no' ? '#E02D2D' :
exampleItem.icon == 'tip' ? '#ffae00ff' : '',
}}>
{`${exampleItem.text}`}
</div>
</div>
)
})
}
</div>
</div>
</div>
)
})
}
</div>
</div>
</div>
</div>
</div>
<Spin tip="正在提交..." spinning={loading} fullscreen />
{contextHolder}
{modalHolder}

View File

@ -449,7 +449,7 @@
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
align-items: center;
}
.phoneTitle {
@ -489,5 +489,71 @@
cursor: pointer;
}
.aiUseNameQusetionBox {
padding: 20px;
box-sizing: border-box;
background-color: white;
border-radius: 10px;
}
.aiUseNameResultBox {
padding: 20px;
box-sizing: border-box;
background-color: white;
border-radius: 10px;
margin-bottom: 20px;
}
.aiUseNameQusetion {
padding: 10px;
box-sizing: border-box;
margin-top: 15px;
background: #F6F6F6;
}
.aiUseNameQusetionDian {
width: 5px;
height: 5px;
background: #373737;
border-radius: 50%;
margin-right: 10px;
}
.aiUseNameQusetionTop {
display: flex;
align-items: center;
justify-content: space-between;
}
.aiUseNameQusetionCen {
margin-top: 10px;
}
.aiUseNameQusetionBot {
margin-top: 10px;
padding: 10px;
box-sizing: border-box;
background-color: white;
}
.aiUseNameQusetionItem {
display: flex;
margin-top: 10px;
align-items: center;
}
.aiUseNameQusetionLabel {
background-color: #FFC573;
padding: 2px 10px;
}
.aiUseNameQusetionContent {
font-size: 18px;
margin-left: 10px;
font-weight: 700;
}
.aiUseNameQusetionIcon {
margin-right: 10px;
margin-top: 3px;
}

BIN
src/static/aiUse/close.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
src/static/aiUse/lamp.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

BIN
src/static/aiUse/no.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 868 B

BIN
src/static/aiUse/search.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 KiB

BIN
src/static/aiUse/tip.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 MiB

BIN
src/static/aiUse/yes.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB