测试完成

WXL (wul)

2026-05-08 f9902f7a3b79d22bde9f199263ac36de26816470

 src/views/outsideChainwtnew.vue

@@ -1,112 +1,177 @@
<template>
  <div class="questionnaire-optimized">
    <div class="content-wrapper" v-if="!accomplish">
      <div class="questionnaire-container">
        <!-- 问卷标题区域 -->
        <div class="questionnaire-header">
          <h1 class="questionnaire-title">{{ taskname ? taskname : "问卷" }}</h1>
          <div class="questionnaire-description">
            {{ kcb ? kcb : "亲爱的患者-家属，我们是医院的医护人员，为了更好地了解您的康复情况，请您抽一点宝贵时间，完成这份随访问卷。" }}
          </div>
        </div>

        <el-divider class="custom-divider"></el-divider>

        <!-- 问卷题目区域 -->
        <div class="questions-section">
          <div
            class="question-item"
            v-for="(item, index) in visibleQuestions"
            :key="item.id"
            :class="{ 'has-warning': item.prompt && (item.scriptResult && (item.scriptType !== 2 || item.scriptResult.length > 0)) }"
          >
            <!-- 题目题干 -->
            <div class="question-stem">
              <span class="question-number">{{ getVisibleQuestionIndex(index) }}.</span>
              <span class="question-text">{{ item.scriptContent }}</span>
              <span class="question-type-tag">
                {{ item.scriptType === 1 ? '[单选]' : item.scriptType === 2 ? '[多选]' : '[问答]' }}
              </span>
            </div>

            <!-- 单选题目 -->
            <div class="question-options" v-if="item.scriptType == 1 && !item.ishide">
              <el-radio-group class="options-group" v-model="item.scriptResult">
                <el-radio
                  v-for="(option, optionIndex) in item.svyTaskTemplateTargetoptions"
                  :key="optionIndex"
                  :label="option.optioncontent"
                  :class="{
                    'abnormal-option': option.isabnormal && item.scriptResult == option.optioncontent
                  }"
                  @click.native.prevent="handleRadioToggle(item, index, item.svyTaskTemplateTargetoptions, option.optioncontent)"
                  class="option-radio"
                >
                  <span class="option-text">{{ option.optioncontent }}</span>
                  <span v-if="option.isabnormal" class="abnormal-indicator">*</span>
                </el-radio>
              </el-radio-group>
            </div>

            <!-- 多选题目 -->
            <div class="question-options" v-if="item.scriptType == 2">
              <el-checkbox-group class="options-group" v-model="item.scriptResult">
                <el-checkbox
                  v-for="(option, optionIndex) in item.svyTaskTemplateTargetoptions"
                  :key="optionIndex"
                  :label="option.optioncontent"
                  :class="{
                    'abnormal-option': option.isabnormal
                  }"
                  @change="$forceUpdate()"
                  class="option-checkbox"
                >
                  <span class="option-text">{{ option.optioncontent }}</span>
                  <span v-if="option.isabnormal" class="abnormal-indicator">*</span>
                </el-checkbox>
              </el-checkbox-group>
            </div>

            <!-- 填空题目 -->
            <div class="question-input" v-if="item.scriptType == 4">
              <el-input
                type="textarea"
                :rows="3"
                placeholder="请输入您的回答"
                v-model="item.scriptResult"
                clearable
                class="answer-textarea"
              ></el-input>
            </div>

            <!-- 提示信息 -->
            <div class="question-warning" v-show="item.prompt && item.scriptResult && (item.scriptType !== 2 || item.scriptResult.length > 0)">
              <el-alert :title="item.prompt" type="warning" :closable="false" class="warning-alert"></el-alert>
            </div>
          </div>
        </div>

        <!-- 提交按钮 -->
        <div class="submit-section">
          <el-button
            type="primary"
            @click="cache(true)"
            class="submit-button"
          >
            提交问卷
          </el-button>
        </div>
    <div v-if="loading" class="loading-container">
      <div class="loading-content">
        <i class="el-icon-loading loading-icon"></i>
        <div class="loading-text">问卷加载中，请稍候...</div>
      </div>
    </div>

    <!-- 完成页面 -->
    <div class="completion-page" v-else>
      <div class="completion-content">
        <div class="completion-icon">✓</div>
        <h2 class="completion-title">感谢您的配合!</h2>
        <p class="completion-message">
          {{ jsy ? jsy : "生活上要劳逸结合，注意休息和营养，适当锻炼，戒烟限酒，保持心情舒畅，定期复诊。那本次回访就到这里，祝您身体健康！" }}
        </p>
    <!-- 正常内容 -->
    <div v-else>
      <div class="content-wrapper" v-if="!accomplish">
        <div class="questionnaire-container">
          <!-- 问卷标题区域 -->
          <div class="questionnaire-header">
            <h1 class="questionnaire-title">
              {{ taskname ? taskname : "问卷" }}
            </h1>
            <div class="questionnaire-description">
              {{
                kcb
                  ? kcb
                  : "亲爱的患者-家属，我们是医院的医护人员，为了更好地了解您的康复情况，请您抽一点宝贵时间，完成这份随访问卷。"
              }}
            </div>
          </div>

          <el-divider class="custom-divider"></el-divider>

          <!-- 问卷题目区域 -->
          <div class="questions-section">
            <div
              class="question-item"
              v-for="(item, index) in visibleQuestions"
              :key="item.id"
              :class="{
                'has-warning':
                  item.prompt &&
                  item.scriptResult &&
                  (item.scriptType !== 2 || item.scriptResult.length > 0),
              }"
            >
              <!-- 题目题干 -->
              <div class="question-stem">
                <span class="question-number"
                  >{{ getVisibleQuestionIndex(index) }}.</span
                >
                <span class="question-text">{{ item.scriptContent }}</span>
                <span class="question-type-tag">
                  {{
                    item.scriptType === 1
                      ? "[单选]"
                      : item.scriptType === 2
                      ? "[多选]"
                      : "[问答]"
                  }}
                </span>
              </div>

              <!-- 单选题目 -->
              <div
                class="question-options"
                v-if="item.scriptType == 1 && !item.ishide"
              >
                <el-radio-group
                  class="options-group"
                  v-model="item.scriptResult"
                >
                  <el-radio
                    v-for="(
                      option, optionIndex
                    ) in item.svyTaskTemplateTargetoptions"
                    :key="optionIndex"
                    :label="option.optioncontent"
                    :class="{
                      'abnormal-option':
                        option.isabnormal &&
                        item.scriptResult == option.optioncontent,
                    }"
                    @click.native.prevent="
                      handleRadioToggle(
                        item,
                        index,
                        item.svyTaskTemplateTargetoptions,
                        option.optioncontent
                      )
                    "
                    class="option-radio"
                  >
                    <span class="option-text">{{ option.optioncontent }}</span>
                  </el-radio>
                </el-radio-group>
              </div>

              <!-- 多选题目 -->
              <div class="question-options" v-if="item.scriptType == 2">
                <el-checkbox-group
                  class="options-group"
                  v-model="item.scriptResult"
                >
                  <el-checkbox
                    v-for="(
                      option, optionIndex
                    ) in item.svyTaskTemplateTargetoptions"
                    :key="optionIndex"
                    :label="option.optioncontent"
                    :class="{
                      'abnormal-option': option.isabnormal,
                    }"
                    @change="$forceUpdate()"
                    class="option-checkbox"
                  >
                    <span class="option-text">{{ option.optioncontent }}</span>
                  </el-checkbox>
                </el-checkbox-group>
              </div>

              <!-- 填空题目 -->
              <div class="question-input" v-if="item.scriptType == 4">
                <el-input
                  type="textarea"
                  :rows="3"
                  placeholder="请输入您的回答"
                  v-model="item.scriptResult"
                  clearable
                  class="answer-textarea"
                ></el-input>
              </div>

              <!-- 提示信息 -->
              <div
                class="question-warning"
                v-show="
                  item.prompt &&
                  item.scriptResult &&
                  (item.scriptType !== 2 || item.scriptResult.length > 0)
                "
              >
                <el-alert
                  :title="item.prompt"
                  type="warning"
                  :closable="false"
                  class="warning-alert"
                ></el-alert>
              </div>
            </div>
          </div>

          <!-- 提交按钮 -->
          <div class="submit-section">
            <el-button
              type="primary"
              @click="cache(true)"
              class="submit-button"
            >
              提交问卷
            </el-button>
          </div>
        </div>
      </div>

      <!-- 完成页面 -->
      <div class="completion-page" v-else>
        <div class="completion-content">
          <div class="completion-icon">✓</div>
          <h2 class="completion-title">感谢您的配合!</h2>
          <p class="completion-message">
            {{
              jsy
                ? jsy
                : "生活上要劳逸结合，注意休息和营养，适当锻炼，戒烟限酒，保持心情舒畅，定期复诊。那本次回访就到这里，祝您身体健康！"
            }}
          </p>
        </div>
      </div>
    </div>
  </div>
@@ -124,12 +189,15 @@
export default {
  data() {
    return {
      loading: true,
      taskid: 355,
      patid: 265823,
      kcb: "",
      excep: "",
      excep: 0,
      isabnormal: 0,
      taskname: "",
      questionList: [],
      param6: null,
      jsy: null,
      dialogVisible: false,
      Endornot: true,
@@ -159,6 +227,9 @@
  computed: {
    // 计算属性：获取所有可见的题目
    visibleQuestions() {
      if (!Array.isArray(this.questionList)) {
        return [];
      }
      return this.questionList.filter((question) => !question.ishide);
    },
  },
@@ -179,6 +250,7 @@
            res.data.param3,
            res.data.param5
          );
          this.param6 = res.data.param6;
        }
      });
    },
@@ -198,6 +270,8 @@
      this.taskid = decodeURIComponent(param1);
      this.patid = decodeURIComponent(param2);
      this.taskname = decodeURIComponent(param3);
      this.loading = true;

      // let taskid =
      //   "OFp7tn/B6x7IzKJetvGWHdSWBj7msRlnlj6am9dyuHTH6sEt4uBbVCUXs5kcF/e4O2W6vqHf2Bz9K3/evbYDmw==";
      // let patid =
@@ -207,10 +281,10 @@
      // let taskids = this.encrypt(this.taskid);
      // let patids = this.encrypt(this.patid);
      // 先取缓存
      getCachequestionnaire({ param1: this.taskid, param2: this.patid }).then(
        (res) => {
      getCachequestionnaire({ param1: this.taskid, param2: this.patid })
        .then((res) => {
          if (res.code == 200) {
            this.questionList = res.data;
            this.questionList = res.data.result;
            this.accomplish = res.data.submit;
            if (this.questionList[0]) {
              this.questionList.forEach((item) => {
@@ -220,6 +294,8 @@
                  item.scriptResult = item.scriptResult.split("&");
                }
              });
              this.loading = false;

              return;
            } else {
              this.getExternalfollowup();
@@ -227,13 +303,13 @@
          } else {
            this.getExternalfollowup();
          }
        }
      );
        })
        .finally(() => {});
    },
    // 获取数据
    getExternalfollowup() {
      getExternalfollowup({ param1: this.taskid, param2: this.patid }).then(
        (res) => {
      getExternalfollowup({ param1: this.taskid, param2: this.patid })
        .then((res) => {
          if (res.code == 200) {
            this.questionList = res.data.script;
            this.jsy = res.data.jsy;
@@ -245,9 +321,12 @@
                item.scriptResult = [];
              }
            });
            this.loading = false;
          }
        }
      );
        })
        .finally(() => {
          this.loading = false;
        });
    },
    // 加密函数
    encrypt(txt) {
@@ -267,10 +346,13 @@
      let form = {
        param1: this.taskid,
        param2: this.patid,
        param6: this.param6,
        excep: this.excep,
        isabnormal: this.excep,
        isabnormal: this.isabnormal,
        serviceSubtaskDetailList: [],
      };
      console.log(form.isabnormal, "formisabnormal");

      const arr = structuredClone(this.questionList);
      // arr.forEach((item) => {
      //   item.asrtext = JSON.stringify(item.scriptResult);
@@ -295,10 +377,13 @@
      let form = {
        param1: this.taskid,
        param2: this.patid,
        param6: this.param6,
        svyTaskTemplateScriptVOS: [],
      };
      const arr = structuredClone(this.questionList);
      console.log(arr, "srr");
      arr.forEach((item) => {
        item.ishide = item.ishide ? 1 : 0;
      });
      arr.forEach((item, index) => {
        if (item.scriptType == 1 && item.scriptResult) {
          var obj = item.svyTaskTemplateTargetoptions.find(
@@ -314,11 +399,13 @@
            item.sendTaskids = String(obj.sendTaskid).split(",");
          }
          if (obj) {
            if (obj.isabnormal) {
              console.log(obj.isabnormal);
              form.excep = obj.isabnormal;
            form.excep = obj.isabnormal;
            form.isabnormal = obj.isabnormal;
            if (this.isabnormal != 1 && obj.isabnormal) {
              this.excep = obj.isabnormal;
              this.isabnormal = obj.isabnormal;
            }
            console.log(obj.isabnormal);
          }
        }
      });
@@ -352,7 +439,7 @@
      // 原有的处理逻辑
      if (questionItem.scriptResult === optionValue) {
        questionItem.scriptResult = "";
        questionItem.isabnormal = false;
        questionItem.isabnormal = 0;
        questionItem.showAppendInput = false;
      } else {
        questionItem.scriptResult = optionValue;
@@ -375,15 +462,15 @@
      const selectedOptionObj = options.find(
        (item) => item.optioncontent == selectedOption
      );
      if (selectedOption) {
      if (selectedOptionObj) {
        this.questionList[questionIndex].nextScriptno =
          selectedOption.nextQuestion;
        this.questionList[questionIndex].score = selectedOption.score;
        this.questionList[questionIndex].prompt = selectedOption.prompt;
          selectedOptionObj.nextQuestion;
        this.questionList[questionIndex].score = selectedOptionObj.score;
        this.questionList[questionIndex].prompt = selectedOptionObj.prompt;
      }
      // 处理异常状态高亮
      this.questionList[questionIndex].isabnormal =
        !!selectedOptionObj.isabnormal;
        selectedOptionObj.isabnormal;
      // 处理附加输入框显示

      this.questionList[questionIndex].showAppendInput =
@@ -416,6 +503,8 @@
        } else {
          // 正常跳转逻辑
          const nextQuestionIndex = selectedOptionObj.nextQuestion - 1;
          console.log(nextQuestionIndex, 4);
          console.log(selectedOptionObj);

          this.questionList = this.questionList.map((item, index) => {
            // 保留当前题目之前的隐藏状态
@@ -786,4 +875,39 @@
    font-size: 60px;
  }
}
.loading-container {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 70vh;
}

.loading-content {
  text-align: center;
  padding: 40px;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
}

.loading-icon {
  font-size: 40px;
  color: #409eff;
  margin-bottom: 15px;
  animation: rotating 2s linear infinite;
}

.loading-text {
  font-size: 16px;
  color: #606266;
}

@keyframes rotating {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
</style>