防返贫接入企微产品库和地图组件

src/pages/PovertyAlleviation/PovertyAlleviation.vue

@@ -0,0 +1,169 @@
+<template>
+  <div class="info">
+    <div class="info-top">
+      <div class="info-top__item" @click="linkTo('/pages/Monitor/Monitor')">
+        <image src="/static/images/wdbf.png" />
+        <h2>监测对象</h2>
+      </div>
+      <div class="info-top__item" @click="linkTo('/pages/povertyMonitor/povertyMonitor')">
+        <image src="/static/images/yjjk.png" />
+        <h2>预警监控</h2>
+      </div>
+      <div class="info-top__item" @click="linkTo('/pages/PovertyAlleviation/News')">
+        <image src="/static/images/news.png" />
+        <h2>政策动态</h2>
+      </div>
+    </div>
+    <div class="news">
+      <h2>最新动态</h2>
+      <div class="news-list">
+        <div class="news-item" v-for="(item, index) in list" :key="index" @click="linkTo(`/pages/PovertyAlleviation/NewsDetail?id=${item.id}`)">
+          <div class="left">
+            <h2>{{ item.title }}</h2>
+            <div class="item-bottom">
+              <span>{{ $dict.getLabel('newsCenterPolicyType', item.policyType) }}</span>
+              <span>{{ item.createTime }}</span>
+            </div>
+          </div>
+          <image v-if="item.coverFile" :src="item.coverFile ? item.coverFile.url : ''" />
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    data () {
+      return {
+        list: []
+      }
+    },
+
+    onLoad () {
+      this.$dict.load(['newsCenterPolicyType']).then(() => {
+        this.getList()
+      })
+    },
+
+    methods: {
+      linkTo (url) {
+        uni.navigateTo({
+          url
+        })
+      },
+
+      getList () {
+        this.$http.post(`/app/appnewscenterinfo/listForWx`, null, {
+          params: {
+            current: 1,
+            size: 10,
+            status: 1
+          }
+        }).then(res => {
+          if (res.code == 0) {
+            this.list = res.data.records
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="scss">
+  .info {
+    padding: 32px 30px;
+    
+    .info-top {
+      display: flex;
+      align-items: center;
+      margin-bottom: 32px;
+      background: #FFFFFF;
+      border-radius: 16px;
+
+      div {
+        flex: 1;
+        padding: 32px 0;
+        text-align: center;
+
+        image {
+          width: 80px;
+          height: 80px;
+        }
+
+        h2 {
+          margin-top: 4px;
+          color: #3D434A;
+          font-size: 28px;
+          font-weight: normal;
+        }
+      }
+    }
+
+    .news {
+      & > h2 {
+        margin-bottom: 32px;
+        color: #333333;
+        font-weight: 600;
+        font-size: 32px;
+      }
+
+      .news-item {
+        display: flex;
+        align-items: center;
+        margin-bottom: 20px;
+        padding: 32px 24px;
+        background: #fff;
+        border-radius: 14px;
+
+        &:active {
+          background: #eee;
+        }
+
+        &:last-child {
+          border-bottom: none;
+        }
+
+        .left {
+          flex: 1;
+          margin-right: 20px;
+          display: -webkit-box;
+          -webkit-box-orient: vertical;
+          -webkit-line-clamp: 2;
+          overflow: hidden;
+        }
+
+        & > image {
+          width: 200px;
+          height: 140px;
+        }
+
+        h2 {
+          width: 100%;
+          margin-bottom: 32px;
+          color: #333333;
+          font-size: 30px;
+          font-weight: 600;
+          display: -webkit-box;
+          -webkit-box-orient: vertical;
+          -webkit-line-clamp: 2;
+          overflow: hidden;
+        }
+
+        .item-bottom {
+          display: flex;
+          align-items: center;
+
+          span {
+            color: #999999;
+            font-size: 24px;
+
+            &:first-child {
+              margin-right: 32px;
+            }
+          }
+        }
+      }
+    }
+  }
+</style>