|
@@ -5,10 +5,14 @@
|
|
|
<view v-if="exiting.visible" class="exiting">
|
|
|
<view class="app-flex c-center column contet">
|
|
|
<view class="exiting-title">长按停止按钮结束充电</view>
|
|
|
- <view class="countdown-ring" :class="{active:exiting.lock}" @touchstart="exiting.lock=true" @touchend="exiting.lock=false">
|
|
|
+ <view class="countdown-ring" :class="{active:exiting.lock}" @touchstart="exiting.lock=true"
|
|
|
+ @touchend="exiting.lock=false">
|
|
|
<view class="_half left" @animationend="submitExit()"></view>
|
|
|
<view class="_half right"></view>
|
|
|
- <view class="_button"><view>停止</view><view>充电</view></view>
|
|
|
+ <view class="_button">
|
|
|
+ <view>停止</view>
|
|
|
+ <view>充电</view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
<view class="close" @click="exiting.visible=false">取消</view>
|
|
|
</view>
|
|
@@ -22,11 +26,12 @@
|
|
|
<!-- 充电动画 -->
|
|
|
<view class="charge-loading-box" v-if="orderInfo.status == 1">
|
|
|
<view class="charge-loading">
|
|
|
+ <image class="charge-icon" src="../../static/img/charge_loading.svg" mode=""></image>
|
|
|
<view class="c-loading"></view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view v-if="orderInfo.status == 0" class="timer">
|
|
|
- <view class="value" style="font-size: 22px;">充电正在启动中......</view>
|
|
|
+ <view class="value" style="font-size: 22px;">充电正在启动中......</view>
|
|
|
<view v-if="isShowBtn" class="name" style="color: red;font-size: 14px;">长时间无法启动可点击“长按结束充电”按钮结束订单。</view>
|
|
|
</view>
|
|
|
<!-- 主图 -->
|
|
@@ -35,23 +40,50 @@
|
|
|
</view>
|
|
|
<!-- 主参数 -->
|
|
|
<view class="parameter">
|
|
|
- <view class="param"><view class="value">{{deviceInfo.current}}</view><view class="name">电流A</view></view>
|
|
|
- <view class="param"><view class="value">{{getVolt()}}</view><view class="name">电压V</view></view>
|
|
|
- <view class="param"><view class="value">{{deviceInfo.power}}</view><view class="name">功率KW</view></view>
|
|
|
+ <view class="param">
|
|
|
+ <view class="value">{{deviceInfo.current}}</view>
|
|
|
+ <view class="name">电流A</view>
|
|
|
+ </view>
|
|
|
+ <view class="param">
|
|
|
+ <view class="value">{{getVolt()}}</view>
|
|
|
+ <view class="name">电压V</view>
|
|
|
+ </view>
|
|
|
+ <view class="param">
|
|
|
+ <view class="value">{{deviceInfo.power}}</view>
|
|
|
+ <view class="name">功率KW</view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
<!-- 统计兰 -->
|
|
|
<view class="statbar">
|
|
|
- <view class="sta"><view class="value">{{statInfo.electricity}}</view><view class="name">电量/度</view></view>
|
|
|
+ <view class="sta">
|
|
|
+ <view class="value">{{statInfo.electricity}}</view>
|
|
|
+ <view class="name">电量/度</view>
|
|
|
+ </view>
|
|
|
<view class="split"></view>
|
|
|
- <view class="sta"><view class="value">{{statInfo.cost}}</view><view class="name">费用/元</view></view>
|
|
|
+ <view class="sta">
|
|
|
+ <view class="value">{{statInfo.cost}}</view>
|
|
|
+ <view class="name">费用/元</view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
<!-- 信息 -->
|
|
|
<view id="info" class="info">
|
|
|
<view>
|
|
|
- <view class="cell"><view class="lable">订单编号</view><view class="contet">{{orderInfo.id}}</view></view>
|
|
|
- <view class="cell"><view class="lable">终端编号</view><view class="contet">{{deviceInfo.deviceNo}}</view></view>
|
|
|
- <view class="cell"><view class="lable">充电电站</view><view class="contet">{{deviceInfo.thirdPartyStationName}}</view></view>
|
|
|
- <view class="cell"><view class="lable">充电终端</view><view class="contet">{{deviceInfo.deviceName}}</view></view>
|
|
|
+ <view class="cell">
|
|
|
+ <view class="lable">订单编号</view>
|
|
|
+ <view class="contet">{{orderInfo.id}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="cell">
|
|
|
+ <view class="lable">终端编号</view>
|
|
|
+ <view class="contet">{{deviceInfo.deviceNo}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="cell">
|
|
|
+ <view class="lable">充电电站</view>
|
|
|
+ <view class="contet">{{deviceInfo.thirdPartyStationName}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="cell">
|
|
|
+ <view class="lable">充电终端</view>
|
|
|
+ <view class="contet">{{deviceInfo.deviceName}}</view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
<view class="tips">账单信息可能会有所延迟,具体以实际结算为准</view>
|
|
|
<view>
|
|
@@ -64,182 +96,201 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-export default {
|
|
|
- onLoad(opts) {
|
|
|
- console.log("启动充值页面的参数:", opts)
|
|
|
- this.orderInfo.id = opts.orderId;
|
|
|
- this.deviceInfo.id = opts.deviceId;
|
|
|
- },
|
|
|
- onShow() {
|
|
|
- this.getDeviceInfo();
|
|
|
- this.getOrderInfo();
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- exiting:{
|
|
|
- visible: false,
|
|
|
- lock: false
|
|
|
- },
|
|
|
- timer:{
|
|
|
- id: 0,
|
|
|
- start: '2024/08/07 09:00:00',
|
|
|
- text: '00:00:00',
|
|
|
- isSatrt : false,
|
|
|
- },
|
|
|
- orderTimer:{
|
|
|
- id: 0,
|
|
|
- isSatrt : false,
|
|
|
- timeInterval : 10,//每隔多少秒查询一次订单(单位秒:s)
|
|
|
- },
|
|
|
- statInfo:{
|
|
|
- electricity : 0,
|
|
|
- cost : 0
|
|
|
- },//统计信息,电量,费用
|
|
|
- nowPriceTime : {},//当前价格时间段信息
|
|
|
- deviceInfo : {},//充电桩的信息
|
|
|
- orderInfo : {id:1},//订单信息
|
|
|
- isShowBtn : true,//是否显示长按结束按钮
|
|
|
- }
|
|
|
- },
|
|
|
- destroyed(){
|
|
|
- console.log("关闭页面了。。。。。。")
|
|
|
- //关闭页面了,要清除定时器
|
|
|
- clearInterval(this.timer.id);
|
|
|
- clearInterval(this.orderTimer.id);
|
|
|
- },
|
|
|
- methods: {
|
|
|
- //获取设备的详情信息
|
|
|
- getDeviceInfo(deviceId){
|
|
|
- this.$api.base("post","/chargeApi/getDevicesDetial",{"deviceId":this.deviceInfo.id},{}).then(res=>{
|
|
|
- this.deviceInfo = res.device;
|
|
|
- this.nowPriceTime = res.nowPriceTime;
|
|
|
-
|
|
|
- })
|
|
|
+ export default {
|
|
|
+ onLoad(opts) {
|
|
|
+ console.log("启动充值页面的参数:", opts)
|
|
|
+ this.orderInfo.id = opts.orderId;
|
|
|
+ this.deviceInfo.id = opts.deviceId;
|
|
|
},
|
|
|
- //是否显示长按结束按钮
|
|
|
- isShowEendBtn(orderTime){
|
|
|
- var t1 = new Date(orderTime).getTime();
|
|
|
- var t2 = new Date().getTime();
|
|
|
- var t = (t2 - t1)/1000;//单位秒
|
|
|
- if(t >= 60||this.orderInfo.status == 1){
|
|
|
- //启动时间大于一分钟,可以显示长按结束按钮
|
|
|
- this.isShowBtn = true;
|
|
|
- }
|
|
|
+ onShow() {
|
|
|
+ this.getDeviceInfo();
|
|
|
+ this.getOrderInfo();
|
|
|
},
|
|
|
- //查询订单详情并进行订单状态的检测
|
|
|
- getOrderInfo(){
|
|
|
- this.$api.base("post","/chargeApi/queryIsSuccessStop",{"id":this.orderInfo.id},{loading:false}).then(res=>{
|
|
|
- this.orderInfo = res.obj.orderInfo;
|
|
|
- this.timer.start = res.obj.orderInfo.startTime.replaceAll("-","/");
|
|
|
- this.isShowEendBtn(res.obj.orderInfo.startTime.replaceAll("-","/"));
|
|
|
- //充电的度数
|
|
|
- if(this.orderInfo.totalCharge!=null){
|
|
|
- this.statInfo.electricity = this.orderInfo.totalCharge;
|
|
|
- }
|
|
|
-
|
|
|
- //费用
|
|
|
- let cost = (this.statInfo.electricity * this.nowPriceTime.price).toFixed(2);
|
|
|
- if(!isNaN(cost) && this.orderInfo.thirdPartyElecfee == 0){
|
|
|
- //如果后台,第三方返回的电费是0按照自己的方式进行计算
|
|
|
- this.statInfo.cost = cost
|
|
|
- }
|
|
|
- if(!isNaN(this.orderInfo.realCost) && this.orderInfo.thirdPartyElecfee > 0){
|
|
|
- //如果后台有返回第三方的电费,取后台计算的值
|
|
|
- this.statInfo.cost = this.orderInfo.realCost.toFixed(4);
|
|
|
- }
|
|
|
-
|
|
|
- if( this.orderInfo.status == 3 || this.orderInfo.status == 5){
|
|
|
- uni.hideLoading();
|
|
|
- clearInterval(this.timer.id);
|
|
|
- clearInterval(this.orderTimer.id);
|
|
|
- this.$app.url.goto('/pages/order-detail/order-detail?orderId='+this.orderInfo.id,false);
|
|
|
- return ;
|
|
|
- }
|
|
|
- if(this.orderInfo.status == 1 && !this.timer.isSatrt){
|
|
|
- //状态为充电中
|
|
|
- this.startup();
|
|
|
- }
|
|
|
- if(!this.orderTimer.isSatrt){
|
|
|
- this.orderTimer.isSatrt = true;
|
|
|
- //开启定时器每隔5s查询订单
|
|
|
- this.startCheckOrderTimer();
|
|
|
- }
|
|
|
-
|
|
|
- })
|
|
|
- },
|
|
|
- getVolt(){
|
|
|
- if(!this.deviceInfo.power){
|
|
|
- return 0;
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ exiting: {
|
|
|
+ visible: false,
|
|
|
+ lock: false
|
|
|
+ },
|
|
|
+ timer: {
|
|
|
+ id: 0,
|
|
|
+ start: '2024/08/07 09:00:00',
|
|
|
+ text: '00:00:00',
|
|
|
+ isSatrt: false,
|
|
|
+ },
|
|
|
+ orderTimer: {
|
|
|
+ id: 0,
|
|
|
+ isSatrt: false,
|
|
|
+ timeInterval: 10, //每隔多少秒查询一次订单(单位秒:s)
|
|
|
+ },
|
|
|
+ statInfo: {
|
|
|
+ electricity: 0,
|
|
|
+ cost: 0
|
|
|
+ }, //统计信息,电量,费用
|
|
|
+ nowPriceTime: {}, //当前价格时间段信息
|
|
|
+ deviceInfo: {}, //充电桩的信息
|
|
|
+ orderInfo: {
|
|
|
+ id: 1
|
|
|
+ }, //订单信息
|
|
|
+ isShowBtn: true, //是否显示长按结束按钮
|
|
|
}
|
|
|
- var v = this.deviceInfo.power/this.deviceInfo.current * 1000;
|
|
|
- return v;
|
|
|
},
|
|
|
- //启动检测订单的定时器,每隔5S
|
|
|
- startCheckOrderTimer(){
|
|
|
+ destroyed() {
|
|
|
+ console.log("关闭页面了。。。。。。")
|
|
|
+ //关闭页面了,要清除定时器
|
|
|
+ clearInterval(this.timer.id);
|
|
|
clearInterval(this.orderTimer.id);
|
|
|
- this.orderTimer.id = setInterval(()=>{
|
|
|
- this.getOrderInfo(this.orderInfo.id)
|
|
|
- },this.orderTimer.timeInterval * 1000);
|
|
|
},
|
|
|
- // 启动定时器
|
|
|
- startup(){
|
|
|
- const start = new Date(this.timer.start);
|
|
|
- const obj = {hour:0,minute:0,second:0};
|
|
|
- const handle = ()=>{
|
|
|
- this.timer.isSatrt = true;
|
|
|
- const diff = Date.now() - start.getTime();
|
|
|
- obj.hour = Math.floor(diff / 1000 / 60 / 60);
|
|
|
- obj.minute= Math.floor(diff / 1000 / 60 % 60);
|
|
|
- obj.second = Math.floor(diff / 1000 % 60);
|
|
|
- this.timer.text = `${String(obj.hour).padStart(2,'0')}:${String(obj.minute).padStart(2,'0')}:${String(obj.second).padStart(2,'0')}`;
|
|
|
- //console.log(diff,Math.floor(diff / 1000 ))
|
|
|
- /* //计算在该功率下,
|
|
|
- var mill = diff / 1000;//充电时间秒
|
|
|
- if(!this.deviceInfo.power){
|
|
|
- return;
|
|
|
+ methods: {
|
|
|
+ //获取设备的详情信息
|
|
|
+ getDeviceInfo(deviceId) {
|
|
|
+ this.$api.base("post", "/chargeApi/getDevicesDetial", {
|
|
|
+ "deviceId": this.deviceInfo.id
|
|
|
+ }, {}).then(res => {
|
|
|
+ this.deviceInfo = res.device;
|
|
|
+ this.nowPriceTime = res.nowPriceTime;
|
|
|
+
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //是否显示长按结束按钮
|
|
|
+ isShowEendBtn(orderTime) {
|
|
|
+ var t1 = new Date(orderTime).getTime();
|
|
|
+ var t2 = new Date().getTime();
|
|
|
+ var t = (t2 - t1) / 1000; //单位秒
|
|
|
+ if (t >= 60 || this.orderInfo.status == 1) {
|
|
|
+ //启动时间大于一分钟,可以显示长按结束按钮
|
|
|
+ this.isShowBtn = true;
|
|
|
}
|
|
|
- //充电的度数
|
|
|
- this.statInfo.electricity = (this.deviceInfo.power/3600 * mill).toFixed(2);
|
|
|
- //费用
|
|
|
- this.statInfo.cost = (this.statInfo.electricity * this.nowPriceTime.price).toFixed(2); */
|
|
|
- }
|
|
|
- clearInterval(this.timer.id);
|
|
|
- this.timer.id = setInterval(handle,1000);
|
|
|
- handle();
|
|
|
- },
|
|
|
- // 退出充电
|
|
|
- exit(){
|
|
|
- /* this.$app.popup.toast("测试环境,请等待自动结束")
|
|
|
- return; */
|
|
|
- var _this = this;
|
|
|
- this.$api.base("post","/chargeApi/stopCharge",{"id":this.orderInfo.id},{}).then(res=>{
|
|
|
- this.exiting.lock = false;
|
|
|
+ },
|
|
|
+ //查询订单详情并进行订单状态的检测
|
|
|
+ getOrderInfo() {
|
|
|
+ this.$api.base("post", "/chargeApi/queryIsSuccessStop", {
|
|
|
+ "id": this.orderInfo.id
|
|
|
+ }, {
|
|
|
+ loading: false
|
|
|
+ }).then(res => {
|
|
|
+ this.orderInfo = res.obj.orderInfo;
|
|
|
+ this.timer.start = res.obj.orderInfo.startTime.replaceAll("-", "/");
|
|
|
+ this.isShowEendBtn(res.obj.orderInfo.startTime.replaceAll("-", "/"));
|
|
|
+ //充电的度数
|
|
|
+ if (this.orderInfo.totalCharge != null) {
|
|
|
+ this.statInfo.electricity = this.orderInfo.totalCharge;
|
|
|
+ }
|
|
|
+
|
|
|
+ //费用
|
|
|
+ let cost = (this.statInfo.electricity * this.nowPriceTime.price).toFixed(2);
|
|
|
+ if (!isNaN(cost) && this.orderInfo.thirdPartyElecfee == 0) {
|
|
|
+ //如果后台,第三方返回的电费是0按照自己的方式进行计算
|
|
|
+ this.statInfo.cost = cost
|
|
|
+ }
|
|
|
+ if (!isNaN(this.orderInfo.realCost) && this.orderInfo.thirdPartyElecfee > 0) {
|
|
|
+ //如果后台有返回第三方的电费,取后台计算的值
|
|
|
+ this.statInfo.cost = this.orderInfo.realCost.toFixed(4);
|
|
|
+ }
|
|
|
+
|
|
|
+ if (this.orderInfo.status == 3 || this.orderInfo.status == 5) {
|
|
|
+ uni.hideLoading();
|
|
|
+ clearInterval(this.timer.id);
|
|
|
+ clearInterval(this.orderTimer.id);
|
|
|
+ this.$app.url.goto('/pages/order-detail/order-detail?orderId=' + this.orderInfo.id, false);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (this.orderInfo.status == 1 && !this.timer.isSatrt) {
|
|
|
+ //状态为充电中
|
|
|
+ this.startup();
|
|
|
+ }
|
|
|
+ if (!this.orderTimer.isSatrt) {
|
|
|
+ this.orderTimer.isSatrt = true;
|
|
|
+ //开启定时器每隔5s查询订单
|
|
|
+ this.startCheckOrderTimer();
|
|
|
+ }
|
|
|
+
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getVolt() {
|
|
|
+ if (!this.deviceInfo.power) {
|
|
|
+ return 0;
|
|
|
+ }
|
|
|
+ var v = this.deviceInfo.power / this.deviceInfo.current * 1000;
|
|
|
+ return v;
|
|
|
+ },
|
|
|
+ //启动检测订单的定时器,每隔5S
|
|
|
+ startCheckOrderTimer() {
|
|
|
clearInterval(this.orderTimer.id);
|
|
|
- this.orderTimer.isSatrt = false;
|
|
|
- this.orderTimer.timeInterval = 2;
|
|
|
- this.$app.popup.loading(true,{title:"结算中,请稍候",timeout:120*1000})
|
|
|
- setTimeout(()=>{
|
|
|
+ this.orderTimer.id = setInterval(() => {
|
|
|
this.getOrderInfo(this.orderInfo.id)
|
|
|
- },2000)
|
|
|
-
|
|
|
- /* clearInterval(this.timer.id);
|
|
|
- clearInterval(this.orderTimer.id);
|
|
|
- this.$app.url.goto('/pages/order-detail/order-detail?orderId='+this.orderInfo.id,false); */
|
|
|
- })
|
|
|
- },
|
|
|
- // 长按动画结束
|
|
|
- submitExit(){
|
|
|
- this.exiting.lock = false;
|
|
|
- this.exiting.visible = false;
|
|
|
- this.exit();
|
|
|
+ }, this.orderTimer.timeInterval * 1000);
|
|
|
+ },
|
|
|
+ // 启动定时器
|
|
|
+ startup() {
|
|
|
+ const start = new Date(this.timer.start);
|
|
|
+ const obj = {
|
|
|
+ hour: 0,
|
|
|
+ minute: 0,
|
|
|
+ second: 0
|
|
|
+ };
|
|
|
+ const handle = () => {
|
|
|
+ this.timer.isSatrt = true;
|
|
|
+ const diff = Date.now() - start.getTime();
|
|
|
+ obj.hour = Math.floor(diff / 1000 / 60 / 60);
|
|
|
+ obj.minute = Math.floor(diff / 1000 / 60 % 60);
|
|
|
+ obj.second = Math.floor(diff / 1000 % 60);
|
|
|
+ this.timer.text =
|
|
|
+ `${String(obj.hour).padStart(2,'0')}:${String(obj.minute).padStart(2,'0')}:${String(obj.second).padStart(2,'0')}`;
|
|
|
+ //console.log(diff,Math.floor(diff / 1000 ))
|
|
|
+ /* //计算在该功率下,
|
|
|
+ var mill = diff / 1000;//充电时间秒
|
|
|
+ if(!this.deviceInfo.power){
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ //充电的度数
|
|
|
+ this.statInfo.electricity = (this.deviceInfo.power/3600 * mill).toFixed(2);
|
|
|
+ //费用
|
|
|
+ this.statInfo.cost = (this.statInfo.electricity * this.nowPriceTime.price).toFixed(2); */
|
|
|
+ }
|
|
|
+ clearInterval(this.timer.id);
|
|
|
+ this.timer.id = setInterval(handle, 1000);
|
|
|
+ handle();
|
|
|
+ },
|
|
|
+ // 退出充电
|
|
|
+ exit() {
|
|
|
+ /* this.$app.popup.toast("测试环境,请等待自动结束")
|
|
|
+ return; */
|
|
|
+ var _this = this;
|
|
|
+ this.$api.base("post", "/chargeApi/stopCharge", {
|
|
|
+ "id": this.orderInfo.id
|
|
|
+ }, {}).then(res => {
|
|
|
+ this.exiting.lock = false;
|
|
|
+ clearInterval(this.orderTimer.id);
|
|
|
+ this.orderTimer.isSatrt = false;
|
|
|
+ this.orderTimer.timeInterval = 2;
|
|
|
+ this.$app.popup.loading(true, {
|
|
|
+ title: "结算中,请稍候",
|
|
|
+ timeout: 120 * 1000
|
|
|
+ })
|
|
|
+ setTimeout(() => {
|
|
|
+ this.getOrderInfo(this.orderInfo.id)
|
|
|
+ }, 2000)
|
|
|
+
|
|
|
+ /* clearInterval(this.timer.id);
|
|
|
+ clearInterval(this.orderTimer.id);
|
|
|
+ this.$app.url.goto('/pages/order-detail/order-detail?orderId='+this.orderInfo.id,false); */
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 长按动画结束
|
|
|
+ submitExit() {
|
|
|
+ this.exiting.lock = false;
|
|
|
+ this.exiting.visible = false;
|
|
|
+ this.exit();
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
-@import url("charging.css");
|
|
|
-/* 充电loading动画 */
|
|
|
+ @import url("charging.css");
|
|
|
+
|
|
|
+ /* 充电loading动画 */
|
|
|
.charge-loading-box {
|
|
|
margin: auto;
|
|
|
margin-top: 20rpx;
|
|
@@ -251,6 +302,16 @@ export default {
|
|
|
background: #FFFFFF;
|
|
|
border-radius: 18rpx;
|
|
|
overflow: hidden;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+
|
|
|
+ .charge-icon {
|
|
|
+ width: 28rpx;
|
|
|
+ height: 28rpx;
|
|
|
+ z-index: 1000;
|
|
|
+ position: absolute;
|
|
|
+ left: 20rpx;
|
|
|
+ top: 5rpx;
|
|
|
}
|
|
|
|
|
|
.c-loading {
|
|
@@ -260,7 +321,7 @@ export default {
|
|
|
rgba(139, 243, 251, 0),
|
|
|
#60C8FE,
|
|
|
#53D4FF,
|
|
|
- rgba(139, 243, 251, 0.7),);
|
|
|
+ rgba(139, 243, 251, 0.7), );
|
|
|
border-radius: 18rpx;
|
|
|
animation: loading 3s linear infinite;
|
|
|
background-size: 200% 100%;
|
|
@@ -270,8 +331,9 @@ export default {
|
|
|
0% {
|
|
|
background-position: 100% 0;
|
|
|
}
|
|
|
+
|
|
|
100% {
|
|
|
background-position: -100% 0;
|
|
|
}
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|