<template>
	<view class="ywjg_list">
		<view v-for="(item,index) in ywjg" :key="index">
			<view style="margin: 25rpx 20rpx; color: #2B2B2B; font-size: 28rpx; font-weight: bold;">
				{{item.title}}
			</view>
			<view v-if="index == 0" v-for="(child, row) in item.list" :key="row" class="ywjg_item_1">
				<view style="display: flex; align-items: center;">
					<view style="font-size: 28rpx; font-weight: bold; margin-right: 10rpx;">
						{{child.title}}
					</view>
					<view v-if="child.is_hexin"
						style="background-color: #F2C369; border-radius: 5rpx; font-size: 20rpx; padding: 0 5rpx;">
						核心业务</view>
				</view>
				<view style="display: flex; align-items: center; justify-content: space-between; font-weight: 500;">
					<view style="display: flex; align-items: center; color: #F2C369; font-size: 20rpx;">
						<view style="border: 1rpx solid #F2C369; border-radius: 5rpx; padding: 0 5rpx;">
							营收占比:{{child.yszb}}%</view>
						<view
							style="border: 1rpx solid #F2C369; border-radius: 5rpx; padding: 0 5rpx; margin-left: 10rpx;">
							毛利率:{{child.mlv}}%</view>
					</view>
					<view>
						<view style="color: #999999; font-size: 24rpx;">营业收入</view>
						<view style="font-weight: bold; font-size: 30rpx; color: #BB8520; margin-top: 10rpx;">
							{{child.yysr > 10000 ? child.yysr / 10000 + '亿' : child.yysr + '万'}}元
						</view>
					</view>
				</view>
				<view style="display: flex;">
					<view
						style="color: white; display: flex; align-items: center; justify-content: center; padding: 5rpx 10rpx;font-size: 20rpx; border-radius: 5rpx;"
						:style="{backgroundColor: child.zz > 0 ? '#EC3440' : '#345423'}">增长:
						{{child.zz > 0 ? '+' + child.zz : child.zz}}%
					</view>
				</view>
			</view>
			<view v-else style="font-weight: 500;">
				<view v-for="(child,row) in item.list" :key="row"
					style="background-color: #FAFAFC; color: #2B2B2B; font-size: 22rpx; margin: 20rpx; background-color: #FAFAFC; border-radius: 10rpx; padding: 25rpx 20rpx;">
					<view style="font-size: 24rpx;">{{child.title}}</view>
					<view v-for="(model, j) in child.list" :key="j">
						<view style="color: #BB8520; font-weight: bold; margin: 10rpx 0;">{{model.title}}</view>
						<view style="color: #71675D;">{{model.info}}</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "ywjg-view",
		data() {
			return {
				ywjg: [{
						title: '业务结构分析',
						list: [{
							title: '零售业务',
							is_hexin: 1,
							yszb: 55.16,
							mlv: 78.21,
							yysr: 17900,
							zz: -8.20
						}, {
							title: '科技金融',
							is_hexin: 1,
							yszb: 41.121,
							mlv: 89.11,
							yysr: 13400,
							zz: 24.60
						}, {
							title: '绿色金融',
							is_hexin: 0,
							yszb: 2.37,
							mlv: 9.11,
							yysr: 771,
							zz: 36.90
						}, {
							title: '零售业务',
							is_hexin: 0,
							yszb: 2.37,
							mlv: 9.11,
							yysr: 396,
							zz: -16.90
						}]
					},
					{
						title: '业务板块详情',
						list: [{
								title: '零售银行业务',
								list: [{
										title: '业务描述',
										info: '平安银行对公业务践行'
									},
									{
										title: '竞争地位',
										info: '平安银行零售业务在同行业中保持较强竞争力，凭借其数字化创新优势和综合金融背景，构建了差异化竞争优势。'
									},
									{
										title: '未来潜力',
										info: '平安银行零售业务未来发展潜力巨大，随着中国财富管理市场的快速扩张和中产阶级规模的持续增长，零售银行...展开查看'
									}
								]
							}, {
								title: '对公业务',
								list: [{
										title: '业务描述',
										info: '平安银行对公业务践行'
									},
									{
										title: '竞争地位',
										info: '平安银行对公业务在市场中保持较强竞争力，贷款规模实现两位数增长，远高于行业平均水平。通过差异化战略...展开查看'
									},
									{
										title: '未来潜力',
										info: '随着国家对科创、绿色经济的持续支持，以及对普惠金融的政策倾斜，平安银行对公业务面临广阔发展空间...展开查看'
									}
								]
							},
							{
								title: '同业业务',
								list: [{
										title: '业务描述',
										info: '平安银行同业业务主要包括债券交易、同业拆借、票据业务等。'
									},
									{
										title: '竞争地位',
										info: '平安银行同业业务在股份制银行中位居前列，债券交易市场份额达4.4%，显示出较强的市场竞争力。'
									},
									{
										title: '未来潜力',
										info: '随着金融市场深化改革和利率市场化推进，同业业务面临新的发展机遇。平安银行同业业务凭借其债券...展开查看'
									}
								]
							},
							{
								title: '普惠金融',
								list: [{
										title: '业务描述',
										info: '普惠金融是平安银行'
									},
									{
										title: '竞争地位',
										info: '平安银行普惠金融业务在行业内保持领先地位，小微企业贷款规模较大且客户基础广泛。通过优化产品体系、提...展开查看'
									},
									{
										title: '未来潜力',
										info: '随着国家持续推动普惠金融发展战略，平安银行该业务具有广阔发展空间。通过数字化转型深化、客户体验...展开查看'
									}
								]
							}
						]
					}
				]
			};
		}
	}
</script>

<style lang="less">
	.ywjg_list {
		color: #2B2B2B;

		.title {
			font-size: 28rpx;
			font-weight: bold;
		}

		.ywjg_item_1 {
			font-weight: 500;
			margin: 20rpx;
			background-color: #FAFAFC;
			border-radius: 10rpx;
			padding: 25rpx 20rpx;
			box-sizing: border-box;
		}
	}
</style>