'完成找老师页面'

app.json

@@ -1,6 +1,8 @@
 
 {
     "pages": [
+        "pages/findStudent/findStudent",
+        "pages/findTeacher/findTeacher",
         "pages/teacherList/teacherList",
         "pages/orderDetail/orderDetail",
         "pages/myOrder/myOrder",

pages/findStudent/findStudent.js

@@ -0,0 +1,66 @@
+// pages/findStudent/findStudent.js
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad(options) {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload() {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh() {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom() {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage() {
+
+    }
+})

pages/findStudent/findStudent.json

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

pages/findStudent/findStudent.wxml

@@ -0,0 +1,56 @@
+<!--pages/findStudent/findStudent.wxml-->
+
+<view class="studentWrapper">
+    <view class="studentList">
+        <view class="studentLeft">
+            <view class="studentLeftTitle">
+                <text>xxx学员</text>
+            </view>
+            <view class="studentNeedCourse">
+                <text>科目</text>
+                <text class="needCourse">xxxxxxxxxxxxxxxxx</text>
+            </view>
+            <view class="studentExpect">
+                <text>期望目标</text>
+                <text class="expect">xxxxxxxxxxxxxxx</text>
+            </view>
+        </view>
+        <view class="studentRight">
+            <view class="studentRightTitle">
+                <text>150/小时</text>
+            </view>
+            <view class="studentSex">
+                <text>男</text>
+            </view>
+            <view class="studentRightTitle">
+                <text>1.5km</text>
+            </view>
+        </view>
+    </view>
+    <view class="studentList">
+        <view class="studentLeft">
+            <view class="studentLeftTitle">
+                <text>xxx学员</text>
+            </view>
+            <view class="studentNeedCourse">
+                <text>科目</text>
+                <text class="needCourse">xxxxxxxxxxxxxxxxx</text>
+            </view>
+            <view class="studentExpect">
+                <text>期望目标</text>
+                <text class="expect">xxxxxxxxxxxxxxx</text>
+            </view>
+        </view>
+        <view class="studentRight">
+            <view class="studentRightTitle">
+                <text>150/小时</text>
+            </view>
+            <view class="studentSex">
+                <text>男</text>
+            </view>
+            <view class="studentRightTitle">
+                <text>1.5km</text>
+            </view>
+        </view>
+    </view>
+</view>

pages/findStudent/findStudent.wxss

@@ -0,0 +1,68 @@
+/* pages/findStudent/findStudent.wxss */
+
+.studentWrapper{
+    height: 100%;
+    background-color: #E2F0D9;
+    padding: 20rpx;
+}
+
+.studentList{
+    display: flex;
+    position: relative;
+    /* border: 1rpx solid gray; */
+    border-radius: 20rpx;
+    background-color: #FFF2CC;
+    margin-bottom: 20rpx;
+}
+
+/* 左侧部分 */
+.studentLeft{
+    padding: 10rpx;
+    font-weight: bold;
+    font-size: 28rpx;
+}
+.studentLeftTitle,
+.studentExpect,
+.studentNeedCourse{
+    padding: 6rpx 0;
+}
+
+/* 科目 */
+.studentNeedCourse{
+    display: flex;
+}
+
+
+/* 期望目标 */
+.studentExpect{
+    display: flex;
+}
+/* 期望目标和需求科目详情 */
+.needCourse,
+.expect{
+    margin-left: 10rpx;
+    width: 160rpx;
+    display: block;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+/* 右侧部分定位 */
+.studentRight{
+    position: absolute;
+    left: 65%;
+    color: #FF0000;
+    font-size: 28rpx;
+}
+
+.studentRight,
+.studentSex{
+    padding: 10rpx 0;
+}
+/* 设置性别的字体 */
+.studentSex{
+    font-weight: bold;
+    color: #00B050;
+}
+

pages/findTeacher/findTeacher.js

@@ -0,0 +1,66 @@
+// pages/findTeacher/findTeacher.js
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad(options) {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload() {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh() {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom() {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage() {
+
+    }
+})

pages/findTeacher/findTeacher.json

@@ -0,0 +1,4 @@
+{
+    "usingComponents": {},
+    "navigationBarTitleText": "找教员"
+}

pages/findTeacher/findTeacher.wxml

@@ -0,0 +1,86 @@
+<!--pages/findTeacher/findTeacher.wxml-->
+
+<view class="teachWrapper">
+    <view class="teachDetail">
+        <image class="teachImg" mode="widthFix" src="../../images/zly.jpeg"></image>
+        <view class="teachIntro">
+            <view class="teachIntroTop">
+                <view>
+                    <view>
+                        <text>xxx教员</text>
+                    </view>
+                    <view class="course">
+                        <text>科目</text>
+                        <text class="teachCourse">初一初二语文初一初二语文</text>
+                    </view>
+                    <view>
+                        <text>四川大学</text>
+                    </view>
+                </view>
+                <view class="teachIntroRight">
+                    <view class="teachEduAndAge">
+                        <view>
+                            <text>硕士在读</text>
+                        </view>
+                        <view>
+                            <text class="teachAgeIcon">龄</text>
+                            <text class="teachAge">5</text>
+                        </view>
+                    </view>
+                    <view>
+                        <view class="teachDistance">
+                            <text>距你</text>
+                            <text class="distance">0.8</text>
+                            <text>km</text>
+                        </view>
+                    </view>
+                </view>
+            </view>
+            <view class="experience">
+                <text>成功经验</text>
+                <text class="teachExperience">xxxxxxxxxxxxxxxxxxxxxxxxxx</text>
+            </view>
+        </view>
+    </view>
+    <view class="teachDetail">
+        <image class="teachImg" mode="widthFix" src="../../images/zly.jpeg"></image>
+        <view class="teachIntro">
+            <view class="teachIntroTop">
+                <view>
+                    <view>
+                        <text>xxx教员</text>
+                    </view>
+                    <view>
+                        <text>科目</text>
+                        <text>xxx</text>
+                    </view>
+                    <view>
+                        <text>四川大学</text>
+                    </view>
+                </view>
+                <view class="teachIntroRight">
+                    <view class="teachEduAndAge">
+                        <view>
+                            <text>硕士在读</text>
+                        </view>
+                        <view>
+                            <text class="teachAgeIcon">龄</text>
+                            <text class="teachAge">5</text>
+                        </view>
+                    </view>
+                    <view>
+                        <view class="teachDistance">
+                            <text>距你</text>
+                            <text class="distance">0.8</text>
+                            <text>km</text>
+                        </view>
+                    </view>
+                </view>
+            </view>
+            <view class="experience">
+                <text>成功经验</text>
+                <text class="teachExperience">xxxxxxxxxxxxxxxxxxxxxxxxxx</text>
+            </view>
+        </view>
+    </view>
+</view>

pages/findTeacher/findTeacher.wxss

@@ -0,0 +1,103 @@
+/* pages/findTeacher/findTeacher.wxss */
+
+/* 设置页面背景 */
+.teachWrapper{
+    background-color: #E2F0D9;
+    height: 100%;
+    padding: 20rpx;
+}
+
+/* 设置单个教员背景 */
+.teachDetail{
+    display: flex;
+    position: relative;
+    /* border: 1rpx solid gray; */
+    padding: 10rpx 0;
+    border-radius: 20rpx;
+    background-color: #FFF2CC;
+    margin-bottom: 20rpx;
+    font-weight: bold;
+    font-size: 28rpx;
+}
+
+.teachIntroTop{
+    display: flex;
+}
+/* 教员头像 */
+.teachImg{
+    width: 22%;
+    margin: 10rpx;
+    border-radius: 20rpx;
+}
+
+.teachIntro{
+    margin-left: 10rpx;
+}
+
+/* 科目 */
+.course{
+    display: flex;
+}
+.teachCourse{
+    margin-left: 10rpx;
+    width: 160rpx;
+    display: block;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+/* 右侧部分定位 */
+.teachIntroRight{
+    position: absolute;
+    /* right: 30rpx; */
+    left: 65%;
+}
+
+/* 教员学历和教龄 */
+.teachEduAndAge{
+    display: flex;
+}
+
+/* 教龄图标 */
+.teachAgeIcon {
+    margin-left: 20rpx;
+    padding: 2rpx;
+    border: 1rpx solid;
+    border-radius: 10rpx;
+    font-size: 26rpx;
+    color: white;
+    background-color: #FF6666;
+}
+
+/* 教龄 */
+.teachAge{
+    margin-left: 10rpx;
+    font-weight: bold;
+    color: red;
+}
+
+/* 距离 */
+.teachDistance{
+    margin-top: 20rpx;
+    color: red;
+}
+/* 距离数字 */
+.distance{
+    margin: 0 10rpx;
+    font-size: 40rpx;
+    font-weight: bold;
+}
+
+/* 成功经验 */
+.experience{
+    display: flex;
+}
+.teachExperience{
+    width: 300rpx;
+    margin-left: 10rpx;
+    display: block;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}