<template>
    <view>
        <view class="p3">
            <u-search
                :show-action="true"
                action-text="搜索"
                :animation="false"
                v-model="params.keyword"
                @custom="search"
                @clear="search"
                @search="search"></u-search>
        </view>
        <scroll-view
            scroll-y="true"
            class="scroll-Y"
            @scrolltolower="lower"
            refresher-enabled="true"
            :refresher-triggered="triggered"
            :refresher-threshold="50"
            refresher-background="#f4f4f4"
            @refresherrefresh="onRefresh"
            @refresherrestore="onRestore"
            @refresherabort="onAbort">
            <view class="list" @tap="navigateTo(item)" v-for="item in dataList" :key="item.id">
                <view class="time">
                    <u-tag size="mini" :text="levelMap[item.level]" :type="$DictCache.COLOR.CHECK_JOB_STATUS[item.level]"></u-tag>
                </view>
                <view>
                    <view>
                        <text class="my1 u-line-1 f-size-26">部件编号：{{ item.no }}</text>
                    </view>
                    <view class="text-color-9">
                        <text>部件名称：{{ item.name }}</text>
                    </view>
                    <view class="my1">
                        <text class="text-color-9">部件类别：{{ item.typeName }}</text>
                    </view>
                    <!-- <view class="my1">
            <text class="text-color-9">中标供应商: {{item.companyId}}</text>
          </view> -->
                </view>
            </view>
            <u-loadmore :status="loadmore" />
        </scroll-view>
    </view>
</template>
<script>
export default {
    data() {
        return {
            // 表示value等于这些值，就属于默认值
            loadmore: 'loadmore',
            dataList: [],
            params: {
                pageNum: 1,
                pageSize: 10,
                keyword: null,
                sbId: this.$route.query.sbId,
                dataScope: {
                    sortBy: 'desc',
                    sortName: 'update_time'
                }
            },
            levelMap: {}
        }
    },
    onLoad(options) {
        this.levelMap = this.$DictCache.getLabelByValueMapByType('PART_LEVEL')
    },
    onShow() {
        this.onRefresh()
    },
    methods: {
        navigateTo(item) {
            const pages = getCurrentPages();
            const prevPage = pages[pages.length - 2];
            prevPage.bom = {
                sbPartId: item.id,
                sbPartName: item.name
            }
            uni.navigateBack();
        },
        getData() {
            this.$Http.getPartInfoPage(this.params).then(res => {
                this.total = res.data.total
                this.triggered = false
                this._freshing = false
                this.dataList = [...this.dataList, ...res.data.rows]
                if (this.total > this.dataList.length) {
                    this.loadmore = 'loadmore'
                } else {
                    this.loadmore = 'nomore'
                }
            })
        },
        search() {
            this.dataList = []
            this.params.pageNum = 1
            this.getData()
        },
        onPulling(e) {
            console.log('onpulling', e)
        },
        onRefresh() {
            if (this._freshing) return
            this._freshing = true
            this.dataList = []
            this.triggered = 'restore'
            this.getData()
        },
        onRestore() {
            this.triggered = 'restore' // 需要重置
        },
        onAbort() {
            console.log('onAbort')
        },
        lower() {
            if (this.loadmore === 'loadmore') {
                this.params.pageNum++
                this.getData()
            }
        }

    }
}
</script>
<style lang="scss" scoped>
.scroll-Y {
  height: calc(100vh - 124px);
}
.list {
  margin: 20rpx;
  background: #ffffff;
  box-shadow: 0rpx 3rpx 7rpx 0rpx rgba(47, 47, 47, 0.19);
  border-radius: 12rpx;
  position: relative;
  padding: 35rpx 30rpx;
  font-size: 12px;
  margin-bottom: 10px;
  .time {
    position: absolute;
    right: 20rpx;
    color: #999999;
    top: 20rpx;
  }
  .btn {
    position: absolute;
    right: 20rpx;
    bottom: 20rpx;
    display: flex;
    & > view {
      margin: 0 10rpx;
    }
  }
}
</style>
