✨ feat: 简化项目

src/pages/Login/components/container.vue

@@ -15,7 +15,7 @@ import { useRoute } from 'vue-router'
 
 const route = useRoute()
 
-let current = ref('uniLogin')
+let current = ref('login')
 
 const changeMode = (mode) => {
     document.querySelector('.center').className = `center ${mode}`

src/pages/Login/components/login.vue

@@ -35,7 +35,7 @@
             </a-form-item>
 
             <div class="forgetpass">
-                <a-button type="text" @click="emit('changeMode', 'uniLogin')">快捷登录</a-button>
+                <!-- <a-button type="text" @click="emit('changeMode', 'uniLogin')">快捷登录</a-button> -->
                 <!-- <div class="tip">由于业务变更 现无法通过QQ/微信快捷登录<br>快捷登录用户可在注册新账号后提交工单联系客服找回原账号</div> -->
                 <a-button type="text" @click="emit('changeMode', 'register')">注册账号</a-button>
             </div>

src/pages/Main/Main.vue

@@ -2,7 +2,7 @@
     <div id="section1" class="section root">
         <div class="videocontainer">
             <video class="fullscreenvideo" playsinline="" autoplay="" muted="" loop=""
-                src="/background.webm" type="video/mp4" />
+                src="//xxoo365.top/background.webm" type="video/mp4" />
             <div class="overlay" />
         </div>
         <Header color="white" />

src/pages/face/components/doc.vue

@@ -1,27 +0,0 @@
-<template>
-    <div style="text-align: left;">
-        <p style="text-indent: 2em;">为保障识别准确性与用户隐私，请在使用人脸采集功能前阅读并遵守下列须知。</p>
-
-        <h3>一、拍摄与画面要求</h3>
-        <ol>
-            <li>请使用设备原生相机拍摄，确保画面清晰并<strong>关闭美颜/磨皮/滤镜</strong>等图像后处理功能。</li>
-            <li>拍摄时面部不得被遮挡：不得佩戴帽子、口罩；刘海不得覆盖眼睛；请避免使用手势或其他物品遮挡面部。</li>
-            <li>画面应完整包含面部轮廓：从<strong>头顶发尖</strong>至<strong>肩部锁骨</strong>位置均应在取景范围内。</li>
-        </ol>
-
-        <h3>二、光线与环境</h3>
-        <ol>
-            <li>避免强光直射或逆光拍摄，以免影响识别效果。</li>
-            <li>如佩戴眼镜，请调整角度或摘除以减少镜片反光。</li>
-            <li>推荐在光线均匀、背景干净的环境下拍摄。</li>
-        </ol>
-
-        <h3>三、数据使用范围与隐私承诺</h3>
-        <ol>
-            <li>哪吒乐跑 仅在<strong>校园乐跑的人脸识别</strong>环节使用所采集的人脸数据，不作其他用途。</li>
-            <li>所有人脸数据将被妥善保存与加密保护；未经数据主体的明确同意，哪吒乐跑 不会向第三方披露或挪用该类数据。</li>
-            <li>若需删除或更改您的数据，请联系哪吒乐跑客服。</li>
-        </ol>
-    </div>
-</template>
-

src/pages/face/components/faceReco.vue

@@ -1,527 +0,0 @@
-<template>
-  <div class="container">
-    <div v-if="step === 1">
-      <div class="faceWindowWrapper">
-        <div class="faceWindow" :style="{ borderColor: tagColor }">
-          <video id="page_draw-video" muted playsinline></video>
-        </div>
-        <div class="changeButton">
-          <a-button type="primary" shape="circle"
-            @click="state.constraints.video.facingMode === 'user' ? state.constraints.video.facingMode = 'environment' : state.constraints.video.facingMode = 'user'">
-            <icon-sync />
-          </a-button>
-        </div>
-      </div>
-
-      <div class="faceInfo">
-        <a-tag size="large" :color="tagColor">
-          {{ tagInfo }}
-        </a-tag>
-      </div>
-      <div class="countTime" v-if="state.isRecording">
-        <span>还需等待：</span>
-        <span class="time">{{ recTime }}</span>
-        <span>s</span>
-      </div>
-    </div>
-
-    <div v-if="step === 2" class="spin">
-      <a-spin dot tip="信息上传中，请勿离开此界面..." />
-    </div>
-
-    <div v-if="step === 3">
-      <a-result status="success" title="采集完成">
-        <template #extra>
-          <a-space>
-            <a-button type='primary' @click="retry()">返回</a-button>
-          </a-space>
-        </template>
-      </a-result>
-    </div>
-
-    <div v-if="step === 4">
-      <a-result status="error" title="采集失败">
-        <template #extra>
-          <a-space>
-            <a-button type='primary' @click="retry()">返回重试</a-button>
-          </a-space>
-        </template>
-      </a-result>
-    </div>
-
-    <div class="userInfo">
-      <div class="left">
-        <a-avatar>
-          <img :alt="props.userInfo.name ?? props.userInfo.student_num"
-            :src="props.userInfo.user_avatar ?? 'https://lepao-cloud.xxoo365.top/view.php/25aa126dc406974ff3579a99a2c6501a.png'" />
-        </a-avatar>
-      </div>
-      <div class="right">
-        <div class="name">{{ props.userInfo.name }}</div>
-        <div class="sub">{{ props.userInfo.academy_name }}</div>
-      </div>
-    </div>
-  </div>
-
-  <div style="display: none">
-    <div v-show="!state.netsLoadModel">
-      <img id="page_draw-img-target" :src="props.userInfo.face_img" />
-      <canvas id="page_draw-canvas-target"></canvas>
-      <canvas id="page_draw-video-canvas"></canvas>
-    </div>
-  </div>
-
-  <div class="loading" v-if="state.netsLoadModel">
-    <div class="loadingTip">
-      <icon-loading :size="32" />
-      <div class="text">努力加载中</div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { Message, Modal } from "@arco-design/web-vue"
-import * as faceapi from "@vladmandic/face-api"
-import axios from 'axios'
-import storage from 'store'
-import { ref, onMounted, onUnmounted, reactive, watch } from "vue"
-
-const tagInfo = ref('请将面部完全放置在取景框中央')
-const tagColor = ref('blue')
-const step = ref(1)
-const recTime = ref(10)
-let isSuccessRecording = false
-let countdownTimer = null
-
-const props = defineProps({
-  userInfo: {
-    type: Object,
-    required: true
-  }
-})
-
-/**属性状态 */
-const state = reactive({
-  netsLoadModel: true,
-  netsType: "tinyFaceDetector",
-  netsOptions: {
-    ssdMobilenetv1: undefined,
-    tinyFaceDetector: undefined,
-  },
-  faceMatcher: null,
-  targetImgEl: null,
-  targetCanvasEl: null,
-  discernVideoEl: null,
-  discernCanvasEl: null,
-  timer: 0,
-  constraints: {
-    audio: false,
-    video: {
-      width: { min: 320, ideal: 720, max: 1280 },
-      height: { min: 200, ideal: 480, max: 720 },
-      frameRate: { min: 7, ideal: 15, max: 30 },
-      facingMode: "user",
-    },
-  },
-  stream: null,
-
-  /** 录制相关 */
-  recorder: null,
-  recordingChunks: [],
-  recordingTimer: null,
-  isRecording: false,
-  lastBlob: null,
-  failCount: 0,
-  uploading: false, // 上传状态
-})
-
-/**启动录制 */
-function startRecording() {
-  if (state.isRecording || !state.stream) return
-  state.recordingChunks = []
-  state.recorder = new MediaRecorder(state.stream, { mimeType: "video/webm" })
-
-  state.recorder.ondataavailable = (e) => {
-    if (e.data.size > 0) {
-      state.recordingChunks.push(e.data)
-    }
-  }
-
-  // 停止录制时
-  state.recorder.onstop = () => {
-    const blob = new Blob(state.recordingChunks, { type: "video/webm" })
-
-    if (isSuccessRecording && blob) {
-      uploadVideo(blob)
-    }
-  }
-
-  state.recorder.start()
-  state.isRecording = true
-  recTime.value = 10   // ✅ 开始时重置倒计时
-
-  // 倒计时逻辑
-  countdownTimer = setInterval(() => {
-    if (recTime.value > 0) {
-      recTime.value -= 1
-    }
-  }, 1000)
-
-  // 10秒后自动停止并标记为成功
-  state.recordingTimer = setTimeout(() => {
-    isSuccessRecording = true
-    stopRecording()   // ✅ 成功录制
-    fnClose()
-
-    step.value = 3
-
-  }, recTime.value * 1000)
-}
-
-/**结束录制 */
-function stopRecording() {
-  if (state.recorder && state.isRecording) {
-    state.recorder.stop()
-    state.isRecording = false
-
-    clearTimeout(state.recordingTimer)
-    state.recordingTimer = null
-
-    clearInterval(countdownTimer)
-    countdownTimer = null
-    recTime.value = 10
-  }
-}
-
-/**上传视频到服务器 */
-async function uploadVideo(blob) {
-  try {
-    step.value = 2
-    const formData = new FormData()
-    formData.append("student_num", props.userInfo.student_num)
-    formData.append("key", props.userInfo.key)
-    formData.append("upload", blob, "face_record.webm")
-
-    const url = import.meta.env.VITE_APP_API_BASE_URL + '/UploadFaceVideo'
-
-    const res = await axios.post(url, formData, {
-      headers: { "Content-Type": "multipart/form-data" }
-    })
-
-    if (!res || !res.data || res.data.code !== 0) {
-      step.value = 4
-      throw new Error(res?.data?.msg ?? '上传失败，请稍后再试')
-    }
-    Message.success("人脸数据上传成功")
-    step.value = 3
-  } catch (err) {
-    step.value = 4
-    Message.error(err.message ?? "人脸数据上传失败")
-    console.error(err)
-  }
-}
-
-/**重新开始录制 */
-function restartRecording() {
-  stopRecording()
-  // 小延迟确保上一次 recorder 彻底结束
-  setTimeout(() => {
-    startRecording()
-  }, 200)
-}
-
-/**初始化模型加载 */
-async function fnLoadModel() {
-  const modelsPath = `https://lepao-api.xxoo365.top/models`
-  await faceapi.nets.faceLandmark68Net.load(modelsPath)
-  await faceapi.nets.faceRecognitionNet.load(modelsPath)
-  await faceapi.nets.tinyFaceDetector.load(modelsPath)
-  state.netsOptions.tinyFaceDetector = new faceapi.TinyFaceDetectorOptions({
-    inputSize: 416,
-    scoreThreshold: 0.5,
-  })
-
-  state.targetImgEl = document.getElementById("page_draw-img-target")
-  state.discernVideoEl = document.getElementById("page_draw-video")
-  state.discernCanvasEl = document.getElementById("page_draw-video-canvas")
-
-  state.netsLoadModel = false
-}
-
-/**根据模型参数识别绘制--目标图 */
-async function fnRedrawTarget() {
-  const detect = await faceapi
-    .detectAllFaces(state.targetImgEl, state.netsOptions[state.netsType])
-    .withFaceLandmarks()
-    .withFaceDescriptors()
-  if (!detect || detect.length === 0) {
-    state.faceMatcher = null
-    return
-  }
-  state.faceMatcher = new faceapi.FaceMatcher(detect)
-}
-
-/**根据模型参数识别绘制 */
-async function fnRedrawDiscern() {
-  if (!state.faceMatcher) return
-
-  if (state.discernVideoEl.paused) {
-    clearTimeout(state.timer)
-    state.timer = 0
-    return
-  }
-
-  const detect = await faceapi
-    .detectAllFaces(state.discernVideoEl, state.netsOptions[state.netsType])
-    .withFaceLandmarks()
-    .withFaceDescriptors()
-
-  if (!detect || detect.length === 0) {
-    state.failCount++
-    if (state.failCount >= 3) {
-      tagColor.value = 'blue'
-      tagInfo.value = '请将面部完全放置在取景框中央'
-      if (state.isRecording) stopRecording()
-    }
-
-    // 延迟下一次识别，避免直接递归造成栈/CPU 问题
-    clearTimeout(state.timer)
-    state.timer = setTimeout(() => fnRedrawDiscern(), 300)
-    return
-  }
-
-  const dims = faceapi.matchDimensions(
-    state.discernCanvasEl,
-    state.discernVideoEl,
-    true
-  )
-  const result = faceapi.resizeResults(detect, dims)
-  // 若检测到多张脸，逐一判断（若任一匹配成功则开始录制）
-  for (const item of result) {
-    const descriptor = item.descriptor
-    const best = state.faceMatcher.findBestMatch(descriptor)
-
-    if (best) {
-      // 临时加大匹配范围
-      if (best._distance <= 0.9) {
-        state.failCount = 0
-        tagColor.value = 'green'
-        tagInfo.value = '录制中，请确保面部不要离开取景框'
-        if (!state.isRecording) startRecording()
-        // 找到一个合格的人脸就可以停止遍历
-        break
-      } else {
-        state.failCount = 3
-        tagColor.value = 'red'
-        tagInfo.value = `人脸匹配失败，请确保为 ${props?.userInfo?.name} 本人操作`
-        if (state.isRecording) restartRecording()
-      }
-    }
-  }
-
-  // 继续调度下一次识别（0ms 相当于下一事件循环）
-  clearTimeout(state.timer)
-  state.timer = setTimeout(() => fnRedrawDiscern(), 0)
-}
-
-/**启动摄像头视频媒体 */
-async function fnOpen() {
-  if (state.stream !== null) return
-  try {
-    state.stream = {}
-    const stream = await navigator.mediaDevices.getUserMedia(state.constraints)
-    state.stream = stream
-    state.discernVideoEl.srcObject = stream
-    await state.discernVideoEl.play()
-    state.discernCanvasEl.width = state.discernVideoEl.videoWidth
-    state.discernCanvasEl.height = state.discernVideoEl.videoHeight
-    // 稍作延迟再开始识别
-    setTimeout(() => fnRedrawDiscern(), 300)
-  } catch (error) {
-    fnClose()
-    step.value = 4
-    Message.error("视频媒体流获取错误: " + error)
-  }
-}
-
-/**结束摄像头视频媒体 */
-function fnClose() {
-  if (state.stream === null) return
-  try {
-    state.discernVideoEl.pause()
-    state.discernVideoEl.srcObject = null
-    state.stream.getTracks().forEach((track) => track.stop())
-  } catch (err) {
-    console.warn("关闭流时出错：", err)
-  } finally {
-    state.stream = null
-    clearTimeout(state.timer)
-    state.timer = 0
-    stopRecording()
-  }
-}
-
-watch(
-  () => state.constraints.video.facingMode,
-  () => {
-    if (state.stream !== null) {
-      fnClose()
-      fnOpen()
-      const videoEl = document.getElementById('page_draw-video')
-      if (state.constraints.video.facingMode === 'user')
-        videoEl.style.transform = 'scaleX(-1)'
-      else
-        videoEl.style.transform = 'none'
-    } else {
-      fnClose()
-    }
-  }
-)
-
-onMounted(() => {
-  fnLoadModel().then(() => {
-    fnRedrawTarget()
-    fnOpen()
-    isIosSafari()
-  })
-})
-
-onUnmounted(() => {
-  fnClose()
-})
-
-// IOS加载慢
-function isIosSafari() {
-  const ua = window.navigator.userAgent
-
-  // 1. 判断是否是 iOS 设备
-  const isIOS = /iP(hone|od|ad)/.test(ua)
-
-  if (isIOS) {
-    const faceRecoIosShow = storage.get('faceRecoIosShow')
-    if (!faceRecoIosShow)
-      Modal.info({
-        title: 'IOS设备采集提醒',
-        escToClose: false,
-        maskClosable: false,
-        width: '300px',
-        content: `部分IOS设备在首次采集时可能会遇到加载时间长或采集失败等情况。出现此类情况时可刷新页面重新采集。`,
-        onOk: () => {
-          storage.set('faceRecoIosShow', true)
-        }
-      })
-  }
-}
-
-function retry() {
-  window.location.reload()
-}
-</script>
-
-<style lang="less" scoped>
-.container {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-}
-
-.faceWindowWrapper {
-  position: relative;
-  width: 270px;
-  height: 270px;
-}
-
-/* 圆形视频框 */
-.faceWindow {
-  width: 100%;
-  height: 100%;
-  border-radius: 50%;
-  border: 5px solid;
-  overflow: hidden;
-  background: #fff;
-  position: relative;
-}
-
-/* 按钮 */
-.changeButton {
-  position: absolute;
-  right: -10px;
-  /* 超出圆形框右边 */
-  bottom: -10px;
-  /* 超出圆形框底边 */
-}
-
-.faceInfo {
-  margin-top: 20px;
-}
-
-.countTime {
-  margin-top: 10px;
-  font-size: 1.1em;
-  font-family: AlibabaSans, -apple-system, BlinkMacSystemFont;
-
-  .time {
-    font-size: 1.3em;
-  }
-}
-
-.faceWindow video {
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-  /* 保持视频比例并填满圆形 */
-  transform: scaleX(-1);
-}
-
-.spin {
-  display: flex;
-  align-items: center;
-  min-height: 270px;
-}
-
-.userInfo {
-  display: flex;
-  align-items: center;
-  text-align: left;
-  height: 60px;
-  min-width: 300px;
-  margin-top: 20px;
-  border-radius: 10px;
-  background-color: rgba(190, 218, 255, 0.5);
-  padding: 10px;
-
-  .right {
-    margin-left: 10px;
-
-    .name {
-      font-size: 1.2em;
-      font-weight: bold;
-    }
-  }
-}
-
-.loading {
-  position: fixed;
-  top: 0;
-  left: 0;
-  height: 100%;
-  width: 100%;
-  background-color: rgba(0, 0, 0, 0.2);
-  z-index: 9999;
-  border-radius: 10px;
-
-  .loadingTip {
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-    color: rgb(255, 52, 52);
-
-    .text {
-      font-family: 'Alimama ShuHeiTi';
-      font-size: 1.2em;
-    }
-  }
-}
-</style>

src/pages/face/index.vue

@@ -1,175 +0,0 @@
-<template>
-    <div class="root">
-        <div class="card" v-if="step === 1">
-            <div class="logo">
-                <img alt="哪吒乐跑" src="/logo.svg" height="40">
-                <span class="title">哪吒乐跑 | 人脸采集</span>
-            </div>
-
-            <a-verification-code size="large" style="width: 300px" v-model="face_form.bind_code" :formatter="formatCode"
-                @finish="getUserInfo" :error="code_error" :readonly="buttonLoading" />
-            <div class="inputTip">请输入人脸采集码</div>
-
-            <a-button type="primary" shape="round" size="large" @click="getUserInfo"
-                :loading="buttonLoading">开始人脸采集</a-button>
-        </div>
-
-        <div class="card" v-else-if="step === 2">
-            <div class="logo">
-                <img alt="哪吒乐跑" src="/logo.svg" height="40">
-                <span class="title">人脸采集注意事项</span>
-            </div>
-            <Doc />
-            <a-button type="primary" shape="round" size="large" @click="step = 3"
-                :loading="buttonLoading">我已阅读并同意</a-button>
-        </div>
-
-        <div class="card" v-else-if="step === 3">
-            <div class="logo">
-                <img alt="哪吒乐跑" src="/logo.svg" height="40">
-                <span class="title">哪吒乐跑 | 人脸采集</span>
-            </div>
-            <FaceReco :userInfo="userInfo" />
-        </div>
-
-        <div class="footer">
-            <span>© {{ new Date().getFullYear() }} 哪吒乐跑 - 智能校园乐跑平台</span>
-        </div>
-    </div>
-</template>
-
-<script setup>
-import { ref, reactive, onMounted } from 'vue'
-import { useRoute } from 'vue-router'
-import { Message } from '@arco-design/web-vue'
-import { BeginFaceReco } from '@/api/lepao'
-import Doc from './components/doc.vue'
-import FaceReco from './components/faceReco.vue'
-
-const route = useRoute()
-
-const step = ref(1)
-const buttonLoading = ref(false)
-const userInfo = ref({})
-
-const code_error = ref(false)
-const face_form = reactive({
-    bind_code: ''
-})
-
-function formatCode(inputValue) {
-    code_error.value = false
-
-    const filtered = inputValue.replace(/[^a-zA-Z0-9]/g, '')
-    return filtered.slice(0, 6).toUpperCase()
-}
-
-const getUserInfo = async () => {
-    try {
-        buttonLoading.value = true
-        const bind_code = face_form.bind_code
-        if (!bind_code || bind_code.length !== 6)
-            return Message.error('请将信息填写完整')
-
-        const res = await BeginFaceReco({ bind_code })
-        if (!res || res.code !== 0) {
-            code_error.value = true
-            return Message.error(res?.msg ?? '获取人脸识别信息失败！请稍后再试')
-        }
-
-        userInfo.value = res.data
-        step.value = 2
-    } catch (error) {
-        return Message.error('获取人脸识别信息失败！请稍后再试')
-    } finally {
-        buttonLoading.value = false
-    }
-}
-
-// 预加载模型
-
-onMounted(() => {
-    if (route.query.code) {
-        face_form.bind_code = formatCode(route.query.code)
-        getUserInfo()
-    }
-})
-</script>
-
-<style lang="less" scoped>
-.root {
-    width: 100%;
-    min-height: 100vh;
-    background: linear-gradient(to right, #74ebd5, #ACB6E5);
-    display: flex;
-    flex-direction: column;
-    font-family: 'Arial', sans-serif;
-    text-align: center;
-    align-items: center;
-    justify-content: center;
-
-    .card {
-        background-color: #fff;
-        border-radius: 20px;
-        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
-        padding: 30px;
-        width: 75%;
-        max-width: 500px;
-        min-width: 300px;
-        min-height: 300px;
-        margin-bottom: 30px;
-        margin-top: 30px;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        justify-content: center;
-
-        .logo {
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            height: 60px;
-            margin-bottom: 30px;
-
-            .title {
-                color: rgb(255, 52, 52);
-                font-size: 1.6em;
-                font-weight: bold;
-                margin-left: 10px;
-                font-family: Alimama ShuHeiTi, -apple-system, BlinkMacSystemFont;
-            }
-
-            img {
-                margin-top: 0;
-            }
-        }
-
-        .inputTip {
-            color: #888;
-            font-size: 0.9em;
-            margin-top: 15px;
-            cursor: default;
-        }
-    }
-
-    button {
-        padding: 15px 18px;
-        border: none;
-        border-radius: 10px;
-        background-color: #4A90E2;
-        color: #fff;
-        cursor: pointer;
-        margin-top: 40px;
-    }
-
-    .footer {
-        cursor: pointer;
-        margin-bottom: 15px;
-        color: #777;
-        font-size: 12px;
-        display: flex;
-        align-items: center;
-        justify-content: flex-end;
-    }
-}
-</style>

src/router/index.js

@@ -15,16 +15,6 @@ const routes = [
             onlyWeb: true
         }
     },
-    {
-        path: "/faceReco",
-        name: "faceReco",
-        component: () => import('../pages/face/index.vue'),
-        meta: {
-            hideInMenu: true,
-            onlyWeb: true,
-            viewport: 'width=device-width, initial-scale=1'
-        }
-    },
     {
         path: "/login",
         name: "login",
@@ -156,25 +146,6 @@ const routes = [
             }
         ]
     },
-    {
-        path: "/qxs",
-        name: "qxs",
-        component: DEFAULT_LAYOUT,
-        meta: {
-            title: '趣选书',
-            icon: 'icon-book'
-        },
-        children: [
-            {
-                path: 'getBookList',
-                name: 'qxs.getBookList',
-                component: () => import('../pages/qxs/getBookList.vue'),
-                meta: {
-                    title: '书单查询'
-                }
-            }
-        ]
-    },
     {
         path: "/service",
         name: 'service',