|
|
|
<template>
|
|
|
|
<div class="box">
|
|
|
|
<div class="form">
|
|
|
|
<div class="line">
|
|
|
|
<div class="item">
|
|
|
|
<p class="key">试卷名称:</p>
|
|
|
|
<el-input v-model="name"></el-input>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="line">
|
|
|
|
<div class="item">
|
|
|
|
<p class="key">试卷用途:</p>
|
|
|
|
<el-select v-model="effect" placeholder="请选择试卷用途">
|
|
|
|
<el-option v-for="(item,index) in effectList" :key="index" :label="item.label" :value="item.id"></el-option>
|
|
|
|
</el-select>
|
|
|
|
</div>
|
|
|
|
<div class="item lg">
|
|
|
|
<p class="key">所属课程:</p>
|
|
|
|
<el-input v-model="courses"></el-input>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="line">
|
|
|
|
<div class="item">
|
|
|
|
<p class="key">难易程度:</p>
|
|
|
|
<el-select v-model="degree" placeholder="请选择难易程度">
|
|
|
|
<el-option v-for="(item,index) in degreeList" :key="index" :label="item.label" :value="item.id"></el-option>
|
|
|
|
</el-select>
|
|
|
|
</div>
|
|
|
|
<div class="item lg">
|
|
|
|
<p class="key">建议时长(分钟):</p>
|
|
|
|
<el-input v-model.number="duration" type="number"></el-input>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="line">
|
|
|
|
<div class="item">
|
|
|
|
<p class="key">组卷方式:</p>
|
|
|
|
<div>
|
|
|
|
<el-radio v-for="(item,index) in typeList" :key="index" v-model="type" :label="item.id">{{item.label}}</el-radio>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="line">
|
|
|
|
<div class="item">
|
|
|
|
<p class="key">组卷方式:</p>
|
|
|
|
<div>
|
|
|
|
<el-button type="primary" @click="selectQues">选择试题</el-button>
|
|
|
|
<el-button type="primary" @click="removeQues">移除试题</el-button>
|
|
|
|
<el-button type="primary" @click="preview">试卷预览</el-button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="testpaper">
|
|
|
|
<el-table :data="selectedData" ref="selectedTable" class="table" stripe header-align="center" row-key="id" @selection-change="handleSelecteChange">
|
|
|
|
<el-table-column type="selection" width="55" align="center" :reserve-selection="true"></el-table-column>
|
|
|
|
<el-table-column type="index" width="60" label="序号" align="center"></el-table-column>
|
|
|
|
<el-table-column prop="questionSource" label="题库来源" width="120" align="center"></el-table-column>
|
|
|
|
<el-table-column prop="questionStem" label="题干" align="center" :show-overflow-tooltip="true"></el-table-column>
|
|
|
|
<el-table-column prop="name" label="试题类型" width="100" align="center"></el-table-column>
|
|
|
|
<el-table-column prop="courses" label="对应课程" width="120" align="center"></el-table-column>
|
|
|
|
<el-table-column prop="knowledgePoints" label="知识点" width="120" align="center"></el-table-column>
|
|
|
|
<el-table-column prop="useNum" label="使用次数" width="100" align="center"></el-table-column>
|
|
|
|
<el-table-column prop="createTime" label="上传时间" width="150" align="center"></el-table-column>
|
|
|
|
<el-table-column prop="createUser" label="创建人" width="80" align="center"></el-table-column>
|
|
|
|
</el-table>
|
|
|
|
|
|
|
|
<div class="point">
|
|
|
|
<p class="key">设置分值:</p>
|
|
|
|
<div class="inputs">
|
|
|
|
<div class="line">
|
|
|
|
<div class="item">
|
|
|
|
<p class="label">单选题</p>
|
|
|
|
<input type="text" disabled v-model.number="singleCount"> 道
|
|
|
|
<input type="text" :disabled="singleDisabled" v-model.number="singleChoiceScore" v-disabled="'单项选择'"> 分/题
|
|
|
|
</div>
|
|
|
|
<div class="item">
|
|
|
|
<p class="label">多选题</p>
|
|
|
|
<input type="text" disabled v-model.number="multipleCount" v-disabled="'多项选择'"> 道
|
|
|
|
<input type="text" :disabled="multipleDisabled" v-model.number="multipleChoiceScore" v-disabled="'多项选择'"> 分/题
|
|
|
|
</div>
|
|
|
|
<div class="item">
|
|
|
|
<p class="label">填空题</p>
|
|
|
|
<input type="text" disabled v-model.number="fillBlankCount" v-disabled="'填空题'"> 道
|
|
|
|
<input type="text" :disabled="fillBlankDisabled" v-model.number="fillBlanksScore" v-disabled="'填空题'"> 分/题
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="line">
|
|
|
|
<div class="item">
|
|
|
|
<p class="label">判断题</p>
|
|
|
|
<input type="text" disabled v-model.number="judgeCount" v-disabled="'判断题'"> 道
|
|
|
|
<input type="text" :disabled="judgeDisabled" v-model.number="judgeScore" v-disabled="'判断题'"> 分/题
|
|
|
|
</div>
|
|
|
|
<div class="item">
|
|
|
|
<p class="label">简答题</p>
|
|
|
|
<input type="text" disabled v-model.number="briefCount" v-disabled="'简答题'"> 道
|
|
|
|
<input type="text" :disabled="briefDisabled" v-model.number="briefAnswerScore" v-disabled="'简答题'"> 分/题
|
|
|
|
</div>
|
|
|
|
<div class="item">
|
|
|
|
<p class="label">总分:</p>
|
|
|
|
<input type="text" disabled v-model.number="totalScore"> 分
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="btns">
|
|
|
|
<button type="button" v-throttle @click="save(0)" v-if="!state">保存</button>
|
|
|
|
<button type="button" v-throttle class="submit" @click="save(1)">完成并发布</button>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<el-dialog title="选择试题" :visible.sync="manualVisible" width="60%" @close="closeManual" :close-on-click-modal="false">
|
|
|
|
<div class="mini-form">
|
|
|
|
<el-form label-width="80px" inline size="mini">
|
|
|
|
<el-form-item class="no-mb" label="课程名称">
|
|
|
|
<el-select v-model="selectManual.courses" clearable placeholder="请选择课程名称" @change="getManualData">
|
|
|
|
<el-option label="不限" value=""></el-option>
|
|
|
|
<el-option v-for="(item,index) in courseList" :key="index" :label="item.courses" :value="item.courses"></el-option>
|
|
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item class="no-mb" label="知识点">
|
|
|
|
<el-select v-model="selectManual.knowledgePoints" clearable placeholder="请选择知识点" @change="getManualData">
|
|
|
|
<el-option label="不限" value=""></el-option>
|
|
|
|
<el-option v-for="(item,index) in pointList" :key="index" :label="item.knowledgePoint" :value="item.knowledgePoint"></el-option>
|
|
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form>
|
|
|
|
<div class="flex j-between" style="align-items: flex-start">
|
|
|
|
<el-form label-width="80px" inline size="mini">
|
|
|
|
<el-form-item class="no-mb" label="试题类型">
|
|
|
|
<el-select v-model="selectManual.name" clearable placeholder="请选择试题类型" @change="getManualData">
|
|
|
|
<el-option label="不限" value=""></el-option>
|
|
|
|
<el-option v-for="(item,index) in nameList" :key="index" :label="item.name" :value="item.name"></el-option>
|
|
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
<el-form-item class="no-mb" label="所属题库">
|
|
|
|
<el-select v-model="selectManual.typeName" clearable placeholder="请选择所属题库" @change="getManualData">
|
|
|
|
<el-option label="不限" value=""></el-option>
|
|
|
|
<el-option v-for="(item,index) in quesBankList" :key="index" :label="item.typeName" :value="item.typeName"></el-option>
|
|
|
|
</el-select>
|
|
|
|
</el-form-item>
|
|
|
|
</el-form>
|
|
|
|
<div>
|
|
|
|
<el-input
|
|
|
|
size="mini"
|
|
|
|
placeholder="请输入题干名称"
|
|
|
|
prefix-icon="el-icon-search"
|
|
|
|
v-model="keyword"
|
|
|
|
clearable
|
|
|
|
></el-input>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<el-table
|
|
|
|
:data="listData"
|
|
|
|
max-height="400"
|
|
|
|
ref="listTable"
|
|
|
|
row-key="id"
|
|
|
|
class="table"
|
|
|
|
stripe
|
|
|
|
header-align="center"
|
|
|
|
@selection-change="handleSelectionChange"
|
|
|
|
>
|
|
|
|
<el-table-column type="selection" width="55" align="center" :reserve-selection="true" :selectable="disabledSelection"></el-table-column>
|
|
|
|
<el-table-column type="index" width="60" label="序号" align="center">
|
|
|
|
<template
|
|
|
|
slot-scope="scope"
|
|
|
|
>{{scope.$index + (page - 1) * pageSize + 1}}</template>
|
|
|
|
</el-table-column>
|
|
|
|
<el-table-column prop="questionSource" label="题库来源" align="center"></el-table-column>
|
|
|
|
<el-table-column prop="questionStem" label="题干" align="center" :show-overflow-tooltip="true"></el-table-column>
|
|
|
|
<el-table-column prop="name" label="试题类型" align="center"></el-table-column>
|
|
|
|
<el-table-column prop="courses" label="对应课程" align="center"></el-table-column>
|
|
|
|
<el-table-column prop="knowledgePoints" label="知识点" align="center"></el-table-column>
|
|
|
|
<el-table-column prop="useNum" label="使用次数" width="100" align="center"></el-table-column>
|
|
|
|
<el-table-column prop="createTime" label="上传时间" width="150" align="center"></el-table-column>
|
|
|
|
<el-table-column prop="createUser" label="创建人" align="center"></el-table-column>
|
|
|
|
</el-table>
|
|
|
|
<div class="pagination">
|
|
|
|
<el-pagination
|
|
|
|
background
|
|
|
|
@current-change="handleCurrentChange"
|
|
|
|
:current-page="page"
|
|
|
|
:page-size="pageSize"
|
|
|
|
layout="total,prev, pager, next"
|
|
|
|
:total="total"
|
|
|
|
></el-pagination>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<span slot="footer" class="dialog-footer">
|
|
|
|
<el-button v-throttle @click="manualVisible = false">取消</el-button>
|
|
|
|
<el-button v-throttle type="primary" @click="submitManual">确定</el-button>
|
|
|
|
</span>
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
<el-dialog title="选择试题" :visible.sync="inteVisible" width="60%" @close="closeInte" :close-on-click-modal="false">
|
|
|
|
<div class="select-wrap">
|
|
|
|
<div class="block" style="margin-bottom: 30px;">
|
|
|
|
<!-- <p class="key">试题课程:</p> -->
|
|
|
|
<div class="m-r-10" style="width: 100px">
|
|
|
|
<el-select v-model="inteType" placeholder="请选择" size="mini">
|
|
|
|
<el-option label="试题课程" value="1"></el-option>
|
|
|
|
<el-option label="知识点" value="2"></el-option>
|
|
|
|
</el-select>
|
|
|
|
</div>
|
|
|
|
<el-transfer v-if="inteType == 1" v-model="course" :data="inteListData" :props="courseProps" filterable filter-placeholder="请输入课程名称" :titles="['未选', '已选']" @change="courseChange"></el-transfer>
|
|
|
|
<el-transfer v-else v-model="kn" :data="knListData" :props="knProps" filterable filter-placeholder="请输入知识点名称" :titles="['未选', '已选']" @change="knChange"></el-transfer>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="block">
|
|
|
|
<p class="key">题型配置:</p>
|
|
|
|
<div class="types">
|
|
|
|
<div class="item">
|
|
|
|
<el-checkbox v-model="countCheck.countCheck1">单选题</el-checkbox>
|
|
|
|
<input type="text" v-model.number="countNumberInput1" :disabled="!countCheck.countCheck1"> 题 (可选{{countNumber1}}题)
|
|
|
|
</div>
|
|
|
|
<div class="item">
|
|
|
|
<el-checkbox v-model="countCheck.countCheck2">多选题</el-checkbox>
|
|
|
|
<input type="text" v-model.number="countNumberInput2" :disabled="!countCheck.countCheck2"> 题 (可选{{countNumber2}}题)
|
|
|
|
</div>
|
|
|
|
<div class="item">
|
|
|
|
<el-checkbox v-model="countCheck.countCheck3">判断题</el-checkbox>
|
|
|
|
<input type="text" v-model.number="countNumberInput3" :disabled="!countCheck.countCheck3"> 题 (可选{{countNumber3}}题)
|
|
|
|
</div>
|
|
|
|
<div class="item">
|
|
|
|
<el-checkbox v-model="countCheck.countCheck4">填空题</el-checkbox>
|
|
|
|
<input type="text" v-model.number="countNumberInput4" :disabled="!countCheck.countCheck4"> 题 (可选{{countNumber4}}题)
|
|
|
|
</div>
|
|
|
|
<div class="item">
|
|
|
|
<el-checkbox v-model="countCheck.countCheck5">简答题</el-checkbox>
|
|
|
|
<input type="text" v-model.number="countNumberInput5" :disabled="!countCheck.countCheck5"> 题 (可选{{countNumber5}}题)
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<span slot="footer" class="dialog-footer">
|
|
|
|
<el-button v-throttle @click="inteVisible = false">取消</el-button>
|
|
|
|
<el-button type="primary" v-throttle @click="submitInte">确定</el-button>
|
|
|
|
</span>
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
<el-dialog title="试卷预览" :visible.sync="previewVisible" fullscreen>
|
|
|
|
<test-paper :data="previewList" :key="previewIndex"></test-paper>
|
|
|
|
</el-dialog>
|
|
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
|
|
import mixins from '@/mixins/setBackground'
|
|
|
|
import { mapState } from 'vuex'
|
|
|
|
import testPaper from '@/components/testPaperDetail'
|
|
|
|
import util from '@/libs/util'
|
|
|
|
export default {
|
|
|
|
mixins: [ mixins ],
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
id: this.$route.query.id,
|
|
|
|
isDetail: Boolean(this.$route.query.show),
|
|
|
|
name: '',
|
|
|
|
courses: '',
|
|
|
|
type: 0,
|
|
|
|
effect: '',
|
|
|
|
degree: '',
|
|
|
|
duration: '',
|
|
|
|
qid: '',
|
|
|
|
state: '',
|
|
|
|
singleCount: '',
|
|
|
|
multipleCount: '',
|
|
|
|
fillBlankCount: '',
|
|
|
|
judgeCount: '',
|
|
|
|
briefCount: '',
|
|
|
|
singleChoiceScore: '',
|
|
|
|
multipleChoiceScore: '',
|
|
|
|
judgeScore: '',
|
|
|
|
fillBlanksScore: '',
|
|
|
|
briefAnswerScore: '',
|
|
|
|
|
|
|
|
multipleSelected: [],
|
|
|
|
typeNameList: ['单选题','多选题','判断题','填空题','简答题'],
|
|
|
|
previewVisible: false,
|
|
|
|
previewIndex: 0,
|
|
|
|
previewList: [],
|
|
|
|
|
|
|
|
// 手动组卷
|
|
|
|
isFirstSubmitMana: true,
|
|
|
|
manualVisible: false,
|
|
|
|
multipleSelection: [],
|
|
|
|
listData: [],
|
|
|
|
page: 1,
|
|
|
|
pageSize: 10,
|
|
|
|
total: 0,
|
|
|
|
keyword: '',
|
|
|
|
searchTimer: null,
|
|
|
|
selectManual: {
|
|
|
|
courses: '',
|
|
|
|
name: '',
|
|
|
|
questionStem: '',
|
|
|
|
typeName: '',
|
|
|
|
knowledgePoints: '',
|
|
|
|
},
|
|
|
|
courseList: [],
|
|
|
|
pointList: [],
|
|
|
|
nameList: [],
|
|
|
|
quesBankList: [],
|
|
|
|
// 智能组卷
|
|
|
|
inteVisible: false,
|
|
|
|
inteListData: [],
|
|
|
|
knListData: [],
|
|
|
|
inteType: '1',
|
|
|
|
course: [],
|
|
|
|
kn: [],
|
|
|
|
courseProps: {
|
|
|
|
key: 'courses',
|
|
|
|
label: 'courses'
|
|
|
|
},
|
|
|
|
knProps: {
|
|
|
|
key: 'knowledgePoint',
|
|
|
|
label: 'knowledgePoint'
|
|
|
|
},
|
|
|
|
countNumber1: 0,
|
|
|
|
countNumber2: 0,
|
|
|
|
countNumber3: 0,
|
|
|
|
countNumber4: 0,
|
|
|
|
countNumber5: 0,
|
|
|
|
countNumberInput1: '',
|
|
|
|
countNumberInput2: '',
|
|
|
|
countNumberInput3: '',
|
|
|
|
countNumberInput4: '',
|
|
|
|
countNumberInput5: '',
|
|
|
|
countCheck: {
|
|
|
|
countCheck1: false,
|
|
|
|
countCheck2: false,
|
|
|
|
countCheck3: false,
|
|
|
|
countCheck4: false,
|
|
|
|
countCheck5: false,
|
|
|
|
},
|
|
|
|
pointRules: [30,20,10,10,2],
|
|
|
|
selectedData: []
|
|
|
|
};
|
|
|
|
},
|
|
|
|
components: {testPaper},
|
|
|
|
directives: {
|
|
|
|
disabled: function(el,binding,vnode){
|
|
|
|
let that = vnode.context
|
|
|
|
if(!that.selectedData.find(n => n.name == binding.value)) el.disabled = true
|
|
|
|
}
|
|
|
|
},
|
|
|
|
computed: {
|
|
|
|
...mapState('user', [
|
|
|
|
'userId','clientId'
|
|
|
|
]),
|
|
|
|
...mapState('testpaper', [
|
|
|
|
'degreeList','effectList','typeList'
|
|
|
|
]),
|
|
|
|
singleDisabled(){
|
|
|
|
if(this.selectedData.find(n => n.name == '单项选择')) return false
|
|
|
|
return true
|
|
|
|
},
|
|
|
|
multipleDisabled(){
|
|
|
|
if(this.selectedData.find(n => n.name == '多项选择')) return false
|
|
|
|
return true
|
|
|
|
},
|
|
|
|
fillBlankDisabled(){
|
|
|
|
if(this.selectedData.find(n => n.name == '填空题')) return false
|
|
|
|
return true
|
|
|
|
},
|
|
|
|
judgeDisabled(){
|
|
|
|
if(this.selectedData.find(n => n.name == '判断题')) return false
|
|
|
|
return true
|
|
|
|
},
|
|
|
|
briefDisabled(){
|
|
|
|
if(this.selectedData.find(n => n.name == '简答题')) return false
|
|
|
|
return true
|
|
|
|
},
|
|
|
|
totalScore(){
|
|
|
|
let totalScore = this.singleCount * this.singleChoiceScore + this.multipleCount * this.multipleChoiceScore + this.fillBlankCount * this.fillBlanksScore + this.judgeCount * this.judgeScore + this.briefCount * this.briefAnswerScore
|
|
|
|
return totalScore ? totalScore : ''
|
|
|
|
}
|
|
|
|
},
|
|
|
|
watch: {
|
|
|
|
keyword: function(val) {
|
|
|
|
clearTimeout(this.searchTimer)
|
|
|
|
this.searchTimer = setTimeout(() => {
|
|
|
|
this.getManualData()
|
|
|
|
},500)
|
|
|
|
}
|
|
|
|
},
|
|
|
|
mounted() {
|
|
|
|
this.id && this.getInfo()
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
getInfo() {
|
|
|
|
this.$post(`${this.api.detailtestPaper}?id=${this.id}`)
|
|
|
|
.then(res => {
|
|
|
|
let list = res.data.list
|
|
|
|
this.name = list.name
|
|
|
|
this.effect = list.effect
|
|
|
|
this.courses = list.courses
|
|
|
|
this.degree = list.degree
|
|
|
|
this.duration = list.duration
|
|
|
|
this.type = list.type
|
|
|
|
this.qid = list.qid
|
|
|
|
this.state = list.state
|
|
|
|
this.singleChoiceScore = list.singleChoiceScore
|
|
|
|
this.multipleChoiceScore = list.multipleChoiceScore
|
|
|
|
this.fillBlanksScore = list.fillBlanksScore
|
|
|
|
this.judgeScore = list.judgeScore
|
|
|
|
this.briefAnswerScore = list.briefAnswerScore
|
|
|
|
this.getQuesList()
|
|
|
|
})
|
|
|
|
.catch(err => {})
|
|
|
|
},
|
|
|
|
getQuesList(){
|
|
|
|
if(this.qid){
|
|
|
|
let data = {
|
|
|
|
ids: this.qid.split(','),
|
|
|
|
schoolId: this.clientId,
|
|
|
|
userId: this.userId
|
|
|
|
}
|
|
|
|
this.$post(this.api.getModifyByList, data).then(res => {
|
|
|
|
this.selectedData = util.removeHtmlTag(res.data.list,'questionStem')
|
|
|
|
this.computeTypeCount()
|
|
|
|
})
|
|
|
|
.catch(err => {})
|
|
|
|
}
|
|
|
|
},
|
|
|
|
defaultZero(val){
|
|
|
|
return val === '' ? 0 : val
|
|
|
|
},
|
|
|
|
save(status) {
|
|
|
|
if(!this.name) return this.$message.warning('请填写试卷名称')
|
|
|
|
let qid = this.selectedData.map(n => n.id).join()
|
|
|
|
if(status == 1){
|
|
|
|
if(this.effect === '') return this.$message.warning('请选择试卷用途')
|
|
|
|
if(this.courses === '') return this.$message.warning('请填写所属课程')
|
|
|
|
if(this.degree === '') return this.$message.warning('请选择难易程度')
|
|
|
|
if(this.duration === '') return this.$message.warning('请填写建议时长')
|
|
|
|
if(qid === '') return this.$message.warning('请选择试题')
|
|
|
|
if(this.totalScore < 100) return this.$message.warning('总分值未满100分,请重新设置')
|
|
|
|
if(this.totalScore > 100) return this.$message.warning('总分值超过100分,请重新设置')
|
|
|
|
}
|
|
|
|
|
|
|
|
let data = {
|
|
|
|
id: this.id,
|
|
|
|
schoolId: this.clientId,
|
|
|
|
userId: this.userId,
|
|
|
|
name: this.name,
|
|
|
|
effect: this.effect,
|
|
|
|
courses: this.courses,
|
|
|
|
degree: this.degree,
|
|
|
|
duration: this.duration,
|
|
|
|
qid: qid,
|
|
|
|
state: status,
|
|
|
|
type: this.type,
|
|
|
|
singleChoiceNum : this.defaultZero(this.singleCount),
|
|
|
|
multipleChoiceNum : this.defaultZero(this.multipleCount),
|
|
|
|
judgeNum : this.defaultZero(this.judgeCount),
|
|
|
|
fillBlanksNum : this.defaultZero(this.fillBlankCount),
|
|
|
|
briefAnswerNum : this.defaultZero(this.briefCount),
|
|
|
|
singleChoiceScore : this.defaultZero(this.singleChoiceScore),
|
|
|
|
multipleChoiceScore : this.defaultZero(this.multipleChoiceScore),
|
|
|
|
fillBlanksScore : this.defaultZero(this.fillBlanksScore),
|
|
|
|
judgeScore : this.defaultZero(this.judgeScore),
|
|
|
|
briefAnswerScore : this.defaultZero(this.briefAnswerScore)
|
|
|
|
}
|
|
|
|
if(this.id){
|
|
|
|
this.$post(this.api.saveOrUpdatetestPaper, data).then(res => {
|
|
|
|
this.$message.success('修改成功')
|
|
|
|
this.$router.back()
|
|
|
|
})
|
|
|
|
.catch(err => {})
|
|
|
|
}else{
|
|
|
|
this.$post(this.api.saveOrUpdatetestPaper, data).then(res => {
|
|
|
|
this.$message.success('创建成功')
|
|
|
|
this.$router.back()
|
|
|
|
})
|
|
|
|
.catch(err => {})
|
|
|
|
}
|
|
|
|
},
|
|
|
|
selectQues(){
|
|
|
|
if(this.type == 0){
|
|
|
|
this.getSelectFilter()
|
|
|
|
this.getType()
|
|
|
|
this.getQuesBank()
|
|
|
|
this.getManualData()
|
|
|
|
this.manualVisible = true
|
|
|
|
}else{
|
|
|
|
this.getInteData()
|
|
|
|
this.getKnData()
|
|
|
|
this.inteVisible = true
|
|
|
|
}
|
|
|
|
},
|
|
|
|
getManualData() {
|
|
|
|
let data = {
|
|
|
|
courses: this.selectManual.courses,
|
|
|
|
knowledgePoints: this.selectManual.knowledgePoints,
|
|
|
|
name: this.selectManual.name,
|
|
|
|
pageNum: this.page,
|
|
|
|
pageSize: this.pageSize,
|
|
|
|
questionStem: this.keyword,
|
|
|
|
typeName: this.selectManual.typeName,
|
|
|
|
userId: this.userId,
|
|
|
|
}
|
|
|
|
this.$post(this.api.pageByChoiceList,data).then(res => {
|
|
|
|
this.listData = util.removeHtmlTag(res.data.list.list,'questionStem')
|
|
|
|
this.total = res.data.list.totalCount
|
|
|
|
this.$refs.listTable.clearSelection()
|
|
|
|
}).catch(err => {})
|
|
|
|
},
|
|
|
|
disabledSelection(row,index){
|
|
|
|
let selectedData = this.selectedData
|
|
|
|
if(selectedData.find(n => n.id == row.id)) return false
|
|
|
|
return true
|
|
|
|
},
|
|
|
|
handleSelecteChange(val){
|
|
|
|
this.multipleSelected = val
|
|
|
|
},
|
|
|
|
removeQues(){
|
|
|
|
if(this.multipleSelected.length){
|
|
|
|
this.$confirm('确定要移除吗?', '提示', {
|
|
|
|
type: 'warning'
|
|
|
|
})
|
|
|
|
.then(() => {
|
|
|
|
let newData = []
|
|
|
|
this.selectedData.forEach((n,i) => {
|
|
|
|
this.multipleSelected.every(e => e.id != n.id) && newData.push(n)
|
|
|
|
})
|
|
|
|
this.selectedData = newData
|
|
|
|
this.computeTypeCount()
|
|
|
|
this.$refs.selectedTable.clearSelection()
|
|
|
|
this.$message.success('移除成功')
|
|
|
|
})
|
|
|
|
.catch(() => {})
|
|
|
|
}else{
|
|
|
|
this.$message.error('请先选择数据')
|
|
|
|
}
|
|
|
|
},
|
|
|
|
preview(){
|
|
|
|
this.$post(`${this.api.previewPaper}?qid=${this.selectedData.map(n => n.id).join(',')}`)
|
|
|
|
.then(res => {
|
|
|
|
this.previewIndex++
|
|
|
|
this.previewList = res.data
|
|
|
|
this.previewVisible = true
|
|
|
|
}).catch(err => {})
|
|
|
|
},
|
|
|
|
handleCurrentChange(val) {
|
|
|
|
this.page = val
|
|
|
|
this.getManualData()
|
|
|
|
},
|
|
|
|
handleSelectionChange(val) {
|
|
|
|
this.multipleSelection = val
|
|
|
|
},
|
|
|
|
getSelectFilter(){
|
|
|
|
this.$post(`${this.api.getSelectInfo}?type=1`)
|
|
|
|
.then(res => {
|
|
|
|
this.pointList = res.data.pointList
|
|
|
|
}).catch(err => {})
|
|
|
|
|
|
|
|
this.$post(`${this.api.getSelectInfo}?type=2`)
|
|
|
|
.then(res => {
|
|
|
|
this.courseList = res.data.pointList
|
|
|
|
})
|
|
|
|
.catch(err => {})
|
|
|
|
},
|
|
|
|
getType() {
|
|
|
|
this.$get(this.api.typesList)
|
|
|
|
.then(res => {
|
|
|
|
this.nameList = res.data.list
|
|
|
|
})
|
|
|
|
.catch(err => {})
|
|
|
|
},
|
|
|
|
getQuesBank() {
|
|
|
|
let data = {
|
|
|
|
pageNum: 1,
|
|
|
|
pageSize: 10000
|
|
|
|
}
|
|
|
|
this.$post(this.api.listByPage,data)
|
|
|
|
.then(res => {
|
|
|
|
let list = res.data.list.list
|
|
|
|
let result = list
|
|
|
|
list.map((n,i) => {
|
|
|
|
result = result.concat(n.secondColumn)
|
|
|
|
})
|
|
|
|
this.quesBankList = result
|
|
|
|
})
|
|
|
|
.catch(err => {})
|
|
|
|
},
|
|
|
|
computeTypeCount(){
|
|
|
|
let selected = this.selectedData
|
|
|
|
let singleCount = selected.filter(n => n.name == '单项选择').length
|
|
|
|
let multipleCount = selected.filter(n => n.name == '多项选择').length
|
|
|
|
let fillBlankCount = selected.filter(n => n.name == '填空题').length
|
|
|
|
let judgeCount = selected.filter(n => n.name == '判断题').length
|
|
|
|
let briefCount = selected.filter(n => n.name == '简答题').length
|
|
|
|
|
|
|
|
if(this.id && this.isFirstSubmitMana){
|
|
|
|
this.singleCount = Number(this.singleCount) + singleCount
|
|
|
|
this.multipleCount = Number(this.multipleCount) + multipleCount
|
|
|
|
this.fillBlankCount = Number(this.fillBlankCount) + fillBlankCount
|
|
|
|
this.judgeCount = Number(this.judgeCount) + judgeCount
|
|
|
|
this.briefCount = Number(this.briefCount) + briefCount
|
|
|
|
this.isFirstSubmitMana = false
|
|
|
|
}else{
|
|
|
|
this.singleCount = singleCount
|
|
|
|
this.multipleCount = multipleCount
|
|
|
|
this.fillBlankCount = fillBlankCount
|
|
|
|
this.judgeCount = judgeCount
|
|
|
|
this.briefCount = briefCount
|
|
|
|
|
|
|
|
if(!singleCount) this.singleChoiceScore = 0
|
|
|
|
if(!multipleCount) this.multipleChoiceScore = 0
|
|
|
|
if(!fillBlankCount) this.fillBlanksScore = 0
|
|
|
|
if(!judgeCount) this.judgeScore = 0
|
|
|
|
if(!briefCount) this.briefAnswerScore = 0
|
|
|
|
}
|
|
|
|
},
|
|
|
|
submitManual(){
|
|
|
|
if(this.multipleSelection.length){
|
|
|
|
this.selectedData = [...this.selectedData,...this.multipleSelection]
|
|
|
|
this.computeTypeCount()
|
|
|
|
this.manualVisible = false
|
|
|
|
}else{
|
|
|
|
this.$message.error('请选择试题')
|
|
|
|
}
|
|
|
|
},
|
|
|
|
closeManual(){
|
|
|
|
this.selectManual = {
|
|
|
|
courses: '',
|
|
|
|
name: '',
|
|
|
|
questionStem: '',
|
|
|
|
typeName: '',
|
|
|
|
knowledgePoints: '',
|
|
|
|
}
|
|
|
|
this.$refs.selectedTable.clearSelection()
|
|
|
|
this.keyword = ''
|
|
|
|
this.page = 1
|
|
|
|
},
|
|
|
|
getInteData() {
|
|
|
|
let data = {
|
|
|
|
schoolId: this.clientId,
|
|
|
|
userId: this.userId,
|
|
|
|
}
|
|
|
|
this.$post(this.api.fuzzyQuery,data)
|
|
|
|
.then(res => {
|
|
|
|
this.inteListData = res.data.fuzzyList
|
|
|
|
}).catch(err => {})
|
|
|
|
},
|
|
|
|
getKnData() {
|
|
|
|
let data = {
|
|
|
|
schoolId: this.clientId,
|
|
|
|
userId: this.userId,
|
|
|
|
}
|
|
|
|
this.$post(this.api.queryKnowledgePoints,data)
|
|
|
|
.then(res => {
|
|
|
|
this.knListData = res.data.fuzzyList
|
|
|
|
}).catch(err => {})
|
|
|
|
},
|
|
|
|
courseChange(val,dir,allData){
|
|
|
|
let data = {
|
|
|
|
coursesList: val,
|
|
|
|
schoolId: this.clientId,
|
|
|
|
userId: this.userId,
|
|
|
|
}
|
|
|
|
this.$post(this.api.statistical,data)
|
|
|
|
.then(res => {
|
|
|
|
let data = res.data.count
|
|
|
|
this.countNumber1 = data.countNumber1
|
|
|
|
this.countNumber2 = data.countNumber2
|
|
|
|
this.countNumber3 = data.countNumber3
|
|
|
|
this.countNumber4 = data.countNumber4
|
|
|
|
this.countNumber5 = data.countNumber5
|
|
|
|
}).catch(err => {})
|
|
|
|
},
|
|
|
|
knChange(val,dir,allData){
|
|
|
|
let data = {
|
|
|
|
knowledgePointsList: val,
|
|
|
|
schoolId: this.clientId,
|
|
|
|
userId: this.userId,
|
|
|
|
}
|
|
|
|
this.$post(this.api.statistical,data)
|
|
|
|
.then(res => {
|
|
|
|
let data = res.data.count
|
|
|
|
this.countNumber1 = data.countNumber1
|
|
|
|
this.countNumber2 = data.countNumber2
|
|
|
|
this.countNumber3 = data.countNumber3
|
|
|
|
this.countNumber4 = data.countNumber4
|
|
|
|
this.countNumber5 = data.countNumber5
|
|
|
|
}).catch(err => {})
|
|
|
|
},
|
|
|
|
typeValid(index){
|
|
|
|
return this.countCheck[`countCheck${index}`] && this[`countNumberInput${index}`] && this[`countNumber${index}`]
|
|
|
|
},
|
|
|
|
countValid(index){
|
|
|
|
if(this[`countNumberInput${index}`] > this[`countNumber${index}`]){
|
|
|
|
this.$message.error(`${this.typeNameList[index-1]}输入题数不能大于可选题数`)
|
|
|
|
return false
|
|
|
|
}
|
|
|
|
return true
|
|
|
|
},
|
|
|
|
submitInte(){
|
|
|
|
let invalid = false
|
|
|
|
let everyUnchecked = true
|
|
|
|
let everyIsZero = true
|
|
|
|
for(let i in this.countCheck){
|
|
|
|
if(this.countCheck[i]){
|
|
|
|
everyUnchecked = false
|
|
|
|
let index = i.replace('countCheck','')
|
|
|
|
if(this[`countNumberInput${index}`]){
|
|
|
|
everyIsZero = false
|
|
|
|
invalid = true
|
|
|
|
// if(this[`countNumberInput${index}`] < this.pointRules[index-1]){
|
|
|
|
// invalid = true
|
|
|
|
// }else if(this[`countNumberInput${index}`] > this.pointRules[index-1]){
|
|
|
|
// this.$message.error('题目数量不能大于可选题数')
|
|
|
|
// return false
|
|
|
|
// }
|
|
|
|
}
|
|
|
|
}else{
|
|
|
|
invalid = true
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if(everyUnchecked) return this.$message.error('请选择题型')
|
|
|
|
if(everyIsZero) return this.$message.error('请输入题目数量')
|
|
|
|
let totalCount = 0
|
|
|
|
if(invalid){
|
|
|
|
for(let i in this.countCheck){
|
|
|
|
let index = i.replace('countCheck','')
|
|
|
|
if(this.countCheck[i]) totalCount += this[`countNumberInput${index}`]
|
|
|
|
}
|
|
|
|
let remainder = 100 % totalCount
|
|
|
|
let avgPoint = 100 / totalCount
|
|
|
|
if(remainder) avgPoint = (100 - remainder) / totalCount
|
|
|
|
this.singleCount = ''
|
|
|
|
this.multipleCount = ''
|
|
|
|
this.fillBlankCount = ''
|
|
|
|
this.judgeCount = ''
|
|
|
|
this.briefCount = ''
|
|
|
|
this.singleChoiceScore = ''
|
|
|
|
this.multipleChoiceScore = ''
|
|
|
|
this.judgeScore = ''
|
|
|
|
this.fillBlanksScore = ''
|
|
|
|
this.briefAnswerScore = ''
|
|
|
|
|
|
|
|
if(this.typeValid(1)){
|
|
|
|
if(this.countValid(1)){
|
|
|
|
this.singleCount = this.countNumberInput1
|
|
|
|
this.singleChoiceScore = avgPoint
|
|
|
|
}else{
|
|
|
|
return false
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if(this.typeValid(2)){
|
|
|
|
if(this.countValid(2)){
|
|
|
|
this.multipleCount = this.countNumberInput2
|
|
|
|
this.multipleChoiceScore = avgPoint
|
|
|
|
}else{
|
|
|
|
return false
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if(this.typeValid(3)){
|
|
|
|
if(this.countValid(3)){
|
|
|
|
this.judgeCount = this.countNumberInput3
|
|
|
|
this.judgeScore = avgPoint
|
|
|
|
}else{
|
|
|
|
return false
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if(this.typeValid(4)){
|
|
|
|
if(this.countValid(4)){
|
|
|
|
this.fillBlankCount = this.countNumberInput4
|
|
|
|
this.fillBlanksScore = avgPoint
|
|
|
|
}else{
|
|
|
|
return false
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if(this.typeValid(5)){
|
|
|
|
if(this.countValid(5)){
|
|
|
|
this.briefCount = this.countNumberInput5
|
|
|
|
this.briefAnswerScore = avgPoint
|
|
|
|
}else{
|
|
|
|
return false
|
|
|
|
}
|
|
|
|
}
|
|
|
|
if(remainder){
|
|
|
|
let remainScore = 0
|
|
|
|
let remainPlusAvg = remainder + avgPoint
|
|
|
|
let invalid = false
|
|
|
|
if(this.typeValid(5)){
|
|
|
|
remainScore = this.briefCount * avgPoint + remainder
|
|
|
|
if(remainScore % this.briefCount){
|
|
|
|
invalid = true
|
|
|
|
}else{
|
|
|
|
this.briefAnswerScore = remainScore / this.briefCount
|
|
|
|
invalid = false
|
|
|
|
}
|
|
|
|
}else{
|
|
|
|
invalid = true
|
|
|
|
}
|
|
|
|
if(invalid){
|
|
|
|
if(this.typeValid(4)){
|
|
|
|
remainScore = this.fillBlankCount * avgPoint + remainder
|
|
|
|
if(remainScore % this.fillBlankCount){
|
|
|
|
invalid = true
|
|
|
|
}else{
|
|
|
|
this.fillBlanksScore = remainScore / this.fillBlankCount
|
|
|
|
invalid = false
|
|
|
|
}
|
|
|
|
}else{
|
|
|
|
invalid = true
|
|
|
|
}
|
|
|
|
if(invalid){
|
|
|
|
if(this.typeValid(3)){
|
|
|
|
remainScore = this.judgeCount * avgPoint + remainder
|
|
|
|
if(remainScore % this.judgeCount){
|
|
|
|
invalid = true
|
|
|
|
}else{
|
|
|
|
this.judgeScore = remainScore / this.judgeCount
|
|
|
|
invalid = false
|
|
|
|
}
|
|
|
|
}else{
|
|
|
|
invalid = true
|
|
|
|
}
|
|
|
|
if(invalid){
|
|
|
|
if(this.typeValid(2)){
|
|
|
|
remainScore = this.multipleCount * avgPoint + remainder
|
|
|
|
if(remainScore % this.multipleCount){
|
|
|
|
invalid = true
|
|
|
|
}else{
|
|
|
|
this.multipleChoiceScore = remainScore / this.multipleCount
|
|
|
|
invalid = false
|
|
|
|
}
|
|
|
|
}else{
|
|
|
|
invalid = true
|
|
|
|
}
|
|
|
|
if(invalid){
|
|
|
|
if(this.typeValid(1)){
|
|
|
|
remainScore = this.singleCount * avgPoint + remainder
|
|
|
|
if(remainScore % this.singleCount){
|
|
|
|
invalid = true
|
|
|
|
}else{
|
|
|
|
this.singleChoiceScore = remainScore / this.singleCount
|
|
|
|
invalid = false
|
|
|
|
}
|
|
|
|
}else{
|
|
|
|
invalid = true
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
let data = {
|
|
|
|
schoolId: this.clientId,
|
|
|
|
userId: this.userId,
|
|
|
|
}
|
|
|
|
if(this.inteType == 1){
|
|
|
|
data.coursesList = this.course
|
|
|
|
}else{
|
|
|
|
data.knowledgePointsList = this.kn
|
|
|
|
}
|
|
|
|
this.$post(this.api.getQuestionListBySelect,data)
|
|
|
|
.then(res => {
|
|
|
|
let list = res.data.count
|
|
|
|
let result = []
|
|
|
|
if(this.countCheck.countCheck1) result = result.concat(list.filter(n => n.name == '单项选择').slice(0,this.countNumberInput1))
|
|
|
|
if(this.countCheck.countCheck2) result = result.concat(list.filter(n => n.name == '多项选择').slice(0,this.countNumberInput2))
|
|
|
|
if(this.countCheck.countCheck3) result = result.concat(list.filter(n => n.name == '判断题').slice(0,this.countNumberInput3))
|
|
|
|
if(this.countCheck.countCheck4) result = result.concat(list.filter(n => n.name == '填空题').slice(0,this.countNumberInput4))
|
|
|
|
if(this.countCheck.countCheck5) result = result.concat(list.filter(n => n.name == '简答题').slice(0,this.countNumberInput5))
|
|
|
|
result = util.removeHtmlTag(result,'questionStem')
|
|
|
|
this.selectedData = result
|
|
|
|
this.inteVisible = false
|
|
|
|
}).catch(err => {})
|
|
|
|
},
|
|
|
|
closeInte(){
|
|
|
|
this.inteType = '1'
|
|
|
|
this.course = []
|
|
|
|
this.kn = []
|
|
|
|
this.countNumber1 = 0
|
|
|
|
this.countNumber2 = 0
|
|
|
|
this.countNumber3 = 0
|
|
|
|
this.countNumber4 = 0
|
|
|
|
this.countNumber5 = 0
|
|
|
|
this.countNumberInput1 = ''
|
|
|
|
this.countNumberInput2 = ''
|
|
|
|
this.countNumberInput3 = ''
|
|
|
|
this.countNumberInput4 = ''
|
|
|
|
this.countNumberInput5 = ''
|
|
|
|
this.countCheck = {
|
|
|
|
countCheck1: false,
|
|
|
|
countCheck2: false,
|
|
|
|
countCheck3: false,
|
|
|
|
countCheck4: false,
|
|
|
|
countCheck5: false,
|
|
|
|
}
|
|
|
|
},
|
|
|
|
},
|
|
|
|
};
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
.box{
|
|
|
|
width: 90%;
|
|
|
|
margin: 0 auto;
|
|
|
|
.form{
|
|
|
|
.line{
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
margin-bottom: 20px;
|
|
|
|
.item{
|
|
|
|
display: inline-flex;
|
|
|
|
align-items: center;
|
|
|
|
flex: 1;
|
|
|
|
/deep/.el-select{
|
|
|
|
flex: 1;
|
|
|
|
}
|
|
|
|
.key{
|
|
|
|
margin-right: 20px;
|
|
|
|
white-space: nowrap;
|
|
|
|
font-size: 14px;
|
|
|
|
color: #555;
|
|
|
|
}
|
|
|
|
&.lg .key{
|
|
|
|
width: 220px;
|
|
|
|
margin-right: 10px;
|
|
|
|
text-align: right;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.testpaper{
|
|
|
|
padding: 10px;
|
|
|
|
background-color: #f7f7f7;
|
|
|
|
.point{
|
|
|
|
display: flex;
|
|
|
|
margin-top: 20px;
|
|
|
|
.key{
|
|
|
|
margin: 8px 20px 0 10px;
|
|
|
|
font-size: 13px;
|
|
|
|
color: #444;
|
|
|
|
}
|
|
|
|
.line{
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
margin-bottom: 13px;
|
|
|
|
.item{
|
|
|
|
display: inline-flex;
|
|
|
|
align-items: center;
|
|
|
|
margin-right: 30px;
|
|
|
|
color: #444;
|
|
|
|
font-size: 12px;
|
|
|
|
input{
|
|
|
|
width: 80px;
|
|
|
|
height: 30px;
|
|
|
|
padding: 0 10px;
|
|
|
|
margin: 0 10px;
|
|
|
|
line-height: 30px;
|
|
|
|
border: 1px solid #e8e8e8;
|
|
|
|
background-color: #fff;
|
|
|
|
box-sizing: border-box;
|
|
|
|
&:focus{
|
|
|
|
outline: none;
|
|
|
|
}
|
|
|
|
&:disabled{
|
|
|
|
background-color: #e8e8e8;
|
|
|
|
cursor: not-allowed;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.mini-form{
|
|
|
|
/deep/.el-form-item__content{
|
|
|
|
width: 150px;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.select-wrap{
|
|
|
|
width: 90%;
|
|
|
|
margin: 0 auto;
|
|
|
|
.block{
|
|
|
|
display: flex;
|
|
|
|
.key{
|
|
|
|
margin-right: 20px;
|
|
|
|
font-size: 14px;
|
|
|
|
color: #555;
|
|
|
|
}
|
|
|
|
.types{
|
|
|
|
.item{
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
margin-bottom: 10px;
|
|
|
|
color: #444;
|
|
|
|
font-size: 12px;
|
|
|
|
/deep/.el-checkbox__label{
|
|
|
|
color: #444;
|
|
|
|
font-size: 12px;
|
|
|
|
}
|
|
|
|
input{
|
|
|
|
width: 80px;
|
|
|
|
height: 24px;
|
|
|
|
padding: 0 10px;
|
|
|
|
margin: 0 10px;
|
|
|
|
line-height: 24px;
|
|
|
|
color: #333;
|
|
|
|
font-size: 12px;
|
|
|
|
background-color: #fff;
|
|
|
|
border: 1px solid #eaeaea;
|
|
|
|
&:focus{
|
|
|
|
outline: none;
|
|
|
|
}
|
|
|
|
&:disabled{
|
|
|
|
background-color: #e8e8e8;
|
|
|
|
cursor: not-allowed;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</style>
|