测试完成

WXL (wul)

2026-05-08 f9902f7a3b79d22bde9f199263ac36de26816470

 src/views/outsideChainwtnew.vue

@@ -1,160 +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>
                </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 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>
@@ -172,6 +189,7 @@
export default {
  data() {
    return {
      loading: true,
      taskid: 355,
      patid: 265823,
      kcb: "",
@@ -179,6 +197,7 @@
      isabnormal: 0,
      taskname: "",
      questionList: [],
      param6: null,
      jsy: null,
      dialogVisible: false,
      Endornot: true,
@@ -231,6 +250,7 @@
            res.data.param3,
            res.data.param5
          );
          this.param6 = res.data.param6;
        }
      });
    },
@@ -250,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 =
@@ -259,8 +281,8 @@
      // 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.result;
            this.accomplish = res.data.submit;
@@ -272,6 +294,8 @@
                  item.scriptResult = item.scriptResult.split("&");
                }
              });
              this.loading = false;

              return;
            } else {
              this.getExternalfollowup();
@@ -279,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;
@@ -297,9 +321,12 @@
                item.scriptResult = [];
              }
            });
            this.loading = false;
          }
        }
      );
        })
        .finally(() => {
          this.loading = false;
        });
    },
    // 加密函数
    encrypt(txt) {
@@ -319,6 +346,7 @@
      let form = {
        param1: this.taskid,
        param2: this.patid,
        param6: this.param6,
        excep: this.excep,
        isabnormal: this.isabnormal,
        serviceSubtaskDetailList: [],
@@ -349,6 +377,7 @@
      let form = {
        param1: this.taskid,
        param2: this.patid,
        param6: this.param6,
        svyTaskTemplateScriptVOS: [],
      };
      const arr = structuredClone(this.questionList);
@@ -846,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>