1.页面展示
用户首次登陆系统需要注册一个用户或直接使用微信作为账号,用户在登录平台后,可以进行平台的操作。主要模块包括以下几点:
(1)登录功能:注册普通账号登录;也可以直接使用微信登录;登录后可以修改用户的基本信息,也可以退出。
(2)资讯功能:后台录入资讯,在微信小程序自习室图书馆座位预约系统的资讯模板展示,用户可以任意浏览资讯列表和详细信息
(3)日期安排:默认只能预约最近4天的自习室、图书馆的座位。
(4)选择预约地方:在后台录入开发的教室、在小程序端选择所要预约座位的地方,比如自习室、图书馆等。
(5)选择座位:选择对应的自习室或图书馆等后、选择可以预约的座位(绿色的表示已经预约了)
(6)填写预约信息:姓名、电话、备注;便于管理员临时有事情通知
(7)我的预约信息:预约时间和星期几、预约人姓名、电话、备注。
(8)取消申请:在我的预约信息列表中,如果管理员还没有审核该预约信息,那么在最右侧会显示“取消申请”,点击该链接,即可取消。
(9)用户信息:填写姓名、qq、邮箱、备注等信息
2.代码实现
<!--pages/my_yy/my_yy.wxml-->
<view class="header" >
<image src="{{list3[0].dt}}" bindtap="previewImg" data-src="{{list3[0].dt}}" ></image>
</view>
<view class="eare" wx:for="{{list2}}" wx:for-item="item1">{{item1.qy}}<view>
<view class="time" >
<view class="eare_body" wx:for="{{list}}" wx:key="item"
wx:if="{{item.gl==item1._id}}">
<view class="eare_1" bindtap="goyy" id="{{item._id}}">
<tex class="eare_1_zw">{{item.zw}}号卓</tex>
<view wx:if="{{item.zt==1}}">
<image class="eare_1_zw_img" src="{{item.image}}"></image>
<view class="eare_1_zw_zt">当日以约满</view>
</view>
<view class="eare_1_zw" wx:else>
<text>当前空闲</text>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- <view class="eare">静音区</view>
<view class="time">
<view class="eare_body" wx:for="{{list1}}" wx:key="item">
<view class="eare_1" bindtap="goyy" id="{{item._id}}">
<tex class="eare_1_zw">{{item.zw}}号卓</tex>
<view wx:if="{{item.zt}}">
<image class="eare_1_zw_img" src="{{item.image}}"></image>
<view class="eare_1_zw_zt">当日以约满</view>
</view>
<view class="eare_1_zw" wx:else>
<text>当前空闲</text>
</view>
</view>
</view>
</view>
<view class="eare">观景区</view>
<view class="time">
</view> -->
<!-- <view class="footer">
<view>
<view class="footer_content">
</view>
<view class="footer_bt">立即预约</view>
</view>
</view>
// pages/my_yy/my_yy.js
const db = wx.cloud.database()
Page({
/**
* 页面的初始数据
*/
data: {
list:'',
list1:'',
list2:'',
zt:'',
eara:'',
placearr:['低分贝区','静音区','风景区'],
photo:'',
list3:''
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
wx.cloud.callFunction({
name:"getzw",
complete: res => {
console.log('dededed',res.result.data)
this.setData({
list:res.result.data
})
}
})
// db.collection("zuowei").get()
// .then(res=>{
// this.setData({
// list:res.data
// })
// })
// db.collection("zwjy").get()
// .then(res=>{
// this.setData({
// list1:res.data
// })
// })
db.collection("eara").get()
.then(res=>{
this.setData({
list2:res.data
})
})
db.collection("dxt").get()
.then(res=>{
this.setData({
list3:res.data
})
})
this.setData({
photo:'../../images/dt.jpg'
})
},
goyy(e){
console.log(e)
var id=e.currentTarget.id
db.collection("zuowei").doc(id).get()
.then(res=>{
this.setData({
zt:res.data.zt
})
if(this.data.zt==1){
wx.showToast({
icon:'error',
title: '不可预约',
})
}else{
wx.navigateTo({
url: '../my_yy_detail/my_yy_detail?id='+id,
})
}
})
},
previewImg: function (e) {
var current=e.currentTarget.dataset.src
console.log(current)
wx.previewImage({
current: current, // 当前显示图片的http链接
urls: [current]// 需要预览的图片http链接列表
})
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
this.onLoad()
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
}
})
3联系作者
vx code8896