index.vue 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227
  1. <template>
  2. <div class="content">
  3. <!-- banner图 -->
  4. <banner></banner>
  5. <!-- 寄件按钮 -->
  6. <div class="btn-two">
  7. <a @click="goPage(1)">
  8. <span class="iconfont icon-delTask_slt iconStyle"></span>
  9. <!-- <img src="../assets/images/jkd.png" alt=""> -->
  10. <span>
  11. <p>寄快递</p>
  12. <!-- <p>放心寄 丢必赔</p> -->
  13. </span>
  14. </a>
  15. <router-link to="Inexpress">
  16. <span class="iconfont icon-neibujianpeizhi iconStyle"></span>
  17. <!-- <img src="../assets/images/nbj.png" alt=""> -->
  18. <span>
  19. <p>内部件</p>
  20. <!-- <p>让工作 更便捷</p> -->
  21. </span>
  22. </router-link>
  23. <router-link to="Logisticslist">
  24. <span class="iconfont icon-24gf-box2 iconStyle"></span>
  25. <!-- <img src="../assets/images/wdkd.png" alt=""> -->
  26. <span>
  27. <p>我的寄件</p>
  28. <!-- <p>让工作 更便捷</p> -->
  29. </span>
  30. </router-link>
  31. <router-link to="Search">
  32. <span class="iconfont icon-a-jijiansel iconStyle"></span>
  33. <!-- <img src="../assets/images/wdsj.png" alt=""> -->
  34. <span>
  35. <p>我的收件</p>
  36. <!-- <p>让工作 更便捷</p> -->
  37. </span>
  38. </router-link>
  39. </div>
  40. <tabbar></tabbar>
  41. </div>
  42. </template>
  43. <script>
  44. import { Toast, Dialog } from 'vant'
  45. import { getWxUserInfo } from '../api/login'
  46. import { getWxOpenId } from '../script/wxGetOpenId'
  47. export default {
  48. data() {
  49. return {
  50. };
  51. },
  52. created: async function () {
  53. // this.getOpenid();
  54. console.log('开始走了')
  55. // getWxOpenId()
  56. },
  57. methods: {
  58. link() {
  59. Toast("正在开发中,敬请期待!")
  60. },
  61. goPage(type){
  62. if(type === 1){
  63. window.location.href = window.location.href + "Express"
  64. window.location.reload()
  65. }
  66. }
  67. }
  68. };
  69. </script>
  70. <style lang="less" scoped>
  71. .content {
  72. padding: .33rem .34rem 1rem;
  73. .btn-two {
  74. font-size: .24rem;
  75. color: #999999;
  76. display: flex;
  77. flex-wrap: wrap;
  78. margin: .2rem auto;
  79. height: 300px;
  80. a {
  81. display: flex;
  82. flex-direction: column;
  83. align-items: center;
  84. justify-content: center;
  85. color: #999999;
  86. padding: .25rem 0rem;
  87. background: white;
  88. width: 50%;
  89. border-radius: .05rem;
  90. justify-content: center;
  91. .iconStyle {
  92. font-size: 1rem;
  93. color: #0c2469;
  94. // width: 1.2rem;
  95. // height: 1.2rem;
  96. position: relative;
  97. top: .1rem;
  98. margin-bottom: 10px;
  99. }
  100. span {
  101. p:nth-of-type(1) {
  102. font-size: .3rem;
  103. color: #333;
  104. font-weight: bold;
  105. margin-bottom: .1rem;
  106. }
  107. }
  108. }
  109. }
  110. .btn-four {
  111. font-size: .24rem;
  112. color: #999999;
  113. display: flex;
  114. flex-wrap: wrap;
  115. justify-content: space-between;
  116. margin: .2rem auto;
  117. background: white;
  118. padding: .25rem .2rem;
  119. border-radius: .05rem;
  120. div {
  121. flex: 1;
  122. min-width: 48%;
  123. padding: .2rem 0rem;
  124. a {
  125. display: flex;
  126. color: #999999;
  127. justify-content: center;
  128. padding: .1rem 0rem;
  129. img {
  130. width: .52rem;
  131. height: .5rem;
  132. position: relative;
  133. top: .2rem;
  134. }
  135. span {
  136. margin-left: .25rem;
  137. p:nth-of-type(1) {
  138. font-size: .3rem;
  139. color: #333;
  140. font-weight: bold;
  141. margin-bottom: .1rem;
  142. }
  143. }
  144. }
  145. }
  146. div:nth-of-type(1) a,
  147. div:nth-of-type(3) a {
  148. border-right: .01rem solid #f7f7f7;
  149. }
  150. div:nth-of-type(1),
  151. div:nth-of-type(2) {
  152. border-bottom: .01rem solid #f7f7f7;
  153. }
  154. }
  155. .ad-two {
  156. font-size: .24rem;
  157. color: #999999;
  158. display: flex;
  159. justify-content: center;
  160. margin: .2rem auto;
  161. a {
  162. flex: 1;
  163. color: #999999;
  164. padding: .35rem 0rem;
  165. background: white;
  166. width: 48%;
  167. border-radius: .05rem;
  168. text-align: center;
  169. img {
  170. width: .55rem;
  171. height: .55rem;
  172. margin-bottom: .1rem;
  173. }
  174. span {
  175. display: block;
  176. }
  177. }
  178. }
  179. .foot_icon {
  180. display: flex;
  181. justify-content: center;
  182. margin: .55rem auto;
  183. div {
  184. flex: 1;
  185. text-align: center;
  186. font-size: .2rem;
  187. color: #999999;
  188. img {
  189. width: .64rem;
  190. height: .64rem;
  191. }
  192. }
  193. }
  194. }
  195. .iconStyle {
  196. font-size: 1rem;
  197. color: #0c2469;
  198. }
  199. </style>