<template>
|
<div class="app-container">
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true">
|
<el-form-item label="拆迁项目" prop="projectName">
|
<el-input v-model="queryParams.projectName" placeholder="请输入" clearable style="width: 240px"
|
@keyup.enter.native="handleQuery" />
|
</el-form-item>
|
<el-form-item label="镇街" prop="street">
|
<el-select v-model="queryParams.street" placeholder="请选择" style="width: 240px">
|
<el-option v-for="item in streetOptions" :key="item.dictCode" :label="item.dictLabel"
|
:value="item.dictLabel" />
|
</el-select>
|
</el-form-item>
|
<el-form-item label="所属村(社区)" prop="community">
|
<el-input v-model="queryParams.community" placeholder="请输入" clearable style="width: 240px"
|
@keyup.enter.native="handleQuery" />
|
</el-form-item>
|
<el-form-item label="户主姓名/身份证号" prop="headOrIdCard">
|
<el-input v-model="queryParams.headOrIdCard" placeholder="请输入" clearable style="width: 240px"
|
@keyup.enter.native="handleQuery" />
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">搜索</el-button>
|
<el-button icon="el-icon-refresh" size="small" @click="resetQuery">重置</el-button>
|
</el-form-item>
|
</el-form>
|
|
<el-row :gutter="10" class="mb8">
|
<el-col :span="1.5">
|
<el-button type="primary" size="small" @click="handleAdd"
|
v-hasPermi="['RelocatablePersonnel:Add']">新增待安置人员</el-button>
|
</el-col>
|
<el-col :span="1.5">
|
<el-button type="success" size="small" @click="download"
|
v-hasPermi="['RelocatablePersonnel:download']">下载导入模板</el-button>
|
</el-col>
|
<el-col :span="1.5">
|
<el-upload v-hasPermi="['RelocatablePersonnel:import']" action="#" :auto-upload="false"
|
accept=".xlsx,.xls" :show-file-list="false" :on-change="handleFileChange" :limit="1"
|
:before-upload="beforeImportUpload">
|
<el-button type="primary" size="small">批量导入</el-button>
|
</el-upload>
|
</el-col>
|
</el-row>
|
|
<el-table v-loading="loading" :data="listData">
|
<el-table-column label="序号" type="index" width="50" />
|
<el-table-column label="项目名称" prop="projectName" :show-overflow-tooltip="true" width="120" />
|
<el-table-column label="项目启动时间" prop="startTime" width="150" />
|
<el-table-column label="镇街" prop="street" :show-overflow-tooltip="true" width="150" />
|
<el-table-column label="村社区" prop="community" width="100" />
|
<el-table-column label="组" prop="groupName" width="100" />
|
<el-table-column label="户主姓名" prop="householdHead" />
|
<el-table-column label="户主身份证号码" prop="idCard" width="180" />
|
<el-table-column label="家庭成员名字" prop="familyName" width="100" />
|
<el-table-column label="关系" prop="relation" />
|
<el-table-column label="人员性质" prop="personType" width="180" />
|
<el-table-column label="身份证号码" prop="familyIdCard" width="180" />
|
<el-table-column label="年龄" prop="age" />
|
<el-table-column label="性别" prop="sex" />
|
<el-table-column label="出生年月日" prop="birthday" width="100">
|
<template slot-scope="{row}">
|
{{ row.birthday ? parseTime(row.birthday, '{y}-{m}-{d}') : '' }}
|
</template>
|
</el-table-column>
|
<el-table-column label="安置方式" prop="ways" width="100" />
|
<el-table-column label="原始拆迁时领取过渡费时间" prop="originCollectionTime" width="180" />
|
<el-table-column label="上次过渡费发放时间(起)" prop="lastBeginTime" width="180" />
|
<el-table-column label="上次过渡费发放时间(止)" prop="lastEndTime" width="180" />
|
<el-table-column label="剩余未安置面积(㎡)" prop="noHouseArea" width="160" />
|
<el-table-column label="剩余未安置商铺面积(㎡)" prop="noShopArea" width="160" />
|
<el-table-column label="联系电话" prop="mobile" width="100" />
|
<el-table-column label="备注" prop="remark" :show-overflow-tooltip="true" width="180" />
|
<el-table-column label="安置状态" fixed="right" prop="status">
|
<template slot-scope="{row}">
|
<el-tag :type="row.status == 1 ? 'success' : 'danger'">
|
{{ row.status == 1 ? '已安置' : '未安置' }}
|
</el-tag>
|
</template>
|
</el-table-column>
|
<el-table-column label="操作" fixed="right" width="180">
|
<template slot-scope="{row}">
|
<el-button size="small" type="text" @click="handleUpdate(row, 'view')"
|
v-hasPermi="['RelocatablePersonnel:Detail']">详情</el-button>
|
<el-button size="small" type="text" @click="handleUpdate(row, 'edit')"
|
v-hasPermi="['RelocatablePersonnel:Edit']">修改</el-button>
|
<el-button size="small" type="text" @click="handleDelete(row)"
|
v-hasPermi="['RelocatablePersonnel:del']">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
|
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
|
:limit.sync="queryParams.pageSize" @pagination="getList" />
|
</div>
|
</template>
|
|
<script>
|
import { getListData, del, getDictData, importPlacement } from "@/api/placement";
|
import { getToken } from '@/utils/auth'
|
import { downLoad } from '@/utils'
|
|
export default {
|
name: "RelocatablePersonnel",
|
data() {
|
return {
|
// 遮罩层
|
loading: true,
|
// 角色列表
|
listData: [],
|
// 总条数
|
total: 0,
|
// 查询参数
|
queryParams: {
|
pageNum: 1,
|
pageSize: 10,
|
headOrIdCard: undefined,
|
projectName: undefined,
|
street: undefined,
|
community: undefined
|
},
|
headers: {
|
'Authorization': 'Bearer ' + getToken(),
|
},
|
streetOptions: [],
|
};
|
},
|
created() {
|
// 镇（街道）
|
getDictData('street').then(response => {
|
this.streetOptions = response.data
|
})
|
this.getList();
|
},
|
methods: {
|
/** 查询角色列表 */
|
getList() {
|
this.loading = true;
|
getListData(this.queryParams).then(response => {
|
this.listData = response.data.records;
|
this.total = response.data.total;
|
this.loading = false;
|
});
|
},
|
/** 搜索按钮操作 */
|
handleQuery() {
|
this.queryParams.pageNum = 1;
|
this.getList();
|
},
|
/** 重置按钮操作 */
|
resetQuery() {
|
this.dateRange = [];
|
this.resetForm("queryForm");
|
this.handleQuery();
|
},
|
/** 下载模板 */
|
download() {
|
downLoad('/placement/download-template', '待安置人员导入模板.xlsx')
|
},
|
/** 新增按钮操作 */
|
handleAdd() {
|
this.$router.push('add')
|
},
|
/** 修改按钮操作 */
|
handleUpdate(row, type) {
|
this.$router.push({ path: type === 'view' ? 'detail' : 'edit', query: { id: row.id, type } })
|
},
|
/** 删除按钮操作 */
|
handleDelete(row) {
|
this.$modal.confirm('是否确认删除').then(() => {
|
return del({ id: row.id });
|
}).then(() => {
|
this.getList();
|
this.$modal.msgSuccess("删除成功");
|
}).catch(() => { });
|
},
|
handleFileChange(file, fileList) {
|
let formData = new FormData()
|
formData.append('file', file.raw)
|
importPlacement(formData).then(response => {
|
if (response.code == 200) {
|
this.$message.success('导入成功');
|
this.getList();
|
}
|
})
|
},
|
handleImportError(error, file, fileList) {
|
this.$message.error('导入失败');
|
},
|
beforeImportUpload(file) {
|
const isExcel = file.type === 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet';
|
if (!isExcel) {
|
this.$message.error('请上传xlsx文件');
|
}
|
return isExcel;
|
},
|
}
|
};
|
</script>
|
