会议室模块

components/selectArea/selectArea.acss

+@import "../../font/iconfont.acss";
+.treeUl {
+  position: relative;
+  padding-left: 45rpx;
+  display: block;
+}
+.treeLi {
+  position: relative;
+  display: block;
+}
+.firstTreeUl{
+  margin: 0;
+  padding: 0;
+}
+.treeName {
+  height: 60rpx;
+  font-size: 28rpx;
+  line-height: 60rpx;
+  width: 100%;
+  display: flex;
+}
+.labelIsShow {
+  width: 24rpx;
+  margin-right: 24rpx;
+}
+.treeLabel {
+  flex: 1;
+}
+.selectView{
+  width: 40rpx;
+}
+.firstTreeUl>.treeLi {
+  padding: 0 32rpx;
+  border-bottom: 16rpx solid #f6f6f6;
+}
+/* 水平方向 */
+.firstTreeUl .treeUl>.treeLi:after {
+  content: ' ';
+  position: absolute;
+  top: 28rpx;
+  left: -28rpx;
+  width: 28rpx;
+  border: none;
+  border-top: 1px dashed #3296FA;
+}
+/* 垂直方向 */
+.firstTreeUl .treeUl>.treeLi:not(:last-child):before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: -30rpx;
+  height: 100%;
+  border: none;
+  border-left: 1px dashed #3296FA;
+}
+
+.firstTreeUl .treeUl>.treeLi:before {
+  content: ' ';
+  position: absolute;
+  top: 0;
+  left: -30rpx;
+  height: 30rpx;
+  border: none;
+  border-left: 1px dashed rgb(240, 245, 250);
+}
+.selectViewAction {
+  color: #fff;
+  background: #3296FA;
+}
\ No newline at end of file

components/selectArea/selectArea.axml

-<view>
-  New Component
+<view class="treeUl">
+  <block a:for="{{lableTree}}">
+    <view  data-selectid="{{item.id}}" class="treeLi">
+      <view class="treeName">
+        <view class="labelIsShow" data-index="{{index}}" catchTap="onChangeStatus">
+          {{item.status === 'show' ? '1' : '0'}}
+        </view>
+        <view class="treeLabel" data-index="{{index}}" catchTap="onChangeAreId">
+          {{item.name}}
+        </view>
+        <view class="selectView">
+          {{locationId === item.id ? '1' : '0'}}
+        </view>
+      </view>
+      <pang-tree 
+        a:if="{{item.children && item.status}}"
+        cycleTimes="{{index + 1}}"
+        locationName="{{locationName}}"
+        areTreeList="{{item.children}}"
+        locationId="{{locationId}}"
+        onPropsCS="onPropsCS"
+      >
+      </pang-tree>
+    </view>
+  </block>
 </view>
\ No newline at end of file

components/selectArea/selectArea.js

 Component({
   mixins: [],
-  data: {},
-  props: {},
-  didMount() {},
+  data: {
+    index: 0,
+    lableTree: []
+  },
+  props: {
+    cycleTimes: '0',// 循环次数
+    locationName: '',//区域name
+    locationId: '',// 区域id
+    areTreeList: []
+  },
+  didMount() {
+    let lableTree = this.props.areTreeList.map(item => {
+      return {
+        ...item,
+        status: true
+      }
+    })
+    this.setData({
+      lableTree: lableTree,
+      index: parseInt(this.props.cycleTimes)
+    })
+  },
   didUpdate() {},
   didUnmount() {},
-  methods: {},
+  methods: {
+    onChangeStatus(e) {
+      let index = e.target.dataset.index
+      let listStr = `lableTree[${index}].status`
+      this.setData({
+        [listStr]: this.data.lableTree[index].status ? false : true
+      })
+    },
+    onChangeAreId(e){
+      let index = e.target.dataset.index
+      let data = {
+        id: this.data.lableTree[index].id === this.props.locationId ? '' : this.data.lableTree[index].id,
+        name: this.data.lableTree[index].id === this.props.locationId ? '全部区域' : this.data.lableTree[index].name
+      }
+      this.onPropsCS(data)
+    },
+    onPropsCS(data) {
+      this.props.onPropsCS(data)
+    }
+  },
 });

components/selectArea/selectArea.json

 {
-  "component": true
+  "component": true,
+  "usingComponents": {
+    "pang-tree": "./selectArea"
+  }
 }
\ No newline at end of file

pages/meetingRoomList/meetingRoomList.acss

+@import "../../font/iconfont.acss";
 /* 预定会议列表 */
 .searchHeader {
   box-sizing: border-box;
@@ -27,6 +28,8 @@
 }
 .searchTime {
   width: 176rpx;
+  height: 96rpx;
+  line-height: 96rpx;
 }
 .searchTime>view:nth-of-type(1) {
   flex: 1;
@@ -35,7 +38,7 @@
   margin: 0 10rpx 0 16rpx;
   width: 24rpx;
 }
-.searchCategory {
+/* .searchCategory {
   display: flex;
   width: 200rpx;
 }
@@ -49,9 +52,11 @@
 .searchCategory>view:nth-of-type(2) {
   margin: 0 10rpx 0 16rpx;
   width: 24rpx;
-}
+} */
 .searchLocation {
   width: 200rpx;
+  height: 96rpx;
+  line-height: 96rpx;
 }
 .searchLocation>view:nth-of-type(1) {
   flex: 1;
@@ -272,4 +277,35 @@
   top: 0;
   width: 100%;
   height: 100%;
+  background: rgba(0,0,0,.1);
+  display: flex;
+  align-items: flex-end;
+}
+.lableTreeContent{
+  width: 100%;
+  height: 527rpx;
+  background: #FFFFFF;
+  box-shadow: 0 -2rpx 20rpx 0 rgba(25,31,37,0.12);
+  border-radius: 19rpx 19rpx 0px 0px;
+}
+.lableTreeHeader{
+  width: 100%;
+  height: 104rpx;
+  padding: 0 32rpx;
+  line-height: 104rpx;
+  font-size: 34rpx;
+  display: flex;
+  box-sizing: border-box;
+  border-bottom: 1px solid rgba(25,31,37,0.12);
+}
+.lableTreeHeader>view{
+  flex: 1;
+  height: 104rpx;
+}
+.lableTreeHeader>view:nth-of-type(1) {
+  color: #191F25;
+}
+.lableTreeHeader>view:nth-of-type(2) {
+  color: #3296FA;
+  text-align: right
 }
\ No newline at end of file

pages/meetingRoomList/meetingRoomList.axml

@@ -11,7 +11,7 @@
       </view>
       <view class="searchLocation">
         <view onTap="changeLocation">
-          {{search.location}}            
+          {{search.locationName}}            
         </view>
         <view class="xialakuangSize">
           <text class="iconfont iconxialakuang"></text>
@@ -21,8 +21,9 @@
     <view class="searchHeader2">
       <scroll-view scroll-x='{{true}}' scroll-left='{{100}}' scroll-into-view='searchList'>
         <view a:for="{{equipFacilityList}}" class="equipFacilityList" onTap="changeSearchEquipFacility" data-id='{{item.id}}'>
-          <view class="selectListcheck {{ search.checkList.indexOf(item.id) === -1 ? 'selectListcheck' : 'selectListCheckAciton'}}">
-            <text class="iconfont iconyigouxuan"></text>
+          <view class="selectListcheck">
+            <text class="iconfont iconyigouxuan" a:if="{{search.equipFacilityIds.indexOf(item.id) !== -1}}"></text>
+            <text class="iconfont iconweigouxuan" a:elif="{{search.equipFacilityIds.indexOf(item.id) === -1}}"></text>
           </view>
           <view>
             {{item.name}}
@@ -89,7 +90,7 @@
         <!-- <view onTap="selectDate">自定义</view> -->
       </view>
       <scroll-view scroll-y='{{true}}' class="modalOccupyTimeSlot">
-        <view class="OccupyTimeList" a:for="{{modalList}}">
+        <view class="OccupyTimeList" a:for="{{modalList}}"  data-index="{{index}}" onTap="onChangeModalTime">
           <!-- <view data-status="{{item.reserveStatus}}" data-index="{{index}}">
             <timecheckmodal
               startTime="{{meetingTime.startTime}}"
@@ -105,10 +106,10 @@
             <view a:if="{{item.status==='BeOverdue'}}" class="beOverdue">
             
             </view>
-            <view a:elif="{{item.status==='Uncheck'}}" data-index="{{index}}" class="Unchecked" onTap="onChangeModalTime">
+            <view a:elif="{{item.status==='Uncheck'}}" class="Unchecked">
               
             </view>
-            <view a:elif="{{item.status==='checked'}}" data-index="{{index}}" class="checked" onTap="onChangeModalTime">
+            <view a:elif="{{item.status==='checked'}}" class="checked">
               
             </view>
           </view>
@@ -128,16 +129,24 @@
   <view class="lableTreeBox" a:if="{{isShowLableModal}}">
     <view class="lableTreeContent">
       <view class="lableTreeHeader">
-        <view>
+        <view catchTap="cancelSelectAre">
           取消
         </view>
-        <view>
+        <view catchTap="sureSelectAre">
           确定
         </view>
       </view>
       <view class="lableTreeModal">
-        <lable-tree>
-        </lable-tree>
+        <scroll-view scroll-y="{{true}}" style="height: 422rpx;">
+          <lable-tree
+            areTreeList="{{lableTreeList}}"
+            cycleTimes="0" 
+            locationName="{{location.name}}"
+            locationId="{{location.id}}"
+            onPropsCS="onPropsCS"
+          >
+          </lable-tree>
+        </scroll-view>
       </view>
     </view>
   </view>
\ No newline at end of file

pages/meetingRoomList/meetingRoomList.js

@@ -9,13 +9,18 @@ create.Page({
   data: {
     equipFacilityList: [],
     reserveRoomList: [],
+    lableTreeList: [],
     timeListStr:[0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24],
     search: {
       category: '',
-      location: '全部区域',
+      locationName: '全部区域',
       locationId: '',
-      searchValue: '',
-      checkList: []
+      equipFacilityIds: [],
+      time: ''
+    },
+    location:{
+      id: '',
+      name: ''
     },
     isShowModal: false,
     isShowLableModal: false,
@@ -37,8 +42,7 @@ create.Page({
     let search = {
       time: `${year}-${month.length > 1 ? month : '0'+month}-${day.length > 1 ? day : '0'+day}`,
       category: '全部分类',
-      location: '全部区域',
-      iptValue: ''
+      location: '全部区域'
     }
     this.setData({
       'search.time': `${year}-${month.length > 1 ? month : '0'+month}-${day.length > 1 ? day : '0'+day}`
@@ -71,22 +75,23 @@ create.Page({
         equipFacilityIds: '',
       }
       getReserveRoomList(data2).then(res => {
-        console.log(res.data)
-        let reserveRoomList = res.data.data.map(item => {
-          let startTime = parseInt(item.timeSlotWithMeetingVOS[0].reserveStartTime.substring(0, 2))
-          let endTime = parseInt(item.timeSlotWithMeetingVOS[item.timeSlotWithMeetingVOS.length - 1].reserveEndTime.substring(0, 2))
-          let timeList = []
-          for (let i = startTime; i < endTime; i++) {
-            timeList.push(i)
-          }
-          return {
-            ...item,
-            timeList,
-          }
-        })
-        that.setData({
-          reserveRoomList: reserveRoomList
-        })
+        if (res.data.data) {
+          let reserveRoomList = res.data.data.map(item => {
+            let startTime = parseInt(item.timeSlotWithMeetingVOS[0].reserveStartTime.substring(0, 2))
+            let endTime = parseInt(item.timeSlotWithMeetingVOS[item.timeSlotWithMeetingVOS.length - 1].reserveEndTime.substring(0, 2))
+            let timeList = []
+            for (let i = startTime; i < endTime; i++) {
+              timeList.push(i)
+            }
+            return {
+              ...item,
+              timeList,
+            }
+          })
+          that.setData({
+            reserveRoomList: reserveRoomList
+          })
+        }
       })
     })
   },
@@ -94,11 +99,15 @@ create.Page({
     let that = this
     dd.datePicker({
       format: 'yyyy-MM-dd',
-      currentDate: '2012-12-12',
+      currentDate: this.data.search.time,
       success: (res) => {
-        // dd.alert({
-        //   content: res.date,
-        // });
+        if (res !== {}) {
+          that.setData({
+            'search.time': res.date
+          }, () => {
+            that.getRoomList()
+          })
+        }
       },
       complete: (res) => {
         // res
@@ -149,6 +158,9 @@ create.Page({
     let that = this;
     let index = e.currentTarget.dataset.index;
     let data = this.data.modalList[index]; // 点击的数据
+    if (data.status === 'BeOverdue') {
+      return false;
+    }
     if (!this.data.meetingTime.startTime && !this.data.meetingTime.endTime) { 
       // 判断是否有开始时间
       console.log('判断是否有开始时间')
@@ -372,9 +384,16 @@ create.Page({
           status: 'checked'
         }
       } else {
-        return {
-          ...item,
-          status: 'Uncheck'
+        if (item.reserveStatus=== 'expired') {
+          return {
+            ...item,
+            status: 'BeOverdue'
+          }
+        } else {
+          return {
+            ...item,
+            status: 'Uncheck'
+          }
         }
       }
     })
@@ -467,7 +486,7 @@ create.Page({
   onDetermine(){
     let startTime = this.data.meetingTime.startTime
     if (this.data.meetingTime.endTime) {
-      let endTimeDate = new Date(this.data.meetingTime.endTime.replace(/-/g, '/'))
+      var endTimeDate = new Date(this.data.meetingTime.endTime.replace(/-/g, '/'))
       endTimeDate.setMinutes(endTimeDate.getMinutes() + 30)
       this.store.data.startTime = `${startTime}:00`
       this.store.data.endTime = `${endTimeDate.getFullYear()}-${endTimeDate.getMonth()+1<10 ? '0'+ (endTimeDate.getMonth()+1) : endTimeDate.getMonth()+1}-${endTimeDate.getDate()<10?'0'+endTimeDate.getDate():endTimeDate.getDate()} ${endTimeDate.getHours()<10? '0'+endTimeDate.getHours():endTimeDate.getHours()}:${endTimeDate.getMinutes()<10? '0'+endTimeDate.getMinutes():endTimeDate.getMinutes()}:00`
@@ -478,18 +497,49 @@ create.Page({
         delta: 2
       })
     } else {
-      let endTimeDate = new Date(this.data.meetingTime.startTime.replace(/-/g, '/'))
+      var endTimeDate = new Date(this.data.meetingTime.startTime.replace(/-/g, '/'))
       endTimeDate.setMinutes(endTimeDate.getMinutes() + 30)
       this.store.data.startTime = `${startTime.replace(/-/g, '/')}:00`
       this.store.data.endTime = `${endTimeDate.getFullYear()}/${endTimeDate.getMonth()+1<10 ? '0'+ (endTimeDate.getMonth()+1) : endTimeDate.getMonth()+1}/${endTimeDate.getDate()<10?'0'+endTimeDate.getDate():endTimeDate.getDate()} ${endTimeDate.getHours()<10? '0'+endTimeDate.getHours():endTimeDate.getHours()}:${endTimeDate.getMinutes()<10? '0'+endTimeDate.getMinutes():endTimeDate.getMinutes()}:00`
-      this.store.data.locationName = event.target.dataset.locationName
-      this.store.data.roomId = this.data.meetingTime.locationId
+      this.store.data.locationName = this.data.meetingTime.meetingRoomName
+      this.store.data.roomId = this.data.meetingTime.meetingRoomId
       this.update()
       dd.navigateBack({
         delta: 2
       })
     }
   },
+  getRoomList() {
+    let that = this
+    let data = {
+      startTime: that.data.search.time,
+      locationId: that.data.search.locationId,
+      equipFacilityIds: that.data.search.equipFacilityIds.toString()
+    }
+    getReserveRoomList(data).then(res => {
+      if (res.data.data) {
+        let reserveRoomList = res.data.data.map(item => {
+          let startTime = parseInt(item.timeSlotWithMeetingVOS[0].reserveStartTime.substring(0, 2))
+          let endTime = parseInt(item.timeSlotWithMeetingVOS[item.timeSlotWithMeetingVOS.length - 1].reserveEndTime.substring(0, 2))
+          let timeList = []
+          for (let i = startTime; i < endTime; i++) {
+            timeList.push(i)
+          }
+          return {
+            ...item,
+            timeList,
+          }
+        })
+        that.setData({
+          reserveRoomList: reserveRoomList
+        })
+      } else {
+        that.setData({
+          reserveRoomList: []
+        })
+      }
+    })
+  },
   changeLocation(){
     let that = this
     let data = {
@@ -497,9 +547,60 @@ create.Page({
     }
     // 获取会议室设施的List
     getLabelTree(data).then(res => {
-      console.log(res)
+      that.setData({
+        lableTreeList: res.data.data,
+        isShowLableModal: true,
+        'location.id': that.data.search.locationId,
+        'location.name': that.data.search.locationName,
+      })
+    })
+  },
+  onPropsCS(e){
+    console.log(e)
+    this.setData({
+      'location.id': e.id,
+      'location.name': e.name
+    })
+  },
+  cancelSelectAre() {
+    this.setData({
+      isShowLableModal: false,
+      'location.id': '',
+      'location.name': ''
+    })
+  },
+  sureSelectAre() {
+    let that = this
+    this.setData({
+      isShowLableModal: false,
+      'search.locationId': this.data.location.id,
+      'search.locationName': this.data.location.name
+    },() => {
+      that.getRoomList()
     })
   },
+  changeSearchEquipFacility(e){
+    let that = this
+    let id = e.currentTarget.dataset.id;
+    let index = this.data.search.equipFacilityIds.indexOf(id)
+    if ( index === -1) {
+      let data = [...this.data.search.equipFacilityIds]
+      data.push(id)
+      this.setData({
+        'search.equipFacilityIds': data
+      }, () => {
+        that.getRoomList()
+      })
+    } else {
+      let data = [...this.data.search.equipFacilityIds]
+      data.splice(index, 1)
+      this.setData({
+        'search.equipFacilityIds': data
+      }, () => {
+        that.getRoomList()
+      })
+    }
+  },
   onReady() {
     // 页面加载完成
   },