joylink/rt-sim-training-client
6
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

socket弹出层处理

Browse Source
This commit is contained in:
joylink_cuiweidong 2020-01-15 14:32:17 +08:00
parent e0824e33a0
commit 4315cdade3
3 changed files with 99 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/layout/index.vue
View File

@ -12,6 +12,20 @@
<div style="font-size:14px;float:right;">{{ isHyd? '哈尔滨盈达科技有限公司 联系电话:0451-87001273' : $t('global.companyICP') }}</div>
</el-footer>
</div>
<div>
<el-dialog
:title="$t('tip.hint')"
custom-class="dialogMessage"
:visible.sync="dialogVisible"
width="30%"
:before-close="closeDialog"
>
<span>{{ dialogMessage }}</span>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="closeDialog">{{ $t('global.confirm') }}</el-button>
</span>
</el-dialog>
</div>
</div>
</template>
@ -26,6 +40,7 @@ export default {
},
data() {
return {
dialogVisible: false
};
},
computed: {
@ -49,6 +64,19 @@ export default {
},
isHyd() {
return getSessionStorage('project').endsWith('hyd');
},
dialogMessage() {
return this.$store.state.app.dialogMessage;
}
},
watch:{
'$store.state.app.dialogMessage':function(val) {
debugger;
if (val == '') {
this.dialogVisible = false;
} else {
this.dialogVisible = true;
}
}
},
created() {
@ -62,6 +90,9 @@ export default {
this.$router.beforeEach((to, from, next) => {
next();
});
},
closeDialog() {
this.$store.dispatch('app/SET_DIALOG_MESSAGE', '');
}
}
};
@ -107,6 +138,9 @@ export default {
height: 100%;
}
}
.el-dialog.dialogMessage{
width:400px !important;
}
// 定义公共card样式
.joylink-card{

113
src/store/modules/app.js
View File

@ -1,66 +1,73 @@
import Cookies from 'js-cookie';
const state = {
sidebar: {
opened: Cookies.get('sidebarStatus') ? !!+Cookies.get('sidebarStatus') : true,
withoutAnimation: false
},
device: 'desktop',
width: document.documentElement.clientWidth,
height: document.documentElement.clientHeight,
windowSizeCount: 0
sidebar: {
opened: Cookies.get('sidebarStatus') ? !!+Cookies.get('sidebarStatus') : true,
withoutAnimation: false
},
device: 'desktop',
width: document.documentElement.clientWidth,
height: document.documentElement.clientHeight,
windowSizeCount: 0,
dialogMessage:''
};
const mutations = {
TOGGLE_SIDEBAR: state => {
state.sidebar.opened = !state.sidebar.opened;
state.sidebar.withoutAnimation = false;
if (state.sidebar.opened) {
Cookies.set('sidebarStatus', 1);
} else {
Cookies.set('sidebarStatus', 0);
}
},
CLOSE_SIDEBAR: (state, withoutAnimation) => {
Cookies.set('sidebarStatus', 0);
state.sidebar.opened = false;
state.sidebar.withoutAnimation = withoutAnimation;
},
TOGGLE_DEVICE: (state, device) => {
state.device = device;
},
SET_WIDTH: (state, width) => {
state.width = width;
},
SET_HEIGHT: (state, height) => {
state.height = height;
}
TOGGLE_SIDEBAR: state => {
state.sidebar.opened = !state.sidebar.opened;
state.sidebar.withoutAnimation = false;
if (state.sidebar.opened) {
Cookies.set('sidebarStatus', 1);
} else {
Cookies.set('sidebarStatus', 0);
}
},
CLOSE_SIDEBAR: (state, withoutAnimation) => {
Cookies.set('sidebarStatus', 0);
state.sidebar.opened = false;
state.sidebar.withoutAnimation = withoutAnimation;
},
TOGGLE_DEVICE: (state, device) => {
state.device = device;
},
SET_WIDTH: (state, width) => {
state.width = width;
},
SET_HEIGHT: (state, height) => {
state.height = height;
},
SET_DIALOG_MESSAGE:(state, dialogMessage)=>{
state.dialogMessage = dialogMessage;
}
};
const actions = {
toggleSideBar({ commit }) {
commit('TOGGLE_SIDEBAR');
},
closeSideBar({ commit }, { withoutAnimation }) {
commit('CLOSE_SIDEBAR', withoutAnimation);
},
toggleDevice({ commit }, device) {
commit('TOGGLE_DEVICE', device);
},
resize({ state, commit }, opt) {
if (opt.width) {
commit('SET_WIDTH', opt.width);
}
if (opt.height) {
commit('SET_HEIGHT', opt.height);
}
state.windowSizeCount += 1;
}
toggleSideBar({ commit }) {
commit('TOGGLE_SIDEBAR');
},
closeSideBar({ commit }, { withoutAnimation }) {
commit('CLOSE_SIDEBAR', withoutAnimation);
},
toggleDevice({ commit }, device) {
commit('TOGGLE_DEVICE', device);
},
resize({ state, commit }, opt) {
if (opt.width) {
commit('SET_WIDTH', opt.width);
}
if (opt.height) {
commit('SET_HEIGHT', opt.height);
}
state.windowSizeCount += 1;
},
SET_DIALOG_MESSAGE({ commit }, dialogMessage) {
commit('SET_DIALOG_MESSAGE', dialogMessage);
}
};
export default {
namespaced: true,
state,
mutations,
actions
namespaced: true,
state,
mutations,
actions
};

9
src/utils/sock.js
View File

@ -52,7 +52,8 @@ StompClient.prototype = {
const that = this;
this.clientIns.connect({ 'X-Token': getToken() }, () => {
if (notFirstConnect) {
Message.success('连接成功');
store.dispatch('app/SET_DIALOG_MESSAGE', '');
setTimeout(()=>{ Message.success('连接成功'); });
}
console.info('连接成功.');
that.count = 0;
@ -65,7 +66,8 @@ StompClient.prototype = {
// sock断开回调
this.clientIns.ws.onclose = () => {
MessageBox.confirm('socket已经断开');
// MessageBox.confirm('连接已经断开');
store.dispatch('app/SET_DIALOG_MESSAGE', 'socket连接已断开');
notFirstConnect = true;
checkLoginLine().then(() => {
this.status = false;
@ -76,7 +78,6 @@ StompClient.prototype = {
});
};
this.clientIns.ws.onerror = ()=>{
// debugger;
console.log(1111);
};
resolve(this);
@ -109,7 +110,7 @@ StompClient.prototype = {
// 恢复链接
reconnect(count) {
console.info(`尝试第${count || 1}次连接.`);
Message.error(`正在尝试第${count || 1}次连接.`);
store.dispatch('app/SET_DIALOG_MESSAGE', `正在尝试第${count || 1}次连接.`);
const that = this;
setTimeout(() => {
that.connect().then(() => { }).catch(() => {