退货物流信息

src/component/applyRefund/applyRefund.wxml

 <!--component/applyRefund/applyRefund.wxml-->
-<view class="modal-container{{show ? ' active' : ''}}" bindtap="hidePopup"></view>
-<view class="modal-content{{show ? ' active' : ''}}">
-
+<view class="modal-container" bindtap="hidePopup" wx:if="{{show}}"></view>
+<view class="modal-content" wx:if="{{show}}">
   <view class="modal-header">
     <image class="modal-close" mode="widthFix" src="/assets/imgs/7_1_0/close.png" bindtap="hidePopup"></image>
   </view>
@@ -9,13 +8,17 @@
   <view class="modal-info">
     <view class="modal-logistics">
       <view>
-        <picker></picker>
+        <picker bindchange="bindSelectRefundReason" value="{{reasonIndex}}" range="{{reasonList}}" range-key="name" class="modal-picker">
+        <view class="picker">
+          当前选择：{{reasonList[reasonIndex].name}}
         </view>
-      <view>
+      </picker>
+      </view>
+      <view class="modal-logis-number">
         <input placeholder-class="modal-placeholder" class="modal-input" placeholder="填写物流单号"></input>
       </view>
     </view>
-    <view>
+    <view class="modal-confirm-btn">
       <button class="btn btn-primary btn-lg">确认</button>
     </view>
   </view>

src/component/applyRefund/applyRefund.wxss

@@ -7,21 +7,9 @@
   top: 0;
   left: 0;
   background: rgba(0, 0, 0, 0.5);
-  /* transform: translateZ(100%); */
-  opacity: 0;
-  transition: opacity 200ms;
   z-index: 98; 
-}
-
-.modal-container.active {
-  opacity: 1;
-  /* transform: translateZ(0);  */
-  }
   
-.modal-content.active {
-  opacity: 1;
-  /* transform: translateZ(0);  */
-  }
+}
 
 .modal-content {
   position: fixed;
@@ -29,11 +17,8 @@
   bottom: 30%;
   left: 65rpx;
   background: #ffffff;
-  transition: transform 300ms;
-  /* transform: translateZ(100%);  */
   height: 620rpx;
   width: 620rpx;
-  opacity: 0;
   border-radius: 15rpx;
   }
 
@@ -45,15 +30,31 @@
    }
 
 .modal-info{
-  padding: 0 40rpx;
+  padding: 60rpx 40rpx;
   margin-top: 95rpx;
 }
-.modal-input{
+.modal-input,.modal-picker{
   border-radius: 5rpx;
   border: 1px solid rgba(170, 170, 170, 1);
   height: 78rpx;
+  line-height: 78rpx;
   padding: 0 20rpx;
 }
-.modal-placeholder{
+.modal-placeholder,.picker{
   color: #999999;
 }
+.modal-logis-number{
+  margin-top: 43rpx;
+}
+.modal-confirm-btn{
+  margin-top: 79rpx;
+}
+.modal-confirm-btn button{
+  width: 416rpx;
+  border-radius: 15rpx;
+  background-color: rgba(255, 51, 51, 1);
+  box-shadow: 0px 2rpx 9rpx 0px rgba(255, 51, 51, 0.6);
+  border: none;
+  margin: 0 auto;
+  font-size: 36rpx;
+}

src/pages/refundDetail/refundDetail.js

@@ -5,8 +5,7 @@ Page({
    * 页面的初始数据
    */
   data: {
-    showApplyRefundModal:true
-
+    showApplyRefundModal:false
   },
 
   /**
@@ -24,8 +23,6 @@ Page({
   },
 
   copy(e){
-    console.log(e)
-    console.log('1111')
     wx.setClipboardData({
       //准备复制的数据
       data: e.currentTarget.dataset.content,
@@ -40,6 +37,9 @@ Page({
 
   //填写物流信息
   tapWriteLogis(){
-
+    console.log('222')
+    this.setData({
+      showApplyRefundModal: true
+    })
   }
 })
\ No newline at end of file

src/pages/refundDetail/refundDetail.wxml

@@ -20,7 +20,6 @@
       </view>
       <view class="write-logistics" bindtap="tapWriteLogis">
         <button class="btn btn-primary btn-outline write-btn">填写物流信息</button>
-
       </view>
     </view>
   </view>