feat:修改panel 显示的问题 以及 endpoint编辑显示名称错误的问题

This commit is contained in:
zhangyu
2021-04-28 18:59:58 +08:00
parent 11b4bc7049
commit cc5e4fb7fd
15 changed files with 53 additions and 38 deletions

View File

@@ -108,3 +108,11 @@
line-height: 20px;
font-weight: 400;
}
.active-icon{
margin-top:0px;
width:10px;
height:10px;
border-radius:50%;
display: inline-block;
margin-right: 5px;
}

View File

@@ -1690,7 +1690,7 @@ li{
}
/*列表中状态字段 的小圆点*/
.active-icon{
margin-top:15px;
margin-top:0px;
width:8px;
height:8px;
border-radius:50%;

View File

@@ -674,7 +674,7 @@ export default {
}
if (!param.query) delete param.query
// 根据panelId获得panel下的所有图表
this.$get('visual/panel/chart?panelId=' + params.panelId + '&pageSize=-1').then(response => {
this.$get('visual/panel/chart?panelId=' + params.panelId + '&groupId=0').then(response => {
if (response.code === 200) {
response.data.list.forEach((item, index) => {
item.isLoaded = false

View File

@@ -1149,7 +1149,7 @@ const cn = {
alerts: 'Alerts',
privpin: '隐私密码',
asset: 'Asset',
editEndpoint: '编辑 endpoint',
editEndpoint: '编辑 Endpoint',
createEndpoint: '新增Endpoint',
batchEndpoint: '批量 Endpoint',
endpointName: 'Endpoint name'

View File

@@ -1177,7 +1177,7 @@ const en = {
privpin: 'Priv password',
alerts: 'Alerts',
asset: 'Asset',
editEndpoint: 'edit endpoint',
editEndpoint: 'Edit endpoint',
createEndpoint: 'Created endpoint',
batchEndpoint: 'Batch Endpoint',
endpointName: 'Endpoint name',

View File

@@ -173,7 +173,7 @@ import TimePicker from './time'
import YearTable from '../basic/year-table'
import MonthTable from '../basic/month-table'
import DateTable from '../basic/date-table'
import bus from '@/libs/bus'
export default {
mixins: [Locale],
@@ -373,7 +373,7 @@ export default {
// NOTE: not a permanent solution
// consider disable "now" button in the future
if ((!this.disabledDate || !this.disabledDate(new Date())) && this.checkDateWithinRange(new Date())) {
this.date = new Date()
this.date = new Date(bus.computeTimezoneTime(new Date()))
this.emit(this.date)
}
},

View File

@@ -1549,7 +1549,6 @@ export default {
upload () {
const form = new FormData()
form.append('file', this.file)
console.log(this.file)
if (this.uploadPic.name) {
form.append('name', this.uploadPic.name)
} else {
@@ -1562,7 +1561,7 @@ export default {
if (res.code == 200) {
this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
this.uploadPicShow = false
this.dealImg(`monitor/project/topo/icon/${res.data.id}/0`).then((data,header) => {
this.dealImg(`monitor/project/topo/icon/${res.data.id}/1`).then((data,header) => {
const group = this.tools.find(tool => tool.group === this.uploadPic.unit)
if (group) {
group.children.push({
@@ -1618,7 +1617,7 @@ export default {
res.data.list.forEach((item, index) => {
item.imageName = item.name
delete item.name
promiseArr.push(this.dealImg(`monitor/project/topo/icon/${item.id}/0`))
promiseArr.push(this.dealImg(`monitor/project/topo/icon/${item.id}/1`))
imgArr.push({ ...item })
})
Promise.all(promiseArr).then((res2,header) => {
@@ -1662,7 +1661,7 @@ export default {
const promiseArr = []
imgidList.forEach((item, index) => {
if (item.data.imageId) {
promiseArr.push(this.dealImg(`monitor/project/topo/icon/${item.data.imageId}/0`))
promiseArr.push(this.dealImg(`monitor/project/topo/icon/${item.data.imageId}/1`))
} else {
promiseArr.push('')
}
@@ -1688,13 +1687,10 @@ export default {
if (url) {
return new Promise((resolve, reject) => {
this.$axios
.get(url, {
responseType: 'arraybuffer'
})
.then((res, resHeader) => {
.get(url)
.then((res) => {
return {
data: ('data:image/jpeg;base64,' + btoa(new Uint8Array(res.data).reduce((data, byte) => data + String.fromCharCode(byte), ''))),
header: resHeader
data: ('data:image/jpeg;base64,' + res.data),
}
})
.then(data => {

View File

@@ -1549,7 +1549,6 @@ export default {
upload () {
const form = new FormData()
form.append('file', this.file)
console.log(this.file)
if (this.uploadPic.name) {
form.append('name', this.uploadPic.name)
} else {
@@ -1562,7 +1561,7 @@ export default {
if (res.code == 200) {
this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
this.uploadPicShow = false
this.dealImg(`monitor/project/topo/icon/${res.data.id}/1`).then((data) => {
this.dealImg(`monitor/project/topo/icon/${res.data.id}/1`).then((data, header) => {
const group = this.tools.find(tool => tool.group === this.uploadPic.unit)
if (group) {
group.children.push({
@@ -1621,7 +1620,7 @@ export default {
promiseArr.push(this.dealImg(`monitor/project/topo/icon/${item.id}/1`))
imgArr.push({ ...item })
})
Promise.all(promiseArr).then((res2) => {
Promise.all(promiseArr).then((res2, header) => {
this.iconArray = [...res.data.list]
this.iconArray.forEach((item, index) => {
item.image = res2[index]
@@ -1688,14 +1687,14 @@ export default {
if (url) {
return new Promise((resolve, reject) => {
this.$axios
.get(url, {
responseType: 'arraybuffer'
})
.then(res => {
return ('data:image/jpeg;base64,' + btoa(new Uint8Array(res.data).reduce((data, byte) => data + String.fromCharCode(byte), '')))
.get(url)
.then((res) => {
return {
data: ('data:image/jpeg;base64,' + res.data)
}
})
.then(data => {
resolve(data)
resolve(data.data, data.header)
// changeImage(data,(img)=>{
// resolve(img)
// })

View File

@@ -37,7 +37,6 @@
<span class="datepicker-title">start time</span>
<my-date-picker prefix-icon=" " class="panel-time-picker-hidden " size="mini" ref="calendar"
format="yyyy/MM/dd HH:mm:ss" @change="(val)=>{dateChange(val,'startAt')}" v-model="editAlertSilence.startAt"
:picker-options="optionsStartAt"
type="datetime"
:clearable="false"
popper-class="panel-time-picker-popper"
@@ -50,7 +49,6 @@
<span class="datepicker-title">end time</span>
<my-date-picker prefix-icon=" " class="panel-time-picker-hidden " size="mini" ref="calendar"
format="yyyy/MM/dd HH:mm:ss" @change="(val)=>{dateChange(val,'endAt')}" v-model="editAlertSilence.endAt"
:picker-options="optionsEndAt"
type="datetime"
:clearable="false"
popper-class="panel-time-picker-popper"

View File

@@ -4,7 +4,7 @@
<!-- begin--标题-->
<div class="right-box-title">
<span v-if="optionType === 'edit'">
{{ $t("project.module.editEndpoint")}}
{{ $t("project.module.editEndpoint")}} {{editEndpoint.id}}
</span>
<span v-if="optionType === 'batch'">
{{ $t("project.module.batchEndpoint")}}

View File

@@ -42,7 +42,7 @@
<span v-else-if="item.prop === 'status'">
<el-popover :content="$t('asset.assetStatPre')+(scope.row.checkTime?utcTimeToTimezoneStr(scope.row.checkTime):$t('asset.assetStatDown'))" placement="right" trigger="hover" width="200">
<div slot="reference" style="width: 20px">
<div :class="{'active-icon green':scope.row[item.prop] == '1','active-icon red':scope.row[item.prop] == '0' || scope.row[item.prop] == '-1' || scope.row[item.prop] == '-2'}"></div>
<div :class="{'active-icon green-bg':scope.row[item.prop] == '1','active-icon red-bg':scope.row[item.prop] == '0' || scope.row[item.prop] == '-1' || scope.row[item.prop] == '-2'}"></div>
</div>
</el-popover>
</span>

View File

@@ -72,13 +72,13 @@
</div>
<div slot="reference" style="width: 100px">
<div v-if="scope.row[item.prop]===0">
<div class="active-icon red inline-block"></div> down
<div class="active-icon red-bg inline-block"></div> down
</div>
<div v-else-if="scope.row[item.prop]===1">
<div class="active-icon green inline-block"></div> up
<div class="active-icon green-bg inline-block"></div> up
</div>
<div v-else-if="scope.row[item.prop]">
<div class="active-icon gray inline-block"></div> suspended
<div class="active-icon gray-bg inline-block"></div> suspended
</div>
</div>
</el-popover>
@@ -183,16 +183,16 @@ export default {
let str = ''
arr.forEach((item, index) => {
if (index === 0) {
str += `<div>DC <div class="active-icon inline-block ${item == '0' ? 'red' : 'green'}"></div></div>`
str += `<div>DC <div class="active-icon inline-block ${item == '0' ? 'red-bg' : 'green-bg'}"></div></div>`
}
if (index === 1) {
str += `<div>ASSET <div class="active-icon inline-block ${item == '0' ? 'red' : 'green'}"></div></div>`
str += `<div>ASSET <div class="active-icon inline-block ${item == '0' ? 'red-bg' : 'green-bg'}"></div></div>`
}
if (index === 2) {
str += `<div>ENDPOINT <div class="active-icon inline-block ${item == '0' ? 'red' : 'green'}"></div></div>`
str += `<div>ENDPOINT <div class="active-icon inline-block ${item == '0' ? 'red-bg' : 'green-bg'}"></div></div>`
}
if (index === 3) {
str += `<div>PROMETHEUS <div class="active-icon inline-block ${item == '0' ? 'red' : 'green'}"></div></div>`
str += `<div>PROMETHEUS <div class="active-icon inline-block ${item == '0' ? 'red-bg' : 'green-bg'}"></div></div>`
}
})
return str

View File

@@ -65,7 +65,7 @@
<addEndpointBox v-if="rightBox.show" :endpoint="object" @close="closeRightBox"></addEndpointBox>
</transition>
<transition name="right-box">
<edit-endpoint-box-new v-if="rightBox.editShow" :module="object" @close="closeRightEditBox" :disabled="true" :type="'edit'"></edit-endpoint-box-new>
<edit-endpoint-box-new v-if="rightBox.editShow" :module="object" @close="closeRightEditBox" :disabled="true" :optionType="'edit'"></edit-endpoint-box-new>
</transition>
<transition name="right-box">
<batchModifyEndpoint v-if="rightBox.batchModify" :module="object" @close="closeRightBatchModify" :selectEndpointList="batchDeleteObjs" :disabled="true" :type="'edit'"></batchModifyEndpoint>

View File

@@ -28,7 +28,7 @@ export function get (url, params) {
axios.get(url, {
params: params
}).then(response => {
resolve(response.data, response)
resolve(response.data)
}).catch(err => {
if (err.response) {
resolve(err.response.data)

View File

@@ -272,6 +272,20 @@ export default new Vue({
return sourceTime
}
},
// 将本地时区转为系统配置的时区
computeTimezoneTime: function (sourceTime) {
let offset = localStorage.getItem('nz-sys-timezone')
offset = moment.tz(offset).format('Z')
if (offset && offset !== 'undefined') {
offset = Number.parseInt(offset)
const date = new Date(sourceTime)
const localOffset = date.getTimezoneOffset() * 60 * 1000 // 默认 一分钟显示时区偏移的结果
const utcTime = date.getTime() + localOffset
return utcTime + (offset * 60 * 60 * 1000)
} else {
return sourceTime
}
},
getTimezontDateRange: function (offset = -1) {
return [
new Date(new Date(this.computeTimezone(new Date().getTime())).setHours(new Date(this.computeTimezone(new Date().getTime())).getHours() + offset)),