gfwleak/nezha-nezha-fronted
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'nz-release1.2' into 'codeCheck'

Browse Source 
Nz release1.2

See merge request nezha/nezha-fronted!2
This commit is contained in:
王文睿
2020-03-17 20:13:28 +08:00
parent 7ab9e62d8e 9e3c49348b
commit ff9d9d7e29
12 changed files with 409 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
nezha-fronted/src/assets/css/font/iconfont.svg
View File

@@ -20,6 +20,12 @@ Created by iconfont
/>
<missing-glyph />
<glyph glyph-name="maxview" unicode="&#59270;" d="M64 730.3679999999999L64 480C64 462.336 78.336 448 96 448S128 462.336 128 480L128 660.672l203.456-203.52c11.968-11.968 31.36-11.968 43.392 0 11.968 12.032 11.968 31.424 0 43.392L171.328 704 352 704C369.664 704 384 718.336 384 736S369.664 768 352 768L101.632 768C78.272 768 64 755.968 64 730.3679999999999zM860.352 768L609.984 768c-17.664 0-32-14.336-32-32S592.32 704 609.984 704l180.672 0-203.52-203.456c-11.968-11.968-11.968-31.36 0-43.392 12.032-11.968 31.424-11.968 43.392 0l203.456 203.52L833.984 480c0-17.664 14.336-32 32-32s32 14.336 32 32L897.984 730.3679999999999C897.984 755.968 883.776 768 860.352 768zM101.632-64L352-64C369.664-64 384-49.66399999999999 384-32S369.664 0 352 0L171.328 0l203.52 203.456c11.968 11.968 11.968 31.36 0 43.392-12.032 11.968-31.424 11.968-43.392 0L128 43.327999999999975 128 224C128 241.664 113.664 256 96 256S64 241.664 64 224l0-250.368C64-51.96799999999996 78.272-64 101.632-64zM897.984-26.368000000000052L897.984 224c0 17.664-14.336 32-32 32s-32-14.336-32-32l0-180.672-203.456 203.52c-11.968 11.968-31.36 11.968-43.392 0-11.968-12.032-11.968-31.424 0-43.392L790.656 0 609.984 0c-17.664 0-32-14.336-32-32s14.336-32 32-32l250.368 0C883.776-64 897.984-51.96799999999996 897.984-26.368000000000052z" horiz-adv-x="1024" />
<glyph glyph-name="upload-download" unicode="&#58967;" d="M896.17 736h-768a64.19 64.19 0 0 1-64-64v-512a64.19 64.19 0 0 1 64-64h192v-64h384v64h192a64.19 64.19 0 0 1 64 64V672a64.19 64.19 0 0 1-64 64z m0-576h-768V672h768zM416.17 256h64V544h-32l-32-32-64-64h64v-192zM608.17 288l64 64h-64V544h-64v-288h32l32 32z" horiz-adv-x="1024" />
<glyph glyph-name="top" unicode="&#59006;" d="M792.748 296.597l-257.312 259.001c-5.7 5.73-13.683 8.998-23.437 8.998s-16.541-3.881-21.63-8.971l-261.758-260.585c-11.205-11.174-11.231-29.313-0.031-40.513 13.731-13.731 34.927-5.614 40.544-0.056l214.226 213.168v-372.648c0-15.844 12.835-28.653 28.649-28.653 15.817 0 28.653 12.813 28.653 28.653v374.053l211.469-212.845c5.587-5.617 12.981-8.453 20.311-8.453 7.337 0 14.615 2.784 20.202 8.338 11.257 11.148 11.288 29.313 0.113 40.514v0 0zM827.161 644.365h-630.316c-15.817 0-28.653 12.835-28.653 28.645 0 15.818 12.835 28.653 28.653 28.653h630.316c15.84 0 28.645-12.835 28.645-28.653 0-15.81-12.805-28.645-28.645-28.645v0 0zM827.161 644.365z" horiz-adv-x="1024" />
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 32 KiB

After

Width:  |  Height:  |  Size: 33 KiB

20
nezha-fronted/src/assets/css/nzIcon.css
View File

File diff suppressed because one or more lines are too long

7
nezha-fronted/src/components/common/header.vue
View File

@@ -32,14 +32,17 @@
</el-menu-item>
<el-submenu index="1" popper-class="nz-submenu">
<template slot="title">
<div @click="jumpTo('panel')" :class ="(activeIndex == 'panel' || activeIndex == 'metricPreview') ? 'menu-active' :'' " >
<div @click="jumpTo('overview')" :class ="(activeIndex == 'overview' ||activeIndex == 'panel' || activeIndex == 'metricPreview') ? 'menu-active' :'' " >
{{$t('overall.dashboard')}}
</div>
</template>
<el-menu-item index="1-0">
<div @click="jumpTo('panel')" :class="{'menu-item-active' :activeIndex == 'panel'}" >{{$t('dashboard.panel.title')}}</div>
<div @click="jumpTo('overview')" :class="{'menu-item-active' :activeIndex == 'overview'}" >{{$t('dashboard.overview.title')}}</div>
</el-menu-item>
<el-menu-item index="1-1">
<div @click="jumpTo('panel')" :class="{'menu-item-active' :activeIndex == 'panel'}" >{{$t('dashboard.panel.title')}}</div>
</el-menu-item>
<el-menu-item index="1-2">
<div @click="jumpTo('metricPreview')" :class="{'menu-item-active' :activeIndex == 'metricPreview'}">{{$t('dashboard.metricPreview.title')}}</div>
</el-menu-item>
</el-submenu>

6
nezha-fronted/src/components/common/language/en.js
View File

@@ -178,7 +178,11 @@ const en = {
refresh:'Refresh',//'刷新'
edit:'Edit',//'编辑'
delete:'Delete',//'删除'
screen:'Full screen'//'全屏'
screen:'Full screen',//'全屏',
overview:{
title:'Overview',
contentTitle:'Nezha Management System',
}
},
validate: { //校验规则
required: 'Required',//'必填项'

1
nezha-fronted/src/components/common/pagination.vue
View File

@@ -87,7 +87,6 @@ export default {
this.resetPageSizes();
}else{
let pageSize = localStorage.getItem('nz-pageSize-' + localStorage.getItem('nz-username') + '-' + this.tableId);
console.log(typeof pageSize)
if(pageSize != 'undefined' && pageSize != null){
this.pageSize=parseInt(pageSize);
}

1
nezha-fronted/src/components/page/dashboard/metricPreview.vue
View File

@@ -6,6 +6,7 @@
<div class="content-left">
<div class="sidebar-title">{{$t('dashboard.title')}}</div>
<div class="sidebar-info">
<div class="sidebar-info-item " @click="jumpTo('overview')">{{$t('dashboard.overview.title')}}</div>
<div class="sidebar-info-item sidebar-info-top" @click="jumpTo('panel')">{{$t('dashboard.panel.title')}}</div>
<div class="sidebar-info-item sidebar-info-item-active">{{$t('dashboard.metricPreview.title')}}</div>
</div>

43
nezha-fronted/src/components/page/dashboard/overview/chart.vue Normal file
View File

@@ -0,0 +1,43 @@
<template>
<div class="chart-room">
<loading :ref="localLoading"></loading>
<div class="chart-header"></div>
<div class="chart-body" ref="chartBody" id="chartBody"></div>
<div class="chart-foot">
<el-scrollbar>
<div class="chart-legend"></div>
</el-scrollbar>
</div>
</div>
</template>
<script>
import echarts from 'echarts';
import chartDataFormat from "../../../charts/chartDataFormat";
import loading from "../../../common/loading";
import chartConfig from './chartConfig'
export default {
name: "chart",
props:[],
data(){
return {
option:chartConfig.getCommonOption
}
},
created() {
},
methods:{
},
watch:{
}
}
</script>
<style scoped>
</style>

82
nezha-fronted/src/components/page/dashboard/overview/chartConfig.vue Normal file
View File

@@ -0,0 +1,82 @@
<script>
import chartDataFormat from "../../../charts/chartDataFormat";
const commonOption={
title:{
show:false,
},
color: this.bgColorList,
tooltip: {
trigger: 'axis',
confine:false,
extraCssText:'z-index:1000;',
// formatter:null,
// position:null,
},
grid: {
top: 13,
left: 0,
right: 30,
containLabel: true,
bottom:35,//156
},
dataZoom: [{
type: 'slider',
show:true,
xAxisIndex: [0],
start: 0,
end: 100,
height:25,
bottom:10,//96
left:40,
right:48,
}],
xAxis: {
type: 'time',
// boundaryGap: false,//line-false; bar-true;
axisLabel: {
intervale: 0,
rotate: 0,
formatter: function (value) {
var t_date = new Date(value);
return [t_date.getFullYear(), t_date.getMonth() + 1, t_date.getDate()].join('-') + "\n"
+ [t_date.getHours(), t_date.getMinutes()].join(':');
}
},
axisPointer: {//y轴上显示指针对应的值
show: true,
},
splitLine:{
show:false
}
},
yAxis: {
type: 'value',
splitLine:{
show:true
},
axisLabel: {
// formatter:null,
},
},
useUTC: false,//使用本地时间
series: [],
}
export default {
getCommonOption:function(){
return commonOption;
},
setTooltipPostion:function(positionFunc){
commonOption.tooltip.position=positionFunc;
},
setTooltipFormatter:function(formatFunc){
commonOption.tooltip.formatter=formatFunc;
},
setYAxisLabelFormatter:function(formatFunc){
commonOption.yAxis.axisLabel.formatter=formatFunc;
},
setSeries:function(series){
commonOption.series=series;
}
}
</script>

80
nezha-fronted/src/components/page/dashboard/overview/overview.scss Normal file
View File

@@ -0,0 +1,80 @@
.overview{
height: 100%;
}
.overview-content-header{
display: flex;
padding-top: 10px;
}
.overview-content-header .header-title{
flex:13;
height: 35px;
line-height: 35px;
font-size: 24px !important;
font-weight: 700;
margin-left: 15px;
}
.overview-content-header .header-tool{
flex: 2;
height: 35px;
}
.header-tool .tool-container{
display: flex;
text-align: center;
}
.tool-container .time{
flex: 4;
font-size: 24px !important;
font-weight: 700;
display: inline-block;
height: 35px;
line-height: 35px;
vertical-align: middle;
}
.tool-container .date{
flex: 4;
height: 35px;
}
.date .week{
font-size: 18px;
font-weight: bold;
}
.date .sys-date{
padding-top: 5px;
font-size: 12px;
}
.tool-container .operation{
flex: 2;
display: inline-block;
line-height: 35px;
}
.operation .nz-icon-maxview{
font-size: 30px !important;
}
.overview-content{
height: 100%;
width: 100%;
}
/*100份*/
.overview-content .content-row-box{
margin: 15px 15px 15px 15px;
width: 99%;
}
.content-row-box .content-col-box{
border: 1px solid lightgrey;
padding: 15px;
display: inline-block;
}
.box-height-250{
height: 250px;
}
.box-height-350{
height: 350px;
}
.box-height-400{
height: 400px;
}
.box-height-500{
height: 500px;
}

137
nezha-fronted/src/components/page/dashboard/overview/overview.vue Normal file
View File

@@ -0,0 +1,137 @@
<template>
<div class="overview">
<!--左侧菜单栏-->
<div class="overview-left content-left">
<div class="sidebar-title">{{$t('dashboard.title')}}</div>
<div class="sidebar-info">
<div class="sidebar-info-item sidebar-info-item-active" >{{$t('dashboard.overview.title')}}</div>
<div class="sidebar-info-item sidebar-info-top " @click="jumpTo('panel')">{{$t('dashboard.panel.title')}}</div>
<div class="sidebar-info-item" @click="jumpTo('metricPreview')">{{$t('dashboard.metricPreview.title')}}</div>
</div>
</div>
<!--右侧内容-->
<div class="overview-right content-right">
<!--标题-->
<div class="overview-content-header">
<div class="header-title">{{$t('dashboard.overview.contentTitle')}}</div>
<div class="header-tool">
<div class="tool-container">
<div class="time">{{sysTime}}</div>
<div class="date">
<div class="week">{{sysWeek}}</div>
<div class="sys-date">{{sysDate}}</div>
</div>
<div class="operation"><span ><i class="nz-icon nz-icon-maxview"></i></span></div>
</div>
</div>
</div>
<!--内容-->
<div class="overview-content">
<el-scrollbar>
<div class="content-row-box">
<div class="content-col-box box-height-250 " style="width: 45%"></div>
<div class="content-col-box box-height-250 " style="width: 25%"></div>
<div class="content-col-box box-height-250 " style="width: 23%"></div>
</div>
<div class="content-row-box">
<div class="content-col-box box-height-350 " style="width: 45%"></div>
<div class="content-col-box box-height-350 "style="width: 50.2%"></div>
</div>
<div class="content-row-box">
<div class="content-col-box box-height-400 "style="width: 25%"></div>
<div class="content-col-box box-height-400 "style="width: 48%"></div>
<div class="content-col-box box-height-400 "style="width: 20%"></div>
</div>
</el-scrollbar>
</div>
</div>
</div>
</template>
<script>
export default {
name: "overview",
props:[],
data(){
return {
sysTime:'',
sysDate:'',
sysWeek:'',
}
},
created() {
},
methods:{
/*header 时间处理 start*/
initDate:function(){
this.sysTime=this.getTime();
this.sysDate=this.getDate();
this.sysWeek=this.getWeek();
this.freshTime();
},
freshTime:function(){
let $temp=this;
setInterval(function(){
$temp.sysTime=$temp.getTime()
$temp.sysDate=$temp.getDate();
$temp.sysWeek=$temp.getWeek();
},1000)
},
getTime:function(){
let date=new Date();
let hours=date.getHours()>9?date.getHours():'0'+date.getHours();
let minutes=date.getMinutes()>9?date.getMinutes():'0'+date.getMinutes();
let seconds=date.getSeconds()>9?date.getSeconds():'0'+date.getSeconds();
return hours+':'+minutes+':'+seconds;
},
getDate:function(){
let date=new Date();
let years=date.getFullYear();
let months=date.getMonth()+1>9?date.getMonth()+1:'0'+(date.getMonth()+1);
let days=date.getDate()>9?date.getDate():'0'+date.getDate();
return years+'-'+months+'-'+days;
},
getWeek:function(){
let language=localStorage.getItem("nz-language") ? localStorage.getItem("nz-language") : 'en';
let enWeeks=['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'];
let cnWeeks=['星期日','星期一','星期二','星期三','星期四','星期五','星期六'];
let date=new Date();
let day=date.getDay();
if(language == 'en'){
return enWeeks[day];
}else if(language == 'cn'){
return cnWeeks[day];
}else{
return enWeeks[day];
}
},
/*header 时间处理end*/
jumpTo(data, id) {
//this.$store.state.assetData.moduleData = data
//this.$store.state.assetData.selectedData = id
this.$router.push({
path: "/" + data,
query: {
t: +new Date()
}
});
},
},
computed:{
},
mounted() {
this.initDate();
}
}
</script>
<style scoped>
@import "overview.scss";
</style>
<style>
.overview .el-scrollbar__wrap{
margin-bottom: 0px !important;
}
</style>

1
nezha-fronted/src/components/page/dashboard/panel.vue
View File

@@ -3,6 +3,7 @@
<div class="content-left">
<div class="sidebar-title">{{$t('dashboard.title')}}</div>
<div class="sidebar-info">
<div class="sidebar-info-item " @click="jumpTo('overview')">{{$t('dashboard.overview.title')}}</div>
<div class="sidebar-info-item sidebar-info-top sidebar-info-item-active">{{$t('dashboard.panel.title')}}</div>
<div class="sidebar-info-item" @click="jumpTo('metricPreview')">{{$t('dashboard.metricPreview.title')}}</div>
</div>

4
nezha-fronted/src/router/index.js
View File

@@ -40,6 +40,10 @@ export default new Router({
path: '/metricPreview',
component: resolve => require(['../components/page/dashboard/metricPreview.vue'], resolve),
},
{
path: 'overview',
component: resolve => require(['../components/page/dashboard/overview/overview.vue'],resolve)
},
{
path: '/project',
component: resolve => require(['../components/page/project/project.vue'], resolve),