|
@@ -1,178 +1,179 @@
|
|
|
<script>
|
|
<script>
|
|
|
- export default {
|
|
|
|
|
- globalData: {
|
|
|
|
|
- // 胶囊距上距离
|
|
|
|
|
- menuTop: 0,
|
|
|
|
|
- // 导航栏高度
|
|
|
|
|
- navBarHeight: 0,
|
|
|
|
|
- // 胶囊距右方间距(方保持左、右间距一致)
|
|
|
|
|
- menuRight: 0,
|
|
|
|
|
- // 胶囊距底部间距(保持底部间距一致)
|
|
|
|
|
- menuBotton: 0,
|
|
|
|
|
- // 胶囊高度(自定义内容可与胶囊高度保证一致)
|
|
|
|
|
- menuHeight: 0,
|
|
|
|
|
- // 状态栏高度
|
|
|
|
|
- statusBarHeight: 0,
|
|
|
|
|
- // 安全距离
|
|
|
|
|
- safeAreaHeight: 0,
|
|
|
|
|
- // 胶囊宽度
|
|
|
|
|
- menuWidth: 0,
|
|
|
|
|
- // 窗口宽度
|
|
|
|
|
- windowWidth: 0,
|
|
|
|
|
- // 窗口宽度高度
|
|
|
|
|
- windowHeight: 0,
|
|
|
|
|
- // 常规子页面可操作区域高度
|
|
|
|
|
- pageContentHeight: 0,
|
|
|
|
|
-
|
|
|
|
|
- },
|
|
|
|
|
- onLaunch(options) {
|
|
|
|
|
- const that = this;
|
|
|
|
|
- // 获取系统信息
|
|
|
|
|
- const systemInfo = uni.getSystemInfoSync();
|
|
|
|
|
- // 胶囊按钮位置信息
|
|
|
|
|
- const menuButtonInfo = wx.getMenuButtonBoundingClientRect();
|
|
|
|
|
- console.log(menuButtonInfo);
|
|
|
|
|
- // 导航栏高度 = 状态栏到胶囊的间距(胶囊距上距离-状态栏高度) * 2 + 胶囊高度 + 状态栏高度
|
|
|
|
|
- that.globalData.menuTop = menuButtonInfo.top - systemInfo.statusBarHeight;
|
|
|
|
|
- that.globalData.menuBotton = menuButtonInfo.top - systemInfo.statusBarHeight;
|
|
|
|
|
- that.globalData.menuWidth = menuButtonInfo.width;
|
|
|
|
|
- that.globalData.navBarHeight = (menuButtonInfo.top - systemInfo.statusBarHeight) * 2 + menuButtonInfo.height +
|
|
|
|
|
- systemInfo.statusBarHeight;
|
|
|
|
|
- that.globalData.menuRight = systemInfo.screenWidth - menuButtonInfo.right;
|
|
|
|
|
- that.globalData.menuHeight = menuButtonInfo.height;
|
|
|
|
|
- that.globalData.statusBarHeight = systemInfo.statusBarHeight;
|
|
|
|
|
- that.globalData.safeAreaHeight = systemInfo.safeAreaInsets.bottom;
|
|
|
|
|
- that.globalData.windowWidth = systemInfo.windowWidth;
|
|
|
|
|
- that.globalData.windowHeight = systemInfo.windowHeight;
|
|
|
|
|
- that.globalData.pageContentHeight = systemInfo.windowHeight - (that.globalData.navBarHeight + that.globalData
|
|
|
|
|
- .menuTop + that.globalData.menuBotton);
|
|
|
|
|
-
|
|
|
|
|
- console.log(that.globalData);
|
|
|
|
|
- this.slientLogin()
|
|
|
|
|
- },
|
|
|
|
|
- methods: {
|
|
|
|
|
- slientLogin() {
|
|
|
|
|
- uni.login({
|
|
|
|
|
- success(res) {
|
|
|
|
|
- uni.$u.http.post('/user/wxLogin', {
|
|
|
|
|
- code: res.code
|
|
|
|
|
- }).then((response) => {
|
|
|
|
|
- if (response.code == 200) {
|
|
|
|
|
- uni.setStorageSync('token', response.data.token)
|
|
|
|
|
- }
|
|
|
|
|
- })
|
|
|
|
|
- },
|
|
|
|
|
- fail: (err) => {
|
|
|
|
|
- console.log(err, 'wx.login登录失败')
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- })
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- };
|
|
|
|
|
|
|
+export default {
|
|
|
|
|
+ globalData: {
|
|
|
|
|
+ // 胶囊距上距离
|
|
|
|
|
+ menuTop: 0,
|
|
|
|
|
+ // 导航栏高度
|
|
|
|
|
+ navBarHeight: 0,
|
|
|
|
|
+ // 胶囊距右方间距(方保持左、右间距一致)
|
|
|
|
|
+ menuRight: 0,
|
|
|
|
|
+ // 胶囊距底部间距(保持底部间距一致)
|
|
|
|
|
+ menuBotton: 0,
|
|
|
|
|
+ // 胶囊高度(自定义内容可与胶囊高度保证一致)
|
|
|
|
|
+ menuHeight: 0,
|
|
|
|
|
+ // 状态栏高度
|
|
|
|
|
+ statusBarHeight: 0,
|
|
|
|
|
+ // 安全距离
|
|
|
|
|
+ safeAreaHeight: 0,
|
|
|
|
|
+ // 胶囊宽度
|
|
|
|
|
+ menuWidth: 0,
|
|
|
|
|
+ // 窗口宽度
|
|
|
|
|
+ windowWidth: 0,
|
|
|
|
|
+ // 窗口宽度高度
|
|
|
|
|
+ windowHeight: 0,
|
|
|
|
|
+ // 常规子页面可操作区域高度
|
|
|
|
|
+ pageContentHeight: 0,
|
|
|
|
|
+ },
|
|
|
|
|
+ onLaunch(options) {
|
|
|
|
|
+ const that = this;
|
|
|
|
|
+ // 获取系统信息
|
|
|
|
|
+ const systemInfo = uni.getSystemInfoSync();
|
|
|
|
|
+ // 胶囊按钮位置信息
|
|
|
|
|
+ const menuButtonInfo = wx.getMenuButtonBoundingClientRect();
|
|
|
|
|
+ console.log(menuButtonInfo);
|
|
|
|
|
+ // 导航栏高度 = 状态栏到胶囊的间距(胶囊距上距离-状态栏高度) * 2 + 胶囊高度 + 状态栏高度
|
|
|
|
|
+ that.globalData.menuTop = menuButtonInfo.top - systemInfo.statusBarHeight;
|
|
|
|
|
+ that.globalData.menuBotton = menuButtonInfo.top - systemInfo.statusBarHeight;
|
|
|
|
|
+ that.globalData.menuWidth = menuButtonInfo.width;
|
|
|
|
|
+ that.globalData.navBarHeight =
|
|
|
|
|
+ (menuButtonInfo.top - systemInfo.statusBarHeight) * 2 + menuButtonInfo.height + systemInfo.statusBarHeight;
|
|
|
|
|
+ that.globalData.menuRight = systemInfo.screenWidth - menuButtonInfo.right;
|
|
|
|
|
+ that.globalData.menuHeight = menuButtonInfo.height;
|
|
|
|
|
+ that.globalData.statusBarHeight = systemInfo.statusBarHeight;
|
|
|
|
|
+ that.globalData.safeAreaHeight = systemInfo.safeAreaInsets.bottom;
|
|
|
|
|
+ that.globalData.windowWidth = systemInfo.windowWidth;
|
|
|
|
|
+ that.globalData.windowHeight = systemInfo.windowHeight;
|
|
|
|
|
+ that.globalData.pageContentHeight =
|
|
|
|
|
+ systemInfo.windowHeight -
|
|
|
|
|
+ (that.globalData.navBarHeight + that.globalData.menuTop + that.globalData.menuBotton);
|
|
|
|
|
+
|
|
|
|
|
+ const inviteCode = options.inviteCode || "";
|
|
|
|
|
+ this.slientLogin(inviteCode);
|
|
|
|
|
+ },
|
|
|
|
|
+ methods: {
|
|
|
|
|
+ slientLogin(inviteCode) {
|
|
|
|
|
+ uni.login({
|
|
|
|
|
+ success(res) {
|
|
|
|
|
+ uni.$u.http
|
|
|
|
|
+ .post("/user/wxLogin", {
|
|
|
|
|
+ code: res.code,
|
|
|
|
|
+ inviteCode,
|
|
|
|
|
+ })
|
|
|
|
|
+ .then((response) => {
|
|
|
|
|
+ if (response.code == 200) {
|
|
|
|
|
+ uni.setStorageSync("token", response.data.token);
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ fail: (err) => {
|
|
|
|
|
+ console.log(err, "wx.login登录失败");
|
|
|
|
|
+ },
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ },
|
|
|
|
|
+};
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<style lang="scss">
|
|
<style lang="scss">
|
|
|
- // ===
|
|
|
|
|
- // === 注意:此处导入的css,会作用于全部.vue文件,请适量导入
|
|
|
|
|
- // ===
|
|
|
|
|
- body {
|
|
|
|
|
- font-family: PingFang-SC-Regular, PingFang-SC;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- page {
|
|
|
|
|
- background-color: $app-theme-bg-gray-deep-color
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- @import 'uview-ui/index.scss';
|
|
|
|
|
- @import './static/css/common.scss';
|
|
|
|
|
-
|
|
|
|
|
- /* 解决小程序和app滚动条的问题 */
|
|
|
|
|
- /* #ifdef MP-WEIXIN || APP-PLUS */
|
|
|
|
|
- ::-webkit-scrollbar {
|
|
|
|
|
- display: none;
|
|
|
|
|
- width: 0 !important;
|
|
|
|
|
- height: 0 !important;
|
|
|
|
|
- -webkit-appearance: none;
|
|
|
|
|
- background: transparent;
|
|
|
|
|
- color: transparent;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- /* #endif */
|
|
|
|
|
-
|
|
|
|
|
- /* 解决H5 的问题 */
|
|
|
|
|
- /* #ifdef H5 */
|
|
|
|
|
- uni-scroll-view .uni-scroll-view::-webkit-scrollbar {
|
|
|
|
|
- /* 隐藏滚动条,但依旧具备可以滚动的功能 */
|
|
|
|
|
- display: none;
|
|
|
|
|
- width: 0 !important;
|
|
|
|
|
- height: 0 !important;
|
|
|
|
|
- -webkit-appearance: none;
|
|
|
|
|
- background: transparent;
|
|
|
|
|
- color: transparent;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- /* #endif */
|
|
|
|
|
-
|
|
|
|
|
- .shu-elip-1 {
|
|
|
|
|
- overflow: hidden;
|
|
|
|
|
- text-overflow: ellipsis;
|
|
|
|
|
- white-space: nowrap;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .shu-elip-2 {
|
|
|
|
|
- display: -webkit-box;
|
|
|
|
|
- overflow: hidden;
|
|
|
|
|
- text-overflow: ellipsis;
|
|
|
|
|
- word-wrap: break-word;
|
|
|
|
|
- white-space: normal !important;
|
|
|
|
|
- -webkit-line-clamp: 2;
|
|
|
|
|
- -webkit-box-orient: vertical;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- // 导出 scss 变量用于在 script 下使用
|
|
|
|
|
- .price_color {
|
|
|
|
|
- color: $app-theme-text-money-color;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .color_blue {
|
|
|
|
|
- color: $app-theme-blue;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .btnGroup {
|
|
|
|
|
- display: flex;
|
|
|
|
|
- align-items: center;
|
|
|
|
|
-
|
|
|
|
|
- .btn {
|
|
|
|
|
- margin: 0 10rpx;
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
- .mallbtn {
|
|
|
|
|
- min-width: 200rpx;
|
|
|
|
|
- line-height: 66rpx;
|
|
|
|
|
- padding: 0 20rpx;
|
|
|
|
|
- border-radius: 36rpx;
|
|
|
|
|
- color: #ffffff;
|
|
|
|
|
- margin-right: 20rpx;
|
|
|
|
|
- text-align: center;
|
|
|
|
|
- flex: 1;
|
|
|
|
|
- padding: 0 30rpx;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .soldOutBtn {
|
|
|
|
|
- @extend .mallbtn;
|
|
|
|
|
- background-color: $app-theme-nobuy-bg-color;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .joinCartBtn {
|
|
|
|
|
- @extend .mallbtn;
|
|
|
|
|
- background-color: $app-theme-joincart-bg-color;
|
|
|
|
|
- }
|
|
|
|
|
-
|
|
|
|
|
- .buyBtn {
|
|
|
|
|
- @extend .mallbtn;
|
|
|
|
|
- background-color: $app-theme-buybtn-bg-color;
|
|
|
|
|
- }
|
|
|
|
|
-</style>
|
|
|
|
|
|
|
+// ===
|
|
|
|
|
+// === 注意:此处导入的css,会作用于全部.vue文件,请适量导入
|
|
|
|
|
+// ===
|
|
|
|
|
+body {
|
|
|
|
|
+ font-family: PingFang-SC-Regular, PingFang-SC;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+page {
|
|
|
|
|
+ background-color: $app-theme-bg-gray-deep-color;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+@import "uview-ui/index.scss";
|
|
|
|
|
+@import "./static/css/common.scss";
|
|
|
|
|
+
|
|
|
|
|
+/* 解决小程序和app滚动条的问题 */
|
|
|
|
|
+/* #ifdef MP-WEIXIN || APP-PLUS */
|
|
|
|
|
+::-webkit-scrollbar {
|
|
|
|
|
+ display: none;
|
|
|
|
|
+ width: 0 !important;
|
|
|
|
|
+ height: 0 !important;
|
|
|
|
|
+ -webkit-appearance: none;
|
|
|
|
|
+ background: transparent;
|
|
|
|
|
+ color: transparent;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+/* #endif */
|
|
|
|
|
+
|
|
|
|
|
+/* 解决H5 的问题 */
|
|
|
|
|
+/* #ifdef H5 */
|
|
|
|
|
+uni-scroll-view .uni-scroll-view::-webkit-scrollbar {
|
|
|
|
|
+ /* 隐藏滚动条,但依旧具备可以滚动的功能 */
|
|
|
|
|
+ display: none;
|
|
|
|
|
+ width: 0 !important;
|
|
|
|
|
+ height: 0 !important;
|
|
|
|
|
+ -webkit-appearance: none;
|
|
|
|
|
+ background: transparent;
|
|
|
|
|
+ color: transparent;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+/* #endif */
|
|
|
|
|
+
|
|
|
|
|
+.shu-elip-1 {
|
|
|
|
|
+ overflow: hidden;
|
|
|
|
|
+ text-overflow: ellipsis;
|
|
|
|
|
+ white-space: nowrap;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.shu-elip-2 {
|
|
|
|
|
+ display: -webkit-box;
|
|
|
|
|
+ overflow: hidden;
|
|
|
|
|
+ text-overflow: ellipsis;
|
|
|
|
|
+ word-wrap: break-word;
|
|
|
|
|
+ white-space: normal !important;
|
|
|
|
|
+ -webkit-line-clamp: 2;
|
|
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 导出 scss 变量用于在 script 下使用
|
|
|
|
|
+.price_color {
|
|
|
|
|
+ color: $app-theme-text-money-color;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.color_blue {
|
|
|
|
|
+ color: $app-theme-blue;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.btnGroup {
|
|
|
|
|
+ display: flex;
|
|
|
|
|
+ align-items: center;
|
|
|
|
|
+
|
|
|
|
|
+ .btn {
|
|
|
|
|
+ margin: 0 10rpx;
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.mallbtn {
|
|
|
|
|
+ min-width: 200rpx;
|
|
|
|
|
+ line-height: 66rpx;
|
|
|
|
|
+ padding: 0 20rpx;
|
|
|
|
|
+ border-radius: 36rpx;
|
|
|
|
|
+ color: #ffffff;
|
|
|
|
|
+ margin-right: 20rpx;
|
|
|
|
|
+ text-align: center;
|
|
|
|
|
+ flex: 1;
|
|
|
|
|
+ padding: 0 30rpx;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.soldOutBtn {
|
|
|
|
|
+ @extend .mallbtn;
|
|
|
|
|
+ background-color: $app-theme-nobuy-bg-color;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.joinCartBtn {
|
|
|
|
|
+ @extend .mallbtn;
|
|
|
|
|
+ background-color: $app-theme-joincart-bg-color;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.buyBtn {
|
|
|
|
|
+ @extend .mallbtn;
|
|
|
|
|
+ background-color: $app-theme-buybtn-bg-color;
|
|
|
|
|
+}
|
|
|
|
|
+</style>
|