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

fix：修改全屏时间回显不正确 以及 修改 chart比较 因为前后数量不同导致的bug

Browse Source
This commit is contained in:
zhangyu
2021-03-31 11:10:04 +08:00
parent 21a31be44f
commit 7203d5bb3f
15 changed files with 1767 additions and 1757 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
nezha-fronted/src/components/charts/chart-pie.vue
View File

@@ -149,6 +149,7 @@ export default {
echart: null,
echartScreen: null,
bgColorList: [],
stableFilter: {},
option: {
title: {
show: false
@@ -296,7 +297,7 @@ export default {
this.searchTime = []
this.$set(this.searchTime, 0, this.oldSearchTime[0])
this.$set(this.searchTime, 1, this.oldSearchTime[1])
// this.$refs.calendarPanel.setCustomTime(this.searchTime);
this.$refs.pickTime.$refs.timePicker.setCustomTime(this.stableFilter)
this.screenModal = true
},
resize (chartItem) {
@@ -304,6 +305,9 @@ export default {
},
// 设置数据, filter区分
setData (chartItem, seriesItem, panelId, filter, legend, area, errorMsg) {
if (filter) {
this.stableFilter = filter
}
if (errorMsg && errorMsg !== '') {
this.isError = true
this.errorContent = errorMsg

6
nezha-fronted/src/components/charts/chart-single-stat.vue
View File

@@ -123,6 +123,7 @@ export default {
start_time: '',
end_time: ''
},
stableFilter: {},
firstShow: false, // 默认不显示操作按钮,
caretShow: false,
dragTitleShow: false,
@@ -387,7 +388,7 @@ export default {
this.searchTime = []
this.$set(this.searchTime, 0, this.oldSearchTime[0])
this.$set(this.searchTime, 1, this.oldSearchTime[1])
// this.$refs.calendarPanel.setCustomTime(this.searchTime);
this.$refs.pickTime.$refs.timePicker.setCustomTime(this.stableFilter)
this.seriesItemScreen = this.seriesItem
this.screenModal = true
@@ -397,6 +398,9 @@ export default {
},
// 设置数据, filter区分
setData (chartItem, seriesItem, panelId, filter, area, errorMsg) {
if (filter) {
this.stableFilter = filter
}
if (errorMsg && errorMsg !== '') {
this.isError = true
this.errorContent = errorMsg

5
nezha-fronted/src/components/charts/chart-table.vue
View File

@@ -369,13 +369,16 @@ export default {
this.searchTime = []
this.$set(this.searchTime, 0, this.oldSearchTime[0])
this.$set(this.searchTime, 1, this.oldSearchTime[1])
// this.$refs.calendarPanel.setCustomTime(this.searchTime);
this.$refs.pickTime.$refs.timePicker.setCustomTime(this.stableFilter)
this.seriesItemScreen = this.seriesItem
this.screenModal = true
},
// 设置数据, filter区分
setData (chartItem, seriesItem, panelId, filter, area, errorMsg) {
if (filter) {
this.stableFilter = filter
}
if (errorMsg && errorMsg !== '') {
this.isError = true
this.errorContent = errorMsg

20
nezha-fronted/src/components/charts/line-chart-block.vue
View File

@@ -572,7 +572,6 @@ export default {
this.chartType = 'line'
}
const minusTime = (new Date(this.searchTime[0]).getTime() - new Date(this.$refs.pickTime.$refs.multipleTime.searchTime[0]).getTime())
const minusFlag = this.$refs.pickTime && this.$refs.pickTime.$refs.multipleTime && this.$refs.pickTime.$refs.multipleTime.searchTime.length
let minTime = null
let maxTime = null
if (dataArg.length > 0 && dataArg[0].data &&
@@ -733,6 +732,7 @@ export default {
formatter: function (params) {
let str = '<div>'
let sum = 0
let minusFlag = true
params.forEach((item, i) => {
const tip = legend[item.seriesIndex]
const color = self.bgColorList[item.seriesIndex]
@@ -743,12 +743,13 @@ export default {
str += bus.timeFormate(tData)
str += '</div>'
}
if (i === params.length / 2 && tip.alias.indexOf('process_') !== -1) {
if (tip.alias.indexOf('process_') !== -1 && minusFlag) {
const value = item.data[0] - minusTime
const tData = new Date(value)
str += '<div style="margin-bottom: 5px;margin-top: 5px">'
str += bus.timeFormate(tData)
str += '</div>'
minusFlag = false
}
let val = item.data[1] ? parseFloat(Number(item.data[1]).toFixed(2)) : ''
if (val === 0) {
@@ -1367,11 +1368,10 @@ export default {
// this.searchTime = this.oldSearchTime;
this.$set(this.searchTime, 0, this.oldSearchTime[0])
this.$set(this.searchTime, 1, this.oldSearchTime[1])
// this.$refs.calendarPanel.setCustomTime(this.searchTime);
this.screenModal = true
this.isGreyScreen = []
this.$refs.pickTime.$refs.multipleTime.searchTime = []
// this.$refs.pickTime.$refs.timerPick.setCustomTime(this.searchTime)
this.$refs.pickTime.$refs.timePicker.setCustomTime(this.stableFilter)
this.seriesItemScreen = this.seriesItem
// this.seriesItemScreen = this.seriesItem;
/*
@@ -1489,7 +1489,6 @@ export default {
}
// 一个图表
axios.all(axiosArr).then((res) => {
console.log(res)
if (res.length > 0) {
const series = []
const legend = []
@@ -1626,10 +1625,15 @@ export default {
console.log(series)
const minusTime = (new Date(this.searchTime[0]).getTime() - new Date(this.$refs.pickTime.$refs.multipleTime.searchTime[0]).getTime())
console.log(minusTime)
if (this.$refs.pickTime.$refs.multipleTime && this.$refs.pickTime.$refs.multipleTime.searchTime.length) {
if (this.$refs.pickTime.$refs.multipleTime && this.$refs.pickTime.$refs.multipleTime.searchTime.length && res.length > this.data.elements.length) {
let cutPoint = 0
res.forEach((item, index) => {
if (index < res.length / 2) {
cutPoint += res[index].data.result.length
}
})
series.forEach((item, index) => {
if (index >= series.length / 2) {
console.log(123123);
if (index >= cutPoint) {
series[index].data.forEach((item1, index1) => {
item1[0] = item1[0] + minusTime
})

2
nezha-fronted/src/components/common/js/tools.js
View File

@@ -2,7 +2,7 @@ import { getChart } from './common'
import MessageBox from 'element-ui/packages/message-box/src/main'
import i18n from '../i18n'
/* 弹窗点击外部后关闭 */
const exceptClassName = ['config-dropdown', 'nz-pop', 'el-picker', 'chart-box-dropdown', 'metric-dropdown', 'el-cascader__dropdown', 'asset-dropdown', 'no-style-class', 'el-message-box', 'nz-dashboard-dropdown', 'el-autocomplete-suggestion', 'nz-temp-box','el-time-panel'] // clickoutside排除的class(白名单) no-style-class：没有任何样式的class
const exceptClassName = ['config-dropdown', 'nz-pop', 'el-picker', 'chart-box-dropdown', 'metric-dropdown', 'el-cascader__dropdown', 'asset-dropdown', 'no-style-class', 'el-message-box', 'nz-dashboard-dropdown', 'el-autocomplete-suggestion', 'nz-temp-box', 'el-time-panel'] // clickoutside排除的class(白名单) no-style-class：没有任何样式的class
export const clickoutside = {
// 初始化指令
bind (el, binding, vnode) {

4
nezha-fronted/src/components/common/language/cn.js
View File

@@ -779,7 +779,7 @@ const cn = {
state: '状态',
longitude: '经度',
latitude: '纬度',
lnglat:'坐标'
lnglat: '坐标'
},
model: {
model: '资产型号',
@@ -856,7 +856,7 @@ const cn = {
lat: '纬度',
lng: '经度',
zoom: '缩放',
lnglat:'坐标',
lnglat: '坐标'
},
email: {
email: '邮件',

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

@@ -724,7 +724,7 @@ const en = {
state: 'State',
longitude: 'Longitude',
latitude: 'Latitude',
lnglat:'Coordinate'
lnglat: 'Coordinate'
},
model: {
model: 'Asset model',
@@ -859,7 +859,7 @@ const en = {
lat: 'latitude',
lng: 'longitude',
zoom: 'zoom',
lnglat:'coordinate'
lnglat: 'coordinate'
},
email: {
email: 'Email',

86
nezha-fronted/src/components/common/latlngPicker.vue
View File

@@ -20,44 +20,44 @@
</template>
<script>
// 引入Leaflet对象 挂载到Vue上，便于全局使用，也可以单独页面中单独引用
import 'leaflet/dist/leaflet.css'
import * as L from 'leaflet'
import icon from 'leaflet/dist/images/marker-icon.png'
import iconShadow from 'leaflet/dist/images/marker-shadow.png'
export default {
name: "latlngPicker",
props:{
initData:{type:Object},
appendToBody:{type:Boolean,default:true},
showZoom:{type:Boolean,default:true}
// 引入Leaflet对象 挂载到Vue上，便于全局使用，也可以单独页面中单独引用
import 'leaflet/dist/leaflet.css'
import * as L from 'leaflet'
import icon from 'leaflet/dist/images/marker-icon.png'
import iconShadow from 'leaflet/dist/images/marker-shadow.png'
export default {
name: 'latlngPicker',
props: {
initData: { type: Object },
appendToBody: { type: Boolean, default: true },
showZoom: { type: Boolean, default: true }
},
data(){
return{
lnglat:"",
mapParam:{ longitude: 116.39, latitude: 39.9, zoom: 4, minZoom: 1, maxZoom: 10 },
data () {
return {
lnglat: '',
mapParam: { longitude: 116.39, latitude: 39.9, zoom: 4, minZoom: 1, maxZoom: 10 },
map: null,
marker: null,
mapConfigVisible: false,
mapConfigVisible: false
}
},
created() {
if(this.initData){
this.mapParam = JSON.parse(JSON.stringify(this.initData));
}else{
this.queryDefaultMapConfig();
created () {
if (this.initData) {
this.mapParam = JSON.parse(JSON.stringify(this.initData))
} else {
this.queryDefaultMapConfig()
}
this.lnglat = this.mapParam.longitude+","+this.mapParam.latitude;
this.lnglat = this.mapParam.longitude + ',' + this.mapParam.latitude
},
mounted() {
mounted () {
},
methods:{
methods: {
initMap: function () {
if (this.map) {
this.map.remove()
this.map = null
}
this.setLatlng();
this.setLatlng()
const DefaultIcon = L.icon({
iconUrl: icon,
iconSize: [26, 40],
@@ -102,36 +102,36 @@
mapClose: function () {
this.mapConfigVisible = false
const latlng = this.marker.getLatLng()
this.mapParam.longitude = latlng.lng.toFixed(3);
this.mapParam.latitude = latlng.lat.toFixed(3);
this.lnglat = this.mapParam.longitude+","+this.mapParam.latitude;
this.mapParam.longitude = latlng.lng.toFixed(3)
this.mapParam.latitude = latlng.lat.toFixed(3)
this.lnglat = this.mapParam.longitude + ',' + this.mapParam.latitude
this.mapParam.zoom = this.map.getZoom();
this.mapParam.zoom = this.map.getZoom()
},
setLatlng:function(){
let lnglat = this.lnglat.split(",");
setLatlng: function () {
const lnglat = this.lnglat.split(',')
this.mapParam.longitude = lnglat[0]
this.mapParam.latitude = lnglat[1]
},
getAttribute:function(){
return JSON.parse(JSON.stringify(this.mapParam));
getAttribute: function () {
return JSON.parse(JSON.stringify(this.mapParam))
},
setLnglat:function(lat,lng){
if(lat&&lng){
this.mapParam.latitude=lat;
this.mapParam.longitude =lng;
this.lnglat = this.mapParam.longitude+","+this.mapParam.latitude;
setLnglat: function (lat, lng) {
if (lat && lng) {
this.mapParam.latitude = lat
this.mapParam.longitude = lng
this.lnglat = this.mapParam.longitude + ',' + this.mapParam.latitude
}
},
queryDefaultMapConfig:function(){
this.$get("/sysConfig?paramKey=map_center_config").then(response=>{
if(response.code == 200){
this.mapParam = JSON.parse(response.data.paramKey.map_center_config);
queryDefaultMapConfig: function () {
this.$get('/sysConfig?paramKey=map_center_config').then(response => {
if (response.code == 200) {
this.mapParam = JSON.parse(response.data.paramKey.map_center_config)
}
})
}
}
}
}
</script>
<style scoped>

2
nezha-fronted/src/components/common/multipleTime.vue
View File

@@ -371,7 +371,7 @@ export default {
}
},
setSearchTime (type, val) {
console.log(132, this.stepSearchTime ,val,new Date(this.stepSearchTime[0]).getTime() - val * 60 * 60)
console.log(132, this.stepSearchTime, val, new Date(this.stepSearchTime[0]).getTime() - val * 60 * 60)
if (type === 'minute') {
const startTime = bus.timeFormate(new Date(this.stepSearchTime[0]).getTime() - val * 60 * 1000, 'yyyy-MM-dd hh:mm:ss')
const endTime = bus.timeFormate(new Date(this.stepSearchTime[1]).getTime() - val * 60 * 1000, 'yyyy-MM-dd hh:mm:ss')

2
nezha-fronted/src/components/common/project/topologyL5.vue
View File

@@ -1164,7 +1164,7 @@ export default {
},
onMessage (event, data, e) {
console.log('onMessage', event, data);
console.log('onMessage', event, data)
// console.log(getTopology(this.topologyIndex))
// this.notModuleIDArr=[];
this.toolShow.attr = false

46
nezha-fronted/src/components/common/project/topologyPrev.vue
View File

@@ -381,8 +381,8 @@
</template>
<script>
import { Topology, registerNode } from '@topology/core'
import {
import { Topology, registerNode } from '@topology/core'
import {
Tools,
canvasRegister,
imageTemp,
@@ -394,31 +394,31 @@
onChangeAnimateLine,
myCubec,
myCubeAnchors
} from './L5/services/canvas.js'
import { getTopology, setTopology } from '../js/common'
import CanvasProps from './L5/CanvasProps'
import topologyTopTool from './L5//topologyTopTool'
import popDataMain from './popData/Main'
import popDataInfo from './popData/Info'
import alertTable from './popData/alertTable'
import assetTable from './popData/assetTable'
import endpointTable from './popData/endpointTable'
import topoTooltip from './L5/topoTooltip'
import { getMetricTypeValue } from '../js/tools'
import bus from '../../../libs/bus'
import topologyPrev from './topologyPrev'
// 注册到画布
registerNode('rectangleImg', myShape, myAnchors, myIconRect, myTextRect)
registerNode('myCube', myCubec, myCubeAnchors, null, null)
} from './L5/services/canvas.js'
import { getTopology, setTopology } from '../js/common'
import CanvasProps from './L5/CanvasProps'
import topologyTopTool from './L5//topologyTopTool'
import popDataMain from './popData/Main'
import popDataInfo from './popData/Info'
import alertTable from './popData/alertTable'
import assetTable from './popData/assetTable'
import endpointTable from './popData/endpointTable'
import topoTooltip from './L5/topoTooltip'
import { getMetricTypeValue } from '../js/tools'
import bus from '../../../libs/bus'
import topologyPrev from './topologyPrev'
// 注册到画布
registerNode('rectangleImg', myShape, myAnchors, myIconRect, myTextRect)
registerNode('myCube', myCubec, myCubeAnchors, null, null)
const canvasOptions = {
const canvasOptions = {
rotateCursor: '/img/rotate.cur',
translateKey: 'None',
disableEmptyLine: true,
autoExpandDistance: 0,
minScale: 0.01
}
export default {
}
export default {
name: 'topologyL5',
data () {
return {
@@ -1164,7 +1164,7 @@
},
onMessage (event, data, e) {
console.log('onMessage', event, data);
console.log('onMessage', event, data)
// console.log(getTopology(this.topologyIndex))
// this.notModuleIDArr=[];
this.toolShow.attr = false
@@ -2064,7 +2064,7 @@
}
window.removeEventListener('resize', this.winResize)
}
}
}
</script>
<style lang="scss">
.el-dropdown-menu {

22
nezha-fronted/src/components/common/rightBox/dcBox.vue
View File

@@ -70,11 +70,11 @@
</template>
<script>
import latlngPicker from "../latlngPicker";
import latlngPicker from '../latlngPicker'
const regNum = /^[0-9]+.?[0-9]*/
export default {
name: 'dcBox',
components:{latlngPicker},
components: { latlngPicker },
props: {
dc: Object,
userData: Array
@@ -118,21 +118,21 @@ export default {
this.$refs.dcForm.validate((valid) => {
if (valid) {
if (this.editDc.id) {
const param = {...this.editDc}
let attr = this.$refs.latlngPicker.getAttribute();
param.latitude = attr.latitude;
param.longitude = attr.longitude;
const param = { ...this.editDc }
const attr = this.$refs.latlngPicker.getAttribute()
param.latitude = attr.latitude
param.longitude = attr.longitude
this.$put('idc', param).then(response => {
this.prevent_opt.save = false
if (response.code === 200) {
this.$message({duration: 1000, type: 'success', message: this.$t('tip.saveSuccess')})
this.$message({ duration: 1000, type: 'success', message: this.$t('tip.saveSuccess') })
this.esc(true)
} else {
this.$message.error(response.msg)
}
})
} else {
const param = {...this.editDc}
const param = { ...this.editDc }
if (param.area) {
param.areaId = param.area.id
}
@@ -145,7 +145,7 @@ export default {
this.$post('idc', param).then(response => {
this.prevent_opt.save = false
if (response.code === 200) {
this.$message({duration: 1000, type: 'success', message: this.$t('tip.saveSuccess')})
this.$message({ duration: 1000, type: 'success', message: this.$t('tip.saveSuccess') })
this.esc(true)
} else {
this.$message.error(response.msg)
@@ -210,8 +210,8 @@ export default {
deep: true,
handler (n, o) {
this.editDc = JSON.parse(JSON.stringify(n))
this.$nextTick(()=>{
this.$refs.latlngPicker.setLnglat(this.editDc.latitude,this.editDc.longitude);
this.$nextTick(() => {
this.$refs.latlngPicker.setLnglat(this.editDc.latitude, this.editDc.longitude)
})
}
}

48
nezha-fronted/src/components/common/timePicker.vue
View File

@@ -262,38 +262,32 @@ export default {
},
setCustomTime (timeGroup) {
console.log(timeGroup)
if (!timeGroup[2] || timeGroup.length === 2) {
this.$set(this.searchTime, 0, timeGroup[0])
this.$set(this.searchTime, 1, timeGroup[1])
this.nowTimeType = {
id: 0,
text: this.$t('dashboard.panel.customTimeRange')
}
this.$set(this.showTime, 'id', this.nowTimeType.id)
this.$set(this.showTime, 'text', this.nowTimeType.text)
} else if (timeGroup[2]) {
const type = timeGroup[2].substr(timeGroup[2].length - 1, 1)
const value = timeGroup[2].substr(0, timeGroup[2].length - 1)
if (value == 30 && type === 'd') {
if (timeGroup) {
this.showTime = this.nowTimeType = this.timeData.find(item => item.id == timeGroup.id)
if (this.showTime) {
this.$set(this.searchTime, 0, timeGroup.start_time)
this.$set(this.searchTime, 1, timeGroup.end_time)
} else {
this.showTime = this.nowTimeType = {
id: 11,
text: this.$t('dashboard.panel.lastThirtyDay'),
type: 'date',
value: 30
id: 4,
text: this.$t('dashboard.panel.lastOneHour'),
type: 'hour',
value: 1
}
} else if (value == 30 && type === 'm') {
this.showTime = this.nowTimeType = {
id: 3,
text: this.$t('dashboard.panel.lastThirtyMin'),
type: 'minute',
value: 30
const time = bus.getTimezontDateRange()
this.$set(this.searchTime, 0, time[0])
this.$set(this.searchTime, 1, time[1])
}
} else {
this.showTime = this.nowTimeType = this.timeData.find(item => item.value == value)
this.showTime = this.nowTimeType = {
id: 4,
text: this.$t('dashboard.panel.lastOneHour'),
type: 'hour',
value: 1
}
this.$set(this.showTime, 'id', this.nowTimeType.id)
this.$set(this.showTime, 'text', this.nowTimeType.text)
const time = bus.getTimezontDateRange()
this.$set(this.searchTime, 0, time[0])
this.$set(this.searchTime, 1, time[1])
}
},
// left(){},

6
nezha-fronted/src/components/page/config/system.vue
View File

@@ -356,13 +356,13 @@
<script>
import { positiveInteger, port, hostPlus, host, uSize } from '../../common/js/validate'
import latlngPicker from "../../common/latlngPicker";
import latlngPicker from '../../common/latlngPicker'
import bus from '../../../libs/bus'
import draggable from 'vuedraggable'
export default {
name: 'system',
components: { draggable ,latlngPicker},
components: { draggable, latlngPicker },
data () {
return {
basic: {
@@ -588,7 +588,7 @@ export default {
if (valid) {
const param = {}
if (type == 'basic') {
this.basic.map_center_config = this.$refs.latlngPicker.getAttribute();
this.basic.map_center_config = this.$refs.latlngPicker.getAttribute()
this.basic.map_center_config = JSON.stringify(this.basic.map_center_config)
}
param[type] = Object.assign({}, this[type])

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

@@ -394,6 +394,7 @@ export default {
this.filter.end_time = bus.timeFormate(this.searchTime[1], 'yyyy-MM-dd hh:mm:ss')
this.filter.end_time = bus.timeFormate(this.searchTime[1], 'yyyy-MM-dd hh:mm:ss')
this.filter.value = this.searchTime[2]
this.filter.id = this.$refs.pickTime.$refs.timePicker.showTime.id
this.getTableData()
this.getData(this.filter)
},