<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-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>
      </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"
  export default {
    name: 'gjjl',
    data(){
      return{
        isEdit:false,
        value:''
      }
    },
    methods:{
      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%)
}
</style>
