ant-design-vue/components/table/SelectionBox.jsx
2019-02-01 17:23:00 +08:00

68 lines
1.6 KiB
Vue

import Checkbox from '../checkbox';
import Radio from '../radio';
import { SelectionBoxProps } from './interface';
import BaseMixin from '../_util/BaseMixin';
import { getOptionProps } from '../_util/props-util';
export default {
name: 'SelectionBox',
mixins: [BaseMixin],
props: SelectionBoxProps,
data() {
return {
checked: this.getCheckState(this.$props),
};
},
mounted() {
this.subscribe();
},
beforeDestroy() {
if (this.unsubscribe) {
this.unsubscribe();
}
},
methods: {
subscribe() {
const { store } = this;
this.unsubscribe = store.subscribe(() => {
const checked = this.getCheckState(this.$props);
this.setState({ checked });
});
},
getCheckState(props) {
const { store, defaultSelection, rowIndex } = props;
let checked = false;
if (store.getState().selectionDirty) {
checked = store.getState().selectedRowKeys.indexOf(rowIndex) >= 0;
} else {
checked =
store.getState().selectedRowKeys.indexOf(rowIndex) >= 0 ||
defaultSelection.indexOf(rowIndex) >= 0;
}
return checked;
},
},
render() {
const { type, rowIndex, ...rest } = getOptionProps(this);
const { checked, $attrs, $listeners } = this;
const checkboxProps = {
props: {
checked,
...rest,
},
attrs: $attrs,
on: $listeners,
};
if (type === 'radio') {
checkboxProps.props.value = rowIndex;
return <Radio {...checkboxProps} />;
} else {
return <Checkbox {...checkboxProps} />;
}
},
};