@wlydfe/pro-ui 0.2.0

package/lib/components/search/src/index.vue.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index_vue_vue_type_script_setup_true_lang = require('./index.vue2.js');
+const _pluginVue_exportHelper = require('../../../_virtual/_plugin-vue_export-helper.js');
+
+const Search = /* @__PURE__ */ _pluginVue_exportHelper.default(index_vue_vue_type_script_setup_true_lang.default, [["__file", "index.vue"]]);
+
+exports.default = Search;

package/lib/components/search/src/index.vue2.js

@@ -0,0 +1,220 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const vue = require('vue');
+const index$1 = require('../../form/index.js');
+const iconsVue = require('@element-plus/icons-vue');
+require('../../../hooks/index.js');
+const elementPlus = require('element-plus');
+const index = require('../../utils/index.js');
+const useLocale = require('../../../hooks/useLocale.js');
+
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...{
+    name: "PlusSearch"
+  },
+  __name: "index",
+  props: {
+    modelValue: { default: () => ({}) },
+    defaultValues: { default: () => ({}) },
+    columns: { default: () => [] },
+    hasFooter: { type: Boolean, default: true },
+    hasReset: { type: Boolean, default: true },
+    hasUnfold: { type: Boolean, default: true },
+    searchText: { default: "" },
+    resetText: { default: "" },
+    searchLoading: { type: Boolean, default: false },
+    inline: { type: Boolean, default: true },
+    showNumber: { default: 2 },
+    rowProps: { default: () => ({
+      gutter: 20
+    }) },
+    colProps: { default: () => ({
+      xs: 24,
+      sm: 12,
+      md: 8,
+      lg: 8,
+      xl: 6
+    }) }
+  },
+  emits: ["update:modelValue", "search", "change", "reset", "collapse"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const { t } = useLocale.useLocale();
+    const plusFormInstance = vue.ref();
+    const isShowUnfold = vue.ref(false);
+    const values = vue.ref({});
+    const slots = vue.useSlots();
+    const labelSlots = index.filterSlots(slots, index.getLabelSlotName());
+    const fieldSlots = index.filterSlots(slots, index.getFieldSlotName());
+    const extraSlots = index.filterSlots(slots, index.getExtraSlotName());
+    const originData = vue.computed(() => {
+      return props.columns.filter((item) => vue.unref(item.hideInSearch) !== true).map((item) => ({ ...item, hideInForm: false }));
+    });
+    const subColumns = vue.computed(() => {
+      if (props.hasUnfold && !isShowUnfold.value) {
+        return originData.value.slice(0, props.showNumber);
+      } else {
+        return originData.value;
+      }
+    });
+    vue.watch(
+      () => props.modelValue,
+      (val) => {
+        values.value = val;
+      },
+      {
+        immediate: true
+      }
+    );
+    const handleChange = async (values2, column) => {
+      emit("update:modelValue", values2);
+      emit("change", values2, column);
+    };
+    const handleSearch = () => {
+      emit("search", values.value);
+    };
+    const handleReset = () => {
+      values.value = { ...props.defaultValues };
+      emit("update:modelValue", values.value);
+      emit("reset", values.value);
+    };
+    const handleUnfold = () => {
+      isShowUnfold.value = !isShowUnfold.value;
+      emit("collapse", isShowUnfold.value);
+    };
+    __expose({
+      plusFormInstance,
+      handleReset,
+      handleSearch,
+      handleUnfold
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(vue.unref(index$1.PlusForm), vue.mergeProps({
+        ref_key: "plusFormInstance",
+        ref: plusFormInstance
+      }, _ctx.$attrs, {
+        modelValue: values.value,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => values.value = $event),
+        inline: _ctx.inline,
+        "row-props": _ctx.rowProps,
+        "col-props": _ctx.colProps,
+        columns: subColumns.value,
+        class: "plus-search",
+        "has-footer": false,
+        onChange: handleChange
+      }), vue.createSlots({
+        "search-footer": vue.withCtx(() => [
+          _ctx.hasFooter ? (vue.openBlock(), vue.createBlock(vue.unref(elementPlus.ElFormItem), {
+            key: 0,
+            class: "plus-search__button__wrapper"
+          }, {
+            default: vue.withCtx(() => [
+              vue.renderSlot(_ctx.$slots, "footer", {
+                isShowUnfold: isShowUnfold.value,
+                handleReset,
+                handleSearch,
+                handleUnfold
+              }, () => [
+                _ctx.hasReset ? (vue.openBlock(), vue.createBlock(vue.unref(elementPlus.ElButton), {
+                  key: 0,
+                  icon: vue.unref(iconsVue.RefreshRight),
+                  onClick: handleReset
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.createTextVNode(
+                      vue.toDisplayString(_ctx.resetText || vue.unref(t)("plus.search.resetText")),
+                      1
+                      /* TEXT */
+                    )
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }, 8, ["icon"])) : vue.createCommentVNode("v-if", true),
+                vue.createVNode(vue.unref(elementPlus.ElButton), {
+                  type: "primary",
+                  loading: _ctx.searchLoading,
+                  icon: vue.unref(iconsVue.Search),
+                  onClick: handleSearch
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.createTextVNode(
+                      vue.toDisplayString(_ctx.searchText || vue.unref(t)("plus.search.searchText")),
+                      1
+                      /* TEXT */
+                    )
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }, 8, ["loading", "icon"]),
+                _ctx.hasUnfold && originData.value.length > _ctx.showNumber ? (vue.openBlock(), vue.createBlock(vue.unref(elementPlus.ElButton), {
+                  key: 1,
+                  type: "primary",
+                  link: "",
+                  onClick: handleUnfold
+                }, {
+                  default: vue.withCtx(() => [
+                    vue.createTextVNode(
+                      vue.toDisplayString(isShowUnfold.value ? vue.unref(t)("plus.search.retract") : vue.unref(t)("plus.search.expand")) + " ",
+                      1
+                      /* TEXT */
+                    ),
+                    vue.createVNode(vue.unref(elementPlus.ElIcon), null, {
+                      default: vue.withCtx(() => [
+                        isShowUnfold.value ? (vue.openBlock(), vue.createBlock(vue.unref(iconsVue.ArrowUp), { key: 0 })) : (vue.openBlock(), vue.createBlock(vue.unref(iconsVue.ArrowDown), { key: 1 }))
+                      ]),
+                      _: 1
+                      /* STABLE */
+                    })
+                  ]),
+                  _: 1
+                  /* STABLE */
+                })) : vue.createCommentVNode("v-if", true)
+              ])
+            ]),
+            _: 3
+            /* FORWARDED */
+          })) : vue.createCommentVNode("v-if", true)
+        ]),
+        _: 2
+        /* DYNAMIC */
+      }, [
+        vue.renderList(vue.unref(labelSlots), (_, key) => {
+          return {
+            name: key,
+            fn: vue.withCtx((data) => [
+              vue.renderSlot(_ctx.$slots, key, vue.normalizeProps(vue.guardReactiveProps(data)))
+            ])
+          };
+        }),
+        vue.renderList(vue.unref(fieldSlots), (_, key) => {
+          return {
+            name: key,
+            fn: vue.withCtx((data) => [
+              vue.renderSlot(_ctx.$slots, key, vue.normalizeProps(vue.guardReactiveProps(data)))
+            ])
+          };
+        }),
+        vue.renderList(vue.unref(extraSlots), (_, key) => {
+          return {
+            name: key,
+            fn: vue.withCtx((data) => [
+              vue.renderSlot(_ctx.$slots, key, vue.normalizeProps(vue.guardReactiveProps(data)))
+            ])
+          };
+        }),
+        _ctx.$slots["tooltip-icon"] ? {
+          name: "tooltip-icon",
+          fn: vue.withCtx(() => [
+            vue.renderSlot(_ctx.$slots, "tooltip-icon")
+          ]),
+          key: "0"
+        } : void 0
+      ]), 1040, ["modelValue", "inline", "row-props", "col-props", "columns"]);
+    };
+  }
+});
+
+exports.default = _sfc_main;

package/lib/components/search/style/css.d.ts

@@ -0,0 +1,3 @@
+import 'element-plus/es/components/button/style/css';
+import '@wlydfe/pro-ui-components/form/style/css';
+import '@wlydfe/pro-ui-theme-chalk/plus-search.css';

package/lib/components/search/style/css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+require('element-plus/lib/components/button/style/css.js');
+require('../../form/style/css.js');
+require('@wlydfe/pro-ui-theme-chalk/plus-search.css');
+

package/lib/components/search/style/index.d.ts

@@ -0,0 +1,3 @@
+import 'element-plus/es/components/button/style/index';
+import '@wlydfe/pro-ui-components/form/style/index';
+import '@wlydfe/pro-ui-theme-chalk/src/search.scss';

package/lib/components/search/style/index.js

@@ -0,0 +1,6 @@
+'use strict';
+
+require('element-plus/lib/components/button/style/index.js');
+require('../../form/style/index.js');
+require('../../../theme-chalk/src/search.scss.js');
+