@fangzhongya/fang-ui 0.0.37 → 0.0.39

package/dist/components/page/src/index2.cjs

@@ -1,4 +1,764 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const index_vue_vue_type_script_setup_true_lang = require("./index.cjs");
-exports.default = index_vue_vue_type_script_setup_true_lang.default;
+const vue = require("vue");
+const index = require("../../../hooks/cssname/index.cjs");
+const index$4 = require("../../forms/index.cjs");
+const index$7 = require("../../tablesp/index.cjs");
+const index$5 = require("../../lists/index.cjs");
+const index$3 = require("../../dialogs/index.cjs");
+const index$6 = require("element-plus/es/components/button/index");
+const index$2 = require("element-plus/es/components/message/index");
+const index$1 = require("element-plus/es/components/message-box/index");
+const setColumn = require("./set-column.cjs");
+const urls = require("../../common/urls.cjs");
+const _sfc_main = /* @__PURE__ */ vue.defineComponent({
+  __name: "index",
+  props: {
+    config: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    value: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    list: {
+      type: Array,
+      default() {
+        return [];
+      }
+    },
+    /**
+     * @props { Object } options 选择数据集合
+     */
+    options: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    /**
+     * @props { Object } compons 外部组件集合
+     */
+    compons: {
+      type: Object,
+      default() {
+        return {};
+      }
+    }
+  },
+  emits: ["delete", "add", "edit"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const cs = index.useCssName("page");
+    const slots = vue.useSlots();
+    const tableRef = vue.ref();
+    let listObj = {};
+    const getListObj = () => {
+      const value = {};
+      const filtration = (arr, listobj) => {
+        arr.forEach((obj) => {
+          if (listobj) {
+            obj.father = obj.father ?? listobj;
+          }
+          if (obj.prop) {
+            value[obj.prop] = obj;
+          }
+          if (obj.children) {
+            filtration(obj.children, obj);
+          }
+        });
+      };
+      filtration(props.list);
+      return value;
+    };
+    const getColumnList = (array, callback) => {
+      const filtration = (value2, arr) => {
+        arr.forEach((item) => {
+          let obj = {};
+          if (typeof item === "string") {
+            const v = listObj[item] || {
+              prop: item,
+              label: item
+            };
+            obj = { ...v };
+          } else {
+            obj = { ...item };
+          }
+          const is = callback ? callback(obj) : true;
+          if (is) {
+            if (obj.children) {
+              const children = [];
+              filtration(children, obj.children);
+              obj.children = children;
+            }
+            if (obj.prop) {
+              obj = Object.assign({}, listObj[obj.prop] || {}, obj);
+            }
+            value2.push(obj);
+          }
+        });
+      };
+      const value = [];
+      filtration(value, array);
+      return value;
+    };
+    const query = vue.ref(props.value);
+    const isSenior = vue.ref(false);
+    const getListQuery = () => {
+      const v = props.config.query?.list;
+      if (v && Array.isArray(v) && v.length > 0) {
+        return getColumnList(v);
+      } else {
+        return getColumnList(props.list, (obj) => {
+          obj.required = false;
+          obj.whole = false;
+          return Boolean(obj.query);
+        });
+      }
+    };
+    const listQuery = vue.ref([]);
+    const setListQuery = () => {
+      const list2 = getListQuery();
+      if (props.config.query?.senior) {
+        let i = 0;
+        list2.forEach((obj) => {
+          if (obj.querybasis) {
+            i++;
+          } else {
+            obj.hide = () => {
+              return !isSenior.value;
+            };
+          }
+        });
+        if (i == 0) {
+          list2[0].hide = void 0;
+        }
+      }
+      listQuery.value = list2;
+    };
+    const onRefresh = () => {
+      tableRef.value?.getList();
+    };
+    const onQuery = (data) => {
+      console.log("onQuery", data);
+      query.value = data;
+      onRefresh();
+    };
+    const onReset = (data) => {
+      console.log("onReset", data);
+      if (props.config.query?.reset) {
+        query.value = data;
+        onRefresh();
+      }
+    };
+    const onSenior = (obj) => {
+      isSenior.value = !isSenior.value;
+      if (isSenior.value) {
+        obj.label = "收起";
+      } else {
+        obj.label = "高级";
+      }
+      setListQuery();
+    };
+    const butQuery = vue.ref([]);
+    const getButQuery = () => {
+      const arr = [
+        {
+          _id: "1",
+          label: "查询",
+          type: "primary"
+        },
+        {
+          _id: "2",
+          label: "重置",
+          type: "default"
+        }
+      ];
+      if (props.config.query?.senior) {
+        const obj = {
+          _id: "3",
+          label: "高级",
+          type: "primary",
+          click: onSenior
+        };
+        arr.push(obj);
+      }
+      return arr;
+    };
+    const tableConfig = vue.ref({});
+    const getTableConfig = () => {
+      const config = props.config.table || {};
+      config.config = {
+        height: "100%",
+        adaptive: true,
+        isserial: true,
+        ischecked: true,
+        ...config.config
+      };
+      return config;
+    };
+    const getList = () => {
+      return getColumnList(props.list, (obj) => {
+        if (obj.componform === true) {
+          obj.compon = void 0;
+        }
+        return true;
+      });
+    };
+    const setList = vue.ref([]);
+    const setSetList = () => {
+      setList.value = getList();
+    };
+    const tableList = vue.computed(() => {
+      const arr = [];
+      if (props.config.table?.operation !== false) {
+        arr.push({
+          prop: "operation",
+          label: "操作",
+          width: 156,
+          fixed: true
+        });
+      }
+      arr.push(...setList.value);
+      return arr;
+    });
+    let operationColumn = [];
+    const getOperationColumn = () => {
+      const array = [];
+      if (props.config.edit?.is !== false) {
+        array.push({
+          prop: 2,
+          label: "编辑",
+          type: "primary",
+          text: true
+        });
+      }
+      if (props.config.delete?.is !== false) {
+        array.push({
+          prop: 4,
+          label: "删除",
+          type: "danger",
+          text: true
+        });
+      }
+      if (props.config.details?.is !== false) {
+        array.push({
+          prop: 9,
+          label: "详情",
+          type: "info",
+          text: true
+        });
+      }
+      return array;
+    };
+    let operationTop = [];
+    const getOperationTop = () => {
+      const array = [];
+      if (props.config.add?.is !== false) {
+        array.push({
+          prop: 1,
+          label: "添加",
+          type: "primary"
+        });
+      }
+      if (props.config.delete?.is !== false && tableConfig.value.config?.ischecked) {
+        array.push({
+          prop: 8,
+          label: "批量删除",
+          type: "danger"
+        });
+      }
+      return array;
+    };
+    const onDelete = (array) => {
+      const ts = ["是否删除所选" + props.config.name + "？"];
+      const label = props.config.delete?.label || "name";
+      const prop = props.config.delete?.prop || "id";
+      const name = listObj[label]?.label || "内容";
+      array.forEach((obj) => {
+        ts.push(name + "：" + (obj[label] ?? ""));
+      });
+      index$1.ElMessageBox.confirm(ts.join("<br>"), "提示", {
+        confirmButtonText: "确认",
+        cancelButtonText: "取消",
+        type: "warning",
+        dangerouslyUseHTMLString: true
+      }).then(() => {
+        const name2 = props.config.delete?.name || "ids";
+        const value = { [name2]: array.map((o) => o[prop]) };
+        console.log("onDelete", value);
+        const ajax = props.config.delete?.ajax;
+        if (ajax) {
+          const param = {
+            param: props.value
+          };
+          if (typeof ajax === "object") {
+            param.onRequestBefore = ajax?.onRequestBefore;
+            param.onRequestAfter = ajax?.onRequestAfter;
+            param.ajax = ajax?.url;
+            param.ajaxConfig = ajax?.config;
+          } else {
+            param.ajax = ajax;
+          }
+          urls.comHandle(param, value).then((res) => {
+            if (res.result) {
+              index$2.ElMessage.success(res.info || "删除成功");
+              onRefresh();
+            } else {
+              index$2.ElMessage.error(res.info || "删除失败");
+            }
+          }).catch((err) => {
+            console.error("删除失败", err);
+          });
+        } else {
+          emit("delete", value, () => {
+            onRefresh();
+          });
+        }
+      }).catch(() => {
+      });
+    };
+    const onOperation = (item, row = {}) => {
+      if (item.prop === 1) {
+        dialog.value = {
+          ...props.config.add?.value
+        };
+        dialog.type = "add";
+        dialog.visible = true;
+      } else if (item.prop === 2) {
+        dialog.value = { ...row };
+        dialog.type = "edit";
+        dialog.visible = true;
+      } else if (item.prop === 4) {
+        console.log("删除", row);
+        onDelete([row]);
+      } else if (item.prop === 8) {
+        console.log("批量删除", selection.value);
+        if (selection.value.length === 0) {
+          index$2.ElMessage.warning("请至少选择一条记录");
+          return;
+        }
+        onDelete(selection.value);
+      } else if (item.prop === 9) {
+        details.value = row;
+        details.visible = true;
+        const ajax = props.config.details?.ajax;
+        if (ajax) {
+          const param = {
+            param: props.value
+          };
+          if (typeof ajax === "object") {
+            param.onRequestBefore = ajax?.onRequestBefore;
+            param.onRequestAfter = ajax?.onRequestAfter;
+            param.ajax = ajax?.url;
+            param.ajaxConfig = ajax?.config;
+          } else {
+            param.ajax = ajax;
+          }
+          urls.comHandle(param, row).then((res) => {
+            if (res.result) {
+              details.value = res.data || row;
+              details.visible = true;
+            } else {
+              index$2.ElMessage.error(res.info || "查询详情失败");
+            }
+          }).catch((err) => {
+            console.error("查询详情失败", err);
+          });
+        } else {
+          details.value = row;
+          details.visible = true;
+        }
+      }
+    };
+    const selection = vue.ref([]);
+    const onRowClick = (row) => {
+      console.log("点击列表行", row);
+    };
+    const formRef = vue.ref();
+    const dataSlot = {
+      top: "top",
+      footer: "footer",
+      main: "main",
+      header: "header",
+      operation: "operation"
+    };
+    const formSlots = [];
+    const listSlots = [];
+    const tableSlots = [];
+    const querySlots = [];
+    const setSlots = () => {
+      const ds = Object.values(dataSlot);
+      Object.keys(slots || {}).forEach((key) => {
+        if (!ds.includes(key)) {
+          if (key.startsWith("query-")) {
+            querySlots.push(key.replace(/^query-/, ""));
+          } else if (key.startsWith("form-")) {
+            formSlots.push(key.replace(/^form-/, ""));
+          } else if (key.startsWith("list-")) {
+            listSlots.push(key.replace(/^list-/, ""));
+          } else if (key.startsWith("table-")) {
+            tableSlots.push(key.replace(/^table-/, ""));
+          } else {
+            querySlots.push(key);
+            formSlots.push(key);
+            listSlots.push(key);
+            tableSlots.push(key);
+          }
+        }
+      });
+    };
+    setSlots();
+    const dialog = vue.reactive({
+      visible: false,
+      type: "add",
+      // or 'edit'
+      value: {}
+    });
+    const onConfirm = () => {
+      if (formRef.value) {
+        formRef.value.validate().then((data) => {
+          if (dialog.type === "add") {
+            console.log("添加", data);
+            const ajax = props.config.add?.ajax;
+            if (ajax) {
+              const param = {
+                param: props.value
+              };
+              if (typeof ajax === "object") {
+                param.onRequestBefore = ajax?.onRequestBefore;
+                param.onRequestAfter = ajax?.onRequestAfter;
+                param.ajax = ajax?.url;
+                param.ajaxConfig = ajax?.config;
+              } else {
+                param.ajax = ajax;
+              }
+              urls.comHandle(param, data).then((res) => {
+                if (res.result) {
+                  index$2.ElMessage.success(
+                    res.info || "添加成功"
+                  );
+                  dialog.visible = false;
+                  onRefresh();
+                } else {
+                  index$2.ElMessage.error(res.info || "添加失败");
+                }
+              }).catch((err) => {
+                console.error("添加失败", err);
+              });
+            } else {
+              emit("add", data, () => {
+                dialog.visible = false;
+                onRefresh();
+              });
+            }
+          } else if (dialog.type === "edit") {
+            console.log("编辑", data);
+            const ajax = props.config.edit?.ajax;
+            if (ajax) {
+              const param = {
+                param: props.value
+              };
+              if (typeof ajax === "object") {
+                param.onRequestBefore = ajax?.onRequestBefore;
+                param.onRequestAfter = ajax?.onRequestAfter;
+                param.ajax = ajax?.url;
+                param.ajaxConfig = ajax?.config;
+              } else {
+                param.ajax = ajax;
+              }
+              urls.comHandle(param, data).then((res) => {
+                if (res.result) {
+                  index$2.ElMessage.success(
+                    res.info || "编辑成功"
+                  );
+                  dialog.visible = false;
+                  onRefresh();
+                } else {
+                  index$2.ElMessage.error(res.info || "编辑失败");
+                }
+              }).catch((err) => {
+                console.error("编辑失败", err);
+              });
+            } else {
+              emit("edit", data, () => {
+                dialog.visible = false;
+                onRefresh();
+              });
+            }
+          }
+        }).catch((err) => {
+          console.error("表单验证失败", err);
+        });
+      }
+    };
+    const getListForm = () => {
+      if (dialog.type === "edit") {
+        const v = props.config.edit?.list;
+        if (v && Array.isArray(v) && v.length > 0) {
+          return getColumnList(v);
+        } else {
+          return getColumnList(props.list, (obj) => {
+            return obj.form && obj.noedit !== false;
+          });
+        }
+      } else {
+        const v = props.config.add?.list;
+        if (v && Array.isArray(v) && v.length > 0) {
+          return getColumnList(v);
+        } else {
+          return getColumnList(props.list, (obj) => {
+            return Boolean(obj.form);
+          });
+        }
+      }
+    };
+    const listForm = vue.ref([]);
+    const setListForm = () => {
+      listForm.value = getListForm();
+    };
+    const details = vue.reactive({
+      visible: false,
+      value: {}
+    });
+    const getListDetails = () => {
+      const v = props.config.details?.list;
+      if (v && Array.isArray(v) && v.length > 0) {
+        return getColumnList(v);
+      } else {
+        return getList();
+      }
+    };
+    const list = vue.ref([]);
+    const setListDetails = () => {
+      list.value = getListDetails();
+    };
+    vue.watch(
+      () => props.config,
+      (newValue) => {
+        if (newValue) {
+          if (props.config.table) {
+            tableConfig.value = getTableConfig();
+          }
+          if (props.config.query?.is !== false) {
+            setListQuery();
+            butQuery.value = getButQuery();
+          }
+          if (props.config.details?.is !== false) {
+            setListDetails();
+          }
+          if (props.config.add?.is !== false || props.config.edit?.is !== false) {
+            setListForm();
+          }
+          operationColumn = getOperationColumn();
+          operationTop = getOperationTop();
+        }
+      },
+      {
+        immediate: true,
+        deep: true
+      }
+    );
+    vue.watch(
+      () => props.list,
+      () => {
+        listObj = getListObj();
+        setSetList();
+        if (props.config.query?.is !== false) {
+          setListQuery();
+        }
+        if (props.config.details?.is !== false) {
+          setListDetails();
+        }
+        if (props.config.add?.is !== false || props.config.edit?.is !== false) {
+          setListForm();
+        }
+      },
+      {
+        immediate: true,
+        deep: true
+      }
+    );
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", {
+        class: vue.normalizeClass(vue.unref(cs).z())
+      }, [
+        vue.createVNode(vue.unref(index$3.Dialogs), {
+          title: (dialog.type == "add" ? "添加" : "编辑") + props.config.name,
+          modelValue: dialog.visible,
+          "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => dialog.visible = $event),
+          onConfirm
+        }, {
+          default: vue.withCtx(() => [
+            dialog.visible ? (vue.openBlock(), vue.createBlock(vue.unref(index$4.Forms), vue.mergeProps({ key: 0 }, props.config.form, {
+              ref_key: "formRef",
+              ref: formRef,
+              modelValue: dialog.value,
+              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => dialog.value = $event),
+              options: props.options,
+              compons: props.compons,
+              list: listForm.value,
+              buts: []
+            }), vue.createSlots({ _: 2 }, [
+              vue.renderList(formSlots, (k) => {
+                return {
+                  name: k,
+                  fn: vue.withCtx((scope) => [
+                    vue.unref(slots)["form-" + k] ? vue.renderSlot(_ctx.$slots, "form-" + k, vue.normalizeProps(vue.mergeProps({ key: 0 }, scope))) : vue.renderSlot(_ctx.$slots, k, vue.normalizeProps(vue.mergeProps({ key: 1 }, scope)))
+                  ])
+                };
+              })
+            ]), 1040, ["modelValue", "options", "compons", "list"])) : vue.createCommentVNode("", true)
+          ]),
+          _: 3
+        }, 8, ["title", "modelValue"]),
+        vue.createVNode(vue.unref(index$3.Dialogs), {
+          title: props.config.name + "详情",
+          modelValue: details.visible,
+          "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => details.visible = $event),
+          "no-footer": ""
+        }, {
+          default: vue.withCtx(() => [
+            vue.createVNode(vue.unref(index$5.Lists), vue.mergeProps(props.config.details?.config, {
+              value: details.value,
+              options: props.options,
+              compons: props.compons,
+              list: list.value
+            }), vue.createSlots({ _: 2 }, [
+              vue.renderList(listSlots, (k) => {
+                return {
+                  name: k,
+                  fn: vue.withCtx((scope) => [
+                    vue.unref(slots)["list-" + k] ? vue.renderSlot(_ctx.$slots, "list-" + k, vue.normalizeProps(vue.mergeProps({ key: 0 }, scope))) : vue.renderSlot(_ctx.$slots, k, vue.normalizeProps(vue.mergeProps({ key: 1 }, scope)))
+                  ])
+                };
+              })
+            ]), 1040, ["value", "options", "compons", "list"])
+          ]),
+          _: 3
+        }, 8, ["title", "modelValue"]),
+        vue.createElementVNode("div", {
+          class: vue.normalizeClass(vue.unref(cs).z("header"))
+        }, [
+          vue.renderSlot(_ctx.$slots, dataSlot.header),
+          props.config.query?.is !== false ? (vue.openBlock(), vue.createElementBlock("div", {
+            key: 0,
+            class: vue.normalizeClass(vue.unref(cs).z("query"))
+          }, [
+            vue.createVNode(vue.unref(index$4.Forms), vue.mergeProps(props.config.query?.config, {
+              query: "",
+              "label-position": "auto",
+              "model-value": props.value,
+              options: props.options,
+              compons: props.compons,
+              list: listQuery.value,
+              buts: butQuery.value,
+              onSubmit: onQuery,
+              onCancel: onReset
+            }), vue.createSlots({ _: 2 }, [
+              vue.renderList(querySlots, (k) => {
+                return {
+                  name: k,
+                  fn: vue.withCtx((scope) => [
+                    vue.unref(slots)["query-" + k] ? vue.renderSlot(_ctx.$slots, "query-" + k, vue.normalizeProps(vue.mergeProps({ key: 0 }, scope))) : vue.renderSlot(_ctx.$slots, k, vue.normalizeProps(vue.mergeProps({ key: 1 }, scope)))
+                  ])
+                };
+              })
+            ]), 1040, ["model-value", "options", "compons", "list", "buts"])
+          ], 2)) : vue.createCommentVNode("", true)
+        ], 2),
+        vue.createElementVNode("div", {
+          class: vue.normalizeClass(vue.unref(cs).z("main"))
+        }, [
+          vue.renderSlot(_ctx.$slots, dataSlot.main),
+          vue.createElementVNode("div", {
+            class: vue.normalizeClass(vue.unref(cs).z("table"))
+          }, [
+            vue.createElementVNode("div", {
+              class: vue.normalizeClass(vue.unref(cs).z("table-top"))
+            }, [
+              vue.createElementVNode("div", {
+                class: vue.normalizeClass(vue.unref(cs).z("top-operation"))
+              }, [
+                (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(operationTop), (item, index2) => {
+                  return vue.openBlock(), vue.createBlock(vue.unref(index$6.ElButton), {
+                    key: index2,
+                    type: item.type,
+                    onClick: vue.withModifiers(($event) => onOperation(item), ["stop"])
+                  }, {
+                    default: vue.withCtx(() => [
+                      vue.createTextVNode(vue.toDisplayString(item.label), 1)
+                    ]),
+                    _: 2
+                  }, 1032, ["type", "onClick"]);
+                }), 128)),
+                vue.renderSlot(_ctx.$slots, dataSlot.top)
+              ], 2),
+              props.config.setColumn ? (vue.openBlock(), vue.createBlock(setColumn.default, {
+                key: 0,
+                modelValue: setList.value,
+                "onUpdate:modelValue": _cache[3] || (_cache[3] = ($event) => setList.value = $event),
+                list: props.list
+              }, null, 8, ["modelValue", "list"])) : vue.createCommentVNode("", true)
+            ], 2),
+            vue.createVNode(vue.unref(index$7.Tablesp), {
+              ref_key: "tableRef",
+              ref: tableRef,
+              load: props.config.query?.is === false,
+              config: tableConfig.value,
+              param: query.value,
+              options: props.options,
+              compons: props.compons,
+              list: tableList.value,
+              onSelection: _cache[4] || (_cache[4] = (array) => selection.value = array),
+              onChange: onRowClick
+            }, vue.createSlots({
+              operation: vue.withCtx(({ row }) => [
+                vue.createElementVNode("div", {
+                  class: vue.normalizeClass(vue.unref(cs).z("operations"))
+                }, [
+                  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(vue.unref(operationColumn), (item, index2) => {
+                    return vue.openBlock(), vue.createBlock(vue.unref(index$6.ElButton), {
+                      key: index2,
+                      type: item.type,
+                      text: item.text,
+                      onClick: vue.withModifiers(($event) => onOperation(item, row), ["stop"])
+                    }, {
+                      default: vue.withCtx(() => [
+                        vue.createTextVNode(vue.toDisplayString(item.label), 1)
+                      ]),
+                      _: 2
+                    }, 1032, ["type", "text", "onClick"]);
+                  }), 128)),
+                  vue.renderSlot(_ctx.$slots, dataSlot.operation, { row })
+                ], 2)
+              ]),
+              _: 2
+            }, [
+              vue.renderList(tableSlots, (k) => {
+                return {
+                  name: k,
+                  fn: vue.withCtx((scope) => [
+                    vue.unref(slots)["table-" + k] ? vue.renderSlot(_ctx.$slots, "table-" + k, vue.normalizeProps(vue.mergeProps({ key: 0 }, scope))) : vue.renderSlot(_ctx.$slots, k, vue.normalizeProps(vue.mergeProps({ key: 1 }, scope)))
+                  ])
+                };
+              })
+            ]), 1032, ["load", "config", "param", "options", "compons", "list"])
+          ], 2)
+        ], 2),
+        vue.createElementVNode("div", {
+          class: vue.normalizeClass(vue.unref(cs).z("footer"))
+        }, [
+          vue.renderSlot(_ctx.$slots, dataSlot.footer)
+        ], 2)
+      ], 2);
+    };
+  }
+});
+exports.default = _sfc_main;