intelligent-medicine-cabinet/mini-pro-web/src/views/replenishment/recordList.vue

<template>
    <div class='replenishment-record-list'>
        <van-sticky>
            <van-tabs v-model="active">
                <van-tab title="补货"></van-tab>
                <van-tab title="换货"></van-tab>
                <van-tab title="上货"></van-tab>
            </van-tabs>
        </van-sticky>

        <div class="list">
            <van-collapse v-model="activeName" accordion>
                <van-collapse-item v-for="(item, i) in list" :key="i" :title="item.title" :name="item.id">
                    <div class="item" v-for="(citem, k) in item.children" :key="k">
                        <div>补货时间：2020-08-24 17:15:19</div>
                        <div>设备编号：149122021070000</div>
                        <div>商品数量：2</div>
                        <div>补货人员：张三</div>
                    </div>
                </van-collapse-item>
            </van-collapse>
        </div>
    </div>
</template>
<script>
export default{
    name: 'replenishmentRecordList',
    data(){
        return {
            active: 0,
            activeName: 1,
            list: [{
                title: '众健信联1号',
                id: 1,
                children: [{}, {}],
                noMore: false
            }],
        }
    },
    created() {
        
    },
    methods:{
        onLoad({page, pageSize, searchText}){
            setTimeout(()=>{
                for(var i=0; i<pageSize; i++){
                    this.list.push((page-1)*pageSize + i)
                }
                console.log(this.list)
                debugger
                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-record-list{
    .list{
        ::v-deep .van-collapse-item__content{
            padding: 0 15px;
        }
        .van-cell::after
        .item{
            padding: 10px 0;
            border-bottom: 1px solid #e1e1e1;
            &:last-child{
                border-bottom: 0 ;
            }
        }
    }   
}
</style>