<template>
	<view class="container">
		<uni-nav-bar v-if="isMobieDevice" :fixed="true" style="width: 100%" backgroundColor="#B60001" color="#fff"
			:statusBar="true" :border="false" :title="$t('index.company-base-info')" left-icon="left"
			@clickLeft="onClickLeft"></uni-nav-bar>
		<!-- 	<view class="title-box">
			
						<view class="message-box">
				<image class="picture" mode="aspectFill" :src="userInfo.picture"></image>
				<view class="message">
					<text class="name">{{userInfo.customerName}}</text>
					<view class="phone">{{userInfo.contactPhone}}</view>
					<view class="phone">{{userInfo.mailbox}}</view>
				</view>
			</view>
		</view> -->
		<uni-list-item :height="55">
			<template #header>
				<view style="color: #bbb;">{{$t('index.base-info')}}</view>
			</template>
		</uni-list-item>
		<view class="list-box custom-uni-list">
			<uni-list>
				<uni-list-item :height="55" :title="$t('index.company-code')" :rightText="userInfo.customerCode" />
				<uni-list-item :height="55" :title="$t('index.company-name')" :rightText="userInfo.customerName" />
				<uni-list-item :height="55" :title="$t('index.legal-person-name')" :rightText="userInfo.legalName" />
				<uni-list-item :height="55" :title="$t('index.legal-person-code')" :rightText="userInfo.legalIdName" />
				<uni-list-item :height="55" :title="$t('index.contact-name')" :rightText="userInfo.contactName" />
				<uni-list-item :height="55" :title="$t('index.credit-code')" :rightText="userInfo.creditCode" />
				<uni-list-item :height="55" :title="$t('index.register-sum')" :rightText="userInfo.registeredCapital" />
				<uni-list-item :height="55" :title="$t('index.register-region')"
					:rightText="userInfo.registryAddress" />
				<uni-list-item :height="55" :title="$t('index.create-time')" :rightText="userInfo.foundDate" />
				<uni-list-item :height="55" :title="$t('index.email')" :rightText="userInfo.postal" />
			</uni-list>
		</view>
	</view>
</template>

<script>
	import {
		getOneself
	} from '@/config/api.js'
	import serverConfig from '@/config/server_config.js'
	export default {
		data() {
			return {
				userInfo: {},
				isMobieDevice: getApp().globalData.isMobieDevice
			}
		},
		methods: {
			onClickLeft() {
				uni.navigateBack({
					delta: 1
				});
			},
			getUserInfo() {
				getOneself().then(res => {
					if (res.success) {
						let {
							customerCode,
							customerName,
							legalName,
							legalIdName,
							contactName,
							contactPhone,
							creditCode,
							registeredCapital,
							registryAddress,
							foundDate,
							logoUrl,
							postal,
							mailbox
						} = res.content
						this.userInfo = {
							customerCode,
							customerName,
							legalName,
							legalIdName,
							contactName,
							contactPhone,
							creditCode,
							registeredCapital,
							registryAddress,
							foundDate,
							postal,
							mailbox,
							picture: `${serverConfig.baseURL}/api/file/file/download/viewPdfById?fileId=${logoUrl}`
						}
					}
				})
			}
		},
		onLoad() {
			this.getUserInfo()
		}
	}
</script>

<style lang="scss" scoped>
	.title-box {
		box-sizing: border-box;
		position: relative;
		width: 100%;
		height: 474rpx;

		/deep/ .uni-nav-bar-text {
			font-size: 16px;
		}

		.mine-bg {
			position: absolute;
			width: 100%;
			height: 474rpx;
			top: 0;
			left: 0;
			z-index: -1;
		}

		.message-box {
			box-sizing: border-box;
			overflow: hidden;
			padding-top: 70rpx;
			display: flex;
			justify-content: center;
			align-items: center;

			.picture {
				width: 160rpx;
				height: 160rpx;
				border-radius: 50%;
			}

			.message {
				margin-left: 30rpx;
				display: flex;
				flex-direction: column;

				.name {
					font-size: 32rpx;
					color: #FFFFFF;
					line-height: 1;
				}

				.phone {
					font-size: 12px;
					color: #FFFFFF;
					margin-top: 20rpx;
					line-height: 1;
				}
			}
		}
	}

	.list-box {
		margin-top: 10px;
		// padding: 0 30rpx;
		background-color: #FFFFFF;
	}
</style>