| <template> | 
|     <view class="box"> | 
|         <view class="box_head"> | 
|             <image src="@/static/n/banner@2x.png" mode="widthFix"></image> | 
|         </view> | 
|         <view class="box_list"> | 
|             <view class="box_list_item" @click="jump(1)"> | 
|                 <image src="@/static/n/ic_laifang@2x.png" mode="widthFix" /> | 
|             </view> | 
|             <view class="box_list_item" @click="jump(2)"> | 
|                 <image src="@/static/n/ic_shenqing@2x.png" mode="widthFix" /> | 
|             </view> | 
|             <view class="box_list_item" @click="jump(3)"> | 
|                 <image src="@/static/n/ic_renyuan@2x.png" mode="widthFix" /> | 
|             </view> | 
|             <view class="box_list_item" @click="jump(4)"> | 
|                 <image src="@/static/n/ic_mima@2x.png" mode="widthFix" /> | 
|             </view> | 
|         </view> | 
|         <view class="box_btn">退出登录</view> | 
|     </view> | 
| </template> | 
|   | 
| <script> | 
|     export default { | 
|   | 
|         data() { | 
|             return { | 
|   | 
|             } | 
|         }, | 
|   | 
|         methods: { | 
|             jump(type) { | 
|                 switch (type) { | 
|                     case 1: | 
|                         uni.navigateTo({ | 
|                             url: '/n_pages/applicationRecord/applicationRecord' | 
|                         }) | 
|                         break | 
|                     case 2: | 
|                          | 
|                         break | 
|                     case 3: | 
|                          | 
|                         break | 
|                     case 4: | 
|                          | 
|                         break | 
|                 } | 
|             } | 
|         } | 
|     } | 
| </script> | 
|   | 
| <style lang="scss" scoped> | 
|     .box { | 
|         width: 100%; | 
|         height: auto; | 
|         padding: 30rpx; | 
|         box-sizing: border-box; | 
|   | 
|         .box_btn { | 
|             position: fixed; | 
|             bottom: 70rpx; | 
|             left: 50%; | 
|             transform: translate(-50%, 0); | 
|             width: 208rpx; | 
|             height: 72rpx; | 
|             line-height: 72rpx; | 
|             text-align: center; | 
|             border-radius: 36rpx; | 
|             border: 1rpx solid #999999; | 
|             font-size: 28rpx; | 
|             font-weight: 400; | 
|             color: #333333; | 
|         } | 
|   | 
|         .box_head { | 
|             width: 100%; | 
|             height: 270rpx; | 
|             background: #D8D8D8; | 
|             border-radius: 8rpx; | 
|             display: flex; | 
|             flex-direction: column; | 
|             image { | 
|                 width: 100%; | 
|                 height: 100%; | 
|             } | 
|         } | 
|   | 
|         .box_list { | 
|             width: 100%; | 
|             display: flex; | 
|             align-items: center; | 
|             flex-wrap: wrap; | 
|             justify-content: space-between; | 
|             margin-top: 40rpx; | 
|   | 
|             .box_list_item { | 
|                 width: 49%; | 
|                 // height: 200rpx; | 
|                 margin-bottom: 20rpx; | 
|   | 
|                 image { | 
|                     width: 100%; | 
|                     height: 100%; | 
|                 } | 
|             } | 
|         } | 
|     } | 
| </style> |