更新一版

后台管理/src/utils/http.ts

@@ -7,8 +7,8 @@ import { domShowFu } from './domShow'
 
 const envFlag = process.env.NODE_ENV === 'development'
 
-// const baseUrlTemp = 'https://sit-hqbooking.4dage.com' // 测试环境
-const baseUrlTemp = 'http://192.168.20.61:8091' // 线下环境
+const baseUrlTemp = 'https://sit-hqbooking.4dage.com' // 测试环境
+// const baseUrlTemp = 'http://192.168.20.61:8091' // 线下环境
 
 const baseFlag = baseUrlTemp.includes('https://')
 

后台管理/src/utils/tableData.ts

@@ -66,10 +66,10 @@ export const A61tableC = [
 export const A6tableC = [
   ['txt', '预约日期', 'bookDate'],
   [
-    'txtChange',
+    'txt',
     '预约时段',
-    'bookTime',
-    { am: '上午', pm: '下午', 2: '已拒绝', 3: '已失效' }
+    'bookTime'
+    // { am: '上午', pm: '下午', 2: '已拒绝', 3: '已失效' }
   ],
   ['txt', '预约课程', 'subjectName'],
   ['txt', '	负责人姓名', 'name'],

展示端/src/components/RouterOrder.tsx

@@ -30,19 +30,19 @@ const routerArr = [
     name: '选择日期',
     path: '/selectDay',
     exact: true,
-    Com: React.lazy(() => import('@/pages/A3selectDay'))
+    Com: React.lazy(() => import('@/pages/A3selectDayNew'))
   },
   {
     id: 4,
     name: '选择课程',
-    path: '/selectCourse/:bookDate/:bookTime',
+    path: '/selectCourse/:id/:bookDate/:bookTime',
     exact: true,
     Com: React.lazy(() => import('@/pages/A4selectCourse'))
   },
   {
     id: 5,
     name: '填写信息',
-    path: '/order/:id/:bookDate/:bookTime',
+    path: '/order/:id/:bookDate/:bookTime/:subjectBookTimeId',
     exact: true,
     Com: React.lazy(() => import('@/pages/A5order'))
   },

展示端/src/components/ZselectCity/index.tsx

@@ -62,7 +62,7 @@ function ZselectCity(_: Props, ref: any) {
         value={value}
         onConfirm={val => {
           if (tempArr.length < 2) return MessageFu.warning('请选择完整省市!')
-          console.log(123, val)
+          // console.log(123, val)
 
           setValue(val as string[])
         }}

展示端/src/pages/A3selectDay/index.tsx

@@ -38,7 +38,7 @@ function A3selectDay() {
         // 暂时去掉 只能看到从今天开始的往后第7天开始算
         const arrTime = getWeekList('YYYY-MM-DD', 1)
 
-        console.log(123, arrTime)
+        // console.log(123, arrTime)
 
         // 上午obj
         const AMobj = baseList[0]

展示端/src/pages/A3selectDayNew/index.module.scss

@@ -0,0 +1,81 @@
+.A3selectDayNew {
+  :global {
+    .A3main {
+      padding: 6% 0;
+      height: calc(100% - 60px);
+
+      .A3list {
+        width: 100%;
+        height: calc(100% - 80px);
+        margin-bottom: 20px;
+        & > div {
+          height: 100%;
+          overflow-y: auto;
+          background-color: #fffaf3;
+          .A3row {
+            &:nth-of-type(2n) {
+              background-color: #fff;
+            }
+
+            width: 100%;
+
+            padding: 24px;
+            .A3R1 {
+              color: var(--themeColor);
+              font-size: 18px;
+              font-weight: 700;
+            }
+            .A3R2 {
+              display: flex;
+              flex-wrap: wrap;
+              & > div {
+                margin-right: 14px;
+                width: calc(50% - 7px);
+                height: 60px;
+                border-radius: 4px;
+                border: 1px solid #d9d9d9;
+                color: #303030;
+                font-size: 14px;
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                margin-top: 15px;
+                &:nth-of-type(2n) {
+                  margin-right: 0;
+                }
+              }
+              .A3ac {
+                pointer-events: none;
+                background-color: var(--themeColor);
+                color: #fff;
+              }
+              .A3R2rowNo {
+                pointer-events: none;
+                background-color: #aeaeae;
+              }
+            }
+          }
+        }
+
+        // 没有信息
+        .A3listNo {
+          height: 100%;
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          font-size: 30px;
+          font-weight: 700;
+          letter-spacing: 4px;
+          color: var(--themeColor);
+        }
+      }
+    }
+    .A3mainNoBtn {
+      #ZFlooBtn {
+        background-color: #d9d9d9;
+        pointer-events: none;
+        color: #aeaeae;
+      }
+    }
+  }
+}

展示端/src/pages/A3selectDayNew/index.tsx

@@ -0,0 +1,107 @@
+import React, { useCallback, useEffect, useState } from 'react'
+import styles from './index.module.scss'
+import TopCom from '@/components/TopCom'
+import classNames from 'classnames'
+import { APIN_getList } from '@/store/action/all'
+import { A3NlistType } from './type'
+import ZFlooBtn from '@/components/ZFlooBtn'
+import history from '@/utils/history'
+import dayjs from 'dayjs'
+const week = ['日', '一', '二', '三', '四', '五', '六']
+const nowDay = dayjs().format('YYYY-MM-DD')
+
+function A3selectDayNew() {
+  const [list, setList] = useState<A3NlistType[]>([])
+
+  const [loding, setLoding] = useState(false)
+
+  const getListFu = useCallback(async () => {
+    const res = await APIN_getList(7)
+    if (res.code === 0) {
+      setLoding(true)
+      const obj: any = res.data.time || {}
+      let arr: A3NlistType[] = []
+      for (const k in obj) {
+        arr.push({
+          name: k,
+          arr: obj[k]
+        })
+      }
+      setList(arr)
+    }
+  }, [])
+
+  useEffect(() => {
+    getListFu()
+  }, [getListFu])
+
+  const [acObj, setAcObj] = useState({ bookDate: '', bookTime: '', id: 0 })
+
+  // 当天的日期过滤 已经超过现在的时间 返回true
+  const timeFile = useCallback((date: string, time: string) => {
+    let falg = false
+
+    if (nowDay === date) {
+      const nowTime = dayjs(date + ' ' + time).valueOf()
+      if (Date.now() > nowTime) falg = true
+    }
+    return falg
+  }, [])
+
+  return (
+    <div className={styles.A3selectDayNew}>
+      <TopCom txt='选择日期' />
+      <div className={classNames('A3main', acObj.bookDate ? '' : 'A3mainNoBtn')}>
+        <div className='A3list'>
+          {list.length ? (
+            <div className='mySorrl'>
+              {list.map(item => (
+                <div className='A3row' key={item.name}>
+                  <div className='A3R1'>
+                    {item.name} {`星期${week[dayjs(item.name).day()]}`}
+                  </div>
+                  <div className='A3R2'>
+                    {item.arr.map(vv => (
+                      <div
+                        key={vv.id}
+                        onClick={() =>
+                          setAcObj({
+                            bookDate: item.name,
+                            bookTime: `${vv.timeStart}-${vv.timeEnd}`,
+                            id: vv.id
+                          })
+                        }
+                        className={classNames(
+                          acObj.id === vv.id ? 'A3ac' : '',
+                          vv.pcs === 0 || timeFile(item.name, vv.timeStart) ? 'A3R2rowNo' : ''
+                        )}
+                      >
+                        {vv.timeStart} - {vv.timeEnd}
+                        {vv.pcs === 0 ? ' 已满' : ''}
+                      </div>
+                    ))}
+                  </div>
+                </div>
+              ))}
+            </div>
+          ) : (
+            <div className='A3listNo' hidden={!loding}>
+              暂无可约日期
+            </div>
+          )}
+        </div>
+
+        <ZFlooBtn
+          txt={acObj.bookDate ? '下一步' : '请选择日期'}
+          clickFu={() =>
+            history.push(`/selectCourse/${acObj.id}/${acObj.bookDate}/${acObj.bookTime}`)
+          }
+        />
+      </div>
+    </div>
+  )
+}
+
+const MemoA3selectDayNew = React.memo(A3selectDayNew)
+
+export default MemoA3selectDayNew

展示端/src/pages/A3selectDayNew/type.d.ts

@@ -0,0 +1,11 @@
+export type A3NlistType = {
+  name: string
+  arr: {
+    date: string
+    id: number
+    pcs: number
+    subjectBookId: number
+    timeEnd: string
+    timeStart: string
+  }[]
+}

展示端/src/pages/A4selectCourse/index.tsx

@@ -15,13 +15,15 @@ function A4selectCourse() {
   // 获取路由参数
   const [urlObj, setUrlObj] = useState({
     bookDate: '',
-    bookTime: ''
+    bookTime: '',
+    id: 0
   })
 
   const urlObjTemp: any = useParams()
 
   useEffect(() => {
     // console.log(dayjs(Number(urlObjTemp.bookDate)).format('YYYY-MM-DD'))
+
     setUrlObj(urlObjTemp)
   }, [urlObjTemp])
 
@@ -64,11 +66,12 @@ function A4selectCourse() {
         // 跳预约页面
         // 0：未认证 | 1：已认证 | 2：认证中
 
-        if (res.data === 1) history.push(`/order/${id}/${urlObj.bookDate}/${urlObj.bookTime}`)
+        if (res.data === 1)
+          history.push(`/order/${id}/${urlObj.bookDate}/${urlObj.bookTime}/${urlObj.id}`)
         else setTanShow(true) // 打开弹窗 提示去认证页面
       }
     },
-    [urlObj.bookDate, urlObj.bookTime]
+    [urlObj]
   )
 
   // 点击查看详情

展示端/src/pages/A5order/index.tsx

@@ -47,7 +47,8 @@ function A5order() {
     id: 0,
     bookDate: '',
     bookTime: '',
-    name: ''
+    name: '',
+    subjectBookTimeId: ''
   })
 
   // useEffect(() => {
@@ -61,9 +62,10 @@ function A5order() {
     if (res.code === 0) {
       setUrlObj({
         id: Number(urlObjTemp.id),
-        bookDate: dayjs(Number(urlObjTemp.bookDate)).format('YYYY-MM-DD'),
+        bookDate: urlObjTemp.bookDate,
         bookTime: urlObjTemp.bookTime,
-        name: res.data.name
+        name: res.data.name,
+        subjectBookTimeId: urlObjTemp.subjectBookTimeId
       })
     }
   }, [urlObjTemp])
@@ -167,6 +169,7 @@ function A5order() {
                   subjectName: urlObj.name,
                   fileIds: res.data.id + '',
                   pcsTeacher: values.pcsTeacher === null ? 0 : values.pcsTeacher,
+                  subjectBookTimeId: Number(urlObj.subjectBookTimeId),
 
                   province: cityArr[0],
                   city: cityArr[1]
@@ -228,8 +231,8 @@ function A5order() {
             {/* 顶部 */}
             <div className='A5lTop'>
               <p>
-                <span>预约日期：</span>
-                {urlObj.bookDate} {urlObj.bookTime === 'am' ? '上午' : '下午'}
+                <span>预约时间：</span>
+                {urlObj.bookDate} {urlObj.bookTime}
               </p>
               <p>
                 <span>预约课程：</span>

展示端/src/pages/A6my/index.module.scss

@@ -63,7 +63,6 @@
           padding: 27px;
           font-size: 16px;
           .A6row1 {
-            position: relative;
             border-bottom: 2px dashed #bebebe;
             position: relative;
             height: 86px;
@@ -77,7 +76,8 @@
 
             & > p {
               width: 90%;
-
+              position: relative;
+              top: -10px;
               margin-bottom: 8px;
               span {
                 font-weight: 700;

展示端/src/pages/A6my/index.tsx

@@ -112,7 +112,10 @@ function A6my() {
                     <p>
                       <span>预约日期：</span>
                       {item.bookDate}
-                      {item.bookTime === 'am' ? '上午' : '下午'}
+                    </p>
+                    <p>
+                      <span>预约时段：</span>
+                      {item.bookTime}
                     </p>
                     <p>
                       <span>预约课程：</span>

展示端/src/store/action/all.ts

@@ -206,3 +206,15 @@ export const upFileFu = async (
     }
   }
 }
+
+// --------------------------新模块预约-----------------
+/**
+ * 课程预约-获取预约列表
+ */
+export const APIN_getList = (num?: number) => {
+  let url = 'wx/v2/book/config'
+
+  if (num) url += `?limit=${num}`
+
+  return http.get(url)
+}

展示端/src/utils/http.ts

@@ -7,7 +7,7 @@ import { domShowFu } from './domShow'
 const envFlag = process.env.NODE_ENV === 'development'
 
 export const baseUrlTemp = weiXinLoginBackUrlTemp // 测试环境
-// const baseUrlTemp = 'http://192.168.20.61:8091' // 线下环境
+// export const baseUrlTemp = 'http://192.168.20.61:8091' // 线下环境
 
 const baseFlag = baseUrlTemp.includes('https://')