App.vue 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376
  1. <script>
  2. import {
  3. HTTP_REQUEST_URL
  4. } from './config/app';
  5. import Auth from './libs/wechat.js';
  6. import Routine from './libs/routine.js';
  7. import {
  8. getTheme
  9. } from './api/api.js';
  10. import Cache from './utils/cache.js';
  11. import store from './store'
  12. import {
  13. silenceBindingSpread
  14. } from "./utils";
  15. import locationManager from './utils/locationManager.js';
  16. var statusBarHeight = uni.getSystemInfoSync().statusBarHeight; //手机端头部手机时间位置高度
  17. export default {
  18. globalData: {
  19. spread: 0, //推广人id,绑定关系
  20. isLogin: false,
  21. windowHeight: 0,
  22. navHeight: 0, //导航高度
  23. navH: 0,
  24. id: 0, // 小程序扫码进入商品id,首页id
  25. isIframe: false,
  26. theme: 'theme1',
  27. statusBarHeight: statusBarHeight, //手机端头部手机时间位置高度
  28. mainWidth: 0, //获取设备宽度
  29. marketingType: '', //商品类型,normal普通商品
  30. publicLoginType: Cache.get('publicLoginType') ? Cache.get('publicLoginType') : '', //公众号登录方式(单选),1微信授权,2手机号登录
  31. routinePhoneVerification: '1,2', //小程序手机号校验类型(多选)1微信小程序验证 2短信验证
  32. companyName: uni.getStorageSync('companyName') ? uni.getStorageSync('companyName') : '欢迎你', //公司名称
  33. tokenIsExist: false, //登录是否失效 false 失效,true没失效
  34. mobileLoginLogo: uni.getStorageSync('mobileLoginLogo') || '/static/images/logo2.png', //登录页logo
  35. paidMemberPriceDisplay: 'all', //付费会员-会员价格展示 all-全部,paid-仅付费会员
  36. userIsPaidMember: false, //用户是否是付费会员
  37. changeColorConfig: '', //颜色配置
  38. copyrightCompanyImage: '', //版权图片
  39. frontDomain: '', //移动端域名
  40. imageDomain: '', //全局本地图片域名
  41. authorizeAddress: '', //授权备案-地址
  42. authorizeFilingNum: '', //授权备案-备案号
  43. authorizeInfo: '', //授权备案-授权信息
  44. authorizePhone: '', //授权备案-联系电话
  45. merId: 0 //扫码进入商户id
  46. },
  47. onLaunch: function(option) {
  48. // 设置开屏广告显示
  49. store.commit('Change_Advertisement', true);
  50. let that = this;
  51. //获取登录配置
  52. store.dispatch('GetLoginConfig');
  53. //获取全局配置
  54. store.dispatch('GetGlobalConfig');
  55. //校验token是否有效,true为有效,false为无效
  56. store.dispatch("GetTokenIsExist");
  57. // 主题变色
  58. getTheme().then(res => {
  59. that.globalData.theme = `theme${Number(res.data.value)}`
  60. Cache.set('theme', `theme${Number(res.data.value)}`);
  61. store.commit('Change_GLOBAL_theme', `theme${Number(res.data.value)}`)
  62. // #ifdef H5
  63. window.document.documentElement.setAttribute('data-theme', that.globalData.theme);
  64. // #endif
  65. })
  66. // 获取页面高度
  67. uni.getSystemInfo({
  68. success: function(res) {
  69. // 首页没有title获取的整个页面的高度,里面的页面有原生标题要减掉就是视口的高度
  70. // 状态栏是动态的可以拿到 标题栏是固定写死的是44px
  71. let height = res.windowHeight - res.statusBarHeight - 44;
  72. // #ifdef H5 || APP-PLUS
  73. that.globalData.windowHeight = res.windowHeight + 'px';
  74. // #endif
  75. // 获取导航高度;
  76. that.globalData.navHeight = res.statusBarHeight * (750 / res.windowWidth) + 81;
  77. // 获取设备宽度;
  78. that.globalData.mainWidth = res.windowWidth
  79. store.commit('SYSTEM_PLATFORM', res.platform.toLowerCase());
  80. // 动态设置CSS变量
  81. that.setCSSVariables(res);
  82. }
  83. });
  84. // 获取浏览器推广人id
  85. if (option.query.sd) {
  86. that.globalData.spread = option.query.sd;
  87. store.commit('Change_Spread', that.globalData.spread);
  88. }
  89. if (option.sd) {
  90. that.globalData.spread = option.sd;
  91. store.commit('Change_Spread', that.globalData.spread);
  92. }
  93. // #ifdef MP
  94. //小程序扫码进入获取浏览器值
  95. if (option.query.hasOwnProperty('scene')) {
  96. switch (option.scene) {
  97. case 1001: //直接进入小程序
  98. case 1047: //扫描小程序码
  99. case 1048: //长按图片识别小程序码
  100. case 1049: //手机相册选取小程序码
  101. case 1001: //直接进入小程序
  102. let value = this.$util.getUrlParams(decodeURIComponent(option.query.scene));
  103. that.globalData.spread = value.sd ? value.sd : '';
  104. that.globalData.id = value.id ? value.id : '';
  105. that.globalData.marketingType = value.mt ? value.mt : '0';
  106. that.globalData.merId = value.merId ? value.merId : '0';
  107. break;
  108. }
  109. }
  110. let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
  111. that.globalData.navH = menuButtonInfo.top * 2 + menuButtonInfo.height / 2;
  112. const updateManager = uni.getUpdateManager();
  113. if (!updateManager) return;
  114. updateManager.onCheckForUpdate(function(res) {
  115. // 请求完新版本信息的回调
  116. if (res.hasUpdate) {
  117. updateManager.onUpdateReady(function(res2) {
  118. uni.showModal({
  119. title: '更新提示',
  120. content: '发现新版本,是否重启应用?',
  121. confirmColor: '#f55850',
  122. success(res2) {
  123. if (res2.confirm) {
  124. // 新的版本已经下载好,调用 applyUpdate 应用新版本并重启
  125. updateManager.applyUpdate();
  126. }
  127. }
  128. });
  129. });
  130. }
  131. });
  132. updateManager.onUpdateFailed(function(res) {
  133. // 新的版本下载失败
  134. uni.showModal({
  135. title: '提示',
  136. content: '检查到有新版本,但下载失败,请检查网络设置',
  137. confirmColor: '#f55850',
  138. success(res) {
  139. if (res.confirm) {
  140. // 新的版本已经下载好,调用 applyUpdate 应用新版本并重启
  141. updateManager.applyUpdate();
  142. }
  143. }
  144. });
  145. });
  146. if (HTTP_REQUEST_URL == '') {
  147. console.error(
  148. "请配置根目录下的config.js文件中的 'HTTP_REQUEST_URL'\n\n请修改开发者工具中【详情】->【AppID】改为自己的Appid\n\n请前往后台【小程序】->【小程序配置】填写自己的 appId and AppSecret"
  149. );
  150. return false;
  151. }
  152. // #endif
  153. // #ifdef H5
  154. if (option.query.hasOwnProperty('type') && option.query.type == "iframeVisualizing") {
  155. this.globalData.isIframe = true;
  156. } else {
  157. this.globalData.isIframe = false;
  158. }
  159. // wx公众号自动授权登录
  160. let snsapiBase = 'snsapi_base';
  161. let urlData = location.pathname + location.search;
  162. //publicLoginType,公众号登录方式(单选),1微信授权,2手机号登录
  163. if (!store.getters.isLogin && Auth.isWeixin() && this.globalData.publicLoginType == 1 && !that.globalData
  164. .tokenIsExist) {
  165. const {
  166. code,
  167. state,
  168. scope
  169. } = option.query;
  170. if (code && code != uni.getStorageSync('snsapiCode') && location.pathname.indexOf(
  171. '/pages/users/wechat_login/index') === -1) {
  172. // 存储静默授权code
  173. uni.setStorageSync('snsapiCode', code);
  174. let spread = that.globalData.spread ? that.globalData.spread : 0;
  175. Auth.auth(code, Cache.get('spread'))
  176. .then(res => {
  177. uni.setStorageSync('snRouter', decodeURIComponent(decodeURIComponent(option.query
  178. .back_url)));
  179. if (res.type === 'register') {
  180. Cache.set('snsapiKey', res.key);
  181. }
  182. if (res.type === 'login') {
  183. store.commit('LOGIN', {
  184. token: res.token
  185. });
  186. store.commit("SETUID", res.id);
  187. location.replace(decodeURIComponent(decodeURIComponent(option.query.back_url)));
  188. }
  189. })
  190. .catch(error => {
  191. if (!Cache.has('snsapiKey')) {
  192. if (location.pathname.indexOf('/pages/users/wechat_login/index') === -1) {
  193. Auth.oAuth(snsapiBase, option.query.back_url);
  194. }
  195. }
  196. });
  197. } else {
  198. if (!Cache.has('snsapiKey')) {
  199. if (location.pathname.indexOf('/pages/users/wechat_login/index') === -1) {
  200. Auth.oAuth(snsapiBase, urlData);
  201. }
  202. }
  203. }
  204. } else {
  205. if (option.query.back_url) {
  206. location.replace(uni.getStorageSync('snRouter'));
  207. }
  208. }
  209. // #endif
  210. // #ifdef MP
  211. // 小程序静默授权
  212. if (!store.getters.isLogin) {
  213. Routine.getCode().then(code => {
  214. let userInfo = {
  215. code: code,
  216. spreadPid: this.globalData.spread, //获取推广人ID
  217. type: 'routine'
  218. };
  219. Routine.authUserInfo(userInfo)
  220. })
  221. .catch(res => {
  222. uni.hideLoading();
  223. });
  224. }
  225. // 小程序首次启动时清理历史圈层缓存
  226. this.checkAndClearHistoricalCache();
  227. // #endif
  228. //分销绑定
  229. silenceBindingSpread(store.getters.isLogin, this.globalData.spread)
  230. //配置项存储
  231. store.commit('SET_GLOBAL_DATA', JSON.parse(JSON.stringify(that.globalData)));
  232. },
  233. async mounted() {
  234. //if (this.$store.getters.isLogin && !this.$Cache.get('USER_INFO')) await this.$store.dispatch('USERINFO');
  235. },
  236. methods: {
  237. handleResize(e) {
  238. let systemInfo = uni.getSystemInfoSync();
  239. let isPhone = systemInfo.platform === 'android' || systemInfo.platform === 'ios'
  240. /* 窗口宽度大于430px且不在PC页面且不在移动设备时跳转至 PC.html 页面 */
  241. if (e.size.windowWidth > 430 && !isPhone) {
  242. // window.location.pathname = 'https://java.crmeb.net/';
  243. /* 若你的项目未设置根目录(默认为 / 时),则使用下方代码 */
  244. window.location.pathname = '/h5/static/html/pc.html';
  245. }
  246. },
  247. // #ifdef MP
  248. // 检测并清理历史缓存
  249. checkAndClearHistoricalCache() {
  250. try {
  251. // 检查当前是否有有效的位置数据
  252. const locationInfo = uni.getStorageSync('location_info');
  253. const hasValidLocation = locationInfo && (locationInfo.name || locationInfo.address);
  254. // 如果顶部地址还没有数据(即没有有效的位置信息),则清理历史圈层缓存
  255. if (!hasValidLocation) {
  256. // 清理历史圈层缓存
  257. locationManager.clearHistoricalAreaCache();
  258. }
  259. } catch (error) {
  260. console.warn('清理历史缓存时出错:', error);
  261. }
  262. },
  263. // #endif
  264. // 设置CSS变量
  265. setCSSVariables(systemInfo) {
  266. // #ifdef H5
  267. const root = document.documentElement;
  268. if (root && root.style) {
  269. // 设置屏幕高度相关变量
  270. root.style.setProperty('--screen-height', `${systemInfo.windowHeight}px`);
  271. root.style.setProperty('--screen-width', `${systemInfo.windowWidth}px`);
  272. root.style.setProperty('--status-bar-height', `${systemInfo.statusBarHeight}px`);
  273. root.style.setProperty('--nav-bar-height', '44px');
  274. // 设置安全圈层变量
  275. root.style.setProperty('--safe-area-inset-top', 'env(safe-area-inset-top)');
  276. root.style.setProperty('--safe-area-inset-bottom', 'env(safe-area-inset-bottom)');
  277. root.style.setProperty('--safe-area-inset-left', 'env(safe-area-inset-left)');
  278. root.style.setProperty('--safe-area-inset-right', 'env(safe-area-inset-right)');
  279. }
  280. // #endif
  281. // #ifdef MP
  282. // 小程序环境下,生成CSS变量对象并缓存
  283. const vars = {
  284. '--screen-height': `${systemInfo.windowHeight}px`,
  285. '--screen-width': `${systemInfo.windowWidth}px`,
  286. '--status-bar-height': `${systemInfo.statusBarHeight}px`,
  287. '--nav-bar-height': '44px',
  288. '--safe-area-inset-top': 'env(safe-area-inset-top)',
  289. '--safe-area-inset-bottom': 'env(safe-area-inset-bottom)',
  290. '--safe-area-inset-left': 'env(safe-area-inset-left)',
  291. '--safe-area-inset-right': 'env(safe-area-inset-right)'
  292. };
  293. this.$root.$cssVars = vars;
  294. uni.setStorageSync('__CSS_VARS__', vars);
  295. this.$eventHub.$emit('css-vars:updated', vars);
  296. // #endif
  297. }
  298. },
  299. onShow: function() {
  300. // #ifdef H5
  301. uni.onWindowResize(this.handleResize);
  302. // #endif
  303. },
  304. onUnload() {
  305. // 页面销毁时移除监听
  306. uni.offWindowResize(this.handleResize);
  307. },
  308. }
  309. </script>
  310. <style lang="scss">
  311. /* #ifndef APP-PLUS-NVUE || APP-NVUE */
  312. @import "@/plugin/animate/animate.min.css";
  313. @import 'static/css/style.scss';
  314. @import 'static/css/base.css';
  315. @import 'static/iconfont/iconfont.css';
  316. @import 'static/css/unocss.css';
  317. @import 'static/fonts/font.css';
  318. view {
  319. box-sizing: border-box;
  320. }
  321. body::-webkit-scrollbar,
  322. html::-webkit-scrollbar {
  323. display: none;
  324. }
  325. .bg-color-red {
  326. background-color: #E93323;
  327. }
  328. .syspadding {
  329. padding-top: var(--status-bar-height);
  330. }
  331. ::v-deep .uni-scroll-view::-webkit-scrollbar {
  332. /* 隐藏滚动条,但依旧具备可以滚动的功能 */
  333. display: none
  334. }
  335. ::-moz-scrollbar {
  336. width: 0;
  337. height: 0;
  338. color: transparent;
  339. }
  340. ::-webkit-scrollbar {
  341. display: none;
  342. width: 0 !important;
  343. height: 0 !important;
  344. -webkit-appearance: none;
  345. background: transparent;
  346. }
  347. /*#endif*/
  348. </style>