图片调整

2025-05-06 15:22:09 +08:00
parent ddbd8e74b6
commit 0bbcd61bde
15 changed files with 815 additions and 60 deletions
--- a/pages/visitor/taihuDetail.vue
+++ b/pages/visitor/taihuDetail.vue
@@ -0,0 +1,169 @@
+<template>
+  <view class="container_zg">
+    <z-nav-bar :title="prescriptDetail.title"></z-nav-bar>
+    <view class="contentBox" v-if="prescriptDetail.type == 0">
+      <view class="content">
+        <view class="item title-center">
+          {{ prescriptDetail.title }}
+        </view>
+        <rich-text
+          v-if="prescriptDetail.content"
+          class="item"
+          :nodes="formatRichText(prescriptDetail.content)"
+        ></rich-text>
+      </view>
+    </view>
+    <view class="fullscreen-webview" v-else>
+      <web-view :src="prescriptDetail.url"> </web-view>
+    </view>
+  </view>
+</template>
+
+<script>
+import $http from "@/config/requestConfig.js";
+export default {
+  data() {
+    return {
+      options: {},
+      playData: {},
+      prescriptDetail: {
+        images: [],
+      },
+      id: null,
+      indicatorDots: true,
+      autoplay: true,
+      interval: 5000,
+      duration: 500,
+    };
+  },
+  onLoad(options) {
+    this.id = options.id;
+    this.options = options;
+  },
+  onShow() {
+    this.getDetail();
+  },
+  methods: {
+    formatRichText(html) {
+      //控制图片大小
+      let newContent = html.replace(/<img[^>]*>/gi, function (match, capture) {
+        match = match
+          .replace(/style="[^"]+"/gi, "")
+          .replace(/style='[^']+'/gi, "");
+        match = match
+          .replace(/width="[^"]+"/gi, "")
+          .replace(/width='[^']+'/gi, "");
+        match = match
+          .replace(/height="[^"]+"/gi, "")
+          .replace(/height='[^']+'/gi, "");
+        return match;
+      });
+      newContent = newContent.replace(
+        /style="[^"]+"/gi,
+        function (match, capture) {
+          match = match
+            .replace(/width:[^;]+;/gi, "max-width:100%;")
+            .replace(/width:[^;]+;/gi, "max-width:100%;");
+          return match;
+        }
+      );
+      newContent = newContent.replace(/<br[^>]*\/>/gi, "");
+      newContent = newContent.replace(
+        /\<img/gi,
+        '<img style="max-width:100%;height:auto;display:inline-block;margin:10rpx auto;"'
+      );
+      return newContent;
+    },
+    //详情
+    getDetail() {
+      $http
+        .request({
+          url: 'visitor/getTaihuWelfareArticleDetail',
+          method: "POST",
+          data: {id: this.options.id,},
+          header: {
+            "Content-Type": "application/json",
+          },
+        })
+        .then((res) => {
+          if (res.code == 0) {
+            this.prescriptDetail = res.result;
+            if (
+              this.prescriptDetail.content &&
+              this.prescriptDetail.contentType == 1
+            ) {
+              this.prescriptDetail.content = res.result.content;
+            }
+			
+          }
+        })
+        .catch((e) => {
+          console.log(e);
+        });
+    },
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.contentBox {
+  padding-bottom: 20rpx;
+}
+.contentBoxwebwiew {
+  height: 100%;
+}
+.fullscreen-webview {
+  width: 100%;
+  height: 100%;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+
+.mb-10 {
+  margin-bottom: 10px;
+}
+
+.content {
+  font-size: 28rpx;
+}
+
+.swiper-item {
+  image {
+    margin: 0 auto;
+    height: 250rpx;
+  }
+}
+
+.uni-margin-wrap {
+  margin-bottom: 20rpx;
+  padding-top: 20rpx;
+  background-color: #fff;
+}
+
+.container_zg {
+  padding: 20rpx;
+  background: #fff;
+  
+  .item {
+    padding: 10rpx 20rpx;
+    padding-bottom: 20rpx;
+    line-height: 46rpx;
+  }
+  .title-center {
+    text-align: center;
+    font-size: 32rpx;
+    font-weight: 700 !important;
+  }
+}
+
+.flexbox {
+  display: flex;
+}
+
+/deep/ .uni-section-header__decoration.line {
+  background-color: #18bc37;
+}
+</style>