|
@@ -70,14 +70,16 @@
|
|
|
</el-popover>
|
|
|
</div>
|
|
|
</div>
|
|
|
-
|
|
|
+ <div v-if="showCustomer" class="customer-container">
|
|
|
+ <iframe :src="customerUrl" name="_blank" frameborder="0" width="100%" height="100%"></iframe>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import NavbarItem from './components/item'
|
|
|
import NavbarSearch from './components/search'
|
|
|
-import { mapActions, mapGetters, mapState } from 'vuex'
|
|
|
+import { mapActions, mapGetters, mapState, mapMutations } from 'vuex'
|
|
|
import EmptyTip from '../Empty'
|
|
|
import {debounce} from 'lodash'
|
|
|
|
|
@@ -127,6 +129,10 @@ export default {
|
|
|
// 获取是否启用自定义顶部导航用户信息自定义
|
|
|
...mapGetters('work-bench', [
|
|
|
'useCustomStatus'
|
|
|
+ ]),
|
|
|
+ ...mapState('customer', [
|
|
|
+ 'showCustomer',
|
|
|
+ 'customerUrl'
|
|
|
])
|
|
|
},
|
|
|
created () {
|
|
@@ -153,6 +159,22 @@ export default {
|
|
|
})
|
|
|
this.getMessageInfo()
|
|
|
},
|
|
|
+ mounted () {
|
|
|
+ window.addEventListener('message', (event) => {
|
|
|
+ // 子页面发送来得消息是关闭或是全屏操作时 关闭当前侧边栏会话窗口
|
|
|
+ if (event.data && event.data.action) {
|
|
|
+ if (event.data.action === 'close') {
|
|
|
+ this.setCustomerStatus(false)
|
|
|
+ } else if (event.data.action ==='fullScreen') {
|
|
|
+ this.setCustomerStatus(false)
|
|
|
+ window.open(this.customerUrl.replace('&from=aside', '&mini=1'))
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, false)
|
|
|
+ },
|
|
|
+ beforeDestroy () {
|
|
|
+ window.removeEventListener('message', () => {})
|
|
|
+ },
|
|
|
methods: {
|
|
|
...mapActions('work-bench', [
|
|
|
'getPower',
|
|
@@ -163,6 +185,9 @@ export default {
|
|
|
'setReadMessage',
|
|
|
'navbarConvergeSearch'
|
|
|
]),
|
|
|
+ ...mapMutations('customer', [
|
|
|
+ 'setCustomerStatus'
|
|
|
+ ]),
|
|
|
/**
|
|
|
* 获取消息数据
|
|
|
*/
|
|
@@ -557,5 +582,24 @@ export default {
|
|
|
margin-left: 48px;
|
|
|
}
|
|
|
}
|
|
|
+ .customer-container{
|
|
|
+ // display: none;
|
|
|
+ position: fixed;
|
|
|
+ right: 84px;
|
|
|
+ bottom: 80px;
|
|
|
+ max-height: 674px;
|
|
|
+ min-height: 400px;
|
|
|
+ width: 460px;
|
|
|
+ height: calc(100% - 40px);
|
|
|
+ box-shadow: 0 0 20px 0 rgba(8, 31, 38, 0.12);
|
|
|
+ border-radius: 8px;
|
|
|
+ overflow: hidden;
|
|
|
+ z-index: 9999;
|
|
|
+ }
|
|
|
+ @media screen and (max-height: 800px) {
|
|
|
+ .customer-container{
|
|
|
+ bottom: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|