define('vue-components', [
	'pagination',
	'module-card',
	'v-checkbox',
	'module-create'
	], function() {
	return {
		use: function(name) {
			require(name)();
		}
	}
});

define('pagination', ['jquery', 'vue'], function($, Vue) {
    var template = '\
<section class="pagination" v-show="all>0">\
    <a href="javascript:;" @click.stop="curr > 1 && curr--" :class="{disabled: curr <= 1}">&lt;</a>\
    <template v-for="index in indexs">\
        <a href="javascript:;" v-text="index" @click="(curr=index)" :class="{active: index == curr}"></a>\
    </template>\
    <a href="javascript:;" @click.stop="curr < all && curr++" :class="{disabled: curr >= all}">&gt;</a>\
</section>';

    return function() {
	    Vue.component('pagination', {
	        template: template,
	        props: ['curr', 'sum', 'pagesize'],
	        computed: {
	        	all: function() {
	        		var vm = this;

	        		return parseInt(vm.sum / vm.pagesize) + (vm.sum % vm.pagesize == 0 ? 0 : 1);
	        	},
	            indexs: function() {
	                var vm = this,
	                    curr = parseInt(vm.curr),
	                    pagesize = vm.pagesize,
	                    start = 1,
	                    end = parseInt(vm.sum / pagesize) + (vm.sum % pagesize == 0 ? 0 : 1),
	                    arr = [];

	                if (end > 5) {
	                    if (curr > 3 && curr < end - 2) {
	                        start = curr - 2;
	                        end = curr + 2;
	                    } else {
	                        if (curr <= 3) {
	                            end = 5;
	                        } else {
	                            start = end - 4;
	                        }
	                    }
	                }

	                while (start <= end) {
	                    arr.push(start);
	                    start++;
	                }
	                return arr;
	            }
	        },
	        watch: {
	            curr: function(newValue, oldValue) {
	                if (newValue <= 0) {
	                    this.curr = 1;
	                } else if (newValue > this.all) {
	                    this.curr = this.all || 1;
	                }

	                if (this.curr == oldValue) return;
	                
	                this.$emit('currChange', this.curr);
	            }
	        }
	    });
    }
});

define('v-checkbox', ['vue', 'jquery'], function(Vue) {
	var template = '\
<div class="checkbox-wrapper">\
	<label v-text="label"></label>\
	<input type="checkbox" ref="checkbox" class="checkbox" :id="id" >\
	<label class="checkbox-inner" :for="id" @click="checked"></label>\
</div>';
	
	return function() {
		Vue.component('checkbox', {
			template: template,
			props: ['label', 'type'],
			data: function() {
				return {
					status: false
				}
			},
			methods: {
				checked: function(e) {
					this.$emit('checked', this.type, !this.status);
					this.setStatus(!this.status);
					e.preventDefault();
					e.stopPropagation();
				},
				setStatus: function(status) {
					var checkbox = this.$refs.checkbox;
					this.status = status;

					$(checkbox).prop("checked", status);
				}
			},
			computed: {
				id: function() {
					return 'layout-checkbox-' + this._uid;
				}
			}
		});
	}
});