master
wangbing 6 years ago
parent 9b461a2115
commit cb529f283a

@ -63,15 +63,16 @@
}, },
props: ['value', 'label', 'placeholder', 'items'], props: ['value', 'label', 'placeholder', 'items'],
template: '<a class="mint-cell mint-field"><!---->' + template: '' +
'<div class="mint-cell-wrapper">' + '<a class="mint-cell mint-field"><!---->' +
'<div class="mint-cell-title"><!----><span class="mint-cell-text">{{label}}</span><!----></div>' + ' <div class="mint-cell-wrapper">' +
'<div class="mint-cell-value">' + ' <div class="mint-cell-title"><!----><span class="mint-cell-text">{{label}}</span><!----></div>' +
'<input :placeholder="placeholder" @click="onSelect" readonly v-model="currentValue" class="mint-field-core">' + ' <div class="mint-cell-value">' +
'<div class="mint-field-clear" v-if="clearVisible" @click="onClear"><i class="mintui mintui-field-error"></i></div>' + ' <input :placeholder="placeholder" @click="onSelect" readonly v-model="currentValue" class="mint-field-core">' +
'</div>' + ' <div class="mint-field-clear" v-if="clearVisible" @click="onClear"><i class="mintui mintui-field-error"></i></div>' +
'</div>' + ' </div>' +
'<mt-popup style="width: 100%" v-model="popupVisible" position="bottom"><mt-picker :slots="slots" @change="onValuesChange"></mt-picker></mt-popup>' + ' </div>' +
' <mt-popup style="width: 100%" v-model="popupVisible" position="bottom"><mt-picker :slots="slots" @change="onValuesChange"></mt-picker></mt-popup>' +
'</a>' '</a>'
}); });
@ -119,15 +120,16 @@
} }
}, },
props: ['value', 'label', 'placeholder', 'items'], props: ['value', 'label', 'placeholder', 'items'],
template: '<a class="mint-cell mint-field"><!---->' + template: '' +
'<div class="mint-cell-wrapper">' + '<a class="mint-cell mint-field"><!---->' +
'<div class="mint-cell-title"><!----><span class="mint-cell-text">{{label}}</span><!----></div>' + ' <div class="mint-cell-wrapper">' +
'<div class="mint-cell-value">' + ' <div class="mint-cell-title"><!----><span class="mint-cell-text">{{label}}</span><!----></div>' +
'<input :placeholder="placeholder" @click="onSelect" readonly v-model="currentValue" class="mint-field-core">' + ' <div class="mint-cell-value">' +
'<div class="mint-field-clear" v-if="clearVisible" @click="onClear"><i class="mintui mintui-field-error"></i></div>' + ' <input :placeholder="placeholder" @click="onSelect" readonly v-model="currentValue" class="mint-field-core">' +
'</div>' + ' <div class="mint-field-clear" v-if="clearVisible" @click="onClear"><i class="mintui mintui-field-error"></i></div>' +
'</div>' + ' </div>' +
'<mt-popup style="width: 100%" v-model="popupVisible" position="bottom"><mt-picker :slots="slots" valueKey="keyValue" @change="onValuesChange"></mt-picker></mt-popup>' + ' </div>' +
' <mt-popup style="width: 100%" v-model="popupVisible" position="bottom"><mt-picker :slots="slots" valueKey="keyValue" @change="onValuesChange"></mt-picker></mt-popup>' +
'</a>' '</a>'
}); });
@ -161,15 +163,16 @@
} }
}, },
props: ['value', 'label', 'placeholder', 'items'], props: ['value', 'label', 'placeholder', 'items'],
template: '<a class="mint-cell mint-field"><!---->' + template: '' +
'<div class="mint-cell-wrapper">' + '<a class="mint-cell mint-field"><!---->' +
'<div class="mint-cell-title"><!----><span class="mint-cell-text">{{label}}</span><!----></div>' + ' <div class="mint-cell-wrapper">' +
'<div class="mint-cell-value">' + ' <div class="mint-cell-title"><!----><span class="mint-cell-text">{{label}}</span><!----></div>' +
'<input :placeholder="placeholder" @click="onSelect" readonly v-model="currentValue" class="mint-field-core">' + ' <div class="mint-cell-value">' +
'<div class="mint-field-clear" v-if="clearVisible" @click="onClear"><i class="mintui mintui-field-error"></i></div>' + ' <input :placeholder="placeholder" @click="onSelect" readonly v-model="currentValue" class="mint-field-core">' +
'</div>' + ' <div class="mint-field-clear" v-if="clearVisible" @click="onClear"><i class="mintui mintui-field-error"></i></div>' +
'</div>' + ' </div>' +
'<mt-datetime-picker ref="picker" type="date" v-model="selectValue" @confirm="onConfirm" year-format="{value}" month-format="{value}" date-format="{value}"></mt-datetime-picker>' + ' </div>' +
' <mt-datetime-picker ref="picker" type="date" v-model="selectValue" @confirm="onConfirm" year-format="{value}" month-format="{value}" date-format="{value}"></mt-datetime-picker>' +
'</a>' '</a>'
}); });
@ -203,15 +206,16 @@
} }
}, },
props: ['value', 'label', 'placeholder', 'items'], props: ['value', 'label', 'placeholder', 'items'],
template: '<a class="mint-cell mint-field"><!---->' + template: '' +
'<div class="mint-cell-wrapper">' + '<a class="mint-cell mint-field"><!---->' +
'<div class="mint-cell-title"><!----><span class="mint-cell-text">{{label}}</span><!----></div>' + ' <div class="mint-cell-wrapper">' +
'<div class="mint-cell-value">' + ' <div class="mint-cell-title"><!----><span class="mint-cell-text">{{label}}</span><!----></div>' +
'<input :placeholder="placeholder" @click="onSelect" readonly v-model="currentValue" class="mint-field-core">' + ' <div class="mint-cell-value">' +
'<div class="mint-field-clear" v-if="clearVisible" @click="onClear"><i class="mintui mintui-field-error"></i></div>' + ' <input :placeholder="placeholder" @click="onSelect" readonly v-model="currentValue" class="mint-field-core">' +
'</div>' + ' <div class="mint-field-clear" v-if="clearVisible" @click="onClear"><i class="mintui mintui-field-error"></i></div>' +
'</div>' + ' </div>' +
'<mt-datetime-picker ref="picker" type="time" v-model="selectValue" @confirm="onConfirm" year-format="{value}" month-format="{value}" date-format="{value}"></mt-datetime-picker>' + ' </div>' +
' <mt-datetime-picker ref="picker" type="time" v-model="selectValue" @confirm="onConfirm" year-format="{value}" month-format="{value}" date-format="{value}"></mt-datetime-picker>' +
'</a>' '</a>'
}); });
@ -245,35 +249,128 @@
} }
}, },
props: ['value', 'label', 'placeholder', 'items'], props: ['value', 'label', 'placeholder', 'items'],
template: '<a class="mint-cell mint-field"><!---->' + template: '' +
'<div class="mint-cell-wrapper">' + '<a class="mint-cell mint-field"><!---->' +
'<div class="mint-cell-title"><!----><span class="mint-cell-text">{{label}}</span><!----></div>' + ' <div class="mint-cell-wrapper">' +
'<div class="mint-cell-value">' + ' <div class="mint-cell-title"><!----><span class="mint-cell-text">{{label}}</span><!----></div>' +
'<input :placeholder="placeholder" @click="onSelect" readonly v-model="currentValue" class="mint-field-core">' + ' <div class="mint-cell-value">' +
'<div class="mint-field-clear" v-if="clearVisible" @click="onClear"><i class="mintui mintui-field-error"></i></div>' + ' <input :placeholder="placeholder" @click="onSelect" readonly v-model="currentValue" class="mint-field-core">' +
'</div>' + ' <div class="mint-field-clear" v-if="clearVisible" @click="onClear"><i class="mintui mintui-field-error"></i></div>' +
'</div>' + ' </div>' +
'<mt-datetime-picker ref="picker" type="datetime" v-model="selectValue" @confirm="onConfirm" year-format="{value}" month-format="{value}" date-format="{value}"></mt-datetime-picker>' + ' </div>' +
' <mt-datetime-picker ref="picker" type="datetime" v-model="selectValue" @confirm="onConfirm" year-format="{value}" month-format="{value}" date-format="{value}"></mt-datetime-picker>' +
'</a>' '</a>'
}); });
Vue.component('wb-field-cphm', { Vue.component('wb-field-cphm', {
data: function () { data: function () {
return { return {
prefixData: [{ prefixData: [
{
key: '',
value: '京',
children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'Y']
},
{
key: '',
value: '津',
children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R']
},
{key: '', value: '冀', children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'O', 'R', 'T']},
{key: '', value: '晋', children: ['A', 'B', 'C', 'D', 'E', 'F', 'H', 'J', 'K', 'L', 'M']},
{key: '', value: '蒙', children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M']},
{
key: '',
value: '辽',
children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P']
},
{key: '', value: '吉', children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K']},
{
key: '',
value: '黑',
children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'R']
},
{
key: '',
value: '沪',
children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'AX', 'BX', 'DX']
},
{
key: '', key: '',
value: '苏', value: '苏',
children: ['A', 'B', 'C'] children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'U']
}, { },
{key: '', value: '浙', children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L']},
{
key: '',
value: '皖',
children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'R', 'S']
},
{key: '', value: '闽', children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K']},
{key: '', value: '赣', children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'S']},
{
key: '', key: '',
value: '鲁', value: '鲁',
children: ['A', 'B', 'C', 'D'] children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'U', 'V', 'W', 'Y']
}], },
{
key: '',
value: '豫',
children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'U']
},
{
key: '',
value: '鄂',
children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'AW']
},
{
key: '',
value: '湘',
children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'S', 'U']
},
{
key: '',
value: '粤',
children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z']
},
{
key: '',
value: '桂',
children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'R']
},
{key: '', value: '琼', children: ['A', 'B', 'C', 'D', 'E', 'F']},
{key: '', value: '渝', children: ['A', 'B', 'C', 'D', 'F', 'G', 'H', 'N']},
{
key: '',
value: '川',
children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z']
},
{key: '', value: '贵', children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J']},
{
key: '',
value: '云',
children: ['A', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'R', 'S']
},
{key: '', value: '藏', children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J']},
{key: '', value: '陕', children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'V']},
{
key: '',
value: '甘',
children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P']
},
{key: '', value: '青', children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H']},
{key: '', value: '宁', children: ['A', 'B', 'C', 'D', 'E']},
{
key: '',
value: '新',
children: ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'Q', 'S']
}
],
popupVisible: false, popupVisible: false,
clearVisible: false, clearVisible: false,
slots: [{ slots: [{
values: [], values: [],
defaultIndex: 0, defaultIndex: 9,
className: 'slot1' className: 'slot1'
}, { }, {
divider: true, divider: true,
@ -281,14 +378,14 @@
className: 'slot2' className: 'slot2'
}, { }, {
values: [], values: [],
defaultIndex: 0, defaultIndex: 11,
className: 'slot3' className: 'slot3'
}], }],
} }
}, },
created: function () { created: function () {
if (!this.value) {//当model为空时初始化前缀 if (!this.value) {//当model为空时初始化前缀
this.$emit('input', this.prefixData[0].value + this.prefixData[0].children[0]); this.$emit('input', this.prefixData[this.slots[0].defaultIndex].value + this.prefixData[this.slots[0].defaultIndex].children[this.slots[2].defaultIndex]);
} }
this.slots[0].values = this.getSlot1(); this.slots[0].values = this.getSlot1();
this.slots[2].values = this.getSlot3(this.prefixData[0].value); this.slots[2].values = this.getSlot3(this.prefixData[0].value);
@ -341,17 +438,18 @@
} }
} }
}, },
props: ['value', 'label', 'placeholder', 'items',], props: ['value', 'label', 'placeholder', 'items'],
template: '<a class="mint-cell mint-field"><!---->' + template: '' +
'<div class="mint-cell-wrapper">' + '<a class="mint-cell mint-field"><!---->' +
'<div class="mint-cell-title"><!----><span class="mint-cell-text">{{label}}</span><!----></div>' + ' <div class="mint-cell-wrapper">' +
'<div class="mint-cell-value">' + ' <div class="mint-cell-title"><!----><span class="mint-cell-text">{{label}}</span><!----></div>' +
'<p @click="onSelect" style="padding-right: 5px;color:#47d3ff">{{prefix}}</p>' + ' <div class="mint-cell-value">' +
'<input :placeholder="placeholder" maxlength="6" v-model="subfix" class="mint-field-core">' + ' <span @click="onSelect" style="padding-right: 5px;color:#47d3ff;line-height: 1.6">{{prefix}}</span>' +
'<div class="mint-field-clear" v-if="clearVisible" @click="onClear"><i class="mintui mintui-field-error"></i></div>' + ' <input :placeholder="placeholder" maxlength="6" v-model="subfix" class="mint-field-core">' +
'</div>' + ' <div class="mint-field-clear" v-if="clearVisible" @click="onClear"><i class="mintui mintui-field-error"></i></div>' +
'</div>' + ' </div>' +
'<mt-popup style="width: 100%" v-model="popupVisible" position="bottom"><mt-picker ref="picker" :slots="slots" @change="onValuesChange"></mt-picker></mt-popup>' + ' </div>' +
' <mt-popup style="width: 100%" v-model="popupVisible" position="bottom"><mt-picker ref="picker" :slots="slots" @change="onValuesChange"></mt-picker></mt-popup>' +
'</a>' '</a>'
}); });
@ -384,28 +482,29 @@
onChange: function (e, file) { onChange: function (e, file) {
file.file = e.target.files[0] file.file = e.target.files[0]
file.name = e.target.files[0].name; file.name = e.target.files[0].name;
this.$emit("handle-file",file,{ this.$emit("handle-file", file, {
finish:function () { finish: function () {
this.$emit("input",this.fileList) this.$emit("input", this.fileList)
}.bind(this), }.bind(this),
cancel:function () { cancel: function () {
this.fileList.remove(file); this.fileList.remove(file);
this.$emit("input",this.fileList) this.$emit("input", this.fileList)
}.bind(this) }.bind(this)
}); });
}, },
}, },
props: ['value', 'label'], props: ['value', 'label'],
template: '<a class="mint-cell mint-field"><!---->' + template: '' +
'<div class="mint-cell-wrapper">' + '<a class="mint-cell mint-field"><!---->' +
' <div class="mint-cell-wrapper">' +
' <div class="mint-cell-title"><!----><span class="mint-cell-text">{{label}}</span><!----></div>' + ' <div class="mint-cell-title"><!----><span class="mint-cell-text">{{label}}</span><!----></div>' +
' <div class="mint-cell-value">' + ' <div class="mint-cell-value">' +
' <div style="padding-top: 11px;padding-bottom: 11px;text-align: left;width: 100%">' + ' <div style="padding-top: 11px;padding-bottom: 11px;text-align: left;width: 100%">' +
' <mt-button type="primary" size="small" @click="onTakePicture">添加</mt-button>' + ' <mt-button type="primary" size="small" @click="onTakePicture">添加</mt-button>' +
' <div style="line-height: 35px;" v-for="item in fileList" v-show="item.name">' + ' <div style="line-height: 35px;" v-for="item in fileList" v-show="item.name">' +
' <span class="mint-field-clear" style="padding-right: 10px;" @click="onClear(item)"><i class="mintui mintui-field-error"></i></span>' + ' <span class="mint-field-clear" style="padding-right: 10px;" @click="onClear(item)"><i class="mintui mintui-field-error"></i></span><!---->' +
' <a>{{item.name}}</a>' + ' <a>{{item.name}}</a><!---->' +
' <input ref="input" @change="onChange($event,item)" type="file" style="display: none"/>' + ' <input ref="input" @change="onChange($event,item)" type="file" style="display: none"/>' +
' </div>' + ' </div>' +
' </div>' + ' </div>' +

Loading…
Cancel
Save

Powered by TurnKey Linux.