desc: 调整国际化，高度问题
This commit is contained in:
zyy
parent
a43f1bd2c9
commit
bc332c1a9d
@ -49,10 +49,10 @@ import TeachDetail from '@/views/teach/detail/index';
|
||||
import TeachHome from '@/views/teach/index';
|
||||
import Pay from '@/views/components/pay/index';
|
||||
|
||||
import ExamDetail from '@/views/exam/detail/examDetail';
|
||||
import ExamHome from '@/views/exam/index';
|
||||
import ExamCourseDetail from '@/views/exam/detail/courseDetail';
|
||||
import ExamResult from '@/views/exam/result';
|
||||
import ExamDetail from '@/views/exam/detail/examDetail';
|
||||
import ExamCourseDetail from '@/views/exam/detail/courseDetail';
|
||||
|
||||
import DemonstrationDetail from '@/views/demonstration/detail/index';
|
||||
|
||||
|
||||
@ -49,53 +49,53 @@
|
||||
import {reviewLessonDetail} from '@/api/designPlatform';
|
||||
|
||||
export default {
|
||||
name: 'LessonApprovalDetail',
|
||||
components: {
|
||||
name: 'LessonApprovalDetail',
|
||||
components: {
|
||||
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
tableData: [],
|
||||
lessonName: '',
|
||||
lessonRemark: '',
|
||||
showDetail: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
height() {
|
||||
return this.$store.state.app.height - 260;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
tableData: [],
|
||||
lessonName: '',
|
||||
lessonRemark: '',
|
||||
showDetail: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
height() {
|
||||
return this.$store.state.app.height - 260;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
// this.loadInitData();
|
||||
},
|
||||
beforeDestroy() {
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
// this.loadInitData();
|
||||
},
|
||||
beforeDestroy() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
show(lessonId) {
|
||||
this.showDetail = true;
|
||||
this.loadInitData(lessonId);
|
||||
},
|
||||
loadInitData(lessonId) {
|
||||
this.loading =true;
|
||||
reviewLessonDetail(lessonId).then(response =>{
|
||||
this.tableData = response.data[0].children;
|
||||
this.lessonName = response.data[0].name;
|
||||
this.lessonRemark = response.data[0].remarks;
|
||||
this.loading = false;
|
||||
}).catch(()=>{
|
||||
this.$messageBox(this.$t('approval.failedToGetCourseData'));
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
show(lessonId) {
|
||||
this.showDetail = true;
|
||||
this.loadInitData(lessonId);
|
||||
},
|
||||
loadInitData(lessonId) {
|
||||
this.loading = true;
|
||||
reviewLessonDetail(lessonId).then(response =>{
|
||||
this.tableData = response.data[0].children;
|
||||
this.lessonName = response.data[0].name;
|
||||
this.lessonRemark = response.data[0].remarks;
|
||||
this.loading = false;
|
||||
}).catch(()=>{
|
||||
this.$messageBox(this.$t('approval.failedToGetCourseData'));
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -58,6 +58,7 @@ import { getDetailList } from '@/api/management/dictionary';
|
||||
import { mapGetters } from 'vuex';
|
||||
import { launchFullscreen } from '@/utils/screen';
|
||||
import { UrlConfig } from '@/router/index';
|
||||
import LangStorage from '@/utils/lang';
|
||||
|
||||
export default {
|
||||
name: 'ExamDetailView',
|
||||
@ -84,10 +85,7 @@ export default {
|
||||
computed: {
|
||||
...mapGetters('trainingList', [
|
||||
'trainingList'
|
||||
]),
|
||||
height() {
|
||||
return this.$store.state.app.height - 50;
|
||||
}
|
||||
])
|
||||
},
|
||||
watch: {
|
||||
'$route.params.examId': function (val) {
|
||||
@ -125,6 +123,36 @@ export default {
|
||||
this.typeList = [];
|
||||
await getDetailList('training_type').then(res => {
|
||||
this.typeList = res.data;
|
||||
if (LangStorage.getLang() == 'en') {
|
||||
this.typeList.forEach(item => {
|
||||
switch (item.code) {
|
||||
case '01':
|
||||
item.name = 'Control permission operation';
|
||||
break;
|
||||
case '02':
|
||||
item.name = 'Signalling machine operation';
|
||||
break;
|
||||
case '03':
|
||||
item.name = 'Turnout operation';
|
||||
break;
|
||||
case '04':
|
||||
item.name = 'Section operation';
|
||||
break;
|
||||
case '05':
|
||||
item.name = 'Platform operation';
|
||||
break;
|
||||
case '06':
|
||||
item.name = 'Train scheduling operation';
|
||||
break;
|
||||
case '07':
|
||||
item.name = 'Train operation';
|
||||
break;
|
||||
case '08':
|
||||
item.name = 'Temporary speed limit operation of the whole line';
|
||||
break;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
async loadInitPage(examId) {
|
||||
|
||||
@ -6,23 +6,10 @@
|
||||
</div>
|
||||
</el-card>
|
||||
<el-card v-loading="loading">
|
||||
<el-table
|
||||
:data="tableData"
|
||||
border
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column
|
||||
prop="name"
|
||||
:label="this.$t('exam.courseName')"
|
||||
/>
|
||||
<el-table-column
|
||||
prop="remarks"
|
||||
show-overflow-tooltip
|
||||
:label="this.$t('exam.courseDescription')"
|
||||
/>
|
||||
<el-table-column
|
||||
:label="this.$t('global.operate')"
|
||||
>
|
||||
<el-table :data="tableData" border style="width: 100%">
|
||||
<el-table-column prop="name" :label="this.$t('exam.courseName')" />
|
||||
<el-table-column prop="remarks" show-overflow-tooltip :label="this.$t('exam.courseDescription')" />
|
||||
<el-table-column :label="this.$t('global.operate')">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="primary" @click="goLesson(scope.row)">
|
||||
{{ $t('exam.enterTheExam') }}
|
||||
|
||||
@ -1,43 +1,33 @@
|
||||
<template>
|
||||
<div v-loading="loading">
|
||||
<el-card class="paper" :style="{height: height - 10 + 'px'}">
|
||||
<div slot="header" style="text-align: center;">
|
||||
<span style="font-weight:bold ">{{ $t('exam.examResultsDetails') }}</span>
|
||||
</div>
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper" :style="{height: height - 150 + 'px'}">
|
||||
<div class="context">
|
||||
<el-form ref="form" :model="resultModel" size="mini">
|
||||
<el-form-item :label="this.$t('exam.testQuestionsName')+':'" prop="name">
|
||||
<span>{{ resultModel.examName }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="this.$t('exam.testScores')+':'" prop="score">
|
||||
<span>{{ resultModel.score + ' '+ $t('exam.points') }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="this.$t('exam.whetherThrough')+':'" prop="detail">
|
||||
<span v-if="resultModel.result === '01'" style="color:darkgray">{{ $t('exam.didNotCalculate') }}</span>
|
||||
<span v-else-if="resultModel.result === '02'" style="color:green">{{ $t('exam.pass') }}</span>
|
||||
<span v-else-if="resultModel.result === '03'" style="color:red">{{ $t('exam.notPass') }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="this.$t('exam.examTime')+':'" prop="detail">
|
||||
<span>{{ Math.ceil(resultModel.usedTime/60) + ' '+ $t('global.minutes') }}</span>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-table
|
||||
:data="resultModel.userExamQuestionsVOs"
|
||||
border
|
||||
style="width: 100%"
|
||||
:summary-method="getSummaries"
|
||||
show-summary
|
||||
>
|
||||
<el-table-column prop="trainingName" :label="this.$t('exam.trainingName')" />
|
||||
<el-table-column prop="score" :label="this.$t('exam.trainingScore')" />
|
||||
</el-table>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
<div style="position: relative; float: right; right: 60px; bottom: -30px;">
|
||||
<el-button type="primary " @click="back">{{ $t('exam.returnToExamList') }}</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
<div v-loading="loading" class="joylink-card paper">
|
||||
<div class="card-title">
|
||||
<span style="font-weight:bold ">{{ $t('exam.examResultsDetails') }}</span>
|
||||
</div>
|
||||
<div class="context">
|
||||
<el-form ref="form" :model="resultModel" size="mini">
|
||||
<el-form-item :label="this.$t('exam.testQuestionsName')+':'" prop="name">
|
||||
<span>{{ resultModel.examName }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="this.$t('exam.testScores')+':'" prop="score">
|
||||
<span>{{ resultModel.score + ' '+ $t('exam.points') }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="this.$t('exam.whetherThrough')+':'" prop="detail">
|
||||
<span v-if="resultModel.result === '01'" style="color:darkgray">{{ $t('exam.didNotCalculate') }}</span>
|
||||
<span v-else-if="resultModel.result === '02'" style="color:green">{{ $t('exam.pass') }}</span>
|
||||
<span v-else-if="resultModel.result === '03'" style="color:red">{{ $t('exam.notPass') }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item :label="this.$t('exam.examTime')+':'" prop="detail">
|
||||
<span>{{ Math.ceil(resultModel.usedTime/60) + ' '+ $t('global.minutes') }}</span>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-table :data="resultModel.userExamQuestionsVOs" border style="width: 100%; min-height: 200px;" :summary-method="getSummaries" show-summary>
|
||||
<el-table-column prop="trainingName" :label="this.$t('exam.trainingName')" />
|
||||
<el-table-column prop="score" :label="this.$t('exam.trainingScore')" />
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="draf_box">
|
||||
<el-button type="primary " @click="back">{{ $t('exam.returnToExamList') }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
@ -124,19 +114,25 @@ export default {
|
||||
};
|
||||
</script>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
/deep/ {
|
||||
.scrollbar-wrapper {
|
||||
margin-bottom: 0 !important;
|
||||
.paper {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
.card-title{
|
||||
height: 47px;
|
||||
line-height: 47px;
|
||||
border-bottom: 1px solid #e6e6e6;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.context {
|
||||
padding: 30px 60px;
|
||||
height: calc(100% - 107px);
|
||||
overflow: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.paper {
|
||||
width: 900px;
|
||||
margin: 0 auto;
|
||||
border: 1px solid #F8F8F8;
|
||||
}
|
||||
|
||||
.context {
|
||||
margin: 30px 60px;
|
||||
.draf_box{
|
||||
padding: 10px 0;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -52,11 +52,6 @@ export default {
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
height() {
|
||||
return this.$store.state.app.height - 180;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
convertTreeData(list, data) {
|
||||
let tree = [];
|
||||
|
||||
@ -1,14 +1,12 @@
|
||||
<template>
|
||||
<div class="app-wrapper">
|
||||
<el-scrollbar wrap-class="scrollbar-wrapper">
|
||||
<div v-show="listShow" class="examList" :style="{width: widthLeft+'px'}">
|
||||
<demon-list ref="demonList" :height="height" />
|
||||
</div>
|
||||
<drap-left :width-left="widthLeft" @drapWidth="drapWidth" />
|
||||
<transition>
|
||||
<router-view />
|
||||
</transition>
|
||||
</el-scrollbar>
|
||||
<div v-show="listShow" class="examList" :style="{width: widthLeft+'px'}">
|
||||
<demon-list ref="demonList" :height="height" />
|
||||
</div>
|
||||
<drap-left :width-left="widthLeft" @drapWidth="drapWidth" />
|
||||
<transition>
|
||||
<router-view />
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -19,41 +17,41 @@ import drapLeft from '@/views/components/drapLeft/index';
|
||||
import localStore from 'storejs';
|
||||
|
||||
export default {
|
||||
name: 'Exam',
|
||||
components: {
|
||||
demonList,
|
||||
drapLeft
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
listShow: true,
|
||||
widthLeft: 450
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'lessonbar'
|
||||
]),
|
||||
height() {
|
||||
return this.$store.state.app.height;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'lessonbar.opened': function (val) {
|
||||
this.listShow = val;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.widthLeft = Number(localStore.get('LeftWidth'));
|
||||
},
|
||||
methods: {
|
||||
refresh() {
|
||||
this.$refs && this.$refs.demonList && this.$refs.demonList.refresh();
|
||||
},
|
||||
drapWidth(width) {
|
||||
this.widthLeft = Number(width);
|
||||
}
|
||||
}
|
||||
name: 'Exam',
|
||||
components: {
|
||||
demonList,
|
||||
drapLeft
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
listShow: true,
|
||||
widthLeft: 450
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'lessonbar'
|
||||
]),
|
||||
height() {
|
||||
return this.$store.state.app.height;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'lessonbar.opened': function (val) {
|
||||
this.listShow = val;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.widthLeft = Number(localStore.get('LeftWidth'));
|
||||
},
|
||||
methods: {
|
||||
refresh() {
|
||||
this.$refs && this.$refs.demonList && this.$refs.demonList.refresh();
|
||||
},
|
||||
drapWidth(width) {
|
||||
this.widthLeft = Number(width);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
|
||||
@ -92,12 +92,12 @@ export default {
|
||||
|
||||
const member = memberVOList.find(elem=>{ return elem.id == element.memberId; });
|
||||
|
||||
const memberName = member.name ? ' - ' + member.name:'';
|
||||
const memberName = member.name ? ' - ' + member.name : '';
|
||||
switch (element.type) {
|
||||
case 'Conversation':
|
||||
{
|
||||
const target = memberVOList.find(elem=>{ return elem.id == element.targetId; });
|
||||
const targetName = target.name ? ' - ' + target.name:'';
|
||||
const targetName = target.name ? ' - ' + target.name : '';
|
||||
this.actionInfoList.push({id: element.id, isCoversition: true, memberName: member.role + memberName, targetName: target.role + targetName, reply: element.reply, row: element, visible: true});
|
||||
break;
|
||||
}
|
||||
|
||||
@ -10,76 +10,76 @@ import { DeviceMenu } from '@/scripts/ConstDic';
|
||||
import { putJointTrainingUserkicked } from '@/api/chat';
|
||||
|
||||
export default {
|
||||
name: 'TrainingOperateMenu',
|
||||
components: {
|
||||
PopMenu
|
||||
},
|
||||
props: {
|
||||
point: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
clickUserId: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
menu: [],
|
||||
menuShow: [
|
||||
{
|
||||
label: this.$t('trainRoom.kickOutTheRoom'),
|
||||
handler: this.kicked
|
||||
}
|
||||
],
|
||||
userId: ''
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'$store.state.menuOperation.menuCount': function (val) {
|
||||
if (this.$store.getters['menuOperation/checkDialogIsOpen'](DeviceMenu.JointRoom)) {
|
||||
this.doShow(this.$store.state.menuOperation.menuPosition);
|
||||
} else {
|
||||
this.doClose();
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.userId = this.$store.state.user.id;
|
||||
this.closeEvent();
|
||||
},
|
||||
methods: {
|
||||
closeEvent() {
|
||||
const self = this;
|
||||
window.onclick = function (e) {
|
||||
self.doClose();
|
||||
};
|
||||
},
|
||||
doShow(point) {
|
||||
this.closeEvent();
|
||||
if (this.userId != this.clickUserId) {
|
||||
this.menu = this.menuShow;
|
||||
if (this.$refs && this.$refs.popMenu) {
|
||||
this.$refs.popMenu.resetShowPosition(point);
|
||||
}
|
||||
} else {
|
||||
this.menu = [];
|
||||
}
|
||||
name: 'TrainingOperateMenu',
|
||||
components: {
|
||||
PopMenu
|
||||
},
|
||||
props: {
|
||||
point: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
clickUserId: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
menu: [],
|
||||
menuShow: [
|
||||
{
|
||||
label: this.$t('trainRoom.kickOutTheRoom'),
|
||||
handler: this.kicked
|
||||
}
|
||||
],
|
||||
userId: ''
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'$store.state.menuOperation.menuCount': function (val) {
|
||||
if (this.$store.getters['menuOperation/checkDialogIsOpen'](DeviceMenu.JointRoom)) {
|
||||
this.doShow(this.$store.state.menuOperation.menuPosition);
|
||||
} else {
|
||||
this.doClose();
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.userId = this.$store.state.user.id;
|
||||
this.closeEvent();
|
||||
},
|
||||
methods: {
|
||||
closeEvent() {
|
||||
const self = this;
|
||||
window.onclick = function (e) {
|
||||
self.doClose();
|
||||
};
|
||||
},
|
||||
doShow(point) {
|
||||
this.closeEvent();
|
||||
if (this.userId != this.clickUserId) {
|
||||
this.menu = this.menuShow;
|
||||
if (this.$refs && this.$refs.popMenu) {
|
||||
this.$refs.popMenu.resetShowPosition(point);
|
||||
}
|
||||
} else {
|
||||
this.menu = [];
|
||||
}
|
||||
|
||||
},
|
||||
doClose() {
|
||||
if (this.$refs && this.$refs.popMenu) {
|
||||
this.$refs.popMenu.close();
|
||||
}
|
||||
},
|
||||
async kicked() {
|
||||
try {
|
||||
await putJointTrainingUserkicked(this.clickUserId, this.$route.query.group);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
doClose() {
|
||||
if (this.$refs && this.$refs.popMenu) {
|
||||
this.$refs.popMenu.close();
|
||||
}
|
||||
},
|
||||
async kicked() {
|
||||
try {
|
||||
await putJointTrainingUserkicked(this.clickUserId, this.$route.query.group);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -35,12 +35,9 @@
|
||||
id="dope"
|
||||
v-model="text"
|
||||
style="width: 99%;height: 47px; border: none;outline: none;"
|
||||
name=""
|
||||
rows=""
|
||||
cols=""
|
||||
@keyup="changeText"
|
||||
/>
|
||||
<button class="sendBtn" @click="sendText()" :disabled="disabled">{{$t('trainRoom.sendText')}}</button>
|
||||
<button class="sendBtn" :disabled="disabled" @click="sendText()">{{ $t('trainRoom.sendText') }}</button>
|
||||
<div
|
||||
class="sendBtn yuyin_start zIndex1"
|
||||
:style="{background: background}"
|
||||
@ -48,7 +45,7 @@
|
||||
@mouseup="stopRecording()"
|
||||
>{{ speak }}</div>
|
||||
<div v-show="sending" class="sendBtn yuyin_start zIndex2" :style="{background: background}">
|
||||
{{$t('trainRoom.sending')}}</div>
|
||||
{{ $t('trainRoom.sending') }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -59,168 +56,168 @@ import HZRecorder from '@/utils/HZRecorder';
|
||||
import { getHistoryVoice, chatWithText, chatWithAudio } from '@/api/chat';
|
||||
|
||||
export default {
|
||||
name: 'TrainChat',
|
||||
props: {
|
||||
groupRoom: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
textList: [],
|
||||
topic: '/user/topic/chatroom',
|
||||
text: '',
|
||||
recorders: null,
|
||||
stomp: null,
|
||||
speak: this.$t('trainRoom.holdAndTalk'),
|
||||
sending: false,
|
||||
background: '',
|
||||
userId: '',
|
||||
disabled:true,
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'$store.state.socket.chatContentList': function (val) { // 房间内语音聊天
|
||||
if (val.chatInfo) {
|
||||
this.handelTextList(val);
|
||||
}
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
this.userId = this.$store.state.user.id;
|
||||
// this.getHistory(); // 获取历史记录
|
||||
},
|
||||
methods: {
|
||||
// 发送文字
|
||||
async sendText() {
|
||||
if (!this.text.trim()) {
|
||||
// alert(this.$t('trainRoom.contentIsEmptyAndCannotBeSent'));
|
||||
// this.text = '';
|
||||
} else {
|
||||
try {
|
||||
await chatWithText(this.text, this.groupRoom);
|
||||
this.text = '';
|
||||
this.disabled=true;
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
name: 'TrainChat',
|
||||
props: {
|
||||
groupRoom: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
changeText(){
|
||||
if (!this.text.trim()){
|
||||
this.disabled=true;
|
||||
}else{
|
||||
this.disabled=false;
|
||||
}
|
||||
data() {
|
||||
return {
|
||||
textList: [],
|
||||
topic: '/user/topic/chatroom',
|
||||
text: '',
|
||||
recorders: null,
|
||||
stomp: null,
|
||||
speak: this.$t('trainRoom.holdAndTalk'),
|
||||
sending: false,
|
||||
background: '',
|
||||
userId: '',
|
||||
disabled:true
|
||||
};
|
||||
},
|
||||
// 语音录制开始
|
||||
startRecording() {
|
||||
this.background = '#ccc';
|
||||
this.speak = this.$t('trainRoom.recording');
|
||||
this.sending = false;
|
||||
HZRecorder.init.get(rec => {
|
||||
if (typeof rec == 'object') {
|
||||
this.recorders = rec;
|
||||
this.recorders.start();
|
||||
}
|
||||
});
|
||||
},
|
||||
// 停止录制
|
||||
async stopRecording() {
|
||||
this.background = '';
|
||||
this.speak = this.$t('trainRoom.holdAndTalk');
|
||||
this.sending = true;
|
||||
if (this.recorders) {
|
||||
this.recorders.stop();
|
||||
var fd = new FormData();
|
||||
fd.append('file', this.recorders.getBlob());
|
||||
await chatWithAudio(fd, this.$route.query.group).catch(error => {
|
||||
this.sending = false;
|
||||
const message = JSON.parse(error.message);
|
||||
if (message.err_no == 3301) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: this.$t('error.problemWithAudioQuality'),
|
||||
type: 'error'
|
||||
});
|
||||
} else if (message.err_no == 3308) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: this.$t('error.audioIsTooLong'),
|
||||
type: 'error'
|
||||
});
|
||||
} else if (message.err_no == 3314) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: this.$t('error.audioIsTooShort'),
|
||||
type: 'error'
|
||||
});
|
||||
} else {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: this.$t('error.networkProblem'),
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
});
|
||||
this.recorders = null;
|
||||
} else {
|
||||
this.sending = false;
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: this.$t('error.audioIsTooShort'),
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
},
|
||||
playAudio(nor) {
|
||||
this.$refs.audio.src = nor.src;
|
||||
this.$refs.audio.play();
|
||||
},
|
||||
// 获取历史记录
|
||||
async getHistory(obj, node, data) {
|
||||
this.textList = [];
|
||||
try {
|
||||
const res = await getHistoryVoice(this.code);
|
||||
res.data.forEach(item => {
|
||||
let isSelf = false;
|
||||
if (item.userId == this.userId) {
|
||||
isSelf = true;
|
||||
}
|
||||
const param = {
|
||||
join: false,
|
||||
value: item.message,
|
||||
self: isSelf,
|
||||
voice: item.isAudio,
|
||||
src: item.isAudio ? `${process.env.VOICE_API}/jlcloud/audio/${item.audioPath}` : '',
|
||||
other: !isSelf,
|
||||
userName: item.nickName,
|
||||
chatTime: item.chatTime
|
||||
};
|
||||
this.handelTextList(param);
|
||||
});
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
},
|
||||
// 操作聊天内容list
|
||||
handelTextList(params) {
|
||||
if (!params.inSimulation) {
|
||||
this.textList.push(params);
|
||||
this.textList.sort((a, b) => {
|
||||
return a.date - b.date;
|
||||
});
|
||||
}
|
||||
this.sending = false;
|
||||
this.$store.dispatch('socket/setChatContentList', {});
|
||||
this.$nextTick(() => {
|
||||
if (this.$refs.content) {
|
||||
this.$refs.content.scrollTop = this.$refs.content.scrollHeight;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
watch: {
|
||||
'$store.state.socket.chatContentList': function (val) { // 房间内语音聊天
|
||||
if (val.chatInfo) {
|
||||
this.handelTextList(val);
|
||||
}
|
||||
}
|
||||
},
|
||||
async mounted() {
|
||||
this.userId = this.$store.state.user.id;
|
||||
// this.getHistory(); // 获取历史记录
|
||||
},
|
||||
methods: {
|
||||
// 发送文字
|
||||
async sendText() {
|
||||
if (!this.text.trim()) {
|
||||
// alert(this.$t('trainRoom.contentIsEmptyAndCannotBeSent'));
|
||||
// this.text = '';
|
||||
} else {
|
||||
try {
|
||||
await chatWithText(this.text, this.groupRoom);
|
||||
this.text = '';
|
||||
this.disabled = true;
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
},
|
||||
changeText() {
|
||||
if (!this.text.trim()) {
|
||||
this.disabled = true;
|
||||
} else {
|
||||
this.disabled = false;
|
||||
}
|
||||
},
|
||||
// 语音录制开始
|
||||
startRecording() {
|
||||
this.background = '#ccc';
|
||||
this.speak = this.$t('trainRoom.recording');
|
||||
this.sending = false;
|
||||
HZRecorder.init.get(rec => {
|
||||
if (typeof rec == 'object') {
|
||||
this.recorders = rec;
|
||||
this.recorders.start();
|
||||
}
|
||||
});
|
||||
},
|
||||
// 停止录制
|
||||
async stopRecording() {
|
||||
this.background = '';
|
||||
this.speak = this.$t('trainRoom.holdAndTalk');
|
||||
this.sending = true;
|
||||
if (this.recorders) {
|
||||
this.recorders.stop();
|
||||
var fd = new FormData();
|
||||
fd.append('file', this.recorders.getBlob());
|
||||
await chatWithAudio(fd, this.$route.query.group).catch(error => {
|
||||
this.sending = false;
|
||||
const message = JSON.parse(error.message);
|
||||
if (message.err_no == 3301) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: this.$t('error.problemWithAudioQuality'),
|
||||
type: 'error'
|
||||
});
|
||||
} else if (message.err_no == 3308) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: this.$t('error.audioIsTooLong'),
|
||||
type: 'error'
|
||||
});
|
||||
} else if (message.err_no == 3314) {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: this.$t('error.audioIsTooShort'),
|
||||
type: 'error'
|
||||
});
|
||||
} else {
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: this.$t('error.networkProblem'),
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
});
|
||||
this.recorders = null;
|
||||
} else {
|
||||
this.sending = false;
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: this.$t('error.audioIsTooShort'),
|
||||
type: 'error'
|
||||
});
|
||||
}
|
||||
},
|
||||
playAudio(nor) {
|
||||
this.$refs.audio.src = nor.src;
|
||||
this.$refs.audio.play();
|
||||
},
|
||||
// 获取历史记录
|
||||
async getHistory(obj, node, data) {
|
||||
this.textList = [];
|
||||
try {
|
||||
const res = await getHistoryVoice(this.code);
|
||||
res.data.forEach(item => {
|
||||
let isSelf = false;
|
||||
if (item.userId == this.userId) {
|
||||
isSelf = true;
|
||||
}
|
||||
const param = {
|
||||
join: false,
|
||||
value: item.message,
|
||||
self: isSelf,
|
||||
voice: item.isAudio,
|
||||
src: item.isAudio ? `${process.env.VOICE_API}/jlcloud/audio/${item.audioPath}` : '',
|
||||
other: !isSelf,
|
||||
userName: item.nickName,
|
||||
chatTime: item.chatTime
|
||||
};
|
||||
this.handelTextList(param);
|
||||
});
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
},
|
||||
// 操作聊天内容list
|
||||
handelTextList(params) {
|
||||
if (!params.inSimulation) {
|
||||
this.textList.push(params);
|
||||
this.textList.sort((a, b) => {
|
||||
return a.date - b.date;
|
||||
});
|
||||
}
|
||||
this.sending = false;
|
||||
this.$store.dispatch('socket/setChatContentList', {});
|
||||
this.$nextTick(() => {
|
||||
if (this.$refs.content) {
|
||||
this.$refs.content.scrollTop = this.$refs.content.scrollHeight;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
@ -34,7 +34,6 @@
|
||||
</el-tree>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user