-
@@ -57,7 +120,14 @@ export default {
iconArray: [],
selectBoxShow: false,
imageNull: '',
- activeNames: []
+ activeNames: [],
+ uploadPicShow: false,
+ imgWidth: 0,
+ imgHeight: 0,
+ uploadPic: {
+ name: '',
+ unit: ''
+ },
}
},
mounted () {
@@ -158,8 +228,152 @@ export default {
})
},
uploadPicChange () {
-
- }
+ this.unitArr = []
+ this.tools.forEach((item, index) => {
+ if (index > 0) {
+ this.unitArr.push({
+ value: item.group
+ })
+ }
+ })
+ this.uploadPic.name = ''
+ this.uploadPic.unit = ''
+ this.file = null
+ this.uploadPicShow = true
+ },
+ querySearch (queryString, cb) {
+ const restaurants = this.unitArr
+ const results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants
+ // 调用 callback 返回建议列表的数据
+ cb(results)
+ },
+ createFilter (queryString) {
+ return (restaurant) => {
+ return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0)
+ }
+ },
+ beforeAvatarUpload (file, fileList) {
+ const this_ = this
+ const isJPG = (file.raw.type === 'image/jpeg' || file.raw.type === 'image/png')
+ const isLt2M = (file.size / 1024 / 1024) < 2
+ if (!isJPG) {
+ this.$message.error(this_.$t('project.topology.imgFormat'))
+ fileList = fileList.splice(fileList.length - 1, 1)
+ return false
+ }
+ if (!isLt2M) {
+ this.$message.error(this_.$t('project.topology.imgSize'))
+ fileList = fileList.splice(fileList.length - 1, 1)
+ return false
+ }
+ new Promise(function (resolve, reject) {
+ const width = 0
+ const height = 0
+ const _URL = window.URL || window.webkitURL
+ const img = new Image()
+ img.onload = function () {
+ const valid = img.width > width && img.height > height
+ this_.imgWidth = img.width
+ this_.imgHeight = img.height
+ valid ? resolve() : reject()
+ }
+ img.src = _URL.createObjectURL(file.raw)
+ }).then(() => {
+ if (isJPG) {
+ this.file = file.raw
+ }
+ return file.raw
+ }, () => {
+ this.$message.error(this_.$t('project.topology.imgMeasure'))
+ return Promise.reject()
+ })
+ return false
+ },
+ imgUpload () {
+ const this_ = this
+ if (!this.imageSave) {
+ this.imageSave = true
+ }
+ if (!this.uploadPic.unit) {
+ this.$message({
+ message: this_.$t('project.topology.unitError'),
+ type: 'error'
+ })
+ return
+ }
+ if (!this.file) {
+ this.$message({
+ message: this_.$t('project.topology.imgError'),
+ type: 'error'
+ })
+ return
+ }
+ this.upload()
+ },
+ upload () {
+ const form = new FormData()
+ form.append('file', this.file)
+ if (this.uploadPic.name) {
+ form.append('name', this.uploadPic.name)
+ } else {
+ form.append('name', this.file.name.substring(0, this.file.name.lastIndexOf('.')))
+ }
+ form.append('unit', this.uploadPic.unit)
+ form.append('width', this.imgWidth)
+ form.append('height', this.imgHeight)
+ this.$post('monitor/project/topo/icon', form, { 'Content-Type': 'multipart/form-data' }).then(res => {
+ this.imageSave = false
+ if (res.code == 200) {
+ this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
+ this.uploadPicShow = false
+ this.$get('monitor/project/topo/icon', { id: res.data.id }).then(iconInfo => {
+ dealImg(`monitor/project/topo/icon/${res.data.id}/1`, res.data.id).then((data, header) => {
+ const group = this.tools.find(tool => tool.group === this.uploadPic.unit)
+ this.iconArray.push({
+ ...iconInfo.data.list[0],
+ image: data.data
+ })
+ if (group) {
+ group.children.push({
+ ...imageTemp,
+ data: {
+ ...imageTemp.data,
+ text: res.data.imageName,
+ image: data.data,
+ imageId: res.data.id,
+ unit: this.uploadPic.unit,
+ rect: {
+ width: data.width,
+ height: data.height
+ }
+ }
+ })
+ } else {
+ this.tools.push({
+ group: this.uploadPic.unit,
+ children: [{
+ ...imageTemp,
+ data: {
+ ...imageTemp.data,
+ text: res.data.imageName,
+ image: data.data,
+ imageId: res.data.id,
+ unit: this.uploadPic.unit,
+ rect: {
+ width: data.width,
+ height: data.height
+ }
+ }
+ }]
+ })
+ }
+ })
+ })
+ } else {
+ this.$message.error(res.msg)
+ }
+ })
+ },
}
}
diff --git a/nezha-fronted/src/components/common/project/meta2d/meta2dTooltip.vue b/nezha-fronted/src/components/common/project/meta2d/meta2dTooltip.vue
index 728690b4d..bd5e8f3f7 100644
--- a/nezha-fronted/src/components/common/project/meta2d/meta2dTooltip.vue
+++ b/nezha-fronted/src/components/common/project/meta2d/meta2dTooltip.vue
@@ -1,6 +1,6 @@
-