还原pis语音播放
This commit is contained in:
parent
28dc2c3739
commit
933a1367c4
@ -6,16 +6,13 @@
|
|||||||
<div class="main_screen_content">
|
<div class="main_screen_content">
|
||||||
<div v-show="!isSingleStation" class="screen_left">
|
<div v-show="!isSingleStation" class="screen_left">
|
||||||
<div class="screen_left_tab">特定区域</div>
|
<div class="screen_left_tab">特定区域</div>
|
||||||
<el-row
|
<el-row><el-button
|
||||||
><el-button
|
|
||||||
v-for="(item, index) in verticalHeader"
|
v-for="(item, index) in verticalHeader"
|
||||||
:key="index"
|
:key="index"
|
||||||
class="screen_operate_name"
|
class="screen_operate_name"
|
||||||
:class="{ active: item.active }"
|
:class="{ active: item.active }"
|
||||||
@click="selectedBatch(item)"
|
@click="selectedBatch(item)"
|
||||||
>{{ item.title }}</el-button
|
>{{ item.title }}</el-button></el-row>
|
||||||
></el-row
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="screen_main_content">
|
<div class="screen_main_content">
|
||||||
<div v-show="!isSingleStation" class="screen_main_content_inner">
|
<div v-show="!isSingleStation" class="screen_main_content_inner">
|
||||||
@ -60,7 +57,7 @@
|
|||||||
<div v-for="(item, index) in verticalHeader" :key="index" class="each_data_info">{{ item.name }}</div>
|
<div v-for="(item, index) in verticalHeader" :key="index" class="each_data_info">{{ item.name }}</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<div class="list" v-if="currentStation && currentStation.children && currentStation.children.length > 0">
|
<div v-if="currentStation && currentStation.children && currentStation.children.length > 0" class="list">
|
||||||
<div class="stationButton" @click="selectedStation(currentStation)">
|
<div class="stationButton" @click="selectedStation(currentStation)">
|
||||||
<div class="screen_station_name">全车站</div>
|
<div class="screen_station_name">全车站</div>
|
||||||
</div>
|
</div>
|
||||||
@ -91,11 +88,11 @@
|
|||||||
<div class="screen_right">
|
<div class="screen_right">
|
||||||
<div class="each_operate">
|
<div class="each_operate">
|
||||||
<div class="each_operate_text">操作</div>
|
<div class="each_operate_text">操作</div>
|
||||||
<div class="each_operate_button" @click="showInfoBrroadcast">滚动信息<br />发布</div>
|
<div class="each_operate_button" @click="showInfoBrroadcast">滚动信息<br>发布</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="each_operate">
|
<div class="each_operate">
|
||||||
<div class="each_operate_text">信息清除</div>
|
<div class="each_operate_text">信息清除</div>
|
||||||
<div class="each_operate_button" @click="stopBroadcast">清除<br />普通信息</div>
|
<div class="each_operate_button" @click="stopBroadcast">清除<br>普通信息</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -125,25 +122,17 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import { getByGroupStationList } from '@/api/jmap/map'
|
import { getByGroupStationList } from '@/api/jmap/map';
|
||||||
import { queryIscsDeviceCod } from '@/api/iscs'
|
import { queryIscsDeviceCod } from '@/api/iscs';
|
||||||
import InfoBroadcast from './infoBroadcast'
|
import InfoBroadcast from './infoBroadcast';
|
||||||
import { sendCommandNew } from '@/api/jmap/training'
|
import { sendCommandNew } from '@/api/jmap/training';
|
||||||
import { creatSubscribe, clearSubscribe, getTopic } from '@/utils/stomp'
|
import { creatSubscribe, clearSubscribe, getTopic } from '@/utils/stomp';
|
||||||
import { getToken } from '@/utils/auth'
|
import { getToken } from '@/utils/auth';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'MainScreen',
|
name: 'MainScreen',
|
||||||
components: {
|
components: {
|
||||||
InfoBroadcast,
|
InfoBroadcast
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
currentStation() {
|
|
||||||
return this.stationList.find(station => station.code === this.$route.query.stationId)
|
|
||||||
},
|
|
||||||
isSingleStation() {
|
|
||||||
return this.$route.query.stationId.startsWith('Station')
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
@ -156,15 +145,23 @@ export default {
|
|||||||
{ name: '物业', title: '全物业', key: 'property', type: 'checkBox', active: false },
|
{ name: '物业', title: '全物业', key: 'property', type: 'checkBox', active: false },
|
||||||
{ name: '天桥1', title: '天桥1', key: 'overbridge1', type: 'checkBox', active: false },
|
{ name: '天桥1', title: '天桥1', key: 'overbridge1', type: 'checkBox', active: false },
|
||||||
{ name: '天桥2', title: '天桥2', key: 'overbridge2', type: 'checkBox', active: false },
|
{ name: '天桥2', title: '天桥2', key: 'overbridge2', type: 'checkBox', active: false },
|
||||||
{ name: 'LED', title: '出入口(LED)', key: 'LED', type: 'checkBox', active: false },
|
{ name: 'LED', title: '出入口(LED)', key: 'LED', type: 'checkBox', active: false }
|
||||||
],
|
],
|
||||||
statusColor: {
|
statusColor: {
|
||||||
normal: '#00ff00',
|
normal: '#00ff00'
|
||||||
},
|
},
|
||||||
stationList: [],
|
stationList: [],
|
||||||
selectedAreaList: [],
|
selectedAreaList: [],
|
||||||
iscsDeviceMap: {},
|
iscsDeviceMap: {},
|
||||||
deviceMap: {},
|
deviceMap: {}
|
||||||
|
};
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
currentStation() {
|
||||||
|
return this.stationList.find(station => station.code === this.$route.query.stationId);
|
||||||
|
},
|
||||||
|
isSingleStation() {
|
||||||
|
return this.$route.query.stationId.startsWith('Station');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
@ -190,12 +187,12 @@ export default {
|
|||||||
PROPERTY: 4,
|
PROPERTY: 4,
|
||||||
OVERPASS1: 5,
|
OVERPASS1: 5,
|
||||||
OVERPASS2: 6,
|
OVERPASS2: 6,
|
||||||
LED: 7,
|
LED: 7
|
||||||
}
|
};
|
||||||
const res = await getByGroupStationList(this.$route.query.group)
|
const res = await getByGroupStationList(this.$route.query.group);
|
||||||
const resp = await queryIscsDeviceCod({ mapId: this.$route.query.mapId, system: 'PIS' })
|
const resp = await queryIscsDeviceCod({ mapId: this.$route.query.mapId, system: 'PIS' });
|
||||||
if (res.code == 200) {
|
if (res.code == 200) {
|
||||||
this.stationList = []
|
this.stationList = [];
|
||||||
res.data.forEach(station => {
|
res.data.forEach(station => {
|
||||||
if (!station.depot) {
|
if (!station.depot) {
|
||||||
const children = [
|
const children = [
|
||||||
@ -206,170 +203,170 @@ export default {
|
|||||||
{ status: 'none' },
|
{ status: 'none' },
|
||||||
{ status: 'none' },
|
{ status: 'none' },
|
||||||
{ status: 'none' },
|
{ status: 'none' },
|
||||||
{ status: 'none' },
|
{ status: 'none' }
|
||||||
]
|
];
|
||||||
if (resp.code == 200) {
|
if (resp.code == 200) {
|
||||||
resp.data &&
|
resp.data &&
|
||||||
resp.data.forEach(item => {
|
resp.data.forEach(item => {
|
||||||
if (station.code == item.station) {
|
if (station.code == item.station) {
|
||||||
const index = positionMap[item.position]
|
const index = positionMap[item.position];
|
||||||
if (children[index]) {
|
if (children[index]) {
|
||||||
children[index].status = 'default'
|
children[index].status = 'default';
|
||||||
this.iscsDeviceMap[item.code] = station.code + '-' + index
|
this.iscsDeviceMap[item.code] = station.code + '-' + index;
|
||||||
this.deviceMap[station.code + '-' + index] = item
|
this.deviceMap[station.code + '-' + index] = item;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
}
|
}
|
||||||
const param = {
|
const param = {
|
||||||
stationName: station.name,
|
stationName: station.name,
|
||||||
code: station.code,
|
code: station.code,
|
||||||
children: children,
|
children: children
|
||||||
|
};
|
||||||
|
this.stationList.push(param);
|
||||||
}
|
}
|
||||||
this.stationList.push(param)
|
});
|
||||||
}
|
}
|
||||||
})
|
this.subscribe();
|
||||||
}
|
|
||||||
this.subscribe()
|
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
this.$message.error('获取车站列表失败!')
|
this.$message.error('获取车站列表失败!');
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
this.clearSubscribe()
|
this.clearSubscribe();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
showInfoBrroadcast() {
|
showInfoBrroadcast() {
|
||||||
this.$refs.infoBroadcast.doShow()
|
this.$refs.infoBroadcast.doShow();
|
||||||
},
|
},
|
||||||
stopBroadcast() {
|
stopBroadcast() {
|
||||||
const iscsDeviceCodes = []
|
const iscsDeviceCodes = [];
|
||||||
this.selectedAreaList.forEach(item => {
|
this.selectedAreaList.forEach(item => {
|
||||||
if (this.deviceMap[item]) {
|
if (this.deviceMap[item]) {
|
||||||
iscsDeviceCodes.push(this.deviceMap[item].code)
|
iscsDeviceCodes.push(this.deviceMap[item].code);
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
if (!iscsDeviceCodes.length) {
|
if (!iscsDeviceCodes.length) {
|
||||||
this.$message.error('请选择广播设备')
|
this.$message.error('请选择广播设备');
|
||||||
return
|
return;
|
||||||
}
|
}
|
||||||
sendCommandNew(this.$route.query.group, 'ISCS_PIS_Stop_Playing', { iscsDeviceCodes: iscsDeviceCodes })
|
sendCommandNew(this.$route.query.group, 'ISCS_PIS_Stop_Playing', { iscsDeviceCodes: iscsDeviceCodes })
|
||||||
.then(resp => {
|
.then(resp => {
|
||||||
// const audio = document.getElementById('voice')
|
const audio = document.getElementById('voice');
|
||||||
// audio.pause()
|
audio.pause();
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch(() => {
|
||||||
this.$message.error('广播终止播放失败!')
|
this.$message.error('广播终止播放失败!');
|
||||||
})
|
});
|
||||||
},
|
},
|
||||||
releaseBroadcast(voice, type) {
|
releaseBroadcast(voice, type) {
|
||||||
const iscsDeviceCodes = []
|
const iscsDeviceCodes = [];
|
||||||
this.selectedAreaList.forEach(item => {
|
this.selectedAreaList.forEach(item => {
|
||||||
if (this.isSingleStation && !item.startsWith(this.$route.query.stationId)) return
|
if (this.isSingleStation && !item.startsWith(this.$route.query.stationId)) return;
|
||||||
if (this.deviceMap[item]) {
|
if (this.deviceMap[item]) {
|
||||||
iscsDeviceCodes.push(this.deviceMap[item].code)
|
iscsDeviceCodes.push(this.deviceMap[item].code);
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
if (!iscsDeviceCodes.length) {
|
if (!iscsDeviceCodes.length) {
|
||||||
this.$message.error('请选择广播设备')
|
this.$message.error('请选择广播设备');
|
||||||
return
|
return;
|
||||||
}
|
}
|
||||||
const params = {
|
const params = {
|
||||||
resourceId: voice.id,
|
resourceId: voice.id,
|
||||||
iscsDeviceCodes: iscsDeviceCodes,
|
iscsDeviceCodes: iscsDeviceCodes,
|
||||||
name: voice.name,
|
name: voice.name,
|
||||||
content: voice.content,
|
content: voice.content,
|
||||||
type,
|
type
|
||||||
}
|
};
|
||||||
sendCommandNew(this.$route.query.group, 'ISCS_PIS_Play', params)
|
sendCommandNew(this.$route.query.group, 'ISCS_PIS_Play', params)
|
||||||
.then(resp => {
|
.then(resp => {
|
||||||
// const voiceUrl = this.$store.state.user.resourcesUrl + (voice.url || resp.data)
|
const voiceUrl = this.$store.state.user.resourcesUrl + (voice.url || resp.data);
|
||||||
// const audio = document.getElementById('voice')
|
const audio = document.getElementById('voice');
|
||||||
// audio.src = voiceUrl
|
audio.src = voiceUrl;
|
||||||
// audio.play()
|
audio.play();
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch(() => {
|
||||||
this.$message.error('发布广播失败!')
|
this.$message.error('发布广播失败!');
|
||||||
})
|
});
|
||||||
},
|
},
|
||||||
selectArea(stationName, index) {
|
selectArea(stationName, index) {
|
||||||
const elem = stationName + '-' + index
|
const elem = stationName + '-' + index;
|
||||||
if (this.selectedAreaList.includes(elem)) {
|
if (this.selectedAreaList.includes(elem)) {
|
||||||
const areaIndex = this.selectedAreaList.indexOf(elem)
|
const areaIndex = this.selectedAreaList.indexOf(elem);
|
||||||
this.selectedAreaList.splice(areaIndex, 1)
|
this.selectedAreaList.splice(areaIndex, 1);
|
||||||
} else {
|
} else {
|
||||||
this.selectedAreaList.push(elem)
|
this.selectedAreaList.push(elem);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
selectedStation(station) {
|
selectedStation(station) {
|
||||||
const flag = this.checkStationSelected(station)
|
const flag = this.checkStationSelected(station);
|
||||||
station.children.forEach((item, index) => {
|
station.children.forEach((item, index) => {
|
||||||
const elem = station.code + '-' + index
|
const elem = station.code + '-' + index;
|
||||||
if (item.status === 'default' && flag) {
|
if (item.status === 'default' && flag) {
|
||||||
const areaIndex = this.selectedAreaList.indexOf(elem)
|
const areaIndex = this.selectedAreaList.indexOf(elem);
|
||||||
this.selectedAreaList.splice(areaIndex, 1)
|
this.selectedAreaList.splice(areaIndex, 1);
|
||||||
} else if (item.status === 'default' && !flag && !this.selectedAreaList.includes(elem)) {
|
} else if (item.status === 'default' && !flag && !this.selectedAreaList.includes(elem)) {
|
||||||
this.selectedAreaList.push(elem)
|
this.selectedAreaList.push(elem);
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
},
|
},
|
||||||
checkStationSelected(station) {
|
checkStationSelected(station) {
|
||||||
let stationSelectedFlag = true
|
let stationSelectedFlag = true;
|
||||||
station.children.some((item, index) => {
|
station.children.some((item, index) => {
|
||||||
if (item.status === 'default') {
|
if (item.status === 'default') {
|
||||||
stationSelectedFlag = this.selectedAreaList.includes(station.code + '-' + index)
|
stationSelectedFlag = this.selectedAreaList.includes(station.code + '-' + index);
|
||||||
return !stationSelectedFlag
|
return !stationSelectedFlag;
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
return stationSelectedFlag
|
return stationSelectedFlag;
|
||||||
},
|
},
|
||||||
selectedBatch(data) {
|
selectedBatch(data) {
|
||||||
data.active = !data.active
|
data.active = !data.active;
|
||||||
if (data.key == 'station') {
|
if (data.key == 'station') {
|
||||||
this.selectedAllLine(data)
|
this.selectedAllLine(data);
|
||||||
} else {
|
} else {
|
||||||
let areaIndex
|
let areaIndex;
|
||||||
this.verticalHeader.map((item, index) => {
|
this.verticalHeader.map((item, index) => {
|
||||||
if (item.key == data.key) {
|
if (item.key == data.key) {
|
||||||
areaIndex = index
|
areaIndex = index;
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
const flag = data.active
|
const flag = data.active;
|
||||||
this.stationList.forEach(station => {
|
this.stationList.forEach(station => {
|
||||||
station.children.forEach((item, index) => {
|
station.children.forEach((item, index) => {
|
||||||
const elem = station.code + '-' + index
|
const elem = station.code + '-' + index;
|
||||||
if (item.status == 'default' && index + 1 == areaIndex && !flag) {
|
if (item.status == 'default' && index + 1 == areaIndex && !flag) {
|
||||||
const selectedAreaIndex = this.selectedAreaList.indexOf(elem)
|
const selectedAreaIndex = this.selectedAreaList.indexOf(elem);
|
||||||
this.selectedAreaList.splice(selectedAreaIndex, 1)
|
this.selectedAreaList.splice(selectedAreaIndex, 1);
|
||||||
} else if (item.status == 'default' && index + 1 == areaIndex && flag) {
|
} else if (item.status == 'default' && index + 1 == areaIndex && flag) {
|
||||||
this.selectedAreaList.push(elem)
|
this.selectedAreaList.push(elem);
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
})
|
});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
selectedAllLine(data) {
|
selectedAllLine(data) {
|
||||||
const flag = data.active
|
const flag = data.active;
|
||||||
this.selectedAreaList = []
|
this.selectedAreaList = [];
|
||||||
this.stationList.forEach(station => {
|
this.stationList.forEach(station => {
|
||||||
station.children.forEach((item, index) => {
|
station.children.forEach((item, index) => {
|
||||||
if (item.status === 'default' && flag) {
|
if (item.status === 'default' && flag) {
|
||||||
this.selectedAreaList.push(station.code + '-' + index)
|
this.selectedAreaList.push(station.code + '-' + index);
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
})
|
});
|
||||||
},
|
},
|
||||||
subscribe() {
|
subscribe() {
|
||||||
this.clearSubscribe()
|
this.clearSubscribe();
|
||||||
const header = { group: this.$route.query.group || '', 'X-Token': getToken() }
|
const header = { group: this.$route.query.group || '', 'X-Token': getToken() };
|
||||||
creatSubscribe(getTopic('ISCSPIS', this.$route.query.group), header)
|
creatSubscribe(getTopic('ISCSPIS', this.$route.query.group), header);
|
||||||
this.$store.dispatch('app/animationsClose')
|
this.$store.dispatch('app/animationsClose');
|
||||||
},
|
},
|
||||||
clearSubscribe() {
|
clearSubscribe() {
|
||||||
clearSubscribe(getTopic('ISCSPIS', this.$route.query.group))
|
clearSubscribe(getTopic('ISCSPIS', this.$route.query.group));
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
}
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
/deep/ {
|
/deep/ {
|
||||||
|
@ -262,8 +262,8 @@ export default {
|
|||||||
}
|
}
|
||||||
sendCommandNew(this.$route.query.group, 'ISCS_PIS_Stop_Playing', { iscsDeviceCodes: iscsDeviceCodes })
|
sendCommandNew(this.$route.query.group, 'ISCS_PIS_Stop_Playing', { iscsDeviceCodes: iscsDeviceCodes })
|
||||||
.then(resp => {
|
.then(resp => {
|
||||||
// const audio = document.getElementById('voice')
|
const audio = document.getElementById('voice');
|
||||||
// audio.pause()
|
audio.pause();
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch(() => {
|
||||||
this.$message.error('广播终止播放失败!');
|
this.$message.error('广播终止播放失败!');
|
||||||
@ -290,10 +290,10 @@ export default {
|
|||||||
};
|
};
|
||||||
sendCommandNew(this.$route.query.group, 'ISCS_PIS_Play', params)
|
sendCommandNew(this.$route.query.group, 'ISCS_PIS_Play', params)
|
||||||
.then(resp => {
|
.then(resp => {
|
||||||
// const voiceUrl = this.$store.state.user.resourcesUrl + (voice.url || resp.data)
|
const voiceUrl = this.$store.state.user.resourcesUrl + (voice.url || resp.data);
|
||||||
// const audio = document.getElementById('voice')
|
const audio = document.getElementById('voice');
|
||||||
// audio.src = voiceUrl
|
audio.src = voiceUrl;
|
||||||
// audio.play()
|
audio.play();
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch(() => {
|
||||||
this.$message.error('发布广播失败!');
|
this.$message.error('发布广播失败!');
|
||||||
|
Loading…
Reference in New Issue
Block a user