Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
T
tea-resources-web
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
张伯涛
tea-resources-web
Commits
52ec9059
Commit
52ec9059
authored
Apr 30, 2024
by
WBY1026
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
数据统计-课程部分
parent
dbc92499
Changes
6
Show whitespace changes
Inline
Side-by-side
Showing
6 changed files
with
1169 additions
and
1 deletion
+1169
-1
package.json
package.json
+1
-1
main.js
src/main.js
+2
-0
index.vue
src/views/dataStatistics/assessView/index.vue
+34
-0
index.vue
src/views/dataStatistics/classView/index.vue
+1064
-0
index.vue
src/views/dataStatistics/companyView/index.vue
+34
-0
index.vue
src/views/dataStatistics/userView/index.vue
+34
-0
No files found.
package.json
View file @
52ec9059
...
...
@@ -18,7 +18,7 @@
"
axios
"
:
"
0.18.1
"
,
"
bpmn-js
"
:
"
^6.1.1
"
,
"
bpmn-js-properties-panel
"
:
"
^0.33.1
"
,
"
echarts
"
:
"
^
5.3.2
"
,
"
echarts
"
:
"
^
4.9.0
"
,
"
element-resize-detector
"
:
"
^1.2.4
"
,
"
element-ui
"
:
"
2.13.0
"
,
"
gm-crypt
"
:
"
^0.0.2
"
,
...
...
src/main.js
View file @
52ec9059
...
...
@@ -2,6 +2,7 @@ import Vue from 'vue'
import
'normalize.css/normalize.css'
// A modern alternative to CSS resets
import
moment
from
'moment'
import
Element
from
'element-ui'
import
echarts
from
"echarts"
;
import
'./utils/rem.js'
// 自适应分辨率
// import ElementUI from 'element-ui'
// import './styles/element-variables.scss'
...
...
@@ -77,6 +78,7 @@ Vue.prototype.UIUrl = process.env.VUE_APP_UI
Vue
.
prototype
.
$ha
=
halberd
Vue
.
prototype
.
$uploadFile
=
uploadPublic
Vue
.
prototype
.
$haveAuth
=
includePermission
Vue
.
prototype
.
$echarts
=
echarts
;
// set ElementUI lang to EN
Vue
.
prototype
.
$axios
=
xhr
...
...
src/views/dataStatistics/assessView/index.vue
0 → 100644
View file @
52ec9059
<
template
>
<div
class=
"errLog-manage"
>
考核视图
</div>
</
template
>
<
script
>
import
{
getDataCache
,
setDataCache
}
from
'@/assets/js/filterData'
export
default
{
name
:
'assessView'
,
data
()
{
return
{
}
},
computed
:
{
},
/** 路由离开前存储筛选条件*/
beforeRouteLeave
(
to
,
from
,
next
)
{
setDataCache
(
this
.
$route
.
path
,
this
.
queryParams
)
next
()
},
created
()
{
},
methods
:
{
}
}
</
script
>
<
style
lang=
"scss"
scoped
></
style
>
\ No newline at end of file
src/views/dataStatistics/classView/index.vue
0 → 100644
View file @
52ec9059
<
template
>
<div
class=
"errLog-manage"
>
<!-- 上方4卡 -->
<div
class=
"upCard"
>
<div
class=
"topLeft"
>
<div
class=
"title"
>
<div
class=
"decoration"
></div>
<div
class=
"text"
>
难度列表
</div>
</div>
<div
id=
"chart1"
class=
"chart"
></div>
<div
id=
"chart2"
class=
"chart"
></div>
<div
id=
"chart3"
class=
"chart"
></div>
<div
id=
"chart4"
class=
"chart"
></div>
</div>
<div
class=
"topRight"
>
<div
class=
"title"
>
<div
class=
"decoration"
></div>
<div
class=
"text"
>
课程方案
</div>
</div>
<div
id=
"chart5"
class=
"chart"
></div>
<div
id=
"chart6"
class=
"chart"
></div>
<div
id=
"chart7"
class=
"chart"
></div>
<div
id=
"chart8"
class=
"chart"
></div>
</div>
<div
class=
"downLeft"
>
<div
class=
"title"
>
<div
class=
"decoration"
></div>
<div
class=
"text"
>
技术分布
</div>
</div>
<div
id=
"bar1"
></div>
</div>
<div
class=
"downRight"
>
<div
class=
"title"
>
<div
class=
"decoration"
></div>
<div
class=
"text"
>
岗位分布
</div>
</div>
<div
id=
"bar2"
></div>
</div>
</div>
<!-- 下方列表 -->
<div
class=
"downList"
>
<div
class=
"title"
>
<div
class=
"decoration"
></div>
<div
class=
"text"
>
统计列表
</div>
</div>
<el-table
v-loading=
"loading"
border
:data=
"list"
>
<el-table-column
type=
"index"
width=
"55"
label=
"序号"
align=
"center"
/>
<el-table-column
label=
"课程名称"
align=
"center"
prop=
"className"
/>
<el-table-column
label=
"课时数"
align=
"center"
prop=
"classHour"
width=
"130"
:show-overflow-tooltip=
"true"
/>
<el-table-column
label=
"学习总人数"
align=
"center"
prop=
"allPeople"
:show-overflow-tooltip=
"true"
/>
<el-table-column
label=
"未开始人数"
align=
"center"
prop=
"noStart"
></el-table-column>
<el-table-column
label=
"学习完成人数"
align=
"center"
prop=
"complete"
></el-table-column>
<el-table-column
label=
"参与考核人数"
align=
"center"
prop=
"participants"
></el-table-column>
</el-table>
<pagination
v-show=
"total>0"
:total=
"total"
:page
.
sync=
"queryParams.page"
:limit
.
sync=
"queryParams.rows"
@
pagination=
"getList"
/>
</div>
</div>
</
template
>
<
script
>
import
{
getDataCache
,
setDataCache
}
from
'@/assets/js/filterData'
import
{
color
}
from
'echarts'
export
default
{
name
:
'classView'
,
data
()
{
return
{
// 是否加载
loading
:
false
,
// 底部列表数据
list
:
[
{
className
:
'1'
,
classHour
:
'2'
,
allPeople
:
'3'
,
noStart
:
'4'
,
complete
:
'5'
,
participants
:
'6'
,
},
{
className
:
'1'
,
classHour
:
'2'
,
allPeople
:
'3'
,
noStart
:
'4'
,
complete
:
'5'
,
participants
:
'6'
,
},
{
className
:
'1'
,
classHour
:
'2'
,
allPeople
:
'3'
,
noStart
:
'4'
,
complete
:
'5'
,
participants
:
'6'
,
},
{
className
:
'1'
,
classHour
:
'2'
,
allPeople
:
'3'
,
noStart
:
'4'
,
complete
:
'5'
,
participants
:
'6'
,
},
{
className
:
'1'
,
classHour
:
'2'
,
allPeople
:
'3'
,
noStart
:
'4'
,
complete
:
'5'
,
participants
:
'6'
,
},
{
className
:
'1'
,
classHour
:
'2'
,
allPeople
:
'3'
,
noStart
:
'4'
,
complete
:
'5'
,
participants
:
'6'
,
},
{
className
:
'1'
,
classHour
:
'2'
,
allPeople
:
'3'
,
noStart
:
'4'
,
complete
:
'5'
,
participants
:
'6'
,
},
{
className
:
'1'
,
classHour
:
'2'
,
allPeople
:
'3'
,
noStart
:
'4'
,
complete
:
'5'
,
participants
:
'6'
,
}
],
// 查询参数
total
:
20
,
queryParams
:
{
page
:
1
,
rows
:
10
,
username
:
''
,
loginTime
:
''
},
// 饼图数据
data
:
{
data1Percent
:
100
,
data1
:
[
{
value
:
100
,
name
:
'全部课程'
},
{
value
:
0
,
name
:
'空'
},
],
data1Color
:
[
'#6495ED'
,
'#ccc'
],
data1Title
:
'全部课程'
,
data2Percent
:
50
,
data2
:
[
{
value
:
50
,
name
:
'初级课程'
},
{
value
:
50
,
name
:
'空'
},
],
data2Color
:
[
'rgba(81,211,81, 1)'
,
'#ccc'
],
data2Title
:
'初级课程'
,
data3Percent
:
30
,
data3
:
[
{
value
:
30
,
name
:
'中级课程'
},
{
value
:
70
,
name
:
'空'
},
],
data3Color
:
[
'rgba(254,192,61, 1)'
,
'#ccc'
],
data3Title
:
'中级课程'
,
data4Percent
:
20
,
data4
:
[
{
value
:
20
,
name
:
'高级课程'
},
{
value
:
80
,
name
:
'空'
},
],
data4Color
:
[
'rgba(255,122,140, 1)'
,
'#ccc'
],
data4Title
:
'高级课程'
,
//
data5Percent
:
100
,
data5
:
[
{
value
:
100
,
name
:
'全部课程'
},
{
value
:
0
,
name
:
'空'
},
],
data5Color
:
[
'#6495ED'
,
'#ccc'
],
data5Title
:
'全部课程'
,
data6Percent
:
50
,
data6
:
[
{
value
:
50
,
name
:
'行业前沿适配'
},
{
value
:
50
,
name
:
'空'
},
],
data6Color
:
[
'rgba(81,211,81, 1)'
,
'#ccc'
],
data6Title
:
'行业前沿适配'
,
data7Percent
:
30
,
data7
:
[
{
value
:
30
,
name
:
'岗位能力准入'
},
{
value
:
70
,
name
:
'空'
},
],
data7Color
:
[
'rgba(254,192,61, 1)'
,
'#ccc'
],
data7Title
:
'岗位能力准入'
,
data8Percent
:
20
,
data8
:
[
{
value
:
20
,
name
:
'通用能力培养'
},
{
value
:
80
,
name
:
'空'
},
],
data8Color
:
[
'rgba(255,122,140, 1)'
,
'#ccc'
],
data8Title
:
'通用能力培养'
,
},
pieCss
:
{
radius
:
[
'40%'
,
'50%'
],
center
:
[
'50%'
,
'46%'
],
},
// 柱图数据
barData
:
{
bar1data
:
{
x
:
[
'环境感知技术'
,
'智能决策技术'
,
'控制执行技术'
,
'系统设计技术'
,
'专用通信与网络技术'
,
'大数据云控基础平台技术'
,
'车路协同技术'
],
y
:
[
120
,
200
,
150
,
80
,
70
,
110
,
130
],
color
:
"rgba(64,158,255, 1)"
},
bar2data
:
{
x
:
[
'感知算法工程师'
,
'决策控制算法工程师'
,
'线控底盘系统工程师'
,
'系统集成架构工程师'
,
'安全算法工程师'
,
'算法测试工程师'
],
y
:
[
120
,
200
,
150
,
80
,
70
,
110
],
color
:
"rgba(25,190,107, 1)"
}
}
}
},
computed
:
{
},
/** 路由离开前存储筛选条件*/
beforeRouteLeave
(
to
,
from
,
next
)
{
setDataCache
(
this
.
$route
.
path
,
this
.
queryParams
)
next
()
},
created
()
{
},
mounted
()
{
this
.
drawChart1
()
this
.
drawChart2
()
this
.
drawChart3
()
this
.
drawChart4
()
this
.
drawChart5
()
this
.
drawChart6
()
this
.
drawChart7
()
this
.
drawChart8
()
this
.
bar1
()
this
.
bar2
()
},
methods
:
{
/** 查询登录日志列表 */
getList
()
{
// this.loading = true
// list(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
// this.list = response.rows
// this.total = response.total
// this.loading = false
// })
},
// 常用配置项需要整合提出来,不然太复杂
drawChart1
()
{
// 基于准备好的dom,初始化echarts实例 这个和上面的main对应
let
myChart
=
this
.
$echarts
.
init
(
document
.
getElementById
(
"chart1"
));
// 指定图表的配置项和数据
let
option
=
{
legend
:
{
show
:
false
,
top
:
'center'
,
left
:
'center'
},
color
:
this
.
data
.
data1Color
,
series
:
[
{
name
:
'Access From'
,
type
:
'pie'
,
radius
:
this
.
pieCss
.
radius
,
avoidLabelOverlap
:
false
,
center
:
this
.
pieCss
.
center
,
labelLine
:
{
show
:
false
},
data
:
this
.
data
.
data1
,
label
:
{
show
:
false
},
hoverAnimation
:
false
}
],
graphic
:
{
// 添加原生图形元素组件
elements
:
[{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'42%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data1Percent
,
//文字
fontSize
:
26
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'darkgray'
// 字体颜色
}
},
{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'80%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data1Title
,
//文字
fontSize
:
16
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'black'
// 字体颜色
}
}]
}
};
// 使用刚指定的配置项和数据显示图表。
myChart
.
setOption
(
option
);
},
drawChart2
()
{
// 基于准备好的dom,初始化echarts实例 这个和上面的main对应
let
myChart
=
this
.
$echarts
.
init
(
document
.
getElementById
(
"chart2"
));
// 指定图表的配置项和数据
let
option
=
{
legend
:
{
show
:
false
,
top
:
'center'
,
left
:
'center'
},
color
:
this
.
data
.
data2Color
,
series
:
[
{
name
:
'Access From'
,
type
:
'pie'
,
radius
:
this
.
pieCss
.
radius
,
avoidLabelOverlap
:
false
,
center
:
this
.
pieCss
.
center
,
labelLine
:
{
show
:
false
},
data
:
this
.
data
.
data2
,
label
:
{
show
:
false
},
hoverAnimation
:
false
}
],
graphic
:
{
// 添加原生图形元素组件
elements
:
[{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'42%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data2Percent
,
//文字
fontSize
:
26
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'darkgray'
// 字体颜色
}
},
{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'80%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data2Title
,
//文字
fontSize
:
16
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'black'
// 字体颜色
}
}]
}
};
// 使用刚指定的配置项和数据显示图表。
myChart
.
setOption
(
option
);
},
drawChart3
()
{
// 基于准备好的dom,初始化echarts实例 这个和上面的main对应
let
myChart
=
this
.
$echarts
.
init
(
document
.
getElementById
(
"chart3"
));
// 指定图表的配置项和数据
let
option
=
{
legend
:
{
show
:
false
,
top
:
'center'
,
left
:
'center'
},
color
:
this
.
data
.
data3Color
,
series
:
[
{
name
:
'Access From'
,
type
:
'pie'
,
radius
:
this
.
pieCss
.
radius
,
avoidLabelOverlap
:
false
,
center
:
this
.
pieCss
.
center
,
labelLine
:
{
show
:
false
},
data
:
this
.
data
.
data3
,
label
:
{
show
:
false
},
hoverAnimation
:
false
}
],
graphic
:
{
// 添加原生图形元素组件
elements
:
[{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'42%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data3Percent
,
//文字
fontSize
:
26
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'darkgray'
// 字体颜色
}
},
{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'80%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data3Title
,
//文字
fontSize
:
16
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'black'
// 字体颜色
}
}]
}
};
// 使用刚指定的配置项和数据显示图表。
myChart
.
setOption
(
option
);
},
drawChart4
()
{
// 基于准备好的dom,初始化echarts实例 这个和上面的main对应
let
myChart
=
this
.
$echarts
.
init
(
document
.
getElementById
(
"chart4"
));
// 指定图表的配置项和数据
let
option
=
{
legend
:
{
show
:
false
,
top
:
'center'
,
left
:
'center'
},
color
:
this
.
data
.
data4Color
,
series
:
[
{
name
:
'Access From'
,
type
:
'pie'
,
radius
:
this
.
pieCss
.
radius
,
avoidLabelOverlap
:
false
,
center
:
this
.
pieCss
.
center
,
labelLine
:
{
show
:
false
},
data
:
this
.
data
.
data4
,
label
:
{
show
:
false
},
hoverAnimation
:
false
}
],
graphic
:
{
// 添加原生图形元素组件
elements
:
[{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'42%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data4Percent
,
//文字
fontSize
:
26
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'darkgray'
// 字体颜色
}
},
{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'80%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data4Title
,
//文字
fontSize
:
16
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'black'
// 字体颜色
}
}]
}
};
// 使用刚指定的配置项和数据显示图表。
myChart
.
setOption
(
option
);
},
drawChart5
()
{
// 基于准备好的dom,初始化echarts实例 这个和上面的main对应
let
myChart
=
this
.
$echarts
.
init
(
document
.
getElementById
(
"chart5"
));
// 指定图表的配置项和数据
let
option
=
{
legend
:
{
show
:
false
,
top
:
'center'
,
left
:
'center'
},
color
:
this
.
data
.
data5Color
,
series
:
[
{
name
:
'Access From'
,
type
:
'pie'
,
radius
:
this
.
pieCss
.
radius
,
avoidLabelOverlap
:
false
,
center
:
this
.
pieCss
.
center
,
labelLine
:
{
show
:
false
},
data
:
this
.
data
.
data5
,
label
:
{
show
:
false
},
hoverAnimation
:
false
}
],
graphic
:
{
// 添加原生图形元素组件
elements
:
[{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'42%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data5Percent
,
//文字
fontSize
:
26
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'darkgray'
// 字体颜色
}
},
{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'80%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data5Title
,
//文字
fontSize
:
16
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'black'
// 字体颜色
}
}]
}
};
// 使用刚指定的配置项和数据显示图表。
myChart
.
setOption
(
option
);
},
drawChart6
()
{
// 基于准备好的dom,初始化echarts实例 这个和上面的main对应
let
myChart
=
this
.
$echarts
.
init
(
document
.
getElementById
(
"chart6"
));
// 指定图表的配置项和数据
let
option
=
{
legend
:
{
show
:
false
,
top
:
'center'
,
left
:
'center'
},
color
:
this
.
data
.
data6Color
,
series
:
[
{
name
:
'Access From'
,
type
:
'pie'
,
radius
:
this
.
pieCss
.
radius
,
avoidLabelOverlap
:
false
,
center
:
this
.
pieCss
.
center
,
labelLine
:
{
show
:
false
},
data
:
this
.
data
.
data6
,
label
:
{
show
:
false
},
hoverAnimation
:
false
}
],
graphic
:
{
// 添加原生图形元素组件
elements
:
[{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'42%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data6Percent
,
//文字
fontSize
:
26
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'darkgray'
// 字体颜色
}
},
{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'80%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data6Title
,
//文字
fontSize
:
16
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'black'
// 字体颜色
}
}]
}
};
// 使用刚指定的配置项和数据显示图表。
myChart
.
setOption
(
option
);
},
drawChart7
()
{
// 基于准备好的dom,初始化echarts实例 这个和上面的main对应
let
myChart
=
this
.
$echarts
.
init
(
document
.
getElementById
(
"chart7"
));
// 指定图表的配置项和数据
let
option
=
{
legend
:
{
show
:
false
,
top
:
'center'
,
left
:
'center'
},
color
:
this
.
data
.
data7Color
,
series
:
[
{
name
:
'Access From'
,
type
:
'pie'
,
radius
:
this
.
pieCss
.
radius
,
avoidLabelOverlap
:
false
,
center
:
this
.
pieCss
.
center
,
labelLine
:
{
show
:
false
},
data
:
this
.
data
.
data7
,
label
:
{
show
:
false
},
hoverAnimation
:
false
}
],
graphic
:
{
// 添加原生图形元素组件
elements
:
[{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'42%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data7Percent
,
//文字
fontSize
:
26
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'darkgray'
// 字体颜色
}
},
{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'80%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data7Title
,
//文字
fontSize
:
16
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'black'
// 字体颜色
}
}]
}
};
// 使用刚指定的配置项和数据显示图表。
myChart
.
setOption
(
option
);
},
drawChart8
()
{
// 基于准备好的dom,初始化echarts实例 这个和上面的main对应
let
myChart
=
this
.
$echarts
.
init
(
document
.
getElementById
(
"chart8"
));
// 指定图表的配置项和数据
let
option
=
{
legend
:
{
show
:
false
,
top
:
'center'
,
left
:
'center'
},
color
:
this
.
data
.
data8Color
,
series
:
[
{
name
:
'Access From'
,
type
:
'pie'
,
radius
:
this
.
pieCss
.
radius
,
avoidLabelOverlap
:
false
,
center
:
this
.
pieCss
.
center
,
labelLine
:
{
show
:
false
},
data
:
this
.
data
.
data8
,
label
:
{
show
:
false
},
hoverAnimation
:
false
}
],
graphic
:
{
// 添加原生图形元素组件
elements
:
[{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'42%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data8Percent
,
//文字
fontSize
:
26
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'darkgray'
// 字体颜色
}
},
{
type
:
'text'
,
// 组件类型
left
:
'center'
,
//定位
top
:
'80%'
,
// 定位
style
:
{
// 样式
text
:
this
.
data
.
data8Title
,
//文字
fontSize
:
16
,
//文字大小
textAlign
:
'center'
,
//定位
width
:
50
,
height
:
50
,
fill
:
'black'
// 字体颜色
}
}]
}
};
// 使用刚指定的配置项和数据显示图表。
myChart
.
setOption
(
option
);
},
bar1
()
{
let
myChart
=
this
.
$echarts
.
init
(
document
.
getElementById
(
"bar1"
));
var
option
=
{
xAxis
:
{
type
:
'category'
,
data
:
this
.
barData
.
bar1data
.
x
,
axisLabel
:
{
//x轴文字的配置
show
:
true
,
interval
:
0
,
//使x轴文字显示全
textStyle
:
{
color
:
"rgba(153,153,179, 1)"
},
formatter
:
function
(
params
)
{
var
newParamsName
=
""
;
var
paramsNameNumber
=
params
.
length
;
var
provideNumber
=
5
;
//一行显示几个字
var
rowNumber
=
Math
.
ceil
(
paramsNameNumber
/
provideNumber
);
if
(
paramsNameNumber
>
provideNumber
)
{
for
(
var
p
=
0
;
p
<
rowNumber
;
p
++
)
{
var
tempStr
=
""
;
var
start
=
p
*
provideNumber
;
var
end
=
start
+
provideNumber
;
if
(
p
==
rowNumber
-
1
)
{
tempStr
=
params
.
substring
(
start
,
paramsNameNumber
);
}
else
{
tempStr
=
params
.
substring
(
start
,
end
)
+
"
\n
"
;
}
newParamsName
+=
tempStr
;
}
}
else
{
newParamsName
=
params
;
}
return
newParamsName
;
}
}
},
yAxis
:
{
type
:
'value'
},
itemStyle
:
{
color
:
this
.
barData
.
bar1data
.
color
,
barBorderRadius
:
[
5
,
5
,
0
,
0
],
},
series
:
[
{
data
:
this
.
barData
.
bar1data
.
y
,
type
:
'bar'
,
barWidth
:
'20px'
}
]
};
myChart
.
setOption
(
option
);
},
bar2
()
{
let
myChart
=
this
.
$echarts
.
init
(
document
.
getElementById
(
"bar2"
));
var
option
=
{
xAxis
:
{
type
:
'category'
,
data
:
this
.
barData
.
bar2data
.
x
,
axisLabel
:
{
//x轴文字的配置
show
:
true
,
interval
:
0
,
//使x轴文字显示全
textStyle
:
{
color
:
"rgba(153,153,179, 1)"
},
formatter
:
function
(
params
)
{
var
newParamsName
=
""
;
var
paramsNameNumber
=
params
.
length
;
var
provideNumber
=
5
;
//一行显示几个字
var
rowNumber
=
Math
.
ceil
(
paramsNameNumber
/
provideNumber
);
if
(
paramsNameNumber
>
provideNumber
)
{
for
(
var
p
=
0
;
p
<
rowNumber
;
p
++
)
{
var
tempStr
=
""
;
var
start
=
p
*
provideNumber
;
var
end
=
start
+
provideNumber
;
if
(
p
==
rowNumber
-
1
)
{
tempStr
=
params
.
substring
(
start
,
paramsNameNumber
);
}
else
{
tempStr
=
params
.
substring
(
start
,
end
)
+
"
\n
"
;
}
newParamsName
+=
tempStr
;
}
}
else
{
newParamsName
=
params
;
}
return
newParamsName
;
}
}
},
yAxis
:
{
type
:
'value'
},
itemStyle
:
{
color
:
this
.
barData
.
bar2data
.
color
,
barBorderRadius
:
[
5
,
5
,
0
,
0
],
},
series
:
[
{
data
:
this
.
barData
.
bar2data
.
y
,
type
:
'bar'
,
barWidth
:
'20px'
}
]
};
myChart
.
setOption
(
option
);
},
}
}
</
script
>
<
style
lang=
"scss"
scoped
>
.upCard
{
width
:
100%
;
height
:
500px
;
// background-color: antiquewhite;
.topLeft
{
position
:
relative
;
float
:
left
;
margin-left
:
1%
;
margin-top
:
5px
;
width
:
48%
;
height
:
240px
;
// border: 1px solid black;
border-radius
:
4px
;
box-shadow
:
0
0
5px
rgba
(
63
,
63
,
63
,
0
.4
);
.title
{
position
:
absolute
;
left
:
20px
;
top
:
20px
;
.decoration
{
float
:
left
;
margin-top
:
6px
;
width
:
8px
;
height
:
16px
;
background-color
:
rgba
(
64
,
158
,
255
,
1
);
}
.text
{
float
:
left
;
margin-left
:
5px
;
margin-top
:
5px
;
font-size
:
16px
;
}
}
.chart
{
float
:
left
;
width
:
25%
;
height
:
100%
;
// background-color: aqua;
}
}
.topRight
{
position
:
relative
;
float
:
left
;
margin-left
:
2%
;
margin-top
:
5px
;
width
:
48%
;
height
:
240px
;
border-radius
:
4px
;
box-shadow
:
0
0
5px
rgba
(
63
,
63
,
63
,
0
.4
);
.title
{
position
:
absolute
;
left
:
20px
;
top
:
20px
;
.decoration
{
float
:
left
;
margin-top
:
6px
;
width
:
8px
;
height
:
16px
;
background-color
:
rgba
(
64
,
158
,
255
,
1
);
}
.text
{
float
:
left
;
margin-left
:
5px
;
margin-top
:
5px
;
font-size
:
16px
;
}
}
.chart
{
float
:
left
;
width
:
25%
;
height
:
100%
;
// background-color: aqua;
}
}
.downLeft
{
position
:
relative
;
float
:
left
;
margin-left
:
1%
;
margin-top
:
10px
;
width
:
48%
;
height
:
240px
;
border-radius
:
4px
;
box-shadow
:
0
0
5px
rgba
(
63
,
63
,
63
,
0
.4
);
.title
{
position
:
absolute
;
left
:
20px
;
top
:
10px
;
.decoration
{
float
:
left
;
margin-top
:
6px
;
width
:
8px
;
height
:
16px
;
background-color
:
rgba
(
64
,
158
,
255
,
1
);
}
.text
{
float
:
left
;
margin-left
:
5px
;
margin-top
:
5px
;
font-size
:
16px
;
}
}
#bar1
{
float
:
left
;
width
:
100%
;
height
:
100%
;
}
}
.downRight
{
position
:
relative
;
float
:
left
;
margin-left
:
2%
;
margin-top
:
10px
;
width
:
48%
;
height
:
240px
;
border-radius
:
4px
;
box-shadow
:
0
0
5px
rgba
(
63
,
63
,
63
,
0
.4
);
.title
{
position
:
absolute
;
left
:
20px
;
top
:
10px
;
.decoration
{
float
:
left
;
margin-top
:
6px
;
width
:
8px
;
height
:
16px
;
background-color
:
rgba
(
64
,
158
,
255
,
1
);
}
.text
{
float
:
left
;
margin-left
:
5px
;
margin-top
:
5px
;
font-size
:
16px
;
}
}
#bar2
{
float
:
left
;
width
:
100%
;
height
:
100%
;
}
}
}
.downList
{
margin-left
:
2%
;
width
:
96%
;
.title
{
position
:
relative
;
padding
:
10px
;
height
:
50px
;
.decoration
{
float
:
left
;
margin-top
:
6px
;
width
:
8px
;
height
:
16px
;
background-color
:
rgba
(
64
,
158
,
255
,
1
);
}
.text
{
float
:
left
;
margin-left
:
5px
;
margin-top
:
5px
;
font-size
:
16px
;
}
}
}
</
style
>
\ No newline at end of file
src/views/dataStatistics/companyView/index.vue
0 → 100644
View file @
52ec9059
<
template
>
<div
class=
"errLog-manage"
>
单位视图
</div>
</
template
>
<
script
>
import
{
getDataCache
,
setDataCache
}
from
'@/assets/js/filterData'
export
default
{
name
:
'companyView'
,
data
()
{
return
{
}
},
computed
:
{
},
/** 路由离开前存储筛选条件*/
beforeRouteLeave
(
to
,
from
,
next
)
{
setDataCache
(
this
.
$route
.
path
,
this
.
queryParams
)
next
()
},
created
()
{
},
methods
:
{
}
}
</
script
>
<
style
lang=
"scss"
scoped
></
style
>
\ No newline at end of file
src/views/dataStatistics/userView/index.vue
0 → 100644
View file @
52ec9059
<
template
>
<div
class=
"errLog-manage"
>
用户视图
</div>
</
template
>
<
script
>
import
{
getDataCache
,
setDataCache
}
from
'@/assets/js/filterData'
export
default
{
name
:
'userView'
,
data
()
{
return
{
}
},
computed
:
{
},
/** 路由离开前存储筛选条件*/
beforeRouteLeave
(
to
,
from
,
next
)
{
setDataCache
(
this
.
$route
.
path
,
this
.
queryParams
)
next
()
},
created
()
{
},
methods
:
{
}
}
</
script
>
<
style
lang=
"scss"
scoped
></
style
>
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment