bm-admin-ui 1.0.82-alpha → 1.0.83-alpha

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

@@ -0,0 +1,441 @@
+import { withInstall } from 'bm-admin-ui/es/utils/with-install';
+import { defineComponent, ref, computed, resolveComponent, openBlock, createElementBlock, normalizeStyle, unref, createTextVNode, toDisplayString, createBlock, createCommentVNode, createElementVNode, createVNode, withCtx, getCurrentInstance, reactive, watch, mergeProps, isRef, withModifiers, h, onBeforeUnmount, nextTick, normalizeClass } from 'vue';
+import FormCreateCtr from '@form-create/ant-design-vue';
+import { UpOutlined, DownOutlined, SearchOutlined } from '@ant-design/icons-vue';
+import ASelect from 'ant-design-vue/lib/select';
+
+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__ */ defineComponent({
+  __name: "search-reset-btn",
+  props: searchResetBtnProps,
+  emits: ["submit", "reset", "expand"],
+  setup(__props, { emit: emits }) {
+    const props = __props;
+    const isExpand = ref(false);
+    const wrapperStyle = 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 = resolveComponent("a-button");
+      return openBlock(), createElementBlock("div", {
+        class: "bm-search-filter-btn",
+        style: normalizeStyle(unref(wrapperStyle))
+      }, [
+        props.showExpandBtn ? (openBlock(), createElementBlock("span", {
+          key: 0,
+          class: "bm-search-filter-expand",
+          onClick: handleExpandBtnChange
+        }, [
+          createTextVNode(toDisplayString(isExpand.value ? props.collapseText : props.expandText), 1),
+          isExpand.value ? (openBlock(), createBlock(unref(UpOutlined), { key: 0 })) : (openBlock(), createBlock(unref(DownOutlined), { key: 1 }))
+        ])) : createCommentVNode("v-if", true),
+        createElementVNode("span", _hoisted_1$1, [
+          createVNode(_component_a_button, { onClick: handleReset }, {
+            default: withCtx(() => [
+              createTextVNode("\u91CD\u7F6E")
+            ]),
+            _: 1
+          }),
+          createVNode(_component_a_button, {
+            type: "primary",
+            loading: props.loading,
+            onClick: handleSubmit
+          }, {
+            default: withCtx(() => [
+              props.showSearchIcon && !props.loading ? (openBlock(), createBlock(unref(SearchOutlined), { key: 0 })) : createCommentVNode("v-if", true),
+              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__ */ createElementVNode("span", { class: "checkbox-label" }, "\u5168\u9009", -1);
+const _hoisted_5 = ["onClick"];
+const _hoisted_6 = /* @__PURE__ */ createElementVNode("span", { class: "checkbox-label" }, "\u53CD\u9009", -1);
+const _hoisted_7 = { class: "blue" };
+const _sfc_main$1 = /* @__PURE__ */ 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 = getCurrentInstance();
+    const state = reactive({
+      search: {
+        indeterminate: false,
+        checkedAll: false,
+        checkedReverse: false
+      }
+    });
+    let selectValue = ref([]);
+    watch(
+      () => props.modelValue,
+      (val) => {
+        selectValue.value = val;
+      },
+      {
+        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 h(attrs.vnodes);
+    };
+    return (_ctx, _cache) => {
+      const _component_a_checkbox = resolveComponent("a-checkbox");
+      const _component_a_form_item_rest = resolveComponent("a-form-item-rest");
+      return openBlock(), createBlock(unref(ASelect), mergeProps({
+        value: unref(selectValue),
+        "onUpdate:value": _cache[4] || (_cache[4] = ($event) => isRef(selectValue) ? selectValue.value = $event : selectValue = $event),
+        class: "bm-select search"
+      }, _ctx.$attrs, {
+        mode: "multiple",
+        disabled: props.disabled,
+        placeholder: unref(instance)?.attrs.placeholder ? unref(instance)?.attrs.placeholder : "\u8BF7\u9009\u62E9",
+        "get-popup-container": (nodes) => nodes.parentNode,
+        onChange
+      }), {
+        dropdownRender: withCtx(({ menuNode: menu }) => [
+          createElementVNode("div", _hoisted_1, [
+            createVNode(_component_a_form_item_rest, null, {
+              default: withCtx(() => [
+                createElementVNode("div", _hoisted_2, [
+                  createElementVNode("div", {
+                    onClick: withModifiers(selectAll, ["prevent"]),
+                    onMousedown: _cache[1] || (_cache[1] = (e) => e.preventDefault())
+                  }, [
+                    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),
+                  createElementVNode("div", {
+                    onClick: withModifiers(reverseAll, ["prevent"]),
+                    onMousedown: _cache[3] || (_cache[3] = (e) => e.preventDefault())
+                  }, [
+                    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
+            }),
+            createElementVNode("div", null, [
+              createTextVNode(" \u5DF2\u9009\u62E9 "),
+              createElementVNode("span", _hoisted_7, toDisplayString(unref(selectValue)?.length || 0), 1),
+              createTextVNode(" \u9879 ")
+            ])
+          ]),
+          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__ */ defineComponent({
+  ...__default__,
+  props: searchFilterProps,
+  emits: ["update:value", "submit", "reset", "expand"],
+  setup(__props, { expose, emit: emits }) {
+    const props = __props;
+    FormCreateCtr.component("SearchResetBtn", SearchResetBtn);
+    FormCreateCtr.component("SelectAll", SelectAll);
+    FormCreateCtr.maker.create("SelectAll", "field", "\u5168\u9009\u53CD\u9009\u7EC4\u4EF6").value([]);
+    const isExpand = ref(false);
+    const searchResetBtnRule = 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?.();
+            emits("reset");
+          },
+          expand(value) {
+            isExpand.value = value;
+            emits("expand", value);
+          }
+        }
+      }
+    ]);
+    const fApi = ref({});
+    const option = reactive({
+      col: {
+        span: 8
+      },
+      row: {
+        gutter: props.gutter
+      },
+      form: {
+        labelCol: props.labelCol,
+        labelAlign: "right",
+        wrapperCol: {
+          span: 24
+        }
+      },
+      submitBtn: false
+    });
+    const rule = 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);
+    onBeforeUnmount(() => {
+      window.removeEventListener("resize", handleResize);
+    });
+    watch(
+      () => props.showExpandBtn,
+      (val) => {
+        handleShowExpandBtn(val);
+      },
+      {
+        immediate: true
+      }
+    );
+    const expandRule = 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;
+        });
+      }
+    }
+    watch(
+      isExpand,
+      (val) => {
+        nextTick(() => handleChangeExpand(val));
+      },
+      {
+        immediate: true
+      }
+    );
+    expose({
+      fApi
+    });
+    return (_ctx, _cache) => {
+      const _component_form_create = resolveComponent("form-create");
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["bm-search-filter", ["bm-search-filter-expand-" + props.expandPlacement]])
+      }, [
+        createVNode(_component_form_create, {
+          api: fApi.value,
+          "onUpdate:api": _cache[0] || (_cache[0] = ($event) => fApi.value = $event),
+          "model-value": props.value,
+          rule: 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(SearchFilter);
+
+export { BmSearchFilter, BmSearchFilter as default };

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

@@ -0,0 +1,165 @@
+import { withInstall } from 'bm-admin-ui/es/utils/with-install';
+import { defineComponent, getCurrentInstance, reactive, ref, watch, resolveComponent, openBlock, createBlock, unref, mergeProps, isRef, withCtx, createElementVNode, withModifiers, createVNode, createTextVNode, toDisplayString, h } from 'vue';
+import ASelect from 'ant-design-vue/lib/select';
+
+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__ */ createElementVNode("span", { class: "checkbox-label" }, "\u5168\u9009", -1);
+const _hoisted_5 = ["onClick"];
+const _hoisted_6 = /* @__PURE__ */ createElementVNode("span", { class: "checkbox-label" }, "\u53CD\u9009", -1);
+const _hoisted_7 = { class: "blue" };
+const _sfc_main = /* @__PURE__ */ 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 = getCurrentInstance();
+    const state = reactive({
+      search: {
+        indeterminate: false,
+        checkedAll: false,
+        checkedReverse: false
+      }
+    });
+    let selectValue = ref([]);
+    watch(
+      () => props.value,
+      (val) => {
+        selectValue.value = val;
+      },
+      {
+        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 h(attrs.vnodes);
+    };
+    return (_ctx, _cache) => {
+      const _component_a_checkbox = resolveComponent("a-checkbox");
+      return openBlock(), createBlock(unref(ASelect), mergeProps({
+        value: unref(selectValue),
+        "onUpdate:value": _cache[4] || (_cache[4] = ($event) => isRef(selectValue) ? selectValue.value = $event : selectValue = $event),
+        class: "bm-select"
+      }, _ctx.$attrs, {
+        mode: "multiple",
+        placeholder: unref(instance)?.attrs.placeholder ? unref(instance)?.attrs.placeholder : "\u8BF7\u9009\u62E9",
+        "get-popup-container": (nodes) => nodes.parentNode,
+        onChange
+      }), {
+        dropdownRender: withCtx(({ menuNode: menu }) => [
+          createElementVNode("div", _hoisted_1, [
+            createElementVNode("div", _hoisted_2, [
+              createElementVNode("div", {
+                onClick: withModifiers(selectAll, ["prevent"]),
+                onMousedown: _cache[1] || (_cache[1] = (e) => e.preventDefault())
+              }, [
+                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),
+              createElementVNode("div", {
+                onClick: withModifiers(reverseAll, ["prevent"]),
+                onMousedown: _cache[3] || (_cache[3] = (e) => e.preventDefault())
+              }, [
+                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)
+            ]),
+            createElementVNode("div", null, [
+              createTextVNode(" \u5DF2\u9009\u62E9 "),
+              createElementVNode("span", _hoisted_7, toDisplayString(unref(selectValue)?.length || 0), 1),
+              createTextVNode(" \u9879 ")
+            ])
+          ]),
+          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(selectAll);
+
+export { BmSelectAll, BmSelectAll as default };