测试完成

WXL

2024-09-11 b5a56d53e44c426fa188ba3e4e1db3eb779e2fd9

 src/views/outsideChainwt.vue

@@ -4,8 +4,13 @@
      <div class="preview-left">
        <div class="toptitle">
          <div class="title">{{ taskname ? taskname : "问卷" }}</div>
          <div style="font-size: 22px; margin-bottom: 20px; line-height: 1.5;">
            {{ kcb }}
          <div style="font-size: 22px; margin-bottom: 20px; line-height: 1.5">
            {{
              kcb
                ? kcb
                : "亲爱的患者-家属，您好！我们是浙中医大二院的医护人员，为了更好地了解您的康复情况，请您抽一点宝贵时间，完成这份随访问卷。"
            }}
            <!-- 亲爱的患者/家属您好，为了更好的了解您出院后的康复情况，给您适当及时的健康指导，请您抽一点宝贵时间，完成这份出院随访问卷调查。 -->
          </div>
        </div>
        <el-divider></el-divider>
@@ -17,21 +22,21 @@
        >
          <div class="scriptTopic-dev" :key="index" v-if="item.scriptType == 1">
            <div class="dev-text">
              {{ index + 1 }}、<span>{{ item.scriptContent }} <span style="color: #3BA2F7;">[单选]</span></span>
              {{ index + 1 }}、<span style="line-height: 1.5"
                >{{ item.scriptContent }}
                <span style="color: #3ba2f7">[单选]</span></span
              >
            </div>
            <div class="dev-xx">
              <el-radio-group
                class="radio-group"
                class="custom-radio"
                v-model="item.scriptResult"
                @change="handleOptionChange($event, index, item)"
              >
                <el-radio
                  :class="{
                    'radio-option': true,
                    'radio-option-first': index === 0,
                  }"
                  border
                  v-for="(items, index) in item.svyLibTemplateTargetoptions"
                  :class="items.isabnormal ? 'red-star' : ''"
                  :key="index"
                  :label="items.optioncontent"
                  >{{ items.optioncontent }}</el-radio
@@ -45,22 +50,22 @@
          <!-- 多选 -->
          <div class="scriptTopic-dev" :key="index" v-if="item.scriptType == 2">
            <div class="dev-text">
              {{ index + 1 }}、<span>{{ item.scriptContent }} <span style="color: #3BA2F7;">[多选]</span></span>
              {{ index + 1 }}、<span style="line-height: 1.5"
                >{{ item.scriptContent }}
                <span style="color: #3ba2f7">[多选]</span></span
              >
            </div>
            <div class="dev-xx">
              <el-checkbox-group
                class="radio-group"
                class="custom-radio"
                v-model="item.scriptResult"
                @change="updateScore($event, index, item)"
              >
                <el-checkbox
                  :class="{
                    'radio-option': true,
                    'radio-option-first': index === 0,
                  }"
                  border
                  @change="$forceUpdate()"
                  v-for="(items, indexs) in item.svyLibTemplateTargetoptions"
                  :class="items.isabnormal ? 'red-star' : ''"
                  :key="indexs"
                  :label="items.optioncontent"
                >
@@ -75,12 +80,15 @@
          <!-- 填空 -->
          <div class="scriptTopic-dev" :key="index" v-if="item.scriptType == 4">
            <div class="dev-text">
              {{ index + 1 }}、<span>{{ item.scriptContent }}<span style="color: #3BA2F7;">[问答]</span></span>
              {{ index + 1 }}、<span style="line-height: 1.5"
                >{{ item.scriptContent
                }}<span style="color: #3ba2f7">[问答]</span></span
              >
            </div>
            <div class="dev-xx">
              <el-input
                type="textarea"
                :rows="2"
                :rows="3"
                placeholder="请输入答案"
                v-model="item.scriptResult"
                clearable
@@ -90,14 +98,21 @@
          </div>
        </div>
        <div class="bottom-fixed">
          <el-button type="primary" style="width: 100%;" @click="cache(true)">提交问卷</el-button>
          <el-button
            type="primary"
            style="width: 80%; font-size: 20px"
            @click="cache(true)"
            >提交问卷</el-button
          >
        </div>
      </div>
    </div>
    <div class="CONTENT" v-else>
      <div class="preview-left" style="margin-top: 100px">
      <div class="preview-lefts">
        <div
          style="
            text-align: center;
            padding-top: 50px;
            font-size: 24px;
            color: #175997;
            font-weight: 600;
@@ -106,7 +121,13 @@
        >
          感谢您的配合!
        </div>
        <div style="font-size: 20px">{{ revisitAfter }}</div>
        <div style="font-size: 20px">
          {{
            jsy
              ? jsy
              : "生活上要劳逸结合，注意休息和营养，适当锻炼，戒烟限酒，保持心情舒畅，定期复诊。那本次回访就到这里，祝您身体健康！"
          }}
        </div>
      </div>
    </div>
    <!-- <el-dialog
@@ -114,7 +135,7 @@
      width="50%"
    >
      <div>
        <el-alert :title="revisitAfter" type="success"> </el-alert>
        <el-alert :title="jsy" type="success"> </el-alert>
      </div>
    </el-dialog> -->
  </div>
@@ -133,95 +154,95 @@
    return {
      taskid: 355,
      patid: 265823,
      kcb:'',
      kcb: "",
      questionList: [
        // {
        //   scriptType: 1,
        //   scriptContent: "您的年龄范围是？",
        //   scriptResult: null,
        //   svyLibTemplateTargetoptions: [
        //     { optioncontent: "18-25", value: "18-25" },
        //     { optioncontent: "26-35", value: "26-35" },
        //     { optioncontent: "36-45", value: "36-45" },
        //     { optioncontent: "46-55", value: "46-55" },
        //     { optioncontent: "56+", value: "56+" },
        //   ],
        //   required: true,
        // },
        // {
        //   scriptType: 1,
        //   scriptContent: "您的职业是什么？",
        //   scriptResult: null,
        //   svyLibTemplateTargetoptions: [
        //     { optioncontent: "学生", value: "student" },
        //     { optioncontent: "教师", value: "teacher" },
        //     { optioncontent: "工程师", value: "engineer" },
        //     { optioncontent: "医生", value: "doctor" },
        //     { optioncontent: "其他", value: "other" },
        //   ],
        //   required: false,
        // },
        // {
        //   scriptType: 2,
        //   scriptContent: "您感兴趣的活动有哪些？",
        //   scriptResult: [],
        //   svyLibTemplateTargetoptions: [
        //     { optioncontent: "旅游", value: "travel" },
        //     { optioncontent: "阅读", value: "reading" },
        //     { optioncontent: "运动", value: "sports" },
        //     { optioncontent: "音乐", value: "music" },
        //     { optioncontent: "电影", value: "movies" },
        //   ],
        //   required: false,
        // },
        // {
        //   scriptType: 1,
        //   scriptContent: "您的职业是什么？",
        //   scriptResult: null,
        //   svyLibTemplateTargetoptions: [
        //     { optioncontent: "学生", value: "student" },
        //     { optioncontent: "教师", value: "teacher" },
        //     { optioncontent: "工程师", value: "engineer" },
        //     { optioncontent: "医生", value: "doctor" },
        //     { optioncontent: "其他", value: "other" },
        //   ],
        //   required: false,
        // },
        // {
        //   scriptType: 1,
        //   scriptContent: "您的职业是什么？",
        //   scriptResult: null,
        //   svyLibTemplateTargetoptions: [
        //     { optioncontent: "学生", value: "student" },
        //     { optioncontent: "教师", value: "teacher" },
        //     { optioncontent: "工程师", value: "engineer" },
        //     { optioncontent: "医生", value: "doctor" },
        //     { optioncontent: "其他", value: "other" },
        //   ],
        //   required: false,
        // },
        // {
        //   scriptType: 1,
        //   scriptContent: "您的职业是什么？",
        //   scriptResult: null,
        //   svyLibTemplateTargetoptions: [
        //     { optioncontent: "学生", value: "student" },
        //     { optioncontent: "教师", value: "teacher" },
        //     { optioncontent: "工程师", value: "engineer" },
        //     { optioncontent: "医生", value: "doctor" },
        //     { optioncontent: "其他", value: "other" },
        //   ],
        //   required: false,
        // },
        // {
        //   scriptType: 4,
        //   scriptContent: "您的姓名是什么？",
        //   scriptResult: "name",
        //   required: true,
        //   scriptResult: null,
        // },
        {
          scriptType: 1,
          scriptContent: "您的年龄范围是？",
          scriptResult: null,
          svyLibTemplateTargetoptions: [
            { optioncontent: "18-25", value: "18-25", isabnormal: true },
            { optioncontent: "26-35", value: "26-35" },
            { optioncontent: "36-45", value: "36-45" },
            { optioncontent: "46-55", value: "46-55" },
            { optioncontent: "56+", value: "56+" },
      ],
      revisitAfter: null,
          required: true,
        },
        {
          scriptType: 1,
          scriptContent: "您的职业是什么？",
          scriptResult: null,
          svyLibTemplateTargetoptions: [
            { optioncontent: "学生", value: "student" },
            { optioncontent: "教师", value: "teacher" },
            { optioncontent: "工程师", value: "engineer" },
            { optioncontent: "医生", value: "doctor" },
            { optioncontent: "其他", value: "other" },
          ],
          required: false,
        },
        {
          scriptType: 2,
          scriptContent: "您感兴趣的活动有哪些？",
          scriptResult: [],
          svyLibTemplateTargetoptions: [
            { optioncontent: "旅游", value: "travel", isabnormal: true },
            { optioncontent: "阅读", value: "reading", isabnormal: true },
            { optioncontent: "运动", value: "sports", isabnormal: true },
            { optioncontent: "音乐", value: "music" },
            { optioncontent: "电影", value: "movies" },
          ],
          required: false,
        },
        {
          scriptType: 1,
          scriptContent: "您的职业是什么？",
          scriptResult: null,
          svyLibTemplateTargetoptions: [
            { optioncontent: "学生", value: "student" },
            { optioncontent: "教师", value: "teacher" },
            { optioncontent: "工程师", value: "engineer" },
            { optioncontent: "医生", value: "doctor" },
            { optioncontent: "其他", value: "other" },
          ],
          required: false,
        },
        {
          scriptType: 1,
          scriptContent: "您的职业是什么？",
          scriptResult: null,
          svyLibTemplateTargetoptions: [
            { optioncontent: "学生", value: "student" },
            { optioncontent: "教师", value: "teacher" },
            { optioncontent: "工程师", value: "engineer", isabnormal: true },
            { optioncontent: "医生", value: "doctor" },
            { optioncontent: "其他", value: "other" },
          ],
          required: false,
        },
        {
          scriptType: 1,
          scriptContent: "您的职业是什么？",
          scriptResult: null,
          svyLibTemplateTargetoptions: [
            { optioncontent: "学生", value: "student" },
            { optioncontent: "教师", value: "teacher" },
            { optioncontent: "工程师", value: "engineer" },
            { optioncontent: "医生", value: "doctor" },
            { optioncontent: "其他", value: "other" },
          ],
          required: false,
        },
        {
          scriptType: 4,
          scriptContent: "您的姓名是什么？",
          scriptResult: "name",
          required: true,
          scriptResult: null,
        },
      ],
      jsy: null,
      dialogVisible: false,
      Endornot: true,
      accomplish: false,
@@ -291,7 +312,7 @@
        (res) => {
          if (res.code == 200) {
            this.questionList = res.data.script;
            this.revisitAfter = res.data.revisitAfter;
            this.jsy = res.data.jsy;
            this.kcb = res.data.kcb;
            // 处理题目收集结果格式
            this.questionList.forEach((item) => {
@@ -334,7 +355,7 @@
      form.serviceSubtaskDetailList = arr;
      Submitaquestionnaire(form).then((res) => {
        if (res.code == 200) {
          if (this.revisitAfter) {
          if (this.jsy) {
            this.dialogVisible = true;
          }
          this.accomplish = true;
@@ -411,7 +432,7 @@
  padding: 0;
  .CONTENT {
    .title {
      color: #3769F3;
      color: #3769f3;
      font-size: 22px;
      font-weight: bold;
      margin-bottom: 20px;
@@ -426,6 +447,7 @@
  border-radius: 5px;
  //   margin: 20px;
  padding: 10px;
  height: 100%;
  // background: #ffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
@@ -438,12 +460,73 @@
    }
  }
}
.radio-group {
.preview-lefts {
  margin: 10px;
  background-color: #fff;
  border-radius: 5px;
  //   margin: 20px;
  padding: 10px;
  height: 95vh; // background: #ffff;
  border: 1px solid #dcdfe6;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12),
    0 0 6px 0 rgba(0, 0, 0, 0.04);
  .topic-dev {
    margin-bottom: 25px;
    font-size: 20px !important;
    .dev-text {
      margin-bottom: 10px;
    }
  }
}
.red-star {
  position: relative;
  padding-right: 15px;
}
.red-star {
  ::v-deep.el-radio__label {
    position: relative;
    padding-right: 10px; /* 根据需要调整 */
  }
  ::v-deep.el-radio__label::after {
    content: "*";
    color: red;
    position: absolute;
    right: -5px; /* 根据需要调整 */
    top: 0;
  }
  ::v-deep.el-checkbox__label {
    position: relative;
    padding-right: 10px; /* 根据需要调整 */
  }
  ::v-deep.el-checkbox__label::after {
    content: "*";
    color: red;
    position: absolute;
    right: -5px; /* 根据需要调整 */
    top: 0;
  }
}
::v-deep.el-checkbox-group {
  font-size: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px; /* 设置选项之间的间隔 */
  align-items: start; /* 确保选项上下对齐 */
  padding: 10px 0; /* 为整个组设置上下间隔 */
  flex-direction: column;
  margin: 5px 0;
}
::v-deep.el-checkbox.is-bordered + .el-checkbox.is-bordered {
  margin-left: 0;
}

::v-deep.el-radio-group {
  display: flex;
  flex-direction: column;
  margin: 5px 0;
}
::v-deep.el-radio.is-bordered + .el-radio.is-bordered {
  /* margin-left: 10px; */
  margin-left: 0;
}
::v-deep.custom-radio .el-radio {
  margin: 2px 0;
}

.radio-option {
@@ -463,6 +546,7 @@
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  padding: 10px 0; /* 根据需要调整内边距 */
  background: #fff; /* 根据需要调整背景颜色 */
  box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1); /* 可选的阴影效果 */
@@ -490,4 +574,7 @@
    line-height: 17px;
    font-size: 20px;
}
::v-deep.el-checkbox {
  margin-right: 0px;
}
</style>