藏品详情-藏品故事

src/components/Z3upFilesRef/index.tsx

@@ -192,7 +192,7 @@ type Props = {
   size?: number
   maxCount?: number
   oneIsCover?: boolean
-  moduleId: number
+  moduleId: number | ''
   ref: any
 }
 

src/components/ZRichTextOne/index.tsx

@@ -24,7 +24,7 @@ type Props = {
   ref: any //当前自己的ref，给父组件调用
   myUrl: string //上传的api地址
   dirCode: string
-  moduleId: number
+  moduleId: number | ''
   titTxt?: string
 }
 

src/pages/ZgoodsInfo/GItab4/index.tsx

@@ -1,10 +1,12 @@
-import React, { useCallback, useEffect, useRef, useState } from 'react'
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import styles from './index.module.scss'
 import { Button, Input } from 'antd'
 import { E2_APIgetList } from '@/store/action/Eculture/E2story'
-import { Typetable } from '@/pages/Zother/data'
 import MyTable from '@/components/MyTable'
 import { GI4tableC } from '@/utils/tableData'
+import { GuShiType } from '@/pages/Zother/GuShi/data'
+import GuShiMo from '@/pages/Zother/GuShi/GuShiMo'
+import history from '@/utils/history'
 
 const baseFormData = {
   searchKey: '',
@@ -17,7 +19,7 @@ type Props = {
 }
 
 function GItab4({ goodId }: Props) {
-  const [tableObj, setTableObj] = useState<{ list: Typetable[]; total: number }>({
+  const [tableObj, setTableObj] = useState<{ list: GuShiType[]; total: number }>({
     list: [],
     total: 0
   })
@@ -43,18 +45,20 @@ function GItab4({ goodId }: Props) {
 
   // 封装发送请求的函数
   const getListFu = useCallback(async () => {
-    const params = {
-      ...formDataRef.current,
-      goodId
-    }
+    if (goodId) {
+      const params = {
+        ...formDataRef.current,
+        goodId
+      }
 
-    const res = await E2_APIgetList(params, true)
-    if (res.code === 0) {
-      const obj = {
-        list: res.data.records || [],
-        total: res.data.total
+      const res = await E2_APIgetList(params, true)
+      if (res.code === 0) {
+        const obj = {
+          list: res.data.records || [],
+          total: res.data.total
+        }
+        setTableObj(obj)
       }
-      setTableObj(obj)
     }
   }, [goodId])
 
@@ -91,6 +95,31 @@ function GItab4({ goodId }: Props) {
     [formData]
   )
 
+  const tableLastBtn = useMemo(() => {
+    return [
+      {
+        title: '操作',
+        render: (item: GuShiType) => (
+          <>
+            <Button size='small' type='text' onClick={() => setAddInfo(item)}>
+              编辑
+            </Button>
+            <Button
+              size='small'
+              type='text'
+              onClick={() => history.push(`/story_edit/4/${item.id}`)}
+            >
+              查看
+            </Button>
+          </>
+        )
+      }
+    ]
+  }, [])
+
+  // 打开弹窗
+  const [addInfo, setAddInfo] = useState({} as GuShiType)
+
   return (
     <div className={styles.GItab4}>
       <div className='GI4top'>
@@ -107,7 +136,9 @@ function GItab4({ goodId }: Props) {
           </Button>
           <Button onClick={resetSelectFu}>重置</Button>
         </div>
-        <Button type='primary'>新增故事</Button>
+        <Button type='primary' onClick={() => setAddInfo({ id: -1 } as GuShiType)}>
+          新增故事
+        </Button>
       </div>
 
       <MyTable
@@ -115,13 +146,26 @@ function GItab4({ goodId }: Props) {
         yHeight={510}
         list={tableObj.list}
         columnsTemp={GI4tableC}
-        lastBtn={[]}
+        lastBtn={tableLastBtn}
         pageNum={formData.pageNum}
         pageSize={formData.pageSize}
         total={tableObj.total}
         onChange={(pageNum, pageSize) => paginationChange(pageNum, pageSize)}
         widthSet={{ remark: 800 }}
       />
+
+      {addInfo.id ? (
+        <GuShiMo
+          goodIds={goodId}
+          moduleId=''
+          guShiInfo={addInfo}
+          closeFu={() => setAddInfo({} as GuShiType)}
+          succFu={(val, info) => {
+            if (val === '新增') resetSelectFu()
+            else clickSearch()
+          }}
+        />
+      ) : null}
     </div>
   )
 }

src/pages/ZgoodsInfo/index.tsx

@@ -19,6 +19,7 @@ import GItab5 from './GItab5'
 import { MessageFu } from '@/utils/message'
 import { FileListType } from '@/components/Z3upFiles/data'
 import { API_getFileListByIds } from '@/store/action/Cledger/C4file'
+import { infoPageIDGet, infoPageIDSet } from '@/utils/storage'
 
 type tabArr1Type = {
   id: number
@@ -201,7 +202,13 @@ function ZgoodsInfo() {
   useEffect(() => {
     const newArr1 = tabArr1Temp.filter(v => authorityIds.includes(v.id))
     if (newArr1.length) {
-      newArr1[0].done = newArr1[0].show = true
+      let index = 0
+      const acId = infoPageIDGet()
+      if (acId) {
+        const index22 = newArr1.findIndex(c => c.id === acId)
+        if (index22 >= 0) index = index22
+      }
+      newArr1[index].done = newArr1[index].show = true
     }
     setTimeout(() => {
       setLoding(true)
@@ -228,6 +235,7 @@ function ZgoodsInfo() {
   // 切换左侧tab
   const cutTabFu = useCallback(
     (id: number) => {
+      infoPageIDSet(id)
       setTabArr1(
         tabArr1.map(v => ({
           ...v,
@@ -295,7 +303,7 @@ function ZgoodsInfo() {
           </>
         ) : (
           <div className='GImainNone' hidden={!loding}>
-            该页面请联系管理员！
+            您没有该页面权限，请联系管理员！
           </div>
         )}
       </div>

src/pages/Zother/GuShi/GuShiMo/index.tsx

@@ -14,10 +14,11 @@ type Props = {
   guShiInfo: GuShiType
   closeFu: () => void
   succFu: (val: '新增' | '编辑', info: GuShiType) => void
-  moduleId: number
+  moduleId: number | ''
   isLook?: boolean
+  goodIds?: number
 }
-function GuShiMo({ guShiInfo, closeFu, succFu, moduleId, isLook = false }: Props) {
+function GuShiMo({ guShiInfo, closeFu, succFu, moduleId, isLook = false, goodIds }: Props) {
   const [info, setInfo] = useState<GuShiType>({
     id: -1,
     name: '',
@@ -68,6 +69,8 @@ function GuShiMo({ guShiInfo, closeFu, succFu, moduleId, isLook = false }: Props
       rtf: rtf.val
     }
 
+    if (goodIds) obj.goodIds = goodIds
+
     const res = await guShiAPI_add(obj)
 
     if (res.code === 0) {
@@ -75,7 +78,7 @@ function GuShiMo({ guShiInfo, closeFu, succFu, moduleId, isLook = false }: Props
       succFu(info.id > 0 ? '编辑' : '新增', res.data)
       closeFu()
     }
-  }, [closeFu, info.id, info.name, info.remark, succFu])
+  }, [closeFu, goodIds, info.id, info.name, info.remark, succFu])
 
   return (
     <Modal

src/utils/history.ts

@@ -1,4 +1,5 @@
 import { createHashHistory } from 'history'
+import { infoPageIDSet } from './storage'
 const history = createHashHistory()
 export default history
 
@@ -16,6 +17,9 @@ export const loginOutFu = () => {
 
 // 新窗口打开藏品详情页面
 export const openLink = (path: string) => {
+  // 清空藏品详情页的id存储
+  infoPageIDSet(0)
+
   const urlAll = window.location.href
   const qian = urlAll.split('/#/')[0]
   window.open(`${qian}/#${path}`, '_blank')

src/utils/storage.ts

@@ -64,3 +64,19 @@ export const changSetFu = (info: RouterTypeRow): void => {
 export const changGetFu = (): RouterTypeRow[] => {
   return JSON.parse(localStorage.getItem(CHANG_KEY) || '[]')
 }
+
+// ------------------藏品详情id，回跳需要
+const GOODPAGE_KEY = 'QING_DAO_PI_JIU_GOODPAGE_KEY'
+
+// 存
+export const infoPageIDSet = (id: number) => {
+  localStorage.setItem(GOODPAGE_KEY, id + '')
+}
+
+// 取
+export const infoPageIDGet = () => {
+  let res = 0
+  let txt = localStorage.getItem(GOODPAGE_KEY) || ''
+  if (txt) res = Number(txt)
+  return res
+}