<template>
    <div class='replenishment-start-device-list'>
        <van-sticky>
            <van-tabs v-model="active">
                <van-tab title="缺货设备"></van-tab>
                <van-tab title="全部设备"></van-tab>
            </van-tabs>
        </van-sticky>
        <CustomList 
			ref="customList"
			@onLoad="onLoad">
			<div class="list plr15 pt10">
                <div v-for="(item, i) in list" :key="i" class="item bgc-fff plr15 c-333 fs-14">
                    <div class=" ptb10 kitbox">
                        <div class="box-flex-1 fs-14">
                            众健信联1号
                        </div>
                        <div class="">
                            <van-tag type="success">在线</van-tag>
                            <van-tag type="success" class="ml5">在售</van-tag>
                        </div>
                    </div>
                    <div class="lh20 ptb10 kitbox">
                        <div class="box-flex-1">
                            <div>设备编号：149122021070000</div>
                            <div>上次补货时间：2021-09-11 09:00:14</div>
                        </div>
                    </div>
                    <div class="operate kitbox pt10 pb10">
                        <div class=" pr10"><van-button type="info" size="small" block  plain>标记已补货</van-button></div>
                        <div class="pl10"><van-button @click="gotoUrl('./deviceDetail')" type="info" size="small" block>开始补货</van-button></div>
                    </div>
                </div>
            </div>
		</CustomList>
    </div>
</template>
<script>
export default{
    name: 'replenishmentStartDeviceList',
    data(){
        return {
            list: [],
            result: [],
            selAll: false,
            active: 0
        }
    },
    created() {
        
    },
    methods:{
        onLoad({page, pageSize, searchText}){
            setTimeout(()=>{
                for(var i=0; i<pageSize; i++){
                    this.list.push((page-1)*pageSize + i)
                }
                this.$refs.customList.endLoad(page==5, this.list.length)
            }, 1000)
            return
            var that = this, 
                params = {
                    orgCode: this.$store.getters.orgCode,
                    doctorNameKey: searchText,
                    dept: this.routerParam.dept,
                    diseaseKey: this.routerParam.disease,
                    page: page,
                    pagesize: pageSize
                };
            
            zhuanjiazixunApi
                .findDoctorByHospitalAndDiseaseAndDept(params)
                .then(res=>{
                    if(res.status == 200){
                        var list = res.detailModelList.map(item=>{
                            var data = item
                            data.photo = this.$root.setDocPhoto(data.photo)
                            return data
                        })
                        this.list = page==1? list : this.list.concat(list)
                        this.$refs.customList.endLoad(!res.detailModelList || res.detailModelList.length==0, this.list.length)
                    } else {
                        this.$refs.customList[this.active].endLoad(false, true)
                    }
                }).catch(err=>{
                    console.error(err)
                    this.$refs.customList[this.active].endLoad(false, true)
                })
        },
    },
}
</script>
<style lang='scss' scoped>
.replenishment-start-device-list{
    ::v-deep .custom-list .search{
        top: 50px;
    }
    .list{
        .item{
            margin-bottom: 10px;
            border-radius: 5px;
            &:last-child{
                margin-bottom: 0;
            }
            .van-icon{
                position: absolute;
                top: 50%;
                transform: translateY(calc(-50% - 15px));
                right: 0;
                color: #ccc;
            }
        }
    }   
    .operate{
        >div{
            width: 50%;
        }
    }
}
</style>