You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

190 lines
5.6 KiB

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="divBox">
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
<el-form-item>
<el-input v-model="dataForm.key" placeholder="查询参数" clearable></el-input>
</el-form-item>
<el-form-item>
<el-button @click="getDataList()">查询</el-button>
<el-button v-hasPermi="['autogencode:pmownerhouserel:save']" type="primary" @click="addOrUpdateHandle()">新增数据</el-button>
<el-button v-hasPermi="['autogencode:pmownerhouserel:delete']" type="danger" @click="deleteHandle()" :disabled="dataListSelections.length <= 0">批量删除</el-button>
</el-form-item>
</el-form>
<el-table
:data="dataList"
border
v-loading="dataListLoading"
@selection-change="selectionChangeHandle"
style="width: 100%;">
<el-table-column
type="selection"
header-align="center"
align="center"
width="50">
</el-table-column>
<el-table-column
prop="id"
header-align="center"
align="center"
label="id">
</el-table-column>
<el-table-column
prop="ownerId"
header-align="center"
align="center"
label="业主id">
</el-table-column>
<el-table-column
prop="houseId"
header-align="center"
align="center"
label="房屋id">
</el-table-column>
<el-table-column
prop="relType"
header-align="center"
align="center"
label="关联类型">
</el-table-column>
<el-table-column
prop="bindTime"
header-align="center"
align="center"
label="绑定时间">
</el-table-column>
<el-table-column
prop="unbindTime"
header-align="center"
align="center"
label="解绑时间">
</el-table-column>
<el-table-column
fixed="right"
header-align="center"
align="center"
width="150"
label="操作">
<template slot-scope="scope">
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
<el-button v-hasPermi="['autogencode:pmownerhouserel:delete']" type="text" size="small" @click="deleteHandle(scope.row.id)" style="color: #f56c6c;">删除</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
@size-change="sizeChangeHandle"
@current-change="currentChangeHandle"
:current-page="pageIndex"
:page-sizes="[10, 20, 50, 100]"
:page-size="pageSize"
:total="totalPage"
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
<!-- 表单弹窗, 新增数据和修改数据 -->
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
</div>
</template>
<script>
import AddOrUpdate from './pmownerhouserel-add-and-update'
import * as api from '@/api/pmownerhouserel.js'
export default {
data () {
return {
dataForm: {
key: ''
},
dataList: [],
pageIndex: 1,
pageSize: 10,
totalPage: 0,
dataListLoading: false,
dataListSelections: [],
addOrUpdateVisible: false
}
},
components: {
AddOrUpdate
},
activated () {
this.getDataList()
},
methods: {
// 获取数据列表
getDataList () {
this.dataListLoading = true
// 根据后端PmOwnerHouseRelController和PageParamRequest的期望格式构建参数
const params = {
page: this.pageIndex,
limit: this.pageSize
}
// 如果有搜索关键词尝试匹配PmOwnerHouseRel的关键字段
if (this.dataForm.key) {
// 可以根据实际需求调整这里假设key可能匹配多个字段
// 后端会自动处理这些参数并应用到LambdaQueryWrapper中
params.key = this.dataForm.key;
}
api.pmownerhouserelListApi(params).then(res => {
this.dataListLoading = false
this.dataList = res.list || [];
this.totalPage = res.total;
}).catch(e => {
this.dataListLoading = false
})
},
// 每页数
sizeChangeHandle (val) {
this.pageSize = val
this.pageIndex = 1
this.getDataList()
},
// 当前页
currentChangeHandle (val) {
this.pageIndex = val
this.getDataList()
},
// 多选
selectionChangeHandle (val) {
this.dataListSelections = val
},
// 新增 / 修改
addOrUpdateHandle (id) {
this.addOrUpdateVisible = true
this.$nextTick(() => {
this.$refs.addOrUpdate.init(id)
})
},
// 删除处理(支持单个删除和批量删除)
deleteHandle (id) {
let ids = []
let idText = ''
// 如果传入了单个id参数则为单个删除
if (id) {
ids = [id]
idText = id
} else {
// 否则为批量删除
ids = this.dataListSelections.map(item => {
return item.id
})
idText = ids.join(',')
}
this.$confirm(`确定进行删除操作?`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
// 调用批量删除API
api.pmownerhouserelDeleteApi(ids).then(res => {
this.$message.success('删除成功')
this.getDataList()
})
})
},
}
}
</script>