@utogether/udp-core 1.0.0 → 1.0.1-beta.2

package/dist/{utogether-r08LNiIZ.js → utogether-Di1byIum.js}

@@ -1,11 +1,11 @@
 import { computed as W, ref as L } from "vue";
-import { useGlobal as E, storageLocal as u, deviceDetection as H, cookies as C, storageSession as M } from "@utogether/utils";
-import { C as P, m as g, s as j, g as h, x as d, D as J, n as K, o as R, p as V, d as S, r as G, q as O, E as x, G as Z } from "./index-BKIw8tSn.js";
+import { useGlobal as g, storageLocal as u, deviceDetection as H, cookies as C, storageSession as M } from "@utogether/utils";
+import { y as P, j as E, s as j, g as h, v as d, z as J, l as K, m as R, n as V, u as S, r as G, o as O, A as x, B as Z } from "./index-DZc3qRTx.js";
 import { useI18n as f } from "vue-i18n";
 import { defineStore as v } from "pinia";
 function I() {
-  const { $storage: t, $config: e } = E(), r = () => {
-    P().multiTagsCache && (!t.tags || t.tags.length === 0) && (t.tags = g), t != null && t.locale || (f().locale.value = (e == null ? void 0 : e.Locale) ?? "zh"), t && !(t != null && t.layout) && (t.layout = {
+  const { $storage: t, $config: e } = g(), r = () => {
+    P().multiTagsCache && (!t.tags || t.tags.length === 0) && (t.tags = E), t != null && t.locale || (f().locale.value = (e == null ? void 0 : e.Locale) ?? "zh"), t && !(t != null && t.layout) && (t.layout = {
       layout: (e == null ? void 0 : e.Layout) ?? "vertical",
       theme: (e == null ? void 0 : e.Theme) ?? "default",
       darkMode: (e == null ? void 0 : e.DarkMode) ?? !1,
@@ -116,7 +116,7 @@ function $() {
     { color: "#eb2f96", themeColor: "pink" },
     /* 深紫罗兰色 */
     { color: "#722ed1", themeColor: "saucePurple" }
-  ]), { $storage: s } = E(), m = L((T = s == null ? void 0 : s.layout) == null ? void 0 : T.darkMode), y = L((D = s == null ? void 0 : s.layout) == null ? void 0 : D.overallStyle), w = document.documentElement;
+  ]), { $storage: s } = g(), m = L((T = s == null ? void 0 : s.layout) == null ? void 0 : T.darkMode), y = L((D = s == null ? void 0 : s.layout) == null ? void 0 : D.overallStyle), w = document.documentElement;
   function p(a, l, o) {
     const i = o || document.body;
     let { className: n } = i;
@@ -157,7 +157,7 @@ function $() {
   function B() {
     C.remove(K), C.remove(R), C.remove(V), u.clear(), M.clear();
     const { Grey: a, Weak: l, MultiTagsCache: o, EpThemeColor: i, Layout: n } = h();
-    X().setLayout(n), c(i), S().multiTagsCacheChange(o), p(a, "html-grey", document.querySelector("html")), p(l, "html-weakness", document.querySelector("html")), G.push("/login"), S().handleTags("equal", [...g]), O();
+    X().setLayout(n), c(i), S().multiTagsCacheChange(o), p(a, "html-grey", document.querySelector("html")), p(l, "html-weakness", document.querySelector("html")), G.push("/login"), S().handleTags("equal", [...E]), O();
   }
   return {
     body: w,

package/package.json

@@ -1,16 +1,18 @@
-{
-  "name": "@utogether/udp-core",
-  "private": false,
-  "version": "1.0.0",
-  "description": "",
-  "type": "module",
-  "main": "dist/core.es.js",
-  "scripts": {
-    "dev": "vite",
-    "build": "vite build",
-    "preview:build": "pnpm build && vite preview"
-  },
-  "keywords": [],
-  "author": "",
-  "license": "ISC"
-}
+{
+  "name": "@utogether/udp-core",
+  "private": false,
+  "version": "1.0.1-beta.2",
+  "description": "",
+  "type": "module",
+  "main1": "index.ts",
+  "main": "dist/core.es.js",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview:build": "pnpm build && vite preview",
+    "report": "rimraf dist && vite build"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC"
+}

package/src/App.vue

@@ -64,7 +64,7 @@ export default defineComponent({
 });
 </script>
 <style lang="scss">
-.hiprint-printElement-image-content img {
-  content: url('/images/logo.png');
-}
+// .hiprint-printElement-image-content img {
+//   content: url('/images/logo.png');
+// }
 </style>

package/src/components/udp/form-upload.vue

@@ -0,0 +1,183 @@
+<!--
+ * @Author: wei.li
+ * @Date: 2022-11-04 14:53:36
+ * @LastEditors: levi7754 levi7754@163.com
+ * @LastEditTime: 2025-07-20 17:23:11
+ * @Description: form upload
+-->
+<template>
+  <div v-spinning="loading" class="ut-upload-wrapper">
+    <el-upload
+      v-model:file-list="fileList"
+      :action="baseUrl + '/ufil/file/uploadMultipart'"
+      :disabled="dataStatus === 'detail'"
+      list-type="picture-card"
+      :headers="headers"
+      :before-upload="beforeUpload"
+      :on-success="onSuccess"
+      :on-preview="onPreview"
+      :on-remove="handleRemove"
+      :http-request="httpRequest"
+    >
+      <template #default>
+        <i v-if="fileList.length < limit && dataStatus !== 'detail'" class="ri-add-line" />
+      </template>
+    </el-upload>
+  </div>
+</template>
+
+<script lang="ts">
+export default { name: 'FormUpload' };
+</script>
+
+<script setup lang="ts">
+import { ref, computed, getCurrentInstance } from 'vue';
+import { cookies } from '@utogether/utils';
+import compressorjs from 'compressorjs';
+
+export interface IProps {
+  record: object;
+  field: string;
+  dataStatus: string;
+  limit?: number;
+  compassorSize?: number;
+  quality?: number;
+  size?: number;
+  beforeUpload?: Function;
+  onSuccess?: Function;
+  onRemove?: Function;
+}
+const props = withDefaults(defineProps<IProps>(), {
+  record: () => {
+    return {};
+  },
+  field: '',
+  dataStatus: '',
+  size: 60,
+  limit: 1,
+  quality: 0.6,
+  compassorSize: 2
+});
+
+const instance = getCurrentInstance()!;
+const baseUrl = instance.appContext.config.globalProperties.$url;
+const viewerApi = instance.appContext.config.globalProperties.$viewerApi;
+const serviceApi = instance.appContext.config.globalProperties.$serviceApi;
+
+const imgTypes = ['image/gif', 'image/jpeg', 'image/png'];
+
+const headers = computed(() => {
+  const kTOKENKEY = 'authorized-token';
+  const token = cookies.get(kTOKENKEY)!;
+  const data = JSON.parse(token);
+  const headers = {
+    Authorization: 'Bearer ' + data.accessToken
+  };
+  return headers;
+});
+
+const fileList = ref([]);
+const loading = ref(false);
+const display = ref('flex');
+const image_size = ref(props.size + 'px');
+const process_size = ref(props.size - 10 + 'px');
+
+const beforeUpload = file => {
+  if (props.beforeUpload) {
+    return props.beforeUpload(file);
+  }
+  loading.value = true;
+  return true;
+};
+
+const httpRequest = options => {
+  if (imgTypes.includes(options.file.type) && options.file.size > 1024 * 1024 * props.compassorSize) {
+    return new Promise((resolve, reject) => {
+      new compressorjs(options.file, {
+        quality: props.quality,
+        mimeType: options.file.type,
+        success(result: File) {
+          const file = new File([result], result.name, { type: result.type });
+          uploadProcess(resolve, reject, file);
+          console.log({ result, file });
+        }
+      });
+    });
+  } else {
+    return new Promise((resolve, reject) => uploadProcess(resolve, reject, options.file));
+  }
+};
+
+const uploadProcess = (resolve, reject, file) => {
+  const formBody = new FormData();
+  formBody.append('file', file);
+
+  return serviceApi
+    .post('/ufil/file/uploadMultipart', formBody, { headers })
+    .then(async data => {
+      loading.value = false;
+      file.path = data;
+      resolve(file);
+    })
+    .catch(() => {
+      loading.value = false;
+      reject(null);
+    });
+};
+
+const onSuccess = file => {
+  loading.value = false;
+  if (props.onSuccess) {
+    return props.onSuccess(file);
+  } else {
+    const field = props.field;
+    Object.assign(props.record, { [field]: file.path });
+    display.value = props.limit > fileList.value.length ? 'flex' : 'none';
+  }
+};
+
+const handleRemove = (uploadFile, uploadFiles) => {
+  if (props.onRemove) {
+    return props.onRemove(uploadFile, fileList);
+  }
+  loading.value = false;
+  console.log(uploadFile, uploadFiles);
+  display.value = 'flex';
+  emit('remove', uploadFile, fileList);
+};
+
+const onPreview = file => {
+  if (imgTypes.includes(file.raw.type)) {
+    const src = `${baseUrl}/ufil${file.response.path}`;
+    viewerApi({ options: { toolbar: true, url: 'data-source' }, images: [{ src, 'data-source': src }] });
+  } else {
+  }
+};
+const emit = defineEmits<{
+  (e: 'remove', file: File, fileList: any): void;
+}>();
+</script>
+
+<style lang="scss">
+.ut-upload-wrapper {
+  .el-upload--picture-card {
+    display: v-bind(display);
+    width: v-bind(image_size) !important;
+    height: v-bind(image_size) !important;
+  }
+
+  .el-upload-list--picture-card .el-upload-list__item {
+    width: v-bind(image_size) !important;
+    height: v-bind(image_size) !important;
+  }
+
+  .el-upload-list--picture-card .el-progress {
+    width: v-bind(process_size) !important;
+
+    .el-progress-circle {
+      width: v-bind(process_size) !important;
+      height: v-bind(process_size) !important;
+    }
+  }
+}
+</style>

package/src/components/udp/index.ts

@@ -0,0 +1,4 @@
+import UtModalForm2 from './modal-form.vue';
+import FormUpload2 from './form-upload.vue';
+
+export { UtModalForm2, FormUpload2 };

package/src/components/udp/modal-form.vue

@@ -0,0 +1,180 @@
+<!--
+ * @Author: wei.li
+ * @Date: 2021-11-29 21:02:43
+ * @LastEditors: levi7754 levi7754@163.com
+ * @LastEditTime: 2025-07-14 17:38:19
+ * @Description: file content
+-->
+
+<template>
+  <div>
+    <vxe-modal
+      v-model="showModal"
+      :title="title"
+      :width="width"
+      :height="height"
+      :loading="loading"
+      :show-footer="dataStatus !== 'detail'"
+      v-bind="modalAttrs"
+      min-width="240"
+      min-height="300"
+      destroy-on-close
+      resize
+      @close="onClose"
+    >
+      <template #default>
+        <vxe-form
+          ref="xForm"
+          :data="record"
+          :items="formItems"
+          :rules="rules"
+          title-align="right"
+          :title-width="formAttrs.titleWidth || 90"
+          v-bind="formAttrs"
+        />
+      </template>
+      <template #footer>
+        <ut-button status="warning" content="cancel" icon="ri-close-line" @tap="onClose" />
+        <ut-button status="u-cyan" content="confirm" icon="ri-save-3-line" @tap="onConfirm" />
+      </template>
+    </vxe-modal>
+  </div>
+</template>
+
+<script lang="ts">
+export default {
+  name: 'UtModalForm'
+};
+</script>
+<script lang="ts" setup>
+import { onBeforeMount, ref, computed, getCurrentInstance, useAttrs } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { getAttrs, formatItems } from './utils';
+import to from 'await-to-js';
+import { formatRules, successMessage } from '@utogether/utils';
+
+// import type { IRecord, IFormItemProps } from '../../types';
+
+export interface IProps {
+  record: IRecord; // 数据对象
+  formAttrs?: IRecord;
+  modalAttrs?: IRecord;
+  items: Array<IFormItemProps>; // form item
+  url?: string; // 服务路径
+  method?: string; // 请求方式
+  title?: string; // 标题
+  dataStatus?: string; // 状态
+  width?: number;
+  height?: number;
+}
+
+const props = withDefaults(defineProps<IProps>(), {
+  record: (): IRecord => {
+    return {};
+  },
+  formAttrs: (): IRecord => {
+    return {};
+  },
+  items: () => [],
+  title: '数据记录',
+  width: 420,
+  height: 360,
+  dataStatus: 'detail',
+  url: '',
+  method: 'post'
+});
+
+const attrs: IRecord = getAttrs(useAttrs());
+
+const loading = ref(false);
+const instance = getCurrentInstance()!;
+
+const serviceApi = instance.appContext.config.globalProperties.$serviceApi;
+
+/**
+ * @description: 根据items 获取必填选
+ */
+const rules = computed(() => {
+  if (!props.items.length) return {};
+  return formatRules(props.items, t);
+});
+
+const formItems = computed(() => {
+  if (!props.items.length) return props.items;
+  return formatItems(props.items, props.dataStatus);
+});
+
+const { t } = useI18n();
+const showModal = ref(false);
+
+const xForm = ref(null);
+/**
+ * @description: 弹框确认
+ */
+const onConfirm = () => {
+  // @ts-ignore
+  xForm.value.validate(async (valid: boolean) => {
+    if (!valid) {
+      const { record, url, method } = props;
+      if (url) {
+        showLoading();
+        const body = attrs?.dataProcessMethod ? attrs?.dataProcessMethod(record) : record;
+        if (url) {
+          const [err, data] = await to(serviceApi[method](url, body));
+          if (!err) {
+            successMessage();
+            emit('confirm', data);
+          }
+        }
+        hiddenLoading();
+        onClose();
+      } else {
+        emit('confirm');
+      }
+    }
+  });
+};
+
+/**
+ * @description: 显示加载框
+ */
+const showLoading = () => {
+  loading.value = true;
+};
+
+/**
+ * @description: 关闭加载框
+ */
+const hiddenLoading = () => {
+  loading.value = false;
+};
+const validateForm = (cb: Function) => {
+  // @ts-ignore
+  xForm.value.validate(cb);
+};
+
+/**
+ * @description: 关闭弹框
+ */
+const onClose = () => {
+  showModal.value = false;
+  emit('close');
+};
+/**
+ * @description: 打开弹框
+ */
+const openModal = () => {
+  showModal.value = true;
+};
+
+const emit = defineEmits<{
+  (e: 'close'): void;
+  (e: 'confirm', record?: any): void;
+}>();
+
+defineExpose({ showLoading, hiddenLoading, openModal, validateForm });
+
+onBeforeMount(() => {
+  openModal();
+});
+</script>

package/src/components/udp/utils.ts

@@ -0,0 +1,40 @@
+import { useRender } from '@utogether/utils';
+
+export const getAttrs = attrs => {
+  const data = {};
+  Object.keys(attrs).forEach(key => {
+    const nKey = key.replace(/-(\w)/g, str => str.slice(1).toUpperCase());
+    data[nKey] = attrs[key];
+  });
+  return data;
+};
+
+export const formatItems = (items, status, span = 24) => {
+  const renderHook = useRender();
+
+  if (!items.length) return items;
+  return items.map(item => {
+    item.title = item.title || `message.${item.field}`;
+    item.span = item.span || span;
+    let disabled = false;
+    if (status === 'detail') {
+      disabled = true;
+      item.placeholder = null;
+    } else {
+      disabled =
+        item.disabled === false ? item.disabled : item.disabled || item.itemRender?.props?.disabled;
+    }
+    let itemRender = {
+      name: 'VxeInput',
+      props: { disabled, placeholder: disabled ? '' : item.placeholder }
+    };
+    if (item.code && !item.itemRender) {
+      itemRender = renderHook.renderDict(item.code);
+    }
+    item.itemRender = item.itemRender || itemRender;
+    item.itemRender['props'] = Object.assign(item.itemRender.props || {}, {
+      disabled
+    });
+    return item;
+  });
+};