登录用户名提示修改为姓名

Administrator

2022-05-09 c7735db135f9c3c99224d8b5d2157926efde0977

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
<template>
  <div>
    <div class="subject-content">
      <div class="subject-title">
        {{ index }}
        <span class="subject-title-content" v-html="subjectInfo.subjectName" />
        <span class="subject-title-content titlesss">
          (&nbsp;多选题&nbsp;<span
            v-if="subjectInfo.score !== undefined && subjectInfo.score !== 0"
            >&nbsp;{{ subjectInfo.score }}分&nbsp;</span
          >)
        </span>
      </div>
 
      <ul class="subject-options" v-for="option in options" :key="option.id">
        <li class="subject-option">
          <input
            class="toggle"
            type="checkbox"
            :checked="isChecked(option.optionName)"
            :id="'option' + option.id"
            @change="toggleOption($event, option)"
          />
          <label :for="'option' + option.id">
            <span class="subject-option-prefix"
              >{{ option.optionName + "." }}&nbsp;</span
            >
            <span v-html="option.optionContent" class="subject-option-prefix" />
          </label>
        </li>
      </ul>
    </div>
  </div>
</template>
 
<script>
export default {
  name: "MultipleChoices",
  data() {
    return {
      subjectCount: 0,
      subjectInfo: {
        subjectName: "",
        score: 0,
      },
      options: [],
      userAnswer: [],
      index: "",
    };
  },
  watch: {},
  methods: {
    getAnswer() {
      return this.userAnswer.join(",");
    },
    setAnswer(answer) {
      // if (isNotEmpty(answer)) {
      this.userAnswer = answer.split(",");
      // }
    },
    setSubjectInfo(subject, subjectCount, index) {
      this.subjectCount = subjectCount;
      this.subjectInfo = subject;
      if (subject.hasOwnProperty("examSubjectOptions")) {
        this.options = subject.examSubjectOptions;
      }
      if (subject.hasOwnProperty("answer")) {
        this.setAnswer(subject.answer);
      }
      this.index = index + ".";
    },
    getSubjectInfo() {
      this.subjectInfo.options = this.options;
      return this.subjectInfo;
    },
    // 选中选项
    toggleOption($event, option) {
      if ($event.target.checked) {
        if (!this.userAnswer.includes(option.optionName)) {
          this.userAnswer.push(option.optionName);
        }
      } else {
        this.userAnswer.splice(
          this.userAnswer.findIndex((item) => item === option.optionName),
          1
        );
      }
    },
    isChecked(optionName) {
      return this.userAnswer.includes(optionName);
    },
  },
};
</script>
 
<style lang="scss" scoped>
@import "../../../assets/css/subject.scss";
.subject-options > li label {
  line-height: 36px !important;
}
</style>