1.增加注册界面

miniprogram/app.json

@@ -2,7 +2,8 @@
     "pages": [
         "pages/index/index",
         "pages/login/login",
-        "pages/logs/logs"
+        "pages/logs/logs",
+        "pages/register/register"
     ],
     "window": {
         "backgroundTextStyle": "light",

miniprogram/pages/index/index.ts

@@ -30,14 +30,12 @@ Page({
                 console.log("click it")
                 break;
         }
-        this.toNextPage(Number(event.target.id))
+        this.toLoginPage(Number(event.target.id))
     },
-    toNextPage: function (type: any) {
+    toLoginPage: function (type: any) {
         wx.navigateTo({
             url: '../login/login?id=' + type,
         })
+    },
 
-
-
-    }
 })

miniprogram/pages/login/login.ts

@@ -74,7 +74,13 @@ Page({
 
     }
 
+  },
 
+  //跳转注册界面
+  toRegisterPage: function () {
+    wx.navigateTo({
+      url: '../register/register',
+    })
   }
 
 })

miniprogram/pages/login/login.wxml

@@ -65,14 +65,14 @@
   <view>
     <view class="login_btn_layout">
       <button class="login_btn" style="width: 100%;">登 录</button>
-      <text wx:if="{{loginType==0}}" style="margin-top: 21rpx;">注册</text>
+      <text wx:if="{{loginType==0}}" style="margin-top: 21rpx;" bindtap="toRegisterPage">注册</text>
     </view>
   </view>
 
 
 
   <!--修改密码框-->
-  <updatePassword  wx:if="{{showUpdatePassWordLayout}}" class="updatepwd_layout" bind:showUpdatePwdLayout="showUpdatePwdLayout"></updatePassword>
+  <updatePassword wx:if="{{showUpdatePassWordLayout}}" class="updatepwd_layout" bind:showUpdatePwdLayout="showUpdatePwdLayout"></updatePassword>
   <!--修改密码框 end-->
 
 

miniprogram/pages/register/register.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

miniprogram/pages/register/register.ts

@@ -0,0 +1,82 @@
+// pages/register/register.ts
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        region: ['北京市', '北京市', '海淀区'],
+        schoolArray: ['中国', '美国', '巴西', '日本'],
+        schoolIndex: 0,
+        classArray: ['一年级一班', '一年级2班', '一年级3班', '一年级4班'],
+        classIndex: 0,
+        isShowPassWord: true
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad() {
+
+    },
+    bindRegionChange: function (event: any) {
+        console.log('picker发送选择改变，携带值为', event.detail.value)
+        this.setData({
+            region: event.detail.value
+        })
+    },
+    bindSchoolPicker: function (event: any) {
+        let newArray;
+        switch (Number(event.detail.value)) {
+            case 0:
+                newArray = ["一", "二", "三"];
+                this.setData({
+                    classArray: newArray,
+                    classIndex: 0
+                })
+                break;
+            case 1:
+                newArray = ["4", "5", "6"];
+                this.setData({
+                    classArray: newArray,
+                    classIndex: 0
+                })
+                break;
+            case 2:
+                newArray = ["as", "ad", "af"];
+                this.setData({
+                    classArray: newArray,
+                    classIndex: 0
+                })
+                break;
+            case 3:
+                newArray = ["b1", "b2", "b3"];
+                this.setData({
+                    classArray: newArray,
+                    classIndex: 0
+                })
+                break;
+        }
+        this.setData({
+            schoolIndex: event.detail.value
+        })
+    },
+    bindClssPicker: function (event: any) {
+        this.setData({
+            classIndex: event.detail.value
+        })
+    },
+    showPwdTab: function () {
+        if (this.data.isShowPassWord) {
+            this.setData({
+                isShowPassWord: false
+            })
+        } else {
+            this.setData({
+                isShowPassWord: true
+            })
+        }
+
+    }
+
+})

miniprogram/pages/register/register.wxml

@@ -0,0 +1,78 @@
+<!--pages/register/register.wxml-->
+<view class="container">
+    <view class="page">
+        <!--输入姓名-->
+        <view class="item_input_bg">
+            <text class="item_input_title">姓名：</text>
+            <input class="item_input_content" maxlength="11" placeholder="请输入姓名" />
+        </view>
+        <!--输入姓名 end-->
+        <!--选择地区-->
+        <view class="item_input_bg">
+            <text class="item_input_title">地区：</text>
+            <picker mode="region" bindchange="bindRegionChange" value="{{region}}" class="item_picker_bg">
+                <view class="item_picker_content">
+                    <p> {{region[0]}} </p>
+                    <p> {{region[1]}} </p>
+                    <p> {{region[2]}} </p>
+                </view>
+            </picker>
+            <view class="item_picker_icon_layout">
+                <image src="../../image/dropDownSelection/dropDownSelection_icon.png" class="item_picker_icon"></image>
+            </view>
+        </view>
+        <!--选择地区 end-->
+        <!--选择学校-->
+        <view class="item_input_bg">
+            <text class="item_input_title">地区：</text>
+            <picker bindchange="bindSchoolPicker" value="{{schoolIndex}}" range="{{schoolArray}}" class="item_picker_bg">
+                <view class="item_picker_content">
+                    {{schoolArray[schoolIndex]}}
+                </view>
+            </picker>
+            <view class="item_picker_icon_layout">
+                <image src="../../image/dropDownSelection/dropDownSelection_icon.png" class="item_picker_icon"></image>
+            </view>
+        </view>
+        <!--选择学校end-->
+        <!--选择班级-->
+        <view class="item_input_bg">
+            <text class="item_input_title">班级：</text>
+            <picker bindchange="bindClssPicker" value="{{classIndex}}" range="{{classArray}}" class="item_picker_bg">
+                <view class="item_picker_content">
+                    {{classArray[classIndex]}}
+                </view>
+            </picker>
+            <view class="item_picker_icon_layout">
+                <image src="../../image/dropDownSelection/dropDownSelection_icon.png" class="item_picker_icon"></image>
+            </view>
+        </view>
+        <!--选择班级end-->
+
+        <view class="phonenum_layout">
+            <!--输入手机号-->
+            <view class="item_input_bg">
+                <text class="item_input_title">手机号：</text>
+                <input class="item_input_content" maxlength="11" placeholder="请输入手机号" />
+            </view>
+            <!--输入手机号 end-->
+            <!--获取验证码-->
+            <view class="item_input_bg">
+                <text class="item_input_title">验证码：</text>
+                <input class="item_input_content" maxlength="11" placeholder="请输入验证码" />
+                <text class="phonenum_getvcode">获取验证码</text>
+            </view>
+            <!--获取验证码 end-->
+            <!--设置密码-->
+            <view class="item_input_bg">
+                <text class="item_input_title">设置密码：</text>
+                <input class="item_input_content" maxlength="11" password="{{isShowPassWord}}" placeholder="请输入密码" />
+                <view class="phonenum_pwd_icon" bindtap="showPwdTab">
+                    <image src="../../image/login/account_show_pwd_icon.png" style="width:33rpx;height:22rpx;"></image>
+                </view>
+
+            </view>
+            <!--设置密码 end-->
+        </view>
+    </view>
+</view>

miniprogram/pages/register/register.wxss

@@ -0,0 +1,83 @@
+/* pages/register/register.wxss */
+
+.page {
+    background-color: #F9F9F9;
+    /* background-color: aquamarine; */
+    height: 100%;
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: start;
+    align-items: center;
+    padding-top: 38rpx;
+}
+
+.item_input_bg {
+    width: 674rpx;
+    height: 80rpx;
+    background-color: white;
+    display: flex;
+    flex-direction: row;
+    margin-top: 12rpx;
+    justify-content: space-between;
+    align-items: center;
+}
+
+.item_input_title {
+    height: auto;
+    width: auto;
+    margin-left: 43rpx;
+}
+
+.item_input_content {
+    height: 100%;
+    flex: 1;
+    color: #999999;
+    text-align: right;
+    margin-right: 63rpx;
+}
+
+.item_picker_bg {
+    flex: 1;
+    align-items: center;
+    justify-content: center;
+}
+
+.item_picker_content {
+    color: #999999;
+    text-align: right;
+}
+
+.item_picker_icon_layout {
+    height: 100%;
+    width: 63rpx;
+    justify-content: center;
+    align-items: center;
+    display: flex;
+}
+
+.item_picker_icon {
+    width: 20rpx;
+    height: 12rpx;
+    margin-top: 8rpx;
+}
+
+.phonenum_layout {
+    height: 243rpx;
+    width: 674rpx;
+    margin-top: 30rpx;
+}
+
+.phonenum_getvcode {
+    color: #FFAA12;
+    font-size: 25rpx;
+    margin-right: 26rpx;
+}
+
+.phonenum_pwd_icon {
+    height: 100%;
+    width: 50rpx;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}