sxyanzhu
/
jhbigscreen
4
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases Wiki Activity

update code

dev-login
haha 2023-09-23 00:06:58 +08:00
parent 44ea12c84f
commit 4b0f1adb85
3 changed files with 165 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

71
src/components/chart-bar.js 100644
View File

@ -0,0 +1,71 @@
import Vue from 'vue'
Vue.component("chart-bar", {
template: `
<div class='chart-bar' style="position: relative" @click="doClick">
<div :style="{'height': height+'px'}" ref="warningPieChart">
</div>
</div>
`,
props: {
fn:{
type:Function
},
height:{
type:Number
},
optData:{
type:Array,
default:()=>[]
}
},
data() {
return {
}
},
mounted(){
this.init()
},
methods: {
doClick(){
this.$emit("clickme");
},
init(){
this.getChartData()
},
getChartData(){
//品类金额占比 饼图
var chChartPie = echarts.init(this.$refs.warningPieChart);
this.echartPie(chChartPie)
},
echartPie(chChart){
let newPromise = new Promise((resolve) => {
resolve()
})
//然后异步执行echarts的初始化函数
newPromise.then(() => {
this.option = {
legend: {
show:false
},
tooltip: { trigger: 'axis',
},
dataset: {
source: this.optData
},
xAxis: { type: 'category' },
yAxis: {},
series: [{ type: 'bar' }, { type: 'bar' }, { type: 'bar' }]
}
if(this.fn){
this.option=this.fn(this.option);
}
chChart.setOption(this.option);
window.onresize = chChart.resize;
})
},
},
})

11
src/components/project-overview-chart.js
View File

@ -10,6 +10,9 @@ Vue.component("project-overview-chart", {
`,
props: {
fn:{
type:Function
},
typedata:{
type: Array,
},
@ -115,12 +118,11 @@ Vue.component("project-overview-chart", {
if(total_datas==0){
percent=0;
}
return "{name| " + name + "}"+this.sp+"{percent|" + res[0].value + "}{percent|" + percent + "%}";
return "{name| " + name + "}"+this.sp+"{value|" + res[0].value + "} {percent|" + percent + "%}";
},
};
let opt={...legendOption,...(this.legendOpt||{})};
this.option = {
this.option = {
title: {
text: this.maintitle||total_datas,
subtext: this.text,
@ -201,6 +203,9 @@ Vue.component("project-overview-chart", {
},
],
}
if(this.fn){
this.option=this.fn(this.option);
}
chChart.setOption(this.option);
window.onresize = chChart.resize;
})

97
src/pages/projectEngin.vue
View File

@ -24,6 +24,7 @@
</div>
</module-one-1-1>
<module-one-1-1 label="安全技术标准" style="position: relative;">
<imageItem :images="list3" v-if="list3.length>0 && !loading"></imageItem>
<div v-if="list3.length==0 && !loading" style="text-align: center;margin-top: 40px;">
<img src="images/nodata.png" style="width: 240px;">
<div style="text-align: center;">暂无数据</div>
@ -32,10 +33,12 @@
</el-col>
<el-col :span="8">
<module-one-1-1 label="审批进度" :border="1">
<chart-bar :height="280" :optData="chart1Data" :fn="changeChart1" :key="elChart2"></chart-bar>
</module-one-1-1>
<module-one-1-1 label="待审批" :border="1">
<module-one-1-1 label="待审批" :border="1" class="chart2">
<project-overview-chart :key="elChart2" :fn="changeChart2" :sp="'\n'" :maintitle="flowTotal" :legend-opt="legendOpt2"
:typedata="chart2Data" :text="flowTitle" :height="280"
style="top:0px"></project-overview-chart>
</module-one-1-1>
<module-one-1-1 label="集团期刊" :border="1">
@ -43,18 +46,21 @@
</el-col>
<el-col :span="8">
<module-one-1-1 label="设备管理标准">
<imageItem :images="list4" v-if="list4.length>0 && !loading"></imageItem>
<div v-if="list4.length==0 && !loading" style="text-align: center;margin-top: 40px;">
<img src="images/nodata.png" style="width: 240px;">
<div style="text-align: center;">暂无数据</div>
</div>
</module-one-1-1>
<module-one-1-1 label="文明施工标准">
<imageItem :images="list5" v-if="list5.length>0 && !loading"></imageItem>
<div v-if="list5.length==0 && !loading" style="text-align: center;margin-top: 40px;">
<img src="images/nodata.png" style="width: 240px;">
<div style="text-align: center;">暂无数据</div>
</div>
</module-one-1-1>
<module-one-1-1 label="环境保护标准">
<imageItem :images="list6" v-if="list6.length>0 && !loading"></imageItem>
<div v-if="list6.length==0 && !loading" style="text-align: center;margin-top: 40px;">
<img src="images/nodata.png" style="width: 240px;">
<div style="text-align: center;">暂无数据</div>
@ -72,6 +78,8 @@ import '../components/module/module-one-1-2'
import '../components/background_video'
import '../components/header'
import '../components/staff-survey-chart'
import '../components/chart-bar'
import '../components/project-overview-chart'
import BorderBox6 from './components/BorderBox6.vue'
import debounce from 'lodash.debounce'
import imageItem from './engin/enginImageItems.vue'
@ -83,6 +91,7 @@ export default {
},
data() {
return {
elChart2:0,
loading:true,
index1:0,
index2:0,
@ -97,7 +106,36 @@ export default {
list5:[],
list6:[],
chart1Data:[],
chart2Data:[]
chart2Data:[],
legendOpt2:{
icon: "rect",
orient: "vertical",
left: '70%',
top: '0',
itemGap: 10,
itemWidth:20,
itemHeight:40,
textStyle: {
fontSize: 14,
rich: {
name: {
color: "#c3dbfd",
padding: [0, 2, 10, 2],
},
value: {
color: "#ffffff",
fontSize: 16,
},
percent: {
color: "#4676FD",
fontSize: 16,
padding: [0, 2, 0, 2],
},
},
}
},
flowTitle:'待审批',
flowTotal:0,
};
},
@ -116,6 +154,19 @@ export default {
},
methods: {
changeChart1(opt){
console.log("--opt->",opt)
//opt.xAxis.axisLabel={width:50}
//opt.xAxis.data=this.chartInfo;
return opt;
},
changeChart2(opt){
opt.title.left=135;
opt.title.top=20;
opt.series[0].center=["40%","50%"];
opt.series[1].center=["40%","50%"];
return opt;
},
getProjectId(cb) {
let func = () => {
let prjId = this.project?.id||0;
@ -131,12 +182,22 @@ export default {
}
func();
},
addBr(s){
let out="";
for(let i=0;i<s.length;i++){
out+=s.charAt(i);
if((i+1)%3==0 && i<s.length-2){
out+="\n";
}
}
return out;
},
loadData(){
this.getProjectId(id => {
let ajaxs=[
this.$api.standard.getList(id,this.dept.id),
this.$api.flow.groupByCategory(this.project.id,this.dept.id),
this.$api.flow.groupByUnit(this.project.id,this.dept.id),
this.$api.standard.getList(id,this.dept?.id||0),
this.$api.flow.groupByCategory(this.project?.id||0,this.dept?.id||0),
this.$api.flow.groupByUnit(this.project?.id||0,this.dept?.id||0),
];
this.$api.http.all(ajaxs).then(res=>{
let d=res[0];
@ -148,17 +209,19 @@ export default {
this.list5=tmps.filter(it=>it.standardType==5);
this.list6=tmps.filter(it=>it.standardType==6);
this.loading=false;
this.chart1Data=(res[1].data||[]).map(it=>{
let chartData=[ ['分类', '总计', '审批中', '已完成']];
this.chartInfo=[];
(res[1].data||[]).forEach(it=>{
let o= {
title:it.taskName,
comp:it.assigneeId||0,
uncomp:it.procDefVersion||0,
total:0
}
}
o.total=o.comp+o.uncomp;
return o;
chartData.push([this.addBr(o.title),o.total,o.uncomp,o.comp])
})
console.log("-1->",this.chart1Data);
this.chart1Data=chartData;
let tmps2=[{title:'总包单位',count:0},
{title:'监理单位',count:0},
{title:'设计单位',count:0},
@ -166,13 +229,19 @@ export default {
{title:'子公司',count:0},
];
let objs=res[2].data||[];
this.flowTotal=0;
tmps2.forEach(it=>{
let o=objs.find(item=>it.title==item.taskName);
if(o){
it.count=o.assigneeId
this.flowTotal+=o.assigneeId;
}
it.name=it.title;
it.value=it.count;
});
this.chart2Data=tmps2;
this.elChart2++;
console.log("-2->",this.chart2Data);
});
});
@ -192,5 +261,11 @@ export default {
/deep/ .border-1{
padding-left:0px;
}
.chart2{
/deep/ .chart-gif{
top:89px;
left:196px;
}
}
}
</style>