1111

src/wx/pages/newCircleEvent/newCircleEvent.js

@@ -10,11 +10,15 @@ Page({
   data: {
     circleId: 0,
     isOwner: false,
+    calenderStart:"",
 
     title:'',
     comment:'',
+    startDate:'',
     startTime:'',
+    finishDate: '',
     finishTime:'',
+    enrollDate: '',
     enrollTime:'',
     frontImage:'',
     position: '',
@@ -24,6 +28,7 @@ Page({
     leaderName:'',//联系人
     leaderContact: '',//联系方式
     venue: '',//集合地点
+    venueDate: '',//集合日期
     venueTime: '',//集合时间
 
 
@@ -34,6 +39,14 @@ Page({
    * 生命周期函数--监听页面加载
    */
   onLoad: function (options) {
+    var timestamp = Date.parse(new Date()); 
+    var date = new Date(timestamp);//获取年份  
+    var yyyy =date.getFullYear();//获取月份  
+    var mm = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1);//获取当日日期
+    var dd = date.getDate() < 10 ? '0' + date.getDate() : date.getDate(); 
+    this.setData({
+      calenderStart: yyyy + '-' + mm + '-' + dd
+    })
 
   },
 
@@ -69,18 +82,32 @@ Page({
     });
   },
   //获取活动标题输入
-  inputTitle(event) {
+  inputTitle(e) {
     this.setData({
-      title: event.detail.value
+      title: e.detail.value
     })
   },
 
   //获取输入的活动描述
-  inputComment(event) {
+  inputComment(e) {
+    this.setData({
+      comment: e.detail.value
+    })
+  },
+
+  //选择开始时间日期
+  selectStartDate(e) {
     this.setData({
-      comment: event.detail.value
+      startDate: e.detail.value
     })
   },
+  //选择开始时间时间
+  selectStartTime(e) {
+    this.setData({
+      startTime: e.detail.value
+    })
+  },
+
 
   //获取是否允许社会人士参加输入
   onChangeIncludeSocialUser({ detail }) {

src/wx/pages/newCircleEvent/newCircleEvent.wxml

@@ -2,19 +2,26 @@
 <view class='newCircleEvent'>
   <view class='con_newCircleEvent'>
     <view>
-      <view>活动标题</view>
-      <input placeholder='请输入活动标题' bindinput="inputTitle" value='{{title}}'></input>
+      <view class='textTitle'>活动标题</view>
+      <input class="inputTextBox" placeholder='请输入活动标题' bindinput="inputTitle" value='{{title}}'></input>
     </view>
     <view>
-      <view>活动描述</view>
-      <input placeholder='请输入活动描述' bindinput="inputComment" value='{{comment}}'></input>
+      <view class='textTitle'>活动描述</view>
+      <textarea placeholder='请输入活动描述' class="inputTextAreaBox" bindinput="inputComment" value='{{comment}}'></textarea>
     </view>
     <view>
-      <view>活动开始时间</view>
-      <input placeholder='请输入活动开始时间'></input>
+      <view class='textTitle'>活动开始时间</view>
+      <view class="timePickerRow">
+        <picker class="inputDateBox" mode="date" start="{{calenderStart}}" end="" bindchange="selectStartDate">
+          <input style="width:100%;height:20px;line-height:20px;" placeholder='请选择日期' value='{{startDate}}'></input>
+        </picker >
+        <picker class="inputTimeBox" mode="time" start="" end="" bindchange="selectStartTime">
+          <input style="width:100%;height:20px;line-height:20px;" placeholder='请选择时间' value='{{startTime}}'></input>
+        </picker >
+      </view>
     </view>
     <view>
-      <view>活动结束时间</view>
+      <view class='textTitle'>活动结束时间</view>
       <input placeholder='请输入活动结束时间'></input>
     </view>
     <view class='fengmianimg'>

src/wx/pages/newCircleEvent/newCircleEvent.wxss

 /* pages/newCircleEvent/newCircleEvent.wxss */
-page{
-  width: 100%;
-  height: 100%;
-}
 .newCircleEvent{
   width: 100%;
-  height: 100%;
-  position: relative;
+  margin: 0 auto;
+  font-size: 14px;
+  background: #fff;
 }
+
 .con_newCircleEvent{
   position: absolute;
   top: 0;
@@ -15,28 +13,58 @@ page{
   bottom: 0;
   right: 0;
   margin: auto;
-  width: 260px;
+  width: 95%;
   height: 100%;
 }
-.con_newCircleEvent>view{
-  width: 100%;
+
+.con_newCircleEvent .textTitle{
+  width: 90%;
+  height:25px;
+  line-height: 25px;
+  margin: 10px auto 0;
+}
+
+.con_newCircleEvent .inputTextBox{
+  display: block;
+  width: 90%;
   height: 30px;
+  border: 1px solid #f0f0f0;
+  padding: 5px;
+  margin: 5px auto;
+}
+
+.con_newCircleEvent .inputTextAreaBox{
+  display: block;
+  width: 90%;
+  height: 60px;
+  border: 1px solid #f0f0f0;
+  padding: 5px;
+  margin: 5px auto;
+}
+
+.timePickerRow {
   display: flex;
+  flex-direction: row;
+  justify-items: flex-start;
   align-items: center;
-  font-size: 12px;
+  text-align: left;
+  width: 90%;
 }
-.con_newCircleEvent>view>view{
-  width: 110px;
-  height: 20px;
-  line-height: 20px;
-}
-.con_newCircleEvent>view>input{
-  flex: 1;
-  height: 20px;
-  line-height: 20px;
-  border: 1px solid #ccc;
-  box-sizing: border-box;
-  padding-left: 5px;
+
+.inputDateBox{
+  display: block;
+  width: 35%;
+  height: 30px;
+  padding: 5px;
+  margin: 5px auto;
+}
+
+.inputTimeBox{
+  display: block;
+  width: 25%;
+  height: 30px;
+  padding: 5px;
+  margin: 5px auto;
 }
 
 .applyButton{