测试完成

WXL (wul)

2026-05-08 f9902f7a3b79d22bde9f199263ac36de26816470

 src/views/outsideChainxjnew.vue

@@ -1,49 +1,49 @@
<template>
  <div class="questionnaire">
    <!-- <div class="CONTENT">
      <div class="title">浙中医大二院医护知识宣教</div>
      <div class="preview-left">
        <div v-html="richText"></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> -->
    <div class="CONTENT" >
      <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">
    <!-- 正常内容 -->
    <div v-else>
      <div class="CONTENT">
        <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
                  ? kcb
                  : "亲爱的患者-家属，我们是医护人员，为了更好地了解您的康复情况，请您抽一点宝贵时间，观看这份宣教资讯。"
              }}
              <!-- 亲爱的患者/家属您好，为了更好的了解您出院后的康复情况，给您适当及时的健康指导，请您抽一点宝贵时间，完成这份出院随访问卷调查。 -->
            </div>
          </div>
          <el-divider></el-divider>
          <div v-html="richText"></div>
          <div
            style="
              text-align: center;
              padding-top: 50px;
              font-size: 24px;
              color: #175997;
              font-weight: 600;
              margin-bottom: 10px;
            "
          >
            {{
              kcb
                ? kcb
                : "亲爱的患者-家属，您好！我们是浙中医大二院的医护人员，为了更好地了解您的康复情况，请您抽一点宝贵时间，观看这份宣教资讯。"
              jsy
                ? jsy
                : "生活上要劳逸结合，注意休息和营养，适当锻炼，戒烟限酒，保持心情舒畅，定期复诊。那本次宣教内容就到这里，祝您身体健康！"
            }}
            <!-- 亲爱的患者/家属您好，为了更好的了解您出院后的康复情况，给您适当及时的健康指导，请您抽一点宝贵时间，完成这份出院随访问卷调查。 -->
          </div>
        </div>
        <el-divider></el-divider>
        <div v-html="richText"></div>
        <div
          style="
            text-align: center;
            padding-top: 50px;
            font-size: 24px;
            color: #175997;
            font-weight: 600;
            margin-bottom: 10px;
          "
        >
        {{
            jsy
              ? jsy
              : "生活上要劳逸结合，注意休息和营养，适当锻炼，戒烟限酒，保持心情舒畅，定期复诊。那本次宣教内容就到这里，祝您身体健康！"
          }}        </div>
        <!-- <div style="font-size: 20px">
          {{
            jsy
              ? jsy
              : "生活上要劳逸结合，注意休息和营养，适当锻炼，戒烟限酒，保持心情舒畅，定期复诊。那本次宣教内容就到这里，祝您身体健康！"
          }}
        </div> -->
      </div>
    </div>
  </div>
@@ -52,8 +52,8 @@
<script>
import {
  getExternalfollowup,
  SetsaveQuestionAnswer,
  geturlinfo
  Submitaquestionnaire,
  geturlinfo,
} from "@/api/AiCentre/index";
import { getToken } from "@/utils/auth";
import axios from "axios";
@@ -76,81 +76,92 @@
        question3: "",
      },
      richText: "<p>Hello, <strong>world</strong>!</p>",
      url:'',
      taskname:'',
      kcb:'',
      jsy:'',
      url: "",
      taskname: "",
      kcb: "",
      jsy: "",
      loading: true, // 新增：加载状态
    };
  },

  created() {
    this.getQuestionnaire();
    this.geturlinfo();
  },
  methods: {
    // 解析urlid
    geturlinfo() {
      // let url = window.location.href;
      this.loading = true; // 开始加载
      let url = this.$route.query.p;
      // let url = 'http://218.108.11.22:8093/sf/003';
      // let urlid = this.extractLastSegmentFromUrl(url);

      geturlinfo( url ).then((res) => {
       if (res.code==200) {
         this.getQuestionnaire(res.data.param1,res.data.param2,res.data.param3,res.data.param5,)
       }
      });
    },
    extractLastSegmentFromUrl(url) {
    // 找到最后一个'/'的位置
    const lastSlashIndex = url.lastIndexOf('/');
    // 如果找到了'/'，截取其后的所有字符
    if (lastSlashIndex !== -1) {
        return url.substring(lastSlashIndex + 1);
    }
    // 如果没有找到'/'，返回空字符串
    return '';
},
    // 获取数据
    getQuestionnaire(param1,param2,param3) {
      this.taskid = param1;
      this.patid = param2;
      this.taskname = param3;
      // // let taskid =
      // //   "OFp7tn/B6x7IzKJetvGWHdSWBj7msRlnlj6am9dyuHTH6sEt4uBbVCUXs5kcF/e4O2W6vqHf2Bz9K3/evbYDmw==";
      // // let patid =
      // //   "CVk0j8O86AeCqhV5WPsBBYDg9fec0wDoDlP9imYK4wDBNIkxywZzMJEGlPagOxnq6qr2WYZo0U8MUGWRGnq8ZA==";
      // this.taskid = this.decrypt(taskid);
      // this.patid = this.decrypt(patid);

      // // this.$modal.msgSuccess("用户id为" + this.patid);
      // // this.$modal.msgSuccess("任务id为" + this.taskid);
      // let taskids = this.encrypt(this.taskid);
      // let patids = this.encrypt(this.patid);
      getExternalfollowup({ param1: this.taskid, param2: this.patid }).then((res) => {
        if (res.code == 200) {
          this.url = res.data.script[0].richText;
          this.jsy = res.data.jsy;
          this.kcb = res.data.kcb;
          // 临时获取数据
      axios
        .get(this.url)
        .then((response) => {
          console.log(response.data, "数据"); // 输出获取到的文件内容
          this.richText = response.data;
          this.richText = this.addStyleToImages(this.richText);
      geturlinfo(url)
        .then((res) => {
          if (res.code == 200) {
            this.getQuestionnaire(
              res.data.param1,
              res.data.param2,
              res.data.param3,
              res.data.param5
            );
          } else {
            this.loading = false; // 获取URL信息失败时关闭加载
          }
        })
        .catch((error) => {
          console.error("Failed to fetch file:", error);
        .catch(() => {
          this.loading = false; // 出错时关闭加载
        });
        }
      });

    },

    // 获取数据
    getQuestionnaire(param1, param2, param3) {
      this.taskid = decodeURIComponent(param1);
      this.patid = decodeURIComponent(param2);
      this.taskname = decodeURIComponent(param3);

      getExternalfollowup({ param1: this.taskid, param2: this.patid })
        .then((res) => {
          if (res.code == 200) {
            this.url = res.data.script[0].richText;
            this.jsy = res.data.jsy;
            this.kcb = res.data.kcb;

            // 获取富文本内容
            axios
              .get(this.url)
              .then((response) => {
                console.log(response.data, "数据");
                this.richText = response.data;
                this.richText = this.addStyleToImages(this.richText);
                this.loading = false; // 数据加载完成
              })
              .catch((error) => {
                console.error("Failed to fetch file:", error);
                this.loading = false; // 获取内容失败时关闭加载
              });
          } else {
            this.loading = false; // API返回错误时关闭加载
          }
        })
        .catch(() => {
          this.loading = false; // API调用失败时关闭加载
        });
    },

    addStyleToImages(html) {
      return html.replace(
      if (!html) return html;

      // 1. 先修复路径
      let processedHtml = html.replace(
        /\/aifollowup\/aifollowup\//g,
        "/aifollowup/"
      );

      // 2. 再修复样式
      processedHtml = processedHtml.replace(
        /<img([^>]*)style=(['"])(?:(?!\2).)*\2([^>]*)>/g,
        '<img$1style="width:100%;height:auto;"$3>'
      );

      return processedHtml;
    },
    // 加密函数
    encrypt(txt) {
@@ -189,7 +200,7 @@
      });
      console.log(form, "form");

      SetsaveQuestionAnswer(form).then((res) => {
      Submitaquestionnaire(form).then((res) => {
        if (res.code == 200) {
          this.$modal.msgSuccess("提交成功");
        }
@@ -201,7 +212,6 @@
</script>

<style lang="scss" scoped>

.questionnaire {
  background-image: url("../assets/images/chainbackground1.jpg");
  background-color: #f9f9fb;
@@ -212,6 +222,7 @@
  min-height: 100vh;
  margin: 0;
  padding: 0;

  .CONTENT {
    padding-top: 15px;
    padding-bottom: 15px;
@@ -224,16 +235,15 @@
    }
  }
}

.preview-left {
  margin: 10px;
  margin-bottom: 60px;
  background-color: #fff;
  border-radius: 5px;
  //   margin: 20px;
  padding: 10px;
  padding-bottom: 100px;
  height: 100%;
  // 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);
@@ -245,4 +255,66 @@
    }
  }
}

/* 新增加载样式 */
.loading-container {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.9);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.loading-content {
  text-align: center;
  padding: 40px 60px;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  border: 1px solid #e4e7ed;
}

.loading-icon {
  font-size: 40px;
  color: #3769f3;
  margin-bottom: 20px;
  animation: loading-rotate 1.5s linear infinite;
  display: block;
}

.loading-text {
  font-size: 18px;
  color: #606266;
  font-weight: 500;
  margin-top: 10px;
}

@keyframes loading-rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* 响应式设计 */
@media (max-width: 768px) {
  .loading-content {
    padding: 30px 40px;
  }

  .loading-icon {
    font-size: 32px;
  }

  .loading-text {
    font-size: 16px;
  }
}
</style>