App.vue 5.3 KB

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