miniprogram / ScienceCaptain · 提交

转到一个项目

作者 刘晓艳
提交 172bfb94c784cebad67d52aeb07186c55f49cebe 0 个父辈

科学队长合并

内嵌 并排对比
正在显示 130 个修改的文件 包含 6286 行增加 和 0 行删除
<?xml version="1.0" encoding="UTF-8"?>
<module type="WEB_MODULE" version="4">
<component name="NewModuleRootManager">
<content url="file://$MODULE_DIR$">
<excludeFolder url="file://$MODULE_DIR$/.tmp" />
<excludeFolder url="file://$MODULE_DIR$/temp" />
<excludeFolder url="file://$MODULE_DIR$/tmp" />
</content>
<orderEntry type="inheritedJdk" />
<orderEntry type="sourceFolder" forTests="false" />
</component>
</module>
\ No newline at end of file
... ...
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="JavaScriptSettings">
<option name="languageLevel" value="ES6" />
</component>
</project>
\ No newline at end of file
... ...
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ProjectModuleManager">
<modules>
<module fileurl="file://$PROJECT_DIR$/.idea/ScienceCaptain.iml" filepath="$PROJECT_DIR$/.idea/ScienceCaptain.iml" />
</modules>
</component>
</project>
\ No newline at end of file
... ...
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="VcsDirectoryMappings">
<mapping directory="$PROJECT_DIR$" vcs="Git" />
</component>
</project>
\ No newline at end of file
... ...
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="ChangeListManager">
<list default="true" id="632eecf6-91e3-4185-aea4-06d243e51935" name="Default" comment="commit" />
<ignored path="$PROJECT_DIR$/.tmp/" />
<ignored path="$PROJECT_DIR$/temp/" />
<ignored path="$PROJECT_DIR$/tmp/" />
<option name="EXCLUDED_CONVERTED_TO_IGNORED" value="true" />
<option name="TRACKING_ENABLED" value="true" />
<option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" />
<option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" />
<option name="LAST_RESOLUTION" value="IGNORE" />
</component>
<component name="FileEditorManager">
<leaf>
<file leaf-file-name="app.json" pinned="false" current-in-tab="true">
<entry file="file://$PROJECT_DIR$/app.json">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="270">
<caret line="19" column="36" lean-forward="true" selection-start-line="19" selection-start-column="36" selection-end-line="19" selection-end-column="36" />
</state>
</provider>
</entry>
</file>
<file leaf-file-name="myProfile.wxml" pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/pages/my/myProfile/myProfile.wxml">
<provider selected="true" editor-type-id="text-editor" />
</entry>
</file>
<file leaf-file-name="all-appointment.json" pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/pages/my/all-appointment/all-appointment.json">
<provider selected="true" editor-type-id="text-editor" />
</entry>
</file>
<file leaf-file-name="all-appointment.wxml" pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/pages/my/all-appointment/all-appointment.wxml">
<provider selected="true" editor-type-id="text-editor" />
</entry>
</file>
<file leaf-file-name="protocol.wxml" pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/pages/my/protocol/protocol.wxml">
<provider selected="true" editor-type-id="text-editor" />
</entry>
</file>
<file leaf-file-name="protocol.js" pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/pages/my/protocol/protocol.js">
<provider selected="true" editor-type-id="text-editor" />
</entry>
</file>
<file leaf-file-name="myCard.wxml" pinned="false" current-in-tab="false">
<entry file="file://$PROJECT_DIR$/pages/my/myCard/myCard.wxml">
<provider selected="true" editor-type-id="text-editor" />
</entry>
</file>
</leaf>
</component>
<component name="Git.Settings">
<option name="RECENT_GIT_ROOT_PATH" value="$PROJECT_DIR$" />
</component>
<component name="JsBuildToolGruntFileManager" detection-done="true" sorting="DEFINITION_ORDER" />
<component name="JsBuildToolPackageJson" detection-done="true" sorting="DEFINITION_ORDER" />
<component name="JsGulpfileManager">
<detection-done>true</detection-done>
<sorting>DEFINITION_ORDER</sorting>
</component>
<component name="NodePackageJsonFileManager">
<packageJsonPaths />
</component>
<component name="ProjectFrameBounds" extendedState="6">
<option name="x" value="339" />
<option name="y" value="30" />
<option name="width" value="1936" />
<option name="height" value="1047" />
</component>
<component name="ProjectView">
<navigator proportions="" version="1">
<foldersAlwaysOnTop value="true" />
</navigator>
<panes>
<pane id="Scope" />
<pane id="ProjectPane">
<subPane>
<expand>
<path>
<item name="ScienceCaptain" type="b2602c69:ProjectViewProjectNode" />
<item name="ScienceCaptain" type="462c0819:PsiDirectoryNode" />
</path>
<path>
<item name="ScienceCaptain" type="b2602c69:ProjectViewProjectNode" />
<item name="ScienceCaptain" type="462c0819:PsiDirectoryNode" />
<item name="pages" type="462c0819:PsiDirectoryNode" />
</path>
</expand>
<select />
</subPane>
</pane>
</panes>
</component>
<component name="PropertiesComponent">
<property name="WebServerToolWindowFactoryState" value="false" />
<property name="last_opened_file_path" value="D:/git_folder" />
<property name="nodejs_interpreter_path.stuck_in_default_project" value="undefined stuck path" />
<property name="nodejs_npm_path_reset_for_default_project" value="true" />
</component>
<component name="RunDashboard">
<option name="ruleStates">
<list>
<RuleState>
<option name="name" value="ConfigurationTypeDashboardGroupingRule" />
</RuleState>
<RuleState>
<option name="name" value="StatusDashboardGroupingRule" />
</RuleState>
</list>
</option>
</component>
<component name="SvnConfiguration">
<configuration />
</component>
<component name="TaskManager">
<task active="true" id="Default" summary="Default task">
<changelist id="632eecf6-91e3-4185-aea4-06d243e51935" name="Default" comment="" />
<created>1542334789245</created>
<option name="number" value="Default" />
<option name="presentableId" value="Default" />
<updated>1542334789245</updated>
<workItem from="1542334792985" duration="236000" />
</task>
<servers />
</component>
<component name="TimeTrackingManager">
<option name="totallyTimeSpent" value="236000" />
</component>
<component name="ToolWindowManager">
<frame x="-8" y="-8" width="1936" height="1056" extended-state="6" />
<layout>
<window_info active="true" content_ui="combo" id="Project" order="0" visible="true" weight="0.24973656" />
<window_info anchor="bottom" id="TODO" order="6" />
<window_info anchor="bottom" id="Docker" show_stripe_button="false" />
<window_info anchor="bottom" id="Event Log" side_tool="true" />
<window_info anchor="bottom" id="Version Control" visible="true" weight="0.3293348" />
<window_info anchor="bottom" id="Run" order="2" />
<window_info id="Structure" order="1" side_tool="true" weight="0.25" />
<window_info anchor="bottom" id="Terminal" />
<window_info id="Favorites" side_tool="true" />
<window_info anchor="bottom" id="Debug" order="3" weight="0.4" />
<window_info anchor="bottom" id="Find" order="1" />
<window_info anchor="right" id="Commander" internal_type="SLIDING" order="0" type="SLIDING" weight="0.4" />
<window_info anchor="right" id="Ant Build" order="1" weight="0.25" />
<window_info anchor="bottom" id="Inspection" order="5" weight="0.4" />
<window_info anchor="right" content_ui="combo" id="Hierarchy" order="2" weight="0.25" />
<window_info anchor="bottom" id="Message" order="0" />
<window_info anchor="bottom" id="Cvs" order="4" weight="0.25" />
</layout>
</component>
<component name="TypeScriptGeneratedFilesManager">
<option name="version" value="1" />
</component>
<component name="Vcs.Log.Tabs.Properties">
<option name="TAB_STATES">
<map>
<entry key="MAIN">
<value>
<State>
<option name="RECENTLY_FILTERED_USER_GROUPS">
<collection />
</option>
<option name="RECENTLY_FILTERED_BRANCH_GROUPS">
<collection />
</option>
<option name="COLUMN_ORDER">
<list>
<option value="0" />
<option value="1" />
<option value="2" />
<option value="3" />
</list>
</option>
</State>
</value>
</entry>
</map>
</option>
</component>
<component name="VcsContentAnnotationSettings">
<option name="myLimit" value="2678400000" />
</component>
<component name="editorHistoryManager">
<entry file="file://$PROJECT_DIR$/pages/my/protocol/protocol.wxml">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/pages/my/protocol/protocol.js">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/pages/my/myCard/myCard.wxml">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/pages/my/all-appointment/all-appointment.json">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/pages/my/all-appointment/all-appointment.wxml">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/pages/myProfile/myProfile.json">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/pages/myProfile/myProfile.wxml">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="27">
<caret line="1" column="1" selection-start-line="1" selection-start-column="1" selection-end-line="1" selection-end-column="43" />
</state>
</provider>
</entry>
<entry file="file://$PROJECT_DIR$/pages/myProfile/myProfile.wxss">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/pages/my/myProfile/myProfile.wxml">
<provider selected="true" editor-type-id="text-editor" />
</entry>
<entry file="file://$PROJECT_DIR$/app.json">
<provider selected="true" editor-type-id="text-editor">
<state relative-caret-position="270">
<caret line="19" column="36" lean-forward="true" selection-start-line="19" selection-start-column="36" selection-end-line="19" selection-end-column="36" />
</state>
</provider>
</entry>
</component>
</project>
\ No newline at end of file
... ...
//app.js
// import md5 from 'utils/md5.js';
App({
onLaunch: function () {
// 展示本地存储能力
var logs = wx.getStorageSync('logs') || []
logs.unshift(Date.now())
wx.setStorageSync('logs', logs)
// 登录
// wx.login({
// success: res => {
// // 发送 res.code 到后台换取 openId, sessionKey, unionId
// }
// })
// 获取用户信息
// wx.getSetting({
// success: res => {
// if (res.authSetting['scope.userInfo']) {
// // 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框
// wx.getUserInfo({
// success: res => {
// // 可以将 res 发送给后台解码出 unionId
// this.globalData.userInfo = res.userInfo
// // 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
// // 所以此处加入 callback 以防止这种情况
// if (this.userInfoReadyCallback) {
// this.userInfoReadyCallback(res)
// }
// }
// })
// }
// }
// })
},
post: function (url,data,headerParams) {
/**
* 自定义post函数，返回Promise
* +-------------------
* @param {String} url 接口网址
* @param {arrayObject} data 要传的数组对象 like: {name: 'name', age: 32}
* +-------------------
* @return {Promise} promise 返回promise供后续操作
*/
// wx.showLoading({
// title: '加载中',
// })
wx.showNavigationBarLoading()
// wx.showToast({
// title: '加载中',
// icon:'none',
// })
var promise = new Promise((resolve, reject) => {
//init
let that = this;
let postData = data;
let baseUrl = 'http://informationxcx.w.bronet.cn/api';
//网络请求
let header = {
'content-type': 'application/x-www-form-urlencoded'
}
header = Object.assign(header, headerParams)
wx.request({
url: baseUrl + url,
data: postData,
method: 'POST',
header: header,
success: function (res) {//返回取得的数据
if (res.data.code == '20000') {
resolve(res.data.data);
} else if (res.data.code == '40001') {//返回错误提示信息
wx.showModal({
title: '提示',
content: '登录已过期请重新登录！',
showCancel: false,
success: function (res) {
if (res.confirm) {
wx.removeStorageSync('token');
wx.navigateTo({
url: '/pages/start/start',
})
}
}
})
} else if (res.data.code == '40000') {
wx.showModal({
title: '提示',
content: res.data.msg,
showCancel: false,
success: function (res) { }
})
} else {
wx.showModal({
title: '提示',
content: res.data.msg,
showCancel: false,
})
reject(res.data)
}
setTimeout(function () {
// wx.hideLoading()
// wx.hideToast()
wx.hideNavigationBarLoading()
}, 500)
},
error: function (e) {
reject('网络出错');
// wx.hideLoading()
wx.hideNavigationBarLoading()
}
})
});
return promise;
},
formCollect(id){
let url = '/sign/formid'
let params = {
formid: id,
openid: wx.getStorageSync('openId')
}
this.post(url,params).then((res)=>{
console.log(res)
}).catch((errMsg)=>{
})
},
nowDate() {
let date = new Date();
let month = date.getMonth() + 1;
let day = date.getDate();
let hours = date.getHours();
let minutes = date.getMinutes();
let Y = date.getFullYear() + '/' + (month > 9 ? month : ('0' + month)) + '/' + (day > 9 ? day : ('0' + day));
let H = (hours>9?hours:('0'+hours)) + ':' +(minutes>9?minutes:('0'+minutes));
let time = [];
time.push(Y,H);
let new_time = time.join(' ');
return new_time;
},
initDate(a){
let date1 = new Date();
let time1 = date1.getFullYear() + "-" + (date1.getMonth() + 1) + "-" + date1.getDate();
let date2 = new Date(date1);
date2.setDate(date1.getDate() + a);
let time2 = date2.getFullYear() + "-" + (date2.getMonth() + 1) + "-" + date2.getDate();
return time2;
},
// 数组移除指定元素
arryRemove(arr, item){
return arr.filter(function (ele) {
return ele != item;
})
},
strTime(strtime){
let str = 'bronet' + strtime + 'beijing'
return md5(md5(str))
},
globalData: {
userInfo: null,
baseUrl:'https://beijing.wx.broteam.cn'
}
})
\ No newline at end of file
... ...
{
"pages": [
"pages/index/index",
"pages/index/confirm-appointment-info/confirm-appointment-info",
"pages/index/phone-code/phone-code",
"pages/index/activity-detail/activity-detail",
"pages/index/go-appointment/go-appointment",
"pages/index/confirm-appointment-info/add-student/add-student",
"pages/my/myProfile/myProfile",
"pages/my/serviceWeChat/serviceWeChat",
"pages/my/chargePhoneNum/chargePhoneNum",
"pages/my/myCard/myCard",
"pages/my/groupBuyDetail/groupBuyDetail",
"pages/my/buyCard/buyCard",
"pages/my/protocol/protocol",
"pages/my/groupBupShare/groupBupShare",
"pages/my/charge/charge",
"pages/my/groupBuy/groupBuy",
"pages/my/appointmentRecord/appointmentRecord",
"pages/my/cardIntroduction/cardIntroduction",
"pages/my/all-appointment/all-appointment",
"pages/my/my",
"pages/clock/punchAppealDetail2/punchAppealDetail2",
"pages/clock/punchAppealDetail/punchAppealDetail",
"pages/clock/punchAppeal/punchAppeal",
"pages/clock/clock",
"pages/start/start"
],
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "#3FA9F5",
"navigationBarTitleText": "科学队长实验室",
"navigationBarTextStyle": "white"
},
"tabBar": {
"color": "#6F6F6F",
"selectedColor": "#5AB7F9",
"borderStyle": "black",
"backgroundColor": "#fff",
"list": [
{
"pagePath": "pages/index/index",
"text": "首页",
"iconPath": "/images/home0.png",
"selectedIconPath": "/images/home1.png"
},
{
"pagePath": "pages/clock/clock",
"text": "打卡",
"iconPath": "/images/clock0.png",
"selectedIconPath": "/images/clock1.png"
},
{
"pagePath": "pages/my/my",
"text": "我的",
"iconPath": "/images/my0.png",
"selectedIconPath": "/images/my1.png"
}
]
}
}
\ No newline at end of file
... ...
@font-face {
font-family: 'iconfont'; /* project id 912375 */
src: url('//at.alicdn.com/t/font_912375_canfpux7i3.eot');
src: url('//at.alicdn.com/t/font_912375_canfpux7i3.eot?#iefix') format('embedded-opentype'),
url('//at.alicdn.com/t/font_912375_canfpux7i3.woff') format('woff'),
url('//at.alicdn.com/t/font_912375_canfpux7i3.ttf') format('truetype'),
url('//at.alicdn.com/t/font_912375_canfpux7i3.svg#iconfont') format('svg');
}
.iconfont {
font-family:"iconfont" !important;
font-size:16px;
font-style:normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-dianji:before { content: "\e600"; }
.icon-dingwei:before { content: "\e7c4"; }
.icon-jinggao:before { content: "\e605"; }
.icon-yuan-copy-copy-copy-copy:before { content: "\e618"; }
.icon-shouye:before { content: "\e6a5"; }
.icon-quxiao:before { content: "\e60f"; }
.icon-daosanjiao:before { content: "\e610"; }
.icon-jia:before { content: "\e79f"; }
.icon-zhongdian:before { content: "\e601"; }
.icon-fenxiang:before { content: "\e696"; }
.icon-shangwutubiao-:before { content: "\e644"; }
.icon-xuanzhong:before { content: "\e604"; }
.icon-jieshu:before { content: "\e602"; }
.icon-fanhui:before { content: "\e619"; }
.icon-bianji2:before { content: "\e656"; }
.icon-dui:before { content: "\e648"; }
.icon-wode:before { content: "\e67b"; }
... ...
// pages/clock/clock.js
Page({
/**
* 页面的初始数据
*/
data: {
},
//打卡申诉
punchApply(){
wx.navigateTo({
url: 'punchAppeal/punchAppeal',
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "打卡"
}
\ No newline at end of file
... ...
<!--pages/clock/clock.wxml-->
<view class='content_box'>
<view class='circle_large'>
<view class='circle_middle'>
<view class='circle_small'>
<text wx:if='{{}}'>一键打卡</text>
<text class='iconfont icon-dui'></text>
</view>
</view>
</view>
<view class='punch_info'>当前：未获取</view>
<view class='punch_btn' bindtap='punchApply'>打卡申诉</view>
</view>
\ No newline at end of file
... ...
/* pages/clock/clock.wxss */
.content_box {
width: 100%;
height: 100%;
position: fixed;
left: 0;
top: 0;
background: #3899e5;
display: flex;
/* justify-content: center; */
flex-direction: column;
align-items: center;
padding-top: 115rpx;
}
.circle_large, .circle_middle, .circle_small {
width: 327rpx;
height: 327rpx;
background: rgba(255, 255, 255, 0.3);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
.circle_middle {
width: 286rpx;
height: 286rpx;
}
.circle_small {
width: 251rpx;
height: 251rpx;
font-size: 36rpx;
background: #fff;
color: #fc5b63;
padding: 80rpx;
box-sizing: border-box;
}
.icon-dui{
font-size: 90rpx;
}
.punch_info{
font-size: 32rpx;
color: #FFFFFF;
margin-top: 60rpx;
}
.punch_btn {
width: 200rpx;
height: 80rpx;
background: rgba(63, 169, 245, 1);
border-radius: 10rpx;
font-size: 36rpx;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
position: fixed;
bottom: 70rpx;
left: 50%;
transform: translateX(-50%);
}
... ...
// pages/punchAppeal/punchAppeal.js
Page({
/**
* 页面的初始数据
*/
data: {
current: 0,
maxlength: 100,
minlength: 0,
currentnum: 0
},
//tab切换
tabCharge(e) {
var index = e.currentTarget.dataset.current
var current = this.data.current
if (index == current) {
return false
} else {
this.setData({
current: index
})
}
},
//申诉内容获取
appealContent(e) {
var textcontent = e.detail.value
var len = e.detail.cursor
var maxlength = this.data.maxlength
var minlength = this.data.minlength
if (len > maxlength) {
wx.showToast({
title: '超出最大限制',
icon: 'none'
})
return
} else {
this.setData({
currentnum: len
})
}
},
//上传图片
uploadImg() {
wx.chooseImage({
success: function(res) {
console.log(res)
const tempFilePaths = res.tempFilePaths
wx.uploadFile({
url: '',
filePath: 'tempFilePaths[0]',
name: 'file',
})
},
})
},
//跳转申诉详情页
listDetail(){
wx.navigateTo({
url:'../punchAppealDetail/punchAppealDetail',
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function() {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "打卡申诉"
}
\ No newline at end of file
... ...
<!--pages/punchAppeal/punchAppeal.wxml-->
<view class='tab_box'>
<view class="tab_item {{current==0?'tab_active':''}}" data-current='0' bindtap='tabCharge'>我要申诉</view>
<view class="tab_item {{current==1?'tab_active':''}}" data-current='1' bindtap='tabCharge'>审核中</view>
<view class="tab_item {{current==2?'tab_active':''}}" data-current='2' bindtap='tabCharge'>已通过</view>
<view class="tab_item {{current==3?'tab_active':''}}" data-current='3' bindtap='tabCharge'>未通过</view>
</view>
<block wx:if='{{current==0}}'>
<view class='content_box'>
<view class='item_list'>
<view class='list_title_info'>
<view class='iconfont icon-zhongdian'> </view>
<view>
<view>如果因为环境网络问题或者其他原因导致无法打卡，请上传照 片及文字申诉内容，证明您已到场并已经参与活动。
</view>
<view class='hint_info'>注：最多可上传3张照片</view>
</view>
</view>
<view class='uoload_box'>
<view class='upload_item' bindtap='uploadImg'>
<text class='iconfont icon-jia'></text>
</view>
<view class='upload_item'>
<text class='iconfont icon-jia'></text>
</view>
<view class='upload_item'>
<text class='iconfont icon-jia'></text>
</view>
</view>
</view>
<view class='item_list'>
<view class='list_title'>申诉内容</view>
<view class='list_input'>
<textarea placeholder='请输入您的申诉内容...' bindinput='appealContent' placeholder-style='color:#C3C3C3'>
</textarea>
<view class='word_num'>{{currentnum}}/{{maxlength}}</view>
</view>
<view class='appeal_info'>
<text class='iconfont icon-yuan-copy-copy-copy-copy'></text>
<text>当前：xxx实验室</text>
</view>
<view class='null_box'></view>
<view class='submit_btn'>提 交</view>
</view>
</view>
</block>
<block wx:elif='{{current==1}}'>
<view class='review_box'>
<view class='review_item' bindtap='listDetail'>
<view>提交时间：2018.10.21</view>
<view class='review_content_box'>
<view class='review_img'>
<image src='../../../images/img1.png'></image>
</view>
<view class='review_content'>
<view class='review_info'>卡上规范咖喱饭咖喱发放啦发货；阿 富汗阿里发布啦 —— 爱因斯坦卡上规范咖喱饭咖喱发放啦发货；阿 富汗阿里发布啦 —— 爱因斯坦卡上规范咖喱饭咖喱发放啦发货；阿 富汗阿里发布啦 —— 爱因斯坦</view>
<view class='review_btn'>
<view class='cancle_btn'>取消申诉</view>
<view class='review_state'>审核中</view>
</view>
</view>
</view>
</view>
</view>
</block>
<block wx:elif='{{current==2}}'>
<view class='review_box'>
<view class='review_item' bindtap='listDetail'>
<view>提交时间：2018.10.21</view>
<view class='review_content_box'>
<view class='review_img'>
<image src='../../../images/img1.png'></image>
</view>
<view class='review_content'>
<view class='review_info'>卡上规范咖喱饭咖喱发放啦发货；阿 富汗阿里发布啦 —— 爱因斯坦卡上规范咖喱饭咖喱发放啦发货；阿 富汗阿里发布啦 —— 爱因斯坦卡上规范咖喱饭咖喱发放啦发货；阿 富汗阿里发布啦 —— 爱因斯坦</view>
<view class='review_btn'>
<view class='cancle_btn' style='border:1rpx solid #fff'></view>
<view class='review_state'>
<text class='iconfont icon-dui'></text> 已通过
</view>
</view>
</view>
</view>
</view>
</view>
</block>
<block wx:elif='{{current==3}}'>
<view class='review_box'>
<view class='review_item' bindtap='listDetail'>
<view>提交时间：2018.10.21</view>
<view class='review_content_box'>
<view class='review_img'>
<image src='../../../images/img1.png'></image>
</view>
<view class='review_content'>
<view class='review_info'>卡上规范咖喱饭咖喱发放啦发货；阿 富汗阿里发布啦 —— 爱因斯坦卡上规范咖喱饭咖喱发放啦发货；阿 富汗阿里发布啦 —— 爱因斯坦卡上规范咖喱饭咖喱发放啦发货；阿 富汗阿里发布啦 —— 爱因斯坦</view>
<view class='review_btn'>
<view class='cancle_btn view_btn'>查看原因</view>
<view class='review_state state3'>未通过</view>
</view>
</view>
</view>
</view>
</view>
</block>
\ No newline at end of file
... ...
/* pages/punchAppeal/punchAppeal.wxss */
page {
background: #f5f5f5;
}
.tab_box {
width: 100%;
height: 100rpx;
background: #fff;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 22rpx;
font-size: 30rpx;
color: #464646;
text-align: center;
box-sizing: border-box;
border-bottom: 1rpx solid rgba(0, 0, 0, 0.08);
}
.tab_item {
width: 25%;
position: relative;
}
.tab_active {
color: #3fa9f5;
}
.tab_active::after {
content: '';
width: 100%;
height: 4rpx;
background: #3fa9f5;
position: absolute;
left: 0;
bottom: -30rpx;
}
.item_list {
padding: 20rpx;
background: #fff;
margin-bottom: 20rpx;
}
.list_input {
width: 100%;
min-height: 300rpx;
border: 1rpx solid #3fa9f5;
border-radius: 20rpx;
background: #f5f5fa;
margin-top: 30rpx;
position: relative;
}
.list_input textarea {
width: 100%;
font-size: 28rpx;
padding: 30rpx;
color: #6e6e6e;
}
.word_num {
position: absolute;
right: 30rpx;
bottom: 30rpx;
font-size: 28rpx;
color: #c3c3c3;
}
.list_title_info {
font-size: 24rpx;
color: #a3a3a3;
display: flex;
align-items: flex-start;
margin-top: 23rpx;
}
.hint_info {
color: #fc5b63;
margin-top: 26rpx;
}
.uoload_box {
margin-top: 50rpx;
padding: 0 10rpx;
display: flex;
align-items: center;
justify-content: space-between;
}
.upload_item {
width: 200rpx;
height: 200rpx;
border: 1rpx dashed #6f6f6f;
display: flex;
align-items: center;
justify-content: center;
}
.icon-jia {
font-size: 40rpx;
color: #a3a3a3;
}
.list_title {
position: relative;
padding-left: 24rpx;
font-size: 30rpx;
color: #393939;
}
.list_title::after {
content: "";
width: 6rpx;
height: 32rpx;
background: #3fa9f5;
border-radius: 40rpx;
position: absolute;
left: 0rpx;
top: 50%;
transform: translateY(-50%);
}
.icon-yuan-copy-copy-copy-copy {
font-size: 18rpx;
color: #fc5b63;
margin-right: 15rpx;
}
.appeal_info {
font-size: 30rpx;
color: #fc5b63;
margin-top: 50rpx;
}
.submit_btn {
width: 100%;
height: 98rpx;
background: #3fa9f5;
font-size: 36rpx;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
position: fixed;
bottom: 0;
left: 0;
}
.null_box {
width: 100%;
height: 110rpx;
}
/* 审核中 */
.review_box {
padding: 20rpx;
}
.review_item {
width: 100%;
background: #fff;
border-radius: 20rpx;
padding: 20rpx;
box-sizing: border-box;
margin-bottom: 20rpx;
font-size: 28rpx;
color: #393939;
}
.review_item:last-child {
margin-bottom: 0;
}
.review_img {
width: 200rpx;
height: 200rpx;
}
.review_img image {
width: 100%;
height: 100%;
}
.review_content_box {
display: flex;
align-items: center;
margin-top: 30rpx;
}
.review_content {
width: 65%;
margin-left: 20rpx;
}
.review_info {
color: #6f6f6f;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
.review_btn {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 43rpx;
}
.cancle_btn {
width: 150rpx;
height: 50rpx;
border: 1rpx solid #fc5b63;
border-radius: 20rpx;
text-align: center;
line-height: 50rpx;
color: #fc5b63;
}
.review_state {
font-size: 24rpx;
color: #fc5b63;
}
.view_btn{
color: #3FA9F5;
border: 1rpx solid #3FA9F5;
}
.state3{
color: #C3C3C3
}
.icon-dui{
color: #FC5B63;
}
... ...
// pages/punchAppealDetail/punchAppealDetail.js
Page({
/**
* 页面的初始数据
*/
data: {
},
//补充提交申诉
againSubmit(){
wx.navigateTo({
url: '../punchAppealDetail2/punchAppealDetail2',
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "申诉详情"
}
\ No newline at end of file
... ...
<!--pages/punchAppealDetail/punchAppealDetail.wxml-->
<view class='content_box'>
<view class='item_list'>
<view class='uoload_box'>
<view class='upload_item' bindtap='uploadImg'>
<text class='iconfont icon-jia'></text>
</view>
<view class='upload_item'>
<text class='iconfont icon-jia'></text>
</view>
<view class='upload_item'>
<text class='iconfont icon-jia'></text>
</view>
</view>
</view>
<view class='item_list'>
<view class='list_title'>申诉理由</view>
<view class='list_input'>
<view>朝阳区万寿路5号楼马兰大厦B座301念读书馆内朝阳区万寿路5号楼马兰大厦B座301念读书馆内朝阳</view>
<view class='word_num'>2018.10.10</view>
</view>
</view>
<view class='item_list'>
<view class='list_title'>未通过原因</view>
<view class='list_input'>
<view>朝阳区万寿路5号楼马兰大厦B座301念读书馆内朝阳区万寿路5号楼马兰大厦B座301念读书馆内朝阳</view>
<view class='word_num'>2018.10.10</view>
</view>
</view>
<view class='null_box'></view>
<view class='submit_btn' bindtap='againSubmit'>补充提交</view>
</view>
... ...
/* pages/punchAppealDetail/punchAppealDetail.wxss */
@import '../punchAppeal/punchAppeal.wxss';
.uoload_box {
margin-top: 0;
}
.list_input {
background: none;
border: none;
font-size: 28rpx;
color: #6F6F6F;
padding:0 20rpx;
box-sizing: border-box;
}
.word_num{
font-size: 28rpx;
color: #6F6F6F;
}
... ...
// pages/punchAppealDetail2/punchAppealDetail2.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "申诉详情"
}
\ No newline at end of file
... ...
<!--pages/punchAppealDetail/punchAppealDetail.wxml-->
<view class='content_box'>
<view class='item_list'>
<view class='uoload_box'>
<view class='upload_item' bindtap='uploadImg'>
<text class='iconfont icon-jia'></text>
</view>
<view class='upload_item'>
<text class='iconfont icon-jia'></text>
</view>
<view class='upload_item'>
<text class='iconfont icon-jia'></text>
</view>
</view>
</view>
<view class='item_list'>
<view class='list_title'>未通过原因</view>
<view class='list_input'>
<view>朝阳区万寿路5号楼马兰大厦B座301念读书馆内朝阳区万寿路5号楼马兰大厦B座301念读书馆内朝阳</view>
<view class='word_num'>2018.10.10</view>
</view>
<view class='appeal_info'>
<text class='iconfont icon-yuan-copy-copy-copy-copy'></text>
<text>当前：xxx实验室</text>
</view>
</view>
</view>
\ No newline at end of file
... ...
/* pages/punchAppealDetail2/punchAppealDetail2.wxss */
@import '../punchAppeal/punchAppeal.wxss';
page{
background: #fff;
}
.content_box{
background: #f5f5f5;
}
.uoload_box {
margin-top: 0;
}
.list_input {
background: none;
border: none;
font-size: 28rpx;
color: #6f6f6f;
padding: 0 20rpx;
box-sizing: border-box;
}
.word_num {
font-size: 28rpx;
color: #6f6f6f;
}
... ...
// pages/index/activity-detail/activity-detail.js
Page({
/**
* 页面的初始数据
*/
data: {
is_agree: true,
},
clickAgreeBtn() {
this.setData({is_agree: !this.data.is_agree});
console.log(this.data.is_agree);
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "活动详情"
}
\ No newline at end of file
... ...
<!--pages/index/activity-detail/activity-detail.wxml-->
<view class="content">
<view class="head">
<view class="img_box">
<image src="../../../images/test_img.jpg" class="activity_img"></image>
</view>
<view class="title">
<view class="line"></view>
<view class="test_detail">
<text>科学队长实验室：雷电的产生！</text>
<view class="describe">云和云摩擦碰撞发出的声音是雷声产生火花是闪电。</view>
</view>
</view>
</view>
<view class="jiexi">解析长图</view>
<view class="footer">
<view class="service" bindtap="clickAgreeBtn">
<view class="agree_box">
<view class="agree_btn" wx:if="{{is_agree}}"></view>
</view>
<text>服务协议</text>
</view>
<view class="order_btn">去预约</view>
</view>
</view>
\ No newline at end of file
... ...
/* pages/index/activity-detail/activity-detail.wxss */
.content {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.head {
width: 100%;
padding: 20rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
flex: 1;
}
.img_box {
width: 100%;
height: 400rpx;
}
.activity_img {
width: 100%;
height: 100%;
border-radius: 20rpx;
}
.title {
display: flex;
justify-content: flex-start;
align-items: flex-start;
margin-top: 24rpx;
position: relative;
}
.line {
width: 6rpx;
height: 32rpx;
background-color: #3FA9F5;
margin-right: 18rpx;
position: absolute;
top: 14rpx;
left: 0;
}
.test_detail {
margin-left: 24rpx;
}
.test_detail text {
color: #464646;
font-size: 32rpx;
}
.describe {
font-size: 24rpx;
}
.jiexi {
height: 800px;
}
.footer {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
position: fixed;
bottom: 0;
left: 0;
}
.service {
width: 100%;
height: 50rpx;
background-color: #FDEFB5;
font-size: 24rpx;
color: #FC5B63;
display: flex;
align-items: center;
}
.agree_box {
width: 24rpx;
height: 24rpx;
border: 1rpx solid #FC5B63;
margin-right: 18rpx;
margin-left: 20rpx;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
.agree_btn {
width: 16rpx;
height: 16rpx;
border-radius: 50%;
background-color: #FC5B63;
}
.order_btn {
width: 100%;
height: 98rpx;
line-height: 98rpx;
background-color: #3FA9F5;
color: #ffffff;
text-align: center;
font-size: 36RPX;
}
\ No newline at end of file
... ...
// pages/index/confirm-appointment-info/add-student/add-student.js
const date = new Date()
const years = []
const months = []
const days = []
for (let i = 1990; i <= date.getFullYear(); i++) {
years.push(i)
}
for (let i = 1 ; i <= 12; i++) {
months.push(i)
}
for (let i = 1 ; i <= 31; i++) {
days.push(i)
}
Page({
/**
* 页面的初始数据
*/
data: {
name: '',
sex: ['男','女'],
city: ['北京市','天津市','河北省'],
years: years,
year: date.getFullYear(),
months: months,
month: 2,
days: days,
day: 2,
value: [9999, 1, 1],
},
inputName(e) {
this.setData({name: e.detail.value});
},
//选择性别
sexPickerChange: function(e) {
console.log('picker发送选择改变，携带值为', e.detail.value)
this.setData({
sex_index: e.detail.value,
is_sex_change: true,
})
},
//选择生日
birthPickerChange: function(e) {
console.log('picker发送选择改变，携带值为', e.detail.value)
this.setData({
birth_date: e.detail.value,
is_birth_change: true,
})
// const val = e.detail.value;
// this.setData({
// year: this.data.years[val[0]],
// month: this.data.months[val[1]],
// day: this.data.days[val[2]]
// })
},
//选择城市
cityPickerChange: function(e) {
console.log('picker发送选择改变，携带值为', e.detail.value)
this.setData({
city_index: e.detail.value,
is_city_change: true,
})
},
//保存
clickSave() {
if(this.data.name === '') {
wx.showToast({
title: '请填写学员姓名',
icon: 'none'
})
}else {
wx.navigateBack({delta: 1})
}
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "添加学员"
}
\ No newline at end of file
... ...
<!--pages/index/confirm-appointment-info/add-student/add-student.wxml-->
<view class="content">
<view class="input-box">
<view class="name-box">
<text>姓 名：</text>
<input type="text" placeholder="张三" cursor="100" placeholder-class="placeholder-style"
value="{{name}}" bindinput="inputName"/>
</view>
<picker bindchange="sexPickerChange" value="{{sex_index}}" range="{{sex}}">
<view class="select-box">
<view class="select-picker">
<view class="sex">性 别：</view>
<view class="picker" wx:if="{{is_sex_change}}">
{{sex[sex_index]}}
</view>
<view wx:else>男</view>
</view>
<view class="iconfont icon-daosanjiao"></view>
</view>
</picker>
<picker bindchange="birthPickerChange" value="{{birth_date}}" mode="date">
<view class="select-box">
<view class="select-picker">
<view class="sex">生 日：</view>
<view class="picker" wx:if="{{is_birth_change}}">
{{birth_date}}
</view>
<view wx:else>2008-11-11</view>
</view>
<view class="iconfont icon-daosanjiao"></view>
</view>
</picker>
<picker bindchange="cityPickerChange" value="{{city_index}}" range="{{city}}">
<view class="select-box">
<view class="select-picker">
<view class="sex">城 市：</view>
<view class="picker" wx:if="{{is_city_change}}">
{{city[city_index]}}
</view>
<view wx:else>北京市</view>
</view>
<view class="iconfont icon-daosanjiao"></view>
</view>
</picker>
</view>
<view class="save-btn" bindtap="clickSave">
<view class="save-box">
<text>保 存</text>
</view>
</view>
</view>
\ No newline at end of file
... ...
/* pages/index/confirm-appointment-info/add-student/add-student.wxss */
.input-box {
width: 100%;
padding: 30rpx 32rpx 70rpx 32rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
}
.name-box {
width: 100%;
height: 88rpx;
display: flex;
align-items: center;
border-bottom: 1rpx solid #C3C3C3;
font-size: 32rpx;
color: #c3c3c3;
margin-bottom: 30rpx;
}
.name-box input {
padding: 20rpx 20rpx;
}
.placeholder-style {
color: #c3c3c3;
}
picker {
width: 100%;
height: 88rpx;
border-bottom: 1rpx solid #C3C3C3;
margin-bottom: 30rpx;
}
.select-box {
width: 100%;
line-height: 88rpx;
display: flex;
align-items: center;
justify-content: space-between;
color: #c3c3c3;
font-size: 32rpx;
}
.select-picker {
display: flex;
align-items: center;
}
.sex {
margin-right: 20rpx;
}
.icon-daosanjiao {
font-size: 26rpx;
color: #6F6F6F;
}
.save-btn {
width: 100%;
height: 80rpx;
text-align: center;
padding: 0 32rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.save-box text {
color: #ffffff;
font-size: 36rpx;
line-height: 80rpx;
}
.save-box {
width: 100%;
background-color: #3FA9F5;
border-radius: 10rpx;
}
\ No newline at end of file
... ...
// pages/index/confirm-appointment-info/confirm-appointment-info.js
Page({
/**
* 页面的初始数据
*/
data: {
show: false,
is_showModal: false,
is_showSuccessModal: false,
children: [{name:'张三',is_choose: true},
{name:'李思思', is_choose: false},
{name:'迪丽热巴-迪力木拉提',is_choose: false}],
is_choose: false,
},
chooseChildren(e) {
const current = e.currentTarget.dataset.index;
this.setData({
currentChild: current,
[`children[${current}].is_choose`]: !this.data.children[current].is_choose
})
},
submit() {
this.setData({is_showModal: true})
},
chooseNo(e) {
this.setData({currentBtn: e.currentTarget.dataset.index,is_showModal: false})
wx.switchTab({url: '/pages/index/index'})
},
chooseYes(e) {
this.setData({
currentBtn: e.currentTarget.dataset.index,
is_showModal: false,
is_showSuccessModal: true
})
},
modalConfirm() {
this.setData({is_showSuccessModal: false})
},
disableScroll() {},
addStudent() {
wx.navigateTo({url: './add-student/add-student'})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
const self = this;
setTimeout(function () {
self.setData({show: true})
},500)
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "确认预约信息"
}
\ No newline at end of file
... ...
<!--pages/index/confirm-appointment-info/confirm-appointment-info.wxml-->
<view class="content">
<view class="tips {{show?'active':''}}">
<!--<view>-->
<view class="iconfont icon-jinggao"></view>
<text>请在15分钟内确认预约，超时系统将自动取消！</text>
<!--</view>-->
</view>
<view class="time">
<view class="line"></view>
<text>预约时间 : </text>
<text class="date-time">2018年10月10号 10:00-11:30</text>
</view>
<view class="address">
<view class="time">
<view class="line"></view>
<text>预约地址 :</text>
</view>
<view class="address-detail">
<!--<text>-->
朝阳区万寿路5号楼马兰大厦B座301念读书馆内朝阳区读书馆内朝阳区万寿路5号楼马兰大厦B座301念读书万寿路5号楼马兰大厦B座301念读书
<!--</text>-->
</view>
</view>
<view class="phone-num">
<view class="line"></view>
<text>预约电话 :</text>
<text class="phone">188****8888</text>
</view>
<view class="children-name">
<view class="left-name">
<view class="line"></view>
<text>学员姓名</text>
</view>
<image src="../../../images/add_btn.png" bindtap="addStudent"></image>
</view>
<view class="name-box">
<view class="check-box" wx:for="{{children}}" wx:key="index" bindtap="chooseChildren"
data-index="{{index}}">
<view class="name {{item.is_choose?'change-color':''}}">{{item.name}}</view>
<image src="../../../images/choose_icon.png" wx:if="{{item.is_choose}}" class="check-icon"></image>
</view>
</view>
<view class="footer">
<view class="confirm_btn" bindtap="submit">
<text>确认预约</text>
</view>
</view>
<!--是否购买畅玩卡弹窗-->
<view class="modal_box" wx:if="{{is_showModal}}" catchtouchmove="disableScroll">
<view class="background"
bindtap="handleBackground"
wx:if="{{is_showModal}}"
catchtouchmove="disableScroll">
</view>
<view class="modalBackground Augly-bouncein">
<view class="modal">
<view class="tips-word">当前学员还没有购买/兑换畅玩卡，暂不能预约实验活动，是否马上购买/兑换？</view>
<view class="yes-no-btn">
<text bindtap="chooseNo" class="{{currentBtn == 0?'change-color':''}}" data-index="{{0}}">否</text>
<text bindtap="chooseYes" class="{{currentBtn == 1?'change-color':''}}" data-index="{{1}}">是</text>
</view>
</view>
</view>
</view>
<!--预约成功弹窗-->
<view class="modal_box" wx:if="{{is_showSuccessModal}}" catchtouchmove="disableScroll">
<view class="background"
bindtap="handleBackground"
wx:if="{{is_showSuccessModal}}"
catchtouchmove="disableScroll">
</view>
<view class="modalBackground Augly-bouncein">
<view class="success-modal">
<image src="../../../images/success.jpg"></image>
<view class="congratulations">恭喜您</view>
<view class="appointment-success">您已经预约成功!</view>
<view class="confirm-btn" bindtap="modalConfirm">确定</view>
</view>
</view>
</view>
</view>
\ No newline at end of file
... ...
/* pages/index/confirm-appointment-info/confirm-appointment-info.wxss */
page {
background-color: #f2f2f2;
}
.content {
width: 100%;
display: flex;
flex-direction: column;
}
.tips {
width: 100%;
height: 50rpx;
display: flex;
align-items: center;
justify-content: center;
line-height: 50rpx;
background-color: #FFFC5A63;
position: absolute;
top: -50rpx;
left: 0;
z-index: 3;
}
.active {
position: absolute;
top: 0rpx;
left: 0;
transition: top 1s;
}
.icon-jinggao {
font-size: 24rpx;
margin-right: 10rpx;
color: #FC5A63;
}
.tips text {
color: #FC5A63;
font-size: 24rpx;
}
.time, .phone-num, .children-name {
width: 100%;
height: 94rpx;
margin-top: 20rpx;
background-color: #fff;
display: flex;
align-items: center;
padding: 0 32rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.line {
width: 6rpx;
height: 32rpx;
background-color: #3FA9F5;
margin-right: 16rpx;
}
.time text, .phone-num text, .children-name text {
color: #464646;
font-size: 32rpx;
/*line-height: ;*/
}
.time .date-time, .phone-num .phone {
color:#A3A3A3;
margin-left: 26rpx;
}
.address {
width: 100%;
color: #A3A3A3;
font-size: 28rpx;
display: flex;
flex-direction: column;
align-items: center;
}
.address-detail {
padding: 0 40rpx 50rpx 50rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background: #ffffff;
}
.address-detail text {
overflow : hidden;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
.children-name {
justify-content: space-between;
}
.left-name {
display: flex;
align-items: center;
}
.children-name image{
width: 144rpx;
height: 34rpx;
}
.name-box {
width: 100%;
padding: 20rpx 40rpx 50rpx 50rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
color: #A3A3A3;
font-size: 28rpx;
background-color: #fff;
display: flex;
flex-direction: column;
}
.name-box view {
/*margin-bottom: 42rpx;*/
}
.check-box {
width: 50%;
display: flex;
justify-content: space-between;
margin-bottom: 42rpx;
}
.check-icon {
width: 30rpx;
height: 24rpx;
}
.footer {
width: 100%;
position: fixed;
bottom: 0;
left: 0;
}
.confirm_btn {
width: 100%;
height: 98rpx;
background-color: #3FA9F5;
text-align: center;
}
.confirm_btn text {
color: #ffffff;
line-height: 98rpx;
font-size: 36rpx;
}.modal_box {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 999;
}
.background {
width: 100%;
height: 100%;
background: rgba(0,0,0,0.3);
position: absolute;
top: 0;
left: 0;
z-index: 999;
}
.modalBackground {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 999;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
align-items: center;
justify-content: center;
color: #666666;
}
.modal {
width: 500rpx;
height: 260rpx;
/* height: 1100rpx; */
background: #ffffff;
border-radius: 10rpx;
box-sizing: border-box;
/*padding: 70rpx 0 0 0;*/
overflow: hidden;
position: relative;
}
.success-modal {
width: 400rpx;
height: 450rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background: #ffffff;
border-radius: 22rpx;
}
.success-modal image {
width: 236rpx;
height: 170rpx;
}
.congratulations {
font-size: 28rpx;
color: #3FA9F5;
margin-bottom: 14rpx;
}
.appointment-success {
font-size: 24rpx;
margin-bottom: 60rpx;
}
.confirm-btn {
width: 80%;
height: 54rpx;
line-height: 54rpx;
border-radius: 30rpx;
text-align: center;
color: #ffffff;
font-size: 30rpx;
background-color: #3FA9F5;
}
.tips-word {
font-size: 26rpx;
width: 100%;
padding: 30rpx 40rpx 30rpx 50rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
border-bottom: 1rpx solid #d3d3d3;
line-height: 38rpx;
}
.yes-no-btn {
width: 100%;
height: 84rpx;
display: flex;
align-items: center;
font-size: 30rpx;
}
.yes-no-btn text {
width: 50%;
text-align: center;
line-height: 68rpx;
}
.yes-no-btn text:nth-child(1) {
border-right: 1rpx solid #d3d3d3;
}
.change-color {
color: #3FA9F5;
}
\ No newline at end of file
... ...
// pages/index/go-appointment/go-appointment.js
Page({
/**
* 页面的初始数据
*/
data: {
array: ['北京市', '天津市', '上海市', '河北省'],
currentCity: '北京市',
is_change: false,
show_submit_btn: false,
areaTest: [
{area: '朝阳区', list: [{id: 1,name: '798实验室'},{id: 2,name:'木鱼湖实验室'},{id: 3,name:'南锣鼓巷实验室'}]},
{area: '东城区', list: [{id: 4,name: '798实验室'},{id: 5,name:'木鱼湖实验室'},{id: 6,name:'南锣鼓巷实验室'}]},
{area: '西城区', list: [{id: 7,name: '798实验室'},{id: 11,name:'木鱼湖实验室'},{id: 8,name:'南锣鼓巷实验室'}]},
{area: '昌平区', list: [{id: 9,name: '798实验室'},{id: 12,name:'木鱼湖实验室'},{id: 10,name:'南锣鼓巷实验室'}]},
],
test: {title: '798实验室,本实验室分为三个阶段，第一阶段由家长和孩子共同完成，第二阶段由孩子独立完成。家长在旁边指导，第三阶段巴拉巴拉',
list:[{week:'周六',date: '10月20日',time:'10:00 — 11:30',rest: 6},
{week:'周日',date: '10月21日',time:'15:00 — 16:30',rest: 0},
{week:'周日',date: '10月21日',time:'15:00 — 16:30',rest: 6},
{week:'周日',date: '10月21日',time:'15:00 — 16:30',rest: 0},
// {week:'周日',date: '10月21日',time:'15:00 — 16:30',rest: 6},
// {week:'周日',date: '10月21日',time:'15:00 — 16:30',rest: 6},
// {week:'周日',date: '10月21日',time:'15:00 — 16:30',rest: 6},
// {week:'周日',date: '10月21日',time:'15:00 — 16:30',rest: 6},
// {week:'周日',date: '10月21日',time:'15:00 — 16:30',rest: 6},
// {week:'周日',date: '10月21日',time:'15:00 — 16:30',rest: 6},
// {week:'周日',date: '10月21日',time:'15:00 — 16:30',rest: 6},
// {week:'周六',date: '10月20日',time:'10:00 — 11:30',rest: 6}
]},
},
//选择城市
bindPickerChange: function(e) {
console.log('picker发送选择改变，携带值为', e.detail.value)
this.setData({
index: e.detail.value,
is_change: true,
})
},
//选择实验室
chooseTest(e) {
console.log(e.currentTarget.dataset.index);
const current = e.currentTarget.dataset.index;
const current_id = e.currentTarget.dataset.id;
this.setData({currentTest: current,currentId: current_id})
},
//选择时段
chooseTime(e) {
console.log(e.currentTarget.dataset.index);
const current = e.currentTarget.dataset.index;
this.setData({currentTime: current})
},
//点击单人预约
singleAppointment() {
this.setData({show_submit_btn: true})
},
//点击双人预约
doubleAppointment() {
this.setData({show_submit_btn: true})
},
submit() {
wx.navigateTo({url: '/pages/index/confirm-appointment-info/confirm-appointment-info'})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
this.data.areaTest.forEach((v,i)=>{
Object.keys(v).forEach(v=>{
console.log(v)//取到了key
console.log(this.data.areaTest[i][v])//取到了值
})
})
// console.log(this.data.areaTest);
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "选择场次",
"disableScroll": true
}
\ No newline at end of file
... ...
<!--pages/index/go-appointment/go-appointment.wxml-->
<view class="content">
<view class="city_box">
<picker bindchange="bindPickerChange" value="{{index}}" range="{{array}}">
<view class="select">
<view class="picker" wx:if="{{is_change}}">
{{array[index]}}
</view>
<view wx:else>北京市</view>
<view class="iconfont icon-daosanjiao"></view>
</view>
</picker>
</view>
<view class="section">
<scroll-view class="area_box" scroll-y>
<block wx:for="{{areaTest}}" wx:key="index">
<view class="area-test">
<view class="area">{{item.area}}</view>
<view class="test-list">
<view class="list-item-box">
<block wx:for="{{item.list}}" wx:key="index">
<view class="list-item" bindtap="chooseTest" data-index="{{index}}"
data-id="{{item.id}}">
<image src="../../../images/blue_line.png" wx:if="{{currentId === item.id}}"
class="blue-line"></image>
<view class="test {{currentId === item.id?'change-color':''}}">{{item.name}}</view>
</view>
</block>
</view>
</view>
</view>
</block>
</scroll-view>
<view class="test_box">
<scroll-view scroll-y class="test_describe">
{{test.title}}
</scroll-view>
<scroll-view class="time-list-box" scroll-y>
<view wx:for="{{test.list}}" wx:key="index" class="time-list" bindtap="chooseTime" data-index="{{index}}">
<image src="../../../images/blue_line.png" wx:if="{{currentTime === index && item.rest !== 0}}"
class="blue-line"></image>
<view class="right-content {{item.rest === 0? 'change-gray':''}}">
<view class="{{currentTime === index && item.rest !== 0? 'change-color':''}}">{{item.week}} {{item.date}}</view>
<view class="bottom-time-box">
<text class="time {{currentTime === index && item.rest !== 0? 'change-color':''}}">{{item.time}}</text>
<text class="rest {{item.rest === 0? 'change-gray':''}}">剩余: {{item.rest}}</text>
</view>
</view>
</view>
</scroll-view>
</view>
</view>
<view class="footer">
<view class="confirm_btn" bindtap="submit" wx:if="{{show_submit_btn}}">
<text>提 交</text>
</view>
<view class="appointment-box" wx:else>
<text class="single" bindtap="singleAppointment">单人预约</text>
<text class="double" bindtap="doubleAppointment">双人预约</text>
</view>
<!--<view>提 交</view>-->
</view>
</view>
... ...
/* pages/index/go-appointment/go-appointment.wxss */
page {
background-color: #f2f2f2;
}
.city_box {
width: 100%;
/*display: flex;*/
/*align-items: center;*/
/*justify-content: center;*/
/* height: 98rpx; */
color: #393939;
font-size: 32rpx;
position: fixed;
top: 0;
left: 0;
background-color: #fff;
}
.select {
width: 100%;
height: 98rpx;
display: flex;
align-items: center;
justify-content: center;
}
picker {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.icon-daosanjiao {
font-size: 26rpx;
color: #6F6F6F;
margin-left: 24rpx;
}
.section {
margin-top: 118rpx;
display: flex;
}
.area_box {
width: 270rpx;
height: 900rpx;
background-color: #fff;
}
.area-test {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.area {
width: 100%;
height: 60rpx;
line-height: 60rpx;
background-color: #D5F0FF;
font-size: 32rpx;
color: #000000;
text-align: center;
}
.test-list {
width: 100%;
/* padding: 0 24rpx; */
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
/*.test-list .test:last-child{*/
/*border: none;*/
/*}*/
.list-item-box {
display: flex;
align-items: center;
padding:0 24rpx;
flex-direction: column;
}
.list-item {
width: 100%;
border-bottom: 1rpx solid #DEDEDE;
display: flex;
position: relative;
}
.list-item-box .list-item:last-child {
border: none;
}
.reduce-padding {
padding: 0 24rpx 0 0;
}
.list-item .blue-line {
width: 10rpx;
height: 100rpx;
margin-right: 12rpx;
position: absolute;
top:0;
left: -22rpx;
}
.test {
width: 100%;
height: 100rpx;
line-height: 100rpx;
color: #6F6F6F;
font-size: 28rpx;
/*border-bottom: 1rpx solid #DEDEDE;*/
}
.change-color {
color:#006BF1;
}
.test_box {
flex: 1;
margin-left: 20rpx;
}
.test_describe {
width: 100%;
height: 200rpx;
background-color: #fff;
margin-bottom: 20rpx;
padding: 38rpx 20rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
color: #6F6F6F;
font-size: 28rpx;
}
.time-list-box {
width: 100%;
margin-bottom: 10rpx;
height: 680rpx;
}
.time-list {
width: 100%;
height: 140rpx;
background-color: #fff;
margin-bottom: 10rpx;
padding: 30rpx 40rpx;
color: #6F6F6F;
font-size: 28rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: flex;
justify-content: space-between;
position: relative;
}
.time-list .blue-line {
width: 10rpx;
height: 100rpx;
margin-right: 12rpx;
position: absolute;
top: 20rpx;
left: 0rpx;
}
.right-content {
width: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.bottom-time-box {
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
}
.time {
font-size: 24rpx;
}
.rest {
font-size: 24rpx;
color: #FC5B63;
}
.change-gray {
color: #C3C3C3;
}
.confirm_box {
width: 100%;
padding: 0 32rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.confirm_btn {
width: 100%;
height: 98rpx;
background-color: #3FA9F5;
text-align: center;
}
.confirm_btn text {
color: #ffffff;
line-height: 98rpx;
font-size: 36rpx;
}
.appointment-box {
width: 100%;
height: 98rpx;
display: flex;
align-items: center;
color: #ffffff;
}
.appointment-box text {
width: 50%;
text-align: center;
font-size: 36rpx;
line-height: 98rpx;
}
.single {
background: -webkit-linear-gradient(left, RGBA(255, 179, 4, 1), RGBA(251, 150, 0, 1)); /* Safari 5.1 - 6.0 */
background: -o-linear-gradient(right, RGBA(255, 179, 4, 1), RGBA(251, 150, 0, 1)); /* Opera 11.1 - 12.0 */
background: -moz-linear-gradient(right, RGBA(255, 179, 4, 1), RGBA(251, 150, 0, 1)); /* Firefox 3.6 - 15 */
background: linear-gradient(to right, RGBA(255, 179, 4, 1), RGBA(251, 150, 0, 1)); /* 标准的语法 */
}
.double {
background: -webkit-linear-gradient(left, RGBA(252, 116, 0, 1), RGBA(255, 83, 2, 1)); /* Safari 5.1 - 6.0 */
background: -o-linear-gradient(right, RGBA(252, 116, 0, 1), RGBA(255, 83, 2, 1)); /* Opera 11.1 - 12.0 */
background: -moz-linear-gradient(right, RGBA(252, 116, 0, 1), RGBA(255, 83, 2, 1)); /* Firefox 3.6 - 15 */
background: linear-gradient(to right, RGBA(252, 116, 0, 1), RGBA(255, 83, 2, 1)); /* 标准的语法 */
}
.footer {
width: 100%;
position: fixed;
bottom: 0;
left: 0;
}
\ No newline at end of file
... ...
//index.js
//获取应用实例
const app = getApp()
Page({
data: {
hasPhone: true,
imgUrls:[
{'url': '../../images/banner.jpg'},
{'url': '../../images/banner.jpg'},
{'url': '../../images/banner.jpg'},],
autoplay: true, //是否自动轮播
interval: 2000, //间隔时间
duration: 500, //滑动时间
this_week_test_info: {
info: [
{time: '11月01号-11月07号',url: '../../images/test_img.jpg',},
{time: '11月08号-11月14号',url: '../../images/test_img.jpg'},
],
is_this_week: true,
ordered: false,
is_past: false,
},
past_test_info: {
info: [
{time: '10月01号-10月07号',url: '../../images/test_img.jpg',},
{time: '10月08号-10月14号',url: '../../images/test_img.jpg'},
{time: '10月15号-10月21号',url: '../../images/test_img.jpg'},
],
is_this_week: false,
ordered: false,
is_past: true,
},
},
swiperChange: function (e) { //切换轮播图
this.setData({
currentSwiper: e.detail.current
})
},
goPhoneCode() {
wx.navigateTo({url: '/pages/index/phone-code/phone-code'})
},
//点击购买畅玩卡
goBuyCard() {
wx.navigateTo({url: './activity-detail/activity-detail'})
},
//点击进入活动详情
goTestDetail(e) {
// console.log(e);
const current = e.currentTarget.dataset.index;
wx.navigateTo({url: './activity-detail/activity-detail'})
},
//前往预约
goAppointment (e) {
const current = e.currentTarget.dataset.index;
wx.navigateTo({url: './go-appointment/go-appointment'})
},
onLoad: function () {
if (app.globalData.userInfo) {
this.setData({
userInfo: app.globalData.userInfo,
hasUserInfo: true
})
} else if (this.data.canIUse){
// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
app.userInfoReadyCallback = res => {
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
} else {
// 在没有 open-type=getUserInfo 版本的兼容处理
wx.getUserInfo({
success: res => {
app.globalData.userInfo = res.userInfo
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
}
})
}
},
getUserInfo: function(e) {
console.log(e)
app.globalData.userInfo = e.detail.userInfo
this.setData({
userInfo: e.detail.userInfo,
hasUserInfo: true
})
}
})
... ...
{}
\ No newline at end of file
... ...
<!--index.wxml-->
<view class="container">
<!--蒙层-->
<view class="modal" wx:if="{{!hasPhone}}" bindtap="goPhoneCode"></view>
<!--轮播图-->
<view class="wrap">
<swiper autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}" circular="true"
bindchange="swiperChange">
<block wx:for="{{imgUrls}}" wx:key="index">
<swiper-item>
<navigator url="{{item.url}}" hover-class="navigator-hover">
<view class="index_top">
<image src="{{item.url}}" class="slide-image" mode="aspectFill"/>
</view>
</navigator>
</swiper-item>
</block>
</swiper>
<view class="dots">
<block wx:for="{{ imgUrls}}" wx:key>
<view class="dot{{index == currentSwiper ? ' active' : ''}}"></view>
</block>
</view>
</view>
<!--购买-->
<view class="btn-box" bindtap="goBuyCard">
<view class="buy-btn">
<text>点击图片可跳转到购买页</text>
</view>
</view>
<!--实验列表-->
<import src="/templates/templates.wxml" />
<view class="past_template">
<template is="experiment" data="{{...this_week_test_info}}"></template>
<template is="experiment" data="{{...past_test_info}}"></template>
</view>
</view>
... ...
/**index.wxss**/
@import "../../templates/templates.wxss";
page {
background-color: #f2f2f2;
}
.container {
position: relative;
}
.modal {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
background-color: #000000;
opacity: 0;
z-index: 10;
}
.wrap {
height: auto;
position: relative;
}
swiper {
display: block;
height: 450rpx;
}
/*用来包裹所有的小圆点 */
.dots {
width: 156rpx;
height: 36rpx;
display: flex;
flex-direction: row;
position: absolute;
left: 320rpx;
bottom: 20rpx;
z-index: 10;
}
/*未选中时的小圆点样式 */
.dot {
width: 16rpx;
height: 16rpx;
border-radius: 50%;
margin-right: 26rpx;
background-color: white;
opacity: 0.6;
}
/*选中以后的小圆点样式 */
.active {
width: 30rpx;
height: 16rpx;
border-radius: 8rpx;
opacity: 1;
}
.index_top {
width: 100%;
height: 450rpx;
overflow: hidden;
}
.index_top image {
width: 100%;
height: 100%;
}
.btn-box {
padding: 22rpx 20rpx;
box-sizing: border-box;
background: #f2f2f2;
}
.buy-btn {
width: 100%;
height: 150rpx;
/*padding: 22rpx 20rpx;*/
/*margin-top: 22rpx;*/
/*margin-bottom: 22rpx;*/
/*margin-left: 20rpx;*/
/*margin-right: 20rpx;*/
box-sizing: border-box;
background: #5AB7F9;
border-radius: 20rpx;
display: flex;
align-items: center;
justify-content: center;
}
.buy-btn text {
color: #ffffff;
font-size: 24rpx;
}
.experiment_box:nth-child(2) {
margin-bottom: 0;
}
\ No newline at end of file
... ...
// pages/index/phone-code/phone-code.js
var interval = null //倒计时函数
Page({
/**
* 页面的初始数据
*/
data: {
fun_id: 2,
time: '获取验证码', //倒计时
currentTime: 61
},
getCode: function (options) {
var that = this;
var currentTime = that.data.currentTime;
interval = setInterval(function () {
currentTime--;
that.setData({
time: currentTime + '秒'
})
if (currentTime <= 0) {
clearInterval(interval);
that.setData({
time: '重新发送',
currentTime: 61,
disabled: false
})
}
}, 1000)
},
getVerificationCode() {
this.getCode();
var that = this;
that.setData({
disabled: true
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "手机认证"
}
\ No newline at end of file
... ...
<!--pages/index/phone-code/phone-code.wxml-->
<view class="content_box">
<view class="img_box">
<image src="../../../images/logo.png"></image>
</view>
<view class="phone_box">
<input type="number" placeholder="请输入您的手机号" placeholder-class="placeholder" class="phone_num"/>
<view class="code_box">
<input type="number" placeholder="输入验证码" placeholder-class="placeholder"/>
<button class="button" disabled="{{disabled}}" data-id="2" bindtap="getVerificationCode" >
{{time}}
</button>
</view>
</view>
<view class="confirm_box">
<view class="confirm_btn">
<text>确 定</text>
</view>
</view>
</view>
... ...
/* pages/index/phone-code/phone-code.wxss */
page {
background-color: #fff;
}
.content_box {
display: flex;
flex-direction: column;
align-items: center;
}
.img_box {
width: 366rpx;
height: 366rpx;
margin-top: 106rpx;
}
.img_box image {
width: 100%;
height: 100%;
}
.phone_box {
width: 100%;
padding: 32rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.phone_box .phone_num {
border-bottom: 1rpx solid #C3C3C3;
margin-bottom: 42rpx;
height: 100rpx;
}
.placeholder {
color: #c3c3c3;
font-size: 32rpx;
}
.code_box {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 0;
border-bottom: 1rpx solid #C3C3C3;
height: 100rpx;
}
.button {
background-color: #fff;
display: inline-block;
font-size: 26rpx;
color: #3FA9F5;
/* border: 1px solid #888; */
border-radius: 10rpx;
width: 160rpx;
height: 70rpx;
line-height: 70rpx;
z-index: 2;
padding-right: 0;
padding-left: 0;
margin: 0;
}
.button:after {
border: none;
}
.confirm_box {
width: 100%;
padding: 0 32rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.confirm_btn {
width: 100%;
height: 80rpx;
background-color: #3FA9F5;
/* margin-top: 68rpx; */
margin: 68rpx 0;
/* padding: 32rpx; */
/*-webkit-box-sizing: border-box;*/
/*-moz-box-sizing: border-box;*/
/*box-sizing: border-box;*/
text-align: center;
border-radius: 10rpx;
}
.confirm_btn text {
color: #ffffff;
line-height: 80rpx;
font-size: 36rpx;
}
\ No newline at end of file
... ...
// pages/my/all-appointment/all-appointment.js
Page({
/**
* 页面的初始数据
*/
data: {
tab: ['全部', '待确认', '已预约', '已取消', '已结束'],
currentTab: 0,
},
changeTab(e) {
const current = e.currentTarget.dataset.index;
this.setData({currentTab: current});
wx.setNavigationBarTitle({
title: this.data.tab[current]
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "全部"
}
\ No newline at end of file
... ...
<!--pages/my/all-appointment/all-appointment.wxml-->
<view class="content">
<!--tab-->
<view class="tab-box">
<view wx:for="{{tab}}" wx:key="index" bindtap="changeTab" data-index="{{index}}"
class="{{currentTab == index?'change-color':''}}">{{item}}</view>
</view>
<!--预约列表-->
<view class="list-box">
<view class="order-box">
<view class="head">
<text class="number">预约单号：000120180208</text>
<text class="appointment-state" wx:if="{{currentTab === 1}}" style="color: #FC5B63;">待确认</text>
<text class="appointment-state" wx:if="{{currentTab === 2}}">已预约</text>
<text class="appointment-state" wx:if="{{currentTab === 3}}" style="color: #464646;">已取消</text>
<text class="appointment-state" wx:if="{{currentTab === 4}}" style="color: #C3C3C3;">已结束</text>
</view>
<view class="section">
<image src="../../../images/red_line.png" wx:if="{{currentTab === 1}}" class="blue-line"></image>
<image src="../../../images/blue_line.png" wx:if="{{currentTab === 2}}" class="blue-line"></image>
<image src="../../../images/deep_grey_line.png" wx:if="{{currentTab === 3}}" class="blue-line"></image>
<image src="../../../images/grey_line.png" wx:if="{{currentTab === 4}}" class="blue-line"></image>
<view class="right-box">
<view class="right-top-box">
<view class="iconfont icon-dingwei"></view>
<view class="address">北京市朝阳区万寿路马兰大厦B座北京市朝阳区万寿路马兰大厦B座</view>
</view>
<view class="right-bottom-box">
<view class="iconfont icon-shangwutubiao"></view>
<view class="date-box">
<view class="date">预约日期：2018.09.02 10:00-11:30</view>
<view class="not_confirm" wx:if="{{currentTab === 1}}">
<view class="go-cancel">取消</view>
<view class="go-confirm">去确认</view>
</view>
<view class="cancel" wx:if="{{currentTab === 2}}">取消</view>
<view class="iconfont icon-quxiao" wx:if="{{currentTab === 3}}"></view>
<view class="iconfont icon-jieshu" wx:if="{{currentTab === 4}}"></view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
\ No newline at end of file
... ...
/* pages/my/all-appointment/all-appointment.wxss */
page {
background-color: #f2f2f2;
}
.tab-box {
width: 100%;
height: 88rpx;
display: flex;
align-items: center;
justify-content: space-between;
color: #464646;
font-size: 30rpx;
padding: 0 40rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: #fff;
/*border-bottom: 4rpx solid #3FA9F5;*/
}
.tab-box view {
line-height: 80rpx;
/*position: relative;*/
}
.change-color {
color: #3FA9F5;
border-bottom: 4rpx solid #3FA9F5;
}
.list-box {
width: 100%;
padding: 22rpx 20rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.order-box {
/* height: 274rpx; */
border-radius: 20rpx;
background-color: #fff;
margin-bottom: 20rpx;
padding: 20rpx 22rpx 28rpx 34rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: flex;
flex-direction: column;
}
.head {
width: 100%;
height: 60rpx;
display: flex;
justify-content: space-between;
align-items: center;
color: #464646;
font-size: 28rpx;
border-bottom: 1rpx solid #f2f2f2;
}
.appointment-state {
color: #3FA9F5;
}
.section {
width: 100%;
display: flex;
position: relative;
}
.blue-line {
width: 12rpx;
height: 147rpx;
position: absolute;
top: 0;
left: 0;
}
.right-box {
margin-left: 20rpx;
padding-top: 16rpx;
}
.right-top-box, .right-bottom-box {
display: flex;
align-items: center;
}
.right-top-box {
align-items: baseline;
}
.right-bottom-box {
margin-top: 24rpx;
/* justify-content: space-between; */
}
.icon-dingwei, .icon-shangwutubiao {
color: #6E6E6E;
margin-right: 18rpx;
}
.icon-shangwutubiao {
/*margin-right: 0;*/
}
.address {
width: 82%;
color: #6E6E6E;
font-size: 26rpx;
line-height: 54rpx;
}
.date-box {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
}
.date {
color: #6E6E6E;
font-size: 26rpx;
/* margin-right: 20rpx; */
}
.cancel {
/*width: 130rpx;*/
/*height: 50rpx;*/
/*line-height: 50rpx;*/
padding: 0rpx 44rpx;
border-radius: 20rpx;
background-color: #3FA9F5;
color: #ffffff;
font-size: 28rpx;
line-height: 50rpx;
}
.icon-quxiao, .icon-jieshu {
color: #f2f2f2;
font-size: 126rpx;
position: absolute;
right: -34rpx;
bottom: -57rpx;
}
.not_confirm {
width: 130rpx;
position: absolute;
right: -8rpx;
bottom: -6rpx;
display: flex;
flex-direction: column;
align-items: center;
}
.go-cancel {
padding: 0rpx 30rpx;
border-radius: 20rpx;
background-color: #ffffff;
color: #FC5B63;
font-size: 28rpx;
border: 4rpx solid #FC5B63;
margin-bottom: 10rpx;
line-height: 42rpx;
}
.go-confirm {
padding: 0rpx 20rpx;
border-radius: 20rpx;
background-color: #FC5B63;
color: #ffffff;
font-size: 28rpx;
height: 50rpx;
line-height: 50rpx;
}
.reduce-margin {
margin-top: 16rpx;
}
\ No newline at end of file
... ...
// pages/appointmentRecord/appointmentRecord.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "预约记录"
}
\ No newline at end of file
... ...
<!--pages/appointmentRecord/appointmentRecord.wxml-->
<view class='content_box'>
<view class='item_list'>
<view class='list_tab'>
<view class='list_tab_item'>预约记录</view>
<view class='list_tab_item'>时间</view>
</view>
<view class='list_tab list_content' wx:for='{{[1,2,3]}}' wx:key=''>
<view class='list_tab_item'>活动报名</view>
<view class='list_tab_item'>2018.10.10</view>
</view>
</view>
</view>
\ No newline at end of file
... ...
/* pages/appointmentRecord/appointmentRecord.wxss */
/* 团购成交记录 */
.list_tab {
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
padding: 30rpx 0;
box-sizing: border-box;
text-align: center;
}
.list_tab_item {
width: 50%;
font-size: 28rpx;
color: #464646;
position: relative;
}
.list_label {
width: 180rpx;
height: 22rpx;
position: absolute;
bottom: -28rpx;
left: 50%;
transform: translateX(-50%);
background: rgba(252, 91, 99, 1);
border-radius: 10rpx;
font-size: 18rpx;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
}
.list_content {
border: 0;
padding: 15rpx 0;
}
.list_content .list_tab_item {
font-size: 24rpx;
color: #a3a3a3;
}
... ...
// pages/buyCard/buyCard.js
Page({
/**
* 页面的初始数据
*/
data: {
userlist: ['张三', '里斯'],
index: -1,
},
//选择成员
userList(e) {
this.setData({
index: e.detail.value
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "购买畅玩卡"
}
\ No newline at end of file
... ...
<!--pages/buyCard/buyCard.wxml-->
<view class='long_img'>这是一个可以滑动的长图</view>
<view class='service_box'>
<view class='add_person_box'>
<view class='list_input'>
<view>绑定学员：</view>
<picker value='{{index}}' range='{{userlist}}' bindchange='userList'>
<block wx:if='{{index==-1}}'>
<input placeholder='点击右侧添加学员' placeholder-class='input_style' disabled='true'></input>
</block>
<block wx:else>
<text>{{userlist[index]}}</text>
</block>
</picker>
<view class='iconfont icon-daosanjiao'></view>
</view>
<view class='add_box'>
<text class='iconfont icon-jia'></text>
<text>添加学员</text>
</view>
</view>
<view class='service_info_box'>
<text class='iconfont icon-xuanzhong'></text>
<text>我已阅读并同意畅玩卡</text>
<text class='service_info'>服务协议</text>
</view>
<view class='service_btn_box'>
<view>需支付：¥288.00</view>
<view class='pay_btn'>确定</view>
</view>
</view>
\ No newline at end of file
... ...
/* pages/buyCard/buyCard.wxss */
@import '../groupBuy/groupBuy.wxss';
@import '../charge/charge.wxss';
.add_person_box {
display: flex;
align-items: center;
justify-content: space-between;
padding: 20rpx;
background: #fff;
}
.service_btn_box{
font-size: 30rpx;
color: #6E6E6E;
}
... ...
// pages/cardIntroduction/cardIntroduction.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{}
\ No newline at end of file
... ...
<!--pages/cardIntroduction/cardIntroduction.wxml-->
<view class='content_box'>
这是一个可以滑动的长图
</view>
<view class='bottom_box'>
<view class='share_btn'>分享好友</view>
<view class='groupBuy_btn'>前往团购</view>
</view>
\ No newline at end of file
... ...
/* pages/cardIntroduction/cardIntroduction.wxss */
.content_box {
width: 100%;
height: 100%;
background: #e0e0e0;
font-size: 32rpx;
color: #000;
padding: 30rpx;
position: fixed;
top: 0;
left: 0;
text-align: center;
/* display: flex;
align-items: center;
justify-content: center;
overflow: scroll; */
}
.bottom_box {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
position: fixed;
bottom: 0;
left: 0;
}
.share_btn, .groupBuy_btn {
width: 50%;
height: 98rpx;
background: linear-gradient(-84deg, rgba(251, 150, 0, 1), rgba(255, 198, 4, 1));
display: flex;
align-items: center;
justify-content: center;
font-size: 36rpx;
color: #fff;
}
.groupBuy_btn {
background: linear-gradient(-78deg, rgba(255, 83, 2, 1), rgba(252, 116, 0, 1));
}
... ...
// pages/charge/charge.js
Page({
/**
* 页面的初始数据
*/
data: {
userlist: ['张三', '里斯'],
index: -1,
},
//选择成员
userList(e) {
this.setData({
index:e.detail.value
})
},
//兑换并绑定按钮
chargeBtn() {
wx.showModal({
title: '',
content: '绑定后无法更改，确定绑定张三吗？',
cancelText: '取消',
confirmText: '确认',
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function() {
}
})
\ No newline at end of file
... ...
{}
\ No newline at end of file
... ...
<!--pages/charge/charge.wxml-->
<view class='content_box'>
<view class='item_list_box'>
<view class='item_list'>
<view class='list_input'>
<view>兑换码：</view>
<input placeholder='请输入您的畅玩卡兑换码' placeholder-class='input_style'></input>
</view>
<view></view>
</view>
<view class='item_list'>
<view class='list_input'>
<view>绑定学员：</view>
<picker value='{{index}}' range='{{userlist}}' bindchange='userList'>
<block wx:if='{{index==-1}}'>
<input placeholder='点击右侧添加学员' placeholder-class='input_style' disabled='true'></input>
</block>
<block wx:else>
<text>{{userlist[index]}}</text>
</block>
</picker>
<view class='iconfont icon-daosanjiao'></view>
</view>
<view class='add_box'>
<text class='iconfont icon-jia'></text>
<text>添加学员</text>
</view>
</view>
</view>
</view>
<view class='service_box'>
<view class='service_info_box'>
<text>注：如果还未添加学员，点击添加学员添加吧！</text>
</view>
<view class='service_btn_box' bindtap='chargeBtn'>
兑换并绑定
</view>
</view>
\ No newline at end of file
... ...
/* pages/charge/charge.wxss */
page {
background: #f5f5fa;
}
.item_list_box {
padding: 0 30rpx;
background: #fff;
}
.item_list {
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
padding: 30rpx 0;
}
.item_list:last-child {
border: 0;
}
.list_input {
width: 80%;
display: flex;
align-items: center;
font-size: 32rpx;
color: #464646;
}
.list_input input {
font-size: 32rpx;
border: 0;
outline: none;
}
.list_input picker {
width: 65%;
}
.input_style {
color: #c3c3c3;
}
.icon-daosanjiao {
font-size: 20rpx;
color: #6f6f6f;
}
.icon-jia {
display: inline-block;
width: 34rpx;
height: 34rpx;
background: #3fa9f5;
border-radius: 10rpx;
color: #fff;
padding: 5rpx;
box-sizing: border-box;
margin-right: 8rpx;
}
.add_box {
font-size: 24rpx;
color: #3fa9f5;
text-align: center;
display: flex;
align-items: center;
}
.service_info_box {
width: 100%;
height: 50rpx;
background: #fdefb5;
font-size: 24rpx;
color: #fc5b63;
padding: 10rpx 20rpx;
box-sizing: border-box;
}
.service_box {
width: 100%;
position: fixed;
left: 0;
bottom: 0;
}
.service_btn_box {
width: 100%;
height: 98rpx;
font-size: 36rpx;
background: #3fa9f5;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
}
... ...
// pages/chargePhoneNum/chargePhoneNum.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{}
\ No newline at end of file
... ...
<!--pages/chargePhoneNum/chargePhoneNum.wxml-->
<view class='content_box'>
<view class='banner_box'>
<view class='head_img'>
<image src='../../images/head.png'></image>
</view>
<view>微信昵称</view>
</view>
<view class='list_box'>
<view class='item_list'>
<view class='info_box'>
<view>新手机号： </view>
<view class='list_input'>
<input placeholder='188****888' value=''></input>
</view>
</view>
</view>
<view class='item_list'>
<view class='info_box'>
<text>验证码： </text>
<view class='list_input'>
<input placeholder='输入验证码' value=''></input>
</view>
</view>
<button class='get_code'>获取验证码</button>
</view>
</view>
<view class='save_btn'>保 存</view>
</view>
\ No newline at end of file
... ...
/* pages/chargePhoneNum/chargePhoneNum.wxss */
.content_box {
padding: 0 20rpx;
}
.banner_box {
width: 100%;
height: 200rpx;
background: #3fa9f5;
border-radius: 10rpx;
margin-top: 46rpx;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
font-size: 28rpx;
color: #fff;
}
.head_img {
width: 157rpx;
height: 157rpx;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
margin-top: -30rpx;
margin-bottom: 10rpx;
}
.head_img image {
width: 100%;
height: 100%;
}
.item_list {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 32rpx;
color: #c3c3c3;
padding: 63rpx 0 25rpx 0;
border-bottom: 1rpx solid #C3C3C3;
}
.info_box{
width: 80%;
display: flex;
}
.get_code {
text-align: right!important;
font-size: 28rpx;
color: #3fa9f5 !important;
background: none;
padding: 0rpx !important;
line-height: normal!important;
}
.get_code::after {
border: 0;
}
.save_btn{
width: 100%;
height: 80rpx;
border-radius: 10rpx;
background: #3fa9f5;
text-align: center;
line-height: 80rpx;
color: #fff;
font-size: 36rpx;
margin-top: 100rpx;
}
\ No newline at end of file
... ...
// pages/groupBupShare/groupBupShare.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{}
\ No newline at end of file
... ...
<!--pages/groupBupShare/groupBupShare.wxml-->
<view class='content_box'>
<view class='list_label_box'>
<view class='group_num'>团购人数：最低
<text>3人</text>
</view>
<view class='group_time'>发布倒计时：
<text>3小时</text>
</view>
</view>
</view>
<view class='long_img'>这是一个可以滑动的长图</view>
<view class='service_box'>
<view class='service_info_box'>
<text class='iconfont icon-fenxiang'></text> 分享的文案，50汉字以内提示分享的文案，50汉字以内提示分 享的文案，50汉字以内
</view>
<view class='service_btn_box'>分享好友</view>
</view>
\ No newline at end of file
... ...
/* pages/groupBupShare/groupBupShare.wxss */
@import '../groupBuy/groupBuy.wxss';
.content_box{
padding: 0 20rpx;
}
.long_img{
width: 100%;
margin-top: 20rpx;
background: #E0E0E0;
font-size: 32rpx;
color: #000000;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
}
.service_btn_box{
background:linear-gradient(-78deg,rgba(255,83,2,1),rgba(252,116,0,1));
display: flex;
align-items: center;
justify-content: center;
font-size: 36rpx;
color: #FFFFFF;
}
\ No newline at end of file
... ...
// pages/groupBuy/groupBuy.js
Page({
/**
* 页面的初始数据
*/
data: {
current:0
},
//tab切换
tabCharge(e){
var index=e.currentTarget.dataset.current
var current=this.data.current
if(index==current){
return false
}else{
this.setData({
current:index
})
}
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "畅玩卡团购"
}
\ No newline at end of file
... ...
<!--pages/groupBuy/groupBuy.wxml-->
<view class='banner_img'>
<image src='../../../images/banner.jpg'></image>
</view>
<view class='title_box'>
<view class='title_content'>畅玩卡介绍</view>
</view>
<view class='tab_box'>
<view class="tab_item {{current==0?'tab_active':''}}" data-current='0' bindtap='tabCharge'>参与的组团</view>
<view class="tab_item {{current==1?'tab_active':''}}" data-current='1' bindtap='tabCharge'>团购成交记录</view>
<view class="tab_item {{current==2?'tab_active':''}}" data-current='2' bindtap='tabCharge'>发起团购</view>
</view>
<block wx:if='{{current==0}}'>
<view class='content_box'>
<view class='item_list' wx:for='{{[1,2,3]}}' wx:key=''>
<view class='list_title_box'>
<view>查看详情</view>
<view class='iconfont icon-fanhui'></view>
</view>
<view class='list_info_box'>
<view class='info_item'>
<view class='info_box'>
<image src='../../../images/start-logo.png'></image>
<view class='info_label'>发起人</view>
</view>
<view class='info_time'>
<view>2018.10.10</view>
<view> 00:00:00</view>
</view>
</view>
<view class='info_item'>
<view class='info_box'>
<image src='../../../images/start-logo.png'></image>
<view class='info_label'>发起人</view>
</view>
<view class='info_time'>
<view>2018.10.10</view>
<view> 00:00:00</view>
</view>
</view>
<view class='info_item'>
<view class='info_box'>
</view>
</view>
<view class='info_item'>
<view class='info_box'>
</view>
</view>
<view class='info_item'>
<view class='info_box'>
</view>
</view>
</view>
<view class='list_info'>成团人数：最低
<text>3</text>人，已参与：
<text>2</text> 人，快呼唤伙伴参与吧！</view>
<view class='list_info'>
<view class='list_info_item'>剩余
<text>00：02：00 </text> 结束</view>
</view>
<view>
<view class='user_info_box'>
<view class='user_info'>
<view class='info_box'>
<image src='../../../images/start-logo.png'></image>
<view class='info_label'>发起人</view>
</view>
<view>发起人姓名</view>
</view>
<view class='state_box'>
<view>2018.10.10 00:00:00开团</view>
<view class='info_state'>团购中</view>
</view>
</view>
</view>
</view>
</view>
<view class='null_box'></view>
<view class='bottom_box'>
<text class='iconfont icon-fenxiang'></text> 分享的文案，50汉字以内提示分享的文案，50汉字以内提示分 享的文案，50汉字以内
</view>
</block>
<block wx:elif='{{current==1}}'>
<view class='content_box'>
<view class='item_list'>
<view class='list_tab'>
<view class='list_tab_item'>日期</view>
<view class='list_tab_item'>兑换状态</view>
<view class='list_tab_item'>
<text>兑换码</text>
<view class='list_label'>长按兑换码即可复制</view>
</view>
</view>
<view class='list_tab list_content' wx:for='{{[1,2,3]}}' wx:key=''>
<view class='list_tab_item'>2018.10.10</view>
<view class='list_tab_item'>未兑换</view>
<view class='list_tab_item'>2059788797</view>
</view>
</view>
</view>
</block>
<block wx:if='{{current==2}}'>
<view class='content_box' style='padding:0 20rpx;'>
<view class='list_label_box'>
<view class='group_num'>团购人数：最低
<text>3人</text>
</view>
<view class='group_time'>发布倒计时：
<text>3小时</text>
</view>
</view>
<view class='list_title_info'>
<view class='iconfont icon-zhongdian'> </view>
<view>
<view>团购规则说明</view>
<view class='content_info'>如果因为环境网络问题或者其他原因导致无法打卡，请上传照 片及文字申诉内容，证明您已到场并已经参与活动。</view>
</view>
</view>
<view class='service_box'>
<view class='service_info_box'>
<text class='iconfont icon-xuanzhong'></text>
<text>我已阅读并同意畅玩卡</text>
<text class='service_info'>服务协议</text>
</view>
<view class='service_btn_box'>
<view>单价：¥188.00</view>
<view class='pay_btn'>支付</view>
</view>
</view>
</view>
</block>
\ No newline at end of file
... ...
/* pages/groupBuy/groupBuy.wxss */
page {
background: #f5f5f5;
}
.banner_img {
width: 100%;
height: 350rpx;
display: flex;
align-items: center;
justify-content: center;
}
.banner_img image {
width: 100%;
height: 100%;
}
.title_box {
width: 100%;
height: 80rpx;
background: #fff;
padding: 0 40rpx;
font-size: 32rpx;
color: #464646;
display: flex;
align-items: center;
margin-top: 20rpx;
position: relative;
}
.title_content::after {
content: '';
width: 6rpx;
height: 32rpx;
background: #3fa9f5;
position: absolute;
left: 20rpx;
top: 50%;
transform: translateY(-50%);
}
.tab_box {
width: 100%;
height: 100rpx;
background: #fff;
margin-top: 20rpx;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 22rpx;
font-size: 30rpx;
color: #464646;
text-align: center;
box-sizing: border-box;
}
.tab_item {
width: 30%;
position: relative;
}
.tab_active {
color: #3fa9f5;
}
.tab_active::after {
content: '';
width: 100%;
height: 4rpx;
background: #3fa9f5;
position: absolute;
left: 0;
bottom: -30rpx;
}
.content_box {
margin-top: 20rpx;
/* padding-bottom: 100rpx; */
}
.null_box {
width: 100%;
height: 100rpx;
}
.item_list {
margin-bottom: 20rpx;
background: #fff;
padding: 0 20rpx;
}
.list_title_box {
display: flex;
align-items: center;
justify-content: flex-end;
font-size: 28rpx;
color: #464646;
padding: 10rpx 0;
border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
}
.icon-fanhui {
margin-left: 20rpx;
}
.list_info_box {
display: flex;
align-items: flex-start;
padding: 20rpx 20rpx;
}
.info_item {
display: flex;
align-items: center;
justify-items: center;
flex-direction: column;
margin-right: 37rpx;
margin-bottom: 20rpx;
}
.info_item:nth-child(5n) {
margin-right: 0;
}
.info_item:last-child {
margin-right: 0;
}
.info_box {
width: 100rpx;
height: 100rpx;
background: rgba(255, 255, 255, 1);
border-radius: 50%;
border: 1rpx dashed #3fa9f5;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
position: relative;
}
.info_box img {
width: 100%;
height: 100%;
}
.info_label {
position: absolute;
bottom: 10rpx;
left: 50%;
transform: translateX(-50%);
width: 56rpx;
height: 20rpx;
background: rgba(252, 91, 99, 1);
border-radius: 8rpx;
font-size: 14rpx;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
}
.info_time {
text-align: center;
font-size: 18rpx;
color: #6e6e6e;
margin-top: 20rpx;
}
.list_info {
font-size: 24rpx;
color: #6e6e6e;
text-align: center;
position: relative;
margin-bottom: 20rpx;
}
.list_info text {
color: #fc5b63;
}
.list_info_item::after {
content: '';
width: 30%;
height: 2rpx;
background: rgba(0, 0, 0, 0.1);
position: absolute;
right: 0;
top: 50%;
}
.list_info_item::before {
content: '';
width: 30%;
height: 2rpx;
background: rgba(0, 0, 0, 0.1);
position: absolute;
left: 0;
top: 50%;
}
.user_info_box {
font-size: 24rpx;
color: #6e6e6e;
display: flex;
align-items: flex-start;
justify-content: space-between;
padding-bottom: 20rpx;
}
.user_info {
display: flex;
align-items: center;
font-size: 24rpx;
color: #6e6e6e;
}
.user_info .info_box {
margin-right: 16rpx;
}
.info_state {
color: #fc5b63;
margin-top: 20rpx;
}
.state_box {
text-align: right;
}
.bottom_box {
width: 100%;
height: 80rpx;
background: #fdefb5;
font-size: 24rpx;
color: #fc5b63;
position: fixed;
left: 0;
bottom: 0;
padding: 10rpx 20rpx;
box-sizing: border-box;
}
/* 团购成交记录 */
.list_tab {
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
padding: 30rpx 0;
box-sizing: border-box;
text-align: center;
}
.list_tab_item {
width: 33.3%;
font-size: 27rpx;
color: #464646;
position: relative;
}
.list_label {
width: 180rpx;
height: 22rpx;
position: absolute;
bottom: -28rpx;
left: 50%;
transform: translateX(-50%);
/* padding: 2rpx 8rpx;
box-sizing: border-box; */
background: rgba(252, 91, 99, 1);
border-radius: 10rpx;
font-size: 18rpx;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
}
.list_content {
border: 0 !important;
padding: 15rpx 0 !important;
}
.list_content .list_tab_item {
font-size: 23rpx !important;
color: #a3a3a3 !important;
}
/* 发起团购 */
.icon-xuanzhong {
font-size: 24rpx;
margin-right: 18rpx;
}
.service_info {
font-size: 24rpx;
color: #3fa9f5;
position: relative;
}
.service_info::after {
content: '';
width: 100%;
height: 4rpx;
background: #3fa9f5;
position: absolute;
left: 0;
bottom: -3rpx;
}
.service_info_box {
width: 100%;
/* height: 50rpx; */
background: #fdefb5;
font-size: 24rpx;
color: #fc5b63;
padding: 10rpx 20rpx;
box-sizing: border-box;
}
.service_box {
width: 100%;
position: fixed;
left: 0;
bottom: 0;
}
.service_btn_box {
width: 100% !important;
height: 97rpx !important;
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
font-size: 30rpx !important;
color: #464646 !important;
padding-left: 20rpx !important;
background: #fff !important;
}
.pay_btn {
width: 230rpx;
height: 100%;
background: #3fa9f5;
font-size: 36rpx;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
}
.list_label_box {
width: 100%;
min-height: 200rpx;
font-size: 28rpx;
color: #464646;
background: rgba(255, 255, 255, 1);
border-radius: 10rpx;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
.group_time {
margin-top: 40rpx;
}
.group_time text, .group_num text {
font-size: 24rpx;
color: #fc5b63;
}
.list_title_info {
font-size: 24rpx;
color: #fc5b63;
display: flex;
align-items: flex-start;
margin-top: 23rpx;
}
.content_info {
color: #a3a3a3;
margin-top: 13rpx;
}
... ...
// pages/groupBuyDetail/groupBuyDetail.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{}
\ No newline at end of file
... ...
<!--pages/groupBuyDetail/groupBuyDetail.wxml-->
<view class='banner_img'>
<image src='../../images/banner.jpg'></image>
</view>
<view class='content_box'>
<view class='item_list' wx:for='{{[1]}}' wx:key=''>
<view class='list_title_box'>
<view>查看详情</view>
<view class='iconfont icon-fanhui'></view>
</view>
<view class='list_info_box'>
<view class='info_item' wx:for='{{[1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,11,1,1,1,1,1,1,1,1,1,1,1,1,1]}}' wx:key=''>
<view class='info_box'>
<image src='../../images/start-logo.png'></image>
<view class='info_label'>发起人</view>
</view>
<view class='info_time'>
<view>2018.10.10</view>
<view> 00:00:00</view>
</view>
</view>
</view>
<view class='list_info'>成团人数：最低
<text>3</text>人，已参与：
<text>2</text> 人，快呼唤伙伴参与吧！</view>
<view class='list_info'>
<view class='list_info_item'>剩余
<text>00：02：00 </text> 结束</view>
</view>
<view>
<view class='user_info_box'>
<view class='user_info'>
<view class='info_box'>
<image src='../../images/start-logo.png'></image>
<view class='info_label'>发起人</view>
</view>
<view>发起人姓名</view>
</view>
<view class='state_box'>
<view>2018.10.10 00:00:00开团</view>
<view class='info_state'>团购中</view>
</view>
</view>
</view>
</view>
</view>
<view class='list_title_info'>
<view class='iconfont icon-zhongdian'> </view>
<view>
<view>团购规则说明</view>
<view class='content_info'>如果因为环境网络问题或者其他原因导致无法打卡，请上传照 片及文字申诉内容，证明您已到场并已经参与活动。</view>
</view>
</view>
<view class='null_box'></view>
<view class='service_btn_box'>分享好友</view>
\ No newline at end of file
... ...
/* pages/groupBuyDetail/groupBuyDetail.wxss */
@import '../groupBuy/groupBuy.wxss';
.list_info_box {
flex-wrap: wrap;
}
.service_btn_box {
background: linear-gradient(-78deg, rgba(255, 83, 2, 1), rgba(252, 116, 0, 1));
display: flex;
align-items: center;
justify-content: center;
font-size: 36rpx;
color: #fff;
position: fixed;
bottom: 0;
left: 0;
}
... ...
// pages/my/my.js
Page({
/**
* 页面的初始数据
*/
data: {
},
//跳转我的预约
myAppointment() {
},
//我的唱完卡
myCard() {
wx.navigateTo({
url: 'myCard/myCard',
})
},
//联系客服
contact() {
wx.navigateTo({
url: 'serviceWeChat/serviceWeChat',
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function() {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "我的"
}
\ No newline at end of file
... ...
<!--pages/my/my.wxml-->
<view class='box'>
<view class='header_box '>
<view class='head_box'>
<view class='head_img'>
<image src='../../images/head.png'></image>
</view>
<view>
<view>微信昵称</view>
<view class='phone_num'>139****0939</view>
</view>
</view>
<view class='my_info_box'>
<view class='iconfont icon-bianji2'></view>
<view>我的资料</view>
</view>
</view>
</view>
<view class='content_box'>
<view class='list_item_box'>
<view class='info_box' bindtap='myAppointment'>
<view class='list_title'>我的预约</view>
<view>
<text class='all'>全部</text>
<text class='iconfont icon-fanhui'></text>
</view>
</view>
<view class='list_tab_box'>
<view class='tab_item'>
<view class='list_img'>
<image src='../../images/my1.png'></image>
</view>
<view>待确认</view>
</view>
<view class='tab_item'>
<view class='list_img'>
<image src='../../images/my1.png'></image>
</view>
<view>已预约</view>
</view>
<view class='tab_item'>
<view class='list_img'>
<image src='../../images/my1.png'></image>
</view>
<view>已取消</view>
</view>
<view class='tab_item'>
<view class='list_img'>
<image src='../../images/my1.png'></image>
</view>
<view>已结束</view>
</view>
</view>
</view>
<view class='list_item_box'>
<view class='info_box' bindtap='myCard'>
<view class='list_title'>我的畅玩卡</view>
<view class='iconfont icon-fanhui'></view>
</view>
<view class='info_box'>
<view class='list_title'>兑换</view>
</view>
<view class='info_box' bindtap='contact'>
<view class='list_title'>联系客服</view>
</view>
</view>
</view>
\ No newline at end of file
... ...
/* pages/my/my.wxss */
@import 'myProfile/myProfile.wxss';
.header_box {
width: 100%;
height: 200rpx;
background: #3fa9f5;
border-radius: 10rpx;
margin-top: 20rpx;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 32rpx;
color: #fff;
padding: 0 24rpx;
box-sizing: border-box;
}
.icon-bianji2{
font-size: 50rpx;
text-align: center;
}
.head_box {
display: flex;
align-items: center;
}
.head_img{
margin-right: 25rpx!important;
}
.phone_num{
font-size: 24rpx;
}
.my_info_box {
font-size: 18rpx;
}
.head_img {
margin: 0;
}
.info_box {
border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
padding: 20rpx 20rpx;
margin-top: 0;
}
.list_item_box .info_box:last-child {
border: 0;
}
.list_item_box {
margin-top: 20rpx;
padding: 0 20rpx;
background: #fff;
}
.list_img {
width: 60rpx;
height: 60rpx;
margin: 0 auto 20rpx auto;
}
.list_img image {
width: 100%;
height: 100%;
}
.list_tab_box {
background: #fff;
display: flex;
align-items: center;
justify-content: space-between;
padding: 20rpx 70rpx;
}
.tab_item {
font-size: 24rpx;
color: #6f6f6f;
}
.all{
font-size: 28rpx;
color: #464646;
}
\ No newline at end of file
... ...
// pages/myCard/myCard.js
Page({
/**
* 页面的初始数据
*/
data: {
imgsUrl: ['../../../images/banner.jpg', '../../../images/banner.jpg', '../../../images/banner.jpg'],
swipercurrent: 0,
},
//获取轮播当前页
swiperCharge(e) {
console.log(e)
this.setData({
swipercurrent: e.detail.current
})
},
//跳转预约记录
record() {
wx.navigateTo({
url: '../appointmentRecord/appointmentRecord',
})
},
//立即购买
buyCard(){
wx.navigateTo({
url: '../buyCard/buyCard',
})
},
//团购畅玩卡
groupBuy(){
wx.navigateTo({
url: '../groupBuy/groupBuy',
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function() {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "我的畅玩卡"
}
\ No newline at end of file
... ...
<!--pages/myCard/myCard.wxml-->
<block>
<view class='banner_box'>
<swiper class='swiper_box' wx:key='' interval='2000' duration='500' current='{{swipercurrent}}' bindchange='swiperCharge'>
<swiper-item class="banner_img" wx:for='{{imgsUrl}}' wx:key=''>
<image src='{{item}}'></image>
</swiper-item>
</swiper>
<view class='indicator_dots'>
<block wx:for='{{imgsUrl}}' wx:key=''>
<view class="dot {{ index == swipercurrent ? 'dot_active':''}}"></view>
</block>
</view>
</view>
<view class='content_box'>
<view class='item_list' bindtap='record'>
<view class='list_title'>预约记录</view>
</view>
<view class='item_list' bindtap='buyCard'>
<view class='list_title'>立即购买/续费</view>
</view>
<view class='item_list' bindtap='groupBuy'>
<view class='list_title'>团购畅玩卡</view>
</view>
</view>
</block>
<!-- <block>
<view class='banner_box'>
<swiper class='swiper_box' wx:key='' interval='2000' duration='500' current='{{swipercurrent}}' bindchange='swiperCharge'>
<swiper-item class="banner_img" wx:for='{{imgsUrl}}' wx:key=''>
<image src='{{item}}'></image>
</swiper-item>
</swiper>
<view class='indicator_dots'>
<block wx:for='{{imgsUrl}}' wx:key=''>
<view class="dot {{ index == swipercurrent ? 'dot_active':''}}"></view>
</block>
</view>
</view>
<view class='content_box'>
<view class='item_list'>
<view class='list_title'>立即购买</view>
</view>
<view class='item_list'>
<view class='list_title'>团购畅玩卡</view>
</view>
</view>
</block> -->
\ No newline at end of file
... ...
/* pages/myCard/myCard.wxss */
page {
background: #f5f5fa;
}
.banner_box {
position: relative;
}
.swiper_box {
width: 100%;
height: 430rpx;
padding: 30rpx;
box-sizing: border-box;
}
.banner_img {
width: 690rpx;
height: 370rpx;
border-radius: 20rpx;
overflow: hidden;
}
.banner_img image {
width: 100%;
height: 100%;
}
.indicator_dots {
color: #487aff;
position: absolute;
bottom: 50rpx;
right: 30rpx;
display: flex;
align-items: center;
justify-content: center;
z-index: 2;
}
.dot {
width: 14rpx;
height: 14rpx;
background: #c4c4c4;
border-radius: 50%;
margin: 0 5rpx;
}
.dot_active {
width: 28rpx;
height: 14rpx;
background: #fff;
border-radius: 40rpx;
}
.content_box {
margin-top: 20rpx;
background: #fff;
}
.item_list {
padding: 20rpx 30rpx;
border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
font-size: 32rpx;
color: #464646;
}
.item_list:last-child{
border: 0;
}
.list_title {
position: relative;
padding-left: 17rpx;
}
.list_title::after {
content: "";
width: 6rpx;
height: 32rpx;
background: #3FA9F5;
border-radius: 40rpx;
position: absolute;
left: -10rpx;
top: 50%;
transform: translateY(-50%);
}
... ...
// pages/MyProfile/MyProfile.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "我的资料"
}
\ No newline at end of file
... ...
<!--pages/MyProfile/MyProfile.wxml-->
<view class='box'>
<view class='banner_box'>
<view class='head_img'>
<image src='../../../images/head.png'></image>
</view>
<view>微信昵称</view>
</view>
</view>
<view class='info_box'>
<view>手机号：188*****888</view>
<view>更换手机号</view>
</view>
<view class='title_box'>
<view class='list_title'>我的学员</view>
<view class='add_box'>
<text class='iconfont icon-jia'></text>
<text>添加学员</text>
</view>
</view>
<view class='box'>
<view class='list_item' wx:for='{{[1,1]}}' wx:key=''>
<view class='list_info'>
<text>姓名：男</text>
<text>性 别：男</text>
</view>
<view class='list_info'>
<text>生日：2000.01.01</text>
<text>所在城市：北京</text>
</view>
<view class='list_label_box'>
<view class='label_item edit_btn'>编辑学员信息</view>
<view class='label_item renewal_btn'>续卡</view>
<view class='label_item'>删除学员</view>
</view>
<view class='hint_info'>畅玩卡周期：2018.10.01-2019.10.01</view>
</view>
</view>
\ No newline at end of file
... ...
/* pages/MyProfile/MyProfile.wxss */
page {
background: #f5f5fa;
}
.box {
padding: 0 20rpx;
}
.banner_box {
width: 100%;
height: 200rpx;
background: #3fa9f5;
border-radius: 10rpx;
margin-top: 46rpx;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
font-size: 28rpx;
color: #fff;
}
.head_img {
width: 157rpx;
height: 157rpx;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
margin-top: -30rpx;
margin-bottom: 10rpx;
}
.head_img image {
width: 100%;
height: 100%;
}
.info_box {
display: flex;
align-items: center;
justify-content: space-between;
background: #fff;
padding: 34rpx 40rpx;
margin-top: 20rpx;
}
.title_box {
display: flex;
align-items: center;
justify-content: space-between;
padding: 20rpx 30rpx;
}
.icon-jia {
display: inline-block;
width: 34rpx;
height: 34rpx;
background: #3fa9f5;
border-radius: 10rpx;
color: #fff;
padding: 5rpx;
box-sizing: border-box;
margin-right: 8rpx;
}
.add_box {
font-size: 24rpx;
color: #3fa9f5;
text-align: center;
display: flex;
align-items: center;
}
.list_title {
position: relative;
padding-left: 17rpx;
font-size: 32rpx;
color: #464646;
}
.list_title::after {
content: "";
width: 6rpx;
height: 32rpx;
background: #3fa9f5;
border-radius: 40rpx;
position: absolute;
left: -10rpx;
top: 50%;
transform: translateY(-50%);
}
.list_item {
width: 100%;
background: #fff;
padding:0 20rpx;
min-height: 210rpx;
box-sizing: border-box;
position: relative;
overflow: hidden;
border-radius: 10rpx;
margin-bottom: 20rpx;
}
.list_info {
display: flex;
align-items: center;
justify-content: space-between;
padding:10rpx 20rpx;
border-bottom: 1rpx solid #DEDEDE;
}
.list_info:nth-child(2){
border-bottom: 0rpx;
}
.list_info text {
display: inline-block;
width: 50%;
font-size: 28rpx;
color: #6e6e6e;
}
.list_label_box{
display: flex;
align-items: center;
justify-content: flex-end;
}
.label_item{
width: 130rpx;
height: 40rpx;
border: 1rpx solid #3FA9F5;
border-radius: 10rpx;
font-size: 18rpx;
color: #3FA9F5;
display: flex;
align-items: center;
justify-content: center;
margin-left: 30rpx;
}
.edit_btn,.renewal_btn{
background: #3FA9F5;
color: #fff;
border: 0;
}
.renewal_btn{
background: #FC5B63;
}
.hint_info{
width: 100%;
height: 40rpx;
background: #3FA9F5;
color: #fff;
font-size: 18rpx;
line-height: 40rpx;
text-align: center;
position: absolute;
bottom: 0;
left: 0;
}
\ No newline at end of file
... ...
// pages/protocol/protocol.js
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "服务协议"
}
\ No newline at end of file
... ...
<!--pages/protocol/protocol.wxml-->
<view class='content_box'>
还有简短的汉字以内的文字介绍还有简短的汉字以内 的文字介绍还有简短的汉字以内的文字介绍还有简短 的汉字以 还有简短的汉字以内的文字介绍还有简短的汉字以内 的文字介绍还有简短的汉字以内的文字介绍还有简短 的汉字以
</view>
\ No newline at end of file
... ...
/* pages/protocol/protocol.wxss */
.content_box{
font-size: 26rpx;
color: #6F6F6F;
line-height: 50rpx;
padding: 30rpx;
}
\ No newline at end of file
... ...
// pages/serviceWeChat/serviceWeChat.js
Page({
/**
* 页面的初始数据
*/
data: {
imgsUrl: ['../../../images/head.png']
},
//长按保存图片
saveImg(e) {
console.log(e)
var current = e.target.dataset.src
wx.previewImage({
current: current,
urls: this.data.imgsUrl
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function() {
}
})
\ No newline at end of file
... ...
{
"navigationBarTitleText": "客服微信"
}
\ No newline at end of file
... ...
<!--pages/serviceWeChat/serviceWeChat.wxml-->
<view class='content_box'>
<view class='content_img' wx:for='{{imgsUrl}}' wx:key=''>
<image src='{{item}}' bindtap='saveImg' data-src='{{item}}'></image>
<view class='hint_info'>点击即可放大，放大后长按即可保存到相册</view>
</view>
<view class='content'>还有简短的汉字以内的文字介绍还有简
短的汉字以内的文字介绍还有简短的汉
字以内的文字介绍还有简短的汉字以</view>
</view>
\ No newline at end of file
... ...
/* pages/serviceWeChat/serviceWeChat.wxss */
.content_img {
width: 615rpx;
height: 615rpx;
margin: 60rpx auto;
position: relative;
}
.content_img image {
width: 100%;
height: 100%;
}
.hint_info {
width: 100%;
font-size: 18rpx;
color: #6f6f6f;
text-align: center;
position: absolute;
bottom: 10rpx;
left: 50%;
transform: translateX(-50%);
}
.content {
font-size: 32rpx;
color: #6f6f6f;
padding: 0 100rpx;
}
... ...
// var appjs = require("../../app.js");
const app = getApp()
Page({
/**
* 页面的初始数据
*/
data: {
openid: '',
session_key: '',
},
// 获取用户信息
start(e) {
let that = this;
console.log('点击');
// wx.redirectTo({
// url: '/pages/index/index',
// })
let url = '/wxapp/public/login';
// console.log(that.data.openid)
let params = {
encrypted_data: e.detail.encryptedData,
iv: e.detail.iv,
raw_data: e.detail.rawData,
signature: e.detail.signature,
openid: that.data.openid,
session_key: that.data.session_key,
}
app.post(url, params).then((ret) => {
wx.setStorageSync('token', ret.token)
app.globalData.userInfo = ret.user_type
// console.log('userInfo',app.globalData.userInfo,ret);
if (ret.user_type == 2) {
wx.switchTab({
url: '/pages/index/index',
})
}
})
},
example() {
app.post(url, {
id: 1
}, {}).then((res) => {
this.setData({
code: res
})
}).catch((err) => {
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
let that = this
let url = '/wxapp/public/getSessionKey'
wx.login({
success: function (res) {
// console.log(res)
app.post(url, {
code: res.code
}, {}).then((ret) => {
// console.log('res',ret);
that.setData({
openid: ret.openid,
session_key: ret.session_key
})
})
},
fail: function (res) {
},
complete: function (res) {
},
})
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
\ No newline at end of file
... ...
{}
\ No newline at end of file
... ...
<!--pages/start/start.wxml-->
<view class= 'ic_img'>
<image src='../../images/logo.png'></image>
</view>
<!--<text class='tit'>-->
<!--科学队长-->
<!--</text>-->
<button class='go_btn' open-type="getUserInfo" lang="zh_CN" bindgetuserinfo="start">开 启</button>
<!--<view class='go_btn'bindtap="start">立即开启</view>-->
... ...
/* pages/start/start.wxss */
.ic_img {
width: 320rpx;
height: 320rpx;
margin: 147rpx auto 0rpx;
}
.ic_img image {
width: 100%;
height: 100%;
}
.tit {
font-size: 30rpx;
color: #5493FB;
text-align: center;
display: block;
line-height: 40rpx;
}
.go_btn {
width: 602rpx;
height: 80rpx;
color: #fff;
position: absolute;
bottom: 210rpx;
left: 0;
right: 0;
margin: 0 auto;
background: #3FA9F5;
/*background: linear-gradient(to bottom right, #ffc536, #ffab2e); !* 标准的语法 *!*/
border-radius: 40rpx;
line-height: 80rpx;
font-size: 36rpx;
}
.go_btn::after {
border: none;
}
... ...
{
"description": "项目配置文件",
"packOptions": {
"ignore": []
},
"setting": {
"urlCheck": false,
"es6": true,
"postcss": true,
"minified": true,
"newFeature": true
},
"compileType": "miniprogram",
"libVersion": "2.4.0",
"appid": "wx48319d952ea4e37f",
"projectname": "%E7%A7%91%E5%AD%A6%E9%98%9F%E9%95%BF",
"debugOptions": {
"hidedInDevtools": []
},
"isGameTourist": false,
"condition": {
"search": {
"current": -1,
"list": []
},
"conversation": {
"current": -1,
"list": []
},
"game": {
"currentL": -1,
"list": []
},
"miniprogram": {
"current": -1,
"list": []
}
}
}
\ No newline at end of file
... ...
<template name="experiment">
<view class='experiment_box'>
<view class="title_box">
<view class="line"></view>
<text wx:if="{{is_this_week}}">本周实验</text>
<text wx:if="{{!is_this_week}}">往期实验</text>
</view>
<view wx:for="{{info}}" wx:key="index" data-index="{{index}}" bindtap="goTestDetail">
<view class="test_box">
<view class="time">{{item.time}}</view>
<view class="img_box">
<image src="{{item.url}}"></image>
</view>
</view>
<view class="order_box">
<text wx:if="{{!ordered && !is_past}}" catchtap="goAppointment" data-index="{{index}}">前往预约</text>
<text wx:if="{{is_past}}">查看</text>
</view>
</view>
</view>
</template>
\ No newline at end of file
... ...
/* pages/template/template.wxss */
.experiment_box {
width: 100%;
background-color: #fff;
padding: 18rpx 20rpx 20rpx 20rpx;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin-bottom: 20rpx;
}
.title_box {
width: 100%;
display: flex;
align-items: center;
justify-content: flex-start;
}
.title_box .line {
width: 6rpx;
height: 32rpx;
background-color: #3FA9F5;
margin-right: 18rpx;
}
.title_box text {
color: #464646;
font-size: 32rpx;
}
.test_box {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.test_box .time {
font-size: 28rpx;
color: #3FA9F5;
margin-bottom: 10rpx;
}
.test_box .img_box {
width: 100%;
height: 300rpx;
}
.img_box image {
width: 100%;
height: 100%;
border-radius: 20rpx;
}
.order_box {
display: flex;
align-items: center;
justify-content: flex-end;
margin-top: 10rpx;
}
.order_box text {
width: 150rpx;
height: 50rpx;
line-height: 50rpx;
color: #ffffff;
background-color: #3FA9F5;
font-size: 30rpx;
text-align: center;
border-radius: 10rpx;
}
\ No newline at end of file
... ...
const formatTime = date => {
const year = date.getFullYear()
const month = date.getMonth() + 1
const day = date.getDate()
const hour = date.getHours()
const minute = date.getMinutes()
const second = date.getSeconds()
return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':')
}
const formatNumber = n => {
n = n.toString()
return n[1] ? n : '0' + n
}
module.exports = {
formatTime: formatTime
}
... ...