还原pis语音播放

This commit is contained in:
fan 2023-12-19 15:40:26 +08:00
parent 28dc2c3739
commit 933a1367c4
2 changed files with 240 additions and 243 deletions

View File

@ -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/ {

View File

@ -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('发布广播失败!');