.

pages/index.vue

@@ -19,7 +19,6 @@
 			<button @click="mqttSubscribes">订阅</button>
 		</view>
 	</u-popup>
-
 	<!-- 内容 -->
 	<view class="content">
 		<!-- 顶部搜索框 -->
@@ -300,7 +299,8 @@
 																	</view>
 																	<view class="bottom"></view>
 																</view>
-																<image src="../static/images/valves/3/valve3.png"
+																<image
+																	:src="valveImg[dc.dataObj[child.dataKey].valveImg]"
 																	mode="widthFix" />
 															</view>
 															<view>
@@ -399,7 +399,8 @@
 																		{{ dc.dataObj[child.dataKey].adc.p[3] }}
 																	</view>
 																</view>
-																<image src="../static/images/valves/5/valve5.png"
+																<image
+																	:src="valveImg[dc.dataObj[child.dataKey].valveImg]"
 																	mode="widthFix" />
 															</view>
 															<view style="display: flow-root;">
@@ -466,8 +467,12 @@
 																		无数据上报
 																	</view>
 																</view>
-																<image src="../static/images/valves/3/valve3.png"
+																<image mode="widthFix"
-																	mode="widthFix" />
+																	v-if="child.device.deviceTypeKey == 'valve'"
+																	:src="valveImg['valve3_close']" />
+																<image mode="widthFix"
+																	v-if="child.device.deviceTypeKey == 'fiveValve'"
+																	:src="valveImg['valve5_0000']" />
 															</view>
 														</view>
 													</u-col>
@@ -506,6 +511,7 @@
 
 <script>
 	import store from "@/store"
+	import * as imageAssets from '@/utils/indexUtil/imageAssets.js'
 
 	export default {
 		data() {
@@ -514,6 +520,7 @@
 				title: "",
 				ijs: getApp().ijs, // 首页公共js
 				dc: getApp().dc, // 设备控制公共代码
+				valveImg: imageAssets, //阀门图片
 				mqttshow: false, // h5端手动链接mqtt按钮显示
 				mqttConnected: false, //	mqtt链接状态
 				screenValue: "", // 关键字搜索

utils/indexUtil/imageAssets.js

@@ -0,0 +1,50 @@
+// 导入图片并存储在变量中
+import valve3_close from "@/static/images/valves/3/valve3_close.png"
+import valve3_open from "@/static/images/valves/3/valve3_open.gif"
+import valve3_open1 from "@/static/images/valves/3/valve3_open1.gif"
+import valve3_open2 from "@/static/images/valves/3/valve3_open2.gif"
+import valve3_run from "@/static/images/valves/3/valve3_run.gif"
+
+import valve5_0000 from "@/static/images/valves/5/valve5_0000.png"
+import valve5_0001 from "@/static/images/valves/5/valve5_0001.gif"
+import valve5_0010 from "@/static/images/valves/5/valve5_0010.gif"
+import valve5_0011 from "@/static/images/valves/5/valve5_0011.gif"
+import valve5_0100 from "@/static/images/valves/5/valve5_0100.gif"
+import valve5_0101 from "@/static/images/valves/5/valve5_0101.gif"
+import valve5_0110 from "@/static/images/valves/5/valve5_0110.gif"
+import valve5_0111 from "@/static/images/valves/5/valve5_0111.gif"
+import valve5_1000 from "@/static/images/valves/5/valve5_1000.gif"
+import valve5_1001 from "@/static/images/valves/5/valve5_1001.gif"
+import valve5_1010 from "@/static/images/valves/5/valve5_1010.gif"
+import valve5_1011 from "@/static/images/valves/5/valve5_1011.gif"
+import valve5_1100 from "@/static/images/valves/5/valve5_1100.gif"
+import valve5_1101 from "@/static/images/valves/5/valve5_1101.gif"
+import valve5_1110 from "@/static/images/valves/5/valve5_1110.gif"
+import valve5_1111 from "@/static/images/valves/5/valve5_1111.gif"
+import valve5_run from "@/static/images/valves/5/valve5_run.gif"
+
+// 导出这个对象以便在其他地方使用
+export {
+	valve3_close,
+	valve3_open,
+	valve3_open1,
+	valve3_open2,
+	valve3_run,
+	valve5_0000,
+	valve5_0001,
+	valve5_0010,
+	valve5_0011,
+	valve5_0100,
+	valve5_0101,
+	valve5_0110,
+	valve5_0111,
+	valve5_1000,
+	valve5_1001,
+	valve5_1010,
+	valve5_1011,
+	valve5_1100,
+	valve5_1101,
+	valve5_1110,
+	valve5_1111,
+	valve5_run,
+};