index.vue 3.93 KB
<template>
	<div class="main">
		<SearchHead @getSearchCondition="getData"></SearchHead>
		<div class="dataGrid" ref="dataGrid">
			<el-table
				:data="tableData"
				:height="tableHeight"
				:row-class-name="tableRowClassName"
			>
				<el-table-column type="index" width="80" align="center" label="序号">
				</el-table-column>
				<el-table-column label="操作" width="100">
					<template slot-scope="scope">
						<el-button @click="handleClick(scope.row)" type="text" size="small"
							>办理</el-button
						>
						<el-button type="text" size="small">定位</el-button>
					</template>
				</el-table-column>
				<el-table-column prop="bdcdyh" align="left" label="不动产单元号">
				</el-table-column>
				<el-table-column prop="xmmc" align="left" width="150" label="项目名称">
				</el-table-column>
				<el-table-column prop="bdcqzh" align="left" label="不动产权证号">
				</el-table-column>
				<el-table-column prop="lx" align="left" width="120" label="类型">
				</el-table-column>
				<el-table-column prop="qlr" align="left" width="120" label="权利人">
				</el-table-column>
				<el-table-column prop="zl" align="left" label="坐落"> </el-table-column>
				<el-table-column prop="zrsj" align="left" width="120" label="转入时间">
				</el-table-column>
				<el-table-column prop="cjr" align="left" width="120" label="创建人">
				</el-table-column>
			</el-table>
			<div class="pagination">
				<el-pagination background layout="prev, pager, next" :total="1000">
				</el-pagination>
			</div>
		</div>
	</div>
</template>

<script>
import SearchHead from "../../../components/searchHead/searchHead";
import {getSearchList} from "../../../api/search";
export default {
	name: "",
	components: { SearchHead },
	props: {},
	data() {
		return {
			formData: {
				user: "",
				region: "",
				type: [],
			},
			tableData: [
				// {
				// 	bdcdyh: "610101001001GB00001W",
				// 	xmmc: "万科集团万科城",
				// 	bdcqzh: "陕(2017)西安市不动产权第00000",
				// 	lx: "宗地",
				// 	qlr: "李子新",
				// 	zl: "灞桥-田家湾-咸宁东路,近浐河西路",
				// 	zrsj: "2020.09.07 ",
				// 	cjr: "李子新",
				// },
			],
			tableHeight: "",
		};
	},
	created() {},
	mounted() {
		getSearchList().then((res)=>{
			console.log(res)
			if(res.code===200){
				this.tableData=res.result.records;
				console.log(this.tableData)
			}
		})
		// for (let i = 0; i < 11; i++) {
		// 	let obj = {
		// 		bdcdyh: "610101001001GB00001W",
		// 		xmmc: "万科集团万科城",
		// 		bdcqzh: "陕(2017)西安市不动产权第00000",
		// 		lx: "自然幢",
		// 		qlr: "李子新",
		// 		zl: "灞桥-田家湾-咸宁东路,近浐河西路",
		// 		zrsj: "2020.09.07 ",
		// 		cjr: "李子新",
		// 	};
		// 	this.tableData.push(obj);
		// }
		this.tableHeight = this.$refs.dataGrid.offsetHeight - 68;
	},
	methods: {
		onSubmit() {},
		tableRowClassName({ row, rowIndex }) {
			if (rowIndex % 2 !== 0) {
				return "even-row";
			} else {
				return "";
			}
		},

		//获取子组件点击查询触发的事件
		getData(obj) {
			console.log(obj);
			//将obj作为参数调用接口查询表格数据
		},
		//点击办理
		handleClick(row) {
			let path = "";
			switch (row.dylx) {
				case "zrz":
					path = "/zrz";
					break;
				case "zd":
					path = "/zd";
					break;
				default:
					break;
			}
			this.$router.push({
				path:path,
				query:{
					bsm:row.glbsm,
					source:2
				}
			});
		},
	},
	computed: {},
	watch: {},
};
</script>
<style scoped lang="less">
.main {
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	padding: 0 18px;
	display: flex;
	flex-direction: column;
	background-color: #fcfdff;
	.demo-form-inline {
		margin-top: 18px;
		.moreSearchBtn {
			background-color: #1ad6e1;
			border-color: #1ad6e1;
		}
		.moreSearchBtn:focus,
		.moreSearchBtn:hover {
			background-color: rgba(28, 200, 229, 0.6);
		}
	}
	.dataGrid {
		flex: 1;
		.pagination {
			padding: 18px 0;
		}
	}
}
</style>