This commit is contained in:
“sunzy” 2022-01-21 17:36:42 +08:00
commit 6723006d27
29 changed files with 2714 additions and 429 deletions

49
src/api/audioResources.js Normal file
View File

@ -0,0 +1,49 @@
import request from '@/utils/request';
// 创建音频资源
export function createAudioResources(data) {
return request({
url: `/api/audioResources`,
method: 'post',
data
});
}
// 查询所有音频资源
export function queryAllAudioResources() {
return request({
url: `/api/audioResources/list`,
method: 'get'
});
}
// 删除音频资源
export function deleteAudioResources(id) {
return request({
url: `/api/audioResources/${id}`,
method: 'delete'
});
}
// 更新音频资源
export function updateAudioResources(id, data) {
return request({
url: `/api/audioResources/${id}`,
method: 'put',
data
});
}
// 分页查询音频资源
export function pagedAudioResources(params) {
return request({
url: `/api/audioResources/paged`,
method: 'get',
params
});
}
// 上传音频文件
export function uploadAudio(file) {
return request({
url: `/api/upload/AUDIO?appId=00001&appSecret=joylink00001`,
method: 'post',
data: file,
upload: true
});
}

View File

@ -49,3 +49,116 @@ export function queryHasIscs(params) {
params
});
}
// iscs设备创建
export function createIscsDevcie(data) {
return request({
url: `/api/iscsDevice`,
method: 'post',
data
});
}
// 查询所有iscs设备
export function queryAllIscsDevice() {
return request({
url: `/api/iscsDevice/all`,
method: 'get'
});
}
// 根据id查询iscs设备
export function queryIscsDevcieById(id) {
return request({
url:
`/api/iscsDevice/${id}`,
method: 'get'
});
}
// 根据mapId获取Iscs设备list
export function queryIscsDeviceListByMapId(mapId) {
return request({
url: `/api/iscsDevice/list/mapId/${mapId}`,
method: 'get'
});
}
// 分页查询ISCS设备
export function pagedIscsDevice(params) {
return request({
url: `/api/iscsDevice/paged`,
method: 'get',
params
});
}
// 删除ISCS设备
export function deleteIscsDevice(id) {
return request({
url: `/api/iscsDevice/${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 batchCreateIscsDevcie(data) {
return request({
url: `/api/iscsDevice/create/batch`,
method: 'post',
data
});
}
// 创建ISCS系统资源
export function createIscsResources(data) {
return request({
url: `/api/systemRes`,
method: 'post',
data
});
}
// 查询所有ISCS系统资源
export function queryAllIscsResources() {
return request({
url: `/api/systemRes/all`,
method: 'get'
});
}
// 根据id查询ISCS系统资源
export function queryIscsResourcesById(id) {
return request({
url: `/api/systemRes/${id}`,
method: 'get'
});
}
// 分页查询ISCS系统资源
export function pagedIscsResources(params) {
return request({
url: `/api/systemRes/paged`,
method: 'get',
params
});
}
// 删除ISCS系统资源
export function deleteIscsResources(id) {
return request({
url: `/api/systemRes/${id}`,
method: 'delete'
});
}
// 按条件查询ISCS系统资源
export function queryIscsResourcesCod(params) {
return request({
url: `/api/systemRes/list/criteria`,
method: 'get',
params
});
}

View File

@ -505,3 +505,11 @@ export function srTrainControl(group, params) {
params
});
}
/** 条件查询仿真中的ISCS资源 */
export function queryIscsResourcesByGroup(group, params) {
return request({
url: `simulation/${group}/iscs/systemResources`,
method: 'get',
params
});
}

View File

@ -100,5 +100,8 @@ export default {
voiceTraining: 'Voice Training',
mapGroup: 'Map Group',
drawingMange:'Drawing Mange',
projectServer: 'Project Server'
projectServer: 'Project Server',
audioResourcesManage: 'Audio Resources Manage',
iscsDeviceManage: 'ISCS Device Manage',
iscsResourcesManage: 'ISCS Resources Manage'
};

View File

@ -104,5 +104,8 @@ export default {
voiceTraining: '语音训练',
mapGroup: '地图分组',
drawingMange:'图纸管理',
projectServer: '项目域名'
projectServer: '项目域名',
audioResourcesManage: '音频资源管理',
iscsDeviceManage: 'ISCS设备管理',
iscsResourcesManage: 'ISCS资源管理'
};

View File

@ -192,6 +192,9 @@ const UploadPdfList = () => import('@/views/uploadPdf/list');
const ThirdLogin = () => import('@/views/thirdLogin');
const ProjectServer = () => import('@/views/system/serverManage');
const VoiceManage = () => import('@/views/fileManage/voiceManage');
const IscsDeviceManage = () => import('@/views/system/iscsDeviceManage');
const IscsResourcesManage = () => import('@/views/system/iscsResourcesManage');
// import { GenerateRouteProjectList } from '@/scripts/ProjectConfig';
// import { getSessionStorage } from '@/utils/auth';
@ -1210,6 +1213,20 @@ export const asyncRouter = [
meta: {
i18n: 'router.projectServer'
}
},
{
path: 'iscsDeviceManage',
component: IscsDeviceManage,
meta: {
i18n: 'router.iscsDeviceManage'
}
},
{
path: 'iscsResourcesManage',
component: IscsResourcesManage,
meta: {
i18n: 'router.iscsResourcesManage'
}
}
// {
// path: 'deviceManage',
@ -1255,6 +1272,13 @@ export const asyncRouter = [
meta: {
i18n: 'router.uploadPdf'
}
},
{
path: 'audioResources',
component: VoiceManage,
meta: {
i18n: 'router.audioResourcesManage'
}
}
]
},

View File

@ -341,6 +341,8 @@ const socket = {
simulationAlarmInfo: [], // 仿真报警信息
deviceStateMessages: null, // 新版订阅设备状态消息
iscsStateMessages: null, // iscs设备状态消息
iscsStatePaMessages: null, // iscsPA设备状态消息
iscsStatePisMessages: null, // iscsPIS设备状态消息
simulationSpeed: 1, // 仿真倍速
simulationPause: false,
simulationPslStatus: [], // PSL面板按钮状态信息
@ -425,6 +427,12 @@ const socket = {
},
setIscsStateMessages: (state, speed) => {
state.iscsStateMessages = speed;
},
setIscsStatePaMessages: (state, speed) => {
state.iscsStatePaMessages = speed;
},
setIscsStatePisMessages: (state, speed) => {
state.iscsStatePisMessages = speed;
}
},
@ -513,6 +521,12 @@ const socket = {
},
handleIscsState:({ commit }, state) => {
commit('setIscsStateMessages', state);
},
handleIscsPaState:({ commit }, state) => {
commit('setIscsStatePaMessages', state);
},
handleIscsPisState:({ commit }, state) => {
commit('setIscsStatePisMessages', state);
}
}
};

View File

@ -1,4 +1,3 @@
import store from '@/store/index';
// export function getBaseUrl() {
// let BASE_API;
// if (process.env.NODE_ENV === 'development') {

View File

@ -29,6 +29,9 @@ service.interceptors.request.use(config => {
if (store.state.user.baseUrl) {
config.baseURL = store.state.user.baseUrl;
}
if (config.upload) {
config.baseURL = urlData.UPLOAD_API;
}
if (config.time) {
config.timeout = config.time; // 让每个请求携带自定义token 请根据实际情况自行修改

View File

@ -25,6 +25,12 @@ export function getTopic(type, group, stationCode) {
case 'ISCSPSD':
topic = `/queue/simulation/${group}/iscs/psd/${stationCode}`;
break;
case 'ISCSPA':
topic = `/queue/simulation/${group}/iscs/pa`;
break;
case 'ISCSPIS':
topic = `/queue/simulation/${group}/iscs/pis`;
break;
}
return topic;
}
@ -50,8 +56,12 @@ function callback(Response) {
store.dispatch('socket/setSimulationTimeSync', Number.parseInt(Response.body));
} else if (Response.headers.destination.includes('state')) {
store.dispatch('socket/handleSimulationState', Number.parseInt(Response.body));
} else if (Response.headers.destination.includes('iscs')) {
} else if (Response.headers.destination.includes('iscs/psd')) {
store.dispatch('socket/handleIscsState', JSON.parse(Response.body));
} else if (Response.headers.destination.includes('iscs/pa')) {
store.dispatch('socket/handleIscsPaState', JSON.parse(Response.body));
} else if (Response.headers.destination.includes('iscs/pis')) {
store.dispatch('socket/handleIscsPisState', JSON.parse(Response.body));
} else {
const data = JSON.parse(Response.body);
store.dispatch('socket/setStomp', data);

View File

@ -0,0 +1,217 @@
<template>
<el-dialog v-dialogDrag :title="title" :visible.sync="dialogVisible" width="580px" :before-close="handleClose" center :close-on-click-modal="false">
<el-form ref="ruleForm" :model="formModel" :rules="rules" label-width="60px">
<el-form-item label="名称" prop="name">
<el-input v-model="formModel.name" />
</el-form-item>
<el-form-item label="描述" prop="desc">
<el-input v-model="formModel.desc" />
</el-form-item>
<el-form-item label="url" prop="url">
<el-row>
<el-col :span="18">
<el-input v-model="formModel.url" :disabled="true" style="width: 340px;" />
</el-col>
<el-col :span="6">
<el-upload
ref="replaceUploader"
v-model="newChapter.title"
:file-list="replaceList"
class="avatar-uploader"
action="https://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>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button v-loading="loading" type="primary" @click="doSave">{{ $t('global.confirm') }}</el-button>
<el-button @click="handleClose">{{ $t('global.cancel') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { createAudioResources, updateAudioResources} from '@/api/audioResources';
export default {
name: 'DeviceAdd',
data() {
return {
replaceList: [],
newChapter: { title: '' },
dialogVisible: false,
formModel: {
id: '',
name: '',
desc: '',
url: ''
},
loading: false
};
},
computed: {
rules() {
const crules = {
name: [
{ required: true, message: '请输入音频资源名称', trigger: 'blur' }
],
desc: [
{ required: true, message: '请输入音频资源描述', trigger: 'blur' }
],
url: [
{ required: true, message: '请录入音频资源', trigger: 'blur' }
]
};
return crules;
},
title() {
return this.formModel.id ? '修改音频资源' : '创建音频资源';
}
},
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) {
this.dialogVisible = true;
if (data) {
this.formModel.id = data.id;
this.formModel.name = data.name;
this.formModel.desc = data.desc;
this.formModel.url = data.url;
} else {
this.$nextTick(() => {
this.$refs.ruleForm.resetFields();
});
}
},
doSave() {
this.$refs.ruleForm.validate((valid) => {
if (valid) {
this.loading = true;
const data = {
id: this.formModel.id,
name: this.formModel.name,
desc: this.formModel.desc,
url: this.formModel.url
};
if (data.id) {
updateAudioResources(data.id, data).then(resp => {
this.$message.success('修改音频资源数据成功!');
this.handleClose();
this.$emit('reloadTable');
}).catch(error => {
this.$message.error(error.message);
this.loading = false;
});
} else {
createAudioResources(data).then(resp => {
this.$message.success('创建音频资源数据成功!');
this.handleClose();
this.$emit('reloadTable');
}).catch(error => {
this.$message.error(error.message);
this.loading = false;
});
}
}
});
},
handleClose() {
this.formModel = {
id: '',
name: '',
desc: '',
url: ''
};
this.$refs.ruleForm.resetFields();
this.dialogVisible = false;
this.loading = false;
}
}
};
</script>
<style lang="scss" scoped>
.chat-box-footer-create{
font-size: 16px;
text-align: center;
color: #fff;
position: relative;
left: 5px;
top: 6px;
line-height: 30px;
cursor: pointer;
width: 40px;
height: 40px;
border-radius: 50%;
background: green;
border: none;
display: flex;
justify-content: center;
align-items: center;
}
.chat-box-footer-send{
background: #F2F2F2;
right: 55px;
cursor: pointer;
.icon-yuyin{
color: #333;
font-size: 24px;
margin: 0;
}
&.active{
.icon-yuyin{
color: green;
}
}
.close_icon{
position: absolute;
top: 8px;
left: 45px;
font-size: 16px;
color: #333;
font-weight: 600;
padding: 3px;
}
}
#record_progress_bar{
width: 40px;
height: 40px;
position: absolute;
left: 0;
top: 0;
border-radius: 50%;
}
</style>

View File

@ -0,0 +1,131 @@
<template>
<div>
<QueryListPage ref="queryListPage" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
<add-voice ref="addVoice" @reloadTable="reloadTable" />
</div>
</template>
<script>
import { pagedAudioResources, deleteAudioResources } from '@/api/audioResources';
import AddVoice from './add';
export default {
name: 'DeviceManage',
components: {
AddVoice
},
data() {
return {
examResultList: [],
url: '',
pagerConfig: {
pageSize: 'pageSize',
pageIndex: 'pageNum'
},
queryForm: {
labelWidth: '120px',
reset: true,
queryObject: {
name: {
type: 'text',
label: '名称:'
},
desc: {
type: 'text',
label: '描述'
}
}
},
queryList: {
query: pagedAudioResources,
selectCheckShow: false,
indexShow: true,
columns: [
{
title: '名称',
prop: 'name'
},
{
title: '描述',
prop: 'desc'
},
{
title: 'url',
prop: 'url'
},
{
title: '创建时间',
prop: 'createTime',
type: 'tag',
columnValue: (row) => { return this.handleTime(row.createTime); },
tagType: (row) => { return 'success'; }
},
{
type: 'button',
title: this.$t('global.operate'),
width: '300',
buttons: [
{
name: '编辑',
handleClick: this.editConfig
},
{
name: this.$t('global.delete'),
handleClick: this.handleDelete,
type: 'danger'
}
]
}
],
actions: [
{ text: this.$t('global.add'), handler: this.createAudioResources}
]
},
currentModel: {}
};
},
computed: {
},
mounted() {
},
methods: {
createProjectDevice() {
this.$refs.add.show();
},
handleTime(time) {
const timeList = time.split('T');
let newTime = '';
if (timeList.length > 1) {
newTime = timeList[0] + ' ' + timeList[1];
} else {
newTime = time;
}
return newTime;
},
//
handleDelete(index, row) {
this.$confirm('此操作将删除该音频资源数据!', this.$t('global.tips'), {
confirmButtonText: this.$t('global.confirm'),
cancelButtonText: this.$t('global.cancel'),
type: 'warning'
}).then(() => {
deleteAudioResources(row.id).then(response => {
this.$message.success(this.$t('system.deleteSuccess'));
this.reloadTable();
}).catch(() => {
this.reloadTable();
this.$messageBox(this.$t('error.deleteFailed'));
});
});
},
createAudioResources() {
this.$refs.addVoice.show();
},
editConfig(index, row) {
this.$refs.addVoice.show(row);
},
reloadTable() {
this.queryList.reload();
}
}
};
</script>

View File

@ -14,14 +14,14 @@
<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, i + '-' + j)">
<div class="pa-table-content" @click="clickArea(i,j)">
<div class="pa-table-content-inside" :style="{background: selectedAreaList.includes(i + '-' + j)? '#2EFF74':'#CDCDCD'}" />
</div>
<div style="display: inline-block;margin-left: 5px;height: 18px;line-height: 18px;transform: translateY(-25%);color: #192780;">0</div>
<div :id="'state-' +i + '-' + j" class="pa-tabel-state-box">{{ deviceMap[i+ '-' +j].state }}</div>
</div>
</div>
</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,15 +76,21 @@
<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 } from '@/api/iscs';
import { queryIscsResourcesByGroup } from '@/api/simulation';
import MusicIcon from '@/assets/iscs_icon/music_icon.png';
import StateTable from './stateTable';
import VoiceBroadcast from './voiceBroadcast';
import { getToken } from '@/utils/auth';
import { sendCommandNew } from '@/api/jmap/training';
import { creatSubscribe, clearSubscribe, getTopic } from '@/utils/stomp';
export default {
name: 'CenterHome',
components: {
@ -94,19 +100,26 @@ 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'}
],
verticalIndexList: ['LCD', 'UP_STAND', 'DOWN_STAND', 'ADMINISTRATIVE_AREA', 'GATE', 'TRANSFER_CHANNEL'],
musicIcon: MusicIcon,
selectedAreaList: [],
stationList: [],
videoMode: 'common'
iscsDeviceList: [],
resourcesList: [],
videoMode: 'RECORDING',
iscsDeviceMap: {},
bgmResources: '',
deviceMap: {}
};
},
computed: {
@ -114,6 +127,68 @@ export default {
return this.stationList.length * 135 + 80;
}
},
watch: {
'$store.state.socket.iscsStatePaMessages': function (list) {
if (list && list.length) {
list.forEach(item => {
const index = this.iscsDeviceMap[item.code];
if (index) {
this.$set(this.deviceMap[index], 'state', item.state);
const div = document.getElementById('state-' + index);
if (div) {
switch (item.state) {
case '0':
div.style.background = '#CCCCCC';
break;
case '1':
div.style.background = '#FF0000';
break;
case '2':
div.style.background = '#880000';
break;
case '3':
div.style.background = '#0000FF';
break;
case '4':
div.style.background = '#554488';
break;
case '5':
div.style.background = '#44CC55';
break;
case '6':
div.style.background = '#FF00FF';
break;
case '7':
div.style.background = '#887711';
break;
case '8':
div.style.background = '#006600';
break;
case '9':
div.style.background = '#778877';
break;
case '10':
div.style.background = '#555454';
break;
case '11':
div.style.background = '#556688';
break;
case '12':
div.style.background = '#887711';
break;
case '13':
div.style.background = '#115577';
break;
case '♬':
div.style.background = '';
break;
}
}
}
});
}
}
},
async created () {
// 线
const res = await getByGroupStationList(this.$route.query.group);
@ -121,12 +196,125 @@ 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;
this.subscribe();
}
const params = { system: 'PA', type: 'BGM' };
queryIscsResourcesByGroup( this.$route.query.group, params).then(resp => {
this.bgmResources = resp.data && resp.data[0] ? resp.data[0].resources : [];
}).catch( () => {
this.$message.error('获取广播资源列表失败!');
} );
this.getResourcesList();
},
beforeDestroy() {
this.clearSubscribe();
},
methods: {
getResourcesList() {
const params = {system: 'PA', type: this.videoMode };
queryIscsResourcesByGroup(this.$route.query.group, params).then(resp => {
this.resourcesList = resp.data && resp.data[0] ? resp.data[0].resources : [];
}).catch( () => {
this.$message.error('获取广播资源列表失败!');
} );
},
playBgm() {
const iscsDeviceCodes = [];
this.selectedAreaList.forEach(item => {
if (this.deviceMap[item]) {
iscsDeviceCodes.push(this.deviceMap[item].code);
}
});
if (!iscsDeviceCodes.length) {
this.$message.error('请选择广播设备');
return;
}
if (this.bgmResources && this.bgmResources[0]) {
const params = {
resourceId: this.bgmResources[0].id,
iscsDeviceCodes: iscsDeviceCodes,
type: 'BGM'
};
sendCommandNew(this.$route.query.group, 'ISCS_PA_Play', params).then(resp => {
const bgmUrl = this.$store.state.user.resourcesUrl + this.bgmResources[0].url;
const audio = document.getElementById('voice');
audio.src = bgmUrl;
audio.play();
}).catch(() => {
this.$message.error('背景音乐播放失败!');
});
} else {
this.$message.error('暂无背景音乐数据!');
}
},
stopBgm() {
const iscsDeviceCodes = [];
this.selectedAreaList.forEach(item => {
if (this.deviceMap[item]) {
iscsDeviceCodes.push(this.deviceMap[item].code);
}
});
if (!iscsDeviceCodes.length) {
this.$message.error('请选择广播设备');
return;
}
sendCommandNew(this.$route.query.group, 'ISCS_PA_Stop_Playing', { iscsDeviceCodes: iscsDeviceCodes }).then(resp => {
const audio = document.getElementById('voice');
audio.pause();
}).catch(() => {
this.$message.error('背景音乐终止播放失败!');
});
},
stopBroadcast() {
const iscsDeviceCodes = [];
this.selectedAreaList.forEach(item => {
if (this.deviceMap[item]) {
iscsDeviceCodes.push(this.deviceMap[item].code);
}
});
if (!iscsDeviceCodes.length) {
this.$message.error('请选择广播设备');
return;
}
sendCommandNew(this.$route.query.group, 'ISCS_PA_Stop_Playing', { iscsDeviceCodes: iscsDeviceCodes }).then(resp => {
const audio = document.getElementById('voice');
audio.pause();
}).catch(() => {
this.$message.error('广播终止播放失败!');
});
},
releaseBroadcast(voice) {
const iscsDeviceCodes = [];
this.selectedAreaList.forEach(item => {
if (this.deviceMap[item]) {
iscsDeviceCodes.push(this.deviceMap[item].code);
}
});
if (!iscsDeviceCodes.length) {
this.$message.error('请选择广播设备');
return;
}
const params = {
resourceId: voice.id,
iscsDeviceCodes: iscsDeviceCodes,
type: this.videoMode
};
sendCommandNew(this.$route.query.group, 'ISCS_PA_Play', params).then(resp => {
this.voiceUrl = this.$store.state.user.resourcesUrl + voice.url;
const audio = document.getElementById('voice');
audio.src = this.voiceUrl;
audio.play();
}).catch(() => {
this.$message.error('发布广播失败!');
});
},
clickArea(i, j) {
if (this.selectedAreaList.includes(i + '-' + j)) {
const index = this.selectedAreaList.indexOf(i + '-' + j);
@ -135,6 +323,12 @@ export default {
this.selectedAreaList.push(i + '-' + j);
}
},
checkHasDevice(item, station, index) {
const device = this.iscsDeviceList.find(elem => elem.station == station.code && elem.position == item.position);
this.deviceMap[index] = device;
if (device) { this.iscsDeviceMap[device.code] = index; }
return !!device;
},
selectedBatch(data) {
data.active = !data.active;
if (data.key == 'station') {
@ -177,10 +371,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,9 +390,19 @@ export default {
},
selectedVideoMode(mode) {
this.videoMode = mode;
this.getResourcesList();
},
showBroadcastContent() {
this.$refs.voiceBroadcast.doShow();
},
subscribe() {
this.clearSubscribe();
const header = { group: this.$route.query.group || '', 'X-Token': getToken() };
creatSubscribe(getTopic('ISCSPA', this.$route.query.group ), header);
this.$store.dispatch('app/animationsClose');
},
clearSubscribe() {
clearSubscribe(getTopic('ISCSPA', this.$route.query.group));
}
}
};
@ -407,4 +611,17 @@ export default {
width: 2px;
height: 6px;
}
.iscs-pa-table {
height: 32px;
}
.pa-tabel-state-box{
display: inline-block;
margin-left: 5px;
width: 20px;
text-align: center;
height: 18px;
line-height: 18px;
transform: translateY(-25%);
color: #000;
}
</style>

View File

@ -1,7 +1,7 @@
<template>
<div style="height: 100%; overflow-y: auto;">
<center-home v-if="currentSystem === 'center'" />
<station-home v-else-if="currentSystem === 'local'" />
<center-home v-if="currentSystem === 'center' || stationId === 'controlCenter'" />
<station-home v-else-if="currentSystem === 'local' || stationId" />
</div>
</template>
@ -16,16 +16,19 @@ export default {
},
data() {
return {
currentSystem: ''
currentSystem: '',
stationId: ''
};
},
watch:{
$route() {
this.currentSystem = this.$route.query.currentSystem;
this.stationId = this.$route.query.stationId;
}
},
mounted() {
this.currentSystem = this.$route.query.currentSystem;
this.stationId = this.$route.query.stationId;
}
};
</script>

View File

@ -16,18 +16,18 @@
<el-col :span="3"><div style="background: #880000;color: #000; text-align: center">2</div></el-col>
<el-col :span="9"><div>联动消防广播</div></el-col>
<el-col :span="3"><div style="background: #778877;color: #000; text-align: center">9</div></el-col>
<el-col :span="9"><div>中心普通</div></el-col>
<el-col :span="9"><div>中心普通</div></el-col>
</el-row>
<el-row style="margin-bottom: 10px" :gutter="10">
<el-col :span="3"><div style="background: #0000FF;color: #000; text-align: center">3</div></el-col>
<el-col :span="9"><div>环调话筒广播</div></el-col>
<el-col :span="3"><div style="background: #555454;color: #000; text-align: center">11</div></el-col>
<el-col :span="9"><div>车站普通</div></el-col>
<el-col :span="3"><div style="background: #555454;color: #000; text-align: center">10</div></el-col>
<el-col :span="9"><div>车站普通</div></el-col>
</el-row>
<el-row style="margin-bottom: 10px" :gutter="10">
<el-col :span="3"><div style="background: #554488;color: #000; text-align: center">4</div></el-col>
<el-col :span="9"><div>中心紧急</div></el-col>
<el-col :span="3"><div style="background: #556688;color: #000; text-align: center">12</div></el-col>
<el-col :span="9"><div>中心紧急</div></el-col>
<el-col :span="3"><div style="background: #556688;color: #000; text-align: center">11</div></el-col>
<el-col :span="9"><div>ATS预录</div></el-col>
</el-row>
<el-row style="margin-bottom: 10px" :gutter="10">
@ -38,12 +38,12 @@
</el-row>
<el-row style="margin-bottom: 10px" :gutter="10">
<el-col :span="3"><div style="background: #FF00FF;color: #000; text-align: center">6</div></el-col>
<el-col :span="9"><div>车站紧急</div></el-col>
<el-col :span="9"><div>车站紧急</div></el-col>
<el-col :span="3"><div style="background: #115577;color: #000; text-align: center">13</div></el-col>
<el-col :span="9"><div>设备通讯失败</div></el-col>
</el-row>
<el-row style="margin-bottom: 10px" :gutter="10">
<el-col :span="3"><div><img style="width: 15px;" :src="musicIcon"></div></el-col>
<el-col :span="3"><div style="color: #000;font-size: 16px"></div></el-col>
<el-col :span="9"><div>背景音乐</div></el-col>
<el-col :span="3"><div style="background: #FFFFFF;width: 22px;height: 13px;"><div class="pa-check-box-small" /></div></el-col>
<el-col :span="9"><div>被选择</div></el-col>

View File

@ -13,55 +13,55 @@
<el-row style="border-bottom: 3px solid #fff;height: 60px;">
<el-col :span="5">
<div class="broadcast-mode-button" style="width: 70px;left: 5%;" @click="selecteAllArea">
<div class="pa-check-box" :style="{background: enableAreaList.length === 7 ? '#2EFF74':'#CDCDCD'}" />
<div class="pa-check-box" :style="{background: enableAreaList.length === 6 ? '#2EFF74':'#CDCDCD'}" />
<div style="position: relative; left: 1px;display: inline-block;">全车站</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 style="position: relative; left: 25px;display: inline-block">0</div>
<div v-if="checkHasDevice('LCD')" class="broadcast-mode-button" @click="selectedArea('LCD')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('LCD')? '#2EFF74':'#CDCDCD'}" />
<div id="LCD" class="pa-state-box">{{ deviceMap['LCD'].state }}</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 style="position: relative; left: 25px;display: inline-block">0</div>
<div v-if="checkHasDevice('UP_STAND')" class="broadcast-mode-button" @click="selectedArea('UP_STAND')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('UP_STAND')? '#2EFF74':'#CDCDCD'}" />
<div id="UP_STAND" class="pa-state-box">{{ deviceMap['UP_STAND'].state }}</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 style="position: relative; left: 25px;display: inline-block">0</div>
<div v-if="checkHasDevice('DOWN_STAND')" class="broadcast-mode-button" @click="selectedArea('DOWN_STAND')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('DOWN_STAND')? '#2EFF74':'#CDCDCD'}" />
<div id="DOWN_STAND" class="pa-state-box">{{ deviceMap['DOWN_STAND'].state }}</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 style="position: relative; left: 25px;display: inline-block">0</div>
<div v-if="checkHasDevice('ADMINISTRATIVE_AREA')" class="broadcast-mode-button" @click="selectedArea('ADMINISTRATIVE_AREA')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('ADMINISTRATIVE_AREA')? '#2EFF74':'#CDCDCD'}" />
<div id="ADMINISTRATIVE_AREA" class="pa-state-box">{{ deviceMap['ADMINISTRATIVE_AREA'].state }}</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 style="position: relative; left: 25px;display: inline-block">0</div>
<div v-if="checkHasDevice('GATE')" class="broadcast-mode-button" @click="selectedArea('GATE')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('GATE')? '#2EFF74':'#CDCDCD'}" />
<div id="GATE" class="pa-state-box">{{ deviceMap['GATE'].state }}</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 style="position: relative; left: 25px;display: inline-block">0</div>
<div v-if="checkHasDevice('TRANSFER_CHANNEL')" class="broadcast-mode-button" @click="selectedArea('TRANSFER_CHANNEL')">
<div class="pa-check-box" style="right: 10px;" :style="{background: enableAreaList.includes('TRANSFER_CHANNEL')? '#2EFF74':'#CDCDCD'}" />
<div id="TRANSFER_CHANNEL" class="pa-state-box">{{ deviceMap['TRANSFER_CHANNEL'].state }}</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 v-if="checkHasDevice('LCD')" class="broadcast-use-button" :style="{color: enableAreaList.includes('LCD')? '#2EFF74':'#CDCDCD'}">{{ this.enableAreaList.includes('LCD')? '启用':'未启用' }}</div></el-col>
<el-col :span="3"><div v-if="checkHasDevice('UP_STAND')" class="broadcast-use-button" :style="{color: enableAreaList.includes('UP_STAND')? '#2EFF74':'#CDCDCD'}">{{ this.enableAreaList.includes('UP_STAND')? '启用':'未启用' }}</div></el-col>
<el-col :span="3"><div v-if="checkHasDevice('DOWN_STAND')" class="broadcast-use-button" :style="{color: enableAreaList.includes('DOWN_STAND')? '#2EFF74':'#CDCDCD'}">{{ this.enableAreaList.includes('DOWN_STAND')? '启用':'未启用' }}</div></el-col>
<el-col :span="3"><div v-if="checkHasDevice('ADMINISTRATIVE_AREA')" class="broadcast-use-button" :style="{color: enableAreaList.includes('ADMINISTRATIVE_AREA')? '#2EFF74':'#CDCDCD'}">{{ this.enableAreaList.includes('ADMINISTRATIVE_AREA')? '启用':'未启用' }}</div></el-col>
<el-col :span="3"><div v-if="checkHasDevice('GATE')" class="broadcast-use-button" :style="{color: enableAreaList.includes('GATE')? '#2EFF74':'#CDCDCD'}">{{ this.enableAreaList.includes('GATE')? '启用':'未启用' }}</div></el-col>
<el-col :span="3"><div v-if="checkHasDevice('TRANSFER_CHANNEL')" class="broadcast-use-button" :style="{color: enableAreaList.includes('TRANSFER_CHANNEL')? '#2EFF74':'#CDCDCD'}">{{ this.enableAreaList.includes('TRANSFER_CHANNEL')? '启用':'未启用' }}</div></el-col>
</el-row>
</div>
<div class="pre-taped-broadcast">
@ -70,23 +70,31 @@
</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">
<div style="position: relative; left: 1px;display: inline-block;">播放</div>
<div style="position: relative; left: 1px;display: inline-block;" @click="releaseBroadcast">播放</div>
</div>
</el-col>
<el-col :span="6">
<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,76 +102,76 @@
<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>
</el-row>
</div>
<div class="time-control-pa-home">
<el-row :gutter="50">
<el-col :span="2">
<div class="time-control-button">时间控制</div>
</el-col>
<el-col :span="20">
<el-row :gutter="20" style="margin-top: 5px; font-size: 13px">
<el-col :span="2">
<div style="width: 65px;color: #FFF;text-align: center;height: 28px;line-height: 28px">排定描述</div>
</el-col>
<el-col :span="22">
<el-input v-model="addModel.scheduledDescribe" size="mini" style="width: 100%" /></el-col>
</el-row>
<el-row style="margin-top: 5px; font-size: 13px">
<el-col :span="2">
<div style="width: 65px;color: #FFF;text-align: center;height: 28px;line-height: 28px">开始时间</div>
</el-col>
<el-col :span="5">
<el-date-picker
v-model="addModel.startTime"
type="datetime"
placeholder="选择日期时间"
size="mini"
/>
</el-col>
<el-col :span="2">
<div style="width: 65px;color: #FFF;text-align: center;height: 28px;line-height: 28px">结束时间</div>
</el-col>
<el-col :span="5">
<el-date-picker
v-model="addModel.endTime"
type="datetime"
placeholder="选择日期时间"
size="mini"
/>
</el-col>
<el-col :span="2">
<div style="width: 65px;color: #FFF;text-align: center;height: 28px;line-height: 28px">延时时间</div>
</el-col>
<el-col :span="5">
<el-time-picker
v-model="addModel.delayTime"
placeholder="选择时间"
size="mini"
/>
</el-col>
<el-col :span="1">
<div class="time-control-button-small">今日</div>
</el-col>
<el-col :span="1">
<div class="time-control-button-small">一次</div>
</el-col>
<el-col :span="1">
<div class="time-control-button-small" style="width: 43px;">无截</div>
</el-col>
</el-row>
</el-col>
<el-col :span="2">
<div class="time-control-button-small" style="height: 50px;width: 50px; position: relative;top: 10px;right: 30px;line-height: 14px;padding-top: 10px;padding-left: 10px">设定<br>确认</div>
</el-col>
</el-row>
</div>
<!--<div class="time-control-pa-home">-->
<!--<el-row :gutter="50">-->
<!--<el-col :span="2">-->
<!--<div class="time-control-button">时间控制</div>-->
<!--</el-col>-->
<!--<el-col :span="20">-->
<!--<el-row :gutter="20" style="margin-top: 5px; font-size: 13px">-->
<!--<el-col :span="2">-->
<!--<div style="width: 65px;color: #FFF;text-align: center;height: 28px;line-height: 28px">排定描述</div>-->
<!--</el-col>-->
<!--<el-col :span="22">-->
<!--<el-input v-model="addModel.scheduledDescribe" size="mini" style="width: 100%" /></el-col>-->
<!--</el-row>-->
<!--<el-row style="margin-top: 5px; font-size: 13px">-->
<!--<el-col :span="2">-->
<!--<div style="width: 65px;color: #FFF;text-align: center;height: 28px;line-height: 28px">开始时间</div>-->
<!--</el-col>-->
<!--<el-col :span="5">-->
<!--<el-date-picker-->
<!--v-model="addModel.startTime"-->
<!--type="datetime"-->
<!--placeholder="选择日期时间"-->
<!--size="mini"-->
<!--/>-->
<!--</el-col>-->
<!--<el-col :span="2">-->
<!--<div style="width: 65px;color: #FFF;text-align: center;height: 28px;line-height: 28px">结束时间</div>-->
<!--</el-col>-->
<!--<el-col :span="5">-->
<!--<el-date-picker-->
<!--v-model="addModel.endTime"-->
<!--type="datetime"-->
<!--placeholder="选择日期时间"-->
<!--size="mini"-->
<!--/>-->
<!--</el-col>-->
<!--<el-col :span="2">-->
<!--<div style="width: 65px;color: #FFF;text-align: center;height: 28px;line-height: 28px">延时时间</div>-->
<!--</el-col>-->
<!--<el-col :span="5">-->
<!--<el-time-picker-->
<!--v-model="addModel.delayTime"-->
<!--placeholder="选择时间"-->
<!--size="mini"-->
<!--/>-->
<!--</el-col>-->
<!--<el-col :span="1">-->
<!--<div class="time-control-button-small">今日</div>-->
<!--</el-col>-->
<!--<el-col :span="1">-->
<!--<div class="time-control-button-small">一次</div>-->
<!--</el-col>-->
<!--<el-col :span="1">-->
<!--<div class="time-control-button-small" style="width: 43px;">无截</div>-->
<!--</el-col>-->
<!--</el-row>-->
<!--</el-col>-->
<!--<el-col :span="2">-->
<!--<div class="time-control-button-small" style="height: 50px;width: 50px; position: relative;top: 10px;right: 30px;line-height: 14px;padding-top: 10px;padding-left: 10px">设定<br>确认</div>-->
<!--</el-col>-->
<!--</el-row>-->
<!--</div>-->
<div class="pa-grey-box" />
<div style="position: absolute; left: 73%; top: 70%;width: 13%;height: 30%;font-size: 12px;color: #fff;"><state-table /></div>
<div style="position: absolute; left: 73%; top: 67%;width: 13%;height: 30%;font-size: 12px;color: #fff;"><state-table /></div>
<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>
@ -173,7 +181,7 @@
<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,22 @@
<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 { queryIscsDeviceCod } from '@/api/iscs';
import { queryIscsResourcesByGroup } from '@/api/simulation';
import { sendCommandNew } from '@/api/jmap/training';
import { getToken } from '@/utils/auth';
import { creatSubscribe, clearSubscribe, getTopic } from '@/utils/stomp';
export default {
name: 'StationHome',
components: {
@ -212,8 +226,6 @@ export default {
},
data() {
return {
message: ['mes1', 'mes2', 'mes3', 'mes4', 'mes5', 'mes6', 'mes7', 'mes8', 'mes9', '站台有乘客越出X色安全线站台乘客请返回安前线内'],
broadcast: ['各位乘客为了您和他人的安全,请勿手扶屏蔽门、排队候车,多谢合作!'],
addModel: {
scheduledDescribe: '',
startTime: '',
@ -221,15 +233,277 @@ export default {
delayTime: ''
},
enableAreaList: [],
videoMode: 'common'
bgmResources: '',
videoMode: 'RECORDING',
messageIndex: 0,
resourcesList: [],
iscsDeviceMap: {},
iscsDeviceList: [],
iscsDeviceState: {},
deviceMap: {}
};
},
watch: {
'$route.query.stationId': function () {
const params2 = { mapId: this.$route.query.mapId, system: 'PA', station: this.$route.query.stationId };
queryIscsDeviceCod(params2).then(resp => {
this.iscsDeviceList = resp.data;
this.iscsDeviceList.forEach(device => {
this.$set(device, 'state', this.iscsDeviceState[device.code] ? this.iscsDeviceState[device.code].state : '0');
this.iscsDeviceMap[device.code] = device;
const div = document.getElementById(device.position);
if (div) {
switch (device.state) {
case '0':
div.style.background = '#CCCCCC';
break;
case '1':
div.style.background = '#FF0000';
break;
case '2':
div.style.background = '#880000';
break;
case '3':
div.style.background = '#0000FF';
break;
case '4':
div.style.background = '#554488';
break;
case '5':
div.style.background = '#44CC55';
break;
case '6':
div.style.background = '#FF00FF';
break;
case '7':
div.style.background = '#887711';
break;
case '8':
div.style.background = '#006600';
break;
case '9':
div.style.background = '#778877';
break;
case '10':
div.style.background = '#555454';
break;
case '11':
div.style.background = '#556688';
break;
case '12':
div.style.background = '#887711';
break;
case '13':
div.style.background = '#115577';
break;
case '♬':
div.style.background = '';
break;
}
}
});
});
},
'$store.state.socket.iscsStatePaMessages': function (list) {
if (list && list.length) {
list.forEach(item => {
if (this.iscsDeviceState[item.code]) {
this.iscsDeviceState[item.code] = { ...this.iscsDeviceState[item.code], ...item };
} else {
this.iscsDeviceState[item.code] = item;
}
const device = this.iscsDeviceMap[item.code];
if (device) {
this.$set(this.deviceMap[device.position], 'state', item.state);
const div = document.getElementById(device.position);
if (div) {
switch (item.state) {
case '0':
div.style.background = '#CCCCCC';
break;
case '1':
div.style.background = '#FF0000';
break;
case '2':
div.style.background = '#880000';
break;
case '3':
div.style.background = '#0000FF';
break;
case '4':
div.style.background = '#554488';
break;
case '5':
div.style.background = '#44CC55';
break;
case '6':
div.style.background = '#FF00FF';
break;
case '7':
div.style.background = '#887711';
break;
case '8':
div.style.background = '#006600';
break;
case '9':
div.style.background = '#778877';
break;
case '10':
div.style.background = '#555454';
break;
case '11':
div.style.background = '#556688';
break;
case '12':
div.style.background = '#887711';
break;
case '13':
div.style.background = '#115577';
break;
case '♬':
div.style.background = '';
break;
}
}
}
});
}
}
},
created() {
const params = { system: 'PA', type: 'BGM' };
queryIscsResourcesByGroup( this.$route.query.group, params).then(resp => {
this.bgmResources = resp.data && resp.data[0] ? resp.data[0].resources : [];
}).catch( () => {
this.$message.error('获取广播资源列表失败!');
} );
const params2 = { mapId: this.$route.query.mapId, system: 'PA', station: this.$route.query.stationId };
queryIscsDeviceCod(params2).then(resp => {
this.iscsDeviceList = resp.data;
this.iscsDeviceList.forEach(device => {
this.$set(device, 'state', '0');
this.iscsDeviceMap[device.code] = device;
});
this.subscribe();
});
this.getResourcesList();
},
beforeDestroy() {
this.clearSubscribe();
},
methods: {
chooseMessage(index) {
this.messageIndex = index;
},
checkHasDevice(position) {
const device = this.iscsDeviceList.find(item => item.position === position);
this.deviceMap[position] = device;
return !!device;
},
getResourcesList() {
const params = { system: 'PA', type: this.videoMode };
queryIscsResourcesByGroup( this.$route.query.group, 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) {
if (this.enableAreaList.length === 6) {
this.enableAreaList = [];
} else {
this.enableAreaList = ['车站', '站厅', '上行站台', '下行站台', '办公区', '出入口', '换乘通道'];
this.enableAreaList = ['LCD', 'UP_STAND', 'DOWN_STAND', 'ADMINISTRATIVE_AREA', 'GATE', 'TRANSFER_CHANNEL'];
}
},
playBgm() {
const iscsDeviceCodes = [];
this.enableAreaList.forEach(item => {
if (this.deviceMap[item]) {
iscsDeviceCodes.push(this.deviceMap[item].code);
}
});
if (!iscsDeviceCodes.length) {
this.$message.error('请选择需要发布广播的设备');
return;
}
if (this.bgmResources && this.bgmResources[0]) {
const params = {
resourceId: this.bgmResources[0].id,
iscsDeviceCodes: iscsDeviceCodes,
type: 'BGM'
};
sendCommandNew(this.$route.query.group, 'ISCS_PA_Play', params).then(resp => {
const bgmUrl = this.$store.state.user.resourcesUrl + this.bgmResources[0].url;
const audio = document.getElementById('voice');
audio.src = bgmUrl;
audio.play();
}).catch(() => {
this.$message.error('背景音乐播放失败!');
});
}
},
stopBgm() {
const iscsDeviceCodes = [];
this.enableAreaList.forEach(item => {
if (this.deviceMap[item]) {
iscsDeviceCodes.push(this.deviceMap[item].code);
}
});
if (!iscsDeviceCodes.length) {
this.$message.error('请选择广播设备');
return;
}
sendCommandNew(this.$route.query.group, 'ISCS_PA_Stop_Playing', { iscsDeviceCodes: iscsDeviceCodes }).then(resp => {
const audio = document.getElementById('voice');
audio.pause();
}).catch(() => {
this.$message.error('背景音乐终止播放失败!');
});
},
stopBroadcast() {
const iscsDeviceCodes = [];
this.enableAreaList.forEach(item => {
if (this.deviceMap[item]) {
iscsDeviceCodes.push(this.deviceMap[item].code);
}
});
if (!iscsDeviceCodes.length) {
this.$message.error('请选择广播设备');
return;
}
sendCommandNew(this.$route.query.group, 'ISCS_PA_Stop_Playing', { iscsDeviceCodes: iscsDeviceCodes }).then(resp => {
const audio = document.getElementById('voice');
audio.pause();
}).catch(() => {
this.$message.error('广播终止播放失败!');
});
},
releaseBroadcast() {
const iscsDeviceCodes = [];
this.enableAreaList.forEach(item => {
if (this.deviceMap[item]) {
iscsDeviceCodes.push(this.deviceMap[item].code);
}
});
if (!iscsDeviceCodes.length) {
this.$message.error('请选择广播设备');
return;
}
if (this.resourcesList[this.messageIndex]) {
const params = {
resourceId: this.resourcesList[this.messageIndex].id,
iscsDeviceCodes: iscsDeviceCodes,
type: this.videoMode
};
sendCommandNew(this.$route.query.group, 'ISCS_PA_Play', params).then(resp => {
this.voiceUrl = this.$store.state.user.resourcesUrl + this.resourcesList[this.messageIndex].url;
const audio = document.getElementById('voice');
audio.src = this.voiceUrl;
audio.play();
}).catch(() => {
this.$message.error('发布广播失败!');
});
}
},
selectedArea(area) {
@ -242,6 +516,16 @@ export default {
},
selectedVideoMode(mode) {
this.videoMode = mode;
this.getResourcesList();
},
subscribe() {
this.clearSubscribe();
const header = { group: this.$route.query.group || '', 'X-Token': getToken() };
creatSubscribe(getTopic('ISCSPA', this.$route.query.group ), header);
this.$store.dispatch('app/animationsClose');
},
clearSubscribe() {
clearSubscribe(getTopic('ISCSPA', this.$route.query.group));
}
}
};
@ -268,13 +552,13 @@ export default {
top: 13px;
width: 50px;
left: 30%;
cursor: pointer;
font-size: 13px;
line-height: 28px;
border-top: 2px solid #fff;
border-left: 2px solid #fff;
border-right: 2px solid #454541;
border-bottom: 2px solid #454541;
cursor: default;
&.active,
&:hover{
background: #EBB570;
@ -286,6 +570,7 @@ export default {
}
.pa-check-box{
position: relative;
left: 2px;
display: inline-block;
width: 12px;
height: 12px;
@ -353,6 +638,7 @@ export default {
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;
cursor: pointer;
}
.broadcast-content{
border-bottom: 1px solid #ECECEC;
@ -366,7 +652,7 @@ export default {
}
.time-control-pa-home{
position: absolute;
top: 63%;
top: 65%;
left: 12%;
width: 60%;
}
@ -417,7 +703,7 @@ export default {
.pa-grey-box{
position: absolute;
left: 12%;
top: 71%;
top: 70%;
width: 60%;
height: 18%;
background: #DDDDDD;
@ -437,6 +723,13 @@ export default {
width: 13%;
font-size: 12px;
}
.pa-state-box{
position: relative;
left: 30px;
display: inline-block;
color: #000;
width: 20px;
}
</style>
<style>
.time-control-pa-home .el-date-editor.el-input, .el-date-editor.el-input__inner{

View File

@ -1,47 +1,63 @@
<template>
<el-dialog
v-dialogDrag
:visible.sync="visible"
width="600px"
:before-close="doClose"
class="iscs-voice-broadcast-dialog"
>
<div>
<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>
</div>
<div class="secondary-title" style="margin-top: 10px">信息内容显示</div>
<div class="information-context-box">站台有乘客越出X色安全线站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类</div>
<div class="release-button" @click="releaseBroadcast">发布</div>
<el-dialog
v-dialogDrag
:visible.sync="visible"
width="600px"
:before-close="doClose"
class="iscs-voice-broadcast-dialog"
>
<div>
<div class="dialog-header">语音广播</div>
<div class="secondary-title">信息描述</div>
<div class="information-description-box">
<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>
</el-dialog>
</div>
<div class="secondary-title" style="margin-top: 10px">信息内容显示</div>
<div class="information-context-box">{{ resourcesList.length? resourcesList[messageIndex].desc: '' }}</div>
<div class="release-button" @click="releaseBroadcast">发布</div>
</div>
</el-dialog>
</template>
<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.messageIndex = 0;
this.visible = true;
},
releaseBroadcast() {
this.visible = false;
this.messageIndex = 0;
if (this.resourcesList[this.messageIndex]) {
this.$emit('releaseBroadcast', this.resourcesList[this.messageIndex]);
}
}
}
}
};
</script>
<style scoped>
@ -62,6 +78,7 @@ export default {
white-space: nowrap;
background: #DCDCDC;
margin-top: 2px;
cursor: pointer;
}
.secondary-title{
text-align: center;

View File

@ -9,19 +9,25 @@
<div>
<div class="dialog-header">信息广播</div>
<div class="iscs-pis-dialog-info">
<el-radio-group v-model="addModel.infoType">
<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-group v-model="addModel.infoType" @change="getResourcesList">
<el-radio label="REAL_TIME">实时信息</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-show="addModel.infoType !== 'REAL_TIME'" class="secondary-title">{{ this.message[this.addModel.infoType].title }}</div>
<div v-show="addModel.infoType !== 'REAL_TIME'" class="information-description-box">
<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'">
<div v-show="addModel.infoType === 'REAL_TIME'">
<el-row>
<el-col :span="20">
<div>
@ -45,20 +51,26 @@
</el-col>
</el-row>
</div>
<div style="margin-top: 10px">
<div v-show="addModel.infoType === 'REAL_TIME'" 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="information-description-box" style="margin-top: 15px;">
<div v-show="addModel.infoType !== 'REAL_TIME'" style="margin-top: 10px">
<div style="display: inline;">名称</div>
<input v-model="resource.name" class="pis-dialog-input" style="width: 550px;">
<!--<input v-model="addModel.infoTime" class="pis-dialog-input" style="width: 140px;">-->
<!--<div style="display: inline;"></div>-->
</div>
<div v-show="addModel.infoType !== 'REAL_TIME'" class="secondary-title" style="margin-top: 10px">{{ addModel.infoType === 'RECORDING'? '普通信息内容显示': '紧急信息内容显示' }}</div>
<div v-show="addModel.infoType !== 'REAL_TIME'" class="information-context-box">{{ resource.desc }}</div>
<div v-show="addModel.infoType === 'REAL_TIME'" 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>
<!--<div v-for="(item,index) in resourcesList" :key="index">-->
<!--<div class="information-box" @click="selectedRealTimeInfo(item)">{{ item.name }}</div>-->
<!--</div>-->
</el-col>
<el-col>
<div>{{ showRealTimeInfo }}</div>
@ -66,119 +78,122 @@
</el-row>
</div>
<div class="button-group">
<el-select v-show="addModel.infoType === 'realTime'" v-model="value" placeholder="信息选择" size="mini">
<el-option
v-for="item in infoList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<div v-show="addModel.infoType === 'realTime'" class="pis-button">储存</div>
<div class="button-group-content" :style="{left: addModel.infoType ==='realTime'?'300px':'550px'}">
<!--<el-select v-show="addModel.infoType === 'REAL_TIME'" v-model="value" :disabled="true" placeholder="信息选择" size="mini">-->
<!--<el-option-->
<!--v-for="item in infoList"-->
<!--:key="item.value"-->
<!--:label="item.label"-->
<!--:value="item.value"-->
<!--/>-->
<!--</el-select>-->
<!--<div v-show="addModel.infoType === 'REAL_TIME'" class="pis-button">储存</div>-->
<div class="button-group-content" :style="{left: addModel.infoType ==='REAL_TIME'?'300px':'550px'}">
<div class="pis-button">设定中</div>
<div class="pis-button" @click="releaseBroadcast">发布</div>
<div class="pis-button">取消</div>
</div>
</div>
<div class="pis-dialog-form-box">
<el-form ref="form" :model="form" label-width="95px">
<el-row>
<el-col :span="3">
<div class="pis-button" style="position: relative; top: 10px;left: 5px; padding: 7px 10px ;">导入描述</div>
</el-col>
<el-col :span="21">
<el-form-item prop="description" label-width="0">
<input v-model="form.description" style="width:600px;">
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="21">
<el-row>
<el-col :span="12">
<el-form-item prop="startDate" label="开始日期">
<el-date-picker
v-model="form.startDate"
type="date"
size="mini"
placeholder="选择日期"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item prop="endTime" label="结束时间">
<el-time-picker
v-model="form.endTime"
arrow-control
size="mini"
placeholder="选择时间"
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item prop="startTime" label="开始时间">
<el-time-picker
v-model="form.startTime"
arrow-control
size="mini"
placeholder="选择时间"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item prop="endDate" label="结束日期">
<el-date-picker
v-model="form.endDate"
type="date"
size="mini"
placeholder="选择日期"
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item prop="durationTime" label="延续时间">
<el-time-picker
v-model="form.durationTime"
arrow-control
size="mini"
placeholder="选择时间"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<div style="text-align: center;padding-top: 10px;">
<div class="pis-button">今日</div>
<div class="pis-button">一次</div>
<div class="pis-button">无截止</div>
</div>
</el-col>
</el-row>
</el-col>
<el-col :span="3">
<div class="each_operate_button">排定<br>确认</div>
</el-col>
</el-row>
</el-form>
</div>
</div>
</el-dialog>
<!--<div class="pis-dialog-form-box">-->
<!--<el-form ref="form" :model="form" label-width="95px">-->
<!--<el-row>-->
<!--<el-col :span="3">-->
<!--<div class="pis-button" style="position: relative; top: 10px;left: 5px; padding: 7px 10px ;">导入描述</div>-->
<!--</el-col>-->
<!--<el-col :span="21">-->
<!--<el-form-item prop="description" label-width="0">-->
<!--<input v-model="form.description" style="width:600px;">-->
<!--</el-form-item>-->
<!--</el-col>-->
<!--</el-row>-->
<!--<el-row>-->
<!--<el-col :span="21">-->
<!--<el-row>-->
<!--<el-col :span="12">-->
<!--<el-form-item prop="startDate" label="开始日期">-->
<!--<el-date-picker-->
<!--v-model="form.startDate"-->
<!--type="date"-->
<!--size="mini"-->
<!--placeholder="选择日期"-->
<!--/>-->
<!--</el-form-item>-->
<!--</el-col>-->
<!--<el-col :span="12">-->
<!--<el-form-item prop="endTime" label="结束时间">-->
<!--<el-time-picker-->
<!--v-model="form.endTime"-->
<!--arrow-control-->
<!--size="mini"-->
<!--placeholder="选择时间"-->
<!--/>-->
<!--</el-form-item>-->
<!--</el-col>-->
<!--</el-row>-->
<!--<el-row>-->
<!--<el-col :span="12">-->
<!--<el-form-item prop="startTime" label="开始时间">-->
<!--<el-time-picker-->
<!--v-model="form.startTime"-->
<!--arrow-control-->
<!--size="mini"-->
<!--placeholder="选择时间"-->
<!--/>-->
<!--</el-form-item>-->
<!--</el-col>-->
<!--<el-col :span="12">-->
<!--<el-form-item prop="endDate" label="结束日期">-->
<!--<el-date-picker-->
<!--v-model="form.endDate"-->
<!--type="date"-->
<!--size="mini"-->
<!--placeholder="选择日期"-->
<!--/>-->
<!--</el-form-item>-->
<!--</el-col>-->
<!--</el-row>-->
<!--<el-row>-->
<!--<el-col :span="12">-->
<!--<el-form-item prop="durationTime" label="延续时间">-->
<!--<el-time-picker-->
<!--v-model="form.durationTime"-->
<!--arrow-control-->
<!--size="mini"-->
<!--placeholder="选择时间"-->
<!--/>-->
<!--</el-form-item>-->
<!--</el-col>-->
<!--<el-col :span="12">-->
<!--<div style="text-align: center;padding-top: 10px;">-->
<!--<div class="pis-button">今日</div>-->
<!--<div class="pis-button">一次</div>-->
<!--<div class="pis-button">无截止</div>-->
<!--</div>-->
<!--</el-col>-->
<!--</el-row>-->
<!--</el-col>-->
<!--<el-col :span="3">-->
<!--<div class="each_operate_button">排定<br>确认</div>-->
<!--</el-col>-->
<!--</el-row>-->
<!--</el-form>-->
<!--</div>-->
<!--</div>-->
</div></el-dialog>
</template>
<script>
import { queryIscsResourcesByGroup } from '@/api/simulation';
export default {
name: 'VoiceBroadcast',
data() {
return {
visible: false,
value: '',
resourcesList: [],
resourceIndex: 0,
resource: {},
addModel: {
infoType: 'common',
infoType: 'RECORDING',
infoTitle: '',
infoTime: '',
infoContent: '',
@ -195,105 +210,17 @@ export default {
infoList: [],
showRealTimeInfo: '',
message: {
realTime: {
REAL_TIME: {
title: '实时信息',
infoList:[
{
title: 'mes1实时信息',
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
},
{
title: 'mes6',
content: '站台有乘客越出X色安全线站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
},
{
title: 'mes7',
content: '站台有乘客越出X色安全线站台乘客请返回安前线内站台有乘客越出X色安全线成熟的技术等级分类',
time: 1
}
]
infoList:[]
},
common: {
RECORDING: {
title: '普通信息',
infoList:[
{
title: 'mes1普通信息',
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:[]
},
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 +234,43 @@ export default {
},
doShow() {
this.visible = true;
this.getResourcesList();
},
releaseBroadcast() {
this.visible = false;
if (this.addModel.infoType === 'REAL_TIME') {
if (!this.addModel.infoTitle) {
this.$message.error('请输入实时信息标题!');
} else if (!this.addModel.infoContent) {
this.$message.error('请输入实时信息内容!');
} else {
this.$emit('releaseBroadcast', {name: this.addModel.infoTitle, content: this.addModel.infoContent }, this.addModel.infoType);
this.addModel.infoContent = '';
this.addModel.infoTitle = '';
}
} else if (this.resource) {
this.$emit('releaseBroadcast', this.resource, this.addModel.infoType);
}
},
selectedRealTimeInfo(item) {
this.showRealTimeInfo = item.content;
},
chooseResources(item, index) {
this.resource = item;
this.resourceIndex = index;
},
getResourcesList() {
if (this.addModel.infoType === 'REAL_TIME') {
return;
}
const params = { system: 'PIS', type: this.addModel.infoType };
queryIscsResourcesByGroup( this.$route.query.group, params).then(resp => {
this.resourceIndex = 0;
this.resourcesList = resp.data && resp.data[0] ? resp.data[0].resources : [];
this.resource = this.resourcesList[0] ? this.resourcesList[0] : {};
}).catch( () => {
this.$message.error('获取广播资源列表失败!');
} );
}
}
};
@ -344,6 +302,7 @@ export default {
white-space: nowrap;
background: #DCDCDC;
margin-top: 2px;
cursor: pointer;
}
.secondary-title{
text-align: center;

View File

@ -6,16 +6,6 @@
<div class="main_screen_content">
<div class="screen_left">
<div class="screen_left_tab">特定区域</div>
<!-- <div class="sceen_left_content">
<div class="screen_operate_name" @click="selectedAllLine">全线</div>
<div class="screen_operate_name" @click="selectedAreaBatch(0)">全站厅(LCD)</div>
<div class="screen_operate_name" @click="selectedAreaBatch(1)">全上行站台</div>
<div class="screen_operate_name" @click="selectedAreaBatch(2)">全下行站台</div>
<div class="screen_operate_name" @click="selectedAreaBatch(3)">全出入口</div>
<div class="screen_operate_name" @click="selectedAreaBatch(4)">全物业</div>
<div class="screen_operate_name" @click="selectedAreaBatch(5)">全天桥</div>
<div class="screen_operate_name" @click="selectedAreaBatch(6)">出入口(LED)</div>
</div> -->
<el-row><el-button v-for="(item, index) in verticalHeader" :key="index" class="screen_operate_name" :class="{'active': item.active}" @click="selectedBatch(item)">{{ item.title }}</el-button></el-row>
</div>
<div class="screen_main_content">
@ -25,15 +15,16 @@
</div>
<div class="screen_right_group">
<div class="screen_right_group_in">
<div v-for="station in stationList" :key="station.stationName" class="each_station_info">
<div v-for="station in stationList" :key="station.code" class="each_station_info">
<div class="each_data_info" @click="selectedStation(station)">
<div class="screen_station_name">{{ station.stationName }}</div>
</div>
<div v-if="station.children&&station.children.length>0">
<div v-for="(child,index) in station.children" :key="station.stationName+index" class="each_data_info" style="text-align: center;" @click="selectArea(station.stationName,index)">
<div v-for="(child,index) in station.children" :key="station.code+index" class="each_data_info" style="display: flex;align-items: center;justify-content: center;" @click="selectArea(station.code,index)">
<div v-if="child.status==='default'" class="button_default_content">
<div class="button_default" :style="{background:selectedAreaList.includes(station.stationName + '-' + index)?'#2EFF74':'#CDCDCD'}" />
<div class="button_default" :style="{background:selectedAreaList.includes(station.code + '-' + index)?'#2EFF74':'#CDCDCD'}" />
</div>
<div :id="station.code + '-' + index" style="width: 14px;height: 14px;margin-left: 5px;" />
</div>
</div>
</div>
@ -48,7 +39,7 @@
</div>
<div class="each_operate">
<div class="each_operate_text">信息清除</div>
<div class="each_operate_button">清除<br>普通信息</div>
<div class="each_operate_button" @click="stopBroadcast">清除<br>普通信息</div>
</div>
</div>
</div>
@ -73,12 +64,17 @@
</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';
import { sendCommandNew } from '@/api/jmap/training';
import { creatSubscribe, clearSubscribe, getTopic } from '@/utils/stomp';
import { getToken } from '@/utils/auth';
export default {
name:'MainScreen',
components: {
@ -98,40 +94,124 @@ export default {
{name: 'LED', title: '出入口(LED)', key: 'LED', type: 'checkBox', active: false}
],
stationList:[],
selectedAreaList: []
selectedAreaList: [],
iscsDeviceMap: {},
deviceMap: {}
};
},
watch: {
'$store.state.socket.iscsStatePisMessages': function (list) {
if (list && list.length) {
list.forEach(item => {
const index = this.iscsDeviceMap[item.code];
if (index) {
this.$set(this.deviceMap[index], 'state', item.state);
const div = document.getElementById(index);
div.style.background = item.state === 'normal' ? '#2EFF74' : '#D4D4D4';
}
});
}
}
},
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];
if ( children[index]) {
children[index].status = 'default';
this.iscsDeviceMap[item.code] = station.code + '-' + index;
this.deviceMap[station.code + '-' + index] = item;
}
}
});
}
const param = {
stationName: station.name,
children:[
{status:'none'}, {status:'default'},
{status:'default'}, {status:'default'},
{status:'none'}, {status:'none'},
{status:'none'}, {status:'default'}
]
code: station.code,
children:children
};
this.stationList.push(param);
}
});
}
this.subscribe();
} catch (e) {
this.$message.error('获取车站列表失败!');
}
},
beforeDestroy() {
this.clearSubscribe();
},
methods:{
showInfoBrroadcast() {
this.$refs.infoBroadcast.doShow();
},
stopBroadcast() {
const iscsDeviceCodes = [];
this.selectedAreaList.forEach(item => {
if (this.deviceMap[item]) {
iscsDeviceCodes.push(this.deviceMap[item].code);
}
});
if (!iscsDeviceCodes.length) {
this.$message.error('请选择广播设备');
return;
}
sendCommandNew(this.$route.query.group, 'ISCS_PIS_Stop_Playing', {iscsDeviceCodes: iscsDeviceCodes}).then(resp => {
const audio = document.getElementById('voice');
audio.pause();
}).catch(() => {
this.$message.error('广播终止播放失败!');
});
},
releaseBroadcast(voice, type) {
const iscsDeviceCodes = [];
this.selectedAreaList.forEach(item => {
if (this.deviceMap[item]) {
iscsDeviceCodes.push(this.deviceMap[item].code);
}
});
if (!iscsDeviceCodes.length) {
this.$message.error('请选择广播设备');
return;
}
const params = {
resourceId: voice.id,
iscsDeviceCodes: iscsDeviceCodes,
name: voice.name,
content: voice.content,
type
};
sendCommandNew(this.$route.query.group, 'ISCS_PIS_Play', params).then(resp => {
const voiceUrl = this.$store.state.user.resourcesUrl + (voice.url || resp.data);
const audio = document.getElementById('voice');
audio.src = voiceUrl;
audio.play();
}).catch(() => {
this.$message.error('发布广播失败!');
});
},
selectArea(stationName, index) {
const elem = stationName + '-' + index;
if (this.selectedAreaList.includes(elem)) {
@ -144,7 +224,7 @@ export default {
selectedStation(station) {
const flag = this.checkStationSelected(station);
station.children.forEach((item, index) => {
const elem = station.stationName + '-' + index;
const elem = station.code + '-' + index;
if (item.status === 'default' && flag) {
const areaIndex = this.selectedAreaList.indexOf(elem);
this.selectedAreaList.splice(areaIndex, 1);
@ -157,7 +237,7 @@ export default {
let stationSelectedFlag = true;
station.children.some((item, index) => {
if (item.status === 'default') {
stationSelectedFlag = this.selectedAreaList.includes(station.stationName + '-' + index);
stationSelectedFlag = this.selectedAreaList.includes(station.code + '-' + index);
return !stationSelectedFlag;
}
});
@ -177,7 +257,7 @@ export default {
const flag = data.active;
this.stationList.forEach(station => {
station.children.forEach((item, index) => {
const elem = station.stationName + '-' + index;
const elem = station.code + '-' + index;
if (item.status == 'default' && (index + 1) == areaIndex && !flag) {
const selectedAreaIndex = this.selectedAreaList.indexOf(elem);
this.selectedAreaList.splice(selectedAreaIndex, 1);
@ -194,10 +274,19 @@ export default {
this.stationList.forEach(station => {
station.children.forEach((item, index) => {
if (item.status === 'default' && flag) {
this.selectedAreaList.push(station.stationName + '-' + index);
this.selectedAreaList.push(station.code + '-' + index);
}
});
});
},
subscribe() {
this.clearSubscribe();
const header = { group: this.$route.query.group || '', 'X-Token': getToken() };
creatSubscribe(getTopic('ISCSPIS', this.$route.query.group ), header);
this.$store.dispatch('app/animationsClose');
},
clearSubscribe() {
clearSubscribe(getTopic('ISCSPIS', this.$route.query.group));
}
}
};
@ -316,7 +405,6 @@ border-top: 2px solid #8c8a89;border-left: 2px solid #8c8a89;border-right: 2px s
border-bottom: 2px solid #898888;
}
.button_default_content{
margin:0 auto;
height: 18px;
width: 18px;
background: #D4D4D4;

View File

@ -7,6 +7,13 @@
<fas v-else-if="fasList.includes(mode)" />
<signal-system v-else-if="mode === 'signal'" />
<ticket-or-entrance v-else-if="mode === 'autoTicket'||mode === 'afcTwo02'||mode === 'afcOne02'" />
<broadcast-home v-else-if="mode === 'paMain'" />
<radio-listening-pa v-else-if="mode === 'paMonitor'" />
<time-preview-pa v-else-if="mode === 'paPreview'" />
<pids-emergency v-else-if="mode === 'pidsEmergency'" />
<pids-lcd v-else-if="mode === 'pidsLcd'" />
<pids-main v-else-if="mode === 'pidsMain'" />
<pids-preview v-else-if="mode === 'pidsPreview'" />
</div>
</template>
<script>
@ -17,6 +24,13 @@ import Schedule from './schedule';
import Fas from './fas/index.vue';
import SignalSystem from './signalSystem/index.vue';
import TicketOrEntrance from './ticketOrEntrance/index';
import BroadcastHome from '../config/broadcast/homeScreen';
import RadioListeningPa from '../config/pa/radioListeningPA';
import TimePreviewPa from '../config/pa/timePreviewPA';
import PidsEmergency from '../config/pis/emergencyRelease';
import PidsMain from '../config/pis/mainScreen';
import PidsPreview from '../config/pis/timePreview';
import PidsLcd from '../config/pis/lcdControl';
import { getSimulationInfoNew } from '@/api/simulation';
import { getByGroupStationList } from '@/api/jmap/map';
import { loadRunPlanData } from '@/utils/loaddata';
@ -28,7 +42,14 @@ export default {
Normal,
SignalSystem,
Fas,
TicketOrEntrance
TicketOrEntrance,
BroadcastHome,
RadioListeningPa,
TimePreviewPa,
PidsEmergency,
PidsMain,
PidsPreview,
PidsLcd
},
data() {
return {

View File

@ -282,28 +282,58 @@ export default {
type: 'interface',
disabled: true
}
]},
communication:{name:'通信', type:'totalSystem', id: 'communication', active:false, icon:iscs_icon7,
children:[
{
name: '乘客信息-主画面',
mode: 'pidsMain',
id: 'pidsMain',
type: 'interface'
},
// {
// name: '-LCD',
// mode: 'pidsLcd',
// id: 'pidsLcd',
// type: 'interface'
// },
// {
// name: '-',
// mode: 'pidsPreview',
// id: 'pidsPreview',
// type: 'interface'
// },
// {
// name: '-',
// mode: 'pidsEmergency',
// id: 'pidsEmergency',
// type: 'interface'
// },
{
name: '广播系统-主画面',
mode: 'paMain',
id: 'paMain',
type: 'interface'
}
// {
// name: '广-广',
// mode: 'paMonitor',
// id: 'paMonitor',
// type: 'interface'
// },
// {
// name: '广-',
// mode: 'paPreview',
// id: 'paPreview',
// type: 'interface'
// }
// {
// name: '',
// mode: 'cctv',
// id: 'cctv',
// type: 'interface'
// }
]}
// communication:{name:'', type:'totalSystem', id: 'communication', active:false, icon:iscs_icon7,
// children:[
// {
// name: '',
// mode: 'pids',
// id: 'pids',
// type: 'interface'
// },
// {
// name: '广',
// mode: 'broadcastingSystem',
// id: 'broadcastingSystem',
// type: 'interface'
// },
// {
// name: '',
// mode: 'cctv',
// id: 'cctv',
// type: 'interface'
// }
// ]}
},
public:{name:'公共设施', type:'totalSystem', id: 'public', active:false, icon:iscs_icon8 },
manage:{name:'管理', type:'totalSystem', id: 'manage', active:false, icon:iscs_icon9 }

View File

@ -15,7 +15,7 @@
<el-button-group>
<el-button v-if="userRole=== 'STATION_SUPERVISOR' && !$route.query.projectDevice && $route.query.lineCode!='08'" size="small" @click="goIbp">IBP盘</el-button>
<el-button v-if="userRole=== 'DISPATCHER' && !$route.query.projectDevice && hasBigScreen" size="small" @click="goBigScreen">大屏</el-button>
<el-button v-if="userRole==='DISPATCHER' && !$route.query.projectDevice && iscsShow" size="small" @click="goIscs">ISCS</el-button>
<el-button v-if="(userRole==='DISPATCHER' || userRole=== 'STATION_SUPERVISOR') && !$route.query.projectDevice && iscsShow" size="small" @click="goIscs">ISCS</el-button>
<el-button v-if="running && !dataError && $route.query.type !== 'ILW'" size="small" :disabled="viewDisabled" @click="viewRunPlan">{{ $t('joinTraining.runGraphPreview') }}</el-button>
<template v-if="isAdmin">
<el-button v-if="!running && !dataError && $route.query.type !== 'ILW'" size="small" type="warning" @click="loadRunPlan">

View File

@ -0,0 +1,216 @@
<template>
<el-dialog v-dialogDrag :title="title" :visible.sync="dialogVisible" width="30%" :before-close="handleClose" center :close-on-click-modal="false">
<el-form ref="ruleForm" :model="formModel" :rules="rules" label-width="100px">
<el-form-item label="code" prop="code">
<el-input v-model="formModel.code" style="width: 200px;" />
</el-form-item>
<el-form-item label="地图" prop="mapId">
<el-select v-model="formModel.mapId" placeholder="请选择" @change="mapIdChange">
<el-option
v-for="item in mapList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="车站" prop="station">
<el-select v-model="formModel.station" placeholder="请选择">
<el-option
v-for="item in stationList"
:key="item.code"
:label="item.name"
:value="item.code"
/>
</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
v-for="item in positionList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="设备类型" prop="type">
<el-select v-model="formModel.type" placeholder="请选择">
<el-option
v-for="item in typeList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button v-loading="loading" type="primary" @click="doSave">{{ $t('global.confirm') }}</el-button>
<el-button @click="handleClose">{{ $t('global.cancel') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { createIscsDevcie, updateIscsDevice } from '@/api/iscs';
import { getStationList } from '@/api/runplan';
export default {
name: 'DeviceAdd',
props: {
mapList: {
type: Array,
default: function () {
return [];
}
},
positionList: {
type: Array,
default: function () {
return [];
}
},
typeList: {
type: Array,
default: function () {
return [];
}
},
systemList: {
type: Array,
default: function () {
return [];
}
}
},
data() {
return {
dialogVisible: false,
formModel: {
id: '',
code: '',
system: '',
mapId: '',
station: '',
position: '',
type: ''
},
stationList: [],
loading: false
};
},
computed: {
rules() {
const crules = {
code: [
{ required: true, message: '请输入设备code', trigger: 'blur' }
],
mapId: [
{ required: true, message: '请选择地图', trigger: 'change' }
],
system: [
{ required: true, message: '请选择系统', trigger: 'change' }
],
station: [
{ required: true, message: '请选择车站', trigger: 'change' }
],
position: [
{ required: true, message: '请选择设备位置', trigger: 'change' }
],
type: [
{ required: true, message: '请选择设备类型', trigger: 'change' }
]
};
return crules;
},
title() {
return this.formModel.id ? '修改ISCS设备' : '创建ISCS设备';
}
},
mounted() {
},
methods: {
show(data) {
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 => {
this.stationList = resp.data;
}).catch(() => {
this.$message.error('获取车站列表失败!');
});
},
doSave() {
this.$refs.ruleForm.validate(() => {
this.loading = true;
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,
type: this.formModel.type
};
if (data.id) {
updateIscsDevice(data.id, data).then(resp => {
this.$message.success('修改ISCS设备数据成功');
this.handleClose();
this.$emit('reloadTable');
}).catch(error => {
this.$message.error(error.message);
this.loading = false;
});
} else {
createIscsDevcie(data).then(resp => {
this.$message.success('创建ISCS设备数据成功');
this.handleClose();
this.$emit('reloadTable');
}).catch(error => {
this.$message.error(error.message);
this.loading = false;
});
}
});
},
handleClose() {
this.formModel = {
id: '',
mapId: '',
system: '',
code: '',
station: '',
position: '',
type: ''
};
this.dialogVisible = false;
this.loading = false;
}
}
};
</script>
<style lang="scss" scoped>
</style>

View File

@ -0,0 +1,178 @@
<template>
<el-dialog v-dialogDrag :title="title" :visible.sync="dialogVisible" width="30%" :before-close="handleClose" center :close-on-click-modal="false">
<el-form ref="ruleForm" :model="formModel" :rules="rules" label-width="100px">
<el-form-item label="地图" prop="mapId">
<el-select v-model="formModel.mapId" placeholder="请选择" @change="mapIdChange">
<el-option
v-for="item in mapList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</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" multiple placeholder="请选择">
<el-option
v-for="item in positionList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="设备类型" prop="type">
<el-select v-model="formModel.type" placeholder="请选择">
<el-option
v-for="item in typeList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button v-loading="loading" type="primary" @click="doSave">{{ $t('global.confirm') }}</el-button>
<el-button @click="handleClose">{{ $t('global.cancel') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { batchCreateIscsDevcie } from '@/api/iscs';
import { getStationList } from '@/api/runplan';
export default {
name: 'DeviceAdd',
props: {
mapList: {
type: Array,
default: function () {
return [];
}
},
positionList: {
type: Array,
default: function () {
return [];
}
},
typeList: {
type: Array,
default: function () {
return [];
}
},
systemList: {
type: Array,
default: function () {
return [];
}
}
},
data() {
return {
dialogVisible: false,
formModel: {
system: '',
mapId: '',
position: [],
type: ''
},
stationList: [],
loading: false
};
},
computed: {
rules() {
const crules = {
mapId: [
{ required: true, message: '请选择地图', trigger: 'change' }
],
system: [
{ required: true, message: '请选择系统', trigger: 'change' }
],
position: [
{ required: true, message: '请选择设备位置', trigger: 'change' }
],
type: [
{ required: true, message: '请选择设备类型', trigger: 'change' }
]
};
return crules;
},
title() {
return '批量创建ISCS设备';
}
},
mounted() {
},
methods: {
show() {
this.dialogVisible = true;
this.$nextTick(() => {
this.$refs.ruleForm.resetFields();
});
},
mapIdChange(value) {
getStationList(value).then(resp => {
this.stationList = resp.data;
}).catch(() => {
this.$message.error('获取车站列表失败!');
});
},
doSave() {
this.$refs.ruleForm.validate(() => {
this.loading = true;
const data = [];
this.stationList.forEach(station => {
if (!station.depot) {
this.formModel.position.forEach(item => {
data.push({
mapId: this.formModel.mapId,
system: this.formModel.system,
station: station.code,
code: station.code + '-' + this.formModel.system + '-' + item,
position: item,
type: this.formModel.type
});
});
}
});
batchCreateIscsDevcie(data).then(resp => {
this.$message.success('批量创建ISCS设备数据成功');
this.handleClose();
this.$emit('reloadTable');
}).catch(error => {
this.$message.error(error.message);
this.loading = false;
});
});
},
handleClose() {
this.formModel = {
mapId: '',
system: '',
position: '',
type: ''
};
this.dialogVisible = false;
this.loading = false;
}
}
};
</script>
<style lang="scss" scoped>
</style>

View File

@ -0,0 +1,254 @@
<template>
<div>
<QueryListPage ref="queryListPage" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
<add-device
ref="addDevice"
:map-list="mapList"
:position-list="positionList"
:type-list="typeList"
:system-list="systemList"
@reloadTable="reloadTable"
/>
<batch-add
ref="batchAdd"
:map-list="mapList"
:position-list="positionList"
:type-list="typeList"
:system-list="systemList"
@reloadTable="reloadTable"
/>
</div>
</template>
<script>
import { pagedIscsDevice, deleteIscsDevice } from '@/api/iscs';
import { getPublishMapListOnline } from '@/api/jmap/map';
import AddDevice from './add';
import BatchAdd from './batchAdd';
const positionMap = {
LCD: '站厅',
UP_STAND: '上行站台',
DOWN_STAND: '下行站台',
GATE: '出入口',
OVERPASS1: '天桥1',
OVERPASS2: '天桥2',
PROPERTY: '物业',
LED: 'LED',
ADMINISTRATIVE_AREA: '办公区',
TRANSFER_CHANNEL: '换乘通道'
};
const typeMap = {
AUDIO: '广播',
LED: 'LED',
LCD: 'LCD'
};
const positionList = [
{ label: '站厅', value: 'LCD' },
{ label: '上行站台', value: 'UP_STAND' },
{ label: '下行站台', value: 'DOWN_STAND' },
{ label: '出入口', value: 'GATE' },
{ label: '天桥1', value: 'OVERPASS1' },
{ label: '天桥2', value: 'OVERPASS2' },
{ label: '物业', value: 'PROPERTY' },
{ label: 'LED', value: 'LED' },
{ label: '办公区', value: 'ADMINISTRATIVE_AREA' },
{ label: '换乘通道', value: 'TRANSFER_CHANNEL' }
];
const typeList = [
{ label: '广播', value: 'AUDIO' },
{ 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: {
AddDevice,
BatchAdd
},
data() {
return {
examResultList: [],
mapList: [],
positionList: positionList,
typeList: typeList,
systemList: systemList,
url: '',
pagerConfig: {
pageSize: 'pageSize',
pageIndex: 'pageNum'
},
queryForm: {
labelWidth: '120px',
reset: true,
queryObject: {
mapId: {
type: 'select',
label: '地图',
config: {
data: []
}
},
code: {
type: 'text',
label: 'code'
},
system: {
type: 'select',
label: '系统',
config: {
data: systemList
}
},
position: {
type: 'select',
label: '设备位置',
config: {
data: positionList
}
},
type: {
type: 'select',
label: '设备类型',
config: {
data: typeList
}
}
}
},
queryList: {
query: pagedIscsDevice,
selectCheckShow: false,
indexShow: true,
columns: [
{
title: 'code',
prop: 'code'
},
{
title: '地图',
prop: 'mapId',
type: 'tag',
columnValue: (row) => { return this.getMapName(row.mapId); },
tagType: (row) => { return 'success'; }
},
{
title: '车站编号',
prop: 'station'
},
{
title: '系统',
prop: 'system',
type: 'tag',
columnValue: (row) => { return systemMap[row.system]; },
tagType: (row) => { return 'success'; }
},
{
title: '设备位置',
prop: 'position',
type: 'tag',
columnValue: (row) => { return positionMap[row.position]; },
tagType: (row) => { return 'success'; }
},
{
title: '设备类型',
prop: 'type',
type: 'tag',
columnValue: (row) => { return typeMap[row.type]; },
tagType: (row) => { return 'success'; }
},
{
type: 'button',
title: this.$t('global.operate'),
width: '300',
buttons: [
// {
// name: '',
// handleClick: this.editConfig
// },
{
name: this.$t('global.delete'),
handleClick: this.handleDelete,
type: 'danger'
}
]
}
],
actions: [
{ text: this.$t('global.add'), handler: this.createIscsDevice},
{ text: '批量创建', handler: this.batchCrateIscsDevice }
]
},
currentModel: {}
};
},
computed: {
},
mounted() {
getPublishMapListOnline().then(resp => {
this.mapList = resp.data;
const list = [];
this.mapList.forEach(elem => {
list.push({ label: elem.name, value: elem.id });
});
this.queryForm.queryObject.mapId.config.data = list;
}).catch(() => {
this.$message.error('获取地图列表失败!');
});
},
methods: {
createIscsDevice() {
this.$refs.addDevice.show();
},
batchCrateIscsDevice() {
this.$refs.batchAdd.show();
},
getMapName(mapId) {
const mapInfo = this.mapList.find(elem => elem.id == mapId);
return mapInfo ? mapInfo.name : '';
},
handleTime(time) {
const timeList = time.split('T');
let newTime = '';
if (timeList.length > 1) {
newTime = timeList[0] + ' ' + timeList[1];
} else {
newTime = time;
}
return newTime;
},
//
handleDelete(index, row) {
this.$confirm('此操作将删除该ISCS设备数据', this.$t('global.tips'), {
confirmButtonText: this.$t('global.confirm'),
cancelButtonText: this.$t('global.cancel'),
type: 'warning'
}).then(() => {
deleteIscsDevice(row.id).then(response => {
this.$message.success(this.$t('system.deleteSuccess'));
this.reloadTable();
}).catch(() => {
this.reloadTable();
this.$messageBox(this.$t('error.deleteFailed'));
});
});
},
createAudioResources() {
this.$refs.addDevice.show();
},
// editConfig(index, row) {
// this.$refs.addDevice.show(row);
// },
reloadTable() {
this.queryList.reload();
}
}
};
</script>

View File

@ -0,0 +1,231 @@
<template>
<el-dialog v-dialogDrag :title="title" :visible.sync="dialogVisible" width="30%" :before-close="handleClose" center :close-on-click-modal="false">
<el-form ref="ruleForm" :model="formModel" :rules="rules" label-width="100px">
<el-form-item label="地图" prop="mapId">
<el-select v-model="formModel.mapId" placeholder="请选择">
<el-option
v-for="item in mapList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</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="type">
<el-select v-model="formModel.type" placeholder="请选择">
<el-option
v-for="item in typeList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="音频资源" prop="resourceIds">
<el-select v-model="formModel.resourceIds" multiple placeholder="请选择">
<el-option
v-for="item in audioResourcesList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button v-loading="loading" type="primary" @click="doSave">{{ $t('global.confirm') }}</el-button>
<el-button @click="handleClose">{{ $t('global.cancel') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { createIscsResources, updateIscsResources } from '@/api/iscs';
import { queryAllAudioResources } from '@/api/audioResources';
export default {
name: 'DeviceAdd',
props: {
mapList: {
type: Array,
default: function () {
return [];
}
},
systemList: {
type: Array,
default: function () {
return [];
}
},
typeList: {
type: Array,
default: function () {
return [];
}
}
},
data() {
return {
dialogVisible: false,
formModel: {
id: '',
mapId: '',
type: '',
system: '',
resourceIds: []
},
audioResourcesList: [],
loading: false
};
},
computed: {
rules() {
const crules = {
mapId: [
{ required: true, message: '请选择地图', trigger: 'change' }
],
system: [
{ required: true, message: '请选择系统', trigger: 'change' }
],
type: [
{ required: true, message: '请选择类型', trigger: 'change' }
],
resourceIds: [
{ required: true, message: '请选择资源', trigger: 'change' }
]
};
return crules;
},
title() {
return this.formModel.id ? '修改ISCS资源' : '创建ISCS资源';
}
},
mounted() {
queryAllAudioResources().then(resp => {
this.audioResourcesList = resp.data;
}).catch(() => {
this.$message.error('获取音频资源列表失败!');
});
},
methods: {
show(data) {
if (data) {
this.formModel.id = data.id;
this.formModel.mapId = data.mapId;
this.formModel.system = data.system;
this.formModel.type = data.type;
this.formModel.resourceIds = data.resourceIds;
}
this.dialogVisible = true;
this.$nextTick(() => {
this.$refs.ruleForm.resetFields();
});
},
doSave() {
this.$refs.ruleForm.validate(() => {
this.loading = true;
const data = {
id: this.formModel.id,
mapId: this.formModel.mapId,
system: this.formModel.system,
type: this.formModel.type,
resourceIds: this.formModel.resourceIds
};
if (data.id) {
updateIscsResources(data.id, data).then(resp => {
this.$message.success('修改ISCS资源数据成功');
this.handleClose();
this.$emit('reloadTable');
}).catch(error => {
this.$message.error(error.message);
this.loading = false;
});
} else {
createIscsResources(data).then(resp => {
this.$message.success('创建ISCS资源数据成功');
this.handleClose();
this.$emit('reloadTable');
}).catch(error => {
this.$message.error(error.message);
this.loading = false;
});
}
});
},
handleClose() {
this.formModel = {
id: '',
mapId: '',
system: '',
type: '',
resourceIds: []
};
this.dialogVisible = false;
this.loading = false;
}
}
};
</script>
<style lang="scss" scoped>
.chat-box-footer-create{
font-size: 16px;
text-align: center;
color: #fff;
position: relative;
left: 5px;
top: 6px;
line-height: 30px;
cursor: pointer;
width: 40px;
height: 40px;
border-radius: 50%;
background: green;
border: none;
display: flex;
justify-content: center;
align-items: center;
}
.chat-box-footer-send{
background: #F2F2F2;
right: 55px;
cursor: pointer;
.icon-yuyin{
color: #333;
font-size: 24px;
margin: 0;
}
&.active{
.icon-yuyin{
color: green;
}
}
.close_icon{
position: absolute;
top: 8px;
left: 45px;
font-size: 16px;
color: #333;
font-weight: 600;
padding: 3px;
}
}
#record_progress_bar{
width: 40px;
height: 40px;
position: absolute;
left: 0;
top: 0;
border-radius: 50%;
}
</style>

View File

@ -0,0 +1,203 @@
<template>
<div>
<QueryListPage ref="queryListPage" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
<add-resources
ref="addResources"
:map-list="mapList"
:system-list="systemList"
:type-list="typeList"
@reloadTable="reloadTable"
/>
</div>
</template>
<script>
import { pagedIscsResources, deleteIscsResources } from '@/api/iscs';
import AddResources from './add';
import { getPublishMapListOnline } from '@/api/jmap/map';
const systemMap = {
PA: '广播系统',
PIS: '乘客信息'
};
const systemList = [
{ value: 'PA', label: '广播信息' },
{ value: 'PIS', label: '乘客信息' }
];
const typeMap = {
RECORDING: '预录',
EMERGENCY_RECORDING: '紧急预录',
BGM: '背景音乐'
};
const typeList = [
{ value: 'RECORDING', label: '预录' },
{ value: 'EMERGENCY_RECORDING', label: '紧急预录' },
{ value: 'BGM', label: '背景音乐' }
];
export default {
name: 'DeviceManage',
components: {
AddResources
},
data() {
return {
examResultList: [],
systemList: systemList,
typeList: typeList,
url: '',
mapList: [],
pagerConfig: {
pageSize: 'pageSize',
pageIndex: 'pageNum'
},
queryForm: {
labelWidth: '120px',
reset: true,
queryObject: {
mapId: {
type: 'select',
label: '地图',
config: {
data: []
}
},
system: {
type: 'select',
label: '系统',
config: {
data: systemList
}
},
type: {
type: 'select',
label: '类型',
config: {
data: typeList
}
}
}
},
queryList: {
query: pagedIscsResources,
selectCheckShow: false,
indexShow: true,
columns: [
{
title: '地图',
prop: 'mapId',
type: 'tag',
columnValue: (row) => { return this.getMapName(row.mapId); },
tagType: (row) => { return 'success'; }
},
{
title: '系统',
prop: 'system',
type: 'tag',
columnValue: (row) => { return systemMap[row.system]; },
tagType: (row) => { return 'success'; }
},
{
title: '类型',
prop: 'type',
type: 'tag',
columnValue: (row) => { return typeMap[row.type]; },
tagType: (row) => { return 'success'; }
},
{
title: '资源',
prop: 'resources',
type: 'tagMore',
columnValue: (row) => { return this.getResources(row.resources); },
tagType: (row) => { return 'success'; }
},
{
type: 'button',
title: this.$t('global.operate'),
width: '300',
buttons: [
// {
// name: '',
// handleClick: this.editConfig
// },
{
name: this.$t('global.delete'),
handleClick: this.handleDelete,
type: 'danger'
}
]
}
],
actions: [
{ text: this.$t('global.add'), handler: this.createAudioResources}
]
},
currentModel: {}
};
},
computed: {
},
mounted() {
getPublishMapListOnline().then(resp => {
this.mapList = resp.data;
const list = [];
this.mapList.forEach(elem => {
list.push({ label: elem.name, value: elem.id });
});
this.queryForm.queryObject.mapId.config.data = list;
}).catch(() => {
this.$message.error('获取地图列表失败!');
});
},
methods: {
createProjectDevice() {
this.$refs.addResources.show();
},
getMapName(mapId) {
const mapInfo = this.mapList.find(elem => elem.id == mapId);
return mapInfo ? mapInfo.name : '';
},
handleTime(time) {
const timeList = time.split('T');
let newTime = '';
if (timeList.length > 1) {
newTime = timeList[0] + ' ' + timeList[1];
} else {
newTime = time;
}
return newTime;
},
getResources(resources) {
const array = [];
resources.forEach(elem => {
array.push(elem.name);
});
return array;
},
//
handleDelete(index, row) {
this.$confirm('此操作将删除该ISCS资源数据', this.$t('global.tips'), {
confirmButtonText: this.$t('global.confirm'),
cancelButtonText: this.$t('global.cancel'),
type: 'warning'
}).then(() => {
deleteIscsResources(row.id).then(response => {
this.$message.success(this.$t('system.deleteSuccess'));
this.reloadTable();
}).catch(() => {
this.reloadTable();
this.$messageBox(this.$t('error.deleteFailed'));
});
});
},
createAudioResources() {
this.$refs.addResources.show();
},
editConfig(index, row) {
this.$refs.addResources.show(row);
},
reloadTable() {
this.queryList.reload();
}
}
};
</script>

View File

@ -47,10 +47,10 @@ export default {
title: '接口域名',
prop: 'domainName'
},
{
title: '资源域名',
prop: 'resourcesDomainName'
},
{
title: '资源域名',
prop: 'resourcesDomainName'
},
{
title: '项目名称',
prop: 'projectCode',

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) {