我的赛事-详细信息

pages/usermymatch/index.js

@@ -6,6 +6,7 @@ Page({
      */
     data: {
         frameStyle: { useTop: true, name: '我的赛事', leftArrow: true, useBar: false },
+        dialog: { title: '详细信息', show: false, type: '1' },
         // 选项卡
         tabs: {
             active: 'a',
@@ -92,7 +93,9 @@ Page({
                 project_name: '组内项目',
                 ground_name: '比赛场地',
             },
-        ]
+        ],
+        // 详细信息
+        info: {},
     },
     // 跳转菜单
     back(e) {
@@ -104,6 +107,18 @@ Page({
         const { name } = e.detail;
         that.setData({ 'tabs.active': name });
     },
+    // 详细信息
+    toView: async function (e) {
+        const { item } = e.currentTarget.dataset;
+        const that = this;
+        that.setData({ info: item })
+        that.setData({ dialog: { title: '详细信息', show: true, type: '1' } })
+    },
+    // 关闭弹框
+    toClose: function () {
+        const that = this;
+        that.setData({ dialog: { title: '详细信息', show: false, type: '1' } })
+    },
     /**
      * 生命周期函数--监听页面加载
      */

pages/usermymatch/index.less

@@ -72,4 +72,34 @@
             }
         }
     }
+}
+
+.dialog_one {
+    margin: 10px 0 0 0;
+
+    .one_1 {
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+        border: 1px solid #ccc;
+        border-radius: 5px;
+        margin: 0 0 10px 0;
+        padding: 10px;
+
+        .text {
+            width: 22vw;
+            color: #666;
+            font-size: 16px;
+        }
+
+        .text1 {
+            font-size: 16px;
+            color: #000;
+        }
+
+        .image {
+            width: 15vw;
+            height: 15vw;
+        }
+    }
 }

pages/usermymatch/index.wxml

@@ -70,4 +70,35 @@
             </scroll-view>
         </view>
     </view>
-</mobile-main>
+</mobile-main>
+<e-dialog dialog="{{dialog}}" bind:toClose="toClose">
+    <view slot="info">
+        <view class="dialog_one" wx:if="{{dialog.type=='1'}}">
+            <view class="name">{{item.match_time}}</view>
+            <view class="one_1">
+                <text class="text">赛事名称：</text>
+                <text class="text1">{{info.match_name||'暂无'}}</text>
+            </view>
+            <view class="one_1">
+                <text class="text">比赛时间：</text>
+                <text class="text1">{{info.match_time||'暂无'}}</text>
+            </view>
+            <view class="one_1">
+                <text class="text">赛事组别：</text>
+                <text class="text1">{{info.grouping_name||'暂无'}}</text>
+            </view>
+            <view class="one_1">
+                <text class="text">组内项目：</text>
+                <text class="text1">{{info.project_name||'暂无'}}</text>
+            </view>
+            <view class="one_1">
+                <text class="text">赛事场地：</text>
+                <text class="text1">{{info.ground_name||'暂无'}}</text>
+            </view>
+            <view class="one_1">
+                <text class="text">比赛状态：</text>
+                <text class="text1">{{info.status=='0'?'已安排':info.status=='1'?'待开赛':info.status=='2'?'已开赛':info.status=='3'?'已结束':'暂无'}}</text>
+            </view>
+        </view>
+    </view>
+</e-dialog>

pages/usermymatch/index.wxss

@@ -57,3 +57,28 @@
 .main .two .scroll-view .list-scroll-view .list:last-child {
   border-bottom: none;
 }
+.dialog_one {
+  margin: 10px 0 0 0;
+}
+.dialog_one .one_1 {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  border: 1px solid #ccc;
+  border-radius: 5px;
+  margin: 0 0 10px 0;
+  padding: 10px;
+}
+.dialog_one .one_1 .text {
+  width: 22vw;
+  color: #666;
+  font-size: 16px;
+}
+.dialog_one .one_1 .text1 {
+  font-size: 16px;
+  color: #000;
+}
+.dialog_one .one_1 .image {
+  width: 15vw;
+  height: 15vw;
+}