医生号源日期分页处理

component/appointment/date-source.js

@@ -4,13 +4,13 @@
                    <p class="c-f18">就诊日期</p>\
                    <div class="div-table">\
                        <div class="table-row">\
                            <div class="table-cell arrow-cell" :class="{\'active\': page!=1}" @click="prePage"><i class="fa fa-caret-left c-f20 c-909090"></i></div>\
                            <div v-for="d in planDate" class="table-cell">{{d.date}} {{d.day}}</div>\
                            <div class="table-cell arrow-cell" :class="{\'active\': page!=totalPage}" @click="nextPage"><i class="fa fa-caret-right c-f20 c-909090"></i></div>\
                            <div class="table-cell arrow-cell" :class="{\'active\': curPage!=1}" @click="prePage"><i class="fa fa-caret-left c-f20 c-909090"></i></div>\
                            <div v-for="(d, index) in planDate" v-show="showCol(index)" class="table-cell">{{d.dStr}} {{d.day}}</div>\
                            <div class="table-cell arrow-cell" :class="{\'active\': curPage != totalPage}" @click="nextPage"><i class="fa fa-caret-right c-f20 c-909090"></i></div>\
                        </div>\
                        <div class="table-row">\
                            <div class="table-cell arrow-cell c-f16 bgc-ebf4f3">上午</div>\
                            <div class="table-cell" v-for="(item, index) in amData" :class="{\'active\': item.arrangeID == arrangeid && arrangeid!=undefined}" @click="getNumbers(item.arrangeID)">\
                            <div class="table-cell" v-for="(item, index) in amData" v-show="showCol(index)" :class="{\'active\': item.arrangeID == arrangeid && arrangeid!=undefined}" @click="getNumbers(item.arrangeID)">\
                                <span :class="getColor(item.arrangeStatus, item.numberStatus)">{{getStatusName(item.arrangeStatus, item.numberStatus)}}</span><br/>\
                                <span class="yy-tag" :class="{\'active\': item.arrangeStatus==1 && item.numberStatus==1}">预约</span>\
                            </div>\
@@ -18,7 +18,7 @@
                        </div>\
                        <div class="table-row">\
                            <div class="table-cell arrow-cell c-f16 bgc-ebf4f3">下午</div>\
                            <div class="table-cell" v-for="(item, index) in pmData" :class="{\'active\': item.arrangeID == arrangeid && arrangeid!=undefined}" @click="getNumbers(item.arrangeID)">\
                            <div class="table-cell" v-for="(item, index) in pmData" v-show="showCol(index)" :class="{\'active\': item.arrangeID == arrangeid && arrangeid!=undefined}" @click="getNumbers(item.arrangeID)">\
                                <span :class="getColor(item.arrangeStatus, item.numberStatus)">{{getStatusName(item.arrangeStatus, item.numberStatus)}}</span><br/>\
                                <span class="yy-tag" :class="{\'active\': item.arrangeStatus==1 && item.numberStatus==1}">预约</span>\
                            </div>\
@@ -37,7 +37,7 @@
                        <button class="btn btn-primary" @click="submitForm">确认预约</button>\
                    </div>\
                </section>',
        props: ['doctorsn', 'arrangeid'],
        props: ['doctorsn', 'arrangeid', 'registerdate'],
        data: function(){
            return {
                planDate: [],
@@ -48,10 +48,11 @@
                registerNumber: '',
                modeId: '', //号源池模式:1：实时号源池, 0：非实时号源池
                baseInfo: {}, //记录医生医院等基础信息
                specialPrice: 0, //挂号费（单位：分）
                specialPrice: 0, //挂号费（单位：分）,
                curPage: 1, //当前页
                page: 1 , //日期分页,当有号源的日期数超过了7天,则需要分页展示
                totalPage: 1,
                pageSize: 7
                totalPage: 5,
                pageSize: 31
            }
        },
        mounted: function(){
@@ -71,18 +72,41 @@
                    this.arrangeid = code;
                }
            },
            showCol: function(index){
                //默认分页一页展示7条数据,然后显示一个月的数据31天
                switch(this.curPage){
                    case 1:
                        return index < 7 ? true: false;
                        break;
                    case 2:
                        return index >=7 && index<14 ? true: false;
                        break;
                    case 3:
                        return index >=14 && index<21 ? true: false;
                        break;
                    case 4:
                        return index >=21 && index<28? true: false;
                        break;
                    case 5:
                        return index>=28 ? true : false;
                        break;
                    default:
                        return true;
                        break;
                }
            },
            chooseNumber: function(id, modeId){
                this.registerNumber = id;
                this.modeId = modeId;
            },
            prePage: function(){
                if(this.page > 1){
                    this.page --;
                if(this.curPage > 1){
                    this.curPage --;
                }
            },
            nextPage: function(){
                if(this.page < this.totalPage){
                    this.page ++;
                if(this.curPage < this.totalPage){
                    this.curPage ++;
                }
            },
            submitForm: function(){
@@ -164,42 +188,66 @@
                    var list = res.obj.Result;
                    //先groupby结果,判断有几天号源
                    var dateGroup = _.groupBy(list, 'registerDate');
                    console.log(dateGroup);
                    for(key in dateGroup){
                        var d = new Date(key);
                        vm.planDate.push({
                            date: d.format("MM/dd"),
                    //展示整个月的数据
                    var now = new Date();
                    var planDate = [],
                        selectedIndex;
                    for(i=0; i<31; i++){
                        var d = new Date();
                        d.setDate(now.getDate()+i);
                        var dStr = d.format("yyyy-MM-dd");
                        planDate.push({
                            date: dStr,
                            dStr: d.format("MM/dd"),
                            day: getWeekDay(d.getDay())
                        }); //日期记录
                        
                        var objArr = dateGroup[key];
                        if(objArr.length == 1){
                            var obj = objArr[0];
                            if(obj.timeId == 1){ //1 上午 2下午 3 晚上
                                vm.amData.push(obj);
                                vm.pmData.push({
                                    arrangeID: '', //没有排号
                                    arrangeStatus: 0,
                                });
                            }else{
                                vm.pmData.push(obj);
                                vm.amData.push({
                                    arrangeID: '', //没有排号
                                    arrangeStatus: 0,
                                });
                            }
                        }else if(objArr.length == 2){
                            for(j=0; j<objArr.length; j++){
                                var obj = objArr[j];
                        //记录选中的日期
                        if(vm.registerdate == dStr){
                            selectedIndex = i;
                        }
                        var objArr = dateGroup[dStr];
                        if(objArr && objArr.length > 0){
                            if(objArr.length == 1){
                                var obj = objArr[0];
                                if(obj.timeId == 1){ //1 上午 2下午 3 晚上
                                    vm.amData.push(obj);
                                }
                                if(obj.timeId == 2 || obj.timeId == 3){
                                    vm.pmData.push({
                                        arrangeID: '', //没有排号
                                        arrangeStatus: 0,
                                    });
                                }else{
                                    vm.pmData.push(obj);
                                    vm.amData.push({
                                        arrangeID: '', //没有排号
                                        arrangeStatus: 0,
                                    });
                                }
                            }else if(objArr.length == 2){
                                for(j=0; j<objArr.length; j++){
                                    var obj = objArr[j];
                                    if(obj.timeId == 1){ //1 上午 2下午 3 晚上
                                        vm.amData.push(obj);
                                    }
                                    if(obj.timeId == 2 || obj.timeId == 3){
                                        vm.pmData.push(obj);
                                    }
                                }
                            }
                        }else{
                            vm.amData.push({
                                arrangeID: '', //没有排号
                                arrangeStatus: 0,
                            });
                            vm.pmData.push({
                                arrangeID: '', //没有排号
                                arrangeStatus: 0,
                            });
                        }
                    }
                    vm.planDate = planDate;
                    if(selectedIndex || selectedIndex == 0){
                        vm.curPage = parseInt(selectedIndex / 7) + 1;
                    }
                }else{
                    showErrorMessage(res.obj.Message);
                }

page/appointment/html/select-time.html

@@ -46,7 +46,7 @@
                            </div>
                        </section>
                        <!--医生号源日期展示-->
                        <date-scource :doctorsn="doctorSn" :arrangeid="arrangeID"></date-scource>
                        <date-scource :doctorsn="doctorSn" :arrangeid="arrangeID" :registerdate="registerDate"></date-scource>
                    </div>
                </div>
            </div>

page/appointment/js/select-time.js

@@ -1,12 +1,14 @@
var request = GetRequest(),
    doctorSn = Base64.decode(request.doctorSn),
    arrangeID = request.arrangeID;
    arrangeID = request.arrangeID,
    registerDate = request.registerDate;
new Vue({
    el: "#main",
    data: {
        doctorSn: doctorSn,
        docInfo: {},
        arrangeID: arrangeID
        arrangeID: arrangeID,
        registerDate: registerDate
    },
    mounted: function(){
        EventBus.$emit("jump-step",{step:3});//step:跳转的步数