优化客服聊天
This commit is contained in:
parent
8e660fd657
commit
8ea101637e
@ -51,4 +51,18 @@ export default {
|
||||
return await http.post(this.url, data);
|
||||
}
|
||||
},
|
||||
contactList:{
|
||||
url: `${config.API_URL}/customer.service.message.contact.list`,
|
||||
name: "联系人列表推送",
|
||||
post: async function(data){
|
||||
return await http.post(this.url, data);
|
||||
}
|
||||
},
|
||||
attachmentMessage: {
|
||||
url: `${config.API_URL}/customer.service.message.attachment.push`,
|
||||
name: "附件推送",
|
||||
post: async function(data){
|
||||
return await http.post(this.url, data);
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
@ -66,12 +66,19 @@ export default {
|
||||
mounted() {
|
||||
let token = this.$TOOL.cookie.get('TOKEN');
|
||||
if (token && token != null) {
|
||||
// 登录成功连接ws
|
||||
let global_callback = function () {};
|
||||
this.$socketApi.createWebSocket(global_callback);
|
||||
|
||||
// 获取新消息
|
||||
eventBus.$on('sockBack', this.getWsResult);
|
||||
|
||||
|
||||
const userInfo = this.$TOOL.data.get("USER_INFO");
|
||||
if(userInfo && userInfo.id){
|
||||
this.user_id = userInfo.id;
|
||||
}
|
||||
}
|
||||
},
|
||||
unmounted() {
|
||||
eventBus.$off('sockBack', this.getWsResult);
|
||||
|
||||
@ -64,7 +64,14 @@ const routes = [
|
||||
meta: {
|
||||
title: "维保服务"
|
||||
}
|
||||
},
|
||||
{
|
||||
path: "/personalCenter",
|
||||
component: () => import(/* webpackChunkName: "personalCenter" */ '@/views/personalCenter'),
|
||||
meta: {
|
||||
title: "个人中心"
|
||||
}
|
||||
},
|
||||
]
|
||||
|
||||
export default routes;
|
||||
|
||||
35
src/style/serve.scss
Normal file
35
src/style/serve.scss
Normal file
@ -0,0 +1,35 @@
|
||||
.serveMain{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.serveTitle{
|
||||
font-size: 14px;
|
||||
position: relative;
|
||||
}
|
||||
.serveTitle:before{
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 4px;
|
||||
top: calc(50% - 8px);
|
||||
width:3px;
|
||||
height: 16px;
|
||||
border-radius: 4px;
|
||||
background: var(--el-color-primary);
|
||||
}
|
||||
.searchMain{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
.searchItem{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 10px 10px 0 0;
|
||||
.name{
|
||||
width: 70px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.mainTable{
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
@ -8,3 +8,4 @@
|
||||
@import 'docs.scss';
|
||||
@import "order.scss";
|
||||
@import "search.scss";
|
||||
@import "serve.scss";
|
||||
|
||||
@ -75,9 +75,9 @@
|
||||
return false
|
||||
}
|
||||
if(user.data.user.company_id === 0){
|
||||
// 登录成功连接ws
|
||||
let global_callback = function () {};
|
||||
this.$socketApi.createWebSocket(global_callback);
|
||||
// // 登录成功连接ws
|
||||
// let global_callback = function () {};
|
||||
// this.$socketApi.createWebSocket(global_callback);
|
||||
this.$router.replace({
|
||||
path: '/maintenance'
|
||||
})
|
||||
|
||||
@ -145,6 +145,7 @@ export default {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0 20px;
|
||||
.rowView{
|
||||
height: 220px;
|
||||
padding: 20px 0;
|
||||
|
||||
120
src/views/personalCenter/index.vue
Normal file
120
src/views/personalCenter/index.vue
Normal file
@ -0,0 +1,120 @@
|
||||
<template>
|
||||
<div class="mainServeBody">
|
||||
<commonPage title="个人中心"></commonPage>
|
||||
<el-main class="serveMain">
|
||||
<el-scrollbar class="mainScroll">
|
||||
<div class="pageBody">
|
||||
<div class="pageLeft">
|
||||
<el-main>
|
||||
<el-aside width="210px">
|
||||
<el-menu class="menu mainMenu" :default-active="page">
|
||||
<el-menu-item-group v-for="group in menu" :key="group.groupName" :title="group.groupName">
|
||||
<el-menu-item v-for="item in group.list" :key="item.component" :index="item.component" @click="openPage">
|
||||
<el-icon v-if="item.icon"><component :is="item.icon"/></el-icon>
|
||||
<template #title>
|
||||
<span>{{item.title}}</span>
|
||||
</template>
|
||||
</el-menu-item>
|
||||
</el-menu-item-group>
|
||||
</el-menu>
|
||||
</el-aside>
|
||||
</el-main>
|
||||
</div>
|
||||
<div class="pageRight">
|
||||
<component :is="page"/>
|
||||
</div>
|
||||
</div>
|
||||
<footerPage></footerPage>
|
||||
</el-scrollbar>
|
||||
</el-main>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import commonPage from "@/views/serveView/components/commonPage";
|
||||
import footerPage from "@/views/serveView/components/footerPage";
|
||||
export default {
|
||||
name: "index",
|
||||
components:{
|
||||
commonPage,
|
||||
footerPage,
|
||||
|
||||
},
|
||||
data(){
|
||||
return{
|
||||
page: "editAccount",
|
||||
menu: [
|
||||
{
|
||||
groupName: "个人中心",
|
||||
list: [
|
||||
{
|
||||
icon: "sc-icon-Account",
|
||||
title: "编辑账号",
|
||||
component: "editAccount"
|
||||
},
|
||||
{
|
||||
icon: "sc-icon-Password",
|
||||
title: "更新公司信息",
|
||||
component: "companyDetail"
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
groupName: "自助服务",
|
||||
list: [
|
||||
{
|
||||
icon: "sc-icon-Account",
|
||||
title: "我的产品",
|
||||
component: "product"
|
||||
},
|
||||
{
|
||||
icon: "sc-icon-Password",
|
||||
title: "问题单",
|
||||
component: "problem"
|
||||
},
|
||||
]
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods:{
|
||||
openPage(item){
|
||||
this.page = item.index
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.mainScroll ::v-deep .el-scrollbar__view{
|
||||
height: calc(100% - 240px);
|
||||
}
|
||||
|
||||
.mainServeBody{
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: #fff;
|
||||
.serveMain{
|
||||
flex: 1;
|
||||
padding: 0;
|
||||
border-radius: 0;
|
||||
.pageBody{
|
||||
height: 100%;
|
||||
display: flex;
|
||||
.pageLeft{
|
||||
height: 100%;
|
||||
.el-aside{
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.pageRight{
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -8,7 +8,7 @@
|
||||
<div class="headerView">
|
||||
<div class="menuList">
|
||||
<div class="menu-item">
|
||||
<el-dropdown trigger="click" placement="bottom-start">
|
||||
<el-dropdown trigger="click" @command="handleUser" placement="bottom-start">
|
||||
<span class="el-dropdown-link">
|
||||
个人中心
|
||||
<el-icon class="el-icon--right">
|
||||
@ -37,13 +37,13 @@
|
||||
<el-dropdown-item icon="sc-icon-ClearCache" command="clearCache">清除缓存</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
<div class="loginOut">
|
||||
<el-button class="btn" style="width: 100%">退出登录</el-button>
|
||||
<el-button class="btn" style="width: 100%" @click="loginOut">退出登录</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
<div class="menu-item">
|
||||
<el-dropdown trigger="click">
|
||||
<el-dropdown trigger="click" @command="serverQuery">
|
||||
<span class="el-dropdown-link">
|
||||
服务支持
|
||||
<el-icon class="el-icon--right">
|
||||
@ -52,9 +52,9 @@
|
||||
</span>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item>维保期限查询</el-dropdown-item>
|
||||
<el-dropdown-item>主控部件查询</el-dropdown-item>
|
||||
<el-dropdown-item>订单号查询</el-dropdown-item>
|
||||
<el-dropdown-item command="termQuery">维保期限查询</el-dropdown-item>
|
||||
<el-dropdown-item command="componentQuery">主控部件查询</el-dropdown-item>
|
||||
<el-dropdown-item command="orderQuery">订单号查询</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
@ -75,6 +75,8 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {eventBus} from "@/utils/eventBus";
|
||||
|
||||
export default {
|
||||
props: {
|
||||
title: { type: String, default: "" }
|
||||
@ -88,6 +90,60 @@ export default {
|
||||
|
||||
},
|
||||
methods:{
|
||||
//个人信息
|
||||
handleUser(command) {
|
||||
if (command == "uc") {
|
||||
this.$router.push({ path: '/personalCenter' });
|
||||
}
|
||||
if (command == "clearCache") {
|
||||
this.$confirm('清除缓存会将系统初始化,包括登录状态、主题、语言设置等,是否继续?', '警告', {
|
||||
type: 'warning',
|
||||
}).then(async () => {
|
||||
const loading = this.$loading()
|
||||
const res = await this.$API.system.user.logout.post();
|
||||
if (res.code == 200) {
|
||||
this.$TOOL.data.clear()
|
||||
this.$router.replace({path: '/login'});
|
||||
setTimeout(() => {
|
||||
loading.close()
|
||||
location.reload()
|
||||
}, 1000)
|
||||
}
|
||||
}).catch(() => {
|
||||
//取消
|
||||
})
|
||||
}
|
||||
},
|
||||
serverQuery(command){
|
||||
if (command == "termQuery") {
|
||||
this.$router.push({ path: '/serve'});
|
||||
eventBus.$emit('queryBack',{name:'term'});
|
||||
}
|
||||
if (command == "componentQuery") {
|
||||
this.$router.push({ path: '/serve'});
|
||||
eventBus.$emit('queryBack',{name:'widget'});
|
||||
}
|
||||
if (command == "orderQuery") {
|
||||
this.$router.push({ path: '/serve'});
|
||||
eventBus.$emit('queryBack',{name:'order'});
|
||||
}
|
||||
},
|
||||
loginOut(){
|
||||
this.$confirm('确认是否退出当前用户?', '警告', {
|
||||
type: 'warning',
|
||||
confirmButtonText: '退出',
|
||||
confirmButtonClass: 'el-button--danger'
|
||||
}).then(async () => {
|
||||
const res = await this.$API.system.user.logout.post();
|
||||
if(res.code == 200){
|
||||
this.$TOOL.data.clear();
|
||||
this.$socketApi.closeSock(true);
|
||||
this.$router.replace({path: '/login'});
|
||||
}
|
||||
}).catch(() => {
|
||||
//取消退出
|
||||
})
|
||||
},
|
||||
getBack(){
|
||||
this.$router.push({
|
||||
path:'/login'
|
||||
|
||||
@ -55,7 +55,7 @@ export default {
|
||||
.viewUl{
|
||||
margin: 0 50px;
|
||||
.line{
|
||||
padding:0 0 30px 0;
|
||||
padding:0 0 15px 0;
|
||||
color: var(--el-color-white);
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
@ -1,13 +1,63 @@
|
||||
<template>
|
||||
<div>436</div>
|
||||
<el-container>
|
||||
<el-header class="serveTitle">订单号信息查询</el-header>
|
||||
<el-main class="serveMain">
|
||||
<div class="searchMain searchMainNoTop">
|
||||
<div class="searchItem">
|
||||
<div class="name">序列号</div> <el-input type="text" :size="size" placeholder="请输入序列号"></el-input>
|
||||
</div>
|
||||
<div class="searchItem searchBtn">
|
||||
<el-button :size="size" type="primary" icon="el-icon-search" @click="upSearch">查询</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mainTable">
|
||||
<el-table height="100%" ref="table" :data="list.data" :column="list.column" stripe :size="size">
|
||||
<el-table-column type="index" label="序号"></el-table-column>
|
||||
<template v-for="(item,index) in list.column" :key="index">
|
||||
<el-table-column :label="item.label" :prop="item.prop" :width="item.width" show-overflow-tooltip></el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "order"
|
||||
name: "order",
|
||||
data(){
|
||||
return{
|
||||
size:'small',
|
||||
list:{
|
||||
data:[
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
],
|
||||
column:[
|
||||
{label:'创建时间',prop:'created_at',width:160,show: true},
|
||||
{label:'序列号',prop:'number',width:300,show: true},
|
||||
{label:'部件名称',prop:'name',show: true},
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods:{
|
||||
upSearch(){
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
<style scoped lang="scss">
|
||||
|
||||
</style>
|
||||
|
||||
@ -1,15 +1,76 @@
|
||||
<template>
|
||||
<el-main>
|
||||
<el-header class="">部件信息</el-header>
|
||||
<el-container>
|
||||
<el-header class="serveTitle">维保期限信息查询</el-header>
|
||||
<el-main class="serveMain">
|
||||
<div class="searchMain searchMainNoTop">
|
||||
<div class="searchItem">
|
||||
<div class="name">序列号</div> <el-input type="text" :size="size" placeholder="请输入序列号"></el-input>
|
||||
</div>
|
||||
<div class="searchItem searchBtn">
|
||||
<el-button :size="size" type="primary" icon="el-icon-search" @click="upSearch">查询</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mainTable">
|
||||
<el-table height="100%" ref="table" :data="list.data" :column="list.column" stripe :size="size">
|
||||
<el-table-column type="index" label="序号"></el-table-column>
|
||||
<template v-for="(item,index) in list.column" :key="index">
|
||||
<el-table-column :label="item.label" :prop="item.prop" :width="item.width" show-overflow-tooltip></el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "term"
|
||||
name: "term",
|
||||
data(){
|
||||
return{
|
||||
size:'small',
|
||||
list:{
|
||||
data:[
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
],
|
||||
column:[
|
||||
{label:'创建时间',prop:'created_at',width:160,show: true},
|
||||
{label:'序列号',prop:'number',width:300,show: true},
|
||||
{label:'部件名称',prop:'name',show: true},
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods:{
|
||||
upSearch(){
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
<style scoped lang="scss">
|
||||
|
||||
</style>
|
||||
|
||||
@ -1,13 +1,64 @@
|
||||
<template>
|
||||
<div>et</div>
|
||||
<el-container>
|
||||
<el-header class="serveTitle">主控部件信息查询</el-header>
|
||||
<el-main class="serveMain">
|
||||
<div class="searchMain searchMainNoTop">
|
||||
<div class="searchItem">
|
||||
<div class="name">序列号</div> <el-input type="text" :size="size" placeholder="请输入序列号"></el-input>
|
||||
</div>
|
||||
<div class="searchItem searchBtn">
|
||||
<el-button :size="size" type="primary" icon="el-icon-search" @click="upSearch">查询</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mainTable">
|
||||
<el-table height="100%" ref="table" :data="list.data" :column="list.column" stripe :size="size">
|
||||
<el-table-column type="index" label="序号"></el-table-column>
|
||||
<template v-for="(item,index) in list.column" :key="index">
|
||||
<el-table-column :label="item.label" :prop="item.prop" :width="item.width" show-overflow-tooltip></el-table-column>
|
||||
</template>
|
||||
</el-table>
|
||||
</div>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "widget"
|
||||
name: "widget",
|
||||
data(){
|
||||
return{
|
||||
size:'small',
|
||||
list:{
|
||||
data:[
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
{created_at:'2024-11-23 10:34:56',number:"XW1.5-1U-PWR-XW-01",name:"F62.32.C"},
|
||||
],
|
||||
column:[
|
||||
{label:'创建时间',prop:'created_at',width:160,show: true},
|
||||
{label:'序列号',prop:'number',width:300,show: true},
|
||||
{label:'部件名称',prop:'name',show: true},
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
|
||||
},
|
||||
methods:{
|
||||
upSearch(){
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
<style scoped lang="scss">
|
||||
|
||||
</style>
|
||||
|
||||
@ -35,6 +35,7 @@ import commonPage from "@/views/serveView/components/commonPage";
|
||||
import footerPage from "@/views/serveView/components/footerPage";
|
||||
|
||||
import { defineAsyncComponent } from 'vue'
|
||||
import {eventBus} from "@/utils/eventBus";
|
||||
export default {
|
||||
name: "index",
|
||||
components:{
|
||||
@ -72,10 +73,21 @@ export default {
|
||||
],
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
watch:{
|
||||
|
||||
},
|
||||
mounted() {
|
||||
// 获取新消息
|
||||
eventBus.$on('queryBack', this.getQueryBack);
|
||||
},
|
||||
unmounted() {
|
||||
// 获取新消息
|
||||
eventBus.$off('queryBack', this.getQueryBack);
|
||||
},
|
||||
methods:{
|
||||
getQueryBack(res){
|
||||
this.page = res.name;
|
||||
},
|
||||
openPage(item){
|
||||
this.page = item.index
|
||||
},
|
||||
|
||||
13
src/views/service/components/customerRecords.vue
Normal file
13
src/views/service/components/customerRecords.vue
Normal file
@ -0,0 +1,13 @@
|
||||
<template>
|
||||
<div></div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "customerRecords"
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -3,44 +3,56 @@
|
||||
<el-aside class="userAside" width="220px">
|
||||
<el-container>
|
||||
<el-main class="nopadding">
|
||||
<el-scrollbar>
|
||||
<div class="contacts">
|
||||
<div class="contactsTitle">联系人</div>
|
||||
<div class="bodyView">
|
||||
<div class="itemCol" v-for="(item,index) in contactsList" :key="index">
|
||||
<div class="itemCol" :class="{'itemColActive':item.from_user && item.from_user.id === to_user_id}" v-for="(item,index) in contactsList" :key="index" @click="contactsActive(item)">
|
||||
<div class="avatar">
|
||||
<el-avatar :size="36" src="https://fsd/ad/png" fit="contain">
|
||||
<el-avatar :size="36" :src="item.from_user && item.from_user.avatar" fit="contain">
|
||||
<img src="https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png"/>
|
||||
</el-avatar>
|
||||
</div>
|
||||
<div class="viewRight">
|
||||
<div class="title">{{item.name==""?'匿名':item.name}}</div>
|
||||
<div class="msg">{{item.msg}}</div>
|
||||
<div class="title">{{item.from_user && item.from_user.name==""?'匿名':item.from_user && item.from_user.name}}</div>
|
||||
<div class="msg">{{item.to_message}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-scrollbar>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-aside>
|
||||
<el-main class="userMain userMainPadding_0" style="border-top-right-radius: 0;border-bottom-right-radius: 0;padding: 0;">
|
||||
<div class="mainBody">
|
||||
<div class="mainTitle">龙隆</div>
|
||||
<div class="mainTitle">{{contactsInfo.to_user && contactsInfo.to_user.name?contactsInfo.to_user.name:"匿名"}}</div>
|
||||
<div class="mainView">
|
||||
<el-scrollbar ref="scrollbar">
|
||||
<div class="msgList">
|
||||
<div class="msgItem" :class="user_id === item.to_user_id?'msgRightItem':''" v-for="(item,index) in msgList" :key="index">
|
||||
<div class="avatar" v-if="user_id != item.to_user_id">
|
||||
<el-avatar :size="36" :src="item.avatar" fit="contain">
|
||||
<div class="msgItem" :class="user_id != item.to_user_id?'msgRightItem':''" v-for="(item,index) in msgList" :key="index">
|
||||
<div class="avatar" v-if="user_id === item.to_user_id">
|
||||
<el-avatar :size="36" :src="item.from_user.avatar" fit="contain">
|
||||
<img src="https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png"/>
|
||||
</el-avatar>
|
||||
</div>
|
||||
<div class="msgText">
|
||||
<div class="msgTitle">{{item.from_user && item.from_user.name?item.from_user.name:'匿名'}}</div>
|
||||
<div class="textCom">
|
||||
<div class="textCom" v-if="item.send_message_type === 1">
|
||||
<div v-html="item.to_message"></div>
|
||||
</div>
|
||||
<div class="textCom" v-if="item.send_message_type === 2">
|
||||
<div v-for="(em,ind) in item.to_message_list" :key="ind">
|
||||
<span v-if="em.extension === 'xlsx'">
|
||||
文件 ====
|
||||
</span>
|
||||
<span v-else>
|
||||
<el-image style="max-width: 280px;max-height: 240px;" fit="contain" :src="em.file?em.file:em" preview-teleported :preview-src-list="[em.file?em.file:em]"></el-image>
|
||||
</span>
|
||||
</div>
|
||||
<div class="avatar" v-if="user_id === item.to_user_id">
|
||||
</div>
|
||||
</div>
|
||||
<div class="avatar" v-if="user_id != item.to_user_id">
|
||||
<el-avatar :size="36" :src="item.from_user.avatar" fit="contain">
|
||||
<img src="https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png"/>
|
||||
</el-avatar>
|
||||
@ -69,22 +81,22 @@
|
||||
<el-main class="nopadding" style="border-left: 1px solid #f4f4f4;border-top-left-radius: 0;border-bottom-left-radius: 0;">
|
||||
<div class="contactsUserInfo">
|
||||
<div class="contactsTitle">
|
||||
<el-avatar :size="56" src="https://fsd/ad/png" fit="contain">
|
||||
<el-avatar :size="56" :src="contactsInfo.from_user && contactsInfo.from_user.avatar" fit="contain">
|
||||
<img src="https://cube.elemecdn.com/e/fd/0fc7d20532fdaf769a25683617711png.png"/>
|
||||
</el-avatar>
|
||||
</div>
|
||||
<div class="bodyView">
|
||||
<div class="itemCol">
|
||||
<div class="name">昵称</div>
|
||||
<div class="text">龙隆</div>
|
||||
<div class="text">{{contactsInfo.from_user && contactsInfo.from_user.name?contactsInfo.from_user.name:"匿名"}}</div>
|
||||
</div>
|
||||
<div class="itemCol">
|
||||
<div class="name">手机号</div>
|
||||
<div class="text">18998321489</div>
|
||||
<div class="text">{{contactsInfo.from_user && contactsInfo.from_user.mobile}}</div>
|
||||
</div>
|
||||
<div class="itemCol">
|
||||
<div class="name">邮箱</div>
|
||||
<div class="text">263489003@qq.com</div>
|
||||
<div class="text">{{ contactsInfo.from_user && contactsInfo.from_user.email }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -96,59 +108,84 @@
|
||||
|
||||
<script>
|
||||
import {eventBus} from "@/utils/eventBus";
|
||||
|
||||
export default {
|
||||
name: "faq",
|
||||
name: "", // faq
|
||||
data(){
|
||||
return{
|
||||
contactsList:[
|
||||
{name:"龙隆",msg:"嘻嘻"},
|
||||
{name:"骁骁",msg:"测试信息"},
|
||||
{name:"管理员",msg:"怎么能快速挣够一百万"},
|
||||
{name:"",msg:"真机运行不需要检查更新,真机运行时appid固定为'HBuilder'"},
|
||||
{name:"",msg:"真机运行不需要检查更新,真机运行时appid固定为'HBuilder'"},
|
||||
],
|
||||
contactsList:[],
|
||||
contactsInfo:{},
|
||||
msgList:[],
|
||||
user_id:0,
|
||||
to_user_id:0,
|
||||
|
||||
params:{
|
||||
to_user_id:"",
|
||||
to_message:"",
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
mounted() {
|
||||
const userInfo = this.$TOOL.data.get("USER_INFO");
|
||||
this.user_id = userInfo.id;
|
||||
this.params.to_user_id = userInfo.id;
|
||||
|
||||
setTimeout(()=>{
|
||||
this.getContactList();
|
||||
},1000)
|
||||
// 获取新消息
|
||||
eventBus.$on('sockBack', this.getWsResult);
|
||||
},
|
||||
methods:{
|
||||
getWsResult(res){
|
||||
if(res.data && (res.data.type == 36 || res.data.type == 37)){
|
||||
if(res.data && (res.data.type == 36 || res.data.type == 38)){
|
||||
switch(res.data.type) {
|
||||
case 36:
|
||||
res.data.rows.forEach((item)=>{
|
||||
if(item.send_message_type == 2){
|
||||
item.to_message_list = JSON.parse(item.to_message);
|
||||
}
|
||||
})
|
||||
this.msgList = res.data.rows;
|
||||
this.scrollDown();
|
||||
break;
|
||||
case 37:
|
||||
this.params.to_user_id = res.data.user.uid;
|
||||
case 38:
|
||||
this.contactsList = res.data.contact_list;
|
||||
if(res.data.contact_list.length>0){
|
||||
this.to_user_id = res.data.contact_list[0].from_user.id;
|
||||
this.params.to_user_id = res.data.contact_list[0].from_user.id;
|
||||
this.contactsInfo = res.data.contact_list[0];
|
||||
this.getCustomerMsgList();
|
||||
}
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
async getContactList() {
|
||||
await this.$API.customer.contactList.post();
|
||||
},
|
||||
contactsActive(item){
|
||||
this.contactsInfo = item;
|
||||
this.to_user_id = item.from_user.id;
|
||||
this.getCustomerMsgList();
|
||||
},
|
||||
async getCustomerMsgList() {
|
||||
let params = {
|
||||
to_user_id:this.to_user_id
|
||||
}
|
||||
await this.$API.customer.list.post(params);
|
||||
},
|
||||
async sendCustomer() {
|
||||
if(this.params.to_message =="") return
|
||||
const res = await this.$API.customer.send.post(this.params);
|
||||
if(res.code == 200){
|
||||
const userInfo = this.$TOOL.data.get("USER_INFO");
|
||||
this.msgList.push({
|
||||
to_user_id:userInfo.id,
|
||||
to_user_id:-1,
|
||||
send_message_type:1,
|
||||
from_user:{
|
||||
name:userInfo.name,
|
||||
avatar:userInfo.avatar
|
||||
@ -197,7 +234,7 @@ export default {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
.title{
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
font-weight: 500;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
@ -215,6 +252,10 @@ export default {
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.itemColActive{
|
||||
background: #F6FBFF;
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.contactsUserInfo{
|
||||
|
||||
@ -23,26 +23,6 @@
|
||||
<scTable ref="table" :apiObj="list.apiObj" :column="list.column" row-key="id" stripe :size="size" @selection-change="selectionChange">
|
||||
<el-table-column type="selection" align="center" width="40"></el-table-column>
|
||||
<sc-table-column label="序号" align="center" type="index"></sc-table-column>
|
||||
<!-- <template #active_status="scope">-->
|
||||
<!-- <el-switch :size="size" v-model="scope.row.active_status" @change="changeSwitch($event, scope.row)" :loading="scope.row.$switch_status" :active-value="true" :inactive-value="false"></el-switch>-->
|
||||
<!-- </template>-->
|
||||
<!-- <el-table-column label="操作" fixed="right" align="center" width="150">-->
|
||||
<!-- <template #default="scope">-->
|
||||
<!-- <el-dropdown>-->
|
||||
<!-- <el-button class="noBorderBtn" icon="el-icon-more" :size="size"></el-button>-->
|
||||
<!-- <template #dropdown>-->
|
||||
<!-- <el-dropdown-menu>-->
|
||||
<!-- <el-dropdown-item @click="table_show(scope.row, 'see')" icon="sc-icon-See">查看详情</el-dropdown-item>-->
|
||||
<!-- <el-dropdown-item @click="table_edit(scope.row, 'edit')" icon="sc-icon-Edit">编辑公司</el-dropdown-item>-->
|
||||
<!-- <el-dropdown-item icon="sc-icon-AbilityAuthorization" @click="table_empower(scope.row)" divided>功能授权</el-dropdown-item>-->
|
||||
<!-- <el-dropdown-item icon="sc-icon-DataAuthorization">数据授权</el-dropdown-item>-->
|
||||
<!-- <el-dropdown-item icon="sc-icon-UserList" @click="table_user_ist(scope.row)" divided>用户列表</el-dropdown-item>-->
|
||||
<!-- <el-dropdown-item @click="table_del(scope.row, 'delete')" icon="sc-icon-Delete">删除公司</el-dropdown-item>-->
|
||||
<!-- </el-dropdown-menu>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-dropdown>-->
|
||||
<!-- </template>-->
|
||||
<!-- </el-table-column>-->
|
||||
</scTable>
|
||||
</el-main>
|
||||
</el-container>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user