import { getCurrentInstance, useAttrs, ref, watch, computed, createBlock, openBlock, unref, mergeProps, isRef, withCtx, createElementBlock, toDisplayString } from "vue";
import { MobileField } from "../field/index.mjs";
import { getOptions } from "../../../utils/optionUtil.mjs";
import { MobileCheckboxGroup } from "../checkboxGroup/index.mjs";
import { cloneDeep } from "../../../utils/common.mjs";
const _hoisted_1 = { key: 1 };
const _sfc_main = {
  __name: "FieldCheckbox",
  props: {
    modelValue: {
      type: String,
      default: ""
    },
    optionConfig: {
      type: Object,
      default: () => ({})
    },
    readonly: {
      type: Boolean,
      default: false
    },
    dataSources: {
      type: Array,
      default: () => []
    },
    formData: {
      type: Object,
      default: () => {
      }
    },
    fields: {
      type: Array,
      default: () => []
    }
  },
  emits: ["update:modelValue"],
  setup(__props, { emit: __emit }) {
    const currentInstance = getCurrentInstance();
    const ctx = currentInstance.proxy;
    const props = __props;
    useAttrs();
    const finalOptions = ref([]);
    watch(
      () => cloneDeep(props.optionConfig),
      (val) => {
        getOptions({
          ctx,
          dataSources: props.dataSources,
          formData: props.formData,
          fields: props.fields,
          ...props.optionConfig
        }).then((data) => {
          finalOptions.value = data;
        });
      },
      {
        deep: true,
        immediate: true
      }
    );
    const emit = __emit;
    const compValue = computed({
      get: () => {
        if (props.modelValue) {
          if (Array.isArray(props.modelValue)) {
            return props.modelValue;
          } else {
            return props.modelValue.split("|");
          }
        } else {
          return [];
        }
      },
      set: (val) => {
        emit("update:modelValue", val.join("|"));
      }
    });
    const fieldTextValue = computed(() => {
      return compValue.value.map((value) => {
        const option = finalOptions.value.find((opt) => opt.value === value);
        return option ? option.text : value;
      }).join(", ");
    });
    return (_ctx, _cache) => {
      return openBlock(), createBlock(unref(MobileField), mergeProps(_ctx.$attrs, {
        readonly: __props.readonly,
        modelValue: unref(fieldTextValue),
        "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => isRef(fieldTextValue) ? fieldTextValue.value = $event : null)
      }), {
        input: withCtx(() => [
          !__props.readonly ? (openBlock(), createBlock(unref(MobileCheckboxGroup), mergeProps({ key: 0 }, _ctx.$attrs, {
            options: unref(finalOptions),
            modelValue: unref(compValue),
            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(compValue) ? compValue.value = $event : null)
          }), null, 16, ["options", "modelValue"])) : (openBlock(), createElementBlock("span", _hoisted_1, toDisplayString(unref(fieldTextValue)), 1))
        ]),
        _: 1
      }, 16, ["readonly", "modelValue"]);
    };
  }
};
export {
  _sfc_main as default
};
