220 lines
6.0 KiB
Vue
220 lines
6.0 KiB
Vue
<template>
|
||
<ai-list class="list">
|
||
<template slot="title">
|
||
<ai-title title="网格员管理" :isShowBottomBorder="true"></ai-title>
|
||
</template>
|
||
<template slot="content">
|
||
<ai-search-bar>
|
||
<template slot="left">
|
||
<el-date-picker
|
||
v-model="searchObj.selectionDate"
|
||
type="date"
|
||
@change="(page.current = 1), getList()"
|
||
value-format="yyyy-MM-dd"
|
||
size="small"
|
||
placeholder="选用时间"
|
||
>
|
||
</el-date-picker>
|
||
</template>
|
||
<template slot="right">
|
||
<el-input
|
||
v-model="searchObj.name"
|
||
size="small"
|
||
placeholder="网格员/网格名称"
|
||
@keyup.enter.native="(page.current = 1), getList()"
|
||
clearable
|
||
prefix-icon="iconfont iconSearch"
|
||
/>
|
||
<el-button
|
||
type="primary"
|
||
icon="iconfont iconSearch"
|
||
size="small"
|
||
@click="(page.current = 1), getList()"
|
||
>查询</el-button
|
||
>
|
||
<el-button
|
||
icon="el-icon-refresh-right"
|
||
size="small"
|
||
@click="resetSearch"
|
||
>重置</el-button
|
||
>
|
||
</template>
|
||
</ai-search-bar>
|
||
<ai-search-bar style="padding: 16px 0">
|
||
<template slot="left">
|
||
<el-button
|
||
icon="iconfont iconAdd"
|
||
type="primary"
|
||
size="small"
|
||
@click="add('')"
|
||
>添加</el-button
|
||
>
|
||
<el-button
|
||
icon="iconfont iconDelete"
|
||
@click="deleteById(ids.join(','))"
|
||
:disabled="!Boolean(ids.length)"
|
||
>删除</el-button
|
||
>
|
||
<!-- <ai-download :instance="instance" url="/app/appgirdinfo/downloadGirdInfo" :params="{...searchObj,ids}" fileName="网格区块">
|
||
<el-button icon="iconfont iconExported" size="small">导出全部</el-button>
|
||
</ai-download>
|
||
<ai-import
|
||
ref="import"
|
||
style="margin-top: -8px;"
|
||
title="导入"
|
||
name="网格区块"
|
||
url="/app/appgirdinfo/downloadGirdInfo"
|
||
importUrl="/app/appgirdinfo/importGirdInfo"
|
||
suffixName="xlsx"
|
||
:customCliker="true"
|
||
:instance="instance">
|
||
<template slot="tips">
|
||
<p>如果表格中已经存在数据，则会被本次导入的数据覆盖；不存在数据，系统将生成新的标准记录；</p>
|
||
</template>
|
||
<el-button size="small" icon="iconfont iconImport">导入</el-button>
|
||
</ai-import> -->
|
||
</template>
|
||
</ai-search-bar>
|
||
<ai-table
|
||
:tableData="tableData"
|
||
:col-configs="colConfigs"
|
||
:total="page.total"
|
||
ref="aitableex"
|
||
:current.sync="page.current"
|
||
:size.sync="page.size"
|
||
@selection-change="(v) => (ids = v.map((e) => e.id))"
|
||
@getList="getList()"
|
||
>
|
||
<el-table-column label="操作" slot="options" align="center">
|
||
<template v-slot="{ row }">
|
||
<el-button type="text" @click="add(row.id)">查看</el-button>
|
||
<el-button type="text" @click="deleteById(row.id)">删除</el-button>
|
||
</template>
|
||
</el-table-column>
|
||
</ai-table>
|
||
</template>
|
||
</ai-list>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: "list",
|
||
label: "网格员管理",
|
||
props: {
|
||
instance: Function,
|
||
dict: Object,
|
||
permissions: Function,
|
||
},
|
||
data() {
|
||
return {
|
||
searchObj: {
|
||
name: "",
|
||
selectionDate: "",
|
||
},
|
||
page: {
|
||
current: 1,
|
||
size: 10,
|
||
total: 0,
|
||
},
|
||
goAdd: false,
|
||
tableData: [],
|
||
fileList: [],
|
||
ids: [],
|
||
detail: {},
|
||
};
|
||
},
|
||
created() {
|
||
this.dict.load("sex", "girdMemberType", "politicsStatus", "education");
|
||
this.getList();
|
||
},
|
||
computed: {
|
||
colConfigs() {
|
||
let _ = this;
|
||
return [
|
||
{
|
||
type: "selection",
|
||
},
|
||
{
|
||
prop: "name",
|
||
align: "center",
|
||
label: "网格员姓名",
|
||
},
|
||
{
|
||
prop: "girdInfoListStr",
|
||
align: "left",
|
||
label: "责任网格",
|
||
},
|
||
{
|
||
prop: "phone",
|
||
align: "left",
|
||
label: "联系电话",
|
||
},
|
||
{
|
||
prop: "selectionDate",
|
||
align: "center",
|
||
label: "选用时间",
|
||
},
|
||
];
|
||
},
|
||
},
|
||
methods: {
|
||
getList() {
|
||
this.instance
|
||
.post("/app/appgirdmemberinfo/list", null, {
|
||
params: {
|
||
...this.searchObj,
|
||
...this.page,
|
||
},
|
||
})
|
||
.then((res) => {
|
||
if (res.code == 0) {
|
||
this.tableData = res.data.records;
|
||
this.page.total = res.data.total;
|
||
}
|
||
});
|
||
},
|
||
deleteById(ids) {
|
||
ids &&
|
||
this.$confirm("是否要删除该网格员？", {
|
||
type: "error",
|
||
})
|
||
.then(() => {
|
||
this.instance
|
||
.post("/app/appgirdmemberinfo/delete", null, {
|
||
params: { ids },
|
||
})
|
||
.then((res) => {
|
||
if (res?.code == 0) {
|
||
this.$message.success("删除成功!");
|
||
this.getList();
|
||
}
|
||
});
|
||
})
|
||
.catch(() => {});
|
||
},
|
||
add(id) {
|
||
this.$emit('change', {
|
||
type: 'Add',
|
||
params: {
|
||
id: id || ''
|
||
}
|
||
})
|
||
},
|
||
handleSelectionChange(val) {
|
||
this.ids = [];
|
||
val.map((e) => {
|
||
this.ids.push(e.id);
|
||
});
|
||
},
|
||
resetSearch() {
|
||
Object.keys(this.searchObj).map((e) => {
|
||
this.searchObj[e] = "";
|
||
});
|
||
this.getList();
|
||
},
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
</style> |