删除不用文件
This commit is contained in:
parent
39524dfad3
commit
9b7b1d7bc8
@ -53,6 +53,7 @@
|
||||
<script>
|
||||
import { getScriptPageListOnline, getScriptById, getDraftScriptByGroup } from '@/api/script';
|
||||
|
||||
// 剧本弹窗
|
||||
export default {
|
||||
name: 'AddQuest',
|
||||
props: {
|
||||
|
@ -1,692 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<div v-show="showChat && !minimize" class="reminder-drag">
|
||||
<div class="tabs-roles">
|
||||
<div class="roles roles-first">聊天窗口</div>
|
||||
<div class="minimality" @click="handleMinimality('min')">
|
||||
<i class="el-icon-remove" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="reminder-content">
|
||||
<div class="tabs-content">
|
||||
<div class="relation">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{ height: '290px' }">
|
||||
<el-tree
|
||||
ref="personTree"
|
||||
:data="treeData"
|
||||
:props="defaultProps"
|
||||
node-key="nodeId"
|
||||
@node-click="chatClick"
|
||||
>
|
||||
<span slot-scope="{ node, data }">
|
||||
<span
|
||||
style="font-size: 14px; padding-left: 12px; color: #606266; cursor: pointer;"
|
||||
>{{ data.name ? data.name : data.groupNumber }}</span>
|
||||
</span>
|
||||
</el-tree>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
<div class="box">
|
||||
<audio ref="audio" style="display: none;" />
|
||||
<audio ref="audioAuto" style="display: none;" />
|
||||
<div v-show="!chatShow" class="hello content">
|
||||
<div ref="content" class="chatContent">
|
||||
<ul class="newsList">
|
||||
<div v-for="(nor, index) in textList" :key="index" style="margin-top: 5px;">
|
||||
<li v-if="nor.self" style="position: relative">
|
||||
<div
|
||||
class="userName"
|
||||
style="position: absolute; right: 4px; top: 4px; font-size: 14px;"
|
||||
>
|
||||
{{ `${ChatFomat.formatTime(nor.chatTime)} ${ChatFomat.formatName(nor.member)}` }}
|
||||
</div>
|
||||
<div class="news">
|
||||
<span>{{ ChatFomat.formatSay(nor) }}</span>
|
||||
</div>
|
||||
<div v-if="nor.voice" class="yuyin" @click="playAudio(nor)">
|
||||
<i class="el-icon-caret-right" />
|
||||
</div>
|
||||
</li>
|
||||
<li v-if="nor.other" style="position: relative">
|
||||
<div
|
||||
class="userName"
|
||||
style="position: absolute; left: 12px; top: 4px; font-size: 14px;"
|
||||
>
|
||||
{{ `${ChatFomat.formatName(nor.member)} ${ChatFomat.formatTime(nor.chatTime)}` }}
|
||||
</div>
|
||||
<div class="answers">
|
||||
<span>{{ ChatFomat.formatSay(nor) }}</span>
|
||||
</div>
|
||||
<div v-if="nor.voice" class="yuyin1" @click="playAudio(nor)">
|
||||
<i class="el-icon-caret-right" />
|
||||
</div>
|
||||
</li>
|
||||
</div>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="footChat">
|
||||
<div class="inputBox">
|
||||
<div
|
||||
class="sendBtn zIndex1"
|
||||
:style="{background: background}"
|
||||
@mousedown="startRecording()"
|
||||
@mouseup="stopRecording()"
|
||||
>{{ speak }}</div>
|
||||
<div v-show="sending" class="sendBtn zIndex2" :style="{background: background}">
|
||||
发送中...
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 遮罩层 -->
|
||||
<div v-show="chatShow" class="hello content" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-show="showChat && minimize" class="reminder-drag minimize-box">
|
||||
<div class="chat-title">聊天窗口</div>
|
||||
<div class="minimality" @click="handleMinimality('max')">
|
||||
<i class="el-icon-circle-plus" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import Vue from 'vue';
|
||||
import HZRecorder from '@/utils/HZRecorder';
|
||||
import ChatFomat from '@/utils/chatFomat';
|
||||
import { postDataBd, getConversation } from '@/api/chat';
|
||||
import { sendCommand } from '@/api/jmap/training';
|
||||
import { displayTopic, clearSubscribe } from '@/utils/stomp';
|
||||
import { EventBus } from '@/scripts/event-bus';
|
||||
|
||||
export default {
|
||||
name: 'ChartView',
|
||||
props: {
|
||||
group: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
userId: '',
|
||||
ws: null,
|
||||
flag: false,
|
||||
recorders: null,
|
||||
text: '',
|
||||
textList: [],
|
||||
personList: [],
|
||||
showChat: false,
|
||||
background: '',
|
||||
activeName: 'first',
|
||||
chatShow: true,
|
||||
code: '',
|
||||
label: '',
|
||||
message: {},
|
||||
sending: false,
|
||||
speak: '按住说话',
|
||||
conversationId: '',
|
||||
treeData: [
|
||||
{
|
||||
children: [],
|
||||
name: '集中站'
|
||||
},
|
||||
{
|
||||
children: [],
|
||||
name: '列车'
|
||||
}
|
||||
],
|
||||
defaultProps: {
|
||||
children: 'children'
|
||||
},
|
||||
minimize: false,
|
||||
ChatFomat: ChatFomat
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'$store.state.map.map.stationList': function (val) { // 执行一次 以后不会有变化
|
||||
if (val.length) {
|
||||
this.initMenu(val);
|
||||
}
|
||||
},
|
||||
'$store.state.socket.simulationText': function (val) { // 仿真聊天
|
||||
if (val.conversationId) {
|
||||
this.handleSimulationText(val);
|
||||
}
|
||||
},
|
||||
'$store.state.training.switchcount': function () {
|
||||
this.$nextTick(() => {
|
||||
const started = this.$store.state.training.started;
|
||||
if (started) {
|
||||
this.showChat = true;
|
||||
} else {
|
||||
EventBus.$emit('trainView');
|
||||
this.showChat = false;
|
||||
this.chatShow = true;
|
||||
if (this.$refs.personTree) {
|
||||
this.$refs.personTree.setCurrentKey(null);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
EventBus.$on('trainView', () => {
|
||||
this.$nextTick(() => {
|
||||
const list = this.$store.getters['training/viewTrainList'];
|
||||
list.sort((a, b) => {
|
||||
return Number(a.groupNumber) - Number(b.groupNumber);
|
||||
});
|
||||
|
||||
this.treeData[1].children = [];
|
||||
list.forEach(item => {
|
||||
item.nodeId = item._code;
|
||||
this.treeData[1].children.push(item);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
EventBus.$on('chatSubscribeStop', () => {
|
||||
this.clearSubscribe();
|
||||
});
|
||||
|
||||
this.userId = this.$store.state.user.id;
|
||||
},
|
||||
beforeDestroy() {
|
||||
EventBus.$off('trainView');
|
||||
EventBus.$off('chatSubscribeStop');
|
||||
},
|
||||
methods: {
|
||||
handleMinimality(data) {
|
||||
if (data == 'min') {
|
||||
this.minimize = true;
|
||||
} else {
|
||||
this.minimize = false;
|
||||
}
|
||||
},
|
||||
// 获取设备集中站
|
||||
initMenu(stationList) {
|
||||
this.treeData[0].children = [];
|
||||
stationList.forEach(station => {
|
||||
if (station.centralized) {
|
||||
const node = {
|
||||
name: station.name,
|
||||
code: station.code,
|
||||
nodeId: station.code
|
||||
};
|
||||
this.treeData[0].children.push(node);
|
||||
}
|
||||
});
|
||||
},
|
||||
// 发送文字
|
||||
sendText() {
|
||||
if (!this.text.trim()) {
|
||||
alert('内容为空,不可发送!');
|
||||
this.text = '';
|
||||
} else {
|
||||
this.stomp.send('/app/chatroom', this.text);
|
||||
this.text = '';
|
||||
}
|
||||
},
|
||||
// 语音录制开始
|
||||
async startRecording() {
|
||||
if (this.conversationId) {
|
||||
this.background = '#ccc';
|
||||
this.speak = '录音中...';
|
||||
this.sending = false;
|
||||
HZRecorder.init.get(rec => {
|
||||
if (typeof rec == 'object') {
|
||||
this.recorders = rec;
|
||||
this.recorders.start();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
const params = {
|
||||
group: this.group,
|
||||
code: this.code || '',
|
||||
userId: ''
|
||||
};
|
||||
const res = await getConversation(params);
|
||||
this.conversationId = res.data.id;
|
||||
}
|
||||
},
|
||||
// 停止录制
|
||||
async stopRecording() {
|
||||
this.background = '';
|
||||
this.speak = '按住说话';
|
||||
this.sending = true;
|
||||
if (this.recorders) {
|
||||
this.recorders.stop();
|
||||
var fd = new FormData();
|
||||
fd.append('file', this.recorders.getBlob());
|
||||
const param = {
|
||||
file: fd,
|
||||
group: this.group,
|
||||
conversationId: this.conversationId
|
||||
};
|
||||
await postDataBd(param).catch(error => {
|
||||
this.sending = false;
|
||||
const message = JSON.parse(error.message);
|
||||
if (message.err_no == 3301) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: '音频质量有问题',
|
||||
type: 'error'
|
||||
});
|
||||
} else if (message.err_no == 3308) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: '音频过长,建议60s以下',
|
||||
type: 'error'
|
||||
});
|
||||
} else if (message.err_no == 3314) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: '音频太短,建议重录',
|
||||
type: 'error'
|
||||
});
|
||||
} else {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: '网络问题,请重试',
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
});
|
||||
this.recorders = null;
|
||||
} else {
|
||||
this.sending = false;
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: '音频太短,建议重录',
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
},
|
||||
playAudio(nor) {
|
||||
this.$refs.audio.src = nor.src;
|
||||
this.$refs.audio.play();
|
||||
},
|
||||
back() {
|
||||
this.stomp.send('/app/chatroom', '断开连接');
|
||||
this.clearSubscribe();
|
||||
},
|
||||
clearSubscribe() {
|
||||
clearSubscribe(displayTopic);
|
||||
},
|
||||
async chatClick(obj) {
|
||||
if (!obj.children) {
|
||||
this.textList = [];
|
||||
if (obj.code) {
|
||||
this.code = obj.code;
|
||||
} else {
|
||||
this.code = obj._code;
|
||||
}
|
||||
this.chatShow = false;
|
||||
// 获取历史记录
|
||||
const params = {
|
||||
group: this.group,
|
||||
code: this.code || '',
|
||||
userId: ''
|
||||
};
|
||||
const res = await getConversation(params);
|
||||
this.conversationId = res.data.id;
|
||||
// 临时历史记录表
|
||||
const list = this.message[this.conversationId];
|
||||
if (list && list.length) {
|
||||
list.sort((a, b) => {
|
||||
return a.date - b.date;
|
||||
});
|
||||
this.textList = [...list];
|
||||
this.$nextTick(() => {
|
||||
this.$refs.content.scrollTop = this.$refs.content.scrollHeight;
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
handleSimulationText(data) {
|
||||
if (data.conversationId == this.conversationId) {
|
||||
this.textList.push(data);
|
||||
this.textList.sort((a, b) => {
|
||||
return a.date - b.date;
|
||||
});
|
||||
}
|
||||
if (data.changeVO && data.changeVO.code) {
|
||||
const operate = {
|
||||
val: data.changeVO.val || '',
|
||||
code: data.changeVO.code,
|
||||
type: data.changeVO.type,
|
||||
operation: data.changeVO.operation
|
||||
};
|
||||
this.$refs.audioAuto.onended = () => {
|
||||
sendCommand(this.group, operate);
|
||||
};
|
||||
}
|
||||
if (data.conversationId) {
|
||||
if (!this.message[data.conversationId]) {
|
||||
this.message[data.conversationId] = [];
|
||||
}
|
||||
this.message[data.conversationId].push(data);
|
||||
}
|
||||
this.$store.dispatch('socket/setSimulationTextList');
|
||||
this.sending = false;
|
||||
this.$nextTick(() => {
|
||||
this.$refs.content.scrollTop = this.$refs.content.scrollHeight;
|
||||
if (data.id != this.userId && !data.group) {
|
||||
this.$refs.audioAuto.src = data.src;
|
||||
this.$refs.audioAuto.play();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
.el-tree {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.el-tree-node.is-current>.el-tree-node__content {
|
||||
background-color: #e4e3e3 !important;
|
||||
}
|
||||
</style>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
/deep/ {
|
||||
.el-tabs__nav {
|
||||
margin-left: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
.reminder-drag {
|
||||
position: absolute;
|
||||
float: left;
|
||||
left: 10px;
|
||||
bottom: 10px;
|
||||
width: 500px;
|
||||
height: 340px;
|
||||
background-color: #fff;
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
font-size: 18px;
|
||||
|
||||
.reminder-content {}
|
||||
}
|
||||
|
||||
#nav {
|
||||
padding: 30px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#nav a {
|
||||
font-weight: bold;
|
||||
color: #2c3e50;
|
||||
}
|
||||
|
||||
#nav a.router-link-exact-active {
|
||||
color: #42b983;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 3px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #c7c7c7;
|
||||
}
|
||||
|
||||
.box {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.tabs-roles {
|
||||
overflow: hidden;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
|
||||
.roles {
|
||||
padding: 0 20px;
|
||||
height: 41px;
|
||||
list-style: none;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #303133;
|
||||
cursor: pointer;
|
||||
border-left: 1px solid #e4e7ed;
|
||||
border-right: 1px solid #e4e7ed;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.roles-first {
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.minimality {
|
||||
float: right;
|
||||
line-height: 40px;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-content {
|
||||
height: 300px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.content {
|
||||
-webkit-box-orient: vertical;
|
||||
height: 300px;
|
||||
/* width: 500px; */
|
||||
border: 1px solid #ccc;
|
||||
|
||||
.chatContent {
|
||||
-webkit-box-flex: 1;
|
||||
overflow-y: scroll;
|
||||
padding-right: 8px;
|
||||
height: 268px;
|
||||
|
||||
.newsList {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 10px 0;
|
||||
|
||||
li {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
padding-top: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.yuyin {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
cursor: pointer;
|
||||
margin-top: 21px;
|
||||
margin-right: 3px;
|
||||
float: right;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.yuyin1 {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
cursor: pointer;
|
||||
margin-top: 21px;
|
||||
margin-left: 3px;
|
||||
float: left;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.nesHead {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
border-radius: 50%;
|
||||
margin-left: 15px;
|
||||
float: right;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.news {
|
||||
max-width: 55%;
|
||||
width: auto;
|
||||
height: auto;
|
||||
background: #2683f5;
|
||||
padding: 6px 10px;
|
||||
margin-top: 15px;
|
||||
line-height: 20px;
|
||||
font-size: 14px;
|
||||
border-radius: 4px;
|
||||
position: relative;
|
||||
float: right;
|
||||
color: #fff;
|
||||
text-align: left;
|
||||
|
||||
.jiao {
|
||||
position: absolute;
|
||||
right: -8px;
|
||||
top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.nesHead img {
|
||||
width: 44px;
|
||||
}
|
||||
|
||||
.answerHead img {
|
||||
width: 44px;
|
||||
}
|
||||
|
||||
.answerHead {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
border-radius: 50%;
|
||||
margin-left: 15px;
|
||||
float: left;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.answers {
|
||||
max-width: 55%;
|
||||
width: auto;
|
||||
height: auto;
|
||||
background: #eee;
|
||||
padding: 5px 10px;
|
||||
margin-top: 15px;
|
||||
line-height: 22px;
|
||||
font-size: 14px;
|
||||
border-radius: 5px;
|
||||
margin-left: 10px;
|
||||
position: relative;
|
||||
float: left;
|
||||
text-align: left;
|
||||
|
||||
.jiao {
|
||||
position: absolute;
|
||||
left: -8px;
|
||||
top: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.footChat {
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
border-top: 1px solid #ccc;
|
||||
position: relative;
|
||||
|
||||
.inputBox {
|
||||
position: relative;
|
||||
|
||||
textarea {
|
||||
width: 99%;
|
||||
height: 75px;
|
||||
border: none;
|
||||
outline: none;
|
||||
resize: none;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.sendBtn {
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
border: 0;
|
||||
color: #000;
|
||||
cursor: pointer;
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.zIndex1 {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.zIndex2 {
|
||||
z-index: 2;
|
||||
background: #ccc;
|
||||
}
|
||||
}
|
||||
|
||||
.minimize-box {
|
||||
bottom: 10px;
|
||||
width: 300px;
|
||||
height: 40px;
|
||||
|
||||
.chat-title {
|
||||
float: left;
|
||||
font-size: 16px;
|
||||
margin-left: 10px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
.minimality {
|
||||
float: right;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.relation {
|
||||
width: 170px;
|
||||
float: left;
|
||||
height: 300px;
|
||||
border: 1px solid #ccc;
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
padding-top: 5px;
|
||||
/* padding: 10px 8px; */
|
||||
|
||||
.personnel {
|
||||
width: 100%;
|
||||
/* height: 20px; */
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
padding-left: 5px;
|
||||
cursor: pointer;
|
||||
padding: 3px 8px;
|
||||
|
||||
&:hover {
|
||||
background-color: #e6e6e6;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
@ -1,535 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<div v-show="showChat && !minimize" class="reminder-drag">
|
||||
<div class="tabs-roles">
|
||||
<div class="roles roles-first">{{$t('display.chatBox.chatWindow')}}</div>
|
||||
<div class="minimality" @click="handleMinimality('min')">
|
||||
<i class="el-icon-remove" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="reminder-content">
|
||||
<div class="tabs-content">
|
||||
<div class="box">
|
||||
<audio ref="audio" style="display: none;" />
|
||||
<audio ref="audioAuto" style="display: none;" />
|
||||
<div class="hello content">
|
||||
<div ref="content" class="chatContent">
|
||||
<ul class="newsList">
|
||||
<div v-for="(nor, index) in textList" :key="index" style="margin-top: 5px;">
|
||||
<li v-if="nor.self" style="position: relative">
|
||||
<div
|
||||
class="userName"
|
||||
style="position: absolute; right: 4px; top: 4px; font-size: 14px; "
|
||||
>
|
||||
{{ `${ChatFomat.formatTime(nor.chatTime)} ${ChatFomat.formatName(nor.member)}` }}
|
||||
</div>
|
||||
<div class="news">
|
||||
<span>{{ ChatFomat.formatSay(nor) }}</span>
|
||||
</div>
|
||||
<div v-if="nor.voice" class="yuyin" @click="playAudio(nor)">
|
||||
<i class="el-icon-caret-right" />
|
||||
</div>
|
||||
</li>
|
||||
<li v-if="nor.other" style="position: relative">
|
||||
<div
|
||||
class="userName"
|
||||
style="position: absolute; left: 12px; top: 4px; font-size: 14px;"
|
||||
>
|
||||
{{ `${ChatFomat.formatName(nor.member)} ${ChatFomat.formatTime(nor.chatTime)}` }}
|
||||
</div>
|
||||
<div class="answers">
|
||||
<span>{{ ChatFomat.formatSay(nor) }}</span>
|
||||
</div>
|
||||
<div v-if="nor.voice" class="yuyin1" @click="playAudio(nor)">
|
||||
<i class="el-icon-caret-right" />
|
||||
</div>
|
||||
</li>
|
||||
</div>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="switch-box">
|
||||
<span style="font-size: 12px;">{{$t('display.chatBox.autoplay')}}</span>
|
||||
<el-switch v-model="isAutoPlay" active-color="#13ce66" inactive-color="#d6d6d6" />
|
||||
</div>
|
||||
</div>
|
||||
<div v-show="showChat && minimize" class="reminder-drag minimize-box">
|
||||
<div class="chat-title">{{$t('display.chatBox.chatWindow')}}</div>
|
||||
<div class="minimality" @click="handleMinimality('max')">
|
||||
<i class="el-icon-circle-plus" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import Vue from 'vue';
|
||||
// import HZRecorder from '@/utils/HZRecorder';
|
||||
import ChatFomat from '@/utils/chatFomat';
|
||||
// import { postDataBd, postDataXf, getHistoryVoice } from '@/api/chat';
|
||||
import { displayTopic, clearSubscribe } from '@/utils/stomp';
|
||||
import { EventBus } from '@/scripts/event-bus';
|
||||
|
||||
export default {
|
||||
name: 'ChartView',
|
||||
props: {
|
||||
group: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
showLeft: {
|
||||
type: Boolean
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
userId: '',
|
||||
ws: null,
|
||||
flag: false,
|
||||
isAutoPlay: false,
|
||||
recorders: null,
|
||||
text: '',
|
||||
textList: [],
|
||||
personList: [],
|
||||
showChat: false,
|
||||
activeName: 'first',
|
||||
code: '',
|
||||
label: '',
|
||||
message: {},
|
||||
sending: false,
|
||||
speak: this.$t('display.chatBox.holdAndTalk'),
|
||||
conversationId: '',
|
||||
defaultProps: {
|
||||
children: 'children'
|
||||
},
|
||||
minimize: false,
|
||||
playAudioSet: null,
|
||||
audioList: [],
|
||||
ChatFomat: ChatFomat
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'$store.state.socket.simulationText': function (val) { // 仿真聊天
|
||||
if (val.conversationId) {
|
||||
this.handleSimulationText(val);
|
||||
}
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
EventBus.$on('showChat', () => {
|
||||
this.$nextTick(() => {
|
||||
this.showChat = true;
|
||||
});
|
||||
});
|
||||
EventBus.$on('noneChat', () => {
|
||||
this.$nextTick(() => {
|
||||
if (this.$refs.personTree) {
|
||||
this.$refs.personTree.setCurrentKey(null);
|
||||
}
|
||||
this.showChat = false;
|
||||
});
|
||||
});
|
||||
EventBus.$on('chatSubscribeStop', () => {
|
||||
this.clearSubscribe();
|
||||
});
|
||||
|
||||
this.userId = this.$store.state.user.id;
|
||||
this.playSetInterval();
|
||||
},
|
||||
beforeDestroy() {
|
||||
clearInterval(this.playAudioSet);
|
||||
this.playAudioSet = null;
|
||||
},
|
||||
methods: {
|
||||
handleMinimality(data) {
|
||||
if (data == 'min') {
|
||||
this.minimize = true;
|
||||
} else {
|
||||
this.minimize = false;
|
||||
}
|
||||
},
|
||||
playAudio(nor) {
|
||||
this.$refs.audio.src = nor.src;
|
||||
this.$refs.audio.play();
|
||||
},
|
||||
playSetInterval() {
|
||||
const that = this;
|
||||
this.playAudioSet = setInterval(() => {
|
||||
if (that.isAutoPlay && that.audioList && that.audioList.length && !that.$refs.audioAuto.currentTime) {
|
||||
const data = that.audioList[0];
|
||||
if (data) {
|
||||
that.$refs.audioAuto.src = data.src;
|
||||
that.$refs.audioAuto.play();
|
||||
that.audioList.shift();
|
||||
}
|
||||
}
|
||||
}, 2000);
|
||||
|
||||
this.$nextTick(() => {
|
||||
this.$refs.audioAuto.onended = function () {
|
||||
const data = that.audioList[0];
|
||||
if (data) {
|
||||
if (that.isAutoPlay) {
|
||||
that.$refs.audioAuto.src = data.src;
|
||||
that.$refs.audioAuto.play();
|
||||
that.audioList.shift();
|
||||
} else {
|
||||
that.$refs.audioAuto.currentTime = null;
|
||||
}
|
||||
} else {
|
||||
that.$refs.audioAuto.currentTime = null;
|
||||
}
|
||||
};
|
||||
});
|
||||
},
|
||||
clearSubscribe() {
|
||||
clearSubscribe(displayTopic);
|
||||
},
|
||||
clearTextList() {
|
||||
this.textList = [];
|
||||
},
|
||||
handleSimulationText(data) {
|
||||
this.textList.push(data);
|
||||
this.textList.sort((a, b) => {
|
||||
return a.date - b.date;
|
||||
});
|
||||
|
||||
if (data.conversationId && data.date) { // 保存历史记录表
|
||||
const paramState = {
|
||||
key: data.conversationId,
|
||||
value: data
|
||||
};
|
||||
this.$store.dispatch('socket/setMessage', paramState);
|
||||
}
|
||||
|
||||
const param = { src: data.src, name: data.value };
|
||||
this.audioList.push(param);
|
||||
|
||||
this.$nextTick(() => {
|
||||
this.$refs.content.scrollTop = this.$refs.content.scrollHeight;
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
.el-tree {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.el-tree-node.is-current>.el-tree-node__content {
|
||||
background-color: #e4e3e3 !important;
|
||||
}
|
||||
</style>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
/deep/ {
|
||||
.el-tabs__nav {
|
||||
margin-left: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
.reminder-drag {
|
||||
position: absolute;
|
||||
float: left;
|
||||
left: 10px;
|
||||
bottom: 10px;
|
||||
width: 500px;
|
||||
height: 340px;
|
||||
background-color: #fff;
|
||||
border-radius: 5px;
|
||||
overflow: hidden;
|
||||
z-index: 2;
|
||||
font-size: 18px;
|
||||
|
||||
.reminder-content {}
|
||||
}
|
||||
|
||||
#nav {
|
||||
padding: 30px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#nav a {
|
||||
font-weight: bold;
|
||||
color: #2c3e50;
|
||||
}
|
||||
|
||||
#nav a.router-link-exact-active {
|
||||
color: #42b983;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 3px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #c7c7c7;
|
||||
}
|
||||
|
||||
.box {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.tabs-roles {
|
||||
overflow: hidden;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
|
||||
.roles {
|
||||
padding: 0 20px;
|
||||
height: 41px;
|
||||
list-style: none;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #303133;
|
||||
cursor: pointer;
|
||||
border-left: 1px solid #e4e7ed;
|
||||
border-right: 1px solid #e4e7ed;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.roles-first {
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.minimality {
|
||||
float: right;
|
||||
line-height: 40px;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.tabs-content {
|
||||
height: 300px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.content {
|
||||
-webkit-box-orient: vertical;
|
||||
height: 300px;
|
||||
border: 1px solid #ccc;
|
||||
|
||||
.chatContent {
|
||||
-webkit-box-flex: 1;
|
||||
overflow-y: scroll;
|
||||
padding-right: 8px;
|
||||
height: 268px;
|
||||
|
||||
.newsList {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 10px 0;
|
||||
|
||||
li {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
padding-top: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.yuyin {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
cursor: pointer;
|
||||
margin-top: 21px;
|
||||
margin-right: 3px;
|
||||
float: right;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.yuyin1 {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
cursor: pointer;
|
||||
margin-top: 21px;
|
||||
margin-left: 3px;
|
||||
float: left;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.nesHead {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
border-radius: 50%;
|
||||
margin-left: 15px;
|
||||
float: right;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.news {
|
||||
max-width: 55%;
|
||||
width: auto;
|
||||
height: auto;
|
||||
/* background: #2683f5; */
|
||||
background: #eee;
|
||||
padding: 6px 10px;
|
||||
margin-top: 15px;
|
||||
line-height: 20px;
|
||||
font-size: 14px;
|
||||
border-radius: 4px;
|
||||
position: relative;
|
||||
float: right;
|
||||
/* color: #fff; */
|
||||
text-align: left;
|
||||
|
||||
.jiao {
|
||||
position: absolute;
|
||||
right: -8px;
|
||||
top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.nesHead img {
|
||||
width: 44px;
|
||||
}
|
||||
|
||||
.answerHead img {
|
||||
width: 44px;
|
||||
}
|
||||
|
||||
.answerHead {
|
||||
width: 44px;
|
||||
height: 44px;
|
||||
border-radius: 50%;
|
||||
margin-left: 15px;
|
||||
float: left;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.answers {
|
||||
max-width: 55%;
|
||||
width: auto;
|
||||
height: auto;
|
||||
background: #eee;
|
||||
padding: 5px 10px;
|
||||
margin-top: 15px;
|
||||
line-height: 22px;
|
||||
font-size: 14px;
|
||||
border-radius: 5px;
|
||||
margin-left: 10px;
|
||||
position: relative;
|
||||
float: left;
|
||||
text-align: left;
|
||||
|
||||
.jiao {
|
||||
position: absolute;
|
||||
left: -8px;
|
||||
top: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.footChat {
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
border-top: 1px solid #ccc;
|
||||
position: relative;
|
||||
|
||||
.inputBox {
|
||||
position: relative;
|
||||
|
||||
textarea {
|
||||
width: 99%;
|
||||
height: 75px;
|
||||
border: none;
|
||||
outline: none;
|
||||
resize: none;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.sendBtn {
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
/* background: #0188fb; */
|
||||
border: 0;
|
||||
/* position: absolute;
|
||||
bottom: 10px;
|
||||
right: 10px; */
|
||||
color: #000;
|
||||
cursor: pointer;
|
||||
font-size: 12px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.zIndex1 {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.zIndex2 {
|
||||
z-index: 2;
|
||||
background: #ccc;
|
||||
}
|
||||
}
|
||||
|
||||
.minimize-box {
|
||||
bottom: 10px;
|
||||
width: 300px;
|
||||
height: 40px;
|
||||
|
||||
.chat-title {
|
||||
float: left;
|
||||
font-size: 16px;
|
||||
margin-left: 10px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
.minimality {
|
||||
float: right;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
margin-right: 10px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.relation {
|
||||
width: 170px;
|
||||
float: left;
|
||||
height: 300px;
|
||||
border: 1px solid #ccc;
|
||||
border-left: none;
|
||||
border-right: none;
|
||||
padding-top: 5px;
|
||||
|
||||
.personnel {
|
||||
width: 100%;
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
padding-left: 5px;
|
||||
cursor: pointer;
|
||||
padding: 3px 8px;
|
||||
|
||||
&:hover {
|
||||
background-color: #e6e6e6;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.switch-box {
|
||||
position: absolute;
|
||||
right: 50px;
|
||||
top: 4px;
|
||||
width: 100px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
z-index: 3;
|
||||
}
|
||||
</style>
|
@ -21,6 +21,7 @@ import { getFailureGenerateRules, setFailureMode } from '@/api/simulation';
|
||||
import { FaultStatusEnum } from '@/scripts/FaultDic';
|
||||
import ModelType from '@/jmap/constant/deviceType';
|
||||
|
||||
// 故障列表
|
||||
export default {
|
||||
name: 'FaultChoose',
|
||||
props: {
|
||||
@ -139,7 +140,7 @@ export default {
|
||||
const faultModel = this.getFailureModel(this.auto);
|
||||
setFailureMode(faultModel, this.group).then(() => {
|
||||
this.$message.success(this.$t('display.faultChoose.setFaultSuccess'));
|
||||
}).catch(error => {
|
||||
}).catch(() => {
|
||||
this.$messageBox(this.$t('display.faultChoose.setFaultFail'));
|
||||
});
|
||||
|
||||
|
@ -6,6 +6,7 @@
|
||||
|
||||
<script>
|
||||
|
||||
// 运行图加载
|
||||
export default {
|
||||
name: 'RunPlanLoad',
|
||||
props: {
|
||||
|
@ -20,6 +20,7 @@ import { getPublishMapInfo } from '@/api/jmap/map';
|
||||
import { timeFormat } from '@/utils/date';
|
||||
import echarts from 'echarts';
|
||||
|
||||
// 运行图预览
|
||||
export default {
|
||||
name: 'RunPlanView',
|
||||
props: {
|
||||
|
@ -69,6 +69,7 @@ import { querySecheduling, generateScheduling, getSchedulingAllTrains, checkSche
|
||||
import { hexColor } from '@/utils/runPlan';
|
||||
import EditTable from '@/views/components/editTable/index';
|
||||
|
||||
// 排班计划弹窗列表
|
||||
export default {
|
||||
name: 'AddQuest',
|
||||
components: {
|
||||
|
@ -15,8 +15,8 @@
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="show = false">{{$t('global.cancel')}}</el-button>
|
||||
<el-button type="primary" :loading="status" @click="handleSure">{{$t('global.confirm')}}</el-button>
|
||||
<el-button @click="show = false">{{ $t('global.cancel') }}</el-button>
|
||||
<el-button type="primary" :loading="status" @click="handleSure">{{ $t('global.confirm') }}</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</template>
|
||||
@ -25,6 +25,7 @@
|
||||
import { prefixIntrger } from '@/utils/date';
|
||||
import { getDesignatedTimeTrainNum } from '@/api/simulation';
|
||||
|
||||
// 计划行车时间选择
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
@ -34,13 +34,14 @@
|
||||
ref="menuSchema"
|
||||
:offset="offset"
|
||||
:group="group"
|
||||
@runPlanLoadShow="runPlanLoadShow"
|
||||
@runPlanViewShow="runPlanViewShow"
|
||||
@faultChooseShow="faultChooseShow"
|
||||
@runQuestLoadShow="runQuestLoadShow"
|
||||
@runAddRolesLoadShow="runAddRolesLoadShow"
|
||||
@switchMode="switchMode"
|
||||
/>
|
||||
<!--@runPlanViewShow="runPlanViewShow"
|
||||
@faultChooseShow="faultChooseShow"
|
||||
@runPlanLoadShow="runPlanLoadShow"
|
||||
@runAddRolesLoadShow="runAddRolesLoadShow"
|
||||
@runQuestLoadShow="runQuestLoadShow"
|
||||
-->
|
||||
|
||||
<menu-system-time ref="menuSystemTime" :offset="offset" :right="right" :group="group" />
|
||||
</div>
|
||||
@ -601,9 +602,9 @@ export default {
|
||||
runPlanLoadShow() {
|
||||
this.$refs.runPlanLoad.doShow();
|
||||
},
|
||||
faultChooseShow() {
|
||||
this.$refs.faultChoose.doShow();
|
||||
},
|
||||
// faultChooseShow() {
|
||||
// this.$refs.faultChoose.doShow();
|
||||
// },
|
||||
setWindowSize() {
|
||||
this.$nextTick(() => {
|
||||
const width = this.size ? this.size.width : this.width;
|
||||
|
@ -24,7 +24,7 @@
|
||||
<el-progress class="progress" :percentage="progress" style="width: 100%" :show-text="false" />
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<el-button type="primary" class="back" @click="back">{{$t('display.replay.back')}}</el-button>
|
||||
<el-button type="primary" class="back" @click="back">{{ $t('display.replay.back') }}</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
@ -35,15 +35,13 @@
|
||||
<!-- 回放界面 -->
|
||||
<script>
|
||||
import { Notification } from 'element-ui';
|
||||
import { exitFullscreen } from '@/utils/screen';
|
||||
import ChartView from './demon/chatBox';
|
||||
// import { exitFullscreen } from '@/utils/screen';
|
||||
import { putsSimulationRecord, putsSimulationRecordPause, putsSimulationRecordPlay, putsSimulationRecordPlaySpeed, putsSimulationRecordplayTime } from '@/api/simulationRecord';
|
||||
import { EventBus } from '@/scripts/event-bus';
|
||||
|
||||
export default {
|
||||
name: 'MenuReplay',
|
||||
components: {
|
||||
ChartView
|
||||
},
|
||||
props: {
|
||||
group: {
|
||||
|
@ -6,8 +6,8 @@
|
||||
</el-select>
|
||||
|
||||
<el-button-group>
|
||||
<!-- viewRunQuest -->
|
||||
<el-button v-if="isDemon && isDesignPlatform" size="small" :disabled="viewDisabled" type="success" @click="viewScriptRoles">{{ $t('display.schema.selectRoles') }}</el-button>
|
||||
<!-- 加载剧本 -->
|
||||
<el-button v-if="isDemon && !isDesignPlatform" size="small" :disabled="viewDisabled" type="success" @click="viewRunQuest">{{ $t('display.schema.loadScript') }}</el-button>
|
||||
<el-button v-if="notScript && runing" size="small" :disabled="viewDisabled" @click="viewRunPlan">{{ $t('display.schema.previewRunDiagram') }}</el-button>
|
||||
<el-button v-if="!runing && !isPlan && notScript" size="small" :disabled="viewDisabled" type="warning" @click="loadRunPlan">{{ $t('display.schema.loadRunDiagram') }}</el-button>
|
||||
@ -22,6 +22,7 @@
|
||||
<fault-choose v-if="isDemon || isPlan || isScript" ref="faultChoose" :group="group" />
|
||||
<run-plan-Load ref="runPlanLoad" :group="group" />
|
||||
<run-plan-view ref="runPlanView" :group="group" />
|
||||
<!-- 加载剧本列表弹窗 -->
|
||||
<add-quest ref="addQuest" @selectQuest="selectQuest" />
|
||||
</div>
|
||||
</template>
|
||||
@ -36,6 +37,7 @@ import { getStationList, queryRunPlan } from '@/api/runplan';
|
||||
import { getEveryDayRunPlanData } from '@/api/simulation';
|
||||
import {getRpDetailByUserMapId} from '@/api/designPlatform';
|
||||
|
||||
// 右上角操作
|
||||
export default {
|
||||
name: 'MenuSchema',
|
||||
components: {
|
||||
|
@ -80,7 +80,7 @@ import { mapGetters } from 'vuex';
|
||||
import { timeFormat } from '@/utils/date';
|
||||
import { refreshExamList } from '@/api/management/userexam';
|
||||
import { getTrainingDetail } from '@/api/jmap/training';
|
||||
import { launchFullscreen, exitFullscreen } from '@/utils/screen';
|
||||
import { launchFullscreen } from '@/utils/screen';
|
||||
|
||||
export default {
|
||||
name: 'TipExamList',
|
||||
|
Loading…
Reference in New Issue
Block a user