bm-admin-ui 1.0.82-alpha → 1.0.84-alpha

package/lib/components/search-filter/index.js

@@ -0,0 +1,459 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var withInstall = require('bm-admin-ui/lib/utils/with-install');
+var vue = require('vue');
+var FormCreateCtr = require('@form-create/ant-design-vue');
+var iconsVue = require('@ant-design/icons-vue');
+var ASelect = require('ant-design-vue/lib/select');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var FormCreateCtr__default = /*#__PURE__*/_interopDefaultLegacy(FormCreateCtr);
+var ASelect__default = /*#__PURE__*/_interopDefaultLegacy(ASelect);
+
+const searchResetBtnProps = {
+    showExpandBtn: {
+        type: Boolean,
+        default: false,
+    },
+    showSearchIcon: {
+        type: Boolean,
+        default: false,
+    },
+    expandPlacement: {
+        type: String,
+        default: 'left',
+    },
+    expandText: {
+        type: String,
+        default: '展开',
+    },
+    collapseText: {
+        type: String,
+        default: '收起',
+    },
+    gutter: {
+        type: Array,
+        default() {
+            return [24, 16];
+        },
+    },
+    loading: {
+        type: Boolean,
+        default: false,
+    },
+};
+const searchFilterProps = Object.assign({ userRule: {
+        type: Array,
+        default() {
+            return [];
+        },
+    }, labelCol: {
+        type: Object,
+        default() {
+            return {
+                flex: '0 0 auto',
+            };
+        },
+    }, value: {
+        type: Object,
+        default() {
+            return {};
+        },
+    }, ruleSpan: {
+        type: Object,
+        default() {
+            return {};
+        },
+    }, fixedCount: {
+        type: Number,
+        default: 999999,
+    }, fixedFields: {
+        type: Array,
+        default() {
+            return [];
+        },
+    } }, searchResetBtnProps);
+
+var _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+
+const _hoisted_1$1 = { class: "bm-search-filter-actions" };
+const _sfc_main$2 = /* @__PURE__ */ vue.defineComponent({
+  __name: "search-reset-btn",
+  props: searchResetBtnProps,
+  emits: ["submit", "reset", "expand"],
+  setup(__props, { emit: emits }) {
+    const props = __props;
+    const isExpand = vue.ref(false);
+    const wrapperStyle = vue.computed(() => {
+      let gutter = props.gutter?.[0] || 24;
+      return { paddingLeft: gutter / 2 + "px", paddingRight: gutter / 2 + "px" };
+    });
+    function handleExpandBtnChange() {
+      isExpand.value = !isExpand.value;
+      emits("expand", isExpand.value);
+    }
+    function handleSubmit() {
+      emits("submit");
+    }
+    function handleReset() {
+      emits("reset");
+    }
+    return (_ctx, _cache) => {
+      const _component_a_button = vue.resolveComponent("a-button");
+      return vue.openBlock(), vue.createElementBlock("div", {
+        class: "bm-search-filter-btn",
+        style: vue.normalizeStyle(vue.unref(wrapperStyle))
+      }, [
+        props.showExpandBtn ? (vue.openBlock(), vue.createElementBlock("span", {
+          key: 0,
+          class: "bm-search-filter-expand",
+          onClick: handleExpandBtnChange
+        }, [
+          vue.createTextVNode(vue.toDisplayString(isExpand.value ? props.collapseText : props.expandText), 1),
+          isExpand.value ? (vue.openBlock(), vue.createBlock(vue.unref(iconsVue.UpOutlined), { key: 0 })) : (vue.openBlock(), vue.createBlock(vue.unref(iconsVue.DownOutlined), { key: 1 }))
+        ])) : vue.createCommentVNode("v-if", true),
+        vue.createElementVNode("span", _hoisted_1$1, [
+          vue.createVNode(_component_a_button, { onClick: handleReset }, {
+            default: vue.withCtx(() => [
+              vue.createTextVNode("\u91CD\u7F6E")
+            ]),
+            _: 1
+          }),
+          vue.createVNode(_component_a_button, {
+            type: "primary",
+            loading: props.loading,
+            onClick: handleSubmit
+          }, {
+            default: vue.withCtx(() => [
+              props.showSearchIcon && !props.loading ? (vue.openBlock(), vue.createBlock(vue.unref(iconsVue.SearchOutlined), { key: 0 })) : vue.createCommentVNode("v-if", true),
+              vue.createTextVNode("\u67E5\u8BE2 ")
+            ]),
+            _: 1
+          }, 8, ["loading"])
+        ])
+      ], 4);
+    };
+  }
+});
+var SearchResetBtn = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__file", "search-reset-btn.vue"]]);
+
+const _hoisted_1 = { class: "bm-select-header" };
+const _hoisted_2 = { class: "bm-select-header-btn" };
+const _hoisted_3 = ["onClick"];
+const _hoisted_4 = /* @__PURE__ */ vue.createElementVNode("span", { class: "checkbox-label" }, "\u5168\u9009", -1);
+const _hoisted_5 = ["onClick"];
+const _hoisted_6 = /* @__PURE__ */ vue.createElementVNode("span", { class: "checkbox-label" }, "\u53CD\u9009", -1);
+const _hoisted_7 = { class: "blue" };
+const _sfc_main$1 = /* @__PURE__ */ vue.defineComponent({
+  __name: "form-select-all",
+  props: {
+    modelValue: {
+      type: Array || String || Number || void 0
+    },
+    disabled: Boolean
+  },
+  emits: ["onSelectAll", "onChange", "update:modelValue"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const instance = vue.getCurrentInstance();
+    const state = vue.reactive({
+      search: {
+        indeterminate: false,
+        checkedAll: false,
+        checkedReverse: false
+      }
+    });
+    let selectValue = vue.ref([]);
+    vue.watch(
+      () => props.modelValue,
+      (val) => {
+        selectValue.value = val;
+        if (!selectValue.value || selectValue.value.length <= 0) {
+          state.search = {
+            indeterminate: false,
+            checkedAll: false,
+            checkedReverse: false
+          };
+        }
+      },
+      {
+        immediate: true
+      }
+    );
+    const selectAll = (e) => {
+      let key = "value";
+      if (instance?.attrs.fieldNames || instance?.attrs["field-names"])
+        key = (instance?.attrs).fieldNames?.value || (instance?.attrs)["field-names"].value;
+      state.search.checkedAll = !state.search.checkedAll;
+      state.search.indeterminate = false;
+      state.search.checkedReverse = false;
+      if (state.search.checkedAll) {
+        selectValue.value = (instance?.attrs.options).map(
+          (v) => {
+            return v[key];
+          }
+        );
+      } else {
+        selectValue.value = [];
+      }
+      emit("update:modelValue", selectValue.value);
+      emit("onSelectAll", {
+        type: "all",
+        value: selectValue.value
+      });
+    };
+    const reverseAll = (e) => {
+      let key = "value";
+      if (instance?.attrs.fieldNames || instance?.attrs["field-names"])
+        key = (instance?.attrs).fieldNames?.value || (instance?.attrs)["field-names"].value;
+      if (selectValue.value.length <= 0)
+        return state.search.checkedReverse = false;
+      state.search.checkedReverse = !state.search.checkedReverse;
+      if (state.search.checkedReverse) {
+        state.search.indeterminate = false;
+        state.search.checkedAll = false;
+      } else {
+        state.search.indeterminate = !!selectValue.value.length && selectValue.value.length < (instance?.attrs.options).length;
+        state.search.checkedAll = selectValue.value.length === (instance?.attrs.options).length;
+      }
+      selectValue.value = (instance?.attrs.options).filter(
+        (v) => !selectValue.value.some((ele) => ele === v[key])
+      ).map((x) => x[key]);
+      emit("update:modelValue", selectValue.value);
+      emit("onSelectAll", {
+        type: "reverse",
+        value: selectValue.value
+      });
+    };
+    const onChange = (value, option) => {
+      state.search.checkedReverse = false;
+      state.search.indeterminate = !!value.length && value.length < (instance?.attrs.options).length;
+      state.search.checkedAll = value.length === (instance?.attrs.options).length;
+      emit("update:modelValue", value);
+      emit("onChange", {
+        value,
+        option
+      });
+    };
+    const VNodes = (_, { attrs }) => {
+      return vue.h(attrs.vnodes);
+    };
+    return (_ctx, _cache) => {
+      const _component_a_checkbox = vue.resolveComponent("a-checkbox");
+      const _component_a_form_item_rest = vue.resolveComponent("a-form-item-rest");
+      return vue.openBlock(), vue.createBlock(vue.unref(ASelect__default["default"]), vue.mergeProps({
+        value: vue.unref(selectValue),
+        "onUpdate:value": _cache[4] || (_cache[4] = ($event) => vue.isRef(selectValue) ? selectValue.value = $event : selectValue = $event),
+        class: "bm-select search"
+      }, _ctx.$attrs, {
+        mode: "multiple",
+        disabled: props.disabled,
+        placeholder: vue.unref(instance)?.attrs.placeholder ? vue.unref(instance)?.attrs.placeholder : "\u8BF7\u9009\u62E9",
+        "get-popup-container": (nodes) => nodes.parentNode,
+        onChange
+      }), {
+        dropdownRender: vue.withCtx(({ menuNode: menu }) => [
+          vue.createElementVNode("div", _hoisted_1, [
+            vue.createVNode(_component_a_form_item_rest, null, {
+              default: vue.withCtx(() => [
+                vue.createElementVNode("div", _hoisted_2, [
+                  vue.createElementVNode("div", {
+                    onClick: vue.withModifiers(selectAll, ["prevent"]),
+                    onMousedown: _cache[1] || (_cache[1] = (e) => e.preventDefault())
+                  }, [
+                    vue.createVNode(_component_a_checkbox, {
+                      checked: state.search.checkedAll,
+                      "onUpdate:checked": _cache[0] || (_cache[0] = ($event) => state.search.checkedAll = $event),
+                      indeterminate: state.search.indeterminate
+                    }, null, 8, ["checked", "indeterminate"]),
+                    _hoisted_4
+                  ], 40, _hoisted_3),
+                  vue.createElementVNode("div", {
+                    onClick: vue.withModifiers(reverseAll, ["prevent"]),
+                    onMousedown: _cache[3] || (_cache[3] = (e) => e.preventDefault())
+                  }, [
+                    vue.createVNode(_component_a_checkbox, {
+                      checked: state.search.checkedReverse,
+                      "onUpdate:checked": _cache[2] || (_cache[2] = ($event) => state.search.checkedReverse = $event)
+                    }, null, 8, ["checked"]),
+                    _hoisted_6
+                  ], 40, _hoisted_5)
+                ])
+              ]),
+              _: 1
+            }),
+            vue.createElementVNode("div", null, [
+              vue.createTextVNode(" \u5DF2\u9009\u62E9 "),
+              vue.createElementVNode("span", _hoisted_7, vue.toDisplayString(vue.unref(selectValue)?.length || 0), 1),
+              vue.createTextVNode(" \u9879 ")
+            ])
+          ]),
+          vue.createVNode(VNodes, { vnodes: menu }, null, 8, ["vnodes"])
+        ]),
+        _: 1
+      }, 16, ["value", "disabled", "placeholder", "get-popup-container"]);
+    };
+  }
+});
+var SelectAll = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__file", "form-select-all.vue"]]);
+
+const __default__ = {
+  name: "BmSearchFilter"
+};
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  ...__default__,
+  props: searchFilterProps,
+  emits: ["update:value", "submit", "reset", "expand"],
+  setup(__props, { expose, emit: emits }) {
+    const props = __props;
+    FormCreateCtr__default["default"].component("SearchResetBtn", SearchResetBtn);
+    FormCreateCtr__default["default"].component("SelectAll", SelectAll);
+    FormCreateCtr__default["default"].maker.create("SelectAll", "field", "\u5168\u9009\u53CD\u9009\u7EC4\u4EF6").value([]);
+    const isExpand = vue.ref(false);
+    const searchResetBtnRule = vue.reactive([
+      {
+        type: "SearchResetBtn",
+        props: {
+          showExpandBtn: props.showExpandBtn,
+          showSearchIcon: props.showSearchIcon,
+          expandText: props.expandText,
+          collapseText: props.collapseText,
+          gutter: props.gutter,
+          loading: props.loading
+        },
+        on: {
+          submit() {
+            emits("submit", fApi.value.formData());
+          },
+          reset() {
+            fApi.value?.resetFields?.();
+            console.log(1112);
+            emits("reset");
+          },
+          expand(value) {
+            isExpand.value = value;
+            emits("expand", value);
+          }
+        }
+      }
+    ]);
+    const fApi = vue.ref({});
+    const option = vue.reactive({
+      col: {
+        span: 8
+      },
+      row: {
+        gutter: props.gutter
+      },
+      form: {
+        labelCol: props.labelCol,
+        labelAlign: "right",
+        wrapperCol: {
+          span: 24
+        }
+      },
+      submitBtn: false
+    });
+    const rule = vue.computed(() => {
+      if (!props.userRule)
+        return [];
+      return [...props.userRule, ...searchResetBtnRule];
+    });
+    function handleShowExpandBtn(val) {
+      searchResetBtnRule[0].props.showExpandBtn = val;
+    }
+    function handleChange() {
+      emits("update:value", fApi.value.formData());
+    }
+    function handleResize() {
+      const bodyClientWidth = document.body.clientWidth;
+      if (bodyClientWidth < 1680) {
+        option.col.span = 8;
+      } else {
+        option.col.span = 6;
+      }
+      props.userRule.forEach((rule2) => {
+        if (!rule2.field || rule2.col)
+          return;
+        const spanNum = props.ruleSpan[rule2.field];
+        if (spanNum) {
+          (rule2.col = rule2.col || {}).span = option.col.span * spanNum;
+        }
+      });
+    }
+    handleResize();
+    window.addEventListener("resize", handleResize);
+    vue.onBeforeUnmount(() => {
+      window.removeEventListener("resize", handleResize);
+    });
+    vue.watch(
+      () => props.showExpandBtn,
+      (val) => {
+        handleShowExpandBtn(val);
+      },
+      {
+        immediate: true
+      }
+    );
+    const expandRule = vue.computed(() => {
+      const fixedCount = props.fixedCount && props.fixedCount >= 0 ? props.fixedCount : 0;
+      const fixedFields = props.fixedFields?.length ? props.fixedFields : [];
+      return (props.userRule || []).filter((ruleItem, index) => {
+        return index + 1 > fixedCount && !fixedFields.includes(ruleItem.field || ruleItem.name);
+      });
+    });
+    function handleChangeExpand(value) {
+      if (value) {
+        expandRule.value.forEach((ruleItem) => {
+          ruleItem.hidden = false;
+        });
+      } else {
+        expandRule.value.forEach((ruleItem) => {
+          ruleItem.hidden = true;
+        });
+      }
+    }
+    vue.watch(
+      isExpand,
+      (val) => {
+        vue.nextTick(() => handleChangeExpand(val));
+      },
+      {
+        immediate: true
+      }
+    );
+    expose({
+      fApi
+    });
+    return (_ctx, _cache) => {
+      const _component_form_create = vue.resolveComponent("form-create");
+      return vue.openBlock(), vue.createElementBlock("div", {
+        class: vue.normalizeClass(["bm-search-filter", ["bm-search-filter-expand-" + props.expandPlacement]])
+      }, [
+        vue.createVNode(_component_form_create, {
+          api: fApi.value,
+          "onUpdate:api": _cache[0] || (_cache[0] = ($event) => fApi.value = $event),
+          "model-value": props.value,
+          rule: vue.unref(rule),
+          option,
+          onChange: handleChange
+        }, null, 8, ["api", "model-value", "rule", "option"])
+      ], 2);
+    };
+  }
+});
+var SearchFilter = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "search-filter.vue"]]);
+
+const BmSearchFilter = withInstall.withInstall(SearchFilter);
+
+exports.BmSearchFilter = BmSearchFilter;
+exports["default"] = BmSearchFilter;

package/lib/components/select-all/index.js

@@ -0,0 +1,181 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var withInstall = require('bm-admin-ui/lib/utils/with-install');
+var vue = require('vue');
+var ASelect = require('ant-design-vue/lib/select');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var ASelect__default = /*#__PURE__*/_interopDefaultLegacy(ASelect);
+
+var _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+
+const _hoisted_1 = { class: "bm-select-header" };
+const _hoisted_2 = { class: "bm-select-header-btn" };
+const _hoisted_3 = ["onClick"];
+const _hoisted_4 = /* @__PURE__ */ vue.createElementVNode("span", { class: "checkbox-label" }, "\u5168\u9009", -1);
+const _hoisted_5 = ["onClick"];
+const _hoisted_6 = /* @__PURE__ */ vue.createElementVNode("span", { class: "checkbox-label" }, "\u53CD\u9009", -1);
+const _hoisted_7 = { class: "blue" };
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "selectAll",
+  props: {
+    value: {
+      type: Array || String || Number || void 0,
+      required: true
+    },
+    showSelectAll: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ["onSelectAll", "update:value", "onChange"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const instance = vue.getCurrentInstance();
+    const state = vue.reactive({
+      search: {
+        indeterminate: false,
+        checkedAll: false,
+        checkedReverse: false
+      }
+    });
+    let selectValue = vue.ref([]);
+    vue.watch(
+      () => props.value,
+      (val) => {
+        selectValue.value = val;
+        if (!selectValue.value || selectValue.value.length <= 0) {
+          state.search = {
+            indeterminate: false,
+            checkedAll: false,
+            checkedReverse: false
+          };
+        }
+      },
+      {
+        immediate: true
+      }
+    );
+    const selectAll = (e) => {
+      let key = "value";
+      if (instance?.attrs.fieldNames || instance?.attrs["field-names"])
+        key = (instance?.attrs).fieldNames?.value || (instance?.attrs)["field-names"].value;
+      state.search.checkedAll = !state.search.checkedAll;
+      state.search.indeterminate = false;
+      state.search.checkedReverse = false;
+      if (state.search.checkedAll) {
+        selectValue.value = (instance?.attrs.options).map(
+          (v) => {
+            return v[key];
+          }
+        );
+      } else {
+        selectValue.value = [];
+      }
+      emit("update:value", selectValue.value);
+      emit("onSelectAll", {
+        type: "all",
+        value: selectValue.value
+      });
+    };
+    const reverseAll = (e) => {
+      let key = "value";
+      if (instance?.attrs.fieldNames || instance?.attrs["field-names"])
+        key = (instance?.attrs).fieldNames?.value || (instance?.attrs)["field-names"].value;
+      if (selectValue.value.length <= 0)
+        return state.search.checkedReverse = false;
+      state.search.checkedReverse = !state.search.checkedReverse;
+      if (state.search.checkedReverse) {
+        state.search.indeterminate = false;
+        state.search.checkedAll = false;
+      } else {
+        state.search.indeterminate = !!selectValue.value.length && selectValue.value.length < (instance?.attrs.options).length;
+        state.search.checkedAll = selectValue.value.length === (instance?.attrs.options).length;
+      }
+      selectValue.value = (instance?.attrs.options).filter(
+        (v) => !selectValue.value.some((ele) => ele === v[key])
+      ).map((x) => x[key]);
+      emit("update:value", selectValue.value);
+      emit("onSelectAll", {
+        type: "reverse",
+        value: selectValue.value
+      });
+    };
+    const onChange = (value, option) => {
+      state.search.checkedReverse = false;
+      state.search.indeterminate = !!value.length && value.length < (instance?.attrs.options).length;
+      state.search.checkedAll = value.length === (instance?.attrs.options).length;
+      emit("update:value", value);
+      emit("onChange", {
+        value,
+        option
+      });
+    };
+    const VNodes = (_, { attrs }) => {
+      return vue.h(attrs.vnodes);
+    };
+    return (_ctx, _cache) => {
+      const _component_a_checkbox = vue.resolveComponent("a-checkbox");
+      return vue.openBlock(), vue.createBlock(vue.unref(ASelect__default["default"]), vue.mergeProps({
+        value: vue.unref(selectValue),
+        "onUpdate:value": _cache[4] || (_cache[4] = ($event) => vue.isRef(selectValue) ? selectValue.value = $event : selectValue = $event),
+        class: "bm-select"
+      }, _ctx.$attrs, {
+        mode: "multiple",
+        placeholder: vue.unref(instance)?.attrs.placeholder ? vue.unref(instance)?.attrs.placeholder : "\u8BF7\u9009\u62E9",
+        "get-popup-container": (nodes) => nodes.parentNode,
+        onChange
+      }), {
+        dropdownRender: vue.withCtx(({ menuNode: menu }) => [
+          vue.createElementVNode("div", _hoisted_1, [
+            vue.createElementVNode("div", _hoisted_2, [
+              vue.createElementVNode("div", {
+                onClick: vue.withModifiers(selectAll, ["prevent"]),
+                onMousedown: _cache[1] || (_cache[1] = (e) => e.preventDefault())
+              }, [
+                vue.createVNode(_component_a_checkbox, {
+                  checked: state.search.checkedAll,
+                  "onUpdate:checked": _cache[0] || (_cache[0] = ($event) => state.search.checkedAll = $event),
+                  indeterminate: state.search.indeterminate
+                }, null, 8, ["checked", "indeterminate"]),
+                _hoisted_4
+              ], 40, _hoisted_3),
+              vue.createElementVNode("div", {
+                onClick: vue.withModifiers(reverseAll, ["prevent"]),
+                onMousedown: _cache[3] || (_cache[3] = (e) => e.preventDefault())
+              }, [
+                vue.createVNode(_component_a_checkbox, {
+                  checked: state.search.checkedReverse,
+                  "onUpdate:checked": _cache[2] || (_cache[2] = ($event) => state.search.checkedReverse = $event)
+                }, null, 8, ["checked"]),
+                _hoisted_6
+              ], 40, _hoisted_5)
+            ]),
+            vue.createElementVNode("div", null, [
+              vue.createTextVNode(" \u5DF2\u9009\u62E9 "),
+              vue.createElementVNode("span", _hoisted_7, vue.toDisplayString(vue.unref(selectValue)?.length || 0), 1),
+              vue.createTextVNode(" \u9879 ")
+            ])
+          ]),
+          vue.createVNode(VNodes, { vnodes: menu }, null, 8, ["vnodes"])
+        ]),
+        _: 1
+      }, 16, ["value", "placeholder", "get-popup-container"]);
+    };
+  }
+});
+var selectAll = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "selectAll.vue"]]);
+
+const BmSelectAll = withInstall.withInstall(selectAll);
+
+exports.BmSelectAll = BmSelectAll;
+exports["default"] = BmSelectAll;