ZLPMS/PMS.WebUI/ViewModels/QueryProblemByCustom.Mdule.js

'use strict';

var vm = new Vue({
    el: '#vue',
    data: {
        ///全部模块
        page1: {
            page: 0,
            row: 6,
            data: []
        },
        ///未解决
        page2: {
            page: 0,
            row: 6,
            data: []
        },
        ///已解决
        page3: {
            page: 0,
            row: 6,
            data: []
        },
        //问题是否解决标志
        status: '',
        ///检索条件
        SearchCondition: {
            ///查询范围
            scope: [{
                name: '我的问题',
                id: 1,
                active: true
            }, {
                name: '本院问题',
                id: 2,
                active: false
            }],
            time: {
                TimeBegin: '开始时间',
                TimeEnd: '结束时间'
            },
            search: ''
        },
        ///下拉刷新对象
        refresh: []
    },
    methods: {
        initRefresh: function initRefresh() {
            //从缓存中读取查询条件
            var Deft = JSON.parse(getCookie("CustomSearchCondition"));
            //缓存中的查询范围
            if (Deft && Deft.scope) {
                var scope=this.SearchCondition.scope;
                for (var i in scope) {
                    if (scope[i].id == Deft.scope) {
                        scope[i].active = true;
                    } else {
                        scope[i].active = false;
                    }
                }
            }
                

            var that = this;
            var t = 0;
            var deceleration = mui.os.ios ? 0.003 : 0.0009;
            mui('.mui-scroll-wrapper').scroll({
                bounce: false,
                indicators: true, //是否显示滚动条
                deceleration: deceleration
            });
            mui.ready(function () {
                mui.each(document.querySelectorAll('.mui-slider-group .mui-scroll'), function (index, pullRefreshEl) {
                    mui(pullRefreshEl).pullToRefresh({
                        up: {
                            auto: true, //自动执行一次上拉加载，可选；
                            show: true, //显示底部上拉加载提示信息，可选；
                            contentrefresh: '正在加载...', //上拉进行中提示信息
                            contentnomore: '没有更多数据了', //上拉无更多信息时提示信息
                            callback: function callback() {
                                var self = this;
                                if (t < 3) {
                                    that.refresh.push(self);
                                    t++;
                                }
                                setTimeout(function () {
                                    var ul = self.element.querySelector('.Problem');
                                    if (index == 0) {
                                        //全部选项卡的index是0，当显示它的时候，滑动页面加1，调数据，以下以此类推
                                        that.page1.page += 1;
                                        that.createFragment(ul, index, self, that.page1.page);
                                    } else if (index == 1) {
                                        that.page2.page += 1;
                                        that.createFragment(ul, index, self, that.page2.page);
                                    } else if (index == 2) {
                                        that.page3.page += 1;
                                        that.createFragment(ul, index, self, that.page3.page);
                                    }
                                }, 1000);
                            }
                        }
                    });
                });
            });
            //底部导航栏
            document.getElementById('Home').addEventListener('tap', function () {
                window.location.href = '/MobileProblem/Home';
            });
            document.getElementById('my').addEventListener('tap', function () {
                window.location.href = '/MobileProblem/My';
            });
            document.getElementById('NewProblem').addEventListener('tap', function () {
               
            });
            ///顶部下拉导航
            var menuWrapper = document.getElementById("menu-wrapper");
            var menu = document.getElementById("menu");
            var menuWrapperClassList = menuWrapper.classList;
            var backdrop = document.getElementById("menu-backdrop");
            var busying = false;
            backdrop.addEventListener("swipeup", function () {
                if (menuWrapperClassList.contains('mui-active')) {
                    $("#slider").removeClass("top0");

                    document.body.classList.remove('menu-open');
                    menuWrapper.className = 'menu-wrapper fade-out-up animated';
                    menu.className = 'menu bounce-out-up animated';
                    setTimeout(function () {
                        backdrop.style.opacity = 0;
                        menuWrapper.classList.add('hidden');
                    }, 500);
                }
            });
            backdrop.addEventListener('tap', function () {
                if (busying) {
                    return;
                }
                busying = true;
                if (menuWrapperClassList.contains('mui-active')) {
                    $("#slider").removeClass("top0");

                    document.body.classList.remove('menu-open');
                    menuWrapper.className = 'menu-wrapper fade-out-up animated';
                    menu.className = 'menu bounce-out-up animated';
                    setTimeout(function () {
                        backdrop.style.opacity = 0;
                        menuWrapper.classList.add('hidden');
                    }, 500);
                } else {
                    $("#slider").addClass("top0");
                    document.body.classList.add('menu-open');
                    menuWrapper.className = 'menu-wrapper fade-in-down animated mui-active';
                    menu.className = 'menu bounce-in-down animated';
                    backdrop.style.opacity = 1;
                }
                setTimeout(function () {
                    busying = false;
                }, 500);
            });
            document.getElementById("icon-menu").addEventListener('tap', function () {
                if (busying) {
                    return;
                }
                busying = true;
                if (menuWrapperClassList.contains('mui-active')) {
                    $("#slider").removeClass("top0");
                    document.body.classList.remove('menu-open');
                    menuWrapper.className = 'menu-wrapper fade-out-up animated';
                    menu.className = 'menu bounce-out-up animated';
                    setTimeout(function () {
                        backdrop.style.opacity = 0;
                        menuWrapper.classList.add('hidden');
                    }, 500);
                } else {
                    $("#slider").addClass("top0");
                    document.body.classList.add('menu-open');
                    menuWrapper.className = 'menu-wrapper fade-in-down animated mui-active';
                    menu.className = 'menu bounce-in-down animated';
                    backdrop.style.opacity = 1;
                }
                setTimeout(function () {
                    busying = false;
                }, 500);
            });
            ///重置下拉刷新
            document.getElementById("reload").addEventListener('tap', function () {
                ///保存客户配置
                var CustomSearchCondition = {
                    scope: that.forech(that.SearchCondition.scope)
                };
                setCookie("CustomSearchCondition", JSON.stringify(CustomSearchCondition), 3);

                if (busying) {
                    return;
                }
                busying = true;
                //全部
                that.page1 = {
                    page: 0,
                    row: 6,
                    data: []
                };
                ///未解决
                that.page2 = {
                    page: 0,
                    row: 6,
                    data: []
                };
                ///已解决
                that.page3 = {
                    page: 0,
                    row: 6,
                    data: []
                };
                //that.refresh.refresh(true);
                //that.refresh.pullUpLoading(true);
                var _iteratorNormalCompletion = true;
                var _didIteratorError = false;
                var _iteratorError = undefined;

                try {
                    for (var _iterator = that.refresh[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done) ; _iteratorNormalCompletion = true) {
                        var ref = _step.value;

                        ref.refresh(true);
                        ref.pullUpLoading(false);
                    }
                } catch (err) {
                    _didIteratorError = true;
                    _iteratorError = err;
                } finally {
                    try {
                        if (!_iteratorNormalCompletion && _iterator.return) {
                            _iterator.return();
                        }
                    } finally {
                        if (_didIteratorError) {
                            throw _iteratorError;
                        }
                    }
                }

                if (menuWrapperClassList.contains('mui-active')) {
                    $("#slider").removeClass("top0");
                    document.body.classList.remove('menu-open');
                    menuWrapper.className = 'menu-wrapper fade-out-up animated';
                    menu.className = 'menu bounce-out-up animated';
                    setTimeout(function () {
                        backdrop.style.opacity = 0;
                        menuWrapper.classList.add('hidden');
                    }, 500);
                } else {
                    $("#slider").addClass("top0");
                    document.body.classList.add('menu-open');
                    menuWrapper.className = 'menu-wrapper fade-in-down animated mui-active';
                    menu.className = 'menu bounce-in-down animated';
                    backdrop.style.opacity = 1;
                }
                setTimeout(function () {
                    busying = false;
                }, 500);
            });
        },
        LoadTimeContent: function LoadTimeContent() {
            var btns = $('.time-btn');
            btns.each(function (i, btn) {
                btn.addEventListener('tap', function () {
                    var _self = this;
                    if (_self.picker) {
                        _self.picker.show(function (rs) {
                            btn.innerHTML = rs.text;
                            _self.picker.dispose();
                            _self.picker = null;
                        });
                    } else {
                        var optionsJson = this.getAttribute('data-options') || '{}';
                        var options = JSON.parse(optionsJson);
                        var id = this.getAttribute('id');

                        _self.picker = new mui.DtPicker(options);
                        _self.picker.show(function (rs) {
                            btn.innerHTML = rs.text;
                            _self.picker.dispose();
                            _self.picker = null;
                        });
                    }
                }, false);
            });
        },
        //重置搜索条件
        Deafault: function Deafault() {
            this.SearchCondition = {
                ///查询范围
                scope: [{
                    name: '我的问题',
                    id: '1',
                    active: true
                }, {
                    name: '本院问题',
                    id: '2',
                    active: false
                }],
                time: {
                    TimeBegin: '开始时间',
                    TimeEnd: '结束时间'
                },
                search: ''
            };
            $("#TimeBegin").html("开始时间");
            $("#TimeEnd").html("结束时间");
        },
        ///加载问题
        createFragment: function createFragment(ul, index, self, pageNum) {
            var fragment = document.createDocumentFragment();
            var page;
            var status;
            if (index == 0) {
                status = ''; //为0的时候是全部
                page = this.page1;
            } else if (index == 1) {
                status = 0; //为1的时候是未解决
                page = this.page2;
            } else if (index == 2) {
                status = 1; //为2的时候是已解决
                page = this.page3;
            }
            var param = {
                Pages: page.page, //页数
                rows: page.row, //想要几条数据
                ProblemStatus: status, //状态
                SelectType: this.forech(this.SearchCondition.scope), //查询类型
                TimeBegins: $("#TimeBegin").html(),
                TimeEnds: $("#TimeEnd").html(),
                SelectConditon: this.SearchCondition.search
            };
            ///后台请求数据
            $.get('/MobileProblem/QueryMyProblemByCustom', param, function (data) {
                var info = data;
                if (info.length == 0) {
                    //当datas.length为0时，表示没有数据了
                    self.endPullUpToRefresh(true); //当为true时，底部出现没有更多数据，并且不能滑动
                } else {
                    var _iteratorNormalCompletion2 = true;
                    var _didIteratorError2 = false;
                    var _iteratorError2 = undefined;

                    try {
                        for (var _iterator2 = info[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done) ; _iteratorNormalCompletion2 = true) {
                            var dd = _step2.value;

                            if (!dd.附件路径) {
                                dd.附件路径 = "/Content/Images/zlpng.png";
                            } else {
                                dd.附件路径 = "/MobileProblem/ViewProblemImage/" + dd.附件路径 + "?type=s";
                            }
                            if (dd.是否终止 == '1') {
                                dd.icon = "#icon-yizhongzhi1";
                            } else if (dd.是否解决 == '1') {
                                dd.icon = "#icon-yijiejue3";
                            } else {
                                dd.icon = "#icon-weijiejue";
                            }
                            page.data.push(dd);
                        }
                    } catch (err) {
                        _didIteratorError2 = true;
                        _iteratorError2 = err;
                    } finally {
                        try {
                            if (!_iteratorNormalCompletion2 && _iterator2.return) {
                                _iterator2.return();
                            }
                        } finally {
                            if (_didIteratorError2) {
                                throw _iteratorError2;
                            }
                        }
                    }

                    self.endPullUpToRefresh(); //当为false或空时，底部出现正在加载，滑动到下一页
                }
            });
        },
        forech: function forech(obj) {
            var re;
            var _iteratorNormalCompletion3 = true;
            var _didIteratorError3 = false;
            var _iteratorError3 = undefined;

            try {
                for (var _iterator3 = obj[Symbol.iterator](), _step3; !(_iteratorNormalCompletion3 = (_step3 = _iterator3.next()).done) ; _iteratorNormalCompletion3 = true) {
                    var i = _step3.value;

                    if (i.active) {
                        re = i.id;
                        return re;
                    }
                }
            } catch (err) {
                _didIteratorError3 = true;
                _iteratorError3 = err;
            } finally {
                try {
                    if (!_iteratorNormalCompletion3 && _iterator3.return) {
                        _iterator3.return();
                    }
                } finally {
                    if (_didIteratorError3) {
                        throw _iteratorError3;
                    }
                }
            }

            ;
        },
        ToActive: function ToActive(sc, i) {
            var _iteratorNormalCompletion4 = true;
            var _didIteratorError4 = false;
            var _iteratorError4 = undefined;

            try {
                for (var _iterator4 = sc[Symbol.iterator](), _step4; !(_iteratorNormalCompletion4 = (_step4 = _iterator4.next()).done) ; _iteratorNormalCompletion4 = true) {
                    var dd = _step4.value;

                    dd.active = false;
                }
            } catch (err) {
                _didIteratorError4 = true;
                _iteratorError4 = err;
            } finally {
                try {
                    if (!_iteratorNormalCompletion4 && _iterator4.return) {
                        _iterator4.return();
                    }
                } finally {
                    if (_didIteratorError4) {
                        throw _iteratorError4;
                    }
                }
            }

            i.active = true;
        },
        ///进入详细页面
        Deatil: function Deatil(id) {
            //mui.openWindow({
            //    url: '/MobileProblem/ProblemDetail/' + id
            //});
            window.location.href = '/MobileProblem/ProblemDetail/' + id;
        }

    },
    mounted: function mounted() {
        mui.init();
        this.initRefresh();
        this.LoadTimeContent();
    }
});