@wlydfe/pro-ui 0.1.25

package/es/components/search/src/index.vue.mjs

@@ -0,0 +1,6 @@
+import _sfc_main from './index.vue2.mjs';
+import _export_sfc from '../../../_virtual/_plugin-vue_export-helper.mjs';
+
+var Search = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "index.vue"]]);
+
+export { Search as default };

package/es/components/search/src/index.vue2.mjs

@@ -0,0 +1,221 @@
+import { defineComponent, ref, useAttrs, computed, unref, watch, openBlock, createBlock, mergeProps, createSlots, withCtx, renderSlot, createTextVNode, toDisplayString, createCommentVNode, createVNode, renderList, normalizeProps, guardReactiveProps } from 'vue';
+import { PlusForm } from '../../form/index.mjs';
+import { RefreshRight, Search, ArrowUp, ArrowDown } from '@element-plus/icons-vue';
+import '../../../hooks/index.mjs';
+import { ElFormItem, ElButton, ElLink, ElIcon } from 'element-plus';
+import { orderBy } from 'lodash-es';
+import { versionIsLessThan299 } from '../../utils/index.mjs';
+import { useLocale } from '../../../hooks/useLocale.mjs';
+
+var _sfc_main = /* @__PURE__ */ 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 },
+    defaultUnfold: { type: Boolean, default: false },
+    searchText: { default: "" },
+    resetText: { default: "" },
+    retractText: { default: "" },
+    expandText: { default: "" },
+    searchLoading: { type: Boolean, default: false },
+    inline: { type: Boolean, default: true },
+    showNumber: { default: 2 },
+    labelPosition: { default: void 0 },
+    rowProps: { default: () => ({
+      gutter: 20
+    }) },
+    colProps: { default: () => ({
+      xs: 24,
+      sm: 12,
+      md: 8,
+      lg: 8,
+      xl: 6
+    }) },
+    needValidate: { type: Boolean, default: false }
+  },
+  emits: ["update:modelValue", "search", "change", "reset", "collapse"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    var _a;
+    const props = __props;
+    const emit = __emit;
+    const { t } = useLocale();
+    const plusFormInstance = ref();
+    const isShowUnfold = ref((_a = props.defaultUnfold) != null ? _a : false);
+    const values = ref({});
+    const attrs = useAttrs();
+    const rules = computed(
+      () => props.needValidate ? attrs.rules : void 0
+    );
+    const unfoldText = computed(
+      () => isShowUnfold.value ? props.retractText || t("plus.search.retract") : props.expandText || t("plus.search.expand")
+    );
+    const originData = computed(() => {
+      const filterData = props.columns.filter((item) => unref(item.hideInSearch) !== true).map((item) => ({ ...item, hideInForm: false })).map((item) => ({ ...item, order: (item == null ? void 0 : item.order) ? unref(item.order) : 0 }));
+      return orderBy(filterData, ["order"], ["desc"]);
+    });
+    const subColumns = computed(() => {
+      if (props.hasUnfold && !isShowUnfold.value) {
+        return originData.value.slice(0, props.showNumber);
+      } else {
+        return originData.value;
+      }
+    });
+    watch(
+      () => props.modelValue,
+      (val) => {
+        values.value = val;
+      },
+      {
+        immediate: true
+      }
+    );
+    const handleChange = async (values2, column) => {
+      emit("update:modelValue", values2);
+      emit("change", values2, column);
+    };
+    const handleSearchDefault = () => {
+      emit("search", values.value);
+    };
+    const handleSearchValidate = async () => {
+      var _a2;
+      const isValid = await ((_a2 = plusFormInstance.value) == null ? void 0 : _a2.handleSubmit());
+      if (isValid) {
+        emit("search", values.value);
+      }
+    };
+    const handleSearch = computed(
+      () => props.needValidate ? handleSearchValidate : handleSearchDefault
+    );
+    const handleReset = () => {
+      values.value = { ...props.defaultValues };
+      emit("update:modelValue", values.value);
+      emit("reset", values.value);
+    };
+    const handleUnfold = (e) => {
+      e.preventDefault();
+      isShowUnfold.value = !isShowUnfold.value;
+      emit("collapse", isShowUnfold.value);
+    };
+    __expose({
+      plusFormInstance,
+      handleReset,
+      handleSearch: handleSearch.value,
+      handleUnfold
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(PlusForm), mergeProps({
+        ref_key: "plusFormInstance",
+        ref: plusFormInstance
+      }, _ctx.$attrs, {
+        modelValue: values.value,
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => values.value = $event),
+        inline: _ctx.inline,
+        rules: rules.value,
+        "label-position": _ctx.labelPosition,
+        "row-props": _ctx.rowProps,
+        "col-props": _ctx.colProps,
+        columns: subColumns.value,
+        class: "plus-search",
+        "has-footer": false,
+        onChange: handleChange
+      }), createSlots({
+        "search-footer": withCtx(() => [
+          _ctx.hasFooter ? (openBlock(), createBlock(unref(ElFormItem), {
+            key: 0,
+            class: "plus-search__button__wrapper",
+            label: _ctx.labelPosition === "top" ? "placeholder" : ""
+          }, {
+            default: withCtx(() => [
+              renderSlot(_ctx.$slots, "footer", {
+                isShowUnfold: isShowUnfold.value,
+                handleReset,
+                handleSearch: handleSearch.value,
+                handleUnfold,
+                searchLoading: _ctx.searchLoading
+              }, () => [
+                _ctx.hasReset ? (openBlock(), createBlock(unref(ElButton), {
+                  key: 0,
+                  icon: unref(RefreshRight),
+                  onClick: handleReset
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(
+                      toDisplayString(_ctx.resetText || unref(t)("plus.search.resetText")),
+                      1
+                      /* TEXT */
+                    )
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }, 8, ["icon"])) : createCommentVNode("v-if", true),
+                createVNode(unref(ElButton), {
+                  type: "primary",
+                  loading: _ctx.searchLoading,
+                  icon: unref(Search),
+                  onClick: handleSearch.value
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(
+                      toDisplayString(_ctx.searchText || unref(t)("plus.search.searchText")),
+                      1
+                      /* TEXT */
+                    )
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }, 8, ["loading", "icon", "onClick"]),
+                _ctx.hasUnfold && originData.value.length > _ctx.showNumber ? (openBlock(), createBlock(unref(ElLink), {
+                  key: 1,
+                  class: "plus-search__unfold",
+                  type: "primary",
+                  underline: unref(versionIsLessThan299) ? false : "never",
+                  href: "javaScript:;",
+                  onClick: handleUnfold
+                }, {
+                  default: withCtx(() => [
+                    createTextVNode(
+                      toDisplayString(unfoldText.value) + " ",
+                      1
+                      /* TEXT */
+                    ),
+                    createVNode(unref(ElIcon), null, {
+                      default: withCtx(() => [
+                        isShowUnfold.value ? (openBlock(), createBlock(unref(ArrowUp), { key: 0 })) : (openBlock(), createBlock(unref(ArrowDown), { key: 1 }))
+                      ]),
+                      _: 1
+                      /* STABLE */
+                    })
+                  ]),
+                  _: 1
+                  /* STABLE */
+                }, 8, ["underline"])) : createCommentVNode("v-if", true)
+              ])
+            ]),
+            _: 3
+            /* FORWARDED */
+          }, 8, ["label"])) : createCommentVNode("v-if", true)
+        ]),
+        _: 2
+        /* DYNAMIC */
+      }, [
+        renderList(_ctx.$slots, (_, key) => {
+          return {
+            name: key,
+            fn: withCtx((data) => [
+              renderSlot(_ctx.$slots, key, normalizeProps(guardReactiveProps(data)))
+            ])
+          };
+        })
+      ]), 1040, ["modelValue", "inline", "rules", "label-position", "row-props", "col-props", "columns"]);
+    };
+  }
+});
+
+export { _sfc_main as default };

package/es/components/search/src/type.d.ts

@@ -0,0 +1,42 @@
+import { RowProps, ColProps } from 'element-plus';
+import { PlusFormProps } from '@wlydfe/pro-ui/es/components';
+import { PlusColumn, FieldValues, Mutable } from '@wlydfe/pro-ui/es/types';
+
+export type PlusSearchSelfProps = {
+    modelValue?: FieldValues;
+    defaultValues?: FieldValues;
+    columns?: PlusColumn[];
+    hasFooter?: boolean;
+    hasReset?: boolean;
+    hasUnfold?: boolean;
+    /**
+     * 默认是否展开
+     * @version 0.1.24
+     * @default false
+     */
+    defaultUnfold?: boolean;
+    searchText?: string;
+    resetText?: string;
+    retractText?: string;
+    expandText?: string;
+    searchLoading?: boolean;
+    inline?: boolean;
+    showNumber?: number;
+    labelPosition?: 'left' | 'right' | 'top';
+    rowProps?: Partial<Mutable<RowProps>>;
+    colProps?: Partial<Mutable<ColProps>>;
+    /**
+     * 搜索是否需要校验 ，默认不需要校验表单
+     * @variation v0.1.15
+     * @default  false
+     */
+    needValidate?: boolean;
+};
+export type PlusSearchProps = PlusSearchSelfProps & PlusFormProps;
+export interface PlusSearchEmits {
+    (e: 'update:modelValue', values: FieldValues): void;
+    (e: 'search', values: FieldValues): void;
+    (e: 'change', values: FieldValues, column: PlusColumn): void;
+    (e: 'reset', values: FieldValues): void;
+    (e: 'collapse', isShowUnfold: boolean): void;
+}

package/es/components/search/src/type.mjs

@@ -0,0 +1 @@
+

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

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

package/es/components/search/style/css.mjs

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

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

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

package/es/components/search/style/index.mjs

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