<template>
  <div>
    <el-popover
        placement="right"
        width="900"
        trigger="manual"
        v-model="businessShow"
        >
      <el-input
          style="width:300px;margin-bottom: 10px"
          placeholder="请输入内容"
          v-model="keyWord"
          clearable
          @clear="businessSearch"
          size="mini"
          @keyup.enter.native="businessSearch">
        <i slot="prefix" class="el-icon-search" @click="businessSearch"></i>
      </el-input>
      <el-table :data="businessData" @row-click="businessSelect" :header-cell-style="{background:'#EEEEEE',color:'#333'}" size="mini">
        <el-table-column width="260" label="客户名称">
          <template slot-scope="scope">
            <span style="margin-left: 10px">{{ scope.row.companyName?scope.row.companyName:'--' }}</span>
          </template>
        </el-table-column>
        <el-table-column  label="客户地址">
          <template slot-scope="scope">
            <span style="margin-left: 10px">{{ scope.row.address?scope.row.address:'--' }}</span>
          </template>
        </el-table-column>
        <el-table-column width="200"  label="客户税号">
          <template slot-scope="scope">
            <span style="margin-left: 10px">{{ scope.row.taxNum?scope.row.taxNum:'--' }}</span>
          </template>
        </el-table-column>
      </el-table>
      <el-button size="small" type="primary" style="width: 100%" @click="businessSearch" slot="reference" :disabled="keyWord === ''">工商查询</el-button>
    </el-popover>
  </div>
</template>

<script>
export default {
  name: "index",
  props:["keyWord"],
  data(){
    return {
      businessShow:false,
      businessData:[],
      businessParam:{
        "id": 20221208103601,
        "content": {
          "pageNumber":1,
          "pageSize":5,
          "keyword":''
        },
      },
    }
  },
  methods:{
    /*工商查询*/
    async businessSearch(){
      console.log(this.keyWord,"关键词")
     /* this.businessShow = false*/
      this.businessParam.content.keyword = this.keyWord
      const res = await this.$api.requested(this.businessParam)
      console.log(res,"工商查询结果")
      this.businessData = res.data
      this.businessShow = true
    },
    /*选择工商信息*/
    businessSelect(val){
      console.log("选择的工商信息",val)
      this.businessShow = false
      this.$confirm('是否以查询的工商信息更新客户信息?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
        closeOnClickModal:false
      }).then(() => {

        this.$emit("businessData",val)
        this.businessData = []
        /*this.form.enterprisename = val.companyName
        this.form.address = val.address
        this.form.taxno = val.taxNum*/

      }).catch(() => {
        this.businessData = []
        this.$message({
          type: 'info',
          message: '已取消更新客户信息'
        });
      })
    },
  }
}
</script>

<style scoped>
/deep/.el-input__prefix {
  display: flex;
  align-items: center;
}
</style>