测试搜索功能1

src/App.tsx

@@ -4,10 +4,10 @@ import { BrowserRouter as Router, Switch, Route, Redirect } from "react-router-d
 import { Home } from "~/views/home";
 import { User } from "~/views/user/index";
 import { VideoList } from "~/views/videoList/index";
-
+import { MyExamRoadVideo } from "~/views/myExamRoadVideo/index"
 import { VideoKindList } from "./views/videokindList";
-import {CourseCatalog} from './views/courseCatalog'
-import {ExamRoadVideo} from './views/examRoadVideo'
+import { CourseCatalog } from './views/courseCatalog'
+import { ExamRoadVideo } from './views/examRoadVideo'
 import { DownloadCaigong1 } from "./views/downloadCaigong1";
 import { DownloadCaigong2 } from "./views/downloadCaigong2";
 import { PdfImages } from './views/pdfImages'
@@ -16,49 +16,52 @@ export function App() {
 
   return (
     <Router>
-    <Switch>
-      <Route exact path="/">
-        <VideoKindList />
-      </Route>
-      <Route path="/home">
-        <Home />
-      </Route>
-      <Route path="/home1">
-        <Home />
-      </Route>
-      <Route path="/user">
-        <User />
-      </Route>
-      <Route path="/pdfImages">
-        <PdfImages />
-      </Route>
-      <Route path="/videoList/:subject">
-        <VideoList />
-      </Route>
+      <Switch>
+        <Route exact path="/">
+          <VideoKindList />
+        </Route>
+        <Route path="/home">
+          <Home />
+        </Route>
+        <Route path="/home1">
+          <Home />
+        </Route>
+        <Route path="/user">
+          <User />
+        </Route>
+        <Route path="/pdfImages">
+          <PdfImages />
+        </Route>
+        <Route path="/videoList/:subject">
+          <VideoList />
+        </Route>
 
-      <Route path="/videoKindList">
-        <VideoKindList />
-      </Route>
-      <Route path="/marked">
-        <Marked />
-      </Route>
-      <Route path="/courseCatalog">
-        <CourseCatalog />
-      </Route>
-      <Route path="/examRoadVideo">
-        <ExamRoadVideo />
-      </Route>
-      <Route path="/downloadCaigong1">
-        <DownloadCaigong1 />
-      </Route>
-      <Route path="/downloadCaigong2">
-        <DownloadCaigong2 />
-      </Route>
-      {/* 宣传上印成了downloadCaigong3 */}
-      <Route path="/downloadCaigong3">
-        <DownloadCaigong2 />
-      </Route>
-    </Switch>
-  </Router>
+        <Route path="/videoKindList">
+          <VideoKindList />
+        </Route>
+        <Route path="/marked">
+          <Marked />
+        </Route>
+        <Route path="/courseCatalog">
+          <CourseCatalog />
+        </Route>
+        <Route path="/examRoadVideo">
+          <ExamRoadVideo />
+        </Route>
+        <Route path="/myExamRoadVideo">
+          <MyExamRoadVideo />
+        </Route>
+        <Route path="/downloadCaigong1">
+          <DownloadCaigong1 />
+        </Route>
+        <Route path="/downloadCaigong2">
+          <DownloadCaigong2 />
+        </Route>
+        {/* 宣传上印成了downloadCaigong3 */}
+        <Route path="/downloadCaigong3">
+          <DownloadCaigong2 />
+        </Route>
+      </Switch>
+    </Router>
   );
 }

src/api/index.ts

@@ -114,6 +114,13 @@ const api = {
             url:"student/exam/info/getProvice",
             method:'get'
         })
+    },
+    //我的考场信息列表
+    studentExamInfoMyList(){
+        return request({
+            url:"student/exam/info/myList",
+            method:'get'
+        })
     }
 
     

src/utils/request.ts

@@ -21,7 +21,7 @@ request.interceptors.request.use((config) => {
 });
 
 request.interceptors.response.use((res) => {
-	let redirect_uri =window.location.href
+	let redirect_uri =window.location.origin+'/home'
 	if (res && res.data) {
 		switch (res.data.code) {
 			case 401:

src/views/examRoadVideo/index.tsx

@@ -1,7 +1,6 @@
 import React, { useEffect, useRef, useState } from "react";
 import "./index.less";
-import { Picker, Popup, Search } from 'react-vant';
-import { SearchOutline } from 'antd-mobile-icons'
+import { Empty, Picker, Popup, Search } from 'react-vant';
 import api from "~/api";
 import { Link } from "react-router-dom";
 import { Toast } from 'react-vant';
@@ -114,25 +113,47 @@ export const ExamRoadVideo: React.FC = (props: any) => {
 
   }, [province, city, county])
   useEffect(() => {
-    //定位
-    // api.studentExamInfoIp().then(res => {
-    //   setCity({
-    //     city: res.data.data.cityName,
-    //     cityId: res.data.data.city
-    //   })
-    //   setProvince({
-    //     provinceId: res.data.data.province,
-    //     province: res.data.data.provinceName
-    //   })
-
-    //   console.log(res.data)
-    // })
+
+
     api.studentExamInfoList({}).then(res => {
       setExamList(res.data.rows)
 
     })
     api.studentExamInfoGetProvice().then(res => {
       setProvinceList(res.data.data)
+      //定位
+      api.studentExamInfoIp().then(result => {
+        if (res.data.data.every(item => {
+          item.province === result.data.data.province
+        })) {
+          setCity({
+            city: result.data.data.cityName,
+            cityId: result.data.data.city
+          });
+          setProvince({
+            provinceId: result.data.data.province,
+            province: result.data.data.provinceName
+          })
+
+        }
+        else {
+          setCity({
+            city: "",
+            cityId: ""
+          });
+          setProvince({
+            provinceId: "",
+            province: ""
+          })
+
+        }
+
+
+
+
+
+        console.log(result.data)
+      })
     })
 
   }, [])
@@ -176,6 +197,7 @@ export const ExamRoadVideo: React.FC = (props: any) => {
             />
 
             <input
+              readOnly
               onClick={() => {
                 city.cityId ? setCountyVisible(true) : Toast.fail({
                   message: "请先选择城市"
@@ -197,7 +219,7 @@ export const ExamRoadVideo: React.FC = (props: any) => {
             }} onCancel={() => setProvinceVisible(false)} onConfirm={(val: string, item: {
               province: string,
               provinceId: string
-            }) => { setProvince(item || { province: '', provinceId: '' }); setProvinceVisible(false); getCityByProvinceId(item.provinceId); }} columns={provinceList}></Picker>
+            }) => { setProvince(item || { province: '', provinceId: '' }); setProvinceVisible(false); getCityByProvinceId(item?.provinceId); }} columns={provinceList}></Picker>
           </Popup>
           <Popup position="bottom" visible={cityVisible}>
             <Picker columnsFieldNames={{
@@ -242,28 +264,34 @@ export const ExamRoadVideo: React.FC = (props: any) => {
           description="该城市无视频"
         /> */}
           {
+            examList.length !== 0 ?
+              examList.map(item => {
+                return (<Link key={item.id} to={'/courseCatalog?id=' + item.id + '&price=' + (Number(item.price) / 100)}><div
+                  key={item.id}
+                  className="list-item"
 
-            examList.map(item => {
-              return (<Link key={item.id} to={'/courseCatalog?id=' + item.id + '&price=' + (Number(item.price) / 100)}><div
-                key={item.id}
-                className="list-item"
+                >
 
-              >
 
+                  <img src={item.image} className="list-item-image">
+                  </img>
+                  <div
+                    className="list-item-textbody"
 
-                <img src={item.image} className="list-item-image">
-                </img>
-                <div
-                  className="list-item-textbody"
+                  >
+                    <div className="list-item-text1">{item.name}</div>
+                    <div className="list-item-text2">共{item.videoCount}节</div>
+                  </div>
+                  <div className="list-item-border"></div>
+                </div>   </Link>)
 
-                >
-                  <div className="list-item-text1">{item.name}</div>
-                  <div className="list-item-text2">共{item.videoCount}节</div>
-                </div>
-                <div className="list-item-border"></div>
-              </div>   </Link>)
+              }) : <Empty
 
-            })}
+                className="custom-image"
+                image="https://img.yzcdn.cn/vant/custom-empty-image.png"
+                description="无视频"
+              />
+          }
 
         </div>
       </div>

src/views/home/index.less

@@ -7,6 +7,7 @@
     line-height: 48px;
     display: flex;
     margin-bottom: 24px;
+    margin-top: 24px;
 
     .head {
       width: 48px;

src/views/home/index.tsx

@@ -101,9 +101,10 @@ export const Home: React.FC = (props: any) => {
       <div className='road'>
         <div className='first'>
           <span className='left'>科三真实考场</span>
-          <span className='right'>我的考场
+          <Link to={'/myExamRoadVideo'}><span className='right'>我的考场
             <img src={blueArrow}></img>
-          </span>
+          </span></Link>
+
         </div>
         <div className='sencond'>
           <div className='button'>社会化驾驶人考场</div>

src/views/myExamRoadVideo/index.less

@@ -0,0 +1,50 @@
+.content {
+    width: 100%;
+    padding: 0rpx 30rpx;
+    transform: translateY(-80px);
+  
+    .list {
+      width: 100%;
+      background: #edf4ff;
+      height: 1200rpx;
+      box-shadow: 0px 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.1);
+  
+      border-radius: 20rpx 20rpx 20rpx 20rpx;
+      .list-item {
+        width: 100%;
+        padding: 30rpx;
+        padding-top: 30rpx;
+        padding-bottom: 0rpx;
+        display: flex;
+        height: 220rpx;
+        flex-wrap: wrap;
+      }
+      .list-item-image {
+        width: 248rpx;
+        height: 138rpx;
+        margin-right: 24rpx;
+      }
+      .list-item-border {
+        width: 100%;
+        background: #e0e0e0;
+        height: 2rpx;
+      }
+      .list-item-textbody{
+        display: 'flex';
+        align-items: space-between;
+        flex-wrap: 'wrap';
+        width: 355px;
+    }
+      .list-item-text1 {
+        width: 305rpx;
+        color: #0a1a33;
+        font-size: 30rpx;
+        padding-top: 10rpx;
+      }
+      .list-item-text2 {
+        width: 305rpx;
+        color: #8a9099;
+        font-size: 26rpx;
+      }
+    }
+  }

src/views/myExamRoadVideo/index.tsx

@@ -0,0 +1,57 @@
+import { Empty } from 'react-vant';
+import './index.less'
+import React, { useEffect, useState } from "react";
+import api from '~/api';
+export const MyExamRoadVideo: React.FC = (props: any) => {
+    const [list, setList] = useState<any[]>([])
+    useEffect(() => {
+        api.studentExamInfoMyList().then(res => {
+            setList(res.data.rows)
+        })
+    }, [])
+    return (
+        <div>
+            <div>
+                <img style={{
+                    width: "100%"
+                }} src='https://ct.zzxcx.net/ctjk/mp-wx/myExamRoadVideo/header_bg.png'></img>
+            </div>
+            <div className="content">
+                <div className="list">
+                    {
+                        list.length == 0 ? <Empty
+
+                            className="custom-image"
+                            image="https://img.yzcdn.cn/vant/custom-empty-image.png"
+                            description="无视频"
+                        /> :
+                            list.map(item => {
+                                return (
+                                    <div
+                                        className="list-item"
+                                        v-for="(item, index) in examRoomList"
+
+                                    >
+                                        <img className="list-item-image" />
+
+                                        <div className='list-item-textbody'
+
+                                        >
+                                            <div className="list-item-text1">{ item.name}</div>
+                                            <div className="list-item-text2">共{item.videoCount}节</div>
+                                        </div>
+                                        <div className="list-item-border"></div>
+                                    </div>
+                                )
+                            })
+
+                    }
+
+
+
+                </div>
+            </div >
+        </div >
+    )
+
+}