Skip to content

foreign / customer-service

Go to a project
Commit 168aeeff by panjiangyi
Options

会话详情

parent f3053e19
Inline Side-by-side
Showing with 403 additions and 33 deletions
chat.vue
...@@ -7,11 +7,12 @@ ...@@ -7,11 +7,12 @@
</div> </div>
<div class="chat-panel h-100 pos-rel" v-if="!userMode"> <div class="chat-panel h-100 pos-rel" v-if="!userMode">
<el-tabs class="chat-panel-tabs h-100" v-model="currentTab"> <el-tabs class="chat-panel-tabs h-100" v-model="currentTab">
<el-tab-pane label="数据" name="one" <el-tab-pane label="数据" name="one" class="h-100">
>model的数据，可配置。 <ModelDetail
<div class="detal-btns"> :model_name="currentChat.business_data.model_name"
<el-button @click="goTodetail">查看详情</el-button> :id="currentChat.business_data.obj_id"
</div> :name="currentChat.business_data.detail_name"
/>
</el-tab-pane> </el-tab-pane>
<el-tab-pane <el-tab-pane
:label="`成员${chatMembers.length}人`" :label="`成员${chatMembers.length}人`"
...@@ -23,7 +24,10 @@ ...@@ -23,7 +24,10 @@
>工作流</el-tab-pane >工作流</el-tab-pane
> >
<el-tab-pane label="备注" name="four"> <el-tab-pane label="备注" name="four">
<remarkList :modelName="currentChat.business_data.model_name" :associateId="currentChat.business_data.obj_id" /> <remarkList
:modelName="currentChat.business_data.model_name"
:associateId="currentChat.business_data.obj_id"
/>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="回复" name="five"> <el-tab-pane label="回复" name="five">
<MsgShortCut <MsgShortCut
...@@ -52,6 +56,7 @@ import ChatMembers from "./components/chat-members.vue"; ...@@ -52,6 +56,7 @@ import ChatMembers from "./components/chat-members.vue";
import ChatRoom from "./components/chat-room.vue"; import ChatRoom from "./components/chat-room.vue";
import ChatTitle from "./components/chat-title.vue"; import ChatTitle from "./components/chat-title.vue";
import MessageList from "./components/message-list.vue"; import MessageList from "./components/message-list.vue";
import ModelDetail from "./components/model-detail.vue";
import MsgShortCut from "./components/msg-shortcut.vue"; import MsgShortCut from "./components/msg-shortcut.vue";
import buttonThrottle from "./utils/button-throttle"; import buttonThrottle from "./utils/button-throttle";
...@@ -67,12 +72,10 @@ import { ChatStore, chatStore } from "@/customer-service/store/model"; ...@@ -67,12 +72,10 @@ import { ChatStore, chatStore } from "@/customer-service/store/model";
ChatMembers, ChatMembers,
remarkList, remarkList,
ChatTitle, ChatTitle,
ModelDetail,
}, },
}) })
export default class Chat extends Vue { export default class Chat extends Vue {
@chatStore.Mutation(ChatStore.MUTATION_HIDE_CHAT)
private readonly hideChat: ChatStore.MUTATION_HIDE_CHAT;
@chatStore.Getter(ChatStore.GETTER_CURRENT_CHAT_PRESENT_MEMBERS) @chatStore.Getter(ChatStore.GETTER_CURRENT_CHAT_PRESENT_MEMBERS)
private readonly chatMembers!: ChatStore.GETTER_CURRENT_CHAT_PRESENT_MEMBERS; private readonly chatMembers!: ChatStore.GETTER_CURRENT_CHAT_PRESENT_MEMBERS;
...@@ -119,14 +122,6 @@ export default class Chat extends Vue { ...@@ -119,14 +122,6 @@ export default class Chat extends Vue {
await this._addMember(users); await this._addMember(users);
done(); done();
} }
private goTodetail() {
const { model_name, obj_id } = this.currentChat.business_data;
this.$router.push(
`/${this.$route.params.project}/${this.$route.params.entrance}/detail/${model_name}/key/${obj_id}`
);
this.hideChat();
}
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
...@@ -177,14 +172,7 @@ export default class Chat extends Vue { ...@@ -177,14 +172,7 @@ export default class Chat extends Vue {
} }
.chat-panel-tabs { .chat-panel-tabs {
/deep/ .el-tabs__content { /deep/ .el-tabs__content {
height:calc(100% - 70px); height: calc(100% - 54px);
} }
} }
.detal-btns {
position: absolute;
bottom:0;
right:0;
left:0;
text-align: center;
}
</style> </style>
components/model-detail.vue 0 → 100644
<template>
<div class="h-100 pos-rel">
<el-scrollbar class="h-100">
<div class="data-row" v-for="item in detailData" :key="item.label">
<span class="data-key">{{ item.label }}</span
>: <span class="data-value">{{ item.template }}</span>
</div>
</el-scrollbar>
<div class="detal-btns">
<el-button @click="goTodetail">查看详情</el-button>
</div>
</div>
</template>
<script lang="ts">
import { DetailTypes } from "uniplat-sdk";
import { Component, Prop, Vue } from "vue-property-decorator";
import { ChatStore, chatStore } from "../store/model";
import Chat from "../xim";
@Component({ components: {} })
export default class ChatModelDetail extends Vue {
@chatStore.Mutation(ChatStore.MUTATION_HIDE_CHAT)
private readonly hideChat: ChatStore.MUTATION_HIDE_CHAT;
@Prop({
type: String,
required: true,
})
private readonly model_name!: string;
@Prop({
type: String,
required: true,
})
private readonly id!: string;
@Prop({
type: String,
default: null,
})
private readonly name!: string;
private detailData: DetailTypes.getDetailRequestResult["meta"]["header"]["field_groups"];
private mock = [
{
fields: [
{
property: "name",
label: "供货商名称",
ext_properties: {},
full_property: "name",
type: "text",
width: 0,
treeMulti: false,
},
],
template: "亲亲小保",
label: "供货商名称",
label_width: 120,
span: 24,
align: "left",
canSort: true,
fixed: "",
autoHeight: false,
visible: true,
optional: true,
catalog: "",
description: "",
tagGroups: [],
},
{
fields: [
{
property: "address",
label: "地址",
ext_properties: {},
full_property: "address",
type: "text",
width: 0,
treeMulti: false,
},
],
template: "锋创科技园18号",
label: "供货商地址",
label_width: 120,
span: 24,
align: "left",
canSort: true,
fixed: "",
autoHeight: false,
visible: true,
optional: true,
catalog: "",
description: "",
tagGroups: [],
},
{
fields: [
{
property: "contact",
label: "联系人",
ext_properties: {},
full_property: "contact",
type: "text",
width: 0,
treeMulti: false,
},
],
template: "李瑞明",
label: "联系人",
label_width: 120,
span: 24,
align: "left",
canSort: true,
fixed: "",
autoHeight: false,
visible: true,
optional: true,
catalog: "",
description: "",
tagGroups: [],
},
{
fields: [
{
property: "phone",
label: "手机号",
ext_properties: {},
full_property: "phone",
type: "text",
width: 0,
treeMulti: false,
},
],
template: "13811301234",
label: "手机号",
label_width: 120,
span: 24,
align: "left",
canSort: true,
fixed: "",
autoHeight: false,
visible: true,
optional: true,
catalog: "",
description: "",
tagGroups: [],
},
{
fields: [
{
property: "wechat_id",
label: "微信号",
ext_properties: {},
full_property: "wechat_id",
type: "text",
width: 0,
treeMulti: false,
},
],
template: "123456",
label: "微信号",
label_width: 120,
span: 24,
align: "left",
canSort: true,
fixed: "",
autoHeight: false,
visible: true,
optional: true,
catalog: "",
description: "",
tagGroups: [],
},
{
fields: [
{
property: "email",
label: "电子邮箱",
ext_properties: {},
full_property: "email",
type: "text",
width: 0,
treeMulti: false,
},
],
template: "123@123.com",
label: "电子邮箱",
label_width: 120,
span: 24,
align: "left",
canSort: true,
fixed: "",
autoHeight: false,
visible: true,
optional: true,
catalog: "",
description: "",
tagGroups: [],
},
{
fields: [
{
property: "region",
label: "发货区域",
ext_properties: {},
full_property: "region",
type: "text",
width: 0,
treeMulti: false,
},
],
template: "北京",
label: "发货区域",
label_width: 120,
span: 24,
align: "left",
canSort: true,
fixed: "",
autoHeight: false,
visible: true,
optional: true,
catalog: "",
description: "",
tagGroups: [],
},
{
fields: [
{
property: "invoice_notes",
label: "开票说明",
ext_properties: {},
full_property: "invoice_notes",
type: "text",
width: 0,
treeMulti: false,
},
],
template: "测试发票",
label: "开票说明",
label_width: 120,
span: 24,
align: "left",
canSort: true,
fixed: "",
autoHeight: false,
visible: true,
optional: true,
catalog: "",
description: "",
tagGroups: [],
},
{
fields: [
{
property: "can_invoice",
label: "是否可以开票",
ext_properties: {},
full_property: "can_invoice",
type: "boolean",
width: 0,
treeMulti: false,
},
],
template: "是",
label: "是否可以开票",
label_width: 120,
span: 24,
align: "left",
canSort: true,
fixed: "",
autoHeight: false,
visible: true,
optional: true,
catalog: "",
description: "",
tagGroups: [],
},
{
fields: [
{
property: "cooperation_status",
label: "是否正在合作",
ext_properties: {
mapping: {
name: "cooperation_status_mapping",
model_name: "CommodityVendor",
is_lazy: false,
mapping_values: [
{
key: "true",
value: "合作中",
},
{
key: "false",
value: "停止合作",
},
],
},
},
full_property: "cooperation_status",
type: "mapping",
width: 0,
treeMulti: false,
},
],
template: "合作中",
label: "是否正在合作",
label_width: 120,
span: 24,
align: "left",
canSort: false,
fixed: "",
autoHeight: false,
visible: true,
optional: true,
catalog: "",
description: "",
tagGroups: [],
},
{
fields: [
{
property: "commodity_count",
label: "commodity_count",
ext_properties: {},
full_property: "id#commodity_count_joint.commodity_count",
type: "number",
width: 0,
treeMulti: false,
},
],
template: "2",
label: "合作品种",
label_width: 120,
span: 24,
align: "left",
canSort: false,
fixed: "",
autoHeight: false,
visible: true,
optional: true,
catalog: "",
description: "",
tagGroups: [],
},
];
public async created() {
const data = await Chat.getSdk()
.model(this.model_name)
.detail(this.id, this.name)
.query();
this.detailData = data.meta.header.field_groups;
}
private goTodetail() {
this.$router.push(
`/${this.$route.params.project}/${this.$route.params.entrance}/detail/${this.model_name}/key/${this.id}`
);
this.hideChat();
}
}
</script>
<style lang="less" scoped>
.data-row {
color: #666;
font-size: 14px;
padding: 10px 20px;
}
.data-key {
width: 5em;
}
.detal-btns {
position: absolute;
bottom: 20px;
right: 0;
left: 0;
text-align: center;
}
</style>
store/index.ts
...@@ -21,14 +21,14 @@ const sdk = Chat.getSdk; ...@@ -21,14 +21,14 @@ const sdk = Chat.getSdk;
const UniplatChatModelName = "UniplatChat"; const UniplatChatModelName = "UniplatChat";
const model = () => sdk().model(UniplatChatModelName); const model = () => sdk().model(UniplatChatModelName);
const orgId = Chat.getOrgId; const orgId = Chat.getOrgId;
const getMyinfo = (function () { // const getMyinfo = (function () {
let data: Index.getUserInfo; // let data: Index.getUserInfo;
return async () => { // return async () => {
if (data != null) return data; // if (data != null) return data;
data = await sdk().getUserInfo(); // data = await sdk().getUserInfo();
return data; // return data;
}; // };
})(); // })();
function uniqueMessages( function uniqueMessages(
messages: NonNullable<ChatStore.STATE_CHAT_MSG_HISTORY> messages: NonNullable<ChatStore.STATE_CHAT_MSG_HISTORY>
) { ) {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment