图片缓存

App.vue

@@ -28,7 +28,7 @@
 	/*每个页面公共css */
 	//@import 'static/css/style.css';
 	
-	@import 'static/font/iconfont.css';
+	@import '@/assets/font/iconfont.css';
 	.uni-icon-success-no-circle:before {
 	    content: "" !important ;
 		display: none;

static/font/jptime.css → assets/font/jptime.css

@@ -1,6 +1,6 @@
 @font-face {
 	font-family: "JPTIME";
-	src:url("@/static/font/jptime.otf");
+	src:url("@/assets/font/jptime.otf");
 }
 .JPTIME {
     font-family: JPTIME

pages/index/index.vue

@@ -8,14 +8,14 @@
 				</view>
 			</view>
 		</u-navbar>
-		<view class="chargeInfoNull" v-if="list.length==0">
-			<img height="80" width="80" src="static/img/ddc.png" alt="">
-			<p>暂无充电车辆</p>
-		</view>
-	 
+		<view class="chargeInfoNull" v-if="list.length==0">
+			<img height="80" width="80" src="@/assets/img/ddc.png" alt="">
+			<p>暂无充电车辆</p>
+		</view>
+	 
 		
-		<swiper class="swiper" 
-		:current="current" @change="changeswiper" 
+		<swiper class="swiper" 
+		:current="current" @change="changeswiper" 
 		style="    height: 700px;" v-if="list.length!=0">
 			<swiper-item v-for="(item,i) in list" :key="i">
 				<view class="chargeInfo">
@@ -27,31 +27,31 @@
 						通道:{{item.channelNo}}
 					</view>
 				</view>
-				<view class="chargeImg">
-					<img v-if="item.status==0" src="static/img/charge-0.png" alt="">
-					<img v-if="item.status==1" src="static/img/charge-1.png" alt="">
-					 <img v-if="item.status==2" src="static/img/charge-2.png" alt=""> 
-					 <img v-if="item.status==3" src="static/img/charge-3.png" alt="">
-					 <div class="JPTIME JPTIME1"  v-if="item.status==0||item.status==3" v-text="showtime[i]"></div>
+				<view class="chargeImg">
+					<img v-if="item.status==0" src="@/assets/img/charge-0.png" alt="">
+					<img v-if="item.status==1" src="@/assets/img/charge-1.png" alt="">
+					 <img v-if="item.status==2" src="@/assets/img/charge-2.png" alt=""> 
+					 <img v-if="item.status==3" src="@/assets/img/charge-3.png" alt="">
+					 <div class="JPTIME JPTIME1"  v-if="item.status==0||item.status==3" v-text="showtime[i]"></div>
 					  
-				</view>
-				<view class="chargeTime" v-if="item.status==3">
-					<h1>关闭中...</h1>
-					
 				</view>
-				<view class="chargeTime" v-if="item.status==0">
-					<h1>启动中...</h1>
-					请在2分钟内接入电源！
-				</view>
-				<view class="chargeTime" v-if="item.status==2">
-					<h1>充电结束</h1>
-					 {{item.remark}}
+				<view class="chargeTime" v-if="item.status==3">
+					<h1>关闭中...</h1>
+					
+				</view>
+				<view class="chargeTime" v-if="item.status==0">
+					<h1>启动中...</h1>
+					请在2分钟内接入电源！
+				</view>
+				<view class="chargeTime" v-if="item.status==2">
+					<h1>充电结束</h1>
+					 {{item.remark}}
 				</view>
 				<view class="chargeTime" v-if="item.status==1">
 					<p>剩余时长</p>
 					<u-line-progress active-color="#ececec"  height="48" :percent="getPercent(item).percent">
-						<div style="     
-						border-radius: 100px;
+						<div style="     
+						border-radius: 100px;
 						 min-width: 70px;  width: 100%;background-color: rgba(51, 136, 255, 100);height: 8px;">
 							&nbsp;
 							<div class="" style="float: right;
@@ -64,7 +64,7 @@
 										text-align: center;
 										font-family: -apple-system;
 										top: -5px;
-										position: relative;							
+										position: relative;							
 							">{{getPercent(item).value}}</div>
 						</div>
 
@@ -79,261 +79,261 @@
 					</view>
 					<view class="chargeData-item">
 						<u-icon name="dian" custom-prefix="custom-icon" color="#1677ff" size="56"></u-icon>
-						
-										<view class="chargeData-power">
-											<span>0</span>
-											<u-line-progress active-color="#2979ff" :percent="item.chargingPower/9" :show-percent="false"></u-line-progress>
-											<span>{{item.chargingPower?item.chargingPower:0}}W</span>
-										</view>
+						
+										<view class="chargeData-power">
+											<span>0</span>
+											<u-line-progress active-color="#2979ff" :percent="item.chargingPower/9" :show-percent="false"></u-line-progress>
+											<span>{{item.chargingPower?item.chargingPower:0}}W</span>
+										</view>
 
 						<p>充电功率</p>
 					</view>
 				</view>
 				<view class="chargeBtn">
-					<view class="chargeBtn-item" v-if="item.status==1||item.status==0" @click="returnMoney(item)">终止并退款</view>
+					<view class="chargeBtn-item" v-if="item.status==1||item.status==0" @click="returnMoney(item)">终止并退款</view>
 					<view class="chargeBtn-item" v-if="item.status==2" @click="f5(true)">刷新</view>
 					<view class="chargeBtn-item" @click="showTips(item)">费用说明</view>
-				</view>
-				
+				</view>
+				
 				<view class="chargeNext">{{i+1}}/{{list.length}}</view>
 			</swiper-item>
 
-			
+			
 				
 			
-		</swiper>
-		<u-modal v-model="showmodel" title="费用说明" >
-			<p v-if="showitem.length==0">当前为免费充电桩</p>
-			<p v-for="(item,i) in showitem" class="showmodel" :key="i">{{item.minPower}}W-{{item.maxPower}}W <span>{{item.price}}元每小时</span></p>
-			
-		</u-modal>
+		</swiper>
+		<u-modal v-model="showmodel" title="费用说明" >
+			<p v-if="showitem.length==0">当前为免费充电桩</p>
+			<p v-for="(item,i) in showitem" class="showmodel" :key="i">{{item.minPower}}W-{{item.maxPower}}W <span>{{item.price}}元每小时</span></p>
+			
+		</u-modal>
 		<Tabbar :current="0"></Tabbar>
 	</view>
 </template>
 
-<script>
+<script>
 	
 	import Tabbar from '@/components/Tabbar.vue'
 	import * as API from '@/apis/index.js'
 	import {secondsDistance,hourDistanceArr} from '@/utils'
 	export default {
 		data() {
-			return {
-				k:0,
-				id:"",
-				current:"0",
-				showmodel:false,
-				showitem:[],
-				percent:0,
-				list:[],
-				showtime:{},
-				isReady:false,
+			return {
+				k:0,
+				id:"",
+				current:"0",
+				showmodel:false,
+				showitem:[],
+				percent:0,
+				list:[],
+				showtime:{},
+				isReady:false,
 				isCharge:false,
 				detail: {
 
 				},
 				detailIng: {
 
-				},
+				},
 				setTimeoutId:""
 			}
-		},
-		onLoad(op) {
-			if(op.k){
-				this.k=op.k;
-				//如果是扫码 ，或者登陆进来的， 并且没有充电，就跳转到充电页面  k= null
-				//如果是在系统内部访问的，  k=1  不跳转；
-			}
-			
-			if(op.id){
-				this.id=op.id;
-			}
-			uni.showLoading({
-				title: "加载中",
-				mask: true,
-			})
-			this.init(op.phone)
-			setInterval(this.formatDate, 500);
-
-		},
-		 beforeDestroy() {
-		    if (this.formatDate) {
-		      clearInterval(this.formatDate); // 在Vue实例销毁前，清除时间定时器
-		    }
+		},
+		onLoad(op) {
+			if(op.k){
+				this.k=op.k;
+				//如果是扫码 ，或者登陆进来的， 并且没有充电，就跳转到充电页面  k= null
+				//如果是在系统内部访问的，  k=1  不跳转；
+			}
+			
+			if(op.id){
+				this.id=op.id;
+			}
+			uni.showLoading({
+				title: "加载中",
+				mask: true,
+			})
+			this.init(op.phone)
+			setInterval(this.formatDate, 500);
+
+		},
+		 beforeDestroy() {
+		    if (this.formatDate) {
+		      clearInterval(this.formatDate); // 在Vue实例销毁前，清除时间定时器
+		    }
 		  },
-		methods: {
-			changeswiper(e){
-				this.current=e.detail.current;
-			},
-			formatDate(){
-				for(var i in this.list){
-					var obj=this.list[i];
-					var second=0;
-					
-					if(obj.status==0){
-						second=secondsDistance(obj.createTime);
-					}
-					if(obj.status==3){
-						second=secondsDistance(obj.updateTime);
-					}
-					//obj.showtime=this.getShowTime(obj);
-					var ms=60*2-second;
-					if(ms>0){
-						var Hour = parseInt(Math.floor(ms / (60 )));
-						var Fen = parseInt(Math.floor(ms %60 ));
-						this.showtime[i]=(Hour>9?"":"0")+Hour+":"+(Fen>9?"":"0")+Fen
-						 		
-					}else{
-						this.showtime[i]="00:00";
-					}
-					
-					this.$forceUpdate()
-					
-				}
-			},
-			
-			getPercent(item){
-				var obj={
-					
-				}
-				if(item.status==1){
-					 
-					var second=secondsDistance(item.startTime);
-					if(second>0){
-						
-						obj.percent=(second/60)/item.estimateMinute*100;
-						var ms=item.estimateMinute*60-second
-						if(ms>0){
-							var Hour = parseInt(Math.floor(ms / (60 * 60)));
-							var Fen = parseInt(Math.floor(ms % (60 * 60) / 60));
-							obj.value=(Hour>9?"":"0")+Hour+":"+(Fen>9?"":"0")+Fen
-						}
-					
-					}
-				}
-				if(item.status==0){
-					obj.value="启动中"
-					obj.percent="50";
-				}
-				if(item.status==2){
-					obj.value="关闭中"
-					obj.percent="50";
-				}
-				//特殊情况默认值
-				if(!obj.value){
-					obj.value="00:00"
-				}
-				if(!obj.percent){
-					obj.percent="100";
-				}
-				
-				return obj;
+		methods: {
+			changeswiper(e){
+				this.current=e.detail.current;
 			},
-			showTips(item) {
-				this.showmodel=true;
-				this.showitem=item.chargingPriceList;
+			formatDate(){
+				for(var i in this.list){
+					var obj=this.list[i];
+					var second=0;
+					
+					if(obj.status==0){
+						second=secondsDistance(obj.createTime);
+					}
+					if(obj.status==3){
+						second=secondsDistance(obj.updateTime);
+					}
+					//obj.showtime=this.getShowTime(obj);
+					var ms=60*2-second;
+					if(ms>0){
+						var Hour = parseInt(Math.floor(ms / (60 )));
+						var Fen = parseInt(Math.floor(ms %60 ));
+						this.showtime[i]=(Hour>9?"":"0")+Hour+":"+(Fen>9?"":"0")+Fen
+						 		
+					}else{
+						this.showtime[i]="00:00";
+					}
+					
+					this.$forceUpdate()
+					
+				}
 			},
-			returnMoney(item) {
+			
+			getPercent(item){
+				var obj={
+					
+				}
+				if(item.status==1){
+					 
+					var second=secondsDistance(item.startTime);
+					if(second>0){
+						
+						obj.percent=(second/60)/item.estimateMinute*100;
+						var ms=item.estimateMinute*60-second
+						if(ms>0){
+							var Hour = parseInt(Math.floor(ms / (60 * 60)));
+							var Fen = parseInt(Math.floor(ms % (60 * 60) / 60));
+							obj.value=(Hour>9?"":"0")+Hour+":"+(Fen>9?"":"0")+Fen
+						}
+					
+					}
+				}
+				if(item.status==0){
+					obj.value="启动中"
+					obj.percent="50";
+				}
+				if(item.status==2){
+					obj.value="关闭中"
+					obj.percent="50";
+				}
+				//特殊情况默认值
+				if(!obj.value){
+					obj.value="00:00"
+				}
+				if(!obj.percent){
+					obj.percent="100";
+				}
 				
-				uni.showModal({
-				    title: '停止充电确认',
-					showCancel:true,
-				    content: '您确定要停止充电吗？停止后将不再充电并退款到余额',
-				    success: res=> {
-				        if (res.confirm) {
-				           this.stopCharging(item)
-							
-				        } else if (res.cancel) {
-				            console.log('用户点击取消');
-				        }
-				    }
+				return obj;
+			},
+			showTips(item) {
+				this.showmodel=true;
+				this.showitem=item.chargingPriceList;
+			},
+			returnMoney(item) {
+				
+				uni.showModal({
+				    title: '停止充电确认',
+					showCancel:true,
+				    content: '您确定要停止充电吗？停止后将不再充电并退款到余额',
+				    success: res=> {
+				        if (res.confirm) {
+				           this.stopCharging(item)
+							
+				        } else if (res.cancel) {
+				            console.log('用户点击取消');
+				        }
+				    }
 				});
-			},
-			stopCharging(item){
-				uni.showLoading({
-					title: "加载中",
-					mask: true,
-				})
-				var data = {
-					chargingRecordId:item.id,
-					channelNo:item.channelNo,
-					deviceNo:item.deviceNo,
-				};
-				API.stopCharging(data).then((res) => {
-					this.f5(true)
-				}).catch(error => {
-					
-					uni.showToast({
-						title: error
-					})
-				})
-			},
-			init(phone){
-				if(!phone){
-					phone=""
-				}
-				// uni.showLoading({
-				// 	title: "加载中",
-				// 	mask: true,
-				// })
-				var data = {
-					phone:phone
-				};
-				API.findChargeData(data).then((res) => {
-					
-					if( res.data.chargingRecordList.length!=this.list.length){
-						this.current=0;
-					}
-					
-					this.list = res.data.chargingRecordList;
-					this.isCharge=res.data.isCharge;
-					this.isReady=true;
-					if(!this.isCharge&&this.k!=1){
-						this.gotoUrl("pages/charge/index?id="+this.id)
-					}else{
-						uni.hideLoading()
-					}
-					if(this.list.length>0){
-						//防止定时器重复调用
-						if(this.setTimeoutId==""){
-							for(var i in this.list){
-								var item=this.list[i];
-								
-								if(item.status==0||item.status==3){
-									this.setTimeoutId=setTimeout(()=>{
-										this.setTimeoutId="";
-										this.f5()
-									},5*1000)
-								}else if(item.status==1&&item.startTime){		
-									var second=secondsDistance(item.startTime);
-									var ms=item.estimateMinute*60-second
-									if(ms<60*10){
-										this.setTimeoutId=setTimeout(()=>{
-											this.setTimeoutId="";
-											this.f5()
-										},5*1000)
-									}
-								}
-							}
-						}
-					}else{
-						this.setTimeoutId=""
-					}
-					
-				}).catch(error => {
-					uni.showToast({
-						title: error
-					})
-				})
 			},
-			f5(bl) {
-			
-				if(bl){
-					uni.showLoading({
-						title: "加载中",
-						mask: true,
-					})
-				}
+			stopCharging(item){
+				uni.showLoading({
+					title: "加载中",
+					mask: true,
+				})
+				var data = {
+					chargingRecordId:item.id,
+					channelNo:item.channelNo,
+					deviceNo:item.deviceNo,
+				};
+				API.stopCharging(data).then((res) => {
+					this.f5(true)
+				}).catch(error => {
+					
+					uni.showToast({
+						title: error
+					})
+				})
+			},
+			init(phone){
+				if(!phone){
+					phone=""
+				}
+				// uni.showLoading({
+				// 	title: "加载中",
+				// 	mask: true,
+				// })
+				var data = {
+					phone:phone
+				};
+				API.findChargeData(data).then((res) => {
+					
+					if( res.data.chargingRecordList.length!=this.list.length){
+						this.current=0;
+					}
+					
+					this.list = res.data.chargingRecordList;
+					this.isCharge=res.data.isCharge;
+					this.isReady=true;
+					if(!this.isCharge&&this.k!=1){
+						this.gotoUrl("pages/charge/index?id="+this.id)
+					}else{
+						uni.hideLoading()
+					}
+					if(this.list.length>0){
+						//防止定时器重复调用
+						if(this.setTimeoutId==""){
+							for(var i in this.list){
+								var item=this.list[i];
+								
+								if(item.status==0||item.status==3){
+									this.setTimeoutId=setTimeout(()=>{
+										this.setTimeoutId="";
+										this.f5()
+									},5*1000)
+								}else if(item.status==1&&item.startTime){		
+									var second=secondsDistance(item.startTime);
+									var ms=item.estimateMinute*60-second
+									if(ms<60*10){
+										this.setTimeoutId=setTimeout(()=>{
+											this.setTimeoutId="";
+											this.f5()
+										},5*1000)
+									}
+								}
+							}
+						}
+					}else{
+						this.setTimeoutId=""
+					}
+					
+				}).catch(error => {
+					uni.showToast({
+						title: error
+					})
+				})
+			},
+			f5(bl) {
+			
+				if(bl){
+					uni.showLoading({
+						title: "加载中",
+						mask: true,
+					})
+				}
 				this.k=1;
 				this.init()
 			},
@@ -341,31 +341,31 @@
 		components: {
 			Tabbar
 
-		},onShow() {
-			if(this.isReady){
-				this.f5(true)
-			}
+		},onShow() {
+			if(this.isReady){
+				this.f5(true)
+			}
 		}
 	}
 </script>
 
-<style lang="scss" scoped>
-	@import '@/static/font/jptime.css';
-	
-	.JPTIME1{
-		    position: relative;
-		    bottom: 170px;
-		    font-size: 40px;
-		    text-align: center;
-		    color: #eee;
-	}
-	.showmodel{
-		  margin-left: 20px;
-		   margin-right: 20px;
-		  span{
-		  	 float: right;
-		  }
-	}
+<style lang="scss" scoped>
+	@import '@/assets/font/jptime.css';
+	
+	.JPTIME1{
+		    position: relative;
+		    bottom: 170px;
+		    font-size: 40px;
+		    text-align: center;
+		    color: #eee;
+	}
+	.showmodel{
+		  margin-left: 20px;
+		   margin-right: 20px;
+		  span{
+		  	 float: right;
+		  }
+	}
 	
 	.slot-wrap {
 		display: flex;
@@ -373,30 +373,30 @@
 		justify-content: space-between;
 		flex: 1;
 	}
-	.chargeNext{
-		background:rgba(0,0,0,0.5);
-		color:#fff;
-		float: right;
-		padding: 5px 15px;
-		border-radius: 15px;
-		font-size: 12px;
-		margin-bottom: 10px;
-		margin-right: 10px;
-	}
+	.chargeNext{
+		background:rgba(0,0,0,0.5);
+		color:#fff;
+		float: right;
+		padding: 5px 15px;
+		border-radius: 15px;
+		font-size: 12px;
+		margin-bottom: 10px;
+		margin-right: 10px;
+	}
 
 	.navbar-right {
 		display: flex;
 		margin-right: 20rpx;
 		align-items: center;
 	}
-.chargeInfoNull{
-		text-align: center;
-		padding:100px 0 50px;
-		p{
-			color:#999;
-			font-size: 20px;
-			margin-top: 10px;
-		}
+.chargeInfoNull{
+		text-align: center;
+		padding:100px 0 50px;
+		p{
+			color:#999;
+			font-size: 20px;
+			margin-top: 10px;
+		}
 	}
 	.chargeInfo {
 		padding: 10px;
@@ -474,24 +474,24 @@
 				color: #1677FF;
 				margin: 10px 0;
 			}
-						.chargeData-power{
-							display: flex;
-							align-items: center;
-							display: flex;
-							width: 120px;
-							text-align: center;
-							height: 31px;
-							margin: 10px 0;
-							span{
-								font-size: 14px;
-								color:#1677FF;
-								margin: 0 5px;
-							}
-							}
+						.chargeData-power{
+							display: flex;
+							align-items: center;
+							display: flex;
+							width: 120px;
+							text-align: center;
+							height: 31px;
+							margin: 10px 0;
+							span{
+								font-size: 14px;
+								color:#1677FF;
+								margin: 0 5px;
+							}
+							}
 
 			p {
 				color: #999;
 			}
 		}
 	}
-</style>
+</style>

pages/index/none.vue

@@ -31,8 +31,8 @@
 						customIcon: true,
 					},
 					{
-						iconPath: "/static/img/min_button_select.png",
-						selectedIconPath: "/static/img/min_button_select.png",
+						iconPath: "/@/assets/img/min_button_select.png",
+						selectedIconPath: "/@/assets/img/min_button_select.png",
 						text: '充电中',
 						midButton: true,
 						customIcon: true,

vue.config.js

@@ -8,19 +8,10 @@ function resolve(dir) {
 	return path.join(__dirname, dir)
 }
 
-let title = '';
-if (process.env.VUE_APP_NODE_NAME == 'production') {
-	title = ''
-} else if (process.env.VUE_APP_NODE_NAME == 'test') {
-	title = '(测试)'
-} else {
-	title = '(开发)'
-}
-
 const Timestamp = new Date().getTime();
 module.exports = {
 	publicPath: './',
-	outputDir: 'dist/' + process.env.NODE_ENV,
+	outputDir: 'dist/' ,
 	assetsDir: 'static',
 	lintOnSave: false,
 	devServer: {
@@ -41,6 +32,14 @@ module.exports = {
 		config.plugins.delete('preload-index');
 		config.plugins.delete('prefetch-index');
 		
+		config.module.rule('images')
+		           .test(/\.(png|jpe?g|gif|webp)(\?.*)?$/)
+		           .use('url-loader')
+		           .loader('file-loader')
+		           .options({
+		               name: 'static/img/[name].[hash:8].[ext]'
+		           })
+				
 		config.optimization.minimize(true);
 	},
 	configureWebpack: config => {