1.28 更换echarts文件
This commit is contained in:
98
components/cwfx-view/cwfx-view.vue
Normal file
98
components/cwfx-view/cwfx-view.vue
Normal file
@@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<view>
|
||||
<view style="color: #2B2B2B; font-weight: 500; font-size: 24rpx;">
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<image src="/pagesStock/static/icon/cwfx-1.png" mode="widthFix"
|
||||
style="width: 40rpx; height: 40rpx;"></image>
|
||||
<view class="flex1" style="margin: 0 10rpx; font-size: 28rpx;">盈利能力</view>
|
||||
<image src="/static/icon/home/conceptCenter/next.png" mode="widthFix"
|
||||
style="width: 13rpx; height: 22rpx;"></image>
|
||||
</view>
|
||||
|
||||
<view style="display: grid; gap: 20rpx; grid-template-columns: repeat(4, 1fr); margin: 0 20rpx;">
|
||||
<view
|
||||
style="display: flex; align-items: center; justify-content: center; text-align: center; font-size: 20rpx; color: #999999; border: 1rpx solid #D2D2D2; padding: 3rpx 5rpx; box-sizing: border-box;"
|
||||
:style="{color: index == 0 ? '#BB8520' : '#999999', border: `1rpx solid ${index == 0 ? '#F2C369' : '#D2D2D2'}`, 'background-color': (index == 0 ? '#FFFAF1' : '#FFFFFF')}"
|
||||
v-for="(item,index) in ['净资产收益率(ROE)%', '净资产收益率(扣非)%', '净资产收益率(加权)%', '总资产报酬率(ROA)%', '毛利率%', '净利率%', '营业利润率%', '成本费用利润率%']"
|
||||
:key="index">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<view class="flex1" style="font-size: 28rpx;">查看详细数据</view>
|
||||
<view
|
||||
style="color: #F2C369; font-size: 22rpx; padding: 2rpx 10rpx; border-radius: 5rpx; border: 1rpx solid #F2C369; text-align: center; margin: 0 10rpx;">
|
||||
单季度</view>
|
||||
<view
|
||||
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2;">
|
||||
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
||||
mode="widthFix"></image>
|
||||
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">全部</view>
|
||||
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
||||
mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view
|
||||
style="height: 400rpx; display: flex; align-items: center; justify-content: center; background-color: red;">
|
||||
柱状图占位 </view>
|
||||
|
||||
</view>
|
||||
|
||||
<view style="color: #2B2B2B; font-weight: 500; font-size: 24rpx;">
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<image src="/pagesStock/static/icon/cwfx-2.png" mode="widthFix"
|
||||
style="width: 40rpx; height: 40rpx;"></image>
|
||||
<view class="flex1" style="margin: 0 10rpx; font-size: 28rpx;">每股指标</view>
|
||||
<image src="/static/icon/home/conceptCenter/next.png" mode="widthFix"
|
||||
style="width: 13rpx; height: 22rpx;"></image>
|
||||
</view>
|
||||
|
||||
<view style="display: grid; gap: 20rpx; grid-template-columns: repeat(4, 1fr); margin: 0 20rpx;">
|
||||
<view
|
||||
style="display: flex; align-items: center; justify-content: center; text-align: center; font-size: 20rpx; color: #999999; border: 1rpx solid #D2D2D2; padding: 3rpx 5rpx; box-sizing: border-box;"
|
||||
:style="{color: index == 0 ? '#BB8520' : '#999999', border: `1rpx solid ${index == 0 ? '#F2C369' : '#D2D2D2'}`, 'background-color': (index == 0 ? '#FFFAF1' : '#FFFFFF')}"
|
||||
v-for="(item,index) in ['每股收益(EPS)', '基本每股收益', '稀释每股收益', '扣非每股收益', '每股净资产', '每股经营现金流', '每股资本公积', '每股未分配利润']"
|
||||
:key="index">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<view class="flex1" style="font-size: 28rpx;">查看详细数据</view>
|
||||
<view
|
||||
style="color: #F2C369; font-size: 22rpx; padding: 2rpx 10rpx; border-radius: 5rpx; border: 1rpx solid #F2C369; text-align: center; margin: 0 10rpx;">
|
||||
单季度</view>
|
||||
<view
|
||||
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2;">
|
||||
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
||||
mode="widthFix"></image>
|
||||
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">全部</view>
|
||||
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
||||
mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view
|
||||
style="height: 400rpx; display: flex; align-items: center; justify-content: center; background-color: blue;">
|
||||
柱状图占位 </view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"cwfx-view",
|
||||
data() {
|
||||
return {
|
||||
|
||||
};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
231
components/cwsj-view/cwsj-view.vue
Normal file
231
components/cwsj-view/cwsj-view.vue
Normal file
@@ -0,0 +1,231 @@
|
||||
<template>
|
||||
<view>
|
||||
<!-- 资产负债表 -->
|
||||
<view @click="itemClick(0)" style="color: #2B2B2B; font-weight: 500; font-size: 24rpx;">
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<image src="/pagesStock/static/icon/cwfx-1.png" mode="widthFix"
|
||||
style="width: 40rpx; height: 40rpx;"></image>
|
||||
<view class="flex1" style="margin: 0 10rpx; font-size: 28rpx;">资产负债表</view>
|
||||
<image src="/static/icon/home/conceptCenter/next.png" mode="widthFix"
|
||||
style="width: 13rpx; height: 22rpx;"></image>
|
||||
</view>
|
||||
|
||||
<view style="display: grid; gap: 20rpx; grid-template-columns: repeat(3, 1fr); margin: 0 20rpx;">
|
||||
<view
|
||||
style="display: flex; align-items: center; justify-content: center; text-align: center; font-size: 20rpx; color: #999999; border: 1rpx solid #D2D2D2; padding: 10rpx 10rpx; box-sizing: border-box;"
|
||||
:style="{color: index == 0 ? '#BB8520' : '#999999', border: `1rpx solid ${index == 0 ? '#F2C369' : '#D2D2D2'}`, 'background-color': (index == 0 ? '#FFFAF1' : '#FFFFFF')}"
|
||||
v-for="(item,index) in ['货币资金', '所有者权益', '关键指标']" :key="index">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<view class="flex1" style="font-size: 28rpx;">查看详细数据</view>
|
||||
<view
|
||||
style="color: #F2C369; font-size: 22rpx; padding: 2rpx 10rpx; border-radius: 5rpx; border: 1rpx solid #F2C369; text-align: center; margin: 0 10rpx;">
|
||||
单季度</view>
|
||||
<view
|
||||
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2;">
|
||||
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
||||
mode="widthFix"></image>
|
||||
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">全部</view>
|
||||
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
||||
mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view
|
||||
style="height: 400rpx; display: flex; align-items: center; justify-content: center; background-color: red;">
|
||||
折线图占位
|
||||
</view>
|
||||
|
||||
<view style="background-color: #FAFAFC; border-radius: 10rpx; margin: 0 20rpx; padding: 20rpx 0;">
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">资产总计</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">29.21亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">负债合计</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">17.94亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">所有者权益</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">11.27亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">货币资金</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">5.45亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">资本公积金</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">4.61亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">盈余公积金</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">1.02亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">未分配利润</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">1.61亿</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
<!-- 现金流量表 -->
|
||||
<view @click="itemClick(1)" style="color: #2B2B2B; font-weight: 500; font-size: 24rpx;">
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<image src="/pagesStock/static/icon/cwfx-1.png" mode="widthFix"
|
||||
style="width: 40rpx; height: 40rpx;"></image>
|
||||
<view class="flex1" style="margin: 0 10rpx; font-size: 28rpx;">现金流量表</view>
|
||||
<image src="/static/icon/home/conceptCenter/next.png" mode="widthFix"
|
||||
style="width: 13rpx; height: 22rpx;"></image>
|
||||
</view>
|
||||
|
||||
<view style="display: grid; gap: 20rpx; grid-template-columns: repeat(3, 1fr); margin: 0 20rpx;">
|
||||
<view
|
||||
style="display: flex; align-items: center; justify-content: center; text-align: center; font-size: 20rpx; color: #999999; border: 1rpx solid #D2D2D2; padding: 10rpx 10rpx; box-sizing: border-box;"
|
||||
:style="{color: index == 0 ? '#BB8520' : '#999999', border: `1rpx solid ${index == 0 ? '#F2C369' : '#D2D2D2'}`, 'background-color': (index == 0 ? '#FFFAF1' : '#FFFFFF')}"
|
||||
v-for="(item,index) in ['经营现金流', '筹资现金流', '投资现金流']" :key="index">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<view class="flex1" style="font-size: 28rpx;">查看详细数据</view>
|
||||
<view
|
||||
style="color: #F2C369; font-size: 22rpx; padding: 2rpx 10rpx; border-radius: 5rpx; border: 1rpx solid #F2C369; text-align: center; margin: 0 10rpx;">
|
||||
单季度</view>
|
||||
<view
|
||||
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2;">
|
||||
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
||||
mode="widthFix"></image>
|
||||
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">全部</view>
|
||||
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
||||
mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view
|
||||
style="height: 400rpx; display: flex; align-items: center; justify-content: center; background-color: red;">
|
||||
柱状折线图占位
|
||||
</view>
|
||||
|
||||
<view style="background-color: #FAFAFC; border-radius: 10rpx; margin: 0 20rpx; padding: 20rpx 0;">
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">经营性现金流</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">3.50亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">经营性现金流增长率</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">16.94%</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">投资性现金流</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">-5544.90万</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">筹资性现金流</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">-1.16亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">合计现金流</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">1.79亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">合计现金流增长率</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">935.58%</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 利润表 -->
|
||||
<view @click="itemClick(2)" style="color: #2B2B2B; font-weight: 500; font-size: 24rpx;">
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<image src="/pagesStock/static/icon/cwfx-1.png" mode="widthFix"
|
||||
style="width: 40rpx; height: 40rpx;"></image>
|
||||
<view class="flex1" style="margin: 0 10rpx; font-size: 28rpx;">利润表</view>
|
||||
<image src="/static/icon/home/conceptCenter/next.png" mode="widthFix"
|
||||
style="width: 13rpx; height: 22rpx;"></image>
|
||||
</view>
|
||||
|
||||
<view style="display: grid; gap: 20rpx; grid-template-columns: repeat(3, 1fr); margin: 0 20rpx;">
|
||||
<view
|
||||
style="display: flex; align-items: center; justify-content: center; text-align: center; font-size: 20rpx; color: #999999; border: 1rpx solid #D2D2D2; padding: 10rpx 10rpx; box-sizing: border-box;"
|
||||
:style="{color: index == 0 ? '#BB8520' : '#999999', border: `1rpx solid ${index == 0 ? '#F2C369' : '#D2D2D2'}`, 'background-color': (index == 0 ? '#FFFAF1' : '#FFFFFF')}"
|
||||
v-for="(item,index) in ['净利润', '营业收入', '期间费用']" :key="index">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<view class="flex1" style="font-size: 28rpx;">查看详细数据</view>
|
||||
<view
|
||||
style="color: #F2C369; font-size: 22rpx; padding: 2rpx 10rpx; border-radius: 5rpx; border: 1rpx solid #F2C369; text-align: center; margin: 0 10rpx;">
|
||||
单季度</view>
|
||||
<view
|
||||
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2; margin-right: 10rpx;">
|
||||
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
||||
mode="widthFix"></image>
|
||||
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">全部</view>
|
||||
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
||||
mode="widthFix"></image>
|
||||
</view>
|
||||
<view
|
||||
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2;">
|
||||
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
||||
mode="widthFix"></image>
|
||||
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">汇总</view>
|
||||
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
||||
mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="height: 400rpx;">
|
||||
<l-echart ref="chartRef1"></l-echart>
|
||||
</view>
|
||||
|
||||
<view style="background-color: #FAFAFC; border-radius: 10rpx; margin: 0 20rpx; padding: 20rpx 0;">
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">净利润</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">-6525.56万</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">净利润增长率</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">-1600.69%</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">营业总收入</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">3.64亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">营业总收入增长率</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">-26.28%</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">营业利润</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">-7539.55万</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">营业利润增长率</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">-201.00%</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"cwsj-view",
|
||||
data() {
|
||||
return {
|
||||
|
||||
};
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
@@ -23,44 +23,28 @@
|
||||
<view class="title">股权集中度</view>
|
||||
</view>
|
||||
<view class="guquan">
|
||||
<view class="top">2025-09-30 00:00:00</view>
|
||||
<view v-if="concentrationList.length>0" class="top">{{concentrationList[0].end_date}}</view>
|
||||
<view class="bottom">
|
||||
<view class="b_item">
|
||||
<view v-for="(item, index) in concentrationList" :key="index" class="item_info flexWrap">
|
||||
<view class="left">{{item.stat_item}}</view>
|
||||
<view class="right">
|
||||
<view class="bili">49.56%</view>
|
||||
<view class="shengjiang" :class="{action : index % 2 == 0}">
|
||||
<image
|
||||
:src="index % 2 == 0 ? '/pagesStock/static/icon/upArrow.png' : '/pagesStock/static/icon/downArrow.png'"
|
||||
mode="widthFix"></image>0.35%
|
||||
<view class="b_item flexWrap">
|
||||
<view v-for="(item, index) in concentrationList" :key="index" class="item_info flex">
|
||||
<view class="left flex1">{{item.stat_item}}</view>
|
||||
<view class="right flex">
|
||||
<view class="bili">{{item.holding_ratio.toFixed(2)}}%</view>
|
||||
<view v-if="item.ratio_change!=0" :class="'shengjiang flex '+(getRateUpOrDown(item.ratio_change)?'down':'up')" >
|
||||
<image v-if="getRateUpOrDown(item.ratio_change)" class="icon" src="/pagesStock/static/icon/downArrow.png"
|
||||
mode="widthFix"></image>
|
||||
<image v-else class="icon" src="/pagesStock/static/icon/upArrow.png" mode="widthFix"></image>
|
||||
<view>{{getRateStr(item.ratio_change)}}%</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view style="width: 15rpx;"></view>
|
||||
<view class="b_item">
|
||||
<view v-for="(item, index) in 4" class="item_info">
|
||||
<view class="left">
|
||||
前1大流通股东
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="bili">49.56%</view>
|
||||
<view v-if="0" class="shengjiang" :class="{action : index % 2 == 0}">
|
||||
<image
|
||||
:src="index % 2 == 0 ? '/pagesStock/static/icon/upArrow.png' : '/pagesStock/static/icon/downArrow.png'"
|
||||
mode="widthFix"></image>0.35%
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="flex">
|
||||
<view class="title">十大股东</view>
|
||||
</view>
|
||||
|
||||
<view class="gudong">
|
||||
<view class="back">
|
||||
<view class="top action">
|
||||
@@ -72,7 +56,7 @@
|
||||
</view>
|
||||
<view v-for="(item, index) in shareholdersList" :key="index" class="top" :class="{action: index % 2 == 1}">
|
||||
<view class="child">{{item.shareholder_name}}</view>
|
||||
<view class="child">{{item.shareholder_type}}</view>
|
||||
<view class="child">{{item.shareholder_type?item.shareholder_type:'-'}}</view>
|
||||
<view class="child" style="text-align: center;">{{getNumStr(item.holding_shares)}}股</view>
|
||||
<view class="child" style="color: #3E87CF; font-weight: bold; text-align: center;">{{item.total_share_ratio}}%</view>
|
||||
<view class="nature">{{item.share_nature}}</view>
|
||||
@@ -83,7 +67,6 @@
|
||||
<view class="flex">
|
||||
<view class="title">十大流通股东 </view>
|
||||
</view>
|
||||
|
||||
<view class="gudong">
|
||||
<view class="back">
|
||||
<view class="top action">
|
||||
@@ -107,14 +90,15 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getNumStr } from '@/utils/util';
|
||||
import { getNumStr, getRateStr, getRateUpOrDown } from '@/utils/util';
|
||||
|
||||
export default {
|
||||
name: "gqjg-view",
|
||||
data() {
|
||||
return {
|
||||
getNumStr:getNumStr
|
||||
|
||||
getNumStr:getNumStr,
|
||||
getRateUpOrDown:getRateUpOrDown,
|
||||
getRateStr:getRateStr
|
||||
};
|
||||
},
|
||||
props:{
|
||||
@@ -211,25 +195,17 @@
|
||||
|
||||
.bottom {
|
||||
display: flex;
|
||||
|
||||
.b_item {
|
||||
flex: 1;
|
||||
|
||||
.item_info {
|
||||
margin: 15rpx 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
margin: 15rpx 0;
|
||||
margin-right: 15rpx;
|
||||
width: calc((100% - 15rpx)/2);
|
||||
.left {
|
||||
color: #666666;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
|
||||
.right {
|
||||
height: 35rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 20rpx;
|
||||
|
||||
.bili {
|
||||
@@ -239,25 +215,31 @@
|
||||
|
||||
.shengjiang {
|
||||
margin-left: 10rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 5rpx;
|
||||
padding: 0 5rpx;
|
||||
height: 30rpx;
|
||||
border-radius: 5rpx;
|
||||
background-color: #C6F6D5;
|
||||
color: #345423;
|
||||
font-size: 18rpx;
|
||||
|
||||
image {
|
||||
.icon {
|
||||
width: 11rpx;
|
||||
height: 25rpx;
|
||||
margin-right: 4rpx;
|
||||
}
|
||||
|
||||
&.action {
|
||||
background-color: #FFDFE1;
|
||||
color: #EC3440;
|
||||
}
|
||||
}
|
||||
.shengjiang.up
|
||||
{
|
||||
background-color: #FFDFE1;
|
||||
color: #EC3440;
|
||||
}
|
||||
.shengjiang.down
|
||||
{
|
||||
background-color: #C6F6D5;
|
||||
color: #345423;
|
||||
}
|
||||
}
|
||||
}
|
||||
.item_info:nth-child(2n)
|
||||
{
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
99
components/gsxx-view/gsxx-view.vue
Normal file
99
components/gsxx-view/gsxx-view.vue
Normal file
@@ -0,0 +1,99 @@
|
||||
<template>
|
||||
<view v-if="stockBasicInfo" class="businessInfoList">
|
||||
<view class="section">工商信息</view>
|
||||
<view class="infoC">
|
||||
<view class="infoItem flex">
|
||||
<view class="title">统一信用代码</view>
|
||||
<view class="content code flex1 rightAlign">{{stockBasicInfo.credit_code}}</view>
|
||||
</view>
|
||||
<view class="infoItem flex">
|
||||
<view class="title">公司规模</view>
|
||||
<view class="content flex1 rightAlign">{{stockBasicInfo.company_size}}</view>
|
||||
</view>
|
||||
<view class="infoItem flex">
|
||||
<view class="title">注册地址</view>
|
||||
<view class="content flex1 rightAlign">{{stockBasicInfo.reg_address}}</view>
|
||||
</view>
|
||||
<view class="infoItem flex">
|
||||
<view class="title">办公地址</view>
|
||||
<view class="content flex1 rightAlign">{{stockBasicInfo.office_address}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="section">服务机构</view>
|
||||
<view class="infoC">
|
||||
<view class="title infoItem">会计师事务所</view>
|
||||
<view class="content infoItem">{{stockBasicInfo.accounting_firm}}</view>
|
||||
<view class="title infoItem">律师事务所</view>
|
||||
<view class="content infoItem">{{stockBasicInfo.law_firm}}</view>
|
||||
</view>
|
||||
<view class="section">主营业务</view>
|
||||
<view class="infoC mainBussiness">
|
||||
<text class="title">{{stockBasicInfo.main_business}}</text>
|
||||
</view>
|
||||
<view class="section">经营范围</view>
|
||||
<view class="infoC">
|
||||
<text class="title">{{stockBasicInfo.business_scope}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name:"gsxx-view",
|
||||
data() {
|
||||
return {
|
||||
|
||||
};
|
||||
},
|
||||
props:{
|
||||
stockBasicInfo:Object
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.businessInfoList {
|
||||
padding: 0 20rpx;
|
||||
|
||||
.section {
|
||||
line-height: 72rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #2B2B2B;
|
||||
}
|
||||
|
||||
.infoC {
|
||||
background-color: #FAFAFC;
|
||||
border-radius: 10rpx;
|
||||
padding: 12rpx 20rpx;
|
||||
|
||||
.infoItem {
|
||||
line-height: 46rpx;
|
||||
}
|
||||
|
||||
.title {
|
||||
font-size: 22rpx;
|
||||
font-weight: 500;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.content {
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
color: #2A2A2A;
|
||||
}
|
||||
|
||||
.content.code {
|
||||
color: #BB8520;
|
||||
}
|
||||
|
||||
.content.rightAlign {
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
.infoC.mainBussiness {
|
||||
padding: 20rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -1,441 +1,219 @@
|
||||
<template>
|
||||
<view>
|
||||
<!-- 主营数据 -->
|
||||
<template v-if="showType == 0">
|
||||
<view class="flex"
|
||||
style="font-size: 22rpx; color: #999999; font-weight: 500; margin: 20rpx; padding: 20rpx; box-sizing: border-box ;border: 1rpx solid #F5F5F5; border-radius: 10rpx;">
|
||||
<view style="width: 195rpx;">
|
||||
<view style="font-weight: bold; color: #1DB26F; font-size: 30rpx;">+12.50%</view>
|
||||
<view style="margin-top: 10rpx;">利润增长</view>
|
||||
</view>
|
||||
<view>
|
||||
<view
|
||||
style="display: flex; align-items: center; font-size: 22rpx; color: #999999; font-weight: 500; margin: 20rpx; padding: 20rpx; box-sizing: border-box ;border: 1rpx solid #F5F5F5; border-radius: 10rpx;">
|
||||
<view style="width: 195rpx;">
|
||||
<view style="font-weight: bold; color: #1DB26F; font-size: 30rpx;">+12.50%</view>
|
||||
<view style="margin-top: 10rpx;">利润增长</view>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<view style="display: flex; align-items: center;">
|
||||
<text
|
||||
style="font-weight: bold; color: #070707; font-size: 26rpx; margin-right: 10rpx;">成长能力</text>
|
||||
<text
|
||||
style="color: #A97F53; font-size: 20rpx; padding: 2rpx 5rpx; background-color: #F8F4ED; border: 1rpx solid #F1E7D8; border-radius: 3rpx;">增长动力</text>
|
||||
</view>
|
||||
<view style="margin-top: 10rpx;">
|
||||
<text>营收增长</text>
|
||||
<text style="color: #1DB26F; margin: 0 10rpx;">+8.20%</text>
|
||||
<text style="color: #F59B38;">(稳健增长)</text>
|
||||
</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center;">
|
||||
<text
|
||||
style="font-weight: bold; color: #070707; font-size: 26rpx; margin-right: 10rpx;">成长能力</text>
|
||||
<text
|
||||
style="color: #A97F53; font-size: 20rpx; padding: 2rpx 5rpx; background-color: #F8F4ED; border: 1rpx solid #F1E7D8; border-radius: 3rpx;">增长动力</text>
|
||||
</view>
|
||||
|
||||
<view
|
||||
style="display: flex; align-items: center; font-size: 22rpx; color: #999999; font-weight: 500; margin: 20rpx; padding: 20rpx; box-sizing: border-box ;border: 1rpx solid #F5F5F5; border-radius: 10rpx;">
|
||||
<view style="width: 195rpx;">
|
||||
<view style="font-weight: bold; color: #F59B38; font-size: 30rpx;">16.23%</view>
|
||||
<view style="margin-top: 10rpx;">ROE</view>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<view style="display: flex; align-items: center;">
|
||||
<text
|
||||
style="font-weight: bold; color: #070707; font-size: 26rpx; margin-right: 10rpx;">盈利与回报</text>
|
||||
<text
|
||||
style="color: #A97F53; font-size: 20rpx; padding: 2rpx 5rpx; background-color: #F8F4ED; border: 1rpx solid #F1E7D8; border-radius: 3rpx;">赚钱能力</text>
|
||||
</view>
|
||||
<view style="margin-top: 10rpx;">
|
||||
<text style="color: #F59B38;">良好</text>
|
||||
<text style="margin-left: 10rpx;">净利率 32.56%|毛利率 71.92%</text>
|
||||
</view>
|
||||
</view>
|
||||
<view style="margin-top: 10rpx;">
|
||||
<text>营收增长</text>
|
||||
<text style="color: #1DB26F; margin: 0 10rpx;">+8.20%</text>
|
||||
<text style="color: #F59B38;">(稳健增长)</text>
|
||||
</view>
|
||||
|
||||
<view
|
||||
style="display: flex; align-items: center; font-size: 22rpx; color: #999999; font-weight: 500; margin: 20rpx; padding: 20rpx; box-sizing: border-box ;border: 1rpx solid #F5F5F5; border-radius: 10rpx;">
|
||||
<view style="width: 195rpx;">
|
||||
<view style="font-weight: bold; color: #EC3440; font-size: 30rpx;">93.52%</view>
|
||||
<view style="margin-top: 10rpx;">资产负债率</view>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<view style="display: flex; align-items: center;">
|
||||
<text
|
||||
style="font-weight: bold; color: #070707; font-size: 26rpx; margin-right: 10rpx;">风险与运营</text>
|
||||
<text
|
||||
style="color: #A97F53; font-size: 20rpx; padding: 2rpx 5rpx; background-color: #F8F4ED; border: 1rpx solid #F1E7D8; border-radius: 3rpx;">安全边际</text>
|
||||
</view>
|
||||
<view style="margin-top: 10rpx;">
|
||||
<text style="color: #EC3440;">风险</text>
|
||||
<text style="margin-left: 10rpx;">流动比率 0.73|研发费用率 5.48%</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="text-align: center; font-size: 26rpx; color: #2B2B2B; font-weight: bold; margin: 20rpx;">
|
||||
营收与利润趋势</view>
|
||||
<view
|
||||
style="height: 400rpx; display: flex; align-items: center; justify-content: center; background-color: red;">
|
||||
柱状图占位 </view>
|
||||
|
||||
<view style="text-align: left; font-size: 26rpx; color: #2B2B2B; font-weight: bold; margin: 20rpx;">主营业务
|
||||
</view>
|
||||
<view
|
||||
style="height: 400rpx; display: flex; align-items: center; justify-content: center; background-color: blue;">
|
||||
饼状图占位 </view>
|
||||
|
||||
<view style="text-align: left; font-size: 26rpx; color: #2B2B2B; font-weight: bold; margin: 20rpx;">
|
||||
主营业务明细与历史对比</view>
|
||||
|
||||
<view
|
||||
style="display: grid; grid-template-columns: 130rpx repeat(4, 1fr); color: #666666; font-size: 20rpx; font-weight: 500; background-color: #FAFAFC; margin: 20rpx; margin-bottom: 0; padding: 10rpx; box-sizing: border-box;">
|
||||
<view v-for="(item, index) in ['业务', '毛利率', '利润', '营收', '营收']"
|
||||
style="display: flex;align-items: center;justify-content: center; flex-direction: column;"
|
||||
:style="{'text-align': index == 0 ? 'left' : 'center', 'align-items': index == 0 ? 'flex-start' : 'center'}">
|
||||
<view>{{item}}</view>
|
||||
<view v-if="['', '(2025年中报)', '(2025年中报)', '(2025年中报)', '(2024年年报)'][index].length > 0"
|
||||
style="font-size: 18rpx;" :style="{'text-align': index == 0 ? 'left' : 'center'}">
|
||||
{{['', '(2025年中报)', '(2025年中报)', '(2025年中报)', '(2024年年报)'][index]}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-for="(item, index) in ['零售金融业务', '批发金融业务', '其他业务']"
|
||||
style="display: grid; grid-template-columns: 130rpx repeat(4, 1fr); color: #666666; font-size: 20rpx; font-weight: 500; margin: 0 20rpx; padding: 10rpx; box-sizing: border-box;"
|
||||
:style="{'background-color': (index % 2 == 0 ? '#FFFFFF' : '#FAFAFC')}">
|
||||
<view v-for="(item, index) in [item, '64.53%', '200.57亿', '310.81亿', '712.55亿']"
|
||||
:style="{'text-align': index == 0 ? 'left' : 'center'}">{{item}}</view>
|
||||
</view>
|
||||
|
||||
<view style="height: 80rpx;"></view>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
|
||||
<view
|
||||
style="display: flex; align-items: center; font-size: 22rpx; color: #999999; font-weight: 500; margin: 20rpx; padding: 20rpx; box-sizing: border-box ;border: 1rpx solid #F5F5F5; border-radius: 10rpx;">
|
||||
<view style="width: 195rpx;">
|
||||
<view style="font-weight: bold; color: #F59B38; font-size: 30rpx;">16.23%</view>
|
||||
<view style="margin-top: 10rpx;">ROE</view>
|
||||
</view>
|
||||
|
||||
<!-- 财务分析 -->
|
||||
<template v-if="showType == 1">
|
||||
<view>
|
||||
<view style="color: #2B2B2B; font-weight: 500; font-size: 24rpx;">
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<image src="/pagesStock/static/icon/cwfx-1.png" mode="widthFix"
|
||||
style="width: 40rpx; height: 40rpx;"></image>
|
||||
<view class="flex1" style="margin: 0 10rpx; font-size: 28rpx;">盈利能力</view>
|
||||
<image src="/static/icon/home/conceptCenter/next.png" mode="widthFix"
|
||||
style="width: 13rpx; height: 22rpx;"></image>
|
||||
</view>
|
||||
|
||||
<view style="display: grid; gap: 20rpx; grid-template-columns: repeat(4, 1fr); margin: 0 20rpx;">
|
||||
<view
|
||||
style="display: flex; align-items: center; justify-content: center; text-align: center; font-size: 20rpx; color: #999999; border: 1rpx solid #D2D2D2; padding: 3rpx 5rpx; box-sizing: border-box;"
|
||||
:style="{color: index == 0 ? '#BB8520' : '#999999', border: `1rpx solid ${index == 0 ? '#F2C369' : '#D2D2D2'}`, 'background-color': (index == 0 ? '#FFFAF1' : '#FFFFFF')}"
|
||||
v-for="(item,index) in ['净资产收益率(ROE)%', '净资产收益率(扣非)%', '净资产收益率(加权)%', '总资产报酬率(ROA)%', '毛利率%', '净利率%', '营业利润率%', '成本费用利润率%']"
|
||||
:key="index">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<view class="flex1" style="font-size: 28rpx;">查看详细数据</view>
|
||||
<view
|
||||
style="color: #F2C369; font-size: 22rpx; padding: 2rpx 10rpx; border-radius: 5rpx; border: 1rpx solid #F2C369; text-align: center; margin: 0 10rpx;">
|
||||
单季度</view>
|
||||
<view
|
||||
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2;">
|
||||
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
||||
mode="widthFix"></image>
|
||||
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">全部</view>
|
||||
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
||||
mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view
|
||||
style="height: 400rpx; display: flex; align-items: center; justify-content: center; background-color: red;">
|
||||
柱状图占位 </view>
|
||||
|
||||
<view style="display: flex; align-items: center;">
|
||||
<text
|
||||
style="font-weight: bold; color: #070707; font-size: 26rpx; margin-right: 10rpx;">盈利与回报</text>
|
||||
<text
|
||||
style="color: #A97F53; font-size: 20rpx; padding: 2rpx 5rpx; background-color: #F8F4ED; border: 1rpx solid #F1E7D8; border-radius: 3rpx;">赚钱能力</text>
|
||||
</view>
|
||||
|
||||
<view style="color: #2B2B2B; font-weight: 500; font-size: 24rpx;">
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<image src="/pagesStock/static/icon/cwfx-2.png" mode="widthFix"
|
||||
style="width: 40rpx; height: 40rpx;"></image>
|
||||
<view class="flex1" style="margin: 0 10rpx; font-size: 28rpx;">每股指标</view>
|
||||
<image src="/static/icon/home/conceptCenter/next.png" mode="widthFix"
|
||||
style="width: 13rpx; height: 22rpx;"></image>
|
||||
</view>
|
||||
|
||||
<view style="display: grid; gap: 20rpx; grid-template-columns: repeat(4, 1fr); margin: 0 20rpx;">
|
||||
<view
|
||||
style="display: flex; align-items: center; justify-content: center; text-align: center; font-size: 20rpx; color: #999999; border: 1rpx solid #D2D2D2; padding: 3rpx 5rpx; box-sizing: border-box;"
|
||||
:style="{color: index == 0 ? '#BB8520' : '#999999', border: `1rpx solid ${index == 0 ? '#F2C369' : '#D2D2D2'}`, 'background-color': (index == 0 ? '#FFFAF1' : '#FFFFFF')}"
|
||||
v-for="(item,index) in ['每股收益(EPS)', '基本每股收益', '稀释每股收益', '扣非每股收益', '每股净资产', '每股经营现金流', '每股资本公积', '每股未分配利润']"
|
||||
:key="index">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<view class="flex1" style="font-size: 28rpx;">查看详细数据</view>
|
||||
<view
|
||||
style="color: #F2C369; font-size: 22rpx; padding: 2rpx 10rpx; border-radius: 5rpx; border: 1rpx solid #F2C369; text-align: center; margin: 0 10rpx;">
|
||||
单季度</view>
|
||||
<view
|
||||
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2;">
|
||||
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
||||
mode="widthFix"></image>
|
||||
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">全部</view>
|
||||
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
||||
mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view
|
||||
style="height: 400rpx; display: flex; align-items: center; justify-content: center; background-color: blue;">
|
||||
柱状图占位 </view>
|
||||
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<!-- 财务数据 -->
|
||||
<template v-if="showType == 2">
|
||||
<view>
|
||||
<!-- 资产负债表 -->
|
||||
<view @click="itemClick(0)" style="color: #2B2B2B; font-weight: 500; font-size: 24rpx;">
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<image src="/pagesStock/static/icon/cwfx-1.png" mode="widthFix"
|
||||
style="width: 40rpx; height: 40rpx;"></image>
|
||||
<view class="flex1" style="margin: 0 10rpx; font-size: 28rpx;">资产负债表</view>
|
||||
<image src="/static/icon/home/conceptCenter/next.png" mode="widthFix"
|
||||
style="width: 13rpx; height: 22rpx;"></image>
|
||||
</view>
|
||||
|
||||
<view style="display: grid; gap: 20rpx; grid-template-columns: repeat(3, 1fr); margin: 0 20rpx;">
|
||||
<view
|
||||
style="display: flex; align-items: center; justify-content: center; text-align: center; font-size: 20rpx; color: #999999; border: 1rpx solid #D2D2D2; padding: 10rpx 10rpx; box-sizing: border-box;"
|
||||
:style="{color: index == 0 ? '#BB8520' : '#999999', border: `1rpx solid ${index == 0 ? '#F2C369' : '#D2D2D2'}`, 'background-color': (index == 0 ? '#FFFAF1' : '#FFFFFF')}"
|
||||
v-for="(item,index) in ['货币资金', '所有者权益', '关键指标']" :key="index">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<view class="flex1" style="font-size: 28rpx;">查看详细数据</view>
|
||||
<view
|
||||
style="color: #F2C369; font-size: 22rpx; padding: 2rpx 10rpx; border-radius: 5rpx; border: 1rpx solid #F2C369; text-align: center; margin: 0 10rpx;">
|
||||
单季度</view>
|
||||
<view
|
||||
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2;">
|
||||
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
||||
mode="widthFix"></image>
|
||||
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">全部</view>
|
||||
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
||||
mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view
|
||||
style="height: 400rpx; display: flex; align-items: center; justify-content: center; background-color: red;">
|
||||
折线图占位
|
||||
</view>
|
||||
|
||||
<view style="background-color: #FAFAFC; border-radius: 10rpx; margin: 0 20rpx; padding: 20rpx 0;">
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">资产总计</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">29.21亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">负债合计</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">17.94亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">所有者权益</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">11.27亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">货币资金</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">5.45亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">资本公积金</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">4.61亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">盈余公积金</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">1.02亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">未分配利润</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">1.61亿</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
<!-- 现金流量表 -->
|
||||
<view @click="itemClick(1)" style="color: #2B2B2B; font-weight: 500; font-size: 24rpx;">
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<image src="/pagesStock/static/icon/cwfx-1.png" mode="widthFix"
|
||||
style="width: 40rpx; height: 40rpx;"></image>
|
||||
<view class="flex1" style="margin: 0 10rpx; font-size: 28rpx;">现金流量表</view>
|
||||
<image src="/static/icon/home/conceptCenter/next.png" mode="widthFix"
|
||||
style="width: 13rpx; height: 22rpx;"></image>
|
||||
</view>
|
||||
|
||||
<view style="display: grid; gap: 20rpx; grid-template-columns: repeat(3, 1fr); margin: 0 20rpx;">
|
||||
<view
|
||||
style="display: flex; align-items: center; justify-content: center; text-align: center; font-size: 20rpx; color: #999999; border: 1rpx solid #D2D2D2; padding: 10rpx 10rpx; box-sizing: border-box;"
|
||||
:style="{color: index == 0 ? '#BB8520' : '#999999', border: `1rpx solid ${index == 0 ? '#F2C369' : '#D2D2D2'}`, 'background-color': (index == 0 ? '#FFFAF1' : '#FFFFFF')}"
|
||||
v-for="(item,index) in ['经营现金流', '筹资现金流', '投资现金流']" :key="index">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<view class="flex1" style="font-size: 28rpx;">查看详细数据</view>
|
||||
<view
|
||||
style="color: #F2C369; font-size: 22rpx; padding: 2rpx 10rpx; border-radius: 5rpx; border: 1rpx solid #F2C369; text-align: center; margin: 0 10rpx;">
|
||||
单季度</view>
|
||||
<view
|
||||
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2;">
|
||||
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
||||
mode="widthFix"></image>
|
||||
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">全部</view>
|
||||
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
||||
mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view
|
||||
style="height: 400rpx; display: flex; align-items: center; justify-content: center; background-color: red;">
|
||||
柱状折线图占位
|
||||
</view>
|
||||
|
||||
<view style="background-color: #FAFAFC; border-radius: 10rpx; margin: 0 20rpx; padding: 20rpx 0;">
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">经营性现金流</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">3.50亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">经营性现金流增长率</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">16.94%</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">投资性现金流</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">-5544.90万</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">筹资性现金流</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">-1.16亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">合计现金流</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">1.79亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">合计现金流增长率</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">935.58%</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 利润表 -->
|
||||
<view @click="itemClick(2)" style="color: #2B2B2B; font-weight: 500; font-size: 24rpx;">
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<image src="/pagesStock/static/icon/cwfx-1.png" mode="widthFix"
|
||||
style="width: 40rpx; height: 40rpx;"></image>
|
||||
<view class="flex1" style="margin: 0 10rpx; font-size: 28rpx;">利润表</view>
|
||||
<image src="/static/icon/home/conceptCenter/next.png" mode="widthFix"
|
||||
style="width: 13rpx; height: 22rpx;"></image>
|
||||
</view>
|
||||
|
||||
<view style="display: grid; gap: 20rpx; grid-template-columns: repeat(3, 1fr); margin: 0 20rpx;">
|
||||
<view
|
||||
style="display: flex; align-items: center; justify-content: center; text-align: center; font-size: 20rpx; color: #999999; border: 1rpx solid #D2D2D2; padding: 10rpx 10rpx; box-sizing: border-box;"
|
||||
:style="{color: index == 0 ? '#BB8520' : '#999999', border: `1rpx solid ${index == 0 ? '#F2C369' : '#D2D2D2'}`, 'background-color': (index == 0 ? '#FFFAF1' : '#FFFFFF')}"
|
||||
v-for="(item,index) in ['净利润', '营业收入', '期间费用']" :key="index">
|
||||
{{item}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="display: flex;align-items: center; padding: 20rpx; box-sizing: border-box;">
|
||||
<view class="flex1" style="font-size: 28rpx;">查看详细数据</view>
|
||||
<view
|
||||
style="color: #F2C369; font-size: 22rpx; padding: 2rpx 10rpx; border-radius: 5rpx; border: 1rpx solid #F2C369; text-align: center; margin: 0 10rpx;">
|
||||
单季度</view>
|
||||
<view
|
||||
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2; margin-right: 10rpx;">
|
||||
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
||||
mode="widthFix"></image>
|
||||
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">全部</view>
|
||||
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
||||
mode="widthFix"></image>
|
||||
</view>
|
||||
<view
|
||||
style="display: flex; align-items: center; padding: 3rpx 10rpx; box-sizing: border-box; border: 1rpx solid #D2D2D2;">
|
||||
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
|
||||
mode="widthFix"></image>
|
||||
<view style="margin: 0 10rpx; color: #999999; font-size: 22rpx;">汇总</view>
|
||||
<image style="width: 11rpx; height: 6rpx;" src="/pagesStock/static/icon/all-down.png"
|
||||
mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view
|
||||
style="height: 400rpx; display: flex; align-items: center; justify-content: center; background-color: red;">
|
||||
柱状折线图占位
|
||||
</view>
|
||||
|
||||
<view style="background-color: #FAFAFC; border-radius: 10rpx; margin: 0 20rpx; padding: 20rpx 0;">
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">净利润</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">-6525.56万</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">净利润增长率</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">-1600.69%</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">营业总收入</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">3.64亿</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">营业总收入增长率</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">-26.28%</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">营业利润</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">-7539.55万</view>
|
||||
</view>
|
||||
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
|
||||
<view style="flex: 1; color: #999999; margin-right: 20rpx;">营业利润增长率</view>
|
||||
<view style="text-align: right; color: #2A2A2A;">-201.00%</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="margin-top: 10rpx;">
|
||||
<text style="color: #F59B38;">良好</text>
|
||||
<text style="margin-left: 10rpx;">净利率 32.56%|毛利率 71.92%</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
|
||||
<view class="flex"
|
||||
style="display: flex; align-items: center; font-size: 22rpx; color: #999999; font-weight: 500; margin: 20rpx; padding: 20rpx; box-sizing: border-box ;border: 1rpx solid #F5F5F5; border-radius: 10rpx;">
|
||||
<view style="width: 195rpx;">
|
||||
<view style="font-weight: bold; color: #EC3440; font-size: 30rpx;">93.52%</view>
|
||||
<view style="margin-top: 10rpx;">资产负债率</view>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<view style="display: flex; align-items: center;">
|
||||
<text
|
||||
style="font-weight: bold; color: #070707; font-size: 26rpx; margin-right: 10rpx;">风险与运营</text>
|
||||
<text
|
||||
style="color: #A97F53; font-size: 20rpx; padding: 2rpx 5rpx; background-color: #F8F4ED; border: 1rpx solid #F1E7D8; border-radius: 3rpx;">安全边际</text>
|
||||
</view>
|
||||
<view style="margin-top: 10rpx;">
|
||||
<text style="color: #EC3440;">风险</text>
|
||||
<text style="margin-left: 10rpx;">流动比率 0.73|研发费用率 5.48%</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view style="text-align: center; font-size: 26rpx; color: #2B2B2B; font-weight: bold; margin: 20rpx;">
|
||||
营收与利润趋势</view>
|
||||
<view style="height: 400rpx;">
|
||||
<l-echart ref="chartRef1"></l-echart>
|
||||
</view>
|
||||
<view style="text-align: left; font-size: 26rpx; color: #2B2B2B; font-weight: bold; margin: 20rpx;">主营业务
|
||||
</view>
|
||||
<view style="height: 400rpx;">
|
||||
<l-echart ref="chartRef2"></l-echart>
|
||||
</view>
|
||||
<view style="text-align: left; font-size: 26rpx; color: #2B2B2B; font-weight: bold; margin: 20rpx;">
|
||||
主营业务明细与历史对比</view>
|
||||
<view
|
||||
style="display: grid; grid-template-columns: 130rpx repeat(4, 1fr); color: #666666; font-size: 20rpx; font-weight: 500; background-color: #FAFAFC; margin: 20rpx; margin-bottom: 0; padding: 10rpx; box-sizing: border-box;">
|
||||
<view v-for="(item, index) in ['业务', '毛利率', '利润', '营收', '营收']"
|
||||
style="display: flex;align-items: center;justify-content: center; flex-direction: column;"
|
||||
:style="{'text-align': index == 0 ? 'left' : 'center', 'align-items': index == 0 ? 'flex-start' : 'center'}">
|
||||
<view>{{item}}</view>
|
||||
<view v-if="['', '(2025年中报)', '(2025年中报)', '(2025年中报)', '(2024年年报)'][index].length > 0"
|
||||
style="font-size: 18rpx;" :style="{'text-align': index == 0 ? 'left' : 'center'}">
|
||||
{{['', '(2025年中报)', '(2025年中报)', '(2025年中报)', '(2024年年报)'][index]}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-for="(item, index) in ['零售金融业务', '批发金融业务', '其他业务']"
|
||||
style="display: grid; grid-template-columns: 130rpx repeat(4, 1fr); color: #666666; font-size: 20rpx; font-weight: 500; margin: 0 20rpx; padding: 10rpx; box-sizing: border-box;"
|
||||
:style="{'background-color': (index % 2 == 0 ? '#FFFFFF' : '#FAFAFC')}">
|
||||
<view v-for="(item, index) in [item, '64.53%', '200.57亿', '310.81亿', '712.55亿']"
|
||||
:style="{'text-align': index == 0 ? 'left' : 'center'}">{{item}}</view>
|
||||
</view>
|
||||
|
||||
<view style="height: 80rpx;"></view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<script>
|
||||
const echarts = require('../../uni_modules/lime-echart/static/echarts.min.js');
|
||||
|
||||
export default {
|
||||
name: "zysj-view",
|
||||
data() {
|
||||
return {
|
||||
showType: 0
|
||||
option1:{
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: []
|
||||
},
|
||||
yAxis: [{
|
||||
type: 'value',
|
||||
name:'营收(亿)',
|
||||
position:'left',
|
||||
alignTicks:true,
|
||||
axisLine:{
|
||||
onZero:false
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'value',
|
||||
name:'利润(亿)',
|
||||
position:'right',
|
||||
alignTicks:true,
|
||||
axisLine:{
|
||||
onZero:false
|
||||
}
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
type: 'bar',
|
||||
data: [],
|
||||
yAxisIndex:0
|
||||
},
|
||||
{
|
||||
type: 'line',
|
||||
data: [],
|
||||
yAxisIndex:1
|
||||
}
|
||||
]
|
||||
},
|
||||
option2:{
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: []
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: [120, 200, 150, 80, 70, 110, 130],
|
||||
type: 'pie',
|
||||
showBackground: true,
|
||||
backgroundStyle: {
|
||||
color: 'rgba(180, 180, 180, 0.2)'
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
props: { // 0 主营数据 1 财务分析 2 财务数据
|
||||
type: Number
|
||||
type: Number,
|
||||
barCategoryList:Array,
|
||||
barList:Array,
|
||||
lineList:Array
|
||||
},
|
||||
watch:{
|
||||
barList(newValue){
|
||||
this.option1.series[0].data = newValue
|
||||
this.barLineInit()
|
||||
},
|
||||
lineList(newValue){
|
||||
this.option1.series[1].data = newValue
|
||||
this.barLineInit()
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
type: {
|
||||
handler(newVal, oldVal) {
|
||||
this.showType = newVal
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
itemClick(index) {
|
||||
methods: {
|
||||
/**
|
||||
* 柱状图,折线图初始化
|
||||
*/
|
||||
async barLineInit() {
|
||||
// chart 图表实例不能存在data里
|
||||
const chart = await this.$refs.chartRef1.init(echarts);
|
||||
// chart.on('click',function (params) {
|
||||
// console.log(params)
|
||||
// })
|
||||
let that = this
|
||||
setTimeout(function() {
|
||||
chart.setOption(that.option1)
|
||||
}, 2000);
|
||||
},
|
||||
/**
|
||||
* 饼状图初始化
|
||||
*/
|
||||
async pieInit() {
|
||||
// chart 图表实例不能存在data里
|
||||
const chart = await this.$refs.chartRef2.init(echarts);
|
||||
// chart.on('click',function (params) {
|
||||
// console.log(params)
|
||||
// })
|
||||
let that = this
|
||||
setTimeout(function() {
|
||||
chart.setOption(that.option2)
|
||||
}, 2000);
|
||||
},
|
||||
itemClick(index) {
|
||||
uni.navigateTo({
|
||||
url: `/pagesStock/stockCenterDetails/cwDetails?index=${index}`
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user