SH-Arbitrate/Arbitrate-FrontendH5
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge branch 'hcb' of SH-Arbitrate/Arbitrate-FrontendH5 into master

Browse Source
This commit was merged in pull request #3.
This commit is contained in:
hanchaobo
2024-04-29 09:40:56 +08:00
committed by Gitea
parent 8081c417a4 f60928153d
commit f71b0b46ee
3 changed files with 103 additions and 200 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/components/roomFooter.vue
+19 -57
View File
@@ -1,75 +1,35 @@
<template>
<div class="roomFooter">
<div class="outRoom">
<el-button type="danger" @click="exitRoom" v-if="!roleFlag"
>退出房间</el-button
>
<el-button type="danger" @click="exitRoom" v-if="roleFlag"
>解散房间</el-button
>
<el-button type="danger" @click="exitRoom" v-if="!roleFlag">退出房间</el-button>
<el-button type="danger" @click="exitRoom" v-if="roleFlag">解散房间</el-button>
</div>
<div class="operation">
<div class="mic">
<img
class="micImg"
src="@/assets/mic_on.png"
alt=""
v-if="micFlag"
@click="micClickOn"
/>
<img
class="micImg"
src="@/assets/mic_off.png"
alt=""
v-else
@click="micClickOff"
/>
<img class="micImg" src="@/assets/mic_on.png" alt="" v-if="micFlag" @click="micClickOn" />
<img class="micImg" src="@/assets/mic_off.png" alt="" v-else @click="micClickOff" />
</div>
<div class="video">
<img
class="videoImg"
src="@/assets/video_on.png"
alt=""
v-if="videoFlag"
@click="videoClickOn"
/>
<img
class="videoImg"
src="@/assets/video_off.png"
alt=""
v-else
@click="videoClickOff"
/>
<img class="videoImg" src="@/assets/video_on.png" alt="" v-if="videoFlag" @click="videoClickOn" />
<img class="videoImg" src="@/assets/video_off.png" alt="" v-else @click="videoClickOff" />
</div>
<div class="sharing">
<img
class="sharImg"
src="@/assets/screenShare_on.png"
alt=""
v-if="sharFlag"
@click="sharClickOn"
/>
<img
class="sharImg"
src="@/assets/screenShare_off.png"
alt=""
v-else
@click="sharClickOff"
/>
<img class="sharImg" src="@/assets/screenShare_on.png" alt="" v-if="sharFlag" @click="sharClickOn" />
<img class="sharImg" src="@/assets/screenShare_off.png" alt="" v-else @click="sharClickOff" />
</div>
<div class="mediationPop">
<el-button type="warning" @click="mediationPop">调解</el-button>
<el-button type="warning" @click="mediationPop">调解</el-button>
</div>
</div>
</div>
</template>
<script>
<script>
import { startVideo, stopVideo, destructionRoom } from "@/api/room.js";
export default {
name: "Footer",
props: ["micFlag","videoFlag","sharFlag"],
props: ["micFlag", "videoFlag", "sharFlag"],
components: {},
data() {
return {
@@ -112,7 +72,7 @@ export default {
this.$emit("sharClickOff");
},
// 弹出调解内容
mediationPop(){
mediationPop() {
this.$emit("mediationPop");
},
exitRoom() {
@@ -153,8 +113,8 @@ export default {
},
};
</script>
<style scoped>
<style scoped>
.roomFooter {
width: 100%;
height: 100%;
@@ -202,9 +162,11 @@ export default {
height: 60px;
margin-left: 20px;
}
.mediationPop{
.mediationPop {
margin-left: 20px;
}
.micImg,
.videoImg,
.sharImg {
src/views/onlyOffice.vue
-1
View File
@@ -35,7 +35,6 @@ export default {
}
axios.get(`http://121.40.189.20:9090/onlyOfficeConfig/${edit}/${id}/${this.userId}/desktop/true`).then(res => {
this.config = res.data;
debugger
var docEditor = new DocsAPI.DocEditor("placeholder", this.config);
})
},
src/views/room.vue
+84 -142
View File
@@ -2,46 +2,25 @@
<div class="page">
<div class="roompage" @mouseover="mouseHover" v-if="modileFlag">
<div class="txtContent">
<el-tag type="danger" @click="txtContent" v-if="modileFlag"
>会议内容</el-tag
>
<el-tag type="danger" @click="txtContent" v-if="modileFlag">会议内容</el-tag>
</div>
<div class="content">
<div
class="screenShare"
id="screenShare"
v-show="screenShareFlag"
></div>
<div class="screenShare" id="screenShare" v-show="screenShareFlag"></div>
<div :class="videoList">
<div :class="videoClass" id="localStream">
<div class="userName">{{ userId }}</div>
</div>
<div
:class="videoClass"
v-for="(item, index) in userList"
:key="index"
:id="item"
>
<div :class="videoClass" v-for="(item, index) in userList" :key="index" :id="item">
<div class="userName">{{ item }}</div>
</div>
</div>
</div>
<div class="footerList">
<roomFooter
@exitRoom="exitRoom"
@micClickOn="micClickOn"
@micClickOff="micClickOff"
@videoClickOn="videoClickOn"
@videoClickOff="videoClickOff"
@sharClickOn="sharClickOn"
@sharClickOff="sharClickOff"
@mediationPop="mediationPop"
:roomId="roomId"
:micFlag="micFlag"
:videoFlag="videoFlag"
:sharFlag="sharFlag"
></roomFooter>
<roomFooter @exitRoom="exitRoom" @micClickOn="micClickOn" @micClickOff="micClickOff"
@videoClickOn="videoClickOn" @videoClickOff="videoClickOff" @sharClickOn="sharClickOn"
@sharClickOff="sharClickOff" @mediationPop="mediationPop" :roomId="roomId" :micFlag="micFlag"
:videoFlag="videoFlag" :sharFlag="sharFlag"></roomFooter>
</div>
</div>
<div class="roomPhone" v-if="!modileFlag">
@@ -52,12 +31,7 @@
<div :class="userClassPhone" id="localStream">
<div class="userNamePhone">{{ userId }}</div>
</div>
<div
:class="userClassPhone"
v-for="(item, index) in userList"
:key="index"
:id="item"
>
<div :class="userClassPhone" v-for="(item, index) in userList" :key="index" :id="item">
<div class="userNamePhone">{{ item }}</div>
</div>
</div>
@@ -156,111 +130,52 @@
</div>
</div>
</div> -->
<quill-editor
ref="myQuillEditor"
v-model="contentValue"
:options="editorOption"
@blur="onEditorBlur($event)"
@focus="onEditorFocus($event)"
@ready="onEditorReady($event)"
></quill-editor>
<el-button
class="updataBtn"
@click="updataClick"
type="primary"
:disabled="!updataFlag"
>确认修改内容</el-button
>
<quill-editor ref="myQuillEditor" v-model="contentValue" :options="editorOption" @blur="onEditorBlur($event)"
@focus="onEditorFocus($event)" @ready="onEditorReady($event)"></quill-editor>
<el-button class="updataBtn" @click="updataClick" type="primary" :disabled="!updataFlag">确认修改内容</el-button>
</el-drawer>
<!-- 调解 -->
<el-drawer :visible.sync="drawerMediatio" direction="ltr" title="调解内容">
<div
style="
<div style="
width: 100%;
display: flex;
justify-content: space-around;
margin-bottom: 10px;
margin-top: 20px;
"
>
<el-upload
ref="upload"
:limit="1"
:action="UploadUrl()"
:headers="headers"
:data="filedata"
:on-change="beforeUpload"
:on-success="handlSuccess"
:file-list="fileList"
v-if="appFlag"
>
<el-button slot="trigger" size="small" type="primary"
>申请人上传证据</el-button
>
">
<el-upload ref="upload" :limit="1" :action="UploadUrl()" :headers="headers" :data="filedata"
:on-change="beforeUpload" :on-success="handlSuccess" :file-list="fileList" v-if="appFlag">
<el-button slot="trigger" size="small" type="primary">申请人上传证据</el-button>
</el-upload>
<el-upload
ref="upload1"
:limit="1"
:action="UploadUrl()"
:headers="headers1"
:data="filedata1"
:on-change="beforeUpload1"
:on-success="handlSuccess1"
:file-list="fileList1"
v-if="resFlag"
>
<el-button slot="trigger" size="small" type="primary"
>被申请人上传证据</el-button
>
<el-upload ref="upload1" :limit="1" :action="UploadUrl()" :headers="headers1" :data="filedata1"
:on-change="beforeUpload1" :on-success="handlSuccess1" :file-list="fileList1" v-if="resFlag">
<el-button slot="trigger" size="small" type="primary">被申请人上传证据</el-button>
</el-upload>
<el-upload
ref="upload3"
:limit="1"
:action="UploadUrl()"
:headers="headers3"
:data="filedata3"
:on-change="beforeUpload3"
:on-success="handlSuccess3"
:file-list="fileList3"
accept=".doc,.docx"
v-if="updataFlag"
>
<el-button slot="trigger" size="small" type="primary"
>上传调解书</el-button
>
<el-upload ref="upload3" :limit="1" :action="UploadUrl()" :headers="headers3" :data="filedata3"
:on-change="beforeUpload3" :on-success="handlSuccess3" :file-list="fileList3" accept=".doc,.docx"
v-if="updataFlag">
<el-button slot="trigger" size="small" type="primary">上传调解书</el-button>
</el-upload>
</div>
<div class="list">
<div class="applicant" v-if="applicantFile.length > 0">
<div>申请人证据</div>
<div
style="color: #104fad; cursor: pointer"
v-for="(item, index) in applicantFile"
:key="index"
@click="preview(item, 0)"
>
<div style="color: #104fad; cursor: pointer" v-for="(item, index) in applicantFile" :key="index"
@click="preview(item, 0)">
{{ item.annexName }}
</div>
</div>
<div class="res" v-if="resFile.length > 0">
<div>被申请人证据</div>
<div
style="color: #104fad; cursor: pointer"
v-for="(item, index) in resFile"
:key="index"
@click="preview(item, 0)"
>
<div style="color: #104fad; cursor: pointer" v-for="(item, index) in resFile" :key="index"
@click="preview(item, 0)">
{{ item.annexName }}
</div>
</div>
<div class="mediate" v-if="mediateFile.length > 0">
<div>调解书</div>
<div
style="color: #104fad; cursor: pointer"
v-for="(item, index) in mediateFile"
:key="index"
@click="preview(item, 1)"
>
<div style="color: #104fad; cursor: pointer" v-for="(item, index) in mediateFile" :key="index"
@click="preview(item, 1)">
{{ item.annexName }}
</div>
</div>
@@ -296,7 +211,7 @@
</template>
<script>
import { getUsersig, reserveConferenceList,confirmMeetingResult } from "@/api/home";
import { getUsersig, reserveConferenceList, confirmMeetingResult } from "@/api/home";
import {
secretaryRoleByUserId,
htmlToPDF,
@@ -352,11 +267,11 @@ export default {
applicantFile: [],
resFile: [],
mediateFile: [],
formData:{
mediaResult:1,
sealFlag:1
formData: {
mediaResult: 1,
sealFlag: 1
},
caseFlowId:null,
caseFlowId: null,
headers: {
// Authorization: "Bearer " + token,
Authorization: "",
@@ -532,7 +447,9 @@ export default {
}
let token = sessionStorage.getItem("token");
window.open(
`http://121.40.189.20:8002/onlyoffice?id=${item.onlyOfficeFileId}&flag=${flag}&token=${token}`,
// `http://121.40.189.20:8002/onlyoffice?id=${item.onlyOfficeFileId}&flag=${flag}&token=${token}`,
// "_black"
`http://localhost:81/onlyoffice?id=${item.onlyOfficeFileId}&flag=${flag}&token=${token}`,
"_black"
);
} else {
@@ -619,8 +536,10 @@ export default {
});
this.localStreamAsr.stop();
await trtc.exitRoom();
await trtc.updateLocalVideo({ publish: false });
await trtc.updateLocalAudio({ publish: false });
// await trtc.updateLocalVideo({ publish: false });
// await trtc.updateLocalAudio({ publish: false });
await trtc.stopLocalVideo();
await trtc.stopLocalAudio();
await trtc.destroy();
this.$router.push({
name: "Home",
@@ -683,30 +602,41 @@ export default {
// })
});
},
/**主持人解散房间监听事件 */
exitRoomAll() {
trtc.on(TRTC.EVENT.KICKED_OUT, event => {
console.log(event.reason);
alert("主持人已经解散会议");
this.$router.push({
name: "Home",
});
this.userList = [];
});
},
// 删除退出会议人员列表
deletePushVideo() {
trtc.on(TRTC.EVENT.REMOTE_VIDEO_UNAVAILABLE, (event) => {
const streamType = event.streamType;
const userId = event.userId;
if (streamType == "main") {
if (this.hostId == userId) {
alert("主持人已经解散会议");
this.$router.push({
name: "Home",
});
this.userList = [];
return;
}
// if (this.hostId == userId) {
// alert("主持人已经解散会议");
// this.$router.push({
// name: "Home",
// });
// this.userList = [];
// return;
// }
let deleteIndex = this.userList.indexOf(userId);
this.userList = this.userList.filter((item) => item !== userId);
if (deleteIndex !== -1) {
this.userList.splice(deleteIndex, 1);
}
if (this.modileFlag) {
// this.userHeight = getHeight(this.userList);
} else {
this.userClassPhone = getWidthPhone(this.userList);
}
// if (this.modileFlag) {
// // this.userHeight = getHeight(this.userList);
// } else {
// this.userClassPhone = getWidthPhone(this.userList);
// }
Object.keys(this.asrList).forEach((key) => {
this.asrList[userId].stop();
});
@@ -748,25 +678,25 @@ export default {
}
});
},
// 调解
// 调解
mediationPop() {
this.drawerMediatio = true;
this.selectByIdFn(this.caseId);
setInterval(() => {
setInterval(() => {
this.selectByIdFn(this.caseId);
}, 8000);
this.selectRoleMenuByCaseIdFn(this.caseId);
this.getMenuPermsByUserFn();
},
// 确定会议结果
determineMeeting(){
determineMeeting() {
let valueMeeting = {
id:this.caseId,
id: this.caseId,
mediaResult: this.formData.mediaResult,
sealFlag:this.formData.sealFlag,
caseFlowId:this.caseFlowId
sealFlag: this.formData.sealFlag,
caseFlowId: this.caseFlowId
}
confirmMeetingResult(valueMeeting).then(res=>{
confirmMeetingResult(valueMeeting).then(res => {
if (res.code == 200) {
this.$message({
message: "确定成功",
@@ -833,6 +763,7 @@ export default {
});
this.getPushVideo();
this.deletePushVideo();
this.exitRoomAll();
try {
await trtc.enterRoom({
roomId: Number(roomId),
@@ -898,11 +829,13 @@ export default {
width: 100%;
height: 100vh;
}
.content {
width: 100%;
height: 90%;
display: flex;
}
.videoList {
width: 100%;
height: 100%;
@@ -914,6 +847,7 @@ export default {
margin-bottom: 20px;
position: relative;
}
.videoList1 {
width: 20%;
height: 100%;
@@ -925,6 +859,7 @@ export default {
margin-bottom: 20px;
position: relative;
}
.txtContent {
width: 100px;
height: 50px;
@@ -941,18 +876,21 @@ export default {
background: red;
border-radius: 20px;
}
.videoItem1 {
width: 32%;
height: 32%;
background: red;
border-radius: 20px;
}
.videoItem3 {
width: 48%;
height: 100%;
background: red;
border-radius: 20px;
}
.videoItem2 {
width: 90%;
height: 25%;
@@ -970,11 +908,13 @@ export default {
bottom: 0;
z-index: 10;
}
.screenShare {
width: 80%;
height: 100%;
background: yellow;
}
.userName {
border-radius: 10px;
width: 90px;
@@ -988,11 +928,13 @@ export default {
z-index: 9;
color: #ffffff;
}
.footerList {
width: 100%;
height: 10%;
background: green;
}
.userNamePhone {
border-radius: 10px;
min-width: 20%;