@zhsz/cool-design-crud/lib/components/adv/index.js

"use strict";
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
const vue = require("vue");
const tdesignVueNext = require("tdesign-vue-next");
const crud = require("../../hooks/crud.js");
const core = require("../../hooks/core.js");
require("clone-deep");
require("array.prototype.flat");
require("merge");
require("@formily/core");
require("lodash-es");
require("../../hooks/table.js");
const index$1 = require("../form/index.js");
const tdesignIconsVueNext = require("tdesign-icons-vue-next");
const index = /* @__PURE__ */ vue.defineComponent({
  name: "cl-adv-search",
  components: {
    CloseIcon: tdesignIconsVueNext.CloseIcon,
    TdButton: tdesignVueNext.Button,
    Drawer: tdesignVueNext.Drawer,
    ClForm: index$1.default
  },
  props: {
    /** 表单值 */
    data: {
      type: Object
    },
    /** 表单协议 */
    schema: {
      type: Object
    },
    /** 协议表达式作用域 */
    scope: Object,
    /** 注册组件列表 */
    registerComponents: Object,
    /** 副作用逻辑，用于实现各种联动逻辑 */
    formEffects: Function,
    /** 表单配置项 */
    props: Object,
    /** 标题 */
    title: String,
    /** 窗体大小 */
    size: {
      type: [String],
      default: "30%"
    },
    /** 操作按钮 */
    op: {
      type: Array
    },
    /** 搜索钩子 */
    onSearch: Function,
    /** 搜索钩子 */
    onClear: Function,
    /** 搜索钩子 */
    onReset: Function
  },
  emits: ["reset", "clear"],
  setup(props, {
    emit,
    slots,
    expose
  }) {
    const {
      crud: crud$1,
      mitt
    } = core.useCore();
    const {
      style,
      browser
    } = core.useTools();
    const Form = crud.useForm();
    const config = vue.reactive(vue.mergeProps(props, vue.inject("useAdvSearch__options") || {}));
    const visible = vue.ref(false);
    function open() {
      visible.value = true;
      vue.nextTick(() => {
        var _a;
        (_a = Form.value) == null ? void 0 : _a.open({
          op: {
            hidden: true
          },
          props: config.props,
          schema: config.schema || {},
          registerComponents: config.registerComponents || {},
          scope: config.scope || {},
          effects: config.effects || void 0,
          form: props.data || config.data || {},
          isReset: false
        });
      });
    }
    function close() {
      visible.value = false;
    }
    function reset() {
      var _a;
      const form = (_a = Form.value) == null ? void 0 : _a.reset();
      if (config.onReset) {
        config.onReset(form);
      }
      emit("reset", form);
    }
    function clear() {
      var _a;
      const form = (_a = Form.value) == null ? void 0 : _a.clear();
      if (config.onClear) {
        config.onClear(form);
      }
      emit("clear", form);
    }
    function search() {
      var _a;
      (_a = Form.value) == null ? void 0 : _a.submit((data) => {
        async function next(params) {
          close();
          return await crud$1.refresh({
            page: 1,
            ...params
          });
        }
        if (config.onSearch) {
          config.onSearch(data, {
            next
          });
        } else {
          next(data);
        }
      });
    }
    mitt.on("crud.openAdvSearch", open);
    function renderForm() {
      return vue.createVNode(index$1.default, {
        "ref": Form,
        "formEffects": props.formEffects,
        "inner": true
      }, {
        ...slots
      });
    }
    function renderFooter() {
      var _a;
      const fns = {
        search,
        reset,
        clear,
        close
      };
      const icons = {
        search: vue.createVNode(tdesignIconsVueNext.SearchIcon, null, null),
        reset: vue.createVNode(tdesignIconsVueNext.RefreshIcon, null, null),
        clear: vue.createVNode(tdesignIconsVueNext.DeleteTimeIcon, null, null),
        close: vue.createVNode(tdesignIconsVueNext.CloseIcon, null, null)
      };
      return vue.h("div", {
        style: {
          display: "inline-flex",
          margin: "0 10px",
          gap: "10px"
        }
      }, (_a = config.op) == null ? void 0 : _a.map((e) => {
        switch (e) {
          case "search":
          case "reset":
          case "clear":
          case "close":
            return vue.h(vue.createVNode(tdesignVueNext.Button, {
              "theme": e === "search" ? "primary" : "default",
              "type": e === "search" ? "submit" : e === "reset" ? "reset" : "button",
              "variant": e === "search" ? "base" : "outline",
              "size": style.size,
              "onClick": fns[e]
            }, {
              default: () => crud$1.dict.label[e],
              icon: () => {
                return icons[e];
              }
            }));
          default:
            return e ?? "";
        }
      }));
    }
    expose({
      open,
      close,
      clear,
      reset,
      Form
    });
    return () => {
      return vue.createVNode(tdesignVueNext.Drawer, {
        "modal-class": "cl-adv-search",
        "visible": visible.value,
        "onUpdate:visible": ($event) => visible.value = $event,
        "placement": "right",
        "size": browser.isMini ? "100%" : config.size
      }, {
        header: () => vue.createVNode("div", {
          "class": "cl-adv-search__header"
        }, [vue.createVNode("span", {
          "class": "text"
        }, [config.title || crud$1.dict.label.advSearch]), vue.createVNode(tdesignIconsVueNext.CloseIcon, {
          "size": "20px",
          "onClick": close
        }, null)]),
        body: () => vue.createVNode("div", {
          "class": "cl-adv-search__container"
        }, [renderForm()]),
        footer: () => vue.createVNode("div", {
          "class": "cl-adv-search__footer"
        }, [renderFooter()])
      });
    };
  }
});
exports.default = index;