Web_TracerMethodology/pages/planDetailList/planDetailList.vue

<!-- 自查督查小计划列表  -->

<template>
	<view class="planDetailList">
		<view class="list" v-for="item in list" @click="toCheckItemList(item)">
			  <text class="name">{{item.departmentName}}</text>
			  <view class="row">
			  	   <text class="left">得分</text>
				   <text class="right">{{item.selfScore}}</text>
			  </view>
			  <view class="row">
			  	   <text class="left">改善</text>
			  	   <text class="right">{{item.improveStatus}}</text>
			  </view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[]
			};
		},
		onLoad({
			situationId,
			num,
			planType,
			entry,//点击进来的入口
		}) {
			this.situationId = situationId;
			this.num = num;
			this.entry = entry;
			this.planType = planType;
			
			this.getData(situationId,num,planType);
		},
		methods:{
			getData(situationId,num,planType){
				 this.$store.dispatch({
				 	type: 'planDetailList/commActions',
				 	payload: {
				 		key: 'getPlanList',
				 		data: {
				 			situationId: situationId,
							num:num,
							planType:planType,
							entry:this.entry
				 		}
				 	}
				 }).then((data)=>{
					   this.list = data;
				 })
			},
			toCheckItemList(item){
				uni.navigateTo({
					url: `/pages/checkMainPoints/checkMainPoints?situationType=${1}&functionId=${item.functionId}&isZichaDucha=${true}&departmentId=${item.departmentId}`
				});
			}
		}
	}
</script>

<style lang="less">
    .planDetailList {
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		padding: 25rpx;
		.list {
			width: 337.5rpx;
			height: 175rpx;
			margin-right: 25rpx;
			background: #FFFFFF;
			box-shadow: 0px 3.75rpx 12.5rpx 0px rgba(0,13,51,0.1);
			border-radius: 5rpx;
			padding: 25rpx;
			margin-bottom: 25rpx;
			.name {
				display: inline-block;
				font-size: 30rpx;
				font-family: SourceHanSansCN-Light, SourceHanSansCN;
				font-weight: 300;
				color: #292C33;
				margin-bottom: 25rpx;
			}
			.row {
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				align-items: center;
				margin-bottom: 20rpx;
				.left {
					font-size: 25rpx;
					font-family: SourceHanSansCN-Normal, SourceHanSansCN;
					font-weight: 400;
					color: #666F80;
				}
				.right {
					font-size: 25rpx;
					font-family: SourceHanSansCN-Medium, SourceHanSansCN;
					font-weight: 500;
					color: #292C33;
				}
				&:last-child {
					margin-bottom: 0;
					.right {
						color: #3377FF;
					}
				}
			}
			
			&:nth-child(2n){
				margin-right: 0;
			}
		}
	}
</style>