up

src/components/ZupTypes/index.tsx

@@ -21,19 +21,17 @@ import MyPopconfirm from '../MyPopconfirm'
 // import { A2_APIchangeImgName } from "@/store/action/A2exhibition";
 
 export type FileListType = {
-  fileName: string
-  thumb?: string
-  filePath: string
-  id: number
+  originalName: string
+  originalUrl: string
+  compressedUrl: string
+  _id: string
   type: 'model' | 'img' | 'audio' | 'video'
-  imgName: string
 }
 
 type Props = {
   ref: any //当前自己的ref，给父组件调用
   selecFlag: string //筛选的字符串 模型/图片/音频/视频
   fileCheck: boolean //有没有点击过确定
-  dirCode: string //文件的code码
   myUrl: string //请求地址
   isLook?: boolean //是不是查看
   modelSize?: number //模型文件大小限制
@@ -53,7 +51,6 @@ function ZupTypes(
   {
     selecFlag,
     fileCheck,
-    dirCode,
     myUrl,
     isLook = false,
     modelSize = 500,
@@ -103,10 +100,10 @@ function ZupTypes(
   const fileCheckFu = useMemo(() => {
     let flag = false
     if (typeCheck.length === 0) flag = true
-    if (typeCheck.includes('model') && !fileList.model.id) flag = true
+    if (typeCheck.includes('model') && !fileList.model._id) flag = true
     if (typeCheck.includes('img') && fileList.img.length === 0) flag = true
-    if (typeCheck.includes('audio') && !fileList.audio.id) flag = true
-    if (typeCheck.includes('video') && !fileList.video.id) flag = true
+    if (typeCheck.includes('audio') && !fileList.audio._id) flag = true
+    if (typeCheck.includes('video') && !fileList.video._id) flag = true
     return flag
   }, [fileList, typeCheck])
 
@@ -190,20 +187,11 @@ function ZupTypes(
         // 创建FormData
         const fd = new FormData()
         fd.append('type', fileOneType)
-        fd.append('dirCode', dirCode)
+
         fd.append('isDb', 'true')
-        //初始图片 fileName为：未命名
-        if (isUpName) {
-          fd.append('isDefaultName', 'false')
-        }
 
         fd.append('file', file)
 
-        if (fileOneType === 'img' && file.size > 1 * 1024 * 1024) {
-          // 开启压缩图片
-          fd.append('isCompress', 'true')
-        }
-
         e.target.value = ''
 
         try {
@@ -217,7 +205,7 @@ function ZupTypes(
             if (fileOneType === 'img') {
               setFileList(prev => ({
                 ...prev,
-                img: [...prev.img, { ...res.data, imgName: '未命名' }]
+                img: [...prev.img, { ...res.data, originalName: '未命名' }]
               }))
             } else {
               setFileList(prev => ({ ...prev, [fileOneType]: res.data }))
@@ -232,12 +220,10 @@ function ZupTypes(
     },
     [
       audioSize,
-      dirCode,
       fileList.img.length,
       fileOneType,
       imgLength,
       imgSize,
-      isUpName,
       modelSize,
       multipleImg,
       myUrl,
@@ -273,8 +259,8 @@ function ZupTypes(
 
   // 删除某一张图片
   const delImgListFu = useCallback(
-    (id: number) => {
-      const newItems = fileList.img.filter(v => v.id !== id)
+    (_id: string) => {
+      const newItems = fileList.img.filter(v => v._id !== _id)
       setFileList({ ...fileList, img: newItems })
     },
     [fileList]
@@ -289,16 +275,16 @@ function ZupTypes(
             <span> </span>
             {type === 'model' ? '模型' : type === 'audio' ? '音频' : '视频'}：
           </div>
-          {fileList[type].id ? (
+          {fileList[type]._id ? (
             <div className='ZTbox2'>
-              <div className='ZTbox2Name'>{fileList[type].fileName}</div>
+              <div className='ZTbox2Name'>{fileList[type].originalName}</div>
 
               <div
                 className='ZTbox2Look'
                 onClick={() =>
                   store.dispatch({
                     type: 'layout/lookDom',
-                    payload: { src: fileList[type].filePath, type }
+                    payload: { src: fileList[type].originalUrl, type }
                   })
                 }
               >
@@ -306,7 +292,7 @@ function ZupTypes(
               </div>
 
               <a
-                href={baseURL + fileList[type].filePath}
+                href={baseURL + fileList[type].originalUrl}
                 download
                 target='_blank'
                 className='ZTbox2Down'
@@ -358,7 +344,7 @@ function ZupTypes(
 
       data.forEach(v => {
         if (v.type === 'img') {
-          obj.img.push({ ...v, imgName: v.fileName })
+          obj.img.push(v)
         } else obj[v.type!] = v
       })
       setFileList(obj)
@@ -367,20 +353,20 @@ function ZupTypes(
 
   // --------------让父组件调用的返回 附件 信息
   const fileComFileResFu = useCallback(() => {
-    let coverUrl = ''
-    let coverUrlBig = ''
+    let cover = ''
+    let coverSmall = ''
     const fileIds = []
-    if (fileList.model.id && typeCheck.includes('model')) fileIds.push(fileList.model.id)
-    if (fileList.audio.id && typeCheck.includes('audio')) fileIds.push(fileList.audio.id)
-    if (fileList.video.id && typeCheck.includes('video')) fileIds.push(fileList.video.id)
+    if (fileList.model._id && typeCheck.includes('model')) fileIds.push(fileList.model._id)
+    if (fileList.audio._id && typeCheck.includes('audio')) fileIds.push(fileList.audio._id)
+    if (fileList.video._id && typeCheck.includes('video')) fileIds.push(fileList.video._id)
     if (typeCheck.includes('img')) {
       fileList.img.forEach((v, i) => {
-        if (v.id) {
-          fileIds.push(v.id)
+        if (v._id) {
+          fileIds.push(v._id)
           if (oneIsCover && i === 0) {
             // 返回 第一张图的url 作为封面
-            coverUrl = v.thumb || v.filePath
-            coverUrlBig = v.filePath || v.thumb!
+            cover = v.originalUrl || v.compressedUrl
+            coverSmall = v.compressedUrl || v.originalUrl
           }
         }
       })
@@ -389,15 +375,15 @@ function ZupTypes(
       sonType: typeCheck,
       sonFileIds: fileIds,
       sonIsOk: fileCheckFu,
-      coverUrl,
-      coverUrlBig
+      cover,
+      coverSmall
     }
   }, [
     fileCheckFu,
-    fileList.audio.id,
+    fileList.audio._id,
     fileList.img,
-    fileList.model.id,
-    fileList.video.id,
+    fileList.model._id,
+    fileList.video._id,
     oneIsCover,
     typeCheck
   ])
@@ -410,21 +396,21 @@ function ZupTypes(
 
   // 修改图片名称
   const [isNameChange, setIsNameChange] = useState({
-    id: 0,
+    id: '',
     oldName: '',
     newName: ''
   })
 
   // 关闭弹窗
   const isNameChangeXFu = useCallback(() => {
-    setIsNameChange({ id: 0, oldName: '', newName: '' })
+    setIsNameChange({ id: '', oldName: '', newName: '' })
   }, [])
 
   // 点击图片名字-出来弹窗
   const isNameChangeFu = useCallback(
     (item: FileListType) => {
       if (isLook) return
-      setIsNameChange({ id: item.id, oldName: item.imgName, newName: '' })
+      setIsNameChange({ id: item._id, oldName: item.originalName, newName: '' })
     },
     [isLook]
   )
@@ -444,7 +430,7 @@ function ZupTypes(
   //       ...fileList,
   //       img: fileList.img.map((v) => ({
   //         ...v,
-  //         imgName: v.id === isNameChange.id ? isNameChange.newName : v.imgName,
+  //         originalName: v.id === isNameChange.id ? isNameChange.newName : v.originalName,
   //       })),
   //     });
   //     isNameChangeXFu();
@@ -499,15 +485,21 @@ function ZupTypes(
             {fileList.img.map((v, i) => (
               <div
                 className='ZTbox1ImgRow'
-                key={v.id}
+                key={v._id}
                 draggable='true'
                 onDragStart={() => setDragImg(v)}
                 onDragOver={e => handleDragOver(e, v)}
                 onDragEnter={e => handleDragEnter(e, v)}
                 onDragEnd={() => setDragImg(null)}
               >
-                {v.thumb || v.filePath ? (
-                  <ImageLazy noLook={true} width={100} height={100} src={v.thumb || v.filePath} />
+                {v.compressedUrl || v.originalUrl ? (
+                  <ImageLazy
+                    noLook={true}
+                    width={100}
+                    height={100}
+                    src={v.compressedUrl || v.originalUrl}
+                    srcBig={v.originalUrl || v.compressedUrl}
+                  />
                 ) : null}
 
                 {oneIsCover && i === 0 ? <div className='ZTbox1ImgRowCover'>封面</div> : null}
@@ -515,11 +507,11 @@ function ZupTypes(
                 {/* 修改图片名字 */}
                 {isUpName ? (
                   <div
-                    title={v.imgName}
+                    title={v.originalName}
                     className='ZTbox1ImgRowName'
                     onClick={() => isNameChangeFu(v)}
                   >
-                    {v.imgName}
+                    {v.originalName}
                   </div>
                 ) : null}
 
@@ -529,21 +521,21 @@ function ZupTypes(
                       store.dispatch({
                         type: 'layout/lookBigImg',
                         payload: {
-                          url: baseURL + v.filePath,
+                          url: baseURL + v.originalUrl,
                           show: true
                         }
                       })
                     }
                     rev={undefined}
                   />
-                  <a href={baseURL + v.filePath} download target='_blank' rel='noreferrer'>
+                  <a href={baseURL + v.originalUrl} download target='_blank' rel='noreferrer'>
                     <DownloadOutlined rev={undefined} />
                   </a>
                 </div>
 
                 <MyPopconfirm
                   txtK='删除'
-                  onConfirm={() => delImgListFu(v.id!)}
+                  onConfirm={() => delImgListFu(v._id)}
                   Dom={<CloseOutlined className='ZTbox1ImgRowX' rev={undefined} />}
                 />
               </div>

src/components/ZupVideos/index.tsx

@@ -144,16 +144,16 @@ function ZupVideos(
         </div>
 
         {fileList.map(v => (
-          <div className='zVRow' key={v.id}>
+          <div className='zVRow' key={v._id}>
             <div className='zVRow1'>
-              <div className='zVRow1V' title={v.fileName}>
-                <video src={baseURL + v.filePath}></video>
+              <div className='zVRow1V' title={v.originalName}>
+                <video src={baseURL + v.originalUrl}></video>
               </div>
               <div className='zVRow1I'>
                 {/* 视频预览 */}
-                <EyeOutlined onClick={() => lookFileFu(v.filePath)} />
+                <EyeOutlined onClick={() => lookFileFu(v.originalUrl)} />
                 {/* 视频下载 */}
-                <a href={baseURL + v.filePath} download target='_blank' rel='noreferrer'>
+                <a href={baseURL + v.originalUrl} download target='_blank' rel='noreferrer'>
                   <DownloadOutlined />
                 </a>
                 {/* 视频删除 */}
@@ -161,14 +161,14 @@ function ZupVideos(
                 {isLook ? null : (
                   <MyPopconfirm
                     txtK='删除'
-                    onConfirm={() => setFileList(fileList.filter(c => c.id !== v.id))}
+                    onConfirm={() => setFileList(fileList.filter(c => c._id !== v._id))}
                     Dom={<CloseOutlined />}
                   />
                 )}
               </div>
             </div>
-            <div className='zVRow2' title={v.fileName}>
-              {v.fileName}
+            <div className='zVRow2' title={v.originalName}>
+              {v.originalName}
             </div>
           </div>
         ))}

src/pages/A3goods/A3add/index.module.scss

@@ -0,0 +1,56 @@
+.A3add {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: #fff;
+  border-radius: 10px;
+  padding: 20px;
+  :global {
+    .A3main {
+      width: 100%;
+      height: 100%;
+      overflow-y: auto;
+      .ant-form {
+        width: 1000px;
+        .ant-form-item-label {
+          width: 120px;
+        }
+
+        .formBox {
+          display: flex;
+          margin-bottom: 24px;
+          .formBoxll {
+            width: 120px;
+            text-align: right;
+            line-height: 26px;
+            & > span {
+              color: #ff4d4f;
+            }
+          }
+          .formBoxrr {
+            width: calc(100% - 120px);
+          }
+        }
+        .sortForm {
+          position: relative;
+          .fromRowTit {
+            position: absolute;
+            left: 225px;
+            top: 6px;
+            color: #999;
+            font-size: 12px;
+          }
+        }
+        .BtnForm {
+          padding-left: 120px;
+          margin-top: 40px;
+          .ant-btn {
+            margin-right: 30px;
+          }
+        }
+      }
+    }
+  }
+}

src/pages/A3goods/A3add/index.tsx

@@ -0,0 +1,209 @@
+import React, { useCallback, useEffect, useRef, useState } from 'react'
+import styles from './index.module.scss'
+import { AddTxtType } from '@/pages/A2video/data'
+import { DatePicker, Form, FormInstance, Input, InputNumber, Select } from 'antd'
+import { A3_APIgetInfo, A3_APIsave } from '@/store/action/A3goods'
+import dayjs from 'dayjs'
+import { MessageFu } from '@/utils/message'
+import { A3typeSelectType } from '../data'
+import ZupOne from '@/components/ZupOne'
+import TextArea from 'antd/es/input/TextArea'
+import ZupTypes from '@/components/ZupTypes'
+
+type Props = {
+  txt: AddTxtType
+  _id: string
+  closeFu: () => void
+  addTableFu: () => void
+  editTableFu: () => void
+}
+
+function A3add({ txt, _id, closeFu, addTableFu, editTableFu }: Props) {
+  const FormBoxRef = useRef<FormInstance>(null)
+  // 封面图的ref
+  const ZupThumbRef = useRef<any>(null)
+
+  // 文件类型的ref
+  const ZupTypesRef = useRef<any>(null)
+
+  const getInfoFu = useCallback(async (_id: string) => {
+    const res = await A3_APIgetInfo(_id)
+    if (res.code === 0) {
+      const info = res.data
+
+      if (info.releaseDate) info.releaseDate = dayjs(info.releaseDate)
+
+      FormBoxRef.current?.setFieldsValue(info)
+      // 设置封面图
+      ZupThumbRef.current?.setFileComFileFu({
+        originalName: '',
+        originalUrl: info.cover,
+        compressedUrl: info.coverSmall
+      })
+      //  设置附件类型
+      ZupTypesRef.current?.setFileComFileFu(info.fileIds || [])
+    }
+  }, [])
+
+  useEffect(() => {
+    if (_id) getInfoFu(_id)
+    else FormBoxRef.current?.setFieldsValue({ releaseDate: dayjs() })
+  }, [_id, getInfoFu])
+
+  // 有没有点击确定，检验图片和视频
+  const [fileCheck, setFileCheck] = useState(false)
+
+  // 没有通过校验
+  const onFinishFailed = useCallback(() => {
+    setFileCheck(true)
+  }, [])
+
+  // 通过校验点击确定
+  const onFinish = useCallback(
+    async (values: any) => {
+      setFileCheck(true)
+      // 封面图
+      const coverUrl = ZupThumbRef.current?.fileComFileResFu()
+      if (!coverUrl.originalUrl) return MessageFu.warning('请上传封面图')
+
+      // 文件类型
+      const { sonIsOk, sonType, sonFileIds } = ZupTypesRef.current?.fileComFileResFu()
+
+      if (sonIsOk) return MessageFu.warning('请至少选择一个文件类型并上传附件')
+
+      const obj = {
+        ...values,
+        _id: txt === '新增' ? null : _id,
+        releaseDate: values.releaseDate ? dayjs(values.releaseDate).format('YYYY-MM-DD') : '',
+        cover: coverUrl.originalUrl || '',
+        coverSmall: coverUrl.compressedUrl || '',
+        fileType: sonType || [],
+        fileIds: sonFileIds || []
+      }
+
+      const res: any = await A3_APIsave(obj)
+
+      if (res.code === 0) {
+        if (txt === '新增') addTableFu()
+        else editTableFu()
+        MessageFu.success(txt === '新增' ? '新增成功' : '编辑成功')
+        closeFu()
+      }
+      // console.log("通过校验，点击确定");
+    },
+    [addTableFu, closeFu, editTableFu, _id, txt]
+  )
+
+  return (
+    <div className={styles.A3add}>
+      <div className='A3main'>
+        <Form
+          scrollToFirstError={true}
+          ref={FormBoxRef}
+          name='basic'
+          onFinish={onFinish}
+          onFinishFailed={onFinishFailed}
+          autoComplete='off'
+        >
+          <Form.Item
+            label='标题'
+            name='name'
+            rules={[{ required: true, message: '请输入标题!' }]}
+            getValueFromEvent={e => e.target.value.trim()}
+          >
+            <Input readOnly={txt === '查看'} maxLength={30} showCount placeholder='请输入内容' />
+          </Form.Item>
+
+          <Form.Item
+            label='发布日期'
+            name='releaseDate'
+            rules={[{ required: true, message: '请选择发布日期!' }]}
+          >
+            <DatePicker disabled={txt === '查看'} allowClear={false} />
+          </Form.Item>
+
+          <Form.Item label='类别' name='type' rules={[{ required: true, message: '请选择类别!' }]}>
+            <Select
+              disabled={txt === '查看'}
+              style={{ width: 150 }}
+              options={A3typeSelectType}
+              placeholder='请选择'
+            />
+          </Form.Item>
+
+          <div className='formBox'>
+            <div className='formBoxll'>
+              <span>* </span>封面：
+            </div>
+            <div className='formBoxrr'>
+              <ZupOne
+                ref={ZupThumbRef}
+                isLook={txt === '查看'}
+                fileCheck={fileCheck}
+                myUrl='file/upload?upPath=A2video'
+                format={['image/jpeg', 'image/png']}
+                formatTxt='png、jpg和jpeg'
+                checkTxt='请上传封面图'
+                upTxt='最多1张'
+                myType='thumb'
+                size={5}
+              />
+            </div>
+          </div>
+
+          <Form.Item
+            label='概述'
+            name='description'
+            rules={[{ required: true, message: '请输入概述!' }]}
+            getValueFromEvent={e => e.target.value}
+          >
+            <TextArea
+              readOnly={txt === '查看'}
+              maxLength={500}
+              showCount
+              placeholder='请输入内容'
+            />
+          </Form.Item>
+
+          <div className='sortForm'>
+            <Form.Item
+              label='排序值'
+              name='sort'
+              initialValue={999}
+              rules={[{ required: true, message: '请输入排序值' }]}
+            >
+              <InputNumber readOnly={txt === '查看'} min={1} max={999} placeholder='请输入' />
+            </Form.Item>
+            <div className='fromRowTit'>
+              请输入1~999的数字。数字越大，排序越靠前。数字相同时，更新发布的内容排在前面
+            </div>
+          </div>
+
+          <div className='formBox'>
+            <div className='formBoxll'>
+              <span>* </span>文件类型：
+            </div>
+            <div className='formBoxrr'>
+              <ZupTypes
+                ref={ZupTypesRef}
+                selecFlag='模型/图片/音频/视频'
+                fileCheck={fileCheck}
+                myUrl='file/upload?upPath=A3goods'
+                isLook={txt === '查看'}
+                imgLength={20}
+                audioSize={50}
+                videoSize={500}
+                videoTit='最多可上传一个视频，支持MP4格式，不超过500M'
+                multipleImg={true}
+              />
+            </div>
+          </div>
+        </Form>
+      </div>
+    </div>
+  )
+}
+
+const MemoA3add = React.memo(A3add)
+
+export default MemoA3add

src/pages/A3goods/data.ts

@@ -0,0 +1,28 @@
+import { FileListType } from '@/components/ZupTypes'
+
+export type A3listType = {
+  _id: string
+  name: string
+  releaseDate: string
+  type: string
+  cover: string
+  coverSmall: string
+  description: string
+  fileType: string[]
+  videoUrl: string
+  videoName: string
+  imgIds: string[]
+  fileIds: FileListType[]
+  modelLink: string
+  audioUrl: string
+  audioName: string
+  sort: number
+  createTime: string
+  updateTime: string
+}
+
+export const A3typeSelectType = [
+  { value: '展厅陈列品', label: '展厅陈列品' },
+  { value: '实验设备', label: '实验设备' },
+  { value: '对外文件', label: '对外文件' }
+]

src/pages/A3goods/index.module.scss

@@ -1,4 +1,16 @@
 .A3goods {
+  background-color: #fff;
+  border-radius: 10px;
+  padding: 20px;
+  position: relative;
   :global {
+    .A3top {
+      display: flex;
+      justify-content: space-between;
+      margin-bottom: 20px;
+    }
+    .ant-table-cell {
+      padding: 8px !important;
+    }
   }
 }

src/pages/A3goods/index.tsx

@@ -1,9 +1,154 @@
-import React from 'react'
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import styles from './index.module.scss'
+import { useDispatch, useSelector } from 'react-redux'
+import { UserTableAPIType } from '@/types'
+import { A3_APIdel, A3_APIgetList } from '@/store/action/A3goods'
+import { RootState } from '@/store'
+import { MessageFu } from '@/utils/message'
+import { A3listType } from './data'
+import { Button, Input } from 'antd'
+import MyPopconfirm from '@/components/MyPopconfirm'
+import { AddTxtType } from '../A2video/data'
+import { A2tableC } from '@/utils/tableData'
+import MyTable from '@/components/MyTable'
+import A3add from './A3add'
 function A3goods() {
+  const dispatch = useDispatch()
+
+  // 顶部筛选
+  const [fromData, setFromData] = useState<UserTableAPIType>({
+    pageNum: 1,
+    pageSize: 10,
+    searchKey: ''
+  })
+
+  // 封装发送请求的函数
+  const getListFu = useCallback(async () => {
+    dispatch(A3_APIgetList(fromData))
+  }, [dispatch, fromData])
+
+  useEffect(() => {
+    getListFu()
+  }, [getListFu])
+
+  const timeRef = useRef(-1)
+  // 输入框的输入
+  const txtChangeFu = useCallback(
+    (e: React.ChangeEvent<HTMLInputElement>, key: 'searchKey') => {
+      clearTimeout(timeRef.current)
+      timeRef.current = window.setTimeout(() => {
+        setFromData({
+          ...fromData,
+          [key]: e.target.value,
+          pageNum: 1
+        })
+      }, 500)
+    },
+    [fromData]
+  )
+
+  // 点击重置
+  const [inputKey, setInputKey] = useState(1)
+  const resetSelectFu = useCallback(() => {
+    setInputKey(Date.now())
+    setFromData({
+      pageNum: 1,
+      pageSize: 10,
+      searchKey: ''
+    })
+  }, [])
+
+  // 从仓库中获取表格数据
+  const tableInfo = useSelector((state: RootState) => state.A3goods.tableInfo)
+
+  // 点击删除
+  const delTableFu = useCallback(
+    async (id: string) => {
+      const res: any = await A3_APIdel(id)
+      if (res.code === 0) {
+        MessageFu.success('删除成功')
+        getListFu()
+      }
+    },
+    [getListFu]
+  )
+
+  const tableLastBtn = useMemo(() => {
+    return [
+      {
+        title: '操作',
+        render: (item: A3listType) => (
+          <>
+            <Button
+              size='small'
+              type='text'
+              onClick={() => setEditInfo({ txt: '查看', _id: item._id })}
+            >
+              查看
+            </Button>
+            <Button
+              size='small'
+              type='text'
+              onClick={() => setEditInfo({ txt: '编辑', _id: item._id })}
+            >
+              编辑
+            </Button>
+            <MyPopconfirm txtK='删除' onConfirm={() => delTableFu(item._id)} />
+          </>
+        )
+      }
+    ]
+  }, [delTableFu])
+
+  // 新增 编辑 查看
+  const [editInfo, setEditInfo] = useState({ txt: '', _id: '' } as { txt: AddTxtType; _id: string })
+
   return (
     <div className={styles.A3goods}>
-      <h1>A3goods</h1>
+      <div className='pageTitle'>展品展示{editInfo.txt ? ` - ${editInfo.txt}` : ''}</div>
+
+      <div className='A3top'>
+        <div className='A3topll'>
+          <Input
+            key={inputKey}
+            maxLength={10}
+            showCount
+            style={{ width: 300 }}
+            placeholder='请输入标题'
+            allowClear
+            onChange={e => txtChangeFu(e, 'searchKey')}
+          />
+        </div>
+        <div className='A3toprr'>
+          <Button onClick={resetSelectFu}>重置</Button>&emsp;
+          <Button type='primary' onClick={() => setEditInfo({ txt: '新增', _id: '' })}>
+            新增
+          </Button>
+        </div>
+      </div>
+
+      {/* 表格主体 */}
+      <MyTable
+        yHeight={650}
+        list={tableInfo.list}
+        columnsTemp={A2tableC}
+        lastBtn={tableLastBtn}
+        pageNum={fromData.pageNum}
+        pageSize={fromData.pageSize}
+        total={tableInfo.total}
+        onChange={(pageNum, pageSize) => setFromData({ ...fromData, pageNum, pageSize })}
+      />
+
+      {/* 新增 查看 编辑 */}
+      {editInfo.txt ? (
+        <A3add
+          txt={editInfo.txt}
+          _id={editInfo._id}
+          closeFu={() => setEditInfo({ txt: '', _id: '' })}
+          addTableFu={resetSelectFu}
+          editTableFu={getListFu}
+        />
+      ) : null}
     </div>
   )
 }

src/pages/Layout/index.tsx

@@ -8,7 +8,7 @@ import { Button, Form, Input, Modal } from 'antd'
 import { Base64 } from 'js-base64'
 import encodeStr from '@/utils/pass'
 import { passWordEditAPI } from '@/store/action/layout'
-import { changSetFu, getTokenInfo, removeTokenInfo } from '@/utils/storage'
+import { getTokenInfo, removeTokenInfo } from '@/utils/storage'
 import { MessageFu } from '@/utils/message'
 import NotFound from '@/components/NotFound'
 import classNames from 'classnames'
@@ -120,7 +120,6 @@ function Layout() {
   // 点击跳转
   const pathCutFu = useCallback((item: RouterTypeRow) => {
     history.push(item.path)
-    if (item.name !== '工作台') changSetFu(item)
   }, [])
 
   // 修改密码相关

src/store/action/A3goods.ts

@@ -0,0 +1,40 @@
+import http from '@/utils/http'
+import { AppDispatch } from '..'
+
+/**
+ * 展品展示-获取列表
+ */
+
+export const A3_APIgetList = (data: any): any => {
+  return async (dispatch: AppDispatch) => {
+    const res = await http.post('issue/getGoodsList', data)
+    if (res.code === 0) {
+      const obj = {
+        list: res.data.list,
+        total: res.data.total
+      }
+      dispatch({ type: 'A3/getList', payload: obj })
+    }
+  }
+}
+
+/**
+ * 展品展示-新增/编辑数据
+ */
+export const A3_APIsave = (data: any) => {
+  return http.post('issue/saveGoods', data)
+}
+
+/**
+ * 展品展示-删除数据
+ */
+export const A3_APIdel = (_id: string) => {
+  return http.get(`issue/delGoods/${_id}`)
+}
+
+/**
+ * 展品展示-通过id获取详情
+ */
+export const A3_APIgetInfo = (_id: string) => {
+  return http.get(`issue/getGoodsInfo/${_id}`)
+}

src/store/reducer/A3goods.ts

@@ -0,0 +1,28 @@
+import { A3listType } from '@/pages/A3goods/data'
+
+// 初始化状态
+const initState = {
+  // 列表数据
+  tableInfo: {
+    list: [] as A3listType[],
+    total: 0
+  }
+}
+
+// 定义 action 类型
+type Props = {
+  type: 'A3/getList'
+  payload: { list: A3listType[]; total: number }
+}
+
+// reducer
+export default function userReducer(state = initState, action: Props) {
+  switch (action.type) {
+    // 获取列表数据
+    case 'A3/getList':
+      return { ...state, tableInfo: action.payload }
+
+    default:
+      return state
+  }
+}

src/store/reducer/index.ts

@@ -4,6 +4,7 @@ import { combineReducers } from 'redux'
 // 导入 登录 模块的 reducer
 import A0Layout from './layout'
 import A2video from './A2video'
+import A3goods from './A3goods'
 import Z1user from './Z1user'
 import Z2log from './Z2log'
 
@@ -11,6 +12,7 @@ import Z2log from './Z2log'
 const rootReducer = combineReducers({
   A0Layout,
   A2video,
+  A3goods,
   Z1user,
   Z2log
 })

src/utils/storage.ts

@@ -1,7 +1,5 @@
 // ------------------------------------token的本地存储------------------------------------
 
-import { RouterTypeRow } from '@/types'
-
 // 用户 Token 的本地缓存键名，自己定义
 const TOKEN_KEY = 'GUOJIATONGBUFUSHE_HOUTAI_USETINFO'
 
@@ -40,27 +38,3 @@ export const hasToken = (): boolean => {
 export const getTokenFu = (): string => {
   return getTokenInfo().token
 }
-
-// --------------------业务中心-常用功能存储
-const CHANG_KEY = 'JILINGGOODS_HT_CHANG_ARR'
-
-// 存
-export const changSetFu = (info: RouterTypeRow): void => {
-  const oldArr = changGetFu()
-
-  let newArr: RouterTypeRow[] = []
-
-  // 已经存在了
-  const oldIds = oldArr.map(v => v.id)
-  if (oldIds.includes(info.id)) newArr = oldArr
-  else {
-    if (oldArr.length <= 2) newArr = [...oldArr, info]
-    else newArr = [...oldArr.slice(-2), info]
-  }
-
-  localStorage.setItem(CHANG_KEY, JSON.stringify(newArr))
-}
-// 取
-export const changGetFu = (): RouterTypeRow[] => {
-  return JSON.parse(localStorage.getItem(CHANG_KEY) || '[]')
-}