13.5

pages/reportForm/index.scss

@@ -127,10 +127,15 @@
       width: 100%;
       z-index: 99;
       background-color: #fff;
-      display: flex;
-      flex-wrap: wrap;
-      padding: 15rpx 20rpx 0;
 
+      padding: 15rpx 20rpx 0;
+      .scroll-tab-box {
+        display: flex;
+        width: 100%;
+        overflow: hidden;
+        overflow-x: auto;
+        padding-top: 10rpx;
+      }
       .scroll-tab-item {
         position: relative;
         display: inline-block;
@@ -142,6 +147,7 @@
         color: #999999;
         margin: 0rpx 20rpx 20rpx 0;
         font-size: 24rpx;
+        flex-shrink: 0;
         .reg-text {
           position: absolute;
           top: -6rpx;

pages/reportForm/reportForm.vue

@@ -28,18 +28,14 @@
             </swiper-item>
           </view>
         </swiper>
-        <!-- <view class="bulletin" @click="lookBulletinhandler">
-          <image :src="bulletinData.IndexImg"></image>
-          <image v-if="bulletinData.IsShowSustainable" class="limit-img" src="https://hzchart.oss-cn-shanghai.aliyuncs.com/cygx/czbk/limit_icon.png"></image>
-        </view> -->
       </view>
       <view class="tab-cont-two">
-        <block v-for="(item, index) in tabBarsTow" :key="item.CategoryId">
-          <view :id="'__' + index" class="scroll-tab-item" :class="{ active: tabAct_idTwo == item.CategoryId }" @click.stop="toggleTabTwo(item, index)">
-            {{ item.MatchTypeName }}
-            <text class="reg-text" v-if="item.IsRed"></text>
+        <view v-for="(item, index) in tabBarsTow" :key="index" class="scroll-tab-box">
+          <view v-for="key in item.Items" :key="key.CategoryId" :id="'__' + index" class="scroll-tab-item" :class="{ active: tabAct_idTwo == key.CategoryId }" @click.stop="toggleTabTwo(key, index)">
+            {{ key.MatchTypeName }}
+            <text class="reg-text" v-if="key.IsRed"></text>
           </view>
-        </block>
+        </view>
       </view>
       <view class="row"> </view>
       <block v-if="tabAct_idTwo != 99999">
@@ -297,17 +293,40 @@ export default {
       Reports.getstrategyAll({
         ChartPermissionId: this.tabAct_id,
       }).then((res) => {
-        this.tabBarsTow = res.Data.List;
-        this.tabBarsTow.push({
-          CategoryId: 100001,
-          IsRed: false,
-          MatchTypeName: "曲线工具",
-          SubCategoryName: "",
-        });
+        this.tabAct_id == 23 &&
+          res.Data.List.push({
+            CategoryId: 100001,
+            IsRed: false,
+            ListGroup: 4,
+            MatchTypeName: "数据思维",
+            SubCategoryName: "",
+          });
         if (!this.tabAct_idTwo) {
           this.tabAct_idTwo = res.Data.List[0].CategoryId;
         }
+
         this.matchTypeName = res.Data.List[0].MatchTypeName;
+        // 使用 Map 来存储分组后的数据
+        const result = new Map();
+
+        // 将原始数据按 ListGroup 分组
+        res.Data.List.forEach((item) => {
+          // 如果当前 ListGroup 不存在，初始化一个新数组
+          if (!result.has(item.ListGroup)) {
+            result.set(item.ListGroup, []);
+          }
+
+          // 获取对应 ListGroup 的数组，并添加当前项
+          const groupArray = result.get(item.ListGroup);
+          groupArray.push(item);
+        });
+
+        // 如果需要将 Map 转换回普通对象或数组形式，请使用以下代码：
+        const arrayResult = Array.from(result.entries()).map(([ListGroup, items]) => ({
+          GroupId: ListGroup,
+          Items: items, // 当前 GroupId 对应的所有项目
+        }));
+        this.tabBarsTow = arrayResult;
       });
     },
     //tabs切换事件