合并

app.json

@@ -7,7 +7,10 @@
         "pages/suser/list",
         "pages/sadmin/list",
         "pages/scoach/list",
+        "pages/scoach/add",
         "pages/sstudent/list",
+        "pages/sstudent/add",
+        "pages/suser/list",
         "pages/club/index",
         "pages/match/index",
         "pages/other/agree",

pages/club/index.less

@@ -56,6 +56,7 @@
 
                     .other {
                         font-size: var(--font15Size);
+                        color: #e9e9e9;
 
                         text {
                             color: var(--whiteColor);

pages/club/index.wxss

@@ -50,6 +50,7 @@
 }
 .main .two .list .content .cont .other {
   font-size: var(--font15Size);
+  color: #e9e9e9;
 }
 .main .two .list .content .cont .other text {
   color: var(--whiteColor);

pages/scoach/add.js

@@ -0,0 +1,137 @@
+const app = getApp()
+const { gender } = require('../../utils/dict')
+import WxValidate from '../../utils/wxValidate'
+
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        frameStyle: { useTop: true, name: '教练信息', leftArrow: true, useBar: false },
+        form: { icon: [] },
+        // 性别
+        genderList: gender,
+    },
+    initValidate() {
+        const rules = { icon: { required: true }, name: { required: true }, card: { required: true }, gender: { required: true }, phone: { required: true, tel: true } }
+        // 验证字段的提示信息，若不传则调用默认的信息
+        const messages = { icon: { required: '请选择头像', }, name: { required: '请输入用户姓名', }, card: { required: '请输入身份证号', }, gender: { required: '请选择性别', }, phone: { required: '请输入手机号', } };
+        this.WxValidate = new WxValidate(rules, messages)
+    },
+    // 返回
+    back: function () {
+        wx.navigateBack({ delta: 1 })
+    },
+    imgUpl: function (e) {
+        const that = this;
+        let data = that.data.form.icon;
+        data.push(e.detail)
+        that.setData({ 'form.icon': data })
+    },
+    // 删除图片
+    imgDel: function (e) {
+        const that = this;
+        let list = that.data.form.icon;
+        let arr = list.filter((i, index) => index != e.detail.index)
+        that.setData({ 'form.icon': arr })
+    },
+    // 选择性别
+    genderChange: function (e) {
+        const that = this;
+        let data = that.data.genderList[e.detail.value];
+        if (data) that.setData({ 'form.gender': data.value });
+    },
+    // 输入身份证号获取性别年龄
+    toCard: function (e) {
+        var IDCard = e.detail.value;
+        var birth = IDCard.substring(6, 10) + "-" + IDCard.substring(10, 12) + "-" + IDCard.substring(12, 14);
+        console.log('出生日期', birth);
+        var sex = "";
+        if (parseInt(IDCard.substr(16, 1)) % 2 == 1) {
+            sex = "男";
+        } else {
+            sex = "女";
+        }
+        this.setData({ 'form.gender': sex })
+        var myDate = new Date();
+        var month = myDate.getMonth() + 1;
+        var day = myDate.getDate();
+        var age = myDate.getFullYear() - IDCard.substring(6, 10) - 1;
+        if (IDCard.substring(10, 12) < month || IDCard.substring(10, 12) == month && IDCard.substring(12, 14) <= day) {
+            age++;
+        }
+        this.setData({ 'form.age': age })
+    },
+    // 提交登录
+    onSubmit: async function (e) {
+        const that = this;
+        const params = e.detail.value;
+        const form = that.data.form;
+        params.icon = form.icon;
+        if (!this.WxValidate.checkForm(params)) {
+            const error = this.WxValidate.errorList[0];
+            wx.showToast({ title: `${error.msg}`, icon: 'error', duration: 2000 })
+            return false
+        } else {
+            console.log('提交');
+        }
+    },
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad: function (options) {
+        const that = this;
+        //验证规则函数
+        that.initValidate();
+
+    },
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload: function () {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh: function () {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom: function () {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage: function () {
+
+    }
+})

pages/scoach/add.json

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

pages/scoach/add.less

@@ -0,0 +1,30 @@
+.main {
+    background-color: var(--mainColor);
+
+
+        .content {
+            display: flex;
+            flex-direction: row;
+            border-bottom: 1px dashed var(--f1Color);
+            padding: 2vw 0;
+            margin: 0 2vw 2vw 2vw;
+
+            .value {
+                flex-grow: 1;
+                color: var(--blackColor);
+
+            }
+        }
+
+        .btn {
+            text-align: center;
+            margin: 5vw 0 0 0;
+
+            button {
+                width: 40vw;
+                margin: 0 2vw;
+                padding: 1vw 0;
+            }
+        }
+
+}

pages/scoach/add.wxml

@@ -0,0 +1,51 @@
+<mobile-main frameStyle="{{frameStyle}}" bind:back="back">
+    <view slot="info" class="container main">
+        <form catchsubmit="onSubmit">
+            <view class="content">
+                <view class="label">头像：</view>
+                <view class="value">
+                    <upload list="{{form.icon}}" count="{{1}}" previewSize="{{30}}" bind:imgUpload="imgUpl" bind:imgDel="imgDel"></upload>
+                </view>
+            </view>
+            <view class="content">
+                <view class="label">姓名：</view>
+                <view class="value">
+                    <input name="name" value="{{form.name}}" placeholder="请输入姓名" />
+                </view>
+            </view>
+            <view class="content">
+                <view class="label">身份证号：</view>
+                <view class="value">
+                    <input name="card" maxlength="18" type="idcard" value="{{form.card}}" placeholder="请输入身份证号" bindblur="toCard" />
+                </view>
+            </view>
+            <view class="content">
+                <view class="label">性别：</view>
+                <view class="value">
+                    <input name="gender" value="{{form.gender}}" placeholder="输入身份证号获取" disabled="true" />
+                </view>
+            </view>
+            <view class="content">
+                <view class="label">年龄：</view>
+                <view class="value">
+                    <input name="age" value="{{form.age}}" placeholder="输入身份证号获取" disabled="true" />
+                </view>
+            </view>
+            <view class="content">
+                <view class="label">手机号：</view>
+                <view class="value">
+                    <input name="phone" maxlength="11" value="{{form.phone}}" placeholder="请输入手机号" />
+                </view>
+            </view>
+            <view class="content">
+                <view class="label">专业技能：</view>
+                <view class="value">
+                    <input name="phone" value="{{form.skill}}" placeholder="请输入专业技能" />
+                </view>
+            </view>
+            <view class="btn">
+                <button type="primary" size="mini" formType="submit">提交保存</button>
+            </view>
+        </form>
+    </view>
+</mobile-main>

pages/scoach/add.wxss

@@ -0,0 +1,23 @@
+.main {
+  background-color: var(--mainColor);
+}
+.main .content {
+  display: flex;
+  flex-direction: row;
+  border-bottom: 1px dashed var(--f1Color);
+  padding: 2vw 0;
+  margin: 0 2vw 2vw 2vw;
+}
+.main .content .value {
+  flex-grow: 1;
+  color: var(--blackColor);
+}
+.main .btn {
+  text-align: center;
+  margin: 5vw 0 0 0;
+}
+.main .btn button {
+  width: 40vw;
+  margin: 0 2vw;
+  padding: 1vw 0;
+}

pages/scoach/list.js

@@ -6,11 +6,38 @@ Page({
      */
     data: {
         frameStyle: { useTop: true, name: '教练信息', leftArrow: true, useBar: false },
+        list: [
+            { _id: '001', icon: [{ url: '/image/club.png' }], name: '教练1', gender: '女', age: '33', phone: '12345678901', skill: '羽毛球', card: '220220222202022222' },
+            { _id: '002', icon: [{ url: '/image/club.png' }], name: '教练1', gender: '女', age: '33', phone: '12345678901', skill: '羽毛球', card: '220220222202022222' },
+            { _id: '001', icon: [{ url: '/image/club.png' }], name: '教练1', gender: '女', age: '33', phone: '12345678901', skill: '羽毛球', card: '220220222202022222' },
+            { _id: '002', icon: [{ url: '/image/club.png' }], name: '教练1', gender: '女', age: '33', phone: '12345678901', skill: '羽毛球', card: '220220222202022222' },
+        ],
     },
     // 返回
     back: function () {
         wx.navigateBack({ delta: 1 })
     },
+    // 添加
+    toAdd() {
+        wx.navigateTo({ url: '/pages/scoach/add' })
+    },
+    // 修改
+    toEdit: function (e) {
+        let { id } = e.currentTarget.dataset;
+        wx.navigateTo({ url: `/pages/scoach/add?id=${id}` })
+    },
+    // 删除
+    toDel: async function (e) {
+        const that = this;
+        const { id } = e.currentTarget.dataset;
+        wx.showModal({
+            title: '提示',
+            content: '是否确认删除该条数据?',
+            async success(res) {
+                console.log('删除');
+            }
+        })
+    },
     /**
      * 生命周期函数--监听页面加载
      */

pages/scoach/list.less

@@ -1,5 +1,5 @@
 .main {
-    height: var(--thrHeight);
+    height: var(--twoHeight);
     background-color: var(--mainColor);
 
     .one {
@@ -30,6 +30,100 @@
     }
 
     .two {
-        background-color: #ffffff;
+        flex-grow: 1;
+        position: relative;
+
+        .list {
+            display: flex;
+            flex-direction: column;
+            padding: 2vw;
+            margin: 2vw 2vw 0;
+            border-radius: 10px;
+
+            .list_1 {
+                display: flex;
+                flex-direction: row;
+                margin: 0 0 2vh 0;
+                border: 1px #fff dashed;
+                border-radius: 10px;
+
+                .icon {
+                    width: 18vw;
+                    margin-top: 2vh;
+                    margin-left: 2vw;
+
+                    image {
+                        width: 100%;
+                        border-radius: 50%;
+                    }
+                }
+
+                .content {
+                    display: flex;
+                    flex-direction: column;
+                    margin: 0 0 0 3vw;
+
+                    .name {
+                        font-weight: 700;
+                        font-size: var(--font18Szie);
+                        color: var(--whiteColor);
+                        margin: 1vh 0;
+                    }
+
+                    .other {
+                        font-size: var(--font15Size);
+                        color: var(--f9Color);
+                        margin: 0.5vh 0 1vh 0;
+
+                        text {
+                            color: var(--whiteColor);
+                        }
+                    }
+                }
+            }
+
+
+            .btn {
+                display: flex;
+                flex-direction: row;
+
+                button {
+                    width: 100%;
+                    padding: 2vw;
+                    font-size: var(--font14Size);
+                    color: #fff;
+                    border-radius: 50px;
+                    margin: 0 5vw;
+                    background-color: #35d4bd;
+                    box-sizing: content-box;
+                    border: 1px #fff dashed;
+                }
+
+                button:last-child {
+                    background-color: #f7783e;
+                }
+            }
+        }
+
+        .list:nth-child(1n) {
+            background-color: #ccacff;
+        }
+
+        .list:nth-child(2n) {
+            background-color: #fda5ce;
+        }
+    }
+}
+
+.scroll-view {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+
+    .list-scroll-view {
+        display: flex;
+        flex-direction: column;
     }
 }

pages/scoach/list.wxml

@@ -9,7 +9,28 @@
             </view>
         </view>
         <view class="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="list_1">
+                            <view class="icon">
+                                <image src="{{item.icon&&item.icon.length>0?item.icon[0].url:''}}" mode="widthFix">
+                                </image>
+                            </view>
+                            <view class="content">
+                                <view class="name textOver">{{item.name}}</view>
+                                <view class="other">身份证号：<text>{{item.card}}</text></view>
+                                <view class="other">联系电话：<text>{{item.phone}}</text>
+                                </view>
+                            </view>
+                        </view>
+                        <view class="btn">
+                            <button bindtap="toEdit" data-id="{{item._id}}">信息维护</button>
+                            <button bindtap="toDel" data-id="{{item._id}}">删除信息</button>
+                        </view>
+                    </view>
+                </view>
+            </scroll-view>
         </view>
     </view>
 </mobile-main>

pages/scoach/list.wxss

@@ -1,5 +1,5 @@
 .main {
-  height: var(--thrHeight);
+  height: var(--twoHeight);
   background-color: var(--mainColor);
 }
 .main .one {
@@ -25,5 +25,83 @@
   font-size: var(--font14Size);
 }
 .main .two {
-  background-color: #ffffff;
+  flex-grow: 1;
+  position: relative;
+}
+.main .two .list {
+  display: flex;
+  flex-direction: column;
+  padding: 2vw;
+  margin: 2vw 2vw 0;
+  border-radius: 10px;
+}
+.main .two .list .list_1 {
+  display: flex;
+  flex-direction: row;
+  margin: 0 0 2vh 0;
+  border: 1px #fff dashed;
+  border-radius: 10px;
+}
+.main .two .list .list_1 .icon {
+  width: 18vw;
+  margin-top: 2vh;
+  margin-left: 2vw;
+}
+.main .two .list .list_1 .icon image {
+  width: 100%;
+  border-radius: 50%;
+}
+.main .two .list .list_1 .content {
+  display: flex;
+  flex-direction: column;
+  margin: 0 0 0 3vw;
+}
+.main .two .list .list_1 .content .name {
+  font-weight: 700;
+  font-size: var(--font18Szie);
+  color: var(--whiteColor);
+  margin: 1vh 0;
+}
+.main .two .list .list_1 .content .other {
+  font-size: var(--font15Size);
+  color: var(--f9Color);
+  margin: 0.5vh 0 1vh 0;
+}
+.main .two .list .list_1 .content .other text {
+  color: var(--whiteColor);
+}
+.main .two .list .btn {
+  display: flex;
+  flex-direction: row;
+}
+.main .two .list .btn button {
+  width: 100%;
+  padding: 2vw;
+  font-size: var(--font14Size);
+  color: #fff;
+  border-radius: 50px;
+  margin: 0 5vw;
+  background-color: #35d4bd;
+  box-sizing: content-box;
+  border: 1px #fff dashed;
+}
+.main .two .list .btn button:last-child {
+  background-color: #f7783e;
+}
+.main .two .list:nth-child(1n) {
+  background-color: #ccacff;
+}
+.main .two .list:nth-child(2n) {
+  background-color: #fda5ce;
+}
+.scroll-view {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+.scroll-view .list-scroll-view {
+  display: flex;
+  flex-direction: column;
 }

pages/sstudent/add.js

@@ -0,0 +1,160 @@
+const app = getApp()
+import WxValidate from '../../utils/wxValidate';
+const { gender } = require('../../utils/dict')
+Page({
+    data: {
+        frameStyle: { useTop: true, name: '学员信息管理', leftArrow: true, useBar: false },
+        form: { icon: [] },
+        // 性别
+        genderList: gender,
+        id: ''
+    },
+    initValidate() {
+        const rules = { icon: { required: true }, name: { required: true }, card: { required: true, idcard: true }, age: { required: true }, gender: { required: true }, phone: { required: true, tel: true } }
+        // 验证字段的提示信息，若不传则调用默认的信息
+        const messages = { icon: { required: '请选择头像', }, name: { required: '请输入学员姓名', }, card: { required: '请输入身份证号', }, age: { required: '请输入年龄', }, gender: { required: '请选择性别', }, phone: { required: '请输入手机号', } };
+        this.WxValidate = new WxValidate(rules, messages)
+    },
+    // 返回
+    back: function () {
+        wx.navigateBack({ delta: 1 })
+    },
+    //上传图片
+    imgUpl: function (e) {
+        const that = this;
+        let data = that.data.form.icon;
+        data.push(e.detail)
+        that.setData({ 'form.icon': data })
+    },
+    // 删除图片
+    imgDel: function (e) {
+        const that = this;
+        let list = that.data.form.icon;
+        let arr = list.filter((i, index) => index != e.detail.index)
+        that.setData({ 'form.icon': arr })
+    },
+    //填写身份信息
+    cardChange: function (e) {
+        const that = this;
+        let card = e.detail.value;
+        if (!/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(card)) {
+            wx.showToast({ title: `请输入18位的有效身份证`, icon: 'error', duration: 2000 })
+        } else {
+            //获取出生日期
+            let birth = card.substring(6, 10) + "-" + card.substring(10, 12) + "-" + card.substring(12, 14);
+            //获取性别
+            if (parseInt(card.substr(16, 1)) % 2 == 1) that.setData({ 'form.gender': '0' });
+            else that.setData({ 'form.gender': '1' });
+            //获取年龄
+            var myDate = new Date();
+            var month = myDate.getMonth() + 1;
+            var day = myDate.getDate();
+            var age = myDate.getFullYear() - card.substring(6, 10) - 1;
+            if (card.substring(10, 12) < month || card.substring(10, 12) == month && card.substring(12, 14) <= day) age++;
+            that.setData({ 'form.age': age });
+        }
+    },
+    // 选择性别
+    genderChange: function (e) {
+        const that = this;
+        let data = that.data.genderList[e.detail.value];
+        if (data) that.setData({ 'form.gender': data.value });
+    },
+    //提交
+    onSubmit: async function (e) {
+        const that = this;
+        const form = that.data.form;
+        const params = e.detail.value;
+        params.icon = form.icon;
+        if (!this.WxValidate.checkForm(params)) {
+            const error = this.WxValidate.errorList[0];
+            wx.showToast({ title: `${error.msg}`, icon: 'error', duration: 2000 })
+            return false
+        } else {
+            console.log(params);
+            // if (form._id) arr = await app.$post(`/newCourt/api/student/${form._id}`, params);
+            // else arr = await app.$post(`/newCourt/api/student`, params); 
+            // if (arr.errcode == '0') { wx.showToast({ title: `维护信息完成`, icon: 'success', duration: 2000 }); that.back(); }
+            // else wx.showToast({ title: `${error.msg}`, icon: 'error', duration: 2000 })
+        }
+    },
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad: function (options) {
+        const that = this;
+        that.setData({ id: options.id || '' })
+        //验证规则函数
+        that.initValidate();
+        // 监听用户是否登录
+        that.watchLogin();
+    },
+    // 监听用户是否登录
+    watchLogin: async function () {
+        const that = this;
+        wx.getStorage({
+            key: 'user',
+            success: async res => {
+                if (that.data.id) {
+                    const form = { _id: '1', icon: [{ url: '/image/beijing.jpeg' }], name: "测试姓名", card: '220581200003302462', phone: '12345678901', age: '18', gender: '0' };
+                    that.setData({ form: form });
+                    // const arr = await app.$get(`/newCourt/api/student/${that.data.id}`);
+                    // if (arr.errcode == '0') {
+                    //     that.setData({ form: arr.data });
+                    // }
+                }
+            },
+            fail: async res => {
+                wx.redirectTo({ url: '/pages/index/index' })
+            }
+        })
+    },
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload: function () {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh: function () {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom: function () {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage: function () {
+
+    }
+})

pages/sstudent/add.json

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

pages/sstudent/add.less

@@ -0,0 +1,31 @@
+.main {
+    height: var(--twoHeight);
+    background-color: var(--mainColor);
+
+    .one {
+        .content {
+            display: flex;
+            flex-direction: row;
+            border-bottom: 1px dashed var(--f1Color);
+            padding: 2vw 0;
+            margin: 0 2vw 2vw 2vw;
+
+            .value {
+                flex-grow: 1;
+                color: var(--blackColor);
+
+            }
+        }
+
+        .btn {
+            text-align: center;
+            margin: 5vw 0 0 0;
+
+            button {
+                width: 40vw;
+                margin: 0 2vw;
+                padding: 1vw 0;
+            }
+        }
+    }
+}

pages/sstudent/add.wxml

@@ -0,0 +1,49 @@
+<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">头像：</view>
+                    <view class="value">
+                        <upload list="{{form.icon}}" count="{{1}}" previewSize="{{30}}" bind:imgUpload="imgUpl" bind:imgDel="imgDel"></upload>
+                    </view>
+                </view>
+                <view class="content">
+                    <view class="label">姓名：</view>
+                    <view class="value">
+                        <input type="text" name="name" value="{{form.name}}" placeholder="请输入姓名" />
+                    </view>
+                </view>
+                <view class="content">
+                    <view class="label">身份证号：</view>
+                    <view class="value">
+                        <input type="text" name="card" value="{{form.card}}" bindblur="cardChange" placeholder="请输入身份证号" />
+                    </view>
+                </view>
+                <view class="content">
+                    <view class="label">年龄：</view>
+                    <view class="value">
+                        <input type="text" name="age" value="{{form.age}}" placeholder="请输入年龄" />
+                    </view>
+                </view>
+                <view class="content">
+                    <view class="label">性别：</view>
+                    <view class="value">
+                        <picker mode="selector" bindchange="genderChange" name="gender" value="{{form.gender}}" range="{{genderList}}" range-key="label">
+                            <view class="picker">{{form.gender=='0'?'男':form.gender=='1'?'女':form.gender=='2'?'未知':'请选择性别'}}</view>
+                        </picker>
+                    </view>
+                </view>
+                <view class="content">
+                    <view class="label">手机号：</view>
+                    <view class="value">
+                        <input type="text" name="phone" value="{{form.phone}}" placeholder="请输入手机号" />
+                    </view>
+                </view>
+                <view class="btn">
+                    <button type="primary" size="mini" formType="submit">提交保存</button>
+                </view>
+            </form>
+        </view>
+    </view>
+</mobile-main>

pages/sstudent/add.wxss

@@ -0,0 +1,24 @@
+.main {
+  height: var(--twoHeight);
+  background-color: var(--mainColor);
+}
+.main .one .content {
+  display: flex;
+  flex-direction: row;
+  border-bottom: 1px dashed var(--f1Color);
+  padding: 2vw 0;
+  margin: 0 2vw 2vw 2vw;
+}
+.main .one .content .value {
+  flex-grow: 1;
+  color: var(--blackColor);
+}
+.main .one .btn {
+  text-align: center;
+  margin: 5vw 0 0 0;
+}
+.main .one .btn button {
+  width: 40vw;
+  margin: 0 2vw;
+  padding: 1vw 0;
+}

pages/sstudent/list.js

@@ -6,18 +6,62 @@ Page({
      */
     data: {
         frameStyle: { useTop: true, name: '学员信息', leftArrow: true, useBar: false },
+        list: [
+            { _id: '1', icon: [{ url: '/image/beijing.jpeg' }], name: "测试姓名", card: '220581200003302462', phone: '12345678901', age: '18', gender: '0' },
+            { _id: '2', icon: [{ url: '/image/beijing.jpeg' }], name: "测试姓名", card: '220581200003302462', phone: '12345678901', age: '18', gender: '1' },
+            { _id: '1', icon: [{ url: '/image/beijing.jpeg' }], name: "测试姓名", card: '220581200003302462', phone: '12345678901', age: '18', gender: '0' },
+            { _id: '2', icon: [{ url: '/image/beijing.jpeg' }], name: "测试姓名", card: '220581200003302462', phone: '12345678901', age: '18', gender: '1' }
+        ],
     },
     // 返回
     back: function () {
         wx.navigateBack({ delta: 1 })
     },
+    //添加或修改
+    toCommon: function (e) {
+        const { route, id } = e.currentTarget.dataset;
+        if (id) wx.navigateTo({ url: `/pages/sstudent/${route}?id=${id}` })
+        else wx.navigateTo({ url: `/pages/sstudent/${route}` })
+    },
+    // 删除
+    toDel: async function (e) {
+        const that = this;
+        const { id } = e.currentTarget.dataset;
+        wx.showModal({
+            title: '提示',
+            content: '是否确认删除该条数据?',
+            async success(res) {
+                if (res.confirm) {
+                    const arr = await app.$delete(`/newCourt/api/student/${id}`);
+                    if (arr.errcode == '0') {
+                        wx.showToast({ title: `删除信息成功`, icon: 'success', duration: 2000 })
+                        that.watchLogin()
+                    } else {
+                        wx.showToast({ title: `${arr.errmsg}`, icon: 'error', duration: 2000 })
+                    }
+                }
+            }
+        })
+    },
     /**
      * 生命周期函数--监听页面加载
      */
     onLoad: function (options) {
         const that = this;
-
+        that.watchLogin();
     },
+    // 监听用户是否登录
+    watchLogin: async function () {
+        const that = this;
+        wx.getStorage({
+            key: 'user',
+            success: async res => { },
+            fail: async res => {
+                wx.redirectTo({ url: '/pages/index/index' })
+            }
+        })
+    },
+
     /**
      * 生命周期函数--监听页面初次渲染完成
      */

pages/sstudent/list.json

@@ -1,6 +1,6 @@
 {
-    "component": true,
-    "usingComponents": {
-      "mobile-main": "/commpents/mobile-frame/index"
-    }
-  }
+  "component": true,
+  "usingComponents": {
+    "mobile-main": "/commpents/mobile-frame/index"
+  }
+}

pages/sstudent/list.less

@@ -1,5 +1,5 @@
 .main {
-    height: var(--thrHeight);
+    height: var(--twoHeight);
     background-color: var(--mainColor);
 
     .one {
@@ -30,6 +30,86 @@
     }
 
     .two {
-        background-color: #ffffff;
+        flex-grow: 1;
+        position: relative;
+        width: 96vw;
+        margin: 2vw;
+        background-color: var(--mainColor);
+
+        .list {
+            display: flex;
+            flex-direction: row;
+            flex-wrap: wrap;
+            justify-content: space-around;
+            align-items: center;
+            border: 2px dashed #FFA500;
+            padding: 2vw;
+            margin: 0 0 2vw 0;
+            border-radius: 10px;
+
+            .list_1 {
+                .image {
+                    width: 60px;
+                    height: 60px;
+                    border-radius: 90px;
+                }
+            }
+
+            .list_2 {
+                width: 60vw;
+
+                .name {
+                    font-size: var(--font16Size);
+                    font-weight: bold;
+                    margin: 0 0 1vw 0;
+                }
+
+                .other {
+                    font-size: var(--font14Size);
+                    margin: 0 0 1vw 0;
+
+                    .other_1 {
+                        padding: 0 0 1vw 0;
+                    }
+
+                    .other_1 text:nth-child(1) {
+                        color: #666;
+                    }
+                }
+            }
+
+            .btn {
+                width: 96vw;
+                margin: 2vw 0 0 0;
+                text-align: center;
+
+                button {
+                    margin: 0 0 0 1vw;
+                    background-color: #FFA500;
+                    border-radius: 25px;
+                }
+
+                button:nth-child(2) {
+                    background-color: #FF4500;
+                }
+            }
+        }
+
+        .list:nth-child(2n) {
+            border: 2px dashed #FF4500;
+        }
+    }
+}
+
+.scroll-view {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+
+    .list-scroll-view {
+        display: flex;
+        flex-direction: column;
     }
 }

pages/sstudent/list.wxml

@@ -5,11 +5,30 @@
                 <input type="text" placeholder="请输入关键词" />
             </view>
             <view class="one_2">
-                <button type="primary" bindtap="toAdd">添加</button>
+                <button type="primary" bindtap="toCommon" data-route="add">添加</button>
             </view>
         </view>
         <view class="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="list_1">
+                            <image class="image" src="{{item.icon&&item.icon.length>0?item.icon[0].url:''}}"></image>
+                        </view>
+                        <view class="list_2">
+                            <view class="name textOver">{{item.name||'暂无'}}</view>
+                            <view class="other">
+                                <view class="other_1 textOver"><text>身份证号：</text><text>{{item.card||'暂无'}}</text></view>
+                                <view class="other_1 textOver"><text>联系电话：</text><text>{{item.phone||'暂无'}}</text></view>
+                            </view>
+                        </view>
+                        <view class="btn">
+                            <button size="mini" type="primary" bindtap="toCommon" data-route="add" data-id="{{item._id}}">信息维护</button>
+                            <button size="mini" type="primary" bindtap="toDel" data-id="{{item._id}}">信息删除</button>
+                        </view>
+                    </view>
+                </view>
+            </scroll-view>
         </view>
     </view>
 </mobile-main>

pages/sstudent/list.wxss

@@ -1,5 +1,5 @@
 .main {
-  height: var(--thrHeight);
+  height: var(--twoHeight);
   background-color: var(--mainColor);
 }
 .main .one {
@@ -25,5 +25,70 @@
   font-size: var(--font14Size);
 }
 .main .two {
-  background-color: #ffffff;
+  flex-grow: 1;
+  position: relative;
+  width: 96vw;
+  margin: 2vw;
+  background-color: var(--mainColor);
+}
+.main .two .list {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  justify-content: space-around;
+  align-items: center;
+  border: 2px dashed #FFA500;
+  padding: 2vw;
+  margin: 0 0 2vw 0;
+  border-radius: 10px;
+}
+.main .two .list .list_1 .image {
+  width: 60px;
+  height: 60px;
+  border-radius: 90px;
+}
+.main .two .list .list_2 {
+  width: 60vw;
+}
+.main .two .list .list_2 .name {
+  font-size: var(--font16Size);
+  font-weight: bold;
+  margin: 0 0 1vw 0;
+}
+.main .two .list .list_2 .other {
+  font-size: var(--font14Size);
+  margin: 0 0 1vw 0;
+}
+.main .two .list .list_2 .other .other_1 {
+  padding: 0 0 1vw 0;
+}
+.main .two .list .list_2 .other .other_1 text:nth-child(1) {
+  color: #666;
+}
+.main .two .list .btn {
+  width: 96vw;
+  margin: 2vw 0 0 0;
+  text-align: center;
+}
+.main .two .list .btn button {
+  margin: 0 0 0 1vw;
+  background-color: #FFA500;
+  border-radius: 25px;
+}
+.main .two .list .btn button:nth-child(2) {
+  background-color: #FF4500;
+}
+.main .two .list:nth-child(2n) {
+  border: 2px dashed #FF4500;
+}
+.scroll-view {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+.scroll-view .list-scroll-view {
+  display: flex;
+  flex-direction: column;
 }