//有新增
Vue.prototype.$validate = {
    xss: function (value) {
        let str = value + '';
        if (str.indexOf('\'') > -1 || str.indexOf('\"') > -1 || str.indexOf('%') > -1)
            return false;
        else
            return true;
    },
    name: function (value) {
        let str = value + '';
        let reg = /^[_a-zA-Z]+[_a-zA-Z0-9]*$/;
        if (reg.test(str))
            return true;
        else
            return false;
    },
    chinese: function (value) {
        let str = value + '';
        let reg = /^[\u4e00-\u9fa5]+$/;
        if (reg.test(str))
            return true;
        else
            return false;
    },
    email: function (value) {
        let str = value + '';
        let reg = /^([\w-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([\w-]+\.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(\]?)$/;
        if (reg.test(str))
            return true;
        else
            return false;
    },
    phone: function (value) {
        let str = value + '';
        let reg = /^1[0-9]{10}$/;
        if (reg.test(str))
            return true;
        else
            return false;
    },
    number: function (value) {
        let str = value + '';
        let n = Number(str);
        if (Number.isNaN(n))
            return false;
        else
            return true;
    },
    int: function (value) {
        let str = value + '';
        let n = Number(str);
        if (Number.isInteger(n))
            return true;
        else
            return false;
    },
    datetime: function (value) {
        let str = value + '';
        let reg = /^[0-9]{4}-[0-9]{1,2}-[0-9]{1,2} [0-9]{1,2}:[0-9]{1,2}:[0-9]{1,2}$/;
        if (reg.test(str)) {
            let n = new Date(str).getTime();
            if (Number.isNaN(n))
                return false;
            else
                return true;
        }
        else
            return false;
    },
    date: function (value) {
        let str = value + '';
        let reg = /^[0-9]{4}-[0-9]{1,2}-[0-9]{1,2}$/;
        if (reg.test(str)) {
            str += ' 12:12:12';
            let n = new Date(str).getTime();
            if (Number.isNaN(n))
                return false;
            else
                return true;
        }
        else
            return false;
    },
    time: function (value) {
        let str = value + '';
        let reg = /^[0-9]{1,2}:[0-9]{1,2}:[0-9]{1,2}$/;
        if (reg.test(str)) {
            str = '1949-10-1 ' + str;
            let n = new Date(str).getTime();
            if (Number.isNaN(n))
                return false;
            else
                return true;
        }
        else
            return false;
    }
};
//有改动
Vue.component('yj-form', {
    template:
        `
    <table border="0" width="100%" align="center" cellpadding="0" cellspacing="5" class="yj-form">
        <tr style="height:0px;"> 
            <th :width="td.widths[0]"></th>
            <th :width="td.widths[1]"></th>
            <th :width="td.widths[2]"></th>
        </tr>
        <slot></slot>
    </table>
    `,
    data: function () {
        return {
            td: {
                widths: [], aligns: [], valigns: []
            }
        }
    },
    props: {
        widths: {
            type: String,
            default: function () {
                return '80##0';
            }
        },
        height: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        aligns: {
            type: String,
            default: function () {
                return 'right#left#left';
            }
        },
        valigns: {
            type: String,
            default: function () {
                return 'top#top#top';
            }
        },
        errorposition: {
            type: String,
            default: function () {
                return '';
            }
        },
        data: {
            type: Object,
            default: function () {
                return undefined;
            }
        },
        rules: {
            type: Object,
            default: function () {
                return undefined;
            }
        }
    },
    computed: {
        in_layout: function () {
            return {
                widths: this.widths,
                aligns: this.aligns,
                valigns: this.valigns
            };
        }
    },
    watch: {
        in_layout: {
            immediate: true,
            handler(newVal, oldVal) {
                this.td.widths = newVal.widths.split('#');
                this.td.aligns = newVal.aligns.split('#');
                this.td.valigns = newVal.valigns.split('#');
            }
        }
    },
    provide: function () {
        return {
            $height: this.height,
            $aligns: this.td.aligns,
            $valigns: this.td.valigns,
            $errorposition: this.errorposition,
            $validateField: this._validateField,
            $hasstar: this._hasstar,
        }
    },
    methods: {
        _getRules: function (name, trigger) {
            let _this = this;
            let ret = [];
            if (name !== undefined && name !== '' && _this.rules !== undefined) {
                let keys = Object.keys(_this.rules);
                if (keys.filter(function (key) { return key === name }).length > 0) {
                    {
                        if (trigger !== undefined && trigger !== '')
                            ret = _this.rules[name].filter(function (item) { return item.trigger === trigger });
                        else
                            ret = _this.rules[name];
                    }
                }
            }
            return ret;
        },
        _validate: function (value, rules) {
            let errs = [];
            if (rules.length == 0)
                return errs;
            let rules_required = rules.filter(function (item) { return item.required; })
            let rules_other = rules.filter(function (item) { return !item.required; })
            let kongFlag = false;
            if (value === undefined)
                kongFlag = true;
            else if (typeof (value) === 'string') {
                if (value === '')
                    kongFlag = true;
            }
            else if (typeof (value) === 'object') {
                if (value === null)
                    kongFlag = true;
                else if (Array.isArray(value)) {
                    if (value.length === 0)
                        kongFlag = true;
                }
                else if (Object.keys(value).length === 0)
                    kongFlag = true;
            }
            if (rules_required.length === 0 && kongFlag)
                return errs;
            let rules_new = rules_required.concat(rules_other);
            for (let i = 0; i < rules_new.length; i++) {
                let item = rules_new[i];
                let required = item.required !== undefined ? item.required : false;
                let type = item.type !== undefined ? item.type : '';
                let pattern = item.pattern !== undefined ? item.pattern : '';
                let min = item.min !== undefined ? item.min : 0;
                let max = item.max !== undefined ? item.max : 0;
                //2022.09.01改动
                let validator = item.validator !== undefined ? item.validator : '';
                let message = item.message !== undefined ? item.message : '数据无效';
                //let trigger = item.trigger !== undefined ? item.trigger : '';
                if (required) {
                    if (kongFlag) {
                        errs.push(message);
                        break;
                    }
                }
                if (type !== '') {
                    if (typeof (value) !== type) {
                        errs.push(message);
                        break;
                    }
                }
                //2022.09.01改动
                if (typeof (value) === 'string' || typeof (value) === 'number') {
                    if (min > 0) {
                        if (value.length < min) {
                            errs.push(message);
                            continue;
                        }
                    }
                    if (max > 0) {
                        if (value.length > max) {
                            errs.push(message);
                            continue;
                        }
                    }
                    if (pattern !== '') {
                        let reg = pattern;
                        if (!reg.test(value)) {
                            errs.push(message);
                            continue;
                        }
                    }
                    //2022.09.01改动
                    if (validator !== '') {
                        if (!this.$validate[validator](value)) {
                            errs.push(message);
                            continue;
                        }
                    }
                }
            }
            return errs;
        },
        _validateField: function (propName, eventName, callback) {
            let _this = this;
            let rules = _this._getRules(propName, eventName);
            if (rules.length > 0) {
                let value = _this.data[propName];
                let errs = _this._validate(value, rules);
                if (errs.length > 0)
                    callback(false, errs);
                else
                    callback(true);
            }
            else
                callback(true);
        },
        validate: function (callback) {
            let _this = this;
            let ret = [];
            if (_this.data !== undefined && _this.rules !== undefined) {
                for (let key in _this.data) {
                    let rules = _this._getRules(key);
                    if (rules.length > 0) {
                        let value = _this.data[key];
                        let errs = _this._validate(value, rules);
                        if (errs.length > 0) {
                            errs.forEach(function (item) { ret.push(item); });
                        }
                    }
                }
            }
            if (ret.length > 0)
                callback(false, ret);
            else
                callback(true);
        },
        _hasstar: function (prop) {
            if (prop === undefined || prop === '')
                return false;
            let ret = false;
            for (let name in this.rules) {
                if (name === prop && this.rules[name].filter(function (item) { return item.required === true; }).length > 0) {
                    ret = true;
                    break;
                }
            }
            return ret;
        }
    }
});
//有改动
Vue.component('yj-formitem', {
    template:
        `
    <tr>
        <td :align="$aligns[0]" :valign="$valigns[0]" :height="td_height" >
            <div class='form-label'><span v-if="$hasstar(prop)" class="form-star">*</span> {{label}}</div>
        </td>
        <td :align="$aligns[1]" :valign="$valigns[1]">
            <div v-if="text!==undefined" class='form-text'>{{text}}</div>
            <slot></slot>
            <div v-if="$errorposition==='p1'&&err!==''" class='form-error-bottom'>{{err}}</div>
        </td>
        <td :align="$aligns[2]" :valign="$valigns[2]">
            <div v-if="$errorposition==='p2'&&err!==''" class='form-error-right'>{{err}}</div>
        </td>
    </tr>
    `,
    inject: ['$height', '$aligns', '$valigns', '$errorposition', '$validateField', '$hasstar'],
    data: function () {
        return {
            err: ''
        }
    },
    props: {
        height: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        label: {
            type: String,
            default: function () {
                return '';
            }
        },
        text: {
            type: String,
            default: function () {
                return undefined;
            }
        },
        prop: {
            type: String,
            default: function () {
                return '';
            }
        }
    },
    computed: {
        td_height: function () {
            if (this.height > 0)
                return this.height;
            else if (this.$height > 0)
                return this.$height;
            else
                return 28;
        }
    },
    mounted: function () {
        //reg
        let _this = this;
        if (_this.prop !== '' && _this.$errorposition !== '') {
            _this.$on('form-blur', function () {
                _this.$validateField(_this.prop, 'blur', function (valid, errs) {
                    if (!valid) {
                        if (_this.$errorposition === 'p3')
                            _this.$inc.alert(errs[0]);
                        else
                            _this.err = errs[0];
                    }
                    else
                        _this.err = '';
                });
            });
            _this.$on('form-change', function () {
                _this.$validateField(_this.prop, 'change', function (valid, errs) {
                    if (!valid) {
                        if (_this.$errorposition === 'p3')
                            _this.$inc.alert(errs[0]);
                        else
                            _this.err = errs[0];
                    }
                    else
                        _this.err = '';
                });
            });
        }
    }
});
//新增
Vue.component('yj-info', {
    template:
        `
    <table border="0" width="100%" align="center" cellpadding="0" cellspacing="5" class="yj-info">
        <tr style="height:0px;"> 
            <th :width="td.widths[0]"></th>
            <th :width="td.widths[1]"></th>
        </tr>
        <slot></slot>
    </table>
    `,
    data: function () {
        return {
            td: {
                widths: [], aligns: [], valigns: []
            }
        }
    },
    props: {
        widths: {
            type: String,
            default: function () {
                return '80#';
            }
        },
        height: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        aligns: {
            type: String,
            default: function () {
                return 'right#left';
            }
        },
        valigns: {
            type: String,
            default: function () {
                return 'top#top';
            }
        }
    },
    computed: {
        in_layout: function () {
            return {
                widths: this.widths,
                aligns: this.aligns,
                valigns: this.valigns
            };
        }
    },
    watch: {
        in_layout: {
            immediate: true,
            handler(newVal, oldVal) {
                this.td.widths = newVal.widths.split('#');
                this.td.aligns = newVal.aligns.split('#');
                this.td.valigns = newVal.valigns.split('#');
            }
        }
    },
    provide: function () {
        return {
            $height: this.height,
            $aligns: this.td.aligns,
            $valigns: this.td.valigns
        }
    }
});
Vue.component('yj-infoitem', {
    template:
        `
    <tr>
        <td :align="$aligns[0]" :valign="$valigns[0]" :height="td_height" >
            <div class='info-label'>{{label}}</div>
        </td>
        <td :align="$aligns[1]" :valign="$valigns[1]">
            <div v-if="text!==undefined" class='info-text'>{{text}}</div>
            <slot></slot>
        </td>
    </tr>
    `,
    inject: ['$height', '$aligns', '$valigns'],
    props: {
        height: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        label: {
            type: String,
            default: function () {
                return '';
            }
        },
        text: {
            type: String,
            default: function () {
                return undefined;
            }
        }
    },
    computed: {
        td_height: function () {
            if (this.height > 0)
                return this.height;
            else if (this.$height > 0)
                return this.$height;
            else
                return 28;
        }
    }
});
Vue.component('yj-input', {
    template:
        ` 
    <div class="yj-input" :style="style_root">
        <input :type="password?'password':'text'" :value="value" v-on:input="input" v-on:blur="blur" :disabled="disabled" :readonly="readonly" :placeholder="placeholder" :style="style_input"></input>
        <i v-if="icon!==''" id="prefix" :class="icon"></i>
        <i v-if="value!==''" id="suffix" v-on:click="clear" title="清除" class="yj icon-close"></i> 
    </div>
    `,
    props: {
        placeholder: {
            type: String,
            default: function () {
                return '请输入';
            }
        },
        disabled: {
            type: Boolean,
            default: function () {
                return false;
            }
        },
        readonly: {
            type: Boolean,
            default: function () {
                return false;
            }
        },
        password: {
            type: Boolean,
            default: function () {
                return false;
            }
        },
        width: {
            type: Number,
            default: function () {
                return 200;
            }
        },
        borderradius: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        icon: {
            type: String,
            default: function () {
                return '';
            }
        },
        value: {
            type: String,
            default: function () {
                return '';
            }
        }
    },
    computed: {
        style_root: function () {
            let str = '';
            if (this.width <= 0)
                str = 'display:block;';
            return str;
        },
        style_input: function () {
            let str = '';
            if (this.width > 0)
                str += 'width:' + this.width + 'px;';
            else if (this.width < 0)
                str += 'width:' + Math.abs(this.width) + '%;';
            else
                str += 'width:100%;';
            if (this.icon !== '')
                str += 'padding-left:22px;';
            else
                str += 'padding-left:5px;';
            if (this.value !== '')
                str += 'padding-right:22px;';
            else
                str += 'padding-right:5px;';
            if (this.borderradius > 0)
                str += 'border-radius:' + this.borderradius + 'px;';
            if (this.disabled)
                str += 'cursor:not-allowed;';
            else if (this.readonly)
                str += 'cursor:default;';
            else
                str += 'cursor:text;';
            return str;
        }
    },
    methods: {
        input: function (e) {
            this.$emit('input', e.target.value);
        },
        blur: function (e) {
            this.$parent.$emit('form-blur');
        },
        clear: function () {
            this.$emit('input', '');
            this.$parent.$emit('form-blur');
        }
    }
});
Vue.component('yj-input-number', {
    template:
        `
    <ul class="yj-input-number">
        <li class="d1" v-on:click="minus" title="减少"><i class="yj icon-minus"></i></li>
        <li class="d2"><input ref="input" type="text" :value="value+''" :readonly="true" :style="style_input"></input></li>
        <li class="d1" v-on:click="plus" title="增加"><i class="yj icon-plus"></i></li>
    </ul>
    `,
    props: {
        width: {
            type: Number,
            default: function () {
                return 50;
            }
        },
        minvalue: {
            type: Number,
            default: function () {
                return 1;
            }
        },
        maxvalue: {
            type: Number,
            default: function () {
                return 100;
            }
        },
        step: {
            type: Number,
            default: function () {
                return 1;
            }
        },
        value: {
            type: Number,
            default: function () {
                return 1;
            }
        }
    },
    computed: {
        style_input: function () {
            let str = 'width:' + this.width + 'px;';
            return str;
        }
    },
    methods: {
        minus: function () {
            let num = Number(this.$refs.input.value);
            num = num - this.step;
            if (num < this.minvalue)
                num = this.minvalue;
            let n = parseFloat(num.toFixed(2));
            this.$emit('input', n);
            this.$parent.$emit('form-change');
        },
        plus: function () {
            let num = Number(this.$refs.input.value);
            num = num + this.step;
            if (num > this.maxvalue)
                num = this.maxvalue;
            let n = parseFloat(num.toFixed(2));
            this.$emit('input', n);
            this.$parent.$emit('form-change');
        }
    }
});
Vue.component('yj-textarea', {
    template:
        `
    <div class="yj-textarea" :style="style_root">
        <textarea :value="in_value" v-on:input="input" v-on:blur="blur" :disabled="disabled" :readonly="readonly" :placeholder="placeholder" :style="style_textarea"></textarea>
    </div>
    `,
    props: {
        placeholder: {
            type: String,
            default: function () {
                return '请输入';
            }
        },
        disabled: {
            type: Boolean,
            default: function () {
                return false;
            }
        },
        readonly: {
            type: Boolean,
            default: function () {
                return false;
            }
        },
        width: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        height: {
            type: Number,
            default: function () {
                return 56;
            }
        },
        borderradius: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        value: {
            type: String,
            default: function () {
                return '';
            }
        }
    },
    computed: {
        in_value: function () {
            let value = "" + this.value;
            value = value.replace(/<br>/g, "\r\n");
            return value;
        },
        style_root: function () {
            let str = '';
            if (this.width <= 0)
                str = 'display:block;';
            return str;
        },
        style_textarea: function () {
            let str = '';
            if (this.width > 0)
                str += 'width:' + this.width + 'px;';
            else if (this.width < 0)
                str += 'width:' + Math.abs(this.width) + '%;';
            else
                str += 'width:100%;';
            if (this.height > 0)
                str += 'height:' + this.height + 'px;';
            if (this.borderradius > 0)
                str += 'border-radius:' + this.borderradius + 'px;';
            if (this.disabled)
                str += 'cursor:not-allowed;';
            else if (this.readonly)
                str += 'cursor:default;';
            else
                str += 'cursor:text;';
            return str;
        }
    },
    methods: {
        out_value: function (value) {
            value = "" + value;
            value = value.replace(/\r/g, "");
            value = value.replace(/\n/g, "<br>");
            value = value.replace(/\r\n/g, "<br>");
            return value;
        },
        input: function (e) {
            let value = this.out_value(e.target.value);
            this.$emit('input', value);
        },
        blur: function (e) {
            this.$parent.$emit('form-blur');
        }
    }
});
Vue.component('yj-editor', {
    template:
        `
    <div :id="div_id" class="yj-editor"></div>
    `,
    data: function () {
        return {
            div_id: 'yj_' + new Date().getTime(),
            locked: false
        }
    },
    props: {
        height: {
            type: Number,
            default: function () {
                return 150;
            }
        },
        uploadurl: {
            type: String,
            default: function () {
                return '/admin/upload/wang';
            }
        },
        value: {
            type: String,
            default: function () {
                return '<p>请输入</p>';
            }
        }
    },
    watch:
    {
        value: {
            immediate: false,
            handler(newVal, oldVal) {
                if (!this.locked && this.editor !== undefined) {
                    this.editor.txt.html(this.value);
                }
            }
        }
    },
    mounted: function () {
        this.addEdtor();
        let temp_container = document.getElementById(this.div_id).getElementsByClassName('w-e-text-container')[0];
        //2022.09.06修改
        temp_container.style.height = (this.height - 28) + 'px';
        let temp_i = document.createElement("i");
        temp_i.setAttribute("id", "clear");
        temp_i.setAttribute("class", "yj icon-close");
        temp_i.setAttribute("title", "清除");
        let temp_div = document.createElement("div");
        temp_div.setAttribute("class", "w-e-menu");
        temp_div.setAttribute("style", "z-index:201;");
        temp_div.appendChild(temp_i);
        let temp_toolbar = document.getElementById(this.div_id).getElementsByClassName("w-e-toolbar")[0];
        temp_toolbar.appendChild(temp_div);
        let _this = this;
        temp_i.addEventListener('click', function () {
            _this.editor.txt.html('');
            _this.$emit('input', '');
            _this.$parent.$emit('form-blur');
        }, false);
    },
    methods: {
        addEdtor: function () {
            var E = this.$inc.window.wangEditor;
            this.editor = new E('#' + this.div_id);
            this.editor.customConfig.zIndex = 200;
            this.editor.customConfig.menus = [
                'head', 'bold', 'fontSize', 'fontName', 'italic', 'underline', 'strikeThrough', 'foreColor', 'backColor', 'link', 'justify', 'image', 'table', 'video', 'undo', 'redo'
            ];
            this.editor.customConfig.uploadImgServer = this.uploadurl;
            this.editor.customConfig.uploadImgTimeout = 50000;
            this.editor.customConfig.uploadImgMaxSize = 2 * 1024 * 1024;
            this.editor.customConfig.uploadImgMaxLength = 1;
            let _this = this;
            this.editor.customConfig.onfocus = function () {
                _this.locked = true;
            };
            this.editor.customConfig.onblur = function () {
                _this.locked = false;
                _this.$parent.$emit('form-blur');
            };
            this.editor.customConfig.onchange = function () {
                let content = _this.editor.txt.html();
                _this.$emit('input', content);
            };
            this.editor.create();
            this.editor.txt.html(this.value);
        }
    }
});
Vue.component('yj-checkbox', {
    template:
        `
    <ul class="yj-checkbox">
        <li v-if="value" :style="style_li">
            <div v-on:click="click(false)" class="d1" :style="style_checked_d1"></div>
            <div v-on:click="click(false)" class="d2" :style="style_checked_d2"></div>
            <span v-on:click="click(false)" class="text" :style="style_checked_text">{{text}}</span>                
        </li>
        <li v-else :style="style_li">
            <div v-on:click="click(true)" class="d1"></div>
            <span v-on:click="click(true)" class="text">{{text}}</span>
        </li>
    </ul>
    `,
    props: {
        //有用
        minwidth: {
            type: Number,
            default: function () {
                return 60;
            }
        },
        color: {
            type: String,
            default: function () {
                return '#409eff';
            }
        },
        text: {
            type: String,
            default: function () {
                return '';
            }
        },
        value: {
            type: Boolean,
            default: function () {
                return false;
            }
        }
    },
    computed: {
        style_li: function () {
            let str = '';
            if (this.minwidth > 0)
                str = 'min-width:' + this.minwidth + 'px;';
            return str;
        },
        style_checked_d1: function () {
            let str = '';
            if (this.color !== '')
                str = 'border:0px;background-color:' + this.color + ';';
            return str;
        },
        style_checked_d2: function () {
            let str = '';
            if (this.color !== '')
                str = 'border-right:1px solid #fff;border-bottom:1px solid #fff;background-color:' + this.color + ';';
            return str;
        },
        style_checked_text: function () {
            let str = '';
            if (this.color !== '')
                str = 'color:' + this.color + ';';
            return str;
        }
    },
    methods: {
        click: function (checked) {
            this.$emit('input', checked);
            this.$parent.$emit('form-change');
        }
    }
});
Vue.component('yj-checkbox-group', {
    template:
        `
    <ul class="yj-checkbox-group" :style="style_ul">
        <template v-for="option in options">
            <li v-if="option.checked" :style="style_li">
                <div v-on:click="click(option.value,false)" class="d1" :style="style_checked_d1"></div>
                <div v-on:click="click(option.value,false)" class="d2" :style="style_checked_d2"></div>
                <span v-on:click="click(option.value,false)" class="text" :style="style_checked_text">{{option.text}}</span>                
            </li>
            <li v-else :style="style_li">
                <div v-on:click="click(option.value,true)" class="d1"></div>
                <span v-on:click="click(option.value,true)" class="text">{{option.text}}</span>
            </li>
        </template>
    </ul>
    `,
    data: function () {
        return {
            options: []
        }
    },
    props: {
        inline: {
            type: Boolean,
            default: function () {
                return true;
            }
        },
        minwidth: {
            type: Number,
            default: function () {
                return 60;
            }
        },
        columnheight: {
            type: Number,
            default: function () {
                return 22;
            }
        },
        color: {
            type: String,
            default: function () {
                return '#409eff';
            }
        },
        texts: {
            type: String,
            default: function () {
                return '';
            }
        },
        values: {
            type: String,
            default: function () {
                return '';
            }
        },
        value: {
            type: String,
            default: function () {
                return '';
            }
        }
    },
    computed: {
        style_ul: function () {
            let str = '';
            if (!this.inline)
                str = 'flex-direction:column;';
            return str;
        },
        style_li: function () {
            let str = '';
            if (this.inline)
                str = 'height:28px;line-height:28px;';
            else
                str = 'height:' + this.columnheight + 'px;line-height:' + this.columnheight + 'px;';
            if (this.minwidth > 0)
                str += 'min-width:' + this.minwidth + 'px;';
            return str;
        },
        style_checked_d1: function () {
            let str = '';
            if (this.color !== '')
                str = 'border:0px;background-color:' + this.color + ';';
            return str;
        },
        style_checked_d2: function () {
            let str = '';
            if (this.color !== '')
                str = 'border-right:1px solid #fff;border-bottom:1px solid #fff;background-color:' + this.color + ';';
            return str;
        },
        style_checked_text: function () {
            let str = '';
            if (this.color !== '')
                str = 'color:' + this.color + ';';
            return str;
        }
    },
    watch: {
        value: {
            immediate: true,
            handler(newVal, oldVal) {
                let texts = this.texts.split('#');
                let values = this.values.split('#');
                let checked_list = newVal.split('#');
                let arr = [];
                if (texts.length > 0 && texts.length === values.length) {
                    for (let i = 0; i < texts.length; i++) {
                        if (checked_list.indexOf(values[i]) > -1)
                            arr.push({ text: texts[i], value: values[i], checked: true });
                        else
                            arr.push({ text: texts[i], value: values[i], checked: false });
                    }
                }
                this.options = arr;
            }
        }
    },
    methods: {
        click: function (value, checked) {
            let arr = [];
            this.options.filter(function (item) {
                return (item.checked && item.value !== value);
            }).forEach(function (item) {
                arr.push(item.value);
            });
            if (checked)
                arr.push(value);
            this.$emit('input', arr.join('#'));
            this.$parent.$emit('form-change');
        }
    }
});
Vue.component('yj-radio-group', {
    template:
        ` 
    <ul class="yj-radio-group" :style="style_ul">
        <template v-for="option in options">
            <li v-if="option.checked" class="checked" :style="style_li">
                <div class="d1" :style="style_checked_d1"></div>
                <div class="d2"></div>
                <span class="text" :style="style_checked_text">{{option.text}}</span>
            </li>
            <li v-else class="unchecked" :style="style_li">
                <div v-on:click="click(option.value)" class="d1"></div>
                <span v-on:click="click(option.value)" class="text">{{option.text}}</span>
            </li>
        </template>
    </ul>
    `,
    data: function () {
        return {
            options: []
        }
    },
    props: {
        inline: {
            type: Boolean,
            default: function () {
                return true;
            }
        },
        minwidth: {
            type: Number,
            default: function () {
                return 60;
            }
        },
        columnheight: {
            type: Number,
            default: function () {
                return 22;
            }
        },
        color: {
            type: String,
            default: function () {
                return '#409eff';
            }
        },
        texts: {
            type: String,
            default: function () {
                return '';
            }
        },
        values: {
            type: String,
            default: function () {
                return '';
            }
        },
        value: {
            type: String,
            default: function () {
                return '';
            }
        }
    },
    computed: {
        style_ul: function () {
            let str = '';
            if (!this.inline)
                str = 'flex-direction:column;';
            return str;
        },
        style_li: function () {
            let str = '';
            if (this.inline)
                str = 'height:28px;line-height:28px;';
            else
                str = 'height:' + this.columnheight + 'px;line-height:' + this.columnheight + 'px;';
            if (this.minwidth > 0)
                str += 'min-width:' + this.minwidth + 'px;';
            return str;
        },
        style_checked_d1: function () {
            let str = '';
            if (this.color !== '')
                str = 'background-color:' + this.color + ';';
            return str;
        },
        style_checked_text: function () {
            let str = '';
            if (this.color !== '')
                str = 'color:' + this.color + ';';
            return str;
        }
    },
    watch:
    {
        value: {
            immediate: true,
            handler(newVal, oldVal) {
                let texts = this.texts.split('#');
                let values = this.values.split('#');
                let arr = [];
                if (texts.length > 0 && texts.length === values.length) {
                    for (let i = 0; i < texts.length; i++) {
                        if (values[i] === this.value)
                            arr.push({ text: texts[i], value: values[i], checked: true });
                        else
                            arr.push({ text: texts[i], value: values[i], checked: false });
                    }
                }
                this.options = arr;
            }
        }
    },
    methods: {
        click: function (value) {
            this.$emit('input', value);
            this.$parent.$emit('form-change');
        }
    }
});
//有改动
Vue.component('yj-date', {
    template:
        `
    <div class="yj-date">
        <ul>
            <li class="d1">
                <input type="text" v-on:blur="blur" :value="value" :placeholder="placeholder" :style="style_input"></input>
                <i v-if="icon!==''" id="prefix" :class="icon"></i>
                <i v-if="value!==''" v-on:click="clear" title="清除" id="suffix" class="yj icon-close"></i>
            </li>
            <li><button v-on:click="click">当前</button></li>
        </ul>
    </div>
    `,
    props: {
        placeholder: {
            type: String,
            default: function () {
                return '请输入';
            }
        },
        width: {
            type: Number,
            default: function () {
                return 200;
            }
        },
        borderradius: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        icon: {
            type: String,
            default: function () {
                return '';
            }
        },
        format: {
            type: String,
            default: function () {
                return 'datetime';
            }
        },
        value: {
            type: String,
            default: function () {
                return '';
            }
        }
    },
    computed: {
        style_input: function () {
            let str = '';
            if (this.width > 0)
                str += 'width:' + this.width + 'px;';
            if (this.borderradius > 0)
                str += 'border-radius:' + this.borderradius + 'px;';
            if (this.icon !== '')
                str += 'padding-left:22px;';
            else
                str += 'padding-left:5px;';
            if (this.value !== '')
                str += 'padding-right:22px;';
            else
                str += 'padding-right:5px;';
            return str;
        }
    },
    watch:
    {
        value: {
            immediate: true,
            handler(newVal, oldVal) {
                if (newVal !== undefined && newVal !== '') {
                    if (this._validate(newVal, this.format)) {
                        let dt;
                        if (this.format === 'datetime')
                            dt = new Date(newVal);
                        else if (this.format === 'time')
                            dt = new Date('1949-10-01 ' + newVal);
                        else
                            dt = new Date(newVal + ' 12:12:12');
                        let newValue = this._toString(dt, this.format);
                        if (newVal !== newValue) {
                            this.$emit('input', newValue);
                            this.$parent.$emit('form-blur');
                        }
                    }
                    else {
                        this.$emit('input', '');
                        this.$parent.$emit('form-blur');
                    }
                }
            }
        }
    },
    methods: {
        _toString: function (dt, format) {
            let year = dt.getFullYear();
            let month = dt.getMonth() + 1;
            let day = dt.getDate();
            let hour = dt.getHours();
            let minute = dt.getMinutes();
            let second = dt.getSeconds();
            if (format === 'datetime')
                return year + "-" + (month >= 10 ? month : '0' + month) + "-" + (day >= 10 ? day : '0' + day) + " " + (hour >= 10 ? hour : '0' + hour) + ":" + (minute >= 10 ? minute : '0' + minute) + ":" + (second >= 10 ? second : '0' + second);
            else if (format === 'time')
                return (hour >= 10 ? hour : '0' + hour) + ":" + (minute >= 10 ? minute : '0' + minute) + ":" + (second >= 10 ? second : '0' + second);
            else
                return year + "-" + (month >= 10 ? month : '0' + month) + "-" + (day >= 10 ? day : '0' + day);
        },
        _validate: function (value, format) {
            if (format === 'datetime') {
                let str = value + '';
                let reg = /^[0-9]{4}-[0-9]{1,2}-[0-9]{1,2} [0-9]{1,2}:[0-9]{1,2}:[0-9]{1,2}$/;
                if (reg.test(str)) {
                    let n = new Date(str).getTime();
                    if (Number.isNaN(n))
                        return false;
                    else
                        return true;
                }
                else
                    return false;
            }
            else if (format === 'time') {
                let str = value + '';
                let reg = /^[0-9]{1,2}:[0-9]{1,2}:[0-9]{1,2}$/;
                if (reg.test(str)) {
                    str = '1949-10-1 ' + str;
                    let n = new Date(str).getTime();
                    if (Number.isNaN(n))
                        return false;
                    else
                        return true;
                }
                else
                    return false;
            }
            else {
                let str = value + '';
                let reg = /^[0-9]{4}-[0-9]{1,2}-[0-9]{1,2}$/;
                if (reg.test(str)) {
                    str += ' 12:12:12';
                    let n = new Date(str).getTime();
                    if (Number.isNaN(n))
                        return false;
                    else
                        return true;
                }
                else
                    return false;
            }
        },
        blur: function (e) {
            this.$emit('input', e.target.value);
            this.$parent.$emit('form-blur');
        },
        clear: function () {
            this.$emit('input', '');
            this.$parent.$emit('form-blur');
        },
        click: function () {
            this.$emit('input', this._toString(new Date(), this.format));
        }
    }
});
Vue.component('yj-datepicker', {
    template:
        `
    <div class="yj-datepicker">
        <input type="text" :value="date.value" v-on:focus="focus" readonly :placeholder="placeholder" :style="style_input"></input>
        <i v-if="icon!==''" id="prefix" :class="icon"></i>
        <template v-if="!calendar.visible">
            <i v-if="date.value!==''" v-on:click="clear" title="清除" id="suffix" class="yj icon-close"></i>
            <i v-else v-on:click="focus" title="展开" id="suffix" class="yj icon-arrow-down"></i>
        </template>
        <i v-else v-on:click="close" title="折叠" id="suffix" class="yj icon-arrow-up"></i>
        <template v-if="calendar.visible">
            <div style="position:relative;">
                <div class="dialog">
                    <div class="d1">
                        <ul class="ul-1">
                            <li v-on:click="up_year"><i class="yj icon-arrow-d-left"></i></li>
                            <li v-on:click="up_month"><i class="yj icon-arrow-left"></i></li>
                            <li>{{calendar.year+'-'+(calendar.month<10?'0'+calendar.month:calendar.month)}}</li>
                            <li v-on:click="down_month"><i class="yj icon-arrow-right"></i></li>
                            <li v-on:click="down_year"><i class="yj icon-arrow-d-right"></i></li>
                        </ul>
                        <ul class="ul-2">
                            <li>日</li><li>一</li><li>二</li><li>三</li><li>四</li><li>五</li><li>六</li>
                            <template v-for="(item,index) in calendar.days">
                                <template v-if="item.day!==-1">
                                    <li v-if="item.on" class="day-on" :style="style_day_on">{{item.day}}</li>
                                    <li v-else v-on:click="day_click(index)">{{item.day}}</li>
                                </template>
                                <li v-else></li>
                            </template>
                        </ul>
                        <ul class="ul-4">
                            <li v-on:click="quick(-1)">昨天</li>
                            <li v-on:click="quick(0)">今天</li>
                            <li v-on:click="quick(1)">明天</li>
                            <li></li>
                            <li></li>
                        </ul>
                    </div>
                </div>
            </div>
        </template> 
    </div>
    `,
    data: function () {
        return {
            calendar: {
                visible: false, year: 0, month: 0, days: []
            },
            date: {
                value: '', year: 0, month: 0, day: 0
            }
        }
    },
    props: {
        placeholder: {
            type: String,
            default: function () {
                return '请选择';
            }
        },
        width: {
            type: Number,
            default: function () {
                return 200;
            }
        },
        borderradius: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        color: {
            type: String,
            default: function () {
                return '#409eff';
            }
        },
        icon: {
            type: String,
            default: function () {
                return '';
            }
        },
        value: {
            type: String,
            default: function () {
                return '';
            }
        }
    },
    computed: {
        style_input: function () {
            let str = '';
            if (this.width > 0)
                str += 'width:' + this.width + 'px;';
            if (this.borderradius > 0)
                str += 'border-radius:' + this.borderradius + 'px;';
            if (this.icon !== '')
                str += 'padding-left:22px;';
            else
                str += 'padding-left:5px;';
            return str;
        },
        style_day_on: function () {
            let str = '';
            if (this.color !== '')
                str = 'background-color:' + this.color + ';color:#fff;';
            return str;
        }
    },
    watch:
    {
        value: {
            immediate: true,
            handler(newVal, oldVal) {
                let dt = null;
                if (newVal !== undefined && newVal !== '') {
                    dt = new Date(newVal);
                    this.date.value = this._toString(dt, 'date');
                    this.date.day = dt.getDate();
                    this.$emit('input', this.date.value);
                    this.$parent.$emit('form-change');
                }
                else {
                    dt = new Date();
                    this.date.value = '';
                    this.date.day = -2;
                }
                this.date.year = dt.getFullYear();
                this.date.month = dt.getMonth() + 1;
                this.calendar.year = this.date.year;
                this.calendar.month = this.date.month;
            }
        }
    },
    methods: {
        refreshDays: function () {
            let y = this.calendar.year;
            let m = this.calendar.month;
            let d1 = new Date(y, m - 1, 1);
            let d2 = new Date(y, m, 1);
            d2.setDate(d2.getDate() - 1);
            d2 = new Date(d2);
            let d1_week = d1.getDay();
            let d2_max = d2.getDate();
            let n = 1;
            let arr = [];
            for (let i = 0; i < 42; i++) {
                if (i >= d1_week && n <= d2_max) {
                    let day = n++;
                    if (y === this.date.year && m === this.date.month && day === this.date.day)
                        arr.push({ day: day, on: true });
                    else
                        arr.push({ day: day, on: false });
                }
                else {
                    if (i === 35)
                        break;
                    arr.push({ day: -1, on: false });
                }
            }
            this.calendar.days = arr;
        },
        _toString: function (dt, format) {
            let year = dt.getFullYear();
            let month = dt.getMonth() + 1;
            let day = dt.getDate();
            let hour = dt.getHours();
            let minute = dt.getMinutes();
            let second = dt.getSeconds();
            if (format === 'datetime')
                return year + "-" + (month >= 10 ? month : '0' + month) + "-" + (day >= 10 ? day : '0' + day) + " " + (hour >= 10 ? hour : '0' + hour) + ":" + (minute >= 10 ? minute : '0' + minute) + ":" + (second >= 10 ? second : '0' + second);
            else if (format === 'time')
                return (hour >= 10 ? hour : '0' + hour) + ":" + (minute >= 10 ? minute : '0' + minute) + ":" + (second >= 10 ? second : '0' + second);
            else
                return year + "-" + (month >= 10 ? month : '0' + month) + "-" + (day >= 10 ? day : '0' + day);
        },
        focus: function () {
            this.refreshDays();
            this.calendar.visible = true;
        },
        up_year: function () {
            this.calendar.year--;
            this.refreshDays();
        },
        up_month: function () {
            this.calendar.month--;
            if (this.calendar.month === 0) {
                this.calendar.month = 12;
                this.calendar.year--;
            }
            this.refreshDays();
        },
        down_month: function () {
            this.calendar.month++;
            if (this.calendar.month > 12) {
                this.calendar.month = 1;
                this.calendar.year++;
            }
            this.refreshDays();
        },
        down_year: function () {
            this.calendar.year++;
            this.refreshDays();
        },
        clear: function () {
            this.$emit('input', '');
            this.$parent.$emit('form-change');
        },
        day_click: function (index) {
            let day = this.calendar.days[index].day;
            this.date.year = this.calendar.year;
            this.date.month = this.calendar.month;
            this.date.day = day;
            let dt = new Date(this.calendar.year, this.calendar.month - 1, day);
            let temp = this._toString(dt, 'date');
            this.calendar.visible = false;
            this.$emit('input', temp);
            this.$parent.$emit('form-change');
        },
        quick: function (d) {
            let dt = new Date();
            if (d !== undefined && d !== 0) {
                dt.setDate(dt.getDate() + d);
                dt = new Date(dt);
            }
            let temp = this._toString(dt, 'date');
            this.calendar.visible = false;
            this.$emit('input', temp);
            this.$parent.$emit('form-change');
        },
        close: function () {
            this.calendar.visible = false;
            this.$parent.$emit('form-change');
        }
    }
});
Vue.component('yj-select', {
    template:
        `
    <div class="yj-select">
        <input type="text" :value="text" v-on:focus="open(1)" readonly :placeholder="placeholder" :style="style_input"></input>
        <i v-if="icon!==''" id="prefix" :class="icon"></i>
        <template v-if="!visible">
            <i v-if="text!==''" v-on:click="clear" title="清除" id="suffix" class="yj icon-close"></i>
            <i v-else v-on:click="open(1)" title="展开" id="suffix" class="yj icon-arrow-down"></i>
        </template>
        <i v-else v-on:click="open(0)" title="折叠" id="suffix" class="yj icon-arrow-up"></i>
        <template v-if="visible">
            <div style="position:relative;">
                <div class="dialog" :style="style_dialog">
                    <ul :style="style_ul">
                        <template v-for="item in options">
                            <li v-if="item.checked" v-on:click="open(0)" :style="style_on">{{item.text}}</li>
                            <li v-else v-on:click="click(item.value)" class="off">{{item.text}}</li>
                        </template>
                    </ul>
                </div>
            </div>
        </template>
    </div>
    `,
    data: function () {
        return {
            visible: false, options: [], text: ''
        }
    },
    props: {
        placeholder: {
            type: String,
            default: function () {
                return '请选择';
            }
        },
        width: {
            type: Number,
            default: function () {
                return 200;
            }
        },
        borderradius: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        color: {
            type: String,
            default: function () {
                return '#409eff';
            }
        },
        icon: {
            type: String,
            default: function () {
                return '';
            }
        },
        texts: {
            type: String,
            default: function () {
                return '';
            }
        },
        values: {
            type: String,
            default: function () {
                return '';
            }
        },
        value: {
            type: String,
            default: function () {
                return '';
            }
        }
    },
    computed: {
        style_input: function () {
            let str = '';
            if (this.width > 0)
                str += 'width:' + this.width + 'px;';
            if (this.borderradius > 0)
                str += 'border-radius:' + this.borderradius + 'px;';
            if (this.icon !== '')
                str += 'padding-left:22px;';
            else
                str += 'padding-left:5px;';
            return str;
        },
        style_dialog: function () {
            let str = '';
            if (this.width > 0)
                str += 'min-width:' + this.width + 'px;';
            return str;
        },
        style_ul: function () {
            let str = '';
            if (this.width > 0)
                str += 'min-width:' + (this.width - 2) + 'px;';
            return str;
        },
        style_on: function () {
            let str = '';
            if (this.color !== '')
                str = 'background-color:' + this.color + ';color:#fff;';
            return str;
        }
    },
    watch:
    {
        value: {
            immediate: false,
            handler(newVal, oldVal) {
                this.text = '';
                for (let i = 0; i < this.options.length; i++) {
                    if (this.options[i].value === newVal) {
                        this.options[i].checked = true;
                        this.text = this.options[i].text;
                    }
                    else
                        this.options[i].checked = false;
                }
            }
        }
    },
    created: function () {
        let texts = this.texts.split('#');
        let values = this.values.split('#');
        if (texts.length > 0 && texts.length === values.length) {
            let arr = [];
            for (let i = 0; i < texts.length; i++) {
                if (values[i] === this.value) {
                    arr.push({ text: texts[i], value: values[i], checked: true });
                    this.text = texts[i];
                }
                else
                    arr.push({ text: texts[i], value: values[i], checked: false });
            }
            this.options = arr;
        }
    },
    methods: {
        open: function (flag) {
            if (flag === 1)
                this.visible = true;
            else
                this.visible = false;
        },
        click: function (value) {
            this.visible = false;
            this.$emit('input', value);
            this.$parent.$emit('form-change');
        },
        clear: function () {
            this.$emit('input', '');
            this.$parent.$emit('form-change');
        }
    }
});
Vue.component('yj-cascader', {
    template:
        `
    <div class="yj-cascader">
        <input type="text" :value="output.text" v-on:focus="open(1)" readonly :placeholder="placeholder" :style="style_input"></input>
        <i v-if="icon!==''" id="prefix" :class="icon"></i>
        <template v-if="!visible">
            <i v-if="output.text!==''" v-on:click="clear" title="清除" id="suffix" class="yj icon-close"></i>
            <i v-else v-on:click="open(1)" title="展开" id="suffix" class="yj icon-arrow-down"></i>
        </template>
        <i v-else v-on:click="open(0)" title="折叠" id="suffix" class="yj icon-arrow-up"></i>
        <template v-if="visible">
            <div style="position:relative;">
                <div class="dialog" :style="style_dialog">
                    <div class="d1">
                        <template v-for="(item,index) in output.pages">
                            <template v-if="item.visible">
                                <ul v-if="index<(level-1)" :style="style_ul">
                                    <template v-for="item2 in item.arr">
                                        <li v-if="item2.checked" class="branch-on" :style="style_on">{{item2.text}}<i class="yj icon-arrow-right"></i></li>
                                        <li v-else v-on:click="click(index,item2.value)" class="branch-off">{{item2.text}}<i class="yj icon-arrow-right"></i></li>
                                    </template>
                                </ul>
                                <ul v-else :style="style_ul">
                                    <template v-for="item2 in item.arr">
                                        <li v-if="item2.checked" v-on:click="open(0)" class="leaf-on" :style="style_on">{{item2.text}}</li>
                                        <li v-else v-on:click="click(index,item2.value)" class="leaf-off">{{item2.text}}</li>
                                    </template>
                                </ul>
                            </template>
                        </template>
                    </div>
                </div>
            </div>
        </template>
    </div>
    `,
    data: function () {
        return {
            visible: false,
            input: {
                options: [], valuePath: []
            },
            output: {
                pages: [], text: ''
            }
        }
    },
    props: {
        placeholder: {
            type: String,
            default: function () {
                return '请选择';
            }
        },
        width: {
            type: Number,
            default: function () {
                return 200;
            }
        },
        borderradius: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        color: {
            type: String,
            default: function () {
                return '#409EFF';
            }
        },
        icon: {
            type: String,
            default: function () {
                return '';
            }
        },
        options: {
            type: Array,
            default: function () {
                return [];
            }
        },
        url: {
            type: String,
            default: function () {
                return '';
            }
        },
        level: {
            type: Number,
            default: function () {
                return 2;
            }
        },
        value: {
            type: String,
            default: function () {
                return '';
            }
        }
    },
    computed: {
        style_input: function () {
            let str = '';
            if (this.width > 0)
                str += 'width:' + this.width + 'px;';
            if (this.borderradius > 0)
                str += 'border-radius:' + this.borderradius + 'px;';
            if (this.icon !== '')
                str += 'padding-left:22px;';
            else
                str += 'padding-left:5px;';
            return str;
        },
        style_dialog: function () {
            let str = '';
            if (this.width > 0)
                str += 'min-width:' + this.width + 'px;';
            return str;
        },
        style_ul: function () {
            let str = '';
            if (this.width > 0)
                str += 'min-width:' + (this.width - 2) + 'px;';
            return str;
        },
        style_on: function () {
            let str = '';
            if (this.color !== '')
                str = 'background-color:' + this.color + ';color:#fff';
            return str;
        }
    },
    watch:
    {
        value: {
            immediate: false,
            handler(newVal, oldVal) {
                this._setPages();
            }
        }
    },
    created: function () {
        if (this.options.length > 0) {
            this.input.options = this.options;
        }
        else if (this.url !== '') {
            let _this = this;
            this.$inc.get(this.url, {}, function (data) {
                _this.input.options = data;
                _this._setPages();
            }, function (errmsg) {
                _this.$inc.alert(errmsg);
            });
        }
    },
    methods: {
        _getvaluePath: function (value) {
            if (value === '#')
                return;
            let tempArr = this.input.options.filter(function (item) {
                return item.value === value;
            });
            if (tempArr.length > 0) {
                this.input.valuePath.push({ text: tempArr[0].text, value: tempArr[0].value });
                this._getvaluePath(tempArr[0].parent);
            }
        },
        _setPages: function () {
            this.output.text = '';
            if (this.input.options.length === 0) {
                this.output.pages = [];
                return;
            }
            let value = this.value;
            if (value !== '') {
                this.input.valuePath = [];
                this._getvaluePath(value);
                this.input.valuePath.reverse();
                if (this.input.valuePath.length !== this.level)
                    value = '';
                else
                    this.output.text = this.input.valuePath[this.level - 1].text;
            }
            if (value === '') {
                let temppages = [];
                let tempArr = this.input.options.filter(function (item) {
                    return item.parent === '#';
                });
                let arr = [];
                for (let i = 0; i < tempArr.length; i++) {
                    arr.push({ parent: '', text: tempArr[i].text, value: tempArr[i].value, checked: false });
                }
                temppages.push({ visible: true, arr: arr });
                for (let i = 1; i < this.level; i++) {
                    temppages.push({ visible: false, arr: [] });
                }
                this.output.pages = temppages;
            }
            else {
                let temppages = [];
                let parent = '#';
                for (let i = 0; i < this.level; i++) {
                    let tempArr = this.input.options.filter(function (item) {
                        return item.parent === parent;
                    });
                    let arr = [];
                    for (let j = 0; j < tempArr.length; j++) {
                        if (tempArr[j].value === this.input.valuePath[i].value)
                            arr.push({ parent: tempArr[j].parent, text: tempArr[j].text, value: tempArr[j].value, checked: true });
                        else
                            arr.push({ parent: tempArr[j].parent, text: tempArr[j].text, value: tempArr[j].value, checked: false });
                    }
                    temppages.push({ visible: true, arr: arr });
                    parent = this.input.valuePath[i].value;
                }
                this.output.pages = temppages;
            }
        },
        click: function (index, value) {
            for (let i = 0; i < this.output.pages[index].arr.length; i++) {
                if (this.output.pages[index].arr[i].value === value)
                    this.output.pages[index].arr[i].checked = true;
                else
                    this.output.pages[index].arr[i].checked = false;
            }
            if (index === this.level - 1) {
                this.visible = false;
                this.$emit('input', value);
                this.$parent.$emit('form-change');
            }
            else {
                let tempArr = this.input.options.filter(function (item) {
                    return item.parent === value;
                });
                let arr = [];
                for (let i = 0; i < tempArr.length; i++) {
                    arr.push({ parent: tempArr[i].parent, text: tempArr[i].text, value: tempArr[i].value, checked: false });
                }
                index++;
                this.output.pages[index].arr = arr;
                this.output.pages[index].visible = true;
                for (let i = index + 1; i < this.level; i++)
                    this.output.pages[i].visible = false;
            }
        },
        open: function (flag) {
            if (flag === 1)
                this.visible = true;
            else
                this.visible = false;
        },
        clear: function () {
            this.$emit('input', '');
            this.$parent.$emit('form-change');
        }
    }
});
//有改动
Vue.component('yj-button', {
    template:
        `
    <button v-on:click="click" class="yj-button" :style="style_button">
        <i v-if="icon1!==''" id="prefix" :class="icon1"></i><slot></slot><i v-if="icon2!==''" id="suffix" :class="icon2"></i>
    </button>
    `,
    data: function () {
        return {
            isLock: false
        }
    },
    props: {
        width: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        borderradius: {
            type: Number,
            default: function () {
                return 4;
            }
        },
        color: {
            type: String,
            default: function () {
                return '';
            }
        },
        icon1: {
            type: String,
            default: function () {
                return '';
            }
        },
        icon2: {
            type: String,
            default: function () {
                return '';
            }
        },
        //间隔时间（毫秒，阻止重复单击）
        time: {
            type: Number,
            default: function () {
                return 3000;
            }
        }
    },
    computed: {
        style_button: function () {
            let str = '';
            if (this.color !== '')
                str = 'line-height:28px;border:0px;background-color:' + this.color + ';color:#fff;';
            else
                str = 'line-height:26px;border:1px solid #ccc;background-color:#f5f7fa;color:#333;';
            if (this.width > 0)
                str += 'width:' + this.width + 'px;';
            else if (this.width < 0)
                str += 'width:' + Math.abs(this.width) + '%;';
            if (this.borderradius > 0)
                str += 'border-radius:' + this.borderradius + 'px;';
            return str;
        }
    },
    methods: {
        click: function () {
            //阻止重复单击
            if (this.time > 0) {
                if (!this.isLock) {
                    this.$emit('click');
                    this.isLock = true;
                    setTimeout(() => {
                        this.isLock = false;
                    }, this.time);
                }
                else
                    this.$inc.alert('可能重复操作，请' + (this.time / 1000) + '秒后再试');
            }
            else
                this.$emit('click');
        }
    }
});
Vue.component('yj-button-sms', {
    template:
        `
    <button v-on:click="click" class="yj-button" :style="style_button">{{button_text}}</button>
    `,
    data: function () {
        return {
            timer: undefined,
            time: 0,
            post_api: {
                url: '',
                data: {
                    tel: '',
                    yzm: ''
                }
            }
        }
    },
    props: {
        borderradius: {
            type: Number,
            default: function () {
                return 4;
            }
        },
        color: {
            type: String,
            default: function () {
                return '';
            }
        },
        //api
        url: {
            ///sms/login
            ///sms/reg
            type: String,
            default: function () {
                return '';
            }
        },
        //手机号
        tel: {
            type: String,
            default: function () {
                return '';
            }
        },
        //图形验证码
        yzm: {
            type: String,
            default: function () {
                return '';
            }
        }
    },
    computed: {
        style_button: function () {
            let str = '';
            if (this.color !== '')
                str = 'line-height:28px;border:0px;background-color:' + this.color + ';color:#fff;';
            else
                str = 'line-height:26px;border:1px solid #ccc;background-color:#f5f7fa;color:#333;';
            if (this.borderradius > 0)
                str += 'border-radius:' + this.borderradius + 'px;';
            return str;
        },
        button_text: function () {
            if (this.time > 0)
                return '获取验证码（' + this.time + '）';
            else
                return '获取验证码';
        }
    },
    watch:
    {
        url: {
            immediate: true,
            handler(newVal, oldVal) {
                this.post_api.url = newVal;
            }
        },
        tel: {
            immediate: true,
            handler(newVal, oldVal) {
                this.post_api.data.tel = newVal;
            }
        },
        yzm: {
            immediate: true,
            handler(newVal, oldVal) {
                this.post_api.data.yzm = newVal;
            }
        }
    },
    methods: {
        click: function () {
            //validate
            if (this.post_api.url === '') {
                this.$inc.alert('短信API未设置');
                return;
            }
            if (this.post_api.data.tel === '') {
                this.$inc.alert('手机号不能为空');
                return;
            }
            if (this.post_api.data.yzm === '') {
                this.$inc.alert('图形验证码不能为空');
                return;
            }
            //send
            if (this.timer === undefined) {
                this.$inc.post(this.post_api.url, this.post_api.data, data => {
                    //倒计时（秒）
                    this.time = 60;
                    this.timer = setInterval(() => {
                        this.time--;
                        if (this.time <= 0) {
                            clearInterval(this.timer);
                            this.timer = undefined;
                            this.time = 0;
                        }
                    }, 1000);
                }, errmsg => {
                    this.$inc.alert(errmsg);
                });
            }
        }
    }
});
Vue.component('yj-buttonlist', {
    template:
        `
    <ul class="yj-buttonlist">
        <li v-if="type.indexOf('i')>-1" v-on:click="click('i')" title="查看" :style="style_li_i"><i class="yj icon-document"></i></li>
        <li v-if="type.indexOf('e')>-1" v-on:click="click('e')" title="修改" :style="style_li_e"><i class="yj icon-edit"></i></li>
        <li v-if="type.indexOf('d')>-1" v-on:click="click('d')" title="删除" :style="style_li_d"><i class="yj icon-close"></i></li>
    </ul>
    `,
    data: function () {
        return {
            style: {
                i: '', e: '', d: ''
            }
        }
    },
    props: {
        height: {
            type: Number,
            default: function () {
                return 24;
            }
        },
        colors: {
            type: String,
            default: function () {
                return '#909399|#409EFF|#F56C6C';
            }
        },
        type: {
            type: String,
            default: function () {
                return 'i#e#d';
            }
        },
        rid: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        rkey: {
            type: String,
            default: function () {
                return '';
            }
        }
    },
    computed: {
        style_li_i: function () {
            let str = 'width:' + this.height + 'px;height:' + this.height + 'px;line-height:' + this.height + 'px;';
            str += 'background-color:' + this.style.i + ';';
            return str;
        },
        style_li_e: function () {
            let str = 'width:' + this.height + 'px;height:' + this.height + 'px;line-height:' + this.height + 'px;';
            str += 'background-color:' + this.style.e + ';';
            return str;
        },
        style_li_d: function () {
            let str = 'width:' + this.height + 'px;height:' + this.height + 'px;line-height:' + this.height + 'px;';
            str += 'background-color:' + this.style.d + ';';
            return str;
        }
    },
    created: function () {
        let colors = this.colors.split('|');
        this.style.i = colors[0];
        this.style.e = colors[1];
        this.style.d = colors[2];
    },
    methods: {
        click: function (type) {
            if (type === 'd') {
                let _this = this;
                this.$inc.confirm('确定要删除吗？', function () {
                    //2022.09.01改动
                    _this.$emit('click', type, _this.rid, _this.rkey);
                });
            }
            else
                this.$emit('click', type, this.rid, this.rkey);
        }
    }
});
Vue.component('yj-buttonlist-link', {
    template:
        `
    <ul class="yj-buttonlist-link">
        <li v-if="type.indexOf('i')>-1" v-on:click="click('i')">查看</li>
        <li v-if="type.indexOf('e')>-1" v-on:click="click('e')">修改</li>
        <li v-if="type.indexOf('d')>-1" v-on:click="click('d')">删除</li>
    </ul>
    `,
    props: {
        type: {
            type: String,
            default: function () {
                return 'i#e#d';
            }
        },
        rid: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        rkey: {
            type: String,
            default: function () {
                return '';
            }
        }
    },
    methods: {
        click: function (type) {
            if (type === 'd') {
                let _this = this;
                this.$inc.confirm('确定要删除吗？', function () {
                    //2022.09.01改动
                    _this.$emit('click', type, _this.rid, _this.rkey);
                });
            }
            else
                this.$emit('click', type, this.rid, this.rkey);
        }
    }
});
Vue.component('yj-upload-pic', {
    template:
        `
    <div class="yj-upload-pic">
        <input ref="upload" type="file" v-on:change="change" :accept="input.accept" :multiple="false" style="display:none;">
        <template v-if="input.pics.length<number">
            <button v-on:click="click">上传图片</button>
            <div class="tips">{{tips}}</div>
        </template>
        <ul v-if="input.pics.length>0" :style="style_ul">
            <li v-for="(item,index) in input.pics" :style="style_li">
                <img :src="item" v-on:error="error" :style="style_pic">
                <span><i v-on:click="remove(index)" title="移除" class="yj icon-close"></i></span>
            </li>
        </ul>
    </div>
    `,
    data: function () {
        return {
            input: {
                accept: '', accepts: [], pics: []
            }
        }
    },
    props: {
        inline: {
            type: Boolean,
            default: function () {
                return true;
            }
        },
        previewwidth: {
            type: Number,
            default: function () {
                return 120;
            }
        },
        previewheight: {
            type: Number,
            default: function () {
                return 80;
            }
        },
        errorurl: {
            type: String,
            default: function () {
                //2022.09.03修改
                return '/content/images/none.jpg';
            }
        },
        number: {
            type: Number,
            default: function () {
                return 1;
            }
        },
        accept: {
            type: String,
            default: function () {
                return 'jpg#jpeg#png';
            }
        },
        maxsize: {
            type: Number,
            default: function () {
                return 500;
            }
        },
        clipwidth: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        uploadurl: {
            type: String,
            default: function () {
                return '';
            }
        },
        value: {
            type: String,
            default: function () {
                return '';
            }
        }
    },
    computed: {
        tips: function () {
            return '支持' + this.input.accepts.join('/') + '格式，大小不超过' + this.maxsize + 'K';
        },
        style_ul: function () {
            let str = '';
            if (!this.inline)
                str = 'flex-direction:column;';
            return str;
        },
        style_li: function () {
            if (this.inline)
                return 'margin-right:5px;';
            else
                return 'margin-bottom:5px;';
        },
        style_pic: function () {
            if (this.inline)
                return 'height:' + this.previewheight + 'px;';
            else
                return 'width:' + this.previewwidth + 'px;';
        }
    },
    watch:
    {
        value: {
            immediate: false,
            handler(newVal, oldVal) {
                if (newVal === '')
                    this.input.pics = [];
                else
                    this.input.pics = newVal.split('#');
            }
        }
    },
    created: function () {
        this.input.accepts = this.accept.toLowerCase().split('#');
        let arr = [];
        this.input.accepts.forEach(function (item) {
            arr.push('.' + item);
        });
        this.input.accept = arr.join(',');
        if (this.value !== '')
            this.input.pics = this.value.split('#');
    },
    methods: {
        _upload(file) {
            if (this.uploadurl === '') {
                this.$inc.alert('uploadurl未设置');
                return;
            }
            let ext = file.name.substring(file.name.lastIndexOf('.') + 1).toLowerCase();
            if (this.input.accepts.indexOf(ext) === -1) {
                this.$inc.alert('文件格式无效');
                return;
            }
            let size = file.size / 1024;
            if (size > this.maxsize) {
                this.$inc.alert('文件过大');
                return;
            }
            let data = new FormData();
            data.append("clipwidth", this.clipwidth);
            data.append("file", file);
            let _this = this;
            this.$inc.post(_this.uploadurl, data, function (data) {
                let str = _this.input.pics.join('#');
                if (str === '')
                    str = data.filepath;
                else
                    str += '#' + data.filepath;
                _this.$emit('input', str);
                _this.$parent.$emit('form-change');
            }, function (err_msg) {
                _this.$inc.alert(err_msg);
            });
        },
        click: function () {
            this.$refs.upload.click();
        },
        change: function (e) {
            let file = e.target.files[0];
            if (file !== null)
                this._upload(file);
        },
        remove: function (index) {
            let arr = this.input.pics;
            let str = '';
            for (let i = 0; i < arr.length; i++) {
                if (i !== index) {
                    if (str === '')
                        str = arr[i];
                    else
                        str += '#' + arr[i];
                }
            }
            this.$emit('input', str);
            this.$parent.$emit('form-change');
        },
        error: function (e) {
            e.target.src = this.errorurl;
        }
    }
});
Vue.component('yj-upload-file', {
    template:
        `
    <div class="yj-upload-file">
        <input ref="upload" type="file" v-on:change="change" :accept="input.accept" :multiple="false" style="display:none;">
        <template v-if="input.files.length<number">
            <button v-on:click="click">上传文件</button>
            <div class="tips">{{tips}}</div>
        </template>
        <ul v-if="input.files.length>0">
            <li v-for="(item,index) in input.files">
                <i class="yj icon-document"></i>
                {{item|fileName}}
                <i v-on:click="remove(index)" title="移除" id="remove" class="yj icon-close"></i>
            </li>
        </ul>
    </div>
    `,
    data: function () {
        return {
            input: {
                accept: '', accepts: [], files: []
            }
        }
    },
    props: {
        number: {
            type: Number,
            default: function () {
                return 1;
            }
        },
        accept: {
            type: String,
            default: function () {
                return 'zip#rar#doc#docx#xls#xlsx#ppt#pptx#wps';
            }
        },
        maxsize: {
            type: Number,
            default: function () {
                return 1024;
            }
        },
        uploadurl: {
            type: String,
            default: function () {
                return '/admin/upload/file';
            }
        },
        value: {
            type: String,
            default: function () {
                return '';
            }
        }
    },
    computed: {
        tips: function () {
            return '支持' + this.input.accepts.join('/') + '格式，大小不超过' + this.maxsize + 'K';
        }
    },
    watch:
    {
        value: {
            immediate: true,
            handler(newVal, oldVal) {
                if (newVal === '')
                    this.input.files = [];
                else
                    this.input.files = newVal.split('#');
            }
        }
    },
    created: function () {
        this.input.accepts = this.accept.toLowerCase().split('#');
        let arr = [];
        this.input.accepts.forEach(function (item) {
            arr.push('.' + item);
        });
        this.input.accept = arr.join(',');
        if (this.value !== '')
            this.input.files = this.value.split('#');
    },
    methods: {
        _upload(file) {
            if (this.uploadurl === '') {
                this.$inc.alert('uploadurl未设置');
                return;
            }
            let ext = file.name.substring(file.name.lastIndexOf('.') + 1).toLowerCase();
            if (this.input.accepts.indexOf(ext) === -1) {
                this.$inc.alert('文件格式无效');
                return;
            }
            let size = file.size / 1024;
            if (size > this.maxsize) {
                this.$inc.alert('文件过大');
                return;
            }
            let data = new FormData();
            data.append("file", file);
            let _this = this;
            this.$inc.post(_this.uploadurl, data, function (data) {
                let str = _this.input.files.join('#');
                if (str === '')
                    str = data.filepath;
                else
                    str += '#' + data.filepath;
                _this.$emit('input', str);
                //2022.09.05修改
                _this.$emit('upload', str, ext, file.size);
                _this.$parent.$emit('form-change');
            }, function (errmsg) {
                _this.$inc.alert(errmsg);
            });
        },
        click: function () {
            this.$refs.upload.click();
        },
        change: function (e) {
            let file = e.target.files[0];
            if (file !== null)
                this._upload(file);
        },
        remove: function (index) {
            let arr = this.input.files;
            let str = '';
            for (let i = 0; i < arr.length; i++) {
                if (i !== index) {
                    if (str === '')
                        str = arr[i];
                    else
                        str += '#' + arr[i];
                }
            }
            this.$emit('input', str);
            this.$parent.$emit('form-change');
        }
    },
    filters: {
        fileName: function (value) {
            let str = '...';
            str += value.substring(value.lastIndexOf('/') + 1).toLowerCase();
            return str;
        }
    }
});
Vue.component('yj-pager', {
    template:
        `
    <ul v-if="pagetotal>1" class="yj-pager">
        <li v-if="page>1" v-on:click="click(1)" title="首页" class="btn"><i class="yj icon-arrow-d-left"></i></li>
        <li v-if="page>1" v-on:click="click(page-1)" title="上一页" class="btn"><i class="yj icon-arrow-left"></i></li>
        <template v-for="i in tags.n">
            <li v-if="(tags.begin+i-1)===page" class="on" :style="style_on">{{tags.begin+i-1}}</li>
            <li v-else v-on:click="click(tags.begin+i-1)" class="off">{{tags.begin+i-1}}</li>
        </template>
        <li v-if="page<pagetotal" v-on:click="click(page+1)" title="下一页" class="btn"><i class="yj icon-arrow-right"></i></li>
        <li v-if="page<pagetotal" v-on:click="click(pagetotal)" title="尾页" class="btn"><i class="yj icon-arrow-d-right"></i></li>
    </ul>
    `,
    data: function () {
        return {
            tag: {
                n: 5, n_2: 2
            }
        }
    },
    props: {
        color: {
            type: String,
            default: function () {
                return '#409eff';
            }
        },
        rstotal: {
            type: Number,
            default: function () {
                return 0;
            }
        },
        pagesize: {
            type: Number,
            default: function () {
                return 10;
            }
        },
        page: {
            type: Number,
            default: function () {
                return 1;
            }
        }
    },
    computed: {
        input_data: function () {
            return {
                rstotal: this.rstotal,
                pagesize: this.pagesize,
                page: this.page
            };
        },
        pagetotal: function () {
            let num = Math.ceil(this.rstotal / this.pagesize);
            if (num < 0)
                num = 0;
            return num;
        },
        tags: function () {
            let begin = this.page - this.tag.n_2;
            let end = this.page + this.tag.n_2;
            if (begin < 1) {
                begin = 1;
                end = this.pagetotal >= this.tag.n ? this.tag.n : this.pagetotal;
            }
            else if (end > this.pagetotal) {
                end = this.pagetotal;
                begin = this.pagetotal >= this.tag.n ? (end - (this.tag.n - 1)) : 1;
            }
            return { n: (end - begin + 1), begin: begin, end: end };
        },
        style_on: function () {
            let str = '';
            if (this.color !== '')
                str = 'background-color:' + this.color + ';color:#fff;';
            return str;
        }
    },
    watch:
    {
        input_data: {
            immediate: true,
            handler(newVal, oldVal) {
                this.$emit('tips', this._tips(newVal.page));
            }
        }
    },
    methods: {
        _tips: function (page) {
            if (this.rstotal > 0)
                return "第<font color='#ff0000'>" + page + "</font>/" + this.pagetotal + "页 每页" + this.pagesize + "条 总计" + this.rstotal + "条";
            else
                return '';
        },
        click: function (page) {
            this.$emit('click', page);
        }
    }
});