<template>
|
<el-dialog :title="title" :visible.sync="visible" @close="handleClose">
|
<el-table :data="gridData" selection="single" ref="multipleTable" @selection-change="productSelectionChange">
|
<el-table-column type="selection" width="55"></el-table-column>
|
<el-table-column property="date" label="日期" width="150"></el-table-column>
|
<el-table-column property="name" label="姓名" width="200"></el-table-column>
|
<el-table-column property="address" label="地址"></el-table-column>
|
</el-table>
|
<div slot="footer" class="dialog-footer">
|
<el-button @click="handleClose">取 消</el-button>
|
<el-button type="primary" @click="confirmSelection">确 定</el-button>
|
</div>
|
</el-dialog>
|
</template>
|
|
<script>
|
export default {
|
name: "ProductSelector",
|
props: {
|
visible: Boolean,
|
title: {
|
type: String,
|
default: "物料信息"
|
},
|
gridData: Array
|
},
|
data() {
|
return {
|
multipleSelection: []
|
};
|
},
|
methods: {
|
handleClose() {
|
this.$emit('update:visible', false);
|
},
|
productSelectionChange(selection) {
|
if (selection.length > 1) {
|
this.$refs.multipleTable.clearSelection();
|
this.$refs.multipleTable.toggleRowSelection(selection[selection.length - 1], true);
|
this.multipleSelection = [selection[selection.length - 1]];
|
} else {
|
this.multipleSelection = selection;
|
}
|
},
|
confirmSelection() {
|
if (this.multipleSelection.length > 0) {
|
this.$emit('select-product', this.multipleSelection[0]);
|
this.handleClose();
|
} else {
|
this.$message({
|
message: '警告哦，未选择任何行',
|
type: 'warning'
|
});
|
}
|
}
|
}
|
};
|
</script>
|
