|
|
@@ -1,7 +1,7 @@
|
|
|
<template>
|
|
|
<div class="app-container">
|
|
|
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px">
|
|
|
- <el-form-item label="企微账号" prop="qwUserId">
|
|
|
+ <el-form-item label="企微账号111" prop="qwUserId">
|
|
|
<el-select v-model="queryParams.qwUserId" placeholder="企微账号" size="small" @change="updateQwuser()">
|
|
|
<el-option
|
|
|
v-for="dict in myQwUserList"
|
|
|
@@ -462,6 +462,13 @@
|
|
|
>修改客户称呼</el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
+ <el-table-column label="沟通内容" align="center" width="100px" fixed="right">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button @click="handleCommunication(scope.row)" type="text" size="small">
|
|
|
+ {{ scope.row.hasCommunication ? '查看/编辑' : '添加' }}
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="120px" fixed="right">
|
|
|
<template slot-scope="scope">
|
|
|
<!-- <el-button-->
|
|
|
@@ -987,6 +994,83 @@
|
|
|
<el-button type="primary" @click="submitStatusForm">提 交</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
+
|
|
|
+ <!-- 在页面底部添加弹窗 -->
|
|
|
+ <el-dialog
|
|
|
+ title="沟通内容"
|
|
|
+ :visible.sync="communicationDialog.open"
|
|
|
+ width="800px"
|
|
|
+ append-to-body
|
|
|
+ >
|
|
|
+ <el-form ref="communicationForm" :model="communicationForm" label-width="100px">
|
|
|
+ <el-form-item label="客户名称">
|
|
|
+ <span>{{ communicationDialog.customerName }}</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="聊天时间" prop="chatTime">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="communicationForm.chatTime"
|
|
|
+ type="datetime"
|
|
|
+ placeholder="选择聊天时间"
|
|
|
+ value-format="yyyy-MM-dd HH:mm:ss" style="width: 100%;"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="沟通内容" prop="communicationContent">
|
|
|
+ <el-input
|
|
|
+ v-model="communicationForm.communicationContent"
|
|
|
+ type="textarea"
|
|
|
+ :rows="8"
|
|
|
+ placeholder="请输入沟通内容"
|
|
|
+ maxlength="2000"
|
|
|
+ show-word-limit
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+
|
|
|
+ <!-- 历史沟通记录 -->
|
|
|
+ <div v-if="communicationHistory.length > 0" style="margin-top: 20px;">
|
|
|
+ <div style="font-weight: bold; margin-bottom: 10px; color: #409EFF;">
|
|
|
+ 历史沟通记录(共 {{ communicationHistory.length }} 条):
|
|
|
+ </div>
|
|
|
+ <el-timeline>
|
|
|
+ <el-timeline-item
|
|
|
+ v-for="(item, index) in communicationHistory"
|
|
|
+ :key="item.id || index"
|
|
|
+ :timestamp="formatDateTime(item.chatTime || item.createTime)"
|
|
|
+ placement="top"
|
|
|
+ >
|
|
|
+ <el-card shadow="hover">
|
|
|
+ <div style="white-space: pre-wrap; line-height: 1.6;">{{ item.communicationContent }}</div>
|
|
|
+ <div style="color: #999; font-size: 12px; margin-top: 8px; display: flex; justify-content: space-between; align-items: center;">
|
|
|
+ <div>
|
|
|
+ <span>类型:{{ item.contentType === 1 ? '手动添加' : '看课记录同步' }}</span>
|
|
|
+ <span v-if="item.updateBy" style="margin-left: 10px;">更新人:{{ item.updateBy }}</span>
|
|
|
+ </div>
|
|
|
+ <div v-if="item.contentType === 1">
|
|
|
+ <el-button
|
|
|
+ size="mini"
|
|
|
+ type="primary"
|
|
|
+ icon="el-icon-edit"
|
|
|
+ @click="handleEditCommunication(item)"
|
|
|
+ >编辑</el-button>
|
|
|
+ <el-button
|
|
|
+ size="mini"
|
|
|
+ type="danger"
|
|
|
+ icon="el-icon-delete"
|
|
|
+ @click="handleDeleteCommunication(item)"
|
|
|
+ >删除</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-card>
|
|
|
+ </el-timeline-item>
|
|
|
+ </el-timeline>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button @click="communicationDialog.open = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="submitCommunication" :loading="communicationLoading">确 定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
@@ -1008,7 +1092,11 @@ import {
|
|
|
setCustomerCourseSop,
|
|
|
getCustomerCourseSop,
|
|
|
setCustomerCourseSopList,
|
|
|
- syncMyExternalContact, unBindUserId, updateExternalContactCall,exportMyExternalContact,updateExternalContactStatus,getWatchLogList
|
|
|
+ syncMyExternalContact, unBindUserId, updateExternalContactCall,exportMyExternalContact,updateExternalContactStatus,getWatchLogList,
|
|
|
+ getCommunicationList,
|
|
|
+ saveCommunication,
|
|
|
+ updateCommunication,
|
|
|
+ deleteCommunication
|
|
|
} from '@/api/qw/externalContact'
|
|
|
import info from "@/views/qw/externalContact/info.vue";
|
|
|
import {getMyQwUserList, getMyQwCompanyList, handleInputAuthAppKey, updateUser} from "@/api/qw/user";
|
|
|
@@ -1031,6 +1119,18 @@ export default {
|
|
|
components:{PaginationMore, mycustomer,customerDetails,SopDialog,selectUser,info,Collection,userDetails},
|
|
|
data() {
|
|
|
return {
|
|
|
+ // 沟通内容相关
|
|
|
+ communicationDialog: {
|
|
|
+ open: false,
|
|
|
+ customerName: '',
|
|
|
+ externalContactId: null
|
|
|
+ },
|
|
|
+ communicationForm: {
|
|
|
+ id: null,
|
|
|
+ communicationContent: ''
|
|
|
+ },
|
|
|
+ communicationHistory: [],
|
|
|
+ communicationLoading: false,
|
|
|
member:{
|
|
|
title:"客户详情",
|
|
|
open:false,
|
|
|
@@ -2424,6 +2524,186 @@ export default {
|
|
|
})
|
|
|
|
|
|
},
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 打开沟通内容弹窗
|
|
|
+ */
|
|
|
+ handleCommunication(row) {
|
|
|
+ this.communicationDialog.externalContactId = row.id;
|
|
|
+ this.communicationDialog.customerName = row.name;
|
|
|
+ this.resetCommunicationForm();
|
|
|
+ this.communicationHistory = [];
|
|
|
+ this.communicationDialog.open = true;
|
|
|
+
|
|
|
+ // 查询历史沟通记录
|
|
|
+ this.loadCommunicationData(row.id);
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 重置沟通表单
|
|
|
+ */
|
|
|
+ resetCommunicationForm() {
|
|
|
+ this.communicationForm = {
|
|
|
+ id: null,
|
|
|
+ communicationContent: '',
|
|
|
+ chatTime: this.formatDateTime(new Date())
|
|
|
+ };
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 加载沟通内容数据
|
|
|
+ */
|
|
|
+ loadCommunicationData(externalContactId) {
|
|
|
+ // 查询所有历史沟通记录(按时间倒序)
|
|
|
+ getCommunicationList(externalContactId).then(response => {
|
|
|
+ if (response.data && Array.isArray(response.data)) {
|
|
|
+ // 按聊天时间倒序排列
|
|
|
+ this.communicationHistory = response.data.sort((a, b) => {
|
|
|
+ const timeA = new Date(a.chatTime || a.createTime);
|
|
|
+ const timeB = new Date(b.chatTime || b.createTime);
|
|
|
+ return timeB - timeA;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.communicationHistory = [];
|
|
|
+ }
|
|
|
+ }).catch(error => {
|
|
|
+ console.error('查询沟通历史失败:', error);
|
|
|
+ this.communicationHistory = [];
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 格式化日期时间
|
|
|
+ */
|
|
|
+ formatDateTime(dateTime) {
|
|
|
+ if (!dateTime) return '';
|
|
|
+ const date = new Date(dateTime);
|
|
|
+ const year = date.getFullYear();
|
|
|
+ const month = String(date.getMonth() + 1).padStart(2, '0');
|
|
|
+ const day = String(date.getDate()).padStart(2, '0');
|
|
|
+ const hours = String(date.getHours()).padStart(2, '0');
|
|
|
+ const minutes = String(date.getMinutes()).padStart(2, '0');
|
|
|
+ const seconds = String(date.getSeconds()).padStart(2, '0');
|
|
|
+ return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 编辑沟通内容
|
|
|
+ */
|
|
|
+ handleEditCommunication(item) {
|
|
|
+ console.log('编辑前的数据:', item);
|
|
|
+
|
|
|
+ this.communicationForm = {
|
|
|
+ id: item.id,
|
|
|
+ communicationContent: item.communicationContent,
|
|
|
+ chatTime: item.chatTime ? this.formatDateTime(new Date(item.chatTime)) : this.formatDateTime(new Date())
|
|
|
+ };
|
|
|
+
|
|
|
+ console.log('表单数据:', this.communicationForm);
|
|
|
+
|
|
|
+ // 滚动到表单顶部
|
|
|
+ this.$nextTick(() => {
|
|
|
+ const dialog = document.querySelector('.el-dialog__body');
|
|
|
+ if (dialog) {
|
|
|
+ dialog.scrollTop = 0;
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ this.$message.info('已加载编辑内容,修改后点击确定保存');
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 删除沟通内容
|
|
|
+ */
|
|
|
+ handleDeleteCommunication(item) {
|
|
|
+ this.$confirm('确认删除这条沟通记录吗?', '警告', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ // 后端接收的是 Long[] ids,所以传递数组
|
|
|
+ return deleteCommunication(item.id);
|
|
|
+ }).then(() => {
|
|
|
+ this.$message.success('删除成功');
|
|
|
+ // 重新加载历史记录
|
|
|
+ this.loadCommunicationData(this.communicationDialog.externalContactId);
|
|
|
+ this.getList();
|
|
|
+ }).catch(error => {
|
|
|
+ if (error !== 'cancel') {
|
|
|
+ console.error('删除失败:', error);
|
|
|
+ this.$message.error('删除失败');
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 提交沟通内容
|
|
|
+ */
|
|
|
+ submitCommunication() {
|
|
|
+ if (!this.communicationForm.communicationContent || this.communicationForm.communicationContent.trim() === '') {
|
|
|
+ return this.$message.error('请输入沟通内容');
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!this.communicationForm.chatTime) {
|
|
|
+ return this.$message.error('请选择聊天时间');
|
|
|
+ }
|
|
|
+
|
|
|
+ this.communicationLoading = true;
|
|
|
+
|
|
|
+ const data = {
|
|
|
+ externalContactId: this.communicationDialog.externalContactId,
|
|
|
+ qwUserId: this.queryParams.qwUserId,
|
|
|
+ contentType: 1, // 1-手动添加
|
|
|
+ communicationContent: this.communicationForm.communicationContent,
|
|
|
+ chatTime: this.communicationForm.chatTime
|
|
|
+ };
|
|
|
+
|
|
|
+ // 判断是新增还是编辑
|
|
|
+ const isEdit = !!this.communicationForm.id;
|
|
|
+
|
|
|
+ if (isEdit) {
|
|
|
+ // 编辑模式:传递ID,使用PUT方法
|
|
|
+ data.id = this.communicationForm.id;
|
|
|
+ console.log('编辑模式,记录ID:', this.communicationForm.id);
|
|
|
+
|
|
|
+ updateCommunication(data)
|
|
|
+ .then(response => {
|
|
|
+ this.$message.success('修改成功');
|
|
|
+ this.resetCommunicationForm();
|
|
|
+ // 重新加载历史记录
|
|
|
+ this.loadCommunicationData(this.communicationDialog.externalContactId);
|
|
|
+ this.getList();
|
|
|
+ })
|
|
|
+ .catch(error => {
|
|
|
+ console.error('修改失败:', error);
|
|
|
+ this.$message.error('修改失败');
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ this.communicationLoading = false;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ // 新增模式:不传递ID,使用POST方法
|
|
|
+ console.log('新增模式');
|
|
|
+
|
|
|
+ saveCommunication(data)
|
|
|
+ .then(response => {
|
|
|
+ this.$message.success('添加成功');
|
|
|
+ this.resetCommunicationForm();
|
|
|
+ // 重新加载历史记录
|
|
|
+ this.loadCommunicationData(this.communicationDialog.externalContactId);
|
|
|
+ this.getList();
|
|
|
+ })
|
|
|
+ .catch(error => {
|
|
|
+ console.error('添加失败:', error);
|
|
|
+ this.$message.error('添加失败');
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ this.communicationLoading = false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
}
|
|
|
};
|
|
|
</script>
|