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

update code

prv
haha 2023-10-22 23:46:07 +08:00
parent dd383ce608
commit 4759b3dc49
8 changed files with 596 additions and 202 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
public/index.html
View File

@ -9,8 +9,7 @@
<link rel="stylesheet" href="https://cdn.makalu.cc/css/element-ui/index.css">
<link rel="stylesheet" href="css/largeScreenLayout.css">
<link rel="stylesheet" href="css/largeScreenStyle.css?v=2023101401">
<link rel="stylesheet" href="css/sichuanTibet.css">
<script type="text/javascript" src="http://api.map.baidu.com/api?type=webgl&v=1.0&ak=qmQNEi1qbFX628WfMt4imhdT87RbCRzK"></script>
<link rel="stylesheet" href="css/sichuanTibet.css">
<script src="https://cdn.makalu.cc/js/vue/vue.js"></script>
<script src="https://unpkg.com/element-ui@2.15.13/lib/index.js"></script>
<script src="https://cdn.makalu.cc/js/jquery/3.5.1/jquery.min.js"></script>
@ -23,7 +22,6 @@
<script src="./js/mapmodle.js"></script>
<script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&&type=webgl&ak=6zAD8CIavtzWnkGg0a7roush5maGMIPn"></script>
<script src="https://cdn.makalu.cc/js/echarts/china.js"></script>
<script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&&type=webgl&ak=6zAD8CIavtzWnkGg0a7roush5maGMIPn"></script>
<!-- 请求依赖 -->
<script src="https://cdn.makalu.cc/js/axios/axios.min.js"></script>
<!-- rtmp 支持依赖 -->

28
src/api/flow/index.js
View File

@ -13,6 +13,29 @@ const groupByUnit=(projectId,deptId)=> {
method: 'get'
})
}
const groupByUnitFinish=(projectId,deptId)=> {
return request({
url: `bgscreen/flow/groupByUnitFinish?projectId=${projectId}&deptId=${deptId}`,
method: 'get'
})
}
const groupByUnitTotal=(projectId,deptId)=> {
return request({
url: `bgscreen/flow/groupByUnitTotal?projectId=${projectId}&deptId=${deptId}`,
method: 'get'
})
}
const groupByProject=()=> {
return request({
url: `bgscreen/flow/groupByProject`,
method: 'get'
})
}
const listByUnit=(projectId,deptId,unit,pageNum,pageSize)=>{
return request({
url: `bgscreen/flow/listByUnit?pageNum=${pageNum}&pageSize=${pageSize}`,
@ -39,6 +62,9 @@ const listByState=(projectId,deptId,state,pageNum,pageSize)=>{
export default{
groupByCategory,
groupByUnit,
groupByUnitFinish,
groupByUnitTotal,
listByUnit,
listByState
listByState,
groupByProject
}

23
src/api/standard/index.js
View File

@ -7,6 +7,25 @@ const getList=(projectId,deptId)=> {
})
}
export default{
getList
const groupByType=data=>{
return request({
url:'bgscreen/standard/groupByType',
method:'post',
data:data
})
}
const groupByProject=()=>{
return request({
url:'bgscreen/standard/groupByProject',
method:'get'
})
}
export default{
getList,
groupByType,
groupByProject
}

2
src/components/chart-bar.js
View File

@ -54,7 +54,7 @@ Vue.component("chart-bar", {
dataset: {
source: this.optData
},
xAxis: { type: 'category' },
xAxis: { type: 'category' , axisLabel: {color:"#fff"}},
yAxis: {},
series: [{ type: 'bar' }, { type: 'bar' }, { type: 'bar' }]
}

11
src/components/header.vue
View File

@ -188,7 +188,7 @@ export default {
return it;
})]
}
this.deptChange();
this.deptChange((()=>{}));
});
}
this.$root.isTypeBuser = this.isTypeBuser;
@ -268,11 +268,11 @@ export default {
this.loadProject(true);
}
},
deptChange() {
deptChange(cb) {
if(!this.dept1){
if(this.depts.length>0){
this.dept1=this.depts[0].text;
this.loadProject(true);
this.loadProject(true,cb);
}
}
let tmps = this.depts.filter(d => d.text == this.dept1);
@ -331,7 +331,7 @@ export default {
this.deptChange();
this.loadProject();
},
loadProject(init) {
loadProject(init,cb) {
if (this.isTypeBuser) {
return;
}
@ -348,6 +348,9 @@ export default {
} else {
this.setScreenLiSel2(null);
}
if(cb){
cb();
}
});
},
setScreenLiSel2(item, init) {

57
src/pages/engin/enginChart.vue 100644
View File

@ -0,0 +1,57 @@
<template>
<div class='engin-chart1' style="position: relative" >
<div :style="{ 'height': height + 'px' }" ref="warningPieChart">
</div>
</div>
</template>
<script>
export default {
props: {
fn: {
type: Function
},
height: {
type: Number
}
},
data() {
return {
options:{},
opt:null
};
},
mounted() {
},
methods: {
init(opt) {
this.opt=opt;
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 = {
...this.opt||{}
}
if (this.fn) {
this.option = this.fn(this.option);
}
chChart.setOption(this.option);
window.onresize = chChart.resize;
})
},
},
};
</script>

22
src/pages/photography.vue
View File

@ -5,7 +5,8 @@
<el-col :span="6">
<module-one-3-1 label="延时摄影列表">
<div class="left-list scroll">
<el-collapse v-model="activeNames" >
<template v-if="dataList && dataList.length>0">
<el-collapse v-model="activeNames" >
<el-collapse-item v-for="(it, idx) in dataList" :key="idx" :name="it.videoDate">
<template slot="title">
<div style="position:relative;padding-left:20px;width: 100%;">
@ -23,11 +24,17 @@
</div>
</el-collapse-item>
</el-collapse>
</template>
<div v-else style="text-align: center;" class="div-no-data">
<img src="images/nodata.png" style="width: 120px;">
<div style="text-align: center;font-size: 12px;color:#888;">暂无数据</div>
</div>
</div>
</module-one-3-1>
</el-col>
<el-col :span="18" class="no-title">
<module-one-3-3 label="" :notitle="true">
<template v-if="info">
<div class="right-title">
<span class="sp-title">{{info.videoDate }}</span>
</div>
@ -35,6 +42,11 @@
<source :src="info.videoUrl" type="video/mp4" />
您的浏览器不支持Video标签。
</video>
</template>
<div v-else style="text-align: center;" class="div-no-data">
<img src="images/nodata.png" style="width: 120px;">
<div style="text-align: center;font-size: 12px;color:#888;">暂无数据</div>
</div>
</module-one-3-3>
</el-col>
</el-row>
@ -77,6 +89,7 @@ export default {
this.info=it;
},
loadData() {
this.info=null;
this.getProjectId(id => {
this.$api.project.listPhotography(id).then(d => {
this.dataList = (d.data || []).map(it => {
@ -117,6 +130,13 @@ export default {
<style lang="less" scoped>
.prj-photography-main {
.div-no-data{
text-align: center;
height: 600px;
display: flex;
align-items: center;
justify-content: center;
}
.no-title {
/deep/ .screen-one-3-3 {
background-image: none;

651
src/pages/projectEngin.vue
View File

@ -3,79 +3,84 @@
<div class="screen-content">
<el-row>
<el-col :span="8">
<module-one-1-1 label="现场管理标准化" style="position: relative;">
<imageItem :images="list1" v-if="list1.length>0 && !loading"></imageItem>
<div v-if="list1.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 :label="label1" style="position: relative;">
<enginChart ref="chart1" :height="300"></enginChart>
</module-one-1-1>
<module-one-1-1 label="作业标准" style="position: relative;">
<imageItem :images="list2" v-if="list2.length>0 && !loading"></imageItem>
<div v-if="list2.length==0 && !loading" style="text-align: center;margin-top: 40px;">
<img src="images/nodata.png" style="width: 240px;">
<div style="text-align: center;">暂无数据</div>
<module-one-2-1 label="作业标准" style="position: relative;">
<div class="scroll" style="max-height: 580px;overflow-y: auto;margin-top: 20px;">
<table class="tb-list1">
<tr>
<th>排名</th>
<th>项目名称</th>
<th>上传数量</th>
<th>上传占比</th>
</tr>
<tr v-for="(it, idx) in list1" :key="idx">
<td>{{ it.no }}</td>
<td>{{ it.name }}</td>
<td>{{ it.value }}</td>
<td>{{ it.percent }}%</td>
</tr>
</table>
</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>
</div>
</module-one-1-1>
</module-one-2-1>
</el-col>
<el-col :span="8">
<module-one-1-1 label="审批进度" :border="1" style="position: relative;">
<img src="images/icon2001.png" style="position: absolute;cursor: pointer;right: 20px;top: 32px;z-index: 9;" @click="doStateDlg">
<module-one-1-1 :label="lablel3" :border="1" style="position: relative;">
<img src="images/icon2001.png"
style="position: absolute;cursor: pointer;right: 20px;top: 32px;z-index: 9;"
@click="doStateDlg">
<chart-bar :height="280" :optData="chart1Data" :fn="changeChart1" :key="elChart2"></chart-bar>
</module-one-1-1>
<module-one-1-1 label="待审批" :border="1" class="chart2" style="position: relative;">
<img src="images/icon2001.png" style="position: absolute;cursor: pointer;right: 20px;top: 32px;z-index:9;" @click="doUnitDlg">
<project-overview-chart :key="elChart2" :fn="changeChart2" :sp="'\n'" :maintitle="flowTotal" :legend-opt="legendOpt2"
:typedata="chart2Data" :text="flowTitle" :height="280"
txtTop="52" gifTop="90px" style="top:0px"></project-overview-chart>
<module-one-1-1 label="项目审批排名" :border="1" class="chart2" style="position: relative;">
<div class="scroll" style="margin-top: 30px;max-height: 240px;overflow-y: auto;">
<table class="tb-list1">
<tr>
<th>排名</th>
<th>申请项目</th>
<th>申请数量</th>
<th>申请占比</th>
</tr>
<tr v-for="(it, idx) in list1" :key="idx">
<td>{{ it.no }}</td>
<td>{{ it.name }}</td>
<td>{{ it.value }}</td>
<td>{{ it.percent }}%</td>
</tr>
</table>
</div>
</module-one-1-1>
<module-one-1-1 label="集团期刊" style="position: relative;">
<imageItem :images="periodicalList" v-if="periodicalList.length>0 && !loading" mode="periodical"></imageItem>
<div v-if="periodicalList.length==0 && !loading" style="text-align: center;margin-top: 40px;">
<module-one-1-1 label="集团期刊" style="position: relative;">
<imageItem :images="periodicalList" v-if="periodicalList.length > 0 && !loading" mode="periodical">
</imageItem>
<div v-if="periodicalList.length == 0 && !loading" style="text-align: center;margin-top: 40px;"
:key="elList4">
<img src="images/nodata.png" style="width: 240px;">
<div style="text-align: center;">暂无数据</div>
</div>
</module-one-1-1>
</el-col>
<el-col :span="8">
<module-one-1-1 label="设备管理标准" style="position: relative;">
<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 :label="label6" style="position: relative;">
<enginChart ref="chart3" :height="300"></enginChart>
</module-one-1-1>
<module-one-1-1 label="文明施工标准" style="position: relative;">
<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 :label="label7" style="position: relative;">
<enginChart ref="chart4" :height="300"></enginChart>
</module-one-1-1>
<module-one-1-1 label="环境保护标准" style="position: relative;">
<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>
</div>
<module-one-1-1 :label="label8" style="position: relative;">
<enginChart ref="chart5" :height="300"></enginChart>
</module-one-1-1>
</el-col>
</el-row>
</div>
<unitDialog ref="unitDlg"></unitDialog>
<stateDialog ref="stateDlg"></stateDialog>
</el-row>
</div>
<unitDialog ref="unitDlg"></unitDialog>
<stateDialog ref="stateDlg"></stateDialog>
</div>
</template>
<script>
import '../components/module/module-one-1-2'
import '../components/module/module-one-2-1'
import '../components/staff-survey-chart'
import '../components/chart-bar'
import BorderBox6 from './components/BorderBox6.vue'
@ -83,61 +88,42 @@ import debounce from 'lodash.debounce'
import imageItem from './engin/enginImageItems.vue'
import unitDialog from './engin/flowDetailByUnitDialog.vue'
import stateDialog from './engin/flowDetailByStateDialog.vue'
import enginChart from './engin/enginChart.vue'
import { tryToJson } from '@/utils/tools'
export default {
name: 'JhbigscreenProjectEngin',
components: {
BorderBox6,
imageItem,unitDialog,stateDialog
imageItem, unitDialog, stateDialog, enginChart
},
data() {
return {
elChart2:0,
loading:true,
index1:0,
index2:0,
index3:0,
index4:0,
index5:0,
index6:0,
list1:[],
list2:[],
list3:[],
list4:[],
list5:[],
list6:[],
chart1Data:[],
chart2Data:[],
legendOpt2:{
icon: "rect",
orient: "vertical",
left: '70%',
top: '0',
itemGap: 10,
itemWidth:20,
itemHeight:40,
textStyle: {
color: "#c3dbfd",
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,
periodicalList:[]
label1: '项目标准化管理',
lablel3: '审批进度',
label6: '审批总数',
label7: '已完成审批',
label8: '待审批',
elChart2: 0,
elChart3: 0,
elList4: 0,
loading: true,
index1: 0,
index2: 0,
index3: 0,
index4: 0,
index5: 0,
index6: 0,
list1: [],
list2: [],
list3: [],
list4: [],
list5: [],
list6: [],
chart1Data: [],
chart2Data: [],
flowTitle: '待审批',
flowTotal: 0,
periodicalList: []
};
},
@ -145,64 +131,70 @@ export default {
this.$bus.$on("loadProjects", debounce(prjs => {
this.prjs = prjs;
}));
this.$bus.$on("projectChange",debounce(res => {
this.project = res;
this.$bus.$on("projectChange", debounce(res => {
this.project = res;
this.loadData();
}));
this.$bus.$on("deptChange",debounce(dept => {
this.$bus.$on("deptChange", debounce(dept => {
this.dept = dept;
this.loadData();
}));
this.loadPeriodical();
if(this.$root.hasInitHeader){
if (this.$root.hasInitHeader) {
this.initMe();
}
},
methods: {
initMe(){
this.project=this.$root.project||{};
this.dept=this.$root.dept||{};
this.prjs=this.$root.projects||[];
initMe() {
this.project = this.$root.project || {};
this.dept = this.$root.dept || {};
this.prjs = this.$root.projects || [];
this.loadData();
},
doStateDlg(){
doStateDlg() {
this.$refs.stateDlg.showDialog({
deptId:this.dept?.id||0,
projectId:this.project?.id||0
deptId: this.dept?.id || 0,
projectId: this.project?.id || 0
});
},
doUnitDlg(){
doUnitDlg() {
this.$refs.unitDlg.showDialog({
deptId:this.dept?.id||0,
projectId:this.project?.id||0
deptId: this.dept?.id || 0,
projectId: this.project?.id || 0
});
},
loadPeriodical(){
this.$api.periodical.getList().then(d=>{
this.periodicalList=(d.data||[]).map(it=>{
it.fileUrl=JSON.parse(it.fileUrl);
it.imageFile=it.imageUrl;
it.standardDesc=it.name;
loadPeriodical() {
this.$api.periodical.getList().then(d => {
this.periodicalList = (d.data || []).map(it => {
it.fileUrl = JSON.parse(it.fileUrl);
it.imageFile = it.imageUrl;
it.standardDesc = it.name;
return it;
})
})
});
},
changeChart1(opt){
changeChart1(opt) {
opt.legend = {
textStyle: {
color: "#fff"
}
};
return opt;
},
changeChart2(opt){
opt.title.left=135;
opt.title.top=20;
opt.series[0].center=["40%","50%"];
opt.series[1].center=["40%","50%"];
changeChart2(opt) {
opt.title.left = 135;
opt.title.top = 20;
opt.legend = {};
opt.series[0].center = ["40%", "50%"];
opt.series[1].center = ["40%", "50%"];
return opt;
},
getProjectId(cb) {
let func = () => {
let prjId = this.project?.id||0;
let prjId = this.project?.id || 0;
if (prjId == 0) {
if (!this.prjs||this.prjs.length == 0) {
if (!this.prjs || this.prjs.length == 0) {
setTimeout(func, 100);
} else {
cb && cb(this.prjs[1].id);
@ -213,66 +205,324 @@ 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";
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||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];
let tmps=d.data||[];
this.list1=tmps.filter(it=>it.standardType==1);
this.list2=tmps.filter(it=>it.standardType==2);
this.list3=tmps.filter(it=>it.standardType==3);
this.list4=tmps.filter(it=>it.standardType==4);
this.list5=tmps.filter(it=>it.standardType==5);
this.list6=tmps.filter(it=>it.standardType==6);
this.loading=false;
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;
chartData.push([this.addBr(o.title),o.total,o.uncomp,o.comp])
})
this.chart1Data=chartData;
let tmps2=[{title:'总包单位',count:0},
{title:'监理单位',count:0},
{title:'设计单位',count:0},
{title:'甲方代表',count:0},
{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;
showChart1(data) {
let tmps = data.data || [];
let datas = tmps.map(d => (d.status || 0) * 1);
let sum = 0;
datas.forEach(d => {
sum += d;
});
this.label1 = `项目标准化管理(${sum})`
let lbls = tmps.map(d => d.dictLabel);
let opt = {
xAxis: {
type: 'category',
boundaryGap: false,
data: lbls,
axisLabel: {
show: true,
interval: 0,
color: "#fff"
}
it.name=it.title;
it.value=it.count;
});
this.chart2Data=tmps2;
this.elChart2++;
},
yAxis: {
type: 'value'
},
series: [
{
data: datas,
type: 'line',
smooth: true,
areaStyle: {
color: "rgba(58, 145, 227, 0.68)"
}
}
]
}
this.$refs.chart1.init(opt);
},
showList1(res) {
let tmps = (res.data || []).map((d, i) => {
return {
id: d.projectId,
no: i + 1,
name: d.standardDesc,
value: d.deptId || 0,
percent: 0,
}
});
let sum = 0;
tmps.forEach(d => {
sum += d.value;
});
if (sum > 0) {
tmps.forEach(d => {
d.percent = (d.value * 100.0 / sum).toFixed(2);
});
}
let objs = [];
let prjIds = this.prjs.map(d => d.id).filter(d => d > 0);
tmps.forEach(d => {
if (prjIds.indexOf(d.id) >= 0) {
objs.push(d);
}
})
if (this.project?.id != 0) {
let out = objs.filter(d => d.id == this.project.id);
if (out.length == 0) {
this.list1 = [{ id: this.project.id, name: this.project.projectName, value: 0, percent: 0, no: '-' }];
} else {
this.list1 = out;
}
} else {
this.list1 = objs;
}
},
showChart2(res) {
let chartData = [['分类', '总计', '审批中', '已完成']];
this.chartInfo = [];
let sum = 0;
(res.data || []).forEach(it => {
let o = {
title: it.taskName,
comp: it.assigneeId || 0,
uncomp: it.procDefVersion || 0,
total: 0
}
o.total = o.comp + o.uncomp;
sum += o.total;
chartData.push([this.addBr(o.title), o.total, o.uncomp, o.comp])
})
this.chart1Data = chartData;
this.lablel3 = `审批进度 (${sum})`;
this.elChart2++;
},
showList2(res) {
let tmps = (res.data || []).map((it, idx) => {
return {
no: idx + 1,
id: it.businessKey,
name: it.businessKeyName,
value: it.duration * 1,
percent: 0
}
});
let sum = 0;
tmps.forEach(d => {
sum += d.value;
});
if (sum > 0) {
tmps.forEach(d => {
d.percent = (d.value * 100.0 / sum).toFixed(2);
});
}
let objs = [];
let prjIds = this.prjs.map(d => d.id).filter(d => d > 0);
tmps.forEach(d => {
if (prjIds.indexOf(d.id) >= 0) {
objs.push(d);
}
})
if (this.project?.id != 0) {
let out = objs.filter(d => d.id == this.project.id);
if (out.length == 0) {
this.list2 = [{ id: this.project.id, name: this.project.projectName, value: 0, percent: 0, no: '-' }];
} else {
this.list2 = out;
}
} else {
this.list2 = objs;
}
},
showList3(res) {
this.periodicalList = (res.data || []).map(it => {
it.fileUrl = JSON.parse(it.fileUrl);
it.imageFile = it.imageUrl;
it.standardDesc = it.name;
return it;
})
this.elList4++;
},
showChart3(res) {
let tmps = (res.data || []).map(d => {
return {
name: d.taskName,
value: (d.assigneeId || 0) * 1
}
})
let sum = 0;
tmps.forEach(it => {
sum += it.value;
})
let opt = {
tooltip: {
trigger: 'item'
},
legend: {
orient: 'vertical',
left: 'right',
top: 'middle',
textStyle: {
color: "#fff"
}
},
series: [
{
type: 'pie',
radius: '50%',
data: tmps,
label: {
color: "#fff"
}
}
]
};
this.label6 = `审批总数 (${sum})`
this.$refs.chart3.init(opt);
},
showChart4(res) {
let tmps = (res.data || []).map(d => {
return {
name: d.taskName,
value: (d.assigneeId || 0) * 1
}
})
let sum = 0;
tmps.forEach(it => {
sum += it.value;
})
this.label7 = `已完成审批 (${sum})`
let opt = {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
color: ['#409eff'],
xAxis: {
type: 'category',
data: tmps.map(d => d.name),
axisLabel: {
color: "#fff"
}
},
yAxis: {
type: 'value',
axisLabel: {
color: "#fff"
}
},
series: [
{
data: tmps.map(d => d.value),
type: 'bar'
}
]
};
this.$refs.chart4.init(opt);
},
showChart5(res) {
let tmps = (res.data || []).map(d => {
return {
name: d.taskName,
value: (d.assigneeId || 0) * 1,
max: 0
}
})
let sum = 0;
let max = 10;
tmps.forEach(it => {
sum += it.value;
if (it.value > max) {
max = it.value;
}
})
max = (max / 5 + 1) * 5;
tmps.forEach(it => {
it.max = max;
});
this.label8 = `待审批 (${sum})`
let opt = {
radar: {
indicator: tmps,
},
series: [
{
type: 'radar',
data: [
{
value: tmps.map(d=>d.max-5),
symbol: 'rect',
symbolSize: 12,
lineStyle: {
type: 'dashed'
},
label: {
show: true,
color:"#409eff"
}
},
{
value: tmps.map(d=>d.value),
label: {
show: true,
color:"#fff"
},
areaStyle: {
color: new echarts.graphic.RadialGradient(0.1, 0.6, 1, [
{
color: 'rgba(255, 145, 124, 0.1)',
offset: 0
},
{
color: 'rgba(255, 145, 124, 0.9)',
offset: 1
}
])
}
}
]
}
]
};
this.$refs.chart5.init(opt);
},
loadData() {
this.getProjectId(id => {
let ajaxs = [
this.$api.standard.groupByType({ projectId: this.project?.id || 0, deptId: this.dept?.id || 0 }),
this.$api.standard.groupByProject(),
this.$api.flow.groupByCategory(this.project?.id || 0, this.dept?.id || 0),
this.$api.flow.groupByProject(),
this.$api.periodical.getList(),
this.$api.flow.groupByUnitTotal(this.project?.id || 0, this.dept?.id || 0),
this.$api.flow.groupByUnitFinish(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 => {
this.showChart1(res[0]);
this.showList1(res[1]);
this.showChart2(res[2]);
this.showList2(res[3]);
this.showList3(res[4]);
this.showChart3(res[5]);
this.showChart4(res[6]);
this.showChart5(res[7]);
this.loading = false;
});
});
},
@ -287,14 +537,35 @@ export default {
</script>
<style lang="less" scoped>
.project-engin-index{
/deep/ .border-1{
padding-left:0px;
.project-engin-index {
/deep/ .border-1 {
padding-left: 0px;
}
.chart2{
/deep/ .chart-gif{
top:89px;
left:196px;
.chart2 {
/deep/ .chart-gif {
top: 89px;
left: 196px;
}
}
.tb-list1 {
margin: 12px;
width: calc(100% - 24px);
border-collapse: collapse;
border: solid 1px #ffffff52;
th {
font-size: 14px;
border: solid 1px #ffffff52;
line-height: 60px;
}
td {
font-size: 12px;
text-align: center;
border: solid 1px #ffffff52;
line-height: 40px;
}
}
}