Skip to content
项目
群组
代码片段
帮助
正在加载...
帮助
提交反馈
为 GitLab 提交贡献
登录
切换导航
P
pica-learning-report
项目
项目
详情
动态
版本
周期分析
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
统计图
议题
0
议题
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
CI / CD
CI / CD
流水线
作业
计划
统计图
Wiki
Wiki
代码片段
代码片段
成员
成员
收起侧边栏
Close sidebar
动态
分支图
统计图
创建新议题
作业
提交
议题看板
打开侧边栏
com.pica.cloud.education.frontend
pica-learning-report
提交
368b0b32
提交
368b0b32
编写于
12月 14, 2019
作者:
guangjun.yang
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
解决图表为空的问题
上级
024503d8
变更
10
隐藏空白字符变更
内嵌
并排
正在显示
10 个修改的文件
包含
247 行增加
和
158 行删除
+247
-158
chart-column-horizontal-tc-long.vue
...ents/bussiness/charts/chart-column-horizontal-tc-long.vue
+34
-28
chart-column-horizontal-tc.vue
components/bussiness/charts/chart-column-horizontal-tc.vue
+30
-20
chart-column-stack.vue
components/bussiness/charts/chart-column-stack.vue
+62
-51
chart-column-vertical-score.vue
components/bussiness/charts/chart-column-vertical-score.vue
+22
-12
chart-column-vertical-tc.vue
components/bussiness/charts/chart-column-vertical-tc.vue
+23
-14
chart-column-vertical-times.vue
components/bussiness/charts/chart-column-vertical-times.vue
+25
-12
chart-pie-edu.vue
components/bussiness/charts/chart-pie-edu.vue
+15
-5
chart-pie-title.vue
components/bussiness/charts/chart-pie-title.vue
+13
-4
chart-pie.vue
components/bussiness/charts/chart-pie.vue
+22
-11
index.vue
pages/index.vue
+1
-1
未找到文件。
components/bussiness/charts/chart-column-horizontal-tc-long.vue
浏览文件 @
368b0b32
...
@@ -2,18 +2,21 @@
...
@@ -2,18 +2,21 @@
<
template
>
<
template
>
<div>
<div>
<div
class=
"chart-column-vtc"
>
<div
class=
"chart-column-vtc"
>
<div
:id=
"id"
:style=
"
{width: chartWidth, height: chartHeight}">
</div>
<div
v-show=
"isShow"
:id=
"id"
:style=
"
{width: chartWidth, height: chartHeight}">
</div>
<NoContent
v-show=
"!isShow"
:id=
"id"
:style=
"
{width: '100%', height: '220px'}">
</NoContent>
</div>
</div>
<CommonNoMore></CommonNoMore>
<CommonNoMore
v-show=
"isShow"
></CommonNoMore>
</div>
</div>
</
template
>
</
template
>
<
script
>
<
script
>
let
vm
=
null
;
let
vm
=
null
;
import
CommonNoMore
from
"@/components/common/common-no-more"
;
import
CommonNoMore
from
"@/components/common/common-no-more"
;
import
NoContent
from
"@/components/bussiness/no-content"
;
// let chartColumn = null;
// let chartColumn = null;
export
default
{
export
default
{
components
:
{
components
:
{
CommonNoMore
CommonNoMore
,
NoContent
},
},
props
:
{
props
:
{
id
:
{
id
:
{
...
@@ -39,32 +42,38 @@ export default {
...
@@ -39,32 +42,38 @@ export default {
data
()
{
data
()
{
return
{
return
{
chartWidth
:
"100%"
,
chartWidth
:
"100%"
,
chartHeight
:
"200px"
chartHeight
:
"200px"
,
isShow
:
true
};
};
},
},
watch
:
{
watch
:
{
dataList
:
{
dataList
:
{
handler
(
newVal
)
{
handler
(
newVal
)
{
let
yAxisData
=
[],
if
(
newVal
.
length
)
{
series0Data
=
[],
this
.
isShow
=
true
;
series1Data
=
[];
let
yAxisData
=
[],
yAxisData
=
newVal
.
map
(
item
=>
{
series0Data
=
[],
return
this
.
shortName
(
item
.
classifyName
)
series1Data
=
[];
});
yAxisData
=
newVal
.
map
(
item
=>
{
series0Data
=
this
.
dataList
.
map
(
item
=>
{
return
this
.
shortName
(
item
.
classifyName
)
return
(
item
.
beforeRate
||
0
)
*
100
;
});
});
series0Data
=
this
.
dataList
.
map
(
item
=>
{
series1Data
=
this
.
dataList
.
map
(
item
=>
{
return
(
item
.
beforeRate
||
0
)
*
100
;
return
(
item
.
afterRate
||
0
)
*
100
;
});
});
series1Data
=
this
.
dataList
.
map
(
item
=>
{
if
(
process
.
client
)
{
return
(
item
.
afterRate
||
0
)
*
100
;
let
clientWidth
=
});
window
.
outerWidth
||
if
(
process
.
client
)
{
document
.
body
.
clientWidth
||
let
clientWidth
=
document
.
documentElement
.
clientWidth
;
window
.
outerWidth
||
this
.
chartWidth
=
clientWidth
+
"px"
;
document
.
body
.
clientWidth
||
this
.
chartHeight
=
53
*
this
.
dataList
.
length
+
"px"
;
document
.
documentElement
.
clientWidth
;
this
.
drawColumn
(
yAxisData
,
series0Data
,
series1Data
);
this
.
chartWidth
=
clientWidth
+
"px"
;
this
.
chartHeight
=
53
*
this
.
dataList
.
length
+
"px"
;
this
.
drawColumn
(
yAxisData
,
series0Data
,
series1Data
);
}
}
else
{
this
.
isShow
=
false
;
}
}
},
},
deep
:
true
deep
:
true
...
@@ -72,10 +81,7 @@ export default {
...
@@ -72,10 +81,7 @@ export default {
},
},
created
()
{
created
()
{
if
(
process
.
client
)
{
// vm = this;
// this.drawColumn([], [], []);
}
},
},
mounted
()
{
mounted
()
{
vm
=
this
;
vm
=
this
;
...
...
components/bussiness/charts/chart-column-horizontal-tc.vue
浏览文件 @
368b0b32
...
@@ -2,15 +2,20 @@
...
@@ -2,15 +2,20 @@
<
template
>
<
template
>
<div>
<div>
<div
class=
"chart-column-htc"
>
<div
class=
"chart-column-htc"
>
<div
:id=
"id"
:style=
"
{width: chartWidth, height: chartHeight}">
</div>
<div
v-show=
"isShow"
:id=
"id"
:style=
"
{width: chartWidth, height: chartHeight}">
</div>
<NoContent
v-show=
"!isShow"
:id=
"id"
:style=
"
{width: '100%', height: '220px'}">
</NoContent>
</div>
</div>
</div>
</div>
</
template
>
</
template
>
<
script
>
<
script
>
import
{
format
}
from
"path"
;
import
{
format
}
from
"path"
;
import
NoContent
from
"@/components/bussiness/no-content"
;
let
vm
=
null
,
let
vm
=
null
,
chartColumn
=
null
;
chartColumn
=
null
;
export
default
{
export
default
{
components
:
{
NoContent
},
props
:
{
props
:
{
dataList
:
{
dataList
:
{
type
:
Array
,
type
:
Array
,
...
@@ -28,31 +33,36 @@ export default {
...
@@ -28,31 +33,36 @@ export default {
data
()
{
data
()
{
return
{
return
{
chartWidth
:
"300px"
,
chartWidth
:
"300px"
,
chartHeight
:
"350px"
chartHeight
:
"350px"
,
isShow
:
true
,
};
};
},
},
watch
:
{
watch
:
{
dataList
:
{
dataList
:
{
handler
(
newVal
)
{
handler
(
newVal
)
{
let
yAxisData
=
[],
if
(
newVal
.
length
)
{
series0Data
=
[],
this
.
isShow
=
true
;
series1Data
=
[];
let
yAxisData
=
[],
yAxisData
=
newVal
.
map
(
item
=>
{
series0Data
=
[],
return
this
.
shortName
(
item
.
classifyName
);
series1Data
=
[];
// return (item.classifyName || 0).toFixed(1) * 100 + '%'
yAxisData
=
newVal
.
map
(
item
=>
{
});
return
this
.
shortName
(
item
.
classifyName
);
series0Data
=
this
.
dataList
.
map
(
item
=>
{
});
return
((
item
.
beforeRate
||
0
)
*
100
).
toFixed
(
1
);
series0Data
=
this
.
dataList
.
map
(
item
=>
{
});
return
((
item
.
beforeRate
||
0
)
*
100
).
toFixed
(
1
);
series1Data
=
this
.
dataList
.
map
(
item
=>
{
});
return
((
item
.
afterRate
||
0
)
*
100
).
toFixed
(
1
);
series1Data
=
this
.
dataList
.
map
(
item
=>
{
});
return
((
item
.
afterRate
||
0
)
*
100
).
toFixed
(
1
);
this
.
drawColumn
(
});
yAxisData
.
splice
(
0
,
5
),
this
.
drawColumn
(
series0Data
.
splice
(
0
,
5
),
yAxisData
.
splice
(
0
,
5
),
series1Data
.
splice
(
0
,
5
)
series0Data
.
splice
(
0
,
5
),
);
series1Data
.
splice
(
0
,
5
)
);
}
else
{
this
.
isShow
=
false
;
}
},
},
deep
:
false
deep
:
false
}
}
...
...
components/bussiness/charts/chart-column-stack.vue
浏览文件 @
368b0b32
<!-- 柱状图-横向 -->
<!-- 柱状图-横向 -->
<
template
>
<
template
>
<div
class=
"chart-pie"
>
<div
class=
"chart-pie"
>
<div
:id=
"id"
:style=
"
{width: chartWidth, height: chartHeight}">
</div>
<div
v-show=
"isShow"
:id=
"id"
:style=
"
{width: chartWidth, height: chartHeight}">
</div>
<NoContent
v-show=
"!isShow"
:id=
"id"
:style=
"
{width: '100%', height: '220px'}">
</NoContent>
</div>
</div>
</
template
>
</
template
>
<
script
>
<
script
>
import
{
format
}
from
"path"
;
import
{
format
}
from
"path"
;
import
NoContent
from
"@/components/bussiness/no-content"
;
let
vm
=
null
;
let
vm
=
null
;
let
certNameConfig
=
{
let
certNameConfig
=
{
'-1'
:
'未获证人数'
,
'-1'
:
'未获证人数'
,
...
@@ -15,6 +17,9 @@ let certNameConfig = {
...
@@ -15,6 +17,9 @@ let certNameConfig = {
'4'
:
'获不及格人数'
,
'4'
:
'获不及格人数'
,
}
}
export
default
{
export
default
{
components
:
{
NoContent
},
props
:
{
props
:
{
id
:
{
id
:
{
type
:
String
,
type
:
String
,
...
@@ -42,6 +47,7 @@ export default {
...
@@ -42,6 +47,7 @@ export default {
legendData
:
[],
legendData
:
[],
yAxisData
:
[],
yAxisData
:
[],
seriesData
:
[],
seriesData
:
[],
isShow
:
true
};
};
},
},
mounted
()
{
mounted
()
{
...
@@ -50,61 +56,66 @@ export default {
...
@@ -50,61 +56,66 @@ export default {
watch
:
{
watch
:
{
echartsData
:
{
echartsData
:
{
handler
(
newVal
,
oldValue
)
{
handler
(
newVal
,
oldValue
)
{
// console.log(newVal, oldValue);
if
(
newVal
.
length
)
{
vm
.
legendData
=
[];
this
.
isShow
=
true
;
vm
.
yAxisData
=
[];
// console.log(newVal, oldValue);
vm
.
seriesData
=
[];
vm
.
legendData
=
[];
vm
.
yAxisData
=
[];
let
cData
,
certList
,
certLength
=
0
,
certData
=
[],
certId
=
0
,
certName
=
'其它'
;
vm
.
seriesData
=
[];
// 将所有证书名称进行修改
for
(
let
i
=
0
;
i
<
newVal
.
length
;
i
++
)
{
let
cData
,
certList
,
certLength
=
0
,
certData
=
[],
certId
=
0
,
certName
=
'其它'
;
for
(
let
j
=
0
;
j
<
newVal
[
i
].
certList
.
length
;
j
++
)
{
// 将所有证书名称进行修改
if
(
vm
.
certFlag
==
1
&&
newVal
[
i
].
certList
[
j
].
id
!=
-
1
)
{
// 如果是单证书
for
(
let
i
=
0
;
i
<
newVal
.
length
;
i
++
)
{
newVal
[
i
].
certList
[
j
].
name
=
'已获证人数'
for
(
let
j
=
0
;
j
<
newVal
[
i
].
certList
.
length
;
j
++
)
{
}
else
{
if
(
vm
.
certFlag
==
1
&&
newVal
[
i
].
certList
[
j
].
id
!=
-
1
)
{
// 如果是单证书
newVal
[
i
].
certList
[
j
].
name
=
certNameConfig
[
newVal
[
i
].
certList
[
j
].
id
];
newVal
[
i
].
certList
[
j
].
name
=
'已获证人数'
}
else
{
newVal
[
i
].
certList
[
j
].
name
=
certNameConfig
[
newVal
[
i
].
certList
[
j
].
id
];
}
}
}
}
}
}
for
(
let
i
=
0
;
i
<
newVal
.
length
;
i
++
){
for
(
let
i
=
0
;
i
<
newVal
.
length
;
i
++
){
certData
=
[];
certData
=
[
];
cData
=
newVal
[
i
];
cData
=
newVal
[
i
]
;
vm
.
yAxisData
.
push
(
cData
.
eduName
)
;
vm
.
yAxis
Data
.
push
(
cData
.
eduName
);
// vm.legend
Data.push(cData.eduName);
// vm.legendData.push(cData.eduName)
;
certLength
=
cData
.
certList
.
length
;
certLength
=
cData
.
certList
.
length
;
for
(
let
j
=
0
;
j
<
certLength
;
j
++
)
{
for
(
let
j
=
0
;
j
<
certLength
;
j
++
)
{
certList
=
cData
.
certList
;
certList
=
cData
.
certList
;
certData
.
push
(
certList
[
j
].
value
)
;
certData
.
push
(
certList
[
j
].
value
);
if
(
i
==
0
)
{
if
(
i
==
0
)
{
// certId = certList[j].certId
// certId = certList[j].certId
// if(certId == -1) {
// if(certId == -1) {
// certName = '未获证人数'
// certName = '未获证人数'
// } else if(certId == 1) {
// } else if(certId == 1) {
// certName = '获优秀人数'
// certName = '获优秀人数'
// } else if(certId == 2) {
// } else if(certId == 2) {
// certName = '获良好人数'
// certName = '获良好人数'
// } else if(certId == 3) {
// } else if(certId == 3) {
// certName = '获及格人数'
// certName = '获及格人数'
// } else if(certId == 3) {
// } else if(certId == 3) {
// certName = '获不及格人数'
// certName = '获不及格人数'
// } else {
// } else {
// certName = '其它'
// certName = '其它'
// }
// }
vm
.
legendData
.
push
(
certList
[
j
].
name
);
vm
.
legend
Data
.
push
(
certList
[
j
].
name
);
// vm.yAxis
Data.push(certList[j].name);
// vm.yAxisData.push(certList[j].name);
}
}
}
// vm.seriesData.push({
// name: cData.eduName,
// type: "bar",
// stack: "总量",
// barWidth: 16, //柱图宽度
// data: certData
// });
}
}
// vm.seriesData.push({
this
.
handlerSeriesData
(
newVal
);
// name: cData.eduName,
vm
.
drawColumn
();
// type: "bar",
}
else
{
// stack: "总量",
this
.
isShow
=
false
;
// barWidth: 16, //柱图宽度
// data: certData
// });
}
}
this
.
handlerSeriesData
(
newVal
);
vm
.
drawColumn
();
},
},
deep
:
true
deep
:
true
}
}
...
...
components/bussiness/charts/chart-column-vertical-score.vue
浏览文件 @
368b0b32
<!-- 柱状图-竖向 -->
<!-- 柱状图-竖向 -->
<
template
>
<
template
>
<section
class=
"chart-pie"
>
<section
class=
"chart-pie"
>
<div
:id=
"id"
:style=
"
{width: chartWidth, height: chartHeight}">
</div>
<div
v-show=
"isShow"
:id=
"id"
:style=
"
{width: chartWidth, height: chartHeight}">
</div>
<NoContent
v-show=
"!isShow"
:id=
"id"
:style=
"
{width: '100%', height: '220px'}">
</NoContent>
</section>
</section>
</
template
>
</
template
>
<
script
>
<
script
>
import
{
format
}
from
"path"
;
import
{
format
}
from
"path"
;
import
NoContent
from
"@/components/bussiness/no-content"
;
let
vm
=
null
,
chartColumn
=
null
;
let
vm
=
null
,
chartColumn
=
null
;
export
default
{
export
default
{
components
:
{
NoContent
},
props
:
{
props
:
{
id
:
{
id
:
{
type
:
String
,
type
:
String
,
...
@@ -127,22 +132,27 @@ export default {
...
@@ -127,22 +132,27 @@ export default {
barWidth
:
20
//柱图宽度
barWidth
:
20
//柱图宽度
}
}
]
]
}
},
isShow
:
true
};
};
},
},
watch
:
{
watch
:
{
dataList
:
{
dataList
:
{
handler
(
newVal
)
{
handler
(
newVal
)
{
// debugger
if
(
newVal
.
length
)
{
this
.
xAxisData
=
newVal
.
map
(
item
=>
{
this
.
isShow
=
true
;
return
item
.
times
this
.
xAxisData
=
newVal
.
map
(
item
=>
{
})
return
item
.
times
this
.
seriesData
=
newVal
.
map
(
item
=>
{
})
return
item
.
count
this
.
seriesData
=
newVal
.
map
(
item
=>
{
})
return
item
.
count
this
.
options
.
xAxis
.
data
=
this
.
xAxisData
;
})
this
.
options
.
series
[
0
].
data
=
this
.
seriesData
;
this
.
options
.
xAxis
.
data
=
this
.
xAxisData
;
chartColumn
.
setOption
(
this
.
options
,
true
);
this
.
options
.
series
[
0
].
data
=
this
.
seriesData
;
chartColumn
.
setOption
(
this
.
options
,
true
);
}
else
{
this
.
isShow
=
false
;
}
},
},
deep
:
true
deep
:
true
}
}
...
...
components/bussiness/charts/chart-column-vertical-tc.vue
浏览文件 @
368b0b32
...
@@ -2,18 +2,21 @@
...
@@ -2,18 +2,21 @@
<
template
>
<
template
>
<div>
<div>
<div
class=
"chart-column-vtc"
>
<div
class=
"chart-column-vtc"
>
<div
:id=
"id"
:style=
"
{width: chartWidth, height: chartHeight}">
</div>
<div
v-show=
"isShow"
:id=
"id"
:style=
"
{width: chartWidth, height: chartHeight}">
</div>
<NoContent
v-show=
"!isShow"
:id=
"id"
:style=
"
{width: '100%', height: '220px'}">
</NoContent>
</div>
</div>
<TipsInfoChart
content=
"报告数据来源仅包含摸底考和正式考的课程培训"
></TipsInfoChart>
<TipsInfoChart
content=
"报告数据来源仅包含摸底考和正式考的课程培训"
></TipsInfoChart>
</div>
</div>
</
template
>
</
template
>
<
script
>
<
script
>
import
{
format
}
from
"path"
;
import
{
format
}
from
"path"
;
import
NoContent
from
"@/components/bussiness/no-content"
;
import
TipsInfoChart
from
"@/components/bussiness/tips-info-chart"
;
import
TipsInfoChart
from
"@/components/bussiness/tips-info-chart"
;
let
vm
=
null
,
chartColumn
=
null
;
let
vm
=
null
,
chartColumn
=
null
;
export
default
{
export
default
{
components
:
{
components
:
{
TipsInfoChart
TipsInfoChart
,
NoContent
},
},
props
:
{
props
:
{
dataList
:
{
dataList
:
{
...
@@ -37,7 +40,8 @@ export default {
...
@@ -37,7 +40,8 @@ export default {
data
()
{
data
()
{
return
{
return
{
chartWidth
:
"300px"
,
chartWidth
:
"300px"
,
chartHeight
:
"320px"
chartHeight
:
"320px"
,
isShow
:
true
,
};
};
},
},
created
()
{
created
()
{
...
@@ -53,17 +57,22 @@ export default {
...
@@ -53,17 +57,22 @@ export default {
watch
:
{
watch
:
{
dataList
:
{
dataList
:
{
handler
(
newVal
)
{
handler
(
newVal
)
{
let
yAxisData
=
[],
series0Data
=
[],
series1Data
=
[]
if
(
newVal
.
length
)
{
yAxisData
=
newVal
.
map
(
item
=>
{
this
.
isShow
=
true
;
return
this
.
shortName
(
item
.
classifyName
)
let
yAxisData
=
[],
series0Data
=
[],
series1Data
=
[]
})
yAxisData
=
newVal
.
map
(
item
=>
{
series0Data
=
this
.
dataList
.
map
(
item
=>
{
return
this
.
shortName
(
item
.
classifyName
)
return
((
item
.
beforeRate
||
0
)
*
100
).
toFixed
(
1
);
})
})
series0Data
=
this
.
dataList
.
map
(
item
=>
{
series1Data
=
this
.
dataList
.
map
(
item
=>
{
return
((
item
.
beforeRate
||
0
)
*
100
).
toFixed
(
1
);
return
((
item
.
afterRate
||
0
)
*
100
).
toFixed
(
1
);
})
})
series1Data
=
this
.
dataList
.
map
(
item
=>
{
this
.
drawColumn
(
yAxisData
.
splice
(
0
,
5
),
series0Data
.
splice
(
0
,
5
),
series1Data
.
splice
(
0
,
5
));
return
((
item
.
afterRate
||
0
)
*
100
).
toFixed
(
1
);
})
this
.
drawColumn
(
yAxisData
.
splice
(
0
,
5
),
series0Data
.
splice
(
0
,
5
),
series1Data
.
splice
(
0
,
5
));
}
else
{
this
.
isShow
=
false
;
}
},
},
deep
:
false
deep
:
false
}
}
...
...
components/bussiness/charts/chart-column-vertical-times.vue
浏览文件 @
368b0b32
<!-- 柱状图-竖向 -->
<!-- 柱状图-竖向 -->
<
template
>
<
template
>
<section
class=
"chart-pie"
>
<section
class=
"chart-pie"
>
<div
:id=
"id"
:style=
"
{width: chartWidth, height: chartHeight}">
</div>
<div
v-show=
"isShow"
:id=
"id"
:style=
"
{width: chartWidth, height: chartHeight}">
</div>
<NoContent
v-show=
"!isShow"
:id=
"id"
:style=
"
{width: '100%', height: '220px'}">
</NoContent>
</section>
</section>
</
template
>
</
template
>
<
script
>
<
script
>
import
{
format
}
from
"path"
;
import
{
format
}
from
"path"
;
import
NoContent
from
"@/components/bussiness/no-content"
;
let
vm
=
null
,
chartColumn
=
null
;
let
vm
=
null
,
chartColumn
=
null
;
export
default
{
export
default
{
components
:
{
NoContent
},
props
:
{
props
:
{
id
:
{
id
:
{
type
:
String
,
type
:
String
,
...
@@ -121,22 +126,30 @@ export default {
...
@@ -121,22 +126,30 @@ export default {
barWidth
:
20
//柱图宽度
barWidth
:
20
//柱图宽度
}
}
]
]
}
},
isShow
:
true
};
};
},
},
watch
:
{
watch
:
{
dataList
:
{
dataList
:
{
handler
(
newVal
)
{
handler
(
newVal
)
{
let
cList
=
newVal
.
slice
(
0
,
5
);
console
.
log
(
'chart-cvtimes'
,
newVal
)
this
.
xAxisData
=
cList
.
map
(
item
=>
{
if
(
newVal
.
length
)
{
return
item
.
timesStr
this
.
isShow
=
true
;
})
let
cList
=
newVal
.
slice
(
0
,
5
);
this
.
seriesData
=
cList
.
map
(
item
=>
{
this
.
xAxisData
=
cList
.
map
(
item
=>
{
return
item
.
count
return
item
.
timesStr
})
})
this
.
options
.
xAxis
.
data
=
this
.
xAxisData
;
this
.
seriesData
=
cList
.
map
(
item
=>
{
this
.
options
.
series
[
0
].
data
=
this
.
seriesData
;
return
item
.
count
chartColumn
.
setOption
(
this
.
options
,
true
);
})
this
.
options
.
xAxis
.
data
=
this
.
xAxisData
;
this
.
options
.
series
[
0
].
data
=
this
.
seriesData
;
chartColumn
.
setOption
(
this
.
options
,
true
);
}
else
{
this
.
isShow
=
false
;
}
},
},
deep
:
true
deep
:
true
}
}
...
...
components/bussiness/charts/chart-pie-edu.vue
浏览文件 @
368b0b32
<!-- 人员学历情况饼图 -->
<!-- 人员学历情况饼图 -->
<
template
>
<
template
>
<section
class=
"chart-pie-edu"
>
<section
class=
"chart-pie-edu"
>
<div
:id=
"pieId"
:style=
"
{width: chartWidth, height: '220px'}">
</div>
<div
v-show=
"isShow"
:id=
"pieId"
:style=
"
{width: chartWidth, height: '220px'}">
</div>
<NoContent
v-show=
"!isShow"
:id=
"pieId"
:style=
"
{width: '100%', height: '220px'}">
</NoContent>
</section>
</section>
</
template
>
</
template
>
<
script
>
<
script
>
import
{
format
}
from
"path"
;
import
{
format
}
from
"path"
;
import
{
echartColors
}
from
'@/utils/index'
import
{
echartColors
}
from
'@/utils/index'
import
NoContent
from
"@/components/bussiness/no-content"
;
let
vm
=
null
;
let
vm
=
null
;
export
default
{
export
default
{
name
:
"eduPie"
,
name
:
"eduPie"
,
components
:
{
NoContent
},
props
:
{
props
:
{
dataList
:
{
dataList
:
{
type
:
Array
,
type
:
Array
,
...
@@ -29,23 +34,28 @@ export default {
...
@@ -29,23 +34,28 @@ export default {
handledData
:
{},
handledData
:
{},
legendData
:
[],
legendData
:
[],
seriesData
:
{},
seriesData
:
{},
count
:
0
count
:
0
,
isShow
:
true
// 重置颜色,图标如果需要颜色,优先从用户提供的colors中依次提取,用户不提供,则根据默认的颜色进行选取
// 重置颜色,图标如果需要颜色,优先从用户提供的colors中依次提取,用户不提供,则根据默认的颜色进行选取
};
};
},
},
watch
:
{
watch
:
{
dataList
:
{
dataList
:
{
handler
(
newValue
,
oldValue
)
{
handler
(
newValue
,
oldValue
)
{
if
(
process
.
client
)
{
if
(
newValue
.
length
)
{
this
.
isShow
=
true
;
let
clientWidth
=
let
clientWidth
=
window
.
outerWidth
||
window
.
outerWidth
||
document
.
body
.
clientWidth
||
document
.
body
.
clientWidth
||
document
.
documentElement
.
clientWidth
;
document
.
documentElement
.
clientWidth
;
this
.
chartWidth
=
Math
.
ceil
(
clientWidth
*
0.90
)
+
'px'
;
this
.
chartWidth
=
Math
.
ceil
(
clientWidth
*
0.90
)
+
'px'
;
console
.
log
(
'this.chartWidth'
,
this
.
chartWidth
);
console
.
log
(
'this.chartWidth'
,
this
.
chartWidth
);
this
.
handlePieData
(
newValue
);
this
.
drawPie
();
}
else
{
this
.
isShow
=
false
;
}
}
this
.
handlePieData
(
newValue
);
this
.
drawPie
();
},
},
deep
:
true
deep
:
true
}
}
...
...
components/bussiness/charts/chart-pie-title.vue
浏览文件 @
368b0b32
<!-- 人员职称情况饼图 -->
<!-- 人员职称情况饼图 -->
<
template
>
<
template
>
<section
class=
"chart-pie"
>
<section
class=
"chart-pie"
>
<div
:id=
"pieId"
:style=
"
{width: chartWidth, height: '220px'}">
</div>
<div
v-show=
"isShow"
:id=
"pieId"
:style=
"
{width: chartWidth, height: '220px'}">
</div>
<NoContent
v-show=
"!isShow"
:id=
"pieId"
:style=
"
{width: '100%', height: '220px'}">
</NoContent>
</section>
</section>
</
template
>
</
template
>
<
script
>
<
script
>
import
{
format
}
from
"path"
;
import
{
format
}
from
"path"
;
import
{
echartColors
}
from
"@/utils/index"
;
import
{
echartColors
}
from
"@/utils/index"
;
import
NoContent
from
"@/components/bussiness/no-content"
;
let
vm
=
null
;
let
vm
=
null
;
export
default
{
export
default
{
name
:
"titlePie"
,
name
:
"titlePie"
,
components
:
{
NoContent
},
props
:
{
props
:
{
pieData
:
{
pieData
:
{
type
:
Array
,
type
:
Array
,
...
@@ -26,7 +31,7 @@ export default {
...
@@ -26,7 +31,7 @@ export default {
{
value
:
310
,
name
:
"及格证书"
},
{
value
:
310
,
name
:
"及格证书"
},
{
value
:
234
,
name
:
"未获证"
}
{
value
:
234
,
name
:
"未获证"
}
]
]
}
}
,
},
},
data
()
{
data
()
{
return
{
return
{
...
@@ -36,14 +41,16 @@ export default {
...
@@ -36,14 +41,16 @@ export default {
handledData
:
{},
handledData
:
{},
legendData
:
[],
legendData
:
[],
seriesData
:
{},
seriesData
:
{},
count
:
0
count
:
0
,
isShow
:
true
,
// 重置颜色,图标如果需要颜色,优先从用户提供的colors中依次提取,用户不提供,则根据默认的颜色进行选取
// 重置颜色,图标如果需要颜色,优先从用户提供的colors中依次提取,用户不提供,则根据默认的颜色进行选取
};
};
},
},
watch
:
{
watch
:
{
dataList
:
{
dataList
:
{
handler
(
newValue
,
oldValue
)
{
handler
(
newValue
,
oldValue
)
{
if
(
process
.
client
)
{
if
(
newValue
.
length
)
{
this
.
isShow
=
true
;
let
clientWidth
=
let
clientWidth
=
window
.
outerWidth
||
window
.
outerWidth
||
document
.
body
.
clientWidth
||
document
.
body
.
clientWidth
||
...
@@ -52,6 +59,8 @@ export default {
...
@@ -52,6 +59,8 @@ export default {
console
.
log
(
'this.chartWidth'
,
this
.
chartWidth
);
console
.
log
(
'this.chartWidth'
,
this
.
chartWidth
);
this
.
handlePieData
(
newValue
);
this
.
handlePieData
(
newValue
);
this
.
drawPie
();
this
.
drawPie
();
}
else
{
this
.
isShow
=
false
;
}
}
},
},
deep
:
true
deep
:
true
...
...
components/bussiness/charts/chart-pie.vue
浏览文件 @
368b0b32
<!-- 饼图 -->
<!-- 饼图 -->
<
template
>
<
template
>
<section
class=
"chart-pie"
>
<section
class=
"chart-pie"
>
<div
:id=
"id"
:style=
"
{width: '100%', height: '220px'}">
</div>
<div
v-show=
"isShow"
:id=
"id"
:style=
"
{width: '100%', height: '220px'}">
</div>
<NoContent
v-show=
"!isShow"
:id=
"id"
:style=
"
{width: '100%', height: '220px'}">
</NoContent>
</section>
</section>
</
template
>
</
template
>
<
script
>
<
script
>
import
{
echartColors
}
from
'@/utils/index'
import
{
echartColors
}
from
'@/utils/index'
import
NoContent
from
"@/components/bussiness/no-content"
;
let
vm
=
null
;
let
vm
=
null
;
let
chartPie
=
null
;
let
chartPie
=
null
;
...
@@ -18,6 +20,9 @@ let certNameConfig = {
...
@@ -18,6 +20,9 @@ let certNameConfig = {
'4'
:
'获不及格人数'
,
'4'
:
'获不及格人数'
,
}
}
export
default
{
export
default
{
components
:
{
NoContent
},
props
:
{
props
:
{
id
:
{
id
:
{
type
:
String
,
type
:
String
,
...
@@ -41,23 +46,29 @@ export default {
...
@@ -41,23 +46,29 @@ export default {
chartHeight
:
"1000px"
,
chartHeight
:
"1000px"
,
handledData
:
{},
handledData
:
{},
legendData
:
[],
legendData
:
[],
seriesData
:
{}
seriesData
:
{}
,
// 重置颜色,图标如果需要颜色,优先从用户提供的colors中依次提取,用户不提供,则根据默认的颜色进行选取
isShow
:
true
};
};
},
},
watch
:
{
watch
:
{
pieData
:
{
pieData
:
{
handler
(
newValue
,
oldValue
)
{
handler
(
newValue
,
oldValue
)
{
// 处理数据
// 如果有数据,则处理数据并显示图表
for
(
let
i
=
0
;
i
<
newValue
.
length
;
i
++
)
{
if
(
newValue
.
length
)
{
if
(
this
.
certFlag
==
1
&&
newValue
[
i
].
certId
!=
-
1
)
{
this
.
isShow
=
true
;
newValue
[
i
].
certName
=
'已获证人数'
for
(
let
i
=
0
;
i
<
newValue
.
length
;
i
++
)
{
}
else
{
if
(
this
.
certFlag
==
1
&&
newValue
[
i
].
certId
!=
-
1
)
{
newValue
[
i
].
certName
=
certNameConfig
[
newValue
[
i
].
certId
];
newValue
[
i
].
certName
=
'已获证人数'
}
else
{
newValue
[
i
].
certName
=
certNameConfig
[
newValue
[
i
].
certId
];
}
}
}
this
.
handlePieData
(
newValue
);
this
.
drawPie
();
}
else
{
this
.
isShow
=
false
;
}
}
this
.
handlePieData
(
newValue
);
this
.
drawPie
();
},
},
deep
:
true
deep
:
true
}
}
...
...
pages/index.vue
浏览文件 @
368b0b32
...
@@ -70,7 +70,7 @@
...
@@ -70,7 +70,7 @@
<CommonCard
:cardList=
"examCardList"
></CommonCard>
<CommonCard
:cardList=
"examCardList"
></CommonCard>
<CommonSplitLine></CommonSplitLine>
<CommonSplitLine></CommonSplitLine>
<CommonTitle
title=
"完成项目考试次数情况"
></CommonTitle>
<CommonTitle
title=
"完成项目考试次数情况"
></CommonTitle>
<ChartColumnVerticalTimes
:dataList=
"
generalExamData.examTimesList
"
id=
"chartCourseTimesId"
:colors=
"colors"
></ChartColumnVerticalTimes>
<ChartColumnVerticalTimes
:dataList=
"
(generalExamData.examTimesList || []).slice(0, 5)
"
id=
"chartCourseTimesId"
:colors=
"colors"
></ChartColumnVerticalTimes>
<ShowAll
v-show=
"generalExamData && generalExamData.examTimesList.length > 5"
@
action=
"gotoPage('/examtimes')"
class=
"mt-10"
></ShowAll>
<ShowAll
v-show=
"generalExamData && generalExamData.examTimesList.length > 5"
@
action=
"gotoPage('/examtimes')"
class=
"mt-10"
></ShowAll>
<CommonSplitLine></CommonSplitLine>
<CommonSplitLine></CommonSplitLine>
<CommonTitle
title=
"完成项目考试分数情况"
></CommonTitle>
<CommonTitle
title=
"完成项目考试分数情况"
></CommonTitle>
...
...
写
预览
Markdown
格式
0%
请重试
or
附加一个文件
附加文件
取消
您添加了
0
人
到此讨论。请谨慎行事。
先完成此消息的编辑!
取消
想要评论请
注册
或
登录