<template>
	<Spin v-if="spinning" size="mini"></Spin>
	<span v-else-if="_readonly" v-bind="$Attrs" v-text="readonlyText"></span>
  <Checkbox
    v-else
    v-bind="_fieldProps"
    name="value"
    v-for="(_value, key) in dataSource"
    :key='key'
    :trueValue="_value.value"
    v-model="value"
    :disabled="disabled">
    {{ _value.label }}
  </Checkbox>
</template>
<script setup>
import { inject, useAttrs,  onMounted } from 'vue';
import { useFieldBasics } from '../usefieldBasics';
import { Spin, Checkbox } from '@king-design/vue';
import { useRoute } from 'vue-router';

const route = useRoute();
const $Attrs = useAttrs();
const formInfo = inject('formInfo');
const emit = defineEmits(['change']);

const { value, spinning, dataSource, _readonly, _fieldProps,readonlyText,onRequest,onLinkage, disabled } = useFieldBasics(
	$Attrs,
	formInfo,
	route,
	emit
);

onMounted(async () => {
	onRequest();
	onLinkage();
});
</script>

<style lang="less" scoped>
.k-checkbox {
	margin-right: 24px;
}
</style>
