tianq
2 years ago
3 changed files with 607 additions and 604 deletions
@ -1,71 +1,122 @@ |
|||
<template> |
|||
<div> |
|||
<div class="dialog-h-content scroll-h"> |
|||
|
|||
<div |
|||
class="m-row"> |
|||
<div class="m-info"> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">物业名称</span> |
|||
<span>{{ villageList.name|| "--" }}</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
</div> |
|||
<div class="div-btn"> |
|||
<el-button size="small" |
|||
@click="handleCancle">关 闭</el-button> |
|||
|
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapGetters } from "vuex"; |
|||
import { requestPost } from "@/js/dai/request"; |
|||
import fileList from '@/views/components/fileList' |
|||
|
|||
export default { |
|||
props: { |
|||
formId: { |
|||
type: String, |
|||
default: "", |
|||
}, |
|||
villageList:{ |
|||
type:Object, |
|||
default:()=>{} |
|||
} |
|||
}, |
|||
|
|||
data () { |
|||
return { |
|||
|
|||
customerId: localStorage.getItem("customerId"), |
|||
|
|||
initLoading: false, |
|||
|
|||
fmData: {}, |
|||
|
|||
|
|||
}; |
|||
}, |
|||
components: { fileList }, |
|||
computed: { |
|||
|
|||
}, |
|||
watch: {}, |
|||
|
|||
methods: { |
|||
|
|||
handleCancle () { |
|||
this.$emit("diaDetailClose"); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped > |
|||
@import "@/assets/scss/modules/management/detail-main.scss"; |
|||
</style> |
|||
|
|||
<div> |
|||
<div class="dialog-h-content scroll-h"> |
|||
<div class="m-row"> |
|||
<div class="m-info"> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">物业名称</span> |
|||
<span>{{ villageList.name || '--' }}</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="m-row"> |
|||
<div class="m-info"> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">物业联系人</span> |
|||
<span>{{ villageList.contactName || '--' }}</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="m-row"> |
|||
<div class="m-info"> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">联系电话</span> |
|||
<span>{{ villageList.contactMobile || '--' }}</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<!-- 物业公司 这个不一定 物业联系人 tianqian 联系电话 --> |
|||
<!-- <div class="m-row"> |
|||
<div class="m-info"> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">联系电话</span> |
|||
<span>{{ villageList.name || '--' }}</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="m-row"> |
|||
<div class="m-info"> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">证件号</span> |
|||
<span>{{ villageList.name || '--' }}</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="m-row"> |
|||
<div class="m-info"> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">类型</span> |
|||
<span>{{ villageList.name || '--' }}</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="m-row"> |
|||
<div class="m-info"> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">所属组织</span> |
|||
<span>{{ villageList.name || '--' }}</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="m-row"> |
|||
<div class="m-info"> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">楼栋</span> |
|||
<span>{{ villageList.name || '--' }}</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="m-row"> |
|||
<div class="m-info"> |
|||
<div class="info-prop"> |
|||
<span class="info-title-2">单元</span> |
|||
<span>{{ villageList.name || '--' }}</span> |
|||
</div> |
|||
</div> |
|||
</div> --> |
|||
</div> |
|||
<div class="div-btn"><el-button size="small" @click="handleCancle">关 闭</el-button></div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapGetters } from 'vuex'; |
|||
import { requestPost } from '@/js/dai/request'; |
|||
import fileList from '@/views/components/fileList'; |
|||
|
|||
export default { |
|||
props: { |
|||
formId: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
villageList: { |
|||
type: Object, |
|||
default: () => {} |
|||
} |
|||
}, |
|||
|
|||
data() { |
|||
return { |
|||
customerId: localStorage.getItem('customerId'), |
|||
|
|||
initLoading: false, |
|||
|
|||
fmData: {} |
|||
}; |
|||
}, |
|||
components: { fileList }, |
|||
computed: {}, |
|||
watch: {}, |
|||
|
|||
methods: { |
|||
handleCancle() { |
|||
this.$emit('diaDetailClose'); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import '@/assets/scss/modules/management/detail-main.scss'; |
|||
</style> |
|||
|
|||
@ -1,205 +1,208 @@ |
|||
<template> |
|||
<div> |
|||
<div class="dialog-h-content scroll-h"> |
|||
<el-form |
|||
ref="ref_form" |
|||
:inline="true" |
|||
:model="fmData" |
|||
:rules="dataRule" |
|||
:disabled="formType === 'watch'" |
|||
class="form" |
|||
> |
|||
<el-form-item |
|||
label="物业名称" |
|||
prop="name" |
|||
label-width="150px" |
|||
style="display: block" |
|||
> |
|||
<el-input |
|||
v-if="formType == 'add' || formType == 'edit'" |
|||
class="item_width_1" |
|||
show-word-limit |
|||
placeholder="请输入物业名称" |
|||
v-model="fmData.name" |
|||
> |
|||
</el-input> |
|||
<div style="width:610px" v-else>{{ fmData.serviceName || "--" }}</div> |
|||
</el-form-item> |
|||
|
|||
</el-form> |
|||
</div> |
|||
|
|||
<div class="div_btn resi-btns"> |
|||
<el-button size="small" @click="handleCancle">取 消</el-button> |
|||
<el-button |
|||
v-if="formType != 'watch'" |
|||
type="primary" |
|||
size="small" |
|||
:disabled="btnDisable" |
|||
@click="handleComfirm" |
|||
>确 定</el-button |
|||
> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapGetters } from "vuex"; |
|||
import { requestPost } from "@/js/dai/request"; |
|||
import formVltHelper from "dai-js/tools/formVltHelper"; |
|||
|
|||
export default { |
|||
props: { |
|||
formId: { |
|||
type: String, |
|||
default: "", |
|||
}, |
|||
formType: { |
|||
type: String, |
|||
default: "info", |
|||
}, |
|||
villageList: { |
|||
type: Object, |
|||
default: {}, |
|||
}, |
|||
}, |
|||
|
|||
data() { |
|||
return { |
|||
uploadUrl: window.SITE_CONFIG["apiURL"] + "/oss/file/uploadqrcodeV2", |
|||
customerId: localStorage.getItem("customerId"), |
|||
|
|||
btnDisable: false, |
|||
|
|||
fmData: { |
|||
name:"" |
|||
}, |
|||
|
|||
levelOptions: [ |
|||
{ |
|||
value: "0", |
|||
label: "市级", |
|||
}, |
|||
{ |
|||
value: "1", |
|||
label: "区级", |
|||
}, |
|||
{ |
|||
value: "2", |
|||
label: "街道级", |
|||
}, |
|||
], |
|||
categoryOptions: [], |
|||
}; |
|||
}, |
|||
components: {}, |
|||
computed: { |
|||
dataRule() { |
|||
return { |
|||
name: [ |
|||
{ required: true, message: "物业名字不能为空", trigger: "blur" }, |
|||
], |
|||
}; |
|||
}, |
|||
}, |
|||
watch: {}, |
|||
|
|||
async mounted() { |
|||
this.initForm(); |
|||
}, |
|||
|
|||
methods: { |
|||
async initForm() { |
|||
if ( this.formType != "add") { |
|||
this.getInfo(); |
|||
} |
|||
}, |
|||
|
|||
async getInfo() { |
|||
this.fmData.name = this.villageList.name |
|||
}, |
|||
|
|||
async handleComfirm() { |
|||
this.btnDisable = true; |
|||
setTimeout(() => { |
|||
this.btnDisable = false; |
|||
}, 10000); |
|||
this.$refs["ref_form"].validate((valid, messageObj) => { |
|||
if (!valid) { |
|||
app.util.validateRule(messageObj); |
|||
this.btnDisable = false; |
|||
} else { |
|||
this.submit(); |
|||
} |
|||
}); |
|||
}, |
|||
|
|||
async submit() { |
|||
let url = ""; |
|||
let params = { ...this.fmData }; |
|||
if (this.formType === "add") { |
|||
url = "/gov/org/propertymanagement/add"; |
|||
} else { |
|||
url = "/gov/org/propertymanagement/update"; |
|||
this.$set(params,"id", this.villageList.id) |
|||
} |
|||
const { data, code, msg } = await requestPost(url, params); |
|||
|
|||
if (code === 0) { |
|||
this.$message({ |
|||
type: "success", |
|||
message: "操作成功", |
|||
}); |
|||
this.$emit("afterEdit"); |
|||
this.btnDisable = false; |
|||
} else { |
|||
this.btnDisable = false; |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
handleCancle() { |
|||
this.$emit("close"); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.item_width_1 { |
|||
width: 500px; |
|||
} |
|||
.item_width_2 { |
|||
width: 400px; |
|||
} |
|||
.item_width_3 { |
|||
margin-left: 10px; |
|||
width: 200px; |
|||
} |
|||
.item_width_4 { |
|||
width: 200px; |
|||
} |
|||
|
|||
.div_map { |
|||
margin-top: 10px; |
|||
} |
|||
|
|||
.div_btn { |
|||
// display: flex; |
|||
// justify-content: flex-end; |
|||
} |
|||
.el-tabs { |
|||
margin: 0 20px; |
|||
} |
|||
.el-upload__tip { |
|||
color: rgb(155, 155, 155); |
|||
margin: 0; |
|||
} |
|||
.form { |
|||
margin-top: 30px; |
|||
} |
|||
|
|||
.attachement-list { |
|||
} |
|||
</style> |
|||
|
|||
<div> |
|||
<div class="dialog-h-content scroll-h"> |
|||
<!-- 姓名 联系电话 证件号 类型 所属组织 楼栋 单元 tianqian --> |
|||
<!-- 物业公司 这个不一定 物业联系人 tianqian 联系电话 --> |
|||
<el-form ref="ref_form" :inline="true" :model="fmData" :rules="dataRule" :disabled="formType === 'watch'" class="form"> |
|||
<el-form-item label="物业名称" prop="name" label-width="150px" style="display: block"> |
|||
<el-input v-model="fmData.name" class="item_width_2" size="small" clearable placeholder="请输入"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="物业联系人" prop="contactName" label-width="150px" style="display: block"> |
|||
<el-input v-model="fmData.contactName" class="item_width_2" size="small" clearable placeholder="请输入"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="联系电话" prop="contactMobile" label-width="150px" style="display: block"> |
|||
<el-input v-model="fmData.contactMobile" class="item_width_2" size="small" clearable placeholder="请输入"></el-input> |
|||
</el-form-item> |
|||
<!-- <el-form-item label="姓名" prop="name" label-width="150px" style="display: block"> |
|||
<el-input v-model="fmData.name" class="item_width_2" size="small" clearable placeholder="请输入"></el-input> |
|||
</el-form-item> |
|||
|
|||
<el-form-item label="联系电话" prop="serviceContent"> |
|||
<el-input v-model="fmData.name" class="item_width_2" size="small" clearable placeholder="请输入"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="证件号" prop="serviceContent"> |
|||
<el-input v-model="fmData.name" class="item_width_2" size="small" clearable placeholder="请输入"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="类型" prop="serviceContent"> |
|||
<el-input v-model="fmData.name" class="item_width_2" size="small" clearable placeholder="请输入"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="所属组织" prop="serviceContent"> |
|||
<el-input v-model="fmData.name" class="item_width_2" size="small" clearable placeholder="请输入"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="楼栋" prop="serviceContent"> |
|||
<el-input v-model="fmData.name" class="item_width_2" size="small" clearable placeholder="请输入"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="单元" prop="serviceContent"> |
|||
<el-input v-model="fmData.name" class="item_width_2" size="small" clearable placeholder="请输入"></el-input> |
|||
</el-form-item> --> |
|||
</el-form> |
|||
</div> |
|||
|
|||
<div class="div_btn resi-btns"> |
|||
<el-button size="small" @click="handleCancle">取 消</el-button> |
|||
<el-button v-if="formType != 'watch'" type="primary" size="small" :disabled="btnDisable" @click="handleComfirm">确 定</el-button> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapGetters } from 'vuex'; |
|||
import { requestPost } from '@/js/dai/request'; |
|||
import formVltHelper from 'dai-js/tools/formVltHelper'; |
|||
|
|||
export default { |
|||
props: { |
|||
formId: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
formType: { |
|||
type: String, |
|||
default: 'info' |
|||
}, |
|||
villageList: { |
|||
type: Object, |
|||
default: {} |
|||
} |
|||
}, |
|||
|
|||
data() { |
|||
return { |
|||
uploadUrl: window.SITE_CONFIG['apiURL'] + '/oss/file/uploadqrcodeV2', |
|||
customerId: localStorage.getItem('customerId'), |
|||
|
|||
btnDisable: false, |
|||
|
|||
fmData: { |
|||
name: '', |
|||
contactName: '', |
|||
contactMobile: '', |
|||
}, |
|||
|
|||
levelOptions: [ |
|||
{ |
|||
value: '0', |
|||
label: '市级' |
|||
}, |
|||
{ |
|||
value: '1', |
|||
label: '区级' |
|||
}, |
|||
{ |
|||
value: '2', |
|||
label: '街道级' |
|||
} |
|||
], |
|||
categoryOptions: [] |
|||
}; |
|||
}, |
|||
components: {}, |
|||
computed: { |
|||
dataRule() { |
|||
return { |
|||
name: [{ required: true, message: '物业名字不能为空', trigger: 'blur' }] |
|||
}; |
|||
} |
|||
}, |
|||
watch: {}, |
|||
|
|||
async mounted() { |
|||
this.initForm(); |
|||
}, |
|||
|
|||
methods: { |
|||
async initForm() { |
|||
if (this.formType != 'add') { |
|||
this.getInfo(); |
|||
} |
|||
}, |
|||
|
|||
async getInfo() { |
|||
this.fmData.name = this.villageList.name; |
|||
this.fmData.contactName = this.villageList.contactName; |
|||
this.fmData.contactMobile = this.villageList.contactMobile; |
|||
}, |
|||
|
|||
async handleComfirm() { |
|||
this.btnDisable = true; |
|||
setTimeout(() => { |
|||
this.btnDisable = false; |
|||
}, 10000); |
|||
this.$refs['ref_form'].validate((valid, messageObj) => { |
|||
if (!valid) { |
|||
app.util.validateRule(messageObj); |
|||
this.btnDisable = false; |
|||
} else { |
|||
this.submit(); |
|||
} |
|||
}); |
|||
}, |
|||
|
|||
async submit() { |
|||
let url = ''; |
|||
let params = { ...this.fmData }; |
|||
if (this.formType === 'add') { |
|||
url = '/gov/org/propertymanagement/add'; |
|||
} else { |
|||
url = '/gov/org/propertymanagement/update'; |
|||
this.$set(params, 'id', this.villageList.id); |
|||
} |
|||
const { data, code, msg } = await requestPost(url, params); |
|||
|
|||
if (code === 0) { |
|||
this.$message({ |
|||
type: 'success', |
|||
message: '操作成功' |
|||
}); |
|||
this.$emit('afterEdit'); |
|||
this.btnDisable = false; |
|||
} else { |
|||
this.btnDisable = false; |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
handleCancle() { |
|||
this.$emit('close'); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.item_width_1 { |
|||
width: 500px; |
|||
} |
|||
.item_width_2 { |
|||
width: 400px; |
|||
} |
|||
.item_width_3 { |
|||
margin-left: 10px; |
|||
width: 200px; |
|||
} |
|||
.item_width_4 { |
|||
width: 200px; |
|||
} |
|||
|
|||
.div_map { |
|||
margin-top: 10px; |
|||
} |
|||
|
|||
.div_btn { |
|||
// display: flex; |
|||
// justify-content: flex-end; |
|||
} |
|||
.el-tabs { |
|||
margin: 0 20px; |
|||
} |
|||
.el-upload__tip { |
|||
color: rgb(155, 155, 155); |
|||
margin: 0; |
|||
} |
|||
.form { |
|||
margin-top: 30px; |
|||
} |
|||
|
|||
.attachement-list { |
|||
} |
|||
</style> |
|||
|
|||
@ -1,336 +1,285 @@ |
|||
<template> |
|||
<div class="div_main"> |
|||
<div v-show="true"> |
|||
<div class="div_search"> |
|||
<el-form :inline="true" |
|||
:model="searchData" |
|||
ref="ref_searchform" |
|||
:label-width="'80px'"> |
|||
<div> |
|||
<el-form-item label="物业名称" |
|||
prop="serviceContent"> |
|||
<el-input v-model="searchData.name" |
|||
class="item_width_2" |
|||
size="small" |
|||
clearable |
|||
placeholder="请输入"> |
|||
</el-input> |
|||
</el-form-item> |
|||
|
|||
|
|||
|
|||
<el-button style="margin-left: 30px" |
|||
size="small" |
|||
class="diy-button--search" |
|||
@click="handleSearch">查询</el-button> |
|||
<el-button style="margin-left: 10px" |
|||
size="small" |
|||
class="diy-button--reset" |
|||
@click="resetSearch">重置</el-button> |
|||
</div> |
|||
</el-form> |
|||
</div> |
|||
|
|||
<div class="div_table"> |
|||
<div class="div_btn"> |
|||
<el-button class="diy-button--add" |
|||
size="small" |
|||
@click="handleAdd">新增</el-button> |
|||
|
|||
<!-- <el-button |
|||
<div class="div_main"> |
|||
<div v-show="true"> |
|||
<div class="div_search"> |
|||
<el-form :inline="true" :model="searchData" ref="ref_searchform" :label-width="'80px'"> |
|||
<div> |
|||
<el-form-item label="物业名称" prop="name"> |
|||
<el-input v-model="searchData.name" class="item_width_2" size="small" clearable placeholder="请输入"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="物业联系人" prop="contactName"> |
|||
<el-input v-model="searchData.contactName" class="item_width_2" size="small" clearable placeholder="请输入"></el-input> |
|||
</el-form-item> |
|||
<el-form-item label="联系电话" prop="contactMobile"> |
|||
<el-input v-model="searchData.contactMobile" class="item_width_2" size="small" clearable placeholder="请输入"></el-input> |
|||
</el-form-item> |
|||
|
|||
<el-button style="margin-left: 30px" size="small" class="diy-button--search" @click="handleSearch">查询</el-button> |
|||
<el-button style="margin-left: 10px" size="small" class="diy-button--reset" @click="resetSearch">重置</el-button> |
|||
</div> |
|||
</el-form> |
|||
</div> |
|||
|
|||
<div class="div_table"> |
|||
<div class="div_btn"> |
|||
<el-button class="diy-button--add" size="small" @click="handleAdd">新增</el-button> |
|||
|
|||
<!-- <el-button |
|||
@click="handleExport" |
|||
class="diy-button--reset" |
|||
size="small" |
|||
>导出</el-button |
|||
> --> |
|||
</div> |
|||
|
|||
<el-table :data="tableData" |
|||
border |
|||
:header-cell-style="{ background: '#2195FE', color: '#FFFFFF' }" |
|||
class="table" |
|||
style="width: 100%" |
|||
:height="maxTableHeight"> |
|||
<el-table-column label="序号" |
|||
fixed="left" |
|||
type="index" |
|||
align="center" |
|||
width="50" /> |
|||
|
|||
<el-table-column prop="name" |
|||
align="center" |
|||
label="物业名称" |
|||
:show-overflow-tooltip="true"> |
|||
</el-table-column> |
|||
|
|||
<el-table-column prop="totalNeighborHood" |
|||
align="center" |
|||
label="管理小区数量 " |
|||
:show-overflow-tooltip="true"> |
|||
</el-table-column> |
|||
|
|||
<el-table-column fixed="right" |
|||
label="操作" |
|||
align="center" |
|||
width="200"> |
|||
<template slot-scope="scope"> |
|||
<el-button @click="handleWatch(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
class=".div-table-button--detail">查看</el-button> |
|||
<el-button @click="handleEdit(scope.row)" |
|||
type="text" |
|||
size="small" |
|||
class="div-table-button--edit">编辑</el-button> |
|||
|
|||
<el-popconfirm title="删除之后无法回复，确认删除？" |
|||
@onConfirm="handleDelete(scope.row, scope.$index)" |
|||
@confirm="handleDelete(scope.row, scope.$index)"> |
|||
<el-button slot="reference" |
|||
type="text" |
|||
size="small" |
|||
style="margin-left: 10px" |
|||
class="div-table-button--delete">删除</el-button> |
|||
</el-popconfirm> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
<div> |
|||
<el-pagination @size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
:current-page.sync="pageNo" |
|||
:page-sizes="[20, 50, 100, 200]" |
|||
:page-size="parseInt(pageSize)" |
|||
layout="sizes, prev, pager, next, total" |
|||
:total="total"> |
|||
</el-pagination> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<!-- 修改弹出框 --> |
|||
<el-dialog v-if="formShow" |
|||
:visible.sync="formShow" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
:title="formTitle" |
|||
width="850px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="handleClose"> |
|||
<edit-form ref="eleEditForm" |
|||
:formId="formId" |
|||
:formType="formType" |
|||
@close="handleClose" |
|||
:villageList="villageList" |
|||
@afterEdit="handleEditSuccess"></edit-form> |
|||
</el-dialog> |
|||
|
|||
<!-- 详情弹出框 --> |
|||
<el-dialog v-if="detailShow" |
|||
:visible.sync="detailShow" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
|
|||
:title="'详情'" |
|||
width="850px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="handleClose"> |
|||
<detail-form ref="ref_form_detail" |
|||
:formId="formId" |
|||
:villageList="villageList" |
|||
@diaDetailClose="handleClose"></detail-form> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost } from "@/js/dai/request"; |
|||
import nextTick from "dai-js/tools/nextTick"; |
|||
import { mapGetters } from "vuex"; |
|||
import axios from "axios"; |
|||
import editForm from "./cpts/edit"; |
|||
import detailForm from "./cpts/detail"; |
|||
|
|||
function iniSearchData () { |
|||
return { |
|||
name: "", |
|||
}; |
|||
} |
|||
|
|||
export default { |
|||
components: { editForm, detailForm }, |
|||
|
|||
data () { |
|||
return { |
|||
tableData: [], |
|||
villageList:{}, |
|||
searchData: iniSearchData(), |
|||
categoryOptions: [], |
|||
|
|||
pageNo: 1, |
|||
pageSize: window.localStorage.getItem("pageSize") || 20, |
|||
total: 1, |
|||
|
|||
formId: "", |
|||
formShow: false, |
|||
formTitle: "服务项目", |
|||
formType: "", // 列表list 新增add 修改edit 详情info |
|||
|
|||
detailShow: false, |
|||
}; |
|||
}, |
|||
computed: { |
|||
maxTableHeight () { |
|||
return this.$store.state.inIframe |
|||
? this.clientHeight - 410 + this.iframeHeigh |
|||
: this.clientHeight - 410; |
|||
}, |
|||
...mapGetters(["clientHeight", "iframeHeight"]), |
|||
}, |
|||
|
|||
mounted () { |
|||
console.log(this.$store.state); |
|||
this.user = this.$store.state.user; |
|||
this.getTableData(); |
|||
}, |
|||
methods: { |
|||
handleSearch (val) { |
|||
console.log(this.searchData); |
|||
this.pageNo = 1; |
|||
this.getTableData(); |
|||
}, |
|||
|
|||
async handleExport () { |
|||
const url = "/gov/project/icEvent/export"; |
|||
const { pageSize, pageNo, searchData } = this; |
|||
axios({ |
|||
url: window.SITE_CONFIG["apiURL"] + url, |
|||
method: "post", |
|||
data: { |
|||
pageSize, |
|||
pageNo, |
|||
...searchData, |
|||
}, |
|||
responseType: "blob", |
|||
}) |
|||
.then((res) => { |
|||
let fileName = window.decodeURI( |
|||
res.headers["content-disposition"].split(";")[1].split("=")[1] |
|||
); |
|||
console.log("filename", fileName); |
|||
let blob = new Blob([res.data], { type: "application/vnd.ms-excel" }); |
|||
var url = window.URL.createObjectURL(blob); |
|||
var aLink = document.createElement("a"); |
|||
aLink.style.display = "none"; |
|||
aLink.href = url; |
|||
aLink.setAttribute("download", fileName); |
|||
document.body.appendChild(aLink); |
|||
aLink.click(); |
|||
document.body.removeChild(aLink); //下载完成移除元素 |
|||
window.URL.revokeObjectURL(url); //释放掉blob对象 |
|||
}) |
|||
.catch((err) => { |
|||
console.log("获取导出情失败", err); |
|||
return this.$message.error("网络错误"); |
|||
}); |
|||
}, |
|||
|
|||
handleAdd () { |
|||
this.formType = "add"; |
|||
this.formTitle = "新增"; |
|||
this.formShow = true; |
|||
}, |
|||
|
|||
handleWatch (row) { |
|||
// this.formType = "watch"; |
|||
this.villageList = row |
|||
// this.formTitle = "查看"; |
|||
// this.formShow = true; |
|||
console.log(this.villageList); |
|||
this.detailShow = true |
|||
}, |
|||
|
|||
handleEdit (row) { |
|||
this.formType = "edit"; |
|||
this.formId = row.villageId; |
|||
this.villageList = row |
|||
this.formTitle = "编辑"; |
|||
this.formShow = true; |
|||
}, |
|||
|
|||
handleClose () { |
|||
this.formShow = false; |
|||
this.detailShow = false |
|||
}, |
|||
|
|||
handleEditSuccess () { |
|||
this.handleClose(); |
|||
this.getTableData(); |
|||
}, |
|||
|
|||
async handleDelete (rowData, rowIndex) { |
|||
console.log(rowData, rowIndex); |
|||
const url = "/gov/org/propertymanagement/delete"; |
|||
let params = {id : rowData.id} |
|||
const { data, code, msg } = await requestPost(url,params); |
|||
if (code === 0) { |
|||
this.$message.success("删除成功！"); |
|||
this.getTableData(); |
|||
} else { |
|||
if(code>=8000){ |
|||
this.$message.error(msg); |
|||
}else{ |
|||
this.$message.error("操作失败！"); |
|||
} |
|||
} |
|||
}, |
|||
|
|||
async getTableData () { |
|||
const url = "/gov/org/propertymanagement/page"; |
|||
|
|||
const { pageSize, pageNo, searchData } = this; |
|||
const { data, code, msg } = await requestPost(url, { |
|||
pageSize, |
|||
pageNo, |
|||
...searchData, |
|||
}); |
|||
|
|||
if (code === 0) { |
|||
this.total = data.total || 0; |
|||
this.tableData = data.list |
|||
? data.list.map((item) => { |
|||
return item; |
|||
}) |
|||
: []; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
handleSizeChange (val) { |
|||
this.pageSize = val; |
|||
window.localStorage.setItem("pageSize", val); |
|||
this.getTableData(); |
|||
}, |
|||
handleCurrentChange (val) { |
|||
this.pageNo = val; |
|||
this.getTableData(); |
|||
}, |
|||
|
|||
resetSearch () { |
|||
this.searchData = iniSearchData(); |
|||
this.getTableData(); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import "@/assets/scss/buttonstyle.scss"; |
|||
@import "@/assets/scss/modules/management/list-main.scss"; |
|||
@import "@/assets/scss/modules/shequzhili/event-info.scss"; |
|||
</style> |
|||
|
|||
</div> |
|||
|
|||
<el-table :data="tableData" border :header-cell-style="{ background: '#2195FE', color: '#FFFFFF' }" class="table" style="width: 100%" :height="maxTableHeight"> |
|||
<el-table-column label="序号" fixed="left" type="index" align="center" width="50" /> |
|||
|
|||
<el-table-column prop="name" align="center" label="物业名称" :show-overflow-tooltip="true"></el-table-column> |
|||
<el-table-column prop="contactName" align="center" label="物业联系人" :show-overflow-tooltip="true"></el-table-column> |
|||
<el-table-column prop="contactMobile" align="center" label="联系电话" :show-overflow-tooltip="true"></el-table-column> |
|||
<el-table-column prop="totalNeighborHood" align="center" label="管理小区数量 " :show-overflow-tooltip="true"></el-table-column> |
|||
|
|||
<el-table-column fixed="right" label="操作" align="center" width="200"> |
|||
<template slot-scope="scope"> |
|||
<el-button @click="handleWatch(scope.row)" type="text" size="small" class=".div-table-button--detail">查看</el-button> |
|||
<el-button @click="handleEdit(scope.row)" type="text" size="small" class="div-table-button--edit">编辑</el-button> |
|||
|
|||
<el-popconfirm title="删除之后无法回复，确认删除？" @onConfirm="handleDelete(scope.row, scope.$index)" @confirm="handleDelete(scope.row, scope.$index)"> |
|||
<el-button slot="reference" type="text" size="small" style="margin-left: 10px" class="div-table-button--delete">删除</el-button> |
|||
</el-popconfirm> |
|||
</template> |
|||
</el-table-column> |
|||
</el-table> |
|||
|
|||
<div> |
|||
<el-pagination |
|||
@size-change="handleSizeChange" |
|||
@current-change="handleCurrentChange" |
|||
:current-page.sync="pageNo" |
|||
:page-sizes="[20, 50, 100, 200]" |
|||
:page-size="parseInt(pageSize)" |
|||
layout="sizes, prev, pager, next, total" |
|||
:total="total" |
|||
></el-pagination> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<!-- 修改弹出框 --> |
|||
<el-dialog |
|||
v-if="formShow" |
|||
:visible.sync="formShow" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
:title="formTitle" |
|||
width="850px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="handleClose" |
|||
> |
|||
<edit-form ref="eleEditForm" :formId="formId" :formType="formType" @close="handleClose" :villageList="villageList" @afterEdit="handleEditSuccess"></edit-form> |
|||
</el-dialog> |
|||
|
|||
<!-- 详情弹出框 --> |
|||
<el-dialog |
|||
v-if="detailShow" |
|||
:visible.sync="detailShow" |
|||
:close-on-click-modal="false" |
|||
:close-on-press-escape="false" |
|||
:title="'详情'" |
|||
width="850px" |
|||
top="5vh" |
|||
class="dialog-h" |
|||
@closed="handleClose" |
|||
> |
|||
<detail-form ref="ref_form_detail" :formId="formId" :villageList="villageList" @diaDetailClose="handleClose"></detail-form> |
|||
</el-dialog> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost } from '@/js/dai/request'; |
|||
import nextTick from 'dai-js/tools/nextTick'; |
|||
import { mapGetters } from 'vuex'; |
|||
import axios from 'axios'; |
|||
import editForm from './cpts/edit'; |
|||
import detailForm from './cpts/detail'; |
|||
|
|||
function iniSearchData() { |
|||
return { |
|||
name: '', |
|||
contactName: '', |
|||
contactMobile: '' |
|||
}; |
|||
} |
|||
|
|||
export default { |
|||
components: { editForm, detailForm }, |
|||
|
|||
data() { |
|||
return { |
|||
tableData: [], |
|||
villageList: {}, |
|||
searchData: iniSearchData(), |
|||
categoryOptions: [], |
|||
|
|||
pageNo: 1, |
|||
pageSize: window.localStorage.getItem('pageSize') || 20, |
|||
total: 1, |
|||
|
|||
formId: '', |
|||
formShow: false, |
|||
formTitle: '服务项目', |
|||
formType: '', // 列表list 新增add 修改edit 详情info |
|||
|
|||
detailShow: false |
|||
}; |
|||
}, |
|||
computed: { |
|||
maxTableHeight() { |
|||
return this.$store.state.inIframe ? this.clientHeight - 410 + this.iframeHeigh : this.clientHeight - 410; |
|||
}, |
|||
...mapGetters(['clientHeight', 'iframeHeight']) |
|||
}, |
|||
|
|||
mounted() { |
|||
console.log(this.$store.state); |
|||
this.user = this.$store.state.user; |
|||
this.getTableData(); |
|||
}, |
|||
methods: { |
|||
handleSearch(val) { |
|||
console.log(this.searchData); |
|||
this.pageNo = 1; |
|||
this.getTableData(); |
|||
}, |
|||
|
|||
async handleExport() { |
|||
const url = '/gov/project/icEvent/export'; |
|||
const { pageSize, pageNo, searchData } = this; |
|||
axios({ |
|||
url: window.SITE_CONFIG['apiURL'] + url, |
|||
method: 'post', |
|||
data: { |
|||
pageSize, |
|||
pageNo, |
|||
...searchData |
|||
}, |
|||
responseType: 'blob' |
|||
}) |
|||
.then(res => { |
|||
let fileName = window.decodeURI(res.headers['content-disposition'].split(';')[1].split('=')[1]); |
|||
console.log('filename', fileName); |
|||
let blob = new Blob([res.data], { type: 'application/vnd.ms-excel' }); |
|||
var url = window.URL.createObjectURL(blob); |
|||
var aLink = document.createElement('a'); |
|||
aLink.style.display = 'none'; |
|||
aLink.href = url; |
|||
aLink.setAttribute('download', fileName); |
|||
document.body.appendChild(aLink); |
|||
aLink.click(); |
|||
document.body.removeChild(aLink); //下载完成移除元素 |
|||
window.URL.revokeObjectURL(url); //释放掉blob对象 |
|||
}) |
|||
.catch(err => { |
|||
console.log('获取导出情失败', err); |
|||
return this.$message.error('网络错误'); |
|||
}); |
|||
}, |
|||
|
|||
handleAdd() { |
|||
this.formType = 'add'; |
|||
this.formTitle = '新增'; |
|||
this.formShow = true; |
|||
}, |
|||
|
|||
handleWatch(row) { |
|||
// this.formType = "watch"; |
|||
this.villageList = row; |
|||
// this.formTitle = "查看"; |
|||
// this.formShow = true; |
|||
console.log(this.villageList); |
|||
this.detailShow = true; |
|||
}, |
|||
|
|||
handleEdit(row) { |
|||
this.formType = 'edit'; |
|||
this.formId = row.villageId; |
|||
this.villageList = row; |
|||
this.formTitle = '编辑'; |
|||
this.formShow = true; |
|||
}, |
|||
|
|||
handleClose() { |
|||
this.formShow = false; |
|||
this.detailShow = false; |
|||
}, |
|||
|
|||
handleEditSuccess() { |
|||
this.handleClose(); |
|||
this.getTableData(); |
|||
}, |
|||
|
|||
async handleDelete(rowData, rowIndex) { |
|||
console.log(rowData, rowIndex); |
|||
const url = '/gov/org/propertymanagement/delete'; |
|||
let params = { id: rowData.id }; |
|||
const { data, code, msg } = await requestPost(url, params); |
|||
if (code === 0) { |
|||
this.$message.success('删除成功！'); |
|||
this.getTableData(); |
|||
} else { |
|||
if (code >= 8000) { |
|||
this.$message.error(msg); |
|||
} else { |
|||
this.$message.error('操作失败！'); |
|||
} |
|||
} |
|||
}, |
|||
|
|||
async getTableData() { |
|||
const url = '/gov/org/propertymanagement/page'; |
|||
|
|||
const { pageSize, pageNo, searchData } = this; |
|||
const { data, code, msg } = await requestPost(url, { |
|||
pageSize, |
|||
pageNo, |
|||
...searchData |
|||
}); |
|||
|
|||
if (code === 0) { |
|||
this.total = data.total || 0; |
|||
this.tableData = data.list |
|||
? data.list.map(item => { |
|||
return item; |
|||
}) |
|||
: []; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
handleSizeChange(val) { |
|||
this.pageSize = val; |
|||
window.localStorage.setItem('pageSize', val); |
|||
this.getTableData(); |
|||
}, |
|||
handleCurrentChange(val) { |
|||
this.pageNo = val; |
|||
this.getTableData(); |
|||
}, |
|||
|
|||
resetSearch() { |
|||
this.searchData = iniSearchData(); |
|||
this.getTableData(); |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
@import '@/assets/scss/buttonstyle.scss'; |
|||
@import '@/assets/scss/modules/management/list-main.scss'; |
|||
@import '@/assets/scss/modules/shequzhili/event-info.scss'; |
|||
</style> |
|||
|
|||
Loading…
Reference in new issue