| <template> | |
|   <view class="page__view"> | |
| 
 | |
|     <view class="header"></view> | |
| 
 | |
|     <template v-if="isLogin"> | |
|       <view class="list"> | |
|         <view class="list-item" v-for="item in list" :key="item.id"> | |
|           <reportCard :data="item"></reportCard> | |
|         </view> | |
|       </view> | |
|     </template> | |
|     <!-- 用户登陆 --> | |
|     <template v-else> | |
|       <view class="login"> | |
|         <button class="btn" @click="$utils.toLogin">立即登录</button> | |
|         <view class="tips">暂未登录 请先登录</view> | |
|       </view> | |
|     </template> | |
| 
 | |
|     <tabber select="report" /> | |
| 
 | |
|   </view> | |
| </template> | |
| 
 | |
| <script> | |
| 	import mixinsList from '@/mixins/list.js' | |
| 
 | |
| 	import tabber from '@/components/base/tabbar.vue' | |
| 	import reportCard from '@/components/report/reportCard.vue' | |
| 
 | |
|   export default { | |
| 		mixins: [mixinsList], | |
|     components: { | |
|       tabber, | |
|       reportCard, | |
|     }, | |
|     data() { | |
|       return { | |
|         mixinsListApi: '', | |
|       } | |
|     }, | |
| 		onLoad() { | |
| 			if(uni.getStorageSync('token')){ | |
| 				this.$store.commit('getUserInfo') | |
| 			} | |
| 		}, | |
|     computed: { | |
| 			isLogin() { | |
| 				return this.userInfo && this.userInfo.id | |
| 			}, | |
|     }, | |
|     onShow() { | |
|       this.mixinsListApi = uni.getStorageSync('token') ? 'queryReportList' : '' | |
|       this.getData() | |
|     }, | |
|     methods: { | |
|     }, | |
|   } | |
| </script> | |
| 
 | |
| <style scoped lang="scss"> | |
|   .page__view { | |
|     background: #F5F5F5; | |
|   } | |
| 
 | |
|   .header { | |
|     width: 100%; | |
|     height: calc(var(--status-bar-height) + 120rpx); | |
|     background: linear-gradient(164deg, #014FA2, #4C8FD6); | |
|   } | |
| 
 | |
|   .list { | |
|     width: 100%; | |
|     padding: 29rpx; | |
|     box-sizing: border-box; | |
|     background: #F5F5F5; | |
| 
 | |
|     &-item { | |
|       & + & { | |
|         margin-top: 23rpx; | |
|       } | |
|     } | |
|   } | |
|    | |
| 	.login { | |
| 		margin-top: 307rpx; | |
|     width: 100%; | |
| 		padding: 0 128rpx; | |
|     box-sizing: border-box; | |
| 
 | |
| 		.btn { | |
| 			padding: 16rpx 0; | |
| 			font-family: PingFang SC; | |
| 			font-weight: 500; | |
| 			font-size: 36rpx; | |
| 			line-height: 1.4; | |
| 			color: #FFFFFF; | |
|       background: #014FA2; | |
| 			border-radius: 41rpx; | |
| 		} | |
| 
 | |
| 		.tips { | |
| 			margin-top: 16rpx; | |
| 			text-align: center; | |
| 			font-family: PingFang SC; | |
| 			font-weight: 400; | |
| 			font-size: 26rpx; | |
| 			line-height: 1.4; | |
| 			color: #A3A3A3; | |
| 		} | |
| 	} | |
| </style> |