lilei преди 3 години
родител
ревизия
d29eb99f10
променени са 7 файла, в които са добавени 187 реда и са изтрити 10 реда
  1. 18 0
      pages.json
  2. 8 1
      pages/index/index.vue
  3. 8 2
      pages/vinInput/confirmVin.vue
  4. 78 0
      pages/vinInput/share.vue
  5. 8 7
      pages/vinInput/vinInput.vue
  6. 67 0
      pages/vinRecord/vinRecord.vue
  7. BIN
      static/share1.jpg

+ 18 - 0
pages.json

@@ -76,6 +76,24 @@
             }
             
         }
+        ,{
+            "path" : "pages/vinInput/share",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "分享VIN",
+                "navigationStyle":"custom"
+            }
+            
+        }
+        ,{
+            "path" : "pages/vinRecord/vinRecord",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "VIN查询记录",
+                "enablePullDownRefresh": false
+            }
+            
+        }
     ],
 	"globalStyle": {
 		"navigationBarTextStyle": "black",

+ 8 - 1
pages/index/index.vue

@@ -35,7 +35,7 @@
 			</view>
 			<!-- 扫描记录 -->
 			<u-cell-group :border="false">
-				<u-cell-item title="扫描记录" :title-style="{fontSize:'1.1em'}" value="查看全部">
+				<u-cell-item title="扫描记录" @click="toAllRecord" :title-style="{fontSize:'1.1em'}" value="查看全部">
 					<u-icon slot="icon" size="38" color="#00aaff" style="margin-right: 0.3em;" name="order"></u-icon>
 				</u-cell-item>
 			</u-cell-group>
@@ -93,10 +93,17 @@
 
 		},
 		methods: {
+			// 去扫描
 			openCamera(){
 				uni.navigateTo({
 					url: "/pages/scan-frame/scan-frame"
 				})
+			},
+			// 查看扫描记录
+			toAllRecord(){
+				uni.navigateTo({
+					url: "/pages/vinRecord/vinRecord"
+				})
 			}
 		}
 	}

+ 8 - 2
pages/vinInput/confirmVin.vue

@@ -7,7 +7,10 @@
 		<view class="vin-img" v-if="vinImg">
 			<u-image :src="vinImg" width="100%" height="165"></u-image>
 		</view>
-		<xt-verify-code v-model="verifyCode" inputType='text' size="17" @confirm="confirm"></xt-verify-code>
+		<!-- <xt-verify-code v-model="verifyCode" inputType='text' size="17" @confirm="confirm"></xt-verify-code> -->
+		<view style="padding: 30rpx 60rpx;margin-top: 20rpx;">
+			<u-input v-model="verifyCode" :custom-style="{fontSize:'40rpx'}" type="text" height="90" :maxlength='17' input-align="center" placeholder="请输入VIN" :border="true" />
+		</view>
 		<view class="confirm-button">
 			<u-button @click="ok" :custom-style="{background:'#1283d4'}" type="primary" shape="circle">确认</u-button>
 		</view>
@@ -42,6 +45,7 @@
 			this.verifyCode = opts.verifyCode
 			this.vinImg = opts.filePath || ''
 		},
+		// 分享
 		onShareAppMessage(e){
 			console.log(e)
 			return {
@@ -58,11 +62,13 @@
 			}
 		},
 		methods: {
+			// 重新扫描
 			toScan(){
-				uni.navigateTo({
+				uni.redirectTo({
 					url: "/pages/scan-frame/scan-frame"
 				})
 			},
+			// 复制
 			toCopy(){
 				uni.setClipboardData({
 					data: this.verifyCode,

+ 78 - 0
pages/vinInput/share.vue

@@ -0,0 +1,78 @@
+<template>
+	<view class="share-body">
+		<view class="share-head">
+			<u-image src="@/static/share1.jpg" width='750' height="253"></u-image>
+		</view>
+		<view class="share-info">
+			<view class="userinfo">
+				<view>
+					好友 MAK2342
+				</view>
+				<view>给您分享了一个车架号(VIN)</view>
+			</view>
+			<view class="carinfo flex flex_column align_center">
+				<view>
+					<u-image shape="circle" src="@/static/share1.jpg" width='150' height="150"></u-image>
+				</view>
+				<view>VIN:LFV2A21K0G4053021</view>
+				<view>马自达 CX-5(KE 2012-2017) 2.0L | 手自一体 2014款 都市型</view>
+			</view>
+			<view class="cbutton flex align_center justify_between">
+				<u-button @click="copyVin" shape="circle">复制VIN</u-button>
+				<u-button @click="copyCar" shape="circle">复制车型</u-button>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				carInfo: null,
+				userInfo: null
+			}
+		},
+		onShareAppMessage(){},
+		methods: {
+			// 复制vin
+			copyVin(){
+				uni.setClipboardData({
+					data: this.carInfo.vinNumber||'',
+				})
+			},
+			// 复制车型
+			copyCar(){
+				uni.setClipboardData({
+					data: this.carInfo.carModel||'',
+				})
+			},
+		}
+	}
+</script>
+
+<style lang="less">
+.share-info{
+	background-image: linear-gradient(#bceafa 0%,#ffffff 60%);
+	padding: 30rpx;
+	text-align: center;
+	.userinfo{
+		padding: 30rpx;
+		>view{
+			padding: 10rpx 0;
+		}
+	}
+	.carinfo{
+		padding: 30rpx;
+		>view{
+			padding: 15rpx 0;
+		}
+	}
+	.cbutton{
+		padding: 30rpx;
+		button{
+			width: 260rpx;
+		}
+	}
+}
+</style>

+ 8 - 7
pages/vinInput/vinInput.vue

@@ -1,6 +1,8 @@
 <template>
 	<view style="width: 100%;">
-		<xt-verify-code v-model="verifyCode" inputType='text' size="17" @confirm="confirm"></xt-verify-code>
+		<view style="padding: 30rpx 60rpx;margin-top: 10vh;">
+			<u-input v-model="verifyCode" type="text" :custom-style="{fontSize:'40rpx'}" height="90" :maxlength='17' input-align="center" placeholder="请输入VIN" :border="true" focus />
+		</view>
 		<view class="confirm-button">
 			<u-button @click="ok" type="primary" :custom-style="{background:'#1283d4'}" shape="circle">确认输入</u-button>
 		</view>
@@ -9,18 +11,17 @@
 
 <script>
 	export default {
+		components: {},
 		data() {
 			return {
 				verifyCode: ''
 			}
 		},
+		onLoad() {
+		},
 		methods: {
-			confirm(code){
-				console.log(code)
-				this.verifyCode = code
-			},
 			ok(){
-				if(this.verifyCode==''){
+				if(this.verifyCode==''||this.verifyCode.length<17){
 					uni.showToast({
 						title: "请输入VIN码",
 						icon:"none"
@@ -30,7 +31,7 @@
 						url: "/pages/vinInput/confirmVin?verifyCode="+this.verifyCode
 					})
 				}
-			}
+			},
 		}
 	}
 </script>

+ 67 - 0
pages/vinRecord/vinRecord.vue

@@ -0,0 +1,67 @@
+<template>
+	<view>
+		<view class="des">仅可查看最近7天的VIN查询记录</view>
+		<view class="list-box" v-for="item in 35">
+			<view class="list-item flex align_center justify_between">
+				<view>
+					<u-image shape="circle" src="@/static/share1.jpg" width='90' height="90"></u-image>
+				</view>
+				<view>
+					<view class="flex align_center justify_between">
+						<text class="vin-text">LFV2A21K0G4053021</text>
+						<text class="time-text">2022-05-21 15:23:33</text>
+					</view>
+					<view>马自达 CX-5(KE 2012-2017) 2.0L | 手自一体 2014款 都市型</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			}
+		},
+		methods: {
+			
+		}
+	}
+</script>
+
+<style lang="less">
+.des{
+	text-align: center;
+	color: #999;
+	font-size: 12px;
+	padding: 20rpx 15rpx;
+}
+.list-item{
+	margin: 30rpx;
+	border:2rpx solid #f8f8f8;
+	box-shadow: 2rpx 2rpx 6rpx #eee;
+	border-radius: 20rpx;
+	padding: 20rpx 15rpx;
+	> view{
+		padding: 0 10rpx;
+		&:last-child{
+			>view{
+				padding: 10rpx 0;
+			}
+		}
+	}
+	.time-text{
+		font-size: 10px;
+		color: #999;
+	}
+	&:first-child{
+		margin-top: 10rpx;
+	}
+	&:active{
+		opacity: 0.6;
+		transform:scale(0.9);
+	}
+}
+</style>

BIN
static/share1.jpg