@ctzy-web-client/plugin-component-vue 1.0.0 → 1.0.2

package/es/data-form/form-components/bwa-upload.mjs

@@ -0,0 +1,159 @@
+import { defineComponent, watch, computed, useAttrs, unref, resolveComponent, openBlock, createBlock, mergeProps, withCtx, createVNode, createTextVNode, createElementVNode, normalizeClass, toDisplayString } from 'vue';
+import { Download, Delete } from '@element-plus/icons';
+import { ElMessage, ElUpload, ElButton, ElIcon } from 'element-plus';
+import { useNamespace, useService } from 'web-base-client-vue';
+import _export_sfc from '../../_virtual/_plugin-vue_export-helper.mjs';
+
+const __default__ = defineComponent({
+  name: "BwaUpload"
+});
+const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
+  props: {
+    modelValue: { type: Array, default: () => [] }
+  },
+  emits: ["update:modelValue"],
+  setup(__props, { emit }) {
+    const props = __props;
+    watch(
+      computed(() => props.modelValue),
+      (modelValue) => {
+        if (!Array.isArray(modelValue)) {
+          emit("update:modelValue", []);
+        }
+      },
+      { immediate: true }
+    );
+    const fileList = computed(
+      () => (Array.isArray(props.modelValue) ? props.modelValue : []).map((fileInfo) => {
+        return {
+          name: fileInfo.fileName,
+          response: fileInfo
+        };
+      })
+    );
+    const attrs = useAttrs();
+    const ns = useNamespace("upload");
+    const fileService = useService("FileService");
+    const handleHttpRequest = ({ file, onProgress, onSuccess, onError }) => {
+      if (!unref(fileService)) {
+        ElMessage.error("\u65E0\u6CD5\u4E0A\u4F20\u6587\u4EF6\u3002");
+        return;
+      }
+      unref(fileService).uploadFile(file, {
+        onUploadProgress: (event) => {
+          onProgress({ ...event, percent: event.progress });
+        }
+      }).then((res) => {
+        if (res.code != 0) {
+          onError(res.msg);
+          return;
+        }
+        onSuccess(res.data);
+      }, onError);
+    };
+    const handleSuccess = (fileInfo) => {
+      const value = Array.isArray(props.modelValue) ? props.modelValue : [];
+      emit("update:modelValue", value.concat(fileInfo));
+    };
+    const handleError = (error) => {
+      console.error(error);
+      ElMessage.error("\u6587\u4EF6\u4E0A\u4F20\u5931\u8D25\u3002");
+    };
+    const handleDelete = (file) => {
+      emit(
+        "update:modelValue",
+        props.modelValue.filter((fileInfo) => fileInfo !== file.response)
+      );
+    };
+    const handleDownload = async (file) => {
+      if (!unref(fileService)) {
+        ElMessage.error("\u65E0\u6CD5\u4E0B\u8F7D\u6587\u4EF6\u3002");
+        return;
+      }
+      try {
+        const downloadFileResult = await unref(fileService).downloadFile(
+          file.response
+        );
+        if (downloadFileResult.code != 0) {
+          ElMessage.error(downloadFileResult.msg);
+          return;
+        }
+      } catch (e) {
+        console.error(e);
+        ElMessage.error("\u4E0B\u8F7D\u6587\u4EF6\u5931\u8D25\u3002");
+      }
+    };
+    return (_ctx, _cache) => {
+      const _component_Plus = resolveComponent("Plus");
+      const _component_ElTooltip = resolveComponent("ElTooltip");
+      return openBlock(), createBlock(unref(ElUpload), mergeProps(unref(attrs), {
+        "file-list": unref(fileList),
+        "http-request": handleHttpRequest,
+        class: unref(ns).b(),
+        "on-success": handleSuccess,
+        "on-error": handleError
+      }), {
+        trigger: withCtx(() => [
+          createVNode(unref(ElButton), null, {
+            default: withCtx(() => [
+              createVNode(unref(ElIcon), null, {
+                default: withCtx(() => [
+                  createVNode(_component_Plus)
+                ]),
+                _: 1
+              }),
+              createTextVNode(" \u4E0A\u4F20\u6587\u4EF6 ")
+            ]),
+            _: 1
+          })
+        ]),
+        file: withCtx(({ file }) => [
+          createElementVNode("div", {
+            class: normalizeClass(unref(ns).b("item"))
+          }, [
+            createElementVNode("div", {
+              class: normalizeClass(unref(ns).be("item", "info"))
+            }, [
+              createVNode(_component_ElTooltip, {
+                content: file.name
+              }, {
+                default: withCtx(() => [
+                  createElementVNode("div", {
+                    class: normalizeClass(unref(ns).be("item", "file-name"))
+                  }, toDisplayString(file.name), 3)
+                ]),
+                _: 2
+              }, 1032, ["content"])
+            ], 2),
+            createElementVNode("div", {
+              class: normalizeClass(unref(ns).be("item", "tools"))
+            }, [
+              createVNode(unref(ElIcon), {
+                class: normalizeClass(unref(ns).be("item", "tools-item")),
+                onClick: ($event) => handleDownload(file)
+              }, {
+                default: withCtx(() => [
+                  createVNode(unref(Download))
+                ]),
+                _: 2
+              }, 1032, ["class", "onClick"]),
+              createVNode(unref(ElIcon), {
+                class: normalizeClass(unref(ns).be("item", "tools-item")),
+                onClick: ($event) => handleDelete(file)
+              }, {
+                default: withCtx(() => [
+                  createVNode(unref(Delete))
+                ]),
+                _: 2
+              }, 1032, ["class", "onClick"])
+            ], 2)
+          ], 2)
+        ]),
+        _: 1
+      }, 16, ["file-list", "class"]);
+    };
+  }
+});
+var Upload = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "bwa-upload.vue"]]);
+
+export { Upload as default };

package/es/data-form/form-components/bwa-user-multi-select.mjs

@@ -0,0 +1,30 @@
+import { defineComponent, computed, useAttrs, openBlock, createBlock, mergeProps, unref, isRef } from 'vue';
+import UserSelect from './bwa-user-select.mjs';
+import _export_sfc from '../../_virtual/_plugin-vue_export-helper.mjs';
+
+const __default__ = defineComponent({
+  name: "BwaUserMultiSelect"
+});
+const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
+  props: {
+    modelValue: null
+  },
+  emits: ["update:model-value"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const modelValue = computed({
+      get: () => props.modelValue,
+      set: (v) => emit("update:model-value", v)
+    });
+    const attrs = useAttrs();
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(UserSelect, mergeProps({
+        modelValue: unref(modelValue),
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(modelValue) ? modelValue.value = $event : null)
+      }, unref(attrs), { multiple: "" }), null, 16, ["modelValue"]);
+    };
+  }
+});
+var UserMultiSelect = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "bwa-user-multi-select.vue"]]);
+
+export { UserMultiSelect as default };

package/es/data-form/form-components/bwa-user-select.mjs

@@ -0,0 +1,69 @@
+import { defineComponent, useAttrs, ref, computed, unref, openBlock, createBlock, mergeProps, isRef } from 'vue';
+import { useService } from 'web-base-client-vue';
+import Select from './bwa-select.mjs';
+import { ElMessage } from 'element-plus';
+import _export_sfc from '../../_virtual/_plugin-vue_export-helper.mjs';
+
+const __default__ = defineComponent({
+  name: "BwaUserSelect",
+  inheritAttrs: false
+});
+const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
+  props: {
+    modelValue: null
+  },
+  emits: ["update:modelValue"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const attrs = useAttrs();
+    const userService = useService("UserService");
+    const loading = ref(false);
+    const modelValue = computed({
+      get: () => props.modelValue,
+      set: (v) => {
+        emit("update:modelValue", v);
+      }
+    });
+    const options = ref([]);
+    const loadOptions = async (query, userIds = []) => {
+      const _userService = unref(userService);
+      if (!_userService) {
+        return;
+      }
+      try {
+        loading.value = true;
+        const userListResult = await _userService.getUserList({
+          name: query,
+          userIds
+        });
+        if (userListResult.code != 0) {
+          ElMessage.error(userListResult.msg);
+          return;
+        }
+        options.value = userListResult.data;
+      } finally {
+        loading.value = false;
+      }
+    };
+    const handleRemote = loadOptions;
+    loadOptions(
+      "",
+      Array.isArray(unref(modelValue)) ? unref(modelValue) : unref(modelValue) ? [unref(modelValue)] : []
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(Select, mergeProps(unref(attrs), {
+        modelValue: unref(modelValue),
+        "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(modelValue) ? modelValue.value = $event : null),
+        loading: loading.value,
+        remote: "",
+        filterable: "",
+        clearable: "",
+        "remote-method": unref(handleRemote),
+        options: options.value
+      }), null, 16, ["modelValue", "loading", "remote-method", "options"]);
+    };
+  }
+});
+var UserSelect = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "bwa-user-select.vue"]]);
+
+export { UserSelect as default };

package/es/data-form/index.mjs

@@ -0,0 +1,34 @@
+import { withInstall } from 'element-plus/es/utils/vue/install';
+import DataForm from './data-form.mjs';
+import DataFormItem from './data-form-item.mjs';
+import DatePicker from './form-components/bwa-date-picker.mjs';
+import DateTimePicker from './form-components/bwa-date-time-picker.mjs';
+import InputInteger from './form-components/bwa-input-integer.mjs';
+import InputFloat from './form-components/bwa-input-float.mjs';
+import Input from './form-components/bwa-input.mjs';
+import Select from './form-components/bwa-select.mjs';
+import MultiSelect from './form-components/bwa-multi-select.mjs';
+import Textarea from './form-components/bwa-textarea.mjs';
+import UserSelect from './form-components/bwa-user-select.mjs';
+import UserMultiSelect from './form-components/bwa-user-multi-select.mjs';
+import Upload from './form-components/bwa-upload.mjs';
+import RichText from './form-components/bwa-rich-text.mjs';
+
+const BwaDataForm = withInstall(DataForm, {
+  DataFormItem,
+  DatePicker,
+  DateTimePicker,
+  InputInteger,
+  InputFloat,
+  Input,
+  Select,
+  MultiSelect,
+  Textarea,
+  UserSelect,
+  UserMultiSelect,
+  Upload,
+  RichText
+});
+const BwaDataFormItem = withInstall(DataFormItem);
+
+export { BwaDataForm, BwaDataFormItem, BwaDataForm as default };

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

@@ -0,0 +1,131 @@
+import { computed, resolveComponent, openBlock, createElementBlock, normalizeClass, createBlock, withCtx, createVNode, Fragment, createTextVNode, toDisplayString, createCommentVNode } from 'vue';
+import { useNamespace, str, func } from 'web-base-client-vue';
+import { PictureFilled } from '@element-plus/icons';
+import { ElMessage } from 'element-plus';
+import _export_sfc from '../_virtual/_plugin-vue_export-helper.mjs';
+
+const _sfc_main = {
+  name: "BwaDataColumnView",
+  props: {
+    value: [String, Boolean, Number, Object, Array],
+    type: {
+      type: String,
+      default: "string"
+    },
+    template: {
+      type: String,
+      default: ""
+    },
+    rule: {
+      type: String,
+      default: ""
+    },
+    align: {
+      type: String,
+      default: ""
+    },
+    nowrap: {
+      type: [Boolean, String],
+      default: true
+    },
+    copy: {
+      type: [Boolean, String],
+      default: false
+    },
+    defaultValue: {
+      type: String,
+      default: "-"
+    }
+  },
+  emits: ["update:modelValue"],
+  components: { PictureFilled },
+  setup(props) {
+    const ns = useNamespace("column-view");
+    const viewType = computed(() => props.type.toLocaleLowerCase());
+    const viewValue = computed(() => {
+      let value = props.value === 0 ? "0" : props.value ? props.value + "" : "";
+      let type = viewType.value;
+      if (["number", "string"].includes(type)) {
+        let isAppendChar = false;
+        if (type === "string" && props.rule && value) {
+          isAppendChar = value.length > props.rule.replace("s:", "") * 1;
+        }
+        value = props.rule ? str.formatByRule(value, props.rule) : value;
+        value = value || props.defaultValue;
+        if (isAppendChar) {
+          value += "...";
+        }
+      } else if (type === "date") {
+        value = value ? func.formatDate(new Date(value), props.rule || "yyyy-MM-dd") : props.defaultValue;
+      } else if (type === "html") {
+        value = value ? value.replace(/[\r\n|\r|\n]/g, "<br/>") : props.defaultValue;
+      }
+      if (props.template) {
+        value = props.template.replace("${value}", value);
+      }
+      return value;
+    });
+    const copyHandle = (text) => {
+      let input = document.createElement("input");
+      input.value = text;
+      document.body.appendChild(input);
+      input.select();
+      input.setSelectionRange(0, input.value.length), document.execCommand("Copy");
+      document.body.removeChild(input);
+      ElMessage.info("\u590D\u5236\u6210\u529F!");
+    };
+    return { ns, viewType, viewValue, copyHandle };
+  }
+};
+const _hoisted_1 = ["innerHTML"];
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_PictureFilled = resolveComponent("PictureFilled");
+  const _component_el_icon = resolveComponent("el-icon");
+  const _component_el_image = resolveComponent("el-image");
+  return openBlock(), createElementBlock("span", {
+    class: normalizeClass([$setup.ns.b(), { nowrap: $props.nowrap }, $props.align])
+  }, [
+    $setup.viewType == "html" ? (openBlock(), createElementBlock("span", {
+      key: 0,
+      innerHTML: $setup.viewValue
+    }, null, 8, _hoisted_1)) : $setup.viewType == "image" ? (openBlock(), createBlock(_component_el_image, {
+      key: 1,
+      class: "image",
+      style: { width: "100%", minHeight: "50px" },
+      "z-index": 999,
+      "preview-teleported": true,
+      "preview-src-list": [$setup.viewValue],
+      fit: "cover",
+      src: $setup.viewValue,
+      "hide-on-click-modal": true
+    }, {
+      placeholder: withCtx(() => [
+        createVNode(_component_el_icon, { size: 50 }, {
+          default: withCtx(() => [
+            createVNode(_component_PictureFilled)
+          ]),
+          _: 1
+        })
+      ]),
+      error: withCtx(() => [
+        createVNode(_component_el_icon, { size: 50 }, {
+          default: withCtx(() => [
+            createVNode(_component_PictureFilled)
+          ]),
+          _: 1
+        })
+      ]),
+      _: 1
+    }, 8, ["preview-src-list", "src"])) : (openBlock(), createElementBlock(Fragment, { key: 2 }, [
+      createTextVNode(toDisplayString($setup.viewValue), 1)
+    ], 64)),
+    $props.copy ? (openBlock(), createElementBlock("div", {
+      key: 3,
+      class: "copy-btn",
+      onClick: _cache[0] || (_cache[0] = ($event) => $setup.copyHandle($setup.viewValue))
+    }, "\u590D\u5236")) : createCommentVNode("v-if", true)
+  ], 2);
+}
+var DataColumnView = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "data-column-view.vue"]]);
+
+export { DataColumnView as default };

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

@@ -0,0 +1,118 @@
+import { inject, resolveComponent, resolveDirective, withDirectives, openBlock, createBlock, normalizeClass, createSlots, withCtx, createVNode, renderSlot, createElementBlock, Fragment, renderList, createElementVNode, createTextVNode, toDisplayString } from 'vue';
+import { dataTableKey, useNamespace } from 'web-base-client-vue';
+import DynamicComponent from './dynamic-component.mjs';
+import _export_sfc from '../_virtual/_plugin-vue_export-helper.mjs';
+
+const _sfc_main = {
+  name: "BwaDataTableCard",
+  components: { DynamicComponent },
+  setup() {
+    const dataTable = inject(dataTableKey);
+    const ns = useNamespace("datatable");
+    return { dataTable, ns };
+  }
+};
+const _hoisted_1 = { class: "left" };
+const _hoisted_2 = { class: "pagination-info" };
+const _hoisted_3 = { class: "right" };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_el_table_column = resolveComponent("el-table-column");
+  const _component_DynamicComponent = resolveComponent("DynamicComponent");
+  const _component_el_table = resolveComponent("el-table");
+  const _component_el_pagination = resolveComponent("el-pagination");
+  const _component_el_card = resolveComponent("el-card");
+  const _directive_loading = resolveDirective("loading");
+  return withDirectives((openBlock(), createBlock(_component_el_card, {
+    class: normalizeClass($setup.ns.b("card"))
+  }, createSlots({
+    default: withCtx(() => [
+      createVNode(_component_el_table, {
+        class: "content",
+        height: "100%",
+        ref: "elTable",
+        data: $setup.dataTable.data,
+        "row-key": $setup.dataTable.primaryKey,
+        "show-header": "",
+        stripe: ""
+      }, {
+        append: withCtx(() => [
+          renderSlot(_ctx.$slots, "table-append", { dataTable: $setup.dataTable })
+        ]),
+        default: withCtx(() => [
+          createVNode(_component_el_table_column, {
+            type: "index",
+            width: "60",
+            align: "center",
+            label: "\u7F16\u53F7"
+          }),
+          renderSlot(_ctx.$slots, "table-columns", { dataTable: $setup.dataTable }, () => [
+            (openBlock(true), createElementBlock(Fragment, null, renderList($setup.dataTable.getDisplayColumns(), (item) => {
+              return openBlock(), createBlock(_component_el_table_column, {
+                "column-key": item.attrName,
+                key: item.attrName,
+                label: item.title,
+                prop: item.attrName,
+                "min-width": item.width,
+                align: item.align
+              }, {
+                default: withCtx(({ row, $index }) => [
+                  renderSlot(_ctx.$slots, "table-col-" + item.attrName, {
+                    row,
+                    index: $index,
+                    column: item,
+                    dataTable: $setup.dataTable
+                  }, () => [
+                    createVNode(_component_DynamicComponent, {
+                      column: item,
+                      record: row
+                    }, null, 8, ["column", "record"])
+                  ])
+                ]),
+                _: 2
+              }, 1032, ["column-key", "label", "prop", "min-width", "align"]);
+            }), 128))
+          ])
+        ]),
+        _: 3
+      }, 8, ["data", "row-key"]),
+      createElementVNode("div", {
+        class: normalizeClass($setup.ns.be("card", "footer"))
+      }, [
+        createElementVNode("div", _hoisted_1, [
+          createElementVNode("div", _hoisted_2, [
+            createTextVNode(" \u5171"),
+            createElementVNode("b", null, toDisplayString($setup.dataTable.totalRecCount), 1),
+            createTextVNode("\u6761\u8BB0\u5F55 | \u5F53\u524D\u7B2C"),
+            createElementVNode("b", null, toDisplayString($setup.dataTable.pageNum), 1),
+            createTextVNode("\u9875 ")
+          ])
+        ]),
+        createElementVNode("div", _hoisted_3, [
+          createVNode(_component_el_pagination, {
+            "hide-on-single-page": true,
+            currentPage: $setup.dataTable.pageNum,
+            onCurrentChange: _cache[0] || (_cache[0] = ($event) => $setup.dataTable.pageTo($event)),
+            "page-size": $setup.dataTable.pageSize,
+            background: "",
+            layout: "prev, pager, next, jumper",
+            total: $setup.dataTable.totalRecCount
+          }, null, 8, ["currentPage", "page-size", "total"])
+        ])
+      ], 2)
+    ]),
+    _: 2
+  }, [
+    _ctx.$slots.header ? {
+      name: "header",
+      fn: withCtx(() => [
+        renderSlot(_ctx.$slots, "header", { dataTable: $setup.dataTable })
+      ]),
+      key: "0"
+    } : void 0
+  ]), 1032, ["class"])), [
+    [_directive_loading, !$setup.dataTable.ready]
+  ]);
+}
+var dataTableCard = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "data-table-card.vue"]]);
+
+export { dataTableCard as default };

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

@@ -0,0 +1,56 @@
+import { defineComponent, useAttrs, inject, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot, createTextVNode, toDisplayString, createCommentVNode } from 'vue';
+import { ElTableColumn } from 'element-plus';
+import { dataTableKey } from 'web-base-client-vue';
+import _export_sfc from '../_virtual/_plugin-vue_export-helper.mjs';
+
+const __default__ = defineComponent({ name: "BwaDataTableColumn" });
+const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
+  props: {
+    name: {
+      type: String
+    },
+    align: {
+      type: String,
+      default: "center"
+    },
+    showOverflowTooltip: {
+      type: Boolean,
+      default: true
+    }
+  },
+  setup(__props) {
+    var _a;
+    const props = __props;
+    const attrs = useAttrs();
+    const dataTable = inject(dataTableKey);
+    const column = (_a = dataTable.displayColumns.find((column2) => column2.attrName === props.name)) != null ? _a : null;
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(ElTableColumn), mergeProps({
+        align: __props.align,
+        "show-overflow-tooltip": __props.showOverflowTooltip
+      }, unref(attrs)), {
+        header: withCtx(({ column: column2, $index }) => [
+          renderSlot(_ctx.$slots, "header", {
+            column: column2,
+            $index
+          }, () => [
+            createTextVNode(toDisplayString(column2.label), 1)
+          ])
+        ]),
+        default: withCtx(({ row, $index }) => [
+          $index !== -1 ? renderSlot(_ctx.$slots, "default", {
+            key: 0,
+            row,
+            index: $index,
+            column: unref(column),
+            dataTable: unref(dataTable)
+          }) : createCommentVNode("v-if", true)
+        ]),
+        _: 3
+      }, 16, ["align", "show-overflow-tooltip"]);
+    };
+  }
+});
+var DataTableColumn = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "data-table-column.vue"]]);
+
+export { DataTableColumn as default };