Merge branch 'dev' of https://git.cloud.tencent.com/joylink/jl-nclient into dev
This commit is contained in:
fan
commit
49f8ebe630
@ -3,8 +3,8 @@ export function getBaseUrl() {
|
||||
let BASE_API;
|
||||
if (process.env.NODE_ENV === 'development') {
|
||||
// BASE_API = 'https://joylink.club/jlcloud';
|
||||
BASE_API = 'https://test.joylink.club/jlcloud';
|
||||
// BASE_API = 'http://192.168.3.5:9000'; // 袁琪
|
||||
// BASE_API = 'https://test.joylink.club/jlcloud';
|
||||
BASE_API = 'http://192.168.3.5:9000'; // 袁琪
|
||||
// BASE_API = 'http://192.168.3.6:9000'; // 旭强
|
||||
// BASE_API = 'http://192.168.3.4:9000' // 琰培
|
||||
} else {
|
||||
|
||||
@ -45,20 +45,19 @@ export default {
|
||||
left: 10,
|
||||
containLabel: true
|
||||
}],
|
||||
xAxis: [{
|
||||
type: 'value'
|
||||
}],
|
||||
yAxis: [{
|
||||
xAxis: {
|
||||
type: 'value',
|
||||
show: false
|
||||
},
|
||||
yAxis: {
|
||||
type: 'category',
|
||||
data: [],
|
||||
show: false,
|
||||
axisLabel: {
|
||||
interval: 0,
|
||||
rotate: 30
|
||||
},
|
||||
splitLine: {
|
||||
show: false
|
||||
}
|
||||
}],
|
||||
data: []
|
||||
},
|
||||
series: [{
|
||||
type: 'bar',
|
||||
stack: 'chart',
|
||||
@ -69,6 +68,7 @@ export default {
|
||||
position: 'right'
|
||||
}
|
||||
},
|
||||
barWidth: 30,
|
||||
tooltip: {
|
||||
formatter: params => { return `${params.marker} ${params.name}: ${params.value}个`; }
|
||||
},
|
||||
@ -83,7 +83,7 @@ export default {
|
||||
data: []
|
||||
}]
|
||||
},
|
||||
mapName: '',
|
||||
mapName: null,
|
||||
mapNameList: [],
|
||||
permissionList: [],
|
||||
chart: null
|
||||
@ -110,32 +110,41 @@ export default {
|
||||
methods: {
|
||||
initChart() {
|
||||
listUserPermision({pageSize: 9000, pageNum: 1}).then(resp => {
|
||||
this.permissionList = resp.data.list;
|
||||
this.mapNameList = [...new Set(this.permissionList.map(elem => { return elem.mapName; }))];
|
||||
this.permissionList = resp.data.list.filter(elem => { return parseInt(elem.status) > 0; });
|
||||
this.mapNameList = [...new Set(this.permissionList.map(elem => { return elem.mapName; })), ''];
|
||||
this.$nextTick(() => { this.mapName = this.mapNameList[0] || ''; });
|
||||
});
|
||||
this.chart = echarts.init(document.getElementById(this.id));
|
||||
this.chart.setOption(this.option);
|
||||
},
|
||||
async loadExamData(mapName) {
|
||||
var data = {};
|
||||
var list = this.permissionList.filter(elem => { return elem.mapName == mapName; });
|
||||
list.forEach(elem => {
|
||||
if (!data[elem.mapProductName]) {
|
||||
data[elem.mapProductName] = elem.remains;
|
||||
} else {
|
||||
data[elem.mapProductName] += elem.remains;
|
||||
}
|
||||
});
|
||||
|
||||
const keys = Object.keys(data);
|
||||
const values = Object.values(data);
|
||||
const sum = values.reduce((total, num) => total + num);
|
||||
this.option.title.text = '所属用户剩余权限分布图';
|
||||
this.option.title.subtext = `权限总计${sum}个`;
|
||||
this.option.yAxis[0].data = keys;
|
||||
this.option.series[0].data = values;
|
||||
this.option.series[1].data = keys.map(name => { return {name, value: data[name]}; });
|
||||
if (mapName) {
|
||||
var data = {};
|
||||
var list = this.permissionList.filter(elem => { return elem.mapName == mapName; });
|
||||
list.forEach(elem => {
|
||||
if (!data[elem.mapProductName]) {
|
||||
data[elem.mapProductName] = elem.remains;
|
||||
} else {
|
||||
data[elem.mapProductName] += elem.remains;
|
||||
}
|
||||
});
|
||||
|
||||
const keys = Object.keys(data);
|
||||
const values = Object.values(data);
|
||||
const sum = keys.length > 0? values.reduce((total, num) => total + num) : 0;
|
||||
this.option.title.subtext = `权限总计${sum}个`;
|
||||
this.option.xAxis.show = true;
|
||||
this.option.yAxis.show = true;
|
||||
this.option.yAxis.data = keys;
|
||||
this.option.series[0].data = values;
|
||||
this.option.series[1].data = keys.map(name => { return {name, value: data[name]}; });
|
||||
} else {
|
||||
this.option.xAxis.show = false;
|
||||
this.option.yAxis.show = false;
|
||||
this.option.title.subtext = `暂无数据`;
|
||||
}
|
||||
|
||||
this.chart.setOption(this.option);
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,63 +1,69 @@
|
||||
<template>
|
||||
<el-dialog :title="title" :visible.sync="show" width="400px" :before-close="doClose" :zIndex="2000" :modal="false"
|
||||
:close-on-click-modal="false" append-to-body v-dialogDrag>
|
||||
<el-input placeholder="输入名称进行过滤" v-model="filterText" clearable> </el-input>
|
||||
<ul class="listBox" v-if="filterList.length">
|
||||
<li class="listLi" v-for="item in filterList">
|
||||
<el-radio v-model="selected" :label="item"><span>{{item.name}}</span></el-radio>
|
||||
</li>
|
||||
</ul>
|
||||
<span class="tipLable" v-else> 暂无数据 </span>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="doClose">取 消</el-button>
|
||||
<el-button type="primary" :loading="loading" @click="commit">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-dialogDrag
|
||||
:title="title"
|
||||
:visible.sync="show"
|
||||
width="400px"
|
||||
:before-close="doClose"
|
||||
:z-index="2000"
|
||||
:modal="false"
|
||||
:close-on-click-modal="false"
|
||||
append-to-body
|
||||
>
|
||||
<el-input v-model="filterText" placeholder="输入名称进行过滤" clearable />
|
||||
<ul v-if="filterList.length" class="listBox">
|
||||
<li v-for="item in filterList" :key="item" class="listLi">
|
||||
<el-radio v-model="selected" :label="item"><span>{{ item.name }}</span></el-radio>
|
||||
</li>
|
||||
</ul>
|
||||
<span v-else class="tipLable"> 暂无数据 </span>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="doClose">取 消</el-button>
|
||||
<el-button type="primary" :loading="loading" @click="commit">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { DeviceMenu } from '@/scripts/ConstDic';
|
||||
import { MapDeviceType, OperationEvent } from '@/scripts/ConstDic';
|
||||
|
||||
export default {
|
||||
name: 'CmdNotice',
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
title: '',
|
||||
props: {
|
||||
label: 'name'
|
||||
},
|
||||
sourceList: [],
|
||||
filterText: '',
|
||||
selected: '',
|
||||
loading: false,
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow;
|
||||
},
|
||||
filterList() {
|
||||
return this.sourceList.filter(p => p.name.indexOf(this.filterText) !== -1);
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
doShow(obj) {
|
||||
this.dialogShow = true;
|
||||
this.title = obj.title;
|
||||
this.sourceList = obj.list;
|
||||
this.selected = '';
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
},
|
||||
commit() {
|
||||
this.$emit('setDriver', this.selected);
|
||||
this.doClose();
|
||||
}
|
||||
}
|
||||
}
|
||||
export default {
|
||||
name: 'CmdNotice',
|
||||
data() {
|
||||
return {
|
||||
dialogShow: false,
|
||||
title: '',
|
||||
props: {
|
||||
label: 'name'
|
||||
},
|
||||
sourceList: [],
|
||||
filterText: '',
|
||||
selected: '',
|
||||
loading: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
show() {
|
||||
return this.dialogShow;
|
||||
},
|
||||
filterList() {
|
||||
return this.sourceList.filter(p => p.name.indexOf(this.filterText) !== -1);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
doShow(obj) {
|
||||
this.dialogShow = true;
|
||||
this.title = obj.title;
|
||||
this.sourceList = obj.list;
|
||||
this.selected = '';
|
||||
},
|
||||
doClose() {
|
||||
this.dialogShow = false;
|
||||
},
|
||||
commit() {
|
||||
this.$emit('setDriver', this.selected);
|
||||
this.doClose();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
@ -85,4 +91,4 @@
|
||||
.tipLable {
|
||||
line-height: 33px;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -1,135 +1,135 @@
|
||||
<template>
|
||||
<div>
|
||||
<pop-menu ref="popMenu" :menu="menu"></pop-menu>
|
||||
<choose-role ref="chooseRole" @setDriver="setDriver"></choose-role>
|
||||
</div>
|
||||
<div>
|
||||
<pop-menu ref="popMenu" :menu="menu" />
|
||||
<choose-role ref="chooseRole" @setDriver="setDriver" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PopMenu from '@/components/PopMenu';
|
||||
import ChooseRole from './chooseRole';
|
||||
import { putUserRoles } from '@/api/chat';
|
||||
import { DeviceMenu } from '@/scripts/ConstDic';
|
||||
import { UrlConfig } from '@/router/index';
|
||||
import PopMenu from '@/components/PopMenu';
|
||||
import ChooseRole from './chooseRole';
|
||||
import { putUserRoles } from '@/api/chat';
|
||||
import { DeviceMenu } from '@/scripts/ConstDic';
|
||||
|
||||
export default {
|
||||
name: 'operateMenu',
|
||||
components: {
|
||||
PopMenu,
|
||||
ChooseRole
|
||||
},
|
||||
props: {
|
||||
group: {
|
||||
type: String
|
||||
},
|
||||
point: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
selected: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
driverList: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
driverMapDict: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
menuShow: false,
|
||||
menu: [
|
||||
{
|
||||
label: '设置司机',
|
||||
handler: this.chooseDriver
|
||||
},
|
||||
{
|
||||
label: '取消司机',
|
||||
handler: this.cancelDriver
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.menuOperation.menuCount': function (val) {
|
||||
if (this.$store.getters['menuOperation/checkDialogIsOpen'](DeviceMenu.SetDriver)) {
|
||||
this.doShow(this.$store.state.menuOperation.menuPosition);
|
||||
} else {
|
||||
this.doClose();
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.closeEvent();
|
||||
},
|
||||
methods: {
|
||||
closeEvent() {
|
||||
let self = this;
|
||||
window.onclick = function (e) {
|
||||
self.doClose();
|
||||
}
|
||||
},
|
||||
doShow(point) {
|
||||
this.closeEvent();
|
||||
if (this.$refs && this.$refs.popMenu) {
|
||||
this.$refs.popMenu.resetShowPosition(point);
|
||||
}
|
||||
this.menuShow = true;
|
||||
},
|
||||
doClose() {
|
||||
if (this.$refs && this.$refs.popMenu) {
|
||||
this.$refs.popMenu.close();
|
||||
}
|
||||
this.menuShow = false;
|
||||
},
|
||||
chooseDriver() {
|
||||
let arrs = Object.values(this.driverMapDict);
|
||||
let list = this.driverList.filter(elem => {
|
||||
let ret = true;
|
||||
arrs.forEach(item => {
|
||||
if (item.id == elem.id) {
|
||||
ret = false;
|
||||
}
|
||||
});
|
||||
return ret;
|
||||
});
|
||||
export default {
|
||||
name: 'OperateMenu',
|
||||
components: {
|
||||
PopMenu,
|
||||
ChooseRole
|
||||
},
|
||||
props: {
|
||||
group: {
|
||||
type: String,
|
||||
required: true
|
||||
},
|
||||
point: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
selected: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
driverList: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
driverMapDict: {
|
||||
type: Object,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
menuShow: false,
|
||||
menu: [
|
||||
{
|
||||
label: '设置司机',
|
||||
handler: this.chooseDriver
|
||||
},
|
||||
{
|
||||
label: '取消司机',
|
||||
handler: this.cancelDriver
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
'$store.state.menuOperation.menuCount': function (val) {
|
||||
if (this.$store.getters['menuOperation/checkDialogIsOpen'](DeviceMenu.SetDriver)) {
|
||||
this.doShow(this.$store.state.menuOperation.menuPosition);
|
||||
} else {
|
||||
this.doClose();
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.closeEvent();
|
||||
},
|
||||
methods: {
|
||||
closeEvent() {
|
||||
const self = this;
|
||||
window.onclick = function (e) {
|
||||
self.doClose();
|
||||
};
|
||||
},
|
||||
doShow(point) {
|
||||
this.closeEvent();
|
||||
if (this.$refs && this.$refs.popMenu) {
|
||||
this.$refs.popMenu.resetShowPosition(point);
|
||||
}
|
||||
this.menuShow = true;
|
||||
},
|
||||
doClose() {
|
||||
if (this.$refs && this.$refs.popMenu) {
|
||||
this.$refs.popMenu.close();
|
||||
}
|
||||
this.menuShow = false;
|
||||
},
|
||||
chooseDriver() {
|
||||
const arrs = Object.values(this.driverMapDict);
|
||||
const list = this.driverList.filter(elem => {
|
||||
let ret = true;
|
||||
arrs.forEach(item => {
|
||||
if (item.id == elem.id) {
|
||||
ret = false;
|
||||
}
|
||||
});
|
||||
return ret;
|
||||
});
|
||||
|
||||
this.$refs.chooseRole.doShow({ title: '设置列车', list: list });
|
||||
},
|
||||
async setDriver(obj) {
|
||||
if (obj && this.selected) {
|
||||
let params = [{
|
||||
id: obj.id,
|
||||
nickName: obj.name,
|
||||
userRole: 'Driver',
|
||||
stationCode: '',
|
||||
trainCode: this.selected._code
|
||||
}];
|
||||
this.$refs.chooseRole.doShow({ title: '设置列车', list: list });
|
||||
},
|
||||
async setDriver(obj) {
|
||||
if (obj && this.selected) {
|
||||
const params = [{
|
||||
id: obj.id,
|
||||
nickName: obj.name,
|
||||
userRole: 'Driver',
|
||||
stationCode: '',
|
||||
trainCode: this.selected._code
|
||||
}];
|
||||
|
||||
await putUserRoles(params, this.group);
|
||||
}
|
||||
},
|
||||
async cancelDriver() {
|
||||
let data = this.driverMapDict[this.selected._code];
|
||||
if (data) {
|
||||
let params = [{
|
||||
id: data.id,
|
||||
nickName: data.name,
|
||||
userRole: 'Driver',
|
||||
stationCode: '',
|
||||
trainCode: ''
|
||||
}];
|
||||
await putUserRoles(params, this.group);
|
||||
}
|
||||
},
|
||||
async cancelDriver() {
|
||||
const data = this.driverMapDict[this.selected._code];
|
||||
if (data) {
|
||||
const params = [{
|
||||
id: data.id,
|
||||
nickName: data.name,
|
||||
userRole: 'Driver',
|
||||
stationCode: '',
|
||||
trainCode: ''
|
||||
}];
|
||||
|
||||
await putUserRoles(params, this.group);
|
||||
}
|
||||
},
|
||||
refresh() {
|
||||
this.$emit('refresh');
|
||||
}
|
||||
}
|
||||
}
|
||||
await putUserRoles(params, this.group);
|
||||
}
|
||||
},
|
||||
refresh() {
|
||||
this.$emit('refresh');
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
@ -46,7 +46,7 @@
|
||||
/>
|
||||
<div style="float: right; margin-right: 15px;">
|
||||
<el-select
|
||||
v-model="nor.stationCode"
|
||||
v-model="nor.deviceCode"
|
||||
placeholder="请选择"
|
||||
size="mini"
|
||||
:disabled="userId != roomInfo.creatorId"
|
||||
@ -396,7 +396,7 @@ export default {
|
||||
this.messageInfo('您被管理员踢出房间。', 'warning');
|
||||
} else {
|
||||
param.userRole = '';
|
||||
param['stationCode'] = '';
|
||||
param['deviceCode'] = '';
|
||||
const arr = [];
|
||||
arr.push(param);
|
||||
this.addrolesList(arr); // 删除角色信息
|
||||
@ -490,7 +490,7 @@ export default {
|
||||
this.stationList.forEach(item => {
|
||||
item.disabled = false;
|
||||
this.equipmentList.forEach(nor => {
|
||||
if (item.code == nor.stationCode) {
|
||||
if (item.code == nor.deviceCode) {
|
||||
item.disabled = true;
|
||||
}
|
||||
});
|
||||
@ -549,7 +549,7 @@ export default {
|
||||
async start() {
|
||||
let flag = true;
|
||||
this.equipmentList.forEach(item => {
|
||||
if (!item.stationCode) {
|
||||
if (!item.deviceCode) {
|
||||
flag = false;
|
||||
}
|
||||
});
|
||||
@ -600,13 +600,13 @@ export default {
|
||||
id: val.id,
|
||||
nickName: val.nickName,
|
||||
userRole: 'Attendant',
|
||||
stationCode: val.stationCode
|
||||
deviceCode: val.deviceCode
|
||||
}];
|
||||
putUserRoles(params, this.$route.query.group);
|
||||
this.stationList.forEach(item => {
|
||||
item.disabled = false;
|
||||
this.equipmentList.forEach(nor => {
|
||||
if (item.code == nor.stationCode) {
|
||||
if (item.code == nor.deviceCode) {
|
||||
item.disabled = true;
|
||||
}
|
||||
});
|
||||
@ -693,7 +693,7 @@ export default {
|
||||
this.stationList.forEach(item => {
|
||||
item.disabled = false;
|
||||
this.equipmentList.forEach(nor => {
|
||||
if (item.code == nor.stationCode) {
|
||||
if (item.code == nor.deviceCode) {
|
||||
item.disabled = true;
|
||||
}
|
||||
});
|
||||
@ -723,7 +723,7 @@ export default {
|
||||
id: item.id,
|
||||
nickName: item.nickName,
|
||||
userRole: 'Audience',
|
||||
stationCode: ''
|
||||
deviceCode: ''
|
||||
}];
|
||||
putUserRoles(params, this.$route.query.group);
|
||||
},
|
||||
|
||||
@ -1,83 +1,85 @@
|
||||
<template>
|
||||
<div class="jointRoomMenu">
|
||||
<pop-menu ref="popMenu" :menu="menu"></pop-menu>
|
||||
</div>
|
||||
<div class="jointRoomMenu">
|
||||
<pop-menu ref="popMenu" :menu="menu" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import PopMenu from '@/components/PopMenu';
|
||||
import { DeviceMenu } from '@/scripts/ConstDic';
|
||||
import { putJointTrainingUserkicked } from '@/api/chat';
|
||||
import PopMenu from '@/components/PopMenu';
|
||||
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: '踢出房间',
|
||||
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() {
|
||||
let 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 = [];
|
||||
}
|
||||
export default {
|
||||
name: 'TrainingOperateMenu',
|
||||
components: {
|
||||
PopMenu
|
||||
},
|
||||
props: {
|
||||
point: {
|
||||
type: Object,
|
||||
required: true
|
||||
},
|
||||
clickUserId: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
menu: [],
|
||||
menuShow: [
|
||||
{
|
||||
label: '踢出房间',
|
||||
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 {
|
||||
let res = await putJointTrainingUserkicked(this.clickUserId, this.$route.query.group);
|
||||
} catch (error) { }
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
},
|
||||
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>
|
||||
|
||||
@ -1,204 +1,217 @@
|
||||
<template>
|
||||
<!-- 聊天窗口 -->
|
||||
<div class="train-chat">
|
||||
<audio ref="audio" style="display: none;"></audio>
|
||||
<div class="chatContent" ref="content">
|
||||
<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;">
|
||||
{{nor.chatTime}} {{nor.userName}}</div>
|
||||
<div class="news">
|
||||
<span>{{nor.value}}</span>
|
||||
</div>
|
||||
<div class="yuyin" v-if="nor.voice" @click="playAudio(nor)">
|
||||
<i class="el-icon-caret-right"></i>
|
||||
</div>
|
||||
</li>
|
||||
<li v-if="nor.other" style="position: relative">
|
||||
<div class="userName" style="position: absolute; left: 12px; top: 4px; font-size: 14px;">
|
||||
{{nor.userName}} {{nor.chatTime}}</div>
|
||||
<div class="answers">
|
||||
<span>{{nor.value}}</span>
|
||||
</div>
|
||||
<div class="yuyin1" v-if="nor.voice" @click="playAudio(nor)">
|
||||
<i class="el-icon-caret-right"></i>
|
||||
</div>
|
||||
</li>
|
||||
<li v-if="nor.join" style="font-size: 12px; text-align: center;">{{nor.roomTip}}</li>
|
||||
</div>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="footChat">
|
||||
<div class="inputBox">
|
||||
<textarea id="dope" v-model="text" style="width: 99%;height: 47px; border: none;outline: none;" name=""
|
||||
rows="" cols=""></textarea>
|
||||
<button class="sendBtn" @click="sendText()">发送文字</button>
|
||||
<div class="sendBtn yuyin_start zIndex1" :style="{background: background}" @mousedown="startRecording()"
|
||||
@mouseup="stopRecording()">{{speak}}</div>
|
||||
<div class="sendBtn yuyin_start zIndex2" :style="{background: background}" v-show="sending">
|
||||
发送中...</div>
|
||||
<!-- 聊天窗口 -->
|
||||
<div class="train-chat">
|
||||
<audio ref="audio" style="display: none;" />
|
||||
<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;">
|
||||
{{ nor.chatTime }} {{ nor.userName }}</div>
|
||||
<div class="news">
|
||||
<span>{{ nor.value }}</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;">
|
||||
{{ nor.userName }} {{ nor.chatTime }}</div>
|
||||
<div class="answers">
|
||||
<span>{{ nor.value }}</span>
|
||||
</div>
|
||||
<div v-if="nor.voice" class="yuyin1" @click="playAudio(nor)">
|
||||
<i class="el-icon-caret-right" />
|
||||
</div>
|
||||
</li>
|
||||
<li v-if="nor.join" style="font-size: 12px; text-align: center;">{{ nor.roomTip }}</li>
|
||||
</div>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="footChat">
|
||||
<div class="inputBox">
|
||||
<textarea
|
||||
id="dope"
|
||||
v-model="text"
|
||||
style="width: 99%;height: 47px; border: none;outline: none;"
|
||||
name=""
|
||||
rows=""
|
||||
cols=""
|
||||
/>
|
||||
<button class="sendBtn" @click="sendText()">发送文字</button>
|
||||
<div
|
||||
class="sendBtn yuyin_start zIndex1"
|
||||
:style="{background: background}"
|
||||
@mousedown="startRecording()"
|
||||
@mouseup="stopRecording()"
|
||||
>{{ speak }}</div>
|
||||
<div v-show="sending" class="sendBtn yuyin_start zIndex2" :style="{background: background}">
|
||||
发送中...</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Vue from 'vue';
|
||||
import HZRecorder from '@/utils/HZRecorder';
|
||||
import { postDataBd, postDataXf, getHistoryVoice, chatWithText, chatWithAudio, putJointTrainingSimulationEntrance } from '@/api/chat';
|
||||
import StompClient from '@/utils/sock';
|
||||
import HZRecorder from '@/utils/HZRecorder';
|
||||
import { getHistoryVoice, chatWithText, chatWithAudio } from '@/api/chat';
|
||||
|
||||
export default {
|
||||
name: 'trainChat',
|
||||
props: {
|
||||
groupRoom: {
|
||||
type: String,
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
textList: [],
|
||||
topic: '/user/topic/chatroom',
|
||||
text: '',
|
||||
recorders: null,
|
||||
stomp: null,
|
||||
speak: '按住说话',
|
||||
sending: false,
|
||||
background: '',
|
||||
userId: '',
|
||||
}
|
||||
},
|
||||
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.text = '';
|
||||
} else {
|
||||
try {
|
||||
let res = await chatWithText(this.text, this.groupRoom);
|
||||
this.text = '';
|
||||
} catch (error) { }
|
||||
}
|
||||
},
|
||||
// 语音录制开始
|
||||
startRecording() {
|
||||
this.background = '#ccc';
|
||||
this.speak = '录音中...';
|
||||
this.sending = false;
|
||||
HZRecorder.init.get(rec => {
|
||||
if (typeof rec == 'object') {
|
||||
this.recorders = rec;
|
||||
this.recorders.start();
|
||||
}
|
||||
});
|
||||
},
|
||||
// 停止录制
|
||||
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());
|
||||
let res = await chatWithAudio(fd, this.$route.query.group).catch(error => {
|
||||
this.sending = false;
|
||||
let 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();
|
||||
},
|
||||
// 获取历史记录
|
||||
async getHistory(obj, node, data) {
|
||||
this.textList = [];
|
||||
try {
|
||||
let res = await getHistoryVoice(this.code);
|
||||
res.data.forEach(item => {
|
||||
let isSelf = false;
|
||||
if (item.userId == this.userId) {
|
||||
isSelf = true;
|
||||
}
|
||||
let 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) { }
|
||||
},
|
||||
// 操作聊天内容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;
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
export default {
|
||||
name: 'TrainChat',
|
||||
props: {
|
||||
groupRoom: {
|
||||
type: String,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
textList: [],
|
||||
topic: '/user/topic/chatroom',
|
||||
text: '',
|
||||
recorders: null,
|
||||
stomp: null,
|
||||
speak: '按住说话',
|
||||
sending: false,
|
||||
background: '',
|
||||
userId: ''
|
||||
};
|
||||
},
|
||||
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.text = '';
|
||||
} else {
|
||||
try {
|
||||
await chatWithText(this.text, this.groupRoom);
|
||||
this.text = '';
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
},
|
||||
// 语音录制开始
|
||||
startRecording() {
|
||||
this.background = '#ccc';
|
||||
this.speak = '录音中...';
|
||||
this.sending = false;
|
||||
HZRecorder.init.get(rec => {
|
||||
if (typeof rec == 'object') {
|
||||
this.recorders = rec;
|
||||
this.recorders.start();
|
||||
}
|
||||
});
|
||||
},
|
||||
// 停止录制
|
||||
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());
|
||||
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: '音频质量有问题',
|
||||
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();
|
||||
},
|
||||
// 获取历史记录
|
||||
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>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@ -348,4 +361,4 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user