From 6d18b713df9b9226d98c90425ca6ce44379fc4f8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=82=93=E5=B9=B3=E8=89=BA?= <52643018@qq.com>
Date: Thu, 9 Sep 2021 10:12:34 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E4=BC=9A=E5=91=98=E6=9C=8D?=
 =?UTF-8?q?=E5=8A=A1=E9=A1=B5=E9=9D=A2UI=E3=80=81=E5=AE=8C=E6=88=90?=
 =?UTF-8?q?=E4=BD=99=E9=A2=9D=E6=98=8E=E7=BB=86=E9=A1=B5=E9=9D=A2UI?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages.json                                  |   3 +-
 pages/recharge/balance/balance - 副本.vue | 284 ++++++++++++++
 pages/recharge/balance/balance.vue          | 408 +++++++-------------
 pages/user/member/service.vue               |   6 +-
 4 files changed, 420 insertions(+), 281 deletions(-)
 create mode 100644 pages/recharge/balance/balance - 副本.vue

diff --git a/pages.json b/pages.json
index 6438940..ad3cbee 100644
--- a/pages.json
+++ b/pages.json
@@ -395,7 +395,8 @@
          {
 			"path": "pages/recharge/balance/balance",
 			"style": {
-				"navigationBarTitleText": "余额"	
+				"navigationBarTitleText": "余额"	,
+				"navigationStyle":"custom"
 			}
 		},
 		{
diff --git a/pages/recharge/balance/balance - 副本.vue b/pages/recharge/balance/balance - 副本.vue
new file mode 100644
index 0000000..2003053
--- /dev/null
+++ b/pages/recharge/balance/balance - 副本.vue	
@@ -0,0 +1,284 @@
+<template>
+<view id="recharge-balance">
+    <view class="content">
+		<!-- 我在类名里面写了样式，但是并不起作用，先用行内样式-->
+        <view class="balance-top" style="background:#FB5054 ">
+            <view class="title">
+                账户余额（元）
+            </view>
+            <view class="recharge-box">
+                <view class="money">
+                    {{num/100}}
+                </view>
+                <view class="recharge" @tap="jump" style="display: flex;
+			justify-content: center;
+			align-items: center;
+			width:50px;
+			height:24px;
+			border-radius:2px;
+			border:1px solid rgba(255,255,255,1);">
+                    充值 >
+                </view>
+            </view>
+        </view>
+        <view class="tab-panel">
+            <block v-for="(item, index) in tabList" :key="index">
+                <view :id="index" :hidden="activeIndex != index" :style="'color: ' + config.mainColor + '; border-color: ' + config.mainColor + ' '" class="tab-title active" @tap="tabClick">{{item.name}}</view>
+                <view :id="index" :hidden="activeIndex == index" class="tab-title" @tap="tabClick">{{item.name}}</view>
+            </block>
+        </view>
+        <view class="tab-content">
+            <view class="tab-item" :hidden="activeIndex!=0">
+                <block v-for="(items, idx) in dataList[0]" :key="idx">
+                    <view class="tab-item-content" v-for="(item, index) in dataList[0][idx]" :key="index">
+                        <view class="text">
+                            <view style="font-size: 14px; text-overflow:ellipsis;overflow:hidden;">{{item.note}}</view>
+                            <view style="font-size: 10px;color: #A3A3A3">{{item.updated_at}}</view>
+                        </view>
+                        <view class="num">
+                            +{{item.value/100}}
+                        </view>
+                    </view>
+                </block>
+                <view class="loadingbox" :hidden="!tabList[0].show">
+                    {{showText}}
+                </view>
+            </view>
+            <view class="tab-item" :hidden="activeIndex!=1">
+                <block v-for="(item, idx) in dataList[1]" :key="idx" >
+                    <view class="tab-item-content" v-for="(item, index) in dataList[1][idx]" :key="index">
+                        <view class="text">
+                            <view style="font-size: 14px; text-overflow:ellipsis;overflow:hidden;">{{item.note}}</view>
+                            <view style="font-size: 10px;color: #A3A3A3">{{item.updated_at}}</view>
+                        </view>
+                        <view class="num">
+                            {{item.value/100}}
+                        </view>
+                    </view>
+                </block>
+                <view class="loadingbox" :hidden="!tabList[1].show">
+                    {{showText}}
+                </view>
+            </view>
+        </view>
+    </view>
+</view>
+
+
+</template>
+<script>
+import {pageLogin, getUrl,config,is} from '@/common/js/utils.js';
+
+export default {
+  data() {
+    return {
+      activeIndex: 0,
+      tabList: [{
+        id: 0,
+        name: "收入",
+        init: false,
+        page: 0,
+        more: true,
+        show: false
+      }, {
+        id: 1,
+        name: "支出",
+        init: false,
+        page: 0,
+        more: true,
+        show: false
+      }],
+      token: "",
+      dataList: {
+        0: [],
+        1: []
+      },
+      num: "",
+      showText: '正在加载下一页数据',
+      config: ''
+    };
+  },
+
+  onReachBottom(e) {
+    var status = this.activeIndex;
+    var page = this.tabList[status].page + 1;
+    var tabList = `tabList[${status}]`;
+
+    if (this.tabList[status].more) {
+      this.setData({
+        [`${tabList}.show`]: true
+      });
+      var token = this.token;
+      this.queryBalanceList(token, status, page);
+    } else {
+      wx.showToast({
+        image: '../../../static/error.png',
+        title: '再拉也没有啦'
+      });
+    }
+  },
+
+  onShow() {// let app =getApp();
+    // app.isBirthday().then(()=>{
+    //     if(this.$cookieStorage.get("birthday_gift")){
+    //         var giftData=this.$cookieStorage.get("birthday_gift").data;
+    //         new app.ToastPannel().__page.showText(giftData);
+    //     }
+    // });
+  },
+
+  onLoad(e) {
+    // 第三方平台配置颜色
+    var bgConfig = this.$cookieStorage.get('globalConfig') || '';
+    this.setData({
+      config: bgConfig
+    }); // var status=0,page=1;
+    // this.queryBalanceList(token);
+
+    var status = e.type ? e.type : 0;
+    var page = this.tabList[status].page;
+    pageLogin(getUrl(), token => {
+      this.setData({
+        'token': token
+      });
+      this.queryBalanceList(token, status, page);
+      this.queryUserSum(token);
+    });
+  },
+
+  components: {},
+  props: {},
+  methods: {
+    jump() {
+      wx.navigateTo({
+        url: '/pages/recharge/index/index'
+      });
+    },
+
+    tabClick(e) {
+      // console.log(e.currentTarget.id);
+      var status = e.currentTarget.id;
+      this.setData({
+        activeIndex: status
+      });
+
+      if (!this.tabList[status].init) {
+        var page = this.tabList[status].page;
+        wx.showLoading({
+          title: "加载中",
+          mask: true
+        });
+        this.queryBalanceList(this.token, status, page);
+      }
+    },
+
+    result(res, status) {
+      if (res.status) {
+        var list;
+        var page = res.meta.pagination;
+        var current_page = page.current_page;
+        var total_pages = page.total_pages;
+        var tabList = `tabList[${status}]`;
+        list = res.data;
+        // this.setData({
+        //   [`dataList.${status}[${current_page - 1}]`]: list,
+        //   [`${tabList}.init`]: true,
+        //   [`${tabList}.page`]: current_page,
+        //   [`${tabList}.more`]: current_page < total_pages,
+        //   [`${tabList}.show`]: false
+        // });
+		
+		this.dataList[status][current_page - 1]=res.data;
+		this.tabList[status].init=true;
+		this.tabList[status].page=current_page;
+		this.tabList[status].more=current_page < total_pages;
+		this.tabList[status].show=false;
+		
+      }
+    },
+
+    queryBalanceList(token, status, page) {
+      var type = status ? 'consume' : 'recharge';
+      var params = type ? {
+        type
+      } : {};
+      params.page = page;
+      this.$http.get({
+        api: 'api/users/balance/list',
+        header: {
+          Authorization: token
+        },
+        data: params
+      }).then(res => {
+        if (res.statusCode == 200) {
+          res = res.data;
+          this.result(res, status);
+        } else {
+          wx.showModal({
+            title: '提示',
+            content: '数据请求失败',
+            success: res => {}
+          });
+        }
+
+        wx.hideLoading();
+      }).catch(rej => {
+        wx.showToast({
+          title: "请求失败",
+          image: '../../../static/error.png'
+        });
+        wx.hideLoading();
+      });
+    },
+
+    queryUserSum(token) {
+      this.$http.get({
+        api: "api/users/balance/sum",
+        header: {
+          Authorization: token
+        }
+      }).then(res => {
+        if (res.statusCode == 200) {
+          res = res.data;
+          this.setData({
+            "num": res.data.sum
+          });
+        } else {
+          wx.showModal({
+            title: '提示',
+            content: '数据请求失败',
+            success: res => {}
+          });
+        }
+      });
+    },
+
+    setData: function (obj) {
+      let that = this;
+      let keys = [];
+      let val, data;
+      Object.keys(obj).forEach(function (key) {
+        keys = key.split('.');
+        val = obj[key];
+        data = that.$data;
+        keys.forEach(function (key2, index) {
+          if (index + 1 == keys.length) {
+            that.$set(data, key2, val);
+          } else {
+            if (!data[key2]) {
+              that.$set(data, key2, {});
+            }
+          }
+
+          data = data[key2];
+        });
+      });
+    }
+  },
+  computed: {},
+  watch: {}
+};
+</script>
+<style>
+#recharge-balance .content{height:100%;overflow:auto;box-sizing:border-box}#recharge-balance .content .balance-top{color:#FFF;padding:20px 15px;background:#CDA76E}#recharge-balance .content .balance-top .title{font-size:12px}#recharge-balance .content .balance-top .recharge-box{display:flex;align-items:center;margin-top:20px;font-size:14px}#recharge-balance .content .tab-content,#recharge-balance .content .tab-panel{margin-top:10px;background-color:#FFF}#recharge-balance .content .balance-top .recharge-box .money{flex:1;font-size:30px}#recharge-balance .content .tab-panel{display:flex;box-sizing:border-box}#recharge-balance .content .tab-panel .tab-title{height:44px;width:50%;line-height:44px;text-align:center;box-sizing:border-box}#recharge-balance .content .tab-panel .tab-title.active{color:#CDA76E;border-bottom:2px solid #CDA76E}#recharge-balance .content .tab-content .tab-item-content{box-sizing:border-box;padding-left:12px;padding-right:12px;display:flex;line-height:60px;height:60px;border-bottom:1px solid #d9d9d9;justify-content:space-between}#recharge-balance .content .tab-content .tab-item-content .num{color:#ff2741}#recharge-balance .content .tab-content .tab-item-content .text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:30px;flex:1}#recharge-balance .loadingbox{text-align:center;padding:5px 0}
+</style>
\ No newline at end of file
diff --git a/pages/recharge/balance/balance.vue b/pages/recharge/balance/balance.vue
index 2003053..c6bdbc6 100644
--- a/pages/recharge/balance/balance.vue
+++ b/pages/recharge/balance/balance.vue
@@ -1,284 +1,136 @@
 <template>
-<view id="recharge-balance">
-    <view class="content">
-		<!-- 我在类名里面写了样式，但是并不起作用，先用行内样式-->
-        <view class="balance-top" style="background:#FB5054 ">
-            <view class="title">
-                账户余额（元）
-            </view>
-            <view class="recharge-box">
-                <view class="money">
-                    {{num/100}}
-                </view>
-                <view class="recharge" @tap="jump" style="display: flex;
-			justify-content: center;
-			align-items: center;
-			width:50px;
-			height:24px;
-			border-radius:2px;
-			border:1px solid rgba(255,255,255,1);">
-                    充值 >
-                </view>
-            </view>
-        </view>
-        <view class="tab-panel">
-            <block v-for="(item, index) in tabList" :key="index">
-                <view :id="index" :hidden="activeIndex != index" :style="'color: ' + config.mainColor + '; border-color: ' + config.mainColor + ' '" class="tab-title active" @tap="tabClick">{{item.name}}</view>
-                <view :id="index" :hidden="activeIndex == index" class="tab-title" @tap="tabClick">{{item.name}}</view>
-            </block>
-        </view>
-        <view class="tab-content">
-            <view class="tab-item" :hidden="activeIndex!=0">
-                <block v-for="(items, idx) in dataList[0]" :key="idx">
-                    <view class="tab-item-content" v-for="(item, index) in dataList[0][idx]" :key="index">
-                        <view class="text">
-                            <view style="font-size: 14px; text-overflow:ellipsis;overflow:hidden;">{{item.note}}</view>
-                            <view style="font-size: 10px;color: #A3A3A3">{{item.updated_at}}</view>
-                        </view>
-                        <view class="num">
-                            +{{item.value/100}}
-                        </view>
-                    </view>
-                </block>
-                <view class="loadingbox" :hidden="!tabList[0].show">
-                    {{showText}}
-                </view>
-            </view>
-            <view class="tab-item" :hidden="activeIndex!=1">
-                <block v-for="(item, idx) in dataList[1]" :key="idx" >
-                    <view class="tab-item-content" v-for="(item, index) in dataList[1][idx]" :key="index">
-                        <view class="text">
-                            <view style="font-size: 14px; text-overflow:ellipsis;overflow:hidden;">{{item.note}}</view>
-                            <view style="font-size: 10px;color: #A3A3A3">{{item.updated_at}}</view>
-                        </view>
-                        <view class="num">
-                            {{item.value/100}}
-                        </view>
-                    </view>
-                </block>
-                <view class="loadingbox" :hidden="!tabList[1].show">
-                    {{showText}}
-                </view>
-            </view>
-        </view>
-    </view>
-</view>
-
-
+	<view>
+		<lf-nav title="余额" :showIcon="true" :spreadOut="false" bgColor="transparent" titleColor="#fff"></lf-nav>
+		<view class="head">
+			<view class="bg-left"></view>
+			<view class="bg-right"></view>
+			<view class="head-content">
+				<view>
+					<text class="lf-iconfont icon-- lf-font-50"></text>
+				</view>
+				<view class="point">
+					<text>78326478</text>
+					<text class="label">(元)</text>
+				</view>
+			</view>
+		</view>
+		<view class="main">
+			<view class="lf-row-between lf-m-b-30">
+				<view class="lf-font-32 lf-color-black lf-font-bold">余额变动明细</view>
+				<picker mode='date' :value="date" @change="dateChange">
+					<view style="width: 440rpx; text-align: right;">
+						<text>{{ date || '2021-09-01' }}</text>
+						<text class="lf-iconfont icon--1 lf-m-l-10"></text>
+					</view>
+				</picker>
+			</view>
+			<view class="item" v-for="(item, index) in 10" :key="index">
+				<view class="lf-row-between">
+					<text class="lf-font-36 lf-color-black lf-font-bold" :class="{'lf-color-price': index % 2}">{{ index % 2 ? '-250' : '+80' }}</text>
+					<text class="lf-font-24 lf-color-555">线上-商城内消费</text>
+				</view>
+				<view class="lf-row-between lf-m-t-20">
+					<text class="lf-font-24 lf-color-555">¥374.38</text>
+					<text class="lf-font-24 lf-color-777">2021-09-01 18:27:58</text>
+				</view>
+			</view>
+		</view>
+	</view>
 </template>
-<script>
-import {pageLogin, getUrl,config,is} from '@/common/js/utils.js';
-
-export default {
-  data() {
-    return {
-      activeIndex: 0,
-      tabList: [{
-        id: 0,
-        name: "收入",
-        init: false,
-        page: 0,
-        more: true,
-        show: false
-      }, {
-        id: 1,
-        name: "支出",
-        init: false,
-        page: 0,
-        more: true,
-        show: false
-      }],
-      token: "",
-      dataList: {
-        0: [],
-        1: []
-      },
-      num: "",
-      showText: '正在加载下一页数据',
-      config: ''
-    };
-  },
-
-  onReachBottom(e) {
-    var status = this.activeIndex;
-    var page = this.tabList[status].page + 1;
-    var tabList = `tabList[${status}]`;
-
-    if (this.tabList[status].more) {
-      this.setData({
-        [`${tabList}.show`]: true
-      });
-      var token = this.token;
-      this.queryBalanceList(token, status, page);
-    } else {
-      wx.showToast({
-        image: '../../../static/error.png',
-        title: '再拉也没有啦'
-      });
-    }
-  },
-
-  onShow() {// let app =getApp();
-    // app.isBirthday().then(()=>{
-    //     if(this.$cookieStorage.get("birthday_gift")){
-    //         var giftData=this.$cookieStorage.get("birthday_gift").data;
-    //         new app.ToastPannel().__page.showText(giftData);
-    //     }
-    // });
-  },
-
-  onLoad(e) {
-    // 第三方平台配置颜色
-    var bgConfig = this.$cookieStorage.get('globalConfig') || '';
-    this.setData({
-      config: bgConfig
-    }); // var status=0,page=1;
-    // this.queryBalanceList(token);
-
-    var status = e.type ? e.type : 0;
-    var page = this.tabList[status].page;
-    pageLogin(getUrl(), token => {
-      this.setData({
-        'token': token
-      });
-      this.queryBalanceList(token, status, page);
-      this.queryUserSum(token);
-    });
-  },
-
-  components: {},
-  props: {},
-  methods: {
-    jump() {
-      wx.navigateTo({
-        url: '/pages/recharge/index/index'
-      });
-    },
 
-    tabClick(e) {
-      // console.log(e.currentTarget.id);
-      var status = e.currentTarget.id;
-      this.setData({
-        activeIndex: status
-      });
-
-      if (!this.tabList[status].init) {
-        var page = this.tabList[status].page;
-        wx.showLoading({
-          title: "加载中",
-          mask: true
-        });
-        this.queryBalanceList(this.token, status, page);
-      }
-    },
-
-    result(res, status) {
-      if (res.status) {
-        var list;
-        var page = res.meta.pagination;
-        var current_page = page.current_page;
-        var total_pages = page.total_pages;
-        var tabList = `tabList[${status}]`;
-        list = res.data;
-        // this.setData({
-        //   [`dataList.${status}[${current_page - 1}]`]: list,
-        //   [`${tabList}.init`]: true,
-        //   [`${tabList}.page`]: current_page,
-        //   [`${tabList}.more`]: current_page < total_pages,
-        //   [`${tabList}.show`]: false
-        // });
-		
-		this.dataList[status][current_page - 1]=res.data;
-		this.tabList[status].init=true;
-		this.tabList[status].page=current_page;
-		this.tabList[status].more=current_page < total_pages;
-		this.tabList[status].show=false;
-		
-      }
-    },
-
-    queryBalanceList(token, status, page) {
-      var type = status ? 'consume' : 'recharge';
-      var params = type ? {
-        type
-      } : {};
-      params.page = page;
-      this.$http.get({
-        api: 'api/users/balance/list',
-        header: {
-          Authorization: token
-        },
-        data: params
-      }).then(res => {
-        if (res.statusCode == 200) {
-          res = res.data;
-          this.result(res, status);
-        } else {
-          wx.showModal({
-            title: '提示',
-            content: '数据请求失败',
-            success: res => {}
-          });
-        }
-
-        wx.hideLoading();
-      }).catch(rej => {
-        wx.showToast({
-          title: "请求失败",
-          image: '../../../static/error.png'
-        });
-        wx.hideLoading();
-      });
-    },
-
-    queryUserSum(token) {
-      this.$http.get({
-        api: "api/users/balance/sum",
-        header: {
-          Authorization: token
-        }
-      }).then(res => {
-        if (res.statusCode == 200) {
-          res = res.data;
-          this.setData({
-            "num": res.data.sum
-          });
-        } else {
-          wx.showModal({
-            title: '提示',
-            content: '数据请求失败',
-            success: res => {}
-          });
-        }
-      });
-    },
-
-    setData: function (obj) {
-      let that = this;
-      let keys = [];
-      let val, data;
-      Object.keys(obj).forEach(function (key) {
-        keys = key.split('.');
-        val = obj[key];
-        data = that.$data;
-        keys.forEach(function (key2, index) {
-          if (index + 1 == keys.length) {
-            that.$set(data, key2, val);
-          } else {
-            if (!data[key2]) {
-              that.$set(data, key2, {});
-            }
-          }
-
-          data = data[key2];
-        });
-      });
-    }
-  },
-  computed: {},
-  watch: {}
-};
+<script>
+	export default {
+		data(){
+			return {
+				date: ''
+			}
+		},
+		onLoad(){
+			
+		},
+		methods: {
+			dateChange(event){
+				this.date = event.detail.value;
+			}
+		}
+	}
 </script>
+
 <style>
-#recharge-balance .content{height:100%;overflow:auto;box-sizing:border-box}#recharge-balance .content .balance-top{color:#FFF;padding:20px 15px;background:#CDA76E}#recharge-balance .content .balance-top .title{font-size:12px}#recharge-balance .content .balance-top .recharge-box{display:flex;align-items:center;margin-top:20px;font-size:14px}#recharge-balance .content .tab-content,#recharge-balance .content .tab-panel{margin-top:10px;background-color:#FFF}#recharge-balance .content .balance-top .recharge-box .money{flex:1;font-size:30px}#recharge-balance .content .tab-panel{display:flex;box-sizing:border-box}#recharge-balance .content .tab-panel .tab-title{height:44px;width:50%;line-height:44px;text-align:center;box-sizing:border-box}#recharge-balance .content .tab-panel .tab-title.active{color:#CDA76E;border-bottom:2px solid #CDA76E}#recharge-balance .content .tab-content .tab-item-content{box-sizing:border-box;padding-left:12px;padding-right:12px;display:flex;line-height:60px;height:60px;border-bottom:1px solid #d9d9d9;justify-content:space-between}#recharge-balance .content .tab-content .tab-item-content .num{color:#ff2741}#recharge-balance .content .tab-content .tab-item-content .text{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;line-height:30px;flex:1}#recharge-balance .loadingbox{text-align:center;padding:5px 0}
+	page{
+		overflow-x: hidden;
+	}
+</style>
+<style lang="scss" scoped>
+	.head{
+		width: 750rpx;
+		// height: 512rpx;
+		height: 429rpx;
+		background: linear-gradient(90deg, #22A2A0 0%, #187B7A 100%);
+		position: relative;
+		overflow: hidden;
+		display: flex;
+		align-items: flex-end;
+		box-sizing: border-box;
+		padding: 60rpx 32rpx;
+		color: #FFFFFF;
+		.bg-left{
+			position: absolute;
+			width: 196rpx;
+			height: 196rpx;
+			border-radius: 50%;
+			background-color: rgba(255,255,255,0.04);
+			left: -92rpx;
+			bottom: 60rpx;
+		}
+		.bg-right{
+			position: absolute;
+			width: 520rpx;
+			height: 520rpx;
+			border-radius: 50%;
+			background-color: rgba(255,255,255,0.04);
+			right: -168rpx;
+			top: -122rpx;
+		}
+		.head-content{
+			width: 100%;
+			display: flex;
+			flex-direction: column;
+			justify-content: center;
+			align-items: center;
+			&>view{
+				width: 100%;
+				text-align: center;
+			}
+			.point{
+				font-size: 72rpx;
+				letter-spacing: 2rpx;
+				font-weight: bold;
+				word-break: break-all;
+				line-height: 1;
+				margin-top: 10rpx;
+				.label{
+					font-size: 36rpx;
+					font-weight: initial;
+				}
+			}
+		}
+	}
+	
+	.main{
+		padding: 30rpx 32rpx;
+		width: 750rpx;
+		height: max-content;
+		box-sizing: border-box;
+		.item{
+			width: 686rpx;
+			height: max-content;
+			background: #F4F8F8;
+			border-radius: 10rpx;
+			margin-bottom: 26rpx;
+			padding: 30rpx;
+			box-sizing: border-box;
+			line-height: 1;
+		}
+	}
 </style>
\ No newline at end of file
diff --git a/pages/user/member/service.vue b/pages/user/member/service.vue
index 4db93d8..594416a 100644
--- a/pages/user/member/service.vue
+++ b/pages/user/member/service.vue
@@ -14,7 +14,7 @@
 			</view>
 			<view style="height: 120rpx;"></view>
 			<view class="fixed">
-				<view class="btn1" hover-class="lf-opacity" @click="$url('/pages/user/my/chatonline')">在线客服</view>
+				<!-- <view class="btn1" hover-class="lf-opacity" @click="$url('/pages/user/my/chatonline')">在线客服</view> -->
 				<view class="btn2" hover-class="lf-opacity">拨打客服电话</view>
 			</view>
 		</view>
@@ -70,6 +70,7 @@
 					width: 200rpx;
 					height: 200rpx;
 					background-color: #D8D8D8;
+					border-radius: 20rpx;
 				}
 				.title{
 					font-size: 28rpx;
@@ -109,7 +110,8 @@
 				font-size: 32rpx;
 			}
 			.btn2{
-				width: 423rpx;
+				// width: 423rpx;
+				width: 686rpx;
 				height: 100rpx;
 				background: #15716E;
 				border-radius: 50rpx;