psychological-competence/src/views/CognitiveAbilityTask/MMSE3.vue

<template>
  <div class="activeTask">
    <div style="float: right; padding: 20px 20px 0px 20px" @click.stop="screen()">
      <img src="../../assets/small-big.png" alt="" />
    </div>
    <el-card style="
        margin: 75px auto 0px;
        padding: 20px 50px;
        width: 80%;
        border-radius: 12px;
        background: rgba(255, 255, 255, 0.41);
      ">
      <p>
        {{ questionList[current].question }}
      </p>
      <div class="drawCnt">
        <img v-if="questionList[current].img != ''" :src="questionList[current].img" alt=""
          :class="{ mr50: current == 19 }" />
        <drawing-board ref="drawingBoard" v-if="current == 19" @canvasDown="canvasDownHandle"
          @canvasMove="canvasMoveHandle" @canvasUp="canvasUpHandle" @setColor="setColorHandle"
          @controlCanvas="controlCanvasHandle"></drawing-board>
      </div>
      <div class="answerGroup" style="text-align: center">
        <el-radio-group v-model="questionList[current].userAnswer" @change="answerHandle">
          <el-radio v-for="(item, index) in questionList[current].answerList"
                    :key="index"
                    :label="item.value">
            {{item.name }}
          </el-radio>
        </el-radio-group>
      </div>
      <el-row style="text-align: center; margin-top: 30px">
        <el-button :disabled="current <= 0" type="success" size="small" @click="preQuestion">上一题</el-button>
        <el-button :disabled="current >= 19" type="success" size="small" @click="nextQuestion">下一题</el-button>
      </el-row>
    </el-card>
  </div>
</template>

<script>
import DrawingBoard from "@/components/drawingBoard";
import { oSessionStorage } from "@/utils/utils";
import screenfull from "screenfull";
import drawingBoard from "../../components/drawingBoard.vue";

export default {
  components: { drawingBoard },
  name: "MMSE3",
  comments: {
    DrawingBoard,
  },
  data() {
    return {
      current: 0,
      flag: 1,
      valueSum: 0,
      userId: "",
      result: {},
      radio1: "doc",
      dialogTableVisible: false,
      questionList: [
        {
          question: "今年是哪一年？",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "现在是什么季节？",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "现在是几月份？",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "今天是星期几？",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "今天是几号？",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "这里是哪个市(省)？",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "这里是什么区(县)？",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "这里是什么街道(乡)？",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "这儿是什么地方？",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "我们现在是在第几层楼？",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question:
            "现在我要说出三样东西的名称，在我讲完之后，请您重复说一遍并记住，因为我等一下要再问您的。",
          answerList: [
            { value: 0, name: "0分" },
            { value: 1, name: "1分" },
            { value: 2, name: "2分" },
            { value: 3, name: "3分" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "现在请您算一算100减7得多少，然后从所得的数目再减去7，如此一直计算下去。把每一个答案都告诉我，直到我说“停”为止。",
          answerList: [
            { value: 0, name: "0分" },
            { value: 1, name: "1分" },
            { value: 2, name: "2分" },
            { value: 3, name: "3分" },
            { value: 4, name: "4分" },
            { value: 5, name: "5分" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "现在请您说出，刚才我要您记住的三样东西是什么？（各1分共3分）",
          answerList: [
            { value: 0, name: "0分" },
            { value: 1, name: "1分" },
            { value: 2, name: "2分" },
            { value: 3, name: "3分" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "请问这是什么？",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: require("../../assets/congnitiveAblitity/watch.jpg"),
          userAnswer: -1,
        },
        {
          question: "请问这是什么？",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: require("../../assets/congnitiveAblitity/pencil.jpg"),
          userAnswer: -1,
        },
        {
          question: "现在我要说一句话，请您清楚地重复一遍。这句话是:四十四只石狮子。",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "我给您一张纸，请按我说的做:请用右手拿这张纸，再用双手把它对折，然后将纸放在您的大腿上。（每项1分共3分）",
          answerList: [
            { value: 0, name: "0分" },
            { value: 1, name: "1分" },
            { value: 2, name: "2分" },
            { value: 3, name: "3分" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "请您念一念这句话，并按它的意思去做。“请您闭上眼睛”",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "请您写一句完整的、有意义的句子。（要求:句子必须有主语、谓语，有意义）",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: "",
          userAnswer: -1,
        },
        {
          question: "请您照着这个图案把它画下来。",
          answerList: [
            { value: 0, name: "错误" },
            { value: 1, name: "正确" },
          ],
          img: require("../../assets/congnitiveAblitity/polygon.jpg"),
          userAnswer: -1,
        },
      ],
    };
  },
  created() {
    this.subjectInfo = JSON.parse(oSessionStorage.getItem("subjectInfo"));
    this.userId = sessionStorage.getItem("b80bb7740288fda1f201890375a60c8f");
    this.taskId = this.$route.query.taskId;
    screenfull.request();
  },
  methods: {
    screen() {
      screenfull.toggle();
    },
    // 选择答案
    answerHandle() {
      if (this.current < 19) {
        this.current++;
      } else {
        this.computeSum();
      }
    },
    // 上一题
    preQuestion() {
      this.current--;
    },
    // 下一题
    nextQuestion() {
      if (this.questionList[this.current].userAnswer == -1) {
        this.$message.warning("请先完成当前题目");
      } else {
        this.current++;
      }
    },
    computeSum() {
      if (
        sessionStorage.getItem("b80bb7740288fda1f201890375a60c8f") == "" ||
        sessionStorage.getItem("b80bb7740288fda1f201890375a60c8f") == null
      ) {
        this.$message.error("请先登录！");
        return;
      } else {
        let valueOne = 0;
        let valueTwo = 0;
        let valueSix = 0;
        for (var item in this.questionList) {
          if (this.questionList[item].userAnswer == -1) {
            this.questionList[item].userAnswer = 0;
          }

          if (item < 5) {
            valueOne += this.questionList[item].userAnswer;
          }

          if (item >= 5 && item < 10) {
            valueTwo += this.questionList[item].userAnswer;
          }

          if (item >= 13 && item < 15) {
            valueSix += this.questionList[item].userAnswer;
          }

          this.valueSum += this.questionList[item].userAnswer;
        }

        this.result = {
          valueSum: this.valueSum,
          userId: this.userId,
          testPlanId: this.$route.query.testPlanId || "",
          data: [
            {
              key: "1",
              value: valueOne.toString(),
            },
            {
              key: "2",
              value: valueTwo.toString(),
            },
            {
              key: "3",
              value: this.questionList[10].userAnswer,
            },
            {
              key: "4",
              value: this.questionList[11].userAnswer,
            },
            {
              key: "5",
              value: this.questionList[12].userAnswer,
            },
            {
              key: "6",
              value: valueSix,
            },
            {
              key: "7",
              value: this.questionList[15].userAnswer,
            },
            {
              key: "8",
              value: this.questionList[16].userAnswer,
            },
            {
              key: "9",
              value: this.questionList[17].userAnswer,
            },
            {
              key: "10",
              value: this.questionList[18].userAnswer,
            },
            {
              key: "11",
              value: this.questionList[19].userAnswer,
            },
          ],
        };

        console.log(this.result);

        this.$http.post(`/cognize/MMSEV3`, this.result, (response) => {
          if (response.code == 200) {
            screenfull.exit();
            this.$message({
              message: "测试结束！",
              type: "success",
            });
            this.goTestResult(response.data)
          } else {
            this.$message({
              message: "保存失败！服务器异常",
              type: "error",
            });
          }
        });
      }
    },
    // 禁止操作
    disableHandle() {
      this.$message.warning("您暂时不需要操作，请耐心等待");
    },
  },
  destroyed() {
    clearInterval(this.t);
  },
};
</script>

<style scoped>
.activeTask {
  background: url(../../assets/congnitiveAblitity/zhixing.png) no-repeat center;
  background-size: cover;
  /* background: black; */
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow-y: scroll;
  touch-action: none;
}

.contral_group {
  position: fixed;
  bottom: 5%;
  left: 15%;
  transform: translateX(-50%);
  z-index: 100;
}

.cover {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: auto;
  z-index: 99;
  background: #ddd;
  opacity: 0.2;
}

.answerGroup {
  text-align: center;
  padding: 20px 10px;
}

.drawCnt {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 20px;
}

.mr50 {
  margin-right: 50px;
}
</style>