Skip to content

C
center-qa
提交 73933b02 authored 作者: matian's avatar matian
浏览文件
操作

代码提交

上级 8e0e35ab
隐藏空白字符变更
内嵌 并排
正在显示 包含 1012 行增加 和 228 行删除
src/components/layout/Aside.vue
浏览文件 @ 73933b02
......@@ -38,6 +38,12 @@ export default {
path: '/paper',
icon: 'el-icon-document',
children: [{ name: '我的试卷库', path: '/paper/list' }]
},
{
name: '考试中心',
path: '/exam',
icon: 'el-icon-document',
children: [{ name: '我的考试', path: '/exam/list' }]
}
]
}
......
src/modules/exam/components/BaseInfo.vue 0 → 100644
浏览文件 @ 73933b02
<template>
<el-form :model="form" label-width="80px" :label-position="labelPosition">
<el-form-item label="开考前:" prop="exam_name">
<el-input v-model="form.exam_name"></el-input>
</el-form-item>
<el-form-item label="考试时间:" prop="value1">
<el-time-picker
is-range
v-model="form.value1"
range-separator="至"
start-placeholder="开始时间"
end-placeholder="结束时间"
placeholder="选择时间范围"
>
</el-time-picker>
</el-form-item>
<el-form-item label="提前登录:" prop="first_time">
开考前
<el-input v-model="form.first_time" style="width: 100px"></el-input
>分钟，考生可以登录系统，确认信息。（开考最多60分钟提前登录）
</el-form-item>
<el-form-item label="限制迟到:" prop="last_time">
开考后
<el-input v-model="form.last_time" style="width: 100px"></el-input
>分钟，不允许考生入场，考中退出的考生不受此影响。
</el-form-item>
<el-form-item label="欢迎语:" prop="welcome">
<v-editor></v-editor>
</el-form-item>
</el-form>
</template>
<script>
import VEditor from '@/components/tinymce/Index.vue'
export default {
components: { VEditor },
data() {
return {
labelPosition: 'left',
form: {
exam_name: '',
value1: [new Date(2016, 9, 10, 8, 40), new Date(2016, 9, 10, 9, 40)],
last_time: '',
welcome: ''
}
}
}
}
</script>
<style></style>
src/modules/exam/components/CheckPaper.vue 0 → 100644
浏览文件 @ 73933b02
<template>
<el-card>
<el-transfer
filterable
:filter-method="filterMethod"
filter-placeholder="请输入城市拼音"
v-model="value"
:data="data"
>
</el-transfer>
<el-card style="margin-top: 20px">
<div>考生的试卷会从以上已选的试卷中随机抽取</div>
<div>考试开始两个小时前，可以对试卷进行替换</div>
</el-card>
</el-card>
</template>
<script>
export default {
data() {
const generateData = _ => {
const data = []
const cities = ['上海', '北京', '广州', '深圳', '南京', '西安', '成都']
const pinyin = ['shanghai', 'beijing', 'guangzhou', 'shenzhen', 'nanjing', 'xian', 'chengdu']
cities.forEach((city, index) => {
data.push({
label: city,
key: index,
pinyin: pinyin[index]
})
})
return data
}
return {
data: generateData(),
value: [],
filterMethod(query, item) {
return item.pinyin.indexOf(query) > -1
}
}
}
}
</script>
src/modules/exam/components/ExamSetting.vue 0 → 100644
浏览文件 @ 73933b02
<template>
<el-form :model="form" label-width="80px" :label-position="labelPosition">
<el-form-item label="开学前:" prop="exam_name">
<el-checkbox-group v-model="checkList">
<el-checkbox :label="3">限定登录位置</el-checkbox>
<el-checkbox :label="6">考试承诺书</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="考试时间:" prop="value1">
<el-time-picker
is-range
v-model="form.value1"
range-separator="至"
start-placeholder="开始时间"
end-placeholder="结束时间"
placeholder="选择时间范围"
>
</el-time-picker>
</el-form-item>
<el-form-item label="提前登录:" prop="first_time">
开考前
<el-input v-model="form.first_time" style="width: 100px"></el-input
>分钟，考生可以登录系统，确认信息。（开考最多60分钟提前登录）
</el-form-item>
<el-form-item label="限制迟到:" prop="last_time">
开考后
<el-input v-model="form.last_time" style="width: 100px"></el-input
>分钟，不允许考生入场，考中退出的考生不受此影响。
</el-form-item>
<el-form-item label="欢迎语:" prop="welcome">
<v-editor></v-editor>
</el-form-item>
</el-form>
</template>
<script>
import VEditor from '@/components/tinymce/Index.vue'
export default {
components: { VEditor },
data() {
return {
labelPosition: 'left',
form: {
exam_name: '',
value1: [new Date(2016, 9, 10, 8, 40), new Date(2016, 9, 10, 9, 40)],
last_time: '',
welcome: ''
}
}
}
}
</script>
<style></style>
src/modules/exam/components/PersonalInfo.vue 0 → 100644
浏览文件 @ 73933b02
<template>
<app-card>
<app-list v-bind="tableOptions" ref="list">
<template v-slot:isEdit="{ row }">
<el-switch v-model="row.isEdit" active-color="#13ce66" inactive-color="#ff4949"> </el-switch>
</template>
<template v-slot:isVisible="{ row }">
<el-switch v-model="row.isVisible" active-color="#13ce66" inactive-color="#ff4949"> </el-switch>
</template>
<template v-slot:isRequired="{ row }">
<el-switch v-model="row.isRequired" active-color="#13ce66" inactive-color="#ff4949"> </el-switch>
</template>
<template v-slot:weight="{ row }">
<el-input v-model="row.weight" active-color="#13ce66" inactive-color="#ff4949"> </el-input>
</template>
</app-list>
</app-card>
</template>
<script>
export default {
data() {
return {
visible: false,
multipleSelection: [] // 选择项
}
},
computed: {
tableOptions() {
return {
// remote: { httpRequest: getAppList },
columns: [
{ label: '已选信息', prop: 'isCheckedInfo' },
{ label: '允许编辑', prop: 'isEdit', slots: 'isEdit' },
{ label: '考生可见', prop: 'isVisible', slots: 'isVisible' },
{ label: '必填', prop: 'isRequired', slots: 'isRequired' },
{ label: '权重', prop: 'weight', slots: 'weight' }
],
data: [
{
isCheckedInfo: '姓名',
isEdit: true,
isVisible: true,
isRequired: true,
weight: '1'
}
]
}
}
}
}
</script>
src/modules/exam/index.js 0 → 100644
浏览文件 @ 73933b02
import AppLayout from '@/components/layout/Index.vue'
const routes = [
{
path: '/exam',
component: AppLayout,
meta: { title: '考试中心' },
children: [
{
path: '',
redirect: '/exam/list'
},
{
path: 'list',
component: () => import('./views/List.vue'),
meta: { title: '我的考试' }
},
{
path: 'newExam',
component: () => import('./views/NewExam.vue'),
meta: { title: '新建考试' }
}
]
}
]
export { routes }
src/modules/exam/views/List.vue 0 → 100644
浏览文件 @ 73933b02
<template>
<app-card>
<app-list v-bind="tableOptions" ref="list" @selection-change="handleSelectionChange">
<template #header-aside>
<el-button type="primary" icon="el-icon-plus" @click="handleCreatePaper">新建试卷</el-button>
</template>
<template v-slot:table-x="{ row }">
<el-button type="text" @click="handleDetail(row)">查看详情</el-button>
<el-button type="text" @click="handleDelete(row)">删除</el-button>
</template>
</app-list>
</app-card>
</template>
<script>
export default {
data() {
return {
visible: false,
multipleSelection: [] // 选择项
}
},
computed: {
tableOptions() {
return {
// remote: { httpRequest: getAppList },
filters: [
{
type: 'input',
prop: 'paperName',
placeholder: '请输入考试名称',
label: '考试名称：'
},
{
type: 'input',
prop: 'paperLabel',
placeholder: '请输入考试试卷',
label: '考试试卷'
},
{
type: 'select',
prop: 'paperType',
placeholder: '请选择考试班级',
options: this.natureList,
labelKey: 'name',
valueKey: 'id',
label: '试卷分类：'
}
],
columns: [
{ type: 'selection', minWidth: '50px', fixed: 'left' },
{ type: 'index', label: '序号', minWidth: '50px', fixed: 'left' },
{ label: '考试ID', prop: 'exam_id' },
{ label: '考试名称', prop: 'exam_name' },
{ label: '考试试卷', prop: 'exam_paper' },
{ label: '考试时间', prop: 'exam_time' },
{ label: '考试班级', prop: 'exam_class' },
{ label: '应考人数', prop: 'join_num' },
{ label: '完成人数', prop: 'finished_num' },
{ label: '在线人数', prop: 'online_num' },
{ label: '考试状态', prop: 'exam_status' },
{ label: '操作', slots: 'table-x', align: 'right', width: 150 }
],
data: [
{
exam_id: 'KS00122312312312',
exam_name: '金融产品数字化营销2022-2 师资培训（中级)',
exam_paper: '中级正式考卷四',
exam_time: '2022-02-09 19:00:00',
exam_class: '中级 1 班、中级 2 班',
join_num: '12',
finished_num: '10',
online_num: '12',
exam_status: '未开始'
}
]
}
}
},
methods: {
// 新建试卷
handleCreatePaper() {
this.$router.push({
path: 'newExam'
})
},
// 编辑试卷
handleDdit(row) {
console.log(row)
this.$router.push({
path: 'newPapers',
query: {
paperDetail: row,
isEdit: true
}
})
},
handleSelectionChange(val) {
this.multipleSelection = val
console.log(val)
},
// 批量删除
batchDelete() {
console.log('111')
},
// 查看详情
handleDetail(row) {
this.$router.push({
path: 'detail',
query: {
paperDetail: JSON.stringify(row)
}
})
},
// 单个删除
handleDelete(row) {
// this.$refs.list.refetch()
}
}
}
</script>
src/modules/exam/views/NewExam.vue 0 → 100644
浏览文件 @ 73933b02
<template>
<app-card>
<el-steps :active="stepsIndex">
<el-step title="基本信息"> </el-step>
<el-step title="选择试卷"></el-step>
<el-step title="个人信息"></el-step>
<el-step title="考试配置"></el-step>
<el-step title="考试配置"></el-step>
</el-steps>
<base-info v-if="stepsIndex === 0" />
<check-paper v-if="stepsIndex === 1" />
<personal-info v-if="stepsIndex === 2" />
<div style="float: right">
<el-button type="primary" v-if="stepsIndex != 0" @click="lastStep">上一步</el-button>
<el-button v-if="stepsIndex == 0" type="primary" @click="nextStep">下一步</el-button>
<el-button v-if="stepsIndex == 1" type="primary" @click="nextStep">下一步</el-button>
<el-button v-if="stepsIndex == 2" type="primary" @click="nextStep">下一步</el-button>
<el-button type="primary" v-if="stepsIndex == 4">完成</el-button>
</div>
</app-card>
</template>
<script>
import BaseInfo from '../components/BaseInfo.vue'
import CheckPaper from '../components/CheckPaper.vue'
import PersonalInfo from '../components/PersonalInfo.vue'
export default {
components: { BaseInfo, CheckPaper, PersonalInfo },
data() {
return {
stepsIndex: 0
// tabActive: 'baseInfo'
}
},
methods: {
nextStep() {
this.stepsIndex++
},
lastStep() {
this.stepsIndex--
}
}
}
</script>
<style></style>
src/modules/paper/components/QuestionList.vue
浏览文件 @ 73933b02
......@@ -11,19 +11,17 @@
>
<el-button class="clearfix_add" type="primary" @click="addPaper">添加试题</el-button>
</div>
<div v-for="(item, index) in questionList" :key="index">
<!-- 题目列表 -->
<QuestionListItems
:item="item"
ref="listItemRef"
@handlePosition="handlePosition"
@selectSubjectsChange="selectSubjectsChange"
:disabled="selectQuestion.length === 0"
/>
</div>
<!-- 题目列表 -->
<QuestionListItem
:questionList="questionList"
ref="listItemRef"
@handlePosition="handlePosition"
@selectSubjectsChange="selectSubjectsChange"
:disabled="selectQuestion.length === 0"
/>
<!-- 选题组卷无数据情况下显示 -->
<div class="nonePaper" v-show="questionList.length === 0">
<el-result icon="info" subTitle="该试卷无试题，去添加试题吧"></el-result>
<!-- <el-result icon="info" subTitle="该试卷无试题，去添加试题吧"></el-result> -->
</div>
</el-card>
</el-col>
......@@ -33,7 +31,8 @@
<div class="titleIndex">
<ul>
<li v-for="(item, index) in questionList" :key="index" @click="titleClick(index)">
<div :class="currentIndex === index + 1 ? `titleItem` : ''">{{ index + 1 }}</div>
<div :class="currentIndex === index + 1 ? `titleItem` : ''" class="item_index">{{ index + 1 }}</div>
<div class="item_type">{{ questionType(item) }}</div>
</li>
</ul>
<div style="margin-top: 10px; display: flex; justify-content: center; align-items: center">
......@@ -50,12 +49,12 @@
</template>
<script>
import QuestionListItems from './QuestionListItems.vue'
import QuestionListItem from './QuestionListItems.vue'
import AutomaticPaper from './AutomaticPaper.vue'
import addPaper from './AddPaper.vue'
export default {
components: {
QuestionListItems,
QuestionListItem,
addPaper,
AutomaticPaper
},
......@@ -68,83 +67,425 @@ export default {
data() {
return {
visible: false, // 控制增加试题弹框显示还是隐藏
currentIndex: 1,
selectQuestion: [],
questionList: [
{
question_title: '单选题',
question_content:
'<p>市场营销通过多方面手段便利交换、便利物流，从而保障交换工能够和物流功能的实现。这主要说的是市场营销的哪一项功能？</p>',
question_type: 1,
question_title: 'xxxxx',
question_content: '这是一道单选题',
child_question_type: 0,
question_answer: '答案就是你猜呀',
question_score: '3',
group_id: '0',
is_parent: 1,
child_question_type: 1,
question_options: [
{ options: 'fgweyfg', id: '0', checked: true },
{ options: '1223', id: '1', checked: false }
]
{
id: '1',
options: '示向功能',
checked: true
},
{
id: '2',
options: '示向----',
checked: false
}
],
question_answer: '示向功能',
group_id: '1001',
score: 2
},
{
question_title: '多选题',
question_content:
'<p>市场营销通过多方面手段便利交换、便利物流，从而保障交换工能够和物流功能的实现。这主要说的是市场营销的哪一项功能？</p>',
question_type: 2,
question_title: 'xxxxx',
question_content: '这是一道多选题',
is_parent: 1,
child_question_type: 0,
score: 2,
question_options: [
{
id: '1',
options: '示向功能',
checked: true
},
{
id: '2',
options: '示向----',
checked: true
},
{
id: '3',
options: '示向---12333-',
checked: false
}
],
question_answer: '示向功能、示向----',
group_id: '1002'
},
{
question_title: '判断题',
question_content:
'<p>市场营销通过多方面手段便利交换、便利物流，从而保障交换工能够和物流功能的实现。这主要说的是市场营销的哪一项功能？</p>',
question_type: 6,
is_parent: 1,
child_question_type: 0,
question_answer: '答案就是你猜呀',
question_score: '3',
group_id: '0',
score: 2,
question_options: [
{ options: 'fgweyfg', id: '0', checked: true },
{ options: '1223', id: '1', checked: true }
]
{
id: '1',
options: '正确',
checked: true
},
{
id: '2',
options: '错误',
checked: false
}
],
question_answer: '正确',
group_id: '1003'
},
{
question_title: '简答题',
question_content:
'<p>复购率在金融数字化营销中是反应用户对品牌忠诚度的一个重要指标，锡盟高钙奶是一家专门生产乳制品的企业，其中脱脂牛奶的销量一直不太理想，所以想看一下过往的购买客户的订单记录，计算以下这一部分客户的复购率为多少，根据数据显示，2021年一季度华北市场的脱脂牛奶交易笔数为12000笔，4000人实现二次购买，而这4000人当中2000人实现了三次购买。</p>',
question_type: 3,
question_title: 'xxxxx',
question_content: '这是一道问答题',
is_parent: 1,
child_question_type: 0,
question_answer: '答案就是你猜呀',
question_score: '3',
group_id: '0',
question_options: []
question_answer: '2021年一季度华北市场的脱脂牛奶交易笔数为12000笔',
group_id: '1004',
score: 2
},
{
question_title: '案例题',
question_content:
'<p>平邦保险公司想通过一些建设性的方案来解决目前4个策略中所存在的问题，以下为各个策略分别所对应的问题。</p><p>①　在产品策略方面，某保险公司主要售卖两款疾病险和一款年金险产品，由于整体保险市场的产品同质化严重，与同行业其他保险公司相比没有明显优势。</p><p>②　在定价策略方面，某保险公司的产品定价整体处于中等水平，比大型保险公司定价整体相比较低，比其他小型保险公司定价略高。过去人们在比较不同保险产品时，关注的主要是经济补偿，而现在不仅包括经济补偿，还包括各类附加功能。比如保险公司与医院联网合作，不仅可以在费用阶段直接垫付客户治疗费用，还可以增加包括专家门诊、预约病床、绿色通道在内的多种特色服务，成为了公司品牌特色的一部分。</p><p>③　在渠道策略方面，某保险公司目前营销渠道还是以个人代理制为主。目前，保险代理人队伍的整体文化素质不高，学历在高中及以下超过90%，另外由于公司对保险代理人实施以业务业绩为主的晋升机制，导致目前忽视了对整体代理人队伍文化及金融素养的培训。</p><p>④　在促销策略方面，某保险公司的广告投入较少，投放了电视广告，但是一般在非黄金时段播放；同时，其销售方式以人员推销为主。</p>',
question_type: 5,
is_parent: 1,
child_question_type: 0,
question_answer: null,
group_id: '1005',
score: 8
},
{
question_title: '单选题',
question_content: '<p>根据题目描述，若按交易方法计算，则重复购买次数为？</p>',
question_type: 5,
is_parent: 0,
child_question_type: 1,
question_options: [
{
id: '1',
options: '2000',
checked: true
},
{
id: '2',
options: '2000',
checked: false
}
],
question_answer: '2000',
group_id: '1005',
score: 2
},
{
question_title: '多选题',
question_content:
'<p>市场营销通过多方面手段便利交换、便利物流，从而保障交换工能够和物流功能的实现。这主要说的是市场营销的哪一项功能？</p>',
question_type: 5,
is_parent: 0,
child_question_type: 2,
question_options: [
{
id: '1',
options: '示向功能',
checked: true
},
{
id: '2',
options: '示向----',
checked: true
},
{
id: '3',
options: '示向---12333-',
checked: false
}
],
question_answer: '示向功能、示向----',
group_id: '1005',
score: 2
},
{
question_title: '判断题',
question_content:
'<p>市场营销通过多方面手段便利交换、便利物流，从而保障交换工能够和物流功能的实现。这主要说的是市场营销的哪一项功能？</p>',
question_type: 5,
is_parent: 0,
child_question_type: 6,
question_options: [
{
id: '1',
options: '正确',
checked: true
},
{
id: '2',
options: '错误',
checked: false
}
],
question_answer: '正确',
group_id: '1005',
score: 2
},
{
question_title: '简答题',
question_content:
'<p>复购率在金融数字化营销中是反应用户对品牌忠诚度的一个重要指标，锡盟高钙奶是一家专门生产乳制品的企业，其中脱脂牛奶的销量一直不太理想,2021年一季度华北市场的脱脂牛奶交易笔数为12000笔，4000人实现二次购买，而这4000人当中2000人实现了三次购买。</p>',
question_type: 5,
is_parent: 0,
child_question_type: 3,
question_answer: '2021年一季度华北市场的脱脂牛奶交易笔数为12000笔',
group_id: '1005',
score: 2
},
{
question_title: '情景题',
question_content:
'<p>平邦保险公司想通过一些建设性的方案来解决目前4个策略中所存在的问题，以下为各个策略分别所对应的问题。</p><p>①　在产品策略方面，某保险公司主要售卖两款疾病险和一款年金险产品，由于整体保险市场的产品同质化严重，与同行业其他保险公司相比没有明显优势。</p><p>②　在定价策略方面，某保险公司的产品定价整体处于中等水平，比大型保险公司定价整体相比较低，比其他小型保险公司定价略高。过去人们在比较不同保险产品时，关注的主要是经济补偿，而现在不仅包括经济补偿，还包括各类附加功能。比如保险公司与医院联网合作，不仅可以在费用阶段直接垫付客户治疗费用，还可以增加包括专家门诊、预约病床、绿色通道在内的多种特色服务，成为了公司品牌特色的一部分。</p><p>③　在渠道策略方面，某保险公司目前营销渠道还是以个人代理制为主。目前，保险代理人队伍的整体文化素质不高，学历在高中及以下超过90%，另外由于公司对保险代理人实施以业务业绩为主的晋升机制，导致目前忽视了对整体代理人队伍文化及金融素养的培训。</p><p>④　在促销策略方面，某保险公司的广告投入较少，投放了电视广告，但是一般在非黄金时段播放；同时，其销售方式以人员推销为主。</p>',
question_type: 8,
question_title: 'xxxxx',
question_content: '这是一道情景题',
is_parent: 1,
child_question_type: '',
question_answer: '答案就是你猜呀',
question_score: '3',
group_id: '0',
question_options: []
child_question_type: 0,
question_answer: null,
group_id: '1006',
score: 8
},
{
question_title: '单选题',
question_content: '<p>根据题目描述，若按交易方法计算，则重复购买次数为？</p>',
question_type: 8,
is_parent: 0,
child_question_type: 1,
question_options: [
{
id: '1',
options: '2000',
checked: true
},
{
id: '2',
options: '2000',
checked: false
}
],
question_answer: '2000',
group_id: '1006',
score: 2
},
{
question_title: '多选题',
question_content:
'<p>市场营销通过多方面手段便利交换、便利物流，从而保障交换工能够和物流功能的实现。这主要说的是市场营销的哪一项功能？</p>',
question_type: 8,
is_parent: 0,
child_question_type: 2,
question_options: [
{
id: '1',
options: '示向功能',
checked: true
},
{
id: '2',
options: '示向----',
checked: true
},
{
id: '3',
options: '示向---12333-',
checked: false
}
],
question_answer: '示向功能、示向----',
group_id: '1006',
score: 2
},
{
question_title: '判断题',
question_content:
'<p>市场营销通过多方面手段便利交换、便利物流，从而保障交换工能够和物流功能的实现。这主要说的是市场营销的哪一项功能？</p>',
question_type: 8,
is_parent: 0,
child_question_type: 6,
question_options: [
{
id: '1',
options: '正确',
checked: true
},
{
id: '2',
options: '错误',
checked: false
}
],
question_answer: '正确',
group_id: '1006',
score: 2
},
{
question_title: '简答题',
question_content:
'<p>复购率在金融数字化营销中是反应用户对品牌忠诚度的一个重要指标，锡盟高钙奶是一家专门生产乳制品的企业，其中脱脂牛奶的销量一直不太理想,2021年一季度华北市场的脱脂牛奶交易笔数为12000笔，4000人实现二次购买，而这4000人当中2000人实现了三次购买。</p>',
question_type: 8,
question_title: 'xxxxx',
question_content: '这是一道单选题',
is_parent: 0,
child_question_type: 3,
question_answer: '2021年一季度华北市场的脱脂牛奶交易笔数为12000笔',
group_id: '1006',
score: 2
},
{
question_title: '实操题',
question_content:
'<p>平邦保险公司想通过一些建设性的方案来解决目前4个策略中所存在的问题，以下为各个策略分别所对应的问题。</p><p>①　在产品策略方面，某保险公司主要售卖两款疾病险和一款年金险产品，由于整体保险市场的产品同质化严重，与同行业其他保险公司相比没有明显优势。</p><p>②　在定价策略方面，某保险公司的产品定价整体处于中等水平，比大型保险公司定价整体相比较低，比其他小型保险公司定价略高。过去人们在比较不同保险产品时，关注的主要是经济补偿，而现在不仅包括经济补偿，还包括各类附加功能。比如保险公司与医院联网合作，不仅可以在费用阶段直接垫付客户治疗费用，还可以增加包括专家门诊、预约病床、绿色通道在内的多种特色服务，成为了公司品牌特色的一部分。</p><p>③　在渠道策略方面，某保险公司目前营销渠道还是以个人代理制为主。目前，保险代理人队伍的整体文化素质不高，学历在高中及以下超过90%，另外由于公司对保险代理人实施以业务业绩为主的晋升机制，导致目前忽视了对整体代理人队伍文化及金融素养的培训。</p><p>④　在促销策略方面，某保险公司的广告投入较少，投放了电视广告，但是一般在非黄金时段播放；同时，其销售方式以人员推销为主。</p>',
question_type: 7,
is_parent: 1,
child_question_type: 0,
question_answer: null,
group_id: '1007',
score: 8
},
{
question_title: '单选题',
question_content: '<p>根据题目描述，若按交易方法计算，则重复购买次数为？</p>',
question_type: 7,
is_parent: 0,
child_question_type: 1,
question_answer: '答案就是你猜呀111111',
question_score: '3',
group_id: '0',
question_options: [
{
id: '0',
options: '123',
checked: 'false'
id: '1',
options: '2000',
checked: true
},
{
id: '2',
options: '2000',
checked: false
}
],
question_answer: '2000',
group_id: '1007',
score: 2
},
{
question_title: '多选题',
question_content:
'<p>市场营销通过多方面手段便利交换、便利物流，从而保障交换工能够和物流功能的实现。这主要说的是市场营销的哪一项功能？</p>',
question_type: 7,
is_parent: 0,
child_question_type: 2,
question_options: [
{
id: '1',
options: '示向功能',
checked: true
},
{
id: '2',
options: '示向----',
checked: true
},
{
id: '3',
options: '示向---12333-',
checked: false
}
],
question_answer: '示向功能、示向----',
group_id: '1007',
score: 2
},
{
question_title: '判断题',
question_content:
'<p>市场营销通过多方面手段便利交换、便利物流，从而保障交换工能够和物流功能的实现。这主要说的是市场营销的哪一项功能？</p>',
question_type: 7,
is_parent: 0,
child_question_type: 6,
question_options: [
{
id: '1',
options: '456',
checked: 'true'
options: '正确',
checked: true
},
{
id: '2',
options: '错误',
checked: false
}
]
],
question_answer: '正确',
group_id: '1007',
score: 2
},
{
question_title: '简答题',
question_content:
'<p>复购率在金融数字化营销中是反应用户对品牌忠诚度的一个重要指标，锡盟高钙奶是一家专门生产乳制品的企业，其中脱脂牛奶的销量一直不太理想,2021年一季度华北市场的脱脂牛奶交易笔数为12000笔，4000人实现二次购买，而这4000人当中2000人实现了三次购买。</p>',
question_type: 7,
is_parent: 0,
child_question_type: 3,
question_answer: '2021年一季度华北市场的脱脂牛奶交易笔数为12000笔',
group_id: '1007',
score: 2
}
],
currentIndex: 1,
selectQuestion: []
]
}
},
mounted() {
this.getlist() // 处理后端返回
},
methods: {
// 试题类型
questionType(item) {
if (item.question_type === 1) {
return '单'
} else if (item.question_type === 2) {
return '多'
} else if (item.question_type === 3) {
return '问'
} else if (item.question_type === 5) {
return '案'
} else if (item.question_type === 6) {
return '判'
} else if (item.question_type === 7) {
return '实'
} else if (item.question_type === 8) {
return '情'
}
},
getlist() {
const newQuestionList = []
const bigData = this.questionList.filter(item => item.is_parent === 1) // 大题
const smallData = this.questionList.filter(item => item.is_parent === 0) // 小题
for (let i = 0; i < bigData.length; i++) {
const listArray = [] // 存放每次外层符合条件的数据
for (let j = 0; j < smallData.length; j++) {
if (bigData[i].group_id === smallData[j].group_id) {
// 如果大题的group_id和小题group_id相等就push listArray数组中，然后赋值给bigData[i].list 相当于加个list属性
listArray.push(smallData[j]) // 符合就push listArray数组暂存
bigData[i].list = listArray
}
}
newQuestionList.push(bigData[i])
console.log(newQuestionList)
}
this.questionList = newQuestionList
},
// 增加试题
addPaper() {
console.log('dfjsf')
......@@ -157,7 +498,7 @@ export default {
},
// 试题列表滑动指定位置
handlePosition(offsetTop) {
// document.getElementById('questionMain').scrollTo(0, offsetTop)
console.log(offsetTop)
window.scrollTo(0, offsetTop)
},
// 保存试卷
......@@ -237,7 +578,14 @@ export default {
min-width: 20%;
max-width: 20%;
margin-top: 10px;
div {
.item_type {
width: 24px;
height: 24px;
font-size: 14px;
text-align: center;
color: #c01c40;
}
.item_index {
border-radius: 50px;
width: 24px;
height: 24px;
......
src/modules/paper/components/QuestionListItem.vue deleted 100644 → 0
浏览文件 @ 8e0e35ab
<template>
<div class="question_bd">
<span class="question_hd_left_title" v-if="item.is_parent === 0">{{ item.question_content }}</span>
<!-- 单选判断 -->
<template v-if="[1, 6].includes(item.question_type) || item.child_question_type === 1">
<div v-for="(item, id) in item.question_options" :key="id" class="options">
<el-radio-group>
<el-radio label="item.options" class="question_bd_desc">
<span class="question_bd_desc_item">{{ item.options }}</span>
</el-radio>
</el-radio-group>
</div>
<div v-if="item.is_parent === 0">正确答案：{{ item.question_answer }}</div>
</template>
<!-- 多选 -->
<template v-if="item.question_type === 2 || item.child_question_type === 2">
<div class="question-option-item" v-for="item in item.question_options" :key="item.id">
<el-checkbox label="item.id" class="question_bd_desc"
><span class="question_bd_desc_item">{{ item.options }}</span>
</el-checkbox>
</div>
<div v-if="item.is_parent === 0">正确答案：{{ item.question_answer }}</div>
</template>
<!-- 简答题 -->
<template v-if="item.question_type === 3 || item.child_question_type === 3">
<el-input type="textarea"></el-input>
<div v-if="item.is_parent === 0">正确答案：{{ item.question_answer }}</div>
</template>
</div>
</template>
<script>
export default {
data() {
return {
checkboxValue: false
}
},
props: {
item: {}
},
methods: {
handleScroll(key) {
const PageId = document.querySelector('#page' + key)
this.$emit('handlePosition', PageId.offsetTop)
},
slectSubItem(item) {
console.log(item)
this.$emit('selectSubjectsChange', this.checkboxValue)
}
}
}
</script>
<style lang="scss" scoped>
.question_hd {
display: flex;
justify-content: space-between;
align-items: flex-start;
.question_hd_left {
.question_hd_left_type {
color: #c01c40;
}
.question_hd_left_title {
margin-left: 20px;
font-size: 18px;
}
}
}
.question_bd {
// background: rgb(247, 244, 244);
padding-left: 35px;
.question_bd_desc {
.question_bd_desc_item {
font-size: 18px;
font-weight: 400;
color: #303133;
}
}
}
::v-deep .el-checkbox__label {
color: #c01c40;
}
input {
-webkit-appearance: checkbox;
}
</style>
src/modules/paper/components/QuestionListItems.vue
浏览文件 @ 73933b02
<template>
<div>
<!-- <div style="margin-top: 32px" v-for="(item, index) in questionList" :key="index" :id="`page${index}`"> -->
<div style="margin-top: 32px">
<div class="question_hd">
<div class="question_hd_left">
<div class="question_hd_left_type">
<input
type="checkbox"
v-model="checkboxValue"
:value="item"
@change="slectSubItem(item)"
v-show="item.is_parent !== 0"
/>
<span v-show="item.is_parent !== 0">
{{ questionType(item) }}
</span>
<div class="question_hd_left_title" v-if="item.is_parent !== 0">{{ item.question_content }}</div>
<div v-for="(item, index) in questionList" :key="index">
<!-- 简单题类型 [1,2,3,4] :根据判断题的类型渲染 -->
<el-card class="boxCard" v-if="signQuestionTypes.includes(item.question_type)" :id="`page${index}`">
<div class="boxHeader">
<div class="headerLeft">
<div class="check">
<input
type="checkbox"
class="checkInpt"
v-model="selectSubjects"
:value="item"
@change="slectSubItem(item)"
/>
</div>
<div class="title">
<div class="titleType">{{ index + 1 }}、{{ item.question_title }}</div>
<div class="titleDec" v-html="item.question_content"></div>
</div>
</div>
<div class="pmty"></div>
<div class="headerRight">
<div class="scoreValue">
<span class="lableScore">分数：</span>
<el-input v-model="item.score"></el-input>
</div>
</div>
</div>
<div class="boxMain">
<el-radio-group class="options">
<el-radio v-for="(v, index) in item.question_options" :key="index" :label="v.options" class="option">{{
v.options
}}</el-radio>
</el-radio-group>
</div>
<div class="boxFooter">
<div>正确答案：</div>
<div class="boxAnswer">{{ item.question_answer }}</div>
</div>
</el-card>
<!-- 复杂题类型 [5,6] :根据判断题的类型渲染 复杂利用上面的头部，内部重新写个页面渲染复杂题中的小题-->
<el-card class="boxCard" v-if="intricacyQuestionTypes.includes(item.question_type)" :id="`page${index}`">
<div class="boxHeader">
<div class="headerLeft">
<div class="check">
<input
type="checkbox"
class="checkInpt"
v-model="selectSubjects"
:value="item"
@change="slectSubItem(item)"
/>
</div>
<div class="title">
<div class="titleType">{{ index + 1 }}、{{ item.question_title }}</div>
<div class="titleDec" v-html="item.question_content"></div>
</div>
</div>
<div class="headerRight">
<div class="scoreValue">
<span class="lableScore">分数：</span>
<el-input v-model="item.score"></el-input>
</div>
</div>
</div>
<div class="question_hd_right">分数 :<el-input :value="item.question_score"></el-input></div>
</div>
<question-list-item :item="item"></question-list-item>
<div
v-if="item.is_parent !== 0 && [1, 2, 3, 6].includes(item.question_type)"
style="margin-top: 10px"
class="question_ft"
>
正确答案：{{ item.question_answer }}
</div>
<div class="intricacyBoxMain" v-for="(v, index) in item.list" :key="index" style="margintop: 20px">
<div class="intricacyHeader">
<div class="intricacyDsc">
<div class="intricacyTitle">{{ index + 1 }}、{{ v.question_title }}</div>
<div class="titleDec" v-html="v.question_content"></div>
</div>
<div class="intricacyScoreValue">
<span class="lableScore">分数：</span>
<el-input v-model="v.score"></el-input>
</div>
<div class="empty"></div>
</div>
<div class="intricacyMain">
<el-radio-group class="options">
<el-radio v-for="(o, index) in v.question_options" :key="index" :label="o.options" class="option">{{
o.options
}}</el-radio>
</el-radio-group>
</div>
<div class="intricacyFooter">
<div>正确答案：</div>
<div class="intricacyAnswer">{{ v.question_answer }}</div>
</div>
</div>
</el-card>
</div>
</div>
</template>
<script>
import QuestionListItem from './QuestionListItem.vue'
export default {
components: { QuestionListItem },
// 问答、情景、案例
props: {
questionList: {
// 试题数据
type: Array
}
},
data() {
return {
checkboxValue: false
selectSubjects: [], // 选中的题
signQuestionTypes: [1, 2, 3, 6], // 简单题类型
intricacyQuestionTypes: [5, 7, 8] // 复杂题类型
}
},
props: {
item: {},
questionList: []
},
// computed: {
// // 试题类型
// questionType() {
// const questionType = this.questionList.map(item => item.question_type)
// return questionType
// }
// },
methods: {
// 试题类型
questionType(item) {
if (item.question_type === 1) {
return '单选题'
} else if (item.question_type === 2) {
return '多选题'
} else if (item.question_type === 3) {
return '问答题'
} else if (item.question_type === 5) {
return '案例题'
} else if (item.question_type === 6) {
return '判断题'
} else if (item.question_type === 7) {
return '实操题'
} else if (item.question_type === 8) {
return '情景题'
}
},
// 返回点击题号的offsettop
handleScroll(key) {
const PageId = document.querySelector('#page' + key)
this.$emit('handlePosition', PageId.offsetTop)
},
// 选中的数据回传
slectSubItem(item) {
console.log(item)
this.$emit('selectSubjectsChange', this.checkboxValue)
this.$emit('selectSubjectsChange', this.selectSubjects)
}
}
}
</script>
<style lang="scss" scoped>
.question_hd {
display: flex;
justify-content: space-between;
align-items: flex-start;
.question_hd_left {
.question_hd_left_type {
color: #c01c40;
<style lang="scss">
.boxCard {
margin-bottom: 10px;
.boxHeader {
display: flex;
justify-content: space-between;
margin-bottom: 30px;
.headerLeft {
flex: 0.75;
display: flex;
.check {
margin-right: 20px;
}
.title {
justify-content: space-around;
.titleType {
width: 200px;
color: #c01c40;
}
}
.checkInpt .title {
display: inline-block;
}
}
.pmty {
flex: 0.05;
}
.headerRight {
flex: 0.2;
display: flex;
position: relative;
.scoreValue {
position: absolute;
top: 0px;
display: flex;
align-items: center;
.lableScore {
width: 100px;
}
}
}
.question_hd_left_title {
margin-left: 20px;
font-size: 18px;
}
.boxMain {
padding-left: 70px;
.options {
display: flex;
flex-direction: column;
.option {
margin-bottom: 5px;
}
}
}
}
.question_bd {
// background: rgb(247, 244, 244);
padding-left: 35px;
.boxFooter {
margin-top: 30px;
padding-left: 40px;
display: flex;
align-items: center;
.boxAnswer {
color: #c01c40;
font-size: 14px;
}
}
.intricacyBoxMain {
padding-left: 70px;
padding-top: 20px;
.options {
display: flex;
flex-direction: column;
.option {
margin-bottom: 5px;
}
}
.intricacyHeader {
display: flex;
align-items: center;
.question_bd_desc {
.question_bd_desc_item {
font-size: 18px;
font-weight: 400;
color: #303133;
.intricacyDsc {
flex: 0.8;
.intricacyTitle {
width: 200px;
color: #c01c40;
}
}
.intricacyScoreValue {
flex: 0.2;
margin-left: 50px;
display: flex;
align-items: center;
.lableScore {
width: 80px;
}
}
}
.intricacyMain {
padding-left: 30px;
}
.intricacyFooter {
margin-top: 10px;
display: flex;
align-items: center;
.intricacyAnswer {
color: #c01c40;
font-size: 14px;
}
}
}
}
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论