'修改找老师和找学员筛选功能'

app.json

@@ -1,9 +1,9 @@
 
 {
     "pages": [
+        "pages/stuList/stuList",
         "pages/teacherList/teacherList",
         "pages/stuNeed/stuNeed",
-        "pages/stuList/stuList",
         "pages/coursePublish/coursePublish",
         "pages/teachAuthentication/teachAuthentication",
         "pages/stuDetail/stuDetail",

pages/stuList/stuList.js

@@ -5,7 +5,497 @@ Page({
      * 页面的初始数据
      */
     data: {
-
+        toSearch: false, //打开/关闭筛选区
+        courseChosedIndex: '', //选中科目的索引
+        showCourse: false, //科目选项区是否显示
+        courseDetailChosed: '', //课程详情筛选条件
+        courseDetailIndex: null, //选中课程详情的索引
+        showCourseDetail: false, //课程详情选项区是否显示
+        teachPositionChosed: '', //需求辅导方式
+        showTeachPosition: false, //需求辅导方式选项区是否显示
+        stuSexChosed: '', //学生性别
+        showSexList: false, //学生性别选项区是否显示
+        teachTypeChosed: '', //教员类型
+        showTeachType: false, //教员类型选项区是否显示
+        teachEduChosed: '', //老师学历的筛选条件
+        showTeachEdu: false, //老师学历选项区是否显示
+        teachSexChosed: '', //老师性别的筛选条件
+        showTeachSex: false, //老师性别选项区是否显示
+        teachImgChosed: '', //老师照片的筛选条件
+        showTeachImg: false, //老师照片选项区是否显示
+        // 筛选条件
+        // 1、课程类别
+        courseList: ['小学', '初中', '高中', '大学', '音乐', '舞蹈', '语言', '体育', '美术', '书法', '少儿编程', '计算机', '其他'],
+        // 课程详情
+        courseDetail: [
+            ['小学1-5数学', '小学1-5英语', '小学1-5语文', '小学6数学', '小学6英语', '小学6语文', '小学奥数'],
+            ['初一初二语文', '初一初二数学', '初一初二英语', '初一初二物理', '初一初二化学', '初三语文', '初三数学', '初三英语', '初三物理', '初三化学', '初中历史', '初中地理', '初中奥数', '初中生物', '初中预备班', '初中科学', '初中政治'],
+            ['高一高二语文', '高一高二数学', '高一高二英语', '高一高二物理', '高一高二化学', '高三语文', '高三数学', '高三英语', '高三物理', '高三化学', '高中历史', '高中地理', '高中政治', '高中生物', '信息科技', 'SAT'],
+            ['托福', '雅思', '高等数学', '微观经济学', 'MBA', '成人高考', '国学', '自学考试', '专升本', '考博面试辅导', '考博专业课', '考博英语', '英语四级', '英语六级', '论文指导', '考研专业课', '考研政治', '考研数学', '考研英语', '英语专业四级', '英语专业八级', '课程辅导'],
+            ['小提琴', '钢琴', '电子琴', '长笛', '琵琶', '手风琴', '古筝', '练耳歌唱', '大号', '声乐', '萨克斯', '单簧管', '吉他', '小号', '古琴', '二胡', '大提琴', '打击乐', '圆号', '中提琴', '竹笛', '架子鼓', '扬琴', '巴松'],
+            ['民族舞', '爵士舞', '拉丁舞', '芭蕾舞', '街舞', '现代舞', '踢踏舞'],
+            ['本地方言', '日语', '英语口语', '新概念英语', '牛津英语', '西班牙语', '德语', '商务英语', '法语', '韩语', '意大利语', '汉语', '阿拉伯语', 'SBS英语', '俄语', '葡萄牙语'],
+            ['羽毛球', '跆拳道', '游泳', '乒乓球', '网球', '中国象棋', '国际象棋', '围棋', '篮球', '空手道'],
+            ['卡通画', '中国画', '素描', '油画', '水彩', '漫画'],
+            ['硬笔', '毛笔', '篆刻'],
+            ['Scratch', 'Python', 'C++', 'microbit'],
+            ['应用能力初级', '应用能力中级', '基本操作'],
+            ['学习习惯', '口才', '心理辅导', '记忆力', '注意力']
+        ],
+        // 2、辅导方式
+        teachPositions: ['不限', '老师上门', '学员上门', '线上辅导', '老师住家', '学员住家'],
+        // 3、性别列表
+        sexList: ['不限', '男', '女'],
+        // 4、教员类型
+        teachType: ['不限', '专业老师', '在校大学生'],
+        // 5、教员学历
+        educationList: ['不限', '博士毕业', '博士在读', '硕士毕业', '硕士在读', '本科毕业', '本科在读', '专科毕业', '专科在读'],
+        // 6、老师照片选项
+        teachImgOptions: ['不限', '有照片'],
+        // 模拟后台读取的学生列表信息
+        stuLists: [
+            [{
+                    id: '20220811'
+                },
+                {
+                    name: '孙悟空'
+                },
+                {
+                    phone: '13400000000'
+                },
+                {
+                    weChatNum: '13400000000'
+                },
+                {
+                    courseNeed: '小学'
+                },
+                {
+                    courseDetail: '小学1-5语文'
+                },
+                {
+                    teachPosition: '老师上门'
+                },
+                {
+                    stuSex: '男'
+                },
+                {
+                    salary: '200'
+                },
+                {
+                    schoolTime: '周六晚上'
+                },
+                {
+                    except: '全力以赴备战小升初'
+                },
+                {
+                    teachId: '在校大学生'
+                },
+                {
+                    teachEdu: '本科在读'
+                },
+                {
+                    teachSex: '女'
+                },
+                {
+                    teachImg: '不限'
+                },
+                {
+                    otherNeed: '无'
+                }
+            ],
+            [{
+                    id: '20220821'
+                },
+                {
+                    name: '孙悟空'
+                },
+                {
+                    phone: '13400000000'
+                },
+                {
+                    weChatNum: '13400000000'
+                },
+                {
+                    courseNeed: '初中'
+                },
+                {
+                    courseDetail: '初一初二语文'
+                },
+                {
+                    teachPosition: '老师上门'
+                },
+                {
+                    stuSex: '男'
+                },
+                {
+                    salary: '200'
+                },
+                {
+                    schoolTime: '周六晚上'
+                },
+                {
+                    except: '考上重点初中'
+                },
+                {
+                    teachId: '在校大学生'
+                },
+                {
+                    teachEdu: '本科在读'
+                },
+                {
+                    teachSex: '男'
+                },
+                {
+                    teachImg: '不限'
+                },
+                {
+                    otherNeed: '无'
+                }
+            ],
+            [{
+                    id: '20220811'
+                },
+                {
+                    name: '孙悟空'
+                },
+                {
+                    phone: '13400000000'
+                },
+                {
+                    weChatNum: '13400000000'
+                },
+                {
+                    courseNeed: '高中'
+                },
+                {
+                    courseDetail: '高一高二物理'
+                },
+                {
+                    teachPosition: '老师上门'
+                },
+                {
+                    stuSex: '女'
+                },
+                {
+                    salary: '200'
+                },
+                {
+                    schoolTime: '周日晚上'
+                },
+                {
+                    except: '好好学习，天天向上，考个重点大学'
+                },
+                {
+                    teachId: '专职老师'
+                },
+                {
+                    teachEdu: '本科毕业'
+                },
+                {
+                    teachSex: '不限'
+                },
+                {
+                    teachImg: '不限'
+                },
+                {
+                    otherNeed: '无'
+                }
+            ],
+            [{
+                    id: '20220811'
+                },
+                {
+                    name: '孙悟空'
+                },
+                {
+                    phone: '13400000000'
+                },
+                {
+                    weChatNum: '13400000000'
+                },
+                {
+                    courseNeed: '小学'
+                },
+                {
+                    courseDetail: '小学1-5语文'
+                },
+                {
+                    teachPosition: '老师上门'
+                },
+                {
+                    stuSex: '男'
+                },
+                {
+                    salary: '200'
+                },
+                {
+                    schoolTime: '周六晚上'
+                },
+                {
+                    except: '全力以赴备战小升初'
+                },
+                {
+                    teachId: '在校大学生'
+                },
+                {
+                    teachEdu: '本科在读'
+                },
+                {
+                    teachSex: '女'
+                },
+                {
+                    teachImg: '不限'
+                },
+                {
+                    otherNeed: '无'
+                }
+            ],
+            [{
+                    id: '20220821'
+                },
+                {
+                    name: '孙悟空'
+                },
+                {
+                    phone: '13400000000'
+                },
+                {
+                    weChatNum: '13400000000'
+                },
+                {
+                    courseNeed: '初中'
+                },
+                {
+                    courseDetail: '初一初二语文'
+                },
+                {
+                    teachPosition: '老师上门'
+                },
+                {
+                    stuSex: '男'
+                },
+                {
+                    salary: '200'
+                },
+                {
+                    schoolTime: '周六晚上'
+                },
+                {
+                    except: '考上重点初中'
+                },
+                {
+                    teachId: '在校大学生'
+                },
+                {
+                    teachEdu: '本科在读'
+                },
+                {
+                    teachSex: '男'
+                },
+                {
+                    teachImg: '不限'
+                },
+                {
+                    otherNeed: '无'
+                }
+            ],
+            [{
+                    id: '20220811'
+                },
+                {
+                    name: '孙悟空'
+                },
+                {
+                    phone: '13400000000'
+                },
+                {
+                    weChatNum: '13400000000'
+                },
+                {
+                    courseNeed: '高中'
+                },
+                {
+                    courseDetail: '高一高二物理'
+                },
+                {
+                    teachPosition: '老师上门'
+                },
+                {
+                    stuSex: '女'
+                },
+                {
+                    salary: '200'
+                },
+                {
+                    schoolTime: '周日晚上'
+                },
+                {
+                    except: '好好学习，天天向上，考个重点大学'
+                },
+                {
+                    teachId: '专职老师'
+                },
+                {
+                    teachEdu: '本科毕业'
+                },
+                {
+                    teachSex: '不限'
+                },
+                {
+                    teachImg: '不限'
+                },
+                {
+                    otherNeed: '无'
+                }
+            ],
+            [{
+                    id: '20220811'
+                },
+                {
+                    name: '孙悟空'
+                },
+                {
+                    phone: '13400000000'
+                },
+                {
+                    weChatNum: '13400000000'
+                },
+                {
+                    courseNeed: '小学'
+                },
+                {
+                    courseDetail: '小学1-5语文'
+                },
+                {
+                    teachPosition: '老师上门'
+                },
+                {
+                    stuSex: '男'
+                },
+                {
+                    salary: '200'
+                },
+                {
+                    schoolTime: '周六晚上'
+                },
+                {
+                    except: '全力以赴备战小升初'
+                },
+                {
+                    teachId: '在校大学生'
+                },
+                {
+                    teachEdu: '本科在读'
+                },
+                {
+                    teachSex: '女'
+                },
+                {
+                    teachImg: '不限'
+                },
+                {
+                    otherNeed: '无'
+                }
+            ],
+            [{
+                    id: '20220821'
+                },
+                {
+                    name: '孙悟空'
+                },
+                {
+                    phone: '13400000000'
+                },
+                {
+                    weChatNum: '13400000000'
+                },
+                {
+                    courseNeed: '初中'
+                },
+                {
+                    courseDetail: '初一初二语文'
+                },
+                {
+                    teachPosition: '老师上门'
+                },
+                {
+                    stuSex: '男'
+                },
+                {
+                    salary: '200'
+                },
+                {
+                    schoolTime: '周六晚上'
+                },
+                {
+                    except: '考上重点初中'
+                },
+                {
+                    teachId: '在校大学生'
+                },
+                {
+                    teachEdu: '本科在读'
+                },
+                {
+                    teachSex: '男'
+                },
+                {
+                    teachImg: '不限'
+                },
+                {
+                    otherNeed: '无'
+                }
+            ],
+            [{
+                    id: '20220811'
+                },
+                {
+                    name: '孙悟空'
+                },
+                {
+                    phone: '13400000000'
+                },
+                {
+                    weChatNum: '13400000000'
+                },
+                {
+                    courseNeed: '高中'
+                },
+                {
+                    courseDetail: '高一高二物理'
+                },
+                {
+                    teachPosition: '老师上门'
+                },
+                {
+                    stuSex: '女'
+                },
+                {
+                    salary: '200'
+                },
+                {
+                    schoolTime: '周日晚上'
+                },
+                {
+                    except: '好好学习，天天向上，考个重点大学'
+                },
+                {
+                    teachId: '专职老师'
+                },
+                {
+                    teachEdu: '本科毕业'
+                },
+                {
+                    teachSex: '不限'
+                },
+                {
+                    teachImg: '不限'
+                },
+                {
+                    otherNeed: '无'
+                }
+            ],
+        ]
     },
 
     /**
@@ -16,9 +506,240 @@ Page({
     },
 
     //跳转到学生详情页
-    toStuDetail(){
+    toStuDetail() {
         wx.navigateTo({
-          url: '/pages/stuDetail/stuDetail',
+            url: '/pages/stuDetail/stuDetail',
+        })
+    },
+
+    // 找学员按钮的点击事件
+    toOpenSearch() {
+        let toSearch = this.data.toSearch
+        this.setData({
+            toSearch: !toSearch
+        })
+        // 判断打开找学员的筛选区的条件是否为false，如果是，则关闭所有选项的筛选区
+        if(!this.data.toSearch){
+            this.setData({
+                showTeachId: false,
+                showCourse: false,
+                showCourseDetail: false,
+                showTeachEdu: false,
+                showTeachSex: false,
+                showSchool: false,
+                showTeachImg: false
+            })
+        }
+    },
+
+    // 科目筛选项
+    // 打开科目选项区，关闭其他选项区
+    chooseCourse() {
+        let showCourse = this.data.showCourse
+        this.setData({
+            showTeachId: false,
+            showCourse: !showCourse,
+            showCourseDetail: false,
+            showTeachEdu: false,
+            showTeachSex: false,
+            showSchool: false,
+            showTeachImg: false
+        })
+    },
+    // 选择科目大类
+    chosedCourse(e) {
+        // console.log(e.currentTarget.dataset.index);
+        let courseChosedIndex = e.currentTarget.dataset.index
+        this.setData({
+            courseChosedIndex,
+            showCourseDetail: true
+        })
+        // console.log(this.data.courseChosedIndex);
+    },
+    // 选择课程详情
+    chosedCourseDetail(e) {
+        // console.log(e.currentTarget.dataset.index);
+        let index = e.currentTarget.dataset.index
+        let courseDetail = this.data.courseDetail
+        let courseChosedIndex = this.data.courseChosedIndex
+        // let courseDetailIndex = this.data.courseDetailIndex
+        // let courseDetailChosed = this.data.courseDetailChosed
+        this.setData({
+            courseDetailChosed: courseDetail[courseChosedIndex][index],
+            showCourseDetail: false,
+            showCourse: false,
+            courseDetailIndex:e.currentTarget.dataset.index
+        })
+        // console.log(this.data.courseDetailChosed);
+        // console.log(this.data.courseDetailIndex);
+    },
+
+    // 辅导方式
+    // 打开辅导方式筛选区，关闭其他选项筛选区
+    chooseTeachPosition() {
+        let showTeachPosition = this.data.showTeachPosition
+        this.setData({
+            showTeachPosition: !showTeachPosition
+        })
+    },
+    // 选择辅导方式
+    toChosedTeachPosition(e) {
+        // console.log(e);
+        let index = e.currentTarget.dataset.index
+        let teachPositionChosed = this.data.teachPositionChosed
+        let teachPositions = this.data.teachPositions
+        for (let i = 0; i < teachPositions.length; i++) {
+            if (i == index) {
+                teachPositionChosed = teachPositions[i]
+            }
+        }
+        this.setData({
+            teachPositionChosed,
+            showTeachPosition: false
+        })
+    },
+
+    // 选择学生性别筛选项
+    // 打开学生性别选项区，关闭其他选项区
+    chooseStuSex() {
+        let showSexList = this.data.showSexList
+        this.setData({
+            showSexList: !showSexList
+        })
+    },
+    // 选择学生性别
+    toChosedStuSex(e) {
+        let index = e.currentTarget.dataset.index
+        let stuSexChosed = this.data.stuSexChosed
+        let sexList = this.data.sexList
+        for (let i = 0; i < sexList.length; i++) {
+            if (i == index) {
+                stuSexChosed = sexList[i]
+            }
+        }
+        this.setData({
+            stuSexChosed,
+            showSexList: false
+        })
+    },
+
+    // 教员类型筛选项
+    // 打开老师身份选项区，关闭其他选项区
+    chooseTeachType() {
+        let showTeachType = this.data.showTeachType
+        this.setData({
+            showTeachType: !showTeachType
+        })
+    },
+
+    // 选择教员类型
+    toChosedTeachType(e) {
+        // console.log(e);
+        let index = e.currentTarget.dataset.index
+        let teachTypeChosed = this.data.teachTypeChosed
+        let teachType = this.data.teachType
+        for (let i = 0; i < teachType.length; i++) {
+            if (i == index) {
+                teachTypeChosed = teachType[i]
+            }
+        }
+        this.setData({
+            teachTypeChosed,
+            showTeachType: false
+        })
+    },
+
+    // 老师学历筛选项
+    // 打开老师学历选项区，关闭其他选项区
+    chooseTeachEdu() {
+        let showTeachEdu = this.data.showTeachEdu
+        this.setData({
+            showTeachId: false,
+            showCourse: false,
+            showCourseDetail: false,
+            showTeachEdu: !showTeachEdu,
+            showTeachSex: false,
+            showSchool: false,
+            showTeachImg: false
+        })
+    },
+    // 选择老师学历
+    toChosedTeachEdu(e) {
+        let index = e.currentTarget.dataset.index
+        let teachEduChosed = this.data.teachEduChosed
+        let educationList = this.data.educationList
+        for (let i = 0; i < educationList.length; i++) {
+            if (i == index) {
+                teachEduChosed = educationList[i]
+            }
+        }
+        this.setData({
+            teachEduChosed,
+            showTeachEdu: false
+        })
+    },
+
+    // 选择老师性别筛选项
+    // 打开老师性别选项区，关闭其他选项区
+    chooseTeachSex() {
+        let showTeachSex = this.data.showTeachSex
+        this.setData({
+            showTeachSex: !showTeachSex
+        })
+    },
+    // 选择老师性别
+    toChosedTeachSex(e) {
+        let index = e.currentTarget.dataset.index
+        let teachSexChosed = this.data.teachSexChosed
+        let sexList = this.data.sexList
+        for (let i = 0; i < sexList.length; i++) {
+            if (i == index) {
+                teachSexChosed = sexList[i]
+            }
+        }
+        this.setData({
+            teachSexChosed,
+            showTeachSex: false
+        })
+    },
+
+    // 老师照片筛选项
+    // 打开老师照片选项区，关闭其他选项区
+    chooseTeachImg() {
+        let showTeachImg = this.data.showTeachImg
+        this.setData({
+            showTeachImg: !showTeachImg
+        })
+    },
+
+    // 选择老师照片筛选条件
+    toChosedTeachImg(e) {
+        let index = e.currentTarget.dataset.index
+        let teachImgChosed = this.data.teachImgChosed
+        let teachImgOptions = this.data.teachImgOptions
+        for (let i = 0; i < teachImgOptions.length; i++) {
+            if (i == index) {
+                teachImgChosed = teachImgOptions[i]
+            }
+        }
+        this.setData({
+            teachImgChosed,
+            showTeachImg: false
+        })
+    },
+
+
+
+    // 清楚选择按钮
+    clearOptions() {
+        this.setData({
+            courseDetailChosed: '',
+            teachPositionChosed: '',
+            stuSexChosed: '',
+            teachTypeChosed: '',
+            teachEduChosed: '',
+            teachSexChosed: '',
+            teachImgChosed: ''
         })
     },
 
@@ -62,8 +783,8 @@ Page({
      */
     onReachBottom() {
         wx.showToast({
-          title: '没有更多了',
-          icon:'none'
+            title: '没有更多了',
+            icon: 'none'
         })
     },
 

pages/stuList/stuList.json

@@ -1,5 +1,4 @@
 {
     "usingComponents": {},
-    "navigationBarTitleText": "学生列表",
-    "navigationBarBackgroundColor": "#91CDF6"
+    "navigationBarTitleText": "学生列表"
 }

pages/stuList/stuList.wxml

@@ -1,149 +1,98 @@
-<!--pages/stuList/stuList.wxml-->
-
 <!-- 头部搜索筛选区 -->
-<view class="searchContainer">
-    <view>
-        <text>家教科目</text>
-        <text class="iconfont icon-xiangxia"></text>
-    </view>
-    <view>
-        <text>教员类型</text>
-        <text class="iconfont icon-xiangxia"></text>
-    </view>
-    <view>
-        <text>条件筛选</text>
-        <text class="iconfont icon-xiangxia"></text>
-    </view>
+<view class="toOpenSearch" bindtap="toOpenSearch">
+    找学员
+    <image wx:if="{{toSearch}}" class="iconImg" src="../../images/up.png"></image>
+    <image wx:else class="iconImg" src="../../images/down.png"></image>
 </view>
-
-<!-- 学生列表区 -->
-<view class="stuListContainer">
-    <view>
-        <!-- 间隔区域 -->
-        <view class="stuListInterval"></view>
-        <!-- 学生列表区域 -->
-        <view class="stuListDetail" bindtap="toStuDetail">
-            <view class="stuLeft">
-                <text class="stuTitle">科目：初一初二数学</text>
-                <text class="stuDesc">主要为了冲刺中考主要为了冲刺中考主要为了冲刺中考主要为了冲刺中考</text>
-            </view>
-            <view class="stuRight">
-                <text class="stuId">20220811</text>
-                <text class="stuSex">学员：男</text>
-                <text class="salary">100/小时</text>
-            </view>
-        </view>
+<view class="searchContainer" wx:if="{{toSearch}}">
+    <view class="searchList" bindtap="chooseCourse">
+        {{courseDetailChosed || '需求课程'}}
+        <image class="iconImg" src="../../images/down.png"></image>
     </view>
-    <view>
-        <!-- 间隔区域 -->
-        <view class="stuListInterval"></view>
-        <!-- 学生列表区域 -->
-        <view class="stuListDetail">
-            <view class="stuLeft">
-                <text class="stuTitle">科目：初一初二数学</text>
-                <text class="stuDesc">主要为了冲刺中考</text>
-            </view>
-            <view class="stuRight">
-                <text class="stuId">20220811</text>
-                <text class="stuSex">学员：男</text>
-                <text class="salary">100/小时</text>
-            </view>
-        </view>
+    <view class="searchList" bindtap="chooseTeachPosition">
+        {{teachPositionChosed || '辅导方式'}}
+        <image class="iconImg" src="../../images/down.png"></image>
     </view>
-    <view>
-        <!-- 间隔区域 -->
-        <view class="stuListInterval"></view>
-        <!-- 学生列表区域 -->
-        <view class="stuListDetail">
-            <view class="stuLeft">
-                <text class="stuTitle">科目：初一初二数学</text>
-                <text class="stuDesc">主要为了冲刺中考</text>
-            </view>
-            <view class="stuRight">
-                <text class="stuId">20220811</text>
-                <text class="stuSex">学员：男</text>
-                <text class="salary">100/小时</text>
-            </view>
-        </view>
+    <view class="searchList" bindtap="chooseStuSex">
+        {{stuSexChosed || '学生性别'}}
+        <image class="iconImg" src="../../images/down.png"></image>
     </view>
-    <view>
-        <!-- 间隔区域 -->
-        <view class="stuListInterval"></view>
-        <!-- 学生列表区域 -->
-        <view class="stuListDetail">
-            <view class="stuLeft">
-                <text class="stuTitle">科目：初一初二数学</text>
-                <text class="stuDesc">主要为了冲刺中考</text>
-            </view>
-            <view class="stuRight">
-                <text class="stuId">20220811</text>
-                <text class="stuSex">学员：男</text>
-                <text class="salary">100/小时</text>
-            </view>
-        </view>
+    <view class="searchList" bindtap="chooseTeachType">
+        {{teachTypeChosed || '教员类型'}}
+        <image class="iconImg" src="../../images/down.png"></image>
     </view>
-    <view>
-        <!-- 间隔区域 -->
-        <view class="stuListInterval"></view>
-        <!-- 学生列表区域 -->
-        <view class="stuListDetail">
-            <view class="stuLeft">
-                <text class="stuTitle">科目：初一初二数学</text>
-                <text class="stuDesc">主要为了冲刺中考</text>
-            </view>
-            <view class="stuRight">
-                <text class="stuId">20220811</text>
-                <text class="stuSex">学员：男</text>
-                <text class="salary">100/小时</text>
-            </view>
-        </view>
+    <view class="searchList" bindtap="chooseTeachEdu">
+        {{teachEduChosed || '教员学历'}}
+        <image class="iconImg" src="../../images/down.png"></image>
     </view>
-    <view>
-        <!-- 间隔区域 -->
-        <view class="stuListInterval"></view>
-        <!-- 学生列表区域 -->
-        <view class="stuListDetail">
-            <view class="stuLeft">
-                <text class="stuTitle">科目：初一初二数学</text>
-                <text class="stuDesc">主要为了冲刺中考</text>
-            </view>
-            <view class="stuRight">
-                <text class="stuId">20220811</text>
-                <text class="stuSex">学员：男</text>
-                <text class="salary">100/小时</text>
-            </view>
-        </view>
+    <view class="searchList" bindtap="chooseTeachSex">
+        {{teachSexChosed || '教员性别'}}
+        <image class="iconImg" src="../../images/down.png"></image>
     </view>
-    <view>
-        <!-- 间隔区域 -->
-        <view class="stuListInterval"></view>
-        <!-- 学生列表区域 -->
-        <view class="stuListDetail">
-            <view class="stuLeft">
-                <text class="stuTitle">科目：初一初二数学</text>
-                <text class="stuDesc">主要为了冲刺中考</text>
-            </view>
-            <view class="stuRight">
-                <text class="stuId">20220811</text>
-                <text class="stuSex">学员：男</text>
-                <text class="salary">100/小时</text>
-            </view>
-        </view>
+    <view class="searchList" bindtap="chooseTeachImg">
+        {{teachImgChosed || '教员照片'}}
+        <image class="iconImg" src="../../images/down.png"></image>
     </view>
-    <view>
+</view>
+<view class="searchBtn-container" wx:if="{{toSearch}}">
+    <view class="searchBtn">搜索</view>
+    <view class="clearBtn" bindtap="clearOptions">清除选择</view>
+</view>
+
+<!-- 学生列表区 -->
+<view class="stuListContainer">
+    <view wx:for="{{stuLists}}" wx:key="index" wx:for-index="index">
         <!-- 间隔区域 -->
         <view class="stuListInterval"></view>
         <!-- 学生列表区域 -->
-        <view class="stuListDetail">
+        <view class="stuListDetail" bindtap="toStuDetail">
             <view class="stuLeft">
-                <text class="stuTitle">科目：初一初二数学</text>
-                <text class="stuDesc">主要为了冲刺中考</text>
+                <text class="stuTitle">科目：{{stuLists[index][5].courseDetail}}</text>
+                <text class="stuDesc">{{stuLists[index][10].except}}</text>
             </view>
             <view class="stuRight">
-                <text class="stuId">20220811</text>
-                <text class="stuSex">学员：男</text>
-                <text class="salary">100/小时</text>
+                <text class="stuId">{{stuLists[index][0].id}}</text>
+                <text class="stuSex">学员：{{stuLists[index][7].stuSex}}</text>
+                <text class="salary">{{stuLists[index][8].salary}}/小时</text>
             </view>
         </view>
     </view>
+</view>
+
+<!-- 筛选条件的选项区 -->
+<!-- 课程科目选项区 -->
+<view class="course" wx:if="{{showCourse}}">
+    <view class="{{courseChosedIndex === index ? 'courseActive' : 'courseLists'}}" wx:for="{{courseList}}" wx:key="index" data-index="{{index}}" wx:for-item="courseItem" bindtap="chosedCourse">{{courseItem}}</view>
+</view>
+<!-- 课程详情选区 -->
+<view class="courseDetail" wx:if="{{showCourseDetail}}">
+    <view class="courseDetailLists" wx:for="{{courseDetail[courseChosedIndex]}}" wx:key="index" data-index="{{index}}" wx:for-item="item" bindtap="chosedCourseDetail">{{item}}</view>
+</view>
+<!-- 辅导方式选项区 -->
+<view class="teachPositions" wx:if="{{showTeachPosition}}">
+    <view class="detail" wx:for="{{teachPositions}}" wx:key="index" data-index="{{index}}" bindtap="toChosedTeachPosition">{{item}}</view>
+</view>
+<!-- 学生性别选项区 -->
+<view class="choosestuSex" wx:if="{{showSexList}}">
+    <view class="detail" wx:for="{{sexList}}" wx:key="index" data-index="{{index}}" bindtap="toChosedStuSex">{{item}}</view>
+</view>
+
+<!-- 教员类型选项区 -->
+<view class="teachType" wx:if="{{showTeachType}}">
+    <view class="detail" wx:for="{{teachType}}" wx:key="index" data-index="{{index}}" bindtap="toChosedTeachType">{{item}}</view>
+</view>
+
+<!-- 教员学历选项区 -->
+<scroll-view class="eduList" wx:if="{{showTeachEdu}}">
+    <view class="detail" wx:for="{{educationList}}" wx:key="index" data-index="{{index}}" bindtap="toChosedTeachEdu">{{item}}</view>
+</scroll-view>
+
+<!-- 老师性别选项区 -->
+<view class="teachSex" wx:if="{{showTeachSex}}">
+    <view class="detail" wx:for="{{sexList}}" wx:key="index" data-index="{{index}}" bindtap="toChosedTeachSex">{{item}}</view>
+</view>
+
+<!-- 老师照片 -->
+<view class="teachImgList" wx:if="{{showTeachImg}}">
+    <view class="detail" wx:for="{{teachImgOptions}}" wx:key="index" data-index="{{index}}" bindtap="toChosedTeachImg">{{item}}</view>
 </view>

pages/stuList/stuList.wxss

@@ -1,19 +1,91 @@
 /* pages/stuList/stuList.wxss */
 
-/* 头部搜索区 */
-.searchContainer{
+/* 搜索学员 */
+/* 找学员的按钮 */
+.toOpenSearch{
+    width: 140rpx;
+    height: 50rpx;
+    line-height: 50rpx;
+    margin-left: 20rpx;
+    border: 1rpx solid gray;
+    border-radius: 70rpx;
+    padding: 4rpx 20rpx;
+}
+.mask{
+    height: 300rpx;
+}
+/* 筛选区的样式 */
+.searchContainer {
+    z-index: 3;
     display: flex;
-    height: 60rpx;
-    line-height: 60rpx;
-    margin-left: -20rpx;
-    /* border-bottom: 1rpx solid red; */
-    justify-content: space-around;
+    padding-bottom: 10rpx;
+    width: 100%;
+    line-height: 50rpx;
+    background-color: #fff;
     font-size: 28rpx;
+    flex-wrap: wrap;
+    position: sticky;
+    top: 0;
+}
+/* 筛选区列表的样式 */
+.searchList{
+    width: 28%;
+    height: 50rpx;
+    text-align: center;
+    margin-top: 10rpx;
+    margin-left: 20rpx;
+    border: 1rpx solid gray;
+    border-radius: 30rpx;
+    overflow: hidden;
+}
+/* 下拉箭头图标 */
+.iconImg {
+    width: 26rpx;
+    height: 26rpx;
+}
+/* 搜索按钮 */
+/* 搜索按钮外层容器 */
+.searchBtn-container{
+    z-index: 3;
+    height: 50rpx;
+    background-color: #fff;
+    display: flex;
+    position: sticky;
+    top: 200rpx;
+}
+/* 搜索按钮和清除选择按钮的公共样式 */
+.searchBtn,
+.clearBtn{
+    border:1rpx solid gray;
+    border-radius: 30rpx;
+    height: 38rpx;
+    line-height: 40rpx;
+    padding: 4rpx 20rpx;
+    font-size: 28rpx;
+}
+/* 搜索按钮 */
+.searchBtn{
+    margin-left: 20rpx;
+}
+/* 清除选择按钮 */
+.clearBtn{
+    display: flex;
+    position: absolute;
+    margin-left: auto;
+    right: 20rpx;
+}
+
+/* 搜索区下方的隔离区 */
+.interval{
+    height: 10rpx;
+    margin-top: 20rpx;
+    background-color: gray;
 }
 /* 间隔线 */
 .stuListInterval{
     height: 10rpx;
     margin-left: -20rpx;
+    margin-top: 10rpx;
     background-color: #F1F1F1;
 }
 
@@ -50,7 +122,135 @@
     color: #979797;
     margin-top: 10rpx;
 }
-
+/* 薪水 */
 .salary{
     color: #FF970F;
+}
+
+/* 课程科目 */
+.course{
+    z-index: 3;
+    position: fixed;
+    width: 100%;
+    height: 100%;
+    top: 124rpx;
+    background-color: #F3F3F3;
+    border: 1rpx solid #E6E6E6;
+}
+
+.courseLists{
+    width: 160rpx;
+    height: 40rpx;
+    /* background-color: yellow; */
+    border-right: 1rpx solid red;
+    border-bottom: 1rpx solid red;
+    padding: 20rpx 20rpx 20rpx 40rpx;
+}
+/* 选中课程科目的样式 */
+.courseActive{
+    width: 160rpx;
+    height: 40rpx;
+    color: #ff9000;
+    font-weight: bold;
+    border-bottom: 1rpx solid gray;
+    padding: 20rpx 20rpx 20rpx 40rpx;
+}
+
+/* 课程详情 */
+.courseDetail{
+    z-index: 3;
+    position: fixed;
+    width: calc(100vw - 224rpx);
+    /* height: 100%; */
+    top: 124rpx;
+    left: 224rpx;
+    background-color: #F3F3F3;
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+}
+.courseDetailLists{
+    padding: 20rpx;
+    border: 1rpx solid #E6E6E6;
+    border-radius: 16rpx;
+    height: 30rpx;
+    line-height: 30rpx;
+    margin: 10rpx;
+}
+/* 选中课程详情的样式 */
+.courseDetailActive{
+    height: 40rpx;
+    color: #ff9000;
+    font-weight: bold;
+    padding: 20rpx;
+    border: 1rpx solid #E6E6E6;
+    border-radius: 16rpx;
+    height: 30rpx;
+    line-height: 30rpx;
+    margin: 10rpx;
+}
+
+/* 辅导方式、学生性别、教员类型、教员学历选项区的公共样式 */
+.teachPositions,
+.choosestuSex,
+.teachType,
+.eduList,
+.teachSex
+{
+    background-color: #F3F3F3;
+    border: 1rpx solid #E6E6E6;
+    position: fixed;
+    padding: 10rpx;
+    z-index: 3;
+}
+
+/* 辅导方式选项区 */
+.teachPositions{
+    top: 124rpx;
+    left: 34%;
+    width: 30%;
+}
+/* 辅导方式筛选内容区的公共样式 */
+.detail{
+    margin: 30rpx 0;
+}
+/* 学生性别 */
+.choosestuSex{
+    width: 30%;
+    top: 124rpx;
+    right: 20rpx;
+}
+
+/* 老师身份选项区 */
+.teachType{
+    top: 188rpx;
+    left: 20rpx;
+}
+
+/* 老师学历选项区 */
+.eduList{
+    width: 30%;
+    top: 188rpx;
+    left: 34%;
+}
+
+/* 老师性别选项区 */
+.teachSex{
+    width: 30%;
+    top: 188rpx;
+    right: 20rpx;
+}
+
+/* 老师照片选项区 */
+.teachImgList{
+    background-color: #F3F3F3;
+    border: 1rpx solid #E6E6E6;
+    position: fixed;
+    padding: 10rpx;
+    z-index: 3;
+}
+.teachImgList{
+    width: 180rpx;
+    top: 252rpx;
+    left: 20rpx;
 }

pages/teacherList/teacherList.js

@@ -9,6 +9,7 @@ Page({
         courseChosedIndex: '', //选中科目的索引
         showCourse: false, //科目选项区是否显示
         courseDetailChosed: '', //课程详情筛选条件
+        courseDetailIndex:'',   //选中课程详情的索引
         showCourseDetail: false, //课程详情选项区是否显示
         teachIdChosed: '', //老师身份的筛选条件
         showTeachId: false, //老师身份选项区是否显示
@@ -473,7 +474,7 @@ Page({
             toSearch : !toSearch
         })
         // 判断打开找老师的筛选区的条件是否为false，如果是，则关闭所有选项的筛选区
-        if(this.data.toSearch == false){
+        if(!this.data.toSearch){
             this.setData({
                 showTeachId: false,
                 showCourse: false,
@@ -520,7 +521,8 @@ Page({
         this.setData({
             courseDetailChosed : courseDetail[courseChosedIndex][index],
             showCourseDetail: false,
-            showCourse: false
+            showCourse: false,
+            courseDetailIndex:index
         })
         console.log(this.data.courseDetailChosed);
     },
@@ -681,6 +683,8 @@ Page({
     // 清除选择按钮
     clearOptions() {
         this.setData({
+            courseChosedIndex: '',
+            courseDetailIndex:'',
             courseDetailChosed:'',
             teachIdChosed: '',
             teachEduChosed: '',

pages/teacherList/teacherList.wxml

@@ -73,7 +73,7 @@
 <!-- 筛选条件的选项区 -->
 <!-- 课程科目选项区 -->
 <view class="course" wx:if="{{showCourse}}">
-    <view class="courseLists" wx:for="{{courseList}}" wx:key="index" data-index="{{index}}" wx:for-item="courseItem" bindtap="chosedCourse">{{courseItem}}</view>
+    <view class="{{courseChosedIndex ===index ? 'courseActive' : 'courseLists'}}" wx:for="{{courseList}}" wx:key="index" data-index="{{index}}" wx:for-item="courseItem" bindtap="chosedCourse">{{courseItem}}</view>
 </view>
 <!-- 课程详情选区 -->
 <view class="courseDetail" wx:if="{{showCourseDetail}}">

pages/teacherList/teacherList.wxss

@@ -215,6 +215,16 @@
     border-bottom: 1rpx solid red;
     padding: 20rpx 20rpx 20rpx 40rpx;
 }
+/* 选中课程科目的样式 */
+.courseActive{
+    width: 160rpx;
+    height: 40rpx;
+    color: #ff9000;
+    font-weight: bold;
+    border-bottom: 1rpx solid gray;
+    padding: 20rpx 20rpx 20rpx 40rpx;
+}
+
 
 /* 课程详情 */
 .courseDetail{
@@ -236,6 +246,18 @@
     line-height: 30rpx;
     margin: 10rpx;
 }
+/* 选中课程详情的样式 */
+.courseDetailActive{
+    height: 40rpx;
+    color: #ff9000;
+    font-weight: bold;
+    padding: 20rpx;
+    border: 1rpx solid #E6E6E6;
+    border-radius: 16rpx;
+    height: 30rpx;
+    line-height: 30rpx;
+    margin: 10rpx;
+}
 
 /* 老师身份选项区 */
 .teachId{