tanghuan/mediate-manage-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

bug修改，视频提前提醒部分

Browse Source
This commit is contained in:
tdg930622 2025-01-17 17:20:20 +08:00
parent 0a03c5f96f
commit f0f4d79585
5 changed files with 494 additions and 421 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/App.vue
View File

@ -33,10 +33,19 @@ export default {
methods: { methods: {
socketSucc(frame) { socketSucc(frame) {
console.log(frame, '---初始化成功app') console.log(frame, '---初始化成功app')
// '/user/'+userId+'/queue/video'
let userInfo = JSON.parse(sessionStorage.getItem('userInfo'))
let url = `/user/${userInfo.phone}/queue/video`
// console.log(url, '---订阅地址')
this.$stompSocket.subscription(url, this.receivePush)
}, },
socketErr(frame) { socketErr(frame) {
console.log(frame, '---初始化失败app') console.log(frame, '---初始化失败app')
}, },
receivePush(message) {
console.log(message, '---接收订阅消息')
// this.$store.commit('setVideoReminder', JSON.stringify(message))
},
scriptWithDataSetExists(dataId) { scriptWithDataSetExists(dataId) {
const scriptElement = document.querySelector(`script[data-telephone="${dataId}"]`); const scriptElement = document.querySelector(`script[data-telephone="${dataId}"]`);
return scriptElement !== null; return scriptElement !== null;

183
src/pages/layout/components/LayoutHeader.vue
View File

@ -11,7 +11,7 @@
</div> </div>
<div class="layou-header-left-box flex-row align-items-center"> <div class="layou-header-left-box flex-row align-items-center">
<SideMenu /> <SideMenu/>
</div> </div>
<div class="mr-8 flex-row cursor-pointer layou-header-right-box" @mouseover="showInfo=true" style=""> <div class="mr-8 flex-row cursor-pointer layou-header-right-box" @mouseover="showInfo=true" style="">
@ -30,19 +30,23 @@
<div class="flex-row align-items-center show-info-header"> <div class="flex-row align-items-center show-info-header">
<el-avatar :size="56" :src="userInfo.headUrl?userInfo.headUrl:defaultHeadUrl"></el-avatar> <el-avatar :size="56" :src="userInfo.headUrl?userInfo.headUrl:defaultHeadUrl"></el-avatar>
<div class="ml-8 f14"> <div class="ml-8 f14">
<div class="f18 color-text-primary pb-8">{{userInfo.realName || userInfo.showName ||'-'}}</div> <div class="f18 color-text-primary pb-8">{{ userInfo.realName || userInfo.showName || '-' }}</div>
<div class="f14 color-text-regular">{{userInfo.phone||'-'}}</div> <div class="f14 color-text-regular">{{ userInfo.phone || '-' }}</div>
</div> </div>
</div> </div>
<div class="flex-row justify-content-between align-items-center border-t-solid-lighter-1 p-16 cursor-pointer" @click="handleChangePassword"> <div class="flex-row justify-content-between align-items-center border-t-solid-lighter-1 p-16 cursor-pointer"
@click="handleChangePassword">
<div class="f16 color-text-regular">密码管理</div> <div class="f16 color-text-regular">密码管理</div>
<div class="f16 color-text-secondary">修改密码<i class="el-icon-arrow-right"></i></div> <div class="f16 color-text-secondary">修改密码<i class="el-icon-arrow-right"></i></div>
</div> </div>
<div class="flex-row justify-content-between align-items-center border-t-solid-lighter-1 p-16 cursor-pointer" @click="handleChangePersonal"> <div class="flex-row justify-content-between align-items-center border-t-solid-lighter-1 p-16 cursor-pointer"
@click="handleChangePersonal">
<div class="f16 color-text-regular">个人信息</div> <div class="f16 color-text-regular">个人信息</div>
<div class="f16 color-text-secondary">查看信息<i class="el-icon-arrow-right"></i></div> <div class="f16 color-text-secondary">查看信息<i class="el-icon-arrow-right"></i></div>
</div> </div>
<div class="border-t-solid-lighter-1 p-16 f16 color-1960F4 text-center cursor-pointer" @click="handleLoginOut()">退出登录</div> <div class="border-t-solid-lighter-1 p-16 f16 color-1960F4 text-center cursor-pointer"
@click="handleLoginOut()">退出登录
</div>
</div> </div>
</el-collapse-transition> </el-collapse-transition>
</div> </div>
@ -164,7 +168,7 @@
<el-row type="flex" align="middle"> <el-row type="flex" align="middle">
<el-col :span="8"> <el-col :span="8">
<el-form-item v-if="PersonalInfo.signPic !=''" label="个人签名"> <el-form-item v-if="PersonalInfo.signPic !=''" label="个人签名">
<img :src="signUrl" width="125px" height="125px" /> <img :src="signUrl" width="125px" height="125px"/>
<span class="cursor-pointer color-86909C"><i class="el-icon-refresh"></i> 重新签名</span> <span class="cursor-pointer color-86909C"><i class="el-icon-refresh"></i> 重新签名</span>
</el-form-item> </el-form-item>
<el-form-item v-else label="个人签名"> <el-form-item v-else label="个人签名">
@ -187,12 +191,13 @@
</template> </template>
<script> <script>
import api from "@/services/systemManage"; import api from "@/services/systemManage";
export default {
export default {
components: { components: {
SideMenu: () => import('./SideMenu'), SideMenu: () => import('./SideMenu'),
}, },
data(){ data() {
var validatePass = (rule, value, callback) => { var validatePass = (rule, value, callback) => {
if (value === '') { if (value === '') {
callback(new Error('请输入密码')); callback(new Error('请输入密码'));
@ -212,44 +217,48 @@
callback(); callback();
} }
}; };
return{ return {
showInfo:false, showInfo: false,
changePasswordVisible:false, changePasswordVisible: false,
changePersonalVisible:false, changePersonalVisible: false,
strKey: 'trydotec', strKey: 'trydotec',
passwordInfo:{ passwordInfo: {
oldPwd:'',//旧密码 oldPwd: '',//旧密码
pwd:'',//新密码 pwd: '',//新密码
confirmPwd:'',//再次 confirmPwd: '',//再次
}, },
PersonalInfo:{ PersonalInfo: {
realName:'', realName: '',
phone:'', phone: '',
id:'', id: '',
signPic:'', signPic: '',
replyPhone:'', replyPhone: '',
cardNo:'', cardNo: '',
roleIds:[] roleIds: []
}, },
signUrl:'', signUrl: '',
rulesClient: { rulesClient: {
oldPwd: [ oldPwd: [
{ required: true, message: '请输入旧密码', trigger: 'change',}, {required: true, message: '请输入旧密码', trigger: 'change',},
], ],
pwd: [ pwd: [
{ required: true, validator:validatePass, trigger: 'change',}, {required: true, validator: validatePass, trigger: 'change',},
{ pattern: /^(?=.*[a-zA-Z])(?=.*[0-9])(?=.*[\W_]).{6,18}$/, message: '只能输入由6-18个字母、数字、下划线组成的密码', trigger: ['blur', 'change']} {
pattern: /^(?=.*[a-zA-Z])(?=.*[0-9])(?=.*[\W_]).{6,18}$/,
message: '只能输入由6-18个字母、数字、下划线组成的密码',
trigger: ['blur', 'change']
}
], ],
confirmPwd: [ confirmPwd: [
{ required: true,validator:validatePass2, trigger: 'change',}, {required: true, validator: validatePass2, trigger: 'change',},
], ],
}, },
userInfo:{}, userInfo: {},
defaultHeadUrl:'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png',//默认图片 defaultHeadUrl: 'https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png',//默认图片
} }
}, },
mounted () { mounted() {
if(JSON.parse(sessionStorage.getItem('userInfo'))){ if (JSON.parse(sessionStorage.getItem('userInfo'))) {
this.userInfo = JSON.parse(sessionStorage.getItem('userInfo')) this.userInfo = JSON.parse(sessionStorage.getItem('userInfo'))
} }
// console.log('获取当前登录人的信息',this.userInfo) // console.log('获取当前登录人的信息',this.userInfo)
@ -257,8 +266,8 @@
}, },
methods: { methods: {
// 个人信息 // 个人信息
handleChangePersonal(){ handleChangePersonal() {
api.getUserById({id:this.userInfo.id}).then(res => { api.getUserById({id: this.userInfo.id}).then(res => {
this.PersonalInfo.id = res.id this.PersonalInfo.id = res.id
this.PersonalInfo.realName = res.realName this.PersonalInfo.realName = res.realName
// this.PersonalInfo.realName = res.realName // this.PersonalInfo.realName = res.realName
@ -271,13 +280,13 @@
this.PersonalInfo.roleIds = res.roleIds this.PersonalInfo.roleIds = res.roleIds
}) })
api.getQrCode().then(res => { api.getQrCode().then(res => {
this.signUrl = 'data:image/jpg;base64,'+res this.signUrl = 'data:image/jpg;base64,' + res
}) })
this.changePersonalVisible =true this.changePersonalVisible = true
this.showInfo = false this.showInfo = false
}, },
handlePersonalSubmit(){ handlePersonalSubmit() {
api.updateUserById(this.PersonalInfo).then(res => { api.updateUserById(this.PersonalInfo).then(res => {
this.$message.success("修改成功") this.$message.success("修改成功")
this.handleClose() this.handleClose()
@ -285,15 +294,15 @@
}, },
// 修改密码 // 修改密码
handleChangePassword(){ handleChangePassword() {
this.changePasswordVisible =true this.changePasswordVisible = true
this.showInfo = false this.showInfo = false
for (let key in this.passwordInfo) { for (let key in this.passwordInfo) {
this.passwordInfo[key] = '' this.passwordInfo[key] = ''
} }
}, },
// 确定 // 确定
handleSubmit(){ handleSubmit() {
this.$refs.ruleForm.validate((valid) => { this.$refs.ruleForm.validate((valid) => {
if (valid) { if (valid) {
@ -303,13 +312,13 @@
// } // }
let data = { let data = {
id:this.userInfo.id, id: this.userInfo.id,
oldPwd:this.$util.encryptByDES(this.strKey, this.passwordInfo.oldPwd), oldPwd: this.$util.encryptByDES(this.strKey, this.passwordInfo.oldPwd),
pwd:this.passwordInfo.pwd, pwd: this.passwordInfo.pwd,
confirmPwd:this.passwordInfo.confirmPwd, confirmPwd: this.passwordInfo.confirmPwd,
} }
console.log('修改密码数据===',data) console.log('修改密码数据===', data)
this.$fetchApi.updatePassword(data).then(res => { this.$fetchApi.updatePassword(data).then(res => {
this.$message.success("修改成功") this.$message.success("修改成功")
this.handleClose() this.handleClose()
@ -320,12 +329,12 @@
}, },
// 关闭 // 关闭
handleClose(){ handleClose() {
this.changePasswordVisible = false this.changePasswordVisible = false
this.changePersonalVisible = false this.changePersonalVisible = false
}, },
// 退出登录 // 退出登录
handleLoginOut(){ handleLoginOut() {
// token注销失效 // token注销失效
this.$fetchApi.logout().then(res => { this.$fetchApi.logout().then(res => {
// if(!res.code){ // if(!res.code){
@ -334,16 +343,18 @@
this.$store.commit('setToken', ''); this.$store.commit('setToken', '');
sessionStorage.removeItem('userInfo') sessionStorage.removeItem('userInfo')
this.$store.commit('setUserInfo', ''); this.$store.commit('setUserInfo', '');
this.$store.commit('setRoutes','') this.$store.commit('setRoutes', '');
sessionStorage.removeItem('brokerEndpoint');
this.$store.commit('brokerEndpoint', '');
// } // }
}) })
}, },
} }
} }
</script> </script>
<style lang="scss"> <style lang="scss">
.layout-header-wrap{ .layout-header-wrap {
width: 100%; width: 100%;
height: $height56; height: $height56;
display: flex; display: flex;
@ -355,37 +366,58 @@
background-size: cover; background-size: cover;
background-color: #C66A5B; background-color: #C66A5B;
.el-badge__content{ .el-badge__content {
height: $height20; height: $height20;
line-height: $height20; line-height: $height20;
border: 0 !important; border: 0 !important;
top: 30px; top: 30px;
} }
.layou-header-right-box{width: 300px;display: inline-block;text-align: right;}
.layout-side-menu-wrap .side-menu-container{border-right: 0;} .layou-header-right-box {
.el-menu{ width: 300px;
display: inline-block;
text-align: right;
}
.layout-side-menu-wrap .side-menu-container {
border-right: 0;
}
.el-menu {
border: 0; border: 0;
background-color: transparent; background-color: transparent;
} }
.el-menu--horizontal > .el-menu-item{color: #FFFFFFB2;}
.el-menu--horizontal > .el-submenu .el-submenu__title{color: #FFFFFFB2;}
.el-menu--horizontal > .el-menu-item:hover{ .el-menu--horizontal > .el-menu-item {
color: #FFFFFFB2;
}
.el-menu--horizontal > .el-submenu .el-submenu__title {
color: #FFFFFFB2;
}
.el-menu--horizontal > .el-menu-item:hover {
color: #C66A5B; color: #C66A5B;
background-color: transparent; background-color: transparent;
color: #fff; color: #fff;
} }
.el-menu--horizontal > .el-submenu:hover .el-submenu__title { .el-menu--horizontal > .el-submenu:hover .el-submenu__title {
color:#C66A5B; color: #C66A5B;
background-color: transparent; background-color: transparent;
color: #fff; color: #fff;
} }
.el-submenu__title i{color:#FFFFFFB2; }
.el-menu--horizontal > .el-menu-item.is-active{ .el-submenu__title i {
color: #FFFFFFB2;
}
.el-menu--horizontal > .el-menu-item.is-active {
border-bottom: 2px solid #fff; border-bottom: 2px solid #fff;
background-color: transparent; background-color: transparent;
color: #fff; color: #fff;
} }
.el-menu--horizontal > .el-submenu.is-active .el-submenu__title { .el-menu--horizontal > .el-submenu.is-active .el-submenu__title {
border-bottom: 2px solid #fff; border-bottom: 2px solid #fff;
background-color: transparent; background-color: transparent;
@ -393,13 +425,16 @@
} }
} }
.el-menu--horizontal .el-menu.el-menu--popup .el-menu-item:not(.is-disabled):hover{
color:#C66A5B; .el-menu--horizontal .el-menu.el-menu--popup .el-menu-item:not(.is-disabled):hover {
color: #C66A5B;
} }
.el-menu--horizontal .el-menu .el-menu-item.is-active, .el-menu--horizontal .el-menu .el-submenu.is-active > .el-submenu__title { .el-menu--horizontal .el-menu .el-menu-item.is-active, .el-menu--horizontal .el-menu .el-submenu.is-active > .el-submenu__title {
color:#C66A5B; color: #C66A5B;
} }
.layout-header-number{
.layout-header-number {
position: absolute; position: absolute;
right: -10px; right: -10px;
bottom: -4px; bottom: -4px;
@ -414,23 +449,25 @@
padding: 1px 5px; padding: 1px 5px;
} }
.show-info-wrap{ .show-info-wrap {
position: absolute; position: absolute;
width: 320px; width: 320px;
// height: 248px; // height: 248px;
background-color: $color-white; background-color: $color-white;
top:8px; top: 8px;
right: 16px; right: 16px;
border: 1px solid $border-color-lighter; border: 1px solid $border-color-lighter;
z-index: 999; z-index: 999;
box-shadow: 2px 2px 5px $border-color-lighter; box-shadow: 2px 2px 5px $border-color-lighter;
transition: opacity 2s; transition: opacity 2s;
.show-info-header{
.show-info-header {
padding: 40px 16px; padding: 40px 16px;
} }
} }
// 修改图标样式 // 修改图标样式
.el-icon-caret-bottom{ .el-icon-caret-bottom {
font-size: 30px; font-size: 30px;
color: $color-text-placeholder; color: $color-text-placeholder;
cursor: pointer; cursor: pointer;
@ -438,8 +475,8 @@
/* 在小于或等于 1440 像素的屏幕上 */ /* 在小于或等于 1440 像素的屏幕上 */
@media screen and (max-width: 1440px) { @media screen and (max-width: 1440px) {
.layout-header-wrap{ .layout-header-wrap {
background: url('~@/assets/image/header-bg-1440.png') no-repeat ; background: url('~@/assets/image/header-bg-1440.png') no-repeat;
background-size: cover; background-size: cover;
} }
} }

9
src/pages/login/index.vue
View File

@ -306,9 +306,18 @@ export default {
socketSucc(frame) { socketSucc(frame) {
console.log(frame, '---初始化成功login') console.log(frame, '---初始化成功login')
// '/user/'+userId+'/queue/video'
let userInfo = JSON.parse(sessionStorage.getItem('userInfo'))
let url = `/user/${userInfo.phone}/queue/video`
// console.log(url, '---订阅地址')
this.$stompSocket.subscription(url, this.receivePush)
}, },
socketErr(frame) { socketErr(frame) {
console.log(frame, '---初始化失败login') console.log(frame, '---初始化失败login')
},
receivePush(message) {
console.log(message, '---接收订阅消息')
// this.$store.commit('setVideoReminder', JSON.stringify(message))
} }
} }
} }

14
src/pages/mediation-page/components/MediationRoom.vue
View File

@ -223,6 +223,7 @@
</template> </template>
<script> <script>
import api from "@/services/caseManagement"; import api from "@/services/caseManagement";
import {mapState} from 'vuex'
export default { export default {
components: { components: {
caseVideoReservationDialog: () => import('./caseVideoReservationDialog'),// caseVideoReservationDialog: () => import('./caseVideoReservationDialog'),//
@ -376,6 +377,19 @@ export default {
const seconds = totalSeconds % 60; const seconds = totalSeconds % 60;
return `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`; return `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
}, },
...mapState({
videoReminder: state => state.videoReminder
}),
},
watch: {
videoReminder: {
deep: true,
handler: function (val) {
if (val){
console.log(val, '---视频提前5分钟提醒')
}
}
}
}, },
async created() { async created() {

4
src/store/index.js
View File

@ -25,6 +25,7 @@ const store = new Vuex.Store({
idFrontPath: '', idFrontPath: '',
routes: [], // 从后端获取的路由菜单 routes: [], // 从后端获取的路由菜单
brokerEndpoint: '', brokerEndpoint: '',
videoReminder: '',
}, },
plugins: [vuexPersisted], plugins: [vuexPersisted],
// 全局同步方法, 调用方法,this.$store.commit("xxx",'赋值数据') // 全局同步方法, 调用方法,this.$store.commit("xxx",'赋值数据')
@ -44,6 +45,9 @@ const store = new Vuex.Store({
setBrokerEndpoint(state, data) { setBrokerEndpoint(state, data) {
state.brokerEndpoint = data; state.brokerEndpoint = data;
}, },
setVideoReminder(state, data) {
state.videoReminder = data;
}
}, },
// 异步方法 调用方法,this.$store.dispatch("xxx") // 异步方法 调用方法,this.$store.dispatch("xxx")