dialog居中双击单选

双击单选组件
<template>
    <el-dialog title="选择" :visible.sync="innerVisible" :close-on-click-modal="false" class="dialog-box-center" @close="closeEvt">
        <el-button type="primary" @click="searchDataMixin" style="margin-left:10px;" icon="el-icon-search">搜索</el-button>
        <el-table :data="list" style="width: 100%" tooltip-effect="dark" :height="tableHeight - 200"
        @row-dblclick='rowClick' highlight-current-row border v-loading="loading">
            <el-table-column prop="name" label="名称" align="center" show-overflow-tooltip></el-table-column>
        </el-table>
        <!-- 分页 -->
        <div class="el_page-box">
            <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
                :current-page="currentPage" :page-sizes="pagesizeList" :page-size="pagesize"
                :layout="pageLayout" :total="total" :background='pageBackground'>
            </el-pagination>
        </div>
    </el-dialog>
</template>
<script>
import { pagingSearchCom } from '@/components/mixins/pagingSearch'; //分页方法
import { mapDevPageList } from "@/http/systemManagement";   //请求后台接口
export default {
    mixins: [pagingSearchCom],
    props: {},
    data(){
        return {
            innerVisible: true
        }
    },
    methods:{
        closeEvt(){
            this.innerVisible = true;
            this.$emit('confirmEvt');
        },
        // 双击当前行事件
        rowClick(val){
            this.$emit('confirmEvt', val);
        },
        // 列表接口
        _requestPageList(pageData) {
            let data = {
                pageData,
                name: ""
            }
            this.loading = true;
            mapDevPageList(data).then(res => {
                if (res.data.returnResult == 200) {
                    this.loading = false;
                    this.list = res.data.returnData.data; //赋值列表数据
                    this.total = res.data.returnData.recordCount; //设置数据总数目！！！
                }
            })
        }
    }
}
</script>
<style lang="scss">
// Dialog 对话框居中显示
.dialog-box-center{
  text-align: center;
  &:after {
      content: "";
      display: inline-block;
      height: 100%;
      width: 0;
      vertical-align: middle;
  }
  .el-dialog{
      text-align: left;
      display: inline-block;
      margin: 0 !important;
      vertical-align: middle;
      min-width: 800px;
  }
}
</style>

页面调用组件
<template>
    <select-camera v-if="dialogUser" @confirmEvt="confirmUserEvt"></select-camera>
</template>
<script>
import selectCamera from "@/components/allUserName/selectCamera";
export default {
    data(){
        return {
            dialogUser: false
        }
    },
    components: {
        selectCamera
    },
    methods:{
        confirmUserEvt(obj){
            // console.log('obj',obj)
            if(obj && obj.id){
                
            }
            this.dialogUser = false;
        },
    }
}
</script>