修复类型页面图片全都显示一样的问题。

api/common/index.js

@@ -17,6 +17,13 @@ export function deviceTypeList(params) {
 	})
 }
 
+export function typeAll(){
+	return request({
+		url: '/app/xinghan/device/typeAll',
+		method: 'get'
+	});
+}
+
 // 删除设备列表接口
 export function deviceUnbind(id) {
 	return request({

pages/common/allType/index.vue

@@ -2,7 +2,7 @@
 	<view class="alltype">
 		<!-- 车辆列表 -->
 		<view class="vehicle-list" v-if="vehicles.length>0">
-			<view v-for="(item, index) in vehicles" :key="index">
+			<view class="typeContent" v-for="(item, index) in vehicles" :key="index">
 				<view class="vehicle-item" @click="alltypeInfo(item)">
 					<image :src="item.img" mode="aspectFit" class="IMG"></image>
 				</view>
@@ -20,6 +20,7 @@
 <script>
 	import {
 		deviceTypeList,
+		typeAll
 	} from '@/api/common/index.js'
 	export default {
 		data() {
@@ -90,25 +91,50 @@
 		},
 		methods: {
 			getTab() {
-				deviceTypeList({}).then((res) => {
-					if (res.code == 200) {
-						for (var i = 0; i < res.data.length; i++) {
-							var item = res.data[i];
+				let p1 = deviceTypeList({});
+				let p2 = typeAll();
 
-							item.img="/static/images/common/bip.6.png";
+				Promise.allSettled([p1, p2]).then(result => {
+					let res = result[0].status === 'fulfilled' ? result[0].value : {};
+					let res1 = result[1].status === 'fulfilled' ? result[1].value : {};
+					if (res.code == 200) {
+						if (res1.code != 200) {
+							for (let i = 0; i < res.data.length; i++) {
 								let f = this.typeImgs.find(v => {
-								if(item.typeName.toLowerCase()===v.Name.toLowerCase()){
+									if (res.data[i].typeName.toLowerCase() === v.Name.toLowerCase()) {
 										return true;
 									}
 									return false;
 								});
 								if (f) {
-								item.img=f.url;
+									res.data[i].img = f.url;
+								}else{
+									res.data[i].img = "/static/images/common/bip.6.png";
+								}
+							}
+						
+						} else {
+							let all = res1.data;
+							for (let i = 0; i < res.data.length; i++) {	
+								let f = all.find(v => {
+									if (res.data[i].id === v.deviceTypeId) {
+										return true;
+									}
+									return false;
+								});
+								if (f && f.devicePic) {
+									res.data[i].img = f.devicePic;
+								}else{
+									res.data[i].img = "/static/images/common/bip.6.png";
+								}
 							}							
 						}
 						this.vehicles = res.data;
+
 					}
-				})
+
+				});
+
 			},
 			alltypeInfo(item) {
 				uni.switchTab({
@@ -139,8 +165,10 @@
 	.vehicle-list {
 		display: flex;
 		flex-wrap: wrap;
+		flex-direction: row;
+		align-content: center;
+		justify-content: space-around;
 		align-items: center;
-		text-align: center;
 
 	}
 
@@ -151,14 +179,17 @@
 	}
 
 	.vehicle-item {
-		padding: 24rpx 0;
+
 		background: rgba(26, 26, 26, 1);
-		border-radius: 16rpx;
-		width: 156rpx;
-		height: 156rpx;
-		margin-right: 16rpx;
-		margin-bottom: 16rpx;
-		line-height: 156rpx;
+		border-radius: 9px;
+		width: 140rpx;
+		height: 140rpx;
+
+		margin-bottom: 15rpx;
+
+		display: grid;
+		align-content: center;
+		justify-content: center;
 
 	}
 
@@ -170,6 +201,9 @@
 
 	.plate-number {
 		color: rgba(255, 255, 255, 0.87);
+		font-size: 27rpx;
+		font-family: 'PingFang SC';
+		text-align: center;
 	}
 
 	.noDATA {
@@ -177,4 +211,8 @@
 		color: rgba(255, 255, 255, 0.87);
 		transform: translate(-0%, 100%);
 	}
+
+	.typeContent {
+		padding-bottom: 15rpx;
+	}
 </style>

pages/common/index/index.vue

@@ -316,11 +316,9 @@
 								let battary = 0;
 								if ('battary' in f.formData) {
 									battary = f.formData.battary;
-								}
-								else if('sta_PowerPercent' in f.formData){
+								} else if ('sta_PowerPercent' in f.formData) {
 									battary = f.formData.sta_PowerPercent;
-								}
-								else if('sta_battery' in f.formData){
+								} else if ('sta_battery' in f.formData) {
 									battary = f.formData.sta_battery;
 								}
 								this.$set(this.deviceList[i], 'battery', battary);
@@ -459,7 +457,8 @@
 								this.total = res.total;
 								// 判断是否加载完成
 								let hasNext = true;
-								if (res.rows.length < this.size || this.deviceList.length >= this.total) {
+								if (res.rows.length < this.size || this.deviceList.length >= this
+									.total) {
 									hasNext = false;
 								} else {
 									hasNext = true;
@@ -548,7 +547,9 @@
 			},
 			// 右滑点击事件处理
 			handleSwipeClick(e, item, index) {
-				const {content} = e
+				const {
+					content
+				} = e
 				setTimeout(() => {
 					console.log(item, 'eeeee');
 					switch (e.content.text) {
@@ -747,6 +748,7 @@
 			},
 		},
 		onShow() {
+			
 			if (ble) {
 				//因为vue视图只能后退不能隐藏后再显示
 				//所以回到首页后将其他所有页面的订阅都删除
@@ -754,7 +756,7 @@
 			}
 		},
 		onLoad() {
-			debugger;
+			
 			console.error("首页加载");
 			this.getTab()
 			this.downCallback();
@@ -807,6 +809,7 @@
 			uni.$off('refreshDeviceList');
 		},
 		onUnload() {
+			
 			uni.$off('deviceStatusUpdate');
 			ble && ble.removeAllCallback(pagePath);
 		}
@@ -1181,6 +1184,7 @@
 		background-color: rgba(35, 35, 35, 0.87);
 		color: rgba(255, 255, 255, 1);
 	}
+
 	.mask {
 		position: fixed;
 		width: 100%;
@@ -1188,6 +1192,7 @@
 		z-index: 9998;
 		background-color: #00000000;
 	}
+
 	/* 提示框样式 */
 	.tooltip-box {
 		position: fixed;