1.31 财务分析,财务数据模块完善,产业链桑基图展示

This commit is contained in:
尚政杰
2026-01-31 17:19:16 +08:00
parent 1c13386dfc
commit 0a2dab4936
527 changed files with 3390 additions and 604 deletions

View File

@@ -268,6 +268,7 @@
this.option1.xAxis.data = category
this.option1.series[0].data = data1
this.profitabilityInit()
this.option2.xAxis.data = category
this.option2.series[0].data = data2
this.perShareInit()
}

View File

@@ -1,7 +1,7 @@
<template>
<view>
<!-- 资产负债表 -->
<view @click="itemClick(0)" style="color: #2B2B2B; font-weight: 500; font-size: 24rpx;">
<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>
@@ -16,14 +16,12 @@
{{item}}
</view>
</view>
<view class="flex" style="padding: 20rpx;">
<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;">
<view class="flex" style="padding: 3rpx 10rpx; 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>
@@ -34,29 +32,28 @@
<view style="height: 400rpx;">
<l-echart ref="chartRef1"></l-echart>
</view>
<view v-if="financialBalanceList.length>0" 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 class="flex between" style="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;">{{getNumStr(financialBalanceList[0].assets.total)}}</view>
</view>
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
<view class="flex between" style="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;">{{getNumStr(financialBalanceList[0].liabilities.total)}}</view>
</view>
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
<view class="flex between" style="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;">{{getNumStr(financialBalanceList[0].equity.total)}}</view>
</view>
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
<view class="flex between" style="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;">{{getNumStr(financialBalanceList[0].assets.current_assets.cash)}}</view>
</view>
<view style="display: flex; align-items: center; justify-content: space-between; font-size: 24rpx; font-weight: 500; margin: 20rpx;">
<view class="flex between" style="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;">{{getNumStr(financialBalanceList[0].equity.capital_reserve)}}</view>
</view>
<view class="flex between" style=" font-size: 24rpx; font-weight: 500; margin: 20rpx;">
<view class="flex between" style="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;">{{getNumStr(financialBalanceList[0].equity.surplus_reserve)}}</view>
</view>
@@ -75,20 +72,17 @@
<image src="/static/icon/home/conceptCenter/next.png" mode="widthFix"
style="width: 13rpx; height: 22rpx;"></image>
</view>
<view class="indicatorC" style="display: grid; gap: 20rpx; grid-template-columns: repeat(3, 1fr); margin: 0 20rpx;">
<view :class="'item flexCenter '+(cashFlowIndicatorIndex==index?'select':'')" v-for="(item,index) in ['经营现金流', '筹资现金流', '投资现金流']" :key="index" @click="clickCashFlowIndicatorItem(index)">
{{item}}
</view>
</view>
<view class="flex" style="padding: 20rpx;">
<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;">
<view class="flex" style="padding: 3rpx 10rpx; 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>
@@ -96,33 +90,33 @@
mode="widthFix"></image>
</view>
</view>
<view style="height: 400rpx;">
<view style="height: 500rpx;">
<l-echart ref="chartRef2"></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;">3.50亿</view>
<view v-if="cashFlowList.length>0" style="background-color: #FAFAFC; border-radius: 10rpx; margin: 0 20rpx; padding: 20rpx 0;">
<view class="flex" style="font-size: 24rpx; font-weight: 500; margin: 20rpx;">
<view class="flex1" style="color: #999999; margin-right: 20rpx;">经营性现金流</view>
<view style="text-align: right; color: #2A2A2A;">{{getNumStr(cashFlowList[0].operating_activities.net_flow)}}</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 class="flex" style="font-size: 24rpx; font-weight: 500; margin: 20rpx;">
<view class="flex1" style="color: #999999; margin-right: 20rpx;">经营性现金流增长率</view>
<view style="text-align: right; color: #2A2A2A;">{{caculateOperatingFlowRatio()}}%</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 class="flex" style="font-size: 24rpx; font-weight: 500; margin: 20rpx;">
<view class="flex1" style="color: #999999; margin-right: 20rpx;">投资性现金流</view>
<view style="text-align: right; color: #2A2A2A;">{{getNumStr(cashFlowList[0].investment_activities.net_flow)}}</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 class="flex" style="font-size: 24rpx; font-weight: 500; margin: 20rpx;">
<view class="flex1" style="color: #999999; margin-right: 20rpx;">筹资性现金流</view>
<view style="text-align: right; color: #2A2A2A;">{{getNumStr(cashFlowList[0].financing_activities.net_flow)}}</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 class="flex" style="font-size: 24rpx; font-weight: 500; margin: 20rpx;">
<view class="flex1" style="color: #999999; margin-right: 20rpx;">合计现金流</view>
<view style="text-align: right; color: #2A2A2A;">{{getNumStr(cashFlowList[0].cash_changes.net_increase)}}</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 class="flex" style="font-size: 24rpx; font-weight: 500; margin: 20rpx;">
<view class="flex1" style="color: #999999; margin-right: 20rpx;">合计现金流增长率</view>
<view style="text-align: right; color: #2A2A2A;">{{caculateNetIncreaseRatio()}}%</view>
</view>
</view>
</view>
@@ -135,7 +129,6 @@
<image src="/static/icon/home/conceptCenter/next.png" mode="widthFix"
style="width: 13rpx; height: 22rpx;"></image>
</view>
<view class="indicatorC" style="display: grid; gap: 20rpx; grid-template-columns: repeat(3, 1fr); margin: 0 20rpx;">
<view :class="'item flexCenter '+(profitIndicatorIndex==index?'select':'')"
v-for="(item,index) in ['净利润', '营业收入', '期间费用']" :key="index" @click="clickProfitIndicatorItem(index)">
@@ -143,21 +136,19 @@
</view>
</view>
<view style="display: flex;align-items: center; padding: 20rpx;">
<view class="flex" style="padding: 20rpx;">
<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; border: 1rpx solid #D2D2D2; margin-right: 10rpx;">
<view class="flex" style="padding: 3rpx 10rpx; 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;border: 1rpx solid #D2D2D2;">
<view class="flex" style="padding: 3rpx 10rpx;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>
@@ -166,21 +157,21 @@
</view>
</view>
<view style="height: 400rpx;">
<view style="height: 500rpx;">
<l-echart ref="chartRef3"></l-echart>
</view>
<view style="background-color: #FAFAFC; border-radius: 10rpx; margin: 0 20rpx; padding: 20rpx 0;">
<view v-if="incomeStatementList.length>0" 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 class="flex" style="flex: 1; color: #999999; margin-right: 20rpx;">净利润</view>
<view style="text-align: right; color: #2A2A2A;">{{getNumStr(incomeStatementList[0].comprehensive_income.total_comprehensive_income)}}</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 class="flex" style="font-size: 24rpx; font-weight: 500; margin: 20rpx;">
<view class="flex1" style="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 class="flex" style="font-size: 24rpx; font-weight: 500; margin: 20rpx;">
<view class="flex1" style="color: #999999; margin-right: 20rpx;">营业总收入</view>
<view style="text-align: right; color: #2A2A2A;">{{getNumStr(incomeStatementList[0].revenue.total_operating_revenue)}}</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>
@@ -188,7 +179,7 @@
</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 style="text-align: right; color: #2A2A2A;">{{getNumStr(incomeStatementList[0].profit.operating_profit)}}</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>
@@ -200,7 +191,8 @@
</template>
<script>
import { getNumStr } from '../../utils/util';
import { accDiv, accMul, accSub, getNumStr } from '@/utils/util';
const echarts = require('../../uni_modules/lime-echart/static/echarts.min.js');
export default {
name:"cwsj-view",
@@ -212,7 +204,7 @@ import { getNumStr } from '../../utils/util';
option1:{
legend:{
show:true,
data:['期间费用','同比(右)']
data:['货币资金','同比(右)']
},
grid:{
left:'2%',
@@ -285,7 +277,7 @@ import { getNumStr } from '../../utils/util';
},
yAxis: [{
type: 'value',
name:'(%)',
name:'(亿)',
position:'left',
alignTicks:true,
axisLine:{
@@ -307,7 +299,7 @@ import { getNumStr } from '../../utils/util';
series: [
{
type: 'bar',
name:'ROE',
name:'经营现金流',
data: [],
yAxisIndex:0
},
@@ -322,7 +314,7 @@ import { getNumStr } from '../../utils/util';
option3:{
legend:{
show:true,
data:['期间费用','同比(右)']
data:['净利润','同比(右)']
},
grid:{
left:'2%',
@@ -340,7 +332,7 @@ import { getNumStr } from '../../utils/util';
},
yAxis: [{
type: 'value',
name:'(%)',
name:'(亿)',
position:'left',
alignTicks:true,
axisLine:{
@@ -362,7 +354,7 @@ import { getNumStr } from '../../utils/util';
series: [
{
type: 'bar',
name:'ROE',
name:'净利润',
data: [],
yAxisIndex:0
},
@@ -374,7 +366,10 @@ import { getNumStr } from '../../utils/util';
}
]
},
getNumStr:getNumStr
getNumStr:getNumStr,
accDiv:accDiv,
accSub:accSub,
accMul:accMul
};
},
props:{
@@ -383,9 +378,102 @@ import { getNumStr } from '../../utils/util';
incomeStatementList:Array, //利润表
},
watch:{
financialBalanceList(newValue) {
let category = []
let data = []
for (let item of newValue) {
category.push(item.report_type)
if(item.assets.current_assets.cash)
{
data.push(accDiv(item.assets.current_assets.cash,100000000).toFixed(2))
}else
data.push(0)
}
this.option1.xAxis.data = category
this.option1.series[0].data = data
this.profitabilityInit()
},
cashFlowList(newValue) {
let category = []
let data = []
for (let item of newValue) {
category.push(item.report_type)
if(item.operating_activities.net_flow)
{
data.push(accDiv(item.operating_activities.net_flow,100000000).toFixed(2))
}else
data.push(0)
}
this.option2.xAxis.data = category
this.option2.series[0].data = data
this.cashFlowInit()
},
incomeStatementList(newValue) {
let category = []
let data = []
for (let item of newValue) {
category.push(item.report_type)
if(item.profit.net_profit)
{
data.push(accDiv(item.profit.net_profit,1000000000).toFixed(2))
}else
data1.push(0)
}
this.option3.xAxis.data = category
this.option3.series[0].data = data
this.incomeStatementInit()
}
},
methods:{
async profitabilityInit() {
// chart 图表实例不能存在data里
const chart = await this.$refs.chartRef1.init(echarts);
// chart.on('click',function (params) {
// console.log(params)
// })
chart.setOption(this.option1)
},
async cashFlowInit() {
// chart 图表实例不能存在data里
const chart = await this.$refs.chartRef2.init(echarts);
// chart.on('click',function (params) {
// console.log(params)
// })
chart.setOption(this.option2)
},
async incomeStatementInit() {
// chart 图表实例不能存在data里
const chart = await this.$refs.chartRef3.init(echarts);
// chart.on('click',function (params) {
// console.log(params)
// })
chart.setOption(this.option3)
},
/**
* 计算经营性现金流增长率
*/
caculateOperatingFlowRatio() {
let flow1 = this.cashFlowList[0].operating_activities.net_flow
let flow2 = this.cashFlowList[4].operating_activities.net_flow
return accMul(accDiv(accSub(flow1,flow2),flow2),100).toFixed(2)
},
/**
* 计算合计现金流增长率
*/
caculateNetIncreaseRatio() {
let flow1 = this.cashFlowList[0].cash_changes.net_increase
let flow2 = this.cashFlowList[4].cash_changes.net_increase
return accMul(accDiv(accSub(flow1,flow2),flow2),100).toFixed(2)
},
/**
* 获取去年
*/
getLastYearPeriod(list)
{
let year = list[0].period.split('-')[0]
let lastYear = parseInt(year) - 1
},
/**
* 点击切换现金流量表指标
* @param {Object} index
@@ -393,6 +481,37 @@ import { getNumStr } from '../../utils/util';
clickCashFlowIndicatorItem(index) {
if(this.cashFlowIndicatorIndex!=index) {
this.cashFlowIndicatorIndex = index
let data = []
if(index==0) {
//经营现金流
for (let item of this.cashFlowList) {
if(item.operating_activities.net_flow)
{
data.push(accDiv(item.operating_activities.net_flow,100000000).toFixed(2))
}else
data.push(0)
}
}else if(index==1) {
//筹资现金流
for (let item of this.cashFlowList) {
if(item.financing_activities.net_flow)
{
data.push(accDiv(item.financing_activities.net_flow,100000000).toFixed(2))
}else
data.push(0)
}
}else if(index==2) {
//投资现金流
for (let item of this.cashFlowList) {
if(item.investment_activities.net_flow)
{
data.push(accDiv(item.investment_activities.net_flow,100000000).toFixed(2))
}else
data.push(0)
}
}
this.option2.series[0].data = data
this.cashFlowInit()
}
},
/**

View File

@@ -13,7 +13,7 @@
流向关系
</view>
</view>
<view class="bottom">
<view v-if="center_index==0" class="bottom">
<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">
@@ -84,11 +84,16 @@
</view>
</block>
</view>
</view>
<view v-if="center_index==1" style="height: 500rpx;">
<l-echart ref="chartRef"></l-echart>
</view>
</view>
</template>
<script>
<script>
const echarts = require('../../uni_modules/lime-echart/static/echarts.min.js');
export default {
name: "cyl-view",
data() {
@@ -115,15 +120,34 @@
}
],
typeIndex: 0,
option:{
legend:{
show:false,
},
grid:{
left:'2%',
right:'2%',
top:'5%',
bottom:'30%'
},
series: [
{
type: 'sankey',
name:'经营现金流',
data: [],
links:[],
}
]
},
};
},
props:{
valueChainAnalysisInfo:Object,
upstreamList:Array, //上游供应链
upstreamList:Array, //上游供应链
coreEnterpriseList:Array, //核心企业
downstreamList:Array, //下游客户
totalNodes:Number, //总节点数
valueChainFlowsList:Array //产业链流向数据
},
watch:{
valueChainAnalysisInfo(newValue)
@@ -131,11 +155,46 @@
this.types[0].count = newValue.upstream_nodes
this.types[1].count = newValue.company_nodes
this.types[2].count = newValue.downstream_nodes
},
valueChainFlowsList(newValue)
{
let data = []
let links = []
let name = []
for (let item of newValue) {
if(name.indexOf(item.source.node_name)==-1)
{
name.push(item.source.node_name)
data.push({name:item.source.node_name})
}
links.push({source: item.source.node_name, target: item.target.node_name, value: item.flow_metrics.flow_ratio})
}
this.option.series[0].data = data
this.option.series[0].links = links
}
},
methods: {
changeCenterIndex(index) {
this.center_index = index
methods: {
async init() {
// chart 图表实例不能存在data里
const chart = await this.$refs.chartRef.init(echarts);
// chart.on('click',function (params) {
// console.log(params)
// })
console.log(chart)
console.log(this.option)
chart.setOption(this.option)
},
changeCenterIndex(index) {
if(this.center_index!=index) {
this.center_index = index
if(index==1) {
let that = this
setTimeout(function() {
that.init()
}, 500);
}
}
},
clickAction(item) {
this.$emit('detail',item)