FenghuaDigitalDoorplatePhase1_ZheZhengDing/src/pages/home/components/enterpriseList/index.vue

<script>
import {getEnterpriseList} from "@/api/commitment";

export default {
  props:{
    propDataList: {
      type: Array,
      default: () => []
    },
    /* 如果为true则不再使用接口请求 */
    noRequest: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      enterpriseList: [],
      loading: false,
      finished: false,
      current: 0,
      size: 10
    };
  },
  mounted() {
    if(this.noRequest) {
      this.finished = true;
      this.loading = false;
    }
  },
  watch: {
    propDataList: {
      handler(val) {
        if(this.noRequest) {
          this.enterpriseList = val
        }
      },
      deep:true
    }
  },
  methods: {
    /* 获取企业列表 */
    async handleGetEnterpriseList() {
      this.loading = true;  // 开始加载
      try {
        const res = await getEnterpriseList({
          current: this.current + 1,
          size: this.size
        });
        if (res.data.records) {
          this.enterpriseList = this.enterpriseList.concat(res.data.records || [])
          this.current++;
          this.finished = res.data.records.length < this.size;  // 判断是否还有更多数据
        }
        this.loading = false;  // 加载结束
      } catch (e) {
        console.log(e);
        this.loading = false;
      }
    },
    handleClick(item) {
      this.$router.push({
        path: '/subPages/pages/commitment/enterpriseCommitment/index',
        query: {
          uuid: item.uuid
        }
      })
    }
  }
};
</script>

<template>
    <van-list
        v-model="loading"
        @load="handleGetEnterpriseList"
        :finished="finished"
        finished-text="没有更多数据了"
    >
      <van-cell
          v-for="(item, index) in enterpriseList"
          :key="item.uuid"
          class="box"
          @click="handleClick(item)"
      >
        <template #default>
          <view class="top">
            <view class="name">
              {{ item.companyName }}
              <!--后端计算量大,先去掉-->
              <!--<van-tag round color="#f4a40d" style="margin-left: 5px"> {{item.creditGoal || '暂无' }}</van-tag>-->
            </view>
          </view>
          <view class="details">
            最新承诺时间 : {{ item.createTime | date("YYYY-MM-DD HH:mm:ss") }}
          </view>
        </template>
      </van-cell>
    </van-list>
</template>


<style scoped lang="scss">
.box {
  min-height: 78px;
  background: #FFFFFF;
  border-radius: 6px;
  margin: 12px 10px;
  width: auto;

  .top {
    display: flex;
    justify-content: space-between;

    .name {
      font-size: 16px;
      font-weight: bold;
      flex: 1;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      display: flex;
    }
  }

  .details {
    font-size: 14px;
    color: #666666;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}
</style>