diff --git a/src/platforms/app-plus-nvue/runtime/components/checkbox.js b/src/platforms/app-plus-nvue/runtime/components/checkbox.js new file mode 100644 index 0000000000000000000000000000000000000000..4ae03e19ebf934af11a9b02dcd52452ecddf0867 --- /dev/null +++ b/src/platforms/app-plus-nvue/runtime/components/checkbox.js @@ -0,0 +1,170 @@ +import { + emitter, + listeners +} from '../mixins' + +function getCheckbox (weex) { + return { + name: 'Checkbox', + mixins: [emitter, listeners], + props: { + checked: { + type: [Boolean, String], + default: false + }, + id: { + type: String, + default: '' + }, + disabled: { + type: [Boolean, String], + default: false + }, + color: { + type: String, + default: '#007aff' + }, + value: { + type: String, + default: '' + } + }, + data () { + return { + checkboxChecked: this.checked, + checkboxValue: this.value + } + }, + + watch: { + checked: function checked (val) { + this.checkboxChecked = val + }, + value: function value (val) { + this.checkboxValue = val + } + }, + listeners: { + 'label-click': '_onClick', + '@label-click': '_onClick' + }, + computed: { + checkboxColor: function checkboxColor () { + return this.disabled ? '#adadad' : this.color + } + }, + created () { + this.$dispatch('CheckboxGroup', 'uni-checkbox-group-update', { + type: 'add', + vm: this + }) + this.$dispatch('Form', 'uni-form-group-update', { + type: 'add', + vm: this + }) + }, + beforeDestroy () { + this.$dispatch('CheckboxGroup', 'uni-checkbox-group-update', { + type: 'remove', + vm: this + }) + this.$dispatch('Form', 'uni-form-group-update', { + type: 'remove', + vm: this + }) + }, + + methods: { + _onClick ($event) { + if (this.disabled) return + this.checkboxChecked = !this.checkboxChecked + this.$dispatch('CheckboxGroup', 'uni-checkbox-change', $event) + }, + _resetFormData () { + this.checkboxChecked = false + } + }, + beforeCreate () { + }, + render (createElement) { + const _vm = this + return createElement('div', _vm._g({}, _vm.$listeners), [ + createElement( + 'div', { + staticClass: ['uni-checkbox'] + }, + [ + createElement( + 'div', { + staticClass: ['uni-checkbox-input'], + class: [_vm.disabled ? 'uni-checkbox-input-disabled' : ''] + }, + [ + _vm.checkboxChecked ? + createElement( + 'u-text', { + staticClass: ['uni-icon'], + style: { + color: _vm.checkboxColor + } + }, + [_vm._v(_vm._s('\uEA08'))] + ) : + _vm._e() + ] + ), + createElement( + 'u-text', { + staticClass: ['uni-slot'] + }, + [_vm._t('default')], + 2 + ) + ] + ) + ]) + }, + style: { + 'uni-checkbox': { + flexDirection: 'row', + alignItems: 'center' + }, + 'uni-checkbox-input': { + justifyContent: 'center', + alignItems: 'center', + position: 'relative', + borderWidth: '1', + borderColor: '#d1d1d1', + borderStyle: 'solid', + backgroundColor: '#ffffff', + borderRadius: '3', + width: '22', + height: '22' + }, + 'uni-icon': { + fontFamily: 'unincomponents', + fontSize: '16', + marginLeft: '2', + marginTop: '2', + color: '#007aff' + }, + 'uni-checkbox-input-disabled': { + backgroundColor: '#e1e1e1' + }, + 'uni-checkbox-input-disabled-before': { + color: '#adadad' + }, + 'uni-slot': { + fontSize: '16', + marginLeft: '5' + }, + 'uni-checkbox-group': { + display: 'block' + } + } + } +} + +export default function init (Vue, weex) { + Vue.component('checkbox', getCheckbox(weex)) +}