Bladeren bron

feat: 细节优化

chenhao 2 jaren geleden
bovenliggende
commit
34375c7db4

+ 0 - 11
src/assets/icons/add-icon.svg

@@ -1,11 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg width="12px" height="12px" viewBox="0 0 12 12" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-    <title>新增</title>
-    <g id="页面-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
-        <g id="icon" transform="translate(-27.000000, -122.000000)" stroke="#FFFFFF">
-            <g transform="translate(27.000000, 122.000000)" id="新增">
-                <path d=""></path>
-            </g>
-        </g>
-    </g>
-</svg>

BIN
src/assets/images/common/star-icon.png


+ 2 - 2
src/pages/exam-manage/index.vue

@@ -146,7 +146,7 @@ import { throttle } from "lodash-es";
 import { EXAM_STATUS } from "@/constants/dicts";
 import { useMainStore } from "@/store/main";
 
-const userInfo = useMainStore();
+const mainStore = useMainStore();
 
 const showModal = ref(false);
 const tableLoading = ref(false);
@@ -172,7 +172,7 @@ const { validate, validateInfos, resetFields } = Form.useForm(
 /** 请求参数 */
 const query = reactive<FetchExamListQuery>({
   name: "",
-  schoolId: userInfo.systemUserInfo?.schoolId || "",
+  schoolId: mainStore.systemUserInfo?.schoolId || "",
   pageNumber: 1,
   pageSize: 8,
 });

+ 2 - 2
src/pages/login/index.vue

@@ -50,7 +50,7 @@ import { reactive, ref } from "vue";
 import { useRouter } from "vue-router";
 import { Form, message } from "ant-design-vue";
 import { loginHttp } from "@api/common";
-import SvgIcon from "@/components/svg-icon/index.vue";
+// import SvgIcon from "@/components/svg-icon/index.vue";
 
 const router = useRouter();
 
@@ -93,7 +93,7 @@ const doLogin = () => {
 <style scoped lang="less">
 .login-view {
   width: 100%;
-  height: 100%;
+  height: 100vh;
   background-color: @white;
   .login-content {
     .login-banner {

+ 13 - 3
src/pages/subjects-manage/index.vue

@@ -99,10 +99,14 @@
           (_:any, index:number) => (index % 2 === 1 ? 'table-striped' : null)
         "
       >
-        <template #bodyCell="{ column, record, index }">
+        <template #bodyCell="{ column, record, index, text }">
           <template v-if="column.dataIndex === 'index'">
             {{ index + 1 }}
           </template>
+          <template v-else-if="column.dataIndex === 'courseName'">
+            {{text}}
+            <img v-if="!record.groupFinish" class="star-icon" src="@imgs/common/star-icon.png" />
+          </template>
           <template v-else-if="column.dataIndex === 'enable'">
             <template v-if="record.enable">
               <CheckCircleFilled style="color: #30bf78" />
@@ -165,7 +169,7 @@ import { getSchoolListHttp } from "@/apis/school";
 import { getExamListHttp } from "@/apis/exam";
 import { useMainStore } from "@/store/main";
 
-const userInfo = useMainStore();
+const mainStore = useMainStore();
 
 const showImportModal = ref(false);
 const importType = ref("subject");
@@ -184,7 +188,7 @@ const query = reactive<
   /** 	分组状态 */
   groupFinish: 0,
   /** 学校id */
-  schoolId: userInfo.systemUserInfo?.schoolId || '',
+  schoolId: mainStore.systemUserInfo?.schoolId || '',
   /** 总分截止值 */
   totalScoreMax: "",
   /** 总分起始值 */
@@ -412,6 +416,12 @@ querySchoolList();
     }
   }
   .subjects-table {
+    .star-icon {
+      width: 14px;
+      height: 14px;
+      display: inline-block;
+      vertical-align: middle;
+    }
   }
 }
 </style>

+ 46 - 36
src/pages/user-manage/index.vue

@@ -62,6 +62,7 @@
           total: userTableData.totalCount,
           pageSize: query.pageSize,
         }"
+        @change="currentPageChange"
         :row-class-name="
           (_:any, index:number) => (index % 2 === 1 ? 'table-striped' : null)
         "
@@ -102,18 +103,19 @@
     </Block>
     <a-modal
       v-model:visible="showModal"
-      title="新增用户"
+      :title="`${!userInfo.id ? '新增' : '编辑'}用户`"
       okText="确定"
       cancelText="取消"
       :maskClosable="false"
-      @ok="onAddNewUser"
-      :after-close="resetUserInfo"
+      @ok="onPutUser"
+      :after-close="resetUserFields"
     >
       <a-form :labelCol="{ span: 6 }">
         <a-form-item label="学校" v-bind="validateInfos.schoolId">
           <a-select
             v-model:value="userInfo.schoolId"
             show-search
+            :disabled="!!userInfo.id"
             :filterOption="false"
             @search="querySchoolList"
             placeholder="学校名称"
@@ -130,7 +132,11 @@
           <a-input v-model:value="userInfo.name"></a-input>
         </a-form-item>
         <a-form-item label="登录名" v-bind="validateInfos.loginName">
-          <a-input v-model:value="userInfo.loginName"></a-input>
+          <a-input
+            :disabled="!!userInfo.id"
+            v-model:value="userInfo.loginName"
+            placeholder="请输入登录手机号"
+          ></a-input>
         </a-form-item>
         <a-form-item label="密码" v-bind="validateInfos.passwd">
           <a-input v-model:value="userInfo.passwd"></a-input>
@@ -141,7 +147,11 @@
             <a-select-option value="SECTION_LEADER">科组长</a-select-option>
           </a-select>
         </a-form-item>
-        <a-form-item label="所属科目" v-bind="validateInfos.course">
+        <a-form-item
+          v-if="userInfo.role === 'SECTION_LEADER'"
+          label="所属科目"
+          v-bind="validateInfos.course"
+        >
           <a-textarea v-model:value="userInfo.course"></a-textarea>
         </a-form-item>
       </a-form>
@@ -168,7 +178,7 @@
       title="导入用户"
       :footer="false"
       :maskClosable="false"
-      :after-close="resetPwdInfo"
+      :after-close="resetPwdFields"
     >
       <a-upload
         :file-list="fileList"
@@ -192,7 +202,7 @@
 </template>
 
 <script setup lang="ts" name="PageUsers">
-import { reactive, ref } from "vue";
+import { reactive, ref, watch } from "vue";
 import {
   PlusCircleOutlined,
   CheckCircleFilled,
@@ -212,6 +222,9 @@ import { message } from "ant-design-vue";
 import { Form } from "ant-design-vue";
 import { getSchoolListHttp } from "@/apis/school";
 import type { UploadProps, TableColumnType } from "ant-design-vue";
+import { useMainStore } from "@/store/main";
+
+const mainStore = useMainStore();
 
 const showModal = ref(false);
 const showResetPwdModal = ref(false);
@@ -235,8 +248,17 @@ const resetPwd = ref({
 const userRules = {
   schoolId: [{ required: true, message: "请选择用户所属学校" }],
   name: [{ required: true, message: "请填写用户姓名" }],
-  loginName: [{ required: true, message: "请填写登录名称" }],
-  passwd: [{ required: true, message: "请填写登录密码" }],
+  loginName: [
+    { required: true, message: "请填写登录手机号" },
+    { pattern: /\d{11}/, message: "请填写正确的手机号" },
+  ],
+  passwd: [
+    { required: true, message: "请填写登录密码" },
+    {
+      pattern: /^[a-zA-Z0-9]{6,18}$/,
+      message: "密码只能由数字、字母组成,长度6-18个字符",
+    },
+  ],
   role: [{ required: true, message: "请选择用户角色" }],
 };
 
@@ -250,16 +272,21 @@ const pwdRules = {
   ],
 };
 
-const { validate, validateInfos } = Form.useForm(userInfo.value, userRules);
-const { validate: validatePwd, validateInfos: validatePwdInfos } = Form.useForm(
-  resetPwd.value,
-  pwdRules
-);
+const {
+  validate,
+  validateInfos,
+  resetFields: resetUserFields,
+} = Form.useForm(userInfo.value, userRules);
+const {
+  validate: validatePwd,
+  validateInfos: validatePwdInfos,
+  resetFields: resetPwdFields,
+} = Form.useForm(resetPwd.value, pwdRules);
 
 /** 请求参数 */
 const query = reactive<FetchUserListQuery>({
   loginName: "",
-  schoolId: "",
+  schoolId: mainStore.systemUserInfo?.schoolId || "",
   role: void 0,
   pageNumber: 1,
   pageSize: 10,
@@ -319,6 +346,8 @@ const queryUserList = async () => {
   }
 };
 
+watch(() => query.pageNumber, queryUserList);
+
 /* 启用/禁用 */
 const updateUserStatus = (record: UserInfo) => {
   updateUserStatusHttp({ enable: !record.enable, ids: [record.id] }).then(
@@ -328,7 +357,6 @@ const updateUserStatus = (record: UserInfo) => {
 
 /** 编辑用户 */
 const onEdit = (record: UserInfo) => {
-  console.log(record);
   Object.assign(userInfo.value, {
     ...record,
     course: record.courseCodes?.join(","),
@@ -344,7 +372,7 @@ const onResetPwd = (record: UserInfo) => {
 };
 
 /** 新增用户 */
-const onAddNewUser = () => {
+const onPutUser = () => {
   validate().then((valid) => {
     if (valid) {
       editUserInfoHttp(userInfo.value).then(() => {
@@ -389,7 +417,7 @@ const onImportUserList = () => {
     return;
   }
   const formData = new FormData();
-  formData.append("schoolId", query.schoolId);
+  formData.append("schoolId", `${query.schoolId}`);
   fileList.value?.forEach((file: any) => {
     formData.append("file", file);
   });
@@ -412,24 +440,6 @@ const currentPageChange = ({ current }: { current: number }) => {
   query.pageNumber = current;
 };
 
-/** 初始化userInfo */
-const resetUserInfo = () => {
-  userInfo.value = {
-    schoolId: "",
-    name: "",
-    loginName: "",
-    role: void 0,
-    course: "",
-  };
-};
-
-const resetPwdInfo = () => {
-  resetPwd.value = {
-    passwd: "",
-    userId: "",
-  };
-};
-
 querySchoolList();
 
 /** effect */

+ 4 - 4
src/utils/auth.ts

@@ -7,8 +7,8 @@ export const getLoginResult = (): LoginResult | null => {
 };
 
 export const cacheLoginResult = (loginResult: LoginResult): LoginResult => {
-  const store = useMainStore();
-  store.loginResult = loginResult;
+  const mainStore = useMainStore();
+  mainStore.loginResult = loginResult;
   sessionStorageTool.set(SESSION_STORAGE_KEYS.LOGIN_RESULT, loginResult);
   return loginResult;
 };
@@ -18,8 +18,8 @@ export const getUserInfo = (): SystemUserInfo | null => {
 };
 
 export const cacheUserInfo = (userInfo: SystemUserInfo): SystemUserInfo => {
-  const store = useMainStore();
-  store.systemUserInfo = userInfo;
+  const mainStore = useMainStore();
+  mainStore.systemUserInfo = userInfo;
   sessionStorageTool.set(SESSION_STORAGE_KEYS.USER_INFO, userInfo);
   return userInfo;
 };

+ 1 - 1
types/project.d.ts

@@ -99,7 +99,7 @@ interface FetchUserListQuery extends BaseMutPageQuery {
   /** 用户角色 */
   role?: "SUPER_ADMIN" | "SCHOOL_ADMIN" | "SECTION_LEADER";
   /** 学校ID */
-  schoolId?: string;
+  schoolId?: string | number;
 }
 
 interface BaseUserInfo {