Browse Source

修复展馆预约问题

shaogen1995 7 tháng trước cách đây
mục cha
commit
05a4f27c9b
2 tập tin đã thay đổi với 57 bổ sung96 xóa
  1. 52 95
      展示端/src/pages/B3start/index.tsx
  2. 5 1
      展示端/src/pages/B3start/type.d.ts

+ 52 - 95
展示端/src/pages/B3start/index.tsx

@@ -1,15 +1,15 @@
-import React, { useCallback, useEffect, useMemo, useState } from 'react'
+import React, { useCallback, useEffect, useState } from 'react'
 import styles from './index.module.scss'
 import ZexhiBtn from '@/components/ZexhiBtn'
 import dayjs from 'dayjs'
 import getWeekList, { TimeChageResType } from '@/utils/timeChange'
 import classNames from 'classnames'
 import history from '@/utils/history'
-import { B1_APIgetInfoByDay, B3_APIgetList } from '@/store/action/all'
-import { B3ListApiType, B3TimeArrType } from './type'
+import { B1_APIgetInfoByDay } from '@/store/action/all'
+import { B3TimeArrType } from './type'
 
 function B3start() {
-  const [list, setList] = useState<B3ListApiType[]>([])
+  const [list, setList] = useState<B3TimeArrType[]>([])
 
   const [loding, setLoding] = useState(false)
 
@@ -18,34 +18,32 @@ function B3start() {
     const res = await B1_APIgetInfoByDay(dayjs().format('YYYY-MM-DD'))
 
     if (res.code === 0) {
-      const res2 = await B3_APIgetList()
-      if (res2.code === 0) {
-        let noTime: string = res.data.stopDate
-        let noTimeArr = noTime
-          .replaceAll('年', '.')
-          .replaceAll('月', '.')
-          .replaceAll('日', '')
-          .split(',')
-        // noTimeArr = noTimeArr.map(v => dayjs().format('YYYY') + '.' + v)
-        const arr = getWeekList()
-
-        let arrRes: TimeChageResType[] = []
-        arr.forEach(v => {
-          if (!noTimeArr.includes(v.date)) {
-            arrRes.push(v)
-            // 只有周六日可以约
-            // const num = dayjs(v.timeStamp).day()
-            // if ([6, 0].includes(num)) arrRes.push(v)
-          }
-        })
-
-        if (arrRes && arrRes.length) setNowTime(arrRes[0].date)
-
-        setZhouArr(arrRes)
-
-        setLoding(true)
-        setList(res2.data)
-      }
+      let noTime: string = res.data.stopDate
+      let noTimeArr = noTime
+        .replaceAll('年', '.')
+        .replaceAll('月', '.')
+        .replaceAll('日', '')
+        .split(',')
+      // noTimeArr = noTimeArr.map(v => dayjs().format('YYYY') + '.' + v)
+      const arr = getWeekList()
+
+      let arrRes: TimeChageResType[] = []
+      arr.forEach(v => {
+        if (!noTimeArr.includes(v.date)) {
+          arrRes.push(v)
+          // 只有周六日可以约
+          // const num = dayjs(v.timeStamp).day()
+          // if ([6, 0].includes(num)) arrRes.push(v)
+        }
+      })
+
+      if (arrRes && arrRes.length) setNowTime(arrRes[0].date)
+
+      setZhouArr(arrRes)
+
+      setLoding(true)
+
+      setList(res.data.time)
     }
   }, [])
 
@@ -74,68 +72,14 @@ function B3start() {
   // 获取当前时间
   const [nowTime, setNowTime] = useState('')
 
-  // 当天往后延申的一共七天日期
+  // 顶部一共七天日期
   const [zhouArr, setZhouArr] = useState<TimeChageResType[]>([])
 
-  // 当前选中时间 返回 周几(用索引表示)
-  const indexRes = useMemo(() => {
-    let num = -1
-    const obj = zhouArr.find(v => v.date === nowTime)
-    if (obj) {
-      num = dayjs(obj.timeStamp).day()
-      if (num === 0) num = 6
-      else num -= 1
-    }
-    return num
-  }, [nowTime, zhouArr])
-
-  // 一周的所有 时段 数字 合集
-  const zhouObj = useMemo(() => {
-    const obj: { [key: string]: B3TimeArrType[] } = {
-      0: [],
-      1: [],
-      2: [],
-      3: [],
-      4: [],
-      5: [],
-      6: []
-    }
-
-    list.forEach(v => {
-      obj[0].push({ id: v.id, name: v.time, num: v.monday })
-      obj[1].push({ id: v.id, name: v.time, num: v.tuesday })
-      obj[2].push({ id: v.id, name: v.time, num: v.wednesday })
-      obj[3].push({ id: v.id, name: v.time, num: v.thursday })
-      obj[4].push({ id: v.id, name: v.time, num: v.friday })
-      obj[5].push({ id: v.id, name: v.time, num: v.saturday })
-      obj[6].push({ id: v.id, name: v.time, num: v.sunday })
-    })
-
-    return obj
-  }, [list])
-
-  // 返回的数据
-  const numRes = useMemo(() => {
-    let arr: B3TimeArrType[] = []
-
-    if (indexRes > -1) arr = zhouObj[indexRes]
-    // console.log(123, arr)
-
-    return arr
-    // const index = nowTime.
-  }, [indexRes, zhouObj])
-
   const [acInd, setAcInd] = useState({
     index: -1,
     id: 0
   })
 
-  const pageInd = useMemo(() => {
-    let num = 0
-    if (numRes[acInd.index] && numRes[acInd.index].num) num = numRes[acInd.index].num
-    return num
-  }, [acInd, numRes])
-
   // 判断当天时间是否已经超时
   const nowDayFlag = useCallback(
     (time: string) => {
@@ -155,6 +99,19 @@ function B3start() {
     [nowTime]
   )
 
+  // 点击顶部的切换日期
+  const cutTopFu = useCallback(async (val: string) => {
+    const varRes = val.replaceAll('.', '-')
+
+    const res = await B1_APIgetInfoByDay(varRes)
+
+    if (res.code === 0) {
+      setNowTime(val)
+      setAcInd({ index: -1, id: 0 })
+      setList(res.data.time)
+    }
+  }, [])
+
   return (
     <div className={styles.B3start}>
       <div className='B3main'>
@@ -167,7 +124,7 @@ function B3start() {
               <div
                 key={item.name}
                 className={classNames('B3dayRow', nowTime === item.date ? 'B3dayRowAc' : '')}
-                onClick={() => setNowTime(item.date)}
+                onClick={() => cutTopFu(item.date)}
               >
                 <div>{item.name}</div>
                 <div>{item.date.slice(-2)}</div>
@@ -182,20 +139,20 @@ function B3start() {
 
         <div className='B3tit'>入馆时间</div>
 
-        {numRes.length ? (
+        {list.length ? (
           <div className='B3time'>
-            {numRes.map((item, index) => (
+            {list.map((item, index) => (
               <div
-                key={item.name}
+                key={item.id}
                 onClick={() => setAcInd({ index, id: item.id })}
                 className={classNames(
                   'B3timeRow',
                   acInd.index === index ? 'B3timeRowAc' : '',
-                  item.num <= 0 || nowDayFlag(item.name) ? 'myBtnNo' : ''
+                  item.pcs <= 0 || nowDayFlag(item.time) ? 'myBtnNo' : ''
                 )}
               >
-                {item.name}
-                {item.num <= 0 ? <p>预约已满</p> : ''}
+                {item.time}
+                {item.pcs <= 0 ? <p>预约已满</p> : ''}
               </div>
             ))}
           </div>
@@ -206,7 +163,7 @@ function B3start() {
         )}
       </div>
       <ZexhiBtn
-        nextOk={!!pageInd}
+        nextOk={acInd.index > -1}
         nextFu={() => history.push(`/exhiForm/${nowTime.replaceAll('.', '_')}/${acInd.index}`)}
       />
     </div>

+ 5 - 1
展示端/src/pages/B3start/type.d.ts

@@ -14,4 +14,8 @@ export type B3ListApiType = {
   wednesday: number
 }
 
-export type B3TimeArrType = { name: string; num: number; id: number }
+export type B3TimeArrType = {
+  id: number
+  pcs: number
+  time: string
+}