xiamen-sb-uniapp/pages/repair-check/repair-edit.vue

<template>
  <view>
    <view class="">
      <template v-if="listData.length > 0">
        <view
          class="mx3 my2 p3 bg-color-white box"
          v-for="(item, index) in listData"
          :key="index"
          @tap="handleDetail(item.applicationId)"
        >
          <view class="d-flex j-between border-bottom pb-2 a-center">
            <view class="text-color-b f-size-26">{{ item.sbName }}</view>
            <my-badge
              :text="$BaseTool.Object.getField(statusMap, item.status)"
              :status="
                $DictCache.COLOR.REPAIR_APPLICATION_FORM_STATUS[item.status]
              "
            />
          </view>
          <view class="mt-2 d-flex j-between">
            <view class="text-color-3 f-size-32 f-weight-bold">{{
              item.repairUserName
            }}</view>
          </view>
          <view class="f-size-26 text-color-6 f-weight-4 mt-2">{{
            item.applyTime
          }}</view>
          <view
            class="d-flex j-end edit-box"
            v-if="
              $DictCache.VALUE.REPAIR_CHECK_STATUS.NOT_ACCEPTANCED ===
              item.status
            "
          >
            <view class="text-color-3 f-size-32 edit">
              <view @click.stop="handleApprove(item)">通过</view>
            </view>
            <view class="text-color-3 f-size-32 edit">
              <view @click.stop="handleReturn(item)">驳回</view>
            </view>
          </view>
        </view>
        <view class="py3">
          <u-loadmore :status="status" />
        </view>
      </template>
      <template v-else>
        <view class="empty">
          <u-empty text="暂无数据" mode="list"></u-empty>
        </view>
      </template>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      list: [],
      current: 0,
      // 加载更多
      status: "loadmore",
      page: 1,
      limit: 10,
      type: "",
      loadMore: true,
      listData: [],
      statusMap: {},
    };
  },
  onPullDownRefresh() {
    // 请求结束取消刷新
    this.page = 1;
    this.loadMore = true;
    this.listData = [];
    this.initData();
    uni.stopPullDownRefresh();
  },
  onReachBottom() {
    if (this.loadMore) {
      this.page++;
      this.initData();
    }
  },
  onLoad() {},
  onShow() {
    this.page = 1;
    this.loadMore = true;
    this.listData = [];
    this.initData();
    this.statusMap = this.$DictCache.getLabelByValueMapByType(
      this.$DictCache.TYPE.REPAIR_CHECK_STATUS
    );
  },
  methods: {
    handleReturn(item) {
      let that = this;
      uni.showModal({
        title: "提示",
        content: "确认驳回？",
        success: function (res) {
          if (res.confirm) {
            uni.navigateTo({
              url: "/pages/repair/repair-return?id=" + item.id,
            });
            // that.$Http
            //   .fetchRepairCheck({
            // 		id:item.id
            // 	})
            //   .then((res) => {
            // 		console.log(res);
            // 		that.page = 1;
            // 		that.loadMore = true;
            // 		that.listData = [];
            // 		that.initData();
            // 	})
          }
        },
      });
    },
    // 通过
    handleApprove(item) {
      let that = this;
      uni.showModal({
        title: "提示",
        content: "确认通过？",
        success: function (res) {
          if (res.confirm) {
            that.$Http.approve(item).then((res) => {
              that.page = 1;
              that.loadMore = true;
              that.listData = [];
              that.initData();
            });
          }
        },
      });
    },
    handleClick() {
      uni.navigateTo({
        url: "/pages/repair-add/repair-add",
      });
    },
    // 跳转详情
    handleDetail(id) {
      uni.navigateTo({
        url: "/pages/repair-detail/repair-detail?detailId=" + id,
      });
    },
    // 初始化
    initData() {
      const that = this;
      that.status = "loading";
      this.$Http
        .getRepairCheckPage({
          pageNum: this.page,
          pageSize: this.limit,
          filter: 0,
        })
        .then((res) => {
          let data = res.data.rows;
          if (data && data.length > 0 && data.length < that.limit) {
            that.status = "nomore";
            that.loadMore = false;
          } else if (data.length == that.limit) {
            that.status = "loadmore";
          } else {
            that.status = "nomore";
          }
          that.listData = [...that.listData, ...data];
        });
    },
  },
};
</script>

<style lang="less">
page {
  background-color: #f4f4f4;
}

.box {
  border-radius: 20rpx;
  padding-right: 0;
}
.edit-box {
  padding: 0 30rpx;
  margin-top: 40rpx;

  .edit {
    padding: 8rpx 40rpx;
    border: 1px solid #ddd;
    border-radius: 20rpx;
    font-size: 26rpx;
    color: #666;
    margin-left: 30rpx;
  }
}
</style>