Merge branch 'hi-ucs-dev' of http://124.222.94.39:3001/wuhongjian/hi-ucs into hi-ucs-dev

This commit is contained in:
guoyue 2022-07-01 13:30:24 +08:00
commit 02639e6696
47 changed files with 2523 additions and 821 deletions

View File

@ -1,7 +1,11 @@
<template> <template>
<div class='container'> <div class='container'>
<span class='title-style'>应用资源</span> <div>
<span class='page-introduction'>发布情况统计</span> <span class='title-style'>应用资源</span>
<span class='page-introduction'>发布情况统计</span>
<button class='back-btn' @click="backBtn">返回</button>
</div>
<div class='container-body'> <div class='container-body'>
<div class='container-body1'> <div class='container-body1'>
<span style='font-size:18px;color;#000000;'>应用贡献组件被调用次数分布</span> <span style='font-size:18px;color;#000000;'>应用贡献组件被调用次数分布</span>
@ -57,31 +61,215 @@
import * as echarts from 'echarts'; import * as echarts from 'echarts';
export default { export default {
props:{
tableId:{
type:String,
default:''
},
fatherId:{
type:Number,
default:null,
}
},
data(){ data(){
return{ return{
data2:[],
data3:[],
data4:[],
data5:[],
data6:[],
data7:[],
data8:[],
data9:[],
data10:[],
data11:[],
colorList:['linear-gradient(to right, rgba(82, 106, 255,0.8),transparent)', 'linear-gradient(to right,rgba(251, 123, 5),transparent)','linear-gradient(to right,rgba(250, 179, 2,.6),transparent)','linear-gradient(to right,rgba(82, 106, 255,.6),transparent','linear-gradient(to right,rgba(82, 106, 255,.6),transparent)',], colorList:['linear-gradient(to right, rgba(82, 106, 255,0.8),transparent)', 'linear-gradient(to right,rgba(251, 123, 5),transparent)','linear-gradient(to right,rgba(250, 179, 2,.6),transparent)','linear-gradient(to right,rgba(82, 106, 255,.6),transparent','linear-gradient(to right,rgba(82, 106, 255,.6),transparent)',],
widthList:['90px','80px','70px','60px','50px'], widthList:['90px','80px','70px','60px','50px'],
numColorList:['#fc5656','#ff8a00','#f9af0a','#808fff','#808fff'], numColorList:['#fc5656','#ff8a00','#f9af0a','#808fff','#808fff'],
usedList:[{name:'组件名称一',count:111},{name:'组件名称一',count:111},{name:'组件名称一',count:111},{name:'组件名称四',count:111},{name:'组件名称五',count:111},], usedList:[{name:'组件名称一',count:111},{name:'组件名称一',count:111},{name:'组件名称一',count:111},{name:'组件名称四',count:111},{name:'组件名称五',count:111},],
} }
},
created(){
this.getDistributedList()
this.getUsedList()
this.getTopList()
this.getApplicationDistribution()
this.getFieldDistribution()
this.getStatuesDistribution()
}, },
mounted(){ mounted(){
this.myEcharts1() this.myEcharts1()
this.myEcharts2() // this.myEcharts2()
this.myEcharts3() // this.myEcharts3()
this.myEcharts4() // this.myEcharts4()
this.myEcharts6() // this.myEcharts6()
this.myEcharts7() // this.myEcharts7()
this.myEcharts8() // this.myEcharts8()
this.myEcharts9() // this.myEcharts9()
}, },
methods:{ methods:{
//
getDistributedList () {
this.$http.get('/census/center/v3/assemblerUseProjectInfo/' ,{
params : {
keyId:'1522550195034857476'
// this.tableId
}
}).then(res => {
let arry=[]
arry=res.data.data
arry.forEach((item)=>{
const single={
value:item.num,
name:item.attr_value
}
this.data2.push(single)
this.data5.push(single.value)
this.data6.push(single.name)
this.myEcharts2()
this.myEcharts4()
})
})
},
// 使
getUsedList () {
this.$http.get('/census/center/v3/applicationUsedCapabilityNum/' ,{
params : {
id:
// '1522550195034857476'
this.tableId
}
}).then(res => {
let arry=[]
arry=res.data.data
arry.forEach((item)=>{
const single={
value:item.useNum,
name:item.name
}
this.data3.push(single.name)
this.data4.push(single.value)
console.log("2222", this.data3);
this.myEcharts3()
})
})
},
//12345
getTopList () {
this.$http.get('/census/center/v3/assemblerScoreInfo/' ,{
params : {
id:this.tableId,
// '1067246875800000066',
resourceType:'应用资源'
}
}).then(res => {
let arry=[]
arry=res.data.data
arry.forEach((item)=>{
const single={
value:item.scoreNum,
name:item.score
}
this.data8.push(single)
this.myEcharts6()
})
})
},
//
getApplicationDistribution() {
this.$http.get('/census/center/v3/applicationReleaseCapabilitySet/' ,{
params : {
id:
// '1067246875800000066',
this.tableId,
resourceType:'应用资源'
}
}).then(res => {
let arry=[]
arry=res.data.data
arry.forEach((item)=>{
const single={
value:item.num,
name:item.publisher
}
this.data7.push(single)
this.myEcharts7()
})
})
},
//
getFieldDistribution() {
this.$http.get('/census/center/v3/applicationAreaCapabilityList/' ,{
params : {
id:
// '1067246875800000066',
this.tableId,
resourceType:'应用资源'
}
}).then(res => {
let arry=[]
arry=res.data.data
arry.forEach((item)=>{
const single={
value:item.total,
name:item.type
}
this.data9.push(single)
this.myEcharts8()
})
})
},
//
getStatuesDistribution() {
this.$http.get('/census/center/v3/applicationStateCapabilitySet/' ,{
params : {
id:
// '1067246875800000066',
this.tableId,
resourceType:'应用资源'
}
}).then(res => {
let arry=[]
arry=res.data.data
arry.forEach((item)=>{
const single={
value:item.num,
name:item.state
}
this.data10.push(single)
this.myEcharts9()
})
})
},
myEcharts1(){ myEcharts1(){
var chartDom = document.getElementById('main1'); var chartDom = document.getElementById('main1');
var myChart = echarts.init(chartDom); var myChart = echarts.init(chartDom);
var option; var option;
option = { option = {
tooltip: { // XY
trigger: 'axis',
backgroundColor: 'rgba(32, 33, 36,.7)',
borderColor: 'rgba(32, 33, 36,0.20)',
borderWidth: 1,
textStyle: { //
color: '#fff',
fontSize: '12'
},
axisPointer: { // 线
type: 'cross',
label: {
backgroundColor: '#6a7985'
}
},
},
grid: { grid: {
bottom: '23%', bottom: '23%',
}, },
@ -231,12 +419,7 @@ export default {
labelLine: { labelLine: {
show: false show: false
}, },
data: [ data:this.data2
{ value: 1048, name: '算法' },
{ value: 735, name: '图层' },
{ value: 580, name: '开发' },
{ value: 484, name: '业务' },
]
} }
] ]
}; };
@ -248,12 +431,29 @@ export default {
var myChart = echarts.init(chartDom); var myChart = echarts.init(chartDom);
var option; var option;
option = { option = {
tooltip: { // XY
trigger: 'axis',
backgroundColor: 'rgba(32, 33, 36,.7)',
borderColor: 'rgba(32, 33, 36,0.20)',
borderWidth: 1,
textStyle: { //
color: '#fff',
fontSize: '12'
},
axisPointer: { // 线
type: 'cross',
label: {
backgroundColor: '#6a7985'
}
},
},
grid: { grid: {
bottom: '23%', bottom: '23%',
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
data: ['算法', '图层', '开发', '业务'], data:this.data3,
fontSize:12,
color:['#f5f5f5'], color:['#f5f5f5'],
axisTick:{ axisTick:{
show:false,//线 show:false,//线
@ -268,8 +468,17 @@ export default {
} }
}, },
axisLabel: {//x axisLabel: {//x
formatter: val => {
let txt = val
if (val.length > 3) {
txt = val.substr(0, 3) + '...'
}
return txt
},
textStyle: { textStyle: {
color: "#999999",//x color: "#999999",//x
}, },
}, },
}, },
@ -300,7 +509,7 @@ export default {
}, },
series: [ series: [
{ {
data: [5, 5, 5, 5], data: [1, 1, 1, 1, 1, 1],
type: 'bar', type: 'bar',
barWidth: 14, barWidth: 14,
stack: '1', stack: '1',
@ -314,7 +523,7 @@ export default {
}, },
}, },
{ {
data: [60, 90, 50, 80], data: this.data4,
type: 'bar', type: 'bar',
barWidth: 14, barWidth: 14,
stack: '1', stack: '1',
@ -343,7 +552,7 @@ export default {
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
data: ['组件名称1', '组件名称2', '组件名称3', '组件名称4', '组件名称5', '组件名称6'], data:this.data6,
color:['#f5f5f5'], color:['#f5f5f5'],
axisTick: { // axisTick: { //
show: false, // show: false, //
@ -404,7 +613,7 @@ export default {
}, },
}, },
{ {
data: [60, 90, 50, 80, 50, 80], data:this.data5,
type: 'bar', type: 'bar',
barWidth: 14, barWidth: 14,
stack: '1', stack: '1',
@ -486,13 +695,7 @@ export default {
labelLine: { labelLine: {
show: false show: false
}, },
data: [ data:this.data8
{ value: 1048, name: '1分' },
{ value: 735, name: '2分' },
{ value: 580, name: '3分' },
{ value: 484, name: '4分' },
{ value: 300, name: '5分' }
]
} }
] ]
}; };
@ -564,175 +767,197 @@ export default {
labelLine: { labelLine: {
show: false show: false
}, },
data: [ data:this.data7
{ value: 1048, name: '应用名称1' }, // [
{ value: 735, name: '应用名称2' }, // { value: 1048, name: '1' },
{ value: 580, name: '应用名称3' }, // { value: 735, name: '2' },
{ value: 484, name: '应用名称4' }, // { value: 580, name: '3' },
{ value: 300, name: '应用名称5' } // { value: 484, name: '4' },
] // { value: 300, name: '5' }
// ]
} }
] ]
}; };
option && myChart.setOption(option); option && myChart.setOption(option);
}, },
myEcharts8(){ myEcharts8(){
var chartDom = document.getElementById('main8'); var chartDom = document.getElementById('main8');
var myChart = echarts.init(chartDom); var myChart = echarts.init(chartDom);
var option; var option;
option = { option = {
tooltip: { tooltip: {
trigger: 'item' trigger: 'item'
}, },
legend: { legend: {
orient: '', orient: "vertical", type: 'scroll',
top: '14%', top: '14%',
left: '40%', left: '40%',
width:"auto", width:"auto",
height:"auto", height:"auto",
orient: "vertical", orient: "vertical",
itemGap: 15, itemGap: 15,
itemWidth: 14, itemWidth: 14,
// 使 // 使
formatter: function(name) { formatter: function(name) {
var data = option.series[0].data; var data = option.series[0].data;
var total = 0; var total = 0;
var tarValue; var tarValue;
for (var i = 0; i < data.length; i++) { for (var i = 0; i < data.length; i++) {
total += data[i].value; total += data[i].value;
if (data[i].name == name) { if (data[i].name == name) {
tarValue = data[i].value; tarValue = data[i].value;
} }
} }
var v = tarValue; var v = tarValue;
var p = Math.round(((tarValue / total) * 100)); var p = Math.round(((tarValue / total) * 100));
return `${name} ${p}%`; return `{a|${name}} {b|${p}%}`;
}, },
itemStyle:{}, itemStyle:{},
textStyle: { textStyle: {
color: "#666666", color: "#666666",
fontSize:12, fontSize:12,
padding:[0,8,0,10] rich: {
}, // richoneonetwotwothreethree""
}, a: {
color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'], //
series: [ width: 80,
{ color: "#000000",
type: 'pie', fontSize: 12,
radius: ['30%', '45%'], fontWeight: "bolder",
center:['19%', '50%'], },
avoidLabelOverlap: false, b: {
itemStyle: { // 102030
borderRadius: 10, width: 35,
borderColor: '#fff', color: "#333",
borderWidth: 2 fontSize: 12,
}, },
label: { },
show: false, padding:[0,8,0,10]
position: 'center' },
}, },
// emphasis: { color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
// label: { series: [
// show: true, {
// fontSize: '40', type: 'pie',
// fontWeight: 'bold' radius: ['30%', '45%'],
// } center:['19%', '50%'],
// }, avoidLabelOverlap: false,
labelLine: { itemStyle: {
show: false borderRadius: 10,
}, borderColor: '#fff',
data: [ borderWidth: 2
{ value: 1048, name: '应用领域1' }, },
{ value: 735, name: '应用领域2' }, label: {
{ value: 580, name: '应用领域3' }, show: false,
{ value: 484, name: '应用领域4' }, position: 'center'
{ value: 300, name: '应用领域5' } },
] // emphasis: {
} // label: {
] // show: true,
}; // fontSize: '40',
// fontWeight: 'bold'
// }
// },
labelLine: {
show: false
},
data:this.data9
// [
// { value: 1048, name: '1' },
// { value: 735, name: '2' },
// { value: 580, name: '3' },
// { value: 484, name: '4' },
// { value: 300, name: '5' }
// ]
}
]
};
option && myChart.setOption(option); option && myChart.setOption(option);
}, },
myEcharts9(){ myEcharts9(){
var chartDom = document.getElementById('main9'); var chartDom = document.getElementById('main9');
var myChart = echarts.init(chartDom); var myChart = echarts.init(chartDom);
var option; var option;
option = { option = {
tooltip: { tooltip: {
trigger: 'item' trigger: 'item'
}, },
legend: { legend: {
orient: '', orient: '',
top: '14%', top: '14%',
left: '47%', left: '47%',
width:"auto", width:"auto",
height:"auto", height:"auto",
orient: "vertical", orient: "vertical",
itemGap: 15, itemGap: 15,
itemWidth: 14, itemWidth: 14,
// 使 // 使
formatter: function(name) { formatter: function(name) {
var data = option.series[0].data; var data = option.series[0].data;
var total = 0; var total = 0;
var tarValue; var tarValue;
for (var i = 0; i < data.length; i++) { for (var i = 0; i < data.length; i++) {
total += data[i].value; total += data[i].value;
if (data[i].name == name) { if (data[i].name == name) {
tarValue = data[i].value; tarValue = data[i].value;
} }
} }
var v = tarValue; var v = tarValue;
var p = Math.round(((tarValue / total) * 100)); var p = Math.round(((tarValue / total) * 100));
return `${name} ${p}%`; return `${name} ${p}%`;
}, },
itemStyle:{}, itemStyle:{},
textStyle: { textStyle: {
color: "#666666", color: "#666666",
fontSize:12, fontSize:12,
padding:[0,8,0,10] padding:[0,8,0,10]
}, },
}, },
color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'], color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
series: [ series: [
{ {
type: 'pie', type: 'pie',
radius: ['30%', '45%'], radius: ['30%', '45%'],
center:['22%', '50%'], center:['22%', '50%'],
avoidLabelOverlap: false, avoidLabelOverlap: false,
itemStyle: { itemStyle: {
borderRadius: 10, borderRadius: 10,
borderColor: '#fff', borderColor: '#fff',
borderWidth: 2 borderWidth: 2
}, },
label: { label: {
show: false, show: false,
position: 'center' position: 'center'
}, },
// emphasis: { // emphasis: {
// label: { // label: {
// show: true, // show: true,
// fontSize: '40', // fontSize: '40',
// fontWeight: 'bold' // fontWeight: 'bold'
// } // }
// }, // },
labelLine: { labelLine: {
show: false show: false
}, },
data: [ data:this.data10
{ value: 1048, name: '应用状态1' }, // [
{ value: 735, name: '应用状态2' }, // { value: 1048, name: '1' },
{ value: 580, name: '应用状态3' }, // { value: 735, name: '2' },
{ value: 484, name: '应用状态4' }, // { value: 580, name: '3' },
{ value: 300, name: '应用状态5' } // { value: 484, name: '4' },
] // { value: 300, name: '5' }
} // ]
] }
}; ]
};
option && myChart.setOption(option); option && myChart.setOption(option);
}, },
backBtn(){
this.$emit('closeApplication')
}
} }
} }
</script> </script>
@ -740,6 +965,8 @@ export default {
<style scoped> <style scoped>
.container{ .container{
padding-top: 15px; padding-top: 15px;
display: flex;
flex-direction: column;
} }
.title-style{ .title-style{
font-size: 24px; font-size: 24px;
@ -750,6 +977,13 @@ export default {
font-size: 18px; font-size: 18px;
color:#666666; color:#666666;
margin-left: 20px; margin-left: 20px;
}
.back-btn{
background: #3e8ef7;
border-color: rgba(101, 165, 249,0);
color: #FFF;
margin-left:1030px;
padding-bottom: 3px;
} }
.container-body{ .container-body{
width:1300px; width:1300px;

View File

@ -1,7 +1,11 @@
<template> <template>
<div class='container'> <div class='container'>
<span class='title-style'>组件服务</span> <div>
<span class='page-introduction'>发布情况统计</span> <span class='title-style'>组件服务</span>
<span class='page-introduction'>发布情况统计</span>
<button class='back-btn' @click="backBtn">返回</button>
</div>
<div class='container-body'> <div class='container-body'>
<div class='container-body1'> <div class='container-body1'>
<span style='font-size:18px;color;#000000;'>评分发布情况</span> <span style='font-size:18px;color;#000000;'>评分发布情况</span>
@ -26,7 +30,7 @@
<span style='font-weight:bold' :style="{color:numColorList[index%5]}">{{index+1}}</span> <span style='font-weight:bold' :style="{color:numColorList[index%5]}">{{index+1}}</span>
</div> </div>
<span class='num-style'>{{item.name}}</span> <span class='num-style'>{{item.name}}</span>
<span class='count-style' :style="{color:numColorList[index%5]}">{{item.count}}</span> <span class='count-style' :style="{color:numColorList[index%5]}">{{item.resourceCarNum}}</span>
</div> </div>
</div> </div>
</div> </div>
@ -41,7 +45,7 @@
<span style='font-weight:bold' :style="{color:numColorList[index%5]}">{{index+1}}</span> <span style='font-weight:bold' :style="{color:numColorList[index%5]}">{{index+1}}</span>
</div> </div>
<span class='num-style'>{{item.name}}</span> <span class='num-style'>{{item.name}}</span>
<span class='count-style' :style="{color:numColorList[index%5]}">{{item.count}}</span> <span class='count-style' :style="{color:numColorList[index%5]}">{{item.resourceCarNum}}</span>
</div> </div>
</div> </div>
</div> </div>
@ -57,258 +61,383 @@
import * as echarts from 'echarts'; import * as echarts from 'echarts';
export default { export default {
props:{
tableId:{
type:String,
default:''
},
fatherId:{
type:Number,
default:null,
}
},
data(){ data(){
return{ return{
data1:[],
data2: [
// { value: 1048,name: '' },
// { value: 735, name: '' },
// { nums: 580, attr_value: '' },
// { nums: 484, attr_value: '' },
],
data3: [
// { value: 1048,name: '' },
],
colorList:['linear-gradient(to right, rgba(251, 59, 5,0.6),transparent)', 'linear-gradient(to right,rgba(251, 123, 5),transparent)','linear-gradient(to right,rgba(250, 179, 2,.6),transparent)','linear-gradient(to right,rgba(82, 106, 255,.6),transparent','linear-gradient(to right,rgba(82, 106, 255,.6),transparent)',], colorList:['linear-gradient(to right, rgba(251, 59, 5,0.6),transparent)', 'linear-gradient(to right,rgba(251, 123, 5),transparent)','linear-gradient(to right,rgba(250, 179, 2,.6),transparent)','linear-gradient(to right,rgba(82, 106, 255,.6),transparent','linear-gradient(to right,rgba(82, 106, 255,.6),transparent)',],
widthList:['90px','80px','70px','60px','50px'], widthList:['90px','80px','70px','60px','50px'],
numColorList:['#fc5656','#ff8a00','#f9af0a','#808fff','#808fff'], numColorList:['#fc5656','#ff8a00','#f9af0a','#808fff','#808fff'],
usedList:[{name:'组件名称一',count:111},{name:'组件名称一',count:111},{name:'组件名称一',count:111},{name:'组件名称四',count:111},{name:'组件名称五',count:111},], usedList:[{name:'组件名称一',resourceCarNum:111},{name:'组件名称一',resourceCarNum:111},{name:'组件名称一',resourceCarNum:111},{name:'组件名称四',resourceCarNum:111},{name:'组件名称五',resourceCarNum:111},],
applicationList:[{name:'组件名称一',count:111},{name:'组件名称一',count:111},{name:'组件名称一',count:111},{name:'组件名称四',count:111},{name:'组件名称五',count:111},] applicationList:[{name:'组件名称一',resourceCarNum:111},{name:'组件名称一',resourceCarNum:111},{name:'组件名称一',resourceCarNum:111},{name:'组件名称四',resourceCarNum:111},{name:'组件名称五',resourceCarNum:111},]
} }
}, },
created(){
if(this.fatherId===1){
this.getBeCalled()
this.getBeApplied()
this.getAlgorithm()
this.getDistributed()
this.getScoreList()
}else{
}
},
mounted(){ mounted(){
this.myEcharts1()
this.myEcharts2()
this.myEcharts3()
}, },
methods:{ methods:{
myEcharts1(){ //
var chartDom = document.getElementById('main1'); getScoreList () {
var myChart = echarts.init(chartDom); this.$http.get('/census/center/v3/assemblerScoreInfo' ,{
var option; params : {
option = { id:this.tableId,
tooltip: { resourceType:"应用资源"
trigger: 'item' // pageNo: pageNo || 1,
}, // pageSize: 20
legend: { }
orient: '', }).then(res => {
top: '14%', let arry=[]
left: '55%', arry=res.data.data
width:"auto", arry.forEach((item)=>{
height:"auto",
orient: "vertical", const single={
itemGap: 15, value:item.scoreNum,
itemWidth: 14, name:item.score
// 使 }
formatter: function(name) { // const newList=[]
var data = option.series[0].data; this.data1.push(single)
var total = 0; // this.data2=newList
var tarValue; this.myEcharts1()
for (var i = 0; i < data.length; i++) { })
total += data[i].value; })
if (data[i].name == name) {
tarValue = data[i].value;
}
}
var v = tarValue;
var p = Math.round(((tarValue / total) * 100));
return `${name} ${p}%`;
},
itemStyle:{},
textStyle: {
color: "#666666",
padding:[0,8,0,18]
},
},
color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
series: [
{
type: 'pie',
radius: ['40%', '60%'],
center:['22%', '50%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderColor: '#fff',
borderWidth: 2
}, },
label: { //
show: false, getAlgorithm () {
position: 'center' this.$http.get('/census/center/v3/assemblerUsedInfo' ,{
params : {
id:this.tableId,
resourceType:"组件服务"
// pageNo: pageNo || 1,
// pageSize: 20
}
}).then(res => {
let arry=[]
arry=res.data.data
arry.forEach((item)=>{
const single={
value:item.nums,
name:item.attr_value
}
// const newList=[]
this.data2.push(single)
// this.data2=newList
this.myEcharts2()
})
})
}, },
// emphasis: { //
// label: { getDistributed () {
// show: true, this.$http.get('/census/center/v3/applicationAreaCapabilityList' ,{
// fontSize: '40', params : {
// fontWeight: 'bold' id:this.tableId,
// } resourceType:"应用资源"
// }, }
labelLine: { }).then(res => {
show: false let arry=[]
arry=res.data.data
arry.forEach((item)=>{
const single={
value:item.total,
name:item.type
}
const newList=[]
this.data3.push(single)
// this.data2=newList
this.myEcharts3()
})
})
}, },
data: [ //
{ value: 1048, name: '1分' }, getBeCalled () {
{ value: 735, name: '2分' }, this.$http.get('/census/center/v3/assemblerCaredTopInfo' ,{
{ value: 580, name: '3分' }, params : {
{ value: 484, name: '4分' }, id:this.tableId,
{ value: 300, name: '5分' } resourceType:"应用资源"
// pageNo: pageNo || 1,
// pageSize: 20
}
}).then(res => {
this.applicationList =res.data.data
})
},
//
getBeApplied () {
this.$http.get('/census/center/v3/assemblerCaredTopInfo' ,{
params : {
id:this.tableId,
resourceType:"应用资源"
// pageNo: pageNo || 1,
// pageSize: 20
}
}).then(res => {
this.applicationList =res.data.data
})
},
myEcharts1(){
var chartDom = document.getElementById('main1');
var myChart = echarts.init(chartDom);
var option;
option = {
tooltip: {
trigger: 'item'
},
legend: {
orient: '',
top: '14%',
left: '55%',
width:"auto",
height:"auto",
orient: "vertical",
itemGap: 15,
itemWidth: 14,
// 使
formatter: function(name) {
var data = option.series[0].data;
var total = 0;
var tarValue;
for (var i = 0; i < data.length; i++) {
total += data[i].value;
if (data[i].name == name) {
tarValue = data[i].value;
}
}
var v = tarValue;
var p = Math.round(((v / total) * 100));
return `${name} ${p}%`;
},
itemStyle:{},
textStyle: {
color: "#666666",
padding:[0,8,0,18]
},
},
color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
series: [
{
type: 'pie',
radius: ['40%', '60%'],
center:['22%', '50%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderColor: '#fff',
borderWidth: 2
},
label: {
show: false,
position: 'center'
},
labelLine: {
show: false
},
data: this.data1
}
] ]
} };
]
};
option && myChart.setOption(option); option && myChart.setOption(option);
},
myEcharts2(){
var chartDom = document.getElementById('main2');
var myChart = echarts.init(chartDom);
var option;
option = {
tooltip: {
trigger: 'item'
}, },
myEcharts2(){ legend: {
var chartDom = document.getElementById('main2'); orient: '',
var myChart = echarts.init(chartDom); top: '22%',
var option; left: '50%',
option = { width:"auto",
tooltip: { height:"auto",
trigger: 'item' orient: "vertical",
}, itemGap: 15,
legend: { itemWidth: 14,
orient: '', // 使
top: '22%', formatter: function(name) {
left: '50%', var data = option.series[0].data;
width:"auto", var total = 0;
height:"auto", var tarValue;
orient: "vertical", for (var i = 0; i < data.length; i++) {
itemGap: 15, total += data[i].value;
itemWidth: 14, if (data[i].name == name) {
// 使 tarValue = data[i].value;
formatter: function(name) { }
var data = option.series[0].data; }
var total = 0; var v = tarValue;
var tarValue; var p = Math.round(((tarValue / total) * 100));
for (var i = 0; i < data.length; i++) { return `${name} ${p}%`;
total += data[i].value;
if (data[i].name == name) {
tarValue = data[i].value;
}
}
var v = tarValue;
var p = Math.round(((tarValue / total) * 100));
return `${name} ${p}%`;
},
itemStyle:{},
textStyle: {
color: "#666666",
padding:[0,8,0,18]
},
},
color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
series: [
{
// name: 'Access From',
type: 'pie',
radius: ['40%', '60%'],
center:['22%', '50%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderColor: '#fff',
borderWidth: 2
}, },
label: { itemStyle:{},
show: false, textStyle: {
position: 'center' color: "#666666",
padding:[0,8,0,18]
}, },
// emphasis: {
// label: {
// show: true,
// fontSize: '40',
// fontWeight: 'bold'
// }
// },
labelLine: {
show: false
}, },
data: [ color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
{ value: 1048, name: '算法' }, series: [
{ value: 735, name: '图层' }, {
{ value: 580, name: '开发' }, // name: 'Access From',
{ value: 484, name: '业务' }, type: 'pie',
radius: ['40%', '60%'],
center:['22%', '50%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderColor: '#fff',
borderWidth: 2
},
label: {
show: false,
position: 'center'
},
labelLine: {
show: false
},
data: this.data2
}
] ]
} };
]
};
option && myChart.setOption(option); option && myChart.setOption(option);
},
myEcharts3(){
var chartDom = document.getElementById('main3');
var myChart = echarts.init(chartDom);
var option;
option = {
tooltip: {
trigger: 'item'
}, },
myEcharts3(){ legend: {
var chartDom = document.getElementById('main3'); orient: "vertical", type: 'scroll',
var myChart = echarts.init(chartDom); top: '22%',
var option; left: '50%',
option = { width:"auto",
tooltip: { height:"auto",
trigger: 'item' orient: "vertical",
}, itemGap: 15,
legend: { itemWidth: 14,
orient: '',
top: '22%', // 使
left: '50%', formatter: function(name) {
width:"auto", var data = option.series[0].data;
height:"auto", var total = 0;
orient: "vertical", var tarValue;
itemGap: 15, for (var i = 0; i < data.length; i++) {
itemWidth: 14, total += data[i].value;
// 使 if (data[i].name == name) {
formatter: function(name) { tarValue = data[i].value;
var data = option.series[0].data; }
var total = 0; }
var tarValue; var v = tarValue;
for (var i = 0; i < data.length; i++) { var p = Math.round(((tarValue / total) * 100));
total += data[i].value; return `{a|${name}} {b|${p}%}`;
if (data[i].name == name) { },
tarValue = data[i].value; itemStyle:{},
} textStyle: {
} rich: {
var v = tarValue; // richoneonetwotwothreethree""
var p = Math.round(((tarValue / total) * 100)); a: {
return `${name} ${p}%`; //
}, width: 100,
itemStyle:{}, color: "#000000",
textStyle: { fontSize: 12,
color: "#666666", fontWeight: "bolder",
padding:[0,8,0,18] },
}, b: {
}, // 102030
color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'], width: 35,
series: [ color: "#333",
{ fontSize: 12,
// name: 'Access From', },
type: 'pie', },
radius: ['40%', '60%'], color: "#666666",
center:['22%', '50%'], backgroundColor: "transparent",
avoidLabelOverlap: false, padding:[0,8,0,18]
itemStyle: { },
borderRadius: 10,
borderColor: '#fff',
borderWidth: 2
}, },
label: { color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
show: false, series: [
position: 'center' {
}, // name: 'Access From',
// emphasis: { type: 'pie',
// label: { radius: ['40%', '60%'],
// show: true, center:['22%', '50%'],
// fontSize: '40', avoidLabelOverlap: false,
// fontWeight: 'bold' itemStyle: {
// } borderRadius: 10,
// }, borderColor: '#fff',
labelLine: { borderWidth: 2
show: false },
}, label: {
data: [ show: false,
{ value: 1048, name: '应用领域' }, position: 'center'
{ value: 735, name: '应用领域2' }, },
{ value: 580, name: '应用领域3' }, // emphasis: {
{ value: 484, name: '应用领域4' }, // label: {
// show: true,
// fontSize: '40',
// fontWeight: 'bold'
// }
// },
labelLine: {
show: false
},
data:this.data3
}
] ]
} };
]
};
option && myChart.setOption(option); option && myChart.setOption(option);
} },
backBtn(){
this.$emit('closeChild')
}
} }
} }
</script> </script>
<style scoped> <style scoped>
.container{ .container{
padding-top: 15px; padding-top: 15px;
display: flex;
flex-direction: column;
} }
.title-style{ .title-style{
font-size: 24px; font-size: 24px;
@ -320,6 +449,13 @@ export default {
color:#666666; color:#666666;
margin-left: 20px; margin-left: 20px;
} }
.back-btn{
background: #3e8ef7;
border-color: rgba(101, 165, 249,0);
color: #FFF;
margin-left:1030px;
padding-bottom: 3px;
}
.container-body{ .container-body{
width:1300px; width:1300px;
margin-top:30px; margin-top:30px;
@ -358,7 +494,9 @@ export default {
padding-left: 20px; padding-left: 20px;
margin-top: 20px; margin-top: 20px;
margin-right: 20px; margin-right: 20px;
/* background-image:url("../../../assets/img/排行榜背景图.png"); */ background-image:url("../../../assets/img/排行榜背景图.png");
background-repeat:no-repeat;
background-size: 100% 100%;
} }
.container-body5{ .container-body5{
width:640px; width:640px;
@ -367,6 +505,9 @@ export default {
padding-top:20px; padding-top:20px;
padding-left: 20px; padding-left: 20px;
margin-top: 20px; margin-top: 20px;
background-image:url("../../../assets/img/排行榜背景图.png");
background-repeat:no-repeat;
background-size: 100% 100%;
} }
.footer{ .footer{
display: flex; display: flex;

View File

@ -0,0 +1,557 @@
<template>
<div class='container'>
<div>
<span class='title-style'>组件服务</span>
<span class='page-introduction'>使用情况统计</span>
<button class='back-btn' @click="backBtn">返回</button>
</div>
<div class='container-body'>
<!-- <div class='container-body1'>
<span style='font-size:18px;color;#000000;'>评分发布情况</span>
<div id="main1" style="width: 400px;height:200px;"></div>
</div> -->
<div class='container-body2'>
<span style='font-size:18px;color;#000000;'>使用组件数量分布</span>
<div id="main2" style="width: 400px;height:200px;"></div>
</div>
<div class='container-body3'>
<span style='font-size:18px;color;#000000;'>使用组件应用领域分布情况</span>
<div id="main8" style="width: 400px;height:200px;"></div>
</div>
<div class='container-body4'>
<div style='margin-bottom:30px'>
<span style='font-size:18px;color;#000000;'>被调用组件及数量</span>
<img src="@/assets/img/TOP5.png" style='margin-left:10px'>
</div>
<div v-for="(item,index) in usedList" :key='index' >
<div style='display:flex'>
<div class='ranking-img' :style="{background:colorList[index%5],width: widthList[index%5]}">
<span style='font-weight:bold' :style="{color:numColorList[index%5]}">{{index+1}}</span>
</div>
<span class='num-style'>{{item.name}}</span>
<span class='count-style' :style="{color:numColorList[index%5]}">{{item.resourceCarNum}}</span>
</div>
</div>
</div>
<div class='container-body5'>
<div style='margin-bottom:30px'>
<span style='font-size:18px;color;#000000;'>被申请组件及数量</span>
<img src="@/assets/img/TOP5.png" style='margin-left:10px'>
</div>
<div v-for="(item,index) in applicationList" :key='index' >
<div style='display:flex'>
<div class='ranking-img' :style="{background:colorList[index%5],width: widthList[index%5]}">
<span style='font-weight:bold' :style="{color:numColorList[index%5]}">{{index+1}}</span>
</div>
<span class='num-style'>{{item.name}}</span>
<span class='count-style' :style="{color:numColorList[index%5]}">{{item.resourceCarNum}}</span>
</div>
</div>
</div>
</div>
<div class='footer'>
<div class='footer-left' ></div>
<span style='color:#b7c2d1;font-size:16px'>到底啦</span>
<div class='footer-right'></div>
</div>
</div>
</template>
<script>
import * as echarts from 'echarts';
export default {
props:{
tableId:{
type:String,
default:''
},
fatherId:{
type:Number,
default:null,
}
},
data(){
return{
data1:[],
data2: [
// { value: 1048,name: '' },
// { value: 735, name: '' },
// { nums: 580, attr_value: '' },
// { nums: 484, attr_value: '' },
],
data3: [
// { value: 1048,name: '' },
],
colorList:['linear-gradient(to right, rgba(251, 59, 5,0.6),transparent)', 'linear-gradient(to right,rgba(251, 123, 5),transparent)','linear-gradient(to right,rgba(250, 179, 2,.6),transparent)','linear-gradient(to right,rgba(82, 106, 255,.6),transparent','linear-gradient(to right,rgba(82, 106, 255,.6),transparent)',],
widthList:['90px','80px','70px','60px','50px'],
numColorList:['#fc5656','#ff8a00','#f9af0a','#808fff','#808fff'],
usedList:[{name:'组件名称一',resourceCarNum:111},{name:'组件名称一',resourceCarNum:111},{name:'组件名称一',resourceCarNum:111},{name:'组件名称四',resourceCarNum:111},{name:'组件名称五',resourceCarNum:111},],
applicationList:[{name:'组件名称一',resourceCarNum:111},{name:'组件名称一',resourceCarNum:111},{name:'组件名称一',resourceCarNum:111},{name:'组件名称四',resourceCarNum:111},{name:'组件名称五',resourceCarNum:111},]
}
},
created(){
if(this.fatherId===1){
this.getBeCalled()
this.getBeApplied()
this.getAlgorithm()
this.getDistributed()
this.getScoreList()
}else{
}
},
mounted(){
},
methods:{
//
getScoreList () {
this.$http.get('/census/center/v3/assemblerScoreInfo' ,{
params : {
id:this.tableId,
resourceType:"应用资源"
// pageNo: pageNo || 1,
// pageSize: 20
}
}).then(res => {
let arry=[]
arry=res.data.data
arry.forEach((item)=>{
const single={
value:item.scoreNum,
name:item.score
}
// const newList=[]
this.data1.push(single)
// this.data2=newList
this.myEcharts1()
})
})
},
//
getAlgorithm () {
this.$http.get('/census/center/v3/assemblerUsedInfo' ,{
params : {
id:this.tableId,
resourceType:"组件服务"
// pageNo: pageNo || 1,
// pageSize: 20
}
}).then(res => {
let arry=[]
arry=res.data.data
arry.forEach((item)=>{
const single={
value:item.nums,
name:item.attr_value
}
// const newList=[]
this.data2.push(single)
// this.data2=newList
this.myEcharts2()
})
})
},
//
getDistributed () {
this.$http.get('/census/center/v3/applicationAreaCapabilityList' ,{
params : {
id:this.tableId,
resourceType:"应用资源"
}
}).then(res => {
let arry=[]
arry=res.data.data
arry.forEach((item)=>{
const single={
value:item.total,
name:item.type
}
const newList=[]
this.data3.push(single)
// this.data2=newList
this.myEcharts3()
})
})
},
//
getBeCalled () {
this.$http.get('/census/center/v3/assemblerCaredTopInfo' ,{
params : {
id:this.tableId,
resourceType:"应用资源"
// pageNo: pageNo || 1,
// pageSize: 20
}
}).then(res => {
this.applicationList =res.data.data
})
},
//
getBeApplied () {
this.$http.get('/census/center/v3/assemblerCaredTopInfo' ,{
params : {
id:this.tableId,
resourceType:"应用资源"
// pageNo: pageNo || 1,
// pageSize: 20
}
}).then(res => {
this.applicationList =res.data.data
})
},
myEcharts1(){
var chartDom = document.getElementById('main1');
var myChart = echarts.init(chartDom);
var option;
option = {
tooltip: {
trigger: 'item'
},
legend: {
orient: '',
top: '14%',
left: '55%',
width:"auto",
height:"auto",
orient: "vertical",
itemGap: 15,
itemWidth: 14,
// 使
formatter: function(name) {
var data = option.series[0].data;
var total = 0;
var tarValue;
for (var i = 0; i < data.length; i++) {
total += data[i].value;
if (data[i].name == name) {
tarValue = data[i].value;
}
}
var v = tarValue;
var p = Math.round(((v / total) * 100));
return `${name} ${p}%`;
},
itemStyle:{},
textStyle: {
color: "#666666",
padding:[0,8,0,18]
},
},
color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
series: [
{
type: 'pie',
radius: ['40%', '60%'],
center:['22%', '50%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderColor: '#fff',
borderWidth: 2
},
label: {
show: false,
position: 'center'
},
labelLine: {
show: false
},
data: this.data1
}
]
};
option && myChart.setOption(option);
},
myEcharts2(){
var chartDom = document.getElementById('main2');
var myChart = echarts.init(chartDom);
var option;
option = {
tooltip: {
trigger: 'item'
},
legend: {
orient: '',
top: '22%',
left: '50%',
width:"auto",
height:"auto",
orient: "vertical",
itemGap: 15,
itemWidth: 14,
// 使
formatter: function(name) {
var data = option.series[0].data;
var total = 0;
var tarValue;
for (var i = 0; i < data.length; i++) {
total += data[i].value;
if (data[i].name == name) {
tarValue = data[i].value;
}
}
var v = tarValue;
var p = Math.round(((tarValue / total) * 100));
return `${name} ${p}%`;
},
itemStyle:{},
textStyle: {
color: "#666666",
padding:[0,8,0,18]
},
},
color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
series: [
{
// name: 'Access From',
type: 'pie',
radius: ['40%', '60%'],
center:['22%', '50%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderColor: '#fff',
borderWidth: 2
},
label: {
show: false,
position: 'center'
},
labelLine: {
show: false
},
data: this.data2
}
]
};
option && myChart.setOption(option);
},
myEcharts3(){
var chartDom = document.getElementById('main3');
var myChart = echarts.init(chartDom);
var option;
option = {
tooltip: {
trigger: 'item'
},
legend: {
orient: "vertical", type: 'scroll',
top: '22%',
left: '50%',
width:"auto",
height:"auto",
orient: "vertical",
itemGap: 15,
itemWidth: 14,
// 使
formatter: function(name) {
var data = option.series[0].data;
var total = 0;
var tarValue;
for (var i = 0; i < data.length; i++) {
total += data[i].value;
if (data[i].name == name) {
tarValue = data[i].value;
}
}
var v = tarValue;
var p = Math.round(((tarValue / total) * 100));
return `{a|${name}} {b|${p}%}`;
},
itemStyle:{},
textStyle: {
rich: {
// richoneonetwotwothreethree""
a: {
//
width: 100,
color: "#000000",
fontSize: 12,
fontWeight: "bolder",
},
b: {
// 102030
width: 35,
color: "#333",
fontSize: 12,
},
},
color: "#666666",
backgroundColor: "transparent",
padding:[0,8,0,18]
},
},
color: ['#0087ff', '#51cb8d', '#fcc549', '#ef6567', '#ff8a00', '#fc5656'],
series: [
{
// name: 'Access From',
type: 'pie',
radius: ['40%', '60%'],
center:['22%', '50%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderColor: '#fff',
borderWidth: 2
},
label: {
show: false,
position: 'center'
},
// emphasis: {
// label: {
// show: true,
// fontSize: '40',
// fontWeight: 'bold'
// }
// },
labelLine: {
show: false
},
data:this.data3
}
]
};
option && myChart.setOption(option);
},
backBtn(){
this.$emit('closeChild')
}
}
}
</script>
<style scoped>
.container{
padding-top: 15px;
display: flex;
flex-direction: column;
}
.title-style{
font-size: 24px;
color:#000000;
font-weight: bold;
}
.page-introduction{
font-size: 18px;
color:#666666;
margin-left: 20px;
}
.back-btn{
background: #3e8ef7;
border-color: rgba(101, 165, 249,0);
color: #FFF;
margin-left:1030px;
padding-bottom: 3px;
}
.container-body{
width:1300px;
margin-top:30px;
display: flex;
flex-wrap:wrap
}
.container-body1{
width:420px;
height:250px;
background-color: #ffffff;
margin-right:20px;
padding-top:20px;
padding-left: 20px;
}
.container-body2{
width:640px;
height:250px;
background-color: #ffffff;
margin-right:20px;
padding-top:20px;
padding-left: 20px;
}
.container-body3{
width:640px;
height:250px;
background-color: #ffffff;
padding-top:20px;
padding-left: 20px;
}
.container-body4{
width:640px;
height:300px;
background-color: #ffffff;
padding-top:20px;
padding-left: 20px;
margin-top: 20px;
margin-right: 20px;
background-image:url("../../../assets/img/排行榜背景图.png");
background-repeat:no-repeat;
background-size: 100% 100%;
}
.container-body5{
width:640px;
height:300px;
background-color: #ffffff;
padding-top:20px;
padding-left: 20px;
margin-top: 20px;
background-image:url("../../../assets/img/排行榜背景图.png");
background-repeat:no-repeat;
background-size: 100% 100%;
}
.footer{
display: flex;
margin-top:50px;
margin-left:365px;
}
.footer-left{
width:250px;
height:1px;
background-color:#e0eaf8;
margin-right:10px;
margin-top:8px
}
.footer-right{
width:250px;
height:1px;
background-color:#e0eaf8;
margin-left:10px;
margin-top:8px
}
.ranking-img{
width:60px;
height:26px;
display: flex;
line-height: 26px;
margin-bottom:15px;
margin-right:10px;
padding-left: 15px;
}
.num-style{
position:absolute;
display: flex;
margin-left:90px;
margin-top:5px;
color:#333333;
font-size: 16px;
}
.count-style{
position:absolute;
display: flex;
margin-left:400px;
margin-top:5px;
color:#333333;
font-size: 18px;
font-weight: bold;
}
</style>

View File

@ -1,6 +1,7 @@
<template> <template>
<div class='container'> <div >
<div class='container-left'> <div class='container'>
<!-- <div class='container-left' v-if='homeIsShow'>
<div class='left-search'> <div class='left-search'>
<div> <div>
<input type="text" class='input-style' placeholder="请输入部门关键词" v-model="inputTxt"> <input type="text" class='input-style' placeholder="请输入部门关键词" v-model="inputTxt">
@ -20,7 +21,7 @@
{{ node.label }} {{ node.label }}
</span> </span>
</el-tree> </el-tree>
</div> </div> -->
<el-card shadow="never" class="aui-card--fill" v-if='homeIsShow'> <el-card shadow="never" class="aui-card--fill" v-if='homeIsShow'>
<div class="mod-demand__bsdemand"> <div class="mod-demand__bsdemand">
<div class='top-box'> <div class='top-box'>
@ -35,57 +36,57 @@
<span style='margin-right:30px' :class="[departmentId===1?'departmentStyle':'']" @click="handleChose(1)"> <span style='margin-right:30px' :class="[departmentId===1?'departmentStyle':'']" @click="handleChose(1)">
部门发布情况 部门发布情况
</span> </span>
<span :class="[departmentId===2?'departmentStyle':'']" @click="handleChose(2)"> <span v-if='this.choseId===0' :class="[departmentId===2?'departmentStyle':'']" @click="handleChose(2)">
部门使用情况 部门使用情况
</span> </span>
</div> </div>
<div class='line-style'></div> <div class='line-style'></div>
<el-table <el-table
:data="tableData" :data="tableData"
border border
style="width: 100%"> style="width: 100%">
<el-table-column <el-table-column
prop="name" prop="deptName"
label="部门名称" label="部门名称"
min-width="100%"> min-width="100%">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="releaseNum" prop="resourceNum"
label="发布总数" label="发布总数"
min-width="100%"> min-width="100%">
</el-table-column> </el-table-column>
<el-table-column <el-table-column v-if="this.choseId===0"
prop="applyNum" prop="resourceCarNum"
label="被申请总数" label="被申请总数"
min-width="100%"> min-width="100%">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="browseNmu" prop="resourceBrowseNum"
label="浏览总量" label="浏览总量"
min-width="100%"> min-width="100%">
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="collectNum" prop="resourceCollectionNum"
label="收藏量" label="收藏量"
min-width="100%"> min-width="100%">
</el-table-column> </el-table-column>
<el-table-column <el-table-column v-if="this.choseId===0"
prop="transferNum" prop="resourceVisits"
label="被调用总数" label="被调用总数"
min-width="100%"> min-width="100%">
</el-table-column> </el-table-column>
<el-table-column <el-table-column v-if="this.choseId===0"
prop="applicationNum" prop="resourceRelNum"
label="被应用总数" label="被应用总数"
min-width="100%"> min-width="100%">
</el-table-column> </el-table-column>
<el-table-column <el-table-column v-if="this.choseId===0"
prop="needApplicationNum" prop="resourceShareNum"
label="需申请数量" label="需申请数量"
min-width="100%"> min-width="100%">
</el-table-column> </el-table-column>
<el-table-column <el-table-column v-if="this.choseId===0"
prop="reductionNum" prop="resourceShareNonNum"
label="免批数量" label="免批数量"
min-width="100%"> min-width="100%">
</el-table-column> </el-table-column>
@ -99,28 +100,34 @@
</el-table> </el-table>
<div class="block"> <div class="block">
<el-pagination <el-pagination
@size-change="handleSizeChange" @current-change="handleCurrentChange"
@current-change="getALLTree"
:current-page="currentPage4"
:page-sizes="[10, 20, 30, 40]"
layout="total, prev, pager, next, jumper" layout="total, prev, pager, next, jumper"
:total="50"> :total="total"
:page-size="5"
:current-page="currentPage"
>
</el-pagination> </el-pagination>
</div> </div>
</div> </div>
</el-card> </el-card>
<component-services v-if='servicesIsShow' ></component-services> </div>
<application-resources v-if='resourcesIsShow'></application-resources> <component-used v-if='UsedIsShow' :tableId='tableId' :fatherId='fatherId' @closeChild='closeChild'></component-used>
<component-services v-if='servicesIsShow' :tableId='tableId' :fatherId='fatherId' @closeChild='closeChild'></component-services>
<application-resources v-if='resourcesIsShow' :tableId='tableId' :fatherId='fatherId' @closeApplication='closeApplication'></application-resources>
</div> </div>
</template> </template>
<script> <script>
import componentServices from './componentServices.vue' import componentServices from './componentServices.vue'
import componentUsed from './componentUsed.vue'
import applicationResources from './applicationResources.vue' import applicationResources from './applicationResources.vue'
import ComponentUsed from './componentUsed.vue'
export default { export default {
components:{componentServices,applicationResources}, components:{componentServices,applicationResources, ComponentUsed},
data(){ data(){
return{ return{
inputTxt:'', inputTxt:'',
tableId:'',
fatherId:'',
treeData: [{ treeData: [{
label: '一级 1', label: '一级 1',
children: [{ children: [{
@ -156,79 +163,49 @@ export default {
}] }]
}] }]
}], }],
total:null,
defaultProps: { defaultProps: {
children: 'children', children: 'children',
label: 'name' label: 'name'
}, },
choseId:null, choseId:0,
departmentId:1, departmentId:1,
currentPage4: 4, currentPage: 1,
homeIsShow:true, homeIsShow:true,
servicesIsShow:false, servicesIsShow:false,
resourcesIsShow:false, resourcesIsShow:false,
UsedIsShow:false,
titleList:[ titleList:[
{name:'组件服务',key:1}, {name:'应用资源',key:2}, {name:'基础设施',key:3}, {name:'数据资源',key:3}, {name:'知识库',key:3}, {name:'组件服务',key:1}, {name:'应用资源',key:2}, {name:'基础设施',key:3}, {name:'数据资源',key:3}, {name:'知识库',key:3},
], ],
tableData: [{ tableData: [{deptName:'部门',resourceNum:222}]
name: '部门名称一',
releaseNum: 111,
applyNum: 222,
browseNmu: 333,
collectNum:444,
transferNum:555,
applicationNum:666,
needApplicationNum:777,
reductionNum:888,
},{
name: '部门名称一',
releaseNum: 111,
applyNum: 222,
browseNmu: 333,
collectNum:444,
transferNum:555,
applicationNum:666,
needApplicationNum:777,
reductionNum:888,
},{
name: '部门名称一',
releaseNum: 111,
applyNum: 222,
browseNmu: 333,
collectNum:444,
transferNum:555,
applicationNum:666,
needApplicationNum:777,
reductionNum:888,
},{
name: '部门名称一',
releaseNum: 111,
applyNum: 222,
browseNmu: 333,
collectNum:444,
transferNum:555,
applicationNum:666,
needApplicationNum:777,
reductionNum:888,
},
]
} }
}, },
created(){ created(){
this.getALLTree()
},
mounted(){
this.getFirstTree()
}, },
methods: { methods: {
// //
searchBtn(){ // searchBtn(){
this.getALLTree() // this.getALLTree()
}, // },
// // //
handleNodeClick(data) { // handleNodeClick(data) {
console.log(data.name); // console.log(data.name);
this.getTreeName(data) // this.getTreeName(data)
}, // },
//
handleCurrentChange(val){ handleCurrentChange(val){
this.getALLTree(val) if(this.choseId===0){
this.getFirstTree(val)
}
else if(this.choseId===1){
this.getReleaseTree(val)
}
}, },
getTreeName (data) { getTreeName (data) {
this.$http.get('/census/center/v3/treeList/' ,{ this.$http.get('/census/center/v3/treeList/' ,{
@ -239,81 +216,148 @@ export default {
// pageSize: 20 // pageSize: 20
} }
}).then(res => { }).then(res => {
this.tableData =res.data.data // this.tableData =res.data.data
}) })
}, },
// // //
getALLTree () { // getALLTree () {
this.$http.get('/census/center/v3/treeList/' ,{ // this.$http.get('/census/center/v3/treeList/' ,{
params : { // params : {
keywords:this.inputTxt, // keywords:this.inputTxt,
deptId:'1067246875800000066', // deptId:'1067246875800000066',
// pageNo: pageNo || 1, // // pageNo: pageNo || 1,
// pageSize: 20 // // pageSize: 20
} // }
}).then(res => { // }).then(res => {
this.treeData =res.data.data // this.treeData =res.data.data
this.tableData =res.data.data // // this.tableData =res.data.data
}) // })
}, // },
//
getFirstTree () { //
getFirstTree (page) {
this.$http.get('/census/center/v3/resourceReleaseDetails/' ,{ this.$http.get('/census/center/v3/resourceReleaseDetails/' ,{
params : { params : {
limit:100, page:page||1,
page:1, limit:5,
id:null, // id:'1067246875800000066',
resourceType:'资源类型' resourceType:'组件服务'
} }
}).then(res => { }).then(res => {
this.tableData =res.data.data // this.tableData =res.data.data.list
this.total = res.data.data.total
}) })
}, },
// 使 // 使
getSecondTree () { getSecondTree () {
this.$http.get('/census/center/v3/resourceUsedDetails/' ,{ this.$http.get('/census/center/v3/resourceUsedDetails/' ,{
params : { params : {
keywords:'', limit:5,
deptId:'1067246875800000066', page:1,
} // id:'1067246875800000064',
resourceType:'组件服务'
}
}).then(res => { }).then(res => {
this.tableData =res.data.data // this.tableData =res.data.data.list
console.log('2222',this.tableData)
})
},
//
getReleaseTree (page) {
this.$http.get('/census/center/v3/resourceReleaseDetails/' ,{
params : {
limit:5,
page:page||1,
// id:'1067246875800000066',
resourceType:'应用资源'
}
}).then(res => {
// this.tableData =res.data.data.list
this.total = res.data.data.total
})
},
// 使
getUsedTree () {
this.$http.get('/census/center/v3/resourceReleaseDetails/' ,{
params : {
limit:5,
page:1,
// id:'1067246875800000066',
resourceType:'应用资源'
}
}).then(res => {
// this.tableData =res.data.data.list
}) })
}, },
handleClick(row) { handleClick(row) {
console.log(row); if(this.choseId===0){
if(this.departmentId===1){
this.homeIsShow=false
this.servicesIsShow=true
this.tableId=row.deptId
this.fatherId=1
}else if(this.departmentId===2){
this.homeIsShow=false
this.UsedIsShow=true
this.tableId=row.deptId
this.fatherId=1
}
else if(this.choseId===1){
this.homeIsShow=false
this.resourcesIsShow=true
this.tableId=row.deptId
this.fatherId=2
}
}
}, },
// //
choseBtn(index){ choseBtn(index){
this.choseId=index this.choseId=index
if (index===0){ this.handleChose(1)
this.homeIsShow=false
this.servicesIsShow=true
} else if(index===1){
this.homeIsShow=false
this.servicesIsShow=false
this.resourcesIsShow=true
}
}, },
// choseBtn(index){
// this.choseId=index
// if (index===0){
// this.homeIsShow=false
// this.servicesIsShow=true
// } else if(index===1){
// this.homeIsShow=false
// this.servicesIsShow=false
// this.resourcesIsShow=true
// }
// },
//or使 //or使
handleChose(index){ handleChose(index){
this.departmentId=index this.departmentId=index
if(index===1){ if(index===1){
this.getFirstTree() if(this.choseId===0){
} this.getFirstTree()
else{ }else if(this.choseId===1){
this.getSecondTree() this.getReleaseTree()
}
}else if(index===2){
if(this.choseId===0){
this.getSecondTree()
}else{
this.getUsedTree()
}
} }
}, },
// //
handleSizeChange(val) { handleSizeChange(val) {
console.log(`每页 ${val}`); console.log(`每页 ${val}`);
}, },
handleCurrentChange(val) { closeChild(){
console.log(`当前页: ${val}`); this.homeIsShow=true
this.servicesIsShow=false
},
closeApplication(){
this.homeIsShow=true
this.resourcesIsShow=false
} }
}, },
@ -322,10 +366,12 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.container{ .container{
display: flex; display: flex;
} }
.container-left{ .container-left{
width:250px; width:250px;
height:1000px; height:1000px;
display: inline-block;
// background-color: #ffffff; // background-color: #ffffff;
margin-right:10px margin-right:10px
} }
@ -371,7 +417,9 @@ input::placeholder {
.top-box{ .top-box{
height:80px; height:80px;
width:100%;
background-color: #fafafc; background-color: #fafafc;
display: inline-block;
} }
.title{ .title{
display: flex; display: flex;

View File

@ -66,21 +66,35 @@
</el-form-item> </el-form-item>
</div> </div>
<div v-if="!shifoushizujian"> <div v-if="!shifoushizujian">
<el-form-item label="组件名称"> <el-form-item label="组件名称" v-if="algorithmShow">
<el-input <el-input
v-model="dataForm.name" v-model="dataForm.name"
:disabled="fieldDisabled" :disabled="fieldDisabled"
placeholder="组件名称" placeholder="组件名称"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="应用描述"> <el-form-item label="算法名称" v-if="nameNotShow">
<el-input
v-model="dataForm.name"
:disabled="fieldDisabled"
placeholder="算法名称"
></el-input>
</el-form-item>
<el-form-item label="应用描述" v-if="algorithmShow">
<el-input <el-input
v-model="dataForm.description" v-model="dataForm.description"
:disabled="fieldDisabled" :disabled="fieldDisabled"
placeholder="应用描述" placeholder="应用描述"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="部门联系人"> <el-form-item label="算法描述" v-if="nameNotShow">
<el-input
v-model="dataForm.description"
:disabled="fieldDisabled"
placeholder="算法描述"
></el-input>
</el-form-item>
<el-form-item label="部门联系人" v-if="algorithmShow">
<el-input <el-input
v-model="dataForm.deptContacts" v-model="dataForm.deptContacts"
:disabled="fieldDisabled" :disabled="fieldDisabled"
@ -94,7 +108,7 @@
placeholder="共享类型" placeholder="共享类型"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="共享方式"> <el-form-item label="共享方式" v-if="coverageNotShow && algorithmShow">
<el-input <el-input
v-model="dataForm.shareMode" v-model="dataForm.shareMode"
:disabled="fieldDisabled" :disabled="fieldDisabled"
@ -108,14 +122,14 @@
placeholder="共享方条件" placeholder="共享方条件"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="服务接口"> <el-form-item label="服务接口" v-if="coverageNotShow">
<el-input <el-input
v-model="dataForm.apiUrl" v-model="dataForm.apiUrl"
:disabled="fieldDisabled" :disabled="fieldDisabled"
placeholder="服务接口" placeholder="服务接口"
></el-input> ></el-input>
</el-form-item> </el-form-item>
<el-form-item label="接口请求方式"> <el-form-item label="接口请求方式" v-if="coverageNotShow">
<el-input <el-input
v-model="dataForm.applyCount" v-model="dataForm.applyCount"
:disabled="fieldDisabled" :disabled="fieldDisabled"
@ -179,7 +193,10 @@ export default {
fieldDisabled: false, fieldDisabled: false,
dataForm: [], dataForm: [],
id: '', id: '',
shifoushizujian: true shifoushizujian: true,
coverageNotShow: true,
nameNotShow: false,
algorithmShow: true
} }
}, },
watch: {}, watch: {},
@ -209,6 +226,15 @@ export default {
this.dataForm = res.data.resourceDTO this.dataForm = res.data.resourceDTO
if (this.dataForm.type != '应用资源') { if (this.dataForm.type != '应用资源') {
this.shifoushizujian = false this.shifoushizujian = false
this.dataForm.infoList.forEach((val) => {
if (val.attrValue === '图层服务') {
this.coverageNotShow = false
} else if (val.attrValue === '智能算法') {
this.nameNotShow = true
this.algorithmShow = false
console.log(this.nameNotShow, 'wowowo')
}
})
} else { } else {
this.shifoushizujian = true this.shifoushizujian = true
} }

View File

@ -578,7 +578,7 @@ export default {
const isLt2M = file.size / 1024 / 1024 < 2 const isLt2M = file.size / 1024 / 1024 < 2
if (!isImage) { if (!isImage) {
this.$message.error('上传头像图片只能是 JPG 格式!') this.$message.error('上传头像图片只能是 jpg/png 格式!')
} }
if (!isLt2M) { if (!isLt2M) {
this.$message.error('上传头像图片大小不能超过 2MB!') this.$message.error('上传头像图片大小不能超过 2MB!')
@ -601,7 +601,7 @@ export default {
const isLt2M = file.size / 1024 / 1024 < 2 const isLt2M = file.size / 1024 / 1024 < 2
if (!isImage) { if (!isImage) {
this.$message.error('上传头像图片只能是 JPG 格式!') this.$message.error('上传头像图片只能是 jpg/png 格式!')
} }
if (!isLt2M) { if (!isLt2M) {
this.$message.error('上传头像图片大小不能超过 2MB!') this.$message.error('上传头像图片大小不能超过 2MB!')

View File

@ -2,7 +2,7 @@
* @Author: hisense.liangjunhua * @Author: hisense.liangjunhua
* @Date: 2022-06-29 15:59:51 * @Date: 2022-06-29 15:59:51
* @LastEditors: hisense.liangjunhua * @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-06-29 18:17:07 * @LastEditTime: 2022-07-01 09:29:57
* @Description: 告诉大家这是什么 * @Description: 告诉大家这是什么
--> -->
<!-- 流程业务表单 --> <!-- 流程业务表单 -->
@ -183,16 +183,30 @@ export default {
}) })
} }
this.dataForm.content = res.data.tAbilityApplicationDTOList[0] this.dataForm.content = res.data.tAbilityApplicationDTOList[0]
const obj = {
name: '申请摄像头列表',
type: '基础设施',
describe: ''
}
let flag = false
res.data.tAbilityApplicationDTOList.map(val => { res.data.tAbilityApplicationDTOList.map(val => {
this.$http.get('/resource/' + val.resourceId).then(res1 => { if (val.cameraList) {
console.log(res1.data.data, '1111111111111111111111111111111111') flag = true
this.dataList.push({ obj.describe += val.system
name: res1.data.data.name, } else {
type: res1.data.data.type, this.$http.get('/resource/' + val.resourceId).then(res1 => {
describe: res1.data.data.description // console.log(res1.data.data, '1111111111111111111111111111111111')
this.dataList.push({
name: res1.data.data.name,
type: res1.data.data.type,
describe: res1.data.data.description
})
}) })
}) }
}) })
if (flag) {
this.dataList.push(obj)
}
}) })
.catch(() => {}) .catch(() => {})
}, },

View File

@ -91,16 +91,23 @@
<script> <script>
import * as echarts from 'echarts' import * as echarts from 'echarts'
import * as moment from 'moment'
export default { export default {
components: {}, components: {},
props: {}, props: {
callTheTrendData: {
type: Object,
default: () => {}
}
},
data () { data () {
return { return {
endAndstartTime: {},
requestOverviewData: [ requestOverviewData: [
{ name: '请求次数', tatol: '99999' }, { name: '请求次数', tatol: '99999' },
{ name: '请求成功次数', tatol: '99999' }, { name: '请求成功次数', tatol: '99999' },
{ name: '请求失败次数', tatol: '99999' }, { name: '请求失败次数', tatol: '99999' },
{ name: '平均时延', tatol: '99999' } { name: '平均时延', tatol: '0' }
], // ], //
requestOverviewBg: [ requestOverviewBg: [
{ {
@ -134,6 +141,14 @@ export default {
labalColor: '#1182fb' labalColor: '#1182fb'
} }
], ],
qingQiuQuShiTime: [],
qingQiuQuShiValue: [],
qingQiuQuShiValue2: [],
shuJuLiuLiang: {
time: [],
chuvalue: [],
ruvalue: []
},
abilityListTabData: ['请求次数', '请求失败次数', '平均延时'], // tab abilityListTabData: ['请求次数', '请求失败次数', '平均延时'], // tab
newTab: '请求次数', newTab: '请求次数',
abilityListData: [ abilityListData: [
@ -180,7 +195,235 @@ export default {
] // ] //
} }
}, },
watch: {}, watch: {
callTheTrendData: {
deep: true,
handler () {
this.endAndstartTime = this.callTheTrendData
if (this.endAndstartTime.end != this.endAndstartTime.start) {
this.$http
.get(
'/metrics/api/v1/query?' +
'query=sum(increase(apigateway_http_status[1d]))&start=' +
this.endAndstartTime.start +
'&end=' +
this.endAndstartTime.end +
'&step=' +
this.endAndstartTime.end +
')'
)
.then((res) => {
if (res.data.data.result[0]) {
this.requestOverviewData[0].tatol = parseInt(
res.data.data.result[0].value[1]
)
} else {
this.requestOverviewData[0].tatol = 0
}
})
this.$http
.get(
'/metrics/api/v1/query?query=sum(apigateway_http_status{code=~"^4..|^5.."} offset ' +
this.endAndstartTime.start +
' - apigateway_http_status{code=~"^4..|^5.."} offset ' +
this.endAndstartTime.end +
')&time=' +
this.endAndstartTime.end
)
.then((res) => {
if (res.data) {
this.requestOverviewData[1].tatol = parseInt(
res.data.data.result[0].value[1]
)
} else {
this.requestOverviewData[1].tatol = 0
}
})
} else {
this.$http
.get(
'/metrics/api/v1/query?query=sum(apigateway_http_status)&time=' +
this.endAndstartTime.end
)
.then((res) => {
if (res.data.data.result[0]) {
this.requestOverviewData[0].tatol = parseInt(
res.data.data.result[0].value[1]
)
} else {
this.requestOverviewData[0].tatol = 0
}
})
//
this.$http
.get(
'/metrics/api/v1/query?query=sum(apigateway_http_status%7Bcode%3D~%22%5E2..%22%7D)&time=' +
this.endAndstartTime.end
)
.then((res) => {
if (res.data.data.result.length != 0) {
this.requestOverviewData[1].tatol = parseInt(
res.data.data.result[0].value[1]
)
this.requestOverviewData[2].tatol =
this.requestOverviewData[0].tatol -
this.requestOverviewData[1].tatol
} else {
this.requestOverviewData[1].tatol = 0
this.requestOverviewData[2].tatol = 0
}
})
//
this.$http
.get(
'/metrics/api/v1/query?query=histogram_quantile(0.99, sum(rate(apigateway_http_latency_bucket%5B1d%5D))%20by%20(le))&time=' +
this.endAndstartTime.end -
24 * 60 * 60
)
.then((res) => {
if (res.data.data.result[0]) {
debugger
this.requestOverviewData[3].tatol = parseInt(
res.data.data.result[0].value[1]
)
} else {
this.requestOverviewData[3].tatol = 0
}
})
//
const starttime = parseInt(
(Date.parse(new Date()) - 168 * 60 * 60 * 1000) / 1000
)
//
this.$http
.get(
'/metrics/api/v1/query_range?query=sum(increase(apigateway_http_status%7Bcode%3D~%22%5E4..%7C%5E5..%22%7D%5B1d%5D))&start=' +
starttime +
'&end=' +
this.endAndstartTime.end +
'&step=86400'
)
.then((res) => {
if (res.data.data.result[0]) {
res.data.data.result[0].values.map((item) => {
this.qingQiuQuShiValue2.push(parseInt(item[1]))
console.log(this.qingQiuQuShiTime)
})
this.myCharts1()
this.myCharts3()
} else {
this.requestOverviewData[0].tatol = 0
}
})
//
this.$http
.get(
'/metrics/api/v1/query_range?query=sum(increase(apigateway_http_status%5B1d%5D))&start=' +
starttime +
'&end=' +
this.endAndstartTime.end +
'&step=' +
86400
)
.then((res) => {
if (res.data.data.result[0]) {
this.qingQiuQuShiTime = []
res.data.data.result[0].values.map((item, index) => {
this.qingQiuQuShiTime.push(
moment(item[0] * 1000).format('MM-DD')
)
this.qingQiuQuShiValue.push(
parseInt(item[1]) - this.qingQiuQuShiValue2[index]
)
console.log(this.qingQiuQuShiTime)
})
this.myCharts1()
this.myCharts3()
} else {
this.requestOverviewData[0].tatol = 0
}
})
//
this.$http
.get(
'/metrics/api/v1/query_range?query=sum(increase(apigateway_bandwidth%7Btype%3D%22egress%22%7D%5B1d%5D))&start=' +
starttime +
'&end=' +
this.endAndstartTime.end +
'&step=' +
86400
)
.then((res) => {
this.shuJuLiuLiang.chuvalue = []
this.shuJuLiuLiang.time = []
if (res.data.data.result[0]) {
res.data.data.result[0].values.map((item, index) => {
this.shuJuLiuLiang.time.push(
moment(item[0] * 1000).format('MM-DD')
)
this.shuJuLiuLiang.chuvalue.push(
parseInt(item[1]) - this.qingQiuQuShiValue2[index]
)
console.log(this.qingQiuQuShiTime)
})
this.myCharts2()
} else {
this.requestOverviewData[0].tatol = 0
}
})
//
this.$http
.get(
'/metrics/api/v1/query_range?query=sum(increase(apigateway_bandwidth%7Btype%3D%22ingress%22%7D%5B1d%5D))&start=' +
starttime +
'&end=' +
this.endAndstartTime.end +
'&step=' +
86400
)
.then((res) => {
this.shuJuLiuLiang.ruvalue = []
if (res.data.data.result[0]) {
res.data.data.result[0].values.map((item, index) => {
this.shuJuLiuLiang.ruvalue.push(
parseInt(item[1]) - this.qingQiuQuShiValue2[index]
)
console.log(this.qingQiuQuShiTime)
})
this.myCharts2()
} else {
this.requestOverviewData[0].tatol = 0
}
})
//
this.$http
.get(
'/metrics/api/v1/query_range?query=histogram_quantile(0.99, sum(rate(apigateway_http_latency_bucket%7Btype%3D%22request%22%7D%5B1d%5D)) by (le))&start=' +
starttime +
'&end=' +
this.endAndstartTime.end +
'&step=' +
86400
)
.then((res) => {
debugger
if (res.data.data.result[0]) {
res.data.data.result[0].values.map((item, index) => {
this.shuJuLiuLiang.ruvalue.push(
parseInt(item[1]) - this.qingQiuQuShiValue2[index]
)
console.log(this.qingQiuQuShiTime)
})
this.myCharts2()
} else {
this.requestOverviewData[0].tatol = 0
}
})
}
console.log('this.endAndstartTime', this.endAndstartTime)
}
}
},
computed: {}, computed: {},
methods: { methods: {
// echarts // echarts
@ -236,7 +479,7 @@ export default {
color: '#ebebeb' color: '#ebebeb'
} }
}, },
data: ['1', '2', '3', '4', '5', '6', '7', '8'] data: this.qingQiuQuShiTime
} }
], ],
yAxis: [ yAxis: [
@ -313,7 +556,7 @@ export default {
borderWidth: 12 borderWidth: 12
} }
}, },
data: [20, 82, 91, 34, 50, 20, 10, 25] data: this.qingQiuQuShiValue
}, },
{ {
name: '失败次数', name: '失败次数',
@ -357,7 +600,7 @@ export default {
borderWidth: 12 borderWidth: 12
} }
}, },
data: [20, 10, 25, 45, 22, 65, 22, 20] data: this.qingQiuQuShiValue2
} }
] ]
} }
@ -415,7 +658,7 @@ export default {
color: '#ebebeb' color: '#ebebeb'
} }
}, },
data: ['1', '2', '3', '4', '5', '6', '7', '8'] data: this.shuJuLiuLiang.time
} }
], ],
yAxis: [ yAxis: [
@ -492,7 +735,7 @@ export default {
borderWidth: 12 borderWidth: 12
} }
}, },
data: [20, 82, 91, 34, 50, 20, 10, 25] data: this.shuJuLiuLiang.chuvalue
}, },
{ {
name: '入口流量', name: '入口流量',
@ -536,7 +779,7 @@ export default {
borderWidth: 12 borderWidth: 12
} }
}, },
data: [20, 10, 25, 45, 22, 65, 22, 20] data: this.shuJuLiuLiang.ruvalue
} }
] ]
} }
@ -594,7 +837,7 @@ export default {
color: '#ebebeb' color: '#ebebeb'
} }
}, },
data: ['1', '2', '3', '4', '5', '6', '7', '8'] data: this.qingQiuQuShiTime
} }
], ],
yAxis: [ yAxis: [
@ -671,7 +914,7 @@ export default {
borderWidth: 12 borderWidth: 12
} }
}, },
data: [20, 10, 25, 45, 22, 65, 22, 20] data: this.qingQiuQuShiValue2
} }
] ]
} }

View File

@ -5,15 +5,40 @@
<h1 class="topTitle">能力运行平台</h1> <h1 class="topTitle">能力运行平台</h1>
<div class="topNav"> <div class="topNav">
<div class="topTab"> <div class="topTab">
<div @click="timeSwitch('日')" :class="timeSwitchindex == '日' ? 'timeDown' : ''">当天</div> <div
<div @click="timeSwitch('周')" :class="timeSwitchindex == '周' ? 'timeDown' : ''">最近一周</div> @click="timeSwitch('日')"
<div @click="timeSwitch('月')" :class="timeSwitchindex == '月' ? 'timeDown' : ''">最近一月</div> :class="timeSwitchindex == '日' ? 'timeDown' : ''"
>
当天
</div>
<div
@click="timeSwitch('周')"
:class="timeSwitchindex == '周' ? 'timeDown' : ''"
>
最近一周
</div>
<div
@click="timeSwitch('月')"
:class="timeSwitchindex == '月' ? 'timeDown' : ''"
>
最近一月
</div>
</div> </div>
<div class="topTimme"> <div class="topTimme">
<span>选择时间段</span> <span>选择时间段</span>
<el-date-picker v-model="timeStart" type="date" placeholder="请选择起始时间" :picker-options="pickerOptions0"> <el-date-picker
v-model="timeStart"
type="date"
placeholder="请选择起始时间"
:picker-options="pickerOptions0"
>
</el-date-picker> </el-date-picker>
<el-date-picker v-model="timeEnd" type="date" placeholder="请选择结束时间" :picker-options="pickerOptions1"> <el-date-picker
v-model="timeEnd"
type="date"
placeholder="请选择结束时间"
:picker-options="pickerOptions1"
>
</el-date-picker> </el-date-picker>
<el-button type="primary" round>确定</el-button> <el-button type="primary" round>确定</el-button>
</div> </div>
@ -23,7 +48,9 @@
<abnormal-situation></abnormal-situation> <abnormal-situation></abnormal-situation>
</div> </div>
<div class="capability-operation-monitoring-bottom"> <div class="capability-operation-monitoring-bottom">
<analysis-of-the-request></analysis-of-the-request> <analysis-of-the-request
:callTheTrendData="callTheTrendData"
></analysis-of-the-request>
</div> </div>
</div> </div>
</template> </template>
@ -31,7 +58,6 @@
<script> <script>
import AbnormalSituation from './components/AbnormalSituation.vue' import AbnormalSituation from './components/AbnormalSituation.vue'
import AnalysisOfTheRequest from './components/AnalysisOfTheRequest.vue' import AnalysisOfTheRequest from './components/AnalysisOfTheRequest.vue'
import * as moment from 'moment'
export default { export default {
components: { components: {
AbnormalSituation, AbnormalSituation,
@ -55,7 +81,10 @@ export default {
return time.getTime() < this.timeStart return time.getTime() < this.timeStart
} }
}, },
callTheTrendData: [] callTheTrendData: {
start: '',
end: ''
}
} }
}, },
watch: {}, watch: {},
@ -63,31 +92,31 @@ export default {
methods: { methods: {
timeSwitch (name) { timeSwitch (name) {
this.timeSwitchindex = name this.timeSwitchindex = name
this.callTheTrendData = []
if (name == '周') { if (name == '周') {
for (let i = 0; i < 7; i++) { const start = parseInt(
const time = moment() (Date.parse(new Date()) - 168 * 60 * 60 * 1000) / 1000
.subtract('days', 6 - i) )
.format('MM-DD') this.callTheTrendData.start = start
this.callTheTrendData.push(time) console.log(
} console.log('time', this.callTheTrendData, name) 'this.callTheTrendData',
// callTheTrend(callTheTrendData.value) parseInt((Date.parse(new Date()) - 168 * 60 * 60 * 1000) / 1000)
)
} else if (name == '月') { } else if (name == '月') {
for (let i = 0; i < 31; i++) { const start = parseInt(
const time = moment() (Date.parse(new Date()) - 720 * 60 * 60 * 1000) / 1000
.subtract('days', 30 - i) )
.format('MM-DD') this.callTheTrendData.start = start
this.callTheTrendData.push(time) console.log(
} console.log('time', this.callTheTrendData, name) 'this.callTheTrendData',
// callTheTrend(callTheTrendData.value) parseInt((Date.parse(new Date()) - 720 * 60 * 60 * 1000) / 1000)
)
} else { } else {
const time = moment().startOf('day').format('YYYY-MM-DD 23:59:59') this.callTheTrendData.start = Date.parse(new Date()) / 1000
this.callTheTrendData.push(time) this.callTheTrendData.end = Date.parse(new Date()) / 1000
console.log(time, this.callTheTrendData)
} }
} }
}, },
created () { }, created () {},
mounted () { mounted () {
this.timeSwitch('日') this.timeSwitch('日')
} }
@ -161,7 +190,6 @@ export default {
display: none; display: none;
} }
} }
} }
} }
} }

View File

@ -15,6 +15,20 @@ function Request({
}) })
}) })
}
function RequestPost({
methods, url, data, success, fali
}) {
return new Promise((resolve, reject) => {
http[methods](url,
data
).then(res => {
resolve(res)
}, err => {
reject(err)
})
})
} }
// /resource/getByDept:获取当前登录用户所在部门发布的资源 // /resource/getByDept:获取当前登录用户所在部门发布的资源
@ -125,9 +139,9 @@ export const getApplyByDept = (data, success, fail) => {
} }
// 部门发布能力被调用趋势 // 部门发布能力被调用趋势
export const getByDept = (data, success, fail) => { export const getByDept = (data, success, fail) => {
Request({ RequestPost({
methods: 'get', methods: 'post',
url: '/resource/getByDept', url: '/resource/trafficDeptResource',
data data
}).then(res => { }).then(res => {
success && success(res) success && success(res)

View File

@ -67,7 +67,7 @@ export const trendLineChart = (id, chartData, _option) => {
}, },
}], }],
series: [{ series: [{
name: '合格数据百分比', name: '使用量',
type: 'line', type: 'line',
showAllSymbol: true, showAllSymbol: true,
symbolSize: 0, symbolSize: 0,

View File

@ -23,7 +23,14 @@ export default {
return { return {
titles: ["近七日", "月度"], titles: ["近七日", "月度"],
selectedTitle: 0, selectedTitle: 0,
trendChartData:{} trendChartData: {},
startDate: "",
endDate:
new Date().getFullYear() +
"-" +
(new Date().getMonth() + 1) +
"-" +
new Date().getDate()
}; };
}, },
components: { components: {
@ -32,25 +39,38 @@ export default {
mounted() { mounted() {
this.initChart(); this.initChart();
}, },
watch: {
selectedTitle: {
handler: function(newVal, oldVal) {
this.startDate = this.getData(newVal == 0 ? 7 : 30);
},
deep: true,
immediate: true
}
},
methods: { methods: {
// //
initChart() { initChart() {
let data = {
limit: 10,
page: 1
};
Apis.getByDept( Apis.getByDept(
data, {
startDate: this.startDate,
endDate: this.endDate
},
res => { res => {
if (res.data.code !== 0) { if (res.data.code !== 0) {
return; return;
} }
this.data = res.data.data.records || []; this.data = res.data.data.browseDayList || [];
let xaxis=[],ydata=[] let xaxis = [],
this.data.forEach(v=>{ ydata = [];
xaxis.push(v.createDate) this.data.forEach(v => {
ydata.push(v.visits) Object.keys(v).map((key, value) => {
}) xaxis.push(key);
ydata.push(value);
});
});
console.log(xaxis)
console.log(ydata)
this.trendChartData = { this.trendChartData = {
xaxis: xaxis, xaxis: xaxis,
ydata: ydata ydata: ydata
@ -66,7 +86,27 @@ export default {
}, },
handleTitleSwitch(idx) { handleTitleSwitch(idx) {
this.selectedTitle = idx; this.selectedTitle = idx;
this.startDate = this.getData(this.selectedTitle == 0 ? 7 : 30);
console.log(this.startDate);
this.initChart(); this.initChart();
},
getData(aa) {
let date1 = new Date(),
time1 =
date1.getFullYear() +
"-" +
(date1.getMonth() + 1) +
"-" +
date1.getDate(); //time1
let date2 = new Date(date1);
date2.setDate(date1.getDate() - aa);
let time2 =
date2.getFullYear() +
"-" +
(date2.getMonth() + 1) +
"-" +
date2.getDate();
return time2;
} }
} }
}; };

View File

@ -2,7 +2,7 @@
* @Author: hisense.wuhongjian * @Author: hisense.wuhongjian
* @Date: 2022-03-29 16:45:25 * @Date: 2022-03-29 16:45:25
* @LastEditors: hisense.wuhongjian * @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-06-29 19:38:31 * @LastEditTime: 2022-06-30 21:21:10
* @Description: 告诉大家这是什么 * @Description: 告诉大家这是什么
--> -->
<!DOCTYPE html> <!DOCTYPE html>

View File

@ -1,8 +1,8 @@
/* /*
* @Author: hisense.wuhongjian * @Author: hisense.wuhongjian
* @Date: 2022-04-01 19:19:40 * @Date: 2022-04-01 19:19:40
* @LastEditors: hisense.liangjunhua * @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-06-29 14:34:24 * @LastEditTime: 2022-06-30 19:36:48
* @Description: 告诉大家这是什么 * @Description: 告诉大家这是什么
*/ */
import request from '@/utils/request' import request from '@/utils/request'
@ -314,3 +314,18 @@ export function queryPartAppByKeyId2(params) {
}) })
} }
//
export function selectInfrastructureList(params) {
return request({
url: 'resource/selectInfrastructureList',
method: 'get',
params,
})
}
// instanceId
export function getApplyCameraList(id) {
return request({
url: '/resource/getApplyCameraList/' + id,
method: 'get',
})
}

View File

@ -121,6 +121,7 @@
<script setup> <script setup>
import { nextTick, ref } from 'vue' import { nextTick, ref } from 'vue'
import { UpOutlined, DownOutlined } from '@ant-design/icons-vue' import { UpOutlined, DownOutlined } from '@ant-design/icons-vue'
import { getCategoryTreePage } from '@/api/personalCenter'
import { import {
capabilityShareCapabilitySet, capabilityShareCapabilitySet,
selectResourceListByDept, selectResourceListByDept,
@ -317,23 +318,20 @@
// //
const dataList = ref([]) const dataList = ref([])
// //
const allType = ref([ const allType = ref([])
'社会治安', getCategoryTreePage({
'城市管理', page: 1,
'疫情防控', limit: 99,
'危化品管理', dictTypeId: '1513712507692818433',
'交通运输', }).then((res) => {
'森林防火', // console.log('kasdjflkajsdlkf ', res.data.data)
'防汛抗旱', allType.value = []
'文化旅游', res.data.data.list.map((val) => {
'非煤矿山', if (val.dictLabel !== '其他') {
'医疗卫生', allType.value.push(val.dictLabel)
'安全生产', }
'生态环境', })
'农业农村', })
'市场监管',
'政务服务',
])
const flag = ref('') const flag = ref('')
const nowShow = ref(false) const nowShow = ref(false)
const showDetails = (item) => { const showDetails = (item) => {

View File

@ -46,7 +46,7 @@
<div class="left" id="left"></div> <div class="left" id="left"></div>
<div class="center"></div> <div class="center"></div>
<div class="right" id="right"></div> <div class="right" id="right"></div>
<div class="right-son1">汇聚量</div> <!-- <div class="right-son1">汇聚量</div> -->
<div class="right-son2">部门数</div> <div class="right-son2">部门数</div>
</div> </div>
</div> </div>
@ -287,6 +287,12 @@
} }
// //
const funnelPlot = (dataList) => { const funnelPlot = (dataList) => {
// let arr = ['0-5', '5-10', '10-15', '15-20', '20']
// dataList.sort((a, b) => {
// console.log(arr.indexOf(a.fanwei), arr.indexOf(b.fanwei))
// return arr.indexOf(b.fanwei) - arr.indexOf(a.fanwei)
// })
console.log('============》', dataList)
echarts.init(document.getElementById('right')).dispose() echarts.init(document.getElementById('right')).dispose()
let chartDom = document.getElementById('right') let chartDom = document.getElementById('right')
let myChart = echarts.init(chartDom) let myChart = echarts.init(chartDom)
@ -318,6 +324,7 @@
data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
}, },
yAxis: { yAxis: {
show: false,
type: 'value', type: 'value',
min: 0, min: 0,
max: 20, max: 20,

View File

@ -30,10 +30,10 @@
<span <span
v-for="(item, index) in tabClickData" v-for="(item, index) in tabClickData"
:key="index" :key="index"
:class="listBg == item.name ? 'down' : ''" :class="listBg == item.dictLabel ? 'down' : ''"
@click="switchList(item.name)" @click="switchList(item.dictLabel)"
> >
{{ item.name }} {{ item.dictLabel }}
</span> </span>
</div> </div>
<a class="more" @click="lookmore(hidetext)"> <a class="more" @click="lookmore(hidetext)">
@ -82,6 +82,7 @@
import { ref, onMounted } from 'vue' import { ref, onMounted } from 'vue'
// import { useStore } from 'vuex' // import { useStore } from 'vuex'
import { pageWithAttrs } from '@/api/home.js' import { pageWithAttrs } from '@/api/home.js'
import { getCategoryTreePage } from '@/api/personalCenter.js'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
// import { pinyin } from 'pinyin-pro' // import { pinyin } from 'pinyin-pro'
// import { Empty } from 'ant-design-vue' // import { Empty } from 'ant-design-vue'
@ -159,6 +160,17 @@
name: '其他', name: '其他',
}, },
]) ])
//tab
const tabChaXun = () => {
const params = {
page: 1,
limit: 99,
dictTypeId: '1513712507692818433',
}
getCategoryTreePage(params).then(({ data: res }) => {
tabClickData.value = res.data.list
})
}
const tabClickShow = ref(false) const tabClickShow = ref(false)
const number = ref(0) const number = ref(0)
const changeCards = (val) => { const changeCards = (val) => {
@ -195,6 +207,7 @@
} }
// //
const init = (list) => { const init = (list) => {
tabChaXun()
let params = { let params = {
deptIds: [], deptIds: [],
districtId: '', districtId: '',

View File

@ -1,8 +1,8 @@
<!-- <!--
* @Author: hisense.liangjunhua * @Author: hisense.liangjunhua
* @Date: 2022-06-08 11:32:22 * @Date: 2022-06-08 11:32:22
* @LastEditors: hisense.liangjunhua * @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-06-20 18:58:46 * @LastEditTime: 2022-06-30 17:06:56
* @Description: 算法详情页 * @Description: 算法详情页
--> -->
<template> <template>
@ -23,6 +23,7 @@
></algorithm-display> ></algorithm-display>
<!-- 关联能力 --> <!-- 关联能力 -->
<algorithm-associated-ability <algorithm-associated-ability
v-if="!loading"
:associatedComponents="associatedComponents" :associatedComponents="associatedComponents"
id="algorithm-associated-ability" id="algorithm-associated-ability"
class="scrollBox" class="scrollBox"
@ -93,6 +94,7 @@
const router = useRouter() const router = useRouter()
const scrollTop = ref(0) const scrollTop = ref(0)
const domArr = ref([]) const domArr = ref([])
const loading = ref(true)
const selectNow = ref('') const selectNow = ref('')
const dataList = reactive({ data: {} }) const dataList = reactive({ data: {} })
const id = router.currentRoute.value.query.id const id = router.currentRoute.value.query.id
@ -136,6 +138,7 @@
}) })
const init = (id) => { const init = (id) => {
console.log(id, '-------------------------------------------------')
if (id) { if (id) {
selectOne(id).then((res) => { selectOne(id).then((res) => {
// console.clear() // console.clear()
@ -162,6 +165,7 @@
} }
queryPartAppByKeyId2(queryPartAppByKeyIdParams).then((res) => { queryPartAppByKeyId2(queryPartAppByKeyIdParams).then((res) => {
associatedComponents.value[index].dataList = res.data.data associatedComponents.value[index].dataList = res.data.data
loading.value = false
}) })
}) })
} else if (obj) { } else if (obj) {

View File

@ -1,6 +1,6 @@
<template> <template>
<div class="application-associated-ability" v-if="flag"> <div class="application-associated-ability" v-if="flag">
<detals-title title="关联能力" type="RELEVANCE"></detals-title> <detals-title title="关联应用" type="ASSOCIATED"></detals-title>
<div class="application-associated-ability-main"> <div class="application-associated-ability-main">
<div <div
class="associated-ability-card" class="associated-ability-card"
@ -34,14 +34,18 @@
const oldid = router.currentRoute.value.query.id const oldid = router.currentRoute.value.query.id
// //
const switchFunction = (id) => { const switchFunction = (id) => {
router.push({ // router.push({
path: '/details', // path: '/details',
query: { // query: {
id: id, // id: id,
}, // },
}) // })
window.open(window.SITE_CONFIG.previewUrl+ '#/details?id=' + id)
// alert(id)
} }
if (props.associatedComponents) { console.log('这个是空值', props.associatedComponents[0])
if (props.associatedComponents[0].dataList.length > 0) {
console.log('这个是空值', props.associatedComponents)
flag.value = true flag.value = true
dataFrom.value = props.associatedComponents dataFrom.value = props.associatedComponents
console.log('dataFrom.value', dataFrom.value) console.log('dataFrom.value', dataFrom.value)
@ -82,7 +86,7 @@
margin-top: 0.4rem; margin-top: 0.4rem;
width: 13.3rem; width: 13.3rem;
display: flex; display: flex;
justify-content: space-between; justify-content: space-around;
.associated-ability-card { .associated-ability-card {
width: 3.2rem; width: 3.2rem;
display: flex; display: flex;
@ -106,6 +110,7 @@
color: #999; color: #999;
margin-right: 0.15rem; margin-right: 0.15rem;
margin-top: 0.15rem; margin-top: 0.15rem;
text-align: center;
} }
} }
} }

View File

@ -39,12 +39,45 @@
obj.attrValue = JSON.parse(obj.attrValue) obj.attrValue = JSON.parse(obj.attrValue)
// dataFrom.value = obj // dataFrom.value = obj
obj.attrValue.map((item) => { obj.attrValue.map((item) => {
let params = { let params = {}
title: item.type, switch (item.type) {
content: item.desc, case '一次性买断':
value: item.price, params = {
time: '/年起', title: item.type,
unit: '¥', content: item.desc,
value: item.price,
time: '',
unit: '¥',
}
break
case '按调用次数':
params = {
title: item.type,
content: item.desc,
value: item.price,
time: '/次',
unit: '¥',
}
break
case '按并发路数':
params = {
title: item.type,
content: item.desc,
value: item.price,
time: '/路',
unit: '¥',
}
break
case '按年计费':
params = {
title: item.type,
content: item.desc,
value: item.price,
time: '/年',
unit: '¥',
}
break
} }
dataFrom.value.push(params) dataFrom.value.push(params)
}) })
@ -70,7 +103,7 @@
title: item.type, title: item.type,
content: item.desc, content: item.desc,
value: item.price, value: item.price,
time: '/元', time: '',
unit: '¥', unit: '¥',
} }
break break

View File

@ -1,8 +1,8 @@
<!-- <!--
* @Author: hisense.liangjunhua * @Author: hisense.liangjunhua
* @Date: 2022-06-08 14:54:01 * @Date: 2022-06-08 14:54:01
* @LastEditors: hisense.liangjunhua * @LastEditors: hisense.wuhongjian
* @LastEditTime: 2022-06-15 18:32:23 * @LastEditTime: 2022-06-30 17:09:40
* @Description: 算法详情页导航 * @Description: 算法详情页导航
--> -->
<template> <template>
@ -21,8 +21,14 @@
</div> </div>
</template> </template>
<script setup> <script setup>
import { ref, defineProps, watch } from 'vue' import { ref, defineProps, watch, getCurrentInstance } from 'vue'
import { useRouter } from 'vue-router'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
import { queryPartAppByKeyId2 } from '@/api/home'
//
const router = useRouter();
const keyId = router.currentRoute.value.query.id;
console.log('123', keyId)
const navList = ref([ const navList = ref([
{ {
name: '算法展示', name: '算法展示',
@ -32,10 +38,6 @@
name: '算法优势', name: '算法优势',
key: 'algorithm-advantage', key: 'algorithm-advantage',
}, },
{
name: '关联能力',
key: 'algorithm-associated-ability',
},
{ {
name: '应用场景', name: '应用场景',
key: 'application-scenarios', key: 'application-scenarios',
@ -61,12 +63,30 @@
key: 'common-problem', key: 'common-problem',
}, },
]) ])
const list = ref([])
// id
queryPartAppByKeyId2({keyId: keyId}).then(
res=>{
console.log('ressssssss', res)
if (res.data.data.length > 0) {
//
navList.value.unshift({
name: '关联应用',
key: 'algorithm-associated-ability',
show: true
})
// list.value.push('')
console.log('navList', navList)
}
})
const props = defineProps({ const props = defineProps({
selectNow: { type: String, default: '' }, selectNow: { type: String, default: '' },
dataList: { type: Object, default: null }, dataList: { type: Object, default: null },
}) }
)
const select = ref('algorithm-display') const select = ref('algorithm-display')
const list = ref([])
const selectNav = (key) => { const selectNav = (key) => {
select.value = key select.value = key
mybus.emit('flyToView', select.value) mybus.emit('flyToView', select.value)
@ -91,7 +111,6 @@
list.value.push('使用方式') list.value.push('使用方式')
} }
}) })
list.value.push('关联能力')
navList.value.forEach((item) => { navList.value.forEach((item) => {
console.log(item) console.log(item)
if (list.value.indexOf(item.name) > -1) { if (list.value.indexOf(item.name) > -1) {
@ -136,7 +155,7 @@
list.value.push('使用方式') list.value.push('使用方式')
} }
}) })
list.value.push('关联能力') list.value.push('关联应用')
navList.value.forEach((item) => { navList.value.forEach((item) => {
console.log(item) console.log(item)
if (list.value.indexOf(item.name) > -1) { if (list.value.indexOf(item.name) > -1) {

View File

@ -28,10 +28,16 @@
<!-- <span class="label">免费</span> --> <!-- <span class="label">免费</span> -->
</div> </div>
<div class="main"> <div class="main">
<div>应用领域{{ applicationArea }}</div> <a-tooltip placement="top">
<div> <template #title>应用领域{{ applicationArea }}</template>
{{ props.dataList.description }} <div>应用领域{{ applicationArea }}</div>
</div> </a-tooltip>
<a-tooltip placement="top">
<template #title>{{ props.dataList.description }}</template>
<div>
{{ props.dataList.description }}
</div>
</a-tooltip>
</div> </div>
<div class="bottom" v-if="props.dataList.id"> <div class="bottom" v-if="props.dataList.id">
<a-button type="primary" @click="toView()"> <a-button type="primary" @click="toView()">
@ -162,8 +168,8 @@
} }
.lable-father { .lable-father {
position: absolute; position: absolute;
min-width: 2.5rem; min-width: 3.5rem;
right: -2.5rem; right: -3.5rem;
top: 0; top: 0;
} }
.label { .label {

View File

@ -27,7 +27,7 @@
</div> </div>
<div class="right"> <div class="right">
<div @click="technical()">技术文档</div> <div @click="technical()">技术文档</div>
<div>新手指引</div> <!-- <div>新手指引</div> -->
</div> </div>
</div> </div>
<div class="content-right"> <div class="content-right">
@ -73,13 +73,13 @@
titleSon: '调用接口', titleSon: '调用接口',
link: { link: {
name: '接口地址:', name: '接口地址:',
value: 'http://localhost:9999/#/details?id=1532278256619307010', value: '',
}, },
postMethod: { postMethod: {
name: '请求方式:', name: '请求方式:',
value: 'POST', value: '',
}, },
contact: '联系厂商', contact: '联系厂商',
facilitator: { name: '服务商:', value: '科大讯飞' }, facilitator: { name: '服务商:', value: '科大讯飞' },
people: { name: '联系人:', value: '李四' }, people: { name: '联系人:', value: '李四' },
phone: { phone: {
@ -116,8 +116,12 @@
dataFrom.value.content[0].people.value = item.attrValue || '--' dataFrom.value.content[0].people.value = item.attrValue || '--'
} else if (item.attrType === '服务商联系电话') { } else if (item.attrType === '服务商联系电话') {
dataFrom.value.content[0].phone.value = item.attrValue || '--' dataFrom.value.content[0].phone.value = item.attrValue || '--'
} else if (item.attrType === '技术文档') { }
dataFrom.value.link = item.attrValue || '--' // } else if (item.attrType === '') {
// dataFrom.value.link = item.attrValue || '--'
// }
else if (item.attrType === '服务接口') {
dataFrom.value.content[0].link.value = item.attrValue || '--'
} }
}) })
} }
@ -143,8 +147,12 @@
dataFrom.value.content[0].people.value = item.attrValue || '--' dataFrom.value.content[0].people.value = item.attrValue || '--'
} else if (item.attrType === '服务商联系电话') { } else if (item.attrType === '服务商联系电话') {
dataFrom.value.content[0].phone.value = item.attrValue || '--' dataFrom.value.content[0].phone.value = item.attrValue || '--'
} else if (item.attrType === '技术文档') { }
dataFrom.value.link = item.attrValue || '--' // else if (item.attrType === '') {
// dataFrom.value.link = item.attrValue || '--'
// }
else if (item.attrType === '服务接口') {
dataFrom.value.content[0].link.value = item.attrValue || '--'
} }
}) })
} }
@ -152,7 +160,6 @@
} }
) )
function technical() { function technical() {
// //
const type = pinyin(props.dataList.type, { const type = pinyin(props.dataList.type, {
pattern: 'initial', pattern: 'initial',

View File

@ -26,10 +26,16 @@
<!-- <span class="label">免费</span> --> <!-- <span class="label">免费</span> -->
</div> </div>
<div class="main"> <div class="main">
<div>应用领域{{ applicationArea }}</div> <a-tooltip placement="top">
<div> <template #title>应用领域{{ applicationArea }}</template>
{{ props.dataList.description }} <div>应用领域{{ applicationArea }}</div>
</div> </a-tooltip>
<a-tooltip placement="top">
<template #title>{{ props.dataList.description }}</template>
<div>
{{ props.dataList.description }}
</div>
</a-tooltip>
</div> </div>
<div class="bottom" v-if="props.dataList.id"> <div class="bottom" v-if="props.dataList.id">
<!-- <a-button type="primary" @click="toView()"> <!-- <a-button type="primary" @click="toView()">
@ -148,8 +154,8 @@
} }
.lable-father { .lable-father {
position: absolute; position: absolute;
min-width: 2.5rem; min-width: 3.5rem;
right: -2.5rem; right: -3.5rem;
top: 0; top: 0;
} }
.label { .label {

View File

@ -28,11 +28,16 @@
<!-- <span class="label">免费</span> --> <!-- <span class="label">免费</span> -->
</div> </div>
<div class="main"> <div class="main">
<div>应用领域{{ businessArea }}</div> <a-tooltip placement="top">
<!-- 应用描述 --> <template #title>应用领域{{ applicationArea }}</template>
<div> <div>应用领域{{ applicationArea }}</div>
{{ props.dataList.description }} </a-tooltip>
</div> <a-tooltip placement="top">
<template #title>{{ props.dataList.description }}</template>
<div>
{{ props.dataList.description }}
</div>
</a-tooltip>
</div> </div>
<div class="bottom" v-if="props.dataList.id"> <div class="bottom" v-if="props.dataList.id">
<!-- <a-button type="primary" @click="toView()"> <!-- <a-button type="primary" @click="toView()">
@ -162,8 +167,8 @@
} }
.lable-father { .lable-father {
position: absolute; position: absolute;
min-width: 2.5rem; min-width: 3.5rem;
right: -2.5rem; right: -3.5rem;
top: 0; top: 0;
} }
.label { .label {

View File

@ -27,8 +27,15 @@
</div> </div>
<div class="content-right"> <div class="content-right">
<div class="content-right-left"> <div class="content-right-left">
<div class="content-right-title">{{ item.contact }}</div> <!-- <div class="content-right-title">{{ item.contact }}</div> -->
<div class="content-right-content"> <div class="content-right-content">
<p>
<span>{{ item.contact }}</span>
<a-tooltip>
<template #title>{{ item.facilitator.value }}</template>
<span>{{ item.facilitator.value }}</span>
</a-tooltip>
</p>
<p> <p>
<span>{{ item.people.name }}</span> <span>{{ item.people.name }}</span>
<a-tooltip> <a-tooltip>
@ -46,8 +53,15 @@
</div> </div>
</div> </div>
<div class="content-right-right"> <div class="content-right-right">
<div class="content-right-title">{{ item.contact2 }}</div> <!-- <div class="content-right-title">{{ item.contact2 }}</div> -->
<div class="content-right-content"> <div class="content-right-content">
<p>
<span>{{ item.contact2 }}</span>
<a-tooltip>
<template #title>{{ item.facilitator2.value }}</template>
<span>{{ item.facilitator2.value }}</span>
</a-tooltip>
</p>
<p> <p>
<span>{{ item.people2.name }}</span> <span>{{ item.people2.name }}</span>
<a-tooltip> <a-tooltip>
@ -83,19 +97,19 @@
name: '接口地址:', name: '接口地址:',
}, },
linkValue: '', linkValue: '',
contact: '归属部门', contact: '归属部门',
facilitator: { name: '归属部门:', value: '讯飞科大' }, facilitator: { name: '归属部门:', value: '' },
people: { name: '部门联系人:', value: '李四' }, people: { name: '部门联系人:', value: '' },
phone: { phone: {
name: '联系人电话:', name: '联系人电话:',
value: '12345678901', value: '',
}, },
contact2: '服务商', contact2: '服务商',
facilitator2: { name: '服务商:', value: '科大讯飞' }, facilitator2: { name: '服务商:', value: '' },
people2: { name: '服务商联系人:', value: '李四' }, people2: { name: '服务商联系人:', value: '' },
phone2: { phone2: {
name: '联系人电话:', name: '联系人电话:',
value: '1234567890', value: '',
}, },
}, },
], ],
@ -114,7 +128,7 @@
} else { } else {
// eslint-disable-next-line vue/no-setup-props-destructure // eslint-disable-next-line vue/no-setup-props-destructure
dataFrom.value.content[0].link.value = props.dataList.apiUrl dataFrom.value.content[0].link.value = props.dataList.apiUrl
dataFrom.value.content[0].facilitator.value = props.dataList.deptContacts dataFrom.value.content[0].facilitator.value = props.dataList.deptName
dataFrom.value.content[0].people.value = props.dataList.deptContacts dataFrom.value.content[0].people.value = props.dataList.deptContacts
dataFrom.value.content[0].phone.value = props.dataList.deptPhone dataFrom.value.content[0].phone.value = props.dataList.deptPhone
console.log('dataList', props.dataList) console.log('dataList', props.dataList)
@ -140,7 +154,7 @@
flag.value = false flag.value = false
} else { } else {
dataFrom.value.content[0].link.value = val.apiUrl dataFrom.value.content[0].link.value = val.apiUrl
dataFrom.value.content[0].facilitator.value = val.deptContacts dataFrom.value.content[0].facilitator.value = val.deptName
dataFrom.value.content[0].people.value = val.deptContacts dataFrom.value.content[0].people.value = val.deptContacts
dataFrom.value.content[0].phone.value = val.deptPhone dataFrom.value.content[0].phone.value = val.deptPhone
console.log('dataList', val) console.log('dataList', val)
@ -183,11 +197,14 @@
// // // //
// const id = props.dataList.id // const id = props.dataList.id
// window.open(window.SITE_CONFIG.frontUrl + type + '/' + id + '.md', '_blank') // window.open(window.SITE_CONFIG.frontUrl + type + '/' + id + '.md', '_blank')
console.log('dataFrom.value.link', dataFrom.value.link) let obj = props.dataList.infoList.filter(
(item) => item.attrType === '使用手册'
)[0]
console.log('dataFrom.value.link', obj.attrValue)
window.open( window.open(
window.SITE_CONFIG.previewUrl + window.SITE_CONFIG.previewUrl +
'hisense_office/onlinePreview?url=' + 'hisense_office/onlinePreview?url=' +
btoa(encodeURI(dataFrom.value.link)) btoa(encodeURI(obj.attrValue))
) )
} }
</script> </script>

View File

@ -28,10 +28,16 @@
<!-- <span class="label">免费</span> --> <!-- <span class="label">免费</span> -->
</div> </div>
<div class="main"> <div class="main">
<div>应用领域{{ applicationArea }}</div> <a-tooltip placement="top">
<div> <template #title>应用领域{{ applicationArea }}</template>
{{ props.dataList.description }} <div>应用领域{{ applicationArea }}</div>
</div> </a-tooltip>
<a-tooltip placement="top">
<template #title>{{ props.dataList.description }}</template>
<div>
{{ props.dataList.description }}
</div>
</a-tooltip>
</div> </div>
<div class="bottom" v-if="props.dataList.id"> <div class="bottom" v-if="props.dataList.id">
<a-button type="primary" @click="toView()"> <a-button type="primary" @click="toView()">
@ -161,8 +167,8 @@
} }
.lable-father { .lable-father {
position: absolute; position: absolute;
min-width: 2.5rem; min-width: 3.5rem;
right: -2.5rem; right: -3.5rem;
top: 0; top: 0;
} }
.label { .label {

View File

@ -80,6 +80,16 @@
oInput.remove() // oInput.remove() //
message.success(name + '成功') message.success(name + '成功')
} }
message.config({
top: '100px', //
})
// const success = () => {
// message.success({
// // content: 'This is a prompt message with custom className and style',
// className: 'custom-class',
// style: {},
// })
// }
watch( watch(
() => props.dataList, () => props.dataList,
(val) => { (val) => {
@ -157,3 +167,8 @@
} }
} }
</style> </style>
<style>
.custom-class {
/* top: 100px; */
}
</style>

View File

@ -11,21 +11,30 @@
<li v-for="(item, index) in dataFromLeft.content" :key="index"> <li v-for="(item, index) in dataFromLeft.content" :key="index">
<img :src="iconImg" /> <img :src="iconImg" />
<span>{{ item.type }}</span> <span>{{ item.type }}</span>
<p>{{ item.values }}</p> <a-tooltip>
<template #title>{{ item.values }}</template>
<p>{{ item.values }}</p>
</a-tooltip>
</li> </li>
</ul> </ul>
<ul> <ul>
<li v-for="(item, index) in dataFromCenter.content" :key="index"> <li v-for="(item, index) in dataFromCenter.content" :key="index">
<img :src="iconImg" /> <img :src="iconImg" />
<span>{{ item.type }}</span> <span>{{ item.type }}</span>
<p>{{ item.values }}</p> <a-tooltip>
<template #title>{{ item.values }}</template>
<p>{{ item.values }}</p>
</a-tooltip>
</li> </li>
</ul> </ul>
<ul> <ul>
<li v-for="(item, index) in dataFromRight.content" :key="index"> <li v-for="(item, index) in dataFromRight.content" :key="index">
<img :src="iconImg" /> <img :src="iconImg" />
<span>{{ item.type }}</span> <span>{{ item.type }}</span>
<p>{{ item.values }}</p> <a-tooltip>
<template #title>{{ item.values }}</template>
<p>{{ item.values }}</p>
</a-tooltip>
</li> </li>
</ul> </ul>
</div> </div>

View File

@ -129,7 +129,7 @@
} }
}) })
select.value = navList.value.filter( select.value = navList.value.filter(
(item) => item.name === list.value[0] (item) => item.name === '图层展示'
)[0].key )[0].key
console.log('11111111111111111111111111', list.value, navList.value) console.log('11111111111111111111111111', list.value, navList.value)
} }
@ -205,7 +205,7 @@
}) })
if (list.value.length > 0) { if (list.value.length > 0) {
select.value = navList.value.filter( select.value = navList.value.filter(
(item) => item.name === list.value[0] (item) => item.name === '图层展示'
)[0].key )[0].key
} }
console.log('11111111111111111111111111', list.value, navList.value) console.log('11111111111111111111111111', list.value, navList.value)

View File

@ -28,11 +28,16 @@
<!-- <span class="label">免费</span> --> <!-- <span class="label">免费</span> -->
</div> </div>
<div class="main"> <div class="main">
<div>应用领域{{ businessArea }}</div> <a-tooltip placement="top">
<!-- 应用描述 --> <template #title>应用领域{{ applicationArea }}</template>
<div> <div>应用领域{{ applicationArea }}</div>
{{ props.dataList.description }} </a-tooltip>
</div> <a-tooltip placement="top">
<template #title>{{ props.dataList.description }}</template>
<div>
{{ props.dataList.description }}
</div>
</a-tooltip>
</div> </div>
<div class="bottom" v-if="props.dataList.id"> <div class="bottom" v-if="props.dataList.id">
<a-button type="primary" @click="toView()"> <a-button type="primary" @click="toView()">
@ -162,8 +167,8 @@
} }
.lable-father { .lable-father {
position: absolute; position: absolute;
min-width: 2.5rem; min-width: 3.5rem;
right: -2.8rem; right: -3.5rem;
top: 0; top: 0;
} }
.label { .label {

View File

@ -28,7 +28,8 @@
</div> </div>
<div class="content-right"> <div class="content-right">
<div class="content-right-title"> <div class="content-right-title">
{{ item.contact }}{{ item.facilitator.values }} <!-- {{ item.facilitator.values }} -->
{{ item.contact }}
</div> </div>
<div class="content-right-content"> <div class="content-right-content">
<p> <p>

View File

@ -36,6 +36,7 @@
<script setup> <script setup>
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { message } from 'ant-design-vue'
import { ref, defineProps } from 'vue' import { ref, defineProps } from 'vue'
import mybus from '@/myplugins/mybus' import mybus from '@/myplugins/mybus'
const props = defineProps({ const props = defineProps({
@ -58,7 +59,11 @@
// //
const removeFunction = (data) => { const removeFunction = (data) => {
dataForm.value.map((val) => { dataForm.value.map((val) => {
val.arr = val.arr.filter((item) => item.id !== data.id) if (val.arr.length > 1) {
val.arr = val.arr.filter((item) => item.id !== data.id)
} else {
message.error('至少需要提交一条能力申请!')
}
}) })
dataForm.value = dataForm.value.filter((val) => val.arr.length !== 0) dataForm.value = dataForm.value.filter((val) => val.arr.length !== 0)
} }

View File

@ -1152,7 +1152,8 @@
}) })
mybus.on('changePage', (page) => { mybus.on('changePage', (page) => {
paramsGetResources.pageNum = page paramsGetResources.pageNum = page
getAppResources() console.log('changePage', paramsGetResources.pageNum)
getAppResources('分页查询')
console.log('paramsGetResources', paramsGetResources) console.log('paramsGetResources', paramsGetResources)
}) })
mybus.on('changeSelcted', () => { mybus.on('changeSelcted', () => {
@ -1246,11 +1247,11 @@
let newQuery = JSON.parse( let newQuery = JSON.parse(
JSON.stringify(router.currentRoute.value.query) JSON.stringify(router.currentRoute.value.query)
) )
if (Cardsname.value == name) { // if (Cardsname.value == name) {
Cardsname.value = '' // Cardsname.value = ''
} else { // } else {
Cardsname.value = name Cardsname.value = name
} // }
console.log( console.log(
'更改前url中的select=====================>', '更改前url中的select=====================>',
router.currentRoute.value.query.select router.currentRoute.value.query.select

View File

@ -84,7 +84,7 @@
<a-select <a-select
v-model:value="formName.applicationSystem" v-model:value="formName.applicationSystem"
show-search show-search
placeholder="请选择应用系统" placeholder="请输入关键字"
style="width: 200px" style="width: 200px"
:options="systemOptions" :options="systemOptions"
@focus="handleFocus" @focus="handleFocus"

View File

@ -172,7 +172,7 @@
router.push({ router.push({
path: '/DetailsPageconetent', path: '/DetailsPageconetent',
query: { query: {
select: '', select: '组件服务',
}, },
}) })
break break
@ -197,7 +197,7 @@
}) })
break break
case '后台管理': case '后台管理':
window.open(window.SITE_CONFIG.backUrl + '/#/bscatalogue-bscatalogue') window.open(window.SITE_CONFIG.backUrl + '/#/login')
window.reload('http://15.2.21.238:9797') window.reload('http://15.2.21.238:9797')
break break
case '赋能案例': case '赋能案例':

View File

@ -157,15 +157,6 @@
v-if="item.isCollect == 'true'" v-if="item.isCollect == 'true'"
@click="addCollect(item)" @click="addCollect(item)"
></span> ></span>
<a-button
style="margin-left: 10px"
v-show="
cardType == '组件服务' &&
findComponentName(item, '智能算法')
"
>
免费试用
</a-button>
</div> </div>
<div <div
class="shopping pk" class="shopping pk"
@ -183,15 +174,29 @@
> >
查看详情 查看详情
</a-button> </a-button>
<a-button <!-- <a-button
style="margin-left: 10px"
v-show="
cardType == '组件服务' && findComponentName(item, '智能算法')
"
>
免费试用
</a-button> -->
<!-- <a-button
type="primary" type="primary"
@click="toView('apply', item)" @click="toView('apply', item)"
v-show="cardType !== '数据资源'" v-show="
cardType !== '数据资源' &&
!(
cardType == '组件服务' &&
findComponentName(item, '智能算法')
)
"
> >
{{ {{
item.shareCondition == '免批申请' ? '免批申请' : '立即申请' item.shareCondition == '免批申请' ? '免批申请' : '立即申请'
}} }}
</a-button> </a-button> -->
</div> </div>
<div class="right" v-else> <div class="right" v-else>
<a-button type="primary" @click="openVideo(item)"> <a-button type="primary" @click="openVideo(item)">

View File

@ -34,7 +34,7 @@
<span>{{ pagination.total }}</span> <span>{{ pagination.total }}</span>
</p> </p>
<i class="boundary"></i> <!-- <i class="boundary"></i> -->
<p> <p>
已选 已选
<span>{{ selectedRowKeys.length }}</span> <span>{{ selectedRowKeys.length }}</span>
@ -156,6 +156,7 @@
], //, ], //,
}) })
let visible = ref(false) let visible = ref(false)
const jjssType = ref(router.currentRoute.value.query.type)
const pagination = ref({ const pagination = ref({
total: 0, total: 0,
current: 1, current: 1,
@ -177,7 +178,12 @@
}) })
const showMap = ref(true) const showMap = ref(true)
onMounted(() => { onMounted(() => {
tabClick(0, '视频资源') if (jjssType.value) {
tabClick(0, jjssType.value)
} else {
tabClick(0, '视频资源')
}
getCamera() getCamera()
mybus.off('getListByParentId') mybus.off('getListByParentId')
mybus.on('getListByParentId', (parentId) => { mybus.on('getListByParentId', (parentId) => {
@ -295,7 +301,7 @@
showMap.value = true showMap.value = true
clickList.value[1].content = [] clickList.value[1].content = []
clickList.value[indexFather].content[0] = name clickList.value[indexFather].content[0] = name
tabList.value[1].content = ['333333', '213124'] tabList.value[1].content = []
} else { } else {
clickList.value[indexFather].content.push(name) clickList.value[indexFather].content.push(name)
} }

View File

@ -2,7 +2,7 @@
* @Author: hisense.liangjunhua * @Author: hisense.liangjunhua
* @Date: 2022-06-21 11:55:07 * @Date: 2022-06-21 11:55:07
* @LastEditors: hisense.liangjunhua * @LastEditors: hisense.liangjunhua
* @LastEditTime: 2022-06-22 12:20:59 * @LastEditTime: 2022-06-30 18:18:57
* @Description: 告诉大家这是什么 * @Description: 告诉大家这是什么
--> -->
<template> <template>
@ -79,7 +79,7 @@
<a-list-item> <a-list-item>
<a-list-item-meta description=""> <a-list-item-meta description="">
<template #title> <template #title>
<div class="left"> <div class="left" @click="read(item)">
{{ item.content }} {{ item.content }}
</div> </div>
<div class="right">{{ '发布时间:' + item.senderDate }}</div> <div class="right">{{ '发布时间:' + item.senderDate }}</div>
@ -209,28 +209,44 @@
path: url, path: url,
}) })
} }
const read = () => { const read = (item) => {
// console.log(item)
if (selectData.value.length === 0) { if (selectData.value.length === 0) {
message.error('未选择消息!') message.error('未选择消息!')
return return
} }
console.log(selectData.value) console.log(selectData.value)
let str = '' // let str = ''
selectData.value.forEach((val, index) => { // selectData.value.forEach((val, index) => {
str += val // str += val
if (index < selectData.value.length - 1) { // if (index < selectData.value.length - 1) {
str += ';' // str += ';'
} // }
}) // })
mynoticeRead(str).then((res) => { if (item) {
if (res.data.code == 0) { mynoticeRead(item.id).then((res) => {
message.success('操作成功!') if (res.data.code == 0) {
mybus.emit('getMynotice') message.success('操作成功!')
init() mybus.emit('getMynotice')
} else { init()
message.error('操作失败!') } else {
} message.error('操作失败!')
}) }
})
} else {
console.log('提交')
selectData.value.map((val) => {
mynoticeRead(val).then((res) => {
if (res.data.code == 0) {
// message.success('')
mybus.emit('getMynotice')
init()
} else {
message.error('操作失败!')
}
})
})
}
} }
const init = () => { const init = () => {
// from readStatus 0 1 // from readStatus 0 1

View File

@ -37,11 +37,11 @@
<div <div
class="name" class="name"
v-for="(item, index) in jcList" v-for="(item, index) in jcList"
:key="item.id" :key="item.name"
:class="index == 4 ? 'name-last' : ''" :class="index == 2 ? 'name-last' : ''"
@click="selectOne(item.id)" @click="selectOne2(item.name)"
> >
{{ index + 1 }}-{{ item.name }} {{ item.name + '-' + item.num + '项' }}
</div> </div>
<div class="btn" @click="jumpPage('基础设施')">查看更多</div> <div class="btn" @click="jumpPage('基础设施')">查看更多</div>
</div> </div>
@ -76,7 +76,11 @@
</div> </div>
</template> </template>
<script setup> <script setup>
import { pageWithAttrs, getDataResource } from '@/api/home.js' import {
pageWithAttrs,
getDataResource,
selectInfrastructureList,
} from '@/api/home.js'
import { ref, reactive } from 'vue' import { ref, reactive } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { useStore } from 'vuex' import { useStore } from 'vuex'
@ -157,24 +161,36 @@
}) })
} else { } else {
let type = paramsGetResources.type let type = paramsGetResources.type
pageWithAttrs(paramsGetResources).then((res) => { if (type == '基础设施') {
console.log('object个数======>', type) selectInfrastructureList().then((res) => {
obj.value = res.data.data.records console.log('基础设施==========>', res.data.data)
switch (type) { for (const key in res.data.data) {
case '组件服务': jcList.value.push({
assignmentMethod('zjNum', res) name: key,
break num: res.data.data[key],
case '应用资源': })
assignmentMethod('yyNum', res) }
break })
case '基础设施': } else {
assignmentMethod('jcNum', res) pageWithAttrs(paramsGetResources).then((res) => {
break console.log('object个数======>', type)
case '知识库': obj.value = res.data.data.records
assignmentMethod('zsNum', res) switch (type) {
break case '组件服务':
} assignmentMethod('zjNum', res)
}) break
case '应用资源':
assignmentMethod('yyNum', res)
break
case '基础设施':
assignmentMethod('jcNum', res)
break
case '知识库':
assignmentMethod('zsNum', res)
break
}
})
}
} }
} }
const assignmentMethod = (type, res) => { const assignmentMethod = (type, res) => {
@ -217,6 +233,16 @@
}, },
}) })
} }
const selectOne2 = (name) => {
console.log('点击===============》', name)
router.push({
path: '/DetailsPageconetent',
query: {
type: name,
select: '基础设施',
},
})
}
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.capability-convergence { .capability-convergence {

View File

@ -157,7 +157,7 @@
'数据资源', '数据资源',
'知识库', '知识库',
]) ])
const select = ref('') const select = ref('组件服务')
let applicationDataList = ref([]) let applicationDataList = ref([])
let technosphereDataList = ref([]) let technosphereDataList = ref([])
const fabubumen = ref([ const fabubumen = ref([
@ -219,11 +219,11 @@
appLiCation: '', appLiCation: '',
}) })
const changeCard = (name) => { const changeCard = (name) => {
if (select.value == name) { // if (select.value == name) {
select.value = '' // select.value = ''
} else { // } else {
select.value = name select.value = name
} // }
snum.value.select = select.value snum.value.select = select.value
} }
function selectCard(value) { function selectCard(value) {

View File

@ -1,6 +1,6 @@
<template> <template>
<div class="navigation2"> <div class="navigation2">
<div class="item"> <div class="item" @click="jumpPage('组件服务')">
<div class="img zj"></div> <div class="img zj"></div>
<div class="name">组件服务</div> <div class="name">组件服务</div>
<div class="sl"> <div class="sl">
@ -8,7 +8,7 @@
</div> </div>
</div> </div>
<div class="item"> <div class="item" @click="jumpPage('应用资源')">
<div class="img yy"></div> <div class="img yy"></div>
<div class="name">应用资源</div> <div class="name">应用资源</div>
<div class="sl"> <div class="sl">
@ -16,7 +16,7 @@
</div> </div>
</div> </div>
<div class="item"> <div class="item" @click="jumpPage('基础设施')">
<div class="img jc"></div> <div class="img jc"></div>
<div class="name">基础设施</div> <div class="name">基础设施</div>
<div class="sl"> <div class="sl">
@ -24,7 +24,7 @@
</div> </div>
</div> </div>
<div class="item"> <div class="item" @click="jumpPage('数据资源')">
<div class="img sj"></div> <div class="img sj"></div>
<div class="name">数据资源</div> <div class="name">数据资源</div>
<div class="sl"> <div class="sl">
@ -32,7 +32,7 @@
</div> </div>
</div> </div>
<div class="item"> <div class="item" @click="jumpPage('知识库')">
<div class="img zs"></div> <div class="img zs"></div>
<div class="name">知识库</div> <div class="name">知识库</div>
<div class="sl"> <div class="sl">
@ -45,6 +45,10 @@
<script setup> <script setup>
import { selectTotal } from '@/api/home' import { selectTotal } from '@/api/home'
import { ref, onMounted, onBeforeUnmount } from 'vue' import { ref, onMounted, onBeforeUnmount } from 'vue'
import { useRouter } from 'vue-router'
import { useStore } from 'vuex'
const router = useRouter()
const store = useStore()
// import mybus from '@/myplugins/mybus' // import mybus from '@/myplugins/mybus'
const yyNum = ref('') const yyNum = ref('')
const zjNum = ref('') const zjNum = ref('')
@ -81,6 +85,23 @@
} }
}) })
}) })
function jumpPage(type) {
// store
store.commit('home/selectCardsData', {
selectCardsnum: type,
})
console.log(
'选中===================>',
store.getters['home/selectCardsnum']
)
// router.push({ path: '/DetailsPageconetent' })
router.push({
path: '/DetailsPageconetent',
query: {
select: type,
},
})
}
// const findZywMessage = () => { // const findZywMessage = () => {
// zywMessage().then((res) => { // zywMessage().then((res) => {
// // console.log('findMessage============>', res) // // console.log('findMessage============>', res)
@ -149,5 +170,28 @@
} }
} }
} }
.item:hover {
cursor: pointer;
.img {
animation: turn 5s linear infinite;
}
}
}
@keyframes turn {
0% {
-webkit-transform: rotateY(0deg);
}
25% {
-webkit-transform: rotateY(90deg);
}
50% {
-webkit-transform: rotateY(180deg);
}
75% {
-webkit-transform: rotateY(270deg);
}
100% {
-webkit-transform: rotateY(360deg);
}
} }
</style> </style>

View File

@ -16,7 +16,7 @@
> >
<span <span
class="img" class="img"
:class="sel == '访问量' ? 'fwl' : sel == '申购量' ? 'sgl' : 'scl'" :class="sel == '浏览量' ? 'fwl' : sel == '申购量' ? 'sgl' : 'scl'"
></span> ></span>
<span class="text">{{ sel }}</span> <span class="text">{{ sel }}</span>
</div> </div>
@ -32,7 +32,7 @@
<div class="img" :class="item.imgType"></div> <div class="img" :class="item.imgType"></div>
</div> </div>
<div class="item-right"> <div class="item-right">
<div class="fw" v-if="select == '访问量'"> <div class="fw" v-if="select == '浏览量'">
{{ select }}:{{ item.visits }} {{ select }}:{{ item.visits }}
</div> </div>
<div class="fw" v-if="select == '申购量'"> <div class="fw" v-if="select == '申购量'">
@ -63,8 +63,8 @@
import { useStore } from 'vuex' import { useStore } from 'vuex'
const store = useStore() const store = useStore()
const router = useRouter() const router = useRouter()
const select = ref('访问量') const select = ref('浏览量')
const selList = ref(['访问量', '申购量', '收藏量']) const selList = ref(['浏览量', '申购量', '收藏量'])
const list = ref([]) const list = ref([])
const paramsGetResources = { const paramsGetResources = {
@ -74,13 +74,13 @@
type: '', type: '',
name: '', name: '',
infoList: [], infoList: [],
orderField: 'visits', // total visits 访 applyCount score collectCount orderField: 'visits', // total visits applyCount score collectCount
orderType: 'DESC', // ASC DESC orderType: 'DESC', // ASC DESC
} }
const selectChange = (sel) => { const selectChange = (sel) => {
select.value = sel select.value = sel
switch (select.value) { switch (select.value) {
case '访问量': case '浏览量':
paramsGetResources.orderField = 'visits' paramsGetResources.orderField = 'visits'
break break
case '申购量': case '申购量':

View File

@ -146,9 +146,9 @@
'智能算法', '智能算法',
'图层服务', '图层服务',
'开发组件', '开发组件',
'办公组件', // '',
'业务组件', '业务组件',
'其他', // '',
]) ])
const visible = ref(false) const visible = ref(false)
const showModal = () => { const showModal = () => {

View File

@ -367,20 +367,34 @@
</a-form-item> </a-form-item>
</div> </div>
<div v-if="!shifoushizujian"> <div v-if="!shifoushizujian">
<a-form-item label="组件名称"> <a-form-item label="组件名称" v-if="algorithmShow">
<a-input <a-input
v-model:value="dataForm.data.name" v-model:value="dataForm.data.name"
disabled="true" disabled="true"
placeholder="组件名称" placeholder="组件名称"
></a-input> ></a-input>
</a-form-item> </a-form-item>
<a-form-item label="应用描述"> <a-form-item label="算法名称" v-if="nameNotShow">
<a-input
v-model:value="dataForm.data.name"
disabled="true"
placeholder="算法名称"
></a-input>
</a-form-item>
<a-form-item label="应用描述" v-if="algorithmShow">
<a-input <a-input
v-model:value="dataForm.data.description" v-model:value="dataForm.data.description"
disabled="true" disabled="true"
placeholder="应用描述" placeholder="应用描述"
></a-input> ></a-input>
</a-form-item> </a-form-item>
<a-form-item label="算法描述" v-if="nameNotShow">
<a-input
v-model:value="dataForm.data.description"
disabled="true"
placeholder="算法描述"
></a-input>
</a-form-item>
<a-form-item label="部门联系人"> <a-form-item label="部门联系人">
<a-input <a-input
v-model:value="dataForm.data.deptContacts" v-model:value="dataForm.data.deptContacts"
@ -551,6 +565,8 @@
id: '', id: '',
}) })
let shifoushizujian = ref('') let shifoushizujian = ref('')
let nameNotShow = ref('')
let algorithmShow = ref('')
const dataForm = reactive({ data: {} }) const dataForm = reactive({ data: {} })
// //
const dataSource = reactive({ data: [] }) const dataSource = reactive({ data: [] })
@ -637,6 +653,17 @@
shifoushizujian.value = true shifoushizujian.value = true
} else { } else {
shifoushizujian.value = false shifoushizujian.value = false
console.log(res.data.data.resourceDTO)
debugger
res.data.data.resourceDTO.infoList.forEach((val) => {
console.log(val, '111111111111111111111111')
if (val.attrValue === '智能算法') {
nameNotShow.value = true
algorithmShow.value = false
console.log(nameNotShow.value, algorithmShow.value, 'wowowo')
debugger
}
})
} }
console.log('222222222222', dataForm.data) console.log('222222222222', dataForm.data)
}) })

View File

@ -48,7 +48,8 @@
<a-tooltip> <a-tooltip>
<template #title>{{ item.name }}</template> <template #title>{{ item.name }}</template>
<div class="content-body-title"> <div class="content-body-title">
名称{{ item.name }} <span v-if="item.name ==='申请摄像头列表'" @click="showVideoList(item)"> 名称{{ item.name }} </span>
<span v-else> 名称{{ item.name }} </span>
<div></div> <div></div>
</div> </div>
</a-tooltip> </a-tooltip>
@ -71,7 +72,8 @@
</div> </div>
<div v-else> <div v-else>
<p class="content-body-content-son"> <p class="content-body-content-son">
申请结果{{ item.comment || '暂无' }} <span v-if="item.name ==='申请摄像头列表'">申请结果{{ '列表地址' + backUrl + 'resource/getApplyCameraList/' + item.processInstanceId+';'+ '视频流地址'+backUrl + '/resource/hls/getHls/?channelId='}}</span>
<span v-else>申请结果{{ item.comment || '暂无' }}</span>
<a-button <a-button
type="primary" type="primary"
size="small" size="small"
@ -220,6 +222,19 @@
> >
<a-input v-model:value="reason" placeholder="请输入下架原因" /> <a-input v-model:value="reason" placeholder="请输入下架原因" />
</a-modal> </a-modal>
<a-modal
v-model:visible="videoVisible"
title="已申请摄像头列表"
@ok="videoVisible=false"
>
<a-table :columns="columns" :data-source="xVideoList" bordered :pagination="{defaultPageSize: 6}">
<template #bodyCell="{ column, text }">
<!-- <template>
<a>{{ text }}</a>
</template> -->
</template>
</a-table>
</a-modal>
</div> </div>
</template> </template>
@ -231,7 +246,7 @@
getTaskHandleDetailInfo, getTaskHandleDetailInfo,
// getProcDefBizRoute, // getProcDefBizRoute,
} from '@/api/personalCenter' } from '@/api/personalCenter'
import { updateRes, relaunch, selectOne } from '@/api/home' import { updateRes, relaunch, selectOne,getApplyCameraList } from '@/api/home'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { message } from 'ant-design-vue' import { message } from 'ant-design-vue'
import ApplyDetails from '@/views/personalCenter/components/ApplyDetails' import ApplyDetails from '@/views/personalCenter/components/ApplyDetails'
@ -241,6 +256,40 @@
// const contentListClone = reactive({ data: [] }) // const contentListClone = reactive({ data: [] })
// let contentListLength = contentList.length // let contentListLength = contentList.length
let tabIndex = ref(0) let tabIndex = ref(0)
const videoVisible = ref(false)
const columns = ref([{
title: '摄像头名称',
dataIndex: 'name'
}])
const xVideoList = ref([{
name: '111'
}, {
name: '222'
},{
name: '111'
}, {
name: '222'
},{
name: '111'
}, {
name: '222'
},{
name: '111'
}, {
name: '222'
},{
name: '111'
}, {
name: '222'
},{
name: '111'
}, {
name: '222'
},{
name: '111'
}, {
name: '222'
},])
function tabqiehuan(item, index) { function tabqiehuan(item, index) {
// debugger // debugger
tabIndex.value = index tabIndex.value = index
@ -272,6 +321,7 @@
const visible = ref(false) const visible = ref(false)
const delObj = ref({}) const delObj = ref({})
const taskId = ref('') const taskId = ref('')
const backUrl = ref(window.SITE_CONFIG.apiURL + '/')
const showDetail = (item) => { const showDetail = (item) => {
console.log('showDetail', item) console.log('showDetail', item)
// getProcDefBizRoute(item.processDefinitionId) // getProcDefBizRoute(item.processDefinitionId)
@ -281,6 +331,12 @@
processInstanceId.value = item.processInstanceId processInstanceId.value = item.processInstanceId
resourceId.value = item.resourceId resourceId.value = item.resourceId
} }
const showVideoList = (item) => {
// getApplyCameraList(item.processInstanceId).then(res=>{
// console.log('res', res)
// })
videoVisible.value = true
}
const copyComment = (data) => { const copyComment = (data) => {
let url = data let url = data
let oInput = document.createElement('input') let oInput = document.createElement('input')

View File

@ -318,9 +318,9 @@
'智能算法', '智能算法',
'图层服务', '图层服务',
'开发组件', '开发组件',
'办公组件', // '',
'业务组件', '业务组件',
'其他', // '',
]) ])
let tabname = ref('组件服务') let tabname = ref('组件服务')
function tabqiehuan(item, index) { function tabqiehuan(item, index) {