product_wx/pages/subPackages/economicDevelopmentReport/economic.vue

<template>
    <div class="economic">
      <ul class="economicList">
        <li class="ecoLi" v-for="item in dataList" @tap="toDetail(item)">
          <div class="ecoRow">
            <span>任务编号：{{item.temName}}</span>
            <div :class="item.saveType==0?'ytb':'wtb'">{{ item.saveType==0?'已填报':'未填报' }}</div>
          </div>
          <div class="ecoRow2">
            要求完成日期：{{item.requireFinishTime}}
          </div>
        </li>
      </ul>
      <div v-if="false">
         <div class="noMsgBox">
           <img src="https://www.idea-co-sf.com/gardenProduct/image/youxiang.png">
           <span class="msgInfo">暂无消息</span>
         </div>
        <button class="backToHome" @click="backToHome">返回首页</button>
      </div>
    </div>
</template>

<script>
import { fillControllerList,getUserLocalStorageInfo } from "@/js_sdk/http.js";
export default {
  name: "",
  data(){
    return{
      dataList:[],
      pages: {
        pageNum: 1,
        pageSize: 10,
        enterId: getUserLocalStorageInfo().userId
      },
    }
  },
  created(){
    this.getList()
  },
  onPullDownRefresh() {
    this.dataList = []
    this.getList()
    setTimeout(function () {
      uni.stopPullDownRefresh();
    }, 1000);
  },
  methods:{
    backToHome(){
      uni.switchTab({
        url: "/pages/index/index",
      });
    },
    toDetail(item){
      uni.navigateTo({
        url:'/pages/subPackages/economicDevelopmentReport/detail?id='+item.id
      })
    },
    // 获取填报列表
    async getList() {
      await fillControllerList(this.pages).then(res => {
        if (res.rows.length) {
          this.isDownLoading = false
          this.dataList.push(...res.rows)
          this.isUpLoading = false
          if (this.dataList.length >= res.total) {
            this.upFinished = true
          }
        } else if (res.errno == 426) {
          Toast(res.errmsg)
        } else {
          this.dataList = []
          this.isDownLoading = false
          this.isUpLoading = false
          this.upFinished = true
        }
        this.isRef = true
      })
    },
  }
}
</script>

<style lang="scss">
    .economic{
      .economicList{
        display: flex;
        flex-direction: column;
        align-items: center;
        .ecoLi{
          width: 686rpx;
          box-sizing: border-box;
          background: white;
          border-radius: 16rpx;
          margin: 24rpx 0;
          padding: 32rpx;
          .ecoRow{
            font-size: 32rpx;
            color: #333333;
            display: flex;
            justify-content: space-between;
            align-items: center;
            .ytb{
              background:rgba(0, 0, 0, 0.05);
              color: rgba(153, 153, 153, 1);
              padding: 1.5vw 3vw;
              border-radius: 5px;
              white-space: nowrap;
              font-size: 28rpx;
            }
            .wtb{
              background:rgba(29, 24, 188, 0.05);
              color: rgba(29, 24, 188, 1);
              padding: 1.5vw 3vw;
              border-radius: 5px;
              white-space: nowrap;
              font-size: 28rpx;
            }
          }
          .ecoRow2{
            font-size: 30rpx;
            color: #666666;
            margin-top: 16rpx;
          }
        }
      }
      .noMsgBox{
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 90vw;
        margin-left: 5vw;
        position: relative;
        .msgInfo{
          color: rgba(3, 101, 249, 1);
          font-size: 48rpx;
        }
        img{
          width: 600rpx;
          height: 600rpx;
          margin-top: 150rpx;
        }
      }
      .backToHome{
        width: 90vw;
        margin-left: 5vw;
        margin-top: 168rpx;
        border-radius: 8rpx !important;
        padding: 24rpx;
        background: rgba(3, 101, 249, 1);
        color: white;
        font-size: 36rpx;
      }
    }
</style>