From 17b4415c12f2d3274baffa182fc37aa7139647d5 Mon Sep 17 00:00:00 2001
From: JerryYan <792602257@qq.com>
Date: Sun, 23 Aug 2020 23:09:56 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A1=BA=E5=B8=A6=E4=BB=B6=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 css/shundaijian.css       | 53 ++++++++++++++++++++++++++++++++++++++-
 js/shundaijian.js         | 13 +++++++++-
 templete/shundaijian.html | 27 ++++++++++++++++++--
 3 files changed, 89 insertions(+), 4 deletions(-)

diff --git a/css/shundaijian.css b/css/shundaijian.css
index 5890887..36eafb6 100644
--- a/css/shundaijian.css
+++ b/css/shundaijian.css
@@ -1,7 +1,7 @@
 .row {
     background: white;
     width: 100%;
-    height: 120px;
+    height: 140px;
     border-bottom: 1px solid #ebebeb;
     position: relative;
     margin-bottom: 5px;
@@ -25,6 +25,57 @@
 	overflow: hidden;
 	padding-left: 5px;
 	font-weight: bolder;
+	display: flex;
+}
+
+.loc_range {
+	font-size: 1.1rem;
+	color: black;
+	line-height: 32px;
+    height: 32px;
+	display: flex;
+	justify-content: space-between;
+}
+
+.loc_range .between::before {
+	content: '';
+	height: 1px;
+	background-color: black;
+	width: calc(50vw - 100px);
+	position: absolute;
+	display: block;
+	top: 60%;
+}
+
+.loc_range .between {
+	display: inline-block;
+	width: calc(50vw - 100px);
+	text-align: center;
+	line-height: 22px;
+	position: relative;
+}
+
+.loc_range .with_img {
+	display: inline-flex;
+}
+
+.loc_range .with_img img {
+	width: 32px;
+	height: 32px;
+}
+
+.name ._text {
+	width: calc( 100vw - 50px );
+}
+
+.name ._img {
+	width: 36px;
+	height: 36px;
+}
+
+.name ._img > img {
+	width: 90%;
+	height: 90%;
 }
 
 [v-cloak] {
diff --git a/js/shundaijian.js b/js/shundaijian.js
index 0e6f8ae..54afd65 100644
--- a/js/shundaijian.js
+++ b/js/shundaijian.js
@@ -8,6 +8,7 @@ const app = new Vue({
 		return {
 			orderList: [
 			],
+			location: [0,0],
 		}
 	},
 	methods: {
@@ -34,12 +35,22 @@ const app = new Vue({
 					to_address: '测试地址测试地址测试地址测试地址测试地址测试地址',
 					deliver_fee: '8.00',
 					fee: '18.00',
-					before: '2020/20/20 11:20'
+					before: '2020/20/20 11:20',
+					shop_phone: '15270565303',
+					buyer_phone: '15270565304',
+					
 				}
 			]
 		},
 	},
 	created() {
 		this.loadData();
+		plus.geolocation.getCurrentPosition((p) => {
+			console.log(p.coords.latitude);
+			console.log(p.coords.longitude);
+			this.location=[p.coords.latitude, p.coords.longitude];
+		},function (err) {
+			
+		})
 	},
 })
\ No newline at end of file
diff --git a/templete/shundaijian.html b/templete/shundaijian.html
index cdb532e..6a4dd34 100644
--- a/templete/shundaijian.html
+++ b/templete/shundaijian.html
@@ -43,8 +43,31 @@
 		</div>
 		<div id="app" v-cloak>
 			<div class="row clearfix" v-for="(each, index) in orderList" :data-id="each.id">
-				<div class="name">店铺：{{each.from_address}}</div>
-				<div class="name">送至：{{each.to_address}}</div>
+				<div class="name">
+					<span class="_text">店铺：{{each.from_address}}</span>
+					<span class="_img">
+						<img src="../img/lianxishangjia4.png" alt="">
+					</span>
+				</div>
+				<div class="name">
+					<span class="_text">送至：{{each.to_address}}</span>
+					<span class="_img">
+						<img src="../img/lianxishangjia4.png" alt="">
+					</span>
+				</div>
+				<div class="loc_range">
+					<span>我</span>
+					<span class="between">1km</span>
+					<span class="with_img">
+						<img src="../img/gothere.png" alt="">
+						商家
+					</span>
+					<span class="between">2km</span>
+					<span class="with_img">
+						<img src="../img/gothere.png" alt="">
+						购户
+					</span>
+				</div>
 			</div>
 		</div>
 	</body>