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

1.24 雷达图，行业排名弹窗UI完善，接口对接，公司公告，新闻动态接口对接

Browse Source
This commit is contained in:
尚政杰
2026-01-24 17:08:16 +08:00
parent b1956561cf
commit f45e96095e
137 changed files with 1646 additions and 1966 deletions
Download Patch File Download Diff File Expand all files Collapse all files

396
pagesStock/stockCenterDetails/stockCenterDetails.vue
View File

@@ -313,6 +313,9 @@
</view>
<view class="score">{{item.score}}</view>
</view>
</view>
<view style="width:660rpx; height:500rpx">
<l-echart ref="chartRef"></l-echart>
</view>
<view v-if="competitivePositionInfo" class="infoC">
<view class="title">竞争优势</view>
@@ -349,7 +352,7 @@
{{item.title}}
</view>
</view>
<news-view :type="selectDongtai"></news-view>
<news-view :type="selectDongtai" :newsList="newsList" :announcementList="companyAnnouncementList"></news-view>
</block>
</view>
</scroll-view>
@@ -378,21 +381,87 @@
<view class="popTitle">行业排名</view>
<view class="closeC absolute">
<image class="icon" src="/static/icon/home/close.png" mode="widthFix"></image>
</view>
<view class="sectionDateC flex">
<view class="section">三季报 行业排名</view>
<view class="industryC flex">
<image class="icon" src="/pagesStock/static/icon/existStatus.png" mode="widthFix"></image>
<view>银行(一级行业)</view>
</view>
<view class="flex1"></view>
<view class="date">2024-09-30</view>
</view>
<view class="list">
<view class="item">
<view class="title">EPS</view>
<view class="average">行业均值:1.85</view>
</view>
</view>
<view class="rankList">
<block v-for="(item,index) in industryRankList" :key="index">
<block v-for="(ritem,rindex) in item.rankings" :key="rindex">
<view class="sectionDateC flex">
<view class="section">三季报 行业排名</view>
<view class="industryC flex">
<image class="icon" src="/pagesStock/static/icon/existStatus.png" mode="widthFix"></image>
<view>{{ritem.industry_name}}({{ritem.level_description}})</view>
</view>
<view class="flex1"></view>
<view class="date">{{item.period}}</view>
</view>
<view class="list flexWrap">
<view class="item">
<view class="title">EPS</view>
<view class="valueRankC flex">
<view class="value">{{ritem.metrics.eps.value.toFixed(2)}}</view>
<view class="rank">#{{ritem.metrics.eps.rank}}</view>
</view>
<view class="average">行业均值:{{ritem.metrics.eps.industry_avg.toFixed(2)}}</view>
</view>
<view class="item">
<view class="title">每股净资产</view>
<view class="valueRankC flex">
<view class="value">{{ritem.metrics.bvps.value.toFixed(2)}}</view>
<view class="rank">#{{ritem.metrics.bvps.rank}}</view>
</view>
<view class="average">行业均值:{{ritem.metrics.bvps.industry_avg.toFixed(2)}}</view>
</view>
<view class="item">
<view class="title">ROE</view>
<view class="valueRankC flex">
<view class="value">{{ritem.metrics.roe.value.toFixed(2)}}%</view>
<view class="rank">#{{ritem.metrics.roe.rank}}</view>
</view>
<view class="average">行业均值:{{ritem.metrics.roe.industry_avg.toFixed(2)}}%</view>
</view>
<view class="item">
<view class="title">营收增长率</view>
<view class="valueRankC flex">
<view class="value">{{ritem.metrics.revenue_growth.value.toFixed(2)}}%</view>
<view class="rank">#{{ritem.metrics.revenue_growth.rank}}</view>
</view>
<view class="average">行业均值:{{ritem.metrics.revenue_growth.industry_avg.toFixed(2)}}%</view>
</view>
<view class="item">
<view class="title">利润增长率</view>
<view class="valueRankC flex">
<view class="value">{{ritem.metrics.profit_growth.value.toFixed(2)}}%</view>
<view class="rank">#{{ritem.metrics.profit_growth.rank}}</view>
</view>
<view class="average">行业均值:{{ritem.metrics.profit_growth.industry_avg.toFixed(2)}}%</view>
</view>
<view class="item">
<view class="title">营业利润率</view>
<view class="valueRankC flex">
<view class="value">{{ritem.metrics.operating_margin.value.toFixed(2)}}%</view>
<view class="rank">#{{ritem.metrics.operating_margin.rank}}</view>
</view>
<view class="average">行业均值:{{ritem.metrics.operating_margin.industry_avg.toFixed(2)}}%</view>
</view>
<view class="item">
<view class="title">资产负债率</view>
<view class="valueRankC flex">
<view class="value">{{ritem.metrics.debt_ratio.value.toFixed(2)}}</view>
<view class="rank">#{{ritem.metrics.debt_ratio.rank}}</view>
</view>
<view class="average">行业均值:{{ritem.metrics.debt_ratio.industry_avg.toFixed(2)}}</view>
</view>
<view class="item">
<view class="title">应收账款周转率</view>
<view class="valueRankC flex">
<view class="value">{{ritem.metrics.receivable_turnover.value.toFixed(2)}}</view>
<view class="rank">#{{ritem.metrics.receivable_turnover.rank}}</view>
</view>
<view class="average">行业均值:{{ritem.metrics.receivable_turnover.industry_avg.toFixed(2)}}</view>
</view>
</view>
</block>
</block>
</view>
</view>
</uni-popup>
@@ -479,8 +548,9 @@
<script>
import { inject } from 'vue'
import { actualControl, branchesList, companyAnnouncementsList, comprehensiveAnalysis, eventList, managementTeam, quoteDetailsInfo, stockBasicInfo, topCirculatingShareholdersList, topShareholdersList } from '@/request/api'
import { actualControl, branchesList, companyAnnouncementsList, comprehensiveAnalysis, eventList, industryRankList, managementTeam, quoteDetailsInfo, stockBasicInfo, topCirculatingShareholdersList, topShareholdersList } from '@/request/api'
import { getLocalDate, getNumStr, getRateUpOrDown } from '@/utils/util'
const echarts = require('../../uni_modules/lime-echart/static/echarts.min.js');
export default {
data() {
@@ -488,7 +558,7 @@
navH: inject('navHeight'),
contentTop: '',
keywords: '', //搜索关键字
stockCode:'000009', //股票代码 600759
stockCode:'002004', //股票代码 600759 000009 002004
stockBasicInfo:null, //股票基本信息
quoteDetailsInfo:null, //股票事实市场价格信息
isExpandIntro:false, //是否展开公司简介
@@ -546,7 +616,9 @@
], //深度分析分类
selectInDepthAnalysis: 0,
qualitativeAnalysisInfo:null, //定性分析
competitivePositionInfo:null, //竞争地位信息
mainCompetitorsList:[], //主要竞争对手
industryRankList:[], //行业排名
scoreList:[{
icon:'/pagesStock/static/icon/marketPosition.png',
title:'市场地位',
@@ -595,7 +667,71 @@
color:'purple',
score:''
}],
competitivePositionInfo:null, //竞争地位信息
option2:{
title: {
show:false
},
legend: {
show:false
},
tooltip:{
show:true,
triggerOn:'mousemove'
},
radar: {
indicator: [
{ name: '市场地位', max: 100 },
{ name: '技术实力', max: 100 },
{ name: '品牌价值', max: 100 },
{ name: '运营效率', max: 100 },
{ name: '财务健康', max: 100 },
{ name: '创新能力', max: 100 },
{ name: '风险控制', max: 100 },
{ name: '成长潜力', max: 100 }
],
shape: 'polygon',
splitNumber: 5,
axisName: {
color: '#54555A'
},
splitLine: {
lineStyle: {
color: ['#CFD2D7']
}
},
splitArea: {
areaStyle:{
color:['#F4F6FA','white']
}
},
axisLine: {
lineStyle: {
color: '#CFD2D7'
}
}
},
series: [
{
name: 'Beijing',
type: 'radar',
lineStyle: {
width:1
},
data: [],
symbol: 'circle',
symbolSize: 4,
label:{
show:true
},
itemStyle: {
color: '#5070DD'
},
areaStyle: {
opacity: 0.1
}
},
]
},
caiWuList: [{
title: '主营数据'
},
@@ -615,6 +751,7 @@
}
], //动态跟踪分类
selectDongtai: 0,
newsKeywords:'', //新闻动态搜索关键字
newsList:[], //新闻动态数据
companyAnnouncementList:[], //公司公告数据
getLocalDate:getLocalDate,
@@ -628,9 +765,18 @@
this.getQuoteDetailsData()
this.getActualControl()
this.getTopShareholdersData()
this.getTopCirculatingShareholdersData()
this.getTopCirculatingShareholdersData()
},
methods: {
async init() {
// chart 图表实例不能存在data里
const chart = await this.$refs.chartRef.init(echarts);
// chart.on('click',function (params) {
// console.log(params)
// })
console.log(chart)
chart.setOption(this.option2)
},
/**
* 点击搜索
*/
@@ -652,7 +798,13 @@
this.selectTab = index
if(index==1) {
//获取竞争地位数据
this.getComprehensiveAnalysisData()
if(this.selectInDepthAnalysis==0) {
this.getComprehensiveAnalysisData()
this.getIndustryRankListData()
}
}else if(index==3) {
//获取新闻动态数据
this.getNewsListData()
}
}
},
@@ -712,6 +864,13 @@
*/
clickIndustryRank() {
this.$refs["industryRankPop"].open()
},
/**
* 关闭行业排名弹窗
*/
clickCloseIndustryRankPop()
{
this.$refs["industryRankPop"].close()
},
detailShow(type) {
if (type == 0) {
@@ -838,24 +997,56 @@
this.qualitativeAnalysisInfo = res.data.qualitative_analysis
this.competitivePositionInfo = res.data.competitive_position
this.mainCompetitorsList = this.competitivePositionInfo.analysis.main_competitors.split(',')
this.scoreList[0].score = this.competitivePositionInfo.scores.market_position
this.scoreList[1].score = this.competitivePositionInfo.scores.technology
this.scoreList[2].score = this.competitivePositionInfo.scores.brand
this.scoreList[3].score = this.competitivePositionInfo.scores.operation
this.scoreList[4].score = this.competitivePositionInfo.scores.finance
this.scoreList[5].score = this.competitivePositionInfo.scores.innovation
this.scoreList[6].score = this.competitivePositionInfo.scores.risk
this.scoreList[7].score = this.competitivePositionInfo.scores.growth
let marketPosition = this.competitivePositionInfo.scores.market_position
this.scoreList[0].score = marketPosition
let technology = this.competitivePositionInfo.scores.technology
this.scoreList[1].score = technology
let brand = this.competitivePositionInfo.scores.brand
this.scoreList[2].score = brand
let operation = this.competitivePositionInfo.scores.operation
this.scoreList[3].score = operation
let finance = this.competitivePositionInfo.scores.finance
this.scoreList[4].score = finance
let innovation = this.competitivePositionInfo.scores.innovation
this.scoreList[5].score = innovation
let risk = this.competitivePositionInfo.scores.risk
this.scoreList[6].score = risk
let growth = this.competitivePositionInfo.scores.growth
this.scoreList[7].score = growth
this.option2.series[0].data = [[marketPosition,technology,brand,operation,finance,innovation,risk,growth]]
let that = this
setTimeout(function() {
that.init()
}, 1000);
}).catch(error=>{
})
},
/**
* 获取行业排名列表数据
*/
getIndustryRankListData() {
let code = this.stockCode
if (this.keywords) {
code = this.keywords
}
industryRankList(code).then(res=>{
this.industryRankList = res.data
}).catch(error=>{
})
},
/**
* 获取新闻动态数据
*/
getNewsListData() {
let param = {importance:'all',sort:'new',q:this.stockCode,page:1,per_page:10,mode:'vertical'}
eventList(param).then(res=>{
let q = this.stockCode
if (this.newsKeywords)
{
q = this.newsKeywords
}
let param = {importance:'all',sort:'new',q:q,page:1,per_page:10,mode:'vertical'}
eventList(param,true).then(res=>{
this.newsList = res.data.events
}).catch(error=>{
@@ -865,8 +1056,12 @@
* 获取公司公告数据
*/
getCompanyAnnouncementsData() {
let code = this.stockCode
if (this.keywords) {
code = this.keywords
}
let param = {limit:20}
companyAnnouncementsList(param).then(res=>{
companyAnnouncementsList(code,param).then(res=>{
this.companyAnnouncementList = res.data
}).catch(error=>{
@@ -1103,7 +1298,8 @@
.tabC {
white-space: nowrap;
margin: 0 20rpx;
margin: 0 20rpx;
width:calc(100% - 40rpx);
border-bottom: solid 1rpx #E7E7E7;
.item {
@@ -1675,55 +1871,93 @@
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;
}
.rankList
{
max-height: 660rpx;
overflow-y: scroll;
.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;
padding: 20rpx 12rpx;
width: calc((100% - 40rpx)/3);
border: solid 1rpx #FCE2B2;
border-radius: 10rpx;
.title
{
font-size: 24rpx;
font-weight: 500;
color: #3D3D3D;
}
.valueRankC
{
.value
{
margin-right: 9rpx;
font-size: 30rpx;
font-weight: 800;
color: #BB8520;
}
.rank
{
background-color: #F3C368;
padding: 0 9rpx;
line-height: 30rpx;
border-radius: 15rpx;
font-size: 24rpx;
color: white;
}
}
.average
{
font-size: 22rpx;
font-weight: 500;
color: #999;
word-break: break-all;
}
}
.item:nth-child(3n) {
margin-right: 0;
}
}
}
.detailPopup {
height: 70%;