<template>
  <div>
    <el-button type="primary" size="small" @click="dialogTableVisible = true">新 建</el-button>
    <el-dialog
        title="新建项目目标年度"
        :visible.sync="dialogTableVisible"
        width="20%"
        append-to-body
        @close="onCancel"
    >
      <div class="panel_Target">
        <el-row style="margin-top: 3%">
          <el-col :span="4" :offset="1">
            <div style="width: 100%;text-align: right">
              <label class="normal-margin inline-16" style="margin-top: 8%">年度:</label>
            </div>

          </el-col>
          <el-col :span="18">
            <el-date-picker
                style=" width: 100%;"
                class="normal-margin inline"
                v-model="form.year"
                type="year"
                value-format="yyyy"
                placeholder="选择要创建的年度"
                :clearable="false"
                size="small"
                :picker-options="pickerOptions">
            </el-date-picker>
          </el-col>
        </el-row>
      </div>
      <div class="dialog-footer ">
        <el-button size="small" @click="onCancel" class="normal-btn-width">取 消</el-button>
        <el-button size="small" type="primary"  @click="onSubmit" class="normal-btn-width">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import tablelayout from '@/components/table/index.vue'

export default {
  components:{
    tablelayout
  },
  data () {
    return {
      pickerOptions:{
        disabledDate(time){
          /*console.log(year.getFullYear(),'267655555555555555555555555')*/
          return time.getFullYear() < new Date().getFullYear()
        }
      },
      dialogTableVisible:false,
      form:{
        "year": '',
        "sa_salestargetbillid": 0,//新建年度是为0，添加人员时为具体的数据id
        "sales":[]
      },
      tablecols:[],
      list:[],
      selection:[],
      condition:''
    }
  },
  methods:{
    /*async listData () {
      const res = await this.$api.requested({
        "id": 20220901091302,
        "content": {
            "sa_salestargetbillid": 1,
            "where": {
              "condition": this.condition
            }
        },
      })
      res.data.forEach(e => {
        e.marea = e.area.map(m=>{
          return `${m.province}${m.city}${m.county}`
        })
        e.marea = e.marea.join(',')
      });
      this.list = res.data
    },
    checkboxCallBack (val) {
      this.selection = val
    },*/
    async onSubmit () {
      /*if (this.form.year === '') return this.$message({
        message:'请选择年度',
        type:'error'
      })*/
      const res = await this.$api.requested({
        "id": 20220903162902,
        "content": {
          "year":this.form.year,
          "sa_salestargetbillid": 0,
          "sales": this.selection
        },
      })
      this.tool.showMessage(res,()=>{
        this.dialogTableVisible = false
        this.form = {
          "year": '',
          "sa_salestargetbillid": 0,//新建年度是为0，添加人员时为具体的数据id
          "sales":[]
        }
        this.yearData()
        this.$emit('onSuccess')
      })
    },
    onCancel(){
      this.form = {
        "year": '',
        "sa_salestargetbillid": 0,//新建年度是为0，添加人员时为具体的数据id
        "sales":[]
      }
      this.yearData()
      this.dialogTableVisible = false
    },
    /*获取默认年度*/
    yearData(){
      const nowDate = new Date()
      console.log(nowDate.getFullYear())
      this.form.year = String(nowDate.getFullYear() + 1)
    }
  },
  mounted () {
    /*this.listData()*/
    this.yearData()
  },
  created () {
    this.tablecols = this.tool.tabelCol(this.$route.name)['personalTable'].tablecols
  }
}

</script>
<style scoped>
  .el-pagination {
    text-align: right;
  }
  .panel_Target {
    border-top:1px solid #eeeeee;
    padding:5px 5px;
    margin-bottom:0px
  }
  >>> .el-dialog__body {
    padding: 0px 0px 10px;
    color: #606266;
    font-size: 14px;
    word-break: break-all;
  }
  >>> .el-dialog__header {
    padding: 10px 10px 10px ;

  }
  .dialog-footer{
    margin-top: 0px;
    margin-bottom: 10px;
  }
  >>> .el-dialog__title {
    line-height: 24px;
    font-size: 16px;
    color: #303133;
  }
</style>