longcai/JiaZhiQianYan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

2.6 盈利能力模块表格完善

Browse Source
This commit is contained in:
尚政杰
2026-02-06 18:01:05 +08:00
parent 890be2e3e9
commit 6dc7d00e6a
48 changed files with 2831 additions and 697 deletions
Download Patch File Download Diff File Expand all files Collapse all files

771
pagesStock/components/cwfx-view/cwfx-view.vue
View File

@@ -15,16 +15,17 @@
{{item.title}}
</view>
</view>
<view class="flex" style="padding: 20rpx;">
<view class="detailOptionC 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 class="flex" style="padding: 3rpx 10rpx;border: 1rpx solid #D2D2D2;">
<image style="width: 23rpx; height: 23rpx;" src="/pagesStock/static/icon/all-icon.png"
<view :class="'option '+(profitabilitySingleQuarterAllIndex==0?'select':'')" @click="clickProfitabilitySingleQuarterOrAll(0)">单季度</view>
<view :class="'flex option '+(profitabilitySingleQuarterAllIndex==1?'select':'')" @click="clickProfitabilitySingleQuarterOrAll(1)">
<image v-if="profitabilitySingleQuarterAllIndex==1" class="icon" src="/pagesStock/static/icon/all-icon-ed.png"
mode="widthFix"></image>
<image v-else class="icon" 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>
<image v-if="profitabilitySingleQuarterAllIndex==1" class="arrow" src="/pagesStock/static/icon/all-down-ed.png" mode="widthFix"></image>
<image v-else class="arrow" src="/pagesStock/static/icon/all-down.png" mode="widthFix"></image>
</view>
</view>
<view style="height: 500rpx;">
@@ -39,7 +40,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(4, 1fr); margin: 0 20rpx;">
<view :class="'item flexCenter '+(perShareIndicatorIndex==index?'select':'')"
v-for="(item,index) in perShareIndicatorList" :key="index" @click="clickPerShareIndicatorItem(index)">
@@ -69,7 +69,9 @@
</template>
<script>
import { accAdd, accDiv, accMul, accSub, getNumStr } from '@/utils/util';
const echarts = require('../../../uni_modules/lime-echart/static/echarts.min.js');
export default {
name:"cwfx-view",
data() {
@@ -99,6 +101,7 @@
title:'成本费用利润率%'
}],
profitabilityIndicatorIndex:0,
profitabilitySingleQuarterAllIndex:0,
perShareIndicatorList:[{
title:'每股收益(EPS)',
},
@@ -124,6 +127,7 @@
title:'每股未分配利润'
}],
perShareIndicatorIndex:0,
perShareSingleQuarterAllIndex:0,
option1:{
legend:{
show:true,
@@ -135,14 +139,26 @@
top:'5%',
bottom:'30%'
},
xAxis: {
xAxis: [{
type: 'category',
data: [],
axisLabel:{
fontSize:10,
rotate:45
}
},
{
type: 'category',
data: [],
axisLine:{
show:false,
},
axisTick:{
show:false
},
axisLabel:{
show:false,
}
}],
yAxis: [{
type: 'value',
name:'(%)',
@@ -161,9 +177,9 @@
onZero:false
}
}],
dataZoom:[{
type:'slider'
}],
// dataZoom:[{
// type:'slider'
// }],
series: [
{
type: 'bar',
@@ -216,9 +232,9 @@
onZero:false
}
}],
dataZoom:[{
type:'slider'
}],
// dataZoom:[{
// type:'slider'
// }],
series: [
{
type: 'bar',
@@ -234,6 +250,9 @@
}
]
},
accDiv:accDiv,
accSub:accSub,
accMul:accMul
};
},
props: {
@@ -241,33 +260,18 @@
},
watch:{
dataList(newValue) {
let category = []
let data1 = []
let data2 = []
for (let item of newValue) {
var type = item.report_type
type = type.replace('年三季报','Q3')
type = type.replace('年一季报','Q1')
type = type.replace('年中报','中报')
type = type.replace('年年报','年报')
category.push(type)
if(item.profitability.roe)
{
data1.push(item.profitability.roe.toFixed(2))
}else
data1.push(0)
if(item.per_share_metrics.eps)
{
data2.push(item.per_share_metrics.eps.toFixed(2))
}else
data2.push(0)
if(this.profitabilitySingleQuarterAllIndex==0) {
//单季度
this.getROESingleQuarterData()
} else
{
//全部
this.getROEAllData()
}
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()
// this.option2.xAxis.data = category
// this.option2.series[0].data = data2
// this.perShareInit()
}
},
methods:{
@@ -297,14 +301,14 @@
let data = []
if(index==0) {
//净资产收益率
for (let item of this.dataList) {
if(item.profitability.roe)
{
data.push(item.profitability.roe.toFixed(2))
}else
data.push(0)
if(this.profitabilitySingleQuarterAllIndex==0) {
//单季度
this.getROESingleQuarterData()
} else
{
//全部
this.getROEAllData()
}
}else if(index==1) {
//净资产收益率(扣非)
for (let item of this.dataList) {
@@ -317,9 +321,9 @@
}else if(index==2) {
//净资产收益率(加权)
for (let item of this.dataList) {
if(item.profitability.roe_deducted)
if(item.profitability.roe_weighted)
{
data.push(item.profitability.roe_deducted.toFixed(2))
data.push(item.profitability.roe_weighted.toFixed(2))
}else
data.push(0)
}
@@ -373,6 +377,336 @@
this.profitabilityInit()
}
},
/**
* 盈利能力切换单季度还是全部
*/
clickProfitabilitySingleQuarterOrAll(index) {
if(this.profitabilitySingleQuarterAllIndex != index) {
this.profitabilitySingleQuarterAllIndex = index;
if(index==0) {
//单季度
if(this.profitabilityIndicatorIndex==0) {
//净资产收益率
this.getROESingleQuarterData()
}else if(this.profitabilityIndicatorIndex==1)
{
//净资产收益率(扣非)
this.getOwnerEquitySingleQuarterData()
}else if(this.profitabilityIndicatorIndex==2)
{
//净资产收益率(加权)
this.getOwnerEquitySingleQuarterData()
}
} else {
//全部
if(this.profitabilityIndicatorIndex==0) {
//净资产收益率
this.getROEAllData()
}else if(this.profitabilityIndicatorIndex==1)
{
//所有者权益
this.getOwnerEquityAllData()
}
}
this.profitabilityInit()
}
},
/**
* 获取净资产收益率单季度数据
*/
getROESingleQuarterData() {
let category = []
let currentYear = this.dataList[0].period.split('-')[0]
var currentYearCount = 0
for (let item of this.dataList) {
let year = item.period.split('-')[0]
if(year==currentYear) {
currentYearCount ++
}
}
let years = (16 - currentYearCount)/4
let showDataCount = years*4+currentYearCount
let showDataList = this.dataList.slice(0,showDataCount)
for (var i = 0; i <= years; i++) {
category.unshift(currentYear-i)
}
//第一季度
let data1 = []
//第二季度
let data2 = []
//第三季度
let data3 = []
//第四季度
let data4 = []
for (let item of showDataList) {
for (let item1 of category) {
let index = showDataList.indexOf(item)
let lastItem = showDataList[index+1]
if(item1+'年一季报'==item.report_type){
if(item.profitability.roe)
{
data1.unshift(item.profitability.roe.toFixed(2))
}else
data1.unshift(0)
}
if(item1+'年中报'==item.report_type){
if(item.profitability.roe)
{
data2.unshift(accSub(item.profitability.roe,lastItem.profitability.roe))
}else
data2.unshift(0)
}
if(item1+'年三季报'==item.report_type){
if(item.profitability.roe)
{
data3.unshift(accSub(item.profitability.roe,lastItem.profitability.roe))
}else
data3.unshift(0)
}
if(item1+'年年报'==item.report_type){
if(item.profitability.roe)
{
data4.unshift(accSub(item.profitability.roe,lastItem.profitability.roe))
}else
data4.unshift(0)
}
}
}
console.log(data1,data2,data3,data4)
let sumData = []
for (var i = 0; i < data1.length; i++) {
let sum = data1[i]
sum = accAdd(sum,data2[i]?data2[i]:0)
sum = accAdd(sum,data3[i]?data3[i]:0)
sum = accAdd(sum,data4[i]?data4[i]:0).toFixed(2)
if(sum>10000) {
sumData.push((sum/10000).toFixed(2)+'万')
}else
sumData.push(sum)
}
this.option1.legend.data = ['第一季度','第二季度','第三季度','第四季度']
this.option1.xAxis[0].data = category
this.option1.xAxis[1].data = category
this.option1.series = [{
type: 'bar',
name:'第一季度',
barWidth:'15%',
data: data1,
yAxisIndex:0
},
{
type: 'bar',
name:'第二季度',
barWidth:'15%',
data: data2,
yAxisIndex:0
},
{
type: 'bar',
name:'第三季度',
barWidth:'15%',
data: data3,
yAxisIndex:0
},
{
type: 'bar',
name:'第四季度',
barWidth:'15%',
data: data4,
yAxisIndex:0,
},
{
type: 'bar',
name:'总值',
data: sumData,
barWidth:'70%',
xAxisIndex:1,
yAxisIndex:0,
itemStyle:{
color:'rgba(0,0,0,0.2)',
},
label:{
show:true,
position:'top'
}
}]
},
/**
* 获取净资产收益率全部数据
*/
getROEAllData() {
let showDataList = this.dataList.slice(0,8)
let category = []
let data1 = []
let data2 = []
let data3 = []
let data4 = []
for (let item of showDataList) {
let index = showDataList.indexOf(item)
if(index<showDataList.length-3)
{
let type = item.report_type
type = type.replaceAll('三季报','\n三季报')
type = type.replaceAll('年报','\n年报')
type = type.replaceAll('中报','\n中报')
type = type.replaceAll('一季报','\n一季报')
category.unshift(type)
let lastItem1 = showDataList[index+1]
let lastItem2 = showDataList[index+2]
let lastItem3 = showDataList[index+3]
if(item.report_type.indexOf('三季报')>-1)
{
if(item.profitability.roe)
{
data4.unshift(0)
data3.unshift(accSub(item.profitability.roe,lastItem1.profitability.roe).toFixed(2))
data2.unshift(accDiv(accSub(lastItem1.profitability.roe,lastItem2.profitability.roe),100000000).toFixed(2))
data1.unshift(accDiv(lastItem2.profitability.roe,100000000).toFixed(2))
}else
{
data4.unshift(0)
data3.unshift(0)
data2.unshift(0)
data1.unshift(0)
}
}else if(item.report_type.indexOf('中报')>-1)
{
if(item.profitability.roe)
{
data4.unshift(0)
data3.unshift(0)
data2.unshift(accDiv(accSub(item.profitability.roe,lastItem1.profitability.roe),100000000).toFixed(2))
data1.unshift(accDiv(lastItem1.profitability.roe,100000000).toFixed(2))
}else
{
data4.unshift(0)
data3.unshift(0)
data2.unshift(0)
data1.unshift(0)
}
}else if(item.report_type.indexOf('一季报')>-1)
{
if(item.profitability.roe)
{
data4.unshift(0)
data3.unshift(0)
data2.unshift(0)
data1.unshift(accDiv(item.profitability.roe,100000000).toFixed(2))
}else
{
data4.unshift(0)
data3.unshift(0)
data2.unshift(0)
data1.unshift(0)
}
}else if(item.report_type.indexOf('年报')>-1)
{
if(item.profitability.roe)
{
data4.unshift(accDiv(accSub(item.profitability.roe,lastItem1.profitability.roe),100000000).toFixed(2))
data3.unshift(accDiv(accSub(lastItem1.profitability.roe,lastItem2.profitability.roe),100000000).toFixed(2))
data2.unshift(accDiv(accSub(lastItem2.profitability.roe,lastItem3.profitability.roe),100000000).toFixed(2))
data1.unshift(accDiv(lastItem3.profitability.roe,100000000).toFixed(2))
}else
{
data4.unshift(0)
data3.unshift(0)
data2.unshift(0)
data1.unshift(0)
}
}
}
}
let sumData = []
for (var i = 0; i < data1.length; i++) {
let sum = data1[i]
sum = accAdd(sum,data2[i])
sum = accAdd(sum,data3[i])
sum = accAdd(sum,data4[i]).toFixed(2)
if(sum>10000) {
sumData.push((sum/10000).toFixed(2)+'万')
}else
sumData.push(sum)
}
this.option1.xAxis[0].data = category
let ratioList = []
for (let item of showDataList) {
let index = showDataList.indexOf(item)
if(index<showDataList.length-3)
{
let lastItem = this.dataList[index+4]
ratioList.unshift(accMul(accDiv(accSub(item.profitability.roe,lastItem.profitability.roe),Math.abs(lastItem.profitability.roe)),100).toFixed(2))
}
}
this.option1.tooltip = {
show:true,
confine:true,
formatter(params) {
let index = params.dataIndex
let str = params.name+':'+sumData[index]
if(data1[index]!=0)
{
str += '\n第一季度：'+data1[index]
}
if(data2[index]!=0)
{
str += '\n第二季度：'+data2[index]
}
if(data3[index]!=0)
{
str += '\n第三季度：'+data3[index]
}
if(data4[index]!=0)
{
str += '\n第四季度：'+data4[index]
}
str += '\n同比(右)'+ratioList[index]
return str
}
}
this.option1.series = [{
type: 'bar',
name:'第一季度',
data: data1,
stack:'quarter',
yAxisIndex:0,
label:{
show:true,
position:'top',
formatter(params) {
return sumData[params.dataIndex]
}
}
},
{
type: 'bar',
name:'第二季度',
data: data2,
stack:'quarter',
yAxisIndex:0
},
{
type: 'bar',
name:'第三季度',
data: data3,
yAxisIndex:0,
stack:'quarter',
},
{
type: 'bar',
name:'第四季度',
data: data4,
yAxisIndex:0,
stack:'quarter',
},
{
type: 'line',
name:'同比(右)',
data: ratioList,
yAxisIndex:1,
}]
},
/**
* 切换每股指标
* @param {Object} item
@@ -457,7 +791,313 @@
this.option2.series[0].data = data
this.perShareInit()
}
}
},
/**
* 获取期间费用单季度数据
*/
getPeriodExpensesSingleQuarterData() {
let category = []
let currentYear = this.incomeStatementList[0].period.split('-')[0]
var currentYearCount = 0
for (let item of this.incomeStatementList) {
let year = item.period.split('-')[0]
if(year==currentYear) {
currentYearCount ++
}
}
let years = (16 - currentYearCount)/4
let showDataCount = years*4+currentYearCount
let showDataList = this.incomeStatementList.slice(0,showDataCount)
for (var i = 0; i <= years; i++) {
category.unshift(currentYear-i)
}
//第一季度
let data1 = []
//第二季度
let data2 = []
//第三季度
let data3 = []
//第四季度
let data4 = []
for (let item of showDataList) {
for (let item1 of category) {
let index = showDataList.indexOf(item)
let lastItem = showDataList[index+1]
let total1 = accAdd(accAdd(accAdd(item.costs.selling_expenses,item.costs.admin_expenses), item.costs.rd_expenses), item.costs.financial_expenses)
let total2 = 0
if(lastItem)
{
total2 = accAdd(accAdd(accAdd(lastItem.costs.selling_expenses,lastItem.costs.admin_expenses), lastItem.costs.rd_expenses), lastItem.costs.financial_expenses)
}
if(item1+'年一季报'==item.report_type){
if(total1)
{
data1.unshift(accDiv(total1,100000000).toFixed(2))
}else
data1.unshift(0)
}
if(item1+'年中报'==item.report_type){
if(total1&&total2)
{
data2.unshift(accDiv(accSub(total1,total2),100000000).toFixed(2))
}else
data2.unshift(0)
}
if(item1+'年三季报'==item.report_type){
if(total1&&total2)
{
data3.unshift(accDiv(accSub(total1,total2),100000000).toFixed(2))
}else
data3.unshift(0)
}
if(item1+'年年报'==item.report_type){
if(total1&&total2)
{
data4.unshift(accDiv(accSub(total1,total2),100000000).toFixed(2))
}else
data4.unshift(0)
}
}
}
let sumData = []
for (var i = 0; i < data1.length; i++) {
let sum = data1[i]
sum = accAdd(sum,data2[i]?data2[i]:0)
sum = accAdd(sum,data3[i]?data3[i]:0)
sum = accAdd(sum,data4[i]?data4[i]:0).toFixed(2)
if(sum>10000) {
sumData.push((sum/10000).toFixed(2)+'万')
}else
sumData.push(sum)
}
this.option2.legend.data = ['第一季度','第二季度','第三季度','第四季度']
this.option3.xAxis[0].data = category
this.option3.xAxis[1].data = category
this.option3.series = [{
type: 'bar',
name:'第一季度',
barWidth:'15%',
data: data1,
yAxisIndex:0
},
{
type: 'bar',
name:'第二季度',
barWidth:'15%',
data: data2,
yAxisIndex:0
},
{
type: 'bar',
name:'第三季度',
barWidth:'15%',
data: data3,
yAxisIndex:0
},
{
type: 'bar',
name:'第四季度',
barWidth:'15%',
data: data4,
yAxisIndex:0,
},
{
type: 'bar',
name:'总值',
data: sumData,
barWidth:'70%',
xAxisIndex:1,
yAxisIndex:0,
itemStyle:{
color:'rgba(0,0,0,0.2)',
},
label:{
show:true,
position:'top'
}
}]
},
/**
* 获取期间费用全部数据
*/
getPeriodExpensesAllData() {
let showDataList = this.incomeStatementList.slice(0,8)
let category = []
let data1 = []
let data2 = []
let data3 = []
let data4 = []
for (let item of showDataList) {
let index = showDataList.indexOf(item)
if(index<showDataList.length-3)
{
let type = item.report_type
type = type.replaceAll('三季报','\n三季报')
type = type.replaceAll('年报','\n年报')
type = type.replaceAll('中报','\n中报')
type = type.replaceAll('一季报','\n一季报')
category.unshift(type)
let lastItem1 = showDataList[index+1]
let lastItem2 = showDataList[index+2]
let lastItem3 = showDataList[index+3]
let total1 = accAdd(accAdd(accAdd(item.costs.selling_expenses,item.costs.admin_expenses), item.costs.rd_expenses), item.costs.financial_expenses)
let total2 = accAdd(accAdd(accAdd(lastItem1.costs.selling_expenses,lastItem1.costs.admin_expenses), lastItem1.costs.rd_expenses), lastItem1.costs.financial_expenses)
let total3 = accAdd(accAdd(accAdd(lastItem2.costs.selling_expenses,lastItem2.costs.admin_expenses), lastItem2.costs.rd_expenses), lastItem2.costs.financial_expenses)
let total4 = accAdd(accAdd(accAdd(lastItem3.costs.selling_expenses,lastItem3.costs.admin_expenses), lastItem3.costs.rd_expenses), lastItem3.costs.financial_expenses)
if(item.report_type.indexOf('三季报')>-1)
{
if(total1&&total2&&total3)
{
data4.unshift(0)
data3.unshift(accDiv(accSub(total1,total2),100000000).toFixed(2))
data2.unshift(accDiv(accSub(total2,total3),100000000).toFixed(2))
data1.unshift(accDiv(total3,100000000).toFixed(2))
}else
{
data4.unshift(0)
data3.unshift(0)
data2.unshift(0)
data1.unshift(0)
}
}else if(item.report_type.indexOf('中报')>-1)
{
if(total1&&total2)
{
data4.unshift(0)
data3.unshift(0)
data2.unshift(accDiv(accSub(total1,total2),100000000).toFixed(2))
data1.unshift(accDiv(total2,100000000).toFixed(2))
}else
{
data4.unshift(0)
data3.unshift(0)
data2.unshift(0)
data1.unshift(0)
}
}else if(item.report_type.indexOf('一季报')>-1)
{
if(total1)
{
data4.unshift(0)
data3.unshift(0)
data2.unshift(0)
data1.unshift(accDiv(total1,100000000).toFixed(2))
}else
{
data4.unshift(0)
data3.unshift(0)
data2.unshift(0)
data1.unshift(0)
}
}else if(item.report_type.indexOf('年报')>-1)
{
if(total1&&total2&&total3&&total4)
{
data4.unshift(accDiv(accSub(total1,total2),100000000).toFixed(2))
data3.unshift(accDiv(accSub(total2,total3),100000000).toFixed(2))
data2.unshift(accDiv(accSub(total3,total4),100000000).toFixed(2))
data1.unshift(accDiv(total4,100000000).toFixed(2))
}else
{
data4.unshift(0)
data3.unshift(0)
data2.unshift(0)
data1.unshift(0)
}
}
}
}
let sumData = []
for (var i = 0; i < data1.length; i++) {
let sum = data1[i]
sum = accAdd(sum,data2[i])
sum = accAdd(sum,data3[i])
sum = accAdd(sum,data4[i]).toFixed(2)
if(sum>10000) {
sumData.push((sum/10000).toFixed(2)+'万')
}else
sumData.push(sum)
}
this.option3.xAxis[0].data = category
let ratioList = []
for (let item of showDataList) {
let index = showDataList.indexOf(item)
if(index<showDataList.length-3)
{
let lastItem = this.incomeStatementList[index+4]
let total1 = accAdd(accAdd(accAdd(item.costs.selling_expenses,item.costs.admin_expenses), item.costs.rd_expenses), item.costs.financial_expenses)
let total2 = accAdd(accAdd(accAdd(lastItem.costs.selling_expenses,lastItem.costs.admin_expenses), lastItem.costs.rd_expenses), lastItem.costs.financial_expenses)
ratioList.unshift(accMul(accDiv(accSub(total1,total2),Math.abs(total2)),100).toFixed(2))
}
}
this.option3.tooltip = {
show:true,
confine:true,
formatter(params) {
let index = params.dataIndex
let str = params.name+':'+sumData[index]
if(data1[index]!=0)
{
str += '\n第一季度：'+data1[index]
}
if(data2[index]!=0)
{
str += '\n第二季度：'+data2[index]
}
if(data3[index]!=0)
{
str += '\n第三季度：'+data3[index]
}
if(data4[index]!=0)
{
str += '\n第四季度：'+data4[index]
}
str += '\n同比(右)'+ratioList[index]
return str
}
}
this.option3.series = [{
type: 'bar',
name:'第一季度',
data: data1,
stack:'quarter',
yAxisIndex:0,
label:{
show:true,
position:'top',
formatter(params) {
return sumData[params.dataIndex]
}
}
},
{
type: 'bar',
name:'第二季度',
data: data2,
stack:'quarter',
yAxisIndex:0
},
{
type: 'bar',
name:'第三季度',
data: data3,
yAxisIndex:0,
stack:'quarter',
},
{
type: 'bar',
name:'第四季度',
data: data4,
yAxisIndex:0,
stack:'quarter',
},
{
type: 'line',
name:'同比(右)',
data: ratioList,
yAxisIndex:1,
}]
},
}
}
</script>
@@ -481,4 +1121,33 @@
color: #BB8520;
}
}
.detailOptionC
{
.option
{
margin: 0 10rpx;
line-height: 36rpx;
padding: 0 10rpx;
border-radius: 5rpx;
border: 1rpx solid #D2D2D2;
font-size: 22rpx;
color: #999999;
text-align: center;
.icon
{
width: 23rpx;
height: auto;
}
.arrow
{
width: 11rpx;
height: auto;
}
}
.option.select
{
border: solid 1rpx #F2C369;
color: #F2C369;
}
}
</style>

12
pagesStock/components/cwsj-view/cwsj-view.vue
View File

@@ -2818,7 +2818,7 @@
}else
sumData.push(sum)
}
this.option2.legend.data = ['第一季度','第二季度','第三季度','第四季度']
this.option3.legend.data = ['第一季度','第二季度','第三季度','第四季度']
this.option3.xAxis[0].data = category
this.option3.xAxis[1].data = category
this.option3.series = [{
@@ -3104,6 +3104,16 @@
font-size: 22rpx;
color: #999999;
text-align: center;
.icon
{
width: 23rpx;
height: auto;
}
.arrow
{
width: 11rpx;
height: auto;
}
}
.option.select
{

252
pagesStock/stockCenterDetails/cwDetails.vue
View File

@@ -1,252 +0,0 @@
<template>
<view>
<navBar leftText="平安银行(000001)" :hideNavBg="true"></navBar>
<image class="topBg absolute" src="/static/image/index/conceptTopBg.png" mode="widthFix"></image>
<view class="stockDetailsC fixed" :style="'top:'+contentTop+'px;'">
<view style="margin: 0 20rpx; height: 99rpx;">
<scroll-view scroll-x style="white-space: nowrap;" scroll-with-animation="true"
:scroll-into-view="'tab-' + activeIndex" show-scrollbar="false">
<view style="display: inline-block; box-sizing: border-box;">
<view @click="activeIndex = index" v-for="(item,index) in tabList" :key="index"
:id="'tab-' + index" style="display: inline-block; text-align: center; line-height: 98rpx;"
:style="{'margin-right': (index == tabList.length - 1 ? '0' : '40rpx'), color: (activeIndex == index ? '#2B2B2B' : '#999999'), 'font-size': (activeIndex == index ? '28rpx' : '26rpx'), 'border-bottom': (activeIndex == index ? '1rpx solid #F2C369' : 'none'), 'font-weight': (activeIndex == index ? 'bold' : '500')}">
{{item}}
</view>
</view>
</scroll-view>
</view>
<view style="height: 1rpx; background-color: #E7E7E7; margin: 0 20rpx;"></view>
<view style="height: 84rpx; display: flex; align-items: center; margin: 0 20rpx;">
<view style="flex: 1; display: grid; gap: 28rpx; overflow: scroll; white-space: nowrap; margin-right: 20rpx;" :style="{'grid-template-columns': `repeat(${filterList.length}, 110rpx)`}">
<view @click="filterIndex = index" v-for="(item,index) in filterList" :key="index" style="height: 45rpx; margin-top: 30rpx; font-size: 24rpx; color: #070707; font-weight: 500; display: flex; align-items: center; justify-content: center; color: #939393; background-color: #F6F6F6; font-size: 22rpx; font-weight: 500; border-radius: 5rpx; padding: 3rpx 10rpx;" :style="{color: (filterIndex == index ? '#070707' : '#939393'), 'background-color': (filterIndex == index ? '#F2C369' : '#F6F6F6')}">
{{item}}
</view>
</view>
<view style="color: #F2C369; font-size: 22rpx; font-weight: 500; border: 1rpx solid #F2C369; border-radius: 5rpx; padding: 0 10rpx; height: 43rpx; display: flex; align-items: center; justify-content: center;">
<text>最近8期</text>
<image style="width: 11rpx; height: 6rpx; margin-left: 10rpx;" src="/pagesStock/static/icon/all-down-ed.png" mode="widthFix"></image>
</view>
</view>
</view>
<scroll-view scroll-y class="stockDetailsC fixed" :style="'top:'+(otherTop)+'px;'">
<view style="display: flex; color: #666666; font-size: 20rpx; font-weight: 500; margin: 0 20rpx;">
<view>
<view style="height: 60rpx; background-color: #FAFAFC;"></view>
<view v-for="(item,index) in leftList" :key="index" style="line-height: 60rpx; padding-right: 20rpx;" :style="{'background-color' : (index % 2 == 0 ? '#fff' : '#FAFAFC')}">
{{item}}
</view>
</view>
<view style="flex: 1; white-space: nowrap; overflow: scroll; display: flex;">
<view v-for="(item,index) in 8" :key="index" style="font-size: 18rpx; text-align: center;">
<view style="padding: 0 10rpx; line-height: 60rpx; background-color: #FAFAFC;">2025Q3</view>
<view v-for="(item,index) in leftList" :key="index" style="line-height: 60rpx;" :style="{'background-color' : (index % 2 == 0 ? '#fff' : '#FAFAFC')}">
1.87
</view>
</view>
</view>
</view>
</scroll-view>
<view class="bottomC fixed flex">
<view class="inputC flex1">
<input type="text" v-model="eventComment" placeholder="对比股票..." placeholder-style="color:#666"
confirm-type="send" @confirm="sendEventComment()" />
</view>
<view class="contrastShareC flex">
<view class="item">
<image class="icon" src="/pagesStock/static/icon/contrast.png" mode="heightFix"></image>
<view>对比</view>
</view>
<view class="item" @click="clickComment()">
<image class="icon" src="/pagesStock/static/icon/optional.png" mode="heightFix"></image>
<view>自选</view>
</view>
<view class="item" @click="clickFollow()">
<image class="icon" src="/pagesStock/static/icon/share.png" mode="heightFix"></image>
<view>分享</view>
</view>
</view>
</view>
</view>
</template>
<script>
import {
inject
} from 'vue'
export default {
data() {
return {
navH: inject('navHeight'),
contentTop: '',
otherTop: '',
activeIndex: 0,
tabList: ['盈利能力', '每股指标', '成长能力', '资产负债表', '现金流量指标'],
filterIndex: 0,
filterList: ['全部','年报','中报','一季度','三季度'],
leftList: ['营收增长率%', '净利润增长率%', '扣非净利润增长率%', '归母净利润增长率%', '经营现金流增长率%', '总资产增长率%', '净资产增长率%', '固定']
}
},
onLoad(e) {
this.activeIndex = e.index
this.contentTop = this.navH + 20 / 750 * inject('windowWidth')
this.otherTop = this.navH + 204 / 750 * inject('windowWidth')
},
methods: {
}
}
</script>
<style lang="less">
page {
background-color: #070707;
}
.topBg {
top: 0;
left: 0;
width: 100%;
height: auto;
}
.stockDetailsC {
left: 25rpx;
width: calc(100vw - 50rpx);
background-color: white;
border-radius: 10rpx 10rpx 0 0;
overflow: hidden;
bottom: calc(20rpx + 70rpx + 20rpx + env(safe-area-inset-bottom));
}
.bottomC {
background-color: black;
padding: 20rpx 25rpx calc(20rpx + env(safe-area-inset-bottom));
left: 0;
right: 0;
bottom: 0;
.inputC {
background-color: #424143;
margin-right: 20rpx;
padding: 0 33rpx;
height: 70rpx;
border-radius: 35rpx;
input {
height: 100%;
font-size: 26rpx;
font-weight: 500;
}
}
.contrastShareC {
.item {
font-size: 24rpx;
font-weight: 500;
color: #FEFAF6;
text-align: center;
.icon {
margin: 0 30rpx;
width: auto;
height: 26rpx;
}
}
}
}
.industryRankPop {
background-color: white;
border-radius: 20rpx 20rpx 0 0;
.popTitle {
margin: 0 20rpx;
line-height: 100rpx;
border-bottom: solid 1rpx #E7E7E7;
font-size: 35rpx;
font-weight: bold;
color: #333;
text-align: center;
}
.closeC {
top: 0;
right: 0;
padding: 40rpx 26rpx;
.icon {
display: block;
width: 20rpx;
height: auto;
}
}
.sectionDateC {
padding: 30rpx 26rpx;
.section {
margin-right: 11rpx;
font-size: 28rpx;
font-weight: bold;
color: #2B2B2B;
}
.industryC {
background-color: #FFF7E9;
padding: 0 15rpx;
line-height: 34rpx;
border: solid 1rpx #F2C369;
border-radius: 18rpx;
font-size: 20rpx;
font-weight: 500;
color: #F2C369;
.icon {
margin-right: 3rpx;
width: 16rpx;
height: auto;
}
}
.date {
font-size: 24rpx;
font-weight: 500;
color: #71675D;
}
}
.list {
padding: 0 25rpx;
.item {
margin: 0 20rpx 20rpx 0;
width: calc((100% - 40rpx)/2);
border: solid 1rpx #FCE2B2;
border-radius: 10rpx;
}
.item:nth-child(3n) {
margin-right: 0;
}
}
.detailPopup {
height: 70%;
background-color: white;
border-radius: 20rpx 20rpx 0 0;
padding-bottom: env(safe-area-inset-bottom);
}
}
</style>

418
pagesStock/stockCenterDetails/cwDetails/cwDetails.vue Normal file
View File

@@ -0,0 +1,418 @@
<template>
<view>
<navBar leftText="平安银行(000001)" :hideNavBg="true"></navBar>
<image class="topBg absolute" src="/static/image/index/conceptTopBg.png" mode="widthFix"></image>
<view class="stockDetailsC fixed" :style="'top:'+contentTop+'px;'">
<view style="margin: 0 20rpx; height: 99rpx;">
<scroll-view id="topCategory" scroll-x style="white-space: nowrap;" scroll-with-animation
:scroll-left="topScrollLeft" show-scrollbar="false">
<view style="display: inline-block;">
<view v-for="(item,index) in tabList" :key="index"
:id="'tab-' + index" style="display: inline-block; text-align: center; line-height: 98rpx;"
:style="{'margin-right': (index == tabList.length - 1 ? '0' : '40rpx'), color: (activeIndex == index ? '#2B2B2B' : '#999999'), 'font-size': (activeIndex == index ? '28rpx' : '26rpx'), 'border-bottom': (activeIndex == index ? '1rpx solid #F2C369' : 'none'), 'font-weight': (activeIndex == index ? 'bold' : '500')}" @click="clickTabItem($event,index)">
{{item}}
</view>
</view>
</scroll-view>
</view>
<view style="height: 1rpx; background-color: #E7E7E7; margin: 0 20rpx;"></view>
<view class="flex" style="margin: 20rpx 20rpx 0;">
<scroll-view id="filterList" class="filterList" scroll-x :scroll-left="secondScrollLeft">
<view :class="'item flexCenter '+(filterIndex==index?'select':'')" v-for="(item,index) in filterList" :key="index" @click="clickFilterItem($event,index)">
{{item}}
</view>
</scroll-view>
<view class="flexCenter" style="color: #F2C369; font-size: 22rpx; font-weight: 500; border: 1rpx solid #F2C369; border-radius: 5rpx; padding: 0 10rpx; height: 43rpx;" @click="clickSelectPeriod($event)">
<text>{{periodList[periodIndex].title}}</text>
<image style="width: 11rpx; height: 6rpx; margin-left: 10rpx;" src="/pagesStock/static/icon/all-down-ed.png" mode="widthFix"></image>
</view>
</view>
</view>
<scroll-view scroll-y class="stockDetailsC fixed" :style="'top:'+(otherTop)+'px;'">
<view style="display: flex; color: #666666; font-size: 20rpx; font-weight: 500; margin: 0 20rpx;">
<view>
<view style="height: 60rpx; background-color: #FAFAFC;"></view>
<view v-for="(item,index) in leftList[activeIndex]" :key="index" style="line-height: 60rpx; padding-right: 20rpx;" :style="{'background-color' : (index % 2 == 0 ? '#fff' : '#FAFAFC')}">
{{item}}
</view>
</view>
<view style="flex: 1; white-space: nowrap; overflow: scroll; display: flex;">
<view v-for="(item,index) in showDataList" :key="index" style="font-size: 18rpx; text-align: center;">
<view style="padding: 0 10rpx; line-height: 60rpx; background-color: #FAFAFC;">{{item.report_type}}</view>
<view v-for="(litem,lindex) in leftList[activeIndex]" :key="lindex" style="line-height: 60rpx;" :style="{'background-color' : (lindex % 2 == 0 ? '#fff' : '#FAFAFC')}">
<block v-if="activeIndex==0">
<!-- 盈利能力 -->
<block v-if="lindex==0">
{{showDataList[index].profitability.roe?showDataList[index].profitability.roe.toFixed(2):'-'}}
</block>
<block v-if="lindex==1">
{{showDataList[index].profitability.roe_deducted?showDataList[index].profitability.roe_deducted.toFixed(2):'-'}}
</block>
<block v-if="lindex==2">
{{showDataList[index].profitability.roe_weighted?showDataList[index].profitability.roe_weighted.toFixed(2):'-'}}
</block>
<block v-if="lindex==3">
{{showDataList[index].profitability.roa?showDataList[index].profitability.roa.toFixed(2):'-'}}
</block>
<block v-if="lindex==4">
{{showDataList[index].profitability.gross_margin?showDataList[index].profitability.gross_margin.toFixed(2):'-'}}
</block>
<block v-if="lindex==5">
{{showDataList[index].profitability.net_profit_margin?showDataList[index].profitability.net_profit_margin.toFixed(2):'-'}}
</block>
<block v-if="lindex==6">
{{showDataList[index].profitability.operating_profit_margin?showDataList[index].profitability.operating_profit_margin.toFixed(2):'-'}}
</block>
<block v-if="lindex==7">
{{showDataList[index].profitability.cost_profit_ratio?showDataList[index].profitability.cost_profit_ratio.toFixed(2):'-'}}
</block>
<block v-if="lindex==8">
{{showDataList[index].profitability.ebit?showDataList[index].profitability.ebit.toFixed(2):'-'}}
</block>
</block>
</view>
</view>
</view>
</view>
</scroll-view>
<!-- <view class="bottomC fixed flex">
<view class="inputC flex1">
<input type="text" v-model="eventComment" placeholder="对比股票..." placeholder-style="color:#666"
confirm-type="send" @confirm="sendEventComment()" />
</view>
<view class="contrastShareC flex">
<view class="item">
<image class="icon" src="/pagesStock/static/icon/contrast.png" mode="heightFix"></image>
<view>对比</view>
</view>
<view class="item" @click="clickComment()">
<image class="icon" src="/pagesStock/static/icon/optional.png" mode="heightFix"></image>
<view>自选</view>
</view>
<view class="item" @click="clickFollow()">
<image class="icon" src="/pagesStock/static/icon/share.png" mode="heightFix"></image>
<view>分享</view>
</view>
</view>
</view> -->
<view v-if="periodShow" class="periodList fixed" :style="'top:'+periodTop+'px'">
<view class="item" v-for="(item,index) in periodList" :key="index" @click="clickPeriodItem(index)">
{{item.title}}
</view>
</view>
</view>
</template>
<script>
import { inject } from 'vue'
import { financialMetrics, financialBalanceSheet, cashflowSheet, incomeStatementSheet } from '@/request/api'
export default {
data() {
return {
navH: inject('navHeight'),
windowWidth:inject('windowWidth'),
contentTop: '',
otherTop: '',
stockCode:'000001', //股票代码
tabList: ['盈利能力', '每股指标', '成长能力', '资产负债表', '现金流量指标','现金流量表'],
activeIndex: 0,
topScrollWidth:0,
topScrollLeft:0,
filterList: ['全部','年报','中报','一季度','三季度'],
filterIndex: 0,
secondScrollWidth:0,
secondScrollLeft:0,
periodList: [{
title:'最近4期',
period:4
},
{
title:'最近8期',
period:8
},
{
title:'最近12期',
period:12
},
{
title:'最近16期',
period:16
}],
periodIndex:1,
periodTop:'',
periodShow:false, //是否显示弹窗
leftList: [
['净资产收益率(ROE)%', '净资产收益率(扣非)%', '净资产收益率(加权)%', '总资产报酬率(ROA)%', '毛利率%', '净利率%', '营业利润率%', '成本费用利润率%','EBIT'],
['每股收益(EPS)%', '基本每股收益', '稀释每股收益', '扣非每股收益', '每股净资产', '每股经营现金流', '每股资本公积', '每股未分配利润'],
['营收增长率%', '净利润增长率%', '扣非净利润增长率%', '归母净利润增长率%', '经营现金流增长率%', '总资产增长率%', '净资产增长率%', '固定资产增长率%'],
['营收增长率%', '净利润增长率%', '扣非净利润增长率%', '归母净利润增长率%', '经营现金流增长率%', '总资产增长率%', '净资产增长率%', '固定资产增长率%'],
['货币资金', '交易性金融资产', '应收票据', '营收账款', '预付款项', '其他应收款', '存货', '存货','其他流动资产'],
['经营现金流净额', '销售收现', '购买支付现金', '投资现金流净额', '筹资现金流净额', '现金净增加额','期末现金余额','自由现金流'],
],
financialMetricsList:[],
showDataList:[],
}
},
onLoad(e) {
if(e.index) {
this.activeIndex = e.index
}
if(e.code) {
this.stockCode = e.code
}
this.contentTop = this.navH + 20 / 750 * inject('windowWidth')
this.otherTop = this.navH + 204 / 750 * inject('windowWidth')
this.getFinancialMetricsData()
},
onReady() {
uni.createSelectorQuery().select('#topCategory').boundingClientRect(rect=>{
this.topScrollWidth = Math.round(rect.width)
}).exec()
uni.createSelectorQuery().select('#filterList').boundingClientRect(rect=>{
if(rect)
{
this.secondScrollWidth = Math.round(rect.width)
}
}).exec()
},
methods: {
clickTabItem(e,index) {
if(this.activeIndex!=index) {
this.activeIndex = index
let offsetLeft = e.currentTarget.offsetLeft
this.topScrollLeft = offsetLeft - this.topScrollWidth/2
}
},
/**
* 点击选择筛选项
* @param {Object} index
*/
clickFilterItem(e,index) {
if(this.filterIndex!=index) {
this.filterIndex = index
let offsetLeft = e.currentTarget.offsetLeft
this.secondScrollLeft = offsetLeft - this.secondScrollWidth/2
if(this.activeIndex==0||this.activeIndex==1||this.activeIndex==2||this.activeIndex==4) {
this.getFinancialMetricsData()
}
}
},
/**
* 点击选择期数
* @param {Object} e
*/
clickSelectPeriod(e)
{
this.periodTop = e.currentTarget.offsetTop+this.navH+(70+10)/750*this.windowWidth
this.periodShow = true
},
/**
* 点击选择期数
* @param {Object} index
*/
clickPeriodItem(index) {
if(this.periodIndex!=index) {
this.periodIndex = index
this.periodShow = false
}
},
/**
* 获取财务指标数据
*/
getFinancialMetricsData()
{
let code = this.stockCode
let period = this.periodList[this.periodIndex].period
let param = {limit:period}
financialMetrics(code,param).then(res=>{
this.financialMetricsList = res.data
this.getFinancialMetricsShowData()
}).catch(error=>{
})
},
getFinancialMetricsShowData(){
let data = []
if (this.filterIndex==0) {
data = this.financialMetricsList
}else if (this.filterIndex==1) {
//年报
for (let item of this.financialMetricsList) {
if (item.report_type.indexOf('年报')>-1)
{
data.push(item)
}
}
}else if (this.filterIndex==2) {
for (let item of this.financialMetricsList) {
if (item.report_type.indexOf('中报')>-1)
{
data.push(item)
}
}
}else if (this.filterIndex==3) {
for (let item of this.financialMetricsList) {
if (item.report_type.indexOf('一季报')>-1)
{
data.push(item)
}
}
}else if (this.filterIndex==4) {
for (let item of this.financialMetricsList) {
if (item.report_type.indexOf('三季报')>-1)
{
data.push(item)
}
}
}
this.showDataList = data
console.log(this.showDataList)
},
/**
* 获取资产负债表数据
*/
getFinancialBalanceSheetData()
{
let code = this.stockCode
let period = this.periodList[this.periodIndex].period
let param = {limit:period}
financialBalanceSheet(code,param).then(res=>{
this.financialBalanceList = res.data
}).catch(error=>{
})
},
/**
* 获取现金流量表数据
*/
getCashFlowSheetData()
{
let code = this.stockCode
let period = this.periodList[this.periodIndex].period
let param = {limit:period}
cashflowSheet(code,param).then(res=>{
this.cashFlowList = res.data
}).catch(error=>{
})
},
/**
* 获取利润表数据
*/
getIncomeStatementSheetData()
{
let code = this.stockCode
let period = this.periodList[this.periodIndex].period
let param = {limit:period}
incomeStatementSheet(code,param).then(res=>{
this.incomeStatementList = res.data
}).catch(error=>{
})
},
}
}
</script>
<style lang="less">
page {
background-color: #070707;
}
.topBg {
top: 0;
left: 0;
width: 100%;
height: auto;
}
.stockDetailsC {
left: 25rpx;
width: calc(100vw - 50rpx);
background-color: white;
border-radius: 10rpx 10rpx 0 0;
overflow: hidden;
bottom: calc(20rpx + 70rpx + 20rpx + env(safe-area-inset-bottom));
}
.bottomC {
background-color: black;
padding: 20rpx 25rpx calc(20rpx + env(safe-area-inset-bottom));
left: 0;
right: 0;
bottom: 0;
.inputC {
background-color: #424143;
margin-right: 20rpx;
padding: 0 33rpx;
height: 70rpx;
border-radius: 35rpx;
input {
height: 100%;
font-size: 26rpx;
font-weight: 500;
}
}
.contrastShareC {
.item {
font-size: 24rpx;
font-weight: 500;
color: #FEFAF6;
text-align: center;
.icon {
margin: 0 30rpx;
width: auto;
height: 26rpx;
}
}
}
}
.filterList {
margin-right: 20rpx;
white-space: nowrap;
width: calc(100% - 150rpx);
.item
{
display: inline-block;
margin-right: 28rpx;
background-color: #F6F6F6;
padding: 0 10rpx;
min-width: 110rpx;
line-height: 45rpx;
border-radius: 5rpx;
font-size: 24rpx;
font-weight: 500;
color: #939393;
text-align: center;
}
.item.select
{
background-color: #F2C369;
font-weight: bold;
color: #070707;
}
}
.periodList {
right: 25rpx;
margin: 0 25rpx;
width: 130rpx;
.item
{
line-height: 40rpx;
font-size: 22rpx;
font-weight: 500;
color: #999;
text-align: center;
}
.item.select {
color: #F2C369;
}
}
</style>

3
pagesStock/stockCenterDetails/stockCenterDetails.vue
View File

@@ -103,7 +103,6 @@
<view class="sale flex1">卖出 {{getSellPercent()}}%</view>
</view>
</block>
<view class="infoC flex">
<view class="flex flex1">
<image class="icon" src="/pagesStock/static/icon/establishedTime.png" mode="widthFix"></image>
@@ -1239,7 +1238,7 @@
if (this.selectSearchStockInfo) {
code = this.selectSearchStockInfo.stock_code
}
let param = {limit:8}
let param = {limit:16}
financialMetrics(code,param).then(res=>{
this.financialMetricsList = res.data
}).catch(error=>{