diff --git a/fuintCashierWeb/src/views/cashier/NewComponents/newHome.vue b/fuintCashierWeb/src/views/cashier/NewComponents/newHome.vue
index e93c3e695..b1e1c35b3 100644
--- a/fuintCashierWeb/src/views/cashier/NewComponents/newHome.vue
+++ b/fuintCashierWeb/src/views/cashier/NewComponents/newHome.vue
@@ -3,10 +3,10 @@
     <div class="left-box">
       <div class="box-top">
         <div class="o-top" v-if="userInfo">
-          <div>
+          <div style="width: 50%">
             <div class="d-s">
               <img src="./imgs/new_user.png" style="width: 28px;height: 28px;margin-right: 10px">
-              <div>
+              <div >
                 <div style="font-weight: bold">{{chooseVipUser.name||'匿名'}}</div>
                 <div class="d-s">
                   <span>{{chooseVipUser.mobile}}</span>
@@ -15,13 +15,13 @@
                 </div>
               </div>
             </div>
-            <div class="d-s">
+            <div class="d-s" >
               <div style="font-size: 12px;margin-right: 5px">储值卡：￥{{chooseVipUser.cardBalance}} </div>
               <div style="font-size: 12px">囤油卡：￥1000.000</div>
             </div>
           </div>
 
-          <div class="d-s">
+          <div class="d-s" style="width: 50%">
             <div class="an_bor" @click="addMemberRecharge()">会员充值</div>
             <div class="an_bor" @click="restVipUser">重置会员</div>
             <div class="an_bor" @click="addFreeTicket()" >赠送优惠券</div>
@@ -237,12 +237,16 @@
             <div style="font-size: 16px;color: #ff9655">打印所有二维码</div>
           </div>
           <div class="wrap-tc">
-            <div class="tc_wa" :class="{'tc-active' : freeIndex == index }" @click="setFreeIndex(index)"  v-for="(item,index) in freeTicketList">{{item.name}}</div>
+            <div class="tc_wa" :class="{'tc-active' : freeIndex == index }" @click="setFreeIndex(index)"
+                 v-for="(item,index) in freeTicketList">{{ item.name }}
+            </div>
           </div>
         </div>
         <div class="right_tc">
-          <div style="font-weight: 600;font-size: 16px;color: #333333;text-align: center;margin-bottom: 15px">优惠价格固定1元</div>
-          <div style="font-weight: 600;font-size: 16px;color: #333333;margin-bottom: 10px" >油品立减券</div>
+          <div style="font-weight: 600;font-size: 16px;color: #333333;text-align: center;margin-bottom: 15px">
+            优惠价格固定1元
+          </div>
+          <div style="font-weight: 600;font-size: 16px;color: #333333;margin-bottom: 10px">油品立减券</div>
           <div style="margin-bottom: 10px">可用时间：周一至周日 全天</div>
           <div style="display: flex">
             <div style="width: 70px">可用日期：</div>
@@ -272,7 +276,7 @@
         <div class="red-size">微信扫一扫</div>
       </div>
       <span slot="footer" class="dialog-footer">
-    <el-button type="primary"    @click="handleDownloadqrCode('collection')" >下载二维码</el-button>
+    <el-button type="primary" @click="handleDownloadqrCode('collection')">下载二维码</el-button>
   </span>
     </el-dialog>
     <el-dialog
@@ -429,7 +433,7 @@ import pickUp from './newHomeComponents/pickUpTheOrder.vue'
 import accountPending from './newHomeComponents/accountPending.vue'
 import memberRecharge from './newHomeComponents/memberRecharge.vue'
 import refuelingAmount from './newHomeComponents/refuelingAmount.vue'
-import { cashRegisterList, cashRegisterGoodsList } from '@/api/newHome/newHome.js'
+import {cashRegisterList, cashRegisterGoodsList} from '@/api/newHome/newHome.js'
 import {QRCodeByStoreId} from "@/api/staff/qrcode";
 import {userListByPhone} from "@/api/cashier/user";
 import Vue from 'vue';
@@ -592,6 +596,11 @@ export default {
 
   },
   computed: {
+    chooseUser(data){
+      //选择会员
+      this.userInfo = true
+      this.chooseVipUser = data
+    },
     getGoodsItem() {
       if (this.oilGunClearing.amount && this.oilGunClearing.amount !== undefined) {
         //  保留两位小数
@@ -1649,6 +1658,27 @@ input {
   padding: 10px 5px;
   border-radius: 8px;
   color: white;
+
+  ::v-deep.el-input__inner {
+    background: transparent !important;
+    border: white 1px solid;
+    .el-input__placeholder{
+      color: red;
+    }
+  }
+
+  ::v-deep input:-moz-placeholder,
+  ::v-deep textarea:-moz-placeholder {
+    color: #fff;
+  }
+  ::v-deep input:-ms-input-placeholder,
+  ::v-deep textarea:-ms-input-placeholder {
+    color: #fff;
+  }
+  ::v-deep input::-webkit-input-placeholder,
+  ::v-deep textarea::-webkit-input-placeholder {
+    color: #fff ;
+  }
 }
 .wrap-tc{
   width: 100%;
diff --git a/gasStation-uni/pages/index/index.vue b/gasStation-uni/pages/index/index.vue
index 756970bc9..7c8852171 100644
--- a/gasStation-uni/pages/index/index.vue
+++ b/gasStation-uni/pages/index/index.vue
@@ -56,7 +56,8 @@
 					<view class="_gbox" v-for="(item,index) in oilTypeList" :key="index">
 						<view class="_ns">{{item.oilName}}{{item.oilType}}</view>
 						<view class="_ns">¥{{item.oilPrice}}</view>
-						<view class="_ns _lv">0.12%↑</view>
+						<view class="_ns _lv" v-if="upOrDown==1">{{item.amplitudeOfChange}}↑</view>
+						<view class="_ns _red" v-else>{{item.amplitudeOfChange}}↓</view>
 					</view>
 					<!-- <view class="_gbox">
 						<view class="_ns">92#汽油</view>
@@ -270,8 +271,27 @@
 					onlyFromCamera: true,
 					success: (res) => {
 						console.log('扫描二维码成功,结果:' + JSON.stringify(res) + res.result);
+						let storeId = ""
+						let staffId = ""
+						let str = res.result.split("?")[1];
+						if (str.includes("&")) {
+							let arr = str.split("&");
+							arr.forEach(item => {
+								if (item.includes("storeId")) {
+									storeId = item.split("=")[1]
+								} else if (item.includes("staffId")) {
+									staffId = item.split("=")[1]
+								} 
+							})
+						} else {
+							storeId = str.split("=")[1]
+						}
+						console.log(storeId,staffId,289);
+						uni.setStorageSync("storeId", storeId)
+						
+						this.getUserAuthority();
 						uni.navigateTo({
-							url: '/pagesHome/check/index'
+							url: '/pages/refuel/refuel?staffId='+staffId
 						})
 					},
 					error: (res) => {
diff --git a/gasStation-uni/pagesHome/MyCard/MyCard.vue b/gasStation-uni/pagesHome/MyCard/MyCard.vue
index 0d1df4876..22eb00808 100644
--- a/gasStation-uni/pagesHome/MyCard/MyCard.vue
+++ b/gasStation-uni/pagesHome/MyCard/MyCard.vue
@@ -11,7 +11,7 @@
 				储值卡余额
 			</view>
 			<view class="card-num">
-				¥{{cardBalance.cardBalance}}
+				¥{{cardBalance.cardBalance || 0}}
 			</view>
 			<!-- <view class="r-box">
 				NO.xxxxxxxxxxxxxxxxxx
@@ -29,7 +29,7 @@
 				剩余油量
 			</view>
 			<view class="card-num">
-				{{cardBalance.refuelMoney || 0}}L
+				0L
 			</view>
 			<!-- <view class="r-box">
 				NO.xxxxxxxxxxxxxxxxxx
@@ -39,14 +39,14 @@
 			<view class="top_card">
 				<view class="">礼品卡</view>
 				<view class="">
-					面值 1000元
+					兑换记录
 				</view>
 			</view>
 			<view class="card-b">
-				卡号：xxxxxxxxxxxxxxxxx
+				已兑换：{{cardBalance.giftCardCount || 0}}份
 			</view>
 			<view class="card-b">
-				卡密：xxxxxxxxxxxxxxxxx
+				累计兑换金额：{{cardBalance.giftCardAmount || 0}}元
 			</view>
 			<!-- <view class="r-box">
 				NO.xxxxxxxxxxxxxxxxxx
@@ -71,6 +71,7 @@
 				cardsList: [],
 				cardsIndex: 0,
 				title: '',
+				giftInfo:{},
 			}
 		},
 
@@ -140,6 +141,7 @@
 				}).then(res => {
 					if (res.code == 200) {
 						this.cardBalance = res.data
+						console.log(res.data);
 					}
 				})
 			},
diff --git a/gasStation-uni/pagesHome/QRcode/QRcode.vue b/gasStation-uni/pagesHome/QRcode/QRcode.vue
index 77d3d9fbf..e60f30f54 100644
--- a/gasStation-uni/pagesHome/QRcode/QRcode.vue
+++ b/gasStation-uni/pagesHome/QRcode/QRcode.vue
@@ -1,390 +1,395 @@
 <template>
-  <view class="content">
-    <view class="container">
-      <!-- 	<view class="my-header">
+	<view class="content">
+		<view class="container">
+			<!-- 	<view class="my-header">
         <view class="my-icons" @click="goback"> <uni-icons type="left" color="#ffffff" size="16"></uni-icons>
         </view>
         <view class="my-text">二维码</view>
         <view class="my-icons"></view>
       </view> -->
-      <!-- 顶部区域 -->
-      <view class="title_">付款码</view>
-      <view class="size_">结账时请出示</view>
-      <view class="cen-box">
-        <!-- <view class="box-top">
-          请出示此码给加油员
-        </view> -->
-        <view class="code-top">
-          <w-barcode :options="option"></w-barcode>
-        </view>
-        <view class="hui-size">
-          <!-- <text>2023 **** **** 5523</text> -->
-          <text>{{barCode}}</text>
-          <text @click="lookNumber">查看数字</text>
-        </view>
-        <view class="code-box">
-          <w-qrcode :options="options"></w-qrcode>
-        </view>
-        <view class="dis-size">
-          <u-icon name="reload" @click="refresh" color="#E02020" size="18"></u-icon>
-          <!-- <u-count-down :timestamp="timestamp"></u-count-down> -->
-          <text style="margin-left: 10px;">
-            {{timestamp}}刷新，请勿截屏，以免影响正常使用
-          </text>
-        </view>
-        <view class="bottom-box" @click="show = !show">
-          <view class="">
-            <view class="h_siz">储值卡</view>
-            <view class="">余额￥{{cardBalance.cardBalance}}</view>
-          </view>
-          <view class="button_c" @click="goMemberRecharge()">充值</view>
-        </view>
+			<!-- 顶部区域 -->
+			<view class="title_"><!-- 付款码 --></view>
+			<!-- <view class="size_">结账时请出示</view> -->
+			<view class="cen-box">
+				<view class="box-top">
+					请出示此码给加油员
+				</view>
+				<view class="code-top">
+					<w-barcode :options="option"></w-barcode>
+				</view>
+				<view class="hui-size">
+					<!-- <text>2023 **** **** 5523</text> -->
+					<text>{{barCode}}</text>
+					<text @click="lookNumber">查看数字</text>
+				</view>
+				<view class="code-box">
+					<w-qrcode :options="options"></w-qrcode>
+				</view>
+				<view class="dis-size">
+					<u-icon name="reload" @click="refresh" color="#E02020" size="18"></u-icon>
+					<!-- <u-count-down :timestamp="timestamp"></u-count-down> -->
+					<text style="margin-left: 10px;">
+						{{timestamp}}刷新，请勿截屏，以免影响正常使用
+					</text>
+				</view>
+				<view class="bottom-box" @click="show = !show">
+					<image src="@/static/icon/card.png" style="width: 30px;height: 25px;">
+					<view style="margin-left: 15px;" v-if="value=='oilStorageCard'">
+						<view>{{deduction[0].value}}</view>
+						<view class="h_siz">{{deduction[0].desc}}</view>
+					</view>
+					<view style="margin-left: 15px;" v-if="value=='balance'">
+						<view>{{deduction[1].value}}</view>
+						<view class="h_siz">{{deduction[1].desc}}</view>
+					</view>
+				</view>
 
-      </view>
+			</view>
 
-      <view class="v-bottom-box">
-        <u-icon name="warning-fill" size="25px" color="#FF9655"></u-icon>
-        <view style="width: 80%;margin-left: 10px;">付款码有效时长60秒，切勿截屏使用</view>
-      </view>
-    </view>
-    <u-popup :show="show" :round="10" @close="close" @open="open">
-      <view class="box-popup">
-        <view class="popup-top">
-          <view class="title">请选择用户类型</view>
-          <view class="hui-size">如果付款失败尝试使用其他方式完成付款</view>
-        </view>
-        <view class="bottom-box" v-for="(item,index) in deduction" :key="index"
-              @click="choosePayMethod(item.value)">
-          <view style="display: flex;align-items: center;">
-            <uni-icons type="wallet-filled" color="#2979ff" size="30"></uni-icons>
-            <view style="margin-left: 10px;">
-              <view class="">{{item.value}}</view>
-              <!-- <view style="font-size: 14px; color: #666666;">根据账户自动识别的付款方式</view> -->
-            </view>
-          </view>
+			<view class="v-bottom-box">
+				<u-icon name="warning-fill" size="25px" color="#FF9655"></u-icon>
+				<view style="width: 80%;margin-left: 10px;">付款码有效时长60秒，切勿截屏使用</view>
+			</view>
+		</view>
+		<u-popup :show="show" :round="10" @close="close" @open="open">
+			<view class="box-popup">
+				<view class="popup-top">
+					<view class="title">请选择用户类型</view>
+					<view class="hui-size">如果付款失败尝试使用其他方式完成付款</view>
+				</view>
+				<view class="bottom-box" style="justify-content: space-between;" v-for="(item,index) in deduction" :key="index"
+					@click="choosePayMethod(item.key)">
+					<view style="display: flex;align-items: center;">
+						<image src="@/static/icon/card.png" style="width: 30px;height: 25px;">
+						<view style="margin-left: 10px;">
+							<view class="">{{item.value}}</view>
+							<!-- <view style="font-size: 14px; color: #666666;">根据账户自动识别的付款方式</view> -->
+						</view>
+					</view>
 
-          <view class="">
-            <u-icon name="arrow-right"></u-icon>
-          </view>
-        </view>
-        <view class="bottom-box">
-          <view style="display: flex;align-items: center;">
-            <uni-icons type="wallet-filled" color="#2979ff" size="30"></uni-icons>
-            <view style="margin-left: 10px;">
-              <view class="">囤油卡</view>
-              <view style="font-size: 14px; color: #666666;">根据账户自动识别的付款方式</view>
-            </view>
-          </view>
-          <view class="">
-            <u-icon name="arrow-right"></u-icon>
-          </view>
-        </view>
+					<view class="">
+						<u-icon name="arrow-right"></u-icon>
+					</view>
+				</view>
+				<!-- <view class="bottom-box">
+					<view style="display: flex;align-items: center;">
+						<uni-icons type="wallet-filled" color="#2979ff" size="30"></uni-icons>
+						<view style="margin-left: 10px;">
+							<view class="">囤油卡</view>
+							<view style="font-size: 14px; color: #666666;">根据账户自动识别的付款方式</view>
+						</view>
+					</view>
+					<view class="">
+						<u-icon name="arrow-right"></u-icon>
+					</view>
+				</view> -->
 
-      </view>
-    </u-popup>
-  </view>
+			</view>
+		</u-popup>
+	</view>
 </template>
 
 <script>
-import request from '../../utils/request'
-export default {
-  data() {
-    return {
-      timestamp: 60,
-      title: '',
-      show: false,
-      option: {
-        width: 670, // 宽度 单位rpx
-        height: 150, // 高度 单位rpx
-        code: 'E57890543271985', // 生成条形码的值
-      },
-      options: {
-        code: 'https://qm.qq.com/cgi-bin/qm/qr?k=LKqML292dD2WvwQfAJXBUmvgbiB_TZWF&noverify=0', // 生成二维码的值
-        size: 460, // 460代表生成的二维码的宽高均为460rpx
-      },
-      deduction: [{
-        key: "oilStorageCard",
-        value: "优先使用囤油卡付款",
-        desc:"若囤油卡升数不足进行支付，则会与储值卡组合付款"
-      },
-        {
-          key: "balance",
-          value: "储值卡扣款",
-          desc:""
-        },
-      ],
-      value: "oilStorageCard",
-      barCode: "",
-      isLook: false,
-      timer: {},
-      cardBalance:{},
-    }
-  },
-  onLoad() {
-    this.getBarCode()
-    this.getQrCode()
-    this.countdown()
-    this.getUserInfo()
-  },
-  components: {
+	import request from '../../utils/request'
+	export default {
+		data() {
+			return {
+				timestamp: 60,
+				title: '',
+				show: false,
+				option: {
+					width: 670, // 宽度 单位rpx
+					height: 150, // 高度 单位rpx
+					code: 'E57890543271985', // 生成条形码的值
+				},
+				options: {
+					code: 'https://qm.qq.com/cgi-bin/qm/qr?k=LKqML292dD2WvwQfAJXBUmvgbiB_TZWF&noverify=0', // 生成二维码的值
+					size: 460, // 460代表生成的二维码的宽高均为460rpx
+				},
+				deduction: [{
+						key: "oilStorageCard",
+						value: "优先使用囤油卡付款",
+						desc: "若囤油卡升数不足进行支付，则会与储值卡组合付款"
+					},
+					{
+						key: "balance",
+						value: "储值卡扣款",
+						desc: ""
+					},
+				],
+				value: "oilStorageCard",
+				barCode: "",
+				isLook: false,
+				timer: {},
+				cardBalance: {},
+			}
+		},
+		onLoad() {
+			this.getBarCode()
+			this.getQrCode()
+			this.countdown()
+			// this.getUserInfo()
+		},
+		components: {
 
-  },
-  methods: {
-    // 跳转会员充值
-    goMemberRecharge() {
-      uni.navigateTo({
-        url: '/pagesHome/memberRecharge/index'
-      })
-    },
-    // 查询用户储值卡余额信息
-    getUserInfo(){
-      request({
-        url: '/business/userManager/user/getUserBalanceApplet',
-        method: 'get',
-        params: this.query
-      }).then(res => {
-        if (res.code == 200) {
-          this.cardBalance = res.data
-        }
-      })
-    },
-    // 是否查看数字
-    lookNumber() {
-      if (this.isLook) {
-        this.barCode = this.option.code.slice(0, 4) + " **** **** " + this.option.code.slice(this.option.code
-            .length - 5, this.option.code.length - 1)
-        this.isLook = false
-      } else {
-        this.barCode = this.option.code.replace(/(.{4})/g, '$1 ')
-        this.isLook = true
-      }
-    },
-    // 倒计时刷新
-    countdown() {
-      let _this = this
-      _this.timer = setInterval(() => {
-        // countdown减1
-        _this.timestamp--;
-        // 如果倒计时为0，清除定时器
-        if (_this.timestamp === 0) {
-          _this.getBarCode()
-          _this.getQrCode()
-          _this.timestamp = 60
-        }
-      }, 1000);
-    },
-    // 刷新二维码信息
-    refresh() {
-      this.getBarCode()
-      this.getQrCode()
-      this.timestamp = 60
-    },
-    // 选择扣款方式
-    choosePayMethod(val) {
-      this.value = val
-      this.show = false
-    },
-    // 获取条码信息
-    getBarCode() {
-      request({
-        url: 'business/qrCode/createBarCode',
-        method: 'get',
-      }).then(res => {
-        this.option.code = res.data
-        this.barCode = res.data.slice(0, 4) + " **** **** " + res.data.slice(res.data.length - 5, res
-            .data.length - 1)
-      })
-    },
-    // 获取二维码信息
-    getQrCode() {
-      request({
-        url: 'business/qrCode/createQrCode',
-        method: 'get',
-      }).then(res => {
-        this.options.code = res.data
-      })
-    },
-    close() {
-      console.log('弹出层收起');
-      this.show = false
-    },
-    open() {
-      console.log('弹出层打开');
-    },
-    bottomShow() {
-      this.show = true
+		},
+		methods: {
+			// 跳转会员充值
+			goMemberRecharge() {
+				uni.navigateTo({
+					url: '/pagesHome/memberRecharge/index'
+				})
+			},
+			// 查询用户储值卡余额信息
+			getUserInfo() {
+				request({
+					url: '/business/userManager/user/getUserBalanceApplet',
+					method: 'get',
+					params: this.query
+				}).then(res => {
+					if (res.code == 200) {
+						this.cardBalance = res.data
+					}
+				})
+			},
+			// 是否查看数字
+			lookNumber() {
+				if (this.isLook) {
+					this.barCode = this.option.code.slice(0, 4) + " **** **** " + this.option.code.slice(this.option.code
+						.length - 5, this.option.code.length - 1)
+					this.isLook = false
+				} else {
+					this.barCode = this.option.code.replace(/(.{4})/g, '$1 ')
+					this.isLook = true
+				}
+			},
+			// 倒计时刷新
+			countdown() {
+				let _this = this
+				_this.timer = setInterval(() => {
+					// countdown减1
+					_this.timestamp--;
+					// 如果倒计时为0，清除定时器
+					if (_this.timestamp === 0) {
+						_this.getBarCode()
+						_this.getQrCode()
+						_this.timestamp = 60
+					}
+				}, 1000);
+			},
+			// 刷新二维码信息
+			refresh() {
+				this.getBarCode()
+				this.getQrCode()
+				this.timestamp = 60
+			},
+			// 选择扣款方式
+			choosePayMethod(val) {
+				this.value = val
+				this.show = false
+			},
+			// 获取条码信息
+			getBarCode() {
+				request({
+					url: 'business/qrCode/createBarCode',
+					method: 'get',
+				}).then(res => {
+					this.option.code = res.data
+					this.barCode = res.data.slice(0, 4) + " **** **** " + res.data.slice(res.data.length - 5, res
+						.data.length - 1)
+				})
+			},
+			// 获取二维码信息
+			getQrCode() {
+				request({
+					url: 'business/qrCode/createQrCode',
+					method: 'get',
+				}).then(res => {
+					this.options.code = res.data
+				})
+			},
+			close() {
+				console.log('弹出层收起');
+				this.show = false
+			},
+			open() {
+				console.log('弹出层打开');
+			},
+			bottomShow() {
+				this.show = true
 
-    },
-    goback() {
-      clearInterval(this.timer)
-      uni.navigateBack()
-    }
-  }
-}
+			},
+			goback() {
+				clearInterval(this.timer)
+				uni.navigateBack()
+			}
+		}
+	}
 </script>
 
 <style scoped lang="scss">
-.button_c{
-  width: 60px;
-  height: 30px;
-  line-height: 30px;
-  text-align: center;
-  border-radius: 5px;
-  background-color: #FF9655;
-  color: #FFFFFF;
-}
+	.button_c {
+		width: 60px;
+		height: 30px;
+		line-height: 30px;
+		text-align: center;
+		border-radius: 5px;
+		background-color: #FF9655;
+		color: #FFFFFF;
+	}
 
-.content {
-  background: #f4f5f6;
-}
+	.content {
+		background: #f4f5f6;
+	}
 
-.container {
-  width: 100%;
-  height: 100vh;
-  box-sizing: border-box;
-  // padding-top: 88px;
-  background-color: #ff9655;
-}
+	.container {
+		width: 100%;
+		height: 100vh;
+		box-sizing: border-box;
+		// padding-top: 88px;
+		background-color: #ff9655;
+	}
 
-.my-header {
-  width: 100%;
-  height: 88px;
-  background: #ff9655;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  color: #ffffff;
-  box-sizing: border-box;
-  padding: 0px 15px;
-  padding-top: 40px;
+	.my-header {
+		width: 100%;
+		height: 88px;
+		background: #ff9655;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		color: #ffffff;
+		box-sizing: border-box;
+		padding: 0px 15px;
+		padding-top: 40px;
 
-  .my-icons {
-    width: 20px;
+		.my-icons {
+			width: 20px;
 
-  }
+		}
 
-  position: fixed;
-  top: 0px;
-}
+		position: fixed;
+		top: 0px;
+	}
 
-.cen-box {
-  width: 95%;
-  background: #ffffff;
-  box-sizing: border-box;
-  padding: 15px;
-  border-radius: 8px;
-  margin: 10px auto;
-}
+	.cen-box {
+		width: 95%;
+		background: #ffffff;
+		box-sizing: border-box;
+		padding: 15px;
+		border-radius: 8px;
+		margin: 10px auto;
+	}
 
-.box-top {
-  width: 100%;
-  box-sizing: border-box;
-  // padding: 10px 0px;
-  padding-bottom: 10px;
-  border-bottom: 1px solid #f4f5f6;
-  text-align: center;
-  font-size: 18px;
-  font-weight: bold;
-}
+	.box-top {
+		width: 100%;
+		box-sizing: border-box;
+		// padding: 10px 0px;
+		padding-bottom: 10px;
+		border-bottom: 1px solid #f4f5f6;
+		text-align: center;
+	}
 
-.code-box {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
+	.code-box {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
 
-.code-top {
-  margin: 10px auto;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
+	.code-top {
+		margin: 10px auto;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
 
-.hui-size {
-  font-size: 14px;
-  width: 100%;
-  text-align: center;
-  color: #666666;
-  margin-bottom: 20px;
-}
+	.hui-size {
+		font-size: 14px;
+		width: 100%;
+		text-align: center;
+		color: #666666;
+		margin-bottom: 20px;
+	}
 
-.dis-size {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: #666666;
-  font-size: 14px;
-  margin: 20px 0px;
-}
+	.dis-size {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		color: #666666;
+		font-size: 14px;
+		margin: 20px 0px;
+	}
 
-.bottom-box {
-  width: 100%;
-  border-top: 1px solid #f4f5f6;
-  box-sizing: border-box;
-  padding-top: 15px;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
+	.bottom-box {
+		width: 100%;
+		border-top: 1px solid #f4f5f6;
+		box-sizing: border-box;
+		padding-top: 15px;
+		display: flex;
+		// align-items: center;
+		// justify-content: space-between;
+	}
 
-.v-bottom-box {
-  width: 95%;
-  border-radius: 8px;
-  box-sizing: border-box;
-  padding: 15px 8px;
-  background: #ffffff;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-size: 14px;
-  color: #666666;
-  margin: 10px auto;
-}
+	.v-bottom-box {
+		width: 95%;
+		border-radius: 8px;
+		box-sizing: border-box;
+		padding: 15px 8px;
+		background: #ffffff;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		font-size: 14px;
+		color: #666666;
+		margin: 10px auto;
+	}
 
-.box-popup {
-  width: 100%;
-  box-sizing: border-box;
-  padding: 15px;
-  background-color: #ffffff;
+	.box-popup {
+		width: 100%;
+		box-sizing: border-box;
+		padding: 15px;
+		background-color: #ffffff;
 
-}
+	}
 
-.popup-top {
-  box-sizing: border-box;
+	.popup-top {
+		box-sizing: border-box;
 
-}
+	}
 
-.title {
-  width: 100%;
-  text-align: center;
-  font-size: 18px;
-  font-weight: bold;
-  color: #000000;
-}
+	.title {
+		width: 100%;
+		text-align: center;
+		font-size: 18px;
+		font-weight: bold;
+		color: #000000;
+	}
 
-.hui-size {
-  color: #666666;
-  font-size: 14px;
-}
+	.hui-size {
+		color: #666666;
+		font-size: 14px;
+	}
 
-.title_ {
-  font-size: 16px;
-  color: #fff;
-  text-align: center;
-}
+	.title_ {
+		font-size: 16px;
+		color: #fff;
+		text-align: center;
+		height: 15px;
+	}
 
-.size_ {
-  font-size: 14px;
-  color: #FFFFFF;
-  text-align: center;
-}
+	.size_ {
+		font-size: 14px;
+		color: #FFFFFF;
+		text-align: center;
+	}
 
-.h_siz {
-  color: #666666;
-}
+	.h_siz {
+		color: #666666;
+		margin-top: 5px;
+		font-size: 14px;
+	}
 
-.x_sz {
-  font-size: 14px;
-  color: #333333;
-}
-</style>
+	.x_sz {
+		font-size: 14px;
+		color: #333333;
+	}
+</style>
\ No newline at end of file
diff --git a/gasStation-uni/static/icon/card.png b/gasStation-uni/static/icon/card.png
new file mode 100644
index 000000000..03501480d
Binary files /dev/null and b/gasStation-uni/static/icon/card.png differ