App.vue 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483
  1. <script>
  2. import {checkLogin} from './libs/login';
  3. import {HTTP_REQUEST_URL} from './config/app';
  4. import { LOGIN_STATUS } from "./config/cache.js"
  5. import { getShopConfig, silenceAuth, getLogo } from '@/api/public';
  6. import Auth from '@/libs/wechat.js';
  7. import Routine from './libs/routine.js';
  8. import { colorChange, copyRight } from '@/api/api.js';
  9. import { getUserInfo } from "@/api/user.js"
  10. import { mapGetters } from "vuex"
  11. import { silenceBindingSpread } from "@/utils/index.js";
  12. // #ifdef APP
  13. import { getUpApp } from './utils/upApp.js';
  14. // #endif
  15. // #ifdef MP
  16. // let livePlayer = requirePlugin('live-player-plugin')
  17. // #endif
  18. let green =
  19. '--view-theme: #42CA4D;--view-priceColor:#FF7600;--view-minorColor:rgba(108, 198, 94, 0.5);--view-minorColorT:rgba(66, 202, 77, 0.1);--view-bntColor:#FE960F;--view-gradient:#4DEA4D'
  20. let red =
  21. '--view-theme: #e93323;--view-priceColor:#e93323;--view-minorColor:rgba(233, 51, 35, 0.5);--view-minorColorT:rgba(233, 51, 35, 0.1);--view-bntColor:#FE960F;--view-gradient:#FF7931'
  22. let blue =
  23. '--view-theme: #1DB0FC;--view-priceColor:#FD502F;--view-minorColor:rgba(58, 139, 236, 0.5);--view-minorColorT:rgba(9, 139, 243, 0.1);--view-bntColor:#22CAFD;--view-gradient:#5ACBFF'
  24. let pink =
  25. '--view-theme: #FF448F;--view-priceColor:#FF448F;--view-minorColor:rgba(255, 68, 143, 0.5);--view-minorColorT:rgba(255, 68, 143, 0.1);--view-bntColor:#282828;--view-gradient:#FF67AD'
  26. let orange =
  27. '--view-theme: #FE5C2D;--view-priceColor:#FE5C2D;--view-minorColor:rgba(254, 92, 45, 0.5);--view-minorColorT:rgba(254, 92, 45, 0.1);--view-bntColor:#FDB000;--view-gradient:#FF9451'
  28. let gold =
  29. '--view-theme: #E0A558;--view-priceColor:#DA8C18;--view-minorColor:rgba(224, 165, 88, 0.5);--view-minorColorT:rgba(224, 165, 88, 0.1);--view-bntColor:#1A1A1A;--view-gradient:#FFCD8C'
  30. export default {
  31. globalData: {
  32. spid: 0,
  33. code: 0,
  34. isLogin: false,
  35. userInfo: {},
  36. MyMenus: [],
  37. globalData: false,
  38. isIframe: false,
  39. tabbarShow: true,
  40. windowHeight: 0
  41. },
  42. computed: mapGetters(['isLogin', 'cartNum']),
  43. watch: {
  44. isLogin: {
  45. deep: true, //深度监听设置为 true
  46. handler: function(newV, oldV) {
  47. if (newV) {
  48. // this.getCartNum()
  49. } else {
  50. this.$store.commit('indexData/setCartNum', '')
  51. }
  52. }
  53. },
  54. cartNum(newCart, b) {
  55. this.$store.commit('indexData/setCartNum', newCart + '')
  56. if (newCart > 0) {
  57. uni.setTabBarBadge({
  58. index: 3,
  59. text: newCart>99?'99+':newCart+''
  60. })
  61. } else {
  62. uni.hideTabBarRedDot({
  63. index: 3
  64. })
  65. }
  66. }
  67. },
  68. onLaunch: async function(option) {
  69. uni.hideTabBar()
  70. //#ifdef APP
  71. plus.screen.lockOrientation("portrait-primary");
  72. //#endif
  73. let that = this;
  74. getLogo().then(res => {
  75. uni.setStorageSync('BASIC_CONFIG', res.data)
  76. });
  77. //获取配置
  78. copyRight().then(res => {
  79. let data = res.data;
  80. uni.setStorageSync('wechatStatus', data.wechat_status)
  81. // #ifndef APP-PLUS
  82. this.site_config = data.record_No;
  83. // #endif
  84. if(!data.copyrightContext && !data.copyrightImage){
  85. data.copyrightImage = '/static/images/support.png'
  86. }
  87. uni.setStorageSync('copyNameInfo', data.copyrightContext);
  88. uni.setStorageSync('copyImageInfo', data.copyrightImage);
  89. // #ifdef MP
  90. uni.setStorageSync('MPSiteData', JSON.stringify({site_logo:data.site_logo,site_name:data.site_name}));
  91. // #endif
  92. }).catch(err => {
  93. return this.$util.Tips({
  94. title: err.msg
  95. });
  96. });
  97. colorChange('color_change').then(res => {
  98. let navigation = res.data.navigation; //判断悬浮导航是否显示
  99. let statusColor = res.data.status; //判断显示啥颜色
  100. uni.setStorageSync('navigation', navigation);
  101. uni.$emit('navOk', navigation);
  102. uni.setStorageSync('statusColor', statusColor);
  103. uni.$emit('colorOk', statusColor);
  104. switch (res.data.status) {
  105. case 1:
  106. uni.setStorageSync('viewColor', blue)
  107. uni.$emit('ok', blue)
  108. break;
  109. case 2:
  110. uni.setStorageSync('viewColor', green)
  111. uni.$emit('ok', green)
  112. break;
  113. case 3:
  114. uni.setStorageSync('viewColor', red)
  115. uni.$emit('ok', red)
  116. break;
  117. case 4:
  118. uni.setStorageSync('viewColor', pink)
  119. uni.$emit('ok', pink)
  120. break;
  121. case 5:
  122. uni.setStorageSync('viewColor', orange)
  123. uni.$emit('ok', orange)
  124. break;
  125. case 6:
  126. uni.setStorageSync('viewColor', gold)
  127. uni.$emit('ok', gold)
  128. break;
  129. default:
  130. uni.setStorageSync('viewColor', red)
  131. uni.$emit('ok', red)
  132. break
  133. }
  134. });
  135. // 通过vuex获取并储存商品详情,商品分类可视化的数据
  136. this.$store.dispatch("getDiyProduct");
  137. // 判断分销uid
  138. if (option.query.spid) {
  139. that.$Cache.set('spid', option.query.spid);
  140. that.globalData.spid = option.query.spid;
  141. silenceBindingSpread();
  142. }
  143. // #ifdef APP-PLUS || H5
  144. uni.getSystemInfo({
  145. success: function(res) {
  146. // 首页没有title获取的整个页面的高度,里面的页面有原生标题要减掉就是视口的高度
  147. // 状态栏是动态的可以拿到 标题栏是固定写死的是44px
  148. let height = res.windowHeight - res.statusBarHeight - 44
  149. // #ifdef H5 || APP-PLUS
  150. that.globalData.windowHeight = res.windowHeight + 'px'
  151. // #endif
  152. // // #ifdef APP-PLUS
  153. // that.globalData.windowHeight = height + 'px'
  154. // // #endif
  155. }
  156. });
  157. // #endif
  158. // #ifdef MP
  159. if (HTTP_REQUEST_URL == '') {
  160. console.error(
  161. "请配置根目录下的config.js文件中的 'HTTP_REQUEST_URL'\n\n请修改开发者工具中【详情】->【AppID】改为自己的Appid\n\n请前往后台【小程序】->【小程序配置】填写自己的 appId and AppSecret"
  162. );
  163. return false;
  164. }
  165. if (option.query.hasOwnProperty('scene')) {
  166. let val = that.$util.getUrlParams(decodeURIComponent(option.query.scene));
  167. switch (option.scene) {
  168. //扫描小程序码
  169. case 1047:
  170. that.globalData.spid = val.spid === undefined ? val : val.spid;
  171. break;
  172. //长按图片识别小程序码
  173. case 1048:
  174. that.globalData.spid = val.spid === undefined ? val : val.spid;
  175. that.globalData.code = option.query.scene;
  176. break;
  177. //手机相册选取小程序码
  178. case 1049:
  179. that.globalData.spid = val.spid === undefined ? val : val.spid;
  180. that.globalData.code = option.query.scene;
  181. break;
  182. //直接进入小程序
  183. case 1001:
  184. that.globalData.spid = val.spid === undefined ? val : val.spid;
  185. break;
  186. }
  187. }
  188. this.checkUpdateVersion();
  189. // #endif
  190. // getShopConfig().then(res => {
  191. // this.$store.commit('SETPHONESTATUS', res.data.status);
  192. // });
  193. // 获取导航高度;
  194. uni.getSystemInfo({
  195. success: function(res) {
  196. that.globalData.navHeight = res.statusBarHeight * (750 / res.windowWidth) + 91;
  197. }
  198. });
  199. // #ifdef MP
  200. let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
  201. that.globalData.navH = menuButtonInfo.top * 2 + menuButtonInfo.height / 2;
  202. const version = uni.getSystemInfoSync().SDKVersion
  203. if (Routine.compareVersion(version, '2.21.2') >= 0) {
  204. console.log(version)
  205. that.$Cache.set('MP_VERSION_ISNEW', true)
  206. } else {
  207. that.$Cache.set('MP_VERSION_ISNEW', false)
  208. }
  209. // #endif
  210. // #ifdef H5
  211. // 添加crmeb chat 统计
  212. var __s = document.createElement('script');
  213. __s.src = `${HTTP_REQUEST_URL}/api/get_script`;
  214. document.head.appendChild(__s);
  215. uni.getSystemInfo({
  216. success(e) {
  217. /* 窗口宽度大于420px且不在PC页面且不在移动设备时跳转至 PC.html 页面 */
  218. if (e.windowWidth > 420 && !window.top.isPC && !/iOS|Android/i.test(e.system)) {
  219. window.location.pathname = '/static/html/pc.html';
  220. }
  221. }
  222. });
  223. if (option.query.hasOwnProperty('type')) {
  224. this.globalData.isIframe = true;
  225. } else {
  226. this.globalData.isIframe = false;
  227. }
  228. if (window.location.pathname !== '/' && !this.isWork()) {
  229. let snsapiBase = 'snsapi_base';
  230. let urlData = location.pathname + location.search;
  231. if (!that.$store.getters.isLogin && uni.getStorageSync('authIng')) {
  232. uni.setStorageSync('authIng', false)
  233. }
  234. if (!that.$store.getters.isLogin && Auth.isWeixin()) {
  235. let code,
  236. state,
  237. scope = ''
  238. if (option.query.code instanceof Array) {
  239. code = option.query.code[option.query.code.length - 1]
  240. } else {
  241. code = option.query.code
  242. }
  243. if (code && code != uni.getStorageSync('snsapiCode') && location.pathname.indexOf(
  244. '/pages/users/wechat_login/index') === -1) {
  245. // 存储静默授权code
  246. uni.setStorageSync('snsapiCode', code);
  247. try {
  248. let res = await silenceAuth({
  249. code: code,
  250. snsapi: 'snsapi_base',
  251. spread_spid: that.$Cache.get('spid')
  252. }).catch(error => {
  253. uni.hideLoading()
  254. return this.$util.Tips({
  255. title: error
  256. })
  257. });
  258. uni.setStorageSync('snRouter', decodeURIComponent(decodeURIComponent(option.query
  259. .back_url)));
  260. if (res.data.key !== undefined && res.data.key) {
  261. this.$Cache.set('snsapiKey', res.data.key);
  262. } else {
  263. let time = res.data.expires_time - this.$Cache.time();
  264. this.$store.commit('LOGIN', {
  265. token: res.data.token,
  266. time: time
  267. });
  268. this.$store.commit('SETUID', res.data.userInfo.uid);
  269. this.$store.commit('UPDATE_USERINFO', res.data.userInfo);
  270. if (option.query.back_url) {
  271. location.replace(decodeURIComponent(decodeURIComponent(option.query
  272. .back_url)));
  273. }
  274. }
  275. } catch (e) {
  276. let url = ''
  277. if (option.query.back_url instanceof Array) {
  278. url = option.query.back_url[option.query.back_url.length - 1]
  279. } else {
  280. url = option.query.back_url
  281. }
  282. if (!that.$Cache.has('snsapiKey')) {
  283. if (location.pathname.indexOf('/pages/users/wechat_login/index') === -1) {
  284. Auth.oAuth('snsapi_userinfo', url);
  285. }
  286. }
  287. }
  288. } else {
  289. if (!this.$Cache.has('snsapiKey')) {
  290. if (location.pathname.indexOf('/pages/users/wechat_login/index') === -1) {
  291. Auth.oAuth(snsapiBase, urlData);
  292. }
  293. }
  294. }
  295. } else {
  296. if (option.query.back_url) {
  297. location.replace(uni.getStorageSync('snRouter'));
  298. }
  299. }
  300. }
  301. // #endif
  302. // #ifdef MP
  303. // 小程序静默授权
  304. if (!this.$store.getters.isLogin) {
  305. Routine.getCode().then(code => {
  306. this.silenceAuth(code);
  307. }).catch(res => {
  308. uni.hideLoading();
  309. });
  310. }else if(this.$store.getters.isLogin && this.getExpired()){
  311. //处理小程序有token情况下但是静默授权失败
  312. this.$Cache.clear(LOGIN_STATUS);
  313. Routine.getCode().then(code => {
  314. this.silenceAuth(code);
  315. })
  316. }
  317. // #endif
  318. },
  319. onShow(options) {
  320. let that = this;
  321. //直播间分享
  322. // #ifdef MP
  323. // const sceneList = [1007, 1008, 1014, 1044, 1045, 1046, 1047, 1048, 1049, 1073, 1154, 1155];
  324. // if (sceneList.includes(options.scene)) {
  325. // livePlayer.getShareParams()
  326. // .then(res => {
  327. // //记录推广人uid
  328. // if(res.custom_params.pid){
  329. // that.$Cache.set('spid', res.custom_params.pid);
  330. // that.globalData.spid = res.custom_params.pid;
  331. // }
  332. // }).catch(err => {
  333. // })
  334. // }
  335. // #endif
  336. // #ifdef APP
  337. // 升级App
  338. getUpApp();
  339. // #endif
  340. },
  341. methods: {
  342. // 小程序静默授权
  343. silenceAuth(code) {
  344. let that = this;
  345. let spid = that.globalData.spid ? that.globalData.spid : '';
  346. silenceAuth({
  347. code: code,
  348. spread_spid: spid,
  349. spread_code: that.globalData.code
  350. })
  351. .then(res => {
  352. if (res.data.token !== undefined && res.data.token) {
  353. uni.hideLoading();
  354. let time = res.data.expires_time - this.$Cache.time();
  355. that.$store.commit('LOGIN', {
  356. token: res.data.token,
  357. time: time
  358. });
  359. that.$store.commit('SETUID', res.data.userInfo.uid);
  360. that.$store.commit('UPDATE_USERINFO', res.data.userInfo);
  361. }
  362. }).catch(err => {
  363. return that.$util.Tips({
  364. title:err
  365. })
  366. });
  367. },
  368. isWork() {
  369. return navigator.userAgent.toLowerCase().indexOf('wxwork') !== -1 && navigator.userAgent.toLowerCase()
  370. .indexOf("micromessenger") !== -1
  371. },
  372. /**
  373. * 检测当前的小程序
  374. * 是否是最新版本,是否需要下载、更新
  375. */
  376. checkUpdateVersion() {
  377. //判断微信版本是否 兼容小程序更新机制API的使用
  378. if (wx.canIUse('getUpdateManager')) {
  379. const updateManager = wx.getUpdateManager();
  380. //检测版本更新
  381. updateManager.onCheckForUpdate(function(res) {
  382. if (res.hasUpdate) {
  383. updateManager.onUpdateReady(function() {
  384. wx.showModal({
  385. title: '温馨提示',
  386. content: '检测到新版本,是否重启小程序?',
  387. showCancel: false,
  388. success: function(res) {
  389. if (res.confirm) {
  390. // 新的版本已经下载好,调用 applyUpdate 应用新版本并重启
  391. updateManager.applyUpdate()
  392. }
  393. }
  394. })
  395. })
  396. updateManager.onUpdateFailed(function() {
  397. // 新版本下载失败
  398. wx.showModal({
  399. title: '已有新版本',
  400. content: '请您删除小程序,重新搜索进入',
  401. })
  402. })
  403. }
  404. })
  405. } else {
  406. wx.showModal({
  407. title: '溫馨提示',
  408. content: '当前微信版本过低,无法使用该功能,请升级到最新微信版本后重试。'
  409. })
  410. }
  411. },
  412. async getExpired(){
  413. // 通过一个个人中心的接口判断token是否生效,catch捕获到就证明token过期,返回true
  414. try {
  415. await getUserInfo();
  416. return false; // token有效
  417. } catch (err) {
  418. return true; // token过期
  419. }
  420. }
  421. },
  422. };
  423. </script>
  424. <style lang="scss">
  425. /* #ifndef APP-PLUS-NVUE || APP-NVUE */
  426. @import url('@/plugin/emoji-awesome/css/tuoluojiang.css');
  427. @import url('@/plugin/animate/animate.min.css');
  428. @import 'static/css/base.css';
  429. @import 'static/iconfont/iconfont.css';
  430. @import 'static/css/unocss.css';
  431. @import 'static/fonts/font.scss';
  432. view {
  433. box-sizing: border-box;
  434. }
  435. page {
  436. font-family: PingFang SC;
  437. }
  438. .placeholder{
  439. color: #ccc;
  440. }
  441. .bg-color-red {
  442. background-color: var(--view-theme) !important;
  443. }
  444. .syspadding {
  445. padding-top: var(--status-bar-height);
  446. }
  447. .flex {
  448. display: flex;
  449. }
  450. .uni-scroll-view::-webkit-scrollbar {
  451. /* 隐藏滚动条,但依旧具备可以滚动的功能 */
  452. display: none;
  453. }
  454. ::-webkit-scrollbar {
  455. width: 0;
  456. height: 0;
  457. color: transparent;
  458. }
  459. .uni-system-open-location .map-content.fix-position {
  460. height: 100vh;
  461. top: 0;
  462. bottom: 0;
  463. }
  464. /* #endif */
  465. </style>