@fmdeui/fmui 1.0.110 → 1.0.112

package/es/packages/components/fm-select/index.vue2.mjs

@@ -0,0 +1,207 @@
+import { defineComponent, useModel, reactive, onMounted, resolveComponent, openBlock, createBlock, normalizeStyle, withCtx, createCommentVNode, createElementBlock, Fragment, renderList, createElementVNode, createVNode, unref, mergeModels } from 'vue';
+import { RefreshLeft } from '@element-plus/icons-vue';
+import '../../stores/index.mjs';
+import { usefminputdropdownstore } from '../../stores/ainputdropdow.mjs';
+
+const _hoisted_1 = { style: { "display": "flex", "justify-content": "end", "align-items": "right", "cursor": "pointer" } };
+var _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{
+    name: "FmSelect"
+  },
+  __name: "index",
+  props: /* @__PURE__ */ mergeModels({
+    //数据
+    optionData: {
+      type: Array,
+      default: []
+    },
+    /**
+     * 值的属性值
+     */
+    bvalue: {
+      type: String,
+      default: "id"
+    },
+    /**
+     * 值的属性标签
+     */
+    blabel: {
+      type: String,
+      default: "name"
+    },
+    placeholder: {
+      type: String,
+      default: "\u8BF7\u9009\u62E9"
+    },
+    inputWidth: {
+      type: String,
+      default: "40%"
+    },
+    dropWidth: {
+      type: String,
+      default: "90px"
+    },
+    dropHeight: {
+      type: String,
+      default: "180px"
+    },
+    /**
+    * api service name
+    */
+    apiService: {
+      type: String,
+      default: "baseData"
+    },
+    /**
+    * api service 下的方法
+    */
+    apiAction: {
+      type: String,
+      default: "baseDataList"
+    },
+    /**
+     * 基础编码 自动获取数据
+     */
+    basecode: {
+      type: String,
+      default: ""
+    },
+    /**
+    * 基础编码  多个编码合在一起调用
+    */
+    multibasecode: {
+      type: Array,
+      default: []
+    },
+    freshSize: {
+      type: [Number, String],
+      default: 20
+    },
+    /**
+    * 是否默认加载数据
+    */
+    autoLoadData: {
+      type: Boolean,
+      default: true
+    },
+    /**
+     * 是否添加空选项
+     */
+    addEmptyOption: {
+      type: Boolean,
+      default: false
+    },
+    /**
+     * 空选项的标签
+     */
+    emptyOptionLabel: {
+      type: String,
+      default: "\u5168\u90E8"
+    },
+    /**
+     * 空选项的值
+     */
+    emptyOptionValue: {
+      type: Number,
+      default: 0
+    }
+  }, {
+    "id": { default: 0, required: false },
+    "idModifiers": {},
+    "name": { default: "", required: false },
+    "nameModifiers": {}
+  }),
+  emits: /* @__PURE__ */ mergeModels(["change"], ["update:id", "update:name"]),
+  setup(__props, { emit: __emit }) {
+    const modeValueId = useModel(__props, "id");
+    const modeValueName = useModel(__props, "name");
+    const props = __props;
+    const state = reactive({
+      optionData: props.optionData
+    });
+    const emit = __emit;
+    const handelChange = (val) => {
+      if (props.addEmptyOption && val == props.emptyOptionValue) {
+        modeValueId.value = props.emptyOptionValue;
+        return;
+      }
+      const fitem = state.optionData.find((item) => item[props.blabel] === val);
+      modeValueId.value = fitem != null ? fitem[props.bvalue] : 0;
+      modeValueName.value = fitem != null ? fitem[props.blabel] : "";
+      emit("change", val);
+    };
+    const handelClear = () => {
+      modeValueId.value = 0;
+      modeValueName.value = "";
+      emit("change", "");
+    };
+    onMounted(async () => {
+      if (props.optionData.length > 0) {
+        state.optionData = props.optionData;
+      }
+      if (props.autoLoadData && props.basecode && props.basecode != "") {
+        const useBaseApi = usefminputdropdownstore();
+        state.optionData = await useBaseApi.getOptionsData(props.apiService, props.apiAction, props.basecode, false, props.multibasecode);
+      }
+    });
+    const handRestdata = async () => {
+      if (props.basecode && props.basecode != "") {
+        const useBaseApi = usefminputdropdownstore();
+        state.optionData = await useBaseApi.getOptionsData(props.apiService, props.apiAction, props.basecode, true, []);
+      }
+    };
+    return (_ctx, _cache) => {
+      const _component_el_icon = resolveComponent("el-icon");
+      const _component_el_option = resolveComponent("el-option");
+      const _component_el_select = resolveComponent("el-select");
+      return openBlock(), createBlock(_component_el_select, {
+        modelValue: modeValueName.value,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => modeValueName.value = $event),
+        placeholder: props.placeholder,
+        style: normalizeStyle({ width: __props.inputWidth }),
+        onChange: handelChange,
+        onClear: handelClear
+      }, {
+        header: withCtx(() => [
+          createElementVNode("div", _hoisted_1, [
+            createVNode(_component_el_icon, {
+              color: "#13c2c2",
+              size: __props.freshSize,
+              onClick: handRestdata
+            }, {
+              default: withCtx(() => [
+                createVNode(unref(RefreshLeft))
+              ]),
+              _: 1
+              /* STABLE */
+            }, 8, ["size"])
+          ])
+        ]),
+        default: withCtx(() => [
+          __props.addEmptyOption ? (openBlock(), createBlock(_component_el_option, {
+            key: 0,
+            label: __props.emptyOptionLabel,
+            value: __props.emptyOptionLabel
+          }, null, 8, ["label", "value"])) : createCommentVNode("v-if", true),
+          (openBlock(true), createElementBlock(
+            Fragment,
+            null,
+            renderList(state.optionData, (item, index) => {
+              return openBlock(), createBlock(_component_el_option, {
+                key: index,
+                label: item[__props.blabel],
+                value: item[__props.blabel]
+              }, null, 8, ["label", "value"]);
+            }),
+            128
+            /* KEYED_FRAGMENT */
+          ))
+        ]),
+        _: 1
+        /* STABLE */
+      }, 8, ["modelValue", "placeholder", "style"]);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/es/packages/components/index.mjs

@@ -11,6 +11,7 @@ export { elSvg } from './svgIcon/index.mjs';
 export { FLayout } from './fm-layout/index.mjs';
 export { FSettings } from './fm-settings/index.mjs';
 export { FModifyRecord } from './modifyRecord/index.mjs';
+export { FmSelect } from './fm-select/index.mjs';
 export { Fminputdropdown } from './fm-inputdropdown/index.mjs';
 export { FmInputNumber } from './fm-inputnumber/index.mjs';
 export { FmAutocomplete } from './fm-autocomplete/index.mjs';