Bläddra i källkod

feat: 数据检查限制答案输入框按键

chenhao 2 år sedan
förälder
incheckning
b501d3b1d8
1 ändrade filer med 25 tillägg och 9 borttagningar
  1. 25 9
      src/features/admin/confirmPaper/ConfirmPaper.vue

+ 25 - 9
src/features/admin/confirmPaper/ConfirmPaper.vue

@@ -96,6 +96,7 @@
                     :maxLength="
                       group.mainTitle.match(/多选|多项|不定项/) ? 100 : 1
                     "
+                    @keydown="onPreventAnswerKey"
                     @input="changeAnswer($event, question)"
                     @blur="changeAnswer($event, question, '#')"
                   />
@@ -308,21 +309,36 @@ async function getStudent(studentId: number) {
   return stu;
 }
 
+const allowKey = [
+  "Delete",
+  "Backspace",
+  "ArrowLeft",
+  "ArrowRight",
+  "#",
+  "ShiftLeft",
+  "Shift",
+  "[A-Za-z]",
+];
+const allowKeyRef = new RegExp(allowKey.join("|"));
+
+function onPreventAnswerKey(e: KeyboardEvent) {
+  if (!allowKeyRef.test(e.key)) {
+    e.preventDefault();
+  }
+}
+
 function changeAnswer(
   event: Event,
   question: StudentInfo["answers"][0],
   defaultValue?: string
 ) {
-  // console.log(question, event.target.value);
+  const target = event.target as HTMLInputElement;
   student!.answers = student!.answers.map((v) => {
     if (
       v.mainNumber === question.mainNumber &&
       v.subNumber === question.subNumber
     ) {
-      v.answer =
-        (<HTMLInputElement>event.target!).value.toUpperCase().trim() ||
-        defaultValue ||
-        "";
+      v.answer = target?.value.toUpperCase().trim() || defaultValue || "";
     }
     return v;
   });
@@ -333,10 +349,10 @@ async function saveStudentAnswer() {
   const form = new FormData();
   form.append("studentId", student.id + "");
   const answers = student.answers.map((v) => v.answer || "#").join(",");
-  if (!answers.match(/^(#*,*[A-Z]*)+$/g)) {
-    void message.error("答案只能是#和大写英文字母");
-    return;
-  }
+  // if (!answers.match(/^(#*,*[A-Z]*)+$/g)) {
+  //   void message.error("答案只能是#和大写英文字母");
+  //   return;
+  // }
 
   form.append("answers", answers);