App.vue 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306
  1. <script>
  2. import { eventBus } from '@/utils/event-bus'
  3. export default {
  4. globalData: {
  5. // 胶囊距上距离
  6. menuTop: 0,
  7. // 导航栏高度
  8. navBarHeight: 0,
  9. // 胶囊距右方间距(方保持左、右间距一致)
  10. menuRight: 0,
  11. // 胶囊距底部间距(保持底部间距一致)
  12. menuBotton: 0,
  13. // 胶囊高度(自定义内容可与胶囊高度保证一致)
  14. menuHeight: 0,
  15. // 状态栏高度
  16. statusBarHeight: 0,
  17. // 安全距离
  18. safeAreaHeight: 0,
  19. // 胶囊宽度
  20. menuWidth: 0,
  21. // 窗口宽度
  22. windowWidth: 0,
  23. // 窗口宽度高度
  24. windowHeight: 0,
  25. // 常规子页面可操作区域高度
  26. pageContentHeight: 0,
  27. // 是否是冷启动
  28. isColdLaunch: false,
  29. },
  30. onLaunch(options) {
  31. this.globalData.isColdLaunch = true;
  32. console.log('冷启动onLaunch:', this.globalData.isColdLaunch)
  33. let params = {};
  34. if (options.query) {
  35. //微信小程序的场景值解析
  36. if (options.query.scene) {
  37. // 对 scene 进行解码
  38. const decodeScene = decodeURIComponent(options.query.scene);
  39. // 拆分参数
  40. const paramPairs = decodeScene.split('&');
  41. paramPairs.forEach((pair) => {
  42. const [key, value] = pair.split('=');
  43. params[key] = value;
  44. });
  45. let keys = Object.keys(params)
  46. if (keys.length > 0) {
  47. console.log(params, "params");
  48. // 如果链接参数中有一个名为 upsellCode 的参数
  49. if (params.upsellCode) {
  50. uni.setStorageSync('upsellCode', params.upsellCode)
  51. }
  52. //减价助力参数 reduceCode
  53. if (params.reduceCode) {
  54. uni.setStorageSync('reduceCode', params.reduceCode)
  55. }
  56. // 兼容商品详情二维码跳转
  57. if (params.isbn) {
  58. // 将 isbn 存入全局或缓存,以便 detail 页面如果在 onLoad 没拿到时可以使用
  59. uni.setStorageSync('scene_isbn', params.isbn);
  60. }
  61. // 兼容红包二维码跳转
  62. if (params.bianhao) {
  63. uni.setStorageSync('scene_bianhao', params.bianhao);
  64. }
  65. this.slientLogin(params);
  66. } else {
  67. this.slientLogin();
  68. }
  69. } else {
  70. this.slientLogin(options.query);
  71. // 如果链接参数中有一个名为 upsellCode 的参数
  72. if (options.query.upsellCode) {
  73. uni.setStorageSync('upsellCode', options.query.upsellCode)
  74. }
  75. //减价助力参数 reduceCode
  76. if (options.query.reduceCode) {
  77. uni.setStorageSync('reduceCode', options.query.reduceCode)
  78. }
  79. }
  80. } else {
  81. this.slientLogin()
  82. }
  83. },
  84. onShow(options) {
  85. this.$updateCartBadge();
  86. this.handleAppShowOptions(options);
  87. },
  88. onUnload() {
  89. uni.removeStorageSync('loginType')
  90. },
  91. methods: {
  92. parseEntryOptions(options = {}) {
  93. let params = {};
  94. if (!options || !options.query) return params;
  95. if (options.query.scene) {
  96. const decodeScene = decodeURIComponent(options.query.scene);
  97. const paramPairs = decodeScene.split('&');
  98. paramPairs.forEach((pair) => {
  99. const [key, value] = pair.split('=');
  100. params[key] = value;
  101. });
  102. return params;
  103. }
  104. return options.query || {};
  105. },
  106. cacheEntryParams(params = {}) {
  107. if (params.upsellCode) {
  108. uni.setStorageSync('upsellCode', params.upsellCode)
  109. }
  110. if (params.reduceCode) {
  111. uni.setStorageSync('reduceCode', params.reduceCode)
  112. }
  113. if (params.isbn) {
  114. uni.setStorageSync('scene_isbn', params.isbn);
  115. }
  116. if (params.bianhao) {
  117. uni.setStorageSync('scene_bianhao', params.bianhao);
  118. }
  119. },
  120. handleAppShowOptions(options = {}) {
  121. const params = this.parseEntryOptions(options);
  122. if (!Object.keys(params).length) return;
  123. this.cacheEntryParams(params);
  124. if (params.bianhao) {
  125. this.routeToPacketIndex(params.bianhao);
  126. }
  127. if (this.globalData.isColdLaunch) return;
  128. if (params.upsellCode || params.reduceCode) {
  129. eventBus.emit('appShowActivity', { params });
  130. }
  131. },
  132. routeToPacketIndex(bianhao) {
  133. const targetUrl = '/packet/pages/index?bianhao=' + bianhao;
  134. setTimeout(() => {
  135. const pages = getCurrentPages();
  136. const currentPage = pages[pages.length - 1];
  137. const currentRoute = currentPage?.route || '';
  138. const currentBianhao = currentPage?.options?.bianhao || '';
  139. if (currentRoute === 'packet/pages/index' && currentBianhao === String(bianhao)) {
  140. return;
  141. }
  142. if (!pages.length || this.globalData.isColdLaunch) {
  143. uni.reLaunch({
  144. url: targetUrl
  145. });
  146. return;
  147. }
  148. if (currentRoute === 'packet/pages/index') {
  149. uni.redirectTo({
  150. url: targetUrl
  151. });
  152. return;
  153. }
  154. uni.navigateTo({
  155. url: targetUrl
  156. });
  157. }, 0);
  158. },
  159. slientLogin(params = {}) {
  160. let that = this;
  161. uni.login({
  162. success(res) {
  163. //plat integer($int32)平台 1-微信 2-支付宝
  164. let platform = uni.getSystemInfoSync().uniPlatform
  165. let data = { code: res.code, plat: platform === 'mp-alipay' ? 2 : 1 }
  166. data = { ...data, ...params }
  167. uni.setStorageSync('loginType', data)
  168. console.log('登录参数:', data)
  169. uni.$u.http
  170. .post("/user/miniLogin", data)
  171. .then((response) => {
  172. if (response.code == 200) {
  173. uni.setStorageSync("loginSuccess", response.data);
  174. uni.setStorageSync("token", response.data.token);
  175. console.log("登录成功返回参数", response.data, data);
  176. eventBus.emit('loginSuccess', { response: response.data, params: data })
  177. that.globalData.isColdLaunch = false;
  178. that.$updateCartBadge();
  179. }
  180. });
  181. },
  182. fail: (err) => {
  183. console.log(err, "wx.login登录失败");
  184. },
  185. });
  186. },
  187. },
  188. };
  189. </script>
  190. <style lang="scss">
  191. // ===
  192. // === 注意:此处导入的css,会作用于全部.vue文件,请适量导入
  193. // ===
  194. body {
  195. font-family: PingFang-SC-Regular, PingFang-SC;
  196. }
  197. page {
  198. background-color: $app-theme-bg-gray-deep-color;
  199. }
  200. @import "uview-ui/index.scss";
  201. @import "./static/css/common.scss";
  202. /* 解决小程序和app滚动条的问题 */
  203. /* #ifdef MP-WEIXIN || APP-PLUS */
  204. ::-webkit-scrollbar {
  205. display: none;
  206. width: 0 !important;
  207. height: 0 !important;
  208. -webkit-appearance: none;
  209. background: transparent;
  210. color: transparent;
  211. }
  212. /* #endif */
  213. /* 解决H5 的问题 */
  214. /* #ifdef H5 */
  215. uni-scroll-view .uni-scroll-view::-webkit-scrollbar {
  216. /* 隐藏滚动条,但依旧具备可以滚动的功能 */
  217. display: none;
  218. width: 0 !important;
  219. height: 0 !important;
  220. -webkit-appearance: none;
  221. background: transparent;
  222. color: transparent;
  223. }
  224. /* #endif */
  225. .shu-elip-1 {
  226. overflow: hidden;
  227. text-overflow: ellipsis;
  228. white-space: nowrap;
  229. }
  230. .shu-elip-2 {
  231. display: -webkit-box;
  232. overflow: hidden;
  233. text-overflow: ellipsis;
  234. word-wrap: break-word;
  235. white-space: normal !important;
  236. -webkit-line-clamp: 2;
  237. -webkit-box-orient: vertical;
  238. }
  239. // 导出 scss 变量用于在 script 下使用
  240. .price_color {
  241. color: $app-theme-text-money-color;
  242. }
  243. .color_blue {
  244. color: $app-theme-blue;
  245. }
  246. .btnGroup {
  247. display: flex;
  248. align-items: center;
  249. .btn {
  250. margin: 0 10rpx;
  251. }
  252. }
  253. .mallbtn {
  254. min-width: 200rpx;
  255. line-height: 66rpx;
  256. padding: 0 20rpx;
  257. border-radius: 36rpx;
  258. color: #ffffff;
  259. margin-right: 20rpx;
  260. text-align: center;
  261. flex: 1;
  262. padding: 0 30rpx;
  263. }
  264. .soldOutBtn {
  265. @extend .mallbtn;
  266. background-color: $app-theme-nobuy-bg-color;
  267. }
  268. .joinCartBtn {
  269. @extend .mallbtn;
  270. background-color: $app-theme-joincart-bg-color;
  271. }
  272. .buyBtn {
  273. @extend .mallbtn;
  274. background-color: $app-theme-buybtn-bg-color;
  275. }
  276. </style>