App.vue 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330
  1. <script>
  2. /**
  3. * vuex管理登陆状态,具体可以参考官方登陆模板示例
  4. */
  5. import {
  6. mapMutations
  7. } from 'vuex';
  8. // #ifdef H5
  9. import {
  10. weixindata,
  11. setRouter
  12. } from './utils/wxAuthorized';
  13. // #endif
  14. // #ifdef APP-PLUS
  15. import {
  16. getUpApp
  17. } from './utils/upApp.js';
  18. // #endif
  19. export default {
  20. data() {
  21. return {
  22. /* 保存微信信息 */
  23. appData: {}
  24. };
  25. },
  26. methods: {
  27. ...mapMutations('user', ['setUserInfo', 'login', 'hasLogin']),
  28. ...mapMutations('shop', ['setShopInfo', 'setShopAction']),
  29. ...mapMutations(['setFirstUse'])
  30. },
  31. onLaunch: function(urlObj) {
  32. console.log('开始升级');
  33. const obj = this;
  34. // 加载缓存中的用户信息
  35. const userInfo = uni.getStorageSync('userInfo') || '';
  36. // 判断是否拥有用户信息
  37. if (userInfo) {
  38. //更新登陆状态
  39. uni.getStorage({
  40. key: 'userInfo',
  41. success: res => {
  42. obj.setUserInfo(res.data);
  43. obj.login();
  44. },
  45. fail(res) {
  46. console.log(res, 'res.data');
  47. }
  48. });
  49. }
  50. // 获取当前位置附近商店数据
  51. const shopDetail = uni.getStorageSync('shopDetail') || '';
  52. if (shopDetail) {
  53. uni.getStorage({
  54. key: 'shopDetail',
  55. success: res => {
  56. obj.setShopInfo(res.data);
  57. }
  58. });
  59. }
  60. // 获取商家用户数据
  61. const shopDetailAction = uni.getStorageSync('shopDetailAction') || '';
  62. if (shopDetailAction) {
  63. uni.getStorage({
  64. key: 'shopDetailAction',
  65. success: res => {
  66. obj.setShopAction(res.data);
  67. }
  68. });
  69. }
  70. // 获取是否已经在如果引导图
  71. const guideMap = uni.getStorageSync('guideMap') || false;
  72. // 判断是否已经加载过数据
  73. if (guideMap) {
  74. this.setFirstUse(true)
  75. }
  76. // #ifdef H5
  77. // 保存路由对象
  78. setRouter(this.$router);
  79. //判断是否已经缓存浏览器
  80. let bool = uni.getStorageSync('weichatBrowser') || '';
  81. if (bool === '') {
  82. //判断是否为微信浏览
  83. bool = navigator.userAgent.toLowerCase().match(/MicroMessenger/i) == 'micromessenger';
  84. // 保存当前是否为微信内核浏览器
  85. uni.setStorageSync('weichatBrowser', bool);
  86. }
  87. if (bool) {
  88. // 加载微信信息
  89. weixindata();
  90. }
  91. // #endif
  92. // #ifdef APP-PLUS
  93. // 判断是否升级
  94. getUpApp();
  95. // 获取当前运行系统
  96. let system = uni.getStorageSync('platform') || '';
  97. if (!system) {
  98. uni.setStorage({
  99. key: 'platform',
  100. data: uni.getSystemInfoSync().platform
  101. });
  102. }
  103. // #endif
  104. },
  105. onShow: function() {
  106. // 加载拦截
  107. // console.log('App Show');
  108. },
  109. onHide: function() {
  110. // console.log('App Hide');
  111. }
  112. };
  113. </script>
  114. <style lang="scss">
  115. /*全局公共样式和字体图标*/
  116. @import '/static/css/cmy.css';
  117. view,
  118. scroll-view,
  119. swiper,
  120. swiper-item,
  121. cover-view,
  122. cover-image,
  123. icon,
  124. text,
  125. rich-text,
  126. progress,
  127. button,
  128. checkbox,
  129. form,
  130. input,
  131. label,
  132. radio,
  133. slider,
  134. switch,
  135. textarea,
  136. navigator,
  137. audio,
  138. camera,
  139. image,
  140. video {
  141. box-sizing: border-box;
  142. }
  143. /* 骨架屏替代方案 */
  144. .Skeleton {
  145. background: #f3f3f3;
  146. padding: 20rpx 0;
  147. border-radius: 8rpx;
  148. }
  149. /* 图片载入替代方案 */
  150. .image-wrapper {
  151. font-size: 0;
  152. background: #f3f3f3;
  153. border-radius: 4px;
  154. image {
  155. width: 100%;
  156. height: 100%;
  157. transition: 0.6s;
  158. opacity: 0;
  159. &.loaded {
  160. opacity: 1;
  161. }
  162. }
  163. }
  164. // 设置富文本中图片最大宽度
  165. uni-rich-text img {
  166. max-width: 100% !important;
  167. }
  168. /*边框*/
  169. .b-b:after,
  170. .b-t:after {
  171. position: absolute;
  172. z-index: 3;
  173. left: 0;
  174. right: 0;
  175. height: 0;
  176. content: '';
  177. transform: scaleY(0.5);
  178. border-bottom: 1px solid $border-color-base;
  179. }
  180. .b-b:after {
  181. bottom: 0;
  182. }
  183. .b-t:after {
  184. top: 0;
  185. }
  186. /* input 样式 */
  187. .input-placeholder {
  188. color: #999999;
  189. }
  190. .placeholder {
  191. color: #999999;
  192. }
  193. // 边距样式
  194. @for $i from 1 to 5 {
  195. .margin-l-#{$i * 10} {
  196. margin-left: $i * 10rpx !important;
  197. }
  198. .margin-r-#{$i * 10} {
  199. margin-right: $i * 10rpx !important;
  200. }
  201. .margin-t-#{$i * 10} {
  202. margin-top: $i * 10rpx !important;
  203. }
  204. .margin-b-#{$i * 10} {
  205. margin-bottom: $i * 10rpx !important;
  206. }
  207. .margin-#{$i * 10} {
  208. margin: $i * 10rpx !important;
  209. }
  210. .margin-v-#{$i * 10} {
  211. margin-top: $i * 10rpx !important;
  212. margin-bottom: $i * 10rpx !important;
  213. }
  214. .margin-c-#{$i * 10} {
  215. margin-left: $i * 10rpx !important;
  216. margin-right: $i * 10rpx !important;
  217. }
  218. .padding-l-#{$i * 10} {
  219. padding-left: $i * 10rpx !important;
  220. }
  221. .padding-r-#{$i * 10} {
  222. padding-right: $i * 10rpx !important;
  223. }
  224. .padding-t-#{$i * 10} {
  225. padding-top: $i * 10rpx !important;
  226. }
  227. .padding-b-#{$i * 10} {
  228. padding-bottom: $i * 10rpx !important;
  229. }
  230. .padding-#{$i * 10} {
  231. padding: $i * 10rpx !important;
  232. }
  233. .padding-v-#{$i * 10} {
  234. padding-top: $i * 10rpx !important;
  235. padding-bottom: $i * 10rpx !important;
  236. }
  237. .padding-c-#{$i * 10} {
  238. padding-left: $i * 10rpx !important;
  239. padding-right: $i * 10rpx !important;
  240. }
  241. }
  242. // 字体大小
  243. .font-size-sm {
  244. font-size: $font-sm;
  245. }
  246. .font-size-base {
  247. font-size: $font-base;
  248. }
  249. .font-size-lg {
  250. font-size: $font-lg;
  251. }
  252. // 字体颜色
  253. .font-color-yellow {
  254. color: $color-yellow !important;
  255. }
  256. .font-color-gray {
  257. color: $color-gray !important;
  258. }
  259. .font-color-red {
  260. color: $color-red !important;
  261. }
  262. .font-color-greed {
  263. color: $color-green !important;
  264. }
  265. // 边框颜色
  266. .border-color-yellow {
  267. border: 1rpx solid $color-yellow;
  268. }
  269. // 基础按钮
  270. .base-buttom {
  271. background-color: $base-color;
  272. font-size: 32rpx;
  273. padding: 30rpx;
  274. color: #FFFFFF;
  275. margin: 0 30rpx;
  276. border-radius: 10rpx;
  277. margin-top: 100rpx;
  278. text-align: center;
  279. z-index: 95;
  280. }
  281. // 修改默认背景颜色
  282. uni-page-wrapper {
  283. background-color: $page-color-base;
  284. }
  285. page {
  286. background-color: $page-color-base;
  287. // 设置默认字体
  288. font-family: PingFang SC, STHeitiSC-Light, Helvetica-Light, arial, sans-serif, Droid Sans Fallback;
  289. min-height: 100%;
  290. height: 0;
  291. }
  292. </style>