暂存

src/components/BelongPeople/BelongPeople.tsx

@@ -68,7 +68,7 @@ type propsInfo = {
     showNow?: boolean
 };
 export default function BelongPeople(props: propsInfo) {
-    const showNow = props.showNow == false?false:true
+    const showNow = props.showNow == false ? false : true
     // const [propsShow,setPropsShow] = useState(props.belongPeopleInfo.authorId?true)
     // const nav = useNavigate();
     // const pathParams = useParams();
@@ -418,8 +418,8 @@ export default function BelongPeople(props: propsInfo) {
         });
         // console.log('嘻嘻嘻',props.showNow);
         // console.log(showNow);
-        
+
-        
+
     }, [])
 
     return (
@@ -533,7 +533,7 @@ export default function BelongPeople(props: propsInfo) {
                                         </div> */}
                                     </div>
                                     <div style={{
-                                        display:showNow? 'unset' : 'none',
+                                        display: showNow ? 'unset' : 'none',
                                     }}>
                                         <div className='showInfo' style={{ display: props.isShow ? 'block' : 'none' }} >
                                             {authorName ? (<>
@@ -969,6 +969,7 @@ export default function BelongPeople(props: propsInfo) {
 
                 {/* 选择创建/编辑/查看所属者弹框  */}
                 <Modal
+                    centered
                     destroyOnClose
                     okText="确认"
                     // cancelText="取消"

src/request/api.ts

@@ -163,4 +163,34 @@ export const uploadMaterial = (appOrderId:any,params:any) => aiShopRequest.post(
 // 第四步 提交审核
 export const submitapp = (appOrderId:any) => aiShopRequest.post(`/aishop/api/apporder/update/sub-check/${appOrderId}`)
 
-// ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
+// ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
+
+
+
+//商标申请接口 ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
+// 获取展示价格列表
+export const trademarkGoodsList = () => aiShopRequest.get(`/aishop/api/trademark/money-list`)
+// 商标申请数据分页列表
+export const trademarkList = (params:any) => aiShopRequest.get(`/aishop/api/trademark/listpage`, { params })
+// 根据id获取商标详情
+export const trademarkDetail = (trademarkId:any) => aiShopRequest.get(`/aishop/api/trademark/get/${trademarkId}`)
+// 智能申请注册 
+// 第一步 填写基本信息(如果传递trademarkId则为修改，否则为新增)
+export const trademarkBaseInfo = (params:any) => aiShopRequest.post(`/aishop/api/trademark/save1`,params)
+// ai生成商标图片
+export const aiGenerateImage = (params:any) => aiShopRequest.get(`/aishop/api/trademark/text-image`,{params})
+// 下载授权书模板
+export const downloadAuthBook = () => aiShopRequest.get(`/aishop/api/assets/template/%E6%8E%88%E6%9D%83%E4%B9%A6%E6%A8%A1%E6%9D%BF.zip`)
+// 第二步相关
+// 获取选择商标类型
+export const trademarkTypeList = () => aiShopRequest.get(`/aishop/api/trademarktype/ztree/0`)
+// 第二步选择商标类别提交
+export const uptrademarkList = (trademarkId:any,params:any) => aiShopRequest.post(`/aishop/api/trademark/save2/${trademarkId}`,params)
+
+
+
+
+
+
+// ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
+

src/request/request.ts

@@ -196,6 +196,12 @@ export const downloadInvoice = (id: string) => {
 export const showImage = (fileId: string, isDownload?: boolean) => {
     return `${aiShopBaseUrl}/aishop/route/file/download/${isDownload == false}/${fileId}`  
 }
+
+//下载授权声明书模板 (商标用)
+export const downloadAuthBookUrl = () => {
+    return `${aiShopBaseUrl}/aishop/assets/template/%E6%8E%88%E6%9D%83%E4%B9%A6%E6%A8%A1%E6%9D%BF.zip`
+}
+
 // 上传图片 买卖功能
 export const uploadImageUrl = () => {
     return `${aiShopBaseUrl}/aishop/api/file/v2/upload-image`
@@ -210,4 +216,12 @@ export const uploadImageUrl = () => {
 export const uploadFileUrl = () => {
     return `${aiShopBaseUrl}/aishop/api/file/v2/upload-file`
 }
-export { request,aiShopRequest,phoneRequest,newRequest};
+export const uploadDeputeFileUrl  = (type:string) => {
+    return `${aiShopBaseUrl}/aishop/api/trademark/upload-depute-file?type=${type}`
+}
+// 上传图片 家条件 限制大小等 name="file"
+export const uploadImageAddUrl = () => {
+     return `${aiShopBaseUrl}/aishop/api/trademark/upload-file`
+}
+
+export { request,aiShopRequest,phoneRequest,newRequest};

src/route/AppElectron/AppEdit.tsx

@@ -115,7 +115,7 @@ export default function AppEdit() {
     // }
 
     const [loading, setLoading] = useState(false);
-    const [editProcess, setEditProcess] = useState(1);
+    const [editProcess, setEditProcess] = useState(0);
     // 企业/机构认证
     const [companyInfo, setCompanyInfo] = useState<any>({
         companyName: '', // 企业名称

src/route/AppElectron/app-edit.css

@@ -19,6 +19,7 @@
     display: flex;
     align-items: center;
     /* cursor: pointer; */
+    /* background-color: pink; */
 }
 
 .editProcessNum {

src/route/TrademarkMall/TrademarkAiEdit.tsx

@@ -1,4 +1,4 @@
-import { useState } from 'react'
+import { useState, useEffect } from 'react'
 import './trademark-edit.css'
 import {
     RightOutlined
@@ -9,150 +9,237 @@ import EditThree from './components/EditThree/EditThree';
 import EditFour from './components/EditFour/EditFour';
 import EditFive from './components/EditFive/EditFive';
 import EditSix from './components/EditSix/EditSix';
+import { useLocation, useParams } from 'react-router-dom';
+import { trademarkDetail, } from '../../request/api'
+import {
+    message, Spin
+} from 'antd';
 export default function TrademarkAiEdit() {
+    const pathParams = useParams();
+    // const trademarkId = pathParams.trademarkId == 'NEW'?'':pathParams.trademarkId;
+    const [trademarkId, setTrademarkId] = useState(pathParams.trademarkId == 'NEW' ? '' : pathParams.trademarkId)
+    const { state } = useLocation()
+    const [messageApi, contextHolder] = message.useMessage();
     const height = window.innerHeight - 180;
-    const [editProcess, setEditProcess] = useState(2);
+    const [editProcess, setEditProcess] = useState(0);
+    const [editOneData, setEditOneData] = useState<any>({
+        trademarkType: '', //商标类型 text 文字 image 图形 text-image 图文
+        trademarkName: '', //商标名称
+        trademarkDescription: '', //商标描述
+        trademarkFile: '', //商标文件
+        trademarkPhotoType: '', //商标图样类型 1 自动生成 2 手动上传
+        trademarkPhoto: '', //商标图样
+
+    })
+    const [editTwoArray, setEditTwoArray] = useState<any>([])
+    // const [trademarkId, setTrademarkId] = useState(state.trademarkId?state.trademarkId:'');
+    const [loading, setLoading] = useState(false)
+    const getTrademarkDetail = async (trademarkId: string) => {
+        try {
+            setLoading(true)
+            const res: any = await trademarkDetail(trademarkId)
+            console.log('详情', res);
+            setEditProcess(res.trademarkProgress + 1)
+            setEditOneData({
+                trademarkType: res.trademarkType, //商标类型 text 文字 image 图形 text-image 图文
+                trademarkName: res.trademarkName, //商标名称
+                trademarkDescription: res.trademarkDescription, //商标描述 
+                trademarkFile: res.trademarkFile, //商标文件
+                trademarkPhotoType: res.trademarkPhotoType, //商标图样类型 1 自动生成 2 手动上传
+                trademarkPhoto: res.trademarkPhoto, //商标图样
+            })
+            setEditTwoArray(res.trademarkTypeIds)
+
+        } catch (error: any) {
+            setLoading(false)
+            if (error.response) {
+                const data = error.response.data;
+                messageApi.open({
+                    type: 'error',
+                    content: data.msg ? data.msg : `${data.path}(${data.status})`,
+                });
+            } else {
+                console.error(error)
+            }
+        } finally {
+            setLoading(false)
+        }
+    }
+
+
+    useEffect(() => {
+
+
+        console.log('state', state);
+        console.log('trademarkId', trademarkId);
+        // console.log('trademarkId', trademarkId); 
+        // console.log('trademarkId', state.trademarkId);
+        // 如果存在id则为编辑状态，否则为新建状态 获取到第几步和详情数据
+        if (trademarkId) {
+            // setEditProcess(4)
+            getTrademarkDetail(trademarkId)
+        } else {
+            setEditProcess(1)
+        }
+    }, [])
+    // const clickProcess = (index: number) => {
+    //         setEditProcess(index)
+    // }
     return (
-        <div className='trademarkAiBox' style={{ height: `${height}px`, overflow: 'auto' }}>
+        <Spin tip="加载中请稍后..." size="small" spinning={loading}>
-            <div className='editProcessBox' style={{
+            <div className='trademarkAiBox' style={{ height: `${height}px`, overflow: 'auto' }}>
-                marginBottom: 20
+                {contextHolder}
-            }}>
+                <div className='editProcessBox' style={{
-                <div className='editProcess' >
+                    marginBottom: 20
-                    <div className='editProcessNum'
+                }}>
-                        style={{
+                    <div className='editProcess' >
-                            background: editProcess >= 1 ? '#3B60E8' : '',
+                        <div className='editProcessNum'
-                            color: editProcess >= 1 ? '#fff' : '#B1B1B1',
+                            style={{
-                            borderColor: editProcess >= 1 ? '' : '#B1B1B1'
+                                background: editProcess >= 1 ? '#3B60E8' : '',
-                        }}
+                                color: editProcess >= 1 ? '#fff' : '#B1B1B1',
-                    >1</div>
+                                borderColor: editProcess >= 1 ? '' : '#B1B1B1'
-                    <div className='editProcessTitle'
+                            }}
-                        style={{
+                        >1</div>
-                            color: editProcess >= 1 ? '#353535' : '#878787',
+                        <div className='editProcessTitle'
-                            fontWeight: editProcess >= 1 ? 'bold' : 'normal'
+                            style={{
-                        }}
+                                color: editProcess >= 1 ? '#353535' : '#878787',
-                    >填写基础信息</div>
+                                fontWeight: editProcess >= 1 ? 'bold' : 'normal'
+                            }}
+                        >填写基础信息</div>
+                    </div>
+                    <div className='editright' onClick={() => {
+                        setEditProcess(2)
+                    }}><RightOutlined /></div>
+                    <div className='editProcess' >
+                        <div className='editProcessNum' style={{
+                            background: editProcess >= 2 ? '#3B60E8' : '',
+                            color: editProcess >= 2 ? '#fff' : '#B1B1B1',
+                            borderColor: editProcess >= 2 ? '' : '#B1B1B1'
+                        }}>2</div>
+                        <div className='editProcessTitle'
+                            style={{
+                                color: editProcess >= 2 ? '#353535' : '#878787',
+                                fontWeight: editProcess >= 2 ? 'bold' : 'normal'
+                            }}
+                        >选择商标类别</div>
+                    </div>
+                    <div className='editright'><RightOutlined /></div>
+                    <div className='editProcess' >
+                        <div className='editProcessNum' style={{
+                            background: editProcess >= 3 ? '#3B60E8' : '',
+                            color: editProcess >= 3 ? '#fff' : '#B1B1B1',
+                            borderColor: editProcess >= 3 ? '' : '#B1B1B1'
+                        }}>3</div>
+                        <div className='editProcessTitle'
+                            style={{
+                                color: editProcess >= 3 ? '#353535' : '#878787',
+                                fontWeight: editProcess >= 3 ? 'bold' : 'normal'
+                            }}
+                        >选择所属者</div>
+                    </div>
+                    <div className='editright'><RightOutlined /></div>
+                    <div className='editProcess' >
+                        <div className='editProcessNum' style={{
+                            background: editProcess >= 4 ? '#3B60E8' : '',
+                            color: editProcess >= 4 ? '#fff' : '#B1B1B1',
+                            borderColor: editProcess >= 4 ? '' : '#B1B1B1'
+                        }}>4</div>
+                        <div className='editProcessTitle'
+                            style={{
+                                color: editProcess >= 4 ? '#353535' : '#878787',
+                                fontWeight: editProcess >= 4 ? 'bold' : 'normal'
+                            }}
+                        >
+                            订单支付
+                        </div>
+                    </div>
+                    <div className='editright'><RightOutlined /></div>
+                    <div className='editProcess' >
+                        <div className='editProcessNum' style={{
+                            background: editProcess >= 5 ? '#3B60E8' : '',
+                            color: editProcess >= 5 ? '#fff' : '#B1B1B1',
+                            borderColor: editProcess >= 5 ? '' : '#B1B1B1'
+                        }}>5</div>
+                        <div className='editProcessTitle'
+                            style={{
+                                color: editProcess >= 5 ? '#353535' : '#878787',
+                                fontWeight: editProcess >= 5 ? 'bold' : 'normal'
+                            }}
+                        >上传委托书</div>
+                    </div>
+                    <div className='editright'><RightOutlined /></div>
+                    <div className='editProcess'>
+                        <div className='editProcessNum' style={{
+                            background: editProcess >= 6 ? '#3B60E8' : '',
+                            color: editProcess >= 6 ? '#fff' : '#B1B1B1',
+                            borderColor: editProcess >= 6 ? '' : '#B1B1B1'
+                        }}>6</div>
+                        <div className='editProcessTitle'
+                            style={{
+                                color: editProcess >= 6 ? '#353535' : '#878787',
+                                fontWeight: editProcess >= 6 ? 'bold' : 'normal'
+                            }}
+                        >上传商标局</div>
+                    </div>
+
+
                 </div>
-                <div className='editright'><RightOutlined /></div>
+                <div className='editFormBox'>
-                <div className='editProcess'>
+                    <div style={{
-                    <div className='editProcessNum' style={{
+                        display: editProcess == 1 ? 'block' : 'none'
-                        background: editProcess >= 2 ? '#3B60E8' : '',
+                    }}>
-                        color: editProcess >= 2 ? '#fff' : '#B1B1B1',
+                        <EditOne
-                        borderColor: editProcess >= 2 ? '' : '#B1B1B1'
+                            // key={editProcess}
-                    }}>2</div>
+                            trademarkMode={state?.trademarkMode} //申请类型id
-                    <div className='editProcessTitle'
+                            trademarkModeName={state?.trademarkModeName} //申请类型名称
-                        style={{
+                            trademarkId={trademarkId} //商标id
-                            color: editProcess >= 2 ? '#353535' : '#878787',
+                            setTrademarkId={setTrademarkId} //设置商标id
-                            fontWeight: editProcess >= 2 ? 'bold' : 'normal'
+                            setEditProcess={setEditProcess}
-                        }}
+                            editOneData={editOneData} //编辑一数据
-                    >选择商标类别</div>
+                            setEditOneData={setEditOneData} //设置编辑一数据
-                </div>
+                        ></EditOne>
-                <div className='editright'><RightOutlined /></div>
+                    </div>
-                <div className='editProcess'>
+                    <div style={{
-                    <div className='editProcessNum' style={{
+                        display: editProcess == 2 ? 'block' : 'none'
-                        background: editProcess >= 3 ? '#3B60E8' : '',
+                    }}>
-                        color: editProcess >= 3 ? '#fff' : '#B1B1B1',
+                        <EditTwo
-                        borderColor: editProcess >= 3 ? '' : '#B1B1B1'
+                            editTwoArray={editTwoArray}
-                    }}>3</div>
+                            setEditTwoArray={setEditTwoArray}
-                    <div className='editProcessTitle'
+                            trademarkId={trademarkId} //商标id
-                        style={{
+                            // key={editProcess}
-                            color: editProcess >= 3 ? '#353535' : '#878787',
+                            setEditProcess={setEditProcess}></EditTwo>
-                            fontWeight: editProcess >= 3 ? 'bold' : 'normal'
+
-                        }}
+                    </div>
-                    >选择所属者</div>
+                    <div style={{
-                </div>
+                        display: editProcess == 3 ? 'block' : 'none'
-                <div className='editright'><RightOutlined /></div>
+                    }}>
-                <div className='editProcess'>
+                        <EditThree
-                    <div className='editProcessNum' style={{
+                            // key={editProcess}
-                        background: editProcess >= 4 ? '#3B60E8' : '',
+                            setEditProcess={setEditProcess}></EditThree>
-                        color: editProcess >= 4 ? '#fff' : '#B1B1B1',
+                    </div>
-                        borderColor: editProcess >= 4 ? '' : '#B1B1B1'
+                    <div style={{
-                    }}>4</div>
+                        display: editProcess == 4 ? 'block' : 'none'
-                    <div className='editProcessTitle'
+                    }}>
-                        style={{
+                        <EditFour
-                            color: editProcess >= 4 ? '#353535' : '#878787',
+                            // key={editProcess}
-                            fontWeight: editProcess >= 4 ? 'bold' : 'normal'
+                            setEditProcess={setEditProcess}></EditFour>
-                        }}
+                    </div>
-                    >
+                    <div style={{
-                        订单支付
+                        display: editProcess == 5 ? 'block' : 'none'
+                    }}>
+                        <EditFive
+                            // key={editProcess}
+                            setEditProcess={setEditProcess}></EditFive>
+                    </div>
+                    <div style={{
+                        display: editProcess == 6 ? 'block' : 'none'
+                    }}>
+                        <EditSix
+                            // key={editProcess}
+                            setEditProcess={setEditProcess}></EditSix>
                     </div>
                 </div>
-                <div className='editright'><RightOutlined /></div>
-                <div className='editProcess'>
-                    <div className='editProcessNum' style={{
-                        background: editProcess >= 5 ? '#3B60E8' : '',
-                        color: editProcess >= 5 ? '#fff' : '#B1B1B1',
-                        borderColor: editProcess >= 5 ? '' : '#B1B1B1'
-                    }}>5</div>
-                    <div className='editProcessTitle'
-                        style={{
-                            color: editProcess >= 5 ? '#353535' : '#878787',
-                            fontWeight: editProcess >= 5 ? 'bold' : 'normal'
-                        }}
-                    >上传委托书</div>
-                </div>
-                <div className='editright'><RightOutlined /></div>
-                <div className='editProcess'>
-                    <div className='editProcessNum' style={{
-                        background: editProcess >= 6 ? '#3B60E8' : '',
-                        color: editProcess >= 6 ? '#fff' : '#B1B1B1',
-                        borderColor: editProcess >= 6 ? '' : '#B1B1B1'
-                    }}>6</div>
-                    <div className='editProcessTitle'
-                        style={{
-                            color: editProcess >= 6 ? '#353535' : '#878787',
-                            fontWeight: editProcess >= 6 ? 'bold' : 'normal'
-                        }}
-                    >上传商标局</div>
-                </div>
-
-
             </div>
-            <div className='editFormBox'>
+        </Spin>
-                <div style={{
-                    display: editProcess == 1 ? 'block' : 'none'
-                }}>
-                    <EditOne
-                        key={editProcess}
-                        setEditProcess={setEditProcess}
-                    ></EditOne>
-                </div>
-                <div style={{
-                    display: editProcess == 2 ? 'block' : 'none'
-                }}>
-                    <EditTwo
-                        key={editProcess}
-                        setEditProcess={setEditProcess}></EditTwo>
-
-                </div>
-                <div style={{
-                    display: editProcess == 3 ? 'block' : 'none'
-                }}>
-                    <EditThree
-                        key={editProcess}
-                        setEditProcess={setEditProcess}></EditThree>
-                </div>
-                <div style={{
-                    display: editProcess == 4 ? 'block' : 'none'
-                }}>
-                    <EditFour
-                        key={editProcess}
-                        setEditProcess={setEditProcess}></EditFour>
-                </div>
-                <div style={{
-                    display: editProcess == 5 ? 'block' : 'none'
-                }}>
-                    <EditFive
-                        key={editProcess}
-                        setEditProcess={setEditProcess}></EditFive>
-                </div>
-                <div style={{
-                    display: editProcess == 6 ? 'block' : 'none'
-                }}>
-                    <EditSix
-                        key={editProcess}
-                        setEditProcess={setEditProcess}></EditSix>
-                </div>
-            </div>
-        </div>
     )
 }

src/route/TrademarkMall/TrademarkExpertEdit.tsx

@@ -22,7 +22,7 @@ export default function TrademarkExpertEdit() {
   return (
     <div className='trademarkExpertBox' style={{ height: `${height}px`, overflow: 'auto' }}>
       <div style={{
-        display: state.title == '专家辅助注册' ? 'unset' : 'none'
+        display: state.id == '2' ? 'unset' : 'none'
       }}>
         <div className='trademarkTop'>
           <div className='trademarkTopL'>
@@ -34,7 +34,7 @@ export default function TrademarkExpertEdit() {
         </div>
       </div>
       <div style={{
-        display: state.title == '至尊无忧注册' ? 'unset' : 'none'
+        display: state.id == '3'? 'unset' : 'none'
       }}>
         <div className='trademarkTop'>
           <div className='trademarkTopL'>

src/route/TrademarkMall/TrademarkMall.tsx

@@ -1,19 +1,261 @@
-// import React from 'react'
+import { useState, useEffect } from 'react'
 import nothingImg from '../../static/appimgs/nothing.png'
+import { useLocation, useNavigate } from 'react-router-dom';
+import { trademarkList } from '../../request/api'
+import { showImage } from '../../request/request'
+import type { TableProps } from 'antd';
+import {
+  message, Spin,
+  Pagination,
+  Table, Image
+} from 'antd';
 export default function TrademarkMall() {
+  const [messageApi, contextHolder] = message.useMessage();
+  const { state } = useLocation()
+  const nav = useNavigate();
   const height = window.innerHeight - 180;
-  const data = []
+  const columns: TableProps<any>['columns'] = [
-  return (
+    {
-    <div className='appElectionBox' style={{ height: `${height}px`, overflow: 'auto' }}>
+      title: '序号',
-      {data.length <= 0 ? (<div style={{ height: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center', flexDirection: 'column' }}>
+      dataIndex: 'index',
+      key: 'index',
+      align: 'center',
+      fixed: 'left',
+      width: 90,
+      render: (_text, _record, index) => (page - 1) * 10 + index + 1, // 显示序号，从1开始
+
+    },
+
+    {
+      title: '服务类型',
+      dataIndex: 'trademarkModeName',
+      fixed: 'left',
+      align: 'center',
+      key: 'trademarkModeName',
+      width: 150,
+      ellipsis: {
+        showTitle: true,
+      },
+
+    },
+    {
+      title: '类型/名称',
+      fixed: 'left',
+      dataIndex: 'trademarkName',
+      key: 'trademarkName',
+      align: 'center',
+      ellipsis: {
+        showTitle: true,
+      },
+      width: 200,
+      render: (_text, record) => (
+        <span>
+          {record.trademarkType == 'text' ? '文字' : record.trademarkType == 'image' ? '图形' : record.trademarkType == 'text-image' ? '图文' : '未知'} <span style={{
+            display:record.trademarkType == 'image'? 'none' : 'unset',
+          }}>/{record.trademarkName}</span> 
+          {/* {record} */}
+        </span>
+      )
+
+    },
+
+    {
+      title: '商标图样',
+      dataIndex: 'trademarkPhoto',
+      align: 'center',
+      key: 'trademarkPhoto',
+      width: 200,
+      render: (text) => (
+        <Image src={showImage(text, false)} 
+        height={100}
+        style={{
+          maxWidth: 200,
+        }}
+        >
+
+        </Image>
+      )
+    },
+    {
+      title: '状态',
+      dataIndex: 'trademarkStatus',
+      align: 'center',
+      key: 'trademarkStatus',
+      width: 100,
+      render: (text) => (
+        <span>
+          {text == '-1' ?
+            <span >已取消</span>
+            : text == '0' ?
+              <span
+                style={{
+                  color: 'skyblue',
+                }}
+              >待付款</span>
+              : text == '1' ?
+                <span
+
+                  style={{
+                    color: 'green',
+                  }}
+                >已付款</span>
+                :
+                <span style={{
+                  color: 'rgb(122 126 130)',
+                }}>未知</span>
+          }
+        </span>
+      )
+    },
+    {
+      title: '申请人',
+      dataIndex: 'leaderName',
+      align: 'center',
+      key: 'appOrderId',
+      width: 150,
+      render: (text) => (
+        <span>
+          {text ? text : '未完善'}
+        </span>
+      )
+    },
+    {
+      title: '申请人证件号',
+      dataIndex: 'leaderIdcard',
+      align: 'center',
+      key: 'appOrderId',
+      width: 150,
+      render: (text) => (
+        <span>
+          {text ? text : '未完善'}
+        </span>
+      )
+    },
+    {
+      title: '操作',
+      // dataIndex: 'contractManagementId',
+      align: 'center',
+      // key: 'appOrderId',
+      width: 150,
+      // bordeLeft: true,
+      fixed: 'right',
+      render: (record) => (
+
 
-        <img src={nothingImg} alt="" width={368} height={355} />
         <div style={{
-          marginTop: 50,
+          cursor: 'pointer',
-          fontSize: 16,
+          color: '#007FFF',
-          color: '#D0D0D0'
+
-        }}>暂无数据</div>
+
-      </div>) : (<></>)}
+        }} onClick={() => {
-    </div>
+          nav(`/trademark-ai-edit/${record.trademarkId}`, {
+            state: {
+              trademarkMode: record.trademarkMode, //申请类型id
+              trademarkModeName: record.trademarkModeName, //申请类型名称
+              trademarkId: record.trademarkId, //商标id
+
+            }
+          })
+          // console.log(record.checkStatus);
+
+
+        }}>编辑</div>
+
+
+      )
+
+    },
+  ]
+  const [data, setData] = useState<any>([])
+  const [loading, setLoading] = useState(false)
+  const [page, setPage] = useState(1)
+  const getTrademarkList = async (page: any) => {
+    try {
+      setLoading(true)
+      const res: any = await trademarkList({
+        keywords: state && state.keywords ? state.keywords : '',
+        rows: 10,
+        page: page
+      })
+      console.log('结果', res);
+      setData(res.rows)
+
+      setLoading(false)
+
+    } catch (error: any) {
+      setLoading(false)
+      if (error.response) {
+        const data = error.response.data;
+        messageApi.open({
+          type: 'error',
+          content: data.msg ? data.msg : `${data.path}(${data.status})`,
+        });
+      } else {
+        console.error(error)
+      }
+    } finally {
+      setLoading(false)
+    }
+  }
+  // useEffect(() => {
+  //   // console.log(state.keywords);
+  //   getTrademarkList(1)
+  //   // console.log(1);
+
+  // }, [])
+  useEffect(() => {
+    // console.log(state.keywords);
+    getTrademarkList(1)
+  }, [state])
+
+  return (
+    <Spin tip="正在处理，请稍后..." size="small" spinning={loading}>
+      <div className='appElectionBox' style={{ height: `${height}px`, overflow: 'auto' }}>
+        {contextHolder}
+
+        {data.length <= 0 ? (<div style={{ height: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center', flexDirection: 'column' }}>
+
+          <img src={nothingImg} alt="" width={368} height={355} />
+          <div style={{
+            marginTop: 50,
+            fontSize: 16,
+            color: '#D0D0D0'
+          }}>暂无数据</div>
+        </div>) : (
+          <div className='' >
+            <div style={{
+              height: `${height - 80}px`,
+              // background: "pink" ,
+              paddingTop: 20
+            }}>
+
+              <Table
+                scroll={{ y: `${height - 150}px` }}
+                dataSource={data}
+                columns={columns}
+                bordered
+                // pagination={{
+                //   defaultPageSize: 10, // 设置默认一页显示 5 条数据
+                // }}
+                pagination={false} // 不显示分页
+                style={{ textAlign: 'center' }} // 设置表格内容居中显示
+                rowKey="trademarkId" // 指定数据项的唯一标识符
+                locale={{ emptyText: '暂无数据' }}
+              ></Table>
+
+            </div>
+            <div className='product-release-pagination'>
+              <Pagination
+                showSizeChanger={false}
+                current={page} total={data.total} defaultPageSize={10} onChange={(page) => {
+                  setPage(page)
+                  getTrademarkList(page)
+                }} />
+            </div>
+
+          </div>
+        )}
+      </div>
+    </Spin>
   )
 }

src/route/TrademarkMall/components/EditFive/EditFive.tsx

@@ -1,21 +1,194 @@
-// import React from 'react'
+import { useState } from 'react'
-import { Button } from 'antd'
+import { Button, Form, message, Upload, Input } from 'antd'
-export default function editFive(props: any) {
+import { UploadOutlined } from '@ant-design/icons';
-  const height = window.innerHeight - 350;
+import { uploadFileUrl, showImage } from '../../../../request/request'
+export default function EditFive(props: any) {
+  const token = sessionStorage.getItem('token')
+  const [form] = Form.useForm();
   const handleSubmit = () => {
-    // console.log(form);
+
+    form.submit();
+
     props.setEditProcess(6);
-    // 调用表单实例的 submit 方法
-    // form.submit();
 
   };
+  // const [imgList, setImgList] = useState<any>([])
+  const [upFileArray, setUpFileArray] = useState<any>([])
+  // 定义允许上传的文件格式
+  const ALLOWED_FILE_TYPES = ['.pdf', '.jpg', '.jpeg', '.png', '.bmp'];
+  const beforeUpload = (file: File) => {
+    const fileExt = file.name.slice(file.name.lastIndexOf('.')).toLowerCase();
+    if (!ALLOWED_FILE_TYPES.includes(fileExt)) {
+      message.error(`仅支持 ${ALLOWED_FILE_TYPES.join(', ')} 格式的文件`);
+      return Upload.LIST_IGNORE;
+    }
+    return true;
+  };
+  // const [textLodaing, setTextLodaing] = useState(false)
+  // const upImgHandleChange: UploadProps['onChange'] = (info) => {
+
+
+
+  //   if (info.file.status === 'uploading') {
+
+  //     setTextLodaing(true)
+  //     return;
+  //   }
+  //   if (info.file.status === 'done') {
+  //     setTextLodaing(false)
+
+
+  //     setImgList([
+  //       {
+  //         uid: info.file.response.data.fileId,
+  //         name: info.file.response.data.fileName,
+  //         status: 'done',
+  //         url: showImage(info.file.response.data.fileId, false)
+  //       }
+  //     ])
+  //     form.setFieldsValue({ imgUrl: info.file.response.data.fileId })
+
+  //     return;
+  //   }
+  //   if (info.file.status === 'error') {
+  //     setTextLodaing(false)
+  //     message.error(`上传失败`);
+  //     return;
+  //   }
+  // };
+  const onFinish = (values: any) => {
+    console.log('Success:', values);
+    props.setEditProcess(6);
+  };
+  const height = window.innerHeight - 350;
+
   return (
     <div className='editOneTwo'>
       <div className='topLine'></div>
-      <div className='appInfoFormBox' style={{
+      <div className='' style={{
         height: height,
-        background: 'pink'
+        // background: 'pink',
-      }}></div>
+        padding: '50px 50px',
+        boxSizing: 'border-box',
+      }}>
+        <Form form={form} onFinish={onFinish}
+          onFinishFailed={(errorInfo) => {
+            errorInfo.errorFields.forEach((field) => {
+              if (field.errors.length > 0) {
+                // 显示每条错误信息
+                message.error(field.errors[0]);
+              }
+            });
+          }}
+        >
+          <div style={{
+            display: 'flex',
+          }}>
+            <div className='FormInputTitle' style={{
+              marginTop: -5
+            }}>上传委托书<span style={{
+              color: 'red',
+            }}>*</span> ：</div>
+            <div style={{
+              // background:'pink',
+              width: 200,
+              position: 'relative',
+            }}>
+
+              <Form.Item
+                name="file"
+                rules={[{ required: true, message: '请上传委托书' }]}
+              >
+                <Input style={{
+                  width: 100,
+                  display: 'none',
+                }}></Input>
+
+
+              </Form.Item>
+              <div style={{
+                position: 'absolute',
+                top: -5,
+                // background: 'pink',
+                maxWidth: 200,
+              }}>
+                <Upload
+                  name="file"
+                  action={uploadFileUrl()}
+                  fileList={upFileArray}
+                  onChange={(info) => {
+                    const { fileList } = info;
+                    setUpFileArray(fileList);
+                    if (info.file.status === 'uploading') {
+
+                      return;
+                    }
+                    if (info.file.status === 'done') {
+                      // console.log(info.file.response.data);
+                      setUpFileArray([
+                        {
+                          uid: info.file.response.data.fileId,
+                          name: info.file.response.data.fileName,
+                          status: 'done',
+                          url: showImage(info.file.response.data.fileId, false)
+                        }
+                      ])
+
+                      form.setFieldsValue({
+                        file: info.file.response.data.fileId,
+                      });
+                    }
+                    if (info.file.status === 'error') {
+                      // 显示错误提示
+                      message.error(`上传失败,请重新上传`);
+                      setUpFileArray([])
+
+                    }
+                    // console.log(upCodeArray);
+
+                  }}
+                  onRemove={() => {
+                    setUpFileArray([])
+                    form.setFieldsValue({
+                      file: '', // 清除表单值
+                    });
+                  }}
+                  beforeUpload={beforeUpload}
+                  // onPreview={handlePreview}
+                  // onChange={handleUploadChange}
+                  headers={{ 'Auth': `Bearer ${token}` }}
+                >
+                  <Button icon={<UploadOutlined />} style={{
+                    marginTop: '4px'
+                  }}
+                    disabled={upFileArray.length > 0}
+                  >上传委托书</Button>
+                </Upload>
+              </div>
+              <div style={{
+                position: 'absolute',
+                top: 0,
+                left: 140,
+                textWrap: 'nowrap',
+                color: 'var(--color-blue)',
+                lineHeight: '30px',
+                cursor: 'pointer',
+              }}
+                onClick={() => {
+                  window.open('https://www.baidu.com')
+                }}
+              >[ 下载模板 ]</div>
+
+
+            </div>
+          </div>
+
+
+
+        </Form>
+
+
+      </div>
       <div className='topLine'></div>
       <div style={{
         marginTop: '8px',

src/route/TrademarkMall/components/EditFour/EditFour.tsx

@@ -1,10 +1,106 @@
-// import React from 'react'
+import { useState } from 'react'
-import { Button } from 'antd'
+import './edit-four.css'
-export default function editFour(props: any) {
+import { Button, Table, Modal } from 'antd'
+import type { TableProps } from 'antd';
+interface DataType {
+  id: string;
+  type: string; //付费方式
+  name: string;//服务名称
+  category: string; //类别
+  goods: string; //服务
+  goodsType: string; //商标类型
+  price: string; //单价
+  num: string; //数量
+}
+export default function EditFour(props: any) {
+  const columns: TableProps<DataType>['columns'] = [
+    {
+      align: 'center',
+      title: '付费方式',
+      dataIndex: 'type',
+      key: 'type',
+      render: () => '预付费',
+      width: 100,
+    },
+    {
+      align: 'center',
+      width: 100,
+
+      title: '服务名称',
+      dataIndex: 'name',
+      key: 'name',
+      render: () => '商标申请',
+    },
+    {
+      align: 'center',
+      width: 150,
+      ellipsis: true,
+      title: '类别',
+      dataIndex: 'category',
+      key: 'category',
+    },
+    {
+      align: 'center',
+      width: 300,
+      ellipsis: true,
+      title: '指定商品或服务',
+      dataIndex: 'goods',
+      key: 'goods',
+    },
+    {
+      align: 'center',
+      width: 150,
+      title: '商标类型',
+      dataIndex: 'goodsType',
+      key: 'goodsType',
+    },
+    {
+      align: 'center',
+      width: 100,
+
+      title: '单价',
+      dataIndex: 'price',
+      key: 'price',
+    },
+    {
+      align: 'center',
+      width: 100,
+      title: '数量',
+      dataIndex: 'num',
+      key: 'num',
+    },
+
+
+  ];
+  const data: DataType[] = [
+    {
+      id: '1',
+      type: '预付费', //付费方式
+      name: '商标申请',//服务名称
+      category: '第35类 广告销售', //类别
+      goods: '共10项:喜喜喜喜喜喜,哈哈哈啊哈哈哈哈,呵呵呵呵呵,嘎嘎嘎嘎嘎嘎嘎,的爱德华八克很大空间和大开杀空间,按时间打假打私', //服务
+      goodsType: '文字和图案', //商标类型
+      price: '630.66', //单价
+      num: '1', //数量
+    },
+    {
+      id: '2',
+      type: '预付费', //付费方式
+      name: '商标申请',//服务名称
+      category: '第35类 广告销售', //类别
+      goods: '共10项:喜喜喜喜喜喜,哈哈哈啊哈哈哈哈,呵呵呵呵呵,嘎嘎嘎嘎嘎嘎嘎,的爱德华八克很大空间和大开杀空间,按时间打假打私', //服务
+      goodsType: '文字和图案', //商标类型
+      price: '10000.66', //单价
+      num: '1', //数量
+    },
+
+  ];
+  const [modal, setModal] = useState(false)
   const height = window.innerHeight - 350;
   const handleSubmit = () => {
     // console.log(form);
-    props.setEditProcess(5);
+    // props.setEditProcess(5);
+    setModal(true)
     // 调用表单实例的 submit 方法
     // form.submit();
 
@@ -12,10 +108,31 @@ export default function editFour(props: any) {
   return (
     <div className='editOneTwo'>
       <div className='topLine'></div>
-      <div className='appInfoFormBox' style={{
+      <div className='editFourBox' style={{
         height: height,
-        background: 'pink'
+        // background: 'pink'
-      }}></div>
+      }}>
+        <div className='editFourTop'>
+          <div className='editFourTopL'>商标申请</div>
+          <div className='editFourTopR'>
+            <span>数量 : 2</span>
+            <span style={{
+              marginLeft: '10px',
+            }}>小计<span style={{
+              color: 'red',
+            }}>￥630.66</span></span>
+
+          </div>
+
+        </div>
+        <Table<DataType> columns={columns}
+          // 取消自带分页
+          pagination={false}
+          dataSource={data}
+          rowKey='id'
+          />
+
+      </div>
       <div className='topLine'></div>
       <div style={{
         marginTop: '8px',
@@ -43,8 +160,22 @@ export default function editFour(props: any) {
           onClick={() => {
             handleSubmit()
           }}
-        >下一步</Button>
+        >提交订单</Button>
       </div>
+      <Modal title="提示"
+        centered
+        destroyOnClose={true}
+        open={modal}
+        onCancel={() => { setModal(false) }}
+        okText='确定'
+        cancelText='取消'
+        onOk={()=>{
+          setModal(false)
+          props.setEditProcess(5)
+        }}
+      >
+        该操作会扣除999元，确定操作吗？
+      </Modal>
     </div>
   )
 }

src/route/TrademarkMall/components/EditFour/edit-four.css

@@ -0,0 +1,11 @@
+.editFourTop{
+    /* background-color: pink; */
+    padding: 10px;
+    box-sizing: border-box;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+.editFourTopL{
+    font-size: 18px;
+}

src/route/TrademarkMall/components/EditOne/EditOne.css

@@ -9,6 +9,32 @@
     box-sizing: border-box; */
 }
 
+.editOneFomrBox {
+    /* WebKit 浏览器（Chrome、Safari 等） */
+    scrollbar-width: thin;
+    /* Firefox */
+    scrollbar-color: #888 #f1f1f1;
+    /* Firefox */
+}
+.editOneFomrBox ::-webkit-scrollbar {
+    width: 8px;
+    /* 垂直滚动条宽度 */ 
+}
+.editOneFomrBox ::-webkit-scrollbar-track {
+    background: #f1f1f1;
+    /* 滚动条轨道背景颜色 */ 
+}
+.editOneFomrBox ::-webkit-scrollbar-thumb {
+    background: #888;
+    /* 滚动条滑块颜色 */
+    border-radius: 4px;
+    /* 滚动条滑块圆角 */ 
+}
+.editOneFomrBox ::-webkit-scrollbar-thumb:hover {
+    background: #555;
+    /* 鼠标悬停时滚动条滑块颜色 */ 
+}
+
 .editFormTitle {
     font-size: 18px;
     margin-bottom: 20px;
@@ -38,7 +64,11 @@
 .redTitle {
     color: red;
 }
-.pointerBlue{
+
+.pointerBlue {
     color: var(--color-blue);
     cursor: pointer;
+}
+.upBox{
+    background: skyblue;
 }

src/route/TrademarkMall/components/EditSix/EditSix.tsx

@@ -1,21 +1,24 @@
-// import React from 'react'
+import { useState } from 'react'
-import { Button } from 'antd'
+import { Button, Modal } from 'antd'
-export default function editSix(props: any) {
+export default function EditSix(props: any) {
   const height = window.innerHeight - 350;
+  const [modal, setModal] = useState(false)
   const handleSubmit = () => {
     // console.log(form);
     // 调用表单实例的 submit 方法
     // form.submit();
-    alert('提交成功')
+    // alert('提交成功')
+    setModal(true)
 
   };
   return (
     <div className='editOneTwo'>
       <div className='topLine'></div>
-      <div className='appInfoFormBox' style={{
+      <div className='' style={{
         height: height,
-        background: 'pink'
+      }}>
-      }}></div>
+        显示商标信息
+      </div>
       <div className='topLine'></div>
       <div style={{
         marginTop: '8px',
@@ -29,7 +32,7 @@ export default function editSix(props: any) {
             borderRadius: '5px',
           }}
           onClick={() => {
-            props.setEditProcess(4)
+            props.setEditProcess(5)
           }}
         >上一步</Button>
         <Button
@@ -45,6 +48,20 @@ export default function editSix(props: any) {
           }}
         >上传</Button>
       </div>
+      <Modal
+        title="提示"
+        centered
+        open={modal}
+        onOk={() => { setModal(false) }}
+        onCancel={() => { setModal(false) }}
+        okText="确定"
+        cancelText="取消"
+      >
+        <span style={{
+          fontSize: '16px',
+          color: 'red',
+        }}> 注:上传后无法撤回，是否继续上传？</span>
+      </Modal>
     </div>
   )
 }

src/route/TrademarkMall/components/EditThree/EditThree.tsx

@@ -1,21 +1,141 @@
-// import React from 'react'
+import { useState } from 'react'
-import { Button } from 'antd'
+import { Button, Form, Input, message, Modal } from "antd"
-export default function editThree(props: any) {
+import BelongPeople from '../../../../components/BelongPeople/BelongPeople.tsx'
+export default function EditThree(props: any) {
+  const [form] = Form.useForm();
   const height = window.innerHeight - 350;
   const handleSubmit = () => {
-    // console.log(form);
+
+    form.submit();
     props.setEditProcess(4);
-    // 调用表单实例的 submit 方法
-    // form.submit();
 
   };
+  const onFinish = (values: any) => {
+    console.log('Success:', values);
+    props.setEditProcess(4);
+  };
+  const [belongPeopleInfo, setBelongPeopleInfo] = useState({
+    authorName: '',
+    authorType: '',
+    authorIdCardType: '',
+    authorIdCard: '',
+    authorCrcAccount: 0,
+    authorId: '',
+    authorProvinceCity: '',
+    authorCrcAccountPassword: '',
+    authorCrcAccountUsername: ''
+  })
+  const [belongModal, setBelongModal] = useState(false)
+  const setValue = (value: string) => {
+    form.setFieldsValue({
+      projOwnerName: value
+    })
+  }
   return (
     <div className='editOneTwo'>
       <div className='topLine'></div>
-      <div className='appInfoFormBox' style={{
+      <div className='' style={{
         height: height,
-        background: 'pink'
+        // background: 'pink'
-      }}></div>
+        padding: '50px 50px',
+        boxSizing: 'border-box',
+      }}>
+        <Form form={form} onFinish={onFinish}
+          onFinishFailed={(errorInfo) => {
+            errorInfo.errorFields.forEach((field) => {
+              if (field.errors.length > 0) {
+                // 显示每条错误信息
+                message.error(field.errors[0]);
+              }
+            });
+          }}
+        >
+
+          <div style={{
+            display: 'flex',
+            justifyContent: 'space-between',
+            width: '900px',
+          }}>
+
+            <div className='appInfoFormInput' style={{
+              // background: 'pink',
+              position: 'relative',
+            }}>
+              <div className='FormInputTitle'>产权所属者<span style={{ color: 'red', }}>*</span>：</div>
+              <Form.Item name="projOwnerName" label="" rules={[{ required: true, message: '请选择/创建知识产权所属者' },
+
+              ]}>
+                <Input
+                  style={{
+                    width: '300px',
+                    height: '42px',
+                  }} placeholder="请选择/创建知识产权所属者" />
+              </Form.Item>
+              <div style={{
+                display: belongPeopleInfo.authorId ? 'none' : 'unset',
+                position: 'absolute',
+                width: '300px',
+                height: '42px',
+                top: '0',
+                right: '0',
+                // background: 'skyblue',
+                textAlign: 'right',
+                lineHeight: '42px',
+                cursor: 'pointer',
+                paddingRight: '10px',
+                color: '#1F79FF',
+
+              }}
+                onClick={() => {
+                  setBelongModal(true)
+                }}
+              >
+                选择
+              </div>
+              <div style={{
+                display: belongPeopleInfo.authorId ? 'unset' : 'none',
+                position: 'absolute',
+                width: '300px',
+                height: '42px',
+                top: '0',
+                right: '0',
+                // background: 'skyblue',
+                textAlign: 'right',
+                lineHeight: '42px',
+                paddingRight: '10px',
+                color: '#1F79FF',
+
+              }}
+
+              >
+                <span
+                  style={{
+                    cursor: 'pointer',
+
+                  }}
+                  onClick={() => {
+                    setValue('')
+                    setBelongPeopleInfo({
+                      authorName: '',
+                      authorType: '',
+                      authorIdCardType: '',
+                      authorIdCard: '',
+                      authorCrcAccount: 0,
+                      authorId: '',
+                      authorProvinceCity: '',
+                      authorCrcAccountUsername: '',
+                      authorCrcAccountPassword: '',
+                    })
+                  }}> 取消</span>
+              </div>
+            </div>
+
+
+          </div>
+
+        </Form>
+
+      </div>
       <div className='topLine'></div>
       <div style={{
         marginTop: '8px',
@@ -45,6 +165,20 @@ export default function editThree(props: any) {
           }}
         >下一步</Button>
       </div>
+      <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>
     </div>
   )
 }

src/route/TrademarkMall/components/EditTwo/components/TreeMenu/TreeMenu.tsx

@@ -3,7 +3,8 @@ import { Checkbox } from 'antd';
 import './tree-menu.css';
 import {
   DownOutlined,
-  UpOutlined
+  // UpOutlined,
+  RightOutlined
 } from '@ant-design/icons';
 
 // interface TreeMenuProps {
@@ -37,11 +38,11 @@ import {
 export default function TreeMenu({
   trademarkCategories,
   expandedIds,
-//   setExpandedIds,
+  //   setExpandedIds,
   checkedIds,
-//   setCheckedIds,
+  //   setCheckedIds,
-//   selectedCategories,
+  //   selectedCategories,
-//   setSelectedCategories,
+  //   setSelectedCategories,
   handleExpandClick,
   handleSmallMenuClick
 }: any) {
@@ -56,27 +57,39 @@ export default function TreeMenu({
       const isChecked = checkedIds.includes(child.id);
 
       return (
-        <div key={child.id} style={{ marginLeft: level * 20 }}>
+        <div key={child.id} style={{ marginLeft: level * 15 }}>
           {!isLeaf && (
             <div
               className='bigMenu'
               onClick={() => handleExpandClick(child.id)}
             >
-              <div>
+              <div style={{
-                {isExpanded ? <UpOutlined /> : <DownOutlined />}
+                color: 'rgb(124, 124, 124)',
+              }}>
+                {isExpanded ? <DownOutlined /> : <RightOutlined />}
               </div>
-              <div> {child.name}</div>
+              <div> {child.code}-{child.name}</div>
             </div>
           )}
           {isLeaf && (
             <div
+              className='smallMenu'
               onClick={() => handleSmallMenuClick(child.id)}
               style={{
                 cursor: 'pointer',
-             
+                display: 'flex',
+                alignItems: 'center',
+                paddingRight: 10,
               }}
             >
-              {child.name} <Checkbox checked={isChecked} />
+              <div style={{
+                // background:'skyblue',
+                overflow: 'hidden',
+                textOverflow: 'ellipsis',
+                whiteSpace: 'nowrap',
+              }}
+              title={child.name}
+              >{child.code}-{child.name}</div> <Checkbox style={{marginLeft:10}} checked={isChecked} />
             </div>
           )}
           {!isLeaf && isExpanded && renderChildren(child.children, level + 1)}
@@ -87,7 +100,7 @@ export default function TreeMenu({
 
   return (
     <div>
-      {trademarkCategories.map((category:any) => {
+      {trademarkCategories.map((category: any) => {
         const isExpanded = expandedIds.includes(category.id);
         return (
           <div key={category.id}>
@@ -95,10 +108,12 @@ export default function TreeMenu({
               className='bigMenu'
               onClick={() => handleExpandClick(category.id)}
             >
-              <div>
+              <div style={{
-                {isExpanded ? <UpOutlined /> : <DownOutlined />}
+                color: 'rgb(124, 124, 124)',
+              }}>
+                {isExpanded ? <DownOutlined /> : <RightOutlined />}
               </div>
-              <div> {category.name}</div>
+              <div> 第{category.code}类 {category.name}</div>
             </div>
             {isExpanded && renderChildren(category.children, 1)}
           </div>

src/route/TrademarkMall/components/EditTwo/components/TreeMenu/tree-menu.css

@@ -1,10 +1,13 @@
 .bigMenu {
     display: flex;
     cursor: pointer;
+    margin-top: 10px;
 }
 
 .smallMenu {
-    margin-left: 20px;
+    /* margin-left: 20px; */
     cursor: pointer;
-   
+    margin-top: 10px;
+    /* background-color: skyblue; */
+    
 }

src/route/TrademarkMall/components/EditTwo/edit-tow.css

@@ -1,9 +1,10 @@
-.editTwoTitle{
+.editTwoTitle {
     font-size: 18px;
     /* font-weight: 700; */
 }
+
 .editTwoBotL {
-    width: calc(30% - 2px);
+    width: calc(20% - 2px);
     height: 100%;
     /* background-color: aqua; */
     border-left: 1px solid #e9e9e9;
@@ -13,7 +14,7 @@
 }
 
 .editTwoBotR {
-    width: calc(70% - 1px);
+    width: calc(80% - 1px);
     height: 100%;
     /* background-color: rgb(179, 245, 195); */
     border-right: 1px solid #e9e9e9;
@@ -74,18 +75,43 @@
     padding-left: 10px;
     box-sizing: border-box;
 }
-.editTwoBTopTextR{
+
-    padding: 10px;
+.editTwoBTopTextR {
+    padding: 20px;
     box-sizing: border-box
 }
+
+.editTwoGoodsBox {
+    /* border: 1px solid #e9e9e9; */
+}
+
+.editTwoGoodsBoxItem {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 10px 15px;
+    box-sizing: border-box;
+    background-color: #e7e7e7;
+}
+.editTwoGoodsBoxChildItem{
+    /* background-color: skyblue; */
+    padding: 10px 15px 0px 15px;
+}
+
 .editTwoBTopSearch {
     height: 40px;
     /* width: calc(100% - 10px); */
     width: 100%;
-    background-color: skyblue;
+    background-color: rgb(255, 255, 255);
     position: absolute;
     top: 40px;
     left: 0;
     z-index: 999;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 0 10px;
+    box-sizing: border-box;
+    /* z-index: 99; */
 
 }

src/route/index/Index.tsx

@@ -58,7 +58,7 @@ import {
 import {
     // getLanguageList, getSoftTypeList
     appGoodsList,
-    buyAppGoods, appOrderList
+    buyAppGoods, appOrderList, trademarkGoodsList
 } from '../../request/api'
 import {
     setMenuActive,
@@ -915,7 +915,7 @@ export default function Index() {
                     copyrightLanguage: copyrightLanguage,
                     copyrightType: copyrightType,
                     // 新增特价标识
-                    goodsFlag: specialPrice=='特价' ? '特价' : ''
+                    goodsFlag: specialPrice == '特价' ? '特价' : ''
                 }
             })
         }
@@ -983,6 +983,7 @@ export default function Index() {
     const [appKeyWords, setAppKeyWords] = useState('') // 电子软著搜索关键字
     const [showAppkeyWords, setShowAppkeyWords] = useState('') // 电子软著搜索关键字显示
     const [appModal, setAppModal] = useState(false) // 申请电子软著弹窗
+    const [tipsModal, setTipsModal] = useState(false) // 申请电子软著付款提示
     const [toEditsModal, setToEditsModal] = useState(false) // 电子软著编辑弹窗
     const [appGoodsArray, setAppGoodsArray] = useState<any>([]) // 电子软著可选商品列表
     const [buyLoading, setBuyLoading] = useState(false) // 购买loading
@@ -1126,6 +1127,31 @@ export default function Index() {
     // 申请商标是否显示------------------------------------------------------------------------------
     const [trademarkBox, setTrademarkBox] = useState(false) // 申请商标弹窗
     const [trademarkModal, setTrademarkModal] = useState(false) // 申请商标弹窗
+    const [trademarkNewKeywords, setTrademarkNewKeywords] = useState('') // 临时关键字
+    const [trademarkKeywords, setTrademarkKeywords] = useState('') // 关键字
+    const trademarkKeyWordshandleSearch = () => {
+        setTrademarkKeywords(trademarkNewKeywords)
+    }
+    const trademarkKeyWordshandleChange = (e: any) => {
+        setTrademarkNewKeywords(e.target.value)
+        if (e.target.value == '') {
+            setTrademarkKeywords('')
+        }
+    }
+    const trademarkInit = () => {
+        setTrademarkNewKeywords('')
+        setTrademarkKeywords('') 
+    }
+    useEffect(() => {
+        if (location.pathname == '/trademark-mall') {
+            nav('/trademark-mall', {
+                state: {
+                    keywords: trademarkKeywords,
+                }
+            })
+        }
+
+    }, [trademarkKeywords])
     // const [toRradeMarkModal, setToRradeMarkModal] = useState(false) // 申请商标编辑弹窗
     // ----------------------------------------------------------------------------------------------------
 
@@ -1310,55 +1336,142 @@ export default function Index() {
     //     { id: '3', title: '1个工作日下证', price: '2599', back: 'black' },
     //     { id: '4', title: '当天下证', price: '3699', back: 'black' },
     // ]
+    // // 智能注册商标申请价格
+    // const [TrademarkAiPrice, setTrademarkAiPrice] = useState<any>(0)
+    // // 智能申请注册原价
+    // const [TrademarkAiOldPrice, setTrademarkAiOldPrice] = useState<any>(0)
+    // // 专家辅助注册价格
+    // const [TrademarkExpertPrice, setTrademarkExpertPrice] = useState<any>(0)
+    // // 至尊无忧注册价格
+    // const [TrademarkUltimatePrice, setTrademarkUltimatePrice] = useState<any>(0)
+    const [trademarkArray, setTrademarkArray] = useState<any>([]) // 商标数组
+    const getTrademarkGoodsList = async () => {
+        try {
+            const res: any = await trademarkGoodsList()
+            // console.log('商标列表', res);
+            // res是个数组 循环数组 找到name为"智能申请注册"的 把价格赋值给智能注册商标申请价格
+            // res.forEach((item: any) => {
+            //     if (item.name == '智能申请注册') {
+            //         setTrademarkAiPrice(item.money)
+            //         setTrademarkAiOldPrice(item.oldMoney)
+            //     }
+            //     if (item.name == '专家辅助注册') {
+            //         setTrademarkExpertPrice(item.money)
+            //     }
+            //     if (item.name == '至尊无忧注册') {
+            //         setTrademarkUltimatePrice(item.money)
+            //     }
+            // })
+            setTrademarkArray([
 
+                {
+                    id: res[0].id, title: '智能申请注册', nowprice: res[0].money,
+                    old: true, //是否显示原价
+                    oldprice: res[0].oldMoney, //原价
+                    cheap: true,//特价
+                    text: '0服务费，针对有一定商标申请经验并能自主评估风险的用户',
+                    left: '性价比', right: '高',
+                    textArray: [
+                        '自助办理，性价比高',
+                        '自助查询，排查风险',
+                        '人工严审，提升受理率'
+                    ],
+                    serve: false, //专家咨询
+                    num: 1 // 限购
+                },
+                {
+                    id: res[1].id, title: '专家辅助注册', nowprice: res[1].money, cheap: false,
+                    old: false,
+                    oldprice: '',
+                    text: '流程专业代办，适用于商标风险评估、类别选择无经验的新用户',
+                    left: '成功率', right: '高',
+                    textArray: [
+                        '专家一对一，全流程代办',
+                        '分析风险，优化注册方案',
+                        '分析风险，优化注册方案'
+                    ],
+                    serve: true,
+                    num: 0
+                },
+                {
+                    id: res[2].id, title: '至尊无忧注册', nowprice: res[2].money, cheap: false,
+                    old: false,
+                    oldprice: '',
+                    text: '专家评估提高通过率，注册失败，可赔付全款',
+                    left: '类型', right: '指定类目',
+                    textArray: [
+                        '你注册，我投保',
+                        '每件商标都有保单',
+                        '指定类目驳回，赔付全款'
+                    ],
+                    serve: true,
+                    num: 0
+
+                },
+            ]
+            )
+        } catch (error: any) {
+
+            if (error.response) {
+                const data = error.response.data;
+                messageApi.open({
+                    type: 'error',
+                    content: data.msg ? data.msg : `${data.path}(${data.status})`,
+                });
+            } else {
+                console.error(error)
+            }
+        }
+    }
     // 商标数组
-    const trademarkArray = [
+    // const trademarkArray = [
-        {
+    //     {
-            id: '1', title: '智能申请注册', nowprice: '270',
+    //         id: '1', title: '智能申请注册', nowprice: TrademarkAiPrice,
-            old: true, //是否显示原价
+    //         old: true, //是否显示原价
-            oldprice: '318', //原价
+    //         oldprice: TrademarkAiOldPrice, //原价
-            cheap: true,//特价
+    //         cheap: true,//特价
-            text: '0服务费，针对有一定商标申请经验并能自主评估风险的用户',
+    //         text: '0服务费，针对有一定商标申请经验并能自主评估风险的用户',
-            left: '性价比', right: '高',
+    //         left: '性价比', right: '高',
-            textArray: [
+    //         textArray: [
-                '自助办理，性价比高',
+    //             '自助办理，性价比高',
-                '自助查询，排查风险',
+    //             '自助查询，排查风险',
-                '人工严审，提升受理率'
+    //             '人工严审，提升受理率'
-            ],
+    //         ],
-            serve: false, //专家咨询
+    //         serve: false, //专家咨询
-            num: 1 // 限购
+    //         num: 1 // 限购
-        },
+    //     },
-        {
+    //     {
-            id: '2', title: '专家辅助注册', nowprice: '499', cheap: false,
+    //         id: '2', title: '专家辅助注册', nowprice:TrademarkExpertPrice , cheap: false,
-            old: false,
+    //         old: false,
-            oldprice: '',
+    //         oldprice: '',
-            text: '流程专业代办，适用于商标风险评估、类别选择无经验的新用户',
+    //         text: '流程专业代办，适用于商标风险评估、类别选择无经验的新用户',
-            left: '成功率', right: '高',
+    //         left: '成功率', right: '高',
-            textArray: [
+    //         textArray: [
-                '专家一对一，全流程代办',
+    //             '专家一对一，全流程代办',
-                '分析风险，优化注册方案',
+    //             '分析风险，优化注册方案',
-                '分析风险，优化注册方案'
+    //             '分析风险，优化注册方案'
-            ],
+    //         ],
-            serve: true,
+    //         serve: true,
-            num: 0
+    //         num: 0
-        },
+    //     },
-        {
+    //     {
-            id: '3', title: '至尊无忧注册', nowprice: '599', cheap: false,
+    //         id: '3', title: '至尊无忧注册', nowprice: TrademarkUltimatePrice, cheap: false,
-            old: false,
+    //         old: false,
-            oldprice: '',
+    //         oldprice: '',
-            text: '专家评估提高通过率，注册失败，可赔付全款',
+    //         text: '专家评估提高通过率，注册失败，可赔付全款',
-            left: '类型', right: '指定类目',
+    //         left: '类型', right: '指定类目',
-            textArray: [
+    //         textArray: [
-                '你注册，我投保',
+    //             '你注册，我投保',
-                '每件商标都有保单',
+    //             '每件商标都有保单',
-                '指定类目驳回，赔付全款'
+    //             '指定类目驳回，赔付全款'
-            ],
+    //         ],
-            serve: true,
+    //         serve: true,
-            num: 0
+    //         num: 0
 
-        },
+    //     },
-    ]
+    // ]
     const [appGoodsId, setAppGoodsId] = useState('') // 选择的商品id
+    const [appGoodsMoney, setAppGoodsMoney] = useState(0) // 选择的商品钱
     useEffect(() => {
         // const nowname = sessionStorage.getItem('now')
         if (location.pathname == '/') {
@@ -1764,6 +1877,34 @@ export default function Index() {
             setTrademarkBox(true)
             setReplaceSearchBox(false)
         }
+        else if (location.pathname.includes('/trademark-ai-edit')) {
+            setShowSearchBox(false)
+            setRrefunSearchBox(false)
+            setCorrectionSearchBox(false)
+            setContractSearchBox(false)
+            setNow('商标 / 智能注册')
+            setSellSearchBox(false)
+            setSellOrderSearchBox(false)
+            setCopyrightSearchBox(false)
+            setTradingSearchBox(false)
+            setAppSearchBox(false)
+            setTrademarkBox(false)
+            setReplaceSearchBox(false)
+        }
+        else if (location.pathname.includes('/trademark-expert-edit')) {
+            setShowSearchBox(false)
+            setRrefunSearchBox(false)
+            setCorrectionSearchBox(false)
+            setContractSearchBox(false)
+            setNow('商标 / 注册商标')
+            setSellSearchBox(false)
+            setSellOrderSearchBox(false)
+            setCopyrightSearchBox(false)
+            setTradingSearchBox(false)
+            setAppSearchBox(false)
+            setTrademarkBox(false)
+            setReplaceSearchBox(false)
+        }
         else if (location.pathname.includes('/replace')) {
             setShowSearchBox(false)
             setRrefunSearchBox(false)
@@ -1802,6 +1943,7 @@ export default function Index() {
         // getLanguageListDate()
         // getSoftTypeListDate()
         getAppGoodsList()
+        getTrademarkGoodsList()
     }, []);
     useEffect(() => {
         // loactionStorage里的activeMenu
@@ -2173,7 +2315,7 @@ export default function Index() {
                                         tradingStartTime={tradingStartTime}
                                         tradingEndTime={tradingEndTime}
                                         tradingStatus={tradingStatus}
-                                        
+
                                         specialPrice={specialPrice}
 
 
@@ -3582,6 +3724,7 @@ export default function Index() {
                                                 onClick={() => {
                                                     setAppModal(true)
                                                     setAppGoodsId('')
+                                                    setAppGoodsMoney(0)
                                                 }}
                                             >申请电子软著</Button>
                                             <Search
@@ -3666,6 +3809,28 @@ export default function Index() {
                                                     setTrademarkModal(true)
                                                 }}
                                             >申请商标</Button>
+                                            <Search placeholder="输入商标名称"
+                                                value={trademarkNewKeywords}
+                                                onSearch={trademarkKeyWordshandleSearch}
+                                                onChange={trademarkKeyWordshandleChange}
+                                                className='searchInputmedia'
+                                                style={{
+                                                    // maxWidth: '200px',
+                                                    width: '170px',
+                                                    height: '31px',
+                                                    marginLeft: '5px'
+                                                }}
+                                                allowClear
+                                            />
+                                            <Button style={{
+                                                marginLeft: 5, height: 31
+                                            }}
+                                                icon={<ClearOutlined />}
+                                                onClick={() => {
+                                                    trademarkInit()
+
+                                                }}>清除</Button>
+
 
                                         </div>
                                     </div>
@@ -4137,7 +4302,8 @@ export default function Index() {
                                         }}
                                         onClick={() => {
                                             setAppGoodsId(item.id)
-                                            // console.log('item.dataId: ', item.dataId);
+                                            setAppGoodsMoney(item.money / 100)
+                                            console.log('item.dataId: ', item);
 
                                         }}
                                     >
@@ -4177,34 +4343,7 @@ export default function Index() {
                                     //    alert('开发中') 
                                     // 创建按订单 如果成功 询问是否继续编辑
                                     // setAppGoodsId('')
-                                    try {
+                                    setTipsModal(true)
-                                        setBuyLoading(true)
-                                        const res = await buyAppGoods(appGoodsId)
-                                        setAppOrderId(res.data)
-                                        setBuyLoading(false)
-                                        setAppModal(false)
-                                        getAppOrderList(1)
-                                        setToEditsModal(true)
-                                        appInit()
-                                        reloadUser(messageApi, globalDispatchContext).then(() => {
-                                            messageApi.success('扣款成功');
-                                        });
-                                        // 更新redux中的appGoodsListAray
-
-                                    } catch (error: any) {
-
-                                        if (error.response) {
-                                            const data = error.response.data;
-                                            messageApi.open({
-                                                type: 'error',
-                                                content: data.msg ? data.msg : `${data.path}(${data.status})`,
-                                            });
-                                        } else {
-                                            console.error(error)
-                                        }
-                                    } finally {
-                                        setBuyLoading(false)
-                                    }
 
 
                                     return
@@ -4256,7 +4395,7 @@ export default function Index() {
 
             >
                 <div className='trademarkArrayBox'>
-                    {trademarkArray.map((item) => {
+                    {trademarkArray.map((item: any) => {
                         return (
                             <div className='trademarkItem' key={item.id}>
                                 <div style={{
@@ -4283,7 +4422,7 @@ export default function Index() {
                                     </div>
                                     <div className='trademarkTextArrayBox'>
                                         {
-                                            item.textArray.map((item: any, index) => {
+                                            item.textArray.map((item: any, index: any) => {
                                                 return (
                                                     <div style={{
                                                         display: 'flex',
@@ -4355,12 +4494,13 @@ export default function Index() {
 
                                                 }}
                                                 onClick={() => {
-                                                    console.log(item);
+                                                    // console.log(item);
                                                     setTrademarkModal(false)
                                                     nav('/trademark-expert-edit', {
                                                         state: {
                                                             title: item.title,
-                                                            price: item.nowprice
+                                                            price: item.nowprice,
+                                                            id: item.id
                                                         }
                                                     })
 
@@ -4389,13 +4529,14 @@ export default function Index() {
 
                                                 }}
                                                 onClick={() => {
-                                                    console.log(item.nowprice);
+                                                    // console.log(item.nowprice);
-                                                    console.log('复杂');
+                                                    // console.log('复杂');
                                                     setTrademarkModal(false)
-                                                    nav('/trademark-ai-edit', {
+                                                    nav(`/trademark-ai-edit/NEW`, {
                                                         state: {
-                                                            title: item.title,
+                                                            trademarkModeName: item.title,
-                                                            price: item.nowprice
+                                                            // price: item.nowprice,
+                                                            trademarkMode: item.id
                                                         }
                                                     })
                                                 }}
@@ -4408,6 +4549,52 @@ export default function Index() {
                     })}
                 </div>
             </Modal >
+            <Modal title="提示"
+                centered
+                destroyOnClose={true}
+                open={tipsModal}
+                onOk={async () => {
+                    try {
+                        setBuyLoading(true)
+                        const res = await buyAppGoods(appGoodsId)
+                        setAppOrderId(res.data)
+                        setBuyLoading(false)
+                        setTipsModal(false)
+                        setAppModal(false)
+                        getAppOrderList(1)
+                        setToEditsModal(true)
+                        appInit()
+                        reloadUser(messageApi, globalDispatchContext).then(() => {
+                            messageApi.success('扣款成功');
+                        });
+                        // 更新redux中的appGoodsListAray
+
+                    } catch (error: any) {
+
+                        if (error.response) {
+                            const data = error.response.data;
+                            messageApi.open({
+                                type: 'error',
+                                content: data.msg ? data.msg : `${data.path}(${data.status})`,
+                            });
+                        } else {
+                            console.error(error)
+                        }
+                        setTipsModal(false)
+
+                    } finally {
+                        setBuyLoading(false)
+                    }
+
+                }}
+                okText='确定'
+                cancelText='取消'
+                onCancel={() => {
+                    setTipsModal(false)
+                }}
+            >
+                该操作会扣除{appGoodsMoney}元，确定操作吗？
+            </Modal>
             <div className='couponMask-box'
                 style={{
                     display: coupon && (location.pathname == '/' || location.pathname.includes('/home')) && couponArray.length == 1 && !phoneModal ? 'unset' : 'none',

src/route/router.tsx

@@ -241,7 +241,7 @@ export const router = createHashRouter(
                   element:<TrademarkExpertEdit/>      
                 },
                  {
-                  path:'/trademark-ai-edit',
+                  path:'/trademark-ai-edit/:trademarkId',
                   element:<TrademarkAiEdit/>      
                 },
                 {