Merge branch 'main' of http://git.zihai.cn/szj1219/JiaZhiQianYan-MiniProgram
This commit is contained in:
renzhijun
@@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<view class="cyl_view">
|
||||
<view class="top">
|
||||
<view class="top flex">
|
||||
<view class="child_1">产业链分析</view>
|
||||
<view class="child_2">目标公司供应链图谱</view>
|
||||
<view class="child_3">节点 18</view>
|
||||
<view class="child_3">节点 {{totalNodes}}</view>
|
||||
</view>
|
||||
<view class="center">
|
||||
<view class="child" :class="{action: center_index == 0}" @click="changeCenterIndex(0)">
|
||||
@@ -14,53 +14,75 @@
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom">
|
||||
<view class="type">
|
||||
<view v-for="(item,index) in types" :key="index" class="item">
|
||||
<template v-if="item.title">
|
||||
<view @click="typeIndex = index"
|
||||
style="display: flex; flex-direction: column; align-items: center; justify-content: center; background-color: #FAFAFC; border-radius: 10rpx; width: 100%; padding: 26rpx 0; box-sizing: border-box;"
|
||||
:style="{'background-color' : (typeIndex == index ? item.backColor : '#FAFAFC'), border : (typeIndex == index ? `1rpx solid ${item.color}` : 'none')}">
|
||||
<view style="color: #2B2B2B; font-size: 24rpx; font-weight: bold;">
|
||||
{{item.title}}
|
||||
<text
|
||||
style="min-width: 24rpx; text-align: center; margin-left: 6rpx; padding: 0 5rpx; border-radius: 5rpx; font-weight: 500;"
|
||||
:style="{'background-color' : (typeIndex == index ? item.color : '#F2C369'), 'color' : (typeIndex == index ? '#ffffff' : '#070707')}">
|
||||
{{item.count}}
|
||||
</text>
|
||||
</view>
|
||||
<view style="color: #999999; font-size: 22rpx; font-weight: 500; margin-top: 10rpx;">
|
||||
{{item.desc}}
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<template v-else>
|
||||
<image style="width: 100%; height: auto;" src="/pagesStock/static/icon/rightArrow.png"
|
||||
mode="widthFix"></image>
|
||||
</template>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list" @click="clickAction"
|
||||
style="margin: 20rpx; background-color: #FAFAFC; border-radius: 10rpx; padding: 25rpx 20rpx; box-sizing: border-box;">
|
||||
<view style="color: #2B2B2B; font-size: 28rpx; font-weight: bold;">央行/政策性银行</view>
|
||||
<view style="color: #999999; font-size: 24rpx; font-weight: 500;">提供再贷款、再贴现、同业存放等基础货币与流动性支持</view>
|
||||
<view style="display: flex; align-items: center; font-size: 20rpx; font-weight: 500; margin: 15rpx 0;">
|
||||
<view style="border-radius: 5rpx; padding: 0 10rpx; margin-right: 10rpx;"
|
||||
:style="{'background-color' : (types[typeIndex].backColor), 'color' : (types[typeIndex].color)}">
|
||||
Supplier</view>
|
||||
<view style="border-radius: 5rpx; padding: 0 10rpx;"
|
||||
:style="{'color' : types[typeIndex].color, border : `1rpx solid ${types[typeIndex].color}`}">份额:
|
||||
12.5%</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center;">
|
||||
<view style="color: #71675D; font-size: 22rpx; font-weight: 500;">影响度</view>
|
||||
<view
|
||||
style="flex: 1; height: 10rpx; background-color: #EFEFEF; border-radius: 5rpx; margin: 0 15rpx; overflow: hidden;">
|
||||
<view style="height: 100%; border-radius: 5rpx;"
|
||||
:style="{width: `${95}%`, background: `linear-gradient(to right, ${types[typeIndex].sColor}, ${types[typeIndex].color})`}">
|
||||
<view class="type flex">
|
||||
<view v-for="(item,index) in types" :key="index" class="item flex flex1">
|
||||
<view :class="'contentC flexColumnCenter flex1 '+(typeIndex==index?item.type:'')" @click="typeIndex = index">
|
||||
<view class="titleNumC">
|
||||
{{item.title}}
|
||||
<text :class="'num '+(typeIndex==index?item.type:'')">{{item.count}}</text>
|
||||
</view>
|
||||
<view class="des">{{item.desc}}</view>
|
||||
</view>
|
||||
<view style="color: #71675D; font-size: 24rpx; font-weight: 500;">95</view>
|
||||
<image v-if="index!=types.length-1" class="arrow" src="/pagesStock/static/icon/rightArrow.png"
|
||||
mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list">
|
||||
<block v-if="typeIndex==0">
|
||||
<!-- 上游供应链 -->
|
||||
<view class="item" v-for="(item,index) in upstreamList" :key="index" @click="clickAction(item)">
|
||||
<view class="title">{{item.node_name}}</view>
|
||||
<view class="des">{{item.node_description}}</view>
|
||||
<view class="labelC flex">
|
||||
<view class="label upstream type">{{item.node_type}}</view>
|
||||
<view class="label upstream market">份额:{{item.market_share}}%</view>
|
||||
</view>
|
||||
<view class="importanceC flex">
|
||||
<view class="title">影响度</view>
|
||||
<view class="progressBgC flex1">
|
||||
<view class="progress upstream" :style="{width: `${item.importance_score}%`}">
|
||||
</view>
|
||||
</view>
|
||||
<view class="value">{{item.importance_score}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<block v-if="typeIndex==1">
|
||||
<!-- 核心企业 -->
|
||||
<view class="item" v-for="(item,index) in coreEnterpriseList" :key="index" @click="clickAction(item)">
|
||||
<view class="title">{{item.node_name}}</view>
|
||||
<view class="des">{{item.node_description}}</view>
|
||||
<view class="labelC flex">
|
||||
<view class="label core type">{{item.node_type}}</view>
|
||||
<view class="label core market">份额:{{item.market_share}}%</view>
|
||||
</view>
|
||||
<view class="importanceC flex">
|
||||
<view class="title">影响度</view>
|
||||
<view class="progressBgC flex1">
|
||||
<view class="progress core" :style="{width: `${item.importance_score}%`}"></view>
|
||||
</view>
|
||||
<view class="value">{{item.importance_score}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<block v-if="typeIndex==2">
|
||||
<!-- 下游客户 -->
|
||||
<view class="item" v-for="(item,index) in downstreamList" :key="index" @click="clickAction(item)">
|
||||
<view class="title">{{item.node_name}}</view>
|
||||
<view class="des">{{item.node_description}}</view>
|
||||
<view class="labelC flex">
|
||||
<view class="label downstream type">{{item.node_type}}</view>
|
||||
<view class="label downstream market">份额:{{item.market_share}}%</view>
|
||||
</view>
|
||||
<view class="importanceC flex">
|
||||
<view class="title">影响度</view>
|
||||
<view class="progressBgC flex1">
|
||||
<view class="progress downstream" :style="{width: `${item.importance_score}%`}"></view>
|
||||
</view>
|
||||
<view class="value">{{item.importance_score}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -75,41 +97,48 @@
|
||||
center_index: 0,
|
||||
types: [{
|
||||
title: '上游供应链',
|
||||
count: 5,
|
||||
count: 0,
|
||||
desc: '原材料与供应商',
|
||||
sColor: '#FF8C53',
|
||||
color: '#FF5501',
|
||||
backColor: '#FFF4EF'
|
||||
type:'upstream'
|
||||
},
|
||||
{},
|
||||
{
|
||||
title: '核心企业',
|
||||
count: 1,
|
||||
count: 0,
|
||||
desc: '公司主体与产品',
|
||||
sColor: '#518BFF',
|
||||
color: '#175CE6',
|
||||
backColor: '#F2F6FD'
|
||||
type:'core'
|
||||
},
|
||||
{},
|
||||
{
|
||||
title: '下游客户',
|
||||
count: 12,
|
||||
desc: '原材料与供应商',
|
||||
sColor: '#48D394',
|
||||
color: '#1DB26F',
|
||||
backColor: '#E7F5F0'
|
||||
count: 0,
|
||||
desc: '客户与终端市场',
|
||||
type:'downstream'
|
||||
}
|
||||
],
|
||||
typeIndex: 0
|
||||
typeIndex: 0,
|
||||
|
||||
};
|
||||
},
|
||||
props:{
|
||||
valueChainAnalysisInfo:Object,
|
||||
upstreamList:Array, //上游供应链
|
||||
coreEnterpriseList:Array, //核心企业
|
||||
downstreamList:Array, //下游客户
|
||||
totalNodes:Number, //总节点数
|
||||
},
|
||||
watch:{
|
||||
valueChainAnalysisInfo(newValue)
|
||||
{
|
||||
this.types[0].count = newValue.upstream_nodes
|
||||
this.types[1].count = newValue.company_nodes
|
||||
this.types[2].count = newValue.downstream_nodes
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changeCenterIndex(index) {
|
||||
this.center_index = index
|
||||
},
|
||||
clickAction() {
|
||||
console.log(123);
|
||||
this.$emit('detail')
|
||||
clickAction(item) {
|
||||
this.$emit('detail',item)
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -118,13 +147,9 @@
|
||||
<style lang="less">
|
||||
.cyl_view {
|
||||
padding: 20rpx;
|
||||
box-sizing: border-box;
|
||||
|
||||
.top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-weight: 500;
|
||||
|
||||
.child_1 {
|
||||
color: #2B2B2B;
|
||||
font-size: 28rpx;
|
||||
@@ -172,16 +197,192 @@
|
||||
|
||||
.bottom {
|
||||
.type {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 19rpx 1fr 19rpx 1fr;
|
||||
gap: 6rpx;
|
||||
|
||||
.item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.item {
|
||||
border-radius: 10rpx;
|
||||
width: 100%;
|
||||
padding: 26rpx 0;
|
||||
.contentC
|
||||
{
|
||||
background-color: #FAFAFC;
|
||||
justify-content: center;
|
||||
height: 120rpx;
|
||||
border-radius: 10rpx;
|
||||
.titleNumC
|
||||
{
|
||||
font-size: 24rpx;
|
||||
font-weight: bold;
|
||||
color: #2B2B2B;
|
||||
.num
|
||||
{
|
||||
background-color: #F2C369;
|
||||
margin-left: 6rpx;
|
||||
padding: 0 5rpx;
|
||||
min-width: 24rpx;
|
||||
border-radius: 5rpx;
|
||||
font-weight: 500;
|
||||
text-align: center;
|
||||
}
|
||||
.num.upstream
|
||||
{
|
||||
background-color: #FF5501;
|
||||
color: white;
|
||||
}
|
||||
.num.core
|
||||
{
|
||||
background-color: #175CE6;
|
||||
color: white;
|
||||
}
|
||||
.num.downstream
|
||||
{
|
||||
background-color: #1DB26F;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
.des
|
||||
{
|
||||
margin-top: 10rpx;
|
||||
font-size: 22rpx;
|
||||
font-weight: 500;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
.contentC.upstream
|
||||
{
|
||||
background-color: #FFF4EF;
|
||||
border: solid 1rpx #FF5501;
|
||||
}
|
||||
.contentC.core
|
||||
{
|
||||
background-color: #F2F6FD;
|
||||
border: solid 1rpx #175CE6;
|
||||
}
|
||||
.contentC.downstream
|
||||
{
|
||||
background-color: #E7F5F0;
|
||||
border: solid 1rpx #1DB26F;
|
||||
}
|
||||
|
||||
.arrow
|
||||
{
|
||||
margin: 0 6rpx;
|
||||
width: 19rpx;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.list
|
||||
{
|
||||
margin-top: 20rpx;
|
||||
.item
|
||||
{
|
||||
background-color: #FAFAFC;
|
||||
margin-bottom: 20rpx;
|
||||
border-radius: 10rpx;
|
||||
padding: 25rpx 20rpx;
|
||||
.title
|
||||
{
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #2B2B2B;
|
||||
}
|
||||
.des
|
||||
{
|
||||
margin-top: 10rpx;
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
color: #999999;
|
||||
}
|
||||
.labelC
|
||||
{
|
||||
margin-top: 10rpx;
|
||||
.label
|
||||
{
|
||||
margin-right: 10rpx;
|
||||
padding: 0 10rpx;
|
||||
line-height: 30rpx;
|
||||
border-radius: 5rpx;
|
||||
font-size: 20rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
.label.upstream
|
||||
{
|
||||
color: #FF5501;
|
||||
}
|
||||
.label.upstream.type
|
||||
{
|
||||
background-color: #FFF4EF;
|
||||
}
|
||||
.label.upstream.market
|
||||
{
|
||||
border: solid 1rpx #FF5501;
|
||||
}
|
||||
.label.core
|
||||
{
|
||||
color: #175CE6;
|
||||
}
|
||||
.label.core.type
|
||||
{
|
||||
background-color: #EDF2FD;
|
||||
}
|
||||
.label.core.market
|
||||
{
|
||||
border: solid 1rpx #175CE6;
|
||||
}
|
||||
.label.downstream
|
||||
{
|
||||
color: #1DB26F;
|
||||
}
|
||||
.label.downstream.type
|
||||
{
|
||||
background-color: #E7F5F0;
|
||||
}
|
||||
.label.downstream.market
|
||||
{
|
||||
border: solid 1rpx #1DB26F;
|
||||
}
|
||||
}
|
||||
.importanceC
|
||||
{
|
||||
margin-top: 20rpx;
|
||||
.title
|
||||
{
|
||||
font-size: 22rpx;
|
||||
font-weight: 500;
|
||||
color: #71675D;
|
||||
}
|
||||
.progressBgC
|
||||
{
|
||||
background-color: #EFEFEF;
|
||||
height: 10rpx;
|
||||
border-radius: 5rpx;
|
||||
margin: 0 15rpx;
|
||||
.progress
|
||||
{
|
||||
height: 100%;
|
||||
border-radius: 5rpx;
|
||||
}
|
||||
.progress.upstream
|
||||
{
|
||||
background: linear-gradient(90deg, #FF8C53 0%, #FF5501 100%);
|
||||
}
|
||||
.progress.core
|
||||
{
|
||||
background: linear-gradient(90deg, #518BFF 0%, #175CE6 100%);
|
||||
}
|
||||
.progress.downstream
|
||||
{
|
||||
background: linear-gradient(90deg, #48D394 0%, #1DB26F 100%);
|
||||
}
|
||||
}
|
||||
.value
|
||||
{
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
color: #71675D;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
126
components/fzjg-view/fzjg-view.vue
Normal file
126
components/fzjg-view/fzjg-view.vue
Normal file
@@ -0,0 +1,126 @@
|
||||
<template>
|
||||
<view class="branchList">
|
||||
<view class="item" v-for="(item,index) in branchList" :key="index">
|
||||
<view class="titleStatusC flex">
|
||||
<view class="title flex1">{{item.branch_name}}</view>
|
||||
<view :class="'statusC flex '+(item.business_status=='注销'?'logOff':'exist')">
|
||||
<image v-if="item.business_status=='注销'" class="icon" src="/pagesStock/static/icon/logOffStatus.png" mode="widthFix">
|
||||
</image>
|
||||
<image v-else class="icon" src="/pagesStock/static/icon/existStatus.png" mode="widthFix"></image>
|
||||
<view>{{item.business_status}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="infoC topInfo flex">
|
||||
<view class="infoItem leftInfo flex flex1">
|
||||
<view class="title">注册资本</view>
|
||||
<view class="content flex1">{{item.register_capital}}</view>
|
||||
</view>
|
||||
<view class="infoItem rightInfo flex flex1">
|
||||
<view class="title">法人代表</view>
|
||||
<view class="content flex1">{{item.legal_person}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="infoC flex">
|
||||
<view class="infoItem leftInfo flex flex1">
|
||||
<view class="title">成立日期</view>
|
||||
<view class="content flex1">{{item.register_date}}</view>
|
||||
</view>
|
||||
<view class="infoItem rightInfo flex flex1">
|
||||
<view class="title">关联企业</view>
|
||||
<view class="content flex1">{{item.related_company_count}}家</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"fzjg-view",
|
||||
data() {
|
||||
return {
|
||||
|
||||
};
|
||||
},
|
||||
props:{
|
||||
branchList:Array
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.branchList {
|
||||
margin-top: 38rpx;
|
||||
padding: 0 20rpx;
|
||||
|
||||
.item {
|
||||
background-color: #FAFAFC;
|
||||
margin-bottom: 20rpx;
|
||||
padding: 20rpx;
|
||||
border-radius: 10rpx;
|
||||
|
||||
.titleStatusC {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #2B2B2B;
|
||||
|
||||
.statusC {
|
||||
padding: 0 10rpx;
|
||||
line-height: 28rpx;
|
||||
border-radius: 15rpx;
|
||||
font-size: 20rpx;
|
||||
font-weight: 500;
|
||||
.icon {
|
||||
margin-right: 3rpx;
|
||||
width: 16rpx;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.statusC.exist {
|
||||
background-color: #FFF7E9;
|
||||
border: solid 1rpx #F2C369;
|
||||
color: #F2C369;
|
||||
}
|
||||
|
||||
.statusC.logOff {
|
||||
background-color: #FFF1F1;
|
||||
border: solid 1rpx #EF3535;
|
||||
color: #EF3535;
|
||||
}
|
||||
}
|
||||
|
||||
.infoC {
|
||||
height: 50rpx;
|
||||
|
||||
.infoItem {
|
||||
.title {
|
||||
margin-right: 16rpx;
|
||||
font-size: 22rpx;
|
||||
font-weight: 500;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.content {
|
||||
font-size: 24rpx;
|
||||
font-weight: bold;
|
||||
color: #2A2A2A;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
.infoItem.leftInfo {
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.infoItem.rightInfo {
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.infoC.topInfo {
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
223
components/gltd-view/gltd-view.vue
Normal file
223
components/gltd-view/gltd-view.vue
Normal file
@@ -0,0 +1,223 @@
|
||||
<template>
|
||||
<view class="managementTeamList">
|
||||
<block v-for="(item,index) in managementList" :key="index">
|
||||
<view v-if="item.list.length>0" class="positionNumC flex">
|
||||
<view class="position">{{item.key}}</view>
|
||||
<view class="num director">{{item.list.length}}人</view>
|
||||
</view>
|
||||
<block v-if="item.list.length>4&&!item.isExpand">
|
||||
<view class="item flex" v-for="(pitem,pindex) in item.list.slice(0,4)" :key="index">
|
||||
<view class="avatarC flexCenter relative director">
|
||||
{{getLastNameStr(pitem.name)}}
|
||||
<view :class="'sexC flexCenter absolute '+(pitem.gender=='女'?'female':'male')">
|
||||
<image v-if="pitem.gender=='女'" class="icon" src="/pagesStock/static/icon/female.png" mode="widthFix">
|
||||
</image>
|
||||
<image v-else class="icon" src="/pagesStock/static/icon/male.png" mode="widthFix">
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex1">
|
||||
<view class="flex">
|
||||
<view class="name">{{pitem.name}}</view>
|
||||
<view class="position">{{pitem.position_name}}</view>
|
||||
<view class="date flex1">任职日期：{{pitem.start_date}}</view>
|
||||
</view>
|
||||
<view class="educationAgeC flex">
|
||||
<view class="education label">{{pitem.education}}</view>
|
||||
<view class="age label">{{getAgeByBirthYear(pitem.birth_year)}}岁</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<block v-else>
|
||||
<view class="item flex" v-for="(pitem,pindex) in item.list" :key="index">
|
||||
<view class="avatarC flexCenter relative director">
|
||||
{{getLastNameStr(pitem.name)}}
|
||||
<view :class="'sexC flexCenter absolute '+(pitem.gender=='女'?'female':'male')">
|
||||
<image v-if="pitem.gender=='女'" class="icon" src="/pagesStock/static/icon/female.png" mode="widthFix">
|
||||
</image>
|
||||
<image v-else class="icon" src="/pagesStock/static/icon/male.png" mode="widthFix">
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex1">
|
||||
<view class="flex">
|
||||
<view class="name">{{pitem.name}}</view>
|
||||
<view class="position">{{pitem.position_name}}</view>
|
||||
<view class="date flex1">任职日期：{{pitem.start_date}}</view>
|
||||
</view>
|
||||
<view class="educationAgeC flex">
|
||||
<view class="education label">{{pitem.education}}</view>
|
||||
<view class="age label">{{getAgeByBirthYear(pitem.birth_year)}}岁</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<view v-if="item.list.length>4" class="expandMoreC flexCenter" @click="clickExpandOrRetractManagement(index)">
|
||||
<view >{{item.isExpand?'收起':'展开查看'}}</view>
|
||||
<image class="arrow" src="/pagesStock/static/icon/lookMoreArrow.png" mode="widthFix">
|
||||
</image>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getAgeByBirthYear, getLastNameStr } from '@/utils/util';
|
||||
|
||||
export default {
|
||||
name:"gltd-view",
|
||||
data() {
|
||||
return {
|
||||
getLastNameStr:getLastNameStr, //获取姓
|
||||
getAgeByBirthYear:getAgeByBirthYear //获取年龄
|
||||
};
|
||||
},
|
||||
props:{
|
||||
managementList:Array
|
||||
},
|
||||
methods:{
|
||||
/**
|
||||
* 点击展开或收起管理团队人员
|
||||
*/
|
||||
clickExpandOrRetractManagement(index)
|
||||
{
|
||||
this.managementList[index].isExpand = !this.managementList[index].isExpand
|
||||
},
|
||||
},
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.managementTeamList {
|
||||
padding: 0 20rpx;
|
||||
.positionNumC {
|
||||
height: 70rpx;
|
||||
.position {
|
||||
margin-right: 11rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
.num {
|
||||
padding: 0 14rpx;
|
||||
line-height: 30rpx;
|
||||
border-radius: 5rpx;
|
||||
font-size: 20rpx;
|
||||
font-weight: bold;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.num.director {
|
||||
background-color: #99AFEC;
|
||||
}
|
||||
|
||||
.num.supervisor {
|
||||
background-color: #B499EC;
|
||||
}
|
||||
|
||||
.num.other {
|
||||
background-color: #B5B5C9;
|
||||
}
|
||||
}
|
||||
|
||||
.item {
|
||||
background-color: #FAFAFC;
|
||||
margin-bottom: 20rpx;
|
||||
padding: 20rpx 25rpx 20rpx 20rpx;
|
||||
border-radius: 10rpx;
|
||||
|
||||
.avatarC {
|
||||
margin-right: 18rpx;
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
border-radius: 50%;
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: white;
|
||||
|
||||
.sexC {
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
border-radius: 50%;
|
||||
border: solid 2rpx white;
|
||||
|
||||
.icon {
|
||||
width: 16rpx;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.sexC.female {
|
||||
background-color: #FA5A93;
|
||||
}
|
||||
|
||||
.sexC.male {
|
||||
background-color: #3E6CFC;
|
||||
}
|
||||
}
|
||||
|
||||
.avatarC.director {
|
||||
background-color: #99AFEC;
|
||||
}
|
||||
|
||||
.avatarC.supervisor {
|
||||
background-color: #B499EC;
|
||||
}
|
||||
|
||||
.avatarC.other {
|
||||
background-color: #B5B5C9;
|
||||
}
|
||||
|
||||
.name {
|
||||
margin-right: 13rpx;
|
||||
font-size: 24rpx;
|
||||
font-weight: bold;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.position {
|
||||
font-size: 22rpx;
|
||||
font-weight: 500;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.date {
|
||||
font-size: 20rpx;
|
||||
font-weight: 500;
|
||||
color: #999;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.educationAgeC {
|
||||
margin-top: 8rpx;
|
||||
|
||||
.label {
|
||||
margin-right: 10rpx;
|
||||
background-color: #F1F1F1;
|
||||
line-height: 30rpx;
|
||||
padding: 0 16rpx;
|
||||
font-size: 20rpx;
|
||||
font-weight: 500;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.expandMoreC {
|
||||
height: 80rpx;
|
||||
border-bottom: solid 1rpx #E7E7E7;
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
color: #C9C9C9;
|
||||
|
||||
.arrow {
|
||||
margin-left: 18rpx;
|
||||
width: 11rpx;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -8,7 +8,7 @@
|
||||
<view class="left">
|
||||
<view class="l_top">{{actualControlInfo.actual_controller_name}}</view>
|
||||
<view class="l_bottom">
|
||||
<view class="l_b_left">企业法人</view>
|
||||
<view class="l_b_left">{{actualControlInfo.control_type}}</view>
|
||||
<view class="l_b_right">截至 {{actualControlInfo.end_date}}</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -119,7 +119,7 @@
|
||||
},
|
||||
props:{
|
||||
actualControlInfo:Object, //实际控制人信息
|
||||
concentrationList:[], //股权集中度列表
|
||||
concentrationList:Array, //股权集中度列表
|
||||
shareholdersList:Array, //十大股东列表
|
||||
circulatingShareholdersList:Array, //十大流通股东列表
|
||||
competitivePositionInfo:Object, //竞争地位信息
|
||||
|
||||
@@ -1,44 +1,42 @@
|
||||
<template>
|
||||
<view class="ywjg_list">
|
||||
<view>
|
||||
<block v-for="(item,index) in businessStructureList" :key="index"></block>
|
||||
<view style="margin: 25rpx 20rpx; color: #2B2B2B; font-size: 28rpx; font-weight: bold;">
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view v-for="(child, row) in item.list" :key="row" class="ywjg_item_1">
|
||||
<view style="margin: 25rpx 20rpx; color: #2B2B2B; font-size: 28rpx; font-weight: bold;">业务结构分析</view>
|
||||
<view v-for="(item, index) in businessStructureList" :key="index" class="ywjg_item_1">
|
||||
<view style="display: flex; align-items: center;">
|
||||
<view style="font-size: 28rpx; font-weight: bold; margin-right: 10rpx;">
|
||||
{{child.title}}
|
||||
{{item.business_name}}
|
||||
</view>
|
||||
<view v-if="child.is_hexin"
|
||||
<view v-if="item.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 class="flex between" style="font-weight: 500;">
|
||||
<view class="flex" style="color: #F2C369; font-size: 20rpx;">
|
||||
<view style="border: 1rpx solid #F2C369; border-radius: 5rpx; padding: 0 10rpx;">
|
||||
营收占比:{{item.financial_metrics.revenue_ratio}}%</view>
|
||||
<view v-if="item.financial_metrics.gross_margin"
|
||||
style="border: 1rpx solid #F2C369; border-radius: 5rpx; padding: 0 10rpx; margin-left: 10rpx;">
|
||||
毛利率:{{item.financial_metrics.gross_margin}}%</view>
|
||||
<view v-else
|
||||
style="border: 1rpx solid #F2C369; border-radius: 5rpx; padding: 0 10rpx; margin-left: 10rpx;">
|
||||
毛利率:-</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 style="font-weight: bold; font-size: 30rpx; color: #BB8520; margin-top: 10rpx;">{{item.revenue}}{{item.revenue_unit}}</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 style="display: flex;">
|
||||
<view v-if="item.growth_metrics.revenue_growth" :class="'growthRate '+(getRateUpOrDown(item.growth_metrics.revenue_growth)?'down':'up')">
|
||||
增长:{{item.growth_metrics.revenue_growth}}%
|
||||
</view>
|
||||
<view v-else class="growthRate down">增长:-</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="margin: 25rpx 20rpx; color: #2B2B2B; font-size: 28rpx; font-weight: bold;">业务板块详情</view>
|
||||
<view style="font-weight: 500;">
|
||||
<view v-for="(item,index) in businessSegmentList" :key="item"
|
||||
<view v-for="(item,index) in businessSegmentList" :key="index"
|
||||
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;">{{item.segment_name}}</view>
|
||||
<view style="color: #BB8520; font-weight: bold; margin: 10rpx 0;">业务描述</view>
|
||||
@@ -53,18 +51,21 @@
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<script>
|
||||
import { getRateUpOrDown } from '@/utils/util';
|
||||
|
||||
export default {
|
||||
name: "ywjg-view",
|
||||
data() {
|
||||
return {
|
||||
|
||||
getRateUpOrDown:getRateUpOrDown
|
||||
};
|
||||
|
||||
},
|
||||
props:{
|
||||
businessStructureList:Array, //业务结构分析
|
||||
businessSegmentList:Array //业务板块详情
|
||||
businessSegmentList:Array ,//业务板块详情
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -84,7 +85,22 @@
|
||||
background-color: #FAFAFC;
|
||||
border-radius: 10rpx;
|
||||
padding: 25rpx 20rpx;
|
||||
box-sizing: border-box;
|
||||
.growthRate
|
||||
{
|
||||
padding: 0 10rpx;
|
||||
line-height: 30rpx;
|
||||
border-radius: 5rpx;
|
||||
font-size: 20rpx;
|
||||
color: white;
|
||||
}
|
||||
.growthRate.up
|
||||
{
|
||||
background-color: #EC3440;
|
||||
}
|
||||
.growthRate.down
|
||||
{
|
||||
background-color: #345423;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
385
components/zlfx-view/zlfx-view.vue
Normal file
385
components/zlfx-view/zlfx-view.vue
Normal file
@@ -0,0 +1,385 @@
|
||||
<template>
|
||||
<view class="strategicAnalysisList">
|
||||
<view class="section">核心定位</view>
|
||||
<view v-if="qualitativeAnalysisInfo" class="corePositionC">{{qualitativeAnalysisInfo.core_positioning.one_line_intro}}</view>
|
||||
<view class="section">投资亮点</view>
|
||||
<view v-if="qualitativeAnalysisInfo" class="corePositionC">{{qualitativeAnalysisInfo.core_positioning.investment_highlights}}</view>
|
||||
<!-- <view class="highlightsList">
|
||||
<view class="item flex">
|
||||
<image class="icon" src="" mode="widthFix"></image>
|
||||
<view class="flex1">
|
||||
<view class="title">综合金融优势</view>
|
||||
<view class="content">背靠平安集团，客户资源共享和交叉销售带来持续增长动力</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="section">商业模式</view>
|
||||
<view v-if="qualitativeAnalysisInfo" class="corePositionC">{{qualitativeAnalysisInfo.core_positioning.business_model_desc}}</view>
|
||||
<!-- <view class="infoC">
|
||||
<view class="title">零售银行核心驱动</view>
|
||||
<view class="content">以零售银行业务为核心驱动，依托平安集团综合金融平台，构建智能化、移动化、综合化三位一体发展模式。</view>
|
||||
</view>
|
||||
<view class="infoC">
|
||||
<view class="title">科技赋能转型</view>
|
||||
<view class="content">通过科技赋能实现业务流程数字化，降本增效的同时提升客户体验。</view>
|
||||
<view class="labelList flexWrap">
|
||||
<view class="labelC flex">
|
||||
<image class="icon" src="/pagesStock/static/icon/existStatus.png" mode="widthFix">
|
||||
</image>
|
||||
<view>AI应用深化</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="infoC">
|
||||
<view class="title">对公业务聚焦</view>
|
||||
<view class="content">聚焦供应链金融和产业互联网，服务实体经济高质量发展。</view>
|
||||
</view>
|
||||
<view class="section">战略分析</view>
|
||||
<view v-if="qualitativeAnalysisInfo" class="infoC">
|
||||
<view class="title">战略方向</view>
|
||||
<view class="content">{{qualitativeAnalysisInfo.strategy.strategy_description}}</view>
|
||||
</view>
|
||||
<view v-if="qualitativeAnalysisInfo" class="infoC">
|
||||
<view class="title">战略举措</view>
|
||||
<view class="content">{{qualitativeAnalysisInfo.strategy.strategic_initiatives}}</view>
|
||||
</view> -->
|
||||
|
||||
<view class="section flex">
|
||||
<view>竞争地位分析</view>
|
||||
<view class="industryRankC flex" @click="clickIndustryRank()">
|
||||
<image class="icon" src="/pagesStock/static/icon/industryRank.png" mode="widthFix">
|
||||
</image>
|
||||
<view v-if="industryRankInfo">行业排名 {{industryRankInfo.industry_rank}}/{{industryRankInfo.total_companies}}</view>
|
||||
<!-- <image src="/arrow" mode=""></image> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="subSection">主要竞争对手</view>
|
||||
<view class="mainCompetitorList flexWrap">
|
||||
<view class="item flex" v-for="(item,index) in mainCompetitorsList" :key="index">
|
||||
<image class="icon" src="/pagesStock/static/icon/existStatus.png" mode="widthFix"></image>
|
||||
<view>{{item}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="scoreList">
|
||||
<view :class="'item flex '+item.color" v-for="(item,index) in scoreList" :key="index">
|
||||
<image class="icon" :src="item.icon" mode="widthFix"></image>
|
||||
<view class="title">{{item.title}}</view>
|
||||
<view class="progressBgC relative flex1">
|
||||
<view :class="'progress absolute '+item.color" :style="'width: '+item.score+'%;'"></view>
|
||||
</view>
|
||||
<view class="score">{{item.score}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="width:660rpx; height:500rpx">
|
||||
<l-echart ref="chartRef"></l-echart>
|
||||
</view>
|
||||
<view v-if="competitivePositionInfo" class="infoC">
|
||||
<view class="title">竞争优势</view>
|
||||
<view class="content">{{competitivePositionInfo.analysis.competitive_advantages}}</view>
|
||||
</view>
|
||||
<view v-if="competitivePositionInfo" class="infoC">
|
||||
<view class="title">竞争劣势</view>
|
||||
<view class="content">{{competitivePositionInfo.analysis.competitive_disadvantages}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
const echarts = require('../../uni_modules/lime-echart/static/echarts.min.js');
|
||||
|
||||
export default {
|
||||
name:"zlfx-view",
|
||||
data() {
|
||||
return {
|
||||
option:{
|
||||
title: {
|
||||
show:false
|
||||
},
|
||||
legend: {
|
||||
show:false
|
||||
},
|
||||
tooltip:{
|
||||
show:true,
|
||||
triggerOn:'mousemove'
|
||||
},
|
||||
radar: {
|
||||
indicator: [
|
||||
{ name: '市场地位', max: 100 },
|
||||
{ name: '技术实力', max: 100 },
|
||||
{ name: '品牌价值', max: 100 },
|
||||
{ name: '运营效率', max: 100 },
|
||||
{ name: '财务健康', max: 100 },
|
||||
{ name: '创新能力', max: 100 },
|
||||
{ name: '风险控制', max: 100 },
|
||||
{ name: '成长潜力', max: 100 }
|
||||
],
|
||||
shape: 'polygon',
|
||||
splitNumber: 5,
|
||||
axisName: {
|
||||
color: '#54555A'
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
color: ['#CFD2D7']
|
||||
}
|
||||
},
|
||||
splitArea: {
|
||||
areaStyle:{
|
||||
color:['#F4F6FA','white']
|
||||
}
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#CFD2D7'
|
||||
}
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: 'Beijing',
|
||||
type: 'radar',
|
||||
lineStyle: {
|
||||
width:1
|
||||
},
|
||||
data: [],
|
||||
symbol: 'circle',
|
||||
symbolSize: 4,
|
||||
label:{
|
||||
show:true
|
||||
},
|
||||
itemStyle: {
|
||||
color: '#5070DD'
|
||||
},
|
||||
areaStyle: {
|
||||
opacity: 0.1
|
||||
}
|
||||
},
|
||||
]
|
||||
},
|
||||
};
|
||||
},
|
||||
props:{
|
||||
qualitativeAnalysisInfo:Object, //定性分析
|
||||
competitivePositionInfo:Object, //竞争地位信息
|
||||
mainCompetitorsList:Array, //主要竞争对手
|
||||
industryRankInfo:Object, //行业排名数据
|
||||
scoreList:Array, //
|
||||
data:Array,
|
||||
},
|
||||
watch:{
|
||||
data(newValue)
|
||||
{
|
||||
console.log(newValue)
|
||||
this.option.series[0].data = newValue
|
||||
this.init()
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
async init() {
|
||||
// chart 图表实例不能存在data里
|
||||
const chart = await this.$refs.chartRef.init(echarts);
|
||||
// chart.on('click',function (params) {
|
||||
// console.log(params)
|
||||
// })
|
||||
console.log(chart)
|
||||
chart.setOption(this.option)
|
||||
},
|
||||
clickIndustryRank()
|
||||
{
|
||||
this.$emit('rank')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.strategicAnalysisList {
|
||||
padding: 0 20rpx;
|
||||
.section {
|
||||
line-height: 72rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #2B2B2B;
|
||||
|
||||
.industryRankC {
|
||||
margin-left: 10rpx;
|
||||
padding: 0 12rpx;
|
||||
line-height: 38rpx;
|
||||
border: solid 1rpx #F2C369;
|
||||
border-radius: 19rpx;
|
||||
font-size: 20rpx;
|
||||
font-weight: 500;
|
||||
color: #F3C368;
|
||||
|
||||
.icon {
|
||||
margin-right: 5rpx;
|
||||
width: 17rpx;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.corePositionC {
|
||||
background-color: #FAFAFC;
|
||||
padding: 20rpx;
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
color: #2A2A2A;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.highlightsList {
|
||||
.item {
|
||||
background-color: #FAFAFC;
|
||||
margin-bottom: 20rpx;
|
||||
padding: 20rpx;
|
||||
border-radius: 10rpx;
|
||||
|
||||
.icon {
|
||||
width: 81rpx;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 22rpx;
|
||||
font-weight: 500;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.content {
|
||||
font-size: 20rpx;
|
||||
font-weight: 500;
|
||||
color: #2A2A2A;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.infoC {
|
||||
background-color: #FAFAFC;
|
||||
border-radius: 10rpx;
|
||||
padding: 12rpx 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.infoItem {
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 22rpx;
|
||||
font-weight: 500;
|
||||
color: #2A2A2A;
|
||||
}
|
||||
|
||||
.content {
|
||||
margin-top: 10rpx;
|
||||
font-size: 20rpx;
|
||||
font-weight: 500;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.content.code {
|
||||
color: #BB8520;
|
||||
}
|
||||
|
||||
.content.rightAlign {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.labelList {
|
||||
margin-top: 10rpx;
|
||||
|
||||
.labelC {
|
||||
background-color: #FFF7E9;
|
||||
margin: 0 12rpx 12rpx 0;
|
||||
padding: 0 10rpx;
|
||||
line-height: 38rpx;
|
||||
border: solid 1rpx #F2C369;
|
||||
border-radius: 20rpx;
|
||||
font-size: 22rpx;
|
||||
font-weight: 500;
|
||||
color: #F3C368;
|
||||
|
||||
.icon {
|
||||
margin-right: 3rpx;
|
||||
width: 16rpx;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.subSection {
|
||||
line-height: 60rpx;
|
||||
font-size: 24rpx;
|
||||
font-weight: bold;
|
||||
color: #2A2A2A;
|
||||
}
|
||||
|
||||
.mainCompetitorList {
|
||||
.item {
|
||||
background-color: #FFF7E9;
|
||||
margin: 0 20rpx 20rpx 0;
|
||||
padding: 0 16rpx;
|
||||
line-height: 38rpx;
|
||||
border-radius: 20rpx;
|
||||
border: solid 1rpx #F2C369;
|
||||
font-size: 22rpx;
|
||||
font-weight: 500;
|
||||
color: #F3C368;
|
||||
|
||||
.icon {
|
||||
margin-right: 3rpx;
|
||||
width: 16rpx;
|
||||
height: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
.scoreList
|
||||
{
|
||||
.item
|
||||
{
|
||||
margin-bottom: 40rpx;
|
||||
font-size: 24rpx;
|
||||
.icon
|
||||
{
|
||||
margin-right: 10rpx;
|
||||
width: 24rpx;
|
||||
height: auto;
|
||||
}
|
||||
.title
|
||||
{
|
||||
margin-right: 15rpx;
|
||||
font-weight: 500;
|
||||
color: #232323;
|
||||
}
|
||||
.progressBgC
|
||||
{
|
||||
background-color: #EFEFEF;
|
||||
margin-right: 15rpx;
|
||||
height: 10rpx;
|
||||
border-radius: 5rpx;
|
||||
.progress
|
||||
{
|
||||
top: 0;
|
||||
left: 0;
|
||||
height: 10rpx;
|
||||
border-radius: 5rpx;
|
||||
}
|
||||
.progress.blue
|
||||
{
|
||||
background: linear-gradient(90deg, #4AAFFF 0%, #1F83FD 100%);
|
||||
}
|
||||
.progress.purple
|
||||
{
|
||||
background: linear-gradient(90deg, #DD96FC 0%, #C061FD 100%);
|
||||
}
|
||||
}
|
||||
.score
|
||||
{
|
||||
font-weight: 800;
|
||||
color: #070707;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user