From dc2c454c2ae3fdfdddcad0fd609e1a0def3b67a5 Mon Sep 17 00:00:00 2001
From: 84702473 <84702473@qq.com>
Date: 星期五, 31 三月 2023 09:44:36 +0800
Subject: [PATCH] 添加弹窗提示框
---
src/views/exam/paper/values.vue | 964 ++++++++++++++++++++++++++++---------------------------
1 files changed, 489 insertions(+), 475 deletions(-)
diff --git a/src/views/exam/paper/values.vue b/src/views/exam/paper/values.vue
index 38d8fbf..7a4c865 100644
--- a/src/views/exam/paper/values.vue
+++ b/src/views/exam/paper/values.vue
@@ -4,22 +4,37 @@
<el-header class="">
<h1>{{$t('values_title')}}</h1>
</el-header>
- <el-main class="" style="padding-top: 3%;">
+ <el-main class="">
<div>
- {{$t('values_title_description')}}
+ <div>{{$t('values_title_description')}}</div>
+ <div>{{$t('values_title_description_1')}}<img class="tools-button" src="@/assets/exam-paper/good.png" style="width: 15px;"/></div>
+ <div>{{$t('values_title_description_2')}}<img class="tools-button" src="@/assets/exam-paper/nogood.png" style="width: 15px;"/></div>
+ <div>{{$t('values_title_description_3')}}<img class="tools-button" src="@/assets/exam-paper/question.png" style="width: 15px;"/></div>
</div>
+
<div style="display: flex;justify-content: flex-start;padding: 10px 0;">
- <el-button @click="step1_start" type="primary" v-if="!step1Start">{{$t('start')}}</el-button>
- <el-button style="margin-top: 12px;" @click="step1_next" v-if="(step1Start && itemSize>0)">
- {{$t('next')}}</el-button>
+ <el-button style="margin-top: 12px;" @click="step1_start" type="primary" round v-if="!step1Start">{{$t('start')}}</el-button>
+ <el-button style="margin-top: 12px;" type="primary" round @click="step1_next"
+ v-if="(step1Start && itemSize>0)">
+ {{$t('next')}}
+ </el-button>
</div>
<div class="mullinediv" v-if="step1Start">
- <div v-for="question in questionItems" class="mullinediv-item" v-if="isNull(question.analyze)">
- <el-image :src="question.imgUrl" lazy :preview-src-list="[question.imgUrl]"></el-image>
- <div style="display: flex; justify-content: space-between;padding: 5px 10px;margin-top: -5px;">
- <i class="el-icon-success" @click="likeMe(question.id)"></i>
- <i class="el-icon-question" @click="iAmNotSure(question.id)"></i>
- <i class="el-icon-error" @click="unLikeMe(question.id)"></i>
+ <div v-for="(question,index1) in questionItems" class="mullinediv-item"
+ v-if="isNull(question.content)">
+ <div style="display: flex; justify-content: flex-end;margin-right: -20px;margin-top: -10px;">
+ <el-image class="tools-button" :src="require('@/assets/exam-paper/scale.png')"
+ @click="previewImg('qImg'+question.id,question.id)"></el-image>
+ </div>
+ <el-image :ref="'qImg'+question.id" :src="question.imgUrl" lazy
+ :preview-src-list="[question.imgUrl]"></el-image>
+ <div style="display: flex; justify-content: space-between;">
+ <el-image class="tools-button" :src="require('@/assets/exam-paper/nogood.png')"
+ @click="unLikeMe(question.id)"></el-image>
+ <el-image class="tools-button" :src="require('@/assets/exam-paper/question.png')"
+ @click="iAmNotSure(question.id)"></el-image>
+ <el-image class="tools-button" :src="require('@/assets/exam-paper/good.png')"
+ @click="likeMe(question.id)"></el-image>
</div>
</div>
</div>
@@ -30,7 +45,7 @@
<div>
<div class="tag-group">
<span class="tag-group__title"
- style="padding-right: 20px;">{{$t('values_cur_step')}}锛坽{step2SubStep}} /
+ style="padding-right: 20px;font-size: 26px;">{{$t('values_cur_step')}}锛坽{step2SubStep}} /
{{step2ScoreRanges.length}})</span>
<el-tag v-for="item in step2ScoreRanges" :key="item.itemOrder"
:type="getStep2StepTagType(item.step)" style="margin: 0 2px;font-size: 26px;" size="large"
@@ -40,7 +55,8 @@
</div>
<div style="display: flex;justify-content: space-between;">
<div style="line-height: 50px;text-indent: 2em;">
- <span v-if="(step2SubStep == step2ScoreRanges.length) && (step2ScoreRanges.length % 2 == 1)">
+ <span
+ v-if="(step2SubStep == step2ScoreRanges.length) && (step2ScoreRanges.length % 2 == 1)">
{{$t('values_step_tips_for_3').replace('%N',getStep2StepItem(step2SubStep).quantity)}}
</span>
<span v-else>
@@ -48,8 +64,9 @@
</span>
</div>
<div style="display: flex;justify-content: flex-end;">
- <el-button style="" @click="step2_pre" v-if="step2SubStep>1">{{$t('pre')}}</el-button>
- <el-button style="" @click="step2_next">{{$t('next')}}</el-button>
+ <el-button type="primary" round @click="step2_pre" v-if="step2SubStep>1">{{$t('pre')}}
+ </el-button>
+ <el-button type="primary" round @click="step2_next">{{$t('next')}}</el-button>
</div>
</div>
</div>
@@ -59,73 +76,107 @@
/ {{getStep2StepItem(step2SubStep).quantity}}</span> </el-divider>
<div style="">
<div class="inlinediv">
- <div v-for="question in questionItems" class="mullinediv-item"
+ <div v-for="(question,index2) in questionItems" class="mullinediv-item"
v-if="getStep2StepItem(step2SubStep).itemOrder == question.subjectId">
- <el-image :src="question.imgUrl" lazy :preview-src-list="[question.imgUrl]"></el-image>
- <div style="display: flex;justify-content: center;padding: 5px 10px;">
- <!--/*background-color: #c8c3c3;*/-->
- <i class="el-icon-delete"
- @click="step2Delete(question.id,getStep2StepItem(step2SubStep).itemOrder)"></i>
- <!-- <i class="el-icon-zoom-in"></i> -->
+ <el-image :ref="'q2SelectImg'+question.id" :src="question.imgUrl" :preview-src-list="[question.imgUrl]"></el-image>
+ <div style="display: flex; justify-content: space-between;">
+ <el-image class="tools-button" :src="require('@/assets/exam-paper/no.png')"
+ @click="step2Delete(question.id,getStep2StepItem(step2SubStep).itemOrder)">
+ </el-image>
+ <el-image class="tools-button" :src="require('@/assets/exam-paper/scale.png')"
+ @click="previewImg('q2SelectImg'+question.id)"></el-image>
</div>
</div>
</div>
</div>
- <el-divider content-position="left">{{$t('values_select_tips')}}</el-divider>
- <div style="height: auto;overflow: auto;">
- <div class="mullinediv" style="" v-if="questionItems && questionItems.length>0">
- <div v-for="question in questionItems" class="mullinediv-item"
- v-if="isNull(question.subjectId)">
- <el-image :src="question.imgUrl" lazy :preview-src-list="[question.imgUrl]"></el-image>
- <div style="display: flex; justify-content: center;padding: 5px 10px;margin-top: -5px;">
- <el-checkbox
- @change="checked=>step2Add(checked,question.id,getStep2StepItem(step2SubStep).itemOrder)">
- {{$t('values_select')}}</el-checkbox>
- <!-- <i class="el-icon-check"></i> -->
- <!-- <i class="el-icon-zoom-in"></i> -->
- </div>
+ <el-divider content-position="left">{{$t('values_select_tips')}}</el-divider>
+ <div style="height: auto;overflow: auto;">
+ <div class="mullinediv" style="" v-if="questionItems && questionItems.length>0">
+ <div v-for="(question,index3) in questionItems" class="mullinediv-item"
+ v-if="isNull(question.subjectId)">
+ <el-image :ref="'q2Img'+question.id" :src="question.imgUrl" lazy
+ :preview-src-list="[question.imgUrl]"></el-image>
+ <div style="display: flex; justify-content: space-between;">
+ <el-image class="tools-button" :src="require('@/assets/exam-paper/yes.png')"
+ @click="step2Add(question.id,getStep2StepItem(step2SubStep).itemOrder)">
+ </el-image>
+ <el-image class="tools-button" :src="require('@/assets/exam-paper/scale.png')"
+ @click="previewImg('q2Img'+question.id)"></el-image>
</div>
</div>
- <div class="mullinediv" style="" v-if="sumUnSelectedNum()<=0">
- {{$t('values_no_select')}}
- </div>
+ </div>
+ <div class="mullinediv" style="" v-if="sumStep2UnSelectedNum()<=0">
+ {{$t('values_no_select')}}
</div>
</div>
+ </div>
</el-main>
</el-container>
<el-container class="app-item-contain step3" v-if="step === 'step3'">
<el-main class="">
- <div style="display:flex;">
- <div style="display: inline-block;min-width: 110px;text-align: right;">
- <div class="mul-inlinediv-row mul-inlinediv-lineheight"
+ <div style="position: fixed;z-index: 999; width:90%; top: 56px;">
+ <div style="display: flex;justify-content: flex-end;padding: 10px;background-color: #f5f7fa;">
+ <div style="padding-right: 20px;" v-html="$t('values_pic_tmpArea_desc')"></div>
+ <div style="padding: 0 10px;">{{$t('values_pic_tmpArea')}}</div>
+ <draggable animation="300" class="pic-tmparea-div"
+ style="border: 1px solid gray;padding: 10px;width: 50%;"
+ :list="step3EWEIArea[0]" :options="{group:{name:'EWEIArea',pull:'clone'}}"
+ @start="ev=>step3TmpAreaStart(ev,0)"
+ @end="step3TmpAreaMoveEnd">
+ <div v-for="q in step3EWEIArea[0]" :key="q.id" class="mullinediv-item2"
+ :questionID="q.id" :questionIMGURL="q.imgUrl">
+ <el-image :src="q.imgUrl" :preview-src-list="[q.imgUrl]" fit="fill"></el-image>
+ </div>
+ </draggable>
+ <el-button type="primary" round style="height: fit-content;margin: 0 10px;"
+ @click="step3_commit" :disabled="submitDisable">
+ {{$t('commit')}}
+ </el-button>
+ </div>
+ </div>
+ <div style="display:flex;margin-top: 160px;">
+ <div style="display: inline-block;min-width: 150px;text-align: right;">
+ <div class="mul-inlinediv-row mul-inlinediv-lineheight"
v-for="(item,index) in step2ScoreRanges">
- {{(index == 0)?$t('values_mostLikeMe'):''}}{{(index == (step2ScoreRanges.length-1))?$t('values_mostUnLikeMe'):''}}
+ {{(index == 0)?$t('values_mostLikeMe'):' '}}{{(index == (step2ScoreRanges.length-1))?$t('values_mostUnLikeMe'):' '}}
+ </div>
+ </div>
+ <div style="display: inline-block;width: 20px;margin-top: 4px;">
+ <div class="mul-inlinediv-row mul-inlinediv-lineheight mul-inlinediv-down"
+ v-for="(item,index) in step2ScoreRanges">
+ </div>
+ </div>
+ <div style="display: inline-block;min-width: 20px;text-align: right;">
+ <div class="mul-inlinediv-row mul-inlinediv-lineheight"
+ v-for="(item,index) in step2ScoreRanges">
{{item.deviate}}
</div>
</div>
<div class="mul-inlinediv-box">
+
<div class="mul-inlinediv" v-for="item in step2ScoreRanges">
<div class="mul-inlinediv-row">
- <div v-for="question in questionItems" class="mullinediv-item"
- v-if="question.subjectId == item.itemOrder">
- <el-image :src="question.imgUrl" lazy :preview-src-list="[question.imgUrl]">
- </el-image>
- <div style="display: flex;justify-content: center;padding: 5px 10px;">
- <!--/*background-color: #c8c3c3;*/-->
- <el-checkbox v-model="question['checked']"
- @change="checked=>step3Change(checked,question)"
- :disabled="(step3ChangeSrc.subjectId != question.subjectId || step3ChangeSrc.id == question.id)?false:true">
- {{(step3ChangeSrc.id==null)?$t('values_select'):(question.id==step3ChangeSrc.id)?$t('values_select'):$t('values_select_exchange')}}
- </el-checkbox>
+ <draggable animation="300" classa="pic-eweiarea-div" :class="'pic-eweiarea-div-'+item.itemOrder"
+ :list="step3EWEIArea[item.itemOrder]"
+ :options="{group:{name:'EWEIArea',pull:'clone'}}" filter=".undraggable"
+ @end="ev=>step3EWEIAreaMoveEnd(ev,item.itemOrder)" :scoreRangeId="item.itemOrder">
+ <div v-for="q in step3EWEIArea[item.itemOrder]" :key="q.id"
+ class="mul-inlinediv-item" :questionID="q.id" :questionIMGURL="q.imgUrl">
+ <el-image :src="q.imgUrl" :preview-src-list="[q.imgUrl]" v-if="q.imgUrl">
+ </el-image>
</div>
- </div>
+ <div v-if="item.quantity >= step3EWEIArea[item.itemOrder].length">
+ <div class="mul-inlinediv-item"
+ v-for="c in (item.quantity - step3EWEIArea[item.itemOrder].length)">
+ <el-image :src="require('@/assets/exam-paper/none.png')" class="undraggable">
+ </el-image>
+ </div>
+ </div>
+ </draggable>
</div>
</div>
+
</div>
- </div>
- <div style="display: flex;justify-content: center;">
- <el-button style="margin-top: 12px;" @click="step3_commit" :disabled="submitDisable">
- {{$t('commit')}}</el-button>
</div>
</el-main>
</el-container>
@@ -150,9 +201,13 @@
import examPaperApi from '@/api/examPaper'
import examPaperAnswerApi from '@/api/examPaperAnswer'
import demographyApi from '@/api/demography'
+ import draggable from 'vuedraggable'
export default {
name: 'values',
+ components: {
+ draggable
+ },
data() {
return {
step: 'step1',
@@ -181,6 +236,7 @@
"id": null,
"subjectId": null,
},
+ step3EWEIArea: [1],
form: {
"id": 92,
"level": 1,
@@ -421,7 +477,6 @@
}
},
created: function() {
- console.log("created......", this.$route.query.formDo)
//console.log(".....................Test. config start......................")
//if(this.memberToken == '' || this.memberToken == undefined) this.setMemberTocken("4bdcf437-185c-4f4e-9528-382c99509ea6")
//console.log(".....................Test. config ednd.......................")
@@ -430,6 +485,7 @@
_this.setLangFlag(false)
_this.form = this.$route.query.formDo
if (_this.form !== {} && _this.form !== undefined && typeof(_this.form) !== "string") {
+ console.log("created......get from query", _this.form)
_this.formLoading = true
_this.remainTime = _this.form.suggestTime * 60
_this.titleItemsLength = _this.form.titleItems.length
@@ -455,6 +511,7 @@
}
// 鍔犺浇棰樼洰
examPaperApi.select(_this.memberToken, _this.langType).then(re => {
+ console.log("created......get from db", re.response)
_this.form = re.response
_this.remainTime = re.response.suggestTime * 60
_this.titleItemsLength = _this.form.titleItems.length
@@ -528,6 +585,10 @@
},
mounted() {
//console.log("mounted......")
+ document.body.ondrop = function(event) {
+ event.preventDefault();
+ event.stopPropagation();
+ }
},
beforeDestroy() {
window.clearInterval(this.timer)
@@ -539,12 +600,35 @@
this.questionItems.sort(function(i2, i1) {
return (i2.id - i1.id)
})
- //console.log('step1_start...',this.questionItems)
+ //test
+ //this.initTestData()
+ //鍥炴樉锛屾病鏈夊彲閫夌殑鏃跺�欙紝杩涘叆涓嬩竴姝�
+ let c = this.sumStep1UnSelectedNum()
+ if (c <= 0 && this.itemSize > 0) {
+ this.step = "step2"
+ this.sortQuestions()
+ this.caculateScoreRangeSelectedById(this.getStep2StepItem(this.step2SubStep).itemOrder)
+ }
},
step1_next() {
- this.step = "step2"
- this.sortQuestions()
- this.caculateScoreRangeSelectedById(this.getStep2StepItem(this.step2SubStep).itemOrder)
+ let _this = this
+ let c = this.sumStep1UnSelectedNum()
+ if (c > 0) {
+ this.$message.error(_this.$t('values_nextStepTips_choices_all'))
+ return
+ }
+ this.$confirm(_this.$t('values_nextStepTips_tips'), _this.$t('prompt'), {
+ confirmButtonText: _this.$t('determine'),
+ cancelButtonText: _this.$t('cancel'),
+ type: 'warning'
+ }).then(() => {
+ _this.step = "step2"
+ _this.sortQuestions()
+ _this.caculateScoreRangeSelectedById(this.getStep2StepItem(this.step2SubStep).itemOrder)
+ }).catch(() => {
+
+ });
+
},
step2_pre() {
if (this.step2SubStep > 1) {
@@ -554,16 +638,18 @@
step2_next() {
let _this = this
let stepItem = this.getStep2StepItem(this.step2SubStep)
- if (stepItem.selected == stepItem.quantity || this.sumUnSelectedNum() == 0) {
+ if (stepItem.selected == stepItem.quantity || this.sumStep2UnSelectedNum() == 0) {
_this.answer.verifyStatus = 2
_this.submitSubAnswer()
this.step2SubStep = this.step2SubStep + 1
- if(this.step2SubStep == this.step2ScoreRanges.length){//杩涘叆鏈�鍚庝竴姝ラ
- this.resetAllQuestionItemsValueByKeyWhenNull("subjectId",this.getStep2StepItem(this.step2SubStep).itemOrder)
+ if (this.step2SubStep == this.step2ScoreRanges.length) { //杩涘叆鏈�鍚庝竴姝ラ
+ this.resetAllQuestionItemsValueByKeyWhenNull("subjectId", this.getStep2StepItem(this.step2SubStep)
+ .itemOrder)
}
- if (this.step2SubStep > this.step2ScoreRanges.length) {//瀹屾垚鏈�鍚庝竴姝ラ
+ if (this.step2SubStep > this.step2ScoreRanges.length) { //瀹屾垚鏈�鍚庝竴姝ラ
this.step = "step3"
+ this.buildStep3EWEIArea()
}
this.sortQuestions()
@@ -578,12 +664,12 @@
}
},
step2Delete(qid, sid) {
- this.resetQuestionItemsValueById(qid, "subjectId", null) //鍊熺敤subjectId锛屽瓨鍌�
+ this.resetQuestionItemsSubjectIdById(qid, null) //鍊熺敤subjectId锛屽瓨鍌�
this.caculateScoreRangeSelectedById(sid, -1)
},
- step2Add(value, qid, sid) {
+ step2Add(qid, sid) {
//console.log("step2Add....",value,qid,sid)
- this.resetQuestionItemsValueById(qid, "subjectId", sid) //鍊熺敤subjectId锛屽瓨鍌�
+ this.resetQuestionItemsSubjectIdById(qid, sid) //鍊熺敤subjectId锛屽瓨鍌�
this.caculateScoreRangeSelectedById(sid, 1)
},
step3Change(value, question) {
@@ -599,9 +685,9 @@
//瀵硅皟鑷繁
} else {
//瀵硅皟
- this.resetQuestionItemsValueById(this.step3ChangeSrc.id, "subjectId", question
+ this.resetQuestionItemsSubjectIdById(this.step3ChangeSrc.id, question
.subjectId) //鍊熺敤subjectId锛屽瓨鍌�
- this.resetQuestionItemsValueById(question.id, "subjectId", this.step3ChangeSrc
+ this.resetQuestionItemsSubjectIdById(question.id, this.step3ChangeSrc
.subjectId) //鍊熺敤subjectId锛屽瓨鍌�
}
//娓呯悊
@@ -612,7 +698,88 @@
}
}
},
- sumUnSelectedNum() {
+ /**
+ * 鏍规嵁QuestionItems锛屾瀯寤轰簩缁村浘琛ㄦ暟鎹�
+ */
+ buildStep3EWEIArea() {
+ this.step3EWEIArea = [this.step2ScoreRanges.length + 1]
+ this.step3EWEIArea[0] = []
+ this.$set(this.step3EWEIArea, 0, this.step3EWEIArea[0])
+ for (let item of this.step2ScoreRanges) {
+ this.step3EWEIArea[item.itemOrder] = []
+ for (let q = 1; q <= item.quantity; q++) {
+ let t = this.getQuestionItemsByKey("subjectId", item.itemOrder, q)
+ if (t.id) {
+ this.step3EWEIArea[item.itemOrder].push(t)
+ }
+ }
+ this.$set(this.step3EWEIArea, item.itemOrder, this.step3EWEIArea[item
+ .itemOrder])
+ }
+ console.log('buildStep3EWEIArea', this.step3EWEIArea)
+ },
+ addStep3EWEIArea(index,question){
+ //console.log('addStep3EWEIArea',index,question)
+ this.step3EWEIArea[index].push(question)
+ this.$set(this.step3EWEIArea, index, this.step3EWEIArea[index])
+ },
+ delStep3EWEIArea(index,question){
+ //console.log('delStep3EWEIArea s',index,question,this.step3EWEIArea[index])
+ for(let i=0;i<this.step3EWEIArea[index].length;i++){
+ if(question.id == this.step3EWEIArea[index][i].id){
+ this.step3EWEIArea[index].splice(i,1)
+ }
+ }
+ this.$set(this.step3EWEIArea, index, this.step3EWEIArea[index])
+ //console.log('delStep3EWEIArea e',this.step3EWEIArea[index])
+ },
+ hasStep3EWEIAreaOverflow(index,question){
+ //console.log('hasStep3EWEIAreaOverflow e',this.step3EWEIArea[index])
+ if(this.step3EWEIArea[index].length>this.step2ScoreRanges[index-1].quantity){
+ return true
+ }
+ return false
+ },
+
+ step3TmpAreaStart(ev,i) {
+ console.log('step3TmpAreaStart', ev,i)
+ },
+ step3TmpAreaMoveAdd(ev) {
+ console.log('step3TmpAreaMoveAdd', ev)
+ return false
+ },
+ step3TmpAreaMoveEnd(ev) {
+ console.log('step3TmpAreaMoveEnd s', ev)
+ console.log('step3TmpAreaMoveEnd from,to', ev.from.className,ev.to.className)
+ let to = ev.to.className.replace("pic-eweiarea-div-","")
+ let qId = ev.item.attributes.questionID.value
+ let qImg = ev.item.attributes.questionIMGURL.value
+ if("pic-tmparea-div"===ev.to.className){
+ //this.delStep3EWEIArea(to,{'id':qId,'imgUrl':qImg})
+ } else {
+ let of = this.hasStep3EWEIAreaOverflow(to,{'id':qId,'imgUrl':qImg})
+ if(of){
+ this.delStep3EWEIArea(to,{'id':qId,'imgUrl':qImg})
+ } else {
+ this.delStep3EWEIArea(0,{'id':qId,'imgUrl':qImg})
+ }
+ }
+ },
+
+ step3EWEIAreaMoveEnd(ev,fid) {
+ console.log('step3EWEIAreaMoveEnd',ev)
+ console.log('step3EWEIAreaMoveEnd from,to,id', ev.from.className,ev.to.className,fid)
+ let to = ev.to.className.replace("pic-eweiarea-div-","")
+ let qId = ev.item.attributes.questionID.value
+ let qImg = ev.item.attributes.questionIMGURL.value
+ if("pic-tmparea-div"===ev.to.className){
+ this.delStep3EWEIArea(fid,{'id':qId,'imgUrl':qImg})
+ } else {
+ if(fid != to) this.delStep3EWEIArea(to,{'id':qId,'imgUrl':qImg})
+ }
+ },
+
+ sumStep2UnSelectedNum() {
let count = 0
for (let item of this.questionItems) {
if (this.isNull(item['subjectId'])) {
@@ -621,8 +788,24 @@
}
return count
},
+ sumStep1UnSelectedNum() {
+ let count = 0
+ for (let item of this.questionItems) {
+ if (this.isNull(item['content'])) {
+ count = count + 1
+ }
+ }
+ return count
+ },
step3_commit() {
let _this = this
+
+ if (_this.step3EWEIArea[0].length > 0) {
+ this.$message.error(_this.$t('values_nextStepTips_choices_all'))
+ return
+ }
+ _this.resetAllQuestionItemsValueByEWEIArea()
+
window.clearInterval(_this.timer)
_this.submitDisable = true
_this.formLoading = true
@@ -631,6 +814,7 @@
_this.submitAnswer(_this.$t('values_finishValuesInfo'))
},
getLikeTypeByScoreRangeItemOrder(itemOrder) {
+ if (this.isNull(itemOrder)) return null;
let step = 0
for (let item of this.step2ScoreRanges) {
if (item.itemOrder === itemOrder) {
@@ -669,45 +853,64 @@
switch (type) {
case 0: //0:鏈�鍍忔垜
this.questionItems.sort(function(i2, i1) {
- return (i2.analyze == 'Like') ? -1 : 1
+ return (i2.content == 0) ? -1 : 1
})
break
case 1: //1:鏈夌枒闂�
this.questionItems.sort(function(i2, i1) {
- return (i2.analyze == 'NotSure') ? -1 : 1
+ return (i2.content == 1) ? -1 : 1
})
break
case 2: //2:鏈�涓嶅儚鎴�
this.questionItems.sort(function(i2, i1) {
- return (i2.analyze == 'UnLike') ? -1 : 1
+ return (i2.content == 2) ? -1 : 1
})
break
}
},
likeMe(id) {
+ let _this = this
this.step1SelectedNum = this.step1SelectedNum + 1
- this.resetQuestionItemsValueById(id, "analyze", "Like") //鍊熺敤analyze锛屽瓨鍌�
+ this.resetQuestionItemsContentById(id, 0) //鍊熺敤analyze锛屽瓨鍌�"Like"
+
+ _this.answer.verifyStatus = 2
+ _this.submitSubAnswer()
},
iAmNotSure(id) {
+ let _this = this
this.step1SelectedNum = this.step1SelectedNum + 1
- this.resetQuestionItemsValueById(id, "analyze", "NotSure")
+ this.resetQuestionItemsContentById(id, 1) //"NotSure"
+
+ _this.answer.verifyStatus = 2
+ _this.submitSubAnswer()
},
unLikeMe(id) {
+ let _this = this
this.step1SelectedNum = this.step1SelectedNum + 1
- this.resetQuestionItemsValueById(id, "analyze", "UnLike")
+ this.resetQuestionItemsContentById(id, 2) //"UnLike"
+
+ _this.answer.verifyStatus = 2
+ _this.submitSubAnswer()
},
- resetQuestionItemsValueById(id, key, value) {
+ resetQuestionItemsContentById(id, value) {
for (let item of this.questionItems) {
- if (item.id === id) {
- item[key] = value
- if ("subjectId" == key) {
- item['content'] = this.getLikeTypeByScoreRangeItemOrder(value)
- }
+ if (item.id == id) {
+ item["content"] = value
}
}
- //console.log('resetQuestionItems...',id,key,value,this.questionItems)
+ //console.log('resetQuestionItems...', id, value, this.questionItems)
},
+ resetQuestionItemsSubjectIdById(id, value) {
+ for (let item of this.questionItems) {
+ if (item.id == id) {
+ item["subjectId"] = value
+ item['content'] = this.getLikeTypeByScoreRangeItemOrder(value)
+ }
+ }
+ //console.log('resetQuestionItems...', id, value, this.questionItems)
+ },
+ //璁剧疆鎵�鏈夋湭鏈夊綊灞炴楠わ紙subjectId锛夌殑QuestionItems涓烘柊鐨勫綊灞炴楠わ紙subjectId锛�
resetAllQuestionItemsValueByKeyWhenNull(key, value) {
for (let item of this.questionItems) {
if (this.isNull(item[key])) {
@@ -719,6 +922,39 @@
}
//console.log('resetQuestionItems...',id,key,value,this.questionItems)
},
+ //鏍规嵁浜岀淮鍥捐〃鏁版嵁閲嶈QuestionItems鐨勫綊灞炴楠わ紙subjectId锛�
+ resetAllQuestionItemsValueByEWEIArea() {
+ for (let i = 1; i < this.step3EWEIArea.length; i++) {
+ for (let q of this.step3EWEIArea[i]) {
+ this.resetQuestionItemsSubjectIdById(q.id, i)
+ }
+ }
+ console.log('resetQuestionItems...by EWEIArea', this.questionItems)
+ },
+ getQuestionItemsByKey(key, stepOrder, index) {
+ let arr = []
+ for (let item of this.questionItems) {
+ if (!this.isNull(item[key])) {
+ if (item[key] == stepOrder) {
+ arr.push(item)
+ }
+ }
+ }
+ //console.log('getQuestionItemsByKey',key,stepOrder,index,arr,this.questionItems)
+ if (index <= arr.length) {
+ return arr[index - 1]
+ }
+ return {
+ id: null,
+ imgUrl: null,
+ subjectId: null
+ }
+ },
+ /**
+ * 璁＄畻姝ラid鐨勫凡閫夋嫨鏁伴噺
+ * @param {Object} id
+ * @param {Object} value
+ */
caculateScoreRangeSelectedById(id, value) {
let sum = 0
for (let item of this.questionItems) {
@@ -727,339 +963,33 @@
}
}
for (let item of this.step2ScoreRanges) {
- if (item.itemOrder === id) {
+ if (item.itemOrder == id) {
item['selected'] = sum
}
}
},
initTestData() {
- let _this = this
- //for test
- _this.step2ScoreRanges = [].concat([{
- "itemOrder": 1,
- "quantity": 1,
- "score": 5,
- "completed": false,
- "questionReports": null
- },
- {
- "itemOrder": 2,
- "quantity": 2,
- "score": 5,
- "completed": false,
- "questionReports": null
- },
- {
- "itemOrder": 3,
- "quantity": 10,
- "score": 5,
- "completed": false,
- "questionReports": null
- },
- {
- "itemOrder": 4,
- "quantity": 2,
- "score": 5,
- "completed": false,
- "questionReports": null
- },
- {
- "itemOrder": 5,
- "quantity": 1,
- "score": 5,
- "completed": false,
- "questionReports": null
- },
- // {
- // "itemOrder": 6,
- // "quantity": 2,
- // "score": 5,
- // "completed": false,
- // "questionReports": null
- // },
- // {
- // "itemOrder": 7,
- // "quantity": 2,
- // "score": 5,
- // "completed": false,
- // "questionReports": null
- // },
- // {
- // "itemOrder": 8,
- // "quantity": 2,
- // "score": 5,
- // "completed": false,
- // "questionReports": null
- // },
- ])
-
- _this.questionItems = _this.questionItems.concat([{
- "id": 100,
- "questionType": 1,
- "subjectId": 3,
- "title": "楹诲皢妗�",
- "gradeLevel": null,
- "items": [{
- "prefix": "1",
- "content": "0",
- "score": "0"
- }],
- "analyze": "Like",
- "correctArray": null,
- "correct": null,
- "score": "0",
- "difficult": null,
- "itemOrder": 1,
- "questionOrder": 0,
- "permanentId": "VAQ00001",
- "questionReport": null,
- "startTime": null,
- "endTime": null,
- "partOrder": 1,
- "parentQuestionId": null,
- "template": null,
- "questionNumber": null,
- "content": null,
- "imgUrl": "http://47.114.179.216:8090/profile/images/2022/12/26/b698d623e7c9a55d9017ffa08477b121.jpg"
- },
- {
- "id": 101,
- "questionType": 1,
- "subjectId": 3,
- "title": "楹诲皢妗�",
- "gradeLevel": null,
- "items": [{
- "prefix": "1",
- "content": "0",
- "score": "0"
- }],
- "analyze": "UnLike",
- "correctArray": null,
- "correct": null,
- "score": "0",
- "difficult": null,
- "itemOrder": 1,
- "questionOrder": 0,
- "permanentId": "VAQ00001",
- "questionReport": null,
- "startTime": null,
- "endTime": null,
- "partOrder": 1,
- "parentQuestionId": null,
- "template": null,
- "questionNumber": null,
- "content": null,
- "imgUrl": "http://47.114.179.216:8090/profile/images/2022/12/26/b698d623e7c9a55d9017ffa08477b121.jpg"
- },
- {
- "id": 102,
- "questionType": 1,
- "subjectId": 3,
- "title": "楹诲皢妗�",
- "gradeLevel": null,
- "items": [{
- "prefix": "1",
- "content": "0",
- "score": "0"
- }],
- "analyze": "NotSure",
- "correctArray": null,
- "correct": null,
- "score": "0",
- "difficult": null,
- "itemOrder": 1,
- "questionOrder": 0,
- "permanentId": "VAQ00001",
- "questionReport": null,
- "startTime": null,
- "endTime": null,
- "partOrder": 1,
- "parentQuestionId": null,
- "template": null,
- "questionNumber": null,
- "content": null,
- "imgUrl": "http://47.114.179.216:8090/profile/images/2022/12/26/b698d623e7c9a55d9017ffa08477b121.jpg"
- },
- {
- "id": 103,
- "questionType": 1,
- "subjectId": 3,
- "title": "楹诲皢妗�",
- "gradeLevel": null,
- "items": [{
- "prefix": "1",
- "content": "0",
- "score": "0"
- }],
- "analyze": "Like",
- "correctArray": null,
- "correct": null,
- "score": "0",
- "difficult": null,
- "itemOrder": 1,
- "questionOrder": 0,
- "permanentId": "VAQ00001",
- "questionReport": null,
- "startTime": null,
- "endTime": null,
- "partOrder": 1,
- "parentQuestionId": null,
- "template": null,
- "questionNumber": null,
- "content": null,
- "imgUrl": "http://47.114.179.216:8090/profile/images/2022/12/26/b698d623e7c9a55d9017ffa08477b121.jpg"
- },
- {
- "id": 104,
- "questionType": 1,
- "subjectId": 3,
- "title": "楹诲皢妗�",
- "gradeLevel": null,
- "items": [{
- "prefix": "1",
- "content": "0",
- "score": "0"
- }],
- "analyze": "UnLike",
- "correctArray": null,
- "correct": null,
- "score": "0",
- "difficult": null,
- "itemOrder": 1,
- "questionOrder": 0,
- "permanentId": "VAQ00001",
- "questionReport": null,
- "startTime": null,
- "endTime": null,
- "partOrder": 1,
- "parentQuestionId": null,
- "template": null,
- "questionNumber": null,
- "content": null,
- "imgUrl": "http://47.114.179.216:8090/profile/images/2022/12/26/b698d623e7c9a55d9017ffa08477b121.jpg"
- },
- {
- "id": 105,
- "questionType": 1,
- "subjectId": 1,
- "title": "楹诲皢妗�",
- "gradeLevel": null,
- "items": [{
- "prefix": "1",
- "content": "0",
- "score": "0"
- }],
- "analyze": "NotSure",
- "correctArray": null,
- "correct": null,
- "score": "0",
- "difficult": null,
- "itemOrder": 1,
- "questionOrder": 0,
- "permanentId": "VAQ00001",
- "questionReport": null,
- "startTime": null,
- "endTime": null,
- "partOrder": 1,
- "parentQuestionId": null,
- "template": null,
- "questionNumber": null,
- "content": null,
- "imgUrl": "http://47.114.179.216:8090/profile/images/2022/12/26/b698d623e7c9a55d9017ffa08477b121.jpg"
- },
- {
- "id": 106,
- "questionType": 1,
- "subjectId": 1,
- "title": "楹诲皢妗�",
- "gradeLevel": null,
- "items": [{
- "prefix": "1",
- "content": "0",
- "score": "0"
- }],
- "analyze": "Like",
- "correctArray": null,
- "correct": null,
- "score": "0",
- "difficult": null,
- "itemOrder": 1,
- "questionOrder": 0,
- "permanentId": "VAQ00001",
- "questionReport": null,
- "startTime": null,
- "endTime": null,
- "partOrder": 1,
- "parentQuestionId": null,
- "template": null,
- "questionNumber": null,
- "content": null,
- "imgUrl": "http://47.114.179.216:8090/profile/images/2022/12/26/b698d623e7c9a55d9017ffa08477b121.jpg"
- },
- {
- "id": 107,
- "questionType": 1,
- "subjectId": 2,
- "title": "楹诲皢妗�",
- "gradeLevel": null,
- "items": [{
- "prefix": "1",
- "content": "0",
- "score": "0"
- }],
- "analyze": "NotSure",
- "correctArray": null,
- "correct": null,
- "score": "0",
- "difficult": null,
- "itemOrder": 1,
- "questionOrder": 0,
- "permanentId": "VAQ00001",
- "questionReport": null,
- "startTime": null,
- "endTime": null,
- "partOrder": 1,
- "parentQuestionId": null,
- "template": null,
- "questionNumber": null,
- "content": null,
- "imgUrl": "http://47.114.179.216:8090/profile/images/2022/12/26/b698d623e7c9a55d9017ffa08477b121.jpg"
- },
- {
- "id": 108,
- "questionType": 1,
- "subjectId": 2,
- "title": "楹诲皢妗�",
- "gradeLevel": null,
- "items": [{
- "prefix": "1",
- "content": "0",
- "score": "0"
- }],
- "analyze": "NotSure",
- "correctArray": null,
- "correct": null,
- "score": "0",
- "difficult": null,
- "itemOrder": 1,
- "questionOrder": 0,
- "permanentId": "VAQ00001",
- "questionReport": null,
- "startTime": null,
- "endTime": null,
- "partOrder": 1,
- "parentQuestionId": null,
- "template": null,
- "questionNumber": null,
- "content": null,
- "imgUrl": "http://47.114.179.216:8090/profile/images/2022/12/26/b698d623e7c9a55d9017ffa08477b121.jpg"
- },
- ])
+ //console.log('initTestData...s',this.questionItems)
+ for (let item of this.questionItems) {
+ item['content'] = 1
+ }
+ for (let i = 0; i < this.step2ScoreRanges.length; i++) {
+ for (let j = 1; j <= this.step2ScoreRanges[i].quantity; j++) {
+ //console.log('for',i,j,this.step2ScoreRanges,this.questionItems)
+ for (let item of this.questionItems) {
+ if (this.isNull(item["subjectId"])) {
+ item["subjectId"] = this.step2ScoreRanges[i].itemOrder
+ break
+ }
+ }
+ }
+ }
+ console.log('initTestData...e', this.questionItems)
},
initStep2ScoreRanges(arr) {
+ //console.log('initStep2ScoreRanges...s', arr)
let _this = this
_this.step2ScoreRanges = _this.step2ScoreRanges.concat(arr)
- //this.initTestData()
let s = 1
let a = 2 //-2
let max = _this.step2ScoreRanges.length
@@ -1089,17 +1019,31 @@
//璁剧疆姣忛」step鍋忕鏈�鍚巗tep鐨勬璐熻窛绂诲�硷紙濂囨暟step姝ｅ亸绂伙紝鍋舵暟step璐熷亸绂伙級
if (_this.step2ScoreRanges[i]['step'] % 2 == 0) { //鍋舵暟
deviate = (max4O - _this.step2ScoreRanges[i]['step']) - (max4O - _this.step2ScoreRanges[i][
- 'step']) / 2
+ 'step'
+ ]) / 2
_this.step2ScoreRanges[i]['deviate'] = 0 - deviate
} else {
deviate = (max4J - _this.step2ScoreRanges[i]['step']) - (max4J - _this.step2ScoreRanges[i][
- 'step']) / 2
+ 'step'
+ ]) / 2
_this.step2ScoreRanges[i]['deviate'] = deviate
}
//璁剧疆姣忛」宸查�夋嫨鐨勬暟閲�
_this.step2ScoreRanges[i]['selected'] = 0
}
- //console.log('initStep2ScoreRanges...', this.step2ScoreRanges)
+ console.log('initStep2ScoreRanges...e', this.step2ScoreRanges)
+ _this.initQuestionItems()
+ },
+ initQuestionItems(){
+ let _this = this
+ for (let sr of _this.step2ScoreRanges) {
+ if(_this.isNotEmpty(sr['questionReports'])){
+ for(let q of sr.questionReports){
+ _this.resetQuestionItemsSubjectIdById(q.questionId,sr.itemOrder)
+ }
+ }
+ }
+ console.log('initQuestionItems...e', this.questionItems)
},
getStep2StepTagType(step) {
if (this.step2SubStep > step) {
@@ -1133,24 +1077,7 @@
++_this.answer.doTime
}, 1000)
},
- questionCompleted(completed) {
- return this.enumFormat(this.doCompletedTag, completed)
- },
- goAnchor(selector) {
- let _this = this
- let num = parseInt(selector.substr(10)) - 1
- this.itemOrder = _this.form.titleItems[0].questionItems[num].itemOrder
- this.questionItem = _this.form.titleItems[0].questionItems[num]
- _this.order = num
- setTimeout(function() {
- _this.$el.querySelector(selector).scrollIntoView({
- behavior: 'instant',
- block: 'center',
- inline: 'nearest'
- })
- }, 200)
- _this.$refs['popovertag'].doClose()
- },
+
initAnswer() {
this.answer.id = this.form.id
this.answer.questionOrder = this.form.questionOrder
@@ -1180,7 +1107,7 @@
// 鍒濆鍖栧紑濮嬫椂闂达紝璁剧疆绗竴涓椂闂�
for (let i = 0; i < this.answer.answerItems.length; i++) {
- if (this.answer.answerItems[i].startTime == null || this.answer.answerItems[i].startTime.trim() ===
+ if (this.answer.answerItems[i].startTime == null || this.answer.answerItems[i].startTime.trim() ==
'') {
this.answer.answerItems[i].startTime = this.formatDate(new Date(), 'yyyy-MM-dd hh:mm:ss')
break
@@ -1254,6 +1181,16 @@
isEmpty(obj) {
return !this.isNotEmpty(obj)
},
+ getContentByQuestionId(id) {
+ let cont
+ for (let item of this.questionItems) {
+ if (item.id == id) {
+ cont = item.content
+ break
+ }
+ }
+ return cont;
+ },
getSubmitAnswerValue(nowPartOrder) {
let _this = this
let answerSubmit = JSON.parse(JSON.stringify(_this.answer))
@@ -1264,7 +1201,8 @@
answerItem.startTime = ''
}
answerItem.completed = true
- //answerItem.content = this.getLikeTypeByScoreRangeItemOrder(answerItem.subjectId)
+ answerItem.content = this.getContentByQuestionId(answerItem.questionId)
+ //this.getLikeTypeByScoreRangeItemOrder(answerItem.subjectId)
answerItem.questionReport = {
questionOrder: answerItem.questionId,
questionTitle: answerItem.title,
@@ -1282,7 +1220,7 @@
answerSubmit.partOrder = nowPartOrder
answerSubmit.itemOrder = _this.itemOrder
//add scoreRanges
- if (_this.step2SubStep >= _this.step2ScoreRanges.length) {
+ if (_this.step2SubStep >= _this.step2ScoreRanges.length || true) {//浼犻�掑叏閮�
answerSubmit['scoreRanges'] = _this.form.titleItems[0].scoreRanges
} else {
let item = _this.getStep2StepItem(_this.step2SubStep)
@@ -1295,9 +1233,10 @@
item['completed'] = true
item['questionReports'] = []
for (let question of _this.questionItems) {
- if (question.subjectId === item.itemOrder) {
+ if (question.subjectId == item.itemOrder) {
item['questionReports'].push({
- questionOrder: question.questionOrder, //棰樼洰ID
+ questionId: question.id, //棰樼洰ID
+ questionOrder: question.questionOrder, //棰樼洰搴忓彿
questionTitle: question.questionTitle, //棰樼洰鏍囬
permanentId: question.permanentId, //棰樼洰姘镐箙缂栧彿
startTime: question.startTime, //绛旈寮�濮嬫椂闂�
@@ -1312,28 +1251,28 @@
}
return answerSubmit
},
-
+ /*
+ * 杩囩▼涓殑鎻愪氦
+ */
submitSubAnswer: function() {
+ console.log('submitSubAnswer...')
let _this = this
- this.answer.answerItems[_this.order].endTime = this.formatDate(new Date(), 'yyyy-MM-dd hh:mm:ss')
+ //this.answer.answerItems[_this.order].endTime = this.formatDate(new Date(), 'yyyy-MM-dd hh:mm:ss')
// 鎻愪氦閮ㄥ垎
let answerSubmit = _this.getSubmitAnswerValue(_this.partOrder)
- let loading = _this.$loading({
- lock: false,
- text: _this.$t('uploadInfo'),
- spinner: 'el-icon-loading'
- })
examPaperAnswerApi.answerSubmit(answerSubmit, _this.memberToken).then(re => {
- loading.close()
if (re.code === 1) {
//console.log('answerSubmit...', re)
}
_this.formLoading = false
}).catch(e => {
_this.reloadPage(e)
- loading.close()
})
},
+ /**
+ * 鏈�鍚庣幆鑺傜殑鎻愪氦
+ * @param {Object} mess
+ */
submitAnswer: function(mess) {
let _this = this
this.answer.answerItems[_this.order].endTime = this.formatDate(new Date(), 'yyyy-MM-dd hh:mm:ss')
@@ -1400,8 +1339,6 @@
} else {
mes = JSON.stringify(e) + ',' + 'order:' + _this.order + ',' + e.message
}
- // 璋冭瘯鐢�
- // _this.$router.push({ path: '/exam/exception', query: { name: _this.form.name, content: _this.$t('submitExceptionInfo') + '<br>' + mes } })
_this.$router.push({
path: '/exam/exception',
query: {
@@ -1413,20 +1350,22 @@
_this.submitDisable = false
},
isForFinish(i) {
- return i === this.answer.answerItems.length - 1 && (this.answer.answerItems[i].content !== null && this
- .answer.answerItems[i].content !== '')
+ return false
+ //return i === this.answer.answerItems.length - 1 && (this.answer.answerItems[i].content !== null && this.answer.answerItems[i].content !== '')
},
isDiffPartOrder: function() {
let _this = this
return _this.form.titleItems[0].questionItems[_this.order].partOrder !== _this.form.titleItems[0]
.questionItems[_this.order - 1].partOrder
},
+ previewImg(refName) {
+ this.$refs[refName][0].showViewer = true
+ },
...mapMutations('user', ['setMemberTocken']),
...mapMutations('user', ['setLangType']),
...mapMutations('user', ['setLangFlag'])
},
computed: {
- ...mapGetters('enumItem', ['enumFormat']),
...mapState('enumItem', {
doCompletedTag: state => state.exam.question.answer.doCompletedTag
}),
@@ -1450,43 +1389,64 @@
.app-item-contain {
margin-top: 45px;
}
+
.footer {
position: absolute;
position: fixed;
z-index: 1000;
bottom: 0px;
}
-
+
.mul-inlinediv-box {
overflow: auto;
display: block;
-webkit-box-flex: 1;
+ margin-left: 10px;
}
.mul-inlinediv {
overflow-y: hidden;
overflow-x: auto;
white-space: nowrap;
- border: 1px solid gray;
- padding: 10px 0;
+ //border: 1px solid gray;
+ padding: 2px 0;
width: fit-content;
}
.mul-inlinediv div div {
display: inline-table;
vertical-align: top;
- width: 180px;
- margin: 0 2px;
+ width: 80px;
+ height: 80px;
+ min-width: 80px;
+ min-height: 80px;
+ margin: 0px;
}
.mul-inlinediv-row {
- min-height: 210px;
- margin: 0 10px;
+ min-height: 100px;
+ //margin: 0 10px;
}
.mul-inlinediv-lineheight {
- line-height: 210px;
- padding: 10px 0;
+ line-height: 106px;
+ //margin: 3px 0 4px 0;
+ //margin: 2px 0;
+ }
+
+ .mul-inlinediv-item {
+ display: flex;
+ display: inline-block;
+ border: 1px solid gray;
+ width: 100px;
+ height: 100px;
+ padding: 10px;
+
+ .tools-button {
+ width: 20px;
+ height: 20px;
+ cursor: pointer;
+ }
}
.inlinediv {
@@ -1494,14 +1454,24 @@
overflow-x: auto;
white-space: nowrap;
min-height: 180px;
- display: flex;
+ padding: 10px 0px;
+ //display: flex;
}
.inlinediv div {
- display: inline-table;
- vertical-align: top;
- width: 100px;
- margin: auto 2px;
+ //display: inline-table;
+ //vertical-align: top;
+ //width: 360px;
+ // margin: auto 2px;
+ }
+
+ .pic-tmparea-div {
+ overflow-y: hidden;
+ overflow-x: auto;
+ white-space: nowrap;
+ min-height: 180px;
+ padding: 10px 0px;
+ //display: flex;
}
.mullinediv {
@@ -1510,21 +1480,39 @@
.mullinediv-item {
display: flex;
- display:
- inline-block;
- width: 180px;
- margin: 5px 4px;
+ display: inline-block;
+ width: 360px;
+ margin: 5px 20px 20px 5px;
+ padding: 30px 30px 10px 30px;
+ box-shadow: 1px 1px 1px grey, 0 0 5px grey, 0 0 10px grey;
+
+ .tools-button {
+ width: 20px;
+ height: 20px;
+ cursor: pointer;
+ }
}
- .mullinediv-item:hover {}
+ .mullinediv-item2 {
+ display: inline-block;
+ width: 180px;
+ height: 180px;
+ // margin: 5px 4px;
+ padding: 10px;
+ box-shadow: 1px 1px 1px grey, 0 0 5px grey, 0 0 10px grey;
+
+ div {
+ height: 160px;
+ }
+ }
img:hover {
- transform: scale(2);
- -ms-transform: scale(2);
- -webkit-transform: scale(2);
- -o-transform: scale(2);
- -moz-transform: scale(2);
- transition-duration: 0.5s;
+ // transform: scale(2);
+ // -ms-transform: scale(2);
+ // -webkit-transform: scale(2);
+ // -o-transform: scale(2);
+ // -moz-transform: scale(2);
+ // transition-duration: 0.5s;
}
.container {
@@ -1534,4 +1522,30 @@
width: 600px;
}
}
+
+ .wrapper {
+ display: flex;
+ justify-content: center;
+ width: 100%;
+ }
+
+ .mul-inlinediv-down {
+ min-width: 16px;
+ //line-height: 106px;
+ height: 106px;
+ background-size: 80% 100%;
+background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABsAAABoCAYAAAAAYos6AAAACXBIWXMAABnWAAAZ1gEY0crtAAAGsGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDggNzkuMTY0MDM2LCAyMDE5LzA4LzEzLTAxOjA2OjU3ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgMjEuMCAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDIzLTAzLTIxVDIxOjM3OjQzKzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAyMy0wMy0yMVQyMzowNDowMiswODowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAyMy0wMy0yMVQyMzowNDowMiswODowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJzUkdCIElFQzYxOTY2LTIuMSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowNjdjODYwZS1iZjZkLTNjNDUtYTllYi1jZTcxOTExMGRmZjMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MDk3NTgwYjgtMDUwYy1jMDQ5LTk1ZDgtZmIwNmU1OTFjMTBlIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6MDk3NTgwYjgtMDUwYy1jMDQ5LTk1ZDgtZmIwNmU1OTFjMTBlIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDowOTc1ODBiOC0wNTBjLWMwNDktOTVkOC1mYjA2ZTU5MWMxMGUiIHN0RXZ0OndoZW49IjIwMjMtMDMtMjFUMjE6Mzc6NDMrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCAyMS4wIChXaW5kb3dzKSIvPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0ic2F2ZWQiIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6YjlhZDEyMjEtM2MzOC0yMDQ5LTlhOWQtMmJjZjk4NmU5NTFhIiBzdEV2dDp3aGVuPSIyMDIzLTAzLTIxVDIyOjMxOjI4KzA4OjAwIiBzdEV2dDpzb2Z0d2FyZUFnZW50PSJBZG9iZSBQaG90b3Nob3AgMjEuMCAoV2luZG93cykiIHN0RXZ0OmNoYW5nZWQ9Ii8iLz4gPHJkZjpsaSBzdEV2dDphY3Rpb249InNhdmVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOjA2N2M4NjBlLWJmNmQtM2M0NS1hOWViLWNlNzE5MTEwZGZmMyIgc3RFdnQ6d2hlbj0iMjAyMy0wMy0yMVQyMzowNDowMiswODowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIDIxLjAgKFdpbmRvd3MpIiBzdEV2dDpjaGFuZ2VkPSIvIi8+IDwvcmRmOlNlcT4gPC94bXBNTTpIaXN0b3J5PiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Ph/lkloAAAEzSURBVGiB7ZlBDoMwDASdXuBNPI+P8pTtpb3R2FUWaw1ZiUuFmBJ7HZsYAItc+77DzE6vbdsQecbLCGqthe6jwKIKwY7jWADkwFjSgzGWMAxjAaNvtg6TojBPdX1mlhuzYVAYxgLqxQzAkgZjSS9mHqi2qdNgAOZOzYHJpD4V5qmuz+6b+t8pJAXG0sNhAFaZmJU2dR6MBdRbxlRYekc8d+rLYVFJxkwjG1truTGjwqRSnwrr7dTRJQzDPE1TD2djus+i0ksQmZEp3WdpMHo23ncY9LIxzdS1q/4zR6baVV+mSb0E9kuX1EYPSINFgFQYQ8OnubVro5lIk0qH9YC1a6Mnekc89G/+gX2Ap7/TfTYPWCmwXpNavzYypPdmvZHpvpMnHSZzpFX7SypLtb4WyNbGN9sG+pv7TY3OAAAAAElFTkSuQmCC);
+ }
+ .mul-inlinediv-down:first-child {
+ margin-top: 44px;
+ height: 62px;
+ min-height: 62px;
+ background-size: 80% 100%;
+ background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABsAAABoCAYAAAAAYos6AAAACXBIWXMAABnWAAAZ1gEY0crtAAAGsGlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDggNzkuMTY0MDM2LCAyMDE5LzA4LzEzLTAxOjA2OjU3ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgMjEuMCAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDIzLTAzLTIxVDIxOjM3OjQzKzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAyMy0wMy0yMVQyMzowNDowMiswODowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAyMy0wMy0yMVQyMzowNDowMiswODowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJzUkdCIElFQzYxOTY2LTIuMSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowNjdjODYwZS1iZjZkLTNjNDUtYTllYi1jZTcxOTExMGRmZjMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MDk3NTgwYjgtMDUwYy1jMDQ5LTk1ZDgtZmIwNmU1OTFjMTBlIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6MDk3NTgwYjgtMDUwYy1jMDQ5LTk1ZDgtZmIwNmU1OTFjMTBlIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDowOTc1ODBiOC0wNTBjLWMwNDktOTVkOC1mYjA2ZTU5MWMxMGUiIHN0RXZ0OndoZW49IjIwMjMtMDMtMjFUMjE6Mzc6NDMrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCAyMS4wIChXaW5kb3dzKSIvPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0ic2F2ZWQiIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6YjlhZDEyMjEtM2MzOC0yMDQ5LTlhOWQtMmJjZjk4NmU5NTFhIiBzdEV2dDp3aGVuPSIyMDIzLTAzLTIxVDIyOjMxOjI4KzA4OjAwIiBzdEV2dDpzb2Z0d2FyZUFnZW50PSJBZG9iZSBQaG90b3Nob3AgMjEuMCAoV2luZG93cykiIHN0RXZ0OmNoYW5nZWQ9Ii8iLz4gPHJkZjpsaSBzdEV2dDphY3Rpb249InNhdmVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOjA2N2M4NjBlLWJmNmQtM2M0NS1hOWViLWNlNzE5MTEwZGZmMyIgc3RFdnQ6d2hlbj0iMjAyMy0wMy0yMVQyMzowNDowMiswODowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIDIxLjAgKFdpbmRvd3MpIiBzdEV2dDpjaGFuZ2VkPSIvIi8+IDwvcmRmOlNlcT4gPC94bXBNTTpIaXN0b3J5PiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Ph/lkloAAAEzSURBVGiB7ZlBDoMwDASdXuBNPI+P8pTtpb3R2FUWaw1ZiUuFmBJ7HZsYAItc+77DzE6vbdsQecbLCGqthe6jwKIKwY7jWADkwFjSgzGWMAxjAaNvtg6TojBPdX1mlhuzYVAYxgLqxQzAkgZjSS9mHqi2qdNgAOZOzYHJpD4V5qmuz+6b+t8pJAXG0sNhAFaZmJU2dR6MBdRbxlRYekc8d+rLYVFJxkwjG1truTGjwqRSnwrr7dTRJQzDPE1TD2djus+i0ksQmZEp3WdpMHo23ncY9LIxzdS1q/4zR6baVV+mSb0E9kuX1EYPSINFgFQYQ8OnubVro5lIk0qH9YC1a6Mnekc89G/+gX2Ap7/TfTYPWCmwXpNavzYypPdmvZHpvpMnHSZzpFX7SypLtb4WyNbGN9sG+pv7TY3OAAAAAElFTkSuQmCC);
+ }
+ .mul-inlinediv-down:last-child {
+ background-size: 82% 60%;
+ background-repeat: no-repeat;
+ background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABsAAAA4CAYAAAAM7IPNAAAACXBIWXMAABnWAAAZ1gEY0crtAAAGrWlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDggNzkuMTY0MDM2LCAyMDE5LzA4LzEzLTAxOjA2OjU3ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgMjEuMCAoV2luZG93cykiIHhtcDpDcmVhdGVEYXRlPSIyMDIzLTAzLTIxVDIxOjQxOjE3KzA4OjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAyMy0wMy0yMVQyMzowMzoyNyswODowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAyMy0wMy0yMVQyMzowMzoyNyswODowMCIgZGM6Zm9ybWF0PSJpbWFnZS9wbmciIHBob3Rvc2hvcDpDb2xvck1vZGU9IjMiIHBob3Rvc2hvcDpJQ0NQcm9maWxlPSJzUkdCIElFQzYxOTY2LTIuMSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDoxMzgzOTg1Zi03OGUwLTU2NGQtYmVlZi1mNmI5YjNkMDRmOWMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ZTY2NWMzZTQtYjM4Yi05MjQ0LThiNTUtYTczMTQ4NGQzN2UwIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6ZTY2NWMzZTQtYjM4Yi05MjQ0LThiNTUtYTczMTQ4NGQzN2UwIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDplNjY1YzNlNC1iMzhiLTkyNDQtOGI1NS1hNzMxNDg0ZDM3ZTAiIHN0RXZ0OndoZW49IjIwMjMtMDMtMjFUMjE6NDE6MTcrMDg6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCAyMS4wIChXaW5kb3dzKSIvPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0ic2F2ZWQiIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6MDQyZDFjNWEtOTZmZS1lMzQ1LTlkN2EtM2NhY2I4YjAyODA3IiBzdEV2dDp3aGVuPSIyMDIzLTAzLTIxVDIyOjQyKzA4OjAwIiBzdEV2dDpzb2Z0d2FyZUFnZW50PSJBZG9iZSBQaG90b3Nob3AgMjEuMCAoV2luZG93cykiIHN0RXZ0OmNoYW5nZWQ9Ii8iLz4gPHJkZjpsaSBzdEV2dDphY3Rpb249InNhdmVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOjEzODM5ODVmLTc4ZTAtNTY0ZC1iZWVmLWY2YjliM2QwNGY5YyIgc3RFdnQ6d2hlbj0iMjAyMy0wMy0yMVQyMzowMzoyNyswODowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIDIxLjAgKFdpbmRvd3MpIiBzdEV2dDpjaGFuZ2VkPSIvIi8+IDwvcmRmOlNlcT4gPC94bXBNTTpIaXN0b3J5PiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pn/gmj0AAAR7SURBVFiF7ZffSyNXFMfPmNikE7OpP5BUEidmmMmMEyc6Mkj8kUSxIT745ItPBQsFoQ99Kbj9A4pKn31SVrq4rKAvSgpFqBCMoaQ0mmgslm7UWA3+qCVZTVC33j64W3RN4kSnUpb9wn2Ye+bezz33Hu49BxBCcFsbHx//3OPxIAC40ViWRQMDAxNS5imCB5QkGEJIgRB6GFg+YRgGGIY9DKwQSd3Gh4PJBZQcILlsr8/sb9lgckmWbXw3o1GqV5JhEoCvZIXJIVlCX1bYa2BOm6zRKNt1FY1GyycnJ3uj0Wj5XSe57Qbxer2fLC8vf6xMJpOV0Wj0eSQSearX638jSTJoMplCHMf9KRGUtX9hYcG2sbHRuLm5KaTT6Y9cLteosri4+Oz09HRyYmLiU4VCAXV1deByuYaOjo4m29rawgAAp6en2ouLi6yTIoTg/Pwcf/O9tLRkWFtb6/D5fJ8Fg0Hn1tYWuN1uaGtr+04piuKLg4ODUa/X2xuLxSAQCMDq6urj6enpxxaLJWS325+vr6+3ptPprLCzszPY2dlhx8bGvohEIp6VlRX39vb2B6lUCk5OTkCr1YLD4fiapmm/EgCAJMmfWZZ9cXR0RO7t7UEymYT9/X1IJBJCPB4XUqkU7O/vZ4UdHh5CKBQSdnd3hXg8DolEAo6PjwEAQKPRgMlkAqvVOkdRVObfzGd4eHiwqakpawZ110YQBOrv7/8xFosprmVXDodjnKbpUNbl31FGoxE6OztHampqLqP1al43ODj4rcFgQEql8t5e6XQ61NfXF8iZN9I07ed5HlQq1b29MplMwLKs72rfNZjFYvE7nc4hHMfhvhJF0V9fX//9tc63U+S5ublWq9WKVCrVnbZPoVAgHMfRyMjIV7em3wRB/GKz2cJlZWV38kir1QLHcUBR1E9v227AaJrOtLe3jxoMhjvBKisrwe12PzEYDKs3jNmqjfX19Q97enp+LzQqMQxDTqfzVSAQYCVXMTRNZxiG8VVXVxfklV6vB4vF4rfb7b9ms+d8z3ie/4Hn+YJgNE2DzWbz5rLnhDU2Ns7Y7fahQmCiKE61tLQ8KxhGkuQZTdOLDMNASUlJXoharQaCIIBl2XmbzZYoGAYAQBDEcmtrq7+8PP8jrtVqQRAEIEkymO+/vLCGhoY/uru7v9Hr9XlhFRUV0NXV9aXRaAzn/VFK4d3b27ui0+myhrtGo0Fut/uvcDhcKUsBX1tb6yMIIqutqqoKOI6b53k+++t6RZJgoihO1dfXZz0PjuOgubk5ZwQWDPN4PD6r1TqP4zgUFV0OwTAM1Go11NbWPhUEYUY2GAAARVGLLMuCRqMBAIDi4mKgKAosFovPbDbLW3mazeZgV1fXk4qKCgAAwHEcOjo6Zmia9kudQ1I0vmk+n88miiIqKipCVVVVaHZ21lPIeKXkVQGAw+EIMwwTymQygl6vf0lR1GIh4wuCAVzemY8ePRJKS0unGIZ5+Z/CmpubnzEM41Or1QWBAAAwucohKfr/lbnvYe9h7x7sHwGftes0162GAAAAAElFTkSuQmCC);
+ }
</style>
--
Gitblit v1.9.1