<template>
  <el-dialog
    class="popups"
    width="534px"
      :visible.sync="isshow"
    @close="resetForm('ruleForm')"
  >
    <div  @click = 'handleALL'>
    <div class="poptitle">
      <img src="@/assets/images/economies/icon.png">
      <span>新建商机</span>
    </div>
    <el-form class="popform j" :model="queryParam" :rules="rules" ref="ruleForm" label-width="130px">
      <el-form-item label="项目名称：" class="row"  prop="projectName">
        <el-input type="text" placeholder="请输入" v-model="queryParam.projectName" @input="getProject"></el-input>
        <div class="resultlist" v-if="proList.length>0" id="box1">
          <div v-for="(item,index) in proList" @click="selProject(item)"><span  v-html="item"></span></div>
        </div>
      </el-form-item>
      <el-form-item label="业主单位：" class="row"  prop="ownerCompany">
        <el-input type="text" placeholder="请输入" v-model="queryParam.ownerCompany" @input="getCompany"></el-input>
        <div class="resultlist" v-if="showlist" id="box">
          <div v-for="(item,index) in companData" @click="selCompany(item)"><span  v-html="item.name"></span></div>
        </div>
      </el-form-item>
      <el-form-item label="项目阶段：" class="row">
        <el-select  placeholder="请选择" v-model="queryParam.projectStage">
          <el-option v-for="(item,index) in projectStage" :key="index" :label="item.dictLabel" :value="item.dictValue"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="项目类型：" class="row">
        <el-select  placeholder="请选择" v-model="queryParam.projectType">
          <el-option v-for="(item,index) in projectType" :key="index" :label="item.dictLabel" :value="item.dictValue"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="项目类别：" class="row">
        <el-select  placeholder="请选择" v-model="queryParam.projectCategory">
          <el-option v-for="(item,index) in projectCategory" :key="index" :label="item.dictLabel" :value="item.dictValue"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="投资估算（万元）：" class="row">
        <el-input type="text" placeholder="请输入金额" @input="number" v-model="queryParam.investmentAmount"></el-input>
      </el-form-item>
      <el-form-item label="可见范围：" class="row">
        <el-select  placeholder="请选择" v-model="queryParam.isPrivate">
          <el-option v-for="(item,index) in Privatelist" :key="index" :label="item.label" :value="item.value"></el-option>
        </el-select>
      </el-form-item>
      <div class="popbot">
        <div class="wordprimary" @click="toradar">前往商机雷达寻找项目线索></div>
        <div class="btn btn_cancel h32" @click="resetForm('ruleForm')">返回</div>
        <div class="btn btn_primary h32" @click="submitForm('ruleForm')">新建商机</div>
      </div>
    </el-form>
    </div>
  </el-dialog>
</template>

<script>
  import {getEnterprise,getDictType,} from '@/api/main'
  import {addProject} from '@/api/project/project'
  import {queryProject} from '@/api/detail/party-a/cooperate'
  export default {
    name: 'addProject',
    data(){
      return{
        Privatelist:[
          {
          value:0,
          label:'仅自己可见'
        },{
          value:1,
            label:'他人可见'
          }
        ],//可见范围
        isshow:true,
        queryParam:{
          userId:'',//用户id
          projectName:'',//	项目名称
          companyId:'',//企业id
          ownerCompany:'',//业主单位
          projectStage:null,//项目阶段
          projectType:null,//项目类型
          projectCategory:null,//项目类别
          investmentAmount:null,//投资估算
          isPrivate:0,//可见范围(0 仅自己可见，1 他人可见)
        },
        rules:{
          projectName:[{ required: true, message: '请输入非空格字符！', trigger: 'blur' },],
          ownerCompany:[{ required: true, message: '请输入非空格字符！', trigger: 'blur' },],
        },
        showlist:false,
        companData:[],//联想企业列表
        projectStage:[],//项目阶段
        projectType:[],//项目类型
        projectCategory:[],//项目类别
        proList:[],//项目列表
      }
    },
    mounted(){
    },
    created(){
      //项目阶段
      getDictType('project_stage_type').then(result=>{
        this.projectStage = result.code == 200 ? result.data:[]
      })
      //项目类型
      getDictType('project_type').then(result=>{
        this.projectType = result.code == 200 ? result.data:[]
      })
      //项目类别
      getDictType('project_category').then(result=>{
        this.projectCategory = result.code == 200 ? result.data:[]
      })
    },
    methods:{
      toradar(){
        this.$router.push({path:'/radar'})
      },
      handleALL(event){
        var one = document.getElementById("box");
        if(one){
          if(!one.contains(event.target)){
            this.showlist = false
          }
        }
        var two = document.getElementById("box1");
        if(two){
          if(!two.contains(event.target)){
            this.proList = []
          }
        }
      },
      //获取建设库客户
      getCompany(value){
        this.queryParam.companyId = ''
        if (value.length>=2){
          let param = {
            keyword:value,
            page:{
              limit:20,
              page:1
            }
          }
          getEnterprise(JSON.stringify(param)).then(result=>{
            if(result.code != 200)
              return
            this.showlist = true
            this.companData = result.data.list
          })
        }
      },
      //获取项目名称
      getProject(value){
        // if (value.length>=2){
        //   let param = {
        //     projectName:value,
        //   }
        //   queryProject(JSON.stringify(param)).then(result=>{
        //     if(result.code != 200){
        //       this.proList = []
        //       return false
        //     }
        //     this.proList = result.data
        //   })
        // }
      },
      selCompany(item){
        this.queryParam.companyId = item.jskEid
        this.queryParam.ownerCompany = item.name.replace(/<[^>]+>/g, '')
        this.showlist = false
      },
      selProject(item){
        // this.queryParam.companyId = item.jskEid
        // this.queryParam.ownerCompany = item.name.replace(/<[^>]+>/g, '')
        this.proList = []
      },
      //添加客户
      submitForm(formName) {
        this.queryParam.userId = this.$store.state.user.userId
        if(this.queryParam.investmentAmount!="")
          this.queryParam.investmentAmount = parseFloat(this.queryParam.investmentAmount)
        this.$refs[formName].validate((valid) => {
          if (valid) {
            addProject(this.queryParam).then(result=>{
              if(result.code == 200){
                this.$message.success('添加成功！')
                this.resetForm('ruleForm')
                this.$emit('addproject')
              }else{
                this.$message.error(result.msg)
              }
            })
          } else {
          }
        });
      },
      resetForm(formName) {
        this.queryParam = {
          projectName:'',//	项目名称
          companyId:'',//企业id
          ownerCompany:'',//业主单位
          projectStage:null,//项目阶段
          projectType:null,//项目类型
          projectCategory:null,//项目类别
          investmentAmount:null,//投资估算
          isPrivate:0,//可见范围(0 仅自己可见，1 他人可见)
        },
        this.showlist = false
        this.$emit("cancel",false)
      },

      //输入数字
      number(value){
        this.queryParam.investmentAmount = value.replace(/^\D*(\d*(?:\.\d{0,6})?).*$/g, '$1')//输入6位小数
      }
    }
  }
</script>

<style scoped>

  .wordprimary{
    display: inline;
    padding-right: 26px;
  }
.btn_primary{
  padding: 0;
}
</style>
