App.vue 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355
  1. <script>
  2. import {
  3. init
  4. } from "@/common";
  5. export default {
  6. onLaunch(options) {
  7. if (uni.getStorageSync('token')) {
  8. uni.redirectTo({
  9. url: '/pages/index/index'
  10. })
  11. }
  12. // init(options);
  13. // // #ifndef MP-TOUTIAO
  14. // uni.hideTabBar({});
  15. // // #endif
  16. },
  17. };
  18. </script>
  19. <style lang="scss">
  20. /*每个页面公共css */
  21. @import "uview-ui/index.scss";
  22. @import "animate.css";
  23. @import "static/iconfont/iconfont.css";
  24. @import './tuniao-ui/index.scss';
  25. @import './tuniao-ui/iconfont.css';
  26. ::-webkit-scrollbar {
  27. display: none;
  28. width: 0 !important;
  29. height: 0 !important;
  30. -webkit-appearance: none;
  31. background: transparent;
  32. }
  33. ::v-deep uni-swiper .uni-swiper-wrapper {
  34. // background: red !important;
  35. // padding-left: 150rpx;
  36. }
  37. .uni-textarea {
  38. width: 100% !important;
  39. height: 200rpx !important;
  40. }
  41. .uni-easyinput__content {
  42. background: #fff !important;
  43. }
  44. .uni-easyinput__content-input {
  45. height: 78rpx !important;
  46. padding-left: 100rpx !important;
  47. }
  48. .uni-input-placeholder {
  49. // margin-left: 90rpx;
  50. // height: 90rpx;
  51. line-height: 78rpx;
  52. }
  53. .uni-easyinput__content-input {
  54. background: #eee;
  55. border-radius: 50rpx;
  56. height: 120rpx;
  57. }
  58. .flxe {
  59. display: flex;
  60. }
  61. .justify-between {
  62. justify-content: space-between;
  63. }
  64. .flxe-column {
  65. flex-direction: column;
  66. }
  67. .align-center {
  68. align-items: center;
  69. }
  70. .justify-center {
  71. justify-content: center;
  72. }
  73. .flex-wrap {
  74. flex-wrap: wrap;
  75. }
  76. .u-relative,
  77. .u-rela {
  78. position: relative;
  79. }
  80. .u-absolute,
  81. .u-abso {
  82. position: absolute;
  83. }
  84. // nvue不能用标签命名样式,不能放在微信组件中,否则微信开发工具会报警告,无法使用标签名当做选择器
  85. /* #ifndef APP-NVUE */
  86. image {
  87. display: inline-block;
  88. }
  89. // 在weex,也即nvue中,所有元素默认为border-box
  90. view,
  91. text {
  92. box-sizing: border-box;
  93. }
  94. /* #endif */
  95. .u-font-xs {
  96. font-size: 22rpx;
  97. }
  98. .u-font-sm {
  99. font-size: 26rpx;
  100. }
  101. .u-font-md {
  102. font-size: 28rpx;
  103. }
  104. .u-font-lg {
  105. font-size: 30rpx;
  106. }
  107. .u-font-xl {
  108. font-size: 34rpx;
  109. }
  110. .u-flex {
  111. /* #ifndef APP-NVUE */
  112. display: flex;
  113. /* #endif */
  114. flex-direction: row;
  115. align-items: center;
  116. }
  117. .u-flex-wrap {
  118. flex-wrap: wrap;
  119. }
  120. .u-flex-nowrap {
  121. flex-wrap: nowrap;
  122. }
  123. .u-col-center {
  124. align-items: center;
  125. }
  126. .u-col-top {
  127. align-items: flex-start;
  128. }
  129. .u-col-bottom {
  130. align-items: flex-end;
  131. }
  132. .u-row-center {
  133. justify-content: center;
  134. }
  135. .u-row-left {
  136. justify-content: flex-start;
  137. }
  138. .u-row-right {
  139. justify-content: flex-end;
  140. }
  141. .u-row-between {
  142. justify-content: space-between;
  143. }
  144. .u-row-around {
  145. justify-content: space-around;
  146. }
  147. .u-text-left {
  148. text-align: left;
  149. }
  150. .u-text-center {
  151. text-align: center;
  152. }
  153. .u-text-right {
  154. text-align: right;
  155. }
  156. .u-flex-col {
  157. /* #ifndef APP-NVUE */
  158. display: flex;
  159. /* #endif */
  160. flex-direction: column;
  161. }
  162. /**
  163. * 弹性盒三段式布局
  164. */
  165. .page_box {
  166. height: 100%;
  167. width: 100%;
  168. display: flex;
  169. flex-direction: column;
  170. justify-content: space-between;
  171. overflow-x: hidden;
  172. background: $u-bg-color;
  173. }
  174. .scroll-box {
  175. flex: 1;
  176. height: 100%;
  177. position: relative;
  178. }
  179. .content_box {
  180. flex: 1;
  181. overflow-y: auto;
  182. }
  183. /**
  184. * 溢出省略号
  185. * @param {Number} 行数
  186. */
  187. @mixin ellipsis($rowCount: 1) {
  188. @if $rowCount <=1 {
  189. overflow: hidden;
  190. text-overflow: ellipsis;
  191. white-space: nowrap;
  192. }
  193. @else {
  194. min-width: 0;
  195. overflow: hidden;
  196. text-overflow: ellipsis;
  197. display: -webkit-box;
  198. -webkit-line-clamp: $rowCount;
  199. -webkit-box-orient: vertical;
  200. }
  201. }
  202. @for $i from 1 through 12 {
  203. .u-ellipsis-#{$i} {
  204. @include ellipsis($i);
  205. }
  206. }
  207. // 定义flex等分
  208. @for $i from 0 through 12 {
  209. .u-flex-#{$i} {
  210. flex: $i;
  211. }
  212. }
  213. // 定义字体(px)单位,小于20都为px单位字体
  214. @for $i from 9 to 20 {
  215. .u-font-#{$i} {
  216. font-size: $i + px;
  217. }
  218. }
  219. // 定义字体(rpx)单位,大于或等于20的都为rpx单位字体
  220. @for $i from 20 through 40 {
  221. .u-font-#{$i} {
  222. font-size: $i + rpx;
  223. }
  224. }
  225. // 定义内外边距,历遍1-100
  226. @for $i from 0 through 100 {
  227. // 只要双数和能被5除尽的数
  228. @if $i % 2==0 or $i % 5==0 {
  229. // 得出:u-margin-30或者u-m-30
  230. .u-margin-#{$i},
  231. .u-m-#{$i} {
  232. margin: $i + rpx !important;
  233. }
  234. .u-m-x-#{$i} {
  235. margin-left: $i + rpx !important;
  236. margin-right: $i + rpx !important;
  237. }
  238. .u-m-y-#{$i} {
  239. margin-top: $i + rpx !important;
  240. margin-bottom: $i + rpx !important;
  241. }
  242. // 得出:u-padding-30或者u-p-30
  243. .u-padding-#{$i},
  244. .u-p-#{$i} {
  245. padding: $i + rpx !important;
  246. }
  247. .u-p-x-#{$i} {
  248. padding-left: $i + rpx !important;
  249. padding-right: $i + rpx !important;
  250. }
  251. .u-p-y-#{$i} {
  252. padding-top: $i + rpx !important;
  253. padding-bottom: $i + rpx !important;
  254. }
  255. @each $short,
  256. $long in l left,
  257. t top,
  258. r right,
  259. b bottom {
  260. // 缩写版,结果如: u-m-l-30
  261. // 定义外边距
  262. .u-m-#{$short}-#{$i} {
  263. margin-#{$long}: $i + rpx !important;
  264. }
  265. // 定义内边距
  266. .u-p-#{$short}-#{$i} {
  267. padding-#{$long}: $i + rpx !important;
  268. }
  269. // 完整版,结果如:u-margin-left-30
  270. // 定义外边距
  271. .u-margin-#{$long}-#{$i} {
  272. margin-#{$long}: $i + rpx !important;
  273. }
  274. // 定义内边距
  275. .u-padding-#{$long}-#{$i} {
  276. padding-#{$long}: $i + rpx !important;
  277. }
  278. }
  279. }
  280. }
  281. // 重置nvue的默认关于flex的样式
  282. .u-reset-nvue {
  283. flex-direction: row;
  284. align-items: center;
  285. }
  286. </style>