yos_web/src/SManagement/orderclue_detail/components/followDetail.vue

<template>
  <div class="normal-card" style="padding-right:0">
    <p class="title">跟进记录<i class="el-icon-sort" @click="sortFun"></i></p>
    <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="20"
            :rowCount="5"
            :isDownLoad="true" 
            :fileData="item.attinfo"
            @deleteSuccess="deleteFile">
          </file-item>
        </div>
      </div>
    </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">
      </el-pagination>
    </div>
  </div>
</template>

<script>
import FileItem from '../../orderclue/components/file/index2'

import TimeSelect from '@/SManagement/submitedit_one/components/TimeSelect'
import { log } from '@antv/g2plot/lib/utils';
export default {
  name: 'followDetail',
  data() {
    return {
      param: {
        "id": "20221101094602",
        "version":1,
        "content": {
            "sat_orderclueid": this.$route.query.id,
            "isdesc": 1,
            "pageNumber":1,
            "pageSize":20,
            "where": {
                "start": "",
                "end": ""
            }
        }
      },
      handleTxt:{
        '跟进中':'跟进内容',
        '成交':'成交操作，添加备注',
        '丢单':'丢单操作，具体原因如下',
        '无效':'无效操作，具体原因如下',
      },
      follow:[],
      timeArr:[],
      total:0
    };
  },
  components:{ TimeSelect , FileItem},
  computed:{
  },
  watch:{
  },
  created() {
    this.getFollowDetail()
  },
  methods: {
    async getFollowDetail() {
      let res = await this.$api.requested(this.param)
      this.follow = res.data
      this.total = res.total
      this.follow.forEach(item => {
        item.attinfo = this.fileType.fileList(item.attinfo)
      })
      console.log(this.follow);
      
    },
    handleCurrentChange(n) {
      this.param.content.pageNumber = n
      this.getFollowDetail()
    },
    clearSelect() {
      this.param.content.where.start = ''      
      this.param.content.where.end = ''
      this.param.content.pageNumber = 1
      this.getFollowDetail()  
    },
    timeChange(result) {
      this.param.content.where.start = result[0]      
      this.param.content.where.end = result[1]    
      this.param.content.pageNumber = 1
      this.getFollowDetail()  
    },
    sortFun() {
      this.param.content.isdesc = this.param.content.isdesc == 1 ? this.param.content.isdesc = 0 : this.param.content.isdesc = 1
      this.getFollowDetail()
    },
    deleteFile (data) {
      this.follow.forEach(item => {
        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) {
      // console.log(`当前页: ${val}`);
      this.param.content.pageNumber = val
      this.getFollowDetail()
    },
  },
};
</script>

<style scoped>
*{
  box-sizing: border-box;
}
  .normal-card .title {
    font-size: 16px;
    color: #000000;
    font-weight: bold;
  }
  .normal-card .select {
    margin: 25px 10px 15px 0;
    display: flex;
    align-items: center;
  }
  .normal-card .select .demonstration {
    font-size: 14px;
    margin-right: 10px;
  }
  .normal-card .detail {
    font-size: 14px;
    overflow-y: scroll;
    height: calc(100vh - 400px);
    padding-right: 10px;
  }
  .normal-card .detail .content {
    margin: 10px 0 16px 0;
    background: #F2F2F2;
    padding: 16px;
    border-radius: 5px;
    font-size: 14px;
  }
</style>