dev/dcp-app-gate/pages/nationalregionalCommissions/nationalregionalCountryDetails.vue

<template>
	<view>
		<u-navbar :back-text="i18n('Back')" :back-text-style="backStyle" back-icon-color="#fff" title-color="#fff"
			:title="i18n(PersonnelProfile)" :background="background">
		</u-navbar>
		<view class="">
			<!-- 机构轮播 -->
			<view class="uni-padding-wrap" v-if="PersonnelProfile !== 'PersonnelProfile'">
				<view class="page-section swiper">
					<view class="page-section-spacing">
						<swiper class="swiper" :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval"
							:duration="duration" circular="true">
							<swiper-item v-if="ifFlog.length>0" v-for="(i,index) in ifFlog">
								<view class="swiper-item uni-bg-red" v-if="ifFlog.length>0">
									<image :src="websiteUrl + i.pictureUrl" alt="" class="introduceItemImg"
										style="width: 750upx;height: 300upx;"></image>
								</view>

							</swiper-item>
							<swiper-item v-if="ifFlog.length == 0">
								<view class="swiper-item uni-bg-red">
									<image :src="websiteUrl + '/def/def1.png'" alt=""
										style="width: 750upx;height: 300upx;"></image>
								</view>
							</swiper-item>
						</swiper>
					</view>
				</view>

			</view>
			<!-- 人员简介 -->
			<view class="" v-if="PersonnelProfile == 'PersonnelProfile'">
				<image v-if="committeeShowMessageInfo.spareTwo" :src="websiteUrl + committeeShowMessageInfo.spareTwo"
					alt="" style="width: 750upx;height: 300upx;"></image>
				<image v-if="!committeeShowMessageInfo.spareTwo" src="@/static/img/nationaIntroductionList/user.png"
					alt="" style="width: 750upx;height: 300upx;"></image>
			</view>

			<!-- 机构详情 -->
			<view class="" style="margin: 0 30upx;line-height: 50upx;">
				<view class="title">
					{{committeeShowMessageInfo.name}}
				</view>
				<view class="" v-if="committeeShowMessageInfo.correlationType == 'c'">
					<view class="details">
						{{i18n('place')}}：{{committeeShowMessageInfo.country}}
					</view>
					<view class="details">
						{{i18n('DateOfEstablishment')}}：{{committeeShowMessageInfo.registeredTime?committeeShowMessageInfo.registeredTime:''}}
					</view>
					<view class="details">
						{{i18n('LegalRepresentative')}}：{{committeeShowMessageInfo.corporateName?committeeShowMessageInfo.corporateName:''}}
					</view>
					<view class="details">
						{{i18n('OfficialEmail')}}：{{committeeShowMessageInfo.officialEmail?committeeShowMessageInfo.officialEmail:''}}
					</view>
					<view class="details">
						{{i18n('OfficialWebsite')}}：
						<a :href="committeeShowMessageInfo.officialWebsitePath && committeeShowMessageInfo.officialWebsitePath.indexOf('http') == -1?'http://' + committeeShowMessageInfo.officialWebsitePath :committeeShowMessageInfo.officialWebsitePath"
							class="a-style">
							{{committeeShowMessageInfo.officialWebsitePath?committeeShowMessageInfo.officialWebsitePath:''}}
						</a>

					</view>
					<view>
						<text style="color: #666;">{{i18n('intro')}}：</text>
						<text style="color: #333;display: inline-block;">{{committeeShowMessageInfo.unitProfile}}</text>
					</view>
				</view>
				<view class="details" v-if="committeeShowMessageInfo.correlationType == 'p'">
					{{committeeShowMessageInfo.spareOne}}
				</view>

				<view v-for="(item,index) in initList" v-if="initList">
					<view class="enterprise_style">
						<view class="jianjie">
							<text style="display: inline-block;width: 10upx;height: 30upx;
								background-color: #6DD400;vertical-align: middle;margin-right: 10upx;"></text>
							{{item.title}}
						</view>
					</view>
					<view class="" v-if="item.pictureUrl">
						<image :src="websiteUrl + item.pictureUrl" alt="" style="width: 750upx;height: 300upx;"></image>
					</view>
					<view :style="item.picturePosition == 'left'?'text-indent: 2em;float:right':'float:left'"
						class="nomale" v-html="item.contentHtml">
					</view>


					<view style="clear:both"></view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				background: {
					backgroundImage: 'linear-gradient(270deg, #4BC0E2 0%, #538BE7 100%)',
				},
				backStyle: {
					color: '#fff'
				},
				committeeShowMessageInfo: {},
				id: null,
				PersonnelProfile: null,
				ifFlog: [],
				initList: [],
			};
		},
		onShow() {
			this.getList();
		},
		onLoad(options) {
			this.id = options.id;
		},
		methods: {
			async getList() {
				let list = {
					entityId: this.id,
					language: this.$i18n.locale.toUpperCase(),
				};
				const res = await this.$myRequest({
					url: '/project/committeeShowMessageInfos/getShowMessageInfoDetail',
					data: list,
				});
				let page = {
					businessType: "organizational_structure",
					businessId: this.id,
					language: this.$i18n.locale.toUpperCase()
				};
				const info = await this.$myRequest({
					url: '/cms/cmsInformationViews/getInformationList/',
					data: page,
				});
				this.initList = info.data.allDataList;
				this.ifFlog = this.initList.filter(item => {
					return item.pictureUrl
				});
				this.committeeShowMessageInfo = res.data.committeeShowMessageInfo;

				this.committeeShowMessageInfo.correlationType == 'P' ? this.PersonnelProfile = 'PersonnelProfile' :
					this.PersonnelProfile = 'OrganizationProfile'
			},

			i18n(data) {
				return this.$t('common.' + data);
			},
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #fff;
	}

	.title {
		margin-top: 15upx;
		line-height: 50upx;
		font-weight: 700;
		font-size: 30upx;
	}

	.details {
		line-height: 50upx;
	}
</style>