liuyg
2021-09-24 c4e67a8942e514b65ab41bb19781d50576c15725
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
<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">
                    (&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="userAnswer === option.optionName"
                           :id="'option' + option.id"
                           @change="toggleOption(option)">
                    <label :for="'option' + option.id">
                        <span class="subject-option-prefix">{{ option.optionName }}&nbsp;</span>
                    </label>
                </li>
            </ul>
        </div>
    </div>
</template>
 
<script>
export default {
    name: 'Judgement',
    data () {
        return {
            subjectCount: 0,
            subjectInfo: {
                subjectName: '',
                score: 0
            },
            options: [
                { id: 1, optionName: '正确' },
                { id: 2, optionName: '错误' }
            ],
            userAnswer: '',
            index: ''
        }
    },
    methods: {
        getAnswer () {
            return this.userAnswer
        },
        setAnswer (answer) {
            this.userAnswer = answer
        },
        setSubjectInfo (subject, subjectCount, index) {
            this.subjectCount = subjectCount
            this.subjectInfo = subject
            if (subject.hasOwnProperty('answer')) {
                this.setAnswer(subject.answer)
            }
            this.index = index + '.'
        },
        getSubjectInfo () {
            this.subjectInfo.options = this.options
            return this.subjectInfo
        },
        // 选中选项
        toggleOption (option) {
            this.userAnswer = option.optionName
        }
    }
}
</script>
 
<style lang="scss" scoped>
@import '../../../assets/css/subject.scss';
.subject-options > li label {
    height: 36px;
    line-height: 28px !important;
}
</style>