Browse Source

feat: 修改页面

Moss 1 year ago
parent
commit
aa7771d2a1
5 changed files with 139 additions and 94 deletions
  1. 82 89
      package-lock.json
  2. 20 1
      src/App.vue
  3. 18 2
      src/components/zj-container/zj-page-layout.vue
  4. 12 1
      src/pages/index/index.vue
  5. 7 1
      src/pages/mine/index.vue

+ 82 - 89
package-lock.json

@@ -3054,6 +3054,44 @@
           "integrity": "sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==",
           "dev": true
         },
+        "ansi-styles": {
+          "version": "4.3.0",
+          "resolved": "https://registry.npmmirror.com/ansi-styles/-/ansi-styles-4.3.0.tgz",
+          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "color-convert": "^2.0.1"
+          }
+        },
+        "chalk": {
+          "version": "4.1.2",
+          "resolved": "https://registry.npmmirror.com/chalk/-/chalk-4.1.2.tgz",
+          "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "ansi-styles": "^4.1.0",
+            "supports-color": "^7.1.0"
+          }
+        },
+        "color-convert": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmmirror.com/color-convert/-/color-convert-2.0.1.tgz",
+          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "color-name": "~1.1.4"
+          }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npmmirror.com/color-name/-/color-name-1.1.4.tgz",
+          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+          "dev": true,
+          "optional": true
+        },
         "css-loader": {
           "version": "3.6.0",
           "resolved": "https://registry.npmmirror.com/css-loader/-/css-loader-3.6.0.tgz",
@@ -3111,6 +3149,13 @@
             "pump": "^3.0.0"
           }
         },
+        "has-flag": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmmirror.com/has-flag/-/has-flag-4.0.0.tgz",
+          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+          "dev": true,
+          "optional": true
+        },
         "hash-sum": {
           "version": "2.0.0",
           "resolved": "https://registry.npmmirror.com/hash-sum/-/hash-sum-2.0.0.tgz",
@@ -3213,6 +3258,42 @@
           "requires": {
             "minipass": "^3.1.1"
           }
+        },
+        "supports-color": {
+          "version": "7.2.0",
+          "resolved": "https://registry.npmmirror.com/supports-color/-/supports-color-7.2.0.tgz",
+          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "has-flag": "^4.0.0"
+          }
+        },
+        "vue-loader-v16": {
+          "version": "npm:vue-loader@16.8.3",
+          "resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-16.8.3.tgz",
+          "integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "chalk": "^4.1.0",
+            "hash-sum": "^2.0.0",
+            "loader-utils": "^2.0.0"
+          },
+          "dependencies": {
+            "loader-utils": {
+              "version": "2.0.4",
+              "resolved": "https://registry.npmmirror.com/loader-utils/-/loader-utils-2.0.4.tgz",
+              "integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
+              "dev": true,
+              "optional": true,
+              "requires": {
+                "big.js": "^5.2.2",
+                "emojis-list": "^3.0.0",
+                "json5": "^2.1.2"
+              }
+            }
+          }
         }
       }
     },
@@ -16154,94 +16235,6 @@
         "vue-style-loader": "^4.1.0"
       }
     },
-    "vue-loader-v16": {
-      "version": "npm:vue-loader@16.8.3",
-      "resolved": "http://121.41.110.30:4873/vue-loader/-/vue-loader-16.8.3.tgz",
-      "integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "chalk": "^4.1.0",
-        "hash-sum": "^2.0.0",
-        "loader-utils": "^2.0.0"
-      },
-      "dependencies": {
-        "ansi-styles": {
-          "version": "4.3.0",
-          "resolved": "http://121.41.110.30:4873/ansi-styles/-/ansi-styles-4.3.0.tgz",
-          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "color-convert": "^2.0.1"
-          }
-        },
-        "chalk": {
-          "version": "4.1.2",
-          "resolved": "http://121.41.110.30:4873/chalk/-/chalk-4.1.2.tgz",
-          "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "ansi-styles": "^4.1.0",
-            "supports-color": "^7.1.0"
-          }
-        },
-        "color-convert": {
-          "version": "2.0.1",
-          "resolved": "http://121.41.110.30:4873/color-convert/-/color-convert-2.0.1.tgz",
-          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "color-name": "~1.1.4"
-          }
-        },
-        "color-name": {
-          "version": "1.1.4",
-          "resolved": "http://121.41.110.30:4873/color-name/-/color-name-1.1.4.tgz",
-          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-          "dev": true,
-          "optional": true
-        },
-        "has-flag": {
-          "version": "4.0.0",
-          "resolved": "http://121.41.110.30:4873/has-flag/-/has-flag-4.0.0.tgz",
-          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
-          "dev": true,
-          "optional": true
-        },
-        "hash-sum": {
-          "version": "2.0.0",
-          "resolved": "http://121.41.110.30:4873/hash-sum/-/hash-sum-2.0.0.tgz",
-          "integrity": "sha512-WdZTbAByD+pHfl/g9QSsBIIwy8IT+EsPiKDs0KNX+zSHhdDLFKdZu0BQHljvO+0QI/BasbMSUa8wYNCZTvhslg==",
-          "dev": true,
-          "optional": true
-        },
-        "loader-utils": {
-          "version": "2.0.4",
-          "resolved": "http://121.41.110.30:4873/loader-utils/-/loader-utils-2.0.4.tgz",
-          "integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "big.js": "^5.2.2",
-            "emojis-list": "^3.0.0",
-            "json5": "^2.1.2"
-          }
-        },
-        "supports-color": {
-          "version": "7.2.0",
-          "resolved": "http://121.41.110.30:4873/supports-color/-/supports-color-7.2.0.tgz",
-          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "has-flag": "^4.0.0"
-          }
-        }
-      }
-    },
     "vue-pdf": {
       "version": "4.3.0",
       "resolved": "https://registry.npmmirror.com/vue-pdf/-/vue-pdf-4.3.0.tgz",
@@ -16946,7 +16939,7 @@
     },
     "weixin-js-sdk": {
       "version": "1.6.3",
-      "resolved": "http://121.41.110.30:4873/weixin-js-sdk/-/weixin-js-sdk-1.6.3.tgz",
+      "resolved": "https://registry.npmmirror.com/weixin-js-sdk/-/weixin-js-sdk-1.6.3.tgz",
       "integrity": "sha512-5jYNtVcxWmgHNqCLSPoX6vXab9G4RPDZx0klX8IsVwGjDTwx/UDmgfF7fkRMGguRpuFv0O7tk1jb+Oay2QiV1w=="
     },
     "whatwg-encoding": {

+ 20 - 1
src/App.vue

@@ -19,7 +19,26 @@
   }
   export default {
     onLaunch: function() {
-      console.log(12343545)
+      uni.getSystemInfo({
+      	success: function(e) {
+      		console.log(e);
+      		Vue.prototype.StatusBar = e.statusBarHeight;
+      		// #ifdef MP-WEIXIN
+      		let custom = wx.getMenuButtonBoundingClientRect();
+      		Vue.prototype.Custom = custom;
+      		Vue.prototype.CustomBar = custom.bottom + custom.top - e.statusBarHeight + 4;
+      		// #endif
+          // #ifndef MP-WEIXIN
+          Vue.prototype.CustomBar = 48
+          // #endif
+      		//用来判断是否iphoneX类型的全面屏设备
+      		if (e.model.indexOf('iPhone X') == 0) {
+      			Vue.prototype.isIphoneX = 68;
+      		} else {
+      			Vue.prototype.isIphoneX = 0;
+      		}
+      	},
+      });
     },
     onShow: function() {
       // console.log('App Show')

+ 18 - 2
src/components/zj-container/zj-page-layout.vue

@@ -2,7 +2,7 @@
 	<view
 		class="app-container"
 		:class="hasFooter || isTabbar ? '':'pb'"
-		:style="{background: bgColor, height: 'calc(100vh - ' + (isTabbar ? '50' : '44') + 'px)'}">
+		:style="{background: bgColor, height: 'calc(100vh - ' + aHeight + 'px)'}">
 		<u-loading-page
 			loading-text="家盛茂工程师"
 			color="#333333"
@@ -48,6 +48,8 @@
 </template>
 
 <script>
+  import { isWeixin } from "@/common/utils/common.js"
+
 	export default {
 		props: {
 			bgColor: {
@@ -83,7 +85,21 @@
 						return false;
 					}
 				}
-			}
+			},
+
+      aHeight() {
+        let num = 0;
+        if (isWeixin()) {
+          num = 0;
+        } else {
+          if(this.isTabbar) {
+            num = 50;
+          }else {
+            num = 44;
+          }
+        }
+        return num;
+      }
 		}
 	}
 </script>

+ 12 - 1
src/pages/index/index.vue

@@ -1,4 +1,5 @@
 <template>
+  <!-- #ifdef H5 -->
   <view>
     <view class="bg-container"></view>
     <zj-page-layout
@@ -8,7 +9,7 @@
     	@refresherrefresh="refresherrefresh"
     	@scrolltolower="scrolltolower">
       <template slot="header">
-        <view class="header-container">二手空调</view>
+        <view class="header-container" :style="cuStyle">二手空调</view>
       </template>
 
       <view class="all-container">
@@ -87,6 +88,10 @@
 
     </zj-page-layout>
   </view>
+  <!-- #endif -->
+  <!-- #ifndef H5 -->
+  <web-view :src="webViewHref('/pages/index/index')"></web-view>
+  <!-- #endif -->
 </template>
 
 <script>
@@ -112,6 +117,12 @@
         ],
       }
     },
+    
+    computed:{
+    	cuStyle(){
+    		return `height:${this.CustomBar-this.StatusBar}px; padding-top:${this.StatusBar}px;`
+    	},
+    },
 
     async onLoad() {
       // await this.getList()

+ 7 - 1
src/pages/mine/index.vue

@@ -8,7 +8,7 @@
     	:refresherTriggered="refresherTriggered"
     	@refresherrefresh="refresherrefresh">
       <template slot="header">
-        <view class="header-container">我的</view>
+        <view class="header-container" :style="cuStyle">我的</view>
       </template>
 
       <view class="all-container">
@@ -109,6 +109,12 @@ export default {
       ],
     }
   },
+  
+  computed:{
+  	cuStyle(){
+  		return `height:${this.CustomBar-this.StatusBar}px; padding-top:${this.StatusBar}px;`
+  	},
+  },
 
   watch: {