柱状图完成

src/api/DesignForm/tableButton.ts

@@ -346,6 +346,15 @@ export interface viewPageType {
 				sortWord:string,
 				sort:number
 			}
+		},
+		chart:{
+			status:boolean,
+			isClick:boolean,
+			form:{
+				mapWord:string,
+				sortWord:string,
+				sort:number
+			}
 		}
 	
 }

src/api/chart/index.ts

@@ -23,3 +23,11 @@ export function getChartCont(data?: any) {
 	  data: data
 	});
 }
+//根据条件解析图标结果
+export function analyzeChartData(data?: any) {
+	return request({
+	  url: "/systemapi/chart/analyzeChartData",
+	  method: 'post',
+	  data: data
+	});
+}

src/components/DesignForm/app/index.vue

@@ -53,6 +53,7 @@ import MapPage from "@/components/DesignForm/app/mapPage.vue";
 import CalendarPage from "@/components/DesignForm/app/calendar/calendar1/calendarPage.vue";
 import SearchSelect from "@/components/DesignForm/app/calendar/selectSearch.vue";
 import AKSelect from "@/components/DesignForm/public/form/select.vue";
+import ContainerPath from "@/views/sysworkflow/lowcodepage/appPage/appPageForm/echatesUnit/container.vue";
 
 const props = withDefaults(
   defineProps<{
@@ -80,6 +81,7 @@ const props = withDefaults(
     formBasicConfig?: any;
     fieldsDetailList?: any;
     orgAndManTree?: any;
+    echatsViews: echatsViews;
   }>(),
   {
     showPage: true,
@@ -130,6 +132,12 @@ const props = withDefaults(
     },
   }
 );
+const echatsViewsdf = computed({
+  get() {
+    return props.echatsViews;
+  },
+  set(newVal: any) {},
+});
 const emits = defineEmits<{
   (e: "selectionChange", row: any): void;
   (e: "btnClick", btn: any, row?: any): void; // 列表上面及表格列表里添加删除按钮事件
@@ -1422,6 +1430,7 @@ const tabsView = (val: any, types: number) => {
       props.viewPage.gantt.isClick = false;
       props.viewPage.map.isClick = false;
       props.viewPage.card.isClick = false;
+      props.viewPage.chart.isClick = false;
       break;
     case 3:
       props.viewPage.list.isClick = false;
@@ -1429,6 +1438,7 @@ const tabsView = (val: any, types: number) => {
       props.viewPage.gantt.isClick = false;
       props.viewPage.map.isClick = false;
       props.viewPage.card.isClick = false;
+      props.viewPage.chart.isClick = false;
       getPageData();
       break;
     case 4:
@@ -1437,15 +1447,26 @@ const tabsView = (val: any, types: number) => {
       props.viewPage.time.isClick = false;
       props.viewPage.map.isClick = false;
       props.viewPage.card.isClick = false;
+      props.viewPage.chart.isClick = false;
       break;
     case 5:
-      props.viewPage.card.isClick = false;
       props.viewPage.list.isClick = false;
       props.viewPage.date.isClick = false;
       props.viewPage.time.isClick = false;
       props.viewPage.gantt.isClick = false;
+      props.viewPage.card.isClick = false;
+      props.viewPage.chart.isClick = false;
       break;
     case 6:
+      props.viewPage.list.isClick = false;
+      props.viewPage.date.isClick = false;
+      props.viewPage.time.isClick = false;
+      props.viewPage.gantt.isClick = false;
+      props.viewPage.map.isClick = false;
+      props.viewPage.chart.isClick = false;
+      break;
+    case 7:
+      props.viewPage.card.isClick = false;
       props.viewPage.list.isClick = false;
       props.viewPage.date.isClick = false;
       props.viewPage.time.isClick = false;
@@ -1458,6 +1479,7 @@ const tabsView = (val: any, types: number) => {
       props.viewPage.time.isClick = false;
       props.viewPage.gantt.isClick = false;
       props.viewPage.map.isClick = false;
+      props.viewPage.chart.isClick = false;
       break;
   }
 };
@@ -1762,6 +1784,20 @@ const readerColumnSun = (column: any) => {
                   @click="tabsView(props.viewPage.map, 5)"
                 />
               </el-tooltip>
+              <el-tooltip
+                v-if="viewPage.chart.status"
+                class="box-item"
+                effect="dark"
+                content="BI报表"
+                placement="top"
+              >
+                <el-button
+                  size="small"
+                  class="fa fa-line-chart"
+                  :color="viewPage.chart.isClick ? '#a0cfff' : ''"
+                  @click="tabsView(viewPage.chart, 7)"
+                />
+              </el-tooltip>
             </el-button-group>
           </div>
         </div>
@@ -2082,6 +2118,13 @@ const readerColumnSun = (column: any) => {
           :columns-filter="columnsFilter"
         />
       </el-col>
+      <el-col v-if="viewType == 7" :span="24">
+        <ContainerPath
+          :echats-views="echatsViewsdf"
+          :table-key="formBasicConfig.name"
+          :types="1"
+        />
+      </el-col>
       <el-col :span="24" style="display: none">
         <el-button-group>
           <el-tooltip

src/components/DesignForm/tableListPage/index.vue

@@ -35,7 +35,7 @@ import html2canvas from "html2canvas";
 import JSZip, { forEach } from "jszip";
 import { ElLoading, ElMessage, ElNotification } from "element-plus";
 import { softDeletion, retractRunWorkFlow, recalSendMsg } from "@/api/taskapi/management";
-
+import { echatsViews } from "@/api/DesignForm/types";
 import { formatNumber } from "@/api/DesignForm/utils";
 //引入组件
 import FormPageCont from "@/components/DesignForm/tableListPage/formPageCont.vue";
@@ -46,6 +46,7 @@ import GanttPage from "@/components/DesignForm/app/gannttPage.vue";
 import MapPage from "@/components/DesignForm/app/mapPage.vue";
 import CalendarPage from "@/components/DesignForm/app/calendar/calendar1/calendarPage.vue";
 import SearchSelect from "@/components/DesignForm/app/calendar/selectSearch.vue";
+import ContainerPath from "@/views/sysworkflow/lowcodepage/appPage/appPageForm/echatesUnit/container.vue";
 
 const props = withDefaults(
   defineProps<{
@@ -71,6 +72,7 @@ const props = withDefaults(
     formBasicConfig?: any;
     fieldsDetailList?: any;
     orgAndManTree?: any;
+    echatsViews: echatsViews;
   }>(),
   {
     showPage: true,
@@ -118,6 +120,13 @@ const props = withDefaults(
     },
   }
 );
+
+const echatsViewsdf = computed({
+  get() {
+    return props.echatsViews;
+  },
+  set(newVal: any) {},
+});
 const emits = defineEmits<{
   (e: "selectionChange", row: any): void;
   (e: "btnClick", btn: any, row?: any): void; // 列表上面及表格列表里添加删除按钮事件
@@ -1361,6 +1370,7 @@ const tabsView = (val: any, types: number) => {
       props.viewPage.gantt.isClick = false;
       props.viewPage.map.isClick = false;
       props.viewPage.card.isClick = false;
+      props.viewPage.chart.isClick = false;
       break;
     case 3:
       props.viewPage.list.isClick = false;
@@ -1368,6 +1378,7 @@ const tabsView = (val: any, types: number) => {
       props.viewPage.gantt.isClick = false;
       props.viewPage.map.isClick = false;
       props.viewPage.card.isClick = false;
+      props.viewPage.chart.isClick = false;
       getPageData();
       break;
     case 4:
@@ -1376,6 +1387,7 @@ const tabsView = (val: any, types: number) => {
       props.viewPage.time.isClick = false;
       props.viewPage.map.isClick = false;
       props.viewPage.card.isClick = false;
+      props.viewPage.chart.isClick = false;
       break;
     case 5:
       props.viewPage.list.isClick = false;
@@ -1383,8 +1395,18 @@ const tabsView = (val: any, types: number) => {
       props.viewPage.time.isClick = false;
       props.viewPage.gantt.isClick = false;
       props.viewPage.card.isClick = false;
+      props.viewPage.chart.isClick = false;
       break;
     case 6:
+      props.viewPage.list.isClick = false;
+      props.viewPage.date.isClick = false;
+      props.viewPage.time.isClick = false;
+      props.viewPage.gantt.isClick = false;
+      props.viewPage.map.isClick = false;
+      props.viewPage.chart.isClick = false;
+      break;
+    case 7:
+      props.viewPage.card.isClick = false;
       props.viewPage.list.isClick = false;
       props.viewPage.date.isClick = false;
       props.viewPage.time.isClick = false;
@@ -1397,6 +1419,7 @@ const tabsView = (val: any, types: number) => {
       props.viewPage.time.isClick = false;
       props.viewPage.gantt.isClick = false;
       props.viewPage.map.isClick = false;
+      props.viewPage.chart.isClick = false;
       break;
   }
 };
@@ -1768,6 +1791,20 @@ const readerColumnSun = (column: any) => {
                   @click="tabsView(viewPage.map, 5)"
                 />
               </el-tooltip>
+              <el-tooltip
+                v-if="viewPage.chart.status"
+                class="box-item"
+                effect="dark"
+                content="BI报表"
+                placement="top"
+              >
+                <el-button
+                  size="small"
+                  class="fa fa-line-chart"
+                  :color="viewPage.chart.isClick ? '#a0cfff' : ''"
+                  @click="tabsView(viewPage.chart, 7)"
+                />
+              </el-tooltip>
             </el-button-group>
           </div>
         </div>
@@ -2118,9 +2155,14 @@ const readerColumnSun = (column: any) => {
           :columns-filter="columnsFilter"
         />
       </el-col>
-      <el-col :span="24" style="display: none">
+      <el-col v-if="viewType == 7" :span="24">
-        {{ tableDataList }}
+        <ContainerPath
+          :echats-views="echatsViewsdf"
+          :table-key="formBasicConfig.name"
+          :types="1"
+        />
       </el-col>
+      <el-col :span="24" style="display: none"> </el-col>
       <el-col :span="24" style="display: none">
         <el-button-group>
           <el-tooltip

src/permission.ts

@@ -16,7 +16,7 @@ const whiteList = ["/login","/login/silentlogin","/aiurl"];
 
 router.beforeEach(async (to:any, from:any, next:any) => {
   NProgress.start();
-	
+	console.log("白名单路由----》");
   const hasToken = localStorage.getItem(appTokenKey);
 	// console.log("白名单路由----》",hasToken,"--->",to.path);
   if (hasToken) {

src/views/sysworkflow/lowcodepage/appPage/appPageForm/dataBoard.vue

@@ -7,6 +7,7 @@
 import { echatsViews } from "@/api/DesignForm/types";
 import { dimMeaInfo } from "@/api/chart/index";
 import { dimMeaFormTable, countChartValue, getChartCont } from "@/api/chart/index";
+import { useDesignEchartsStore } from "@/store/DesignForm/designForm";
 
 //引入页面
 import LeftPath from "@/views/sysworkflow/lowcodepage/appPage/appPageForm/echatesUnit/left.vue";
@@ -47,7 +48,7 @@ const props = defineProps({
     },
   },
 });
-
+const store = useDesignEchartsStore() as any; //自定义表单存储器
 const butLoading = ref(false);
 const echartsInfo = reactive<echatsViews>({
   uuid: "12332",

src/views/sysworkflow/lowcodepage/appPage/appPageForm/echatesUnit/chart/bar.vue

@@ -4,6 +4,7 @@
 @ 备注: 柱状图
 -->
 <script lang="ts" setup>
+import { analyzeChartData } from "@/api/chart/index";
 import { echatsViews } from "@/api/DesignForm/types";
 import * as echarts from "echarts";
 
@@ -35,34 +36,46 @@ var myChart = ref<any>();
 const drawPictures = () => {
   if (props.uuid && props.uuid != "") {
     myChart.value = echarts.init(document.getElementById(props.uuid) as HTMLDivElement);
-    myChart.value.setOption({
+    analyzeChartData({ tableKey: props.tableKey, chartId: props.uuid }).then((data) => {
-      grid: {
+      console.log("火兔", data);
+      let optVal = data.data;
+      optVal.grid = {
         left: "2%",
         right: "2%",
         bottom: "15%",
         top: "15%",
         containLabel: true,
-      },
+      };
-      xAxis: {
+      myChart.value.setOption(optVal);
-        data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"],
-      },
-      yAxis: {},
-      legend: {
-        data: ["销量", "销量科技"],
-      },
-      series: [
-        {
-          name: "销量",
-          type: "bar",
-          data: [5, 20, 36, 10, 10, 20],
-        },
-        {
-          name: "销量科技",
-          type: "bar",
-          data: [15, 21, 26, 70, 18, 29],
-        },
-      ],
     });
+    // myChart.value.setOption({
+    //   grid: {
+    //     left: "2%",
+    //     right: "2%",
+    //     bottom: "15%",
+    //     top: "15%",
+    //     containLabel: true,
+    //   },
+    //   xAxis: {
+    //     data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"],
+    //   },
+    //   yAxis: {},
+    //   legend: {
+    //     data: ["销量", "销量科技"],
+    //   },
+    //   series: [
+    //     {
+    //       name: "销量",
+    //       type: "bar",
+    //       data: [5, 20, 36, 10, 10, 20],
+    //     },
+    //     {
+    //       name: "销量科技",
+    //       type: "bar",
+    //       data: [15, 21, 26, 70, 18, 29],
+    //     },
+    //   ],
+    // });
     console.log("画图完毕---->", props);
     // myChart.value.resize();
   }
@@ -75,6 +88,14 @@ watch(
   },
   { deep: true }
 );
+watch(
+  () => props.data,
+  (val: any) => {
+    console.log("画图完毕--改变-->", val);
+    drawPictures();
+  },
+  { deep: true }
+);
 /**
 @ 作者: 秦东
 @ 时间: 2025-06-26 09:47:45
@@ -88,7 +109,10 @@ const searBut = (val: string) => {
   }
   return false;
 };
-
+//搜索
+const onSubmit = () => {
+  drawPictures();
+};
 onMounted(() => {
   nextTick(() => {
     drawPictures();
@@ -196,7 +220,6 @@ onMounted(() => {
       </el-form-item>
     </el-form>
     <div class="barBox" :id="props.uuid"></div>
-    {{ props }}
   </div>
 </template>
 <style lang="scss" scoped>

src/views/sysworkflow/lowcodepage/appPage/appPageForm/echatesUnit/right.vue

@@ -8,6 +8,7 @@ import { echatsViews } from "@/api/DesignForm/types";
 import { timeSearch } from "@/utils/workflow/const";
 import { useDesignEchartsStore } from "@/store/DesignForm/designForm";
 import { dimSetInfo, MaeSetInfo, filterInfo, searchInfo } from "@/api/chart/type";
+import { matchList } from "@/api/chart/unitData";
 
 //引入页面
 import DimensionPage from "@/views/sysworkflow/lowcodepage/appPage/appPageForm/echatesUnit/winBox/dimension.vue";
@@ -163,6 +164,23 @@ const setSearch = (val: searchInfo) => {
   console.log("设置搜索条件配置", val);
   openSearch.value = true;
 };
+/**
+@ 作者: 秦东
+@ 时间: 2025-07-17 09:05:41
+@ 功能: 聚合方式
+*/
+const shuxingmh = (val: any) => {
+  let titleVal = "";
+  if (Array.isArray(matchList)) {
+    matchList.forEach((item: any) => {
+      console.log(item.value, val, item.value == val);
+      if (item.value == val) {
+        titleVal = item.label;
+      }
+    });
+  }
+  return titleVal;
+};
 </script>
 <template>
   <div class="echartsRight">
@@ -198,7 +216,7 @@ const setSearch = (val: searchInfo) => {
           <el-text class="mx-1" type="info">未设置维度字段</el-text>
         </div>
         <div v-for="(item, index) in controlData.x" class="dimListBox">
-          <div class="dimListTitle">{{ item.title }}</div>
+          <div class="dimListTitle">{{ item.oldTitle }}</div>
           <el-space wrap>
             <svg-icon
               icon-class="set"
@@ -222,7 +240,7 @@ const setSearch = (val: searchInfo) => {
           <el-text class="mx-1" type="info">未设置度量字段</el-text>
         </div>
         <div v-for="(item, index) in controlData.y" class="dimListBox">
-          <div class="dimListTitle">{{ item.title }}</div>
+          <div class="dimListTitle">{{ item.title }}({{ shuxingmh(item.method) }})</div>
           <el-space wrap>
             <svg-icon
               icon-class="set"
@@ -243,7 +261,8 @@ const setSearch = (val: searchInfo) => {
           <el-text class="mx-1" type="info">未设置过滤器</el-text>
         </div>
         <div v-for="(item, index) in controlData.filter" class="dimListBox">
-          <div class="dimListTitle">{{ item.lable }}</div>
+          {{ item }}
+          <div class="dimListTitle">{{ item.oldTitle }}</div>
           <el-space wrap>
             <svg-icon
               icon-class="set"

src/views/sysworkflow/lowcodepage/appPage/appPageForm/openAppFormPage.vue

@@ -17,6 +17,7 @@ import { appPageDataInit, appWorkFlow } from "@/api/date/type";
 
 //引入页面
 import AppFlowSee from "@/views/sysworkflow/lowcodepage/appPage/appPageForm/appFlow/appFlowSee.vue";
+import ContainerPath from "@/views/sysworkflow/lowcodepage/appPage/appPageForm/echatesUnit/container.vue";
 
 const props = defineProps({
   appCont: {
@@ -44,7 +45,7 @@ const props = defineProps({
     default: "",
   },
 });
-
+const echatsViews = ref<any>("");
 const appInitData = ref<appPageDataInit>("");
 //app表单
 const stateForm = reactive<any>({
@@ -159,6 +160,14 @@ const stateList = reactive({
         ranks: 3,
       },
     },
+    chart: {
+      status: false,
+      isClick: false,
+      form: {
+        sortWord: "",
+        sortClass: 1,
+      },
+    },
   },
 });
 
@@ -208,8 +217,9 @@ const handleAppPageClick = () => {};
 const gainAppFormPageInit = () => {
   if (props.menusInfo.id) {
     gainAppPageInfo({ id: props.menusInfo.id }).then((data) => {
-      console.log("获取初始化表单数据", data);
+      console.log("获取初始化表单数据----->", data);
       appInitData.value = data.data;
+      echatsViews.value = data.data.chartList;
       if (data.data.page && data.data.pageList && data.data.appFlow) {
         activePage.value = 1;
       } else if (data.data.page && !data.data.pageList && data.data.appFlow) {
@@ -356,8 +366,16 @@ const gainAppFormPageInit = () => {
         stateList.dict = stateData.dict;
         stateList.refreshTable = stateData.refreshTable;
         if (stateData.view) {
-          stateList.view = stateData.view;
+          // stateList.view = stateData.view;
+          stateList.view.card = stateData.view.card;
+          stateList.view.list = stateData.view.list;
+          stateList.view.date = stateData.view.date;
+          stateList.view.time = stateData.view.time;
+          stateList.view.gantt = stateData.view.gantt;
+          stateList.view.map = stateData.view.map;
         }
+        stateList.view.chart.status = data.data.chart;
+        // console.log("开发---->", stateList.view);
       }
       if (data.data.page) {
         // console.log("data.data.mastesform", data.data)
@@ -501,6 +519,7 @@ defineExpose({
           <el-tab-pane v-if="appInitData.pageList" label="列表预览" :name="1" />
           <el-tab-pane v-if="appInitData.page" label="表单预览" :name="2" />
           <el-tab-pane v-if="appInitData.appFlow" label="流程图" :name="3" />
+          <el-tab-pane v-if="appInitData.chart" label="BI报表" :name="4" />
         </el-tabs>
       </el-col>
       <el-col v-if="activePage != 3" :span="24" class="pageBoxInfo">
@@ -519,6 +538,7 @@ defineExpose({
               :form-basic-config="stateForm.formData.form"
               :fields-detail-list="stateForm.formData.list"
               :org-and-man-tree="orgAndManTree"
+              :echats-views="echatsViews"
               @optionsValue5Get5="optionsValue5Get5"
             />
             <ak-form
@@ -538,6 +558,12 @@ defineExpose({
               :save-draft-page="saveDraftPage"
               @optionsValue3Get3="optionsValue3Get3"
             />
+            <ContainerPath
+              v-if="activePage == 4"
+              :echats-views="echatsViews"
+              :table-key="appInitData.appForm.tablekey"
+              :types="1"
+            />
           </el-scrollbar>
         </el-card>
       </el-col>

src/views/sysworkflow/lowcodepage/runApp/runAppForm.vue

@@ -157,8 +157,17 @@ const stateList = reactive({
         title: [],
       },
     },
+    chart: {
+      status: false,
+      isClick: false,
+      form: {
+        sortWord: "",
+        sortClass: 1,
+      },
+    },
   },
 });
+const echatsViews = ref<any>("");
 const appFormTitle = ref("");
 const versionTitle = ref<string>(""); //表单名称
 const versionId = ref<string>(""); //表单版本号
@@ -185,6 +194,7 @@ const initLoadData = () => {
     gainAppPageInfo({ id: props.pickAppMenu.id }).then((data) => {
       // console.log("获取初始化表单数据bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb", data);
       appInitData.value = data.data;
+      echatsViews.value = data.data.chartList;
       // console.log("获取初始化表单数据---!",appInitData.value)
       mastesformjson.value = data.data.appForm.mastesformjson;
       isFlow.value = data.data.appForm.flowIsOpen;
@@ -280,9 +290,19 @@ const initLoadData = () => {
         stateList.formApi = stateData.formApi;
         stateList.dict = stateData.dict;
         stateList.refreshTable = stateData.refreshTable;
+        // if (stateData.view) {
+        //   stateList.view = stateData.view;
+        // }
         if (stateData.view) {
-          stateList.view = stateData.view;
+          // stateList.view = stateData.view;
+          stateList.view.card = stateData.view.card;
+          stateList.view.list = stateData.view.list;
+          stateList.view.date = stateData.view.date;
+          stateList.view.time = stateData.view.time;
+          stateList.view.gantt = stateData.view.gantt;
+          stateList.view.map = stateData.view.map;
         }
+        stateList.view.chart.status = data.data.chart;
       }
       if (data.data.page) {
         // console.log("data.data.mastesform", data.data)
@@ -389,6 +409,7 @@ function optionsValue3Get3(data: any, fieldName: string) {
             :form-basic-config="stateForm.formData.form"
             :fields-detail-list="stateForm.formData.list"
             :org-and-man-tree="orgAndManTree"
+            :echats-views="echatsViews"
           />
           <!-- <AppFormPage
 						v-else