任务提醒细化

client/pages/servant/taskreminder/taskreminder.acss

@@ -106,6 +106,30 @@
   padding-left: 28rpx;
   margin-top: 30rpx;
 }
+.tasks-item-no{
+  width: 122rpx;
+  height: 102rpx;
+  float: right;
+  background-color:#fff6f4;
+}
+.tasks-item-yes{
+  width: 122rpx;
+  height: 102rpx;
+  float: right;
+  border-top-right-radius: 12rpx;
+  border-bottom-right-radius: 12rpx;
+  background-color:#f2fbff;
+}
+.tasks-list-item image{
+  width: 35rpx;
+  height: 35rpx;
+  margin-left: 44.5rpx;
+  margin-top: 33.5rpx;
+}
+.tast-moneybox{
+  height: 102rpx;
+  background-color: #F3F3F3;
+}
 .tasks-list-money{
   height: 102rpx;
   margin-top: 25rpx;
@@ -113,13 +137,37 @@
   background: #FFFFFF;
   margin-left: 23rpx;
   margin-right: 24rpx;
+  width: 60%;
+  float: left;
+}
+.nogood{
+  width: 120rpx;
+  height: 31rpx;
+  background: #FFEDEA;
+  border-radius: 4px;
+  color: #FF5030;
+  font-size: 20rpx;
+  display: inline-block;
+  margin-left: 16rpx;
+  text-align: center;
+}
+.tasks-set{
+  float: right;
+  width: 27%;
+  margin-right: 24rpx;
+  height: 102rpx;
+  line-height: 102rpx;
+}
+.tasks-set button{
+  border-radius: 68rpx;
+  margin-top: 26rpx;
 }
 .tasks-list-pay{
   font-weight: bold;
   color: #333333;
   font-size: 28rpx;
   float: left;
-  width: 50%;
+  width: 45%;
   line-height: 102rpx;
   padding-left: 24rpx;
 }
@@ -132,10 +180,14 @@
   line-height: 102rpx;
   font-weight: bold;
 }
-.tasks-list-pay-right text{
+.tasks-list-pay-right input{
   color: #09AFFF;
   font-weight: normal;
-  margin-right: 8rpx;
+  width: 60%;
+  margin-top: 24rpx;
+}
+.tasks-list-pay-right text{
+  float: right;
 }
 .notasks{
   margin: 21rpx 24rpx 30rpx 24rpx;
@@ -146,4 +198,31 @@
   text-align: center;
   font-size: 36rpx;
   color: #999999;
+}
+.cancel-box{
+  width: 100%;
+}
+.cancel-box text{
+  font-size: 46rpx;
+  font-weight: bold;
+  margin-bottom: 30rpx;
+  display: inline-block;
+}
+.cancel-box radio-group{
+  width: 100%;
+}
+.cancel-left{
+  width: 50%;
+  float: left;
+  height: 102rpx;
+  line-height: 102rpx;
+  border-top: 1rpx #e5e5e5 solid;
+  border-right: 1rpx #e5e5e5 solid;
+}
+.cancel-right{
+  float: right;
+  width: 49%;
+  height: 102rpx;
+  line-height: 102rpx;
+  border-top: 1rpx #e5e5e5 solid;
 }

client/pages/servant/taskreminder/taskreminder.axml

@@ -52,16 +52,32 @@
         <!--有提醒任务-->
         <view a:if="{{isreminds}}">
           <view class="tasks-list-item">
-            洗衣服
+            <text>洗衣服</text>
+            <view class="tasks-item-yes">
+              <image mode="scaleToFill" src="/image/icon-yes.png"/>
+            </view>
+            <view class="tasks-item-no" onTap="showcancel">
+              <image mode="scaleToFill" src="/image/icon-no.png"/>
+            </view>
           </view>
           <view class="tasks-list-item">
-            做完饭
+            <text>做完饭</text>
+            <view class="tasks-item-yes">
+              <image mode="scaleToFill" src="/image/icon-yes.png"/>
+            </view>
+            <view class="tasks-item-no" onTap="showcancel">
+              <image mode="scaleToFill" src="/image/icon-no.png"/>
+            </view>
           </view>
           <view class="tasks-list-item">
             打扫卧室
           </view>
           <view class="tasks-list-item">
-            打扫房间
+            <text>打扫房间</text>
+            <label  class="nogood">任务不详细</label>
+            <view class="tasks-item-yes">
+              <image mode="scaleToFill" src="/image/icon-no.png"/>
+            </view>
           </view>
         </view>
         <!--没有任务-->
@@ -71,11 +87,14 @@
           </view>
         </view>
       </view>
-      
-      <view a:if="{{isreminds}}">
+      <!---没有任务花销计算不显示-->
+      <view a:if="{{isreminds}}" class="tast-moneybox">
         <view class="tasks-list-money">
           <view class="tasks-list-pay">今日花销合计</view>
-          <view class="tasks-list-pay-right"><text>100</text>元</view>
+          <view class="tasks-list-pay-right"><input placeholder="请输入"/><text>元</text></view>
+        </view>
+         <view class="tasks-set">
+          <button type="primary"  hover-class="active-button"  onTap="createServant">提交</button>
         </view>
       </view>
     </view>
@@ -85,4 +104,21 @@
     type="single"
     onSelect="handleSelect" />
   </modal>
+  <!--弹出取消原因-->
+  <modal show="{{showcancelbox}}">
+    <view class="cancel-box">
+        <text>取消原因</text>
+        <radio-group>
+          <label a:for="{{cancellist}}"  a:key={{value}}>
+            <radio value="{{item.value}}" checked="{{item.checked}}"/>{{item.label}}
+          </label>
+        </radio-group>
+        <view class="cancel-left" onTap="hidecnacelbox" >
+          取消
+        </view>
+        <view class="cancel-right">
+          确认选择
+        </view>
+    </view>
+  </modal>
 </view>

client/pages/servant/taskreminder/taskreminder.js

@@ -4,7 +4,9 @@ Page({
     showchangetime:false,
     nowselectTime:util.formatDate(new Date()),
     datelist:[{title:"周一",date:0,cssName:'',id:1,day:0},{title:"周二",date:0,cssName:'',id:2,day:0},{title:"周三",date:0,cssName:'',id:3,day:0},{title:"周四",date:0,cssName:'',id:4,day:0},{title:"周五",date:0,cssName:'',id:5,day:0},{title:"周六",date:0,cssName:'',id:6,day:0},{title:"周天",date:0,cssName:'',id:7,day:0}],
-    isreminds:true
+    isreminds:true,
+    showcancelbox:false,
+    cancellist:[{value:'1', label:'任务太多', checked:true},{value:'2', label:'我不会', checked:false},{value:'3', label:'任务不详细', checked:false}]
   },
   onLoad() {
     //加载选中的时间
@@ -28,6 +30,16 @@ Page({
     });
     //处理时间完成
   },
+  showcancel(){
+    this.setData({
+      showcancelbox: true
+    });
+  },
+  hidecnacelbox(){
+     this.setData({
+      showcancelbox: false
+    });
+  },
   dateAdd:function(startDate,days) {
   startDate = new Date(startDate);
   startDate = +startDate + days * 1000 * 60 * 60 * 24;