1

app.json

@@ -19,6 +19,8 @@
         "pages/match/projectadd",
         "pages/match/matchgroup",
         "pages/match/shteam",
+        "pages/matchInfo/index",
+        "pages/matchInfo/sign",
         "pages/test/index"
     ],
     "usingComponents": {

pages/home/index.js

@@ -8,115 +8,49 @@ Page({
     data: {
         frameStyle: { useTop: true, name: '首页', leftArrow: false, useBar: true },
         //查询条件
-        searchInfo: {
-            name: '',
-            type: '',
-            city_type: '',
-            match_type: '',
-            type_name: '',
-            match_name: '',
-            city_name: ''
-        },
-        //是否显示
-        show: false,
-        //按钮类型
-        btntype: '',
-        list: [
-            { id: "1", src: "/image/ceshi.jpg", name: "2021南宁·LYB李永波全球业余羽毛球锦标赛-南宁分站赛", status: '0', time: '2021/10/12-2022/07/15', match_time: '2021/10/12-2022/07/15', address: '广西壮族自治区南宁市李宁体育园羽毛球馆' },
-            { id: "2", src: "/image/ceshi.jpg", name: "李宁·谌龙杯羽毛球单打公开赛【厦门站团体赛】", status: '1', time: '2021/10/12-2022/07/15', match_time: '2021/10/12-2022/07/15', address: '福建省厦门市工人体育馆一楼羽毛球馆' },
-            { id: "3", src: "/image/ceshi.jpg", name: "李宁·谌龙杯羽毛球单打公开赛【厦门站单项赛】", status: '2', time: '2021/10/12-2022/07/15', match_time: '2021/10/12-2022/07/15', address: '福建省厦门市工人体育馆一楼羽毛球馆' },
-            { id: "3", src: "/image/ceshi.jpg", name: "李宁·谌龙杯羽毛球单打公开赛【厦门站单项赛】", status: '3', time: '2021/10/12-2022/07/15', match_time: '2021/10/12-2022/07/15', address: '福建省厦门市工人体育馆一楼羽毛球馆' },
-            { id: "3", src: "/image/ceshi.jpg", name: "李宁·谌龙杯羽毛球单打公开赛【厦门站单项赛】", status: '4', time: '2021/10/12-2022/07/15', match_time: '2021/10/12-2022/07/15', address: '福建省厦门市工人体育馆一楼羽毛球馆' }
-        ],
-        typeList: [
-            { label: '', value: '全部' },
-            { label: '1', value: '羽毛球' },
-        ],
-        cityList: [
-            { label: '0', value: '吉林省' },
-            { label: '1', value: '长春市' },
-        ],
-        matchList: match_status
+        searchInfo: {},
+        list: []
     },
     // 跳转菜单
     tabPath(e) {
         let { route } = e.detail.detail;
         if (route) wx.redirectTo({ url: `/${route}` })
     },
-    //搜索
-    onSearch() {
-        console.log("搜索");
-    },
-    //按钮类型
-    btnChange: function (e) {
+    // 查询
+    search: function (e) {
         const that = this;
-        const { value } = e.currentTarget.dataset;
-        that.setData({ btntype: value })
-
-    },
-    //显示弹框
-    showPopup() {
-        this.setData({ show: true });
+        that.setData({ 'searchInfo.name': e.detail.value });
+        that.watchLogin()
     },
-    //关闭弹框
-    onClose() {
-        this.setData({ show: false });
-    },
-    //运动类型选择
-    ontypeConfirm(event) {
-        const that = this;
-        const { value } = event.detail;
-        that.setData({ "searchInfo.type_name": value.value })
-        that.setData({ "searchInfo.type": '0' })
-        this.setData({ show: false });
-    },
-    //城市选择
-    oncityConfirm(event) {
-        const that = this;
-        const { value } = event.detail;
-        that.setData({ "searchInfo.city_name": value.value })
-        that.setData({ "searchInfo.city_type": '1' })
-        this.setData({ show: false });
-    },
-    //比赛状态选择
-    onmatchConfirm(event) {
-        const that = this;
-        const { value } = event.detail;
-        that.setData({ "searchInfo.match_name": value.value })
-        that.setData({ "searchInfo.match_type": '2' })
-        this.setData({ show: false });
-    },
-    //取消类型选择
-    onCancel() {
-        const that = this;
-        console.log('取消');
-        that.setData({ btntype: '' })
-        this.setData({ show: false });
-
-    },
-    searchChange: function (e) {
-        const that = this;
-        const { value } = e.currentTarget.dataset;
-        that.setData({ searchType: value })
-    },
-    // 运动类型选择
-    typeChange: function (e) {
-        const that = this;
-        let data = that.data.typeList.find((i) => i.label == e.detail.value);
-        if (data) { that.setData({ 'searchInfo.type': data.label }); that.setData({ 'searchInfo.type_name': data.value }); }
-    },
-    // 城市選擇
-    cityChange: function (e) {
-        const that = this;
-        let data = that.data.cityList.find((i) => i.label == e.detail.value);
-        if (data) { that.setData({ 'searchInfo.city': data.label }); that.setData({ 'searchInfo.city_name': data.value }); }
+    toView: function (e) {
+        const { item } = e.currentTarget.dataset;
+        wx.navigateTo({ url: `/pages/matchInfo/index?id=${item._id}` })
     },
     /**
      * 生命周期函数--监听页面加载
      */
     onLoad: function (options) {
         const that = this;
-
+        that.watchLogin()
+    },
+    watchLogin: function () {
+        const that = this;
+        let searchInfo = that.data.searchInfo;
+        wx.getStorage({
+            key: 'user',
+            success: async (res) => {
+                let info = {};
+                if (searchInfo && searchInfo.name) info.name = searchInfo.name;
+                const arr = await app.$get(`/newCourt/api/match`, { ...info });
+                if (arr.errcode == '0') {
+                    11
+                    that.setData({ list: arr.data })
+                } else { wx.showToast({ title: `${res.errMsg}`, icon: 'fail', duration: 2000 }); }
+            },
+            fail: async (res) => {
+                wx.redirectTo({ url: '/pages/index/index' });
+            },
+        });
     },
     /**
      * 生命周期函数--监听页面初次渲染完成

pages/home/index.less

@@ -1,30 +1,33 @@
 .main {
     height: 80.8vh;
-    // background-color: red;
 
-    .one {
-        width: 100%;
+    .zero {
+        width: 96vw;
+        margin: 0 0 2vw 0;
     }
 
-    .two {
+    .zero:nth-child(2) {
+        margin: 0 0 0 0;
+    }
+
+    .one {
         display: flex;
         flex-direction: row;
-        justify-content: space-around;
-        width: 96vw;
-        background-color: #ffffff;
-        margin-bottom: 1px;
-        padding: 10px 0;
+        justify-content: space-between;
+        padding: 2vw;
+        width: 92vw;
+        background-color: #fff;
 
-        text {
+        input {
             font-size: 14px;
         }
+
     }
 
-    .thr {
-        width: 96vw;
+    .two {
         flex-grow: 1;
+        width: 100%;
         position: relative;
-        background-color: #ffffff;
 
         .scroll-view {
             position: absolute;
@@ -35,105 +38,62 @@
 
             .list-scroll-view {
                 display: flex;
-                flex-wrap: wrap;
-                align-content: flex-start;
-                justify-content: space-between;
+                flex-direction: column;
 
                 .list {
+                    border-bottom: 1px solid #cccccc;
+                    padding: 2vw 0;
                     display: flex;
-                    width: 96vw;
-                    margin: 10px 0;
-                    border-bottom: 0.1px solid #D1CFCF;
+                    flex-direction: row;
+                    justify-content: space-between;
 
-                    .image {
-                        display: flex;
-                        justify-content: center;
-                        align-items: center;
-                        width: 30vw;
+                    .list_1 {
+                        padding: 8vw 0 0 0;
 
-                        image {
-                            width: 20vw;
-                            height: 20vw;
-                            border-radius: 5px;
+                        .image {
+                            width: 60px;
+                            height: 60px;
+                            border-radius: 10px;
                         }
                     }
 
-                    .content {
-                        padding: 5px;
+                    .list_2 {
+                        display: flex;
+                        flex-direction: column;
+                        width: 80vw;
+                        padding: 0 0 0 2vw;
 
                         .name {
-                            font-size: 14px;
+                            font-size: 16px;
                             font-weight: bold;
-                            padding: 2px 0;
-
-                            .color {
-                                font-size: 11px;
-                                color: #FFFFFF;
-                                border-radius: 2px;
-                                background-color: #b3ab3c;
-                                padding: 0 5px;
-                                margin-right: 2px;
-                            }
-
-                            .color0 {
-                                font-size: 11px;
-                                color: #FFFFFF;
-                                border-radius: 2px;
-                                background-color: #da2525;
-                                padding: 0 5px;
-                                margin-right: 2px;
-                            }
-
-                            .color1 {
-                                font-size: 11px;
-                                color: #FFFFFF;
-                                border-radius: 2px;
-                                background-color: #3c87b3;
-                                padding: 0 5px;
-                                margin-right: 2px;
-                            }
-
-                            .color2 {
-                                font-size: 11px;
-                                color: #FFFFFF;
-                                border-radius: 2px;
-                                background-color: #b33c6e;
-                                padding: 0 5px;
-                                margin-right: 2px;
-                            }
-
-                            .color3 {
-                                font-size: 11px;
-                                color: #FFFFFF;
-                                border-radius: 2px;
-                                background-color: #3cb3b3;
-                                padding: 0 5px;
-                                margin-right: 2px;
-                            }
-
-                            .color4 {
-                                font-size: 11px;
-                                color: #FFFFFF;
-                                border-radius: 2px;
-                                background-color: #3CB371;
-                                padding: 0 5px;
-                                margin-right: 2px;
-                            }
-
-                            .color5 {
-                                font-size: 11px;
-                                color: #FFFFFF;
-                                border-radius: 2px;
-                                background-color: #DA70D6;
-                                padding: 0 5px;
-                                margin-right: 2px;
+                            margin: 0 0 1vw 0;
+                            overflow: hidden;
+                            text-overflow: ellipsis;
+                            -webkit-line-clamp: 2;
+                            word-break: break-all;
+                            display: -webkit-box;
+                            -webkit-box-orient: vertical;
+
+                            .status {
+                                background-color: #ff0000;
+                                color: #fff;
+                                padding: 0 2vw;
+                                font-size: 14px;
                             }
                         }
 
-                        .title {
-                            font-size: 12px;
-                            color: #666;
-                            padding: 2px 0;
+                        .other {
+                            .other_1 {
+                                margin: 0 0 1vw 0;
+                                color: #000000a6;
+                                font-size: 12px;
+                                overflow: hidden;
+                                text-overflow: ellipsis;
+                                -webkit-line-clamp: 2;
+                                word-break: break-all;
+                                display: -webkit-box;
+                                -webkit-box-orient: vertical;
+                            }
                         }
                     }
                 }

pages/home/index.wxml

@@ -1,50 +1,39 @@
 <mobile-main frameStyle="{{frameStyle}}" bind:back="back" bind:tabPath="tabPath">
     <view slot="info" class="container main">
-        <view class="one">
-            <van-search value="{{ searchInfo.name }}" placeholder="请输入搜索关键词" show-action bind:search="onSearch" bind:cancel="onCancel" />
+        <view class="zero one">
+            <input type="text" value="{{searchInfo.name}}" bindconfirm="search" placeholder="请输入比赛名称" />
         </view>
-        <view class="two">
-            <view bindtap="btnChange" data-value="0">
-                <text wx:if="{{ searchInfo.type=='' }}">运动类型</text>
-                <text wx:if="{{ searchInfo.type=='0' }}">{{searchInfo.type_name||"运动类型"}}</text>
-                <van-icon bind:click="showPopup" name="arrow-down" />
-                <van-popup wx:if="{{btntype=='0'}}" position="bottom" custom-style="height: 46%;" show="{{ show }}" bind:close="onClose">
-                    <van-picker show-toolbar title="运动类型" value-key="value" columns="{{ typeList }}" bind:cancel="onCancel" bind:confirm="ontypeConfirm" />
-                </van-popup>
-            </view>
-            <view bindtap="btnChange" data-value="1">
-                <text wx:if="{{ searchInfo.city_type=='' }}">城市</text>
-                <text wx:if="{{ searchInfo.city_type=='1' }}">{{searchInfo.city_name||"城市"}}</text>
-                <van-icon bind:click="showPopup" name="arrow-down" />
-                <van-popup wx:if="{{btntype=='1'}}" position="bottom" custom-style="height: 46%;" show="{{ show }}" bind:close="onClose">
-                    <van-picker show-toolbar title="城市" value-key="value" columns="{{ cityList }}" bind:cancel="onCancel" bind:confirm="oncityConfirm" />
-                </van-popup>
-            </view>
-            <view bindtap="btnChange" data-value="2">
-                <text wx:if="{{ searchInfo.match_type=='' }}">比赛状态</text>
-                <text wx:if="{{ searchInfo.match_type=='2' }}">{{searchInfo.match_name||"比赛状态"}}</text>
-                <van-icon bind:click="showPopup" name="arrow-down" />
-                <van-popup wx:if="{{btntype=='2'}}" position="bottom" custom-style="height: 46%;" show="{{ show }}" bind:close="onClose">
-                    <van-picker show-toolbar title="比赛状态" value-key="value" columns="{{ matchList }}" bind:cancel="onCancel" bind:confirm="onmatchConfirm" />
-                </van-popup>
-            </view>
-        </view>
-        <view class="thr">
+        <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="image">
-                            <image src="{{item.src}}"></image>
+                    <view class="list" wx:for="{{list}}" wx:key="item" bindtap="toView" data-item="{{item}}">
+                        <view class="list_1">
+                            <image class="image" src="{{item.logo&&item.logo.length>0?item.logo[0].url:''}}"></image>
                         </view>
-                        <view class="content">
-                            <view class="name"><text class="color{{item.status}}">{{item.status=='0'?'报名中':item.status=='1'?'报名截止':item.status=='2'?'报名结束':item.status=='3'?'发布秩序册':item.status=='4'?'比赛中':item.status=='5'?'比赛结束':'全部'}}</text>{{item.name}}</view>
-                            <view class="title">报名时间：{{item.time}}</view>
-                            <view class="title">比赛时间：{{item.match_time}}</view>
-                            <view class="title">比赛地址：{{item.address}}</view>
+                        <view class="list_2">
+                            <view class="name">
+                                <text class="status">{{item.status=='0'?'报名中':'暂无'}}</text>
+                                <text>{{item.name}}</text>
+                            </view>
+                            <view class="other">
+                                <view class="other_1">
+                                    <text>报名时间：</text>
+                                    <text>{{item.sign_end_time}}</text>
+                                </view>
+                                <view class="other_1">
+                                    <text>比赛时间：</text>
+                                    <text>{{item.start_time}}-{{item.end_time}}</text>
+                                </view>
+                                <view class="other_1">
+                                    <text>比赛地点：</text>
+                                    <text>{{item.address}}</text>
+                                </view>
+                            </view>
                         </view>
                     </view>
                 </view>
             </scroll-view>
         </view>
+
     </view>
 </mobile-main>

pages/home/index.wxss

@@ -1,123 +1,86 @@
 .main {
   height: 80.8vh;
 }
-.main .one {
-  width: 100%;
+.main .zero {
+  width: 96vw;
+  margin: 0 0 2vw 0;
 }
-.main .two {
+.main .zero:nth-child(2) {
+  margin: 0 0 0 0;
+}
+.main .one {
   display: flex;
   flex-direction: row;
-  justify-content: space-around;
-  width: 96vw;
-  background-color: #ffffff;
-  margin-bottom: 1px;
-  padding: 10px 0;
+  justify-content: space-between;
+  padding: 2vw;
+  width: 92vw;
+  background-color: #fff;
 }
-.main .two text {
+.main .one input {
   font-size: 14px;
 }
-.main .thr {
-  width: 96vw;
+.main .two {
   flex-grow: 1;
+  width: 100%;
   position: relative;
-  background-color: #ffffff;
 }
-.main .thr .scroll-view {
+.main .two .scroll-view {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
 }
-.main .thr .scroll-view .list-scroll-view {
+.main .two .scroll-view .list-scroll-view {
   display: flex;
-  flex-wrap: wrap;
-  align-content: flex-start;
-  justify-content: space-between;
+  flex-direction: column;
 }
-.main .thr .scroll-view .list-scroll-view .list {
+.main .two .scroll-view .list-scroll-view .list {
+  border-bottom: 1px solid #cccccc;
+  padding: 2vw 0;
   display: flex;
-  width: 96vw;
-  margin: 10px 0;
-  border-bottom: 0.1px solid #D1CFCF;
+  flex-direction: row;
+  justify-content: space-between;
 }
-.main .thr .scroll-view .list-scroll-view .list .image {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 30vw;
+.main .two .scroll-view .list-scroll-view .list .list_1 {
+  padding: 8vw 0 0 0;
 }
-.main .thr .scroll-view .list-scroll-view .list .image image {
-  width: 20vw;
-  height: 20vw;
-  border-radius: 5px;
+.main .two .scroll-view .list-scroll-view .list .list_1 .image {
+  width: 60px;
+  height: 60px;
+  border-radius: 10px;
 }
-.main .thr .scroll-view .list-scroll-view .list .content {
-  padding: 5px;
+.main .two .scroll-view .list-scroll-view .list .list_2 {
+  display: flex;
+  flex-direction: column;
+  width: 80vw;
+  padding: 0 0 0 2vw;
 }
-.main .thr .scroll-view .list-scroll-view .list .content .name {
-  font-size: 14px;
+.main .two .scroll-view .list-scroll-view .list .list_2 .name {
+  font-size: 16px;
   font-weight: bold;
-  padding: 2px 0;
-}
-.main .thr .scroll-view .list-scroll-view .list .content .name .color {
-  font-size: 11px;
-  color: #FFFFFF;
-  border-radius: 2px;
-  background-color: #b3ab3c;
-  padding: 0 5px;
-  margin-right: 2px;
-}
-.main .thr .scroll-view .list-scroll-view .list .content .name .color0 {
-  font-size: 11px;
-  color: #FFFFFF;
-  border-radius: 2px;
-  background-color: #da2525;
-  padding: 0 5px;
-  margin-right: 2px;
-}
-.main .thr .scroll-view .list-scroll-view .list .content .name .color1 {
-  font-size: 11px;
-  color: #FFFFFF;
-  border-radius: 2px;
-  background-color: #3c87b3;
-  padding: 0 5px;
-  margin-right: 2px;
-}
-.main .thr .scroll-view .list-scroll-view .list .content .name .color2 {
-  font-size: 11px;
-  color: #FFFFFF;
-  border-radius: 2px;
-  background-color: #b33c6e;
-  padding: 0 5px;
-  margin-right: 2px;
-}
-.main .thr .scroll-view .list-scroll-view .list .content .name .color3 {
-  font-size: 11px;
-  color: #FFFFFF;
-  border-radius: 2px;
-  background-color: #3cb3b3;
-  padding: 0 5px;
-  margin-right: 2px;
-}
-.main .thr .scroll-view .list-scroll-view .list .content .name .color4 {
-  font-size: 11px;
-  color: #FFFFFF;
-  border-radius: 2px;
-  background-color: #3CB371;
-  padding: 0 5px;
-  margin-right: 2px;
-}
-.main .thr .scroll-view .list-scroll-view .list .content .name .color5 {
-  font-size: 11px;
-  color: #FFFFFF;
-  border-radius: 2px;
-  background-color: #DA70D6;
-  padding: 0 5px;
-  margin-right: 2px;
+  margin: 0 0 1vw 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  -webkit-line-clamp: 2;
+  word-break: break-all;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+}
+.main .two .scroll-view .list-scroll-view .list .list_2 .name .status {
+  background-color: #ff0000;
+  color: #fff;
+  padding: 0 2vw;
+  font-size: 14px;
 }
-.main .thr .scroll-view .list-scroll-view .list .content .title {
+.main .two .scroll-view .list-scroll-view .list .list_2 .other .other_1 {
+  margin: 0 0 1vw 0;
+  color: #000000a6;
   font-size: 12px;
-  color: #666;
-  padding: 2px 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  -webkit-line-clamp: 2;
+  word-break: break-all;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
 }

pages/match/matchgroup.js

@@ -76,6 +76,7 @@ Page({
     // 关闭弹框
     toClose: function () {
         const that = this;
+        that.setData({ form: {} })
         that.setData({ dialog: { title: '赛事组别', show: false, type: '1' } })
     },
     /**

pages/match/projectadd.less

@@ -25,6 +25,7 @@
                 input {
                     text-align: right;
                 }
+
                 textarea {
                     text-align: right;
                 }
@@ -33,7 +34,7 @@
 
         .btn {
             width: 96vw;
-            margin: 50px 0;
+            margin: 2vw 0 0 0;
             text-align: center;
         }
     }

pages/match/projectadd.wxml

@@ -16,7 +16,7 @@
                 </view>
                 <view class="content">
                     <view class="label">比赛项目说明：</view>
-                    <view class="value"><textarea auto-height name="explain" value="{{form.explain}}" placeholder="请输入比赛项目说明"></textarea></view>
+                    <view class="value"><textarea name="explain" value="{{form.explain}}" auto-height placeholder="请输入比赛项目说明"></textarea></view>
                 </view>
                 <view class="content">
                     <view class="label">比赛人数：</view>

pages/match/projectadd.wxss

@@ -29,6 +29,6 @@
 }
 .main .one .btn {
   width: 96vw;
-  margin: 50px 0;
+  margin: 2vw 0 0 0;
   text-align: center;
 }

pages/matchInfo/index.js

@@ -0,0 +1,111 @@
+const app = getApp()
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        frameStyle: { useTop: true, name: '赛事信息', leftArrow: true, useBar: false },
+        id: '',
+        info: {},
+        // 选项卡
+        tabs: {
+            active: 'a',
+            list: [
+                { title: '规程', name: 'a' },
+                { title: '选手', name: 'b' },
+                { title: '秩序册', name: 'c' },
+                { title: '赛况', name: 'd' },
+                { title: '成绩册', name: 'e' },
+            ],
+        },
+    },
+    // 跳转菜单
+    back(e) {
+        wx.navigateBack({ delta: 1 })
+    },
+    // 选项卡
+    tabsChange: function (e) {
+        const that = this;
+        that.setData({ 'tabs.active': e.detail.name });
+    },
+    // 报名
+    toSign: function (e) {
+        const { item } = e.currentTarget.dataset;
+        wx.navigateTo({ url: `/pages/matchInfo/sign?id=${item._id}` })
+    },
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad: function (options) {
+        const that = this;
+        that.setData({ id: options.id || '62e23cd3bb22e03d0b49d73b' });
+        // 监听用户是否登录
+        that.watchLogin();
+    },
+    watchLogin: function () {
+        const that = this;
+        wx.getStorage({
+            key: 'user',
+            success: async (res) => {
+                if (that.data.id) {
+                    const arr = await app.$get(`/newCourt/api/match/${that.data.id}`);
+                    if (arr.errcode == '0') {
+                        that.setData({ info: arr.data })
+                    } else { wx.showToast({ title: `${res.errMsg}`, icon: 'fail', duration: 2000 }); }
+                }
+            },
+            fail: async (res) => {
+                wx.redirectTo({ url: '/pages/index/index' });
+            },
+        });
+    },
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload: function () {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh: function () {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom: function () {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage: function () {
+
+    }
+})

pages/matchInfo/index.json

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

pages/matchInfo/index.less

@@ -0,0 +1,13 @@
+.main {
+    height: 88.8vh;
+
+    .zero {
+        width: 96vw;
+        background-color: #ff0000;
+        margin: 0 0 2vw 0;
+    }
+
+    .zero:nth-child(2) {
+        margin: 0;
+    }
+}

pages/matchInfo/index.wxml

@@ -0,0 +1,19 @@
+<mobile-main frameStyle="{{frameStyle}}" bind:back="back">
+    <view slot="info" class="container main">
+        <view class="zero one">
+            <e-tabs tabs="{{tabs}}" bind:tabsChange="tabsChange"></e-tabs>
+            <view wx:if="{{tabs.active=='a'}}" class="a">
+                {{info.name}}
+            </view>
+            <view wx:elif="{{tabs.active=='b'}}" class="b">
+                b
+            </view>
+            <view wx:elif="{{tabs.active=='c'}}" class="b">
+                c
+            </view>
+        </view>
+        <view class="zero two">
+            <button type="primary" size="mini" bindtap="toSign" data-item="{{info}}">赛事报名</button>
+        </view>
+    </view>
+</mobile-main>

pages/matchInfo/index.wxss

@@ -0,0 +1,11 @@
+.main {
+  height: 88.8vh;
+}
+.main .zero {
+  width: 96vw;
+  background-color: #ff0000;
+  margin: 0 0 2vw 0;
+}
+.main .zero:nth-child(2) {
+  margin: 0;
+}

pages/matchInfo/sign.js

@@ -0,0 +1,167 @@
+const app = getApp()
+import WxValidate from '../../utils/wxValidate';
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        frameStyle: { useTop: true, name: '赛事信息', leftArrow: true, useBar: false },
+        id: '',
+        info: {},
+        form: {},
+        projectList: [],
+        dialog: { title: '支付报名费', show: false, type: '1' },
+        enrollInfo: {}
+    },
+    initValidate() {
+        const rules = { grouping_id: { required: true }, project_id: { required: true } }
+        // 验证字段的提示信息，若不传则调用默认的信息
+        const messages = { grouping_id: { required: '请选择赛事分组' }, project_id: { required: '请选择组内项目' } };
+        this.WxValidate = new WxValidate(rules, messages)
+    },
+    // 跳转菜单
+    back(e) {
+        wx.navigateBack({ delta: 1 })
+    },
+    // 赛事分组
+    groupingChange: async function (e) {
+        const that = this;
+        let data = that.data.info.grouping[e.detail.value];
+        that.setData({ 'form.grouping_id': data._id });
+        that.setData({ 'form.grouping_name': data.name });
+        let project = [];
+        for (const val of data.project) {
+            const arr = await app.$get(`/newCourt/api/matchProject/${val}`);
+            if (arr.errcode == '0') { project.push(arr.data) }
+        }
+        that.setData({ projectList: project });
+    },
+    // 选择组内项目
+    projectChange: function (e) {
+        const that = this;
+        let data = that.data.projectList[e.detail.value];
+        that.setData({ 'form.project_id': data._id });
+        that.setData({ 'form.project_name': data.name });
+    },
+    onSubmit: async function (e) {
+        const that = this;
+        const params = e.detail.value;
+        if (!this.WxValidate.checkForm(params)) {
+            const error = this.WxValidate.errorList[0];
+            wx.showToast({ title: `${error.msg}`, icon: 'error', duration: 2000 })
+            return false
+        } else {
+            const arr = await app.$post(`/newCourt/api/enroll`, params);
+            if (arr.errcode == '0') {
+                wx.showToast({ title: `报名成功`, icon: 'success', duration: 2000 });
+                that.setData({ enrollInfo: arr.data })
+                that.setData({ dialog: { title: '支付报名费', show: true, type: '1' } })
+            } else {
+                wx.showToast({ title: `${res.errMsg}`, icon: 'fail', duration: 2000 });
+            }
+        }
+    },
+    toForward: function () {
+
+    },
+    // 支付
+    toPay: async function () {
+        const that = this;
+        const enroll = that.data.enrollInfo;
+        wx.getStorage({
+            key: 'user',
+            success: async (res) => {
+                let obj = { openid: res.data.openid, money: 0.1, enroll_id: enroll._id }
+                const arr = await app.$post(`/newCourt/api/payOrder`, obj)
+                console.log(arr);
+            },
+            fail: async (res) => {
+                wx.redirectTo({ url: '/pages/index/index' });
+            },
+        });
+    },
+    // 关闭弹框
+    toclose: function () {
+        const that = this;
+        that.setData({ dialog: { title: '支付报名费', show: false, type: '1' } })
+    },
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad: function (options) {
+        const that = this;
+        that.setData({ id: options.id || '62e23cd3bb22e03d0b49d73b' });
+        //验证规则函数
+        that.initValidate();
+        // 监听用户是否登录
+        that.watchLogin();
+    },
+    watchLogin: function () {
+        const that = this;
+        wx.getStorage({
+            key: 'user',
+            success: async (res) => {
+                if (that.data.id) {
+                    const arr = await app.$get(`/newCourt/api/match/${that.data.id}`);
+                    if (arr.errcode == '0') {
+                        that.setData({ info: arr.data })
+                        let data = { openid: res.data.openid, match_id: arr.data._id, match_name: arr.data.name }
+                        that.setData({ form: data })
+                    } else { wx.showToast({ title: `${res.errMsg}`, icon: 'fail', duration: 2000 }); }
+                }
+            },
+            fail: async (res) => {
+                wx.redirectTo({ url: '/pages/index/index' });
+            },
+        });
+    },
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload: function () {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh: function () {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom: function () {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage: function () {
+        console.log('1');
+    },
+})

pages/matchInfo/sign.json

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

pages/matchInfo/sign.less

@@ -0,0 +1,64 @@
+.main {
+    height: 88.8vh;
+
+    .one {
+        width: 96vw;
+
+        .content {
+            background-color: #ffffff;
+            border-bottom: 1px solid #cccccc;
+            display: flex;
+            flex-direction: row;
+            justify-content: space-between;
+            padding: 2vw;
+            width: 92vw;
+
+            .label {
+                width: 25vw;
+                text-align: left;
+                font-size: 14px;
+            }
+
+            .value {
+                width: 65vw;
+                text-align: right;
+                font-size: 14px;
+
+                textarea {
+                    width: 65vw;
+                }
+            }
+        }
+
+        .btn {
+            margin: 2vw 0 0 0;
+            text-align: center;
+        }
+    }
+}
+
+.dialog_1 {
+    .info {
+        .info_1 {
+            font-size: 15px;
+            font-weight: bold;
+        }
+
+        .info_2 {
+            .info_2_1 {
+                margin: 0 0 1vw 0;
+                font-size: 12px;
+                color: #858585;
+            }
+        }
+    }
+
+    .btn {
+        text-align: center;
+
+        button {
+            margin: 0 2vw;
+            font-size: 12px;
+        }
+    }
+}

pages/matchInfo/sign.wxml

@@ -0,0 +1,66 @@
+<mobile-main frameStyle="{{frameStyle}}" bind:back="back">
+    <view slot="info" class="container main">
+        <view class="one">
+            <form catchsubmit="onSubmit">
+                <view class="content">
+                    <view class="label">openid</view>
+                    <view class="value"><input name="openid" value="{{form.openid}}" placeholder="请输入openid" disabled /></view>
+                </view>
+                <view class="content">
+                    <view class="label">比赛id</view>
+                    <view class="value"><input name="match_id" value="{{form.match_id}}" placeholder="请输入比赛id" disabled /></view>
+                </view>
+                <view class="content">
+                    <view class="label">比赛名称</view>
+                    <view class="value"> <textarea name="match_name" value="{{form.match_name}}" auto-height placeholder="请输入比赛名称" disabled /></view>
+                </view>
+                <view class="content">
+                    <view class="label">赛事分组</view>
+                    <view class="value">
+                        <picker mode="selector" bindchange="groupingChange" value="{{form.grouping_id}}" name="grouping_id" range-key='name' range="{{info.grouping}}">
+                            <view class="input">{{form.grouping_id||'请选择赛事分组'}}</view>
+                        </picker>
+                    </view>
+                </view>
+                <view class="content">
+                    <view class="label">赛事分组名称</view>
+                    <view class="value"><input name="grouping_name" value="{{form.grouping_name}}" placeholder="请输入赛事分组名称" disabled /></view>
+                </view>
+                <view class="content">
+                    <view class="label">组内项目</view>
+                    <view class="value">
+                        <picker mode="selector" bindchange="projectChange" value="{{form.project_id}}" name="project_id" range-key='name' range="{{projectList}}">
+                            <view class="input">{{form.project_id||'请选择组内项目'}}</view>
+                        </picker>
+                    </view>
+                </view>
+                <view class="content">
+                    <view class="label">组内项目名称</view>
+                    <view class="value"><input name="project_name" value="{{form.project_name}}" placeholder="请输入组内项目名称" disabled /></view>
+                </view>
+                <view wx:if="{{}}">
+                </view>
+                <view class="btn">
+                    <button type="primary" size="mini" form-type="submit">提交报名</button>
+                </view>
+            </form>
+        </view>
+    </view>
+</mobile-main>
+<e-dialog dialog="{{dialog}}" bind:toClose="toClose">
+    <view slot="info">
+        <view class="dialog_1" wx:if="{{dialog.type=='1'}}">
+            <view class="info">
+                <view class="info_1">温馨提示：</view>
+                <view class="info_2">
+                    <view class="info_2_1">1.参赛人员报名费每人每项50元！</view>
+                    <view class="info_2_1">2.成功转发朋友圈的参赛人员可优惠10元报名费！</view>
+                </view>
+            </view>
+            <view class="btn">
+                <button type="primary" size="mini" open-type="share">转发朋友圈</button>
+                <button type="primary" size="mini" bindtap="toPay">支付报名费</button>
+            </view>
+        </view>
+    </view>
+</e-dialog>

pages/matchInfo/sign.wxss

@@ -0,0 +1,48 @@
+.main {
+  height: 88.8vh;
+}
+.main .one {
+  width: 96vw;
+}
+.main .one .content {
+  background-color: #ffffff;
+  border-bottom: 1px solid #cccccc;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  padding: 2vw;
+  width: 92vw;
+}
+.main .one .content .label {
+  width: 25vw;
+  text-align: left;
+  font-size: 14px;
+}
+.main .one .content .value {
+  width: 65vw;
+  text-align: right;
+  font-size: 14px;
+}
+.main .one .content .value textarea {
+  width: 65vw;
+}
+.main .one .btn {
+  margin: 2vw 0 0 0;
+  text-align: center;
+}
+.dialog_1 .info .info_1 {
+  font-size: 15px;
+  font-weight: bold;
+}
+.dialog_1 .info .info_2 .info_2_1 {
+  margin: 0 0 1vw 0;
+  font-size: 12px;
+  color: #858585;
+}
+.dialog_1 .btn {
+  text-align: center;
+}
+.dialog_1 .btn button {
+  margin: 0 2vw;
+  font-size: 12px;
+}