<template>
  <div>
    <el-card class="box-card noborder">
      <div class="cardtitles">跟进记录</div>
      <div class="records">
        <div class="writeIn">
          <div class="default" v-if="isEdit == false" @click="getEdit">
            <img src="@/assets/images/project/add_3.png">
            <div>新建一条跟进记录，如:周五上午预约客户上门拜访</div>
          </div>
          <div class="writting" v-if="isEdit == true">
            <div class="wri_top">
              <img src="@/assets/images/project/add_3.png">
              <el-input placeholder="新建一条跟进记录，如:周五上午预约客户上门拜访"></el-input>
            </div>
            <div class="wr_bot">
              <el-select v-model="value" class="w128" placeholder="拜访方式">
                <i slot="prefix" class="el-input__icon"><img src="@/assets/images/project/ico_1.png"></i>
                  <el-option label="cccc" value="11"></el-option>
                  <el-option label="cccc" value="121"></el-option>
              </el-select>
              <el-select v-if="showtype == 'gjdt'" v-model="value" class="w128" placeholder="关联企业">
                <i slot="prefix" class="el-input__icon"><img src="@/assets/images/project/ico_1.png"></i>
                  <el-option label="cccc" value="11"></el-option>
                  <el-option label="cccc" value="121"></el-option>
              </el-select>
              <el-input v-model="value" placeholder="拜访对象" style="width: 100px;">
                <i slot="prefix" class="el-input__icon"><img src="@/assets/images/project/ico_2.png"></i>
              </el-input>
              <el-input v-model="value" placeholder="客户职位" style="width: 100px;">
                <i slot="prefix" class="el-input__icon"><img src="@/assets/images/project/ico_3.png"></i>
              </el-input>
              <div class="times"><img src="@/assets/images/project/ico_4.png">
                <el-date-picker class="w128"
                    v-model="value"
                    type="date"
                    placeholder="下次拜访时间">
                  </el-date-picker>
              </div>
              <div class="btn btn_primary h32 wc" :class="{'btn_disabled':value == ''}">完成</div>
            </div>
          </div>
        </div>
        <div class="recordlist">
          <div class="rec_detail">

            <div class="rec_time">
              <i class="el-icon-time"></i>
              <div>2018-04-03 10:20</div>
              <div class="operate">
                <!--<img src="@/assets/images/edit.png">第一期不做编辑-->
                <img src="@/assets/images/delete.png">
              </div>
            </div>
            <div class="rec_con">
              <div><strong>李力</strong> <span>(线下拜访)</span></div>
              <div><span>上门拜访了交通局杨科长，客户对公司认可度很高，希望做进一步的高层对话。</span></div>
              <div class="rec_text">
                <span>拜访对象：杨洋</span>
                <span>职位：科长</span>
                <span>拜访时间：2008-12-08</span>
                <span>下次拜访时间：2008-12-08</span>
              </div>
            </div>
          </div>
          <div class="rec_detail">

            <div class="rec_time">
              <i class="el-icon-time"></i>
              <div>2018-04-03 10:20</div>
              <div class="operate">
                <!--<img src="@/assets/images/edit.png">第一期不做编辑-->
                <img src="@/assets/images/delete.png">
              </div>
            </div>
            <div class="rec_con">
              <div><strong>李力</strong> <span>(线下拜访)</span></div>
              <div><span>上门拜访了交通局杨科长，客户对公司认可度很高，希望做进一步的高层对话。</span></div>
              <div class="rec_text">
                <span>拜访对象：杨洋</span>
                <span>职位：科长</span>
                <span>拜访时间：2008-12-08</span>
                <span>下次拜访时间：2008-12-08</span>
              </div>
            </div>
          </div>

          <div class="tables">
            <div class="bottems">
              <el-pagination
                background
                :page-size="pageSize"
                :current-page="pageNum"
                @current-change="handleCurrentChange"
                layout="prev, pager, next"
                :total="1000">
              </el-pagination>
            </div>
          </div>
        </div>
      </div>

      <div class="delform">
        <div class="words">是否删除该条记录</div>
        <div>
          <div class="btnsmall btn_primary h28">确定</div>
          <div class="btnsmall btn_cancel h28">取消</div>
        </div>
      </div>
    </el-card>
  </div>
</template>

<script>
  import "@/assets/styles/project.scss"
  import {getFollowList} from '@/api/custom/custom'
  export default {
    props:{
      types: { //当前组件展示类型
        type: String,
        default: ""
      },
      datas:[],//数据源
    },
    name: 'gjjl',
    data(){
      return{
        showtype:'',
        isEdit:false,
        value:'',
        pageNum:1,//页码
        pageSize:20,
      }
    },
    created(){
      this.showtype = this.types
      //客户管理跟进动态
      if(this.showtype == 'gjdt'){
        this.getGJDTlist()
      }
      console.log(this.types)
    },
    methods:{
      //跟进动态列表
      getGJDTlist(){
        let param = {
          pageNum:this.pageNum,//页码
          pageSize:this.pageSize,
        }
        getFollowList(param).then(result=>{

        })
      },
      handleCurrentChange(val){
        this.pageNum = val
        if(this.showtype == 'gjdt'){
          this.getGJDTlist()
        }
      },
      getEdit(){
        this.isEdit = true;
        this.value = ""
      },
    }
  }
</script>

<style lang="scss" scoped>
.wc{
  position: absolute;
  right: 0;
  bottom: 0;
}
.delform{
  position: fixed; left:50%; top:50%; transform:translate(-50%,-50%)
}
.tables{
  margin-top: -26px;
  padding-right: 0;
}
</style>
