需求变更

src/project/tianfuxing/AppHome/AppHome.vue

@@ -130,14 +130,14 @@
       },
 
       toDetail (e) {
-        if (!e.linkUrl) return
-
         if (e.type == '0') {  //0 h5链接； 1 小程序链接； 2外部小程序
           this.$linkTo(`/subPages/h5/webview?link=${e.linkUrl}&title=${e.title}`)
-        } else {
+        } else if (e.type == '2') {
           wx.navigateToMiniProgram({
             appId: e.linkUrl
           })
+        } else if (e.type == '3') {
+          this.$linkTo(`./News?id=${e.id}`)
         }
       },
 

src/project/tianfuxing/AppHome/News.vue

@@ -0,0 +1,108 @@
+<template>
+  <div class="news" v-if="pageShow">
+    <header class="header">
+      <div class="header-title">{{ info.title }}</div>
+      <!-- <div class="header-info flex-align">
+        <span>百得家</span>
+        <i>{{ info.createDate }}</i>
+      </div> -->
+    </header>
+    <div class="news-content">
+      <u-parse :html="info.rtf"/>
+    </div>
+    <div class="qrcode" @click="showQrcode">
+      <image :src="qrcode" />
+    </div>
+  </div>
+</template>
+<script>
+  export default {
+    data () {
+      return {
+        pageShow: false,
+        info: {}
+      }
+    },
+
+    onLoad (query) {
+      this.getNews(query.id)
+    },
+
+    methods: {
+      getNews (id) {
+        this.$loading()
+        this.$instance.post(`/api/appbanner/detail`, null, {
+          params: {id}
+        }).then(res => {
+          if (res?.data) {
+            this.$hideLoading()
+            this.info = res.data
+            this.pageShow = true
+          }
+        })
+      },
+
+      showQrcode () {
+        uni.previewImage({
+          current: this.qrcode,
+          urls: [this.qrcode]
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="scss">
+  page {
+    padding-bottom: 60px;
+  }
+
+  .content {
+    padding: 0 30px;
+    line-height: 1.4;
+
+    image {
+      width: 690px!important;
+      margin: 20px auto;
+    }
+  }
+
+  page {
+    min-height: 100%;
+    background: #fff;
+  }
+  .header {
+    padding: 0 30px;
+  }
+  .header {
+    margin-bottom: 20px;
+  }
+  .header-title {
+    color: #333;
+    font-size: 34px;
+    line-height: 1.4;
+    font-weight: 600;
+    text-align: center;
+    margin: 30px 0 0 0;
+  }
+  .header-info {
+    color: #999;
+    font-size: 24px;
+  }
+
+  .news-content {
+    color: #666;
+    font-size: 28px;
+    line-height: 1.8;
+    margin: 0 26px;
+  }
+  .news-content img {
+    width: 702px!important;
+    margin: 24px auto;
+    border-radius: 8px;
+    text-align: center;
+  }
+  .news-content > p, .news-content > h2, .news-content > h1, .news-content > h3 {
+    margin: 30px 0!important;
+  }
+</style>

src/project/tianfuxing/AppHome/StoreDetail.vue

@@ -105,6 +105,8 @@
 
 <style lang="scss" socped>
   .StoreDetail {
+    padding-bottom: 20px;
+
     .banner {
       position: absolute;
       top: 0;
@@ -120,9 +122,12 @@
     }
 
     .wrapper {
-      position: relative;
+      position: absolute;
       z-index: 2;
-      margin: 400px 16px 0;
+      left: 0;
+      top: 400px;
+      width: 100%;
+      padding: 0 16px;
 
       .top {
         display: flex;