<template>
	<view class="rf-category woldKeep">
		<u-navbar  :back-text-style="backStyle"
			back-icon-color="#fff" title-color="#fff" 
			:title="i18n('FundIdeasDetails')" 
			:background="background">
			<view slot="right" style="margin-right:20upx" >
				<u-icon  name="share-fill" style="margin-right: 30upx;" color="white" size="50"  @click="share"></u-icon>
			</view>
		</u-navbar>
		<view  style="padding: 0 40upx;background-color: #fff;">
			<view style="font-size: 44upx;text-align: center;">{{FundList.title}}</view>
			<view style="margin-top: 40upx;font-size: 26upx;">{{FundList.subtitle}}</view>
			<view class="imgBox"  style="margin-top: 40upx;width: 100%;" v-html="FundList.introductionMobile"></view>
		</view>
		<!-- 8.8.20.112:19001 -->
		<share v-show="ifShare == true"
		:show="ifShare" 
		@closeShare = "share"
		:title="i18n('FundIdeasDetails')" 
		:summary="FundList.title"
		:href="'https://m.geidcp.com/#/pages/financialService/financialFundIdeas/fundIdeasDetailsTwo?' + 'key=' + baseEntityId + '&language=' + $i18n.locale"
		imageUrl="'https://m.geidcp.com/api/file/pub/defaultCutPic/shareLogo.png'"
		>
		</share>
		<!-- #ifdef H5 -->
			<rf-back-home></rf-back-home>
		<!-- #endif -->
	</view>
</template>

<script>
	import {getBaseFundIdeasInfos} from '@/api/financialService/baseFundIdeasInfo'
	import share  from '@/components/share'
	export default {
		components:{
			share
		},
		data() {
			return {
				background:{
					backgroundImage: 'linear-gradient(270deg, #4BC0E2 0%, #538BE7 100%)',
				},
				backStyle:{
					color:'#fff'
				},
				ifShare:false,
				baseEntityId:null,
				FundList:{},
				mark:[
					{
						id:1,
						name:"common.GreenDevelopmentFund",
						label:'common.Development1'
					},
					{
						id:2,
						name:"common.GreenInnovationFund",
						label:'common.Innovation1'
					},
					{
						id:3,
						name:"common.GreenConstructionFund",
						label:'common.Construction1'
					},
				],
			}
		},
		onLoad(data) {
			console.log(data);
			this.baseEntityId = data.key;
			if(option.language){
				uni.setStorageSync("language", option.language);
				this._i18n.locale = option.language;
			}
		},
		onShow() {
			this.getData()
		},
		methods: {
			share(){
				this.ifShare = !this.ifShare;
			},
			i18n (data) {
			    return this.$t('common.'+data);
			},
			async getData(){
				let params = {
					pageSize:"5",
					pageNo:"1",
					language:this.$i18n.locale.toUpperCase(),
					baseEntityId:this.baseEntityId,
					statusDict:'2',
					source: 'mobile',
				}
				const res = await this.$myRequest({
					url: '/project/baseFundIdeasInfos/',
					data: {
						...params
					}
				});
				// let res = await getBaseFundIdeasInfos(params);
			
				if(res.data){
					this.FundList = res.data.baseFundIdeasInfos[0];
					
				}
				
			},
			i18n (data) {
			    return this.$t('common.'+data);
			},
		
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #fff;
	}
	.rf-category {
		height: 100%;
		background-color: $color-white;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		/*  #ifdef  APP-PLUS  */
		// margin-top: calc(20upx + var(--status-bar-height));
		/*  #endif  */
		.markBox{
			 width: 263upx;
			 height: 47upx;
			 background: #597FB7;
			 color: #fff;
			 text-align: center;
			 border-radius: 100upx;
			 font-size: 28upx;
			 line-height: 47upx;
			 margin-bottom: 20upx;
		}
		/deep/.imgBox p img{
			width: 100%;
		}
			
		
	}
	.woldKeep /deep/ img,.woldKeep /deep/ p, {
		max-width: 680upx;
	}
	.woldKeep /deep/ p {
		max-width: 680upx;
		word-break: break-all;
	}
	// .barBox{
	// 	background-image: linear-gradient(270deg, rgb(75, 192, 226) 0%, rgb(83, 139, 231) 100%);
	// }
</style>
