优化客户端
This commit is contained in:
龙运模
parent
eb28b64c44
commit
c5730240ac
@ -66,4 +66,46 @@ export default {
|
||||
}
|
||||
},
|
||||
|
||||
orderSubmit: {
|
||||
url: `${config.API_URL}/customer.work.order.submit`,
|
||||
name: "提交问题工单",
|
||||
post: async function(data){
|
||||
return await http.post(this.url, data);
|
||||
}
|
||||
},
|
||||
serviceTypeList:{
|
||||
url: `${config.API_URL}/customer.service.type.list`,
|
||||
name: "问题工单常量类型",
|
||||
post: async function(data){
|
||||
return await http.post(this.url, data);
|
||||
}
|
||||
},
|
||||
replyOrder:{
|
||||
url: `${config.API_URL}/customer.work.order.reply`,
|
||||
name: "回复工单",
|
||||
post: async function(data){
|
||||
return await http.post(this.url, data);
|
||||
}
|
||||
},
|
||||
orderList:{
|
||||
url: `${config.API_URL}/customer.work.order.list`,
|
||||
name: "问题工单列表",
|
||||
post: async function(data){
|
||||
return await http.post(this.url, data);
|
||||
}
|
||||
},
|
||||
orderDelete:{
|
||||
url: `${config.API_URL}/customer.work.order.delete`,
|
||||
name: "删除问题工单",
|
||||
post: async function(data){
|
||||
return await http.post(this.url, data);
|
||||
}
|
||||
},
|
||||
orderMyList:{
|
||||
url: `${config.API_URL}/customer.work.order.my.list`,
|
||||
name: "我的工单",
|
||||
post: async function(data){
|
||||
return await http.post(this.url, data);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
13
src/assets/icons/Chat.vue
Normal file
13
src/assets/icons/Chat.vue
Normal file
@ -0,0 +1,13 @@
|
||||
<template>
|
||||
<svg t="1732179258365" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7241" width="200" height="200"><path d="M707.456 391.872C675.136 246.976 530.496 137.6 357.12 137.6 159.936 137.6 0 278.976 0 453.376c0 84.096 37.184 160.448 97.792 216.96 18.688 17.664 19.52 47.168 1.792 65.792l-28.672 30.144s271.36 2.944 286.272 2.944c69.12 0 133.632-17.408 188.288-47.488 101.376-55.68 168.832-155.072 168.832-268.416-0.064-20.992-2.368-41.536-6.848-61.44zM185.984 509.44c-31.04 0-56.064-25.024-56.064-56.064 0-30.976 25.024-56.064 56.064-56.064 30.976 0 56.064 25.088 56.064 56.064 0 31.04-25.088 56.064-56.064 56.064z m171.136 0c-30.976 0-56.064-25.024-56.064-56.064 0-30.976 25.088-56.064 56.064-56.064s56.064 25.088 56.064 56.064c0 31.04-25.088 56.064-56.064 56.064z m173.184-0.064c-0.704 0.064-1.344 0.064-2.048 0.064-30.976 0-56.064-25.024-56.064-56.064 0-30.976 25.088-56.064 56.064-56.064 28.48 0 51.968 21.184 55.552 48.64 0.32 2.496 0.512 4.928 0.512 7.488a55.776 55.776 0 0 1-54.016 55.936z" fill="" p-id="7242"></path><path d="M956.096 809.216l19.584 20.544h-159.296c-1.92 0-3.84 0.128-5.76 0.32-9.856 1.088-19.84 1.728-30.016 1.728-85.184 0-160.192-38.72-203.584-97.344 101.376-55.68 168.832-155.072 168.832-268.416 0-21.056-2.368-41.6-6.848-61.504 13.504-2.112 27.456-3.136 41.6-3.136 134.4 0 243.328 96.32 243.328 215.168 0 57.28-25.344 109.312-66.624 147.84-12.672 11.968-13.184 32.064-1.216 44.8z" fill="" p-id="7243"></path></svg>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "Chat"
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -48,6 +48,7 @@ export { default as Right } from './Right.vue'
|
||||
export { default as Customer } from './Customer.vue'
|
||||
export { default as Region } from './Region.vue'
|
||||
export { default as SpareParts } from './SpareParts.vue'
|
||||
export { default as Chat } from './Chat.vue'
|
||||
|
||||
export { default as File7z } from './file/7z.vue'
|
||||
export { default as FileBmp } from './file/Bmp.vue'
|
||||
|
||||
@ -95,6 +95,20 @@ export default {
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
{name:'维保工单'},
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
@ -29,29 +29,31 @@
|
||||
<div class="panel-item">
|
||||
<el-icon><sc-icon-See /></el-icon>
|
||||
</div>
|
||||
<div class="panel-item">
|
||||
<div class="panel-item" v-if="!userId">
|
||||
<el-icon><sc-icon-User /></el-icon>
|
||||
</div>
|
||||
<div class="panel-item" v-if="userId">
|
||||
<el-dropdown trigger="click" @command="handleUser" placement="bottom-start">
|
||||
<span class="el-dropdown-link">
|
||||
<el-icon><sc-icon-User /></el-icon>
|
||||
<!-- <el-icon class="el-icon--right">-->
|
||||
<!-- <el-icon-ArrowDown />-->
|
||||
<!-- </el-icon>-->
|
||||
</span>
|
||||
<div class="user-avatar el-dropdown-link">
|
||||
<el-avatar :size="22" shape="circle" :src="this.$store.state.global.login_avatar"><span class="userName">{{ userNameF }}</span></el-avatar>
|
||||
<label class="userName">{{ userName?userName:"匿名" }}</label>
|
||||
<el-icon class="el-icon--right"><el-icon-arrow-down /></el-icon>
|
||||
</div>
|
||||
<template #dropdown>
|
||||
<div class="userView" style="width: 280px">
|
||||
<div class="headerView">
|
||||
<div class="headerView" v-if="userName">
|
||||
<el-icon class="icon" size="18px"><sc-icon-User/></el-icon>
|
||||
<span class="name">龙隆</span>
|
||||
<span class="name">{{userName}}</span>
|
||||
<span class="solid"></span>
|
||||
<span class="account">longlong</span>
|
||||
<span class="account">{{userInfo.login_name}}</span>
|
||||
</div>
|
||||
<div class="itemBox">
|
||||
<div class="name">邮箱</div>
|
||||
<div class="text">1724894114@qq.com</div>
|
||||
<div class="text">{{userInfo.email}}</div>
|
||||
</div>
|
||||
<div class="itemBox">
|
||||
<div class="name">手机号</div>
|
||||
<div class="text">18820802884</div>
|
||||
<div class="text">{{userInfo.mobile}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<el-dropdown-menu>
|
||||
@ -81,7 +83,27 @@ export default {
|
||||
},
|
||||
data(){
|
||||
return{
|
||||
userName: "",
|
||||
userNameF: "",
|
||||
userInfo:{},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
const userInfo = this.$TOOL.data.get("USER_INFO");
|
||||
if(userInfo){
|
||||
this.$store.commit("SET_LOGIN_AVATAR", userInfo.avatar);
|
||||
this.$store.commit("SET_LOGIN_NAME", userInfo.name);
|
||||
|
||||
this.userInfo = userInfo;
|
||||
this.userName = this.$store.state.global.login_name;
|
||||
if(userInfo.company_info){
|
||||
this.companyName = userInfo.company_info.name;
|
||||
}
|
||||
if(this.userName!=''){
|
||||
this.userNameF = this.userName.substring(0, 1);
|
||||
}
|
||||
this.avatar = this.$store.state.global.login_avatar;
|
||||
this.userId = userInfo.id;
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
@ -160,6 +182,12 @@ export default {
|
||||
border-left: 0;
|
||||
}
|
||||
}
|
||||
.userName{
|
||||
display: inline-block;
|
||||
margin-left: 5px;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.headerView{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
@ -15,8 +15,8 @@
|
||||
</div>
|
||||
<div class="viewRight">
|
||||
<div class="title">{{item.from_user && item.from_user.name==""?'匿名':item.from_user && item.from_user.name}}</div>
|
||||
<div class="msg" v-if="item.to_message.send_message_type === 1">{{item.to_message.to_message}}</div>
|
||||
<div class="msg" v-if="item.to_message.send_message_type === 2">
|
||||
<div class="msg" v-if="item.to_message && item.to_message.send_message_type === 1">{{item.to_message.to_message}}</div>
|
||||
<div class="msg" v-if="item.to_message && item.to_message.send_message_type === 2">
|
||||
{{item.to_message_list[0].client_file_name?item.to_message_list[0].client_file_name:'未命名'}}
|
||||
</div>
|
||||
</div>
|
||||
@ -166,6 +166,7 @@ export default {
|
||||
show:false
|
||||
},
|
||||
mesList:true,
|
||||
user_chat_params:{},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
@ -183,6 +184,12 @@ export default {
|
||||
|
||||
this.emojiJson = emoji.data.split(',');
|
||||
document.addEventListener('click', this.closeDropdown);
|
||||
|
||||
// 获取路由参数
|
||||
let user_chat_info = this.$TOOL.data.get("CHAT_PARAMS");
|
||||
if(user_chat_info){
|
||||
this.user_chat_params = JSON.parse(user_chat_info);
|
||||
}
|
||||
},
|
||||
unmounted() {
|
||||
document.removeEventListener('click', this.closeDropdown);
|
||||
@ -242,17 +249,37 @@ export default {
|
||||
case 38:
|
||||
if(res.data.contact_list && res.data.contact_list.length>0){
|
||||
res.data.contact_list.forEach(item=>{
|
||||
if(item.to_message.send_message_type === 2){
|
||||
if(item.to_message && item.to_message.send_message_type === 2){
|
||||
item.to_message_list = JSON.parse(item.to_message.to_message);
|
||||
}
|
||||
})
|
||||
}
|
||||
this.contactsList = res.data.contact_list;
|
||||
if(res.data.contact_list.length>0){
|
||||
// 判断当前联系人列表是否存在了这个人不存在就插入进去
|
||||
if(this.user_chat_params && this.user_chat_params.id){
|
||||
let ids = this.contactsList.map(em=>em.from_user_id);
|
||||
if(ids.indexOf(this.user_chat_params.id)===-1){
|
||||
this.contactsList.unshift({
|
||||
created_at:this.$TOOL.dateFormat(new Date()),
|
||||
from_user:{
|
||||
avatar:this.user_chat_params.avatar,
|
||||
email:this.user_chat_params.email,
|
||||
id:this.user_chat_params.id,
|
||||
mobile:this.user_chat_params.mobile,
|
||||
name:this.user_chat_params.name
|
||||
},
|
||||
from_user_id:this.user_chat_params.id,
|
||||
id:0,
|
||||
to_message:{},
|
||||
to_user_id:""
|
||||
})
|
||||
}
|
||||
}
|
||||
if(this.contactsList.length>0){
|
||||
if(this.mesList){
|
||||
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.to_user_id = this.contactsList[0].from_user.id;
|
||||
this.params.to_user_id = this.contactsList[0].from_user.id;
|
||||
this.contactsInfo = this.contactsList[0];
|
||||
|
||||
this.getCustomerMsgList();
|
||||
this.mesList = false;
|
||||
@ -330,13 +357,18 @@ export default {
|
||||
this.params.to_message = text + item;
|
||||
},
|
||||
closeDropdown(event){
|
||||
const dropdownElement = this.$refs.dropdownDown.$el;
|
||||
if (!dropdownElement.contains(event.target)) {
|
||||
this.$refs.dropdownDown.handleClose();
|
||||
if(this.$refs.dropdownDown && this.$refs.dropdownDown.$el){
|
||||
const dropdownElement = this.$refs.dropdownDown.$el;
|
||||
if (!dropdownElement.contains(event.target)) {
|
||||
this.$refs.dropdownDown.handleClose();
|
||||
}
|
||||
}
|
||||
|
||||
setTimeout(()=>{
|
||||
this.$nextTick(()=>{
|
||||
this.$refs.messageInput.focus();
|
||||
if(this.$refs.messageInput){
|
||||
this.$refs.messageInput.focus();
|
||||
}
|
||||
})
|
||||
},10)
|
||||
},
|
||||
|
||||
@ -75,8 +75,11 @@
|
||||
</span>
|
||||
</template>
|
||||
<template #is_online="scope">
|
||||
<span class="online" v-if="scope.row.online_info" :style="{color:`var(--el-order-color-2)`}"><span class="round" :style="{background:`var(--el-order-color-2)`}"></span> 在线</span>
|
||||
<span class="online" v-else :style="{color:`var(--el-order-color-0)`}"><span class="round" :style="{background:`var(--el-order-color-0)`}"></span> 离线</span>
|
||||
<div class="userOnline">
|
||||
<span class="online" v-if="scope.row.online_info" :style="{color:`var(--el-order-color-2)`}"><span class="round" :style="{background:`var(--el-order-color-2)`}"></span> 在线</span>
|
||||
<span class="online" v-else :style="{color:`var(--el-order-color-0)`}"><span class="round" :style="{background:`var(--el-order-color-0)`}"></span> 离线</span>
|
||||
<span class="chat" @click="chatLink(scope.row)" v-if="scope.row.online_info"><el-icon size="16"><sc-icon-Chat/></el-icon> </span>
|
||||
</div>
|
||||
</template>
|
||||
<template #user_type="scope">
|
||||
<span v-for="(item,index) in userTypeList" :key="index">
|
||||
@ -444,16 +447,30 @@
|
||||
this.getGroup();
|
||||
}
|
||||
this.$refs.table.refresh();
|
||||
},
|
||||
chatLink(item){
|
||||
this.$router.replace({
|
||||
name:"infoQuery",
|
||||
})
|
||||
this.$TOOL.data.set('CHAT_PARAMS',JSON.stringify(item));
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.userOnline{
|
||||
display: flex;align-items: center;
|
||||
}
|
||||
.online{
|
||||
display: flex;align-items: center;
|
||||
.round{width: 10px;height: 10px;display: inline-block;border-radius: 50%;margin-right: 4px;}
|
||||
}
|
||||
.chat{
|
||||
display: flex;align-items: center;margin-left: 6px;
|
||||
color: var(--el-color-success);
|
||||
cursor: pointer;
|
||||
}
|
||||
.userTree{
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user