From b51944b4ee2d0591eeaf7bae5a265236a8fcbc91 Mon Sep 17 00:00:00 2001
From: 84702473 <84702473@qq.com>
Date: 星期六, 11 三月 2023 00:04:04 +0800
Subject: [PATCH] 修复拖拽的相关BUG
---
src/views/exam/paper/values.vue | 146 +++++++++++++++++++++++++++---------------------
1 files changed, 82 insertions(+), 64 deletions(-)
diff --git a/src/views/exam/paper/values.vue b/src/views/exam/paper/values.vue
index 40de040..fcfa5c4 100644
--- a/src/views/exam/paper/values.vue
+++ b/src/views/exam/paper/values.vue
@@ -74,8 +74,7 @@
<div class="inlinediv">
<div v-for="(question,index2) in questionItems" class="mullinediv-item"
v-if="getStep2StepItem(step2SubStep).itemOrder == question.subjectId">
- <el-image :ref="'q2SelectImg'+question.id" :src="question.imgUrl" lazy
- :preview-src-list="[question.imgUrl]"></el-image>
+ <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)">
@@ -116,11 +115,12 @@
<div style="padding: 0 10px;">{{$t('values_pic_tmpArea')}}</div>
<draggable animation="300" class="pic-tmparea-div"
style="background-color: #f5f7fa;border: 1px solid gray;padding: 10px;width: 50%;"
- :list="step3EWEIArea[0]" group="article" @start="step3TmpAreaStart"
- @end="step3MoveFromTmpAreaEnd">
+ :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"
- :qId="q.id">
- <el-image :src="q.imgUrl" lazy :preview-src-list="[q.imgUrl]" fit="fill"></el-image>
+ :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;"
@@ -141,19 +141,21 @@
<div class="mul-inlinediv" v-for="item in step2ScoreRanges">
<div class="mul-inlinediv-row">
- <draggable animation="300" :class="item.itemOrder"
+ <draggable animation="300" classa="pic-eweiarea-div" :class="'pic-eweiarea-div-'+item.itemOrder"
:list="step3EWEIArea[item.itemOrder]"
- :options="{group:{name:'article'}}" filter=".undraggable"
- @end="step3MoveToTmpAreaEnd" :scoreRangeId="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" :qId="q.id">
- <el-image :src="q.imgUrl" lazy :preview-src-list="[q.imgUrl]" v-if="q.imgUrl">
+ 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 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>
@@ -692,27 +694,65 @@
}
console.log('buildStep3EWEIArea', this.step3EWEIArea)
},
-
- step3TmpAreaStart(ev) {
- //console.log('step3TmpAreaStart', ev)
+ addStep3EWEIArea(index,question){
+ //console.log('addStep3EWEIArea',index,question)
+ this.step3EWEIArea[index].push(question)
+ this.$set(this.step3EWEIArea, index, this.step3EWEIArea[index])
},
- step3MoveFromTmpAreaEnd(ev) {
- //console.log('step3MoveFromTmpAreaEnd s', ev, ev.to)
- // let options,qId
- // qId = ev.item.attributes.qId.value
- // for(let p of ev.to){
- // if(this.isNotEmpty(p['options'])) {
- // options = p['options']
- // break
- // }
- // }
- // let scoreRangeId = options.scoreRangeId
+ 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
},
- step3MoveToTmpAreaEnd(ev) {
- //console.log('step3MoveToTmpAreaEnd')
- //let qId = ev.item.attributes.qId.value
- //console.log('step3MoveToTmpAreaEnd end', this.step3EWEIArea)
+ 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() {
@@ -1013,24 +1053,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
@@ -1154,8 +1177,8 @@
answerItem.startTime = ''
}
answerItem.completed = true
- answerItem.content = this.getContentByQuestionId(answerItem
- .questionId) //this.getLikeTypeByScoreRangeItemOrder(answerItem.subjectId)
+ answerItem.content = this.getContentByQuestionId(answerItem.questionId)
+ //this.getLikeTypeByScoreRangeItemOrder(answerItem.subjectId)
answerItem.questionReport = {
questionOrder: answerItem.questionId,
questionTitle: answerItem.title,
@@ -1173,7 +1196,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)
@@ -1204,29 +1227,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')
@@ -1293,8 +1315,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: {
@@ -1307,8 +1327,7 @@
},
isForFinish(i) {
return false
- return i === this.answer.answerItems.length - 1 && (this.answer.answerItems[i].content !== null && this
- .answer.answerItems[i].content !== '')
+ //return i === this.answer.answerItems.length - 1 && (this.answer.answerItems[i].content !== null && this.answer.answerItems[i].content !== '')
},
isDiffPartOrder: function() {
let _this = this
@@ -1323,7 +1342,6 @@
...mapMutations('user', ['setLangFlag'])
},
computed: {
- ...mapGetters('enumItem', ['enumFormat']),
...mapState('enumItem', {
doCompletedTag: state => state.exam.question.answer.doCompletedTag
}),
--
Gitblit v1.9.1