WXL (wul)
2026-05-08 f9902f7a3b79d22bde9f199263ac36de26816470
src/views/outsideChainxjnew.vue
@@ -1,12 +1,15 @@
<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 v-else>
    <div class="CONTENT">
      <div class="preview-left">
        <div class="toptitle">
@@ -40,13 +43,7 @@
              : "生活上要劳逸结合,注意休息和营养,适当锻炼,戒烟限酒,保持心情舒畅,定期复诊。那本次宣教内容就到这里,祝您身体健康!"
          }}
        </div>
        <!-- <div style="font-size: 20px">
          {{
            jsy
              ? jsy
              : "生活上要劳逸结合,注意休息和营养,适当锻炼,戒烟限酒,保持心情舒畅,定期复诊。那本次宣教内容就到这里,祝您身体健康!"
          }}
        </div> -->
        </div>
      </div>
    </div>
  </div>
@@ -83,6 +80,7 @@
      taskname: "",
      kcb: "",
      jsy: "",
      loading: true, // 新增:加载状态
    };
  },
@@ -92,12 +90,11 @@
  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) => {
      geturlinfo(url)
        .then((res) => {
        if (res.code == 200) {
          this.getQuestionnaire(
            res.data.param1,
@@ -105,56 +102,50 @@
            res.data.param3,
            res.data.param5
          );
          } else {
            this.loading = false; // 获取URL信息失败时关闭加载
        }
        })
        .catch(() => {
          this.loading = false; // 出错时关闭加载
      });
    },
    //     extractLastSegmentFromUrl(url) {
    //     // 找到最后一个'/'的位置
    //     const lastSlashIndex = url.lastIndexOf('/');
    //     // 如果找到了'/',截取其后的所有字符
    //     if (lastSlashIndex !== -1) {
    //         return url.substring(lastSlashIndex + 1);
    //     }
    //     // 如果没有找到'/',返回空字符串
    //     return '';
    // },
    // 获取数据
    getQuestionnaire(param1, param2, param3) {
      this.taskid = decodeURIComponent(param1);
      this.patid = decodeURIComponent(param2);
      this.taskname = decodeURIComponent(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) => {
      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, "数据"); // 输出获取到的文件内容
                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) {
      if (!html) return html;
@@ -231,6 +222,7 @@
  min-height: 100vh;
  margin: 0;
  padding: 0;
  .CONTENT {
    padding-top: 15px;
    padding-bottom: 15px;
@@ -243,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);
@@ -264,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>