<template>
<div class="exhibition-baseInformation">
  <section>
    <p class="base">基本信息</p>
    <article>
      <el-row>
        <!--v-if-->
        <el-col :span="12">
          <span class="ml-10">xxxx:</span>
          <el-popover
            placement="top-start"
            width="160"
            trigger="hover"
            v-model="visible">
            <p>xxxxxxxxx</p>
            <div style="text-align: right; margin: 0">
              <el-button
                type="primary"
                size="mini"
                @click="handleCopy"
              >复制N
              </el-button>
            </div>
            <el-button
              slot="reference"
              type="text"
            >xxxx</el-button>
          </el-popover>
        </el-col>
<!--        test -->
        <!--
        v-else-if
           <el-col :span="8"></el-col>
           v-else
           <el-col :span="6"></el-col>
        -->
        <el-col :span="12">
          <span class="ml-10">xxxx:</span>
          <el-popover
            placement="top-start"
            width="160"
            trigger="hover"
            v-model="visible">
            <p>xxxxxxxxx</p>
            <div style="text-align: right; margin: 0">
              <el-button
                type="primary"
                size="mini"
                @click="handleCopy"
              >复制
              </el-button>
            </div>
            <el-button
              slot="reference"
              type="text"
            >xxxx</el-button>
          </el-popover>
        </el-col>

      </el-row>
    </article>

  </section>
</div>
</template>

<script>
    export default {
        name: "exhibition-baseInformation",
      data() {
          return {
            visible: false,
          }
      },
      methods:{
          handleCopy() {
            this.visible = false
            document.execCommand('Copy')
            this.$message.success('复制成功')
          }
      }
    }
</script>

<style scoped lang="less">
  .exhibition-baseInformation {
    section {
      /*border: 1px solid #eeeeee;*/
      /*margin: 10px;*/
      .base{
        margin: 10px;
        font-weight: 600;
        text-indent: 10px;
        border-bottom:1px dashed #eee ;
      }
    }
    .ml-10{
      margin-left: 10px;
      text-indent: 10px;
    }

  }
</style>
