update：智慧操场修改

src/views/bodySideData/index.vue

@@ -57,10 +57,11 @@
                     :header-cell-style="{ 'text-align': 'center', 'font-size': '12px', 'color': '#3F404A', padding: '3px', background: '#F8F8FA', height: '50px' }"
                     :cell-style="getCellStyles" :row-style="{ height: '0px' }">
                     <el-table-column fixed prop="ind" label="序号" />
-                    <el-table-column prop="teacherId" label="老师" width="120" />
+                    <!-- <el-table-column prop="teacherId" label="老师" width="100" /> -->
                     <!-- <el-table-column prop="gradeId" label="年级" width="120" /> -->
                     <!-- <el-table-column prop="categoryId" label="测试类别" width="120" /> -->
                     <el-table-column prop="gradeNameAndClassName" label="年级-班级" width="160" />
+                    <el-table-column prop="studentName" label="学生姓名" width="120" />
                     <el-table-column prop="studentNo" label="学生学号" width="120" />
                     <el-table-column prop="sex" label="性别" width="80" />
                     <el-table-column prop="categoryName" label="测试类别" width="120" />
@@ -71,6 +72,8 @@
                     <el-table-column prop="score" label="得分" width="120" />
                     <el-table-column prop="rank" label="等级" width="120" />
                     <el-table-column prop="classRank" label="班级排名" width="120" />
+                    <el-table-column prop="scoreTime" label="测试时间" width="160" />
+
                     <!-- <el-table-column prop="remarks" label="备注" /> -->
                     <el-table-column v-if="showRowOperate" label="操作" width="140" fixed="right">
                         <template #default="{ row }">

src/views/studentsManage/index.vue

@@ -141,13 +141,18 @@
                         <el-input v-model="ruleForm.idCard" />
                     </el-form-item>
                     <el-form-item class="photo-form-item" label="学生照片:" prop="photo">
+                        <div class="student-photo-upload" v-loading="photoUploading"
+                            element-loading-text="照片上传中..." element-loading-background="rgba(255, 255, 255, 0.88)">
                             <el-upload class="dl-avatar-uploader-min square" ref="uploadRef" action=""
-                            :show-file-list="false" :before-upload="beforeImageUpload" :on-exceed="handleExceed"
+                                :disabled="photoUploading" :show-file-list="false"
+                                :before-upload="beforeImageUpload" :on-exceed="handleExceed"
                                 list-type="picture" accept=".jpg,.jpeg,.png">
                                 <el-image v-if="ruleForm.photo" :src="ruleForm.photo" class="avatar"
                                     style="width: 100px;height: 100px;"></el-image>
                                 <p v-else style="color:#0486FE">点击上传照片</p>
                             </el-upload>
+                            <span class="student-photo-upload__hint">支持 JPG、JPEG、PNG，不超过 2MB</span>
+                        </div>
                     </el-form-item>
                     <el-form-item label="心率设备正面编号:" prop="heartRateFrontNo">
                         <el-input v-model="ruleForm.heartRateFrontNo" />
@@ -168,9 +173,11 @@
             </template>
 
             <template #footer>
-                <div class="footer">
+                <div class="student-form-footer">
-                    <p class="cancle" @click="cancelClick">取消</p>
+                    <el-button class="student-form-footer__cancel" :disabled="photoUploading"
-                    <p class="confirm" @click="confirmClick">确定</p>
+                        @click="cancelClick">取消</el-button>
+                    <el-button class="student-form-footer__confirm" type="primary" :loading="photoUploading"
+                        @click="confirmClick">确认</el-button>
                 </div>
             </template>
         </el-drawer>
@@ -214,13 +221,18 @@
                         <el-input v-model="ruleForm1.idCard" />
                     </el-form-item>
                     <el-form-item class="photo-form-item" label="学生照片:" prop="photo">
+                        <div class="student-photo-upload" v-loading="photoUploading"
+                            element-loading-text="照片上传中..." element-loading-background="rgba(255, 255, 255, 0.88)">
                             <el-upload class="dl-avatar-uploader-min square" action="" ref="uploadRef"
-                            :show-file-list="false" :before-upload="beforeImageUpload1" :on-exceed="handleExceed"
+                                :disabled="photoUploading" :show-file-list="false"
+                                :before-upload="beforeImageUpload1" :on-exceed="handleExceed"
                                 list-type="picture" accept=".jpg,.jpeg,.png">
                                 <el-image v-if="ruleForm1.photo" :src="ruleForm1.photo" class="avatar"
                                     style="width: 100px;height: 100px;"></el-image>
                                 <p v-else style="color:#0486FE">点击上传照片</p>
                             </el-upload>
+                            <span class="student-photo-upload__hint">支持 JPG、JPEG、PNG，不超过 2MB</span>
+                        </div>
                     </el-form-item>
                     <el-form-item label="心率设备正面编号:" prop="heartRateFrontNo">
                         <el-input v-model="ruleForm1.heartRateFrontNo" />
@@ -241,9 +253,11 @@
             </template>
 
             <template #footer>
-                <div class="footer">
+                <div class="student-form-footer">
-                    <p class="cancle" @click="cancelClick">取消</p>
+                    <el-button class="student-form-footer__cancel" :disabled="photoUploading"
-                    <p class="confirm" @click="confirmClick">确定</p>
+                        @click="cancelClick">取消</el-button>
+                    <el-button class="student-form-footer__confirm" type="primary" :loading="photoUploading"
+                        @click="confirmClick">确认</el-button>
                 </div>
             </template>
         </el-drawer>
@@ -338,6 +352,7 @@ const isSchoolAdmin = Number(userInfo?.roleId) === 2;
 const isAdministrator = [1, 2].includes(Number(userInfo?.roleId));
 const baseURL = axios.defaults.baseURL;
 const dialogVisiblePhoto = ref(false)
+const photoUploading = ref(false)
 const promotionLoading = ref(false)
 const studentTableRef = ref(null)
 const batchDeleteMode = ref(false)
@@ -699,49 +714,37 @@ const deleteFile3 = () => {
     data.value.showIcon3 = false
 
 }
-const beforeImageUpload = (file) => {
+const uploadStudentPhoto = async (file, studentForm) => {
-    console.log(file, 'fileeeee')
+    if (!studentForm.studentNo || !studentForm.studentName || !studentForm.classId?.length) {
-    console.log(ruleForm.value, 'ruleForm.value')
+        ElMessage.error('请先填写学生姓名、年级班级和学号再上传照片')
-    if (!ruleForm.value.studentNo && !ruleForm.value.studentName && !ruleForm.value.gradeId && !ruleForm.value.classId) {
+        return false
-        return ElMessage.error('请选填写信息再上传头像')
+    }
+    if (photoUploading.value) {
+        return false
     }
-    return new Promise((resolve, reject) => {
-        const reader = new FileReader();
-        reader.readAsDataURL(file);
-        reader.onload = function () {
-            photoForm.append("file", file);
-            AddPhoto(ruleForm.value)
 
-        };
+    photoUploading.value = true
-        reader.onerror = function (error) {
+    photoForm.set('file', file)
-            reject(error);
+    try {
-        };
+        await AddPhoto(studentForm)
-        reader.onloadend = function () {
+        ElMessage.success('学生照片上传成功')
-            resolve(ruleForm.value.photo);
+    } catch (error) {
-        };
+        const message = error?.response?.data?.message || error?.message || '学生照片上传失败，请稍后重试'
-    })
+        ElMessage.error(message)
+        console.error('Failed to upload student photo:', error)
+    } finally {
+        photoForm.delete('file')
+        photoUploading.value = false
+    }
+
+    // 照片由 AddPhoto 自定义上传，阻止 el-upload 再次发起请求。
+    return false
+}
+const beforeImageUpload = (file) => {
+    return uploadStudentPhoto(file, ruleForm.value)
 }
 const beforeImageUpload1 = (file) => {
-    console.log(file, 'fileeeee')
+    return uploadStudentPhoto(file, ruleForm1.value)
-    console.log(ruleForm1.value, 'ruleForm.value')
-    if (!ruleForm1.value.studentNo && !ruleForm1.value.studentName && !ruleForm1.value.gradeId && !ruleForm1.value.classId) {
-        return ElMessage.error('请选填写信息再上传头像')
-    }
-    return new Promise((resolve, reject) => {
-        const reader = new FileReader();
-        reader.readAsDataURL(file);
-        reader.onload = function () {
-            photoForm.append("file", file);
-            AddPhoto(ruleForm1.value)
-
-        };
-        reader.onerror = function (error) {
-            reject(error);
-        };
-        reader.onloadend = function () {
-            resolve(ruleForm.value.photo);
-        };
-    })
 }
 const cancelClick1 = () => {
     data.value.drawerDialog.show2 = false
@@ -1309,10 +1312,13 @@ async function AddStudents(val) {
 async function ModifyTeachers(val) {
     // const path = val.photo.match(/(?:\/\/[^\/]+)?\/(.*)/)[1];
     // val.photo = path
-    val.classId = val.classId ? val.classId[1] : null
+    const payload = {
+        ...val,
+        classId: Array.isArray(val.classId) ? val.classId[1] : val.classId,
+    }
     // console.log(val.photo, 'val.phoito')
     try {
-        const res = await _api.ModifyStudent(val);
+        const res = await _api.ModifyStudent(payload);
         if (res.code == 200) {
             data.value.drawerDialog.show1 = false
             resetForm(ruleFormRef1.value)
@@ -1440,50 +1446,34 @@ async function AddList3() {
     });
 }
 async function AddPhoto(val) {
-    console.log(photoForm, 'photoForm')
     const datas = {
         gradeId: val.classId[0],
         classId: val.classId[1],
         studentNo: val.studentNo,
+        studentName: val.studentName,
     }
-    console.log(datas, 'datasssss')
+    const query = new URLSearchParams({
+        gradeId: String(datas.gradeId),
+        classId: String(datas.classId),
+        studentNo: datas.studentNo,
+        studentName: datas.studentName,
+    })
     const options = {
         method: 'POST',
-        // url: 'http://192.168.10.230:14102/api/BackStandard/Add',
+        url: `/api/Student/UploadPhoto?${query.toString()}`,
-        url: `/api/Student/UploadPhoto?gradeId=${datas.gradeId}&classId=${datas.classId}&studentNo=${datas.studentNo}`,
-        headers: {
-            Accept: '',
-            'content-type': 'multipart/form-data; boundary=---011000010111000001101001'
-        },
         data: photoForm
-    };
+    }
-    let k = data.value as any
+    const response = await axios.request(options)
-    axios.request(options).then(function (response) {
+    if (response.data.code != 200) {
-        if (response.data.code == 200) {
+        throw new Error(response.data.message || '学生照片上传失败')
-            const newUrl = response.data.data + '?timestamp=' + new Date().getTime();
+    }
+
+    const newUrl = response.data.data + '?timestamp=' + new Date().getTime()
     if (data.value.isAdd) {
-                console.log(response.data.data, 'response.data.data123')
+        ruleForm.value.photo = newUrl
-                ruleForm.value.photo = newUrl;
-                console.log(ruleForm.value.photo, 'ruleForm.value.photo')
     } else {
-                console.log(response.data.data, 'response.data.data')
+        ruleForm1.value.photo = newUrl
-                ruleForm1.value.photo = newUrl;
-                console.log(ruleForm1.value.photo, 'ruleForm1.value.photo')
     }
-            // k.drawerDialog.show2 = false
-            // k.fileList3 = {}
-            // k.showIcon3 = false
-            photoForm.delete("file")
-            // data.value.tableNeed.refresh = false
-            // ElMessage.success(response.data.data)
-            // initApi(data.value)
-        } else {
-            ElMessage.error(response.data.message)
-            photoForm.delete("file")
-        }
-    }).catch(function (error) {
-        console.error(error, 'errororor');
-    });
 }
 function exportData(val) {
     axios({
@@ -1513,6 +1503,69 @@ function exportData(val) {
 .confirm-tip {
     color: red;
 }
+
+.information-manage-drawer-overlay .student-photo-upload {
+    position: relative;
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 8px;
+    min-width: 220px;
+    min-height: 132px;
+    border-radius: 10px;
+}
+
+.information-manage-drawer-overlay .student-photo-upload .el-loading-mask {
+    border-radius: 10px;
+}
+
+.information-manage-drawer-overlay .student-photo-upload__hint {
+    color: #98a2b3;
+    font-size: 12px;
+    line-height: 18px;
+    white-space: nowrap;
+}
+
+.information-manage-drawer-overlay .student-form-footer {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: flex-end;
+    gap: 12px;
+}
+
+.information-manage-drawer-overlay .student-form-footer .el-button {
+    min-width: 104px;
+    height: 40px;
+    margin: 0;
+    border-radius: 8px;
+    font-size: 14px;
+    font-weight: 500;
+}
+
+.information-manage-drawer-overlay .student-form-footer__cancel {
+    color: #475467;
+    background: #fff;
+    border-color: #d0d5dd;
+}
+
+.information-manage-drawer-overlay .student-form-footer__cancel:hover {
+    color: #176be7;
+    background: #f5f9ff;
+    border-color: #84adff;
+}
+
+.information-manage-drawer-overlay .student-form-footer__confirm {
+    color: #fff;
+    background: linear-gradient(135deg, #2f8dff 0%, #176be7 100%);
+    border-color: #176be7;
+    box-shadow: 0 6px 14px rgba(47, 141, 255, 0.2);
+}
+
+.information-manage-drawer-overlay .student-form-footer__confirm:hover {
+    background: linear-gradient(135deg, #58a4ff 0%, #2f7df0 100%);
+    border-color: #2f7df0;
+}
 </style>
 <style lang="less" scoped>
 .head {

vite.config.ts

@@ -27,7 +27,7 @@ export default ({ mode }: ConfigEnv) => {
       proxy: {
         '/dev-api': {
           // target: 'http://8.153.108.90:9991/',
-          target: ENV.VITE_API_BASE || 'http://localhost:9991',
+          target: 'http://8.153.108.90:9991',
           changeOrigin: true,
           rewrite: (path) => path.replace(/^\/dev-api/, '')
         }