优化

84702473

2023-03-07 c4ae31671404ac52c0c9316a97de2bfa72fadbaa

优化

 src/assets/exam-paper/good.png

 src/assets/exam-paper/no.png

 src/assets/exam-paper/nogood.png

 src/assets/exam-paper/question.png

 src/assets/exam-paper/scale.png

 src/assets/exam-paper/yes.png

 src/lang/en.js

@@ -57,6 +57,7 @@
    values_finishValuesInfo:'The test is over! All your option data have been uploaded to the server and saved. You can close the browser and exit the answer interface.',
    values_nextStepTips_del_unnecessary:'Please delete redundant selections',
    values_nextStepTips_add_enough:'Please add enough choices',
    values_nextStepTips_choices_all:'Please make all choices',
    values_title:'Pre-Sort Your Responses',
    values_title_description:'For each statement,click the pictures that aligns most with your view.',
    next:'Next Step',

 src/lang/zh.js

@@ -57,6 +57,7 @@
    values_finishValuesInfo: '测试结束！您的所有选项数据已经上传至服务器，并已保存好。您可以关闭浏览器，退出答题界面。',
    values_nextStepTips_del_unnecessary:'请删除多余的选择',
    values_nextStepTips_add_enough:'请添加足够的选择',
    values_nextStepTips_choices_all:'请做出所有的选择',
    values_title:'预先排序您的回答',
    values_title_description:'对于每个语句，单击与视图最对齐的图标。',
    next:'下一步',

 src/layout/indexold.vue

@@ -4,7 +4,7 @@
      <div class="head-user">
        <el-dropdown trigger="click" placement="bottom">
          <el-badge :is-dot="messageCount!==0" >
            <el-avatar  class="el-dropdown-avatar" size="medium"  :s0rc="userInfo.imagePath === null ? require('@/assets/avatar.png') : userInfo.imagePath"></el-avatar>
            <el-avatar  class="el-dropdown-avatar" size="medium"  :src="userInfo.imagePath === null ? require('@/assets/avatar.png') : userInfo.imagePath"></el-avatar>
          </el-badge>
          <el-dropdown-menu slot="dropdown">
            <el-dropdown-item @click.native="$router.push({path:'/user/index'})">个人中心</el-dropdown-item>

 src/views/exam/paper/values.vue

@@ -14,12 +14,23 @@
                        {{$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.analyze)">
                        <div style="display: flex; justify-content: flex-end;margin-right: -20px;">
                            <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 +41,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"
@@ -59,14 +70,16 @@
                            / {{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" 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/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>
@@ -74,19 +87,20 @@
                        <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"
                                <div v-for="(question,index3) 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> -->
                                    <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>
                            <div class="mullinediv" style="" v-if="sumUnSelectedNum()<=0">
                            <div class="mullinediv" style="" v-if="sumStep2UnSelectedNum()<=0">
                                {{$t('values_no_select')}}
                            </div>
                        </div>
@@ -95,6 +109,10 @@
        </el-container>
        <el-container class="app-item-contain step3" v-if="step === 'step3'">
            <el-main class="">
                <div style="display: flex;justify-content: flex-end;">
                    <el-button style="margin-top: 12px;" @click="step3_commit" :disabled="submitDisable">
                        {{$t('commit')}}</el-button>
                </div>
                <div style="display:flex;">
                    <div style="display: inline-block;min-width: 110px;text-align: right;">
                        <div class="mul-inlinediv-row mul-inlinediv-lineheight"
@@ -123,10 +141,7 @@
                        </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>
        <el-row class="do-exam-title footer">
@@ -542,6 +557,12 @@
                //console.log('step1_start...',this.questionItems)
            },
            step1_next() {
                let _this = this
                let c = this.sumStep1UnSelectedNum()
                if(c > 0){
                    this.$message.error(_this.$t('values_nextStepTips_choices_all'))
                    return
                }
                this.step = "step2"
                this.sortQuestions()
                this.caculateScoreRangeSelectedById(this.getStep2StepItem(this.step2SubStep).itemOrder)
@@ -554,7 +575,7 @@
            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()

@@ -581,7 +602,7 @@
                this.resetQuestionItemsValueById(qid, "subjectId", 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.caculateScoreRangeSelectedById(sid, 1)
@@ -612,10 +633,19 @@
                    }
                }
            },
            sumUnSelectedNum() {
            sumStep2UnSelectedNum() {
                let count = 0
                for (let item of this.questionItems) {
                    if (this.isNull(item['subjectId'])) {
                        count = count + 1
                    }
                }
                return count
            },
            sumStep1UnSelectedNum() {
                let count = 0
                for (let item of this.questionItems) {
                    if (this.isNull(item['analyze'])) {
                        count = count + 1
                    }
                }
@@ -719,6 +749,11 @@
                }
                //console.log('resetQuestionItems...',id,key,value,this.questionItems)
            },
            /**
             * 计算步骤id的已选择数量
             * @param {Object} id
             * @param {Object} value
             */
            caculateScoreRangeSelectedById(id, value) {
                let sum = 0
                for (let item of this.questionItems) {
@@ -1421,6 +1456,9 @@
                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'])
@@ -1467,7 +1505,7 @@
        overflow-y: hidden;
        overflow-x: auto;
        white-space: nowrap;
        border: 1px solid gray;
        //border: 1px solid gray;
        padding: 10px 0;
        width: fit-content;
    }
@@ -1493,14 +1531,14 @@
        overflow-y: hidden;
        overflow-x: auto;
        white-space: nowrap;
        min-height: 180px;
        min-height: 360px;
        display: flex;
    }

    .inlinediv div {
        display: inline-table;
        vertical-align: top;
        width: 100px;
        //width: 360px;
        margin: auto 2px;
    }

@@ -1510,21 +1548,26 @@

    .mullinediv-item {
        display: flex;
        display:
            inline-block;
        width: 180px;
        display:inline-block;
        width: 360px;
        margin: 5px 4px;
        padding: 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 {}

    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 {