<template>
|
<div>
|
<el-dialog
|
:title="title"
|
:visible.sync="open"
|
width="1200px"
|
append-to-body
|
>
|
<el-form
|
:model="queryParams"
|
ref="queryForm"
|
size="small"
|
:inline="true"
|
label-width="68px"
|
>
|
<el-form-item label="姓名" prop="name">
|
<el-input
|
v-model="queryParams.name"
|
placeholder="请输入姓名"
|
clearable
|
@keyup.enter.native="handleQuery"
|
style="width: 120px"
|
/>
|
</el-form-item>
|
<el-form-item label="手机号" prop="sjh">
|
<el-input
|
v-model="queryParams.sjh"
|
placeholder="请输入电话号"
|
clearable
|
@keyup.enter.native="handleQuery"
|
style="width: 130px"
|
/>
|
</el-form-item>
|
<el-form-item label="身份证号" prop="sfzh">
|
<el-input
|
v-model="queryParams.sfzh"
|
placeholder="请输入身份证号"
|
clearable
|
@keyup.enter.native="handleQuery"
|
style="width: 200px"
|
/>
|
</el-form-item>
|
<el-form-item>
|
<el-button
|
type="primary"
|
icon="el-icon-search"
|
size="mini"
|
@click="handleQuery"
|
>搜索</el-button
|
>
|
</el-form-item>
|
</el-form>
|
<el-table
|
:data="dataList"
|
ref="elTable"
|
v-loading="loading"
|
border
|
height="320px"
|
@selection-change="handleSelectionChange"
|
>
|
<el-table-column type="selection" width="40" align="center" />
|
<el-table-column label="姓名" prop="xm" align="center" />
|
<el-table-column label="性别" prop="xb" align="center" />
|
<el-table-column label="联系电话" prop="lxdh" align="center" />
|
<el-table-column label="身份证号" prop="sfzh" align="center" />
|
</el-table>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="open = false">取 消</el-button>
|
<el-button type="primary" @click="handleOk">确 定</el-button>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import { selectName } from "@/api/system/package";
|
import { getConfigKey } from "@/api/system/config";
|
export default {
|
name: "Packages",
|
props: {
|
baogao: {
|
type: Array,
|
},
|
},
|
data() {
|
return {
|
open: false,
|
// 弹出层标题
|
title: "",
|
dataList: [],
|
// 遮罩层
|
loading: false,
|
form: {
|
desc: "",
|
},
|
queryParams: {
|
name: "",
|
sjh: "",
|
sfzh: "",
|
},
|
list: [],
|
fList: {},
|
};
|
},
|
mounted() {
|
},
|
methods: {
|
handleOk() {
|
this.open = false
|
this.$emit('add', this.list);
|
},
|
handleQuery() {
|
this.getList();
|
},
|
handleSelectionChange(selection) {
|
if (selection.length > 1) {
|
// 如果选择了多行，保留最后一行
|
this.$refs.elTable.clearSelection(); // 清空所有选择
|
this.$refs.elTable.toggleRowSelection(selection[selection.length - 1]); // 重新选择最后一项
|
}
|
|
// 获取最后选择的行
|
this.list = [selection[selection.length - 1]];
|
console.log(this.list)
|
},
|
getList() {
|
this.loading = true;
|
selectName(this.queryParams).then((res) => {
|
if (res.data) {
|
this.dataList = res.data;
|
this.loading = false;
|
}
|
});
|
},
|
},
|
};
|
</script>
|
|
<style scoped></style>
|
