|
|
@@ -1,41 +1,79 @@
|
|
|
<template>
|
|
|
- <div class="normal-card" style="padding-right:0">
|
|
|
- <el-descriptions>
|
|
|
- <div slot="title">跟进记录 <i @click="sortFun" :class="param.content.sort[0].reversed == 1?'fa fa-sort-amount-asc':'fa fa-sort-amount-desc'"></i></div>
|
|
|
- </el-descriptions>
|
|
|
+ <div>
|
|
|
<div class="select">
|
|
|
<span class="demonstration">日期范围:</span>
|
|
|
<time-select @clearSelect="clearSelect" @timeChange="timeChange"></time-select>
|
|
|
</div>
|
|
|
- <div class="detail" v-if="follow.length > 0">
|
|
|
- <div class="item" v-for="(item,index) in follow" :key="index">
|
|
|
- <p>{{index + 1}}.{{item.createdate}}, 由<span style="font-weight:bold;margin:0 6px;font-size:13px">{{item.createby}}</span>开始跟进,跟进方式:<span style="font-weight:bold;margin:0 5px">{{item.followupmode}}</span>{{handleTxt[item.logtype]}}</p>
|
|
|
- <div class="content">
|
|
|
- <div style="margin-bottom:10px">
|
|
|
- <p v-if="item.competitor">已购买品牌:{{item.competitor}}</p>
|
|
|
- {{item.content}}
|
|
|
- </div>
|
|
|
- <file-item
|
|
|
- :marginRight="10"
|
|
|
- :rowCount="5"
|
|
|
- :isDownLoad="true"
|
|
|
- :fileData="item.attinfo"
|
|
|
- @deleteSuccess="deleteFile">
|
|
|
- </file-item>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <div style="height:calc(100vh - 300px);overflow: auto;">
|
|
|
+ <el-timeline v-if="follow.length > 0" style="margin: 10px" v-for="item in follow" :key="item.index">
|
|
|
+ <el-timeline-item :timestamp="item.createdate" placement="top" color="#409eff">
|
|
|
+ <el-card class="card-border">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="16">
|
|
|
+ <div class="avatar">
|
|
|
+ <img class="avatar__image" v-if="item.headpic" :src="item.headpic" alt="">
|
|
|
+ <p v-else>{{item.createby.substr(0, 1)}}</p>
|
|
|
+ </div>
|
|
|
+ <div style="float:left;margin-left: 10px!important;">
|
|
|
+ <p>{{ item.createby }} </p>
|
|
|
+ <small style="color:#999999ad;margin-top:10px">部门:{{ item.depname?item.depname:"--" }} 职位:{{ item.position?item.position:"--" }}</small>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="8">
|
|
|
+ <div style="float: right;">
|
|
|
+ <editFollow :data="item" @onSuccess="onSuccess" :disabled="disabled" v-if="!disabled "></editFollow>
|
|
|
+ <upload
|
|
|
+ v-if="!disabled"
|
|
|
+ class="inline-16"
|
|
|
+ ref="upload"
|
|
|
+ :folderid="folderid"
|
|
|
+ @onSuccess="onSuccess"
|
|
|
+ :id="item.sat_ordercluefollowuplogid"
|
|
|
+ :disabled="disabled"
|
|
|
+ type="button">
|
|
|
+ </upload>
|
|
|
+ <el-button size="small" type="text" @click="onDel(item.sat_ordercluefollowuplogid)" :disabled="disabled" v-if="!disabled">删除</el-button>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <div style="float: left;margin-top: 10px">
|
|
|
+ <p>跟进类型:{{item.followupmode}}</p>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <div class="div-border">
|
|
|
+ {{item.content}}
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" >
|
|
|
+ <div v-if="item.attinfo" style="margin-top: 20px;margin-bottom: -10px">
|
|
|
+ <file-item
|
|
|
+ :marginRight="10"
|
|
|
+ :rowCount="5"
|
|
|
+ :isDownLoad="true"
|
|
|
+ :fileData="item.attinfo"
|
|
|
+ :isDelete="!disabled"
|
|
|
+ @deleteSuccess="deleteFile">
|
|
|
+ </file-item>
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-card>
|
|
|
+ </el-timeline-item>
|
|
|
+ </el-timeline>
|
|
|
+ <el-empty title="暂无数据" v-else></el-empty>
|
|
|
</div>
|
|
|
- <el-empty title="暂无数据" v-else></el-empty>
|
|
|
+
|
|
|
<div style="margin-top:16px;text-align:right">
|
|
|
<el-pagination
|
|
|
- background
|
|
|
- small
|
|
|
- @size-change="handleSizeChange"
|
|
|
- @current-change="handleCurrentChange"
|
|
|
- :current-page="param.content.pageNumber"
|
|
|
- :page-size="param.content.pageSize"
|
|
|
- layout="total, prev, pager, next"
|
|
|
- :total="total">
|
|
|
+ background
|
|
|
+ small
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :current-page="param.content.pageNumber"
|
|
|
+ :page-size="param.content.pageSize"
|
|
|
+ layout="total, prev, pager, next"
|
|
|
+ :total="total">
|
|
|
</el-pagination>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -43,13 +81,16 @@
|
|
|
|
|
|
<script>
|
|
|
import FileItem from '../../orderclue/components/file/index2'
|
|
|
-
|
|
|
+import upload from './uploadNew.vue'
|
|
|
+import editFollow from './editFollow'
|
|
|
import TimeSelect from '@/SManagement/submitedit_one/components/TimeSelect'
|
|
|
-import { log } from '@antv/g2plot/lib/utils';
|
|
|
export default {
|
|
|
name: 'followDetail',
|
|
|
+ props:['disabled'],
|
|
|
data() {
|
|
|
return {
|
|
|
+ bindData:{},
|
|
|
+ folderid:JSON.parse(sessionStorage.getItem('folderid')).appfolderid,
|
|
|
param: {
|
|
|
"id": "20221101094602",
|
|
|
"version":1,
|
|
|
@@ -80,10 +121,11 @@ export default {
|
|
|
},
|
|
|
follow:[],
|
|
|
timeArr:[],
|
|
|
+ attinfo:[],
|
|
|
total:0
|
|
|
};
|
|
|
},
|
|
|
- components:{ TimeSelect , FileItem},
|
|
|
+ components:{ TimeSelect , FileItem,upload,editFollow},
|
|
|
computed:{
|
|
|
},
|
|
|
watch:{
|
|
|
@@ -101,23 +143,23 @@ export default {
|
|
|
})
|
|
|
this.param.content.sort = res.sort
|
|
|
console.log(this.follow);
|
|
|
-
|
|
|
+
|
|
|
},
|
|
|
handleCurrentChange(n) {
|
|
|
this.param.content.pageNumber = n
|
|
|
this.getFollowDetail()
|
|
|
},
|
|
|
clearSelect() {
|
|
|
- this.param.content.where.start = ''
|
|
|
+ this.param.content.where.start = ''
|
|
|
this.param.content.where.end = ''
|
|
|
this.param.content.pageNumber = 1
|
|
|
- this.getFollowDetail()
|
|
|
+ this.getFollowDetail()
|
|
|
},
|
|
|
timeChange(result) {
|
|
|
- this.param.content.where.start = result[0]
|
|
|
- this.param.content.where.end = result[1]
|
|
|
+ this.param.content.where.start = result[0]
|
|
|
+ this.param.content.where.end = result[1]
|
|
|
this.param.content.pageNumber = 1
|
|
|
- this.getFollowDetail()
|
|
|
+ this.getFollowDetail()
|
|
|
},
|
|
|
sortFun() {
|
|
|
this.param.content.sort[0].reversed = this.param.content.sort[0].reversed == 0 ? 1 : 0
|
|
|
@@ -128,22 +170,47 @@ export default {
|
|
|
item.attinfo.forEach((item2,index) => {
|
|
|
if(item2.linksid == data.linksid) {
|
|
|
console.log(item2,data);
|
|
|
-
|
|
|
+
|
|
|
item.attinfo.splice(index,1)
|
|
|
}
|
|
|
})
|
|
|
})
|
|
|
-
|
|
|
+
|
|
|
},
|
|
|
handleSizeChange(val) {
|
|
|
// console.log(`每页 ${val} 条`);
|
|
|
this.param.content.pageSize = val
|
|
|
this.getFollowDetail()
|
|
|
},
|
|
|
- handleCurrentChange(val) {
|
|
|
+ /* handleCurrentChange(val) {
|
|
|
// console.log(`当前页: ${val}`);
|
|
|
this.param.content.pageNumber = val
|
|
|
this.getFollowDetail()
|
|
|
+ },*/
|
|
|
+ onDel(id){
|
|
|
+ this.$confirm('确定删除该跟进记录吗?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(async () => {
|
|
|
+ const res = await this.$api.requested({
|
|
|
+ "id": 20221208112002,
|
|
|
+ "content": {
|
|
|
+ "sat_ordercluefollowuplogid":id
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.tool.showMessage(res,()=>{
|
|
|
+ this.getFollowDetail()
|
|
|
+ })
|
|
|
+ }).catch(() => {
|
|
|
+ this.$message({
|
|
|
+ type: 'info',
|
|
|
+ message: '已取消删除'
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ onSuccess () {
|
|
|
+ this.getFollowDetail()
|
|
|
},
|
|
|
},
|
|
|
};
|
|
|
@@ -153,34 +220,51 @@ export default {
|
|
|
*{
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
- .normal-card .title {
|
|
|
- font-size: 16px;
|
|
|
- color: #000000;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
- .normal-card .select {
|
|
|
- margin: 25px 10px 15px 0;
|
|
|
+ .select{
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
}
|
|
|
- .normal-card .select .demonstration {
|
|
|
+ .demonstration {
|
|
|
font-size: 14px;
|
|
|
margin-right: 10px;
|
|
|
}
|
|
|
- .normal-card .detail {
|
|
|
- font-size: 14px;
|
|
|
- overflow-y: scroll;
|
|
|
- height: calc(100vh - 400px);
|
|
|
- padding-right: 10px;
|
|
|
+ .avatar__image{
|
|
|
+ height: 100%;
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ .avatar:hover .avatar__model{
|
|
|
+ display: block;
|
|
|
}
|
|
|
- .normal-card .detail .content {
|
|
|
- margin: 10px 0 16px 0;
|
|
|
+ .avatar{
|
|
|
+ position: relative;
|
|
|
+ float: left;
|
|
|
+ margin-left: 0px;
|
|
|
+ height:40px;
|
|
|
+ width: 40px;
|
|
|
+ margin-bottom: 5px;
|
|
|
+ border-radius: 100%;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 40px;
|
|
|
+ color:#fff;
|
|
|
+ font-weight: 500;
|
|
|
+ background: #3874F6;
|
|
|
+ cursor: pointer;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+ .card-border{
|
|
|
background: #F2F2F2;
|
|
|
- padding: 16px;
|
|
|
+ }
|
|
|
+ .card-border .div-border{
|
|
|
+ background: #FFFFFF;
|
|
|
+ margin-top: 20px;
|
|
|
+ width: 100%;
|
|
|
+ height: 90px;
|
|
|
border-radius: 5px;
|
|
|
- font-size: 14px;
|
|
|
}
|
|
|
/deep/.el-descriptions__header {
|
|
|
margin-bottom: 0 !important;
|
|
|
}
|
|
|
+ /deep/.el-card__body {
|
|
|
+ padding: 10px;
|
|
|
+ }
|
|
|
</style>
|