App.vue 6.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353
  1. <script>
  2. import {
  3. getWxJSSDKConfig
  4. } from '@/apis/user.js';
  5. import {
  6. getQueryString
  7. } from './common/util/index.js';
  8. export default {
  9. onLaunch: function() {
  10. this.fontSizeSetting();
  11. uni.toast = (...args) => uni.showToast({
  12. duration: 5678,
  13. title: args[0],
  14. icon: 'none'
  15. });
  16. uni.loading = () => uni.showLoading({
  17. mask: false
  18. });
  19. // if (location.hash.length > 3) {
  20. // uni.reLaunch({ url: 'pages/index/index' })
  21. // }
  22. },
  23. onShow: function() {
  24. let code = getQueryString('code');
  25. if (code) {
  26. uni.setStorageSync('code', code);
  27. this.$store.commit('userinfo/SET_CODE', code);
  28. }
  29. },
  30. onHide: function() {
  31. console.log('App Hide');
  32. },
  33. methods: {
  34. fontSizeSetting() {
  35. window.onload = function() {
  36. setAndroidFontsize();
  37. htmlFontSize()
  38. }
  39. window.onresize = function() {
  40. setAndroidFontsize();
  41. htmlFontSize()
  42. }
  43. // 安卓解决微信浏览器字体被调大导致页面错乱的办法
  44. function setAndroidFontsize() {
  45. if (typeof window.WeixinJSBridge == "object" && typeof window.WeixinJSBridge.invoke == "function") {
  46. handleFontSize();
  47. } else {
  48. if (document.addEventListener) {
  49. document.addEventListener("WeixinJSBridgeReady", handleFontSize, false);
  50. } else if (document.attachEvent) {
  51. document.attachEvent("WeixinJSBridgeReady", handleFontSize);
  52. document.attachEvent("onWeixinJSBridgeReady", handleFontSize);
  53. }
  54. }
  55. }
  56. function handleFontSize() {
  57. window.WeixinJSBridge.invoke('setFontSizeCallback', {
  58. 'fontSize': 0
  59. });
  60. window.WeixinJSBridge.on('menu:setfont', function() {
  61. window.WeixinJSBridge.invoke('setFontSizeCallback', {
  62. 'fontSize': 0
  63. });
  64. });
  65. }
  66. function htmlFontSize() {
  67. var h = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
  68. var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
  69. var width = w > h ? h : w;
  70. width = width > 720 ? 720 : width
  71. var fz = ~~(width / 15)
  72. document.getElementsByTagName("html")[0].style.cssText = 'font-size: ' + fz + "px";
  73. var realfz = ~~(+window.getComputedStyle(document.getElementsByTagName("html")[0]).fontSize.replace(
  74. 'px', '') *
  75. 10000) / 10000
  76. if (fz !== realfz) {
  77. document.getElementsByTagName("html")[0].style.cssText = 'font-size: ' + fz * (fz / realfz) + "px";
  78. }
  79. }
  80. }
  81. }
  82. };
  83. </script>
  84. <style lang="scss">
  85. @import 'common/style/main.scss'; //引入 ColorUI 组件库主样式
  86. @import 'common/style/icon.scss'; //引入 ColorUI 组件库图标样式
  87. @import 'common/style/animation.scss'; //引入 ColorUI 组件库动画样式
  88. @import 'common/style/shop.scss'; //引入店铺的公用样式
  89. @import 'common/style/chat_icon.css'; //引入微聊的icon
  90. @import 'common/style/new_iconfont.css'; //引入iconfont
  91. @import 'uview-ui/index.scss'; //引入uview-ui样式
  92. @import './static/css/iconfont.css';
  93. @import './static/css/base.css';
  94. // @font-face {
  95. // font-family: pingfang;
  96. // src: url('http://api.app.jiuweiyun.cn/PINGFANG_BOLD.TTF');
  97. // }
  98. view,
  99. text {
  100. color: #333;
  101. font-family: pingfang;
  102. }
  103. .uni-tabbar__label {
  104. font-weight: bold;
  105. }
  106. page,
  107. #app,
  108. html,
  109. body {
  110. margin: 0;
  111. padding: 0;
  112. -moz-text-size-adjust: 100% !important;
  113. -webkit-text-size-adjust: 100% !important;
  114. text-size-adjust: 100% !important;
  115. -moz-text-size-adjust: 100% !important;
  116. }
  117. ::-webkit-scrollbar {
  118. display: none;
  119. }
  120. uni-tabbar {
  121. width: 100vw;
  122. .uni-tabbar {
  123. width: 100vw;
  124. font-family: pingfang;
  125. }
  126. }
  127. page {
  128. //uniapp 中的 page 标签相当于 html 中的 body, 默认高度为 auto, 但是高度为 100% 更利于 app 布局,你也可以在 page 中设置一些全局样式,比如全局背景色
  129. height: 100%;
  130. background: #f9f9fb;
  131. color: $app-main-text-color;
  132. }
  133. /deep/ .uni-modal__bd {
  134. font-size: 24px !important;
  135. }
  136. .pro_name {
  137. font-size: 32rpx;
  138. font-weight: bold;
  139. }
  140. .total {
  141. font-size: 32rpx;
  142. // margin-top:12rpx;
  143. text {
  144. font-weight: bold;
  145. color: #f76454;
  146. }
  147. text:first-child {
  148. font-size: 28rpx;
  149. margin-right: 5rpx;
  150. }
  151. }
  152. .flexV {
  153. display: flex;
  154. align-items: center;
  155. }
  156. .flexC {
  157. display: flex;
  158. align-items: center;
  159. justify-content: center;
  160. }
  161. .flexS {
  162. display: flex;
  163. align-items: center;
  164. justify-content: flex-start;
  165. }
  166. .flexSS {
  167. display: flex;
  168. align-items: flex-start;
  169. justify-content: flex-start;
  170. }
  171. .flexE {
  172. display: flex;
  173. align-items: center;
  174. justify-content: flex-end;
  175. }
  176. .flexA {
  177. display: flex;
  178. justify-content: space-around;
  179. align-items: center;
  180. }
  181. .flexB {
  182. display: flex;
  183. justify-content: space-between;
  184. align-items: center;
  185. }
  186. .flexBS {
  187. display: flex;
  188. justify-content: space-between;
  189. align-items: flex-start;
  190. }
  191. .flexCC {
  192. display: flex;
  193. flex-direction: column;
  194. justify-content: center;
  195. align-items: center;
  196. }
  197. .safeguard {
  198. font-size: 24rpx;
  199. width: 140rpx;
  200. text-align: center;
  201. height: 46rpx;
  202. line-height: 46rpx;
  203. color: #999;
  204. background: #f8f8f8;
  205. margin-top: 16rpx;
  206. border-radius: 8rpx;
  207. box-sizing: border-box;
  208. }
  209. .gray {
  210. font-size: 28rpx;
  211. color: #999;
  212. margin-right: 5rpx;
  213. }
  214. .block {
  215. width: 750rpx;
  216. height: 20rpx;
  217. background-color: #f9f9fb;
  218. }
  219. //复制按钮
  220. .copy_btn {
  221. width: 100rpx;
  222. text-align: center;
  223. height: 50rpx;
  224. line-height: 50rpx;
  225. font-size: 28rpx;
  226. display: inline-block;
  227. background: $base-line-bg;
  228. border-radius: 24rpx;
  229. color: #fff;
  230. margin-left: 30rpx;
  231. }
  232. .base_btn {
  233. width: 176rpx;
  234. text-align: center;
  235. height: 68rpx;
  236. line-height: 68rpx;
  237. background: $base-line-bg;
  238. border-radius: 34rpx;
  239. font-size: 28rpx;
  240. color: #fff;
  241. margin-left: 15rpx;
  242. }
  243. .after_btn {
  244. width: 192rpx;
  245. height: 68rpx;
  246. background: #fff4f3;
  247. opacity: 1;
  248. border-radius: 34rpx;
  249. color: $base-color;
  250. text-align: center;
  251. line-height: 68rpx;
  252. }
  253. //查询按钮
  254. .search_btn {
  255. width: 124rpx;
  256. height: 64rpx;
  257. text-align: center;
  258. line-height: 64rpx;
  259. background: $base-line-bg;
  260. font-size: 28rpx;
  261. color: #fff;
  262. border-radius: 44rpx;
  263. }
  264. //提交按钮
  265. .sub_btn {
  266. width: 530rpx;
  267. margin: 0 auto;
  268. height: 88rpx;
  269. background: $base-line-bg;
  270. opacity: 1;
  271. border-radius: 44rpx;
  272. color: #fff;
  273. text-align: center;
  274. line-height: 88rpx;
  275. font-size: 32rpx;
  276. }
  277. .search_inp {
  278. width: 540rpx;
  279. }
  280. .iconxuanzhong {
  281. color: $base-color;
  282. }
  283. .iconfont {
  284. vertical-align: middle;
  285. }
  286. //无数据时显示
  287. .noData {
  288. width: 100%;
  289. text-align: center;
  290. margin-top: 15vh;
  291. image {
  292. width: 485rpx;
  293. height: 351rpx;
  294. }
  295. view {
  296. margin-top: 40rpx;
  297. }
  298. }
  299. //一年零一天,不满意退钱
  300. .one_year {
  301. padding: 5rpx 20rpx;
  302. background: #fff4f3;
  303. color: $base-color;
  304. border-radius: 8rpx;
  305. margin-top: 15rpx;
  306. font-size: 24rpx;
  307. }
  308. </style>