<template>
|
|
<div id="">
|
<el-card>
|
<el-form :inline="true" :model="formInline" class="demo-form-inline">
|
<el-row>
|
<el-col :span="4">
|
<el-form-item label="区域">
|
<el-cascader :options="options">
|
<template slot-scope="{ node, data }">
|
<span>{{ data.label }}</span>
|
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
|
</template>
|
</el-cascader>
|
</el-form-item>
|
</el-col>
|
|
<el-col :span="4">
|
<el-form-item label="姓名">
|
<el-input v-model="input" placeholder="请输入内容"></el-input>
|
</el-form-item>
|
</el-col>
|
|
<el-col :span="4">
|
<el-form-item label="身份证">
|
<el-input v-model="input" placeholder="请输入内容"></el-input>
|
</el-form-item>
|
</el-col>
|
|
<el-col :span="4">
|
<el-form-item label="手机">
|
<el-input v-model="input" placeholder="请输入内容"></el-input>
|
</el-form-item>
|
</el-col>
|
|
<el-col :span="4">
|
<el-form-item label="懂">
|
<el-input v-model="input" placeholder="请输入内容"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
|
<el-row>
|
<el-col span="5">
|
<el-form-item label="党员">
|
<el-cascader :options="options">
|
<template slot-scope="{ node, data }">
|
<span>{{ data.label }}</span>
|
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
|
</template>
|
</el-cascader>
|
</el-form-item>
|
</el-col>
|
|
<el-col span="5">
|
<el-form-item label="标签">
|
<el-cascader :options="options">
|
<template slot-scope="{ node, data }">
|
<span>{{ data.label }}</span>
|
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
|
</template>
|
</el-cascader>
|
</el-form-item>
|
</el-col>
|
|
<el-col span="2">
|
<el-button type="primary">导出数据<i class="el-icon-download el-icon--right"></i></el-button>
|
</el-col>
|
</el-row>
|
|
</el-form>
|
|
</el-card>
|
|
<el-card>
|
<div id="">
|
<el-table max-height="590" :data="tableData.data" border style="width: 100%"
|
@selection-change="handleSelectionChange">
|
<el-table-column type="selection" width="55">
|
</el-table-column>
|
<el-table-column fixed prop="id" label="ID" width="150">
|
</el-table-column>
|
<el-table-column prop="name" label="姓名" width="120">
|
</el-table-column>
|
<el-table-column prop="idCard" label="身份证号" width="220">
|
</el-table-column>
|
<el-table-column prop="phoneNumber" label="电话" width="120">
|
</el-table-column>
|
<el-table-column prop="gender" label="性别" width="120">
|
</el-table-column>
|
<el-table-column prop="relationship" label="关系" width="120">
|
</el-table-column>
|
<el-table-column prop="zip" label="小区" width="120">
|
</el-table-column>
|
<el-table-column prop="currentAddress" label="地址" width="120">
|
</el-table-column>
|
<el-table-column fixed="right" label="操作" width="300">
|
<template slot-scope="scope">
|
<el-button @click="handleClick(scope.row)" type="primary" size="small">同屋住户</el-button>
|
<el-button type="primary" size="small">编辑</el-button>
|
<el-button type="primary" size="small">标签</el-button>
|
<el-button type="danger" size="small">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
</el-card>
|
|
<div id="" style="margin-bottom: 50px;">
|
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
|
:current-page="tableFrom.current" :page-sizes="[10, 20, 30, 40]" :page-size="tableFrom.size"
|
layout="total, sizes, prev, pager, next, jumper" :total="tableData.total">
|
</el-pagination>
|
</div>
|
|
</div>
|
</template>
|
|
<script>
|
import {
|
getList,
|
getPageList,
|
remove,
|
add,
|
update,
|
getDetatil,
|
saveOrUpdateHouseLabel
|
} from "@/api/userHouse/list/houseHold.js";
|
export default {
|
data() {
|
return {
|
tableFrom: {
|
current: 1,
|
size: 10
|
},
|
tableData: {
|
data: [],
|
total: '',
|
}
|
}
|
},
|
created() {
|
this.getUserHouseList()
|
},
|
|
methods: {
|
handleSelectionChange(val) {
|
this.multipleSelection = val;
|
},
|
handleSizeChange(val) {
|
this.tableFrom.size = val
|
this.getUserHouseList()
|
console.log(`每页 ${val} 条`);
|
},
|
handleCurrentChange(val) {
|
this.tableFrom.current = val
|
this.getUserHouseList()
|
console.log(`当前页: ${val}`);
|
},
|
|
getUserHouseList() {
|
// console.log("*************************");
|
getList(this.tableFrom.current, this.tableFrom.size, this.tableFrom).then((res) => {
|
const data = res.data.data;
|
this.tableData.total = data.total;
|
this.tableData.data = data.records;
|
});
|
},
|
|
handleClick(row) {
|
console.log(row);
|
}
|
},
|
}
|
</script>
|
|
<style>
|
</style>
|
