我的赛事

pages/usermymatch/index.js

@@ -6,15 +6,104 @@ Page({
      */
     data: {
         frameStyle: { useTop: true, name: '我的赛事', leftArrow: true, useBar: false },
+        // 选项卡
+        tabs: {
+            active: 'a',
+            list: [
+                { title: '小组赛', name: 'a' },
+                { title: '淘汰赛', name: 'b' },
+
+            ],
+        },
         list: [
-            { grouping_name: 'test1', project_name: 'name1', match_name: '羽毛球赛', match_time: '2022-08-10 12:00', ground_name: '场地一', status: 1 },
+            {
+                match_time: '比赛时间',
+                match_name: '比赛名称',
+                grouping_name: '赛事组别',
+                project_name: '组内项目',
+                ground_name: '比赛场地',
+            },
+            {
+                match_time: '比赛时间',
+                match_name: '比赛名称',
+                grouping_name: '赛事组别',
+                project_name: '组内项目',
+                ground_name: '比赛场地',
+            },
+            {
+                match_time: '比赛时间',
+                match_name: '比赛名称',
+                grouping_name: '赛事组别',
+                project_name: '组内项目',
+                ground_name: '比赛场地',
+            },
+            {
+                match_time: '比赛时间',
+                match_name: '比赛名称',
+                grouping_name: '赛事组别',
+                project_name: '组内项目',
+                ground_name: '比赛场地',
+            },
+            {
+                match_time: '比赛时间',
+                match_name: '比赛名称',
+                grouping_name: '赛事组别',
+                project_name: '组内项目',
+                ground_name: '比赛场地',
+            },
+            {
+                match_time: '比赛时间',
+                match_name: '比赛名称',
+                grouping_name: '赛事组别',
+                project_name: '组内项目',
+                ground_name: '比赛场地',
+            },
+            {
+                match_time: '比赛时间',
+                match_name: '比赛名称',
+                grouping_name: '赛事组别',
+                project_name: '组内项目',
+                ground_name: '比赛场地',
+            },
+            {
+                match_time: '比赛时间',
+                match_name: '比赛名称',
+                grouping_name: '赛事组别',
+                project_name: '组内项目',
+                ground_name: '比赛场地',
+            },
+            {
+                match_time: '比赛时间',
+                match_name: '比赛名称',
+                grouping_name: '赛事组别',
+                project_name: '组内项目',
+                ground_name: '比赛场地',
+            }, {
+                match_time: '比赛时间',
+                match_name: '比赛名称',
+                grouping_name: '赛事组别',
+                project_name: '组内项目',
+                ground_name: '比赛场地',
+            },
+            {
+                match_time: '比赛时间',
+                match_name: '比赛名称',
+                grouping_name: '赛事组别',
+                project_name: '组内项目',
+                ground_name: '比赛场地',
+            },
         ]
     },
     // 跳转菜单
     back(e) {
         wx.navigateBack({ delta: 1 })
     },
-
+    // 选项卡
+    tabsChange: function (e) {
+        const that = this;
+        const { name } = e.detail;
+        that.setData({ 'tabs.active': name });
+    },
     /**
      * 生命周期函数--监听页面加载
      */

pages/usermymatch/index.json

@@ -2,6 +2,7 @@
   "component": true,
   "usingComponents": {
     "mobile-main": "/commpents/mobile-frame/index",
+    "e-tabs": "/commpents/tabs/index",
     "e-dialog": "/commpents/dialog/index"
   }
 }

pages/usermymatch/index.less

@@ -4,34 +4,15 @@
     .zero {
         width: 96vw;
         margin: 0 0 2vw 0;
-        // background-color: #fff;
+
     }
 
     .zero:last-child {
         margin: 0;
     }
 
-    .one {
-        display: flex;
-        flex-direction: row;
-        border-radius: 5px;
-        background-color: #f1f1f1;
-
-        .one_1 {
-            width: 80vw;
-
-            input {
-                width: 100%;
-                font-size: 15px;
-                margin: 5px;
-            }
-        }
-
-    }
-
     .two {
         flex-grow: 1;
-        width: 100%;
         position: relative;
 
         .scroll-view {
@@ -48,7 +29,7 @@
                 .list {
                     background-color: #ffffff;
                     border-bottom: 1px solid #cccccc;
-                    width: 95vw;
+                    width: 96vw;
                     padding: 2vw;
 
                     .name {
@@ -91,5 +72,4 @@
             }
         }
     }
-
 }

pages/usermymatch/index.wxml

@@ -1,24 +1,69 @@
 <mobile-main frameStyle="{{frameStyle}}" bind:back="back">
     <view slot="info" class="container main">
         <view class="zero one">
-            <view class="one_1">
-                <input type="text" value="{{searchInfo.title}}" bindconfirm="search" placeholder="请输入赛事名称" />
-            </view>
+            <e-tabs tabs="{{tabs}}" bind:tabsChange="tabsChange"></e-tabs>
         </view>
         <view class="zero two">
             <scroll-view scroll-y="true" class="scroll-view">
                 <view class="list-scroll-view">
-                    <view class="list" wx:for="{{list}}" wx:key="item">
-                        <view class="name">{{item.grouping_name}}-{{item.project_name}}</view>
-                        <view class="other">
-                            <view class="other_1"><text>赛事名称：</text><text>{{item.match_name||'暂无'}}</text></view>
-                            <view class="other_1"><text>比赛时间：</text><text>{{item.match_time||'暂无'}}</text></view>
-                            <view class="other_1"><text>比赛场地：</text><text>{{item.ground_name||'暂无'}}</text></view>
-                            <view class="other_1"><text>比赛状态：</text><text>{{item.status=='0'?'已安排':item.status=='1'?'待开赛':item.status=='2'?'已开赛':item.status=='3'?'已结束':'暂无'}}</text>
+                    <view wx:if="{{tabs.active=='a'}}" class="a">
+                        <view class="list" wx:for="{{list}}" wx:key="item">
+                            <view class="name">{{item.match_time}}</view>
+                            <view class="other">
+                                <view class="other_1">
+                                    <text>赛事名称：</text>
+                                    <text>{{item.match_name}}</text>
+                                </view>
+                                <view class="other_1">
+                                    <text>赛事组别：</text>
+                                    <text>{{item.grouping_name}}</text>
+                                </view>
+                                <view class="other_1">
+                                    <text>组内项目：</text>
+                                    <text>{{item.project_name}}</text>
+                                </view>
+                                <view class="other_1">
+                                    <text>赛事场地：</text>
+                                    <text>{{item.ground_name}}</text>
+                                </view>
+                                <view class="other_1">
+                                    <text>比赛状态：</text>
+                                    <text>{{item.status=='0'?'已安排':item.status=='1'?'待开赛':item.status=='2'?'已开赛':item.status=='3'?'已结束':'暂无'}}</text>
+                                </view>
+                            </view>
+                            <view class="btn">
+                                <button type="primary" size="mini" bindtap="toView" data-item="{{item}}">详细信息</button>
                             </view>
                         </view>
-                        <view class="btn">
-                            <button type="primary" size="mini" bindtap="toEdit" data-item="{{item}}">详细信息</button>
+                    </view>
+                    <view wx:elif="{{tabs.active=='b'}}" class="a b">
+                        <view class="list" wx:for="{{list}}" wx:key="item">
+                            <view class="name">{{item.match_time}}</view>
+                            <view class="other">
+                                <view class="other_1">
+                                    <text>赛事名称：</text>
+                                    <text>{{item.match_name}}</text>
+                                </view>
+                                <view class="other_1">
+                                    <text>赛事组别：</text>
+                                    <text>{{item.grouping_name}}</text>
+                                </view>
+                                <view class="other_1">
+                                    <text>组内项目：</text>
+                                    <text>{{item.project_name}}</text>
+                                </view>
+                                <view class="other_1">
+                                    <text>赛事场地：</text>
+                                    <text>{{item.ground_name}}</text>
+                                </view>
+                                <view class="other_1">
+                                    <text>比赛状态：</text>
+                                    <text>{{item.status=='0'?'已安排':item.status=='1'?'待开赛':item.status=='2'?'已开赛':item.status=='3'?'已结束':'暂无'}}</text>
+                                </view>
+                            </view>
+                            <view class="btn">
+                                <button type="primary" size="mini" bindtap="toView" data-item="{{item}}">详细信息</button>
+                            </view>
                         </view>
                     </view>
                 </view>

pages/usermymatch/index.wxss

@@ -8,23 +8,8 @@
 .main .zero:last-child {
   margin: 0;
 }
-.main .one {
-  display: flex;
-  flex-direction: row;
-  border-radius: 5px;
-  background-color: #f1f1f1;
-}
-.main .one .one_1 {
-  width: 80vw;
-}
-.main .one .one_1 input {
-  width: 100%;
-  font-size: 15px;
-  margin: 5px;
-}
 .main .two {
   flex-grow: 1;
-  width: 100%;
   position: relative;
 }
 .main .two .scroll-view {
@@ -41,7 +26,7 @@
 .main .two .scroll-view .list-scroll-view .list {
   background-color: #ffffff;
   border-bottom: 1px solid #cccccc;
-  width: 95vw;
+  width: 96vw;
   padding: 2vw;
 }
 .main .two .scroll-view .list-scroll-view .list .name {