@utogether/udp-core 1.0.1-beta.15 → 1.0.1-beta.17

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

@@ -1,298 +0,0 @@
-<!--
- * @Author: wei.li
- * @Date: 2021-11-24 17:53:49
- * @LastEditors: levi7754 levi7754@163.com
- * @LastEditTime: 2025-07-22 11:42:46
- * @Description: 共用弹框
--->
-<template>
-  <div>
-    <vxe-modal
-      v-model="showModal"
-      :title="title"
-      :width="width"
-      :height="height"
-      :loading="data.loading"
-      :show-footer="showFooter"
-      resize
-      destroy-on-close
-      @close="close"
-    >
-      <template #default>
-        <slot />
-        <vxe-grid
-          ref="xGrid"
-          v-bind="data"
-          resizable
-          v-on="attrs.events || {}"
-          @edit-activated="onEditActived"
-          @toolbarButtonClick="toolbarButtonClick"
-          @toolbarToolClick="toolbarButtonClick"
-          @cell-click="cellClick"
-        />
-      </template>
-      <template #footer>
-        <slot name="bottom" />
-        <ut-button icon="ri-close-line" status="warning" content="cancel" @tap="close" />
-        <ut-button icon="ri-save-3-line" content="confirm" @tap="onConfirm" />
-      </template>
-    </vxe-modal>
-  </div>
-</template>
-<script lang="ts">
-export default {
-  name: 'UtModalGrid'
-};
-</script>
-<script lang="ts" setup>
-// @ts-nocheck
-import { onBeforeMount, reactive, ref, toRaw, getCurrentInstance, useAttrs } from 'vue';
-import { useI18n } from 'vue-i18n';
-import { VxeGridProps } from 'vxe-table';
-import { formatGridItems, i18nColums, formatRules, successMessage, warnMessage } from '@utogether/utils';
-import { clone, isFunction, merge } from 'xe-utils';
-import { queryAll, query, del, save, footerSumMethod, getToolBarConfig, onCheckMethod, getAttrs } from './utils';
-
-// import type { IRecord, IFormItemProps, ITableColProps } from '../../types';
-
-export interface IProps {
-  checkMethod?: Function;
-  columns: Array<ITableColProps>; // 列表行
-  defaultValue?: IRecord;
-  defaultParams?: IRecord;
-  gridOptions?: IRecord;
-  auth?: IRecord;
-  url?: string; // 查询服务路径
-  submitUrl?: string; // 确认
-  checkRowKeys?: Array<string>; // 默认选中列表
-  items?: Array<IFormItemProps>; // 查询条件
-  title?: string; // 标题
-  width?: number | string;
-  height?: number;
-  editable?: boolean; // 可编辑
-  needExport?: boolean; // 是否需要导出
-  showFooter?: boolean; // 显示底部按钮
-  addChild?: boolean; // 可编辑
-  autoClose?: boolean; // 组件自主关闭
-  autoLoad?: boolean; // 是否自动加载查询数据
-}
-const attrs: IRecord = getAttrs(useAttrs());
-
-const props = withDefaults(defineProps<IProps>(), {
-  gridOptions: () => {
-    return {};
-  },
-  items: () => [],
-  columns: () => [],
-  checkRowKeys: () => [],
-  addChild: false,
-  editable: true,
-  showFooter: false,
-  autoLoad: true,
-  needExport: true,
-  autoClose: true,
-  width: '520',
-  height: 420,
-  title: '数据记录',
-  url: '',
-  submitUrl: ''
-});
-
-const showModal = ref(false);
-
-const xGrid = ref(null);
-const instance = getCurrentInstance()!;
-
-const hasAuthority = instance.appContext.config.globalProperties.$hasAuthority;
-const serviceApi = instance.appContext.config.globalProperties.$serviceApi;
-const $mode = instance.appContext.config.globalProperties.$mode;
-
-const { t } = useI18n();
-
-/**
- * @description: colum 统一添加国家化
- */
-const getColumns = () => {
-  const col = props.columns.map(m => {
-    if (!props.editable) {
-      m.editRender = { enabled: false };
-    } else if (!m.type && !m.editRender && props.editable && !!m.editable) {
-      m.editRender = { name: 'VxeInput' };
-    }
-    return m;
-  });
-  return i18nColums(col);
-};
-
-const getItems = () => {
-  if (!props.items.length) return props.items;
-  return formatGridItems(clone(props.items, true));
-};
-
-/**
- * @description: 根据items 获取必填选
- */
-const getRules = () => {
-  if (!props.columns.length) return {};
-  return formatRules(props.columns, t);
-};
-
-const data = reactive<VxeGridProps>({
-  loading: false,
-  border: true,
-  pagerConfig: {},
-  formConfig: {},
-  toolbarConfig: { enabled: false },
-  height: 'auto',
-  editConfig: {},
-  rowConfig: { keyField: '_X_ROW_KEY' },
-  editRules: getRules(),
-  proxyConfig: {
-    form: true, // 查询是需要启用表单代理
-    autoLoad: props.autoLoad,
-    ajax: {
-      queryAll: ({ form }) => queryAll(props, serviceApi, form),
-      query: ({ page, form }) => query(props, form, page, serviceApi, $mode),
-      delete: ({ body: { removeRecords } }) => del(serviceApi, removeRecords, props),
-      save: ({ body }) => Promise.all(save(serviceApi, body, props)),
-      querySuccess: response => callback('querySuccess', response),
-      queryError: response => callback('queryError', response),
-      deleteSuccess: response => callback('deleteSuccess', response),
-      deleteError: response => callback('deleteError', response),
-      saveSuccess: response => callback('saveSuccess', response),
-      saveError: response => callback('saveError', response)
-    }
-  },
-  checkboxConfig: {
-    checkMethod: ({ row }) => onCheckMethod(row, props),
-    checkRowKeys: props.checkRowKeys
-  },
-  columns: getColumns()
-});
-
-const callback = (cb, response) => {
-  attrs?.callback && attrs?.callback[cb] && attrs?.callback[cb](response);
-};
-
-// 确认数据
-const onConfirm = async () => {
-  let records = null;
-  const type = props.columns[0].type;
-  if (type === 'checkbox') {
-    records = xGrid.value.getCheckboxRecords();
-  } else if (type === 'radio') {
-    records = xGrid.value.getRadioRecord();
-  } else {
-    records = xGrid.value.getTableData().fullData;
-  }
-  if (type === 'checkbox' && !records.length && !props.addChild) {
-    return warnMessage(t('message.selectedRecord'));
-  } else if (type === 'radio' && !records) {
-    return warnMessage(t('message.selectedRecord'));
-  }
-  if (isFunction(attrs.beforeConfirm) && !attrs.beforeConfirm(records)) return;
-  const { submitUrl } = props;
-  // 服务submitUrl
-  if (submitUrl) {
-    showLoading();
-    let res;
-    try {
-      records.forEach(record => Object.assign(record, props.defaultParams));
-      res = await serviceApi.post(submitUrl, records);
-    } finally {
-      res && emit('confirm', res);
-      res && successMessage(t('message.operateSuccess'));
-      close();
-      hiddenLoading();
-    }
-  } else {
-    props.autoClose && close();
-    emit('confirm', records);
-  }
-};
-// 请求数据
-const refreshData = () => {
-  xGrid.value.commitProxy('query');
-};
-const refreshColumn = () => {
-  data.editRules = getRules();
-  xGrid.value.refreshColumn();
-};
-const getInstance = () => {
-  return toRaw(xGrid.value);
-};
-const cellClick = ({ row }) => {
-  const type = props.columns[0].type;
-  if (type === 'checkbox') {
-    xGrid.value.setCheckboxRow(row, true);
-  } else if (type === 'radio') {
-    xGrid.value.setRadioRow(row);
-  }
-};
-// 单元格被激活编辑激活回调
-const onEditActived = data => {
-  emit('actived', data);
-};
-const toolbarButtonClick = ({ code }) => {
-  emit('buttonClick', code);
-};
-const showLoading = () => {
-  data.loading = true;
-};
-const hiddenLoading = () => {
-  data.loading = false;
-};
-const emit = defineEmits<{
-  (e: 'close'): void;
-  (e: 'confirm', record: any): void;
-  (e: 'actived', record: any): void;
-  (e: 'buttonClick', code: string): void;
-}>();
-// 关闭弹框
-const close = () => {
-  if (isFunction(attrs.beforeClose) && !attrs.beforeClose()) return;
-  showModal.value = false;
-  emit('close');
-};
-
-/**
- * @description: 设置grid参数
- */
-
-const setGridConfig = () => {
-  // 查询
-  if (props.items.length) {
-    data.formConfig = {
-      titleWidth: 100,
-      titleAlign: 'right',
-      items: getItems(),
-      rules: formatRules(props.items, t),
-      validConfig: { showMessage: false }
-    };
-  }
-  // tool bar
-  const obj = getToolBarConfig(data, props, attrs, hasAuthority);
-  Object.assign(data, obj);
-
-  // 合计方法
-  if (attrs.mergeFooter) {
-    data.showFooter = true;
-    data.footerMethod = ({ columns, data }) => footerSumMethod({ columns, data }, attrs.mergeFooter);
-  }
-  merge(data, props.gridOptions);
-};
-
-// 子组件需对外暴露方法
-defineExpose({
-  refreshData,
-  refreshColumn,
-  getInstance,
-  showLoading,
-  hiddenLoading,
-  close
-});
-onBeforeMount(() => {
-  showModal.value = true;
-  setGridConfig();
-});
-</script>

package/src/components/udp/upload.vue

@@ -1,423 +0,0 @@
-<!--
- * @Author: wei.li
- * @Date: 2022-06-21 14:50:52
- * @LastEditors: levi7754 levi7754@163.com
- * @LastEditTime: 2025-08-03 16:01:16
- * @Description: excel数据导入
--->
-<template>
-  <vxe-modal v-model="visible" :show-header="false" fullscreen remember @close="onClose">
-    <template #default>
-      <vxe-grid ref="xgrid" v-bind="gridOptions" v-on="gridEvents">
-        <template v-for="col in columns" :key="col.field" #[col.field!]="{ row }">
-          <el-select v-if="col.dictCode && !col.disabled" v-model.trim="row[col.field!]" clearable>
-            <el-option
-              v-for="child in dict[col.dictCode]?.children"
-              :key="child.dictCode"
-              :value="child.dictCode"
-              :label="child.dictName"
-            />
-          </el-select>
-          <el-date-picker
-            v-else-if="['date', 'month', 'datetime'].includes(col.dataType) && !col.disabled"
-            v-model.trim="row[col.field!]"
-            :type="col.dataType"
-            value-format="YYYY-MM-DD hh:mm:ss"
-          />
-          <input v-else-if="!col.da && !col.disabled" v-model.trim="row[col.field!]" class="ut-input" />
-          <span v-else-if="!showErrorMsg">{{ row[col.field!] }}</span>
-          <span v-else>{{ row[col.field!] }}</span>
-        </template>
-        <template #pager>
-          <vxe-pager
-            v-model:current-page="listQuery.currentPage"
-            v-model:page-size="listQuery.pageSize"
-            :layouts="layouts"
-            :page-sizes="[200, 500, 1000, 2000, 5000, 10000]"
-            :total="listQuery.total"
-            @page-change="handlePageChange"
-        /></template>
-      </vxe-grid>
-    </template>
-  </vxe-modal>
-</template>
-
-<script lang="ts">
-export default {
-  name: 'UtUpload'
-};
-</script>
-<script setup lang="ts">
-import { reactive, ref, watch, getCurrentInstance } from 'vue';
-import { toDateString } from 'xe-utils';
-import { storageLocal, cookies, warnMessage } from '@utogether/utils';
-import Big from 'big.js';
-import { useI18n } from 'vue-i18n';
-// import type { IRecord, ITableColProps } from '../../types';
-import { VxeTableInstance, VxeGridProps, VxeGridListeners } from 'vxe-table';
-import { VxeUI } from 'vxe-pc-ui';
-import type { VxePagerPropTypes, VxePagerEvents } from 'vxe-pc-ui';
-
-export interface IProps {
-  defaultParams?: IRecord;
-  options?: IRecord;
-  columns: Array<ITableColProps>;
-  templateData?: Array<ITableColProps>;
-  serviceCode?: string;
-  url?: string;
-  sourceList?: string;
-}
-
-const props = withDefaults(defineProps<IProps>(), {
-  defaultParams: (): IRecord => {
-    return {};
-  },
-  options: (): IRecord => {
-    return {
-      filename: '数据模板',
-      errorField: 'errorMsg',
-      errListField: 'list'
-    };
-  },
-  columns: () => [],
-  templateData: () => [],
-  sourceList: 'list'
-});
-
-const instance = getCurrentInstance()!;
-const serviceApi = instance.appContext.config.globalProperties.$serviceApi;
-const visible = defineModel<boolean>('visible');
-
-const { t } = useI18n();
-
-const showErrorMsg = ref(false);
-
-const dict = storageLocal.getItem('kLov');
-
-watch(
-  () => visible.value,
-  nv => {
-    if (nv) {
-      gridOptions.data = [];
-    }
-  }
-);
-
-const getColumns = () => {
-  const columns = props.columns.map(col => {
-    col.slots = { default: col.field };
-    col.title = col.field;
-    return col;
-  });
-  const col: ITableColProps = {
-    type: 'checkbox',
-    width: 40,
-    align: 'center',
-    fixed: 'left'
-  };
-  columns.unshift(col);
-  return columns;
-};
-
-const listQuery = ref({ pageSize: 200, currentPage: 1, total: 0 });
-
-const layouts: VxePagerPropTypes.Layouts = [
-  'Sizes',
-  'PrevJump',
-  'PrevPage',
-  'Number',
-  'NextPage',
-  'NextJump',
-  'FullJump',
-  'Total'
-];
-
-const height = window.innerHeight - 25;
-
-const xgrid = ref<VxeTableInstance>();
-// 导入的所有数据
-let dataList: ITableColProps[] = [];
-
-const importConfig = {
-  mode: 'covering',
-  types: ['csv', 'xlsx'],
-  afterImportMethod: onImportMethod
-};
-
-const gridOptions = reactive<VxeGridProps>({
-  border: true,
-  height,
-  data: [],
-  importConfig,
-  showOverflow: true,
-  loading: false,
-  toolbarConfig: {
-    buttons: [
-      {
-        code: 'import_plus',
-        name: t('message.btn.upload'),
-        icon: 'ri-upload-2-line',
-        status: 'primary'
-      },
-      {
-        code: 'save_plus',
-        name: t('message.btn.save'),
-        icon: 'ri-save-3-line',
-        status: 'success'
-      },
-      {
-        code: 'del_plus',
-        name: t('message.btn.delete'),
-        icon: 'ri-delete-bin-line',
-        status: 'danger'
-      },
-      {
-        code: 'export_plus',
-        name: t('message.btn.downloadTemp'),
-        icon: 'ri-download-2-line',
-        status: 'warning'
-      }
-    ],
-    tools: [
-      {
-        code: 'question',
-        name: t('message.btn.FAQ'),
-        status: 'primary',
-        icon: 'vxe-icon-info-circle-fill'
-      },
-      {
-        code: 'replay',
-        name: t('message.btn.back'),
-        status: 'info',
-        icon: 'vxe-icon-undo'
-      }
-    ]
-  },
-  columns: getColumns()
-});
-
-const gridEvents: VxeGridListeners = {
-  toolbarButtonClick({ code }) {
-    // const $grid = xgrid.value;
-    switch (code) {
-      case 'import_plus': {
-        handleImport();
-        break;
-      }
-      case 'save_plus': {
-        handleSave();
-        break;
-      }
-      case 'del_plus': {
-        handleDelete();
-        break;
-      }
-      case 'export_plus': {
-        handleDownLoadFile();
-        break;
-      }
-    }
-  },
-  toolbarToolClick({ code }) {
-    // const $grid = xgrid.value;
-    switch (code) {
-      case 'replay': {
-        onClose();
-        break;
-      }
-      case 'question': {
-        showImportQuestion();
-        break;
-      }
-    }
-  }
-};
-
-const handleImport = () => {
-  dataList = [];
-  xgrid.value?.openImport();
-};
-// 导入后获取数据
-function onImportMethod(options: any) {
-  dataList = options.$table.getTableData().fullData;
-  // 标题会默认导入，删除第一行
-  // dataList.splice(0, 1);
-  const columns = getColumns().filter(f => !f.type && f.mapField !== props.options.errorField);
-  columns.forEach(col => {
-    const idx = dataList.findIndex(data => data[col.field!] === col.field);
-    idx !== -1 && dataList.splice(idx, 1);
-  });
-  props.columns.forEach(col => {
-    if (col.dateFormatter || col.valueType === 'number') {
-      dataList.forEach(data => {
-        if (col.dateFormatter) {
-          data[col.field!] = toDateString(data[col.field!], col.dateFormatter || 'yyyy-MM-dd HH:mm:ss');
-        } else {
-          data[col.field!] = Big(data[col.field!]).toFixed(col.decimal || 6);
-        }
-      });
-    }
-  });
-  listQuery.value.total = dataList.length;
-  getDataList();
-}
-
-const getDataList = () => {
-  const { currentPage, pageSize } = listQuery.value;
-  gridOptions.data = dataList.filter(
-    (data, idx) => idx < pageSize * currentPage && idx >= pageSize * (currentPage - 1)
-  );
-};
-// 切换页数
-const handlePageChange: VxePagerEvents.PageChange = ({ currentPage, pageSize }) => {
-  listQuery.value.currentPage = currentPage;
-  listQuery.value.pageSize = pageSize;
-  getDataList();
-};
-// 模板下载
-const handleDownLoadFile = () => {
-  const data: ITableColProps[] = [];
-  if (props.templateData.length) {
-    data.push(...props.templateData);
-  } else {
-    const obj: ITableColProps = {};
-    getColumns()
-      .filter(f => f.type !== 'checkbox')
-      .forEach(col => {
-        obj[col.field!] = '案例';
-      });
-    data.push(obj);
-  }
-  const opt: IRecord = {
-    filename: props.options.filename,
-    type: 'xlsx',
-    columns: getColumns().filter(f => f.mapField !== props.options.errorField && f.type !== 'checkbox'),
-    data
-  };
-  xgrid.value?.exportData(opt);
-};
-
-const handleSave = async () => {
-  if (!dataList.length) {
-    return warnMessage(t('message.importEmpty'));
-  }
-  const type = await VxeUI.modal.confirm(t('message.importRecord'));
-  if (type === 'confirm') {
-    gridOptions.loading = true;
-    const { url } = props;
-    formatterData('toSave');
-    serviceApi
-      .post(url, dataList)
-      .then((res: any) => {
-        if (res?.status === 'error' || res?.length) {
-          showErrorMsg.value = true;
-          setErrorMessage(res?.length ? res : res[props.options.errListField || props.sourceList]);
-          VxeUI.modal.message({
-            content: t('message.importFailed'),
-            status: 'error'
-          });
-        } else {
-          VxeUI.modal.message({
-            content: t('message.importSuccess'),
-            status: 'success'
-          });
-          onClose();
-        }
-      })
-      .finally(() => {
-        showErrorMsg.value = false;
-        gridOptions.loading = false;
-      });
-  }
-};
-
-/**
- * @description:删除行
- */
-const handleDelete = () => {
-  const checkboxRecords = xgrid.value?.getCheckboxRecords();
-  if (!checkboxRecords?.length) {
-    return VxeUI.modal.message({
-      content: t('message.selectedRecord'),
-      status: 'warning'
-    });
-  }
-  checkboxRecords.forEach(record => {
-    const idx = dataList.findIndex(data => data._X_ROW_KEY === record._X_ROW_KEY)!;
-    idx !== -1 && dataList.splice(idx, 1);
-  });
-  gridOptions.data = dataList;
-};
-
-const setErrorMessage = (array: ITableColProps[]) => {
-  listQuery.value.total = array.length;
-  dataList = array.map((item, idx) => {
-    item._X_ROW_KEY = idx;
-    return item;
-  });
-  formatterData('toShow');
-  getDataList();
-};
-const formatterData = (formatterType: string) => {
-  gridOptions.columns!.forEach((col: any) => {
-    if (formatterType === 'toSave') {
-      const commonParam = cookies.get('kCookies_param') ? JSON.parse(cookies.get('kCookies_param')!) : {};
-      dataList.forEach(data => {
-        data[col.mapField] = data[col.field];
-        Object.assign(data, commonParam, props.defaultParams);
-      });
-    } else {
-      dataList.forEach(data => {
-        data[col.field] = data[col.mapField];
-      });
-    }
-  });
-};
-
-const showImportQuestion = () => {
-  VxeUI.modal.alert(t('message.importTip'), t('message.udp.tip'));
-};
-
-const emit = defineEmits<{ (e: 'close'): void }>();
-
-const onClose = () => {
-  visible.value = false;
-  emit('close');
-};
-</script>
-
-<style lang="scss" scoped>
-.ut-input {
-  box-sizing: border-box;
-  box-sizing: border-box;
-  display: inline-block;
-  width: 100%;
-  height: 28px;
-  padding: 0 15px;
-  font-size: 13px;
-  line-height: 28px;
-  color: #606266;
-  background-color: #fff;
-  background-image: none;
-  border: 1px solid #dcdfe6;
-  border-radius: 4px;
-  outline: 0;
-  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
-  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
-  appearance: none;
-
-  &:hover {
-    border-color: #c0c4cc;
-  }
-
-  &:focus {
-    border-color: #409eff;
-    outline: 0;
-  }
-
-  &:disabled {
-    background-color: #f5f7fa;
-    outline: none;
-  }
-}
-</style>