项目初始化

web-api/src/main/java/com/jeesite/modules/apps/Module/ChartConfig.java

@@ -0,0 +1,18 @@
+package com.jeesite.modules.apps.Module;
+
+import lombok.Data;
+
+import java.io.Serializable;
+
+@Data
+public class ChartConfig implements Serializable {
+
+    private Integer sort;
+    private String chartId;
+    private String oldChartId;
+    private String chartName;
+
+    private String chartCode;
+    private Integer oldSort;
+    private String color;
+}

web-api/src/main/java/com/jeesite/modules/apps/Module/ErpFlowParams.java

@@ -0,0 +1,15 @@
+package com.jeesite.modules.apps.Module;
+
+import lombok.Data;
+
+import java.io.Serializable;
+
+@Data
+public class ErpFlowParams implements Serializable {
+    private Integer pageNum;
+    private Integer pageSize;
+    private String accountId;
+    private String flowName;
+    private String flowType;
+    private String categoryId;
+}

web-api/src/main/java/com/jeesite/modules/apps/Module/PageResult.java

@@ -0,0 +1,23 @@
+package com.jeesite.modules.apps.Module;
+
+import lombok.Data;
+
+import java.io.Serializable;
+import java.util.List;
+
+@Data
+public class PageResult<T> implements Serializable {
+
+    private List<T> list; // 当前页数据
+    private Integer currentPage; // 当前页码
+    private Integer pageSize; // 每页条数
+    private Integer total; // 总记录数
+
+
+    public PageResult(List<T> list,Integer currentPage,Integer pageSize,Integer total){
+        this.list = list;
+        this.currentPage = currentPage;
+        this.pageSize = pageSize;
+        this.total = total;
+    }
+}

web-api/src/main/java/com/jeesite/modules/biz/web/MyChartInfoController.java

@@ -2,6 +2,7 @@ package com.jeesite.modules.biz.web;
 
 import java.util.List;
 
+import com.jeesite.modules.apps.Module.ChartConfig;
 import jakarta.servlet.http.HttpServletRequest;
 import jakarta.servlet.http.HttpServletResponse;
 
@@ -154,4 +155,16 @@ public class MyChartInfoController extends BaseController {
     public List<MyChartInfo> listAll(MyChartInfo myChartInfo) {
         return myChartInfoService.findList(myChartInfo);
     }
+
+    /**
+     *
+     */
+    @RequestMapping(value = "setting")
+    @ResponseBody
+    public String setting(List<ChartConfig> configs) {
+        for (ChartConfig config : configs) {
+            System.out.println(config);
+        }
+        return renderResult(Global.TRUE, text("配置图表成功！"));
+    }
 }

web-api/src/main/java/com/jeesite/modules/erp/web/ErpTransactionFlowController.java

@@ -1,6 +1,10 @@
 package com.jeesite.modules.erp.web;
 
 import java.util.List;
+
+import com.jeesite.modules.apps.Module.ErpFlowParams;
+import com.jeesite.modules.apps.Module.PageResult;
+import com.jeesite.modules.utils.PageUtil;
 import jakarta.servlet.http.HttpServletRequest;
 import jakarta.servlet.http.HttpServletResponse;
 
@@ -26,6 +30,7 @@ import com.jeesite.modules.erp.service.ErpTransactionFlowService;
 
 /**
  * 收支流水 Controller
+ *
  * @author gaoxq
  * @version 2026-03-22
  */
@@ -143,4 +148,21 @@ public class ErpTransactionFlowController extends BaseController {
         return renderResult(Global.TRUE, text("删除流水成功！"));
     }
 
+    @RequestMapping(value = "FlowList")
+    @ResponseBody
+    public PageResult<ErpTransactionFlow> getFlowList(ErpFlowParams erpFlowParams) {
+        ErpTransactionFlow erpTransactionFlow = new ErpTransactionFlow();
+        erpTransactionFlow.setFlowType(erpFlowParams.getFlowType());
+        erpTransactionFlow.setFlowName(erpFlowParams.getFlowName());
+        erpTransactionFlow.setAccountId(erpFlowParams.getAccountId());
+        erpTransactionFlow.setCategoryId(erpFlowParams.getCategoryId());
+        List<ErpTransactionFlow> list = erpTransactionFlowService.findList(erpTransactionFlow);
+        PageUtil<ErpTransactionFlow> util = new PageUtil<>(erpFlowParams.getPageNum(), erpFlowParams.getPageSize(), list);
+        return new PageResult<>(
+                util.OkData(),
+                util.getCurPage(),
+                util.getPageSize(),
+                util.getTotalCount()
+        );
+    }
 }

web-api/src/main/java/com/jeesite/modules/utils/PageUtil.java

@@ -0,0 +1,44 @@
+package com.jeesite.modules.utils;
+
+
+import lombok.Data;
+
+import java.io.Serializable;
+import java.util.ArrayList;
+import java.util.List;
+
+@Data
+public class PageUtil<T> implements Serializable {
+
+
+    private List<T> data;
+    private Integer curPage;// 当前页
+    private int totalCount;// 总条数
+    private int pageSize; // 每页显示的条数
+
+    //构造数据
+    public PageUtil(int curPage, int pageSize, List<T> data) {
+        this.data = data;
+        this.curPage = curPage;
+        this.pageSize = pageSize;
+        this.totalCount = data.size();
+    }
+
+    public int beginIndex(int pageSize, int curPage) {
+        return pageSize * (curPage - 1);
+    }
+
+    public int endIndex(int pageSize, int curPage) {
+        return (pageSize * curPage) - 1;
+    }
+
+    public List<T> OkData() {
+        List<T> list = new ArrayList<T>();
+        for (int i = beginIndex(pageSize, curPage); i <= endIndex(pageSize, curPage); i++) {
+            if (i < totalCount) {
+                list.add(data.get(i));
+            }
+        }
+        return list;
+    }
+}

web-vue/packages/biz/api/biz/myChartInfo.ts

@@ -43,6 +43,9 @@ export const myChartInfoForm = (params?: MyChartInfo | any) =>
 export const myChartInfoSave = (params?: any, data?: MyChartInfo | any) =>
   defHttp.postJson<MyChartInfo>({ url: adminPath + '/biz/myChartInfo/save', params, data });
 
+export const myChartSetting = (params?: any, data?: MyChartInfo | any) =>
+  defHttp.postJson<MyChartInfo>({ url: adminPath + '/biz/myChartInfo/setting', params, data });
+
 export const myChartInfoImportData = (
   params: UploadFileParams,
   onUploadProgress: (progressEvent: AxiosProgressEvent) => void,

web-vue/packages/core/layouts/screen/setting/components/Erp.vue

@@ -7,8 +7,14 @@
             <div class="chart-top-inner">
               <h2>财务可视化大屏指标配置</h2>
               <div class="btn-group">
-                <el-button type="primary" size="default" @click="handleSave"
+                <el-button
-                :loading="saveLoading" :disabled="saveLoading">保存</el-button>
+                  type="primary"
+                  size="default"
+                  @click="handleSave"
+                  :loading="saveLoading"
+                  :disabled="saveLoading"
+                  >保存</el-button
+                >
                 <el-button type="warning" size="default" @click="handleReset">重置</el-button>
                 <el-button type="danger" size="default" @click="handleClearAll">清空</el-button>
               </div>
@@ -21,15 +27,11 @@
             <div class="work-col work-col-1-3">
               <div class="work-card full-height-card">
                 <span v-if="metric1.length > 0" class="delete-icon" @click.stop="handleDeleteMetric(1)">×</span>
-                <div 
+                <div class="grid-content" @drop="(e) => handleDrop(e, 1)" @dragover="(e) => e.preventDefault()">
-                  class="grid-content" 
-                  @drop="(e) => handleDrop(e, 1)" 
-                  @dragover="(e) => e.preventDefault()"
-                >
                   <div v-if="metric1.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 1 }}</span>
                     {{ metric1[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric1[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric1[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 1 }}）</div>
                 </div>
@@ -38,15 +40,11 @@
             <div class="work-col work-col-1-3">
               <div class="work-card full-height-card">
                 <span v-if="metric2.length > 0" class="delete-icon" @click.stop="handleDeleteMetric(2)">×</span>
-                <div 
+                <div class="grid-content" @drop="(e) => handleDrop(e, 2)" @dragover="(e) => e.preventDefault()">
-                  class="grid-content" 
-                  @drop="(e) => handleDrop(e, 2)" 
-                  @dragover="(e) => e.preventDefault()"
-                >
                   <div v-if="metric2.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 2 }}</span>
                     {{ metric2[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric2[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric2[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 2 }}）</div>
                 </div>
@@ -55,15 +53,11 @@
             <div class="work-col work-col-1-3">
               <div class="work-card full-height-card">
                 <span v-if="metric3.length > 0" class="delete-icon" @click.stop="handleDeleteMetric(3)">×</span>
-                <div 
+                <div class="grid-content" @drop="(e) => handleDrop(e, 3)" @dragover="(e) => e.preventDefault()">
-                  class="grid-content" 
-                  @drop="(e) => handleDrop(e, 3)" 
-                  @dragover="(e) => e.preventDefault()"
-                >
                   <div v-if="metric3.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 3 }}</span>
                     {{ metric3[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric3[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric3[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 3 }}）</div>
                 </div>
@@ -76,15 +70,11 @@
                 <div class="work-col work-col-1-2">
                   <div class="work-card full-height-card">
                     <span v-if="metric4.length > 0" class="delete-icon" @click.stop="handleDeleteMetric(4)">×</span>
-                    <div 
+                    <div class="grid-content" @drop="(e) => handleDrop(e, 4)" @dragover="(e) => e.preventDefault()">
-                      class="grid-content" 
-                      @drop="(e) => handleDrop(e, 4)" 
-                      @dragover="(e) => e.preventDefault()"
-                    >
                       <div v-if="metric4.length > 0" class="metric-tag">
                         <span class="sort-num">指标{{ 4 }}</span>
                         {{ metric4[0].chartName }}
-                        <small style="font-size:12px; color:#88a0c2;">ID: {{ metric4[0].chartId }}</small>
+                        <small style="font-size: 12px; color: #88a0c2">ID: {{ metric4[0].chartId }}</small>
                       </div>
                       <div v-else class="empty-tip">拖拽指标到此处（指标{{ 4 }}）</div>
                     </div>
@@ -93,15 +83,11 @@
                 <div class="work-col work-col-1-2">
                   <div class="work-card full-height-card">
                     <span v-if="metric5.length > 0" class="delete-icon" @click.stop="handleDeleteMetric(5)">×</span>
-                    <div 
+                    <div class="grid-content" @drop="(e) => handleDrop(e, 5)" @dragover="(e) => e.preventDefault()">
-                      class="grid-content" 
-                      @drop="(e) => handleDrop(e, 5)" 
-                      @dragover="(e) => e.preventDefault()"
-                    >
                       <div v-if="metric5.length > 0" class="metric-tag">
                         <span class="sort-num">指标{{ 5 }}</span>
                         {{ metric5[0].chartName }}
-                        <small style="font-size:12px; color:#88a0c2;">ID: {{ metric5[0].chartId }}</small>
+                        <small style="font-size: 12px; color: #88a0c2">ID: {{ metric5[0].chartId }}</small>
                       </div>
                       <div v-else class="empty-tip">拖拽指标到此处（指标{{ 5 }}）</div>
                     </div>
@@ -112,15 +98,11 @@
             <div class="work-col work-col-1-2">
               <div class="work-card full-height-card">
                 <span v-if="metric6.length > 0" class="delete-icon" @click.stop="handleDeleteMetric(6)">×</span>
-                <div 
+                <div class="grid-content" @drop="(e) => handleDrop(e, 6)" @dragover="(e) => e.preventDefault()">
-                  class="grid-content" 
-                  @drop="(e) => handleDrop(e, 6)" 
-                  @dragover="(e) => e.preventDefault()"
-                >
                   <div v-if="metric6.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 6 }}</span>
                     {{ metric6[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric6[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric6[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 6 }}）</div>
                 </div>
@@ -134,15 +116,11 @@
                 <div class="work-col work-col-1-2">
                   <div class="work-card full-height-card">
                     <span v-if="metric7.length > 0" class="delete-icon" @click.stop="handleDeleteMetric(7)">×</span>
-                    <div 
+                    <div class="grid-content" @drop="(e) => handleDrop(e, 7)" @dragover="(e) => e.preventDefault()">
-                      class="grid-content" 
-                      @drop="(e) => handleDrop(e, 7)" 
-                      @dragover="(e) => e.preventDefault()"
-                    >
                       <div v-if="metric7.length > 0" class="metric-tag">
                         <span class="sort-num">指标{{ 7 }}</span>
                         {{ metric7[0].chartName }}
-                        <small style="font-size:12px; color:#88a0c2;">ID: {{ metric7[0].chartId }}</small>
+                        <small style="font-size: 12px; color: #88a0c2">ID: {{ metric7[0].chartId }}</small>
                       </div>
                       <div v-else class="empty-tip">拖拽指标到此处（指标{{ 7 }}）</div>
                     </div>
@@ -151,15 +129,11 @@
                 <div class="work-col work-col-1-2">
                   <div class="work-card full-height-card">
                     <span v-if="metric8.length > 0" class="delete-icon" @click.stop="handleDeleteMetric(8)">×</span>
-                    <div 
+                    <div class="grid-content" @drop="(e) => handleDrop(e, 8)" @dragover="(e) => e.preventDefault()">
-                      class="grid-content" 
-                      @drop="(e) => handleDrop(e, 8)" 
-                      @dragover="(e) => e.preventDefault()"
-                    >
                       <div v-if="metric8.length > 0" class="metric-tag">
                         <span class="sort-num">指标{{ 8 }}</span>
                         {{ metric8[0].chartName }}
-                        <small style="font-size:12px; color:#88a0c2;">ID: {{ metric8[0].chartId }}</small>
+                        <small style="font-size: 12px; color: #88a0c2">ID: {{ metric8[0].chartId }}</small>
                       </div>
                       <div v-else class="empty-tip">拖拽指标到此处（指标{{ 8 }}）</div>
                     </div>
@@ -170,15 +144,11 @@
             <div class="work-col work-col-1-2">
               <div class="work-card full-height-card">
                 <span v-if="metric9.length > 0" class="delete-icon" @click.stop="handleDeleteMetric(9)">×</span>
-                <div 
+                <div class="grid-content" @drop="(e) => handleDrop(e, 9)" @dragover="(e) => e.preventDefault()">
-                  class="grid-content" 
-                  @drop="(e) => handleDrop(e, 9)" 
-                  @dragover="(e) => e.preventDefault()"
-                >
                   <div v-if="metric9.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 9 }}</span>
                     {{ metric9[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric9[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric9[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 9 }}）</div>
                 </div>
@@ -214,33 +184,46 @@
 <script lang="ts" setup name="ViewsBizMyScreenErpSetting">
   import { ref, computed, onMounted } from 'vue';
   import { ElMessage, ElButton, ElInput } from 'element-plus';
-import { MyChartInfo, myChartInfoListAll } from '@jeesite/biz/api/biz/myChartInfo';
+  import { MyChartInfo, myChartSetting, myChartInfoListAll } from '@jeesite/biz/api/biz/myChartInfo';
 
-const metric1 = ref([]);
+  type MetricItem = MyChartInfo & {
-const metric2 = ref([]);
+    oldSort?: number;
-const metric3 = ref([]);
+    fixedOldChartId?: string | number | null;
-const metric4 = ref([]);
+    oldChartId?: string | number | null;
-const metric5 = ref([]);
+  };
-const metric6 = ref([]);
+
-const metric7 = ref([]);
+  const metric1 = ref<MetricItem[]>([]);
-const metric8 = ref([]);
+  const metric2 = ref<MetricItem[]>([]);
-const metric9 = ref([]);
+  const metric3 = ref<MetricItem[]>([]);
+  const metric4 = ref<MetricItem[]>([]);
+  const metric5 = ref<MetricItem[]>([]);
+  const metric6 = ref<MetricItem[]>([]);
+  const metric7 = ref<MetricItem[]>([]);
+  const metric8 = ref<MetricItem[]>([]);
+  const metric9 = ref<MetricItem[]>([]);
 
   const gridOriginalChartId = ref({
-  1: null, 2: null, 3: null, 4: null,
+    1: null,
-  5: null, 6: null, 7: null, 8: null, 9: null
+    2: null,
+    3: null,
+    4: null,
+    5: null,
+    6: null,
+    7: null,
+    8: null,
+    9: null,
   });
   const metricHistory = ref({});
 
   const saveLoading = ref(false);
-const rawChartData = ref<MyChartInfo[]>();
+  const rawChartData = ref<MyChartInfo[]>([]);
   const searchKey = ref('');
-const dragItem = ref(null);
+  const dragItem = ref<MetricItem | null>(null);
 
   const allMetricList = computed({
     get() {
       if (!rawChartData.value || !Array.isArray(rawChartData.value)) return [];
-    return rawChartData.value.filter(item => {
+      return rawChartData.value.filter((item) => {
         if (!item || !item.chartName) return false;
         const searchVal = searchKey.value ? searchKey.value.toLowerCase() : '';
         const nameVal = item.chartName ? item.chartName.toLowerCase() : '';
@@ -249,26 +232,21 @@ const allMetricList = computed({
     },
     set(val) {
       rawChartData.value = val;
-  }
+    },
   });
 
-const getAllMetricArrays = () => ([
+  const getAllMetricArrays = () => [metric1, metric2, metric3, metric4, metric5, metric6, metric7, metric8, metric9];
-  metric1, metric2, metric3, metric4, 
-  metric5, metric6, metric7, metric8, metric9
-]);
 
-const getMetricArrByGridNum = (gridNum) => {
+  const getMetricArrByGridNum = (gridNum: number) => {
     return getAllMetricArrays()[gridNum - 1];
   };
 
-const isMetricUsed = (metricId) => {
+  const isMetricUsed = (metricId: string) => {
     if (!metricId) return false;
-  return getAllMetricArrays().some(
+    return getAllMetricArrays().some((metricArr) => metricArr.value.some((m) => m && m.chartId === metricId));
-    metricArr => metricArr.value.some(m => m && m.chartId === metricId)
-  );
   };
 
-const findGridNumByChartId = (chartId) => {
+  const findGridNumByChartId = (chartId: string) => {
     const arr = getAllMetricArrays();
     for (let i = 0; i < arr.length; i++) {
       if (arr[i].value.length && arr[i].value[0].chartId === chartId) {
@@ -300,7 +278,7 @@ const handleDrop = (e, gridNum) => {
 
     getAllMetricArrays().forEach((arr, index) => {
       const pos = index + 1;
-    if (pos !== gridNum && arr.value.some(item => item.chartId === currentChartId)) {
+      if (pos !== gridNum && arr.value.some((item) => item.chartId === currentChartId)) {
         arr.value = [];
       }
     });
@@ -313,7 +291,7 @@ const handleDrop = (e, gridNum) => {
       sort: gridNum,
       oldSort: oldSort,
       fixedOldChartId: oldChartId,
-    oldChartId: oldChartId
+      oldChartId: oldChartId,
     };
 
     targetArr.value = [newItem];
@@ -321,7 +299,7 @@ const handleDrop = (e, gridNum) => {
     dragItem.value = null;
   };
 
-const handleDeleteMetric = (gridNum) => {
+  const handleDeleteMetric = (gridNum: any) => {
     const targetArr = getMetricArrByGridNum(gridNum);
     if (targetArr) {
       targetArr.value = [];
@@ -329,20 +307,21 @@ const handleDeleteMetric = (gridNum) => {
   };
 
   const handleReset = () => {
-  getAllMetricArrays().forEach(arr => arr.value = []);
+    getAllMetricArrays().forEach((arr) => (arr.value = []));
     searchKey.value = '';
     getChartList();
     ElMessage.info('已重置所有指标');
   };
 
   const handleClearAll = () => {
-  getAllMetricArrays().forEach(arr => arr.value = []);
+    getAllMetricArrays().forEach((arr) => (arr.value = []));
     ElMessage.info('已清空所有格子');
   };
 
   const handleSave = async () => {
     saveLoading.value = true;
-  const saveData = getAllMetricArrays().map((arr, index) => {
+    const saveData = getAllMetricArrays()
+      .map((arr, index) => {
         const gridNum = index + 1;
         const currentItem = arr.value[0];
         return {
@@ -352,13 +331,15 @@ const handleSave = async () => {
           chartName: currentItem?.chartName || '',
           chartCode: 'erp',
           oldSort: currentItem?.oldSort || gridNum,
-      color: currentItem?.color || ''
+          color: currentItem?.color || '',
         };
-  }).filter(item => item.chartId);
+      })
+      .filter((item) => item.chartId);
 
     try {
-    const res = await getChartSetting(saveData);
+		console.log(saveData);
-    ElMessage.success(res?.msg);
+      // const res = await myChartSetting(saveData);
+      // ElMessage.success(res?.msg);
       return saveData;
     } catch (error) {
       console.error('保存失败：', error);
@@ -380,23 +361,25 @@ async function getChartList() {
       rawChartData.value = res || [];
 
       metricHistory.value = {};
-    Object.keys(gridOriginalChartId.value).forEach(key => {
+      Object.keys(gridOriginalChartId.value).forEach((key) => {
         gridOriginalChartId.value[key] = null;
       });
 
-    rawChartData.value.forEach(item => {
+      rawChartData.value.forEach((item) => {
         const sortNum = item.sort || 0;
         if (sortNum >= 1 && sortNum <= 9) {
           const targetArr = getMetricArrByGridNum(sortNum);
           if (targetArr) {
             gridOriginalChartId.value[sortNum] = item.chartId;
-          targetArr.value = [{
+            targetArr.value = [
+              {
                 ...item,
                 sort: sortNum,
                 oldSort: 0,
                 fixedOldChartId: item.chartId,
-            oldChartId: item.chartId
+                oldChartId: item.chartId,
-          }];
+              },
+            ];
             metricHistory.value[item.chartId] = sortNum;
           }
         }

web-vue/packages/core/layouts/screen/setting/components/Home.vue

@@ -7,8 +7,14 @@
             <div class="chart-top-inner">
               <h2>首页可视化大屏指标配置</h2>
               <div class="btn-group">
-                <el-button type="primary" size="default" @click="handleSave"
+                <el-button
-                :loading="saveLoading" :disabled="saveLoading">保存</el-button>
+                  type="primary"
+                  size="default"
+                  @click="handleSave"
+                  :loading="saveLoading"
+                  :disabled="saveLoading"
+                  >保存</el-button
+                >
                 <el-button type="warning" size="default" @click="handleReset">重置</el-button>
                 <el-button type="danger" size="default" @click="handleClearAll">清空</el-button>
               </div>
@@ -25,7 +31,7 @@
                   <div v-if="metric1.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 1 }}</span>
                     {{ metric1[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric1[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric1[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 1 }}）</div>
                 </div>
@@ -38,7 +44,7 @@
                   <div v-if="metric2.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 2 }}</span>
                     {{ metric2[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric2[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric2[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 2 }}）</div>
                 </div>
@@ -51,7 +57,7 @@
                   <div v-if="metric3.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 3 }}</span>
                     {{ metric3[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric3[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric3[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 3 }}）</div>
                 </div>
@@ -67,7 +73,7 @@
                   <div v-if="metric4.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 4 }}</span>
                     {{ metric4[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric4[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric4[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 4 }}）</div>
                 </div>
@@ -80,7 +86,7 @@
                   <div v-if="metric5.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 5 }}</span>
                     {{ metric5[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric5[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric5[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 5 }}）</div>
                 </div>
@@ -96,7 +102,7 @@
                   <div v-if="metric6.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 6 }}</span>
                     {{ metric6[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric6[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric6[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 6 }}）</div>
                 </div>
@@ -109,7 +115,7 @@
                   <div v-if="metric7.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 7 }}</span>
                     {{ metric7[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric7[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric7[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 7 }}）</div>
                 </div>
@@ -124,7 +130,15 @@
           <el-input v-model="searchKey" placeholder="搜索指标项..." size="default"></el-input>
         </div>
         <div class="metric-list">
-          <div v-for="item in allMetricList" :key="item.chartId" class="metric-item" :class="{ active: isMetricUsed(item.chartId) }" draggable="true" @dragstart="(e) => handleDragStart(e, item)" @dragend="handleDragEnd">
+          <div
+            v-for="item in allMetricList"
+            :key="item.chartId"
+            class="metric-item"
+            :class="{ active: isMetricUsed(item.chartId) }"
+            draggable="true"
+            @dragstart="(e) => handleDragStart(e, item)"
+            @dragend="handleDragEnd"
+          >
             <span>{{ item.chartName }}</span>
             <span class="color-dot" :style="{ backgroundColor: item.color || getRandomColor() }"></span>
           </div>
@@ -137,31 +151,41 @@
 <script lang="ts" setup name="ViewsBizMyScreenHomeSetting">
   import { ref, computed, onMounted } from 'vue';
   import { ElMessage, ElButton, ElInput } from 'element-plus';
-import { MyChartInfo, myChartInfoListAll } from '@jeesite/biz/api/biz/myChartInfo';
+  import { MyChartInfo, myChartSetting, myChartInfoListAll } from '@jeesite/biz/api/biz/myChartInfo';
 
-const metric1 = ref([]);
+  type MetricItem = MyChartInfo & {
-const metric2 = ref([]);
+    oldSort?: number;
-const metric3 = ref([]);
+    oldChartId?: string | number | null;
-const metric4 = ref([]);
+  };
-const metric5 = ref([]);
+
-const metric6 = ref([]);
+  const metric1 = ref<MetricItem[]>([]);
-const metric7 = ref([]);
+  const metric2 = ref<MetricItem[]>([]);
+  const metric3 = ref<MetricItem[]>([]);
+  const metric4 = ref<MetricItem[]>([]);
+  const metric5 = ref<MetricItem[]>([]);
+  const metric6 = ref<MetricItem[]>([]);
+  const metric7 = ref<MetricItem[]>([]);
 
   const gridOriginalChartId = ref({
-  1: null, 2: null, 3: null,
+    1: null,
-  4: null, 5: null, 6: null, 7: null
+    2: null,
+    3: null,
+    4: null,
+    5: null,
+    6: null,
+    7: null,
   });
   const metricHistory = ref({});
 
   const saveLoading = ref(false);
-const rawChartData = ref<MyChartInfo[]>();
+  const rawChartData = ref<MyChartInfo[]>([]);
   const searchKey = ref('');
-const dragItem = ref(null);
+  const dragItem = ref<MetricItem | null>(null);
 
   const allMetricList = computed({
     get() {
       if (!rawChartData.value || !Array.isArray(rawChartData.value)) return [];
-    return rawChartData.value.filter(item => {
+      return rawChartData.value.filter((item) => {
         if (!item || !item.chartName) return false;
         const searchVal = searchKey.value ? searchKey.value.toLowerCase() : '';
         const nameVal = item.chartName ? item.chartName.toLowerCase() : '';
@@ -170,26 +194,21 @@ const allMetricList = computed({
     },
     set(val) {
       rawChartData.value = val;
-  }
+    },
   });
 
-const getAllMetricArrays = () => ([
+  const getAllMetricArrays = () => [metric1, metric2, metric3, metric4, metric5, metric6, metric7];
-  metric1, metric2, metric3,
-  metric4, metric5, metric6, metric7
-]);
 
-const getMetricArrByGridNum = (gridNum) => {
+  const getMetricArrByGridNum = (gridNum: number) => {
     return getAllMetricArrays()[gridNum - 1];
   };
 
-const isMetricUsed = (metricId) => {
+  const isMetricUsed = (metricId: any) => {
     if (!metricId) return false;
-  return getAllMetricArrays().some(
+    return getAllMetricArrays().some((metricArr) => metricArr.value.some((m) => m && m.chartId === metricId));
-    metricArr => metricArr.value.some(m => m && m.chartId === metricId)
-  );
   };
 
-const findGridNumByChartId = (chartId) => {
+  const findGridNumByChartId = (chartId: any) => {
     const arr = getAllMetricArrays();
     for (let i = 0; i < arr.length; i++) {
       if (arr[i].value.length && arr[i].value[0].chartId === chartId) {
@@ -222,7 +241,7 @@ const handleDrop = (e, targetGrid) => {
     getAllMetricArrays().forEach((arr, index) => {
       const gridNum = index + 1;
       if (gridNum !== targetGrid) {
-      arr.value = arr.value.filter(i => i.chartId !== dragChartId);
+        arr.value = arr.value.filter((i) => i.chartId !== dragChartId);
       }
     });
 
@@ -250,20 +269,21 @@ const handleDeleteMetric = (gridNum) => {
   };
 
   const handleReset = () => {
-  getAllMetricArrays().forEach(arr => arr.value = []);
+    getAllMetricArrays().forEach((arr) => (arr.value = []));
     searchKey.value = '';
     getChartList();
     ElMessage.info('已重置所有指标');
   };
 
   const handleClearAll = () => {
-  getAllMetricArrays().forEach(arr => arr.value = []);
+    getAllMetricArrays().forEach((arr) => (arr.value = []));
     ElMessage.info('已清空所有格子');
   };
 
   const handleSave = async () => {
     saveLoading.value = true;
-  const saveData = getAllMetricArrays().map((arr, index) => {
+    const saveData = getAllMetricArrays()
+      .map((arr, index) => {
         const gridNum = index + 1;
         const currentItem = arr.value[0];
         return {
@@ -273,12 +293,13 @@ const handleSave = async () => {
           chartName: currentItem?.chartName || '',
           chartCode: 'home',
           oldSort: currentItem?.oldSort || gridNum,
-      color: currentItem?.color || ''
+          color: currentItem?.color || '',
         };
-  }).filter(item => item.chartId);
+      })
+      .filter((item) => item.chartId);
 
     try {
-    const res = await getChartSetting(saveData);
+      const res = await myChartSetting(saveData);
       ElMessage.success(res?.msg);
       return saveData;
     } catch (error) {
@@ -300,22 +321,24 @@ async function getChartList() {
       const res = await myChartInfoListAll(reqParams);
       rawChartData.value = res || [];
       metricHistory.value = {};
-    Object.keys(gridOriginalChartId.value).forEach(key => {
+      Object.keys(gridOriginalChartId.value).forEach((key) => {
         gridOriginalChartId.value[key] = null;
       });
-    rawChartData.value.forEach(item => {
+      rawChartData.value.forEach((item) => {
         const sortNum = item.sort || 0;
         if (sortNum >= 1 && sortNum <= 7) {
           const targetArr = getMetricArrByGridNum(sortNum);
           if (targetArr) {
             gridOriginalChartId.value[sortNum] = item.chartId;
-          targetArr.value = [{
+            targetArr.value = [
+              {
                 ...item,
                 sort: sortNum,
                 oldSort: 0,
                 chartId: item.chartId,
-            oldChartId: item.chartId
+                oldChartId: item.chartId,
-          }];
+              },
+            ];
             metricHistory.value[item.chartId] = sortNum;
           }
         }

web-vue/packages/core/layouts/screen/setting/components/Sys.vue

@@ -7,8 +7,14 @@
             <div class="chart-top-inner">
               <h2>系统可视化大屏指标配置</h2>
               <div class="btn-group">
-                <el-button type="primary" size="default" @click="handleSave"
+                <el-button
-                :loading="saveLoading" :disabled="saveLoading">保存</el-button>
+                  type="primary"
+                  size="default"
+                  @click="handleSave"
+                  :loading="saveLoading"
+                  :disabled="saveLoading"
+                  >保存</el-button
+                >
                 <el-button type="warning" size="default" @click="handleReset">重置</el-button>
                 <el-button type="danger" size="default" @click="handleClearAll">清空</el-button>
               </div>
@@ -25,7 +31,7 @@
                   <div v-if="metric1.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 1 }}</span>
                     {{ metric1[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric1[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric1[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 1 }}）</div>
                 </div>
@@ -38,7 +44,7 @@
                   <div v-if="metric2.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 2 }}</span>
                     {{ metric2[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric2[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric2[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 2 }}）</div>
                 </div>
@@ -51,7 +57,7 @@
                   <div v-if="metric3.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 3 }}</span>
                     {{ metric3[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric3[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric3[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 3 }}）</div>
                 </div>
@@ -66,7 +72,7 @@
                   <div v-if="metric4.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 4 }}</span>
                     {{ metric4[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric4[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric4[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 4 }}）</div>
                 </div>
@@ -79,7 +85,7 @@
                   <div v-if="metric5.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 5 }}</span>
                     {{ metric5[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric5[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric5[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 5 }}）</div>
                 </div>
@@ -92,7 +98,7 @@
                   <div v-if="metric6.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 6 }}</span>
                     {{ metric6[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric6[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric6[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 6 }}）</div>
                 </div>
@@ -107,7 +113,7 @@
                   <div v-if="metric7.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 7 }}</span>
                     {{ metric7[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric7[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric7[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 7 }}）</div>
                 </div>
@@ -120,7 +126,7 @@
                   <div v-if="metric8.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 8 }}</span>
                     {{ metric8[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric8[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric8[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 8 }}）</div>
                 </div>
@@ -133,7 +139,7 @@
                   <div v-if="metric9.length > 0" class="metric-tag">
                     <span class="sort-num">指标{{ 9 }}</span>
                     {{ metric9[0].chartName }}
-                    <small style="font-size:12px; color:#88a0c2;">ID: {{ metric9[0].chartId }}</small>
+                    <small style="font-size: 12px; color: #88a0c2">ID: {{ metric9[0].chartId }}</small>
                   </div>
                   <div v-else class="empty-tip">拖拽指标到此处（指标{{ 9 }}）</div>
                 </div>
@@ -147,7 +153,15 @@
           <el-input v-model="searchKey" placeholder="搜索指标项..." size="default"></el-input>
         </div>
         <div class="metric-list">
-          <div v-for="item in allMetricList" :key="item.chartId" class="metric-item" :class="{ active: isMetricUsed(item.chartId) }" draggable="true" @dragstart="(e) => handleDragStart(e, item)" @dragend="handleDragEnd">
+          <div
+            v-for="item in allMetricList"
+            :key="item.chartId"
+            class="metric-item"
+            :class="{ active: isMetricUsed(item.chartId) }"
+            draggable="true"
+            @dragstart="(e) => handleDragStart(e, item)"
+            @dragend="handleDragEnd"
+          >
             <span>{{ item.chartName }}</span>
             <span class="color-dot" :style="{ backgroundColor: item.color || getRandomColor() }"></span>
           </div>
@@ -160,33 +174,45 @@
 <script lang="ts" setup name="ViewsBizMyScreenSysSetting">
   import { ref, computed, onMounted } from 'vue';
   import { ElMessage, ElButton, ElInput } from 'element-plus';
-import { MyChartInfo, myChartInfoListAll } from '@jeesite/biz/api/biz/myChartInfo';
+  import { MyChartInfo, myChartSetting, myChartInfoListAll } from '@jeesite/biz/api/biz/myChartInfo';
 
-const metric1 = ref([]);
+  type MetricItem = MyChartInfo & {
-const metric2 = ref([]);
+    oldSort?: number;
-const metric3 = ref([]);
+    oldChartId?: string | number | null;
-const metric4 = ref([]);
+  };
-const metric5 = ref([]);
+
-const metric6 = ref([]);
+  const metric1 = ref<MetricItem[]>([]);
-const metric7 = ref([]);
+  const metric2 = ref<MetricItem[]>([]);
-const metric8 = ref([]);
+  const metric3 = ref<MetricItem[]>([]);
-const metric9 = ref([]);
+  const metric4 = ref<MetricItem[]>([]);
+  const metric5 = ref<MetricItem[]>([]);
+  const metric6 = ref<MetricItem[]>([]);
+  const metric7 = ref<MetricItem[]>([]);
+  const metric8 = ref<MetricItem[]>([]);
+  const metric9 = ref<MetricItem[]>([]);
 
   const gridOriginalChartId = ref({
-  1: null, 2: null, 3: null, 4: null,
+    1: null,
-  5: null, 6: null, 7: null, 8: null, 9: null
+    2: null,
+    3: null,
+    4: null,
+    5: null,
+    6: null,
+    7: null,
+    8: null,
+    9: null,
   });
   const metricHistory = ref({});
 
   const saveLoading = ref(false);
-const rawChartData = ref<MyChartInfo[]>();
+  const rawChartData = ref<MyChartInfo[]>([]);
   const searchKey = ref('');
-const dragItem = ref(null);
+  const dragItem = ref<MetricItem | null>(null);
 
   const allMetricList = computed({
     get() {
       if (!rawChartData.value || !Array.isArray(rawChartData.value)) return [];
-    return rawChartData.value.filter(item => {
+      return rawChartData.value.filter((item) => {
         if (!item || !item.chartName) return false;
         const searchVal = searchKey.value ? searchKey.value.toLowerCase() : '';
         const nameVal = item.chartName ? item.chartName.toLowerCase() : '';
@@ -195,26 +221,21 @@ const allMetricList = computed({
     },
     set(val) {
       rawChartData.value = val;
-  }
+    },
   });
 
-const getAllMetricArrays = () => ([
+  const getAllMetricArrays = () => [metric1, metric2, metric3, metric4, metric5, metric6, metric7, metric8, metric9];
-  metric1, metric2, metric3, metric4, 
-  metric5, metric6, metric7, metric8, metric9
-]);
 
-const getMetricArrByGridNum = (gridNum) => {
+  const getMetricArrByGridNum = (gridNum: number) => {
     return getAllMetricArrays()[gridNum - 1];
   };
 
-const isMetricUsed = (metricId) => {
+  const isMetricUsed = (metricId: string) => {
     if (!metricId) return false;
-  return getAllMetricArrays().some(
+    return getAllMetricArrays().some((metricArr) => metricArr.value.some((m) => m && m.chartId === metricId));
-    metricArr => metricArr.value.some(m => m && m.chartId === metricId)
-  );
   };
 
-const findGridNumByChartId = (chartId) => {
+  const findGridNumByChartId = (chartId: string) => {
     const arr = getAllMetricArrays();
     for (let i = 0; i < arr.length; i++) {
       if (arr[i].value.length && arr[i].value[0].chartId === chartId) {
@@ -247,7 +268,7 @@ const handleDrop = (e, targetGrid) => {
     getAllMetricArrays().forEach((arr, index) => {
       const gridNum = index + 1;
       if (gridNum !== targetGrid) {
-      arr.value = arr.value.filter(i => i.chartId !== dragChartId);
+        arr.value = arr.value.filter((i) => i.chartId !== dragChartId);
       }
     });
 
@@ -276,20 +297,21 @@ const handleDeleteMetric = (gridNum) => {
   };
 
   const handleReset = () => {
-  getAllMetricArrays().forEach(arr => arr.value = []);
+    getAllMetricArrays().forEach((arr) => (arr.value = []));
     searchKey.value = '';
     getChartList();
     ElMessage.info('已重置所有指标');
   };
 
   const handleClearAll = () => {
-  getAllMetricArrays().forEach(arr => arr.value = []);
+    getAllMetricArrays().forEach((arr) => (arr.value = []));
     ElMessage.info('已清空所有格子');
   };
 
   const handleSave = async () => {
     saveLoading.value = true;
-  const saveData = getAllMetricArrays().map((arr, index) => {
+    const saveData = getAllMetricArrays()
+      .map((arr, index) => {
         const gridNum = index + 1;
         const currentItem = arr.value[0];
         return {
@@ -299,12 +321,13 @@ const handleSave = async () => {
           chartName: currentItem?.chartName || '',
           chartCode: 'sys',
           oldSort: currentItem?.oldSort || gridNum,
-      color: currentItem?.color || ''
+          color: currentItem?.color || '',
         };
-  }).filter(item => item.chartId);
+      })
+      .filter((item) => item.chartId);
 
     try {
-    const res = await getChartSetting(saveData);
+      const res = await myChartSetting(saveData);
       ElMessage.success(res?.msg);
       return saveData;
     } catch (error) {
@@ -326,22 +349,24 @@ async function getChartList() {
       const res = await myChartInfoListAll(reqParams);
       rawChartData.value = res || [];
       metricHistory.value = {};
-    Object.keys(gridOriginalChartId.value).forEach(key => {
+      Object.keys(gridOriginalChartId.value).forEach((key) => {
         gridOriginalChartId.value[key] = null;
       });
-    rawChartData.value.forEach(item => {
+      rawChartData.value.forEach((item) => {
         const sortNum = item.sort || 0;
         if (sortNum >= 1 && sortNum <= 9) {
           const targetArr = getMetricArrByGridNum(sortNum);
           if (targetArr) {
             gridOriginalChartId.value[sortNum] = item.chartId;
-          targetArr.value = [{
+            targetArr.value = [
+              {
                 ...item,
                 sort: sortNum,
                 oldSort: 0,
                 chartId: item.chartId,
-            oldChartId: item.chartId
+                oldChartId: item.chartId,
-          }];
+              },
+            ];
             metricHistory.value[item.chartId] = sortNum;
           }
         }

web-vue/packages/core/layouts/screen/setting/components/Work.vue

@@ -7,7 +7,14 @@
             <div class="chart-top-inner">
               <h2>工作可视化大屏指标配置</h2>
               <div class="btn-group">
-                <el-button type="primary" size="default" @click="handleSave" :loading="saveLoading" :disabled="saveLoading">保存</el-button>
+                <el-button
+                  type="primary"
+                  size="default"
+                  @click="handleSave"
+                  :loading="saveLoading"
+                  :disabled="saveLoading"
+                  >保存</el-button
+                >
                 <el-button type="warning" size="default" @click="handleReset">重置</el-button>
                 <el-button type="danger" size="default" @click="handleClearAll">清空</el-button>
               </div>
@@ -22,7 +29,7 @@
                 <div v-if="metric1.length > 0" class="metric-tag">
                   <span class="sort-num">指标{{ 1 }}</span>
                   {{ metric1[0].chartName }}
-                  <small style="font-size:12px; color:#88a0c2;">ID: {{ metric1[0].chartId }}</small>
+                  <small style="font-size: 12px; color: #88a0c2">ID: {{ metric1[0].chartId }}</small>
                 </div>
                 <div v-else class="empty-tip">拖拽指标到此处（指标{{ 1 }}）</div>
               </div>
@@ -33,7 +40,7 @@
                 <div v-if="metric2.length > 0" class="metric-tag">
                   <span class="sort-num">指标{{ 2 }}</span>
                   {{ metric2[0].chartName }}
-                  <small style="font-size:12px; color:#88a0c2;">ID: {{ metric2[0].chartId }}</small>
+                  <small style="font-size: 12px; color: #88a0c2">ID: {{ metric2[0].chartId }}</small>
                 </div>
                 <div v-else class="empty-tip">拖拽指标到此处（指标{{ 2 }}）</div>
               </div>
@@ -44,7 +51,7 @@
                 <div v-if="metric3.length > 0" class="metric-tag">
                   <span class="sort-num">指标{{ 3 }}</span>
                   {{ metric3[0].chartName }}
-                  <small style="font-size:12px; color:#88a0c2;">ID: {{ metric3[0].chartId }}</small>
+                  <small style="font-size: 12px; color: #88a0c2">ID: {{ metric3[0].chartId }}</small>
                 </div>
                 <div v-else class="empty-tip">拖拽指标到此处（指标{{ 3 }}）</div>
               </div>
@@ -57,7 +64,7 @@
                 <div v-if="metric4.length > 0" class="metric-tag">
                   <span class="sort-num">指标{{ 4 }}</span>
                   {{ metric4[0].chartName }}
-                  <small style="font-size:12px; color:#88a0c2;">ID: {{ metric4[0].chartId }}</small>
+                  <small style="font-size: 12px; color: #88a0c2">ID: {{ metric4[0].chartId }}</small>
                 </div>
                 <div v-else class="empty-tip">拖拽指标到此处（指标{{ 4 }}）</div>
               </div>
@@ -68,7 +75,7 @@
                 <div v-if="metric5.length > 0" class="metric-tag">
                   <span class="sort-num">指标{{ 5 }}</span>
                   {{ metric5[0].chartName }}
-                  <small style="font-size:12px; color:#88a0c2;">ID: {{ metric5[0].chartId }}</small>
+                  <small style="font-size: 12px; color: #88a0c2">ID: {{ metric5[0].chartId }}</small>
                 </div>
                 <div v-else class="empty-tip">拖拽指标到此处（指标{{ 5 }}）</div>
               </div>
@@ -81,7 +88,7 @@
                 <div v-if="metric6.length > 0" class="metric-tag">
                   <span class="sort-num">指标{{ 6 }}</span>
                   {{ metric6[0].chartName }}
-                  <small style="font-size:12px; color:#88a0c2;">ID: {{ metric6[0].chartId }}</small>
+                  <small style="font-size: 12px; color: #88a0c2">ID: {{ metric6[0].chartId }}</small>
                 </div>
                 <div v-else class="empty-tip">拖拽指标到此处（指标{{ 6 }}）</div>
               </div>
@@ -92,7 +99,7 @@
                 <div v-if="metric7.length > 0" class="metric-tag">
                   <span class="sort-num">指标{{ 7 }}</span>
                   {{ metric7[0].chartName }}
-                  <small style="font-size:12px; color:#88a0c2;">ID: {{ metric7[0].chartId }}</small>
+                  <small style="font-size: 12px; color: #88a0c2">ID: {{ metric7[0].chartId }}</small>
                 </div>
                 <div v-else class="empty-tip">拖拽指标到此处（指标{{ 7 }}）</div>
               </div>
@@ -103,7 +110,7 @@
                 <div v-if="metric8.length > 0" class="metric-tag">
                   <span class="sort-num">指标{{ 8 }}</span>
                   {{ metric8[0].chartName }}
-                  <small style="font-size:12px; color:#88a0c2;">ID: {{ metric8[0].chartId }}</small>
+                  <small style="font-size: 12px; color: #88a0c2">ID: {{ metric8[0].chartId }}</small>
                 </div>
                 <div v-else class="empty-tip">拖拽指标到此处（指标{{ 8 }}）</div>
               </div>
@@ -116,7 +123,15 @@
           <el-input v-model="searchKey" placeholder="搜索指标项..." size="default"></el-input>
         </div>
         <div class="metric-list">
-          <div v-for="item in allMetricList" :key="item.chartId" class="metric-item" :class="{ active: isMetricUsed(item.chartId) }" draggable="true" @dragstart="(e) => handleDragStart(e, item)" @dragend="handleDragEnd">
+          <div
+            v-for="item in allMetricList"
+            :key="item.chartId"
+            class="metric-item"
+            :class="{ active: isMetricUsed(item.chartId) }"
+            draggable="true"
+            @dragstart="(e) => handleDragStart(e, item)"
+            @dragend="handleDragEnd"
+          >
             <span>{{ item.chartName }}</span>
             <span class="color-dot" :style="{ backgroundColor: item.color || getRandomColor() }"></span>
           </div>
@@ -129,32 +144,43 @@
 <script lang="ts" setup name="ViewsBizMyScreenWorkSetting">
   import { ref, computed, onMounted } from 'vue';
   import { ElMessage } from 'element-plus';
-import { MyChartInfo, myChartInfoListAll } from '@jeesite/biz/api/biz/myChartInfo';
+  import { MyChartInfo, myChartSetting, myChartInfoListAll } from '@jeesite/biz/api/biz/myChartInfo';
 
-const metric1 = ref([]);
+  type MetricItem = MyChartInfo & {
-const metric2 = ref([]);
+    oldSort?: number;
-const metric3 = ref([]);
+    oldChartId?: string | number | null;
-const metric4 = ref([]);
+  };
-const metric5 = ref([]);
+
-const metric6 = ref([]);
+  const metric1 = ref<MetricItem[]>([]);
-const metric7 = ref([]);
+  const metric2 = ref<MetricItem[]>([]);
-const metric8 = ref([]);
+  const metric3 = ref<MetricItem[]>([]);
+  const metric4 = ref<MetricItem[]>([]);
+  const metric5 = ref<MetricItem[]>([]);
+  const metric6 = ref<MetricItem[]>([]);
+  const metric7 = ref<MetricItem[]>([]);
+  const metric8 = ref<MetricItem[]>([]);
 
   const gridOriginalChartId = ref({
-  1: null, 2: null, 3: null, 4: null,
+    1: null,
-  5: null, 6: null, 7: null, 8: null
+    2: null,
+    3: null,
+    4: null,
+    5: null,
+    6: null,
+    7: null,
+    8: null,
   });
   const metricHistory = ref({});
 
   const saveLoading = ref(false);
-const rawChartData = ref<MyChartInfo[]>();
+  const rawChartData = ref<MyChartInfo[]>([]);
   const searchKey = ref('');
-const dragItem = ref(null);
+  const dragItem = ref<MetricItem | null>(null);
 
   const allMetricList = computed({
     get() {
       if (!rawChartData.value || !Array.isArray(rawChartData.value)) return [];
-    return rawChartData.value.filter(item => {
+      return rawChartData.value.filter((item) => {
         if (!item || !item.chartName) return false;
         const searchVal = searchKey.value ? searchKey.value.toLowerCase() : '';
         const nameVal = item.chartName ? item.chartName.toLowerCase() : '';
@@ -163,26 +189,21 @@ const allMetricList = computed({
     },
     set(val) {
       rawChartData.value = val;
-  }
+    },
   });
 
-const getAllMetricArrays = () => ([
+  const getAllMetricArrays = () => [metric1, metric2, metric3, metric4, metric5, metric6, metric7, metric8];
-  metric1, metric2, metric3, metric4, 
-  metric5, metric6, metric7, metric8
-]);
 
-const getMetricArrByGridNum = (gridNum) => {
+  const getMetricArrByGridNum = (gridNum: number) => {
     return getAllMetricArrays()[gridNum - 1];
   };
 
-const isMetricUsed = (metricId) => {
+  const isMetricUsed = (metricId: string) => {
     if (!metricId) return false;
-  return getAllMetricArrays().some(
+    return getAllMetricArrays().some((metricArr) => metricArr.value.some((m) => m && m.chartId === metricId));
-    metricArr => metricArr.value.some(m => m && m.chartId === metricId)
-  );
   };
 
-const findGridNumByChartId = (chartId) => {
+  const findGridNumByChartId = (chartId: string) => {
     const arr = getAllMetricArrays();
     for (let i = 0; i < arr.length; i++) {
       if (arr[i].value.length && arr[i].value[0].chartId === chartId) {
@@ -213,7 +234,7 @@ const handleDrop = (e, targetGrid) => {
     getAllMetricArrays().forEach((arr, index) => {
       const gridNum = index + 1;
       if (gridNum !== targetGrid) {
-      arr.value = arr.value.filter(i => i.chartId !== dragChartId);
+        arr.value = arr.value.filter((i) => i.chartId !== dragChartId);
       }
     });
 
@@ -244,20 +265,21 @@ const handleDeleteMetric = (gridNum) => {
   };
 
   const handleReset = () => {
-  getAllMetricArrays().forEach(arr => arr.value = []);
+    getAllMetricArrays().forEach((arr) => (arr.value = []));
     searchKey.value = '';
     getChartList();
     ElMessage.info('已重置所有指标');
   };
 
   const handleClearAll = () => {
-  getAllMetricArrays().forEach(arr => arr.value = []);
+    getAllMetricArrays().forEach((arr) => (arr.value = []));
     ElMessage.info('已清空所有格子');
   };
 
   const handleSave = async () => {
     saveLoading.value = true;
-  const saveData = getAllMetricArrays().map((arr, index) => {
+    const saveData = getAllMetricArrays()
+      .map((arr, index) => {
         const gridNum = index + 1;
         const currentItem = arr.value[0];
         return {
@@ -267,18 +289,19 @@ const handleSave = async () => {
           chartName: currentItem?.chartName || '',
           chartCode: 'work',
           oldSort: currentItem?.oldSort || gridNum,
-      color: currentItem?.color || ''
+          color: currentItem?.color || '',
         };
-  }).filter(item => item.chartId);
+      })
+      .filter((item) => item.chartId);
 
     try {
-    const res = await getChartSetting(saveData);
+      const res = await myChartSetting(saveData);
       ElMessage.success(res?.msg);
       return saveData;
     } catch (error) {
       console.error('保存失败：', error);
     } finally {
-	getChartList()
+      getChartList();
       saveLoading.value = false;
     }
   };
@@ -294,23 +317,25 @@ async function getChartList() {
       const res = await myChartInfoListAll(reqParams);
       rawChartData.value = res || [];
       metricHistory.value = {};
-    Object.keys(gridOriginalChartId.value).forEach(key => {
+      Object.keys(gridOriginalChartId.value).forEach((key) => {
         gridOriginalChartId.value[key] = null;
       });
 
-    rawChartData.value.forEach(item => {
+      rawChartData.value.forEach((item) => {
         const sortNum = item.sort || 0;
         if (sortNum >= 1 && sortNum <= 8) {
           const targetArr = getMetricArrByGridNum(sortNum);
           if (targetArr) {
             gridOriginalChartId.value[sortNum] = item.chartId;
-          targetArr.value = [{
+            targetArr.value = [
+              {
                 ...item,
                 sort: sortNum,
                 oldSort: 0,
                 chartId: item.chartId,
-            oldChartId: item.chartId
+                oldChartId: item.chartId,
-          }];
+              },
+            ];
             metricHistory.value[item.chartId] = sortNum;
           }
         }

web-vue/packages/core/layouts/screen/welcome/Erp/components/detail/indexV01.vue

@@ -9,25 +9,21 @@
       <el-form :model="searchForm" class="search-form">
         <div class="form-items-wrapper">
           <el-form-item label="交易名称：" class="form-item">
-            <el-input
+            <el-input v-model="searchForm.flowName" placeholder="请输入交易名称" clearable />
-              v-model="searchForm.flowName"
-              placeholder="请输入交易名称"
-              clearable
-            />
           </el-form-item>
           <el-form-item label="交易类型：" class="form-item">
             <el-select
-		      v-model="searchForm.transactionType"
+              v-model="searchForm.flowType"
               placeholder="请选择交易类型"
               clearable
               class="custom-select"
-		      teleport="body"
               popper-class="theme-select-popper"
               :popper-append-to-body="true"
               @change="getTranTypes"
             >
               <el-option label="收入" value="2" />
               <el-option label="支出" value="1" />
+              <el-option label="转账" value="0" />
             </el-select>
           </el-form-item>
           <el-form-item label="交易分类：" class="form-item">
@@ -36,7 +32,6 @@
               placeholder="请选择交易分类"
               clearable
               class="custom-select"
-              teleport="body"
               popper-class="theme-select-popper"
               :popper-append-to-body="true"
             >
@@ -70,29 +65,33 @@
             background: 'transparent',
             color: '#a0cfff',
             border: 'none',
-            borderBottom: '1px solid rgba(64, 158, 255, 0.3)'
+            borderBottom: '1px solid rgba(64, 158, 255, 0.3)',
           }"
           :row-style="{
             background: 'transparent',
             color: '#a0cfff',
-            border: 'none'
+            border: 'none',
           }"
           :cell-style="{
             border: 'none',
-            borderBottom: '1px solid rgba(64, 158, 255, 0.2)'
+            borderBottom: '1px solid rgba(64, 158, 255, 0.2)',
           }"
         >
-          <el-table-column prop="flowId" label="交易编号" />
+          <el-table-column prop="yearDate" label="年份" width="60" />
+          <el-table-column prop="monthDate" label="月份" width="60" />
           <el-table-column prop="flowName" label="交易名称" />
+          <el-table-column prop="parentName" label="父级分类" />
           <el-table-column prop="categoryName" label="交易分类" />
-          <el-table-column prop="tranType" label="交易类型" />
+          <el-table-column prop="flowType" label="交易类型" width="120">
-          <el-table-column prop="amount" label="交易金额">
             <template #default="scope">
-              ¥{{ scope.row.amount }}
+              {{ getFlowTypeLabel(scope.row.flowType) }}
             </template>
           </el-table-column>
+          <el-table-column prop="amount" label="交易金额">
+            <template #default="scope"> ¥ {{ scope.row.amount }} </template>
+          </el-table-column>
           <el-table-column prop="remark" label="交易备注" />
-          <el-table-column prop="transactionTime" label="交易时间" />
+          <el-table-column prop="tradeTime" label="交易时间" width="180" />
         </el-table>
       </div>
       <div class="pagination-wrapper">
@@ -114,64 +113,75 @@
   </div>
 </template>
 
-<script setup>
+<script lang="ts" setup>
-import { defineProps, defineEmits, ref, onMounted, reactive } from 'vue'
+  import { defineProps, defineEmits, ref, onMounted, reactive } from 'vue';
-import { ElMessage } from 'element-plus'
+  import { ElMessage } from 'element-plus';
-// import { getErpCategoryList, getErpTransactionFlowList } from '@/api/bizApi'
+  import { ErpCategory, erpCategoryListAll } from '@jeesite/erp/api/erp/category';
+  import { ErpTransactionFlow, erpTransactionPageFlowList } from '@jeesite/erp/api/erp/transactionFlow';
 
   const props = defineProps({
     accountData: {
       type: Object,
-    default: () => ({})
+      default: () => ({}),
-  }
+    },
-})
+  });
 
-const emit = defineEmits(['close'])
+  const emit = defineEmits(['close']);
-const handleClose = () => emit('close')
+  const handleClose = () => emit('close');
+
+  const flowTypeDict: Record<string, string> = {
+    '0': '转账',
+    '1': '支出',
+    '2': '收入',
+  };
+
+  const getFlowTypeLabel = (flowType?: string | number) => {
+    return flowTypeDict[String(flowType ?? '')] || '-';
+  };
 
   const tranTypes = ref();
   const loading = ref(false);
 
   const searchForm = reactive({
     flowName: '',
-  transactionType: '',
+    flowType: '',
     categoryId: '',
-})
+  });
 
-const tableData = ref([]);
+  const tableData = ref<ErpTransactionFlow[]>();
   const currentPage = ref(1);
   const pageSize = ref(20);
   const total = ref(0);
 
   const handleSearch = () => {
     getList();
-}
+  };
 
   const handleReset = () => {
     Object.assign(searchForm, {
       flowName: '',
-    transactionType: '', 
+      flowType: '',
       categoryId: '',
-  })
+    });
     currentPage.value = 1;
     getList();
-}
+  };
 
-const handleSizeChange = (val) => {
+  const handleSizeChange = (val: number) => {
     pageSize.value = val;
     getList();
-}
+  };
-const handleCurrentChange = (val) => {
+  const handleCurrentChange = (val: number) => {
     currentPage.value = val;
     getList();
-}
+  };
 
   async function getTranTypes() {
     try {
       const params = {
-		 categoryType: searchForm.transactionType,
+        categoryType: searchForm.flowType,
-	 }
+      };
-	  const res = await getErpCategoryList(params);
+      const res = await erpCategoryListAll(params);
       tranTypes.value = res || [];
     } catch (error) {
       console.error('获取数据失败:', error);
@@ -187,8 +197,8 @@ async function getList() {
         pageNum: currentPage.value,
         pageSize: pageSize.value,
         accountId: props.accountData.rawData?.accountId || '',
-	  }
+      };
-	  const res = await getErpTransactionFlowList(reqParmas);
+      const res = await erpTransactionPageFlowList(reqParmas);
       total.value = res.total;
       tableData.value = res.list || [];
     } catch (error) {
@@ -202,7 +212,7 @@ async function getList() {
   onMounted(async () => {
     await getList();
     await getTranTypes();
-})
+  });
 </script>
 
 <style scoped>
@@ -213,11 +223,21 @@ onMounted(async () => {
     color: #e0e6ff;
     background: url('@jeesite/assets/chart/box/18.png') no-repeat center center;
     background-size: 100% 100%;
-  background-color: transparent !important;
+    background-color: rgba(18, 52, 92, 0.28) !important;
     border: none !important;
     box-sizing: border-box;
     position: relative;
     z-index: 10001;
+    backdrop-filter: blur(6px);
+  }
+
+  .detail-container::before {
+    content: '';
+    position: absolute;
+    inset: 0;
+    background: linear-gradient(180deg, rgba(48, 112, 196, 0.12), rgba(14, 42, 78, 0.24));
+    pointer-events: none;
+    z-index: 0;
   }
 
   .detail-header {
@@ -225,10 +245,12 @@ onMounted(async () => {
     justify-content: space-between;
     align-items: center;
     margin-bottom: 10px;
+    position: relative;
+    z-index: 1;
   }
   .detail-header h3 {
     margin: 0;
-  color: #409EFF;
+    color: #409eff;
     text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
     font-size: 18px;
   }
@@ -247,12 +269,12 @@ onMounted(async () => {
     z-index: 10002;
   }
   .close-btn:hover {
-  color: #409EFF;
+    color: #409eff;
   }
 
   .split-line {
     height: 1px;
-  background-color: #409EFF;
+    background-color: #409eff;
     opacity: 0.6;
     margin-bottom: 16px;
   }
@@ -260,17 +282,17 @@ onMounted(async () => {
   .detail-body {
     width: 100%;
     height: calc(100% - 80px);
-  border: 1px solid #409EFF;
+    border: 1px solid #409eff;
     border-radius: 6px;
     padding: 16px;
-  background-color: rgba(10, 30, 60, 0.2);
+    background-color: rgba(36, 88, 156, 0.16);
     box-sizing: border-box;
     display: flex;
     flex-direction: column;
     gap: 16px;
     overflow: visible;
     position: relative;
-  z-index: 10001;
+    z-index: 1;
   }
 
   .search-form {
@@ -330,7 +352,7 @@ onMounted(async () => {
 
   .loading-icon {
     font-size: 24px;
-  color: #409EFF;
+    color: #409eff;
     animation: loading-rotate 2s linear infinite;
     margin-bottom: 8px;
   }
@@ -376,7 +398,7 @@ onMounted(async () => {
   :deep(.el-select__wrapper),
   :deep(.el-date-editor__wrapper) {
     background-color: rgba(0, 0, 0, 0.2) !important;
-  border: 1px solid #409EFF !important;
+    border: 1px solid #409eff !important;
     box-shadow: none !important;
     width: 100% !important;
     position: relative;
@@ -396,22 +418,22 @@ onMounted(async () => {
   :deep(.custom-pagination) {
     --el-pagination-text-color: #e0e6ff;
     --el-pagination-button-color: #e0e6ff;
-  --el-pagination-button-hover-color: #409EFF;
+    --el-pagination-button-hover-color: #409eff;
-  --el-pagination-button-active-color: #409EFF;
+    --el-pagination-button-active-color: #409eff;
-  --el-pagination-border-color: #409EFF;
+    --el-pagination-border-color: #409eff;
     --el-pagination-bg-color: rgba(10, 30, 60, 0.2) !important;
     z-index: 10001;
   }
   :deep(.el-pagination button) {
     background-color: rgba(0, 0, 0, 0.2) !important;
-  border-color: #409EFF !important;
+    border-color: #409eff !important;
     color: #e0e6ff !important;
   }
   :deep(.el-pagination .el-pager li) {
     color: #e0e6ff !important;
   }
   :deep(.el-pagination .el-pager li.active) {
-  color: #409EFF !important;
+    color: #409eff !important;
     font-weight: bold;
   }
 
@@ -455,9 +477,9 @@ onMounted(async () => {
 
   :deep(.el-button) {
     --el-button-text-color: #e0e6ff !important;
-  --el-button-border-color: #409EFF !important;
+    --el-button-border-color: #409eff !important;
     --el-button-hover-text-color: #fff !important;
-  --el-button-hover-border-color: #409EFF !important;
+    --el-button-hover-border-color: #409eff !important;
     --el-button-hover-bg-color: rgba(64, 158, 255, 0.2) !important;
     height: 32px;
     padding: 0 16px;
@@ -466,12 +488,12 @@ onMounted(async () => {
   :deep(.el-button--primary) {
     --el-button-text-color: #fff !important;
     --el-button-bg-color: rgba(64, 158, 255, 0.8) !important;
-  --el-button-border-color: #409EFF !important;
+    --el-button-border-color: #409eff !important;
-  --el-button-hover-bg-color: #409EFF !important;
+    --el-button-hover-bg-color: #409eff !important;
   }
   :deep(.reset-btn) {
     background-color: rgba(0, 0, 0, 0.2) !important;
-  border-color: #409EFF !important;
+    border-color: #409eff !important;
     color: #e0e6ff !important;
   }
   :deep(.reset-btn:hover) {
@@ -504,7 +526,7 @@ onMounted(async () => {
 <style>
   .theme-select-popper {
     background-color: rgba(10, 30, 60, 0.95) !important;
-  border: 1px solid #409EFF !important;
+    border: 1px solid #409eff !important;
     color: #e0e6ff !important;
     z-index: 99999 !important;
     pointer-events: auto !important;
@@ -526,7 +548,7 @@ onMounted(async () => {
 
   .theme-pagination-popper {
     background-color: rgba(10, 30, 60, 0.95) !important;
-  border: 1px solid #409EFF !important;
+    border: 1px solid #409eff !important;
     color: #e0e6ff !important;
     z-index: 99999 !important;
     pointer-events: auto !important;

web-vue/packages/erp/api/erp/transactionFlow.ts

@@ -26,9 +26,28 @@ export interface ErpTransactionFlow extends BasicModel<ErpTransactionFlow> {
   businessId: string; // 业务标识
 }
 
+export interface ErpFlowParams extends BasicModel<ErpFlowParams> {
+  pageNum: number; // 当前页
+  pageSize: number; // 每页条数
+  flowName: string; // 交易名称
+  flowType: string; // 交易类型
+  accountId: string; // 交易账户
+  categoryId: string; // 交易分类
+}
+
+export interface PageResult<T> extends BasicModel<PageResult<T>> {
+  list: T[];               // 对应后端 List<T> list
+  currentPage: number;     // 当前页
+  pageSize: number;        // 每页条数
+  total: number;           // 总条数
+}
+
 export const erpTransactionFlowList = (params?: ErpTransactionFlow | any) =>
   defHttp.get<ErpTransactionFlow>({ url: adminPath + '/erp/transactionFlow/list', params });
   
+export const erpTransactionPageFlowList = (params?: ErpTransactionFlow | any) =>
+  defHttp.get<PageResult<ErpTransactionFlow>>({ url: adminPath + '/erp/transactionFlow/FlowList', params });
+
 export const erpTransactionFlowListData = (params?: ErpTransactionFlow | any) =>
   defHttp.post<Page<ErpTransactionFlow>>({ url: adminPath + '/erp/transactionFlow/listData', params });