@utogether/udp-core 1.0.1-beta.16 → 1.0.1-beta.18

package/src/components/SuScrollTree/ScrollPanel.vue

@@ -1,175 +1,170 @@
-<template>
-  <div class="u-scroll-panel" @click.prevent="handleClickPanel">
-    <div class="u-panel-header">
-      <h2>{{ title }}</h2>
-      <ut-button v-if="showAllButton" content="BtnExpand" @click="handleExpand(data, true)" />
-      <ut-button
-        v-if="showAllButton"
-        status="warning"
-        content="BtnCollapse"
-        @click="handleExpand(data, false)"
-      />
-      <vxe-button icon="vxe-icon-refresh" @click="onRefresh" />
-    </div>
-    <div class="u-panel-content system-scrollbar">
-      <el-tree
-        ref="tree"
-        :data="data"
-        :props="treeOtions"
-        :expand-on-click-node="false"
-        style="background-color: #fff"
-        class="u-tree-panel"
-        node-key="id"
-        highlight-current
-        @node-click="handleNodeClick"
-      >
-        <template #default="{ node }">
-          <span class="prefix" :class="{ 'is-leaf': node.isLeaf }">
-            <i class="ri-folder-2-fill ri-lg mr-1" style="color: #fadb14" />
-          </span>
-          <span>{{ node.label }}</span>
-        </template>
-      </el-tree>
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { getServiceApi } from '../../api';
-import type { Ref } from 'vue';
-import { ref, inject, watch, nextTick } from 'vue';
-
-interface IProps {
-  title: string;
-  url: string;
-  showAllButton?: boolean;
-  treeOtions: Object;
-  defaultParams?: Object;
-}
-const props = withDefaults(defineProps<IProps>(), {
-  treeOtions: () => {
-    return {
-      children: 'children',
-      label: 'label'
-    };
-  },
-  defaultParams: () => {
-    return {};
-  },
-  showAllButton: false
-});
-
-const data = ref<any>([]);
-const tree: Ref<any | null> = ref(null);
-// 当前激活item
-const active: IRecord = inject('active');
-// tree面板变更
-const scrollPanelChange: IRecord = inject('scrollPanelChange');
-// tree 列表
-const treeList: IRecord = inject('treeList');
-
-watch(
-  () => scrollPanelChange.value,
-  () => {
-    scrollPanelChange.value && getDataList();
-  }
-);
-
-const getDataList = async (params = {}) => {
-  const query = Object.assign(params, props.defaultParams);
-  const serverData = (await getServiceApi().get(props.url, query)) as IResponseData;
-  data.value = serverData.list || serverData;
-  treeList.value = serverData.list || serverData;
-  active.value = serverData.list ? serverData.list[0] : serverData[0];
-  nextTick(() => {
-    tree.value && tree?.value.setCurrentKey(active.value?.id || '');
-  });
-  scrollPanelChange.value = false;
-};
-const handleNodeClick = (row: any) => {
-  active.value = row;
-};
-
-const handleClickPanel = () => {
-  active.value = {};
-};
-
-const handleExpand = (array, expanded) => {
-  array.forEach(el => {
-    tree.value.store.nodesMap[el.id].expanded = expanded;
-    if (el.children?.length) {
-      handleExpand(el.children, expanded);
-    }
-  });
-  console.log('[ tree.value ] >', tree.value);
-};
-
-const onRefresh = () => {
-  getDataList();
-};
-defineExpose({
-  onRefresh
-});
-getDataList();
-</script>
-
-<style lang="scss">
-.u-scroll-panel {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  height: 100%;
-  background: #fff;
-
-  .u-panel-header {
-    display: flex;
-    align-items: center;
-    padding: 10px;
-    border-bottom: 1px solid #eee;
-
-    h2 {
-      // display: box;
-      height: 30px;
-      padding: 0;
-      margin: 0;
-      margin-right: 20px;
-      overflow: hidden;
-      -webkit-line-clamp: 1;
-      font-size: 14px;
-      line-height: 30px;
-      -webkit-box-orient: vertical;
-    }
-
-    .el-input {
-      flex: 1;
-    }
-  }
-
-  .u-panel-content {
-    flex: 1;
-    overflow: auto;
-  }
-
-  .u-tree-panel {
-    height: 100%; // 0630
-    :deep(.el-tree-node__content) {
-      height: 36px;
-    }
-
-    :deep(.el-tree-node.is-current > .el-tree-node__content) {
-      background-color: rgb(64 158 255 / 40%);
-    }
-
-    :deep(.el-tree-node > .el-tree-node__content) {
-      transition: 0.2s;
-    }
-  }
-
-  .el-vl__window {
-    height: 360px !important;
-    // &:first-child {
-    //   height: 100% !important;
-    // }
-  }
-}
-</style>
+<template>
+  <div class="u-scroll-panel" @click.prevent="handleClickPanel">
+    <div class="u-panel-header">
+      <h2>{{ title }}</h2>
+      <ut-button v-if="showAllButton" content="BtnExpand" @click="handleExpand(data, true)" />
+      <ut-button v-if="showAllButton" status="warning" content="BtnCollapse" @click="handleExpand(data, false)" />
+      <vxe-button icon="vxe-icon-refresh" @click="onRefresh" />
+    </div>
+    <div class="u-panel-content system-scrollbar">
+      <el-tree
+        ref="tree"
+        :data="data"
+        :props="treeOtions"
+        :expand-on-click-node="false"
+        style="background-color: #fff"
+        class="u-tree-panel"
+        node-key="id"
+        highlight-current
+        @node-click="handleNodeClick"
+      >
+        <template #default="{ node }">
+          <span class="prefix" :class="{ 'is-leaf': node.isLeaf }">
+            <i class="ri-folder-2-fill ri-lg mr-1" style="color: #fadb14" />
+          </span>
+          <span>{{ node.label }}</span>
+        </template>
+      </el-tree>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { getServiceApi } from '../../api';
+import type { Ref } from 'vue';
+import { ref, inject, watch, nextTick } from 'vue';
+
+interface IProps {
+  title: string;
+  url: string;
+  showAllButton?: boolean;
+  treeOtions: Object;
+  defaultParams?: Object;
+}
+const props = withDefaults(defineProps<IProps>(), {
+  treeOtions: () => {
+    return {
+      children: 'children',
+      label: 'label'
+    };
+  },
+  defaultParams: () => {
+    return {};
+  },
+  showAllButton: false
+});
+
+const data = ref<any>([]);
+const tree: Ref<any | null> = ref(null);
+// 当前激活item
+const active: IRecord = inject('active');
+// tree面板变更
+const scrollPanelChange: IRecord = inject('scrollPanelChange');
+// tree 列表
+const treeList: IRecord = inject('treeList');
+
+watch(
+  () => scrollPanelChange.value,
+  () => {
+    scrollPanelChange.value && getDataList();
+  }
+);
+
+const getDataList = async (params = {}) => {
+  const query = Object.assign(params, props.defaultParams);
+  const serverData = (await getServiceApi().get(props.url, query)) as IResponseData;
+  data.value = serverData.list || serverData;
+  treeList.value = serverData.list || serverData;
+  active.value = serverData.list ? serverData.list[0] : serverData[0];
+  nextTick(() => {
+    tree.value && tree?.value.setCurrentKey(active.value?.id || '');
+  });
+  scrollPanelChange.value = false;
+};
+const handleNodeClick = (row: any) => {
+  active.value = row;
+};
+
+const handleClickPanel = () => {
+  active.value = {};
+};
+
+const handleExpand = (array, expanded) => {
+  array.forEach(el => {
+    tree.value.store.nodesMap[el.id].expanded = expanded;
+    if (el.children?.length) {
+      handleExpand(el.children, expanded);
+    }
+  });
+  console.log('[ tree.value ] >', tree.value);
+};
+
+const onRefresh = () => {
+  getDataList();
+};
+defineExpose({
+  onRefresh
+});
+getDataList();
+</script>
+
+<style lang="scss">
+.u-scroll-panel {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+  background: #fff;
+
+  .u-panel-header {
+    display: flex;
+    align-items: center;
+    padding: 10px;
+    border-bottom: 1px solid #eee;
+
+    h2 {
+      // display: box;
+      height: 30px;
+      padding: 0;
+      margin: 0;
+      margin-right: 20px;
+      overflow: hidden;
+      -webkit-line-clamp: 1;
+      font-size: 14px;
+      line-height: 30px;
+      -webkit-box-orient: vertical;
+    }
+
+    .el-input {
+      flex: 1;
+    }
+  }
+
+  .u-panel-content {
+    flex: 1;
+    overflow: auto;
+  }
+
+  .u-tree-panel {
+    height: 100%; // 0630
+    :deep(.el-tree-node__content) {
+      height: 36px;
+    }
+
+    :deep(.el-tree-node.is-current > .el-tree-node__content) {
+      background-color: rgb(64 158 255 / 40%);
+    }
+
+    :deep(.el-tree-node > .el-tree-node__content) {
+      transition: 0.2s;
+    }
+  }
+
+  .el-vl__window {
+    height: 360px !important;
+    // &:first-child {
+    //   height: 100% !important;
+    // }
+  }
+}
+</style>

package/src/components/udp/{grid.vue → grid/index.vue}

@@ -2,11 +2,11 @@
  * @Author: wei.li
  * @Date: 2021-11-17 16:33:37
  * @LastEditors: levi7754 levi7754@163.com
- * @LastEditTime: 2025-08-06 11:53:11
+ * @LastEditTime: 2025-10-29 17:55:12
  * @Description: file content
 -->
 <template>
-  <div style="width: 100%">
+  <div style="width: 100%; height: 100%">
     <vxe-grid
       ref="xgrid"
       v-bind="data"
@@ -17,6 +17,7 @@
       @cell-click="cellClick"
       @cell-dblclick="cellDbclick"
       @edit-activated="editEctivated"
+      @form-reset="onReset"
     />
     <!-- <SearchScheme
       v-if="showModal && props.url"
@@ -46,9 +47,8 @@ import {
   defaultColums,
   onCheckMethod,
   getAttrs
-} from './utils';
+} from '../utils';
 // import SearchScheme from '../components/SuSearch.vue';
-// import type { IRecord, IFormItemProps, ITableColProps } from '../../types';
 
 defineOptions({
   name: 'UtGrid'
@@ -142,7 +142,7 @@ const getColumns = () => {
   }
   const act_columns = attrs.gridId ? formatColums(columns) : columns;
 
-  return i18nColums(act_columns);
+  return i18nColums(act_columns, attrs.sortable);
 };
 
 dbstorage.getItem(kSTORECOLUM).then(value => {
@@ -159,7 +159,7 @@ const data = reactive<VxeGridProps>({
   columnConfig: { useKey: true },
   toolbarConfig: { enabled: false },
   sortConfig: { multiple: true, trigger: 'cell' },
-  height: $mode ? undefined : window.innerHeight - 90,
+  height: $mode ? undefined : window.innerHeight - 92,
 
   checkboxConfig: {
     checkMethod: ({ row }) => onCheckMethod(row, props),
@@ -170,19 +170,20 @@ const data = reactive<VxeGridProps>({
   proxyConfig: {
     form: true, // 查询是需要启用表单代理
     autoLoad: props.autoLoad,
+    showResponseMsgvxe: false,
+    showActionMsgvxe: false,
     // 接收 Promise
     ajax: {
       queryAll: ({ form }) => queryAll(props, serviceApi, form),
-      query: ({ page, form }) => query(props, form, page, serviceApi, $mode),
+      query: ({ page, form, code }) => query(props, form, page, serviceApi, code, $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)
+      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)
     }
   },
   columns: !attrs.gridId ? getColumns() : [],
@@ -316,6 +317,16 @@ const callback = (cb, response) => {
   attrs?.callback && attrs?.callback[cb] && attrs?.callback[cb](response);
 };
 
+const onReset = ({ data }) => {
+  console.log(data);
+  const items = props.items.filter(f => f.itemRender?.props?.multiple);
+  console.log(items);
+  items.forEach(item => {
+    data[`_${item.field}`] = [];
+  });
+  refreshData();
+};
+
 let sortable2: any;
 const columnDrop = () => {
   const $grid = xgrid.value;
@@ -389,11 +400,15 @@ const columnDrop = () => {
  * @description 常用查询面板确认查询
  * @param data 常用查询条件
  */
-const onSearch = data => {
-  showModal.value = false;
-  const { form } = xgrid.value.getProxyInfo();
-  Object.assign(form, data);
-  refreshData();
+// const onSearch = data => {
+//   showModal.value = false;
+//   const { form } = xgrid.value.getProxyInfo();
+//   Object.assign(form, data);
+//   refreshData();
+// };
+
+const reloadGrid = () => {
+  setGridConfig();
 };
 
 /**
@@ -406,7 +421,8 @@ defineExpose({
   refreshColumn,
   getInstance,
   showLoading,
-  hiddenLoading
+  hiddenLoading,
+  reloadGrid
 });
 
 const toolbarButtonClick = ({ code }) => {
@@ -428,13 +444,11 @@ const editEctivated = e => {
 const addResizeListener = () => {
   window.onresize = () => {
     return (() => {
-      console.log('onresize');
-      let height = attrs?.height || window.innerHeight - 90 - 1;
-      if (attrs?.mode === 'form' && !attrs?.height) {
+      let height = attrs?.height || window.innerHeight - 90;
+      if (attrs.mode !== 'inline' && !attrs?.height) {
         height = window.innerHeight - 180;
       }
       data.height = height < 240 ? 240 : height;
-      console.log(data.height);
     })();
   };
 };
@@ -446,7 +460,6 @@ nextTick(() => {
     columnDrop();
   }, 500);
 });
-
 /**
  * @description Vue实例卸载
  */
@@ -488,6 +501,7 @@ const emit = defineEmits<{
       }
     }
   }
+
   .vxe-grid--layout-body-content-wrapper {
     overflow: hidden;
   }

package/src/components/udp/index.ts

@@ -1,10 +1,3 @@
-import UtModalForm2 from './modal-form.vue';
-import FormUpload2 from './form-upload.vue';
-import utLov2 from './lov.vue';
-import UtModalGrid2 from './modal-grid.vue';
-import UtGrid2 from './grid.vue';
-import UtForm2 from './form.vue';
-import UtUpload2 from './upload.vue';
-// import UtCountdown2 from './flip-down/FlipClock/flip-clock.vue';
+import UtGrid2 from './grid/index.vue';
 
-export { UtGrid2, UtModalForm2, FormUpload2, utLov2, UtModalGrid2, UtForm2, UtUpload2 };
+export { UtGrid2 };