@ctzy-web-client/plugin-component-vue 1.0.7 → 1.0.9

package/es/data-table/data-table.mjs

@@ -1,369 +0,0 @@
-import { createElementVNode, defineComponent, useAttrs, ref, computed, unref, watch, provide, reactive, nextTick, onUnmounted, openBlock, createElementBlock, normalizeClass, renderSlot, createVNode, mergeProps, withCtx, createBlock, createCommentVNode, Fragment, renderList, createTextVNode, toDisplayString, normalizeStyle } from 'vue';
-import { ElMessage, ElTable, ElTableColumn, ElPagination } from 'element-plus';
-import { useService, useGlobalConfig, dataTableKey, useNamespace, useEventDispatcher } from 'web-base-client-vue';
-import DynamicComponent from './dynamic-component.mjs';
-import DataTableColumn from './data-table-column.mjs';
-import { useDataTableDrag } from './use-datatable-drag.mjs';
-import { get } from 'lodash';
-import { Subject, debounceTime, Observable, filter, map, delayWhen, from, skipWhile } from 'rxjs';
-import _export_sfc from '../_virtual/_plugin-vue_export-helper.mjs';
-
-const _hoisted_1 = /* @__PURE__ */ createElementVNode("i", { class: "ptp-icon ptp-buzhou-yidong" }, null, -1);
-const __default__ = defineComponent({ name: "BwaDataTable" });
-const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
-  props: {
-    dataTable: {
-      type: Object,
-      required: true
-    },
-    autoLoad: {
-      type: Boolean,
-      default: true
-    },
-    showIndex: {
-      type: Boolean,
-      default: false
-    },
-    indexColumnLabel: {
-      type: String,
-      default: "\u7F16\u53F7"
-    },
-    selection: {
-      type: Boolean,
-      default: false
-    },
-    paginationLayout: {
-      type: String,
-      default: "sizes, prev, pager, next, jumper"
-    },
-    paginationPageSizes: {
-      type: Array,
-      default: () => [10, 20, 50, 100, 200]
-    },
-    showPagination: {
-      type: Boolean,
-      default: true
-    },
-    whereParamName: {
-      type: String,
-      default: ""
-    },
-    showDrag: {
-      type: Boolean,
-      default: false
-    },
-    border: {
-      type: Boolean,
-      default: true
-    }
-  },
-  emits: ["drag"],
-  setup(__props, { emit }) {
-    var _a;
-    const props = __props;
-    const attrs = useAttrs();
-    const userService = useService("UserService");
-    const elTable = ref(null);
-    const dataTable = props.dataTable;
-    dataTable._userService = (_a = userService.value) == null ? void 0 : _a.getUserList;
-    const dataTableEl = ref(null);
-    const displayColumns = computed(
-      () => unref(dataTable).getDisplayColumns() || []
-    );
-    watch(
-      computed(() => props.whereParamName),
-      (whereParamName) => {
-        dataTable.setWhereParamName(whereParamName || "");
-      },
-      { immediate: true, flush: "sync" }
-    );
-    const searchParams = computed(() => props.searchParams);
-    const debounceDelay = useGlobalConfig("debounceDelay", 500);
-    provide(
-      dataTableKey,
-      reactive({
-        dataTable,
-        displayColumns
-      })
-    );
-    const ns = useNamespace("datatable");
-    const { barRectangle } = useDataTableDrag(
-      dataTableEl,
-      ".bwa-datatable__drag",
-      ".el-table__row",
-      { emit }
-    );
-    const processing = ref(false);
-    const data = computed(() => {
-      return props.dataTable.data;
-    });
-    useEventDispatcher(dataTable, "load-successfully", async (res) => {
-      if (res.code != 0) {
-        return;
-      }
-      const _userService = unref(userService);
-      if (!_userService) {
-        return;
-      }
-      let columns = dataTable.getColumns();
-      const componentNames = ["BwaUserSelect", "BwaUserMultiSelect"];
-      columns = columns.filter((column) => componentNames.includes(column.formComponent)).filter((column) => column.visible).filter((column) => column.isExtend);
-      if (!columns.length) {
-        return;
-      }
-      processing.value = true;
-      const data2 = res.data;
-      let ids = data2.reduce((result, item) => {
-        return result.concat(
-          columns.reduce((result2, column) => {
-            let value = get(item, column.fullAttrName);
-            value = Array.isArray(value) ? value : value ? [value] : [];
-            return result2.concat(value);
-          }, [])
-        );
-      }, []).map((id) => id + "");
-      ids = [...new Set(ids)];
-      try {
-        const userListResult = await _userService.getUserListByIds(ids);
-        if (userListResult.code != 0) {
-          return;
-        }
-        for (const column of columns) {
-          column.componentProps = column.componentProps || {};
-          column.componentProps.options = (userListResult.data || []).map(
-            (item) => ({
-              label: item.label,
-              value: item.value
-            })
-          );
-        }
-        console.log(userListResult);
-      } finally {
-        processing.value = false;
-      }
-    });
-    const sortHandle = (column, prop, order) => {
-      let sortColumn2 = "";
-      let sortType = "";
-      if (column.order) {
-        sortColumn2 = column.prop;
-        sortType = column.order == "descending" ? 0 : 1;
-        dataTable.setParam("sortColumn", sortColumn2);
-        dataTable.setParam("sortType", sortType);
-      } else {
-        dataTable.setParam("sortColumn", sortColumn2);
-        dataTable.setParam("sortType", sortType);
-      }
-      dataTable.load();
-    };
-    useEventDispatcher(dataTable, "load-successfully", (res) => {
-      if (!elTable.value) {
-        return;
-      }
-      unref(elTable).store.updateSelectionByRowKey();
-      if (res.code != 0) {
-        ElMessage.error(res.msg);
-      }
-    });
-    function sortColumn(array) {
-      array.forEach((item) => {
-        var _a2, _b;
-        item.no = (_a2 = item.getColumnIndex) == null ? void 0 : _a2.call(item);
-        if ((_b = item.children) == null ? void 0 : _b.length) {
-          sortColumn(item.children);
-        }
-      });
-      array.sort((cur, pre) => cur.no - pre.no);
-    }
-    const tableSelectSubject = new Subject();
-    const selectionChange = tableSelectSubject.next.bind(tableSelectSubject);
-    const totalPage = computed(() => dataTable.getTotalPage());
-    const tableSelectSubscription = tableSelectSubject.pipe(debounceTime(debounceDelay)).subscribe(unref(dataTable).setSelection.bind(unref(dataTable)));
-    const selectChangeAPIObservable = new Observable(
-      (observer) => useEventDispatcher(
-        props.dataTable,
-        "select-change",
-        observer.next.bind(observer)
-      )
-    ).pipe(
-      filter((selection) => {
-        if (!unref(elTable)) {
-          return false;
-        }
-        const selectionRows = unref(elTable).getSelectionRows();
-        if (selectionRows.length !== selection.length) {
-          return true;
-        }
-        const primaryKey = dataTable.primaryKey;
-        return !selectionRows.every(
-          (item) => selection.find((itm) => item[primaryKey] === item[primaryKey])
-        );
-      })
-    ).subscribe((selection) => {
-      unref(elTable).clearSelection();
-      for (const item of selection) {
-        unref(elTable).toggleRowSelection(item, true);
-      }
-    });
-    if (props.autoLoad) {
-      dataTable.load();
-    }
-    const searchParamsSubscription = new Observable(
-      (observer) => useEventDispatcher(
-        props.dataTable.filterPanel,
-        "params-change",
-        observer.next.bind(observer)
-      )
-    ).pipe(
-      filter(() => props.dataTable.filterPanel.ready),
-      debounceTime(unref(debounceDelay))
-    ).subscribe(() => {
-      props.dataTable.load();
-    });
-    const subscription = props.dataTable.getDisplayColumnsSubject().pipe(
-      map(() => unref(elTable)),
-      delayWhen(() => from(nextTick())),
-      map((elTable2) => elTable2 == null ? void 0 : elTable2.store),
-      skipWhile((store) => !store)
-    ).subscribe((store) => {
-      sortColumn(unref(store.states._columns));
-      store.updateColumns();
-      store.scheduleLayout();
-    });
-    onUnmounted(() => {
-      selectChangeAPIObservable.unsubscribe();
-      subscription.unsubscribe();
-      tableSelectSubscription.unsubscribe();
-      searchParamsSubscription.unsubscribe();
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        class: normalizeClass(unref(ns).b()),
-        ref_key: "dataTableEl",
-        ref: dataTableEl
-      }, [
-        renderSlot(_ctx.$slots, "default", { dataTable: unref(dataTable) }, () => [
-          createVNode(unref(ElTable), mergeProps({
-            class: "content",
-            height: "100%",
-            ref_key: "elTable",
-            ref: elTable,
-            data: unref(data),
-            "row-key": unref(dataTable).primaryKey,
-            "show-header": "",
-            stripe: ""
-          }, unref(attrs), {
-            onSelectionChange: unref(selectionChange),
-            onSortChange: sortHandle,
-            border: __props.border
-          }), {
-            empty: withCtx(() => [
-              renderSlot(_ctx.$slots, "empty-table")
-            ]),
-            default: withCtx(() => [
-              __props.showDrag ? (openBlock(), createBlock(unref(ElTableColumn), {
-                key: 0,
-                width: "40px"
-              }, {
-                default: withCtx(() => [
-                  createElementVNode("div", {
-                    class: normalizeClass(unref(ns).e("drag"))
-                  }, [
-                    renderSlot(_ctx.$slots, "default", {}, () => [
-                      _hoisted_1
-                    ])
-                  ], 2)
-                ]),
-                _: 3
-              })) : createCommentVNode("v-if", true),
-              __props.selection ? renderSlot(_ctx.$slots, "selection", { key: 1 }, () => [
-                createVNode(unref(ElTableColumn), {
-                  type: "selection",
-                  align: "center",
-                  width: "56",
-                  "reserve-selection": true
-                })
-              ]) : createCommentVNode("v-if", true),
-              __props.showIndex ? renderSlot(_ctx.$slots, "index", { key: 2 }, () => [
-                createVNode(unref(ElTableColumn), {
-                  type: "index",
-                  width: "60",
-                  align: "center",
-                  label: __props.indexColumnLabel
-                }, null, 8, ["label"])
-              ]) : createCommentVNode("v-if", true),
-              renderSlot(_ctx.$slots, "table-columns", { dataTable: unref(dataTable) }, () => [
-                (openBlock(true), createElementBlock(Fragment, null, renderList(unref(displayColumns), (item) => {
-                  return openBlock(), createBlock(DataTableColumn, mergeProps({
-                    "column-key": item.attrName,
-                    key: item.attrName,
-                    label: item.title,
-                    prop: item.fullAttrName,
-                    "min-width": item.width,
-                    align: item.align
-                  }, item.componentProps, {
-                    sortable: item.sortable == "custom"
-                  }), {
-                    header: withCtx(() => [
-                      renderSlot(_ctx.$slots, `table-header-col-${item.attrName}`, {}, () => [
-                        createTextVNode(toDisplayString(item.title), 1)
-                      ])
-                    ]),
-                    default: withCtx(({ row, $index }) => [
-                      unref(data).length ? renderSlot(_ctx.$slots, "table-col-" + item.attrName, {
-                        key: 0,
-                        row,
-                        index: $index,
-                        column: item,
-                        dataTable: unref(dataTable)
-                      }, () => [
-                        createVNode(unref(DynamicComponent), {
-                          column: item,
-                          record: row
-                        }, null, 8, ["column", "record"])
-                      ]) : createCommentVNode("v-if", true)
-                    ]),
-                    _: 2
-                  }, 1040, ["column-key", "label", "prop", "min-width", "align", "sortable"]);
-                }), 128))
-              ]),
-              renderSlot(_ctx.$slots, "column-append")
-            ]),
-            _: 3
-          }, 16, ["data", "row-key", "onSelectionChange", "border"])
-        ]),
-        __props.showPagination ? (openBlock(), createElementBlock("div", {
-          key: 0,
-          class: normalizeClass(unref(ns).e("pagination"))
-        }, [
-          createElementVNode("div", {
-            class: normalizeClass(unref(ns).e("pagination-info"))
-          }, " \u5171" + toDisplayString(unref(totalPage)) + "\u9875\uFF0C" + toDisplayString(unref(dataTable).totalRecCount) + "\u6761 ", 3),
-          createVNode(unref(ElPagination), {
-            currentPage: unref(dataTable).pageNum,
-            "page-sizes": __props.paginationPageSizes,
-            "page-size": unref(dataTable).pageSize,
-            layout: __props.paginationLayout,
-            total: unref(dataTable).totalRecCount,
-            onSizeChange: _cache[0] || (_cache[0] = ($event) => unref(dataTable).setPageSize($event)),
-            onCurrentChange: _cache[1] || (_cache[1] = ($event) => unref(dataTable).pageTo($event)),
-            teleported: false
-          }, null, 8, ["currentPage", "page-sizes", "page-size", "layout", "total"])
-        ], 2)) : createCommentVNode("v-if", true),
-        unref(barRectangle) ? (openBlock(), createElementBlock("div", {
-          key: 1,
-          class: normalizeClass(unref(ns).e("dragbar")),
-          style: normalizeStyle({
-            left: unref(barRectangle).left + "px",
-            top: unref(barRectangle).top + "px",
-            width: unref(barRectangle).width + "px",
-            height: unref(barRectangle).height + "px"
-          })
-        }, null, 6)) : createCommentVNode("v-if", true)
-      ], 2);
-    };
-  }
-});
-var DataTable = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "data-table.vue"]]);
-
-export { DataTable as default };

package/es/data-table/dynamic-component.mjs

@@ -1,48 +0,0 @@
-import { computed, h, unref } from 'vue';
-import get from 'lodash/get';
-import { useDynamicComponent } from '../utils.mjs';
-
-const formatValue = (column, value) => {
-  const options = column.componentProps.options || [];
-  const _value = Array.isArray(value) ? value : [value];
-  const labels = _value.map((v) => {
-    var _a;
-    return (_a = options.find((option) => option.value === v)) != null ? _a : null;
-  });
-  if (labels.includes(null)) {
-    return null;
-  }
-  return labels.map((item) => item.label).join(",");
-};
-var DynamicComponent = {
-  props: {
-    column: Object,
-    record: Object
-  },
-  emits: ["on-change"],
-  setup(props, context) {
-    const {
-      component,
-      params
-    } = useDynamicComponent(props, context, "BwaDataColumnView", "fullAttrName");
-    const viewType = computed(() => props.column.formComponent === "BwaRichText" ? "html" : "");
-    return () => {
-      var _a;
-      let value = get(props.record, props.column.fullAttrName);
-      if (Array.isArray((_a = props.column.componentProps) == null ? void 0 : _a.options)) {
-        value = formatValue(props.column, value) || value;
-      }
-      return h(unref(component), {
-        ...unref(params),
-        value,
-        type: props.column.type,
-        align: props.column.align,
-        rule: props.column.rule,
-        template: props.column.template,
-        defaultValue: props.column.default || "-"
-      });
-    };
-  }
-};
-
-export { DynamicComponent as default };

package/es/data-table/index.mjs

@@ -1,13 +0,0 @@
-import { withInstall } from 'element-plus/es/utils/vue/install';
-import DataTable from './data-table.mjs';
-import DataTableColumn from './data-table-column.mjs';
-import DataColumnView from './data-column-view.mjs';
-
-const BwaDataTable = withInstall(DataTable, {
-  DataTableColumn,
-  DataColumnView
-});
-const BwaDataTableColumn = withInstall(DataTableColumn);
-const BwaDataColumnView = withInstall(DataColumnView);
-
-export { BwaDataColumnView, BwaDataTable, BwaDataTableColumn, BwaDataTable as default };

package/es/data-table/use-datatable-drag.mjs

@@ -1,110 +0,0 @@
-import { ref, onMounted, unref, onBeforeUnmount } from 'vue';
-import { fromEvent, filter, tap, map, switchMap, takeUntil } from 'rxjs';
-import { Rectangle } from '../math/Rectangle.mjs';
-
-const useDataTableDrag = (el, dragClass, itemClass, context) => {
-  let mousedownSubscription = null;
-  let barRectangle = ref(null);
-  onMounted(() => {
-    let mouseDownObservable = fromEvent(unref(el), "mousedown");
-    let mousemoveObservable = fromEvent(unref(document), "mousemove");
-    let mouseupObservable = fromEvent(unref(document), "mouseup");
-    let rectangles = [];
-    let cloneEl = null;
-    let offsetX = 0;
-    let offsetY = 0;
-    let targetIndex = -1;
-    mousedownSubscription = mouseDownObservable.pipe(filter((event) => {
-      const list = Array.from(unref(el).querySelectorAll(dragClass));
-      const item = list.find((item2) => item2.contains(event.target));
-      if (item) {
-        event.index = list.indexOf(item);
-        const row = Array.from(unref(el).querySelectorAll(itemClass)).find((row2) => row2.contains(item));
-        const _cloneEl = row.cloneNode(true);
-        const boundary = row.getBoundingClientRect();
-        cloneEl = document.createElement("div");
-        cloneEl.className = "bwa-datatable";
-        const tableEl = document.createElement("table");
-        tableEl.className = "el-table";
-        const tbodyEl = document.createElement("tbody");
-        cloneEl.append(tableEl);
-        tableEl.appendChild(tbodyEl);
-        tbodyEl.appendChild(_cloneEl);
-        offsetX = event.x - boundary.left;
-        offsetY = event.y - boundary.top;
-        console.log();
-        Object.assign(cloneEl.style, {
-          position: "absolute",
-          left: event.clientX - offsetX + "px",
-          top: event.clientY - offsetY + "px",
-          zIndex: "9999",
-          height: boundary.height + "px",
-          width: boundary.width + "px",
-          opacity: "0.6",
-          pointerEvents: "none"
-        });
-        document.body.appendChild(cloneEl);
-        document.body.style.cursor = "move";
-        document.body.style.userSelect = "none";
-      }
-      return !!item;
-    }), tap(() => {
-      rectangles = Array.from(unref(el).querySelectorAll(itemClass)).map((item) => {
-        const {
-          x,
-          y,
-          width,
-          height
-        } = item.getBoundingClientRect();
-        return new Rectangle(x, y, width, height);
-      });
-    }), map((event) => {
-      return {
-        index: event.index,
-        x: event.clientX,
-        y: event.clientY
-      };
-    }), switchMap(({
-      index,
-      x,
-      y
-    }) => {
-      return mousemoveObservable.pipe(takeUntil(mouseupObservable.pipe(tap(() => {
-        if (targetIndex !== -1) {
-          context.emit("drag", index, targetIndex);
-        }
-        cloneEl == null ? void 0 : cloneEl.remove();
-        rectangles = [];
-        offsetX = offsetY = 0;
-        document.body.style.cursor = "";
-        document.body.style.userSelect = "";
-        barRectangle.value = null;
-        targetIndex = -1;
-      }))), map((event) => {
-        Object.assign(cloneEl.style, {
-          left: event.clientX - offsetX + "px",
-          top: event.clientY - offsetY + "px"
-        });
-        const rectangle = rectangles.find((rectangle2) => rectangle2.pointIn(event.x, event.y));
-        if (!rectangle) {
-          targetIndex = -1;
-          barRectangle.value = null;
-          return;
-        }
-        targetIndex = rectangles.indexOf(rectangle);
-        const direction = event.clientY >= rectangle.cy ? "after" : "before";
-        targetIndex = targetIndex + (direction === "after" ? 1 : 0);
-        barRectangle.value = new Rectangle(rectangle.left, direction === "after" ? rectangle.bottom : rectangle.top, rectangle.width, 2);
-      }));
-    })).subscribe((info) => {
-    });
-  });
-  onBeforeUnmount(() => {
-    mousedownSubscription == null ? void 0 : mousedownSubscription.unsubscribe();
-  });
-  return {
-    barRectangle
-  };
-};
-
-export { useDataTableDrag };