joylink/rt-sim-training-client
6
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

iscs调整

Browse Source
This commit is contained in:
joylink_fanyuhong 2022-01-14 17:23:25 +08:00
parent 7372eb5897
commit 02a499a26c
12 changed files with 402 additions and 297 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/api/iscs.js
View File

@ -94,7 +94,21 @@ export function deleteIscsDevice(id) {
method: 'delete'
});
}
// 根据mapId查询设备列表
export function getIscsDeviceListByMapId(mapId) {
return request({
url: `/api/iscsDevice/list/mapId/${mapId}`,
method: 'get'
});
}
// 根据条件查询设备列表
export function queryIscsDeviceCod(params) {
return request({
url: `/api/iscsDevice/list/criteria`,
method: 'get',
params
});
}
// 创建ISCS系统资源
export function createIscsResources(data) {
return request({
@ -132,3 +146,11 @@ export function deleteIscsResources(id) {
method: 'delete'
});
}
// 按条件查询ISCS系统资源
export function queryIscsResourcesCod(params) {
return request({
url: `/api/systemRes/list/criteria`,
method: 'get',
params
});
}

162
src/views/fileManage/voiceManage/add.vue
View File

@ -9,15 +9,24 @@
</el-form-item>
<el-form-item label="url" prop="url">
<el-row>
<el-col :span="20">
<el-input v-model="formModel.url" :disabled="true" style="width: 380px;" />
<el-col :span="18">
<el-input v-model="formModel.url" :disabled="true" style="width: 340px;" />
</el-col>
<el-col :span="4">
<el-button class="chat-box-footer-create chat-box-footer-send" :class="{'active': recordSending}" size="mini" type="primary" @click="startRecording()">
<el-progress id="record_progress_bar" type="circle" :show-text="false" :percentage="100/60*seconds" :width="40" :stroke-width="2" status="success" />
<i v-if="recordSending" class="el-icon-close close_icon" @click.stop="cancleRecording()" />
<span class="iconfont icon-yuyin">&#xe62b;</span>
</el-button>
<el-col :span="6">
<el-upload
ref="replaceUploader"
v-model="newChapter.title"
:file-list="replaceList"
class="avatar-uploader"
action="http://joylink.club/jlfile/api/upload/AUDIO?appId=00001&appSecret=joylink00001"
:limit="1"
:show-file-list="true"
:on-remove="handleRemove"
:on-success="handleReplaceAvatarSuccess"
:before-upload="beforeAvatarUpload"
>
<el-button size="small" type="primary">点击上传</el-button>
</el-upload>
</el-col>
</el-row>
</el-form-item>
@ -32,11 +41,12 @@
<script>
import { uploadAudio, createAudioResources, updateAudioResources} from '@/api/audioResources';
import RecordRTC from 'recordrtc';
export default {
name: 'DeviceAdd',
data() {
return {
replaceList: [],
newChapter: { title: '' },
dialogVisible: false,
formModel: {
id: '',
@ -44,11 +54,7 @@ export default {
desc: '',
url: ''
},
loading: false,
seconds: 0,
recordSending: false,
recorders: null,
microphone:null
loading: false
};
},
computed: {
@ -73,6 +79,31 @@ export default {
mounted() {
},
methods: {
handleReplaceAvatarSuccess(response, file, fileList) {
if (response.code == '200') {
this.formModel.url = response.data;
} else {
this.$message.error('音频上传失败！');
}
},
handleRemove() {
this.formModel.url = '';
},
/**
*上传文件限制--只能上传mp3格式的文件
*/
beforeAvatarUpload(file) {
var testmsg = file.name.substring(file.name.lastIndexOf('.') + 1);
const extension = testmsg === 'mp3' || testmsg === 'wav';
if (!extension) {
this.$message({
message:'上传文件只能是mp3格式！',
type:'error'
});
}
return extension;
},
show(data) {
if (data) {
this.formModel.id = data.id;
@ -81,6 +112,9 @@ export default {
this.formModel.url = data.url;
}
this.dialogVisible = true;
this.$nextTick(() => {
this.$refs.ruleForm.resetFields();
});
},
doSave() {
this.$refs.ruleForm.validate((valid) => {
@ -123,106 +157,6 @@ export default {
};
this.dialogVisible = false;
this.loading = false;
},
cancleRecording() {
if (this.microphone) {
clearInterval(this.inter);
this.seconds = 0;
this.microphone.stop();
this.microphone = null;
this.recordSending = false;
this.recorders = null;
}
},
startRecording() {
const that = this;
if (!this.recordSending) {
if (!this.recordSending && !this.recorders && !this.microphone) {
const StereoAudioRecorder = RecordRTC.StereoAudioRecorder;
navigator.getUserMedia({ audio: true }, function (stream) {
that.microphone = stream;
that.recorders = new RecordRTC(that.microphone, {
type: 'audio',
recorderType: StereoAudioRecorder,
numberOfAudioChannels: 1,
bitsPerSecond:256000,
desiredSampRate: 16000
});
that.recorders.startRecording();
that.recordSending = true;
that.inter = setInterval(() => {
if (that.seconds < 60) {
that.seconds++;
} else {
clearInterval(that.inter);
that.stopRecording();
}
}, 1000);
}, function (error) {
switch (error.code || error.name) {
case 'PERMISSION_DENIED':
case 'PermissionDeniedError':
that.$message({
showClose: true,
message: '用户拒绝提供信息',
type: 'error'
});
break;
case 'NOT_SUPPORTED_ERROR':
case 'NotSupportedError':
that.$message({
showClose: true,
message: '浏览器不支持硬件设备',
type: 'error'
});
break;
case 'MANDATORY_UNSATISFIED_ERROR':
case 'MandatoryUnsatisfiedError':
that.$message({
showClose: true,
message: '无法发现指定的硬件设备',
type: 'error'
});
break;
default:
that.$message({
showClose: true,
message: '无法打开麦克风',
type: 'error'
});
break;
}
}
);
}
} else {
this.stopRecording(); // 发送语音
}
},
// 停止录制 发送语音
stopRecording() {
const that = this;
this.recorders.stopRecording(function(blobURL) {
clearInterval(that.inter);
that.seconds = 0;
const blob = that.recorders.getBlob();
const fd = new FormData();
fd.append('file', blob);
uploadAudio(fd)
.then((resp) => {
that.formModel.url = resp.data;
})
.catch(error => {
console.log(error);
that.$message.error('语音发送失败: ' + error.message);
});
if (that.microphone) {
that.microphone.stop();
that.microphone = null;
that.recordSending = false;
that.recorders = null;
}
});
}
}
};

97
src/views/iscs/iscsSystem/config/broadcast/centerHome.vue
View File

@ -14,10 +14,10 @@
<div v-for="(item,i) in verticalHeader" :key="i" :style="{width: tableWidth+'px'}" class="iscs-pa-table">
<div style="position: relative; left: 80px;">
<div v-for="(it, j) in stationList" :key="j" class="table-grid">
<el-button v-if="item.type==='header'" class="pa-table-header" @click="selectedStation(it)">
<div style="cursor: default;">{{ it }}</div>
<el-button v-if="item.type==='header'" class="pa-table-header" @click="selectedStation(it.code)">
<div style="cursor: default;">{{ it.name }}</div>
</el-button>
<div v-if="item.type==='checkBox'">
<div v-if="checkHasDevice(item, it)">
<div class="pa-table-content" @click="clickArea(i,j)">
<div class="pa-table-content-inside" :style="{background: selectedAreaList.includes(i + '-' + j)? '#2EFF74':'#CDCDCD'}" />
</div>
@ -39,13 +39,13 @@
<el-row>
<el-col :span="12"><div style="height: 80px;text-align: center; background: #000088;color: #fff;padding-top: 30px">预备<br>广播</div></el-col>
<el-col :span="12">
<el-button class="broadcast-mode-button" @click="selectedVideoMode('common')">
<div class="pa-check-box" :style="{background: videoMode==='common'?'#2EFF74':'#CDCDCD'}" />
<el-button class="broadcast-mode-button" @click="selectedVideoMode('RECORDING')">
<div class="pa-check-box" :style="{background: videoMode==='RECORDING'?'#2EFF74':'#CDCDCD'}" />
<div style="position: relative; left: 5px;display: inline-block;">普通预录</div>
</el-button>
<br>
<el-button class="broadcast-mode-button" @click="selectedVideoMode('emergency')">
<div class="pa-check-box" :style="{background: videoMode==='emergency'?'#2EFF74':'#CDCDCD'}" />
<el-button class="broadcast-mode-button" @click="selectedVideoMode('EMERGENCY_RECORDING')">
<div class="pa-check-box" :style="{background: videoMode==='EMERGENCY_RECORDING'?'#2EFF74':'#CDCDCD'}" />
<div style="position: relative; left: 5px;display: inline-block; color: #f00;">紧急预录</div>
</el-button>
</el-col>
@ -55,7 +55,7 @@
<el-button class="broadcast-mode-button" @click="showBroadcastContent">广播内容</el-button>
</el-col>
<el-col :span="12">
<el-button class="broadcast-mode-button">广播停止</el-button>
<el-button class="broadcast-mode-button" @click="stopBroadcast">广播停止</el-button>
</el-col>
</el-row>
</div>
@ -64,8 +64,8 @@
<el-col :span="12"><div style="height: 40px;text-align: center; background: #000088;color: #fff;line-height: 40px">背景音乐</div></el-col>
</el-row>
<el-row style="padding-bottom: 10px">
<el-col :span="12"><el-button class="broadcast-mode-button">播放音乐</el-button></el-col>
<el-col :span="12"><el-button class="broadcast-mode-button">停止音乐</el-button></el-col>
<el-col :span="12"><el-button class="broadcast-mode-button" @click="playBgm">播放音乐</el-button></el-col>
<el-col :span="12"><el-button class="broadcast-mode-button" @click="stopBgm">停止音乐</el-button></el-col>
</el-row>
</div>
</div>
@ -76,12 +76,14 @@
<state-table />
</div>
</div>
<voice-broadcast ref="voiceBroadcast" />
<voice-broadcast ref="voiceBroadcast" :resources-list="resourcesList" @releaseBroadcast="releaseBroadcast" />
<audio id="voice" controls style="width: 0;height: 0;" />
</div>
</template>
<script>
import { getByGroupStationList } from '@/api/jmap/map';
import { queryIscsDeviceCod, queryIscsResourcesCod } from '@/api/iscs';
import MusicIcon from '@/assets/iscs_icon/music_icon.png';
import StateTable from './stateTable';
import VoiceBroadcast from './voiceBroadcast';
@ -94,19 +96,23 @@ export default {
data() {
return {
mes: '1111',
voiceUrl: '',
verticalHeader: [
{name: '车站', title: '全线', key: 'station', type: 'header', active: false},
{name: '站厅', title: '全站厅', key: 'stationHall', type: 'checkBox', active: false},
{name: '上行站台', title: '全上行站台', key: 'uplinkStation', type: 'checkBox', active: false},
{name: '下行站台', title: '全下行站台', key: 'downlinkStation', type: 'checkBox', active: false},
{name: '办公区', title: '全办公区', key: 'officeArea', type: 'checkBox', active: false},
{name: '出入口', title: '全出入口', key: 'passageway', type: 'checkBox', active: false},
{name: '换乘通道', title: '全换乘通道', key: 'channel', type: '', active: false}
{name: '站厅', title: '全站厅', key: 'stationHall', type: 'checkBox', active: false, position: 'LCD'},
{name: '上行站台', title: '全上行站台', key: 'uplinkStation', type: 'checkBox', active: false, position: 'UP_STAND'},
{name: '下行站台', title: '全下行站台', key: 'downlinkStation', type: 'checkBox', active: false, position: 'DOWN_STAND'},
{name: '办公区', title: '全办公区', key: 'officeArea', type: 'checkBox', active: false, position: 'ADMINISTRATIVE_AREA'},
{name: '出入口', title: '全出入口', key: 'passageway', type: 'checkBox', active: false, position: 'GATE'},
{name: '换乘通道', title: '全换乘通道', key: 'channel', type: '', active: false, position: 'TRANSFER_CHANNEL'}
],
musicIcon: MusicIcon,
selectedAreaList: [],
stationList: [],
videoMode: 'common'
iscsDeviceList: [],
resourcesList: [],
videoMode: 'RECORDING',
bgmResources: ''
};
},
computed: {
@ -121,12 +127,54 @@ export default {
this.stationList = [];
res.data.forEach(station => {
if (!station.depot) {
this.stationList.push(station.name);
this.stationList.push(station);
}
});
}
const resp = await queryIscsDeviceCod({ mapId: this.$route.query.mapId, system: 'PA' });
if (resp.code == 200) {
this.iscsDeviceList = resp.data;
}
const params = { mapId: this.$route.query.mapId, system: 'PA', type: 'BGM' };
queryIscsResourcesCod(params).then(resp => {
this.bgmResources = resp.data && resp.data[0] ? resp.data[0].resources : [];
}).catch( () => {
this.$message.error('获取广播资源列表失败！');
} );
this.getResourcesList();
},
methods: {
getResourcesList() {
const params = { mapId: this.$route.query.mapId, system: 'PA', type: this.videoMode };
queryIscsResourcesCod(params).then(resp => {
this.resourcesList = resp.data && resp.data[0] ? resp.data[0].resources : [];
console.log(resp.data, this.resourcesList);
}).catch( () => {
this.$message.error('获取广播资源列表失败！');
} );
},
playBgm() {
if (this.bgmResources && this.bgmResources[0]) {
const bgmUrl = this.$store.state.user.resourcesUrl + this.bgmResources[0].url;
const audio = document.getElementById('voice');
audio.src = bgmUrl;
audio.play();
}
},
stopBgm() {
const audio = document.getElementById('voice');
audio.pause();
},
stopBroadcast() {
const audio = document.getElementById('voice');
audio.pause();
},
releaseBroadcast(voice) {
this.voiceUrl = this.$store.state.user.resourcesUrl + voice.url;
const audio = document.getElementById('voice');
audio.src = this.voiceUrl;
audio.play();
},
clickArea(i, j) {
if (this.selectedAreaList.includes(i + '-' + j)) {
const index = this.selectedAreaList.indexOf(i + '-' + j);
@ -135,6 +183,9 @@ export default {
this.selectedAreaList.push(i + '-' + j);
}
},
checkHasDevice(item, station) {
return this.iscsDeviceList.some(elem => elem.station == station.code && elem.position == item.position);
},
selectedBatch(data) {
data.active = !data.active;
if (data.key == 'station') {
@ -177,10 +228,10 @@ export default {
}
return selectedStationFlag;
},
selectedStation(station) {
selectedStation(stationCode) {
let stationIndex;
this.stationList.forEach((item, index) => {
if (item === station) {
if (item.code === stationCode) {
stationIndex = index;
}
});
@ -196,6 +247,7 @@ export default {
},
selectedVideoMode(mode) {
this.videoMode = mode;
this.getResourcesList();
},
showBroadcastContent() {
this.$refs.voiceBroadcast.doShow();
@ -407,4 +459,7 @@ export default {
width: 2px;
height: 6px;
}
.iscs-pa-table {
height: 32px;
}
</style>

105
src/views/iscs/iscsSystem/config/broadcast/stationHome.vue
View File

@ -25,43 +25,43 @@
</el-col>
<el-col :span="3">
<div class="broadcast-mode-button" @click="selectedArea('上行站台')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('上行站台')? '#2EFF74':'#CDCDCD'}"/>
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('上行站台')? '#2EFF74':'#CDCDCD'}" />
<div style="position: relative; left: 25px;display: inline-block">0</div>
</div>
</el-col>
<el-col :span="3">
<div class="broadcast-mode-button" @click="selectedArea('下行站台')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('下行站台')? '#2EFF74':'#CDCDCD'}"/>
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('下行站台')? '#2EFF74':'#CDCDCD'}" />
<div style="position: relative; left: 25px;display: inline-block">0</div>
</div>
</el-col>
<el-col :span="3">
<div class="broadcast-mode-button" @click="selectedArea('办公区')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('办公区')? '#2EFF74':'#CDCDCD'}"/>
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('办公区')? '#2EFF74':'#CDCDCD'}" />
<div style="position: relative; left: 25px;display: inline-block">0</div>
</div>
</el-col>
<el-col :span="3">
<div class="broadcast-mode-button" @click="selectedArea('出入口')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('出入口')? '#2EFF74':'#CDCDCD'}"/>
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('出入口')? '#2EFF74':'#CDCDCD'}" />
<div style="position: relative; left: 25px;display: inline-block">0</div>
</div>
</el-col>
<el-col :span="3">
<div class="broadcast-mode-button" @click="selectedArea('换乘通道')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('换乘通道')? '#2EFF74':'#CDCDCD'}"/>
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('换乘通道')? '#2EFF74':'#CDCDCD'}" />
<div style="position: relative; left: 25px;display: inline-block">0</div>
</div>
</el-col>
</el-row>
<el-row>
<el-col :span="5"><div class="broadcast-atc-button">ATC广播</div></el-col>
<el-col :span="3"><div class="broadcast-use-button" :style="{color: enableAreaList.includes('站厅')? '#2EFF74':'#CDCDCD'}">{{this.enableAreaList.includes('站厅')? '启用':'未启用'}}</div></el-col>
<el-col :span="3"><div class="broadcast-use-button" :style="{color: enableAreaList.includes('上行站台')? '#2EFF74':'#CDCDCD'}">{{this.enableAreaList.includes('上行站台')? '启用':'未启用'}}</div></el-col>
<el-col :span="3"><div class="broadcast-use-button" :style="{color: enableAreaList.includes('下行站台')? '#2EFF74':'#CDCDCD'}">{{this.enableAreaList.includes('下行站台')? '启用':'未启用'}}</div></el-col>
<el-col :span="3"><div class="broadcast-use-button" :style="{color: enableAreaList.includes('办公区')? '#2EFF74':'#CDCDCD'}">{{this.enableAreaList.includes('办公区')? '启用':'未启用'}}</div></el-col>
<el-col :span="3"><div class="broadcast-use-button" :style="{color: enableAreaList.includes('出入口')? '#2EFF74':'#CDCDCD'}">{{this.enableAreaList.includes('出入口')? '启用':'未启用'}}</div></el-col>
<el-col :span="3"><div class="broadcast-use-button" :style="{color: enableAreaList.includes('换乘通道')? '#2EFF74':'#CDCDCD'}">{{this.enableAreaList.includes('换乘通道')? '启用':'未启用'}}</div></el-col>
<el-col :span="3"><div class="broadcast-use-button" :style="{color: enableAreaList.includes('站厅')? '#2EFF74':'#CDCDCD'}">{{ this.enableAreaList.includes('站厅')? '启用':'未启用' }}</div></el-col>
<el-col :span="3"><div class="broadcast-use-button" :style="{color: enableAreaList.includes('上行站台')? '#2EFF74':'#CDCDCD'}">{{ this.enableAreaList.includes('上行站台')? '启用':'未启用' }}</div></el-col>
<el-col :span="3"><div class="broadcast-use-button" :style="{color: enableAreaList.includes('下行站台')? '#2EFF74':'#CDCDCD'}">{{ this.enableAreaList.includes('下行站台')? '启用':'未启用' }}</div></el-col>
<el-col :span="3"><div class="broadcast-use-button" :style="{color: enableAreaList.includes('办公区')? '#2EFF74':'#CDCDCD'}">{{ this.enableAreaList.includes('办公区')? '启用':'未启用' }}</div></el-col>
<el-col :span="3"><div class="broadcast-use-button" :style="{color: enableAreaList.includes('出入口')? '#2EFF74':'#CDCDCD'}">{{ this.enableAreaList.includes('出入口')? '启用':'未启用' }}</div></el-col>
<el-col :span="3"><div class="broadcast-use-button" :style="{color: enableAreaList.includes('换乘通道')? '#2EFF74':'#CDCDCD'}">{{ this.enableAreaList.includes('换乘通道')? '启用':'未启用' }}</div></el-col>
</el-row>
</div>
<div class="pre-taped-broadcast">
@ -70,12 +70,12 @@
</el-row>
<el-row :gutter="10">
<el-col :span="2">
<div class="broadcast-mode-button" style="left: 5%;width: 80px;top: 20px;" @click="selectedVideoMode('common')">
<div class="pa-check-box" :style="{background: videoMode === 'common'? '#2EFF74': '#CDCDCD'}"/>
<div class="broadcast-mode-button" style="left: 5%;width: 80px;top: 20px;" @click="selectedVideoMode('RECORDING')">
<div class="pa-check-box" :style="{background: videoMode === 'RECORDING'? '#2EFF74': '#CDCDCD'}" />
<div style="position: relative; left: 1px;display: inline-block;">普通预录</div>
</div>
<div class="broadcast-mode-button" style="left: 5%;width: 80px;margin-top: 15px" @click="selectedVideoMode('emergency')">
<div class="pa-check-box" :style="{background: videoMode === 'emergency'? '#2EFF74': '#CDCDCD'}"/>
<div class="broadcast-mode-button" style="left: 5%;width: 80px;margin-top: 15px" @click="selectedVideoMode('EMERGENCY_RECORDING')">
<div class="pa-check-box" :style="{background: videoMode === 'EMERGENCY_RECORDING'? '#2EFF74': '#CDCDCD'}" />
<div style="position: relative; left: 1px;display: inline-block;">紧急预录</div>
</div>
<div class="broadcast-mode-button" style="left: 5%;width: 80px;margin-top: 30px">
@ -86,7 +86,15 @@
<div>
<div class="information-description">信息描述</div>
<div style="overflow-y: auto;height: 150px;background: #fff;">
<div :key="index" v-for="(item,index) in message" class="information-description-box">{{ item }}</div>
<div
v-for="(item,index) in resourcesList"
:key="index"
:style="{background: messageIndex === index? '#4169cc':'#fff'}"
class="information-description-box"
@click="chooseMessage(index)"
>
{{ item.name }}
</div>
</div>
</div>
</el-col>
@ -94,7 +102,7 @@
<div>
<div class="information-description">广播内容</div>
<div style="overflow-y: auto;height: 150px;background: #fff;">
<div :key="index" v-for="(item,index) in broadcast" class="broadcast-content">{{ item }}</div>
<div class="broadcast-content">{{ resourcesList[messageIndex] ? resourcesList[messageIndex].desc: '' }}</div>
</div>
</div>
</el-col>
@ -167,13 +175,13 @@
<div class="broadcast-mode">
<el-row>
<el-col :span="12"><div style="height: 40px;text-align: center; background: #000088;color: #fff;line-height: 40px">实时广播</div></el-col>
<el-col :span="12"><div class="broadcast-mode-button" style="top: 5px; left: 10%;width: 80%;">广播</div></el-col>
<el-col :span="12"><div class="broadcast-mode-button" style="top: 5px; left: 10%;width: 80%;" @click="releaseBroadcast">广播</div></el-col>
</el-row>
</div>
<div class="broadcast-mode" style="top: 25%;">
<el-row>
<el-col :span="12"><div style="height: 40px;text-align: center; background: #000088;color: #fff;line-height: 40px">广播中断</div></el-col>
<el-col :span="12"><div class="broadcast-mode-button" style="top: 5px; left: 10%;width: 80%;">广播停止</div></el-col>
<el-col :span="12"><div class="broadcast-mode-button" style="top: 5px; left: 10%;width: 80%;" @click="stopBroadcast">广播停止</div></el-col>
</el-row>
</div>
<div class="broadcast-mode" style="top: 31%;">
@ -195,16 +203,18 @@
<el-row>
<el-col :span="12"><div style="height: 80px;text-align: center; background: #000088;color: #fff;line-height: 80px">背景音乐</div></el-col>
<el-col :span="12">
<div class="broadcast-mode-button" style="top: 5px; left: 10%;width: 80%;">播放音乐</div>
<div class="broadcast-mode-button" style="top: 5px; left: 10%;width: 80%; margin-top: 5px">停止音乐</div>
<div class="broadcast-mode-button" style="top: 5px; left: 10%;width: 80%;" @click="playBgm">播放音乐</div>
<div class="broadcast-mode-button" style="top: 5px; left: 10%;width: 80%; margin-top: 5px" @click="stopBgm">停止音乐</div>
</el-col>
</el-row>
</div>
<audio id="voice" controls style="width: 0;height: 0;" />
</div>
</template>
<script>
import StateTable from './stateTable';
import { queryIscsResourcesCod } from '@/api/iscs';
export default {
name: 'StationHome',
components: {
@ -212,8 +222,6 @@ export default {
},
data() {
return {
message: ['mes1', 'mes2', 'mes3', 'mes4', 'mes5', 'mes6', 'mes7', 'mes8', 'mes9', '站台有乘客越出X色安全线，站台乘客请返回安前线内'],
broadcast: ['各位乘客为了您和他人的安全，请勿手扶屏蔽门、排队候车，多谢合作！'],
addModel: {
scheduledDescribe: '',
startTime: '',
@ -221,10 +229,34 @@ export default {
delayTime: ''
},
enableAreaList: [],
videoMode: 'common'
bgmResources: '',
videoMode: 'RECORDING',
messageIndex: 0,
resourcesList: []
};
},
created() {
const params = { mapId: this.$route.query.mapId, system: 'PA', type: 'BGM' };
queryIscsResourcesCod(params).then(resp => {
this.bgmResources = resp.data && resp.data[0] ? resp.data[0].resources : [];
}).catch( () => {
this.$message.error('获取广播资源列表失败！');
} );
this.getResourcesList();
},
methods: {
chooseMessage(index) {
this.messageIndex = index;
},
getResourcesList() {
const params = { mapId: this.$route.query.mapId, system: 'PA', type: this.videoMode };
queryIscsResourcesCod(params).then(resp => {
this.resourcesList = resp.data && resp.data[0] ? resp.data[0].resources : [];
console.log(resp.data, this.resourcesList);
}).catch( () => {
this.$message.error('获取广播资源列表失败！');
} );
},
selecteAllArea() {
if (this.enableAreaList.length === 7) {
this.enableAreaList = [];
@ -232,6 +264,31 @@ export default {
this.enableAreaList = ['车站', '站厅', '上行站台', '下行站台', '办公区', '出入口', '换乘通道'];
}
},
playBgm() {
if (this.bgmResources && this.bgmResources[0]) {
const bgmUrl = this.$store.state.user.resourcesUrl + this.bgmResources[0].url;
const audio = document.getElementById('voice');
audio.src = bgmUrl;
audio.play();
}
},
stopBgm() {
const audio = document.getElementById('voice');
audio.pause();
},
stopBroadcast() {
const audio = document.getElementById('voice');
audio.pause();
console.log('88888888888888');
},
releaseBroadcast() {
if (this.resourcesList[this.messageIndex]) {
this.voiceUrl = this.$store.state.user.resourcesUrl + this.resourcesList[this.messageIndex].url;
const audio = document.getElementById('voice');
audio.src = this.voiceUrl;
audio.play();
}
},
selectedArea(area) {
if (this.enableAreaList.includes(area)) {
const index = this.enableAreaList.indexOf(area);

23
src/views/iscs/iscsSystem/config/broadcast/voiceBroadcast.vue
View File

@ -10,12 +10,12 @@
<div class="dialog-header">语音广播</div>
<div class="secondary-title">信息描述</div>
<div class="information-description-box">
<div v-for="(item,index) in message" :key="index">
<div class="information-box">{{item}}</div>
<div v-for="(item,index) in resourcesList" :key="index">
<div class="information-box" :style="{background: messageIndex === index? '#4169cc': '#DCDCDC' }" @click="chooseMessage(index)">{{ item.name }}</div>
</div>
</div>
<div class="secondary-title" style="margin-top: 10px">信息内容显示</div>
<div class="information-context-box">站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类</div>
<div class="information-context-box">{{ resourcesList.length? resourcesList[messageIndex].desc: '' }}</div>
<div class="release-button" @click="releaseBroadcast">发布</div>
</div>
</el-dialog>
@ -24,24 +24,36 @@
<script>
export default {
name: 'VoiceBroadcast',
props: {
resourcesList: {
type: Array,
default: function () {
return [];
}
}
},
data() {
return {
visible: false,
message: ['mes1', 'mes2', 'mes3', 'mes4', 'mes5', 'mes6', 'mes7', 'mes8', 'mes9', '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线，站台乘客请返回安前线内']
messageIndex: 0
};
},
methods:{
doClose() {
this.visible = false;
},
chooseMessage(index) {
this.messageIndex = index;
},
doShow() {
this.visible = true;
},
releaseBroadcast() {
this.visible = false;
this.$emit('releaseBroadcast', this.resourcesList[this.messageIndex]);
}
}
}
};
</script>
<style scoped>
@ -62,6 +74,7 @@ export default {
white-space: nowrap;
background: #DCDCDC;
margin-top: 2px;
cursor: pointer;
}
.secondary-title{
text-align: center;

154
src/views/iscs/iscsSystem/config/pis/infoBroadcast.vue
View File

@ -9,16 +9,22 @@
<div>
<div class="dialog-header">信息广播</div>
<div class="iscs-pis-dialog-info">
<el-radio-group v-model="addModel.infoType">
<el-radio-group v-model="addModel.infoType" @change="getResourcesList">
<el-radio label="realTime">实时信息</el-radio>
<el-radio label="common">普通信息</el-radio>
<el-radio label="emergency" class="iscs-pis-dialog-emergencyInfo">紧急信息</el-radio>
<el-radio label="RECORDING">普通信息</el-radio>
<el-radio label="EMERGENCY_RECORDING" class="iscs-pis-dialog-emergencyInfo">紧急信息</el-radio>
</el-radio-group>
</div>
<div v-show="addModel.infoType !== 'realTime'" class="secondary-title">{{ this.message[this.addModel.infoType].title }}</div>
<div v-show="addModel.infoType !== 'realTime'" class="information-description-box">
<div v-for="(item,index) in message[addModel.infoType].infoList" :key="index">
<div class="information-box">{{ item.title }}</div>
<div v-for="(item,index) in resourcesList" :key="index">
<div
class="information-box"
:style="{ background: index == resourceIndex? '#4169cc': '#DCDCDC' }"
@click="chooseResources(item, index)"
>
{{ item.name }}
</div>
</div>
</div>
<div v-show="addModel.infoType === 'realTime'">
@ -45,19 +51,19 @@
</el-col>
</el-row>
</div>
<div style="margin-top: 10px">
<div v-show="addModel.infoType === 'realTime'" style="margin-top: 10px">
<div style="display: inline;">名称：</div>
<input v-model="addModel.infoTitle" class="pis-dialog-input" style="width: 550px;">
<input v-show="addModel.infoType !== 'emergency'" v-model="addModel.infoTime" class="pis-dialog-input" style="width: 140px;">
<div v-show="addModel.infoType !== 'emergency'" style="display: inline;">次</div>
<input v-model="addModel.infoTime" class="pis-dialog-input" style="width: 140px;">
<div style="display: inline;">次</div>
</div>
<div v-show="addModel.infoType !== 'realTime'" class="secondary-title" style="margin-top: 10px">{{ this.message[this.addModel.infoType].title + '内容显示' }}</div>
<div v-show="addModel.infoType !== 'realTime'" class="information-context-box">站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类</div>
<div v-show="addModel.infoType !== 'realTime'" class="secondary-title" style="margin-top: 10px">{{ resource.name? resource.name: '' + '内容显示' }}</div>
<div v-show="addModel.infoType !== 'realTime'" class="information-context-box">{{ resource.desc }}</div>
<div v-show="addModel.infoType === 'realTime'" class="information-description-box" style="margin-top: 15px;">
<el-row>
<el-col :span="6" style="border-right:2px solid #898888; min-height: 100px">
<div v-for="(item,index) in message[addModel.infoType].infoList" :key="index">
<div class="information-box" @click="selectedRealTimeInfo(item)">{{ item.title }}</div>
<div v-for="(item,index) in resourcesList" :key="index">
<div class="information-box" @click="selectedRealTimeInfo(item)">{{ item.name }}</div>
</div>
</el-col>
<el-col>
@ -171,14 +177,18 @@
</template>
<script>
import { queryIscsResourcesCod } from '@/api/iscs';
export default {
name: 'VoiceBroadcast',
data() {
return {
visible: false,
value: '',
resourcesList: [],
resourceIndex: 0,
resource: {},
addModel: {
infoType: 'common',
infoType: 'RECORDING',
infoTitle: '',
infoTime: '',
infoContent: '',
@ -197,103 +207,15 @@ export default {
message: {
realTime: {
title: '实时信息',
infoList:[
{
title: 'mes1实时信息',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
infoList:[]
},
{
title: 'mes2',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
},
{
title: 'mes3',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
},
{
title: 'mes4',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
},
{
title: 'mes5',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
},
{
title: 'mes6',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
},
{
title: 'mes7',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
}
]
},
common: {
RECORDING: {
title: '普通信息',
infoList:[
{
title: 'mes1普通信息',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
infoList:[]
},
{
title: 'mes2',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
},
{
title: 'mes3',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
},
{
title: 'mes4',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
},
{
title: 'mes5',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
}
]
},
emergency: {
EMERGENCY_RECORDING: {
title: '紧急信息',
infoList:[
{
title: '紧急信息',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
},
{
title: 'mes2',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
},
{
title: 'mes3',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
},
{
title: 'mes4',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
},
{
title: 'mes5',
content: '站台有乘客越出X色安全线，站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
}
]
infoList:[]
}
}
};
@ -307,12 +229,31 @@ export default {
},
doShow() {
this.visible = true;
this.getResourcesList();
},
releaseBroadcast() {
this.visible = false;
this.$emit('releaseBroadcast', this.resource);
},
selectedRealTimeInfo(item) {
this.showRealTimeInfo = item.content;
},
chooseResources(item, index) {
this.resource = item;
this.resourceIndex = index;
},
getResourcesList() {
if (this.addModel.infoType === 'realTime') {
return;
}
const params = { mapId: this.$route.query.mapId, system: 'PIS', type: this.addModel.infoType };
queryIscsResourcesCod(params).then(resp => {
this.resourcesList = resp.data && resp.data[0] ? resp.data[0].resources : [];
this.resource = this.resourcesList[0] ? this.resourcesList[0] : {};
this.resourceIndex = 0;
}).catch( () => {
this.$message.error('获取广播资源列表失败！');
} );
}
}
};
@ -344,6 +285,7 @@ export default {
white-space: nowrap;
background: #DCDCDC;
margin-top: 2px;
cursor: pointer;
}
.secondary-title{
text-align: center;

42
src/views/iscs/iscsSystem/config/pis/mainScreen.vue
View File

@ -73,11 +73,13 @@
</div>
</div>
</div>
<info-broadcast ref="infoBroadcast" />
<audio id="voice" controls style="width: 0;height: 0;" />
<info-broadcast ref="infoBroadcast" @releaseBroadcast="releaseBroadcast" />
</div>
</template>
<script>
import { getByGroupStationList } from '@/api/jmap/map';
import { queryIscsDeviceCod } from '@/api/iscs';
import InfoBroadcast from './infoBroadcast';
export default {
name:'MainScreen',
@ -104,19 +106,34 @@ export default {
async created () {
// 请求当前线路车站列表
try {
const positionMap = {
LCD: 0,
UP_STAND: 1,
DOWN_STAND: 2,
GATE: 3,
PROPERTY: 4,
OVERPASS1: 5,
OVERPASS2: 6,
LED:7
};
const res = await getByGroupStationList(this.$route.query.group);
const resp = await queryIscsDeviceCod({ mapId: this.$route.query.mapId, system: 'PIS' });
if (res.code == 200) {
this.stationList = [];
res.data.forEach(station => {
if (!station.depot) {
const children = [{status:'none'}, {status:'none'}, {status:'none'}, {status:'none'}, {status:'none'}, {status:'none'}, {status:'none'}, {status:'none'}];
if (resp.code == 200) {
resp.data && resp.data.forEach(item => {
if (station.code == item.station) {
const index = positionMap[item.position];
children[index].status = 'default';
}
});
}
const param = {
stationName: station.name,
children:[
{status:'none'}, {status:'default'},
{status:'default'}, {status:'default'},
{status:'none'}, {status:'none'},
{status:'none'}, {status:'default'}
]
children:children
};
this.stationList.push(param);
}
@ -131,7 +148,16 @@ export default {
showInfoBrroadcast() {
this.$refs.infoBroadcast.doShow();
},
stopBroadcast() {
const audio = document.getElementById('voice');
audio.pause();
},
releaseBroadcast(voice) {
const voiceUrl = this.$store.state.user.resourcesUrl + voice.url;
const audio = document.getElementById('voice');
audio.src = voiceUrl;
audio.play();
},
selectArea(stationName, index) {
const elem = stationName + '-' + index;
if (this.selectedAreaList.includes(elem)) {

26
src/views/system/iscsDeviceManage/add.vue
View File

@ -24,6 +24,16 @@
/>
</el-select>
</el-form-item>
<el-form-item label="系统" prop="system">
<el-select v-model="formModel.system" placeholder="请选择">
<el-option
v-for="item in systemList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="设备位置" prop="position">
<el-select v-model="formModel.position" placeholder="请选择">
<el-option
@ -76,6 +86,12 @@ export default {
default: function () {
return [];
}
},
systemList: {
type: Array,
default: function () {
return [];
}
}
},
data() {
@ -84,6 +100,7 @@ export default {
formModel: {
id: '',
code: '',
system: '',
mapId: '',
station: '',
position: '',
@ -102,6 +119,9 @@ export default {
mapId: [
{ required: true, message: '请选择地图', trigger: 'change' }
],
system: [
{ required: true, message: '请选择系统', trigger: 'change' }
],
station: [
{ required: true, message: '请选择车站', trigger: 'change' }
],
@ -125,12 +145,16 @@ export default {
if (data) {
this.formModel.id = data.id;
this.formModel.mapId = data.mapId;
this.formModel.system = data.system;
this.formModel.code = data.code;
this.formModel.station = data.station;
this.formModel.position = data.position;
this.formModel.type = data.type;
}
this.dialogVisible = true;
this.$nextTick(() => {
this.$refs.ruleForm.resetFields();
});
},
mapIdChange(value) {
getStationList(value).then(resp => {
@ -145,6 +169,7 @@ export default {
const data = {
id: this.formModel.id,
mapId: this.formModel.mapId,
system: this.formModel.system,
code: this.formModel.code,
station: this.formModel.station,
position: this.formModel.position,
@ -175,6 +200,7 @@ export default {
this.formModel = {
id: '',
mapId: '',
system: '',
code: '',
station: '',
position: '',

24
src/views/system/iscsDeviceManage/index.vue
View File

@ -6,6 +6,7 @@
:map-list="mapList"
:position-list="positionList"
:type-list="typeList"
:system-list="systemList"
@reloadTable="reloadTable"
/>
</div>
@ -49,6 +50,14 @@ const typeList = [
{ label: 'LED', value: 'LED' },
{ label: 'LCD', value: 'LCD' }
];
const systemMap = {
PA: '广播系统',
PIS: '乘客信息'
};
const systemList = [
{ value: 'PA', label: '广播信息' },
{ value: 'PIS', label: '乘客信息' }
];
export default {
name: 'DeviceManage',
components: {
@ -60,6 +69,7 @@ export default {
mapList: [],
positionList: positionList,
typeList: typeList,
systemList: systemList,
url: '',
pagerConfig: {
pageSize: 'pageSize',
@ -80,6 +90,13 @@ export default {
type: 'text',
label: 'code'
},
system: {
type: 'select',
label: '系统',
config: {
data: systemList
}
},
position: {
type: 'select',
label: '设备位置',
@ -116,6 +133,13 @@ export default {
title: '车站编号',
prop: 'station'
},
{
title: '系统',
prop: 'system',
type: 'tag',
columnValue: (row) => { return systemMap[row.system]; },
tagType: (row) => { return 'success'; }
},
{
title: '设备位置',
prop: 'position',

3
src/views/system/iscsResourcesManage/add.vue
View File

@ -127,6 +127,9 @@ export default {
this.formModel.resourceIds = data.resourceIds;
}
this.dialogVisible = true;
this.$nextTick(() => {
this.$refs.ruleForm.resetFields();
});
},
doSave() {
this.$refs.ruleForm.validate(() => {

6
src/views/system/iscsResourcesManage/index.vue
View File

@ -25,11 +25,13 @@ const systemList = [
];
const typeMap = {
RECORDING: '预录',
EMERGENCY_RECORDING: '紧急预录'
EMERGENCY_RECORDING: '紧急预录',
BGM: '背景音乐'
};
const typeList = [
{ value: 'RECORDING', label: '预录' },
{ value: 'EMERGENCY_RECORDING', label: '紧急预录' }
{ value: 'EMERGENCY_RECORDING', label: '紧急预录' },
{ value: 'BGM', label: '背景音乐' }
];
export default {
name: 'DeviceManage',

1
src/views/system/voiceTraining/index.vue
View File

@ -51,6 +51,7 @@ export default {
},
methods: {
getUrl(el) {
console.log(el.filePath);
return `https://joylink.club/oss/joylink${el.filePath}`;
},
covertTime(time) {