zhgdyunapp_vue3/pages/projectEnd/qualityManage/taskList.vue

<template>
  <view class="taskList">
    <view class="fixedheader">
			<headers :themeType="true" :showBack="true">
				<view class="headerName">
					检查任务
				</view>
			</headers>
		</view>
    <scroll-view class="smallHeight" :style="{ 'padding-top': ((statusBarHeight * 2) + 45) * 1.5 + 'rpx' }" scroll-y>
      <view class="task-list">
        <view class="task-info flex">
          <view class="info-item b-right">
            <text>{{ statisticsData.rectifyNum }}</text>
            待整改
          </view>
		  <view class="info-item b-right">
		    <text>{{ statisticsData.reviewNum }}</text>
		    待复查
		  </view>
          <view class="info-item b-right">
            <text>{{ statisticsData.checkNum }}</text>
            待核验
          </view>
          <view class="info-item">
            <text>{{ statisticsData.closeNum }}</text>
            已闭合
          </view>
        </view>

        <view class="task-item" v-for="(item, index) in dataList" :key="index">
          <view @click="junpPage(item)">
            <view class="task-title">{{ item.itemName }}</view>
            <view class="task-num" v-if="item.count.inspectNum > 0">整改单数量：{{ item.count.inspectNum }}</view>
            <view class="task-people" v-if="item.count.inspectNum > 0">检查人：{{ item.userlist.join('、') }}</view>
          </view>
          <view class="task-btn" @click="addExamine(item)" v-if="item.count.inspectNum == 0">开始检查</view>
          <view class="task-btn" @click="addExamine(item)" v-if="item.count.inspectNum > 0">再次检查</view>
          <view class="task-status" :class="{
              status1: item.count.inspectNum > 0,
              status3: item.count.inspectNum == 0
            }">
            {{ item.count.inspectNum == 0 ? '未检查' : '已检查' }}
          </view>
        </view>
      </view>
    </scroll-view>
  </view>
</template>

<script>
  import headers from '../../../components/headers/headers.vue'
  export default {
    data() {
      return {
        statusBarHeight: 0,
        taskId: '',
        userId: '',
        dataList: [],
        statisticsData: {
          closeNum: 0,
          rectifyNum: 0,
          reviewNum: 0
        },
        loadStatus: 'more',
        isLoadMore: false,
        pageNo: 1,
        pageSize: 10
      }
    },
    onShow() {
      this.dataList = []
      this.pageNo = 1
      this.statusBarHeight = uni.getStorageSync('systemInfo').statusBarHeight
      this.userId = JSON.parse(uni.getStorageSync('userInfo')).userId
      this.queryList()
      this.queryStatisticsNum()
    },
    onLoad(val) {
      this.taskId = val.id
      this.userId = JSON.parse(uni.getStorageSync('userInfo')).userId
      // this.queryList()
      this.queryStatisticsNum()
    },
    onReachBottom() {
      console.log(1)
      if (!this.isLoadMore) {
        //此处判断，上锁，防止重复请求
        this.isLoadMore = true
        this.pageNo += 1
        this.queryList()
      }
    },
    onPullDownRefresh() {
      console.log(2)
      this.pageNo = 1
      this.dataList = []
      this.queryList()
    },
    methods: {
      junpPage(val) {
        console.log(val, '质量管理')
        // if (val.count.inspectNum > 0) {
        uni.navigateTo({
          url: './listTow?itemS=' + val.id
        })
        // }
      },
      addExamine(val) {
        console.log(val)
        if (uni.getStorageSync('dangerData')) {
          uni.removeStorageSync('dangerData')
        }
        if (uni.getStorageSync('detailData')) {
          uni.removeStorageSync('detailData')
        }
        uni.navigateTo({
          // url: './addExamine?type=1&taskId=' + this.taskId + '&itemId=' + val.id
          url: './addIssue?type=add' + '&itemId=' + val.id + '&taskId=' + val.taskId
        })
      },
      queryList() {
        let data = {
          taskId: this.taskId,
          inspectUser: this.userId,
          pageNo: this.pageNo,
          pageSize: this.pageSize
        }
        let _this = this
        this.sendRequest({
          url: 'xmgl/inspectTaskItemRecord/list',
          method: 'post',
          data: data,
          success: res => {
            // this.dataList = res.result.records
            this.dataList = this.dataList.concat(res.result.records)
            if (res.result.records.length < this.pageSize) {
              //判断接口返回数据量小于请求数据量，则表示此为最后一页
              this.isLoadMore = true
              this.loadStatus = 'nomore'
            } else {
              this.isLoadMore = false
              // that.loadStatus='more'
            }
            uni.stopPullDownRefresh()
            console.log(res.result)
          }
        })
      },
      queryStatisticsNum() {
        let data = {
          taskId: this.taskId
        }
        let _this = this
        this.sendRequest({
          url: 'xmgl/qualityInspectionRecord/selectInspectTaskCount',
          method: 'post',
          data: data,
          success: res => {
            this.statisticsData = res.result
            console.log(res.result)
          }
        })
      }
    }
  }
</script>

<style lang="scss" scoped>
  .taskList {
    background: #f6f6f6;
    // height: 100%;
    min-height: 100%;

    .fixedheader {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      z-index: 2;
    }

    .smallHeight {
      height: 100%;
      box-sizing: border-box;
    }

    .flex {
      display: flex;
    }

    .task-list {
      padding: 26rpx;

      .task-info {
        background: #fff;
        background: #fff;
        height: 144rpx;
        margin-bottom: 24rpx;
        align-items: center;
        box-shadow: 0 16rpx 20rpx #e8e8e8;
        background: url('../../../static/safeMange/safe_bg.png') no-repeat center;
        background-size: 100% 100%;

        .info-item {
          flex: 1;
          text-align: center;

          uni-text {
            display: block;
            color: #e26c0e;
            font-weight: 600;
            margin-bottom: 6rpx;
          }
        }

        .b-right {
          border-right: 1px solid rgba(244, 150, 0, 0.1);
        }
      }

      .task-item {
        background: #fff;
        border-radius: 10rpx;
        padding: 30rpx 28rpx 34rpx 42rpx;
        box-shadow: 4rpx 16rpx 20rpx #e8e8e8;
        position: relative;
        font-size: 26rpx;
        color: #6a6e7a;
        margin-bottom: 24rpx;

        .task-title {
          font-size: 32rpx;
          color: #000;
        }

        .task-num {
          margin-top: 12rpx;
          margin-bottom: 6rpx;
        }

        .task-btn {
          width: 170rpx;
          height: 64rpx;
          background: #127fec;
          color: #fff;
          line-height: 64rpx;
          text-align: center;
          margin-top: 24rpx;
          border-radius: 32rpx;
        }

        .task-status {
          position: absolute;
          right: 28rpx;
          bottom: 32rpx;
          padding: 4rpx 14rpx;
          font-size: 24rpx;
          border-radius: 22rpx;
        }

        .status1 {
          color: #ff711e;
          background: linear-gradient(to right,
              rgba(255, 133, 30, 0.2),
              rgba(255, 133, 30, 0.01));
        }

        .status2 {
          color: #67b2fd;
          background: linear-gradient(to right,
              rgba(103, 178, 253, 0.2),
              rgba(103, 178, 253, 0.01));
        }

        .status3 {
          color: #fff;
          background: #cbcbcb;
        }
      }
    }
  }
</style>