|
|
|
@ -21,8 +21,8 @@ |
|
|
|
<div v-if="dialogInfoList.length > 0" class="dialog_info_left_show_box" style="height: 100%;"> |
|
|
|
<div class="dialog_info_left_show_box_item" v-for="i in dialogInfoList" :key="i.id"> |
|
|
|
<div class="dialog_info_left_show_l"> |
|
|
|
<div class="dialog_info_left_show_l_xsq" :style="{'width':processString(i.screenSize,'w') / getScrollSz(processString(i.screenSize,'w'))+'px','height':processString(i.screenSize,'h') / getScrollSz(processString(i.screenSize,'w'))+'px','padding-left':processStrNum(i.tcontents[0].coordinate,'l') / getScrollSz(processString(i.screenSize,'w'))+'px','padding-top':processStrNum(i.tcontents[0].coordinate,'t') / getScrollSz(processString(i.screenSize,'w'))+'px'}"> |
|
|
|
<div class="dialog_info_left_show_l_xsq_txt" :style="{'font-size':i.tcontents[0].fontSize / getScrollSz(processString(i.screenSize,'w'))+'px','color':i.tcontents[0].fontColor,'font-family':i.tcontents[0].fontType}" v-html="i.tcontents[0].content"></div> |
|
|
|
<div class="dialog_info_left_show_l_xsq" :style="{'width':processString(i.screenSize,'w') / getScrollSz(processString(i.screenSize,'w'))+'px','height':processString(i.screenSize,'h') / getScrollSz(processString(i.screenSize,'w'))+'px','justify-content':getTextAlign(i.tcontents[0].formatStyle)}"> |
|
|
|
<div class="dialog_info_left_show_l_xsq_txt" :style="{'font-size':i.tcontents[0].fontSize / getScrollSz(processString(i.screenSize,'w'))+'px','color':'#'+i.tcontents[0].fontColor,'font-family':i.tcontents[0].fontType,}" v-html="i.tcontents[0].content"></div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="dialog_info_left_show_r"> |
|
|
|
@ -65,8 +65,8 @@ |
|
|
|
<div class="dialog_info_left_show_box" style="overflow-y: visible;"> |
|
|
|
<div class="dialog_info_left_show_box_item" v-for="i in item.mbList" :key="i.id"> |
|
|
|
<div class="dialog_info_left_show_l" style="width:16vw;"> |
|
|
|
<div class="dialog_info_left_show_l_xsq" :style="{'width':processString(i.screenSize,'w') / getScrollSz(processString(i.screenSize,'w'))+'px','height':processString(i.screenSize,'h') / getScrollSz(processString(i.screenSize,'w'))+'px','padding-left':processStrNum(i.tcontents[0].coordinate,'l') / getScrollSz(processString(i.screenSize,'w'))+'px','padding-top':processStrNum(i.tcontents[0].coordinate,'t') / getScrollSz(processString(i.screenSize,'w'))+'px'}"> |
|
|
|
<div class="dialog_info_left_show_l_xsq_txt" :style="{'font-size':i.tcontents[0].fontSize / getScrollSz(processString(i.screenSize,'w'))+'px','color':i.tcontents[0].fontColor,'font-family':i.tcontents[0].fontType}" v-html="i.tcontents[0].content"></div> |
|
|
|
<div class="dialog_info_left_show_l_xsq" :style="{'width':processString(i.screenSize,'w') / getScrollSz(processString(i.screenSize,'w'))+'px','height':processString(i.screenSize,'h') / getScrollSz(processString(i.screenSize,'w'))+'px','justify-content':getTextAlign(i.tcontents[0].formatStyle)}"> |
|
|
|
<div class="dialog_info_left_show_l_xsq_txt" :style="{'font-size':i.tcontents[0].fontSize / getScrollSz(processString(i.screenSize,'w'))+'px','color':'#'+i.tcontents[0].fontColor,'font-family':i.tcontents[0].fontType}" v-html="i.tcontents[0].content"></div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="dialog_info_left_show_r" style="width: 3.5vw;"> |
|
|
|
@ -171,21 +171,23 @@ import GaoDeMap from '@/views/map/index.vue' |
|
|
|
import carECharts from '@/views/echarts/carECharts.vue' |
|
|
|
import addBoard from '@/views/boardView/addinfo.vue' |
|
|
|
import editBoard from '@/views/boardView/editInfo.vue' |
|
|
|
import { invokedFunction } from '@/api/device/device.js' |
|
|
|
import { invokedFunction, getDeviceRealtimeProperty } from '@/api/device/device.js' |
|
|
|
import { getAllVmsTemplate, deleteTemplate } from '@/api//board/template.js' |
|
|
|
import { getDicts } from '@/api/system/dict/data.js' |
|
|
|
export default { |
|
|
|
name: 'indexView', |
|
|
|
data() { |
|
|
|
return { |
|
|
|
formData: [], |
|
|
|
mapIds: '', |
|
|
|
screenDataSize: '', |
|
|
|
activeNames: [], |
|
|
|
showEmit: false, |
|
|
|
boardEmitItem: {}, //修改弹窗的数据 |
|
|
|
activeName: 'first', |
|
|
|
dialogTit: '门架式可变信息标志YK16+270', |
|
|
|
dialogInfoLeft: true, |
|
|
|
dialogInfoRight: true, |
|
|
|
dialogInfoLeft: false, |
|
|
|
dialogInfoRight: false, |
|
|
|
mapDialogTop: '0px', |
|
|
|
mapDialogLeft: '0px', |
|
|
|
keyMonitoringList: [ |
|
|
|
@ -277,10 +279,14 @@ export default { |
|
|
|
methods: { |
|
|
|
// 地图点位 |
|
|
|
mapClickEvent(e) { |
|
|
|
this.dialogInfoList = [] |
|
|
|
console.log('父组件地图点位', e) |
|
|
|
this.dialogInfoLeft = true |
|
|
|
this.mapIds = e.target._opts.extData.ids |
|
|
|
this.screenDataSize = e.target._opts.extData.screenSize |
|
|
|
this.dialogTit = e.target._opts.extData.tit |
|
|
|
this.getTemplateHeaderFn() |
|
|
|
this.onSubmit(this.mapIds) |
|
|
|
// this.mapDialogTop = e.pixel.y + 'px' |
|
|
|
// this.mapDialogLeft = e.pixel.x + 'px' |
|
|
|
// this.$refs.mapDialog.style.top = e.pixel.y + 'px' |
|
|
|
@ -289,9 +295,203 @@ export default { |
|
|
|
}, |
|
|
|
// 信息发布 |
|
|
|
InformationReleaseFn() { |
|
|
|
invokedFunction('65', '').then(res => { |
|
|
|
console.log(res) |
|
|
|
// invokedFunction('65', '').then(res => { |
|
|
|
// console.log(res) |
|
|
|
// }) |
|
|
|
|
|
|
|
this.$confirm('是否确定发布情报板?', '提示', { |
|
|
|
confirmButtonText: '确定', |
|
|
|
cancelButtonText: '取消', |
|
|
|
type: 'warning' |
|
|
|
}) |
|
|
|
.then(() => { |
|
|
|
let loading = this.$loading({ |
|
|
|
lock: true, |
|
|
|
text: 'Loading', |
|
|
|
spinner: 'el-icon-loading', |
|
|
|
background: 'rgba(0, 0, 0, 0.7)' |
|
|
|
}) |
|
|
|
const objAll = {} |
|
|
|
// objAll.deviceIds = this.checkedCities.toString() |
|
|
|
objAll.deviceIds = this.mapIds |
|
|
|
let that = this |
|
|
|
|
|
|
|
// let devicePixel = this.form.devicePixel.split('*') |
|
|
|
console.log('接口参数', this.dialogInfoList) |
|
|
|
let newArr = this.dialogInfoList.map(item => { |
|
|
|
let obj = {} |
|
|
|
|
|
|
|
obj.STAY = item.stopTime |
|
|
|
obj.ACTION = item.inScreenMode |
|
|
|
obj.SPEED = item.tcontents[0].fontSpacing |
|
|
|
obj.COORDINATE = item.screenSize.replace('*', '') |
|
|
|
obj.COLOR = item.tcontents[0].fontColor |
|
|
|
obj.FONT = this.getFontValue(item.tcontents[0].fontType) |
|
|
|
obj.FONT_SIZE = item.tcontents[0].fontSize |
|
|
|
|
|
|
|
obj.CONTENT = item.tcontents[0].content.replaceAll(',', '\\,') |
|
|
|
obj.CONTENT = item.tcontents[0].content.replaceAll('=', '\\=') |
|
|
|
obj.CONTENT = item.tcontents[0].content.replace(/\n/g, '\\\\n') |
|
|
|
|
|
|
|
// obj.CONTENT = item.tcontents[0].content.replace(/\n|\r\n/g, '<r><n>') |
|
|
|
obj.width = this.processString(item.screenSize, 'w') |
|
|
|
obj.height = this.processString(item.screenSize, 'h') |
|
|
|
obj.formatStyle = item.tcontents[0].formatStyle |
|
|
|
return obj |
|
|
|
}) |
|
|
|
|
|
|
|
objAll.parameters = newArr |
|
|
|
const param = { |
|
|
|
objectData: JSON.stringify(objAll) |
|
|
|
} |
|
|
|
console.log('newArr11111', newArr) |
|
|
|
|
|
|
|
/* invokedFunction(65,'1B',{fileId:'1'}).then(res =>{ |
|
|
|
debugger |
|
|
|
console.log('发布消息,播放文件-----------------------------') |
|
|
|
console.log(res) |
|
|
|
}).catch(()=>{ |
|
|
|
this.$modal.msgError("发布失败,请重试"); |
|
|
|
})*/ |
|
|
|
|
|
|
|
invokedFunction(595, 11, { size: '65535', fileName: 'play099.lst' }) |
|
|
|
.then(res => { |
|
|
|
debugger |
|
|
|
console.log('发布消息,校验文件名-------------------------------------') |
|
|
|
console.log(res) |
|
|
|
if (res.data.result == '01') { |
|
|
|
invokedFunction(595, 13, { parameters: newArr }) |
|
|
|
.then(res => { |
|
|
|
debugger |
|
|
|
console.log('发布消息,发送文件内容-----------------------------') |
|
|
|
console.log(res) |
|
|
|
if (res.data.result == '01') { |
|
|
|
invokedFunction(595, '1B', { fileId: '99' }) |
|
|
|
.then(res => { |
|
|
|
debugger |
|
|
|
console.log('发布消息,播放文件-----------------------------') |
|
|
|
console.log(res) |
|
|
|
}) |
|
|
|
.catch(() => { |
|
|
|
this.$modal.msgError('发布失败,请重试') |
|
|
|
}) |
|
|
|
} |
|
|
|
}) |
|
|
|
.catch(() => { |
|
|
|
this.$modal.msgError('发布失败,请重试') |
|
|
|
}) |
|
|
|
} |
|
|
|
}) |
|
|
|
.catch(() => { |
|
|
|
this.$modal.msgError('发布失败,请重试') |
|
|
|
}) |
|
|
|
loading.close() |
|
|
|
}) |
|
|
|
.catch(() => { |
|
|
|
this.$message({ |
|
|
|
type: 'info', |
|
|
|
message: '已取消发布情报板' |
|
|
|
}) |
|
|
|
loading.close() |
|
|
|
}) |
|
|
|
}, |
|
|
|
// 回读 |
|
|
|
onSubmit(deviceId) { |
|
|
|
// this.submitButton = true |
|
|
|
// // this.loading = true |
|
|
|
// this.contentList = [] |
|
|
|
// // 获取情报板修改页面信息 |
|
|
|
// const param = { |
|
|
|
// deviceId: deviceId |
|
|
|
// } |
|
|
|
/* await getBoardContentData(param) |
|
|
|
.then(res => { |
|
|
|
console.log(res, 'onSubmit') |
|
|
|
var contents = res.data.parameters |
|
|
|
console.log(contents, 'onSubmit-----contents') |
|
|
|
for (let i = 0; i < contents.length; i++) { |
|
|
|
let item = contents[i] |
|
|
|
item.COLOR = this.getColorStyle(item.COLOR) |
|
|
|
item.FONT_SIZE = Number(item.FONT_SIZE.substring(0, 2)) + 'px' |
|
|
|
item.ID = i |
|
|
|
item.FONT = this.getFont(item.FONT) |
|
|
|
this.contentList.push(item) |
|
|
|
} |
|
|
|
console.log(this.contentList, 'onSubmit-----this.contentList') |
|
|
|
this.loading = false |
|
|
|
this.submitButton = false |
|
|
|
// this.rowDrop(); |
|
|
|
}) |
|
|
|
.catch(e => { |
|
|
|
this.loading = false |
|
|
|
this.submitButton = false |
|
|
|
})*/ |
|
|
|
getDeviceRealtimeProperty(deviceId, '3A', { async: false }) |
|
|
|
.then(res => { |
|
|
|
console.log('回读消息------------------------') |
|
|
|
var contentsA = res.data['3A'].content |
|
|
|
console.log('回读消息--1111111111---', contentsA) |
|
|
|
|
|
|
|
this.dialogInfoList = contentsA.map(item => { |
|
|
|
return { |
|
|
|
...item, |
|
|
|
stopTime: item.residenceTime, |
|
|
|
inScreenMode: item.screenEntryMethod, |
|
|
|
screenSize: item.displayAreaWidth + '*' + item.displayAreaHeight, |
|
|
|
tcontents: [ |
|
|
|
{ |
|
|
|
...item, |
|
|
|
fontSpacing: item.fontSpacing, |
|
|
|
fontSize: parseInt(item.fontSize.replace(/\D/g, '')), |
|
|
|
fontType: item.font, |
|
|
|
fontColor: item.foregroundColor.toUpperCase(), |
|
|
|
formatStyle: item.horizontalAlignment, |
|
|
|
|
|
|
|
content: item.textContent.replaceAll('\\,', ',').replaceAll('\\=', '=').replaceAll('\\\\n', '\n') |
|
|
|
} |
|
|
|
] |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
|
console.log('回读处理后的数据', this.dialogInfoList) |
|
|
|
|
|
|
|
// for (let i = 0; i < contents.length; i++) { |
|
|
|
// let item = contents[i] |
|
|
|
// item.COLOR = item.foregroundColor |
|
|
|
// item.FONT_SIZE = item.fontSize + 'px' |
|
|
|
// item.ID = i |
|
|
|
// item.FONT = item.font |
|
|
|
// item.COORDINATE = this.covering(item.xCoordinate) + this.covering(item.yCoordinate) |
|
|
|
// ;(item.screenSize = item.displayAreaWidth + '*' + item.displayAreaHeight), (item.CONTENT = item.textContent.replaceAll('\\,', ',')) |
|
|
|
// item.CONTENT = item.CONTENT.replaceAll('\\=', '=') |
|
|
|
// item.CONTENT = item.CONTENT.replaceAll('\\\\n', '\n') |
|
|
|
// item.formatStyle = item.verticalAlignment |
|
|
|
// this.contentList.push(item) |
|
|
|
|
|
|
|
// this.form.devicePixel = item.screenSize |
|
|
|
// } |
|
|
|
|
|
|
|
// console.log(this.contentList, 'onSubmit-----this.contentList') |
|
|
|
// this.rowDrop(); |
|
|
|
|
|
|
|
// this.loading = false |
|
|
|
// this.submitButton = false |
|
|
|
}) |
|
|
|
.catch(e => { |
|
|
|
this.$modal.msgError('回读失败,请重试') |
|
|
|
}) |
|
|
|
// this.deviceId = deviceId |
|
|
|
|
|
|
|
// 根据情报板id获取分辨率 |
|
|
|
/*getBoardInfo(deviceId).then(res => { |
|
|
|
console.log(res, 'getBoardInfo') |
|
|
|
this.form.devicePixel = res.data.pixel |
|
|
|
if (res.data.deviceId) { |
|
|
|
this.disabledButton = false |
|
|
|
} else { |
|
|
|
this.disabledButton = true |
|
|
|
} |
|
|
|
})*/ |
|
|
|
}, |
|
|
|
// 获取模板头部 |
|
|
|
getTemplateHeaderFn() { |
|
|
|
@ -324,16 +524,22 @@ export default { |
|
|
|
addInfo(form) { |
|
|
|
console.log('待发新增', form) |
|
|
|
this.dialogInfoList.push({ |
|
|
|
id: form.id, |
|
|
|
screenSize: form.screenSize, |
|
|
|
COORDINATE: form.coordinate, |
|
|
|
...form, |
|
|
|
tcontents: [{ ...form, content: form.CONTENT, fontSize: parseInt(form.FONT_SIZE.replace(/\D/g, '')), fontType: form.FONT, fontColor: form.COLOR }], |
|
|
|
id: Math.floor(Math.random() * 10000000000000000), |
|
|
|
txt: form.CONTENT, |
|
|
|
fz: parseInt(form.FONT_SIZE.replace(/\D/g, '')), |
|
|
|
fm: form.FONT, |
|
|
|
formatStyle: form.formatStyle, |
|
|
|
...this.processString(form.screenSize), |
|
|
|
...this.processStrNum(form.COORDINATE) |
|
|
|
}) |
|
|
|
this.getTemplateHeaderFn() |
|
|
|
console.log(this.dialogInfoList) |
|
|
|
console.log('新增模板111', this.dialogInfoList) |
|
|
|
// this.getTemplateHeaderFn() |
|
|
|
// console.log(this.dialogInfoList) |
|
|
|
// form.ID = this.contentList.length |
|
|
|
// this.contentList.push(deepClone(form)) |
|
|
|
// this.$message.success('添加成功') |
|
|
|
@ -345,9 +551,10 @@ export default { |
|
|
|
}, |
|
|
|
// 修改弹窗 |
|
|
|
editOutline(item, index, type) { |
|
|
|
this.showEmit = true |
|
|
|
this.index = index |
|
|
|
this.editType = type |
|
|
|
console.log(item, '修改弹窗') |
|
|
|
console.log('修改弹窗', item) |
|
|
|
this.boardEmitItem = { |
|
|
|
FONT_SIZE: item.tcontents[0].fontSize + 'px', |
|
|
|
COLOR: item.tcontents[0].fontColor, |
|
|
|
@ -355,6 +562,7 @@ export default { |
|
|
|
COORDINATE: item.tcontents[0].coordinate, |
|
|
|
FONT: this.getFont(item.tcontents[0].fontType), |
|
|
|
SPEED: item.tcontents[0].fontSpacing, |
|
|
|
formatStyle: item.tcontents[0].formatStyle, |
|
|
|
ACTION: item.inScreenMode, //出屏方式 |
|
|
|
STAY: item.stopTime, //停留时间 |
|
|
|
type: type, |
|
|
|
@ -363,7 +571,6 @@ export default { |
|
|
|
id: item.id, |
|
|
|
tcontentsId: item.tcontents[0].id |
|
|
|
} |
|
|
|
this.showEmit = true |
|
|
|
}, |
|
|
|
// // // 待下发 编辑 |
|
|
|
// openQbbDrawer(item, index, type) { |
|
|
|
@ -379,14 +586,16 @@ export default { |
|
|
|
// 接收子组件form表单 修改 |
|
|
|
receiveForm(form) { |
|
|
|
console.log('接收子组件form表单 修改111111111', form) |
|
|
|
this.formData = form |
|
|
|
console.log('开始的数据', this.dialogInfoList) |
|
|
|
this.dialogInfoList = this.dialogInfoList.map(item => { |
|
|
|
if (item.id === form.id) { |
|
|
|
return { ...item, tcontents: [{ ...item.tcontents[0], ...form, content: form.CONTENT }] } |
|
|
|
return { ...item, tcontents: [{ ...item.tcontents[0], ...form, content: form.CONTENT, fontSize: parseInt(form.FONT_SIZE.replace(/\D/g, '')), fontType: form.FONT, fontColor: form.COLOR }] } |
|
|
|
} |
|
|
|
return item |
|
|
|
}) |
|
|
|
this.getTemplateHeaderFn() |
|
|
|
console.log('修改后的数据', this.dialogInfoList) |
|
|
|
// this.getTemplateHeaderFn() |
|
|
|
this.$forceUpdate() |
|
|
|
}, |
|
|
|
dialogClose() { |
|
|
|
@ -482,6 +691,33 @@ export default { |
|
|
|
} else { |
|
|
|
return font |
|
|
|
} |
|
|
|
}, |
|
|
|
// 转报文 字体 |
|
|
|
getFontValue(font) { |
|
|
|
if (font == '黑体' || font == 'SimHei') return '1' |
|
|
|
if (font == '楷体' || font == 'KaiTi') return '2' |
|
|
|
if (font == '仿宋' || font == 'FangSong') return '4' |
|
|
|
if (font == '隶书' || font == 'LiSu') return '5' |
|
|
|
else return '3' //宋体 |
|
|
|
}, |
|
|
|
|
|
|
|
// 转报文 色号 |
|
|
|
getColorValue(color) { |
|
|
|
if (color == '蓝色' || color == 'blue') return '0000FF' |
|
|
|
if (color == '绿色' || color == '#00FF00' || color == 'GreenYellow') return '00FF00' |
|
|
|
if (color == '红色' || color == 'red') return 'FF0000' |
|
|
|
if (color == '黄色' || color == 'yellow') return 'FFFF00' |
|
|
|
return 'FFFFFF' //白色 |
|
|
|
}, |
|
|
|
// 居中 |
|
|
|
getTextAlign(font) { |
|
|
|
if (font == '0') { |
|
|
|
return 'left' |
|
|
|
} else if (font == '1') { |
|
|
|
return 'right' |
|
|
|
} else { |
|
|
|
return 'center' |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
@ -921,9 +1157,9 @@ export default { |
|
|
|
background-color: #000; |
|
|
|
line-height: 1; |
|
|
|
// text-align: center; |
|
|
|
// display: flex; |
|
|
|
display: flex; |
|
|
|
// justify-content: center; |
|
|
|
// align-items: center; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
|
|
|
|
.show_r_btn { |
|
|
|
|
IAMHERE
1 year ago