@utogether/udp-core 1.0.0 → 1.0.1

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

@@ -1,6 +1,6 @@
 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 { 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-OswH7SsT.js";
 import { useI18n as f } from "vue-i18n";
 import { defineStore as v } from "pinia";
 function I() {

package/package.json

@@ -1,9 +1,10 @@
 {
   "name": "@utogether/udp-core",
   "private": false,
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "",
   "type": "module",
+  "main1": "index.ts",
   "main": "dist/core.es.js",
   "scripts": {
     "dev": "vite",

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

@@ -0,0 +1,132 @@
+<!--
+ * @Author: wei.li
+ * @Date: 2022-11-04 14:53:36
+ * @LastEditors: levi7754 levi7754@163.com
+ * @LastEditTime: 2025-07-14 18:32:47
+ * @Description: form upload
+-->
+<template>
+  <div v-spinning="loading" class="ut-upload-wrapper">
+    <el-upload
+      v-model:file-list="fileList"
+      :action="baseUrl + '/ufil/file/uploadMultipart'"
+      list-type="picture-card"
+      :headers="headers"
+      :before-upload="beforeUpload"
+      :on-success="onSuccess"
+      :on-preview="onPreview"
+      :on-remove="handleRemove"
+    >
+      <template #default>
+        <i 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 type { UploadProps } from "element-plus";
+// import { loadEnv } from "@build/index";
+
+// const { VITE_BASE_URL } = loadEnv();
+
+export interface IProps {
+  record: object;
+  field: string;
+  limit?: number;
+  beforeUpload?: Function;
+  onSuccess?: Function;
+  onRemove?: Function;
+}
+const props = withDefaults(defineProps<IProps>(), {
+  record: () => {
+    return {};
+  },
+  field: '',
+  limit: 1
+});
+
+const instance = getCurrentInstance()!;
+const baseUrl = instance.appContext.config.globalProperties.$url;
+
+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 beforeUpload = file => {
+  if (props.beforeUpload) {
+    return props.beforeUpload(file);
+  }
+  console.log(file);
+  loading.value = true;
+  return true;
+};
+
+const onSuccess = response => {
+  loading.value = false;
+  if (props.onSuccess) {
+    return props.onSuccess(response);
+  } else {
+    const field = props.field;
+    Object.assign(props.record, { [field]: response.data });
+    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 = () => {
+  console.log('....');
+};
+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: 60px !important;
+    height: 60px !important;
+  }
+
+  .el-upload-list--picture-card .el-upload-list__item {
+    width: 60px !important;
+    height: 60px !important;
+  }
+
+  .el-upload-list--picture-card .el-progress {
+    width: 50px !important;
+
+    .el-progress-circle {
+      width: 50px !important;
+      height: 50px !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;
+  });
+};

package/src/main.ts

@@ -35,7 +35,8 @@ import VueViewer from 'v-viewer';
 //   UtButton,
 // UGrid,
 //   UtDivider,
-//   UtModalForm,
+// UtModalForm2,
+// FormUpload2
 //   UtForm,
 //   UtModalGrid,
 //   UtContent,
@@ -43,7 +44,7 @@ import VueViewer from 'v-viewer';
 //   UtIconSelect,
 //   UtCalendar
 // uAttachment
-// } from './../src/components/udp';
+// } from './components/udp';
 
 const app = createApp(App);
 
@@ -72,7 +73,6 @@ const setGlobalDirective = app => {
     app.directive(key, (directives as { [key: string]: Directive })[key]);
   });
 };
-console.log('ucore--process', process.env);
 
 const init = ({ config, lang, views, env, tableConfig }) => {
   app.use(router);
@@ -87,7 +87,8 @@ const init = ({ config, lang, views, env, tableConfig }) => {
     app.component('FontIcon', FontIcon);
     // app.component('uAttachment', uAttachment).component('UGrid', UGrid);
     //   .component('UtDivider', UtDivider)
-    //   .component('UtModalForm', UtModalForm)
+    // .component('UtModalForm2', UtModalForm2)
+    // .component('FormUpload2', FormUpload2);
     //   .component('UtForm', UtForm)
     //   .component('UtContent', UtContent)
     //   .component('UtIconSelect', UtIconSelect)

package/src/plugins/vxe-table/index.ts

@@ -2,7 +2,7 @@
  * @Author: levi7754 levi7754@163.com
  * @Date: 2024-06-05 14:32:03
  * @LastEditors: levi7754 levi7754@163.com
- * @LastEditTime: 2025-04-30 15:40:39
+ * @LastEditTime: 2025-07-16 15:36:56
  * @FilePath: /udp-front/packages/udp-core/src/plugins/vxe-table/index.ts
  * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
  */
@@ -10,8 +10,8 @@ import 'xe-utils';
 import { merge } from 'xe-utils';
 import { geti18n, transformI18n } from '../i18n/index';
 // import { storageLocal } from '@utogether/utils';
-import { VxetableRender } from '@utogether/utils';
-// import { VxetableRender } from './udp/render';
+// import { VxetableRender } from '@utogether/utils';
+import { VxetableRender } from './render';
 import { getServiceApi } from '../../api';
 
 import VXETable, { VxeUI } from 'vxe-table';