<template>
|
<div>
|
<el-dialog :visible.sync="show" :show-close="false" width="1541px" @close="$emit('close')"
|
:modal-append-to-body="false">
|
<div class="txt-center pt--31">
|
<div class="fs--18 mb--34 font-bold">请选择</div>
|
<div class="mx--31">
|
<el-table ref="singleTable" highlight-current-row @row-dblclick="rowClick2"
|
@current-change="handleCurrentChange" :data="tableData" style="width: 100%" border
|
:header-cell-style="{ background: '#F6F6F7', 'font-size': '16px', color: '#3B3F56' }">
|
<el-table-column label="选择" align="center">
|
<template slot-scope="scope">
|
<el-radio class="radio" :label="scope.row" v-model="currentRow">{{ "" }}</el-radio>
|
</template>
|
</el-table-column>
|
<el-table-column prop="receiverName" label="姓名" align="center">
|
</el-table-column>
|
<el-table-column prop="receiverPhone" label="手机号" align="center">
|
</el-table-column>
|
<el-table-column prop="receiverEmail" label="邮箱" align="center">
|
</el-table-column>
|
<el-table-column prop="receiverAddress" label="地址" align="center">
|
</el-table-column>
|
<el-table-column prop="company" label="公司" align="center">
|
</el-table-column>
|
<el-table-column prop="postAddress" label="邮编" align="center">
|
</el-table-column>
|
<el-table-column prop="remark" label="备注" align="center">
|
</el-table-column>
|
</el-table>
|
</div>
|
<div class="btns">
|
<el-button @click="$emit('close')">关闭</el-button>
|
<el-button @click="submit" type="primary">确认</el-button>
|
</div>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import { getMsg } from '@/view/service'
|
export default {
|
components: {},
|
props: {
|
show: {
|
type: Boolean,
|
default: false
|
},
|
row: {
|
type: Object,
|
default: null
|
}
|
},
|
data() {
|
return {
|
tableData: [],
|
currentRow: null
|
};
|
},
|
computed: {},
|
watch: {},
|
created() {
|
getMsg({ extra: localStorage.getItem('extra') }).then(res => {
|
this.tableData = res.data
|
// 回显选中行
|
// this.setCurrent(this.row)
|
})
|
},
|
mounted() { },
|
methods: {
|
submit() {
|
if (!this.currentRow) {
|
this.$message({
|
message: '请选择信息',
|
type: 'warning'
|
});
|
return
|
}
|
this.$emit('submit', this.currentRow)
|
},
|
// 设置选中行
|
setCurrent(row) {
|
this.$refs.singleTable.setCurrentRow(row);
|
},
|
// 点击单选
|
handleCurrentChange(row) {
|
this.currentRow = row;
|
},
|
// 点击行
|
rowClick2(row, column, event) {
|
if (this.currentRow && row.id == this.currentRow.id) {
|
this.setCurrent();
|
this.currentRow = null;
|
} else {
|
this.currentRow = row;
|
}
|
},
|
},
|
};
|
</script>
|
<style scoped lang="less">
|
.btns {
|
display: flex;
|
justify-content: center;
|
margin-top: 39px;
|
padding-bottom: 31px;
|
|
.el-button {
|
width: 190px;
|
height: 50px;
|
font-size: 20px;
|
|
}
|
|
.el-button--primary {
|
background-color: #014099;
|
border-color: #014099;
|
}
|
}
|
|
::v-deep .el-dialog {
|
border-radius: 8px;
|
|
.el-dialog__header {
|
display: none !important;
|
}
|
|
.el-dialog__body {
|
padding: 0 !important;
|
|
}
|
}
|
|
::v-deep .el-radio__label {
|
display: none;
|
}
|
|
::v-deep .el-radio__inner::after {
|
display: none;
|
}
|
|
::v-deep .el-radio__inner {
|
width: 24px !important;
|
height: 24px !important;
|
box-sizing: border-box;
|
}
|
|
::v-deep .el-radio__input.is-checked {
|
padding: 4px 4px 3px 4px;
|
border: 1px solid #014099;
|
border-radius: 50%;
|
box-sizing: border-box;
|
}
|
|
::v-deep .el-radio__input.is-checked .el-radio__inner {
|
width: 13px !important;
|
height: 13px !important;
|
border: unset;
|
background: rgba(1, 64, 153, 1) !important;
|
}
|
|
::v-deep .el-radio {
|
height: 25px !important;
|
}
|
</style>
|
