2021-3-15

pages/disandpests/index.vue

@@ -3,7 +3,9 @@
 		<view style="position: fixed;z-index: 100;">
 			<uni-nav-bar @clickLeft="clickLeft" left-icon="back" title="病虫害识别"></uni-nav-bar>
 		</view>
-		<image :src="path" mode="" class="image"></image>
+		<view class="image_box">
+			<image :src="path" mode="widthFix" class="image"></image>
+		</view>
 		<view class="recognition" v-if="datasTF">
 			<p class="recognition_title">{{name}}</p>
 			<view :class="tishi?'recognition_img':'recognition_img_two'">
@@ -21,6 +23,7 @@
 				</view>
 				<p class="prevention_con">{{item}}</p>
 			</view>
+			<button class="recognition_details" v-if="tishi" @click="examine">查看图片</button>
 		</view>
 		<u-modal v-model="show" :mask-close-able="true" title="" :show-cancel-button="true" confirm-text="拍病害" cancel-text="拍虫害"
 		 content="拍照识别病虫害" @confirm="confirm" @cancel="cancel"></u-modal>
@@ -97,7 +100,7 @@
 				})
 			},
 			examine() {
-				this.datasTF = false
+				this.datasTF = !this.datasTF
 			},
 			confirm() {
 				this.flag = 1
@@ -199,19 +202,24 @@
 </script>
 
 <style lang="scss">
-	.image {
+	
+	.image_box{
 		position: absolute;
 		top: 44px;
 		width: 100%;
 		height: 400rpx;
+		display: flex;
+		justify-content: center;
+		.image {
+			margin: 0 auto;
+		}
 	}
-
 	.recognition {
 		position: absolute;
-		top: 244px;
+		top: 254px;
 		width: 100%;
 		height: 800rpx;
-
+		
 		.recognition_title {
 			width: 100%;
 			text-align: center;
@@ -272,6 +280,15 @@
 			font-weight: 700;
 			margin-left: 30rpx;
 		}
+		.recognition_details {
+			width: 400rpx;
+			height: 80rpx;
+			border-radius: 40rpx;
+			margin: 30rpx auto;
+			font-size: 30rpx;
+			background-color: #67B25F;
+			color: #FFFFFF;
+		}
 	}
 	.prevention{
 		font-size: 28rpx;

pages/index/index.vue

@@ -17,7 +17,7 @@
 		</view>
 		<u-modal v-model="show" :mask-close-able="true" title="" :show-cancel-button="true" confirm-text="拍病害" cancel-text="拍虫害"
 		 content="拍照识别病虫害" @confirm="confirm" @cancel="cancel"></u-modal>
-		<kps-image-cutter @ok="onok" @cancel="oncancle" :url="url" :fixed="false" :blob="false" :maxWidth="500" :maxHeight="500"></kps-image-cutter>
+		<kps-image-cutter @ok="onok" @cancel="oncancle" :url="url" :fixed="false" :blob="true" :maxWidth="500" :maxHeight="380" :height="380"></kps-image-cutter>
 	</view>
 </template>
 
@@ -128,6 +128,10 @@
 			},
 			onok(ev) {
 				this.path = this.url
+				console.log(ev)
+				uni.showLoading({
+				    title: '加载中'
+				});
 				if(this.flag == 2){
 					// pest.pests.insect_discern 虫害
 					uni.uploadFile({
@@ -139,14 +143,17 @@
 							'user': 'test'
 						},
 						success: (uploadFileRes) => {
-							console.log(uploadFileRes)
+							console.log(JSON.parse(uploadFileRes.data))
 							uni.navigateTo({
-								url: "../disandpests/index?datas=" + uploadFileRes.data + "&path=" + this.path
+								url: "../disandpests/index?datas=" + uploadFileRes.data + "&path=" + ev.path
 							})
 						}
 					});
 				}else if(this.flag == 1){
 					//pest.pests.insect_discern病害识别
+					uni.showLoading({
+					    title: '加载中'
+					});
 					uni.uploadFile({
 						// url: 'http://182.92.193.64:8002/api/api_gateway?method=base.bases.base_photo', //仅为示例，非真实的接口地址
 						url: 'http://182.92.193.64:8002/api/api_gateway?method=pest.pests.plant_discern', //仅为示例，非真实的接口地址
@@ -158,7 +165,7 @@
 						success: (uploadFileRes) => {
 							console.log(JSON.parse(uploadFileRes.data))
 							uni.navigateTo({
-								url: "../disandpests/index?datas="+uploadFileRes.data + "&path=" + this.path
+								url: "../disandpests/index?datas="+uploadFileRes.data + "&path=" + ev.path
 							})
 						}
 					});