解决数据过滤的bu gbug

src/views/performance/components/custonAsCom/dragChart/components/chartConfig/form/chartLogic/dargChartFIlter.js

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2024-11-20 10:42:38
- * @LastEditTime: 2024-11-20 10:44:20
+ * @LastEditTime: 2024-11-22 14:00:39
  * @LastEditors: bogon
  * @Description: In User Settings Edit
  * @FilePath: /performance-test/src/utils/dargChartFIlter.js
@@ -25,12 +25,12 @@ export const filterData = (filterData, dataList, label) => {
     // 如果没有提供 number1 或 filterType1，则默认 condition1 满足
     if (item !== null) {
       const condition1 =
-        filter.filterType1 && filter.number1 !== null
+        filter.filterType1 && (filter.number1 !== null || filter.number1 !== "")
           ? calculate(filter.filterType1, item[label], filter.number1)
           : true;
       // 如果没有提供 number2 或 filterType2，则默认 condition2 满足
       const condition2 =
-        filter.filterType2 && filter.number2 !== null
+        filter.filterType2 && (filter.number2 !== null || filter.number2 !== "")
           ? calculate(filter.filterType2, item[label], filter.number2)
           : true;
       // 根据逻辑关系 (或/且)

src/views/performance/components/custonAsCom/dragChart/components/chartConfig/form/chartLogic/modules/barAndLine.js

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2024-11-20 11:18:35
- * @LastEditTime: 2024-11-22 11:17:57
+ * @LastEditTime: 2024-11-22 14:13:07
  * @LastEditors: bogon
  * @Description: In User Settings Edit
  * @FilePath: /performance-test/src/utils/chartLogic/modules/barAndLine.js
@@ -16,36 +16,30 @@ export function handleBarChartLogic(
   isFilter,
   type
 ) {
-  console.log(
-    item,
-    formLabelAlign,
-    formFilterAlign,
-    isFilter,
-    type,
-    "过滤方法"
-  );
   // 封装柱状图的具体逻辑
   if (isFilter === "filter") {
-    //近这个里面了
     // 数据筛选逻辑，
     const filterResult = formLabelAlign.Ydata.map((yItem, index) => ({
       label: yItem.label,
       id: yItem.id,
       data: yItem.data.map((val) => {
         const filters = formFilterAlign[index]?.filters || [];
-        console.log(filters, "filters 过滤自己点废话", val);
+
         return val === null ||
           (filters.length > 0 && !filters.includes(val[yItem.label]))
           ? null
           : val;
       }),
     }));
-    console.log(filterResult, "filterResult");
     // 条件筛选逻辑
     const filterList = filterResult.map((filteredItem, index) => {
       const filter = formFilterAlign[index];
       const { filterType1, filterType2, number1, number2 } = filter;
-      if (!filterType1 && !filterType2 && number1 == null && number2 == null) {
+
+      if (
+        (number1 === null || number1 === "") &&
+        (number2 === null || number2 === "")
+      ) {
         return {
           label: filteredItem.label,
           id: filteredItem.id,

src/views/performance/components/custonAsCom/dragChart/components/chartConfig/form/chartLogic/modules/cp.js

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2024-11-21 15:40:30
- * @LastEditTime: 2024-11-22 11:39:43
+ * @LastEditTime: 2024-11-22 14:04:26
  * @LastEditors: bogon
  * @Description: In User Settings Edit
  * @FilePath: /performance-test/src/views/performance/components/custonAsCom/dragChart/components/chartConfig/form/chartLogic/modules/cp.js
@@ -34,7 +34,10 @@ export function handleCpChartLogic(
     const filterList = filterResult.map((filteredItem, index) => {
       const filter = formFilterAlign[index];
       const { filterType1, filterType2, number1, number2 } = filter;
-      if (!filterType1 && !filterType2 && number1 == null && number2 == null) {
+      if (
+        (number1 === null || number1 === "") &&
+        (number2 === null || number2 === "")
+      ) {
         return {
           label: filteredItem.label,
           id: filteredItem.id,

src/views/performance/components/custonAsCom/dragChart/components/chartConfig/form/chartLogic/modules/radar.js

@@ -1,7 +1,7 @@
 /*
  * @Author: your name
  * @Date: 2024-11-21 09:40:55
- * @LastEditTime: 2024-11-22 11:40:00
+ * @LastEditTime: 2024-11-22 14:04:16
  * @LastEditors: bogon
  * @Description: In User Settings Edit
  * @FilePath: /performance-test/src/views/performance/components/custonAsCom/dragChart/components/chartConfig/form/chartLogic/modules/radar.js
@@ -43,7 +43,10 @@ export function handleRadarChartLogic(
     const filterList = filterResult.map((filteredItem, index) => {
       const filter = formFilterAlign[index];
       const { filterType1, filterType2, number1, number2 } = filter;
-      if (!filterType1 && !filterType2 && number1 == null && number2 == null) {
+      if (
+        (number1 === null || number1 === "") &&
+        (number2 === null || number2 === "")
+      ) {
         return {
           label: filteredItem.label,
           id: filteredItem.id,

src/views/performance/components/custonAsCom/dragChart/components/chartConfig/form/chartLogic/modules/scatter.js

@@ -25,7 +25,10 @@ export function handleScatterChartLogic(
     const filterList = filterResult.map((filteredItem, index) => {
       const filter = formFilterAlign[index];
       const { filterType1, filterType2, number1, number2 } = filter;
-      if (!filterType1 && !filterType2 && number1 == null && number2 == null) {
+      if (
+        (number1 === null || number1 === "") &&
+        (number2 === null || number2 === "")
+      ) {
         return {
           label: filteredItem.label,
           id: filteredItem.id,
@@ -87,7 +90,7 @@ export function handleScatterChartLogic(
           ];
         })
         .filter((point) => point !== null); // 过滤掉无效的点
-      //   console.log(scatterData, "scatterData");
+
       return {
         name: `${item.Xdata[ind]?.label || "X"} - ${
           item.Ydata[ind]?.label || "Y"
@@ -95,30 +98,29 @@ export function handleScatterChartLogic(
         type: type,
         renderMode: "webgl", // 启用 WebGL 渲染
         data: scatterData, // 生成的散点图数据
-
         tooltip: {
           trigger: "item", // 鼠标悬停触发
-          formatter: (params) => {
-            // params.dataIndex: 当前点的索引
-            const idx = params.dataIndex;
-            const xTooltipData = item.Xdata.map(
-              (xItem) =>
-                `${xItem.label}: ${
-                  xItem.data[idx]
-                    ? Number(xItem.data[idx][xItem.label] || 0)
-                    : "N/A"
-                }`
-            ).join("<br>");
-            const yTooltipData = item.Ydata.map(
-              (yItem) =>
-                `${yItem.label}: ${
-                  yItem.data[idx]
-                    ? Number(yItem.data[idx][yItem.label]) || 0
-                    : "N/A"
-                }`
-            ).join("<br>");
-            return `X轴数据:<br>${xTooltipData}<br>Y轴数据:<br>${yTooltipData}`;
-          },
+          // formatter: (params) => {
+          //   // params.dataIndex: 当前点的索引
+          //   const idx = params.dataIndex;
+          //   const xTooltipData = item.Xdata.map(
+          //     (xItem) =>
+          //       `${xItem.label}: ${
+          //         xItem.data[idx]
+          //           ? Number(xItem.data[idx][xItem.label] || 0)
+          //           : "N/A"
+          //       }`
+          //   ).join("<br>");
+          //   const yTooltipData = item.Ydata.map(
+          //     (yItem) =>
+          //       `${yItem.label}: ${
+          //         yItem.data[idx]
+          //           ? Number(yItem.data[idx][yItem.label]) || 0
+          //           : "N/A"
+          //       }`
+          //   ).join("<br>");
+          //   return `X轴数据:<br>${xTooltipData}<br>Y轴数据:<br>${yTooltipData}`;
+          // },
         },
       };
     });

src/views/performance/components/custonAsCom/dragChart/components/chartConfig/form/title.vue

@@ -88,7 +88,6 @@
             ></i>
           </el-tooltip>
         </div>
-        {{ formLabelAlign.Ydata[0].label }}
         <template v-for="(item, ind) in formLabelAlign.Ydata">
           <div class="attributeItemData">
             <el-select
@@ -97,7 +96,7 @@
               v-model="formLabelAlign.Ydata[ind].id"
               placeholder="请先进行数据配置"
               :disabled="disabled"
-              @change="handleYdata"
+              @change="handleYdata(ind)"
             >
               <el-option
                 v-for="item in selectData"
@@ -166,6 +165,7 @@
               placeholder="请选择数据"
               multiple
               collapse-tags
+              class="filterMutiple"
             >
               <el-option
                 v-for="(item, index) in itemFilter?.data"
@@ -360,13 +360,24 @@ export default {
       );
     },
     //指标值 处理整合数据
-    handleYdata() {
+    handleYdata(ind) {
       this.formLabelAlign.Ydata = this.updateAxisData(
         this.formLabelAlign.Ydata
       );
+      this.formFilterAlign.forEach((item, index) => {
+        if (ind === index) {
+          {
+            item.filters = [];
+            item.filterType1 = "";
+            item.number1 = null;
+            item.filterType2 = "";
+            item.number2 = null;
+            item.radio = null;
+          }
+        }
+      });
     },
     updateAxisData(axisData) {
-      console.log(axisData, "axisData");
       axisData.forEach((item, index) => {
         const selected = this.selectData.find(
           (val) => (val && val.id) === (item && item.id)
@@ -443,7 +454,6 @@ export default {
     //全部数据渲染
     changeChart(isFilter) {
       if (!this.curEdit?.option) return; // 确保 curEdit 和 option 存在
-      console.log(this.curEdit, this.formLabelAlign.Ydata, "this.curEdit");
       const item = JSON.parse(JSON.stringify(this.curEdit));
 
       if (this.curEdit.type === "scatter" || this.curEdit.type === "radar") {
@@ -542,4 +552,7 @@ export default {
 .el-divider--horizontal {
   height: 2px;
 }
+::v-deep .filterMutiple .el-select__tags-text {
+  max-width: 40px !important;
+}
 </style>