@opentiny/vue-renderless/grid-select/vue.js

An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.

import "../chunk-G2ADBYYC.js";
import {
  buildRadioConfig,
  buildSelectConfig,
  filter,
  getcheckedData,
  getPluginOption,
  handleVisibleChange,
  initQuery,
  mounted,
  radioChange,
  selectChange,
  syncGridSelection,
  watchValue
} from "./index";
const api = [
  "state",
  "buildRadioConfig",
  "buildSelectConfig",
  "filter",
  "radioChange",
  "selectChange",
  "getcheckedData",
  "getPluginOption",
  "mounted",
  "syncGridSelection",
  "watchValue",
  "handleVisibleChange"
];
const renderless = (props, { reactive, computed, watch, onMounted, nextTick }, { vm, emit }) => {
  var _a;
  const api2 = {};
  const initGridData = () => {
    if (props.gridOp) {
      if (props.gridOp.data) {
        return props.gridOp.data;
      } else if (Array.isArray(props.gridOp)) {
        return props.gridOp;
      } else {
        return props.gridOp;
      }
    }
    return { data: [], columns: [] };
  };
  const state = reactive({
    value: props.modelValue,
    gridData: initGridData(),
    remoteData: [],
    selected: props.multiple ? [] : {},
    currentKey: props.multiple ? "" : props.modelValue,
    previousQuery: null,
    modelValue: props.multiple ? Array.isArray(props.modelValue) ? [...props.modelValue] : [] : props.modelValue,
    isMounted: false,
    firstAutoSearch: ((_a = props.remoteConfig) == null ? void 0 : _a.autoSearch) || false
  });
  Object.assign(api2, {
    state,
    buildRadioConfig: buildRadioConfig({ props, state }),
    buildSelectConfig: buildSelectConfig({ props, state }),
    filter: filter({ props, state, vm }),
    getcheckedData: getcheckedData({ props, state }),
    getPluginOption: getPluginOption({ api: api2, props, state }),
    initQuery: initQuery({ props, state, vm }),
    mounted: mounted({ api: api2, state, props, vm, nextTick }),
    radioChange: radioChange({ props, vm, emit, state }),
    selectChange: selectChange({ props, vm, emit, state, nextTick }),
    syncGridSelection: syncGridSelection({ props, vm, state, nextTick }),
    handleVisibleChange: handleVisibleChange({ api: api2, state, props }),
    watchValue: watchValue({ api: api2, props, vm, state })
  });
  state.gridCheckedData = computed(() => api2.getcheckedData());
  watch(
    () => props.gridOp,
    (gridOp) => {
      if (gridOp) {
        if (gridOp.data) {
          state.gridData = gridOp.data;
        } else if (Array.isArray(gridOp)) {
          state.gridData = gridOp;
        } else {
          state.gridData = gridOp;
        }
      }
    },
    { immediate: true, deep: true }
  );
  watch(
    () => props.modelValue,
    () => {
      if (props.multiple && Array.isArray(props.modelValue)) {
        state.modelValue = [...props.modelValue];
      } else {
        state.modelValue = props.modelValue;
      }
    },
    { immediate: true, deep: true }
  );
  watch(
    () => state.modelValue,
    (newValue, oldValue) => {
      if (state.isMounted) {
        api2.watchValue(newValue, oldValue);
      }
    }
  );
  watch(
    () => props.extraQueryParams,
    () => {
      if (props.remote) {
        api2.filter(state.previousQuery || "");
      }
    },
    { deep: true, immediate: false }
  );
  onMounted(() => {
    api2.mounted();
    state.isMounted = true;
  });
  return api2;
};
export {
  api,
  renderless
};