迁移防返贫

src/apps/AppPovertyAlleviation/NewsDetail.vue

@@ -0,0 +1,98 @@
+<template>
+  <div class="detail" v-if="pageShow">
+    <h2>{{ info.title }}</h2>
+    <span>发布时间：{{ info.createTime }}</span>
+    <div class="content">
+      <u-parse :html="info.content" v-if="info.type === '0'"></u-parse>
+      <video class="video" v-else :src="info.videoFile.url"></video>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      pageShow: false,
+      info: {},
+      content: `
+					<p>露从今夜白，月是故乡明</p>
+					<img src="https://cdn.uviewui.com/uview/swiper/2.jpg" />
+				`
+    }
+  },
+
+  onLoad(query) {
+    uni.showLoading()
+    this.getInfo(query.id)
+  },
+
+  methods: {
+    getInfo(id) {
+      this.$http.post(`/app/appnewscenterinfo/queryDetailById?id=${id}`).then(res => {
+        if (res.code == 0) {
+          this.info = res.data
+
+          this.$nextTick(() => {
+            this.pageShow = true
+          })
+        }
+        uni.hideLoading()
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.detail {
+  min-height: 100vh;
+  padding: 40px 32px 40px;
+  box-sizing: border-box;
+  background: #fff;
+
+  & > h2 {
+    margin-bottom: 16px;
+    line-height: 1.3;
+    font-size: 40px;
+    color: #333;
+    font-weight: 600;
+  }
+
+  & > span {
+    font-size: 28px;
+    color: #999;
+  }
+
+  .content {
+    width: 100%;
+    margin-top: 40px;
+
+    ::v-deep * {
+      box-sizing: border-box;
+    }
+
+    ::v-deep p {
+      margin: 20px 0;
+      line-height: 1.4;
+      color: #666;
+      font-size: 28px;
+      text-align: justify;
+    }
+
+    ::v-deep img {
+      width: 100%;
+    }
+
+    ::v-deep br {
+      display: block;
+      margin: 20px 0;
+    }
+
+    .video {
+      width: 100%;
+      height: 600px;
+    }
+  }
+}
+</style>