对接 详情页 预约看车

app.json

@@ -1,6 +1,5 @@
 {
   "pages":[
-    "pages/mysuggest/mysuggest",
     "pages/index/index",
     "pages/collect/collect",
     "pages/buy/buy",
@@ -11,6 +10,7 @@
     "pages/sell/sell",
     "pages/cardetail/cardetail",
     "pages/usercenter/usercenter",
+    "pages/mysuggest/mysuggest",
     "pages/mybuy/mybuy"
   ],
   "window":{

common/pathmap.js

@@ -23,5 +23,6 @@ export default{
   "logout":"/api/logout",
   "collectlist":"/api/collect_list",
   "orderlist":"/api/order_list",
-  "feedback":"/api/feedback"
+  "feedback":"/api/feedback",
+  "reserve":"/api/reserve"
 }

pages/cardetail/cardetail.js

@@ -44,7 +44,12 @@ Page({
       "易损耗部件":"wastage",
       "常用功能":"comonuse",
       "启动检测":"startcheck"
-    }
+    },
+    openscheme:false,
+    loanscale:[0.1,0.2,0.3,0.4,0.5,0.6],
+    loantime:[12,24,48],
+    scaleindex:1,
+    timeindex:1
   },
 
   /**
@@ -193,5 +198,42 @@ Page({
         _self.openLog();
       })
     }
+  },
+  appointmentBuy:function(){
+    var _self=this;
+    var mobile = wx.getStorageSync("mobile");
+    post(pathmap.reserve,{
+      "car_source_id":this.data.id,
+      mobile:mobile
+    },function(json){
+      var obj = {
+        title:json.data.message
+      }
+      if(json.statusCode!=200){
+        obj.icon="none"
+      }
+      wx.showToast(obj);
+    },null,function(){
+      _self.openLog();
+    })
+  },
+  openScheme:function(){
+    this.setData({openscheme:true});
+  },
+  closeScheme:function(){
+    this.setData({openscheme:false});
+  },
+  getPay:function(){
+    var price = this.data.detail.price*100;
+    var scale = this.data.loanscale[this.data.scaleindex];
+    var tiem = this.data.loantime[this.data.timeindex];
+  },
+  selectScale:function(e){
+    var index = e.currentTarget.dataset.n;
+    this.setData({scaleindex:index});
+  },
+  selectTime:function(e){
+    var index = e.currentTarget.dataset.n;
+    this.setData({timeindex:index});
   }
 })

pages/cardetail/cardetail.wxml

@@ -200,13 +200,97 @@
 			<image src="../../img/phone.png"/>
 			<view>电话</view>
 		</view>
-		<view class="cardetail_op_appointment">
+		<view 
+			bindtap="appointmentBuy"
+			class="cardetail_op_appointment">
 			预约看车
 		</view>
 		<view class="cardetail_op_line"></view>
-		<view class="cardetail_op_buy">
+		<view 
+			bindtap="openScheme"
+			class="cardetail_op_buy"
+		>
 			分期购车
 		</view>
 	</view>
 </scroll-view>
+<view 
+	style="left:{{openscheme?'0rpx':'100%'}}"
+	class="buy_scheme">
+	<view class="buy_scheme_box">
+		<view class="buy_scheme_title">
+			<view class="buy_scheme_tw">
+				分期方案
+			</view>
+			<image 
+				bindtap="closeScheme"
+				src="../../img/close.png"
+				class="buy_scheme_close"/>
+		</view>
+		<view class="scheme_price">
+			<view class="scheme_price_i">
+				<view class="scheme_price_iw">
+					车价
+				</view>
+				<view class="scheme_price_ip">
+					¥{{detail.price/100}}万
+				</view>
+			</view>
+			<view class="scheme_price_i">
+				<view class="scheme_price_iw">
+					首付款
+				</view>
+				<view class="scheme_price_ipb">
+					
+				</view>
+			</view>
+			<view class="scheme_price_i">
+				<view class="scheme_price_iw">
+					月供			
+				</view>
+				<view class="scheme_price_ipb">
+					
+				</view>
+			</view>
+		</view>
+		<view class="scheme_item">
+			<view class="scheme_item_t">
+				首付
+			</view>
+			<view class="scheme_item_l">
+				<block wx:for="{{loanscale}}" wx:key="item">					
+					<view 
+						bindtap="selectScale"
+						data-n="{{index}}"
+						class="scheme_item_el {{index==scaleindex?'active':''}}">
+						{{item*100}}%
+					</view>
+				</block>		
+			</view>
+		</view>
+
+		<view class="scheme_item">
+			<view class="scheme_item_t">
+				分期
+			</view>
+			<view class="scheme_item_l">
+				<block wx:for="{{loantime}}" wx:key="item">					
+					<view 					
+					bindtap="selectTime"
+					data-n="{{index}}"
+					class="scheme_item_el {{index==timeindex?'active':''}}">
+						{{item}}期
+					</view>
+				</block>	
+			</view>
+		</view>
+		<view class="scheme_condition">
+			<view>首付条件：</view>
+			<view>一成 需芝麻信用分600分以上，需有房产证明；</view>
+			<view>二成 需芝麻信用分550分以上</view>
+			<view>三成 需芝麻信用分450分以上</view>
+			<view class='scheme_condition_po'>※本页面试算结果仅供参考，实际结果以最终复批结果为准</view>
+		</view>
+	</view>
+</view>
 <include src="../../module/logs/logs.wxml"/>

pages/cardetail/cardetail.wxss

@@ -301,5 +301,113 @@
 	width: 1rpx;
 	height: 48rpx;
 	background-color: rgba(155, 155, 155, 1);
+}
+
+/*贷款计算*/
+.buy_scheme{
+	position: fixed;
+	top: 0rpx;
+	width: 100%;
+	height: 100%;
+	background-color: rgba(56,55,53,0.7);
+}
+.buy_scheme_box{
+	background: white;
+	width:662rpx;
+	height: 832rpx;
+	border-radius: 6rpx;
+	margin:228rpx auto;
+}
+.buy_scheme_title{
+	height: 68rpx;
+	line-height: 68rpx;
+	border-bottom: 1px solid rgba(235, 235, 235, 1);
+	position: relative;
+}
+.buy_scheme_tw{
+	font-size: 28rpx;
+	text-align: center;
+	color: rgba(33, 36, 37, 1);
+	font-family: NotoSansHans-Regular;	
+}
+.buy_scheme_close{
+	width:22rpx;
+	height: 22rpx;
+	position: absolute;
+	top:23rpx;
+	right:38rpx;
+}
 
+.scheme_price{
+	width:602rpx;
+	margin:30rpx auto;
+	display: flex;
+}
+.scheme_price_i{
+	flex: 1;
+
+}
+.scheme_price_iw{
+	height: 30rpx;
+	line-height: 30rpx;
+	color: rgba(104, 104, 104, 1);
+	font-size: 20rpx;
+	text-align: center;
+	font-family: NotoSansHans-DemiLight;
+}
+.scheme_price_ip,.scheme_price_ipb{
+	height: 54rpx;
+	line-height: 54rpx;
+	color: rgba(33, 36, 37, 1);
+	font-size: 36rpx;
+	text-align: center;
+	font-family: NotoSansHans-Medium;
+}
+.scheme_price_ipb{	
+	color: rgba(191, 163, 104, 1);
+}
+.scheme_item{
+	margin-top:48rpx;
+}
+.scheme_item_t{
+	height: 30rpx;
+	line-height: 30rpx;
+	color: rgba(104, 104, 104, 1);
+	font-size: 20rpx;
+	text-align: center;
+	font-family: NotoSansHans-DemiLight;
+}
+.scheme_item_l{	
+	width:622rpx;
+	display: flex;
+	margin:0px auto;
+	overflow: hidden;
+	flex-wrap: wrap;
+}
+.scheme_item_el{
+	width: 160rpx;
+	height: 68rpx;
+	border-radius: 6rpx;
+	border: 1.2px solid rgba(183, 183, 183, 1);
+	margin: 25rpx 20rpx 0rpx;
+	line-height:68rpx;
+	color: rgba(33, 36, 37, 1);
+	font-size: 28rpx;
+	text-align: center;
+	font-family: NotoSansHans-Medium;
+}
+.scheme_item_el.active{
+	background-color: #FFE600;
+}
+.scheme_condition{
+	text-indent: 80rpx;
+	line-height: 32rpx;
+	color: rgba(135, 135, 135, 1);
+	font-size: 20rpx;
+	text-align: left;
+	font-family: NotoSansHans-DemiLight;
+}
+.scheme_condition_po{
+	color:black;
+	font-weight: bold;
 }