diff --git a/src/pages/address/addAddress.vue b/src/pages/address/addAddress.vue
index 55e324d..54f0ed6 100644
--- a/src/pages/address/addAddress.vue
+++ b/src/pages/address/addAddress.vue
@@ -77,7 +77,9 @@
     </view>
     <button
       form-type="submit"
-      class="button" v-if="addId">编辑</button>
+      class="button"
+      v-if="addId"
+    >编辑</button>
     <button
       form-type="submit"
       class="button"
@@ -103,7 +105,7 @@ export default {
       name: '',
       mobile: '',
       addDetial: '',
-      isDefault: 0
+      isDefault: 0,
     }
   },
   onLoad (option) {
@@ -111,27 +113,27 @@ export default {
     if (addId) {
       this.addId = addId
       store.dispatch('address/details', {
-        add_id: addId
+        add_id: addId,
       }).then(() => {
         uni.setNavigationBarTitle({
-          title: '编辑地址'
+          title: '编辑地址',
         })
-        const { name, mobile, sex, add_detail: addDetial, default: isDefault,address } = this.$store.state.address.details
+        const { name, mobile, sex, add_detail: addDetial, default: isDefault, address } = this.$store.state.address.details
         console.log('---', this.$store.state.address.details)
         const index = this.$refs.SimpleAddress.queryIndex(this.$store.state.address.details.address.split('-'), 'label')
-		console.log(index)
+        console.log(index)
         this.cityPickerValueDefault = index.index
         this.name = name
         this.mobile = Number(mobile)
         this.sexIndex = sex
         this.addDetial = addDetial
         this.isDefalutAddress = !!Number(isDefault)
-		this.pickerText = address
+        this.pickerText = address
       })
     }
   },
   components: {
-    SimpleAddress
+    SimpleAddress,
   },
   methods: {
     openAddres () {
@@ -155,28 +157,28 @@ export default {
       if (name === '') {
         uni.showModal({
           content: '请输入姓名',
-          showCancel: false
+          showCancel: false,
         })
         return 0
       }
       if (!(/^1[3456789]\d{9}$/.test(mobile))) {
         uni.showModal({
           content: '请输入正确的手机号',
-          showCancel: false
+          showCancel: false,
         })
         return 0
       }
       if (this.pickerText === '') {
         uni.showModal({
           content: '请选择收货地区',
-          showCancel: false
+          showCancel: false,
         })
         return 0
       }
       if (addDetail === '') {
         uni.showModal({
           content: '请输入收货详细地址',
-          showCancel: false
+          showCancel: false,
         })
         return 0
       }
@@ -196,20 +198,20 @@ export default {
           default: isDefault ? 1 : 0,
           add_detail: addDetail,
           longitude: 1,
-          latitude: 1
+          latitude: 1,
         }
         if (this.addId) {
           params.add_id = this.addId
         }
         store.dispatch('address/edit', params).then(() => {
-			console.log('fanhui')
+          console.log('fanhui')
           uni.navigateBack({
-            delta: 1
+            delta: 1,
           })
         })
       }
-    }
-  }
+    },
+  },
 }
 </script>
 
@@ -253,7 +255,7 @@ export default {
   position: fixed;
   bottom: 0;
   left: 0;
-  height: 112rpx;
+  height: 120rpx;
   width: 100%;
   background: #ff6b4a;
   display: flex;
@@ -262,5 +264,10 @@ export default {
   font-size: 16px;
   color: #ffffff;
   letter-spacing: -0.3px;
+  /* iphonex 等安全区设置，底部安全区适配 */
+  /* #ifndef APP-NVUE */
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+  /* #endif */
 }
 </style>
diff --git a/src/pages/address/addressList.vue b/src/pages/address/addressList.vue
index 16a864a..ad9088f 100644
--- a/src/pages/address/addressList.vue
+++ b/src/pages/address/addressList.vue
@@ -224,7 +224,7 @@ export default {
     position: fixed;
     bottom: 0;
     left: 0;
-    height: 112rpx;
+    height: 120rpx;
     width: 100%;
     background-color: #ff6b4a;
     display: flex;
@@ -233,6 +233,11 @@ export default {
     font-size: 16px;
     color: #ffffff;
     letter-spacing: -0.3px;
+    /* iphonex 等安全区设置，底部安全区适配 */
+    /* #ifndef APP-NVUE */
+    padding-bottom: constant(safe-area-inset-bottom);
+    padding-bottom: env(safe-area-inset-bottom);
+    /* #endif */
   }
 }
 </style>
diff --git a/src/pages/confirmOrder/confirmOrder.vue b/src/pages/confirmOrder/confirmOrder.vue
index c8317c2..4b40e0c 100644
--- a/src/pages/confirmOrder/confirmOrder.vue
+++ b/src/pages/confirmOrder/confirmOrder.vue
@@ -756,6 +756,11 @@ export default {
   position: fixed;
   bottom: 0;
   z-index: 9999;
+  /* iphonex 等安全区设置，底部安全区适配 */
+  /* #ifndef APP-NVUE */
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+  /* #endif */
   .footerLeft {
     display: flex;
     justify-content: center;
diff --git a/src/pages/detailStandard/detailStandard_k.vue b/src/pages/detailStandard/detailStandard_k.vue
index 8b2ee51..b8a1da1 100644
--- a/src/pages/detailStandard/detailStandard_k.vue
+++ b/src/pages/detailStandard/detailStandard_k.vue
@@ -11,7 +11,7 @@
                             <view class="btn" disabled="this.disabled" @click="counter(false)">-</view>
                             <text>{{count}}</text>
                             <view class="btn" @click="counter(true)">+</view>
-                    </view>                    
+                    </view>
                 </view>
             </view>
         </view>
@@ -24,14 +24,14 @@
                 <view class="colour_exp">*{{navData.colour}}</view>
                 <view>
                 <view class="colour2"  v-bind:class="{'colour2_none' : isNone[0].state}">
-                    <view 
-                    v-for="(items,index) in details.data.skuList" 
-                    :key="index" 
+                    <view
+                    v-for="(items,index) in details.data.skuList"
+                    :key="index"
                     @click="viewChoose(index)"
                     class="colour2_view"
                     v-bind:class="{'colour2_viewed': chooseNum == index}"
                     >
-                        <image v-bind:src="items.pic" @click="colourChange(index,items.sku_name)"></image>    
+                        <image v-bind:src="items.pic" @click="colourChange(index,items.sku_name)"></image>
                     </view>
                 </view>
                 </view>
@@ -42,7 +42,7 @@
                     <view class="size1_1">框架尺寸</view>
                     <view><image v-bind:src="isNone[1].img"></image></view>
                 </view>
-                <view class="colour"> 
+                <view class="colour">
                     <view class="colour_exp">*{{navData.colour}}</view>
                 </view>
                 <view class="D3_list"  v-bind:class="{'colour2_none' : isNone[1].state}">
@@ -54,7 +54,7 @@
                                 <text>{{details.data.frame_width}}mm</text>
                            </view>
                             <view>{{parameter[0].standard}}</view>
-                        </view> 
+                        </view>
                     </view>
                     <view>
                         <view><image class="D3_image"  v-bind:src ="parameter[1].img"></image></view>
@@ -64,7 +64,7 @@
                                 <view>{{details.data.glass_width}}mm</view>
                             </view>
                             <view>{{parameter[1].standard}}</view>
-                        </view> 
+                        </view>
                     </view>
                     <view>
                         <view><image class="D3_image"  v-bind:src ="parameter[2].img"></image></view>
@@ -74,18 +74,18 @@
                             <view>{{details.data.glass_height}}mm</view>
                             </view>
                             <view>{{parameter[2].standard}}</view>
-                        </view> 
+                        </view>
                     </view>
                     <view>
                         <view><image class="D3_image"  v-bind:src ="parameter[3].img"></image></view>
                         <view class="D3_list_jDu">
-                            
+
                             <view class="D3_list1">
                                 <c-progress class="c-progress"  :inner_widthProp="160"/>
                                 <view>{{details.data.nose_width}}mm</view>
                             </view>
                             <view>{{parameter[3].standard}}</view>
-                        </view> 
+                        </view>
                     </view>
                     <view>
                         <view><image class="D3_image"  v-bind:src ="parameter[4].img"></image></view>
@@ -95,7 +95,7 @@
                                 <view>{{details.data.leg_long}}mm</view>
                             </view>
                            <view>{{parameter[4].standard}}</view>
-                        </view> 
+                        </view>
                     </view>
                     <hr/>
                 </view>
@@ -110,8 +110,8 @@
                 </view>
                 <view class="colour_exp">*0290</view>
                 <view class="part_som"  v-bind:class="{'colour2_none' : isNone[2].state}">
-                    <view 
-                    v-for="(part) in part" 
+                    <view
+                    v-for="(part) in part"
                     :key="part.key"
                     v-bind:class="{'size_viewed': part.is_actived}"
                     >
@@ -137,108 +137,107 @@ import CProgress from '../../components/UniSliper/UniSliper'
 import store from '@/store'
 
 export default {
-    components: {
-        CProgress
-    },
-    data(){
-        return{
-            count: 1,
-            // colour: '1.56非球面防蓝光_亚黑色',
-            chooseNum : '',
-            isNone:[
-                {state: false ,img: '/static/img/detail/xiala.png'},
-                {state: false ,img: '/static/img/detail/xiala.png'},
-                {state: false ,img: '/static/img/detail/xiala.png'},
-                {state: false ,img: '/static/img/detail/xiala.png'},
-                {state: false ,img: '/static/img/detail/xiala.png'},
-            ],
-            //传参
-            navData:{
-                pid: "26",
-                p_root_index: "2",
-                name:'',
-                price:'',
-                colour: '1.56非球面防蓝光_亚黑色',
-            },
+  components: {
+    CProgress,
+  },
+  data() {
+    return {
+      count: 1,
+      // colour: '1.56非球面防蓝光_亚黑色',
+      chooseNum: '',
+      isNone: [
+        { state: false, img: '/static/img/detail/xiala.png' },
+        { state: false, img: '/static/img/detail/xiala.png' },
+        { state: false, img: '/static/img/detail/xiala.png' },
+        { state: false, img: '/static/img/detail/xiala.png' },
+        { state: false, img: '/static/img/detail/xiala.png' },
+      ],
+      // 传参
+      navData: {
+        pid: '26',
+        p_root_index: '2',
+        name: '',
+        price: '',
+        colour: '1.56非球面防蓝光_亚黑色',
+      },
 
-            //尺寸
-            parameter:[
-                {key: 0,img:'/static/img/detail/d2.png', standard:'框架宽', slength:139},
-                {key: 1,img:'/static/img/detail/d3.png', standard:'镜片宽', slength:51},
-                {key: 2,img:'/static/img/detail/d4.png', standard:'镜片高', slength:45},
-                {key: 3,img:'/static/img/detail/d5.png', standard:'鼻架宽', slength:19},
-                {key: 4,img:'/static/img/detail/d6.png', standard:'框架耳长', slength:138},
-            ],
-            //配饰
-            part:[
-                {key: 0,img:'/static/img/detail/Kuang/g1.png',is_actived:true},
-                {key: 1,img:'/static/img/detail/Kuang/g1.png',is_actived:false},
-                {key: 2,img:'/static/img/detail/Kuang/g2.png',is_actived:false},
-                {key: 3,img:'/static/img/detail/Kuang/g1.png',is_actived:false},
-                {key: 4,img:'/static/img/detail/Kuang/g1.png',is_actived:false},
-                {key: 5,img:'/static/img/detail/Kuang/g3.png',is_actived:false},
-                {key: 6,img:'/static/img/detail/Kuang/g3.png',is_actived:false},
-                {key: 7,img:'/static/img/detail/Kuang/g2.png',is_actived:false},
-            ],
-        }
-    },
+      // 尺寸
+      parameter: [
+        { key: 0, img: '/static/img/detail/d2.png', standard: '框架宽', slength: 139 },
+        { key: 1, img: '/static/img/detail/d3.png', standard: '镜片宽', slength: 51 },
+        { key: 2, img: '/static/img/detail/d4.png', standard: '镜片高', slength: 45 },
+        { key: 3, img: '/static/img/detail/d5.png', standard: '鼻架宽', slength: 19 },
+        { key: 4, img: '/static/img/detail/d6.png', standard: '框架耳长', slength: 138 },
+      ],
+      // 配饰
+      part: [
+        { key: 0, img: '/static/img/detail/Kuang/g1.png', is_actived: true },
+        { key: 1, img: '/static/img/detail/Kuang/g1.png', is_actived: false },
+        { key: 2, img: '/static/img/detail/Kuang/g2.png', is_actived: false },
+        { key: 3, img: '/static/img/detail/Kuang/g1.png', is_actived: false },
+        { key: 4, img: '/static/img/detail/Kuang/g1.png', is_actived: false },
+        { key: 5, img: '/static/img/detail/Kuang/g3.png', is_actived: false },
+        { key: 6, img: '/static/img/detail/Kuang/g3.png', is_actived: false },
+        { key: 7, img: '/static/img/detail/Kuang/g2.png', is_actived: false },
+      ],
+    }
+  },
 
-    computed: {
-        details(){
-            return this.$store.state.detailStandard_k.list
-        },
+  computed: {
+    details() {
+      return this.$store.state.detailStandard_k.list
     },
-    onLoad:function(){
-        store.dispatch('detailStandard_k/fetch', {
-			uid: "1",
-            pid: "26",
-            p_root_index: "2"
-		});
-        // console.log(this.$store.state.detailStandard_k.list+'ssss');
+  },
+  onLoad: function() {
+    store.dispatch('detailStandard_k/fetch', {
+      uid: '1',
+      pid: '26',
+      p_root_index: '2',
+    })
+    // console.log(this.$store.state.detailStandard_k.list+'ssss');
+  },
+  methods: {
+    counter(isadd) {
+		    if (isadd) {
+        this.count++
+      } else {
+        this.count <= 1 ? this.disabled = true : this.count--
+      }
     },
-    methods: {
-        counter(isadd){
-		    if(isadd){
-				this.count++
-			}else{
-				this.count <= 1? this.disabled = true:this.count--
-            }
-        },
-        xialachange(index){
-            this.isNone[index].state = !this.isNone[index].state;
-            if(this.isNone[index].state){
-                this.isNone[index].img = '/static/img/detail/right.png'
-            }else{
-                this.isNone[index].img = '/static/img/detail/xiala.png'
-            }
-        },
-        colourChange(index,e){
-            this.navData.colour = e ; //颜色选择
-            console.log(index,this.navData.colour);
-
-        },
-        viewChoose(index,e){
-            this.chooseNum = index
-        },
-        popArgs(){
-            uni.navigateTo({
-				url: '../detailsChoiceArgs/detailsChoiceArgs',
-				success: res => {},
-				fail: () => {},
-				complete: () => {}
-			});
-        },
-        //跳转确认订单页及传参
-        popSure(name,price){
-            this.navData.name = name;
-            this.navData.price = price;
-            var navData = JSON.stringify(this.navData); 
-            uni.navigateTo({
-				url: '../confirmOrder/confirmOrder?index='+navData,
-            });
-            console.log(this.navData)
-        },
-    }
+    xialachange(index) {
+      this.isNone[index].state = !this.isNone[index].state
+      if (this.isNone[index].state) {
+        this.isNone[index].img = '/static/img/detail/right.png'
+      } else {
+        this.isNone[index].img = '/static/img/detail/xiala.png'
+      }
+    },
+    colourChange(index, e) {
+      this.navData.colour = e // 颜色选择
+      console.log(index, this.navData.colour)
+    },
+    viewChoose(index, e) {
+      this.chooseNum = index
+    },
+    popArgs() {
+      uni.navigateTo({
+        url: '../detailsChoiceArgs/detailsChoiceArgs',
+        success: res => {},
+        fail: () => {},
+        complete: () => {},
+      })
+    },
+    // 跳转确认订单页及传参
+    popSure(name, price) {
+      this.navData.name = name
+      this.navData.price = price
+      var navData = JSON.stringify(this.navData)
+      uni.navigateTo({
+        url: '../confirmOrder/confirmOrder?index=' + navData,
+      })
+      console.log(this.navData)
+    },
+  },
 
 }
 </script>
@@ -286,11 +285,11 @@ hr{
         color: #333333;
         letter-spacing: -0.26px;
         line-height: 18px;
-        overflow:hidden; 
+        overflow:hidden;
         text-overflow:ellipsis;
-        display:-webkit-box; 
+        display:-webkit-box;
         -webkit-box-orient:vertical;
-        -webkit-line-clamp:2; 
+        -webkit-line-clamp:2;
     }
     .detail2_tui{
         font-size: 10px;
@@ -546,6 +545,11 @@ hr{
     width:100%;
     height: 112rpx;
     background: #FF6B4A 100%;
+  /* iphonex 等安全区设置，底部安全区适配 */
+  /* #ifndef APP-NVUE */
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+  /* #endif */
     view{
         color: #FFFFFF;
         height: 100%;
@@ -556,4 +560,4 @@ hr{
         font-size: 16px;
     }
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/pages/detailStandard/detailStandard_sun.vue b/src/pages/detailStandard/detailStandard_sun.vue
index 5198e4b..0fb354c 100644
--- a/src/pages/detailStandard/detailStandard_sun.vue
+++ b/src/pages/detailStandard/detailStandard_sun.vue
@@ -12,7 +12,7 @@
                             <view class="btn" disabled="this.disabled" @click="counter(false)">-</view>
                             <text>{{count}}</text>
                             <view class="btn" @click="counter(true)">+</view>
-                    </view>                    
+                    </view>
                 </view>
             </view>
         </view>
@@ -25,14 +25,14 @@
                 <view class="colour_exp">*{{navData.colour}}</view>
                 <view>
                 <view class="colour2" v-bind:class="{'colour2_none' : isNone[0].state}">
-                    <view 
-                    v-for="(items,index) in details.data.skuList" 
-                    :key="index" 
+                    <view
+                    v-for="(items,index) in details.data.skuList"
+                    :key="index"
                     @click="viewChoose(index)"
                     class="colour2_view"
                     v-bind:class="{'colour2_viewed': chooseNum == index}"
                     >
-                        <image v-bind:src="items.pic" @click="colourChange(index,items.sku_name)"></image>    
+                        <image v-bind:src="items.pic" @click="colourChange(index,items.sku_name)"></image>
                     </view>
                 </view>
                 </view>
@@ -46,12 +46,12 @@
                 <view class="colour_exp">*BL192345 粉紫色【限时打折】</view>
                 <view  v-bind:class="{'colour2_none' : isNone[1].state}">
                 <view class="jp_colour2">
-                    <view 
-                    v-for="(items,index) in jp_colour" 
-                    :key="index" 
+                    <view
+                    v-for="(items,index) in jp_colour"
+                    :key="index"
                     class="jp_colour2_view"
                     >
-                        <image v-bind:src="items.img"></image>    
+                        <image v-bind:src="items.img"></image>
                     </view>
                 </view>
                 </view>
@@ -66,11 +66,11 @@
                 <view>
                 <view  class="colour_exp">*{{navData.split}}</view>
                 <view class="split" v-bind:class="{'colour2_none' : isNone[2].state}">
-                    <view 
-                    v-for="(items,index) in details.data.attrList[0].attr" 
-                    :key="index" 
+                    <view
+                    v-for="(items,index) in details.data.attrList[0].attr"
+                    :key="index"
                     >
-                    <view 
+                    <view
                     class="split_colour2"
                     @click="splitChoose(index,items.name)"
                     v-bind:class="{'split_colour2 split_colour2_actived' : isSplit == index}"
@@ -85,7 +85,7 @@
                     <view class="size1_1">框架尺寸</view>
                     <view><image  v-bind:src="isNone[3].img"></image></view>
                 </view>
-                <view class="colour"> 
+                <view class="colour">
                     <view class="colour_exp">*{{navData.colour}}</view>
                 </view>
                 <view class="D3_list"  v-bind:class="{'colour2_none' : isNone[3].state}">
@@ -97,7 +97,7 @@
                                 <text>{{details.data.frame_width}}mm</text>
                            </view>
                             <view>{{parameter[0].standard}}</view>
-                        </view> 
+                        </view>
                     </view>
                     <view>
                         <view><image class="D3_image"  v-bind:src ="parameter[1].img"></image></view>
@@ -107,7 +107,7 @@
                                 <view>{{details.data.glass_width}}mm</view>
                             </view>
                             <view>{{parameter[1].standard}}</view>
-                        </view> 
+                        </view>
                     </view>
                     <view>
                         <view><image class="D3_image"  v-bind:src ="parameter[2].img"></image></view>
@@ -117,18 +117,18 @@
                             <view>{{details.data.glass_height}}mm</view>
                             </view>
                             <view>{{parameter[2].standard}}</view>
-                        </view> 
+                        </view>
                     </view>
                     <view>
                         <view><image class="D3_image"  v-bind:src ="parameter[3].img"></image></view>
                         <view class="D3_list_jDu">
-                            
+
                             <view class="D3_list1">
                                 <c-progress class="c-progress"  :inner_widthProp="160"/>
                                 <view>{{details.data.nose_width}}mm</view>
                             </view>
                             <view>{{parameter[3].standard}}</view>
-                        </view> 
+                        </view>
                     </view>
                     <view>
                         <view><image class="D3_image"  v-bind:src ="parameter[4].img"></image></view>
@@ -138,7 +138,7 @@
                                 <view>{{details.data.leg_long}}mm</view>
                             </view>
                            <view>{{parameter[4].standard}}</view>
-                        </view> 
+                        </view>
                     </view>
                 </view>
                 <hr/>
@@ -150,8 +150,8 @@
                 </view>
                 <view class="colour_exp">*0290</view>
                 <view class="part_som"  v-bind:class="{'colour2_none' : isNone[4].state}">
-                    <view 
-                    v-for="(part) in part" 
+                    <view
+                    v-for="(part) in part"
                     :key="part.key"
                     v-bind:class="{'size_viewed': part.is_actived}"
                     >
@@ -271,8 +271,8 @@
 						        <text>确认以上输入信息来源于我的验光数据!</text>
 						    </view>
 						</view>
-					
-					</template> 
+
+					</template>
         <view class="zhanwei"></view>
         <view class="button" @click="popSure(details.data.p_name,details.data.p_sale_price)" ><view>立即结算</view></view>
     </view>
@@ -288,7 +288,7 @@
                         <view class="btn" disabled="this.disabled" @click="counter(false)">-</view>
                         <text>{{count}}</text>
                         <view class="btn" @click="counter(true)">+</view>
-                    </view>                    
+                    </view>
                 </view>
             </view>
         </view>
@@ -301,14 +301,14 @@
                 <view class="colour_exp">*{{navData.colour}}</view>
                 <view>
                 <view class="colour2"  v-bind:class="{'colour2_none' : isNone[0].state}">
-                    <view 
-                    v-for="(items,index) in details.data.skuList" 
-                    :key="index" 
+                    <view
+                    v-for="(items,index) in details.data.skuList"
+                    :key="index"
                     @click="viewChoose(index)"
                     class="colour2_view"
                     v-bind:class="{'colour2_viewed': chooseNum == index}"
                     >
-                        <image v-bind:src="items.pic" @click="colourChange(index,items.sku_name)"></image>    
+                        <image v-bind:src="items.pic" @click="colourChange(index,items.sku_name)"></image>
                     </view>
                 </view>
                 </view>
@@ -319,7 +319,7 @@
                     <view class="size1_1">框架尺寸</view>
                     <view><image v-bind:src="isNone[1].img"></image></view>
                 </view>
-                <view class="colour"> 
+                <view class="colour">
                     <view class="colour_exp">*{{navData.colour}}</view>
                 </view>
                 <view class="D3_list"  v-bind:class="{'colour2_none' : isNone[1].state}">
@@ -331,7 +331,7 @@
                                 <text>{{details.data.frame_width}}mm</text>
                            </view>
                             <view>{{parameter[0].standard}}</view>
-                        </view> 
+                        </view>
                     </view>
                     <view>
                         <view><image class="D3_image"  v-bind:src ="parameter[1].img"></image></view>
@@ -341,7 +341,7 @@
                                 <view>{{details.data.glass_width}}mm</view>
                             </view>
                             <view>{{parameter[1].standard}}</view>
-                        </view> 
+                        </view>
                     </view>
                     <view>
                         <view><image class="D3_image"  v-bind:src ="parameter[2].img"></image></view>
@@ -351,18 +351,18 @@
                             <view>{{details.data.glass_height}}mm</view>
                             </view>
                             <view>{{parameter[2].standard}}</view>
-                        </view> 
+                        </view>
                     </view>
                     <view>
                         <view><image class="D3_image"  v-bind:src ="parameter[3].img"></image></view>
                         <view class="D3_list_jDu">
-                            
+
                             <view class="D3_list1">
                                 <c-progress class="c-progress"  :inner_widthProp="160"/>
                                 <view>{{details.data.nose_width}}mm</view>
                             </view>
                             <view>{{parameter[3].standard}}</view>
-                        </view> 
+                        </view>
                     </view>
                     <view>
                         <view><image class="D3_image"  v-bind:src ="parameter[4].img"></image></view>
@@ -372,7 +372,7 @@
                                 <view>{{details.data.leg_long}}mm</view>
                             </view>
                            <view>{{parameter[4].standard}}</view>
-                        </view> 
+                        </view>
                     </view>
                     <hr/>
                 </view>
@@ -387,8 +387,8 @@
                 </view>
                 <view class="colour_exp">*0290</view>
                 <view class="part_som"  v-bind:class="{'colour2_none' : isNone[2].state}">
-                    <view 
-                    v-for="(part) in part" 
+                    <view
+                    v-for="(part) in part"
                     :key="part.key"
                     v-bind:class="{'size_viewed': part.is_actived}"
                     >
@@ -415,182 +415,181 @@ import CProgress from '../../components/UniSliper/UniSliper'
 import store from '@/store'
 
 export default {
-    components: {
-        CProgress
+  components: {
+    CProgress,
+  },
+  data() {
+    return {
+      type: 2,
+      count: 1,
+      chooseNum: '',
+      isSplit: '',
+      isNone: [
+        { state: false, img: '/static/img/detail/xiala.png' },
+        { state: false, img: '/static/img/detail/xiala.png' },
+        { state: false, img: '/static/img/detail/xiala.png' },
+        { state: false, img: '/static/img/detail/xiala.png' },
+        { state: false, img: '/static/img/detail/xiala.png' },
+      ],
+
+      // 传参
+      navData: {
+        pid: '26',
+        p_root_index: '4',
+        name: '',
+        price: '',
+        type: '',
+        split: '1.56非球面防蓝光',
+        colour: '1.56非球面防蓝光_亚黑色',
+      },
+
+      // 尺寸
+      parameter: [
+        { key: 0, img: '/static/img/detail/d2.png', standard: '框架宽', slength: 139 },
+        { key: 1, img: '/static/img/detail/d3.png', standard: '镜片宽', slength: 51 },
+        { key: 2, img: '/static/img/detail/d4.png', standard: '镜片高', slength: 45 },
+        { key: 3, img: '/static/img/detail/d5.png', standard: '鼻架宽', slength: 19 },
+        { key: 4, img: '/static/img/detail/d6.png', standard: '框架耳长', slength: 138 },
+      ],
+      // 镜片颜色
+      jp_colour: [
+        { img: '/static/img/detail/Kuang/sun_jp.png' },
+        { img: '/static/img/detail/Kuang/sun_jp.png' },
+        { img: '/static/img/detail/Kuang/sun_jp.png' },
+        { img: '/static/img/detail/Kuang/sun_jp.png' },
+        { img: '/static/img/detail/Kuang/sun_jp.png' },
+        { img: '/static/img/detail/Kuang/sun_jp.png' },
+      ],
+      // 配饰
+      part: [
+        { key: 0, img: '/static/img/detail/Kuang/g1.png', is_actived: true },
+        { key: 1, img: '/static/img/detail/Kuang/g1.png', is_actived: false },
+        { key: 2, img: '/static/img/detail/Kuang/g2.png', is_actived: false },
+        { key: 3, img: '/static/img/detail/Kuang/g1.png', is_actived: false },
+        { key: 4, img: '/static/img/detail/Kuang/g1.png', is_actived: false },
+        { key: 5, img: '/static/img/detail/Kuang/g3.png', is_actived: false },
+        { key: 6, img: '/static/img/detail/Kuang/g3.png', is_actived: false },
+        { key: 7, img: '/static/img/detail/Kuang/g2.png', is_actived: false },
+      ],
+      opIsOpen: true,
+      tablist: {
+        // read: true,
+        // seeLong: false,
+        confirm: false,
+      },
+      tabicon: ['/static/detail-button.png', '/static/detail-button-unselected.png'],
+      // 度数相关数据
+      pickerInfoList: [
+        { nameC: '度数', nameE: '(SPH)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 0 },
+        { nameC: '散光', nameE: '(CYL)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 1 },
+        { nameC: '散光轴位', nameE: '(AXI)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 2 },
+        { nameC: '双眼瞳距', nameE: '(PD)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 3 },
+        { nameC: '验光日期', nameE: '', nameArray1: [2017, 2018, 2019, 2020, 2021], nameIndex1: 0, nameArray2: [1, 2, 3, 4, 5, 6, 7], nameIndex2: 0, nameArray3: [1, 2, 3, 4, 5, 6], nameIndex3: 0 },
+      ],
+    }
+  },
+
+  computed: {
+    details() {
+      return this.$store.state.detailStandard_k.list
+    },
+  },
+  onLoad: function() {
+    store.dispatch('detailStandard_k/fetch', {
+      uid: '1',
+      pid: '26',
+      p_root_index: '4',
+    })
+  },
+  methods: {
+    counter(isadd) {
+		    if (isadd) {
+        this.count++
+      } else {
+        this.count <= 1 ? this.disabled = true : this.count--
+      }
+    },
+    xialachange(index) {
+      this.isNone[index].state = !this.isNone[index].state
+      if (this.isNone[index].state) {
+        this.isNone[index].img = '/static/img/detail/right.png'
+      } else {
+        this.isNone[index].img = '/static/img/detail/xiala.png'
+      }
+    },
+    colourChange(index, e) {
+      this.navData.colour = e // 颜色选择
+    },
+    viewChoose(index) {
+      this.chooseNum = index
+    },
+    // 折射率选择
+    splitChoose(index, e) {
+      this.isSplit = index
+      this.navData.split = e
+    },
+    // 跳转镜片选购页
+    popArgs() {
+      uni.navigateTo({
+        url: '../detailsChoiceArgs/detailsChoiceArgs',
+        success: res => {},
+        fail: () => {},
+        complete: () => {},
+      })
+    },
+    // 跳转确认订单页及传参
+    popSure(name, price) {
+      this.navData.name = name
+      this.navData.price = price
+      this.navData.type = this.type
+      var navData = JSON.stringify(this.navData)
+      uni.navigateTo({
+        url: '../confirmOrder/confirmOrder?index=' + navData,
+      })
+      console.log(this.navData)
+    },
+    // 验光表
+    changeConfirm() {
+	        this.tablist.confirm = !this.tablist.confirm
+    },
+    bindPickerChange01: function(e) {
+		    this.pickerInfoList[0].nameIndex1 = e.target.value
+    },
+    bindPickerChange02: function(e) {
+		    this.pickerInfoList[0].nameIndex2 = e.target.value
     },
-    data(){
-        return{
-            type: 2,
-            count: 1,
-            chooseNum : '',
-            isSplit: '' ,
-            isNone:[
-                {state: false ,img: '/static/img/detail/xiala.png'},
-                {state: false ,img: '/static/img/detail/xiala.png'},
-                {state: false ,img: '/static/img/detail/xiala.png'},
-                {state: false ,img: '/static/img/detail/xiala.png'},
-                {state: false ,img: '/static/img/detail/xiala.png'},
-            ],
 
-            //传参
-            navData:{
-                pid: "26",
-                p_root_index: "4",
-                name:'',
-                price:'',
-                type:'',
-                split: '1.56非球面防蓝光',
-                colour: '1.56非球面防蓝光_亚黑色',
-            },
+    bindPickerChange11: function(e) {
+		    this.pickerInfoList[1].nameIndex1 = e.target.value
+    },
+    bindPickerChange12: function(e) {
+		    this.pickerInfoList[1].nameIndex2 = e.target.value
+    },
 
-            //尺寸
-            parameter:[
-                {key: 0,img:'/static/img/detail/d2.png', standard:'框架宽', slength:139},
-                {key: 1,img:'/static/img/detail/d3.png', standard:'镜片宽', slength:51},
-                {key: 2,img:'/static/img/detail/d4.png', standard:'镜片高', slength:45},
-                {key: 3,img:'/static/img/detail/d5.png', standard:'鼻架宽', slength:19},
-                {key: 4,img:'/static/img/detail/d6.png', standard:'框架耳长', slength:138},
-            ],
-            //镜片颜色
-            jp_colour:[
-                {img:'/static/img/detail/Kuang/sun_jp.png'},
-                {img:'/static/img/detail/Kuang/sun_jp.png'},
-                {img:'/static/img/detail/Kuang/sun_jp.png'},
-                {img:'/static/img/detail/Kuang/sun_jp.png'},
-                {img:'/static/img/detail/Kuang/sun_jp.png'},
-                {img:'/static/img/detail/Kuang/sun_jp.png'}
-            ],
-            //配饰
-            part:[
-                {key: 0,img:'/static/img/detail/Kuang/g1.png',is_actived:true},
-                {key: 1,img:'/static/img/detail/Kuang/g1.png',is_actived:false},
-                {key: 2,img:'/static/img/detail/Kuang/g2.png',is_actived:false},
-                {key: 3,img:'/static/img/detail/Kuang/g1.png',is_actived:false},
-                {key: 4,img:'/static/img/detail/Kuang/g1.png',is_actived:false},
-                {key: 5,img:'/static/img/detail/Kuang/g3.png',is_actived:false},
-                {key: 6,img:'/static/img/detail/Kuang/g3.png',is_actived:false},
-                {key: 7,img:'/static/img/detail/Kuang/g2.png',is_actived:false},
-            ],
-            opIsOpen:true,
-            tablist: {
-				// read: true,
-				// seeLong: false,
-				confirm: false
-				},
-			tabicon:['/static/detail-button.png','/static/detail-button-unselected.png'],
-            // 度数相关数据                
-			pickerInfoList:[
-				{nameC:"度数",nameE:"(SPH)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:0},
-				{nameC:"散光",nameE:"(CYL)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:1},
-				{nameC:"散光轴位",nameE:"(AXI)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:2},
-				{nameC:"双眼瞳距",nameE:"(PD)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:3},
-				{nameC:"验光日期",nameE:'',nameArray1:[2017,2018,2019,2020,2021],nameIndex1:0,nameArray2:[1,2,3,4,5,6,7],nameIndex2:0,nameArray3:[1,2,3,4,5,6],nameIndex3:0}
-			],
-        }
+    bindPickerChange21: function(e) {
+		    this.pickerInfoList[2].nameIndex1 = e.target.value
+    },
+    bindPickerChange22: function(e) {
+		    this.pickerInfoList[2].nameIndex2 = e.target.value
     },
 
-    computed: {
-        details(){
-            return this.$store.state.detailStandard_k.list
-        },
+    bindPickerChange31: function(e) {
+		    this.pickerInfoList[3].nameIndex1 = e.target.value
     },
-    onLoad:function(){
-        store.dispatch('detailStandard_k/fetch', {
-			uid: "1",
-            pid: "26",
-            p_root_index: "4"
-        });
+    bindPickerChange32: function(e) {
+		    this.pickerInfoList[3].nameIndex2 = e.target.value
     },
-    methods: {
-        counter(isadd){
-		    if(isadd){
-				this.count++
-			}else{
-				this.count <= 1? this.disabled = true:this.count--
-            }
-        },
-        xialachange(index){
-            this.isNone[index].state = !this.isNone[index].state;
-            if(this.isNone[index].state){
-                this.isNone[index].img = '/static/img/detail/right.png'
-            }else{
-                this.isNone[index].img = '/static/img/detail/xiala.png'
-            }
-        },
-        colourChange(index,e){
-            this.navData.colour = e ; //颜色选择
 
-        },
-        viewChoose(index){
-            this.chooseNum = index
-        },
-        //折射率选择
-        splitChoose(index,e){
-            this.isSplit = index
-            this.navData.split = e 
-        },
-        //跳转镜片选购页
-        popArgs(){
-            uni.navigateTo({
-				url: '../detailsChoiceArgs/detailsChoiceArgs',
-				success: res => {},
-				fail: () => {},
-				complete: () => {}
-			});
-        },
-        //跳转确认订单页及传参
-        popSure(name,price){
-            this.navData.name = name;
-            this.navData.price = price;
-            this.navData.type = this.type;
-            var navData = JSON.stringify(this.navData); 
-            uni.navigateTo({
-				url: '../confirmOrder/confirmOrder?index='+navData,
-            });
-            console.log(this.navData)
-        },
-        //验光表
-        changeConfirm() {
-	        this.tablist.confirm = !this.tablist.confirm
-		},
-		bindPickerChange01: function(e) {
-		    this.pickerInfoList[0].nameIndex1 = e.target.value 
-		},
-		bindPickerChange02: function(e) {
-		    this.pickerInfoList[0].nameIndex2 = e.target.value 
-		},
-		
-		bindPickerChange11: function(e) {
-		    this.pickerInfoList[1].nameIndex1 = e.target.value 
-		},
-		bindPickerChange12: function(e) {
-		    this.pickerInfoList[1].nameIndex2 = e.target.value 
-		},
-		
-		bindPickerChange21: function(e) {
-		    this.pickerInfoList[2].nameIndex1 = e.target.value 
-		},
-		bindPickerChange22: function(e) {
-		    this.pickerInfoList[2].nameIndex2 = e.target.value 
-		},
-		
-		bindPickerChange31: function(e) {
-		    this.pickerInfoList[3].nameIndex1 = e.target.value 
-		},
-		bindPickerChange32: function(e) {
-		    this.pickerInfoList[3].nameIndex2 = e.target.value 
-		},   
-			
-		bindPickerChange41: function(e) {
-		    this.pickerInfoList[4].nameIndex1 = e.target.value 
-		},
-		bindPickerChange42: function(e) {
-		    this.pickerInfoList[4].nameIndex2 = e.target.value 
-			},         
+    bindPickerChange41: function(e) {
+		    this.pickerInfoList[4].nameIndex1 = e.target.value
+    },
+    bindPickerChange42: function(e) {
+		    this.pickerInfoList[4].nameIndex2 = e.target.value
+    },
 	    bindPickerChange43: function(e) {
-		    this.pickerInfoList[4].nameIndex3 = e.target.value 
+		    this.pickerInfoList[4].nameIndex3 = e.target.value
 	    },
-    }
+  },
 
 }
 </script>
@@ -639,11 +638,11 @@ hr{
         color: #333333;
         letter-spacing: -0.26px;
         line-height: 18px;
-        overflow:hidden; 
+        overflow:hidden;
         text-overflow:ellipsis;
-        display:-webkit-box; 
+        display:-webkit-box;
         -webkit-box-orient:vertical;
-        -webkit-line-clamp:2; 
+        -webkit-line-clamp:2;
     }
     .detail2_tui{
         font-size: 10px;
@@ -745,7 +744,7 @@ hr{
         justify-content: start  ;
         grid-column-gap: 10px;
         grid-row-gap: 10px;
-        margin-bottom: 14px;          
+        margin-bottom: 14px;
     .jp_colour2_view{
         border: 1px solid #F2F2F2;
         image{
@@ -950,7 +949,7 @@ hr{
     padding-top:20px;
     padding-bottom:20px;
     box-sizing: border-box;
-	    
+
 	.p1 {
         font-size: 16px;
         color: #333333;
@@ -1013,8 +1012,7 @@ hr{
 					text-align: justify;
 					line-height: 24px;
 				}
-	            
-	            
+
 			}
 			.p13 {
 				font-size: 10px;
@@ -1036,7 +1034,7 @@ hr{
 				width: 124rpx;
 				border-bottom: 1px solid #CFCFCF;
 			}
-	        
+
 		}
 	}
 }
@@ -1046,6 +1044,12 @@ hr{
     width:100%;
     height: 112rpx;
     background: #FF6B4A 100%;
+
+  /* iphonex 等安全区设置，底部安全区适配 */
+  /* #ifndef APP-NVUE */
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+  /* #endif */
     view{
         color: #FFFFFF;
         height: 100%;
@@ -1056,4 +1060,4 @@ hr{
         font-size: 16px;
     }
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/src/pages/detailsChoiceArgs/detailsChoiceArgs.vue b/src/pages/detailsChoiceArgs/detailsChoiceArgs.vue
index 5680edd..0a0798c 100644
--- a/src/pages/detailsChoiceArgs/detailsChoiceArgs.vue
+++ b/src/pages/detailsChoiceArgs/detailsChoiceArgs.vue
@@ -1,601 +1,692 @@
 <template>
-	<view class="content">
-		<view class="goods-info">
-			<image src="../../static/myorder-paying-pic.png"></image>
-			<view class="box-right">
-				<text class="p1">镜片名称型号功能镜片名称型镜片名称型号功能非球面…</text>
-				<text class="p2">支持7天无理由退货  顺丰发货</text>
-				<view class="priceBox">
-					<view class="price">￥{{price*count}}</view>
-					<view class="counter">
-						<view class="btn" disabled="this.disabled" @click="counter(false)">-</view>
-						<text>{{count}}</text>
-						<view class="btn" @click="counter(true)">+</view>
-					</view>
-				</view>
-			</view>
-		</view>
-		<view class="goods-data">
-			<view class="opCollapse">
-				<!-- <view class="head">
+  <view class="content">
+    <view class="goods-info">
+      <image src="../../static/myorder-paying-pic.png"></image>
+      <view class="box-right">
+        <text class="p1">镜片名称型号功能镜片名称型镜片名称型号功能非球面…</text>
+        <text class="p2">支持7天无理由退货 顺丰发货</text>
+        <view class="priceBox">
+          <view class="price">￥{{price*count}}</view>
+          <view class="counter">
+            <view
+              class="btn"
+              disabled="this.disabled"
+              @click="counter(false)"
+            >-</view>
+            <text>{{count}}</text>
+            <view
+              class="btn"
+              @click="counter(true)"
+            >+</view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <view class="goods-data">
+      <view class="opCollapse">
+        <!-- <view class="head">
 					<view v-if="!opIsOpen">填写验光数据</view>
 					<view v-else></view>
 					<view class="headRighted" v-if="opIsOpen" @click="myCollapseChange(opIsOpen)"></view>
-					<view class="headRight" v-else @click="myCollapseChange(opIsOpen)" ></view> 
+					<view class="headRight" v-else @click="myCollapseChange(opIsOpen)" ></view>
 				</view> -->
-				<view class="body">
-					<template v-if="opIsOpen">
-						<view class="goods-form">
-							<view class="data-title">
-								<image src="../../static/icon-data.png" ></image>
-								<text class="p1">填写验光数据</text>
-							</view>
+        <view class="body">
+          <template v-if="opIsOpen">
+            <view class="goods-form">
+              <view class="data-title">
+                <image src="../../static/icon-data.png"></image>
+                <text class="p1">填写验光数据</text>
+              </view>
               <text class="p2">没有验光数据？请到线下眼镜店验光哦～</text>
-              <view class="picker" >
+              <view class="picker">
                 <view class="picker-choice">
                   <view class="choice-left">
                     <text class="p11">验光单取名:</text>
                   </view>
-                  <input class="choice-name uni-input" placeholder="下系" />
+                  <input
+                    class="choice-name uni-input"
+                    placeholder="下系"
+                  />
                 </view>
               </view>
-              <view class="picker" >
-                  <view class="picker-choice">
-                      <view class="choice-left">
-                          <text class="p11">{{pickerInfoList[0].nameC}}</text>
-                          <text class="p12">{{pickerInfoList[0].nameE}}</text>
-                      </view>
-                      <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
-                      <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text>
-                      <picker @change="bindPickerChange01" :value="pickerInfoList[0].nameIndex1" :range="pickerInfoList[0].nameArray1">
-                          <image src="../../static/detail-tabicon.png" ></image>
-                      </picker>
-                      <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
-                      <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text>
-                      <picker @change="bindPickerChange02" :value="pickerInfoList[0].nameIndex2" :range="pickerInfoList[0].nameArray2">
-                          <image src="../../static/detail-tabicon.png" ></image>
-                      </picker>
+              <view class="picker">
+                <view class="picker-choice">
+                  <view class="choice-left">
+                    <text class="p11">{{pickerInfoList[0].nameC}}</text>
+                    <text class="p12">{{pickerInfoList[0].nameE}}</text>
                   </view>
+                  <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
+                  <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text>
+                  <picker
+                    @change="bindPickerChange01"
+                    :value="pickerInfoList[0].nameIndex1"
+                    :range="pickerInfoList[0].nameArray1"
+                  >
+                    <image src="../../static/detail-tabicon.png"></image>
+                  </picker>
+                  <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
+                  <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text>
+                  <picker
+                    @change="bindPickerChange02"
+                    :value="pickerInfoList[0].nameIndex2"
+                    :range="pickerInfoList[0].nameArray2"
+                  >
+                    <image src="../../static/detail-tabicon.png"></image>
+                  </picker>
+                </view>
               </view>
-              <view class="picker" >
-                  <view class="picker-choice">
-                    <view class="choice-left">
-                        <text class="p11">{{pickerInfoList[1].nameC}}</text>
-                        <text class="p12">{{pickerInfoList[1].nameE}}</text>
-                    </view>
-                    <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
-                    <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text>
-                    <picker @change="bindPickerChange11" :value="pickerInfoList[1].nameIndex1" :range="pickerInfoList[1].nameArray1">
-                        <image src="../../static/detail-tabicon.png" ></image>
-                    </picker>
-                    <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
-                    <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text>
-                    <picker @change="bindPickerChange12" :value="pickerInfoList[1].nameIndex2" :range="pickerInfoList[1].nameArray2">
-                        <image src="../../static/detail-tabicon.png" ></image>
-                    </picker>
+              <view class="picker">
+                <view class="picker-choice">
+                  <view class="choice-left">
+                    <text class="p11">{{pickerInfoList[1].nameC}}</text>
+                    <text class="p12">{{pickerInfoList[1].nameE}}</text>
                   </view>
+                  <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
+                  <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text>
+                  <picker
+                    @change="bindPickerChange11"
+                    :value="pickerInfoList[1].nameIndex1"
+                    :range="pickerInfoList[1].nameArray1"
+                  >
+                    <image src="../../static/detail-tabicon.png"></image>
+                  </picker>
+                  <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
+                  <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text>
+                  <picker
+                    @change="bindPickerChange12"
+                    :value="pickerInfoList[1].nameIndex2"
+                    :range="pickerInfoList[1].nameArray2"
+                  >
+                    <image src="../../static/detail-tabicon.png"></image>
+                  </picker>
+                </view>
               </view>
-              <view class="picker" >
-                  <view class="picker-choice">
-                    <view class="choice-left">
-                        <text class="p11">{{pickerInfoList[2].nameC}}</text>
-                        <text class="p12">{{pickerInfoList[2].nameE}}</text>
-                    </view>
-                    <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
-                    <text class="p14">{{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}}</text>
-                    <picker @change="bindPickerChange21" :value="pickerInfoList[2].nameIndex1" :range="pickerInfoList[2].nameArray1">
-                        <image src="../../static/detail-tabicon.png" ></image>
-                    </picker>
-                    <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
-                    <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text>
-                    <picker @change="bindPickerChange22" :value="pickerInfoList[2].nameIndex2" :range="pickerInfoList[2].nameArray2">
-                        <image src="../../static/detail-tabicon.png" ></image>
-                    </picker>
+              <view class="picker">
+                <view class="picker-choice">
+                  <view class="choice-left">
+                    <text class="p11">{{pickerInfoList[2].nameC}}</text>
+                    <text class="p12">{{pickerInfoList[2].nameE}}</text>
                   </view>
+                  <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
+                  <text class="p14">{{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}}</text>
+                  <picker
+                    @change="bindPickerChange21"
+                    :value="pickerInfoList[2].nameIndex1"
+                    :range="pickerInfoList[2].nameArray1"
+                  >
+                    <image src="../../static/detail-tabicon.png"></image>
+                  </picker>
+                  <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
+                  <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text>
+                  <picker
+                    @change="bindPickerChange22"
+                    :value="pickerInfoList[2].nameIndex2"
+                    :range="pickerInfoList[2].nameArray2"
+                  >
+                    <image src="../../static/detail-tabicon.png"></image>
+                  </picker>
+                </view>
               </view>
-              <view class="picker" >
-                  <view class="picker-choice">
-                    <view class="choice-left">
-                        <text class="p11">{{pickerInfoList[3].nameC}}</text>
-                        <text class="p12">{{pickerInfoList[3].nameE}}</text>
-                    </view>
-                    <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
-                    <text class="p14">{{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}</text>
-                    <picker @change="bindPickerChange31" :value="pickerInfoList[3].nameIndex1" :range="pickerInfoList[3].nameArray1">
-                        <image src="../../static/detail-tabicon.png" ></image>
-                    </picker>
-                    <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
-                    <text class="p14">{{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}</text>
-                    <picker @change="bindPickerChange32" :value="pickerInfoList[3].nameIndex2" :range="pickerInfoList[3].nameArray2">
-                        <image src="../../static/detail-tabicon.png" ></image>
-                    </picker>
+              <view class="picker">
+                <view class="picker-choice">
+                  <view class="choice-left">
+                    <text class="p11">{{pickerInfoList[3].nameC}}</text>
+                    <text class="p12">{{pickerInfoList[3].nameE}}</text>
                   </view>
+                  <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
+                  <text class="p14">{{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}</text>
+                  <picker
+                    @change="bindPickerChange31"
+                    :value="pickerInfoList[3].nameIndex1"
+                    :range="pickerInfoList[3].nameArray1"
+                  >
+                    <image src="../../static/detail-tabicon.png"></image>
+                  </picker>
+                  <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
+                  <text class="p14">{{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}</text>
+                  <picker
+                    @change="bindPickerChange32"
+                    :value="pickerInfoList[3].nameIndex2"
+                    :range="pickerInfoList[3].nameArray2"
+                  >
+                    <image src="../../static/detail-tabicon.png"></image>
+                  </picker>
+                </view>
               </view>
-              <view class="picker" >
-                  <view class="picker-choice">
-                    <view class="choice-left">
-                        <text class="p11">{{pickerInfoList[4].nameC}}</text>
-                    </view>
-                    <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text>
-                    <text class="p14" style="width: 34px;">{{pickerInfoList[4].nameArray1[pickerInfoList[4].nameIndex1]}}</text>
-                    <picker @change="bindPickerChange41" :value="pickerInfoList[4].nameIndex1" :range="pickerInfoList[4].nameArray1">
-                        <image src="../../static/detail-tabicon.png" ></image>
-                    </picker>
-                    <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text>
-                    <text class="p14" style="width: 30px;">{{pickerInfoList[4].nameArray2[pickerInfoList[4].nameIndex2]}}</text>
-                    <picker @change="bindPickerChange42" :value="pickerInfoList[4].nameIndex2" :range="pickerInfoList[4].nameArray2">
-                        <image src="../../static/detail-tabicon.png" ></image>
-                    </picker>
-                    <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text>
-                    <text class="p14" style="width: 30px;">{{pickerInfoList[4].nameArray3[pickerInfoList[4].nameIndex3]}}</text>
-                    <picker @change="bindPickerChange43" :value="pickerInfoList[4].nameIndex3" :range="pickerInfoList[4].nameArray3">
-                        <image src="../../static/detail-tabicon.png" ></image>
-                    </picker>
+              <view class="picker">
+                <view class="picker-choice">
+                  <view class="choice-left">
+                    <text class="p11">{{pickerInfoList[4].nameC}}</text>
                   </view>
+                  <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text>
+                  <text
+                    class="p14"
+                    style="width: 34px;"
+                  >{{pickerInfoList[4].nameArray1[pickerInfoList[4].nameIndex1]}}</text>
+                  <picker
+                    @change="bindPickerChange41"
+                    :value="pickerInfoList[4].nameIndex1"
+                    :range="pickerInfoList[4].nameArray1"
+                  >
+                    <image src="../../static/detail-tabicon.png"></image>
+                  </picker>
+                  <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text>
+                  <text
+                    class="p14"
+                    style="width: 30px;"
+                  >{{pickerInfoList[4].nameArray2[pickerInfoList[4].nameIndex2]}}</text>
+                  <picker
+                    @change="bindPickerChange42"
+                    :value="pickerInfoList[4].nameIndex2"
+                    :range="pickerInfoList[4].nameArray2"
+                  >
+                    <image src="../../static/detail-tabicon.png"></image>
+                  </picker>
+                  <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text>
+                  <text
+                    class="p14"
+                    style="width: 30px;"
+                  >{{pickerInfoList[4].nameArray3[pickerInfoList[4].nameIndex3]}}</text>
+                  <picker
+                    @change="bindPickerChange43"
+                    :value="pickerInfoList[4].nameIndex3"
+                    :range="pickerInfoList[4].nameArray3"
+                  >
+                    <image src="../../static/detail-tabicon.png"></image>
+                  </picker>
+                </view>
               </view>
               <view class="confirm">
-                  <image :src="tablist.confirm ? tabicon[0] : tabicon[1]" @click="changeConfirm"></image>
-                  <text>确认以上输入信息来源于我的验光数据!</text>
+                <image
+                  :src="tablist.confirm ? tabicon[0] : tabicon[1]"
+                  @click="changeConfirm"
+                ></image>
+                <text>确认以上输入信息来源于我的验光数据!</text>
               </view>
-						</view>
-					
-					</template>
-					<template v-else>
-						<view v-for="item in pickerInfoList" :key="item.key" class="bodyBox">
-							<template v-if="item.nameC==='验光日期'">
-								<text class="names">{{item.nameC}}</text>
-								<text style="margin-right: 5px;">{{item.nameArray1[item.nameIndex1]}}年</text>
-								<text style="margin-right: 5px;">{{item.nameArray2[item.nameIndex2]}}月</text>
-								<text>{{item.nameArray3[item.nameIndex2]}}日</text>
-							</template>
-							<template v-else>
-								<template v-if="item.nameC==='度数'">
-									<text style="display: inline;">*</text>
-								</template>
-				
-									<text class="names">{{item.nameC}}</text>
-									<text style="margin-right: 10px;">左&nbsp;{{item.nameArray1[item.nameIndex1]}}</text>
-									<text>右&nbsp;{{item.nameArray2[item.nameIndex2]}}</text>
-							</template>
-						</view>
-					</template>
-				</view>
-			</view>
-			<!-- 实用功能折叠框 -->
-			<MyCollapse :isOpenProps="funIsOpen" :funListProp="funList"  :funContentProp="funContent" title="实用功能"></MyCollapse>
-			<MyCollapse :isOpenProps="kindIsOpen" :funListProp="kindList1" :funList2Prop="kindList2"  :funContentProp="kindContent" title="镜片种类"></MyCollapse>
-			<MyCollapse :isOpenProps="maIsOpen" :funListProp="maList1" :funList2Prop="maList2" :funContentProp="maContent" title="材质选择"></MyCollapse>
-			<MyCollapse :isOpenProps="reIsOpen" :funListProp="reList1" :funList2Prop="reList2" :funContentProp="reContent" title="折射率"></MyCollapse>
-			<view 
-       v-for="item in attrList"
-       :key="item.mid"
-			>
-				<MyCollapse
-         :funListProp="item"
-         :funContentProp="reContent" 
-         :title="item.meta_name"
-				/>
-			</view>
-		</view>
-		<view class="submit">立即结算</view>
-	</view>
+            </view>
+
+          </template>
+          <template v-else>
+            <view
+              v-for="item in pickerInfoList"
+              :key="item.key"
+              class="bodyBox"
+            >
+              <template v-if="item.nameC==='验光日期'">
+                <text class="names">{{item.nameC}}</text>
+                <text style="margin-right: 5px;">{{item.nameArray1[item.nameIndex1]}}年</text>
+                <text style="margin-right: 5px;">{{item.nameArray2[item.nameIndex2]}}月</text>
+                <text>{{item.nameArray3[item.nameIndex2]}}日</text>
+              </template>
+              <template v-else>
+                <template v-if="item.nameC==='度数'">
+                  <text style="display: inline;">*</text>
+                </template>
+
+                <text class="names">{{item.nameC}}</text>
+                <text style="margin-right: 10px;">左&nbsp;{{item.nameArray1[item.nameIndex1]}}</text>
+                <text>右&nbsp;{{item.nameArray2[item.nameIndex2]}}</text>
+              </template>
+            </view>
+          </template>
+        </view>
+      </view>
+      <!-- 实用功能折叠框 -->
+      <MyCollapse
+        :isOpenProps="funIsOpen"
+        :funListProp="funList"
+        :funContentProp="funContent"
+        title="实用功能"
+      ></MyCollapse>
+      <MyCollapse
+        :isOpenProps="kindIsOpen"
+        :funListProp="kindList1"
+        :funList2Prop="kindList2"
+        :funContentProp="kindContent"
+        title="镜片种类"
+      ></MyCollapse>
+      <MyCollapse
+        :isOpenProps="maIsOpen"
+        :funListProp="maList1"
+        :funList2Prop="maList2"
+        :funContentProp="maContent"
+        title="材质选择"
+      ></MyCollapse>
+      <MyCollapse
+        :isOpenProps="reIsOpen"
+        :funListProp="reList1"
+        :funList2Prop="reList2"
+        :funContentProp="reContent"
+        title="折射率"
+      ></MyCollapse>
+      <view
+        v-for="item in attrList"
+        :key="item.mid"
+      >
+        <MyCollapse
+          :funListProp="item"
+          :funContentProp="reContent"
+          :title="item.meta_name"
+        />
+      </view>
+    </view>
+    <view class="submit">立即结算</view>
+  </view>
 </template>
 
 <script>
-	import MyCollapse from './compoents/MyCollapse.vue'
-	import store from '@/store'
+import MyCollapse from './compoents/MyCollapse.vue'
+import store from '@/store'
 
-	export default {
-		components: {
-			MyCollapse
-		},
-		data() {
-			return {
-				count:1,
-				disabled:false,
-				price:180,
-				// 实用功能参数
-				funIsOpen:true, // 默认myCollapse开启
-				funList: [
-					{"name":"防紫外线","isChioce": false,"key":1,"type": "fun"},
-					{"name":"防蓝光","isChioce": false,"key":2,"type": "fun"},
-					{"name":"智能变色","isChioce": false,"key":3,"type": "fun"},
-					{"name":"易清洁","isChioce": false,"key":4,"type": "fun"},
-					{"name":"防辐射","isChioce": false,"key":5,"type": "fun"},
-					{"name":"抗疲劳","isChioce": false,"key":6,"type": "fun"},
-				],
-				funContent:[],
-				// 镜片种类参数
-				kindIsOpen:true, 
-				kindList1: [
-					{"name":"染色","isChioce":false,key:1,"type": "kind"},
-					{"name":"渐变","isChioce":false,key:2,"type": "kind"},
-				],
-				kindList2: [
-					{"name":"JB234759","isChioce":false,key:3,"type": "kind"},
-					{"name":"JB234759","isChioce":false,key:4,"type": "kind"},
-					{"name":"JB234759","isChioce":false,key:5,"type": "kind"},
-					{"name":"JB234759","isChioce":false,key:6,"type": "kind"},
-					{"name":"JB234759","isChioce":false,key:7,"type": "kind"},
-				],
-				kindContent: [],
-				// 材质选择
-				maIsOpen: true,
-				maList1: [
-					{"name":"树脂镜片","isChioce":false,key:1,"range":"0-300度","isRange":true},
-					{"name":"特殊镜片","isChioce":false,key:2},
-				],
-				maList2: [
-					{"name":"玻璃镜片","isChioce":false,key:3,"range":"300-1000度","isRange":true},
-					{"name":"玻璃镜片","isChioce":false,key:4},
-				],
-				maContent: [],
-				// 折射率参数
-				reIsOpen: true,
-				reList1: [
-					{"name":"1.56（推荐）","isChioce":false,key:1,"range":"0-300度","isRange":true},
-					{"name":"1.60","isChioce":false,key:2},
-				],
-				reList2: [
-					{"name":"1.71（推荐）","isChioce":false,key:3,"range":"300-1000度","isRange":true},
-					{"name":"1.67","isChioce":false,key:4},
-					{"name":"1.71","isChioce":false,key:5},
-					{"name":"1.74","isChioce":false,key:6},
-				],
-				reContent:[],
-				// 验光参数
-				opIsOpen:true,
-				tablist: {
-					// read: true,
-					// seeLong: false,
-					confirm: false
-				},
-				tabicon:['/static/detail-button.png','/static/detail-button-unselected.png'],
-        // 度数相关数据                
-				pickerInfoList:[
-					{nameC:"度数",nameE:"(SPH)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:0},
-					{nameC:"散光",nameE:"(CYL)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:1},
-					{nameC:"散光轴位",nameE:"(AXI)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:2},
-					{nameC:"双眼瞳距",nameE:"(PD)",nameArray1:[1.5,2.5,3.5,4.5],nameIndex1:0,nameArray2:[1.5,2.5,3.5,4.5],nameIndex2:0,key:3},
-					{nameC:"验光日期",nameE:'',nameArray1:[2017,2018,2019,2020,2021],nameIndex1:0,nameArray2:[1,2,3,4,5,6,7],nameIndex2:0,nameArray3:[1,2,3,4,5,6],nameIndex3:0}
-				],
-				
-			}
-		},
-		onLoad() {
-			store.dispatch('read/fetch', {
-				pid: 9,
-			})
-		},
-		computed: {
-			attrList() {
-				return this.$store.state.read.goodInfo.attrList;
-			}
-		},
-		methods: {
-			counter(isadd){
-				if(isadd){
-					this.count++
-				} else {
-					this.count <= 1? this.disabled = true:this.count--
-				}
-			},
-			myCollapseChange(isopen){
-				// console.log(isopen)
-				this.opIsOpen = !isopen
-			},
-			changeConfirm() {
-        this.tablist.confirm = !this.tablist.confirm
-			},
-			
-			bindPickerChange01: function(e) {
-        this.pickerInfoList[0].nameIndex1 = e.target.value 
-			},
-			bindPickerChange02: function(e) {
-        this.pickerInfoList[0].nameIndex2 = e.target.value 
-			},
-			
-			bindPickerChange11: function(e) {
-        this.pickerInfoList[1].nameIndex1 = e.target.value 
-			},
-			bindPickerChange12: function(e) {
-        this.pickerInfoList[1].nameIndex2 = e.target.value 
-			},
-			
-			bindPickerChange21: function(e) {
-        this.pickerInfoList[2].nameIndex1 = e.target.value 
-			},
-			bindPickerChange22: function(e) {
-        this.pickerInfoList[2].nameIndex2 = e.target.value 
-			},
-			
-			bindPickerChange31: function(e) {
-        this.pickerInfoList[3].nameIndex1 = e.target.value 
-			},
-			bindPickerChange32: function(e) {
-        this.pickerInfoList[3].nameIndex2 = e.target.value 
-			},   
-			
-			bindPickerChange41: function(e) {
-        this.pickerInfoList[4].nameIndex1 = e.target.value 
-			},
-			bindPickerChange42: function(e) {
-        this.pickerInfoList[4].nameIndex2 = e.target.value 
-			},         
-			bindPickerChange43: function(e) {
-        this.pickerInfoList[4].nameIndex3 = e.target.value 
-			},
-		}
-	}
-</script>
+export default {
+  components: {
+    MyCollapse,
+  },
+  data() {
+    return {
+      count: 1,
+      disabled: false,
+      price: 180,
+      // 实用功能参数
+      funIsOpen: true, // 默认myCollapse开启
+      funList: [
+        { name: '防紫外线', isChioce: false, key: 1, type: 'fun' },
+        { name: '防蓝光', isChioce: false, key: 2, type: 'fun' },
+        { name: '智能变色', isChioce: false, key: 3, type: 'fun' },
+        { name: '易清洁', isChioce: false, key: 4, type: 'fun' },
+        { name: '防辐射', isChioce: false, key: 5, type: 'fun' },
+        { name: '抗疲劳', isChioce: false, key: 6, type: 'fun' },
+      ],
+      funContent: [],
+      // 镜片种类参数
+      kindIsOpen: true,
+      kindList1: [
+        { name: '染色', isChioce: false, key: 1, type: 'kind' },
+        { name: '渐变', isChioce: false, key: 2, type: 'kind' },
+      ],
+      kindList2: [
+        { name: 'JB234759', isChioce: false, key: 3, type: 'kind' },
+        { name: 'JB234759', isChioce: false, key: 4, type: 'kind' },
+        { name: 'JB234759', isChioce: false, key: 5, type: 'kind' },
+        { name: 'JB234759', isChioce: false, key: 6, type: 'kind' },
+        { name: 'JB234759', isChioce: false, key: 7, type: 'kind' },
+      ],
+      kindContent: [],
+      // 材质选择
+      maIsOpen: true,
+      maList1: [
+        { name: '树脂镜片', isChioce: false, key: 1, range: '0-300度', isRange: true },
+        { name: '特殊镜片', isChioce: false, key: 2 },
+      ],
+      maList2: [
+        { name: '玻璃镜片', isChioce: false, key: 3, range: '300-1000度', isRange: true },
+        { name: '玻璃镜片', isChioce: false, key: 4 },
+      ],
+      maContent: [],
+      // 折射率参数
+      reIsOpen: true,
+      reList1: [
+        { name: '1.56（推荐）', isChioce: false, key: 1, range: '0-300度', isRange: true },
+        { name: '1.60', isChioce: false, key: 2 },
+      ],
+      reList2: [
+        { name: '1.71（推荐）', isChioce: false, key: 3, range: '300-1000度', isRange: true },
+        { name: '1.67', isChioce: false, key: 4 },
+        { name: '1.71', isChioce: false, key: 5 },
+        { name: '1.74', isChioce: false, key: 6 },
+      ],
+      reContent: [],
+      // 验光参数
+      opIsOpen: true,
+      tablist: {
+        // read: true,
+        // seeLong: false,
+        confirm: false,
+      },
+      tabicon: ['/static/detail-button.png', '/static/detail-button-unselected.png'],
+      // 度数相关数据
+      pickerInfoList: [
+        { nameC: '度数', nameE: '(SPH)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 0 },
+        { nameC: '散光', nameE: '(CYL)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 1 },
+        { nameC: '散光轴位', nameE: '(AXI)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 2 },
+        { nameC: '双眼瞳距', nameE: '(PD)', nameArray1: [1.5, 2.5, 3.5, 4.5], nameIndex1: 0, nameArray2: [1.5, 2.5, 3.5, 4.5], nameIndex2: 0, key: 3 },
+        { nameC: '验光日期', nameE: '', nameArray1: [2017, 2018, 2019, 2020, 2021], nameIndex1: 0, nameArray2: [1, 2, 3, 4, 5, 6, 7], nameIndex2: 0, nameArray3: [1, 2, 3, 4, 5, 6], nameIndex3: 0 },
+      ],
 
-<style lang="scss" scoped>
-	.content{
-		width: 100%;
-		background-color: #F2F2F2;
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-	}
-	.choice-name {
-		border-bottom: 1px solid #CFCFCF;
-	}
-	.goods-info{
-		width: 100%;
-		height: 272rpx;
-		box-sizing: border-box;
-		padding: 40rpx 40rpx 36rpx 36rpx;
-		margin: 36rpx 0 18rpx 0;
-		// margin-bottom: -18rpx;
-		// margin-top: -36rpx;
-		background: #FFFFFF;
-		border-radius: 16rpx;
-		display: flex;
-		image{
-			width: 94px;
-			height: 94px;
-			margin-right: 28rpx;
-		}
-		.box-right{
-			width: 458rpx;
-			display: flex;
-			flex-direction: column;
-			align-items: flex-start;
-			justify-content: space-between;
-			.p1 {
-				// font-family: PingFangSC-Regular;
-				font-size: 14px;
-				color: #333333;
-				letter-spacing: -0.26px;
-				text-align: justify;
-				line-height: 18px;
-			}
-			.p2 {
-				// font-family: PingFangSC-Regular;
-				font-size: 10px;
-				color: #999999;
-				letter-spacing: -0.19px;
-				margin-top: -20rpx;
-			}
-			.priceBox{
-				display: flex;
-				flex-direction: row;
-				justify-content: space-between;
-				width: 100%;
-				.price{
-					color: #FF6B4A;
-					font-size: 28rpx;
-				}
-				.counter{
-					display: flex;
-					flex-direction: row;
-					justify-content: space-between;
-					font-size: 28rpx;
-					color: #333333;
-					width: 122rpx;
-					.btn{
-						display: flex;
-						justify-content: center;
-						line-height: 32rpx;
-						height: 32rpx;
-						width: 32rpx;
-						background-color: #F2F2F2;
-						color: #CFCFCF;
-					}
-				}
-			}
-		}
-	}
-	
-	.goods-data{
-		width: 100%;
-		box-sizing: border-box;
-		padding: 37rpx 40rpx 0 40rpx;
-		background: #FFFFFF;
-		border-radius: 12rpx;
-		margin-bottom: 92px;
-		.opCollapse{
-			width: 100%;
-			padding-bottom: 28rpx;
-			margin-top: 7px;
-			border-bottom: 1px solid #E9E9E9;
-			.head{
-				display: flex;
-				justify-content: space-between;
-				height: 24px;
-				// font-family: PingFangSC-Medium;
-				font-size: 16px;
-				color: #333333;
-				letter-spacing: -0.3px;
-				text-align: justify;
-				line-height: 24px;
-				margin-bottom: 18rpx;
-				.headRighted{
-					width: 0;
-					height: 0;
-					border-left: 4px solid transparent;
-					border-right: 4px solid transparent;
-					border-bottom: 4px solid #CFCFCF;
-					transform: scaleY(-1);
-					margin-top: 10px;
-				}
-				.headMid{
-					// font-family: PingFangSC-Regular;
-					font-size: 10px;
-					color: #999999;
-					letter-spacing: -0.19px;
-					margin-left: -120rpx;
-				}
-				.headRight{
-					width: 0;
-					height: 0;
-					border-left: 4px solid transparent;
-					border-right: 4px solid transparent;
-					border-bottom: 4px solid #CFCFCF;
-					margin-top: 10px;
-				}
-			}
-			.body{
-				// font-family: PingFangSC-Regular;
-				font-size: 12px;
-				color: #666666;
-				letter-spacing: 0;
-				.bodyBox{
-					margin-top: 15px;
-					.names{
-						// font-family: PingFangSC-Regular;
-						font-size: 12px;
-						color: #151515;
-						letter-spacing: 0;
-						text-align: justify;
-						line-height: 17px;
-						margin-left: 5px;
-						margin-right: 10px;
-					}
-					text{
-						// font-family: PingFangSC-Regular;
-						font-size: 12px;
-						color: #666666;
-						letter-spacing: 0;
-						text-align: justify;
-					}
-				}
+    }
+  },
+  onLoad() {
+    store.dispatch('read/fetch', {
+      pid: 9,
+    })
+  },
+  computed: {
+    attrList() {
+      return this.$store.state.read.goodInfo.attrList
+    },
+  },
+  methods: {
+    counter(isadd) {
+      if (isadd) {
+        this.count++
+      } else {
+        this.count <= 1 ? this.disabled = true : this.count--
+      }
+    },
+    myCollapseChange(isopen) {
+      // console.log(isopen)
+      this.opIsOpen = !isopen
+    },
+    changeConfirm() {
+      this.tablist.confirm = !this.tablist.confirm
+    },
 
-			}
-		}
+    bindPickerChange01: function(e) {
+      this.pickerInfoList[0].nameIndex1 = e.target.value
+    },
+    bindPickerChange02: function(e) {
+      this.pickerInfoList[0].nameIndex2 = e.target.value
+    },
 
-	}
-	
-	.goods-form {
-		display: flex;
-		flex-direction: column;
-		align-items: center;
-		justify-content: center;
-		background-color: #fff;
-    width: 100%;
-		.p1 {
-        font-size: 16px;
-        color: #333333;
-        letter-spacing: -0.3px;
-        text-align: justify;
-        line-height: 24px;
-        margin: 4px 0;
-	
+    bindPickerChange11: function(e) {
+      this.pickerInfoList[1].nameIndex1 = e.target.value
+    },
+    bindPickerChange12: function(e) {
+      this.pickerInfoList[1].nameIndex2 = e.target.value
+    },
+
+    bindPickerChange21: function(e) {
+      this.pickerInfoList[2].nameIndex1 = e.target.value
+    },
+    bindPickerChange22: function(e) {
+      this.pickerInfoList[2].nameIndex2 = e.target.value
+    },
+
+    bindPickerChange31: function(e) {
+      this.pickerInfoList[3].nameIndex1 = e.target.value
+    },
+    bindPickerChange32: function(e) {
+      this.pickerInfoList[3].nameIndex2 = e.target.value
+    },
+
+    bindPickerChange41: function(e) {
+      this.pickerInfoList[4].nameIndex1 = e.target.value
+    },
+    bindPickerChange42: function(e) {
+      this.pickerInfoList[4].nameIndex2 = e.target.value
+    },
+    bindPickerChange43: function(e) {
+      this.pickerInfoList[4].nameIndex3 = e.target.value
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.content {
+  width: 100%;
+  background-color: #f2f2f2;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+.choice-name {
+  border-bottom: 1px solid #cfcfcf;
+}
+.goods-info {
+  width: 100%;
+  height: 272rpx;
+  box-sizing: border-box;
+  padding: 40rpx 40rpx 36rpx 36rpx;
+  margin: 36rpx 0 18rpx 0;
+  // margin-bottom: -18rpx;
+  // margin-top: -36rpx;
+  background: #ffffff;
+  border-radius: 16rpx;
+  display: flex;
+  image {
+    width: 94px;
+    height: 94px;
+    margin-right: 28rpx;
+  }
+  .box-right {
+    width: 458rpx;
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    justify-content: space-between;
+    .p1 {
+      // font-family: PingFangSC-Regular;
+      font-size: 14px;
+      color: #333333;
+      letter-spacing: -0.26px;
+      text-align: justify;
+      line-height: 18px;
     }
     .p2 {
-        font-size: 12px;
+      // font-family: PingFangSC-Regular;
+      font-size: 10px;
+      color: #999999;
+      letter-spacing: -0.19px;
+      margin-top: -20rpx;
+    }
+    .priceBox {
+      display: flex;
+      flex-direction: row;
+      justify-content: space-between;
+      width: 100%;
+      .price {
+        color: #ff6b4a;
+        font-size: 28rpx;
+      }
+      .counter {
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+        font-size: 28rpx;
+        color: #333333;
+        width: 122rpx;
+        .btn {
+          display: flex;
+          justify-content: center;
+          line-height: 32rpx;
+          height: 32rpx;
+          width: 32rpx;
+          background-color: #f2f2f2;
+          color: #cfcfcf;
+        }
+      }
+    }
+  }
+}
+
+.goods-data {
+  width: 100%;
+  box-sizing: border-box;
+  padding: 37rpx 40rpx 0 40rpx;
+  background: #ffffff;
+  border-radius: 12rpx;
+  margin-bottom: 92px;
+  .opCollapse {
+    width: 100%;
+    padding-bottom: 28rpx;
+    margin-top: 7px;
+    border-bottom: 1px solid #e9e9e9;
+    .head {
+      display: flex;
+      justify-content: space-between;
+      height: 24px;
+      // font-family: PingFangSC-Medium;
+      font-size: 16px;
+      color: #333333;
+      letter-spacing: -0.3px;
+      text-align: justify;
+      line-height: 24px;
+      margin-bottom: 18rpx;
+      .headRighted {
+        width: 0;
+        height: 0;
+        border-left: 4px solid transparent;
+        border-right: 4px solid transparent;
+        border-bottom: 4px solid #cfcfcf;
+        transform: scaleY(-1);
+        margin-top: 10px;
+      }
+      .headMid {
+        // font-family: PingFangSC-Regular;
+        font-size: 10px;
         color: #999999;
-        letter-spacing: -0.23px;
-        margin-bottom: 18rpx;
+        letter-spacing: -0.19px;
+        margin-left: -120rpx;
+      }
+      .headRight {
+        width: 0;
+        height: 0;
+        border-left: 4px solid transparent;
+        border-right: 4px solid transparent;
+        border-bottom: 4px solid #cfcfcf;
+        margin-top: 10px;
+      }
+    }
+    .body {
+      // font-family: PingFangSC-Regular;
+      font-size: 12px;
+      color: #666666;
+      letter-spacing: 0;
+      .bodyBox {
+        margin-top: 15px;
+        .names {
+          // font-family: PingFangSC-Regular;
+          font-size: 12px;
+          color: #151515;
+          letter-spacing: 0;
+          text-align: justify;
+          line-height: 17px;
+          margin-left: 5px;
+          margin-right: 10px;
+        }
+        text {
+          // font-family: PingFangSC-Regular;
+          font-size: 12px;
+          color: #666666;
+          letter-spacing: 0;
+          text-align: justify;
+        }
+      }
     }
-    image{
-        width: 28rpx;
-        height: 26rpx;
+  }
+}
+
+.goods-form {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  background-color: #fff;
+  width: 100%;
+  .p1 {
+    font-size: 16px;
+    color: #333333;
+    letter-spacing: -0.3px;
+    text-align: justify;
+    line-height: 24px;
+    margin: 4px 0;
+  }
+  .p2 {
+    font-size: 12px;
+    color: #999999;
+    letter-spacing: -0.23px;
+    margin-bottom: 18rpx;
+  }
+  image {
+    width: 28rpx;
+    height: 26rpx;
+  }
+  .confirm {
+    display: flex;
+    align-items: center;
+    font-size: 12px;
+    color: #666666;
+    letter-spacing: -0.23px;
+    width: 684rpx;
+    image {
+      margin-right: 25rpx;
     }
-    .confirm {
-        display: flex;
-        align-items: center;
-        font-size: 12px;
-        color: #666666;
-        letter-spacing: -0.23px;
-        width: 684rpx;
-        image{
-            margin-right:25rpx;
+  }
+  .picker {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    width: 100%;
+    image {
+      width: 10px;
+      height: 10px;
+      margin-right: 5px;
+    }
+    .picker-choice {
+      display: flex;
+      width: 684rpx;
+      align-items: center;
+      margin-bottom: 40rpx;
+      .choice-left {
+        width: 210rpx;
+        .p11 {
+          font-size: 14px;
+          color: #333333;
+          letter-spacing: -0.26px;
+          text-align: justify;
+          line-height: 24px;
+          // margin-right: 10px;
+        }
+        .p12 {
+          font-size: 10px;
+          color: #3f3f3f;
+          letter-spacing: -0.19px;
+          text-align: justify;
+          line-height: 24px;
         }
+      }
+      .p13 {
+        font-size: 10px;
+        color: #999999;
+        letter-spacing: -0.19px;
+        margin-right: 10px;
+      }
+      .p13-date {
+        font-size: 10px;
+        color: #999999;
+        letter-spacing: -0.19px;
+        margin-right: 5px;
+      }
+      .p14 {
+        font-size: 14px;
+        color: #666666;
+        letter-spacing: -0.26px;
+        text-align: center;
+        width: 124rpx;
+        border-bottom: 1px solid #cfcfcf;
+      }
     }
-    .picker{
-			display: flex;
-			flex-direction: column;
-			justify-content: center;
-			align-items: center;
-			width: 100%;
-			image{
-				width: 10px;
-				height: 10px;
-				margin-right: 5px;
-			}
-			.picker-choice{
-				display: flex;
-				width: 684rpx;
-				align-items: center;
-				margin-bottom: 40rpx;
-				.choice-left{
-					width: 210rpx;
-					.p11 {
-						font-size: 14px;
-						color: #333333;
-						letter-spacing: -0.26px;
-						text-align: justify;
-						line-height: 24px;
-						// margin-right: 10px;
-					}
-					.p12 {
-						font-size: 10px;
-						color: #3F3F3F;
-						letter-spacing: -0.19px;
-						text-align: justify;
-						line-height: 24px;
-					}
-					
-					
-				}
-				.p13 {
-					font-size: 10px;
-					color: #999999;
-					letter-spacing: -0.19px;
-					margin-right: 10px;
-				}
-				.p13-date {
-					font-size: 10px;
-					color: #999999;
-					letter-spacing: -0.19px;
-					margin-right: 5px;
-				}
-				.p14 {
-					font-size: 14px;
-					color: #666666;
-					letter-spacing: -0.26px;
-					text-align: center;
-					width: 124rpx;
-					border-bottom: 1px solid #CFCFCF;
-				}
-				
-			}
-		}
-	}
-	
-	.submit{
-		width: 100%;
-		height: 112rpx;
-		background: #FF6B4A;
-		position: fixed;
-		bottom: 0;
-		text-align: center;
-		line-height: 112rpx;
-		// font-family: PingFangSC-Regular;
-		font-size: 16px;
-		color: #FFFFFF;
-		letter-spacing: -0.3px;
-	}
-	
+  }
+}
+
+.submit {
+  width: 100%;
+  height: 112rpx;
+  background: #ff6b4a;
+  position: fixed;
+  bottom: 0;
+  text-align: center;
+  line-height: 112rpx;
+  // font-family: PingFangSC-Regular;
+  font-size: 16px;
+  color: #ffffff;
+  letter-spacing: -0.3px;
+  /* iphonex 等安全区设置，底部安全区适配 */
+  /* #ifndef APP-NVUE */
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+  /* #endif */
+}
 </style>
diff --git a/src/pages/frameDetail/components/BottomSheet.vue b/src/pages/frameDetail/components/BottomSheet.vue
index 2a281dd..5cf18f8 100644
--- a/src/pages/frameDetail/components/BottomSheet.vue
+++ b/src/pages/frameDetail/components/BottomSheet.vue
@@ -1188,6 +1188,12 @@ export default {
     color: #ffffff;
     line-height: 112rpx;
     text-align: center;
+
+    /* iphonex 等安全区设置，底部安全区适配 */
+    /* #ifndef APP-NVUE */
+    padding-bottom: constant(safe-area-inset-bottom);
+    padding-bottom: env(safe-area-inset-bottom);
+    /* #endif */
     // position: absolute;
     bottom: 0;
     left: 0;
diff --git a/src/pages/myOrderPaying/myOrderPaying.vue b/src/pages/myOrderPaying/myOrderPaying.vue
index 015e587..f36382c 100644
--- a/src/pages/myOrderPaying/myOrderPaying.vue
+++ b/src/pages/myOrderPaying/myOrderPaying.vue
@@ -751,6 +751,11 @@ export default {
   position: fixed;
   bottom: 0;
   background: #ffffff;
+  /* iphonex 等安全区设置，底部安全区适配 */
+  /* #ifndef APP-NVUE */
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+  /* #endif */
   button {
     width: 204rpx;
     height: 80rpx;
diff --git a/src/pages/purchaseLenses/purchaseLenses.vue b/src/pages/purchaseLenses/purchaseLenses.vue
index a71be63..171f7c2 100644
--- a/src/pages/purchaseLenses/purchaseLenses.vue
+++ b/src/pages/purchaseLenses/purchaseLenses.vue
@@ -36,139 +36,204 @@
       <view class="opCollapse">
         <view class="body">
           <template v-if="opIsOpen">
-      <view class="goods-form">
-        <view class="p1">
-          <image class="image2" src="../../static/img/myOpticsData/dataWrite.png" mode="aspectFit"></image>
-          填写验光数据
-        </view>
-        <text class="p2">没有验光数据？请到线下眼镜店验光哦～</text>
-        <view class="picker">
-          <view class="picker-choice">
-            <view class="choice-left">
-              <text class="pd">验光单取名:</text>
-            </view>
-            <input type="text" @blur="handleInput" class="input"
-            placeholder="请输入名称" maxlength="20" :value="name" />
-          </view>
-        </view>
-        <view class="picker" >
-          <view class="picker-choice">
-            <view class="choice-left">
-              <text class="p11">{{pickerInfoList[0].nameC}}</text>
-              <text class="p12">{{pickerInfoList[0].nameE}}</text>
-            </view>
-            <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
-            <!-- <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text> -->
-            <picker  @change="bindPickerChange01" :value="pickerInfoList[0].nameIndex1" :range="pickerInfoList[0].nameArray1">
-              <view class="p14">
-              {{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}
-              <image src="../../static/detail-tabicon.png" ></image>
+            <view class="goods-form">
+              <view class="p1">
+                <image
+                  class="image2"
+                  src="../../static/img/myOpticsData/dataWrite.png"
+                  mode="aspectFit"
+                ></image>
+                填写验光数据
               </view>
-              <!-- <image src="../../static/detail-tabicon.png" ></image> -->
-            </picker>
-            <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
-            <!-- <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text> -->
-            <picker @change="bindPickerChange02" :value="pickerInfoList[0].nameIndex2" :range="pickerInfoList[0].nameArray2">
-              <view class="p14">
-              {{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}
-              <image src="../../static/detail-tabicon.png" ></image>
+              <text class="p2">没有验光数据？请到线下眼镜店验光哦～</text>
+              <view class="picker">
+                <view class="picker-choice">
+                  <view class="choice-left">
+                    <text class="pd">验光单取名:</text>
+                  </view>
+                  <input
+                    type="text"
+                    @blur="handleInput"
+                    class="input"
+                    placeholder="请输入名称"
+                    maxlength="20"
+                    :value="name"
+                  />
+                </view>
               </view>
-              <!-- <image src="../../static/detail-tabicon.png" ></image> -->
-            </picker>
-          </view>
-        </view>
-        <view class="picker" >
-          <view class="picker-choice">
-            <view class="choice-left">
-              <text class="p11">{{pickerInfoList[1].nameC}}</text>
-              <text class="p12">{{pickerInfoList[1].nameE}}</text>
-            </view>
-            <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
-            <!-- <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text> -->
-            <picker @change="bindPickerChange11" :value="pickerInfoList[1].nameIndex1" :range="pickerInfoList[1].nameArray1">
-              <view class="p14">
-                {{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}
-                <image src="../../static/detail-tabicon.png" ></image>
+              <view class="picker">
+                <view class="picker-choice">
+                  <view class="choice-left">
+                    <text class="p11">{{pickerInfoList[0].nameC}}</text>
+                    <text class="p12">{{pickerInfoList[0].nameE}}</text>
+                  </view>
+                  <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
+                  <!-- <text class="p14">{{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}</text> -->
+                  <picker
+                    @change="bindPickerChange01"
+                    :value="pickerInfoList[0].nameIndex1"
+                    :range="pickerInfoList[0].nameArray1"
+                  >
+                    <view class="p14">
+                      {{pickerInfoList[0].nameArray1[pickerInfoList[0].nameIndex1]}}
+                      <image src="../../static/detail-tabicon.png"></image>
+                    </view>
+                    <!-- <image src="../../static/detail-tabicon.png" ></image> -->
+                  </picker>
+                  <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
+                  <!-- <text class="p14">{{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}</text> -->
+                  <picker
+                    @change="bindPickerChange02"
+                    :value="pickerInfoList[0].nameIndex2"
+                    :range="pickerInfoList[0].nameArray2"
+                  >
+                    <view class="p14">
+                      {{pickerInfoList[0].nameArray2[pickerInfoList[0].nameIndex2]}}
+                      <image src="../../static/detail-tabicon.png"></image>
+                    </view>
+                    <!-- <image src="../../static/detail-tabicon.png" ></image> -->
+                  </picker>
+                </view>
               </view>
-              <!-- <image src="../../static/detail-tabicon.png" ></image> -->
-            </picker>
-            <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
-            <!-- <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text> -->
-            <picker @change="bindPickerChange12" :value="pickerInfoList[1].nameIndex2" :range="pickerInfoList[1].nameArray2">
-              <view class="p14">
-                {{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}
-                <image src="../../static/detail-tabicon.png" ></image>
+              <view class="picker">
+                <view class="picker-choice">
+                  <view class="choice-left">
+                    <text class="p11">{{pickerInfoList[1].nameC}}</text>
+                    <text class="p12">{{pickerInfoList[1].nameE}}</text>
+                  </view>
+                  <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
+                  <!-- <text class="p14">{{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}</text> -->
+                  <picker
+                    @change="bindPickerChange11"
+                    :value="pickerInfoList[1].nameIndex1"
+                    :range="pickerInfoList[1].nameArray1"
+                  >
+                    <view class="p14">
+                      {{pickerInfoList[1].nameArray1[pickerInfoList[1].nameIndex1]}}
+                      <image src="../../static/detail-tabicon.png"></image>
+                    </view>
+                    <!-- <image src="../../static/detail-tabicon.png" ></image> -->
+                  </picker>
+                  <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
+                  <!-- <text class="p14">{{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}</text> -->
+                  <picker
+                    @change="bindPickerChange12"
+                    :value="pickerInfoList[1].nameIndex2"
+                    :range="pickerInfoList[1].nameArray2"
+                  >
+                    <view class="p14">
+                      {{pickerInfoList[1].nameArray2[pickerInfoList[1].nameIndex2]}}
+                      <image src="../../static/detail-tabicon.png"></image>
+                    </view>
+                    <!-- <image src="../../static/detail-tabicon.png" ></image> -->
+                  </picker>
+                </view>
               </view>
-              <!-- <image src="../../static/detail-tabicon.png" ></image> -->
-            </picker>
-          </view>
-        </view>
-        <view class="picker" >
-          <view class="picker-choice">
-            <view class="choice-left">
-              <text class="p11">{{pickerInfoList[2].nameC}}</text>
-              <text class="p12">{{pickerInfoList[2].nameE}}</text>
-            </view>
-            <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
-            <picker @change="bindPickerChange21" :value="pickerInfoList[2].nameIndex1" :range="pickerInfoList[2].nameArray1">
-              <view class="p14">
-                {{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}}
-                <image src="../../static/detail-tabicon.png" ></image>
+              <view class="picker">
+                <view class="picker-choice">
+                  <view class="choice-left">
+                    <text class="p11">{{pickerInfoList[2].nameC}}</text>
+                    <text class="p12">{{pickerInfoList[2].nameE}}</text>
+                  </view>
+                  <text class="p13">左&nbsp;&nbsp;&nbsp;(OD)</text>
+                  <picker
+                    @change="bindPickerChange21"
+                    :value="pickerInfoList[2].nameIndex1"
+                    :range="pickerInfoList[2].nameArray1"
+                  >
+                    <view class="p14">
+                      {{pickerInfoList[2].nameArray1[pickerInfoList[2].nameIndex1]}}
+                      <image src="../../static/detail-tabicon.png"></image>
+                    </view>
+                  </picker>
+                  <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
+                  <!-- <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text> -->
+                  <picker
+                    @change="bindPickerChange22"
+                    :value="pickerInfoList[2].nameIndex2"
+                    :range="pickerInfoList[2].nameArray2"
+                  >
+                    <view class="p14">
+                      {{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}
+                      <image src="../../static/detail-tabicon.png"></image>
+                    </view>
+                    <!-- <image src="../../static/detail-tabicon.png" ></image> -->
+                  </picker>
+                </view>
               </view>
-            </picker>
-            <text class="p13">右&nbsp;&nbsp;&nbsp;(OS)</text>
-            <!-- <text class="p14">{{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}</text> -->
-            <picker @change="bindPickerChange22" :value="pickerInfoList[2].nameIndex2" :range="pickerInfoList[2].nameArray2">
-              <view class="p14">
-                {{pickerInfoList[2].nameArray2[pickerInfoList[2].nameIndex2]}}
-                <image src="../../static/detail-tabicon.png" ></image>
+              <view class="picker">
+                <view class="picker-choice">
+                  <view class="choice-left">
+                    <text class="pd">瞳距:</text>
+                  </view>
+                  <input
+                    type="digit"
+                    @change="handleInputPd"
+                    class="input"
+                    placeholder="请输入瞳距,单位cm"
+                    maxlength="20"
+                    :value="pd"
+                  />
+                </view>
               </view>
-              <!-- <image src="../../static/detail-tabicon.png" ></image> -->
-            </picker>
-          </view>
-        </view>
-        <view class="picker">
-          <view class="picker-choice">
-            <view class="choice-left">
-              <text class="pd">瞳距:</text>
-            </view>
-            <input type="digit" @change="handleInputPd" class="input"
-            placeholder="请输入瞳距,单位cm" maxlength="20" :value="pd" />
-          </view>
-        </view>
-        <view class="picker" >
-          <view class="picker-choice">
-            <view class="choice-left">
-              <text class="p11">{{pickerInfoList[3].nameC}}</text>
-            </view>
-            <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text>
-            <picker @change="bindPickerChange41" :value="pickerInfoList[3].nameIndex1" :range="pickerInfoList[3].nameArray1">
-              <view class="p14" style="width: 30px;">
-                {{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}
-                <image src="../../static/detail-tabicon.png" ></image>
-              </view>
-            </picker>
-            <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text>
-            <picker @change="bindPickerChange42" :value="pickerInfoList[3].nameIndex2" :range="pickerInfoList[3].nameArray2">
-              <view class="p14" style="width: 30px;">
-                {{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}
-                <image src="../../static/detail-tabicon.png" ></image>
+              <view class="picker">
+                <view class="picker-choice">
+                  <view class="choice-left">
+                    <text class="p11">{{pickerInfoList[3].nameC}}</text>
+                  </view>
+                  <text class="p13-date">年&nbsp;&nbsp;&nbsp;(Y)</text>
+                  <picker
+                    @change="bindPickerChange41"
+                    :value="pickerInfoList[3].nameIndex1"
+                    :range="pickerInfoList[3].nameArray1"
+                  >
+                    <view
+                      class="p14"
+                      style="width: 30px;"
+                    >
+                      {{pickerInfoList[3].nameArray1[pickerInfoList[3].nameIndex1]}}
+                      <image src="../../static/detail-tabicon.png"></image>
+                    </view>
+                  </picker>
+                  <text class="p13-date">月&nbsp;&nbsp;&nbsp;(M)</text>
+                  <picker
+                    @change="bindPickerChange42"
+                    :value="pickerInfoList[3].nameIndex2"
+                    :range="pickerInfoList[3].nameArray2"
+                  >
+                    <view
+                      class="p14"
+                      style="width: 30px;"
+                    >
+                      {{pickerInfoList[3].nameArray2[pickerInfoList[3].nameIndex2]}}
+                      <image src="../../static/detail-tabicon.png"></image>
+                    </view>
+                  </picker>
+                  <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text>
+                  <picker
+                    @change="bindPickerChange43"
+                    :value="pickerInfoList[3].nameIndex3"
+                    :range="pickerInfoList[3].nameArray3"
+                  >
+                    <view
+                      class="p14"
+                      style="width: 30px;"
+                    >
+                      {{pickerInfoList[3].nameArray3[pickerInfoList[3].nameIndex3]}}
+                      <image src="../../static/detail-tabicon.png"></image>
+                    </view>
+                  </picker>
+                </view>
               </view>
-            </picker>
-            <text class="p13-date">日&nbsp;&nbsp;&nbsp;(D)</text>
-            <picker @change="bindPickerChange43" :value="pickerInfoList[3].nameIndex3" :range="pickerInfoList[3].nameArray3">
-              <view class="p14" style="width: 30px;">
-                {{pickerInfoList[3].nameArray3[pickerInfoList[3].nameIndex3]}}
-                <image src="../../static/detail-tabicon.png" ></image>
+              <view class="confirm">
+                <image
+                  class="image1"
+                  :src="confirm ? tabicon[0] : tabicon[1]"
+                  @tap="changeConfirm"
+                ></image>
+                <text>确认以上输入信息来源于我的验光数据!</text>
               </view>
-            </picker>
-          </view>
-        </view>
-        <view class="confirm">
-          <image class="image1" :src="confirm ? tabicon[0] : tabicon[1]" @tap="changeConfirm"></image>
-          <text>确认以上输入信息来源于我的验光数据!</text>
-        </view>
-      </view>
+            </view>
           </template>
           <template v-else>
             <view
@@ -1010,129 +1075,126 @@ export default {
       //     }
       //   }
       // }
-    .goods-form {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
-      background-color: #fff;
+      .goods-form {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        background-color: #fff;
         width: 100%;
         padding: 40rpx 0;
-      .p1 {
-            font-size: 16px;
-            color: #333333;
-            letter-spacing: -0.3px;
-            text-align: justify;
-            line-height: 24px;
-            margin: 4px 0;
-
+        .p1 {
+          font-size: 16px;
+          color: #333333;
+          letter-spacing: -0.3px;
+          text-align: justify;
+          line-height: 24px;
+          margin: 4px 0;
         }
         .p2 {
-            font-size: 12px;
-            color: #999999;
-            letter-spacing: -0.23px;
-            margin-bottom: 32rpx;
+          font-size: 12px;
+          color: #999999;
+          letter-spacing: -0.23px;
+          margin-bottom: 32rpx;
         }
-        .image2{
-            width: 42rpx;
-            height: 34rpx;
-        margin-right: 12rpx;
+        .image2 {
+          width: 42rpx;
+          height: 34rpx;
+          margin-right: 12rpx;
         }
         .confirm {
-            display: flex;
-            align-items: center;
-            font-size: 12px;
-            color: #666666;
-            letter-spacing: -0.23px;
-            width: 684rpx;
-            .image1{
-                margin-right:25rpx;
-          width: 42rpx;
-          height: 38rpx;
-            }
+          display: flex;
+          align-items: center;
+          font-size: 12px;
+          color: #666666;
+          letter-spacing: -0.23px;
+          width: 684rpx;
+          .image1 {
+            margin-right: 25rpx;
+            width: 42rpx;
+            height: 38rpx;
+          }
         }
-        .picker{
-      display: flex;
-      flex-direction: column;
-      justify-content: center;
-      align-items: center;
-      width: 100%;
+        .picker {
+          display: flex;
+          flex-direction: column;
+          justify-content: center;
+          align-items: center;
+          width: 100%;
 
-      .picker-choice{
-        display: flex;
-        width: 684rpx;
-        align-items: center;
+          .picker-choice {
+            display: flex;
+            width: 684rpx;
+            align-items: center;
             margin-bottom: 40rpx;
-        .input{
-          border-bottom: 1px solid #CFCFCF;
-          height: 40rpx;
-        }
-        .choice-left{
-          width: 210rpx;
-          .pd{
-            font-size: 14px;
-            color: #333333;
-            letter-spacing: -0.26px;
-            text-align: justify;
-            line-height: 24px;
-            margin-right: 44rpx;
-          }
-          .p11 {
-            font-size: 14px;
-            color: #333333;
-            letter-spacing: -0.26px;
-            text-align: justify;
-            line-height: 24px;
-            // margin-right: 10px;
-          }
-          .p12 {
-            font-size: 10px;
-            color: #3F3F3F;
-            letter-spacing: -0.19px;
-            text-align: justify;
-            line-height: 24px;
-          }
-
-        }
-        .p13 {
-          font-size: 10px;
-          color: #999999;
-          letter-spacing: -0.19px;
-          margin-right: 10px;
-        }
-            .p13-date {
+            .input {
+              border-bottom: 1px solid #cfcfcf;
+              height: 40rpx;
+            }
+            .choice-left {
+              width: 210rpx;
+              .pd {
+                font-size: 14px;
+                color: #333333;
+                letter-spacing: -0.26px;
+                text-align: justify;
+                line-height: 24px;
+                margin-right: 44rpx;
+              }
+              .p11 {
+                font-size: 14px;
+                color: #333333;
+                letter-spacing: -0.26px;
+                text-align: justify;
+                line-height: 24px;
+                // margin-right: 10px;
+              }
+              .p12 {
                 font-size: 10px;
-          color: #999999;
-          letter-spacing: -0.19px;
-          margin-right: 5px;
+                color: #3f3f3f;
+                letter-spacing: -0.19px;
+                text-align: justify;
+                line-height: 24px;
+              }
+            }
+            .p13 {
+              font-size: 10px;
+              color: #999999;
+              letter-spacing: -0.19px;
+              margin-right: 10px;
+            }
+            .p13-date {
+              font-size: 10px;
+              color: #999999;
+              letter-spacing: -0.19px;
+              margin-right: 5px;
+            }
+            picker {
+              width: 144rpx;
+              height: 40rpx;
+              display: flex;
+              position: relative;
+              .p14 {
+                font-size: 14px;
+                color: #666666;
+                letter-spacing: -0.26px;
+                text-align: center;
+                width: 124rpx;
+                border-bottom: 1px solid #cfcfcf;
+                height: 38rpx;
+              }
+              image {
+                width: 20rpx;
+                height: 20rpx;
+                position: absolute;
+                right: 20rpx;
+                top: 8rpx;
+              }
             }
-        picker{
-          width: 144rpx;
-          height: 40rpx;
-          display: flex;
-          position: relative;
-          .p14 {
-            font-size: 14px;
-            color: #666666;
-            letter-spacing: -0.26px;
-            text-align: center;
-            width: 124rpx;
-            border-bottom: 1px solid #CFCFCF;
-            height: 38rpx;
-          }
-          image{
-            width: 20rpx;
-            height: 20rpx;
-            position: absolute;
-            right: 20rpx;
-            top: 8rpx;
           }
         }
-
       }
     }
-    }
-    }
   }
   .choose {
     width: 100%;
@@ -1201,6 +1263,12 @@ export default {
     position: fixed;
     bottom: 0;
     left: 0;
+
+    /* iphonex 等安全区设置，底部安全区适配 */
+    /* #ifndef APP-NVUE */
+    padding-bottom: constant(safe-area-inset-bottom);
+    padding-bottom: env(safe-area-inset-bottom);
+    /* #endif */
   }
 }
 </style>