leaveDetail

app.json

@@ -32,7 +32,8 @@
     "pages/classOrder/classOrder",
     "pages/quan/quan",
     "pages/editMyself/editMyself",
-    "pages/showVideoList/showVideoList"
+    "pages/showVideoList/showVideoList",
+    "pages/leaveDetail/leaveDetail"
   ],
   "window": {
     "backgroundTextStyle": "dark",

pages/leaveDetail/leaveDetail.js

@@ -0,0 +1,85 @@
+// pages/leaveDetail/leaveDetail.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    index: 0,
+    array:['事假','病假','其他'],
+    item:{
+      date: '2021-02-22',
+      time: '08:00',
+      title: 'haha钢琴',
+      teacher: '张老师',
+      num: '3'
+    }
+  },
+
+  getText:function(e){
+    console.log(e.detail.value)
+  },
+
+  bindPickerChange:function(e){
+    const index = e.detail.value
+    this.setData({
+      index
+    })
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  }
+})

pages/leaveDetail/leaveDetail.json

@@ -0,0 +1,4 @@
+{
+  "navigationBarTitleText": "请假",
+  "usingComponents": {}
+}

pages/leaveDetail/leaveDetail.wxml

@@ -0,0 +1,30 @@
+<view class="container">
+  <view class="view-box">
+    <view class="title">请假日期</view>
+    <view class="value">{{item.date}}</view>
+    <view class="title">上课时间</view>
+    <view class="value">{{item.time}}</view>
+    <view class="title">课程名称</view>
+    <view class="value">{{item.title}}</view>
+    <view class="title">授课老师</view>
+    <view class="value">{{item.teacher}}</view>
+    <view class="title">请选择请假类型</view>
+    <view class="value">
+      <picker bindchange="bindPickerChange" value="{{index}}" range="{{array}}">
+          <view class="picker">
+            {{array[index]}}
+          </view>
+        </picker>
+    </view>
+    <view class="textarea-box" wx:if="{{index == 2}}">
+      <textarea bindinput="getText" placeholder="请输入请假原因" maxlength="200"></textarea>
+    </view>
+    <view class="title">本课程请假余额</view>
+    <view class="value red-view">{{item.num}}次</view>
+  </view>
+
+  <view class="submit-view">
+    提交
+  </view>
+ 
+</view>

pages/leaveDetail/leaveDetail.wxss

@@ -0,0 +1,53 @@
+/* pages/leaveDetail/leaveDetail.wxss */
+.view-box{
+  width: 700rpx;
+  padding: 25rpx;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  
+}
+.view-box view{
+  font-size: 36rpx;
+  height: 110rpx;
+  line-height: 110rpx;
+  border-bottom: 1px solid #eee;
+}
+.title{
+  width: 40%;
+}
+.value{
+  width: 60%;
+  text-align: right;
+}
+.textarea-box{
+  width: 100%;
+    height: 400rpx !important;
+    line-height: 40rpx;
+}
+.textarea-box textarea{
+  width: 650rpx;
+  height: 300rpx;
+    background: #f1f1f1;
+    padding: 25rpx;
+    margin: 25rpx 0;
+    border-radius: 20rpx;
+}
+.red-view{
+  color: #cc6031;
+}
+
+.submit-view{
+  position: fixed;
+  bottom: 100rpx;
+  width: 400rpx;
+  height: 100rpx;
+  line-height: 100rpx;
+  background: #cc6031;
+  color: #FFF;
+  text-align: center;
+  left: 50%;
+  margin-left: -200rpx;
+  border-radius: 50rpx;
+  font-size: 36rpx;
+}

pages/lessons/lessons.wxss

@@ -14,4 +14,8 @@
   background: #cc6031;
   text-align: center;
   font-size: 36rpx;
+}
+
+page{
+  background: #f1f1f1;
 }