changeAdmin.vue
3.12 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
<script setup lang="ts">
import { reactive, onMounted, ref, getCurrentInstance, defineProps } from "vue";
import { getTableList } from "@/api/housekeeper/buildinMganager.ts";
import { addOrUpBuildingHouseKeeper } from "@/api/community/housekeeper.ts";
import Pagination from "@/components/Pagination/index.vue";
let instance: ComponentInternalInstance | null = getCurrentInstance(); //获取app实例
// 声明props
const props = defineProps({
buildingId: {
type: Number,
default: null,
},
originalIds: {
type: Number,
default: null,
},
});
// 数据筛选
const searchData = reactive({
condition: "",
page: 1,
pageSize: 10,
});
// 展示
const data = reactive({
total: 0,
tableList: [],
loading: false,
options: [
{ label: "选举", value: 0 },
{ label: "派驻", value: 1 },
],
selectList: []
});
/**
* 列表查询
*/
const search = (): void => {
data.loading = true;
getTableList(searchData)
.then((res) => {
console.log(res);
data.tableList = res.data.data;
data.total = res.data.data.length;
data.loading = false;
})
.catch((err) => {
console.log(err);
data.loading = false;
});
};
/**
* 表格选择回调
*/
const handleSelectionChange = (val:Array) => {
data.selectList=val.map((val: any) =>{
return val.id
})
}
const submit=()=>{
console.log(data.selectList.length)
if(data.selectList.length==0){
instance?.proxy?.$message.error('请选择新的楼管')
}else{
addOrUpBuildingHouseKeeper({buildingId:props.buildingId,houseKeeperIds:data.selectList[0],originalIds:props.originalIds}).then((res)=>{
console.log(res)
})
}
}
onMounted(() => {
search();
});
</script>
<template>
<div>
<!-- 搜索 -->
<el-form :inline="true" :model="searchData" v-loading="data.loading">
<el-form-item>
<el-input
style="width: 280px"
placeholder="请输入姓名/手机号/身份证号"
v-model="searchData.condition"
clearable
></el-input>
</el-form-item>
<el-form-item
><el-button type="primary" @click="search"
>查询</el-button
></el-form-item
>
<el-form-item
><el-button type="primary" @click="submit"
>确认选择</el-button
></el-form-item
>
</el-form>
<!-- 表格 -->
<el-table border :data="data.tableList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55"/>
<el-table-column label="姓名" prop="name"></el-table-column>
<el-table-column label="手机号" prop="mobile"></el-table-column>
<el-table-column label="身份证号" prop="idcard"></el-table-column>
<el-table-column label="类型">
<template #default="scope">
<span>{{ scope.row.type == 0 ? "选举" : "派驻" }}</span></template
>
</el-table-column>
</el-table>
<!-- 分页 -->
<Pagination
v-if="data.total > 0"
:total="data.total"
:currentPage="searchData.pageNum"
:pageSize="searchData.pageSize"
@pageChange="search"
></Pagination>
</div>
</template>
<style></style>