App.vue 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228
  1. <script>
  2. export default {
  3. onLaunch: function() {
  4. },
  5. onShow: function() {
  6. console.log('App Show')
  7. },
  8. onHide: function() {
  9. console.log('App Hide')
  10. }
  11. }
  12. </script>
  13. <style>
  14. @import "~@/static/css/tiku.css";
  15. /*每个页面公共css */
  16. @import "./static/font/iconfont.css";
  17. /*占位符*/
  18. .lz-status_bar {
  19. height: var(--status-bar-height);
  20. width: 100%;
  21. background-color: #fff;
  22. }
  23. .lz-top_view {
  24. height: var(--status-bar-height);
  25. width: 100%;
  26. position: fixed;
  27. background-color: #fff;
  28. top: 0;
  29. z-index: 999;
  30. }
  31. /*头部样式*/
  32. .kaoshi-head{
  33. background: #fff;
  34. top: var(--status-bar-height);
  35. z-index: 100;
  36. border-bottom: solid 1px #f6f7f9;
  37. }
  38. .kaoshi-head-left .icon-zuojiantou{
  39. font-size: 20px;
  40. }
  41. .kaoshi-head-top{
  42. display: flex;
  43. font-size: 16px;
  44. color: #000;
  45. align-items: center;
  46. width: 93%;
  47. margin: 0 auto;
  48. line-height: 50px;
  49. }
  50. .kaoshi-head .kaoshi-head-left{width: 20%;display: flex;align-items: center;}
  51. .kaoshi-head .kaoshi-head-left .iconfont{font-size: 18px;}
  52. .kaoshi-head .kaoshi-head-m{
  53. width: 60%;
  54. text-align: center;
  55. font-size: 18px !important;
  56. text-overflow: ellipsis;
  57. overflow: hidden;
  58. display: -webkit-box;
  59. -webkit-line-clamp: 1;
  60. -webkit-box-orient: vertical;
  61. word-break: break-all;
  62. font-weight: bold !important;
  63. }
  64. .kaoshi-head .kaoshi-head-right{width: 20%;text-align: right;}
  65. .kaoshi-head-right .iconfont{
  66. font-size: 23px;
  67. }
  68. .pub-flex-1 {
  69. flex: 1;
  70. }
  71. .pub-gray{
  72. color: #b4b3b3;
  73. }
  74. .pub-s-gray {
  75. color: #616161;
  76. }
  77. .pub-orange{
  78. color: #ffb500
  79. }
  80. .pub-green{
  81. color: #0ec358;
  82. }
  83. .pub-red{
  84. color: #ff4c4c
  85. }
  86. .green-background{
  87. background: #0ec358;
  88. border: solid 1px #0ec358!important;
  89. color: #fff;
  90. }
  91. .orange-background{
  92. background: #ffb500;
  93. border: solid 1px #ffb500!important;
  94. color: #fff;
  95. }
  96. .red-background{
  97. background: #ff4c4c;
  98. border: solid 1px #ff4c4c!important;
  99. color: #fff;
  100. }
  101. .dai{
  102. border: solid 1px #0081ff!important;
  103. }
  104. .exam-tan-button {
  105. text-align: center;
  106. }
  107. .white-background{
  108. background: #fff
  109. }
  110. .vip{
  111. width: 35px;
  112. color: #ffecd5;
  113. border-radius: 5px;
  114. padding: 4px 6px;
  115. font-size: 11px;
  116. margin-left: 4px;
  117. display: inline-block;
  118. background-image: linear-gradient(to left, #4b444c, #000);
  119. }
  120. .vip image{
  121. width: 14px;
  122. height: 14px;
  123. float: left;
  124. margin-right: 3px;
  125. }
  126. /* 弹窗 */
  127. .lz-modal {
  128. position: fixed;
  129. top: 0;
  130. right: 0;
  131. bottom: 0;
  132. left: 0;
  133. z-index: 999;
  134. opacity: 0;
  135. outline: 0;
  136. text-align: center;
  137. backface-visibility: hidden;
  138. perspective: 1000px;
  139. background: rgba(0,0,0,.4);
  140. transition: all .3s ease-in-out 0s;
  141. pointer-events: none;
  142. }
  143. .lz-modal .lz-modal-dialog {
  144. position: relative;
  145. display: inline-block;
  146. vertical-align: middle;
  147. margin-left: auto;
  148. margin-right: auto;
  149. width: 81%;
  150. max-width: 100%;
  151. background-color: #fff;
  152. border-radius: 10px;
  153. overflow: hidden;
  154. }
  155. .lz-modal::before {
  156. content: "\200B";
  157. display: inline-block;
  158. height: 100%;
  159. vertical-align: middle;
  160. }
  161. .lz-list-header{
  162. display: flex;
  163. flex-direction: row;
  164. width: 89%;
  165. margin: 0 auto;
  166. padding: 14px 0;
  167. align-items: center;
  168. justify-content: space-between;
  169. font-size: 17px;
  170. color: #000;
  171. }
  172. .lz-list-header .iconfont{
  173. color: #c5c5c5;
  174. }
  175. .lz-list-item .lz-list-line .lz-list-content {
  176. flex: 1;
  177. color: #000;
  178. font-size: 15px;
  179. line-height: 1.5;
  180. text-align: left;
  181. width: auto;
  182. overflow: hidden;
  183. text-overflow: ellipsis;
  184. white-space: nowrap;
  185. padding: 10px 0;
  186. margin: 0 18px 12px;
  187. border: solid 1px #dfdfdf;
  188. padding-left: 11px;
  189. }
  190. .lz-list-item uni-input {
  191. font-size: 14px;
  192. }
  193. .lz-list-body::before {
  194. border-bottom: none;
  195. }
  196. .lz-list-body::before {
  197. border-top:none;
  198. }
  199. .primary {
  200. width: 92%;
  201. margin: 0 auto;
  202. background: #3c7bfc !important;
  203. color: #fff !important;
  204. border-radius: 6px;
  205. font-size: 16px;
  206. }
  207. .lz-list-header .icon-cuo1{
  208. font-size: 17px;
  209. color: #9e9e9e;
  210. }
  211. .lz-modal.lz-modal-show {
  212. opacity: 1;
  213. transition-duration: .3s;
  214. transform: scale(1);
  215. overflow-x: hidden;
  216. overflow-y: auto;
  217. pointer-events: auto;
  218. }
  219. .search-wuc .cur .cur-line{
  220. width: 17px !important;
  221. }
  222. .my-kf .uni-list-cell__container {
  223. padding: 9px 15px !important;
  224. }
  225. </style>