<template>
    <div class="goodsindex">
      <div class="index-sales">
        <div>
          <el-tabs class="eltabs" v-model="activeName"  >
            <el-tab-pane label="基本信息" name="first">
              <usemessage :rowid="rowid" @newmessage="getnewmessage" ref="usemessage"></usemessage>
            </el-tab-pane>
            <el-tab-pane label="实施信息" name="second">
              <carryoutmessage :rowid="rowid"></carryoutmessage>
            </el-tab-pane>
            <el-tab-pane label="硬件信息" name="third">
              <hardwaremessage :rowid="rowid"></hardwaremessage>
            </el-tab-pane>
            <el-tab-pane label="回款信息" name="fourth">
              <refundmessage :Message="Message"></refundmessage>
            </el-tab-pane>
            <el-tab-pane label="联系人" name="five">
              <connectionmessage :Message="Message"></connectionmessage>
            </el-tab-pane>
            <el-tab-pane label="合同信息" name="six">
              <contractmessage :Message="Message"></contractmessage>
            </el-tab-pane>
            <el-tab-pane label="跟进信息" name="seven">
              <followmessage :Message="Message"></followmessage>
            </el-tab-pane>
            <el-tab-pane label="需求信息" name="eight">
              <requirementmessage :Message="Message"></requirementmessage>
            </el-tab-pane>
            <el-tab-pane label="续约信息" name="nine">
              <resumemessage :Message="Message"></resumemessage>
            </el-tab-pane>
          </el-tabs>
        </div>
      </div>
    </div>
</template>

<script>
import {getcustomget} from '../../api/index'
import usemessage from './components/usemessage.vue'
import carryoutmessage from './components/carryoutmessage'
import hardwaremessage from './components/hardwaremessage'
import refundmessage from './components/refundmessage'
import connectionmessage from './components/connectionmessage'
import contractmessage from './components/contractmessage'
import followmessage from './components/followmessage'
import requirementmessage from './components/requirementmessage'
import resumemessage from './components/resumemessage'
export default {
    components:{
      usemessage,
      carryoutmessage,
      hardwaremessage,
      refundmessage,
      connectionmessage,
      contractmessage,
      followmessage,
      requirementmessage,
      resumemessage,
    },
    data(){
        return {
          activeName:'first',
          Message:{},
          rowid:'',
        }
    },
    methods:{
     
    },
    created(){
      this.rowid = this.$route.query.row_id
      const ids = this.$route.query.row_id
      this.getdetails(ids)
      // this.Message = this.$route.query.uname
      // console.log('111111',this.Message);
    },
    methods:{
      getdetails(id){
        getcustomget(id).then(res =>{
          this.Message = res.data.custom
        })
      },
      getnewmessage(eve){
        console.log(eve);
      }
      
    }
    // watch:{
    //   Message:{
    //     handler(newValue,oldValue){
    //       newValue = this.$refs.usemessage.userediot
    //       this.Message = newValue
    //     }
    //   }
    // }
}
</script>

<style scoped>
.index-sales{
    width: 100%;
    height: 89vh;
    padding: 20px 15px;
    box-sizing: border-box;
    /* background: brown; */
    /* border:  1px solid #E6E6E6; */
    border-radius: 5px;
    background: #ffffff;
    margin-bottom: 20px;
}
.goodsindex{
  background: #F5F7F9;
  padding: 15px;
  box-sizing: border-box;
  width: 100%;
  min-height: 100%;
}
/* 搜索 */
.goodsindex-queryInfo{
    margin-bottom: 10px;
}
.goodsindex-queryInfo-li{
    width: 100%;
    height: auto;
}
/* 列表 */
.goodsindex-list{
    width: 100%;
    height: auto;
    margin-bottom: 20px;
}
/* 分页 */
.goodsindex-page-box{
    width: 100%;
    height: auto;
    display: flex;
    justify-content: flex-end;
}
::v-deep.el-tabs__nav-scroll{
  /* display: -webkit-box;
  display: -ms-flexbox; */
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
    justify-content: center !important;
}
</style>
<style lang="scss">

  .eltabs{
    .el-tabs__header{
      .el-tabs__nav-wrap{
        .el-tabs__nav-scroll{
          display: flex;
          -webkit-box-pack: center;
          justify-content: start !important;
        }
      }
    }
  }
</style>