From adccfe317cd047d184296b4eef0178b112d77fb2 Mon Sep 17 00:00:00 2001
From: suyanyan <1321717064@qq.com>
Date: Wed, 25 Sep 2024 16:45:52 +0800
Subject: [PATCH] =?UTF-8?q?=E7=A6=85=E9=81=93bug=E5=A4=84=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../views/userManage/classManage/index.vue    |   6 +-
 .../components/form/form_basic.vue            |   5 +
 .../views/userManage/keyPersonnel/index.vue   |  98 ++-------
 .../personnel/components/form/form_basic.vue  |  17 +-
 .../personnel/components/form/index.vue       |   1 +
 .../src/views/userManage/personnel/index.vue  | 198 +++++-------------
 6 files changed, 92 insertions(+), 233 deletions(-)

diff --git a/SafeCampus.WEB/src/views/userManage/classManage/index.vue b/SafeCampus.WEB/src/views/userManage/classManage/index.vue
index 5766234..88940d4 100644
--- a/SafeCampus.WEB/src/views/userManage/classManage/index.vue
+++ b/SafeCampus.WEB/src/views/userManage/classManage/index.vue
@@ -96,7 +96,7 @@ const columns: ColumnProps<SysUserPersonnel.ClassPage>[] = [
       el: "select",
       span:1,
       props: {
-        clearable: false,
+        clearable: true,
         placeholder: "请选择专业",
       },
     },
@@ -105,7 +105,9 @@ const columns: ColumnProps<SysUserPersonnel.ClassPage>[] = [
   {
     prop: "personSetName",
     label: "班级名称",
-    search: { el: "input",span:1, } 
+    search: { el: "input",span:1,props: {
+        clearable: true,
+      }, },
   },
  
   {
diff --git a/SafeCampus.WEB/src/views/userManage/keyPersonnel/components/form/form_basic.vue b/SafeCampus.WEB/src/views/userManage/keyPersonnel/components/form/form_basic.vue
index b5c6310..19d2dd6 100644
--- a/SafeCampus.WEB/src/views/userManage/keyPersonnel/components/form/form_basic.vue
+++ b/SafeCampus.WEB/src/views/userManage/keyPersonnel/components/form/form_basic.vue
@@ -30,6 +30,11 @@
               }"
             >
               <el-icon><Plus /></el-icon>
+              <template #tip>
+                <div class="el-upload__tip" style="color: #909399">
+                  请上传不超过5张的清晰人脸照片，以便应用能准确识别 .支持*JPEG、PNG格式，单张照片不超过5M
+                </div>
+              </template>
             </el-upload>
             <el-dialog v-model="dialogVisible" title="查看图片">
               <img w-full :src="dialogImageUrl" alt="Preview Image" style="width: 100%" />
diff --git a/SafeCampus.WEB/src/views/userManage/keyPersonnel/index.vue b/SafeCampus.WEB/src/views/userManage/keyPersonnel/index.vue
index a043ea4..f6375a8 100644
--- a/SafeCampus.WEB/src/views/userManage/keyPersonnel/index.vue
+++ b/SafeCampus.WEB/src/views/userManage/keyPersonnel/index.vue
@@ -24,30 +24,6 @@
           <el-space>
             <s-button link :opt="FormOptEnum.EDIT" @click="onOpen(FormOptEnum.EDIT, scope.row)" />
             <s-button link :opt="FormOptEnum.DELETE" @click="onDelete([scope.row.personId], `删除人员`)" />
-            <el-dropdown @command="handleCommand">
-              <el-link type="primary" :underline="false" :icon="ArrowDown"> 更多 </el-link>
-              <template #dropdown>
-                <el-dropdown-menu>
-                  <el-dropdown-item :command="command(scope.row, cmdEnum.AddFace)"
-                    ><el-upload
-                      ref="upload"
-                      class="upload-demo"
-                      action="/api/business/personApi/uploadFile"
-                      :show-file-list="false"
-                      :on-success="handleAvatarSuccess"
-                      accept=".jpg, .jpeg, .png"
-                      :headers="{
-                        Authorization: `${TokenEnum.TOKEN_PREFIX} ${accessToken}`
-                      }"
-                    >
-                      <template #trigger>
-                        {{ cmdEnum.AddFace }}
-                      </template>
-                    </el-upload>
-                  </el-dropdown-item>
-                </el-dropdown-menu>
-              </template>
-            </el-dropdown>
           </el-space>
         </template>
       </ProTable>
@@ -67,18 +43,12 @@ import { userManageKeyPersonApi,SysUserPersonnel } from "@/api";
 import { useHandleData } from "@/hooks/useHandleData";
 import { FormOptEnum } from "@/enums";
 import Form from "./components/form/index.vue";
-import { ArrowDown } from "@element-plus/icons-vue";
 import { ColumnProps, ProTableInstance } from "@/components/ProTable/interface";
 import { ElMessage } from "element-plus";
-import { useUserStore } from "@/stores/modules";
-import { TokenEnum } from "@/enums";
-import type { UploadProps } from "element-plus";
 // 获取 ProTable 元素，调用其获取刷新数据方法（还能获取到当前查询参数，方便导出携带参数）
 const faceUrl = ref('');
 const visible = ref(false); //是否显示人员表单
 const proTable = ref<ProTableInstance>();
-const userStore = useUserStore();
-const { accessToken } = userStore;
 // 表格配置项
 const columns: ColumnProps<SysUserPersonnel.SysUserPerInfo>[] = [
   { type: "selection", fixed: "left", width: 50 },
@@ -96,8 +66,24 @@ const columns: ColumnProps<SysUserPersonnel.SysUserPerInfo>[] = [
     label: "姓名"
   },
   {
-    prop: "personId",
-    label: "人员ID"
+    prop: "gender",
+    label: "性别",
+    enum: [{
+      label: "未知",
+      value: "GENDER_UNKNOWN"
+    },
+    {
+      label: "男",
+      value: "GENDER_MALE"
+    },
+    {
+      label: "女",
+      value: "GENDER_FEMALE"
+    }],
+  },
+  {
+    prop: "phone",
+    label: "手机号"
   },
   {
     prop: "age",
@@ -151,54 +137,6 @@ function onOpen(opt: FormOptEnum, record: {} | SysUserPersonnel.SysUserPerInfo =
 const RefreshTable = () => {
   proTable.value?.refresh();
 }
-
-
-/** 更多下拉菜单命令枚举 */
-enum cmdEnum {
-  AddFace = "添加人脸",
-}
-/** 下拉菜单参数接口 */
-interface Command {
-  row: SysUserPersonnel.SysUserPerInfo;
-  command: cmdEnum;
-}
-
-/**配置command的参数 */
-function command(row: SysUserPersonnel.SysUserPerInfo, command: cmdEnum): Command {
-  return {
-    row: row,
-    command: command
-  };
-}
-/**
- * 列表更多下拉菜单点击事件
- * @param command
- */
-const personId = ref<number | string>(); //人员id
-function handleCommand(command: Command) {
-  switch (command.command) {
-    case cmdEnum.AddFace:
-      personId.value = command.row.personId; //获取人员id
-      break
-  }
-}
-
-
-
-
-
-const handleAvatarSuccess: UploadProps["onSuccess"] = (response) => {
-  if (response.code === 200) {
-    userManageKeyPersonApi.addFace({
-      personId: personId.value,
-      faceUrl: response.data
-    }).then(res=>{
-      RefreshTable()
-    })
-  } else {
-    ElMessage.error(response.msg);
-  }
-};
 </script>
 <style scoped lang="scss">
 .table-box {
diff --git a/SafeCampus.WEB/src/views/userManage/personnel/components/form/form_basic.vue b/SafeCampus.WEB/src/views/userManage/personnel/components/form/form_basic.vue
index f87922d..d486327 100644
--- a/SafeCampus.WEB/src/views/userManage/personnel/components/form/form_basic.vue
+++ b/SafeCampus.WEB/src/views/userManage/personnel/components/form/form_basic.vue
@@ -26,7 +26,13 @@
         </el-col>
         <el-col :span="12">
           <s-form-item label="所属班级" prop="personSetId">
-            <s-select v-model="userInfo.personSetId" :options="classOptions" label="personSetName" value="personSetId"></s-select> </s-form-item
+            <s-select
+              v-model="userInfo.personSetId"
+              :filterable="true"
+              :options="classOptions"
+              label="personSetName"
+              value="personSetId"
+            ></s-select> </s-form-item
         ></el-col>
       </el-row>
       <el-row :gutter="16">
@@ -46,6 +52,11 @@
               }"
             >
               <el-icon><Plus /></el-icon>
+              <template #tip>
+                <div class="el-upload__tip" style="color: #909399">
+                  请上传不超过5张的清晰人脸照片，以便应用能准确识别 .支持*JPEG、PNG格式，单张照片不超过5M
+                </div>
+              </template>
             </el-upload>
             <el-dialog v-model="dialogVisible" title="查看图片">
               <img w-full :src="dialogImageUrl" alt="Preview Image" style="width: 100%" />
@@ -154,8 +165,8 @@ onMounted(async () => {
   // 初始化
   userInfo.value.gender = userInfo.value.gender ? userInfo.value.gender : genderOptions.value[0].value;
   if (userInfo.value.personId) {
-    majorOptions.value = await getMajorList(userInfo.value.depId);
-    classOptions.value = await getClassList(userInfo.value.majorId);
+    majorOptions.value = await getMajorList(userInfo.value.depId ? userInfo.value.depId : "");
+    classOptions.value = await getClassList(userInfo.value.majorId ? userInfo.value.majorId : "");
     if (userInfo.value.faces?.length > 0) {
       fileList.value = [
         ...JSON.parse(JSON.stringify(userInfo.value.faces)).map((item: any) => {
diff --git a/SafeCampus.WEB/src/views/userManage/personnel/components/form/index.vue b/SafeCampus.WEB/src/views/userManage/personnel/components/form/index.vue
index 1c50e15..046ed2c 100644
--- a/SafeCampus.WEB/src/views/userManage/personnel/components/form/index.vue
+++ b/SafeCampus.WEB/src/views/userManage/personnel/components/form/index.vue
@@ -70,6 +70,7 @@ function onOpen(props: FormProps.Base<SysUserPersonnel.SysUserPerInfo>) {
     userManagePersonnelApi.detail({ id: props.record.personId }).then((res: any) => {
       if (!res.data.majorId) res.data.majorId = "";
       if (!res.data.depId) res.data.depId = "";
+      if (!res.data.age) res.data.age = "";
       sysUserProps.record = res.data;
     });
   }
diff --git a/SafeCampus.WEB/src/views/userManage/personnel/index.vue b/SafeCampus.WEB/src/views/userManage/personnel/index.vue
index 19c5b20..a5a1ebf 100644
--- a/SafeCampus.WEB/src/views/userManage/personnel/index.vue
+++ b/SafeCampus.WEB/src/views/userManage/personnel/index.vue
@@ -25,33 +25,9 @@
           <el-space>
             <s-button v-auth="userPerButtonCode.edit" link :opt="FormOptEnum.EDIT" @click="onOpen(FormOptEnum.EDIT, scope.row)" />
             <s-button v-auth="userPerButtonCode.delete" link :opt="FormOptEnum.DELETE" @click="onDelete([scope.row.personId], `删除人员`)" />
-            <el-dropdown @command="handleCommand">
-              <el-link type="primary" :underline="false" :icon="ArrowDown"> 更多 </el-link>
-              <template #dropdown>
-                <el-dropdown-menu>
-                  <el-dropdown-item :command="command(scope.row, cmdEnum.AddFace)"
-                    ><el-upload
-                      ref="upload"
-                      class="upload-demo"
-                      action="/api/business/personApi/uploadFile"
-                      :show-file-list="false"
-                      :on-success="handleAvatarSuccess"
-                      accept=".jpg, .jpeg, .png"
-                      :headers="{
-                        Authorization: `${TokenEnum.TOKEN_PREFIX} ${accessToken}`
-                      }"
-                    >
-                      <template #trigger>
-                        {{ cmdEnum.AddFace }}
-                      </template>
-                    </el-upload>
-                  </el-dropdown-item>
-                  <el-dropdown-item v-if="scope.row.personSetId" :command="command(scope.row, cmdEnum.UnderpantsUnBinding)">
-                    {{ cmdEnum.UnderpantsUnBinding }}
-                  </el-dropdown-item>
-                </el-dropdown-menu>
-              </template>
-            </el-dropdown>
+            <el-button v-if="scope.row.personSetId" type="primary" :icon="Remove" link @click="onUnbind(scope.row)">
+              {{ cmdEnum.UnderpantsUnBinding }}
+            </el-button>
           </el-space>
         </template>
       </ProTable>
@@ -68,73 +44,38 @@
 </template>
 <script setup lang="tsx" name="SysUserPersonnel">
 import { userManagePersonnelApi,userPerButtonCode,SysUserPersonnel } from "@/api";
-import { getMajorList, getDepartmentList, getClassList } from "@/mixin";
+import { getClassList } from "@/mixin";
 import { useHandleData } from "@/hooks/useHandleData";
 import { FormOptEnum } from "@/enums";
 import Form from "./components/form/index.vue";
-import { ArrowDown } from "@element-plus/icons-vue";
+import { Remove } from "@element-plus/icons-vue";
 import { ColumnProps, ProTableInstance } from "@/components/ProTable/interface";
-import { useUserStore } from "@/stores/modules";
-import { TokenEnum } from "@/enums";
-import type { UploadProps } from "element-plus";
 // 获取 ProTable 元素，调用其获取刷新数据方法（还能获取到当前查询参数，方便导出携带参数）
 const faceUrl = ref('');
 const visible = ref(false); //是否显示人员表单
 const proTable = ref<ProTableInstance>();
-const userStore = useUserStore();
-const { accessToken } = userStore;
-const departmentOptions = ref<any>([])
-const majorOptions = ref<any>([])
 const classOptions = ref<any>([])
-//监听depId/majorId变化
-watch(
-  () => [proTable.value!?.searchParam?.depId,proTable.value!?.searchParam?.majorId],
-  async ([newDepId,newMajorId],[oldDepId,oldMajorId]) => {
-    if(newDepId !== oldDepId){
-      majorOptions.value =await getMajorList(newDepId)
-      classOptions.value = [];
-      proTable.value!.searchParam.majorId = "";
-      proTable.value!.searchParam.personSetId = ""
-    }
-    if(newMajorId !== oldMajorId){
-      classOptions.value = await getClassList(newMajorId)
-    }
-    
-    
-  } ,{ deep: true, immediate: false }
-);
 // 表格配置项
 const columns: ColumnProps<SysUserPersonnel.SysUserPerInfo>[] = [
   { type: "selection", fixed: "left", width: 50 },
+ 
   {
-    prop: "depId",
-    label: "所属系部",
-    enum: departmentOptions,
-    fieldNames: { label: "name", value: "id" },
-    search: {
-      el: "select",
-      span:1,
-      props: {
-        clearable: false,
-        placeholder: "请选择系部",
-      },
-    },
-    isShow: false
+    prop: "faceUrl",
+    label: "人脸",
+    render: scope => {
+      return (
+        <img src={scope.row.faces.length > 0 ? scope.row.faces[0].faceUrl : ''} onClick={() => viewHeadImage(scope)} style='width:50px;height:50px;' alt=''/>
+      );
+    }
   },
   {
-    prop: "majorId",
-    label: "所属专业",
-    enum: majorOptions,
-    fieldNames: { label: "name", value: "id" },
-    search: {
-      el: "select",
-      span:1,
-      props: {
-        clearable: false,
-        placeholder: "请选择专业",
-      },
-    },
-    isShow: false
+    prop: "name",
+    label: "姓名",
+    search: {el:'input',span:1,}
+  },
+  {
+    prop: "personSetName",
+    label: "所属班级",
   },
   {
     prop: "personSetId",
@@ -152,29 +93,33 @@ const columns: ColumnProps<SysUserPersonnel.SysUserPerInfo>[] = [
     isShow: false
   },
   {
-    prop: "faceUrl",
-    label: "人脸",
-    render: scope => {
-      return (
-        <img src={scope.row.faces.length > 0 ? scope.row.faces[0].faceUrl : ''} onClick={() => viewHeadImage(scope)} style='width:50px;height:50px;' alt=''/>
-      );
-    }
-  },
-  {
-    prop: "name",
-    label: "姓名"
-  },
-  {
-    prop: "personId",
-    label: "人员ID"
+    prop: "gender",
+    label: "性别",
+    enum: [{
+      label: "未知",
+      value: "GENDER_UNKNOWN"
+    },
+    
+    {
+      label: "男",
+      value: "GENDER_MALE"
+    },
+    {
+      label: "女",
+      value: "GENDER_FEMALE"
+    }],
   },
   {
     prop: "phone",
-    label: "手机号"
+    label: "手机号",
+    search: {el:'input',span:1,}
   },
   {
-    prop: "personSetName",
-    label: "所属班级",
+    prop: "age",
+    label: "年龄",
+    render: scope => {
+      return scope.row.age ? scope.row.age : '--';
+    }
   },
   { prop: "operation", label: "操作", width: 250, fixed: "right" }
 ];
@@ -226,61 +171,18 @@ const RefreshTable = () => {
 
 /** 更多下拉菜单命令枚举 */
 enum cmdEnum {
-  AddFace = "添加人脸",
   UnderpantsUnBinding = "班级解绑"
 }
-/** 下拉菜单参数接口 */
-interface Command {
-  row: SysUserPersonnel.SysUserPerInfo;
-  command: cmdEnum;
-}
-
-/**配置command的参数 */
-function command(row: SysUserPersonnel.SysUserPerInfo, command: cmdEnum): Command {
-  return {
-    row: row,
-    command: command
-  };
-}
-/**
- * 列表更多下拉菜单点击事件
- * @param command
- */
-const personId = ref<number | string>(); //人员id
-function handleCommand(command: Command) {
-  switch (command.command) {
-    case cmdEnum.AddFace:
-      personId.value = command.row.personId; //获取人员id
-      break
-    case cmdEnum.UnderpantsUnBinding:
-      userManagePersonnelApi.personUnBindDfie({
-        personId:command.row.personId,
-        personSetId: command.row.personSetId
-      }).then(res=>{
-          ElMessage.success('班级解绑成功');
-          RefreshTable()
-      })
-      break;
-  }
-}
-
-
-
-const handleAvatarSuccess: UploadProps["onSuccess"] = (response) => {
-  if (response.code === 200) {
-    userManagePersonnelApi.addFace({
-      personId: personId.value,
-      faceUrl: response.data
-    }).then(res=>{
+const onUnbind = (row: SysUserPersonnel.SysUserPerInfo) => {
+  userManagePersonnelApi.personUnBindDfie({
+    personId:row.personId,
+    personSetId: row.personSetId
+  }).then(res=>{
+      ElMessage.success('班级解绑成功');
       RefreshTable()
-    })
-  } else {
-    ElMessage.error(response.msg);
-  }
-};
+  })
+}
 onMounted(async () => {
-  // 获取系部下拉数据
-  departmentOptions.value = await getDepartmentList()
   // 获取班级
   classOptions.value = await getClassList("");
 });