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

共享屏幕

Browse Source
This commit is contained in:
gyj
2024-04-22 10:23:32 +08:00
parent ca09c2fb0f
commit eeb3ae6e1c
4 changed files with 114 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/api/home.js
+4 -4
View File
@@ -32,17 +32,17 @@ export function reserveConferenceList(caseId) {
}
//根据id查询密文信息
export function getEncryptInfoByid(caseId) {
return axios.get(`${baseUrl}/shortMessage/getMeetingInfo?authId=${caseId}`);
return axios.get(`tiaojie/shortMessage/getMeetingInfo?authId=${caseId}`);
}
// 案件列表
export function caseApplicationList(param) {
return axios.get(`${baseUrl}/caseApplication/list?caseId=${param}`);
return axios.get(`tiaojie/caseApplication/list?caseId=${param}`);
}
// 签收案件
export function msCaseSign(data) {
return axios.post(`${baseUrl}/mssignSeal/msCaseSign`, data);
return axios.post(`tiaojie/mssignSeal/msCaseSign`, data);
}
//根据案件id获取附件
export function fileList(caseAppliId,annexTypeList) {
return axios.get(`${baseUrl}/common/fileList?caseAppliId=${caseAppliId}&annexTypeList=${annexTypeList}`);
return axios.get(`tiaojie/common/fileList?caseAppliId=${caseAppliId}&annexTypeList=${annexTypeList}`);
}
src/views/components/roomFooter.vue
+2 -2
View File
@@ -41,7 +41,7 @@
@click="videoClickOff"
/>
</div>
<!-- <div class="sharing">
<div class="sharing">
<img
class="sharImg"
src="@/assets/screenShare_on.png"
@@ -56,7 +56,7 @@
v-else
@click="sharClickOff"
/>
</div> -->
</div>
</div>
</div>
</template>
src/views/room.vue
+107 -83
View File
@@ -7,7 +7,11 @@
>
</div>
<div class="content">
<div class="screenShare" v-if="screenShareFlag"></div>
<div
class="screenShare"
id="screenShare"
v-show="screenShareFlag"
></div>
<div :class="videoList">
<div :class="videoClass" id="localStream">
@@ -47,7 +51,12 @@
<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>
@@ -55,7 +64,8 @@
<!-- 语音转文字弹窗 -->
<el-drawer title="会议内容" :visible.sync="textVisible" :modal="false">
<div style="margin-left: 20px; margin-bottom: 10px">
<div style="
<div
style="
width: 100%;
display: flex;
justify-content: space-around;
@@ -65,7 +75,7 @@
<el-upload
ref="upload"
:limit="1"
action="https://api.xayunmei.com/tiaojieapitest/video/upload"
:action="UploadUrl()"
:headers="headers"
:data="filedata"
:on-change="beforeUpload"
@@ -77,11 +87,12 @@
>申请人上传证据</el-button
>
</el-upload>
<!-- https://api.xayunmei.com/tiaojieapitest/video/upload -->
<el-upload
v-if="resFlag"
ref="upload1"
:limit="1"
action="https://api.xayunmei.com/tiaojieapitest/video/upload"
:action="UploadUrl()"
:headers="headers1"
:data="filedata1"
:on-change="beforeUpload1"
@@ -96,8 +107,7 @@
v-if="updataFlag"
ref="upload3"
:limit="1"
action=""
:http-request="upload3"
:action="UploadUrl()"
:headers="headers3"
:data="filedata3"
:on-change="beforeUpload3"
@@ -109,7 +119,6 @@
>上传调解书</el-button
>
</el-upload>
<!-- https://api.xayunmei.com/tiaojieapitest/video/upload -->
</div>
<div class="list">
<div class="applicant" v-if="applicantFile.length > 0">
@@ -147,9 +156,21 @@
</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>
</div>
</template>
@@ -162,7 +183,7 @@ import {
selectById,
selectRoleMenuByCaseId,
getMenuPermsByUser,
videoUpload
videoUpload,
} from "@/api/room";
import { getWidth, getHeight, getWidthPhone, getModile } from "@/utils/utils";
import roomFooter from "./components/roomFooter.vue";
@@ -247,6 +268,9 @@ export default {
};
},
methods: {
UploadUrl() {
return window.location.origin + "/tiaojie/video/upload";
},
/**点击开启麦克风图标，关闭麦克风 */
micClickOn() {
trtc.updateLocalAudio({ mute: true }).then(() => {
@@ -288,24 +312,28 @@ export default {
});
},
/**共享屏幕 */
sharClickOn() {
this.sharFlag = false;
this.videoList = "videoList1";
this.videoClass = "videoItem2";
this.screenShareFlag = true;
async sharClickOn() {
// this.videoList = "videoList1";
// this.videoClass = "videoItem2";
// this.screenShareFlag = true;
await trtc.startScreenShare().then(() => {
this.sharFlag = false;
});
},
/**关闭共享屏幕 */
sharClickOff() {
this.sharFlag = true;
this.videoList = "videoList";
this.screenShareFlag = false;
if (this.userList.length > 1) {
this.videoClass = "videoItem1";
} else if (this.userList.length < 1) {
this.videoClass = "videoItem";
} else if (this.userList.length == 1) {
this.videoClass = "videoItem3";
}
trtc.stopScreenShare().then(() => {
this.sharFlag = true;
this.videoList = "videoList";
this.screenShareFlag = false;
if (this.userList.length > 1) {
this.videoClass = "videoItem1";
} else if (this.userList.length < 1) {
this.videoClass = "videoItem";
} else if (this.userList.length == 1) {
this.videoClass = "videoItem3";
}
});
},
/**获取当前用户操作权限 */
getMenuPermsByUserFn() {
@@ -360,28 +388,6 @@ export default {
this.$refs.upload3.clearFiles();
this.selectByIdFn(this.caseId);
},
upload3(param){
const formData = new FormData()
formData.append('file', param.file);
formData.append('annexType', 7);
formData.append('officeFlag', 1);
formData.append('caseId', this.caseId);
videoUpload(formData).then(res=>{
console.log('上传图片成功')
})
// axios.post(url, formData).then(response => {
// //根据返回值进行判断是否上传成功
// if(response.data.flag){
// //上传成功
// console.log('上传图片成功')
// }else{
// //上传失败
// console.log('图片上传失败')
// }
// }).catch(response => {
// console.log('异常处理')
// })
},
preview(item, flag) {
if (item.onlyOfficeFileId) {
// this.$router.push({
@@ -389,20 +395,18 @@ export default {
// query: { id: item.onlyOfficeFileId, flag: flag },
// });
let flag = 1;
if(this.editFlag){
flag = 1
}else{
flag = 0
if (this.editFlag) {
flag = 1;
} else {
flag = 0;
}
let token = sessionStorage.getItem('token')
window.open(
`http://121.40.189.20:8002/onlyoffice?id=${item.onlyOfficeFileId}&flag=${flag}`,
`http://121.40.189.20:8002/onlyoffice?id=${item.onlyOfficeFileId}&flag=${flag}&token=${token}`,
"_black"
);
} else {
window.open(
"http://121.40.189.20:6001" + item.annexPath,
"_black"
);
window.open(window.location.origin + item.annexPath, "_black");
}
},
// 点击提交修改后的内容
@@ -465,7 +469,7 @@ export default {
} else if (item.annexType == 12) {
this.resFile.push(item);
} else if (item.annexType == 7) {
this.mediateFile.push(item)
this.mediateFile.push(item);
}
});
});
@@ -496,7 +500,17 @@ export default {
trtc.on(TRTC.EVENT.REMOTE_VIDEO_AVAILABLE, (event) => {
const userId = event.userId;
const streamType = event.streamType;
this.userList.push(userId);
if (streamType == "main") {
this.userList.push(userId);
setTimeout(() => {
trtc.startRemoteVideo({ userId, streamType, view: `${userId}` });
});
} else if (streamType == "main") {
trtc.startRemoteVideo({ userId, streamType, view: "screenShare" });
this.videoList = "videoList1";
this.videoClass = "videoItem2";
this.screenShareFlag = true;
}
setTimeout(() => {
let aoido = trtc.getAudioTrack(userId);
this.asrList[this.userList[this.userList.length - 1]] = new ASR({
@@ -530,38 +544,48 @@ export default {
`<span>${res.result.voice_text_str}</span>`;
};
}, 2000);
setTimeout(() => {
trtc.startRemoteVideo({ userId, streamType, view: `${userId}` });
});
// })
});
},
// 删除退出会议人员列表
deletePushVideo() {
trtc.on(TRTC.EVENT.REMOTE_VIDEO_UNAVAILABLE, (event) => {
const streamType = event.streamType;
const userId = event.userId;
if (this.hostId == userId) {
alert("主持人已经解散会议");
this.$router.push({
name: "Home",
if (streamType == "main") {
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);
}
Object.keys(this.asrList).forEach((key) => {
this.asrList[userId].stop();
});
this.userList = [];
return;
} else if (streamType == "sub") {
this.sharFlag = true;
this.videoList = "videoList";
this.screenShareFlag = false;
if (this.userList.length > 1) {
this.videoClass = "videoItem1";
} else if (this.userList.length < 1) {
this.videoClass = "videoItem";
} else if (this.userList.length == 1) {
this.videoClass = "videoItem3";
}
}
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);
}
Object.keys(this.asrList).forEach((key) => {
this.asrList[userId].stop();
});
});
},
// 根据caseId查询房间相关信息
vue.config.js
+1 -1
View File
@@ -8,7 +8,7 @@ module.exports = defineConfig({
changeOrigin: true, // 是否改变Origin头信息
secure : false,
pathRewrite: {
'^/api': '' // 将/api前缀重写为空字符串
'^/tiaojie': '' // 将/api前缀重写为空字符串
},
},
'/zhongcai': {