123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159 |
- import baseComponent from '../helpers/baseComponent'
- import classNames from '../helpers/libs/classNames'
- import { getDefaultContext } from '../helpers/shared/getDefaultContext'
- import { props as checkboxGroupProps } from '../checkbox-group/props'
- const defaultContext = {
- ...getDefaultContext(checkboxGroupProps, [
- 'disabled',
- 'readOnly',
- 'hasLine',
-
- // only context
- 'hasFieldDecorator',
- 'withListComponent',
- 'iconPosition',
- 'iconSize',
- 'iconOn',
- 'iconOff',
- ]),
- withListComponent: false,
- }
- baseComponent({
- useExport: true,
- relations: {
- '../checkbox-group/index': {
- type: 'ancestor',
- },
- },
- properties: {
- prefixCls: {
- type: String,
- value: 'wux-checkbox',
- },
- cellPrefixCls: {
- type: String,
- value: 'wux-cell',
- },
- selectablePrefixCls: {
- type: String,
- value: 'wux-selectable',
- },
- title: {
- type: String,
- value: '',
- },
- label: {
- type: String,
- value: '',
- },
- extra: {
- type: String,
- value: '',
- },
- value: {
- type: String,
- value: '',
- },
- checked: {
- type: Boolean,
- value: false,
- observer(newVal) {
- this.setData({
- inputChecked: newVal,
- })
- },
- },
- disabled: {
- type: Boolean,
- value: false,
- },
- readOnly: {
- type: Boolean,
- value: false,
- },
- color: {
- type: String,
- value: 'balanced',
- },
- wrapStyle: {
- type: [String, Object],
- value: '',
- },
- hasLine: {
- type: Boolean,
- value: true,
- },
- },
- data: {
- inputChecked: false,
- index: 0,
- isLast: false,
- context: defaultContext,
- },
- computed: {
- classes: ['prefixCls', function(prefixCls) {
- const cell = classNames(prefixCls)
- const extra = `${prefixCls}__extra`
- const iconPosition = `${prefixCls}__icon-position`
- const iconSelectable = `${prefixCls}__icon-selectable`
- const selectable = `${prefixCls}__selectable`
- const selectableH = `${prefixCls}__selectable-horizontal`
- return {
- cell,
- extra,
- iconPosition,
- iconSelectable,
- selectable,
- selectableH,
- }
- }],
- },
- methods: {
- checkboxChange(e) {
- const { disabled, readOnly, context } = this.data
- const { checked } = e.detail
- if (disabled || context.disabled || readOnly || context.readOnly) return
- this.onChange(checked)
- },
- changeValue(inputChecked = false, index = 0, isLast = false, context = defaultContext) {
- this.setData({
- inputChecked,
- index,
- isLast,
- context,
- })
- },
- onChange(inputChecked) {
- const { value, index } = this.data
- const item = {
- checked: inputChecked,
- value,
- index,
- }
- const parent = this.getRelationsByName('../checkbox-group/index')[0]
- parent ? parent.onChange(item) : this.triggerEvent('change', item)
- },
- setChecked(inputChecked) {
- if (this.data.inputChecked !== inputChecked) {
- this.setData({
- inputChecked,
- })
- }
- this.onChange(inputChecked)
- },
- check(){
- this.setChecked(true)
- },
- uncheck(){
- this.setChecked(false)
- },
- toggle(){
- this.setChecked(!this.data.inputChecked)
- },
- },
- })
|