dev/dcp-app-gate/pages/financialService/projectEvaluation/evaluationList.vue

<template>

	<view class="rf-category">
		<view class="icoStyle">
			<view style="width:90%;height:99upx">
				<rf-search-bar @search="navToSearch" icon="iconkuaijiecaidan" style="z-index: 99;" />
			</view>
		</view>
		<PageMenu :currentIndex="2" />
		
			<view style="">
				<image src="../../../static/img/finance/titleContent.png" style="width: 100%;"></image>
			</view>
			<view class="desc">
				<text style="font-size: 30upx;font-weight: 600;">
					{{$t('common.ProjectEaluationService')}}
				</text>
				<view class="descList">
					<ul>
						<li>
							<view class="iconBox">
								<image src="../../../static/img/finance/projectIcon1.png" style="width: 34upx;height:34upx;"></image>
							</view>
							
							<span style="float: left;width: 90%;margin-left: 14upx;">{{$t('common.Quantitative')}}</span>
							<div style="clear: both;"></div>
						</li>
						<li>
							<view class="iconBox">
								<image src="../../../static/img/finance/projectIcon2.png" style="width: 34upx;height: 34upx"></image>
							</view>
							<span style="float: left;width: 90%;margin-left: 14upx;">{{$t('common.MicroBenefitAnalysis')}}</span>
							<div style="clear: both;"></div>
						</li>
					</ul>
				</view>
			</view>
		
		<view class="analyBox">
			<view v-for="(item,index) in Analysis" class="analyList">
				<view style="font-size: 30upx;font-weight: 600;text-align: center;">{{$t(item.title)}}</view>
				<text style="font-size: 24upx;margin-top:40upx;">{{$t(item.label)}}</text>
			</view>
		</view>
		<view class="reportBox">
			<view class="reportTitle"> 
				{{$t('common.ExamplesProject')}}
			</view>
			<view class="reportList">
				<ul v-for="reportItem in reportList" style="padding: 0 20upx;background: #EFF6FF;">
					<li class="reportName"  @click="goproject('/pages/country/projectPresentation/projectPresentationDetails',reportItem.projectId)">
						{{reportItem.projectName}}
					</li>
					<li class="reportMessage" @click="gopage('projectEvaluation/evaluationPdfDetsils',reportItem)">
						<!-- <image src="../../../static/img/finance/reportIcon/pdf.png" alt="" class="iconMark"> -->
						{{reportItem.projectReportName}}
					</li>
				</ul>
			</view>
		</view>
		<rf-back-top :scrollTop="scrollTop"></rf-back-top>
	</view>
</template>

<script>
	import rfSearchBar from '@/components/rf-search-bar-xiangmu';
	import PageMenu from '../dom/pageMenu';
	 import {getBaseProjectEvaluationReportInfos} from "@/api/financialService/baseProjectEvaluationReportInfo";

	export default {
		components: {
			rfSearchBar,
			PageMenu
		},
		data() {
			return {
				scrollTop: 0,
				Analysis:[
					{
						id:1,
						title:"common.AnalysisOfEconomic",
						label:"common.SocialEnvironment"
					},
					{
						id:2,
						title:'common.EnergyAndElectricity',
						label:'common.EnergyProduct'
					},
					{
						id:3,
						title:'common.socialBenefitAnalysis',
						label:'common.SocialBenefit'
					},
					{
						id:4,
						title:'common.economicBenefitAnalysis',
						label:'common.EnergyAndPower'
					}

				],
				progectReport:[],
				reportList:[],
				params:{
					language:'',
					statusDict:'2'
				},
			}
		},
		async onShow(){
			this.getInitData()
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		methods: {
			back() {
				uni.navigateBack();
			},
			gopage(path,item){
				uni.navigateTo({
					url:'/pages/financialService/'+path +'?key='+item.baseEntityId
				})
			},
			//搜索
			navToSearch(keyword){
				uni.navigateTo({
					url:'/pages/index/search/search?data='+keyword
				})
			},
			goproject(src,data){
				this.$mRouter.push({
					route: src + '?id=' + data
				});
			},
			async getInitData(){
				let params = {
					language:this.$i18n.locale.toUpperCase(),		 
					statusDict:'2'
				}
				const res = await this.$myRequest({
					url: '/project/baseProjectEvaluationReportInfos/',
					data: params
				})
				// let res = await getBaseProjectEvaluationReportInfos(params);
				if(res.data){
					this.reportList = res.data.baseProjectEvaluationReportInfos;
				}
			},
			i18n(data) {
				return this.$t('common.' + data);
			},
		}
	}
</script>

<style lang="scss" scoped>
	
	.rf-category {
		// background-color: $color-white;
		
		color: #666666;
		// margin-top: calc(20upx + var(--status-bar-height));
		.icoStyle {
			display:flex;
			align-items:center;
			.leftArrow {
				/*  #ifdef  APP-PLUS  */
				padding-top: calc(28upx + var(--status-bar-height));
				/*  #endif  */
				.text{
					color:#fff;
				}
			}
		}
		.desc{
			background-color: #ffffff;
			padding: 20upx 40upx;
			.descList{
				ul{
					margin-left: -80upx;
					margin-top: 40upx;
					
					width: 100%;
					li{
						list-style: none;
						margin-bottom: 44upx;
					}
				}
			}
		}
	
	}
	.analyBox{
		background-color: #ffffff;
		margin-top: 20upx;
		padding: 20upx 40upx;
		color: #666666;
		.analyList{
			width: 100%;
			margin-bottom: 30upx;
		}
	}
	.reportBox{
		margin-top: 20upx;
		padding: 20upx 40upx;
		background-color: #ffffff;
		.reportTitle{
			font-size: 30upx;
			font-weight: 600;
			text-align: center;
			color: #666666;
		}
		.reportList{
			
			ul{
				margin-top: 40upx;
				height: 186upx;
				padding: 0;
				line-height: 98upx;
				font-size: 24upx;
				color: #4F81BD;
				font-weight: 700;
				border: 2upx solid #0091FF;
				border-radius: 40upx;
				.reportName{
					 border-bottom: 2upx solid rgba(0,145,255,.5);
					 color: #666666;
					 font-size: 30upx;

				}
				li{
					height: 50%;
					list-style: none;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
					.iconMark{
						 width:50upx;
						 height: 50upx;
						 float: left;
						 margin: 22upx 40upx 0 20upx;
					}
					
				}
			}
		}
	}
	.iconBox{
		width: 40upx;
		height: 40upx;
		border: 1px solid #6784AB;
		border-radius: 100upx;
		display: inline-block;
		float:left;
		text-align: center;
		line-height: 50upx;
	}
</style>