zhangyuan
4 years ago
13 changed files with 3923 additions and 0 deletions
@ -0,0 +1,649 @@ |
|||||
|
<template> |
||||
|
<div class="resi-container"> |
||||
|
<el-card class="resi-card"> |
||||
|
<el-row class="resi-row-box" :class="openSearch && 'resi-row-more'"> |
||||
|
<el-row class="resi-row"> |
||||
|
<el-col :span="6"> |
||||
|
<div class="resi-cell"> |
||||
|
<div class="resi-cell-label">所属网格</div> |
||||
|
<div class="resi-cell-value"> |
||||
|
<el-select |
||||
|
v-model.trim="form.GRID_ID" |
||||
|
placeholder="请选择" |
||||
|
size="small" |
||||
|
clearable |
||||
|
class="resi-cell-select" |
||||
|
@change="handleChangeGrid" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in optionsG" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-col> |
||||
|
<el-col :span="18"> |
||||
|
<div class="resi-cell"> |
||||
|
<div class="resi-cell-label">所属房屋</div> |
||||
|
<div class="resi-cell-value"> |
||||
|
<el-select |
||||
|
v-model.trim="form.VILLAGE_ID" |
||||
|
placeholder="请选择小区" |
||||
|
size="small" |
||||
|
clearable |
||||
|
class="resi-cell-select" |
||||
|
@clear="handleClearVillage" |
||||
|
@change="handleChangeV" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in optionsV" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
<el-select |
||||
|
v-model.trim="form.BUILD_ID" |
||||
|
placeholder="楼号" |
||||
|
size="small" |
||||
|
clearable |
||||
|
style="width: 120px;" |
||||
|
class="resi-cell-select" |
||||
|
:disabled="changeVDisabled" |
||||
|
@clear="handleClearBuild" |
||||
|
@change="handleChangeB" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in optionsB" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
<el-select |
||||
|
v-model.trim="form.UNIT_ID" |
||||
|
:disabled="changeBDisabled" |
||||
|
placeholder="单元" |
||||
|
size="small" |
||||
|
clearable |
||||
|
style="width: 120px;" |
||||
|
class="resi-cell-select" |
||||
|
@click="handleClearDan" |
||||
|
@change="handleChangeD" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in optionsD" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
<el-select |
||||
|
v-model.trim="form.HOME_ID" |
||||
|
:disabled="changeDDisabled" |
||||
|
placeholder="房号" |
||||
|
size="small" |
||||
|
clearable |
||||
|
style="width: 120px;" |
||||
|
class="resi-cell-select" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in optionsH" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
<el-row |
||||
|
v-for="(item, index) in sliceList(formList, 4)" |
||||
|
:key="index" |
||||
|
class="resi-row" |
||||
|
> |
||||
|
<el-col v-for="n in item" :key="n.id" :span="6"> |
||||
|
<div class="resi-cell"> |
||||
|
<div class="resi-cell-label">{{ n.label }}</div> |
||||
|
<div |
||||
|
class="resi-cell-value" |
||||
|
:class="n.itemType === 'radio' && 'resi-cell-value-radio'" |
||||
|
> |
||||
|
<el-input |
||||
|
v-if="n.itemType === 'input' || n.itemType === 'textarea'" |
||||
|
v-model.trim="form[n.columnName]" |
||||
|
class="resi-cell-input" |
||||
|
size="small" |
||||
|
clearable |
||||
|
placeholder="请输入内容" |
||||
|
> |
||||
|
</el-input> |
||||
|
<template v-else-if="n.itemType === 'datepicker'"> |
||||
|
<el-date-picker |
||||
|
v-if="n.queryType === 'daterange'" |
||||
|
v-model.trim="form[n.columnName]" |
||||
|
type="daterange" |
||||
|
align="right" |
||||
|
unlink-panels |
||||
|
range-separator="至" |
||||
|
start-placeholder="开始日期" |
||||
|
end-placeholder="结束日期" |
||||
|
class="resi-cell--daterange" |
||||
|
size="small" |
||||
|
format="yyyy-MM-dd" |
||||
|
value-format="yyyy-MM-dd" |
||||
|
> |
||||
|
</el-date-picker> |
||||
|
<el-date-picker |
||||
|
v-else |
||||
|
v-model.trim="form[n.columnName]" |
||||
|
class="resi-cell-input" |
||||
|
type="date" |
||||
|
size="small" |
||||
|
clearable |
||||
|
format="yyyy-MM-dd" |
||||
|
value-format="yyyy-MM-dd" |
||||
|
placeholder="选择日期" |
||||
|
> |
||||
|
</el-date-picker> |
||||
|
</template> |
||||
|
<el-select |
||||
|
v-else-if="n.itemType === 'select' || n.itemType === 'radio'" |
||||
|
v-model.trim="form[n.columnName]" |
||||
|
placeholder="请选择" |
||||
|
size="small" |
||||
|
clearable |
||||
|
class="resi-cell-select" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in n.options" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
<el-cascader |
||||
|
v-else-if="n.itemType === 'cascader'" |
||||
|
v-model.trim="form[n.columnName]" |
||||
|
:options="n.options" |
||||
|
:props="{ checkStrictly: true }" |
||||
|
clearable |
||||
|
size="small" |
||||
|
class="resi-cell-select" |
||||
|
> |
||||
|
</el-cascader> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
</el-row> |
||||
|
<el-row class="resi-search"> |
||||
|
<!-- <el-col :span="20"> |
||||
|
<el-button type="primary" size="mini">查询</el-button> |
||||
|
</el-col> --> |
||||
|
<el-col :span="24"> |
||||
|
<el-button type="primary" size="small" @click="handleSearch">查询</el-button> |
||||
|
<el-button class="diy-button--reset" size="small" @click="resetForm">重置</el-button> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
<div class="resi-down" @click="handleOpenSearch"> |
||||
|
<img v-if="openSearch" src="../../assets/img/arrow-up.png" /> |
||||
|
<img v-else src="../../assets/img/arrow-down.png" /> |
||||
|
</div> |
||||
|
</el-card> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: 'ResiSearch', |
||||
|
props: { |
||||
|
formList: { |
||||
|
type: Array, |
||||
|
default: () => [] |
||||
|
}, |
||||
|
columnName: { |
||||
|
type: String, |
||||
|
default: '' |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
let initForm = (arr, columnName) => { |
||||
|
let _form = {} |
||||
|
// console.log('formInfo', obj) |
||||
|
// if (Object.keys(obj).length > 0) { |
||||
|
// _form = { ...obj } |
||||
|
// return _form |
||||
|
// } |
||||
|
arr.forEach((item) => { |
||||
|
if (columnName && columnName === item.columnName) _form[item.columnName] = '1' |
||||
|
else _form[item.columnName] = '' |
||||
|
}) |
||||
|
return _form |
||||
|
} |
||||
|
let form = initForm(this.formList, this.columnName) |
||||
|
let tempFormList = this.formList.map(item => { |
||||
|
|
||||
|
return { |
||||
|
...item, |
||||
|
isChange: this.columnName && this.columnName === item.columnName ? true : false |
||||
|
} |
||||
|
}) |
||||
|
let constForm = { |
||||
|
...form, |
||||
|
GRID_ID: '', |
||||
|
VILLAGE_ID: '', |
||||
|
BUILD_ID: '', |
||||
|
UNIT_ID: '', |
||||
|
HOME_ID: '' |
||||
|
} |
||||
|
return { |
||||
|
pageLoading: false, |
||||
|
openSearch: false, |
||||
|
optionsV: [], |
||||
|
optionsB: [], |
||||
|
optionsH: [], |
||||
|
optionsD: [], |
||||
|
optionsG: [], |
||||
|
value: '', |
||||
|
fixedList: [], |
||||
|
fixedForm: { |
||||
|
GRID_ID: '', |
||||
|
VILLAGE_ID: '', |
||||
|
BUILD_ID: '', |
||||
|
UNIT_ID: '', |
||||
|
HOME_ID: '' |
||||
|
}, |
||||
|
constForm, |
||||
|
form: { |
||||
|
...form, |
||||
|
GRID_ID: '', |
||||
|
VILLAGE_ID: '', |
||||
|
BUILD_ID: '', |
||||
|
UNIT_ID: '', |
||||
|
HOME_ID: '' |
||||
|
}, |
||||
|
tempFormList, |
||||
|
pickerOptions: { |
||||
|
shortcuts: [ |
||||
|
{ |
||||
|
text: '最近一周', |
||||
|
onClick(picker) { |
||||
|
const end = new Date() |
||||
|
const start = new Date() |
||||
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7) |
||||
|
picker.$emit('pick', [start, end]) |
||||
|
} |
||||
|
}, |
||||
|
{ |
||||
|
text: '最近一个月', |
||||
|
onClick(picker) { |
||||
|
const end = new Date() |
||||
|
const start = new Date() |
||||
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30) |
||||
|
picker.$emit('pick', [start, end]) |
||||
|
} |
||||
|
}, |
||||
|
{ |
||||
|
text: '最近三个月', |
||||
|
onClick(picker) { |
||||
|
const end = new Date() |
||||
|
const start = new Date() |
||||
|
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90) |
||||
|
picker.$emit('pick', [start, end]) |
||||
|
} |
||||
|
} |
||||
|
] |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
sliceList() { |
||||
|
return function (data, count) { |
||||
|
if (data !== undefined) { |
||||
|
let index = 0 |
||||
|
let arrTemp = [] |
||||
|
for (let i = 0; i < data.length; i++) { |
||||
|
index = parseInt(i / count) |
||||
|
if (arrTemp.length <= index) { |
||||
|
arrTemp.push([]) |
||||
|
} |
||||
|
arrTemp[index].push(data[i]) |
||||
|
} |
||||
|
return arrTemp |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
changeVDisabled() { |
||||
|
return !this.form.VILLAGE_ID |
||||
|
}, |
||||
|
changeBDisabled() { |
||||
|
return !this.form.BUILD_ID |
||||
|
}, |
||||
|
changeDDisabled() { |
||||
|
return !this.form.UNIT_ID |
||||
|
} |
||||
|
}, |
||||
|
watch: { |
||||
|
form: { |
||||
|
handler(val, val2) { |
||||
|
// console.log('valpppp----', val, val2) |
||||
|
for (let n in val) { |
||||
|
if (this.constForm[n] !== val[n]) { |
||||
|
this.handleChangeForm(n) |
||||
|
console.log('nnnnnn', n) |
||||
|
} |
||||
|
} |
||||
|
this.constForm = { ...val } |
||||
|
}, |
||||
|
deep: true |
||||
|
} |
||||
|
}, |
||||
|
created() { |
||||
|
// this.initForm() |
||||
|
// console.log('formcccc---', this.form) |
||||
|
this.getGridList() |
||||
|
this.getValiheList() |
||||
|
if (this.columnName) this.handleChangeForm(this.columnName) |
||||
|
}, |
||||
|
methods: { |
||||
|
initForm() { |
||||
|
this.formList.forEach((item) => { |
||||
|
this.$set(this.form, item.columnName, '') |
||||
|
}) |
||||
|
console.log('formcccc---', this.form) |
||||
|
}, |
||||
|
handleClearVillage() { |
||||
|
this.form.BUILD_ID = '' |
||||
|
this.form.HOME_ID = '' |
||||
|
}, |
||||
|
handleClearBuild() { |
||||
|
this.form.BUILD_ID = '' |
||||
|
this.form.UNIT_ID = '' |
||||
|
this.form.HOME_ID = '' |
||||
|
}, |
||||
|
handleClearDan() { |
||||
|
this.form.UNIT_ID = '' |
||||
|
this.form.HOME_ID = '' |
||||
|
}, |
||||
|
resetForm(formName) { |
||||
|
for(const n in this.form) { |
||||
|
this.form[n] = '' |
||||
|
} |
||||
|
this.handleSearch() |
||||
|
}, |
||||
|
handleSearch() { |
||||
|
// console.log('formmmmm---', this.form) |
||||
|
const itemTypes = ['daterange', 'timerange'] |
||||
|
let arr = this.tempFormList |
||||
|
.filter((n) => n.isChange) |
||||
|
.map((item) => { |
||||
|
return { |
||||
|
queryType: item.queryType, |
||||
|
tableName: item.tableName, |
||||
|
columnName: item.columnName, |
||||
|
// columnValue: [] |
||||
|
columnValue: |
||||
|
itemTypes.includes(item.queryType) || |
||||
|
itemTypes.includes(item.itemType) |
||||
|
? this.form[item.columnName] |
||||
|
: [this.form[item.columnName].toString()] |
||||
|
} |
||||
|
}) |
||||
|
let arr1 = this.fixedList |
||||
|
.filter((n) => n.columnValue.length > 0) |
||||
|
.map((item) => { |
||||
|
return { |
||||
|
...item |
||||
|
} |
||||
|
}) |
||||
|
let arr3 = [...arr1, ...arr] |
||||
|
this.$emit('search', arr3) |
||||
|
}, |
||||
|
handleOpenSearch() { |
||||
|
this.openSearch = !this.openSearch |
||||
|
}, |
||||
|
handleChangeGrid(val) { |
||||
|
console.log('val', val) |
||||
|
this.form.VILLAGE_ID = '' |
||||
|
this.form.BUILD_ID = '' |
||||
|
this.form.UNIT_ID = '' |
||||
|
this.form.HOME_ID = '' |
||||
|
this.getValiheList() |
||||
|
}, |
||||
|
handleChangeV(val) { |
||||
|
console.log('val', val) |
||||
|
this.form.BUILD_ID = '' |
||||
|
this.form.UNIT_ID = '' |
||||
|
this.form.HOME_ID = '' |
||||
|
this.getBuildList() |
||||
|
}, |
||||
|
handleChangeB(val) { |
||||
|
console.log('val', val) |
||||
|
this.form.UNIT_ID = '' |
||||
|
this.form.HOME_ID = '' |
||||
|
this.getUniList() |
||||
|
}, |
||||
|
handleChangeD(val) { |
||||
|
console.log('val', val) |
||||
|
this.form.HOME_ID = '' |
||||
|
this.getHouseList() |
||||
|
}, |
||||
|
// 监听基础form |
||||
|
handleChangeForm(val) { |
||||
|
for (let n in this.fixedForm) { |
||||
|
if (n === val) { |
||||
|
if (this.fixedList.length > 0) { |
||||
|
let _item = {} |
||||
|
let hasVal = false |
||||
|
this.fixedList.forEach((item, index) => { |
||||
|
if (item.columnName == val) { |
||||
|
hasVal = true |
||||
|
item.columnValue[0] = this.form[val] |
||||
|
if (!this.form[val]) this.fixedList.splice(index, 1) |
||||
|
console.log('fixedList----val', this.fixedList) |
||||
|
} else { |
||||
|
_item = { |
||||
|
queryType: 'equal', |
||||
|
tableName: 'ic_resi_user', |
||||
|
columnName: val, |
||||
|
columnValue: [this.form[val]] |
||||
|
} |
||||
|
console.log('fixedList----else', _item) |
||||
|
// this.$set(this.fixedList, index, _item) |
||||
|
} |
||||
|
}) |
||||
|
if (Object.keys(_item).length > 0 && !hasVal) this.fixedList.push(_item) |
||||
|
} else { |
||||
|
this.$set(this.fixedList, 0, { |
||||
|
queryType: 'equal', |
||||
|
tableName: 'ic_resi_user', |
||||
|
columnName: val, |
||||
|
columnValue: [this.form[val]] |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
console.log('fixedList----999', this.fixedList) |
||||
|
this.tempFormList.forEach((item) => { |
||||
|
if (item.columnName === val) item.isChange = true |
||||
|
}) |
||||
|
}, |
||||
|
getGridList() { |
||||
|
const { user } = this.$store.state |
||||
|
this.$http |
||||
|
.post('/gov/org/customergrid/gridoption', { agencyId: user.agencyId, purpose: 'query' }) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取查询详情成功', res.data) |
||||
|
this.optionsG = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
getValiheList() { |
||||
|
const { user } = this.$store.state |
||||
|
this.$http |
||||
|
.post('/gov/org/icneighborhood/neighborhoodoption', { |
||||
|
gridId: this.form.GRID_ID, |
||||
|
agencyId: '' |
||||
|
// agencyId: user.agencyId |
||||
|
}) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取查询详情成功', res.data) |
||||
|
this.optionsV = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
getBuildList() { |
||||
|
this.$http |
||||
|
.post('/gov/org/icbuilding/buildingoption', { |
||||
|
neighborHoodId: this.form.VILLAGE_ID |
||||
|
}) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取查询详情成功', res.data) |
||||
|
this.optionsB = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
getUniList() { |
||||
|
this.$http |
||||
|
.post('/gov/org/icbuildingunit/unitoption', { |
||||
|
buildingId: this.form.BUILD_ID |
||||
|
}) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取查询详情成功', res.data) |
||||
|
this.optionsD = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
getHouseList() { |
||||
|
this.$http |
||||
|
.post('/gov/org/ichouse/houseoption', { unitId: this.form.UNIT_ID }) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取查询详情成功', res.data) |
||||
|
this.optionsH = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scope> |
||||
|
.resi-container .resi-card { |
||||
|
position: relative; |
||||
|
overflow: visible; |
||||
|
} |
||||
|
.resi-down { |
||||
|
position: absolute; |
||||
|
left: 50%; |
||||
|
bottom: -10px; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
width: 46px; |
||||
|
height: 12px; |
||||
|
box-sizing: border-box; |
||||
|
margin-left: -23rpx; |
||||
|
cursor: pointer; |
||||
|
background: #ffffff; |
||||
|
border-radius: 0 0 10px 10px; |
||||
|
img { |
||||
|
display: block; |
||||
|
} |
||||
|
} |
||||
|
.resi-row-box { |
||||
|
height: 104px; |
||||
|
overflow: hidden; |
||||
|
transition: height 0.5s; |
||||
|
} |
||||
|
.resi-row-more { |
||||
|
height: max-content; |
||||
|
transition: height 0.5s; |
||||
|
} |
||||
|
.resi-row { |
||||
|
margin-bottom: 20px; |
||||
|
} |
||||
|
.resi-search { |
||||
|
// padding-right: 20px; |
||||
|
.el-col { |
||||
|
text-align: right; |
||||
|
} |
||||
|
} |
||||
|
.resi-container .resi-cell { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
.resi-cell-label { |
||||
|
flex-shrink: 0; |
||||
|
width: 70px; |
||||
|
box-sizing: border-box; |
||||
|
margin-right: 15px; |
||||
|
text-align: right; |
||||
|
// line-height: 32; |
||||
|
} |
||||
|
.resi-cell-value-radio { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
min-height: 32px; |
||||
|
} |
||||
|
.resi-cell-input { |
||||
|
width: 200px; |
||||
|
} |
||||
|
.resi-cell--daterange { |
||||
|
width: 200px; |
||||
|
} |
||||
|
.resi-cell-select { |
||||
|
width: 200px; |
||||
|
box-sizing: border-box; |
||||
|
margin-right: 10px; |
||||
|
&-middle { |
||||
|
width: 130px; |
||||
|
} |
||||
|
&-small { |
||||
|
width: 88px; |
||||
|
} |
||||
|
} |
||||
|
.resi-cell-select:last-child { |
||||
|
margin-right: 0; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,187 @@ |
|||||
|
<template> |
||||
|
<el-dialog :visible.sync="visible" :title="!dataForm.id ? $t('add') : $t('update')" :close-on-click-modal="false" :close-on-press-escape="false"> |
||||
|
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()" :label-width="$i18n.locale === 'en-US' ? '120px' : '80px'"> |
||||
|
<el-form-item label="epmet用户主键" prop="userId"> |
||||
|
<el-input v-model="dataForm.userId" placeholder="epmet用户主键"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="姓名" prop="name"> |
||||
|
<el-input v-model="dataForm.name" placeholder="姓名"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="身份证" prop="idCard"> |
||||
|
<el-input v-model="dataForm.idCard" placeholder="身份证"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="手机号" prop="mobile"> |
||||
|
<el-input v-model="dataForm.mobile" placeholder="手机号"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="性别 0女 1男" prop="gender"> |
||||
|
<el-input v-model="dataForm.gender" placeholder="性别 0女 1男"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="类型 0 租客 1 房东" prop="type"> |
||||
|
<el-input v-model="dataForm.type" placeholder="类型 0 租客 1 房东"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="加入时间" prop="joinDate"> |
||||
|
<el-input v-model="dataForm.joinDate" placeholder="加入时间"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="加入原因" prop="joinReason"> |
||||
|
<el-input v-model="dataForm.joinReason" placeholder="加入原因"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="移除时间" prop="removeDate"> |
||||
|
<el-input v-model="dataForm.removeDate" placeholder="移除时间"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="移除原因" prop="removeReason"> |
||||
|
<el-input v-model="dataForm.removeReason" placeholder="移除原因"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="删除标记 0：未删除，1：已删除" prop="delFlag"> |
||||
|
<el-input v-model="dataForm.delFlag" placeholder="删除标记 0：未删除，1：已删除"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="乐观锁" prop="revision"> |
||||
|
<el-input v-model="dataForm.revision" placeholder="乐观锁"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="创建人" prop="createdBy"> |
||||
|
<el-input v-model="dataForm.createdBy" placeholder="创建人"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="创建时间" prop="createdTime"> |
||||
|
<el-input v-model="dataForm.createdTime" placeholder="创建时间"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="更新人" prop="updatedBy"> |
||||
|
<el-input v-model="dataForm.updatedBy" placeholder="更新人"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="更新时间" prop="updatedTime"> |
||||
|
<el-input v-model="dataForm.updatedTime" placeholder="更新时间"></el-input> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<template slot="footer"> |
||||
|
<el-button @click="visible = false">{{ $t('cancel') }}</el-button> |
||||
|
<el-button type="primary" @click="dataFormSubmitHandle()">{{ $t('confirm') }}</el-button> |
||||
|
</template> |
||||
|
</el-dialog> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import debounce from 'lodash/debounce' |
||||
|
export default { |
||||
|
data () { |
||||
|
return { |
||||
|
visible: false, |
||||
|
dataForm: { |
||||
|
id: '', |
||||
|
userId: '', |
||||
|
name: '', |
||||
|
idCard: '', |
||||
|
mobile: '', |
||||
|
gender: '', |
||||
|
type: '', |
||||
|
joinDate: '', |
||||
|
joinReason: '', |
||||
|
removeDate: '', |
||||
|
removeReason: '', |
||||
|
delFlag: '', |
||||
|
revision: '', |
||||
|
createdBy: '', |
||||
|
createdTime: '', |
||||
|
updatedBy: '', |
||||
|
updatedTime: '' |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
dataRule () { |
||||
|
return { |
||||
|
userId: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
name: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
idCard: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
mobile: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
gender: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
type: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
joinDate: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
joinReason: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
removeDate: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
removeReason: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
delFlag: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
revision: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
createdBy: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
createdTime: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
updatedBy: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
updatedTime: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
] |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
init () { |
||||
|
this.visible = true |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs['dataForm'].resetFields() |
||||
|
if (this.dataForm.id) { |
||||
|
this.getInfo() |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
// 获取信息 |
||||
|
getInfo () { |
||||
|
this.$http.get(`/pli/power/rentBlacklist/${this.dataForm.id}`).then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.dataForm = { |
||||
|
...this.dataForm, |
||||
|
...res.data |
||||
|
} |
||||
|
}).catch(() => {}) |
||||
|
}, |
||||
|
// 表单提交 |
||||
|
dataFormSubmitHandle: debounce(function () { |
||||
|
this.$refs['dataForm'].validate((valid) => { |
||||
|
if (!valid) { |
||||
|
return false |
||||
|
} |
||||
|
this.$http[!this.dataForm.id ? 'post' : 'put']('/pli/power/rentBlacklist/save', this.dataForm).then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.$message({ |
||||
|
message: this.$t('prompt.success'), |
||||
|
type: 'success', |
||||
|
duration: 500, |
||||
|
onClose: () => { |
||||
|
this.visible = false |
||||
|
this.$emit('refreshDataList') |
||||
|
} |
||||
|
}) |
||||
|
}).catch(() => {}) |
||||
|
}) |
||||
|
}, 1000, { 'leading': true, 'trailing': false }) |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
@ -0,0 +1,167 @@ |
|||||
|
<template> |
||||
|
<el-card shadow="never" class="aui-card--fill"> |
||||
|
<div class="mod-rent__rentBlacklist}"> |
||||
|
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()"> |
||||
|
<el-form-item label="姓名" |
||||
|
prop="name"> |
||||
|
<el-input v-model="dataForm.name" |
||||
|
size="small" |
||||
|
class="list_item_width_1" |
||||
|
clearable |
||||
|
placeholder="请输入姓名"> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="身份证" |
||||
|
prop="idCard"> |
||||
|
<el-input v-model="dataForm.idCard" |
||||
|
size="small" |
||||
|
class="list_item_width_1" |
||||
|
clearable |
||||
|
placeholder="请输入身份证"> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="手机" |
||||
|
prop="mobile"> |
||||
|
<el-input v-model="dataForm.mobile" |
||||
|
size="small" |
||||
|
class="list_item_width_1" |
||||
|
clearable |
||||
|
placeholder="请输入手机"> |
||||
|
</el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="入黑名单时间" |
||||
|
prop="startTime"> |
||||
|
<el-date-picker v-model="timeRange" |
||||
|
type="daterange" |
||||
|
clearable |
||||
|
size="small" |
||||
|
range-separator="至" |
||||
|
start-placeholder="选择日期" |
||||
|
end-placeholder="选择日期" |
||||
|
value-format="yyyy-MM-dd"> |
||||
|
</el-date-picker> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button @click="getDataList()">{{ $t('query') }}</el-button> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%"> |
||||
|
<el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column> |
||||
|
<el-table-column prop="name" label="姓名" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="idCard" label="身份证号" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="mobile" label="手机" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="gender" label="性别" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="joinDate" label="入黑名单时间" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="joinReason" label="原因" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150"> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-button type="text" size="small" @click="removeBlacklist(scope.row.id)">解除黑名单</el-button> |
||||
|
<!-- <el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{ $t('update') }}</el-button> |
||||
|
<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button> --> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
<el-pagination |
||||
|
:current-page="page" |
||||
|
:page-sizes="[10, 20, 50, 100]" |
||||
|
:page-size="limit" |
||||
|
:total="total" |
||||
|
layout="total, sizes, prev, pager, next, jumper" |
||||
|
@size-change="pageSizeChangeHandle" |
||||
|
@current-change="pageCurrentChangeHandle"> |
||||
|
</el-pagination> |
||||
|
<!-- 弹窗, 新增 / 修改 --> |
||||
|
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update> |
||||
|
<el-dialog |
||||
|
title="解除黑名单的原因" |
||||
|
:visible.sync="blacklistVisible" |
||||
|
width="40%"> |
||||
|
<textarea v-model="blacklistReason" placeholder="请输入解除黑名单的原因" class="blacklist-reason"></textarea> |
||||
|
<span slot="footer" class="dialog-footer"> |
||||
|
<el-button @click="blacklistVisible = false">取 消</el-button> |
||||
|
<el-button type="primary" @click="confirmRemoveBlacklist">确 定</el-button> |
||||
|
</span> |
||||
|
</el-dialog> |
||||
|
</div> |
||||
|
</el-card> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import mixinViewModule from '@/mixins/view-module' |
||||
|
import AddOrUpdate from './rentblacklist-add-or-update' |
||||
|
export default { |
||||
|
mixins: [mixinViewModule], |
||||
|
data () { |
||||
|
return { |
||||
|
mixinViewModuleOptions: { |
||||
|
getDataListURL: '/pli/power/rentBlacklist/page', |
||||
|
getDataListIsPage: true, |
||||
|
deleteURL: '/pli/power/rentBlacklist', |
||||
|
deleteIsBatch: true |
||||
|
}, |
||||
|
timeRange: '', |
||||
|
dataForm: { |
||||
|
id: '' |
||||
|
}, |
||||
|
blacklistVisible: false, // 解除黑名单 |
||||
|
blacklistReason: '', // 解除黑名单原因 |
||||
|
removeId: '', // 解除黑名单的人员信息id |
||||
|
} |
||||
|
}, |
||||
|
watch: { |
||||
|
timeRange (val) { |
||||
|
if (Array.isArray(val) && val.length == 2) { |
||||
|
this.dataForm.startTime = val[0]; |
||||
|
this.dataForm.endTime = val[1]; |
||||
|
} else { |
||||
|
this.dataForm.startTime = ""; |
||||
|
this.dataForm.endTime = ""; |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
components: { |
||||
|
AddOrUpdate |
||||
|
}, |
||||
|
methods: { |
||||
|
removeBlacklist (id) { |
||||
|
this.blacklistVisible = true |
||||
|
this.blacklistReason = '' |
||||
|
this.removeId = id |
||||
|
}, |
||||
|
confirmRemoveBlacklist () { |
||||
|
const params = { |
||||
|
id: this.removeId, |
||||
|
removeReason: this.blacklistReason |
||||
|
} |
||||
|
this.$http.post('/pli/power/rentBlacklist/update', params).then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.$message({ |
||||
|
message: this.$t('prompt.success'), |
||||
|
type: 'success', |
||||
|
duration: 500, |
||||
|
onClose: () => { |
||||
|
this.blacklistVisible = false |
||||
|
this.getDataList() |
||||
|
} |
||||
|
}) |
||||
|
}).catch(() => {}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
<style lang="scss" scoped> |
||||
|
.blacklist-reason { |
||||
|
width: 100%; |
||||
|
height: 80px; |
||||
|
border: 1px solid #e4e4e4; |
||||
|
border-radius: 4px; |
||||
|
resize: none; |
||||
|
padding: 8px; |
||||
|
box-sizing: border-box; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,138 @@ |
|||||
|
<template> |
||||
|
<el-dialog :visible.sync="visible" :title="!dataForm.id ? $t('add') : $t('update')" :close-on-click-modal="false" :close-on-press-escape="false"> |
||||
|
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()" :label-width="$i18n.locale === 'en-US' ? '120px' : '80px'"> |
||||
|
<el-form-item label="引用ID" prop="referenceId"> |
||||
|
<el-input v-model="dataForm.referenceId" placeholder="引用ID"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="文件地址" prop="fileUrl"> |
||||
|
<el-input v-model="dataForm.fileUrl" placeholder="文件地址"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="文件类型" prop="fileType"> |
||||
|
<el-input v-model="dataForm.fileType" placeholder="文件类型"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="删除标识 0：未删除，1：删除" prop="delFlag"> |
||||
|
<el-input v-model="dataForm.delFlag" placeholder="删除标识 0：未删除，1：删除"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="乐观锁" prop="revision"> |
||||
|
<el-input v-model="dataForm.revision" placeholder="乐观锁"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="创建人" prop="createdBy"> |
||||
|
<el-input v-model="dataForm.createdBy" placeholder="创建人"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="创建时间" prop="createdTime"> |
||||
|
<el-input v-model="dataForm.createdTime" placeholder="创建时间"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="更新人" prop="updatedBy"> |
||||
|
<el-input v-model="dataForm.updatedBy" placeholder="更新人"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="更新时间" prop="updatedTime"> |
||||
|
<el-input v-model="dataForm.updatedTime" placeholder="更新时间"></el-input> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<template slot="footer"> |
||||
|
<el-button @click="visible = false">{{ $t('cancel') }}</el-button> |
||||
|
<el-button type="primary" @click="dataFormSubmitHandle()">{{ $t('confirm') }}</el-button> |
||||
|
</template> |
||||
|
</el-dialog> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import debounce from 'lodash/debounce' |
||||
|
export default { |
||||
|
data () { |
||||
|
return { |
||||
|
visible: false, |
||||
|
dataForm: { |
||||
|
id: '', |
||||
|
referenceId: '', |
||||
|
fileUrl: '', |
||||
|
fileType: '', |
||||
|
delFlag: '', |
||||
|
revision: '', |
||||
|
createdBy: '', |
||||
|
createdTime: '', |
||||
|
updatedBy: '', |
||||
|
updatedTime: '' |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
dataRule () { |
||||
|
return { |
||||
|
referenceId: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
fileUrl: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
fileType: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
delFlag: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
revision: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
createdBy: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
createdTime: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
updatedBy: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
updatedTime: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
] |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
init () { |
||||
|
this.visible = true |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs['dataForm'].resetFields() |
||||
|
if (this.dataForm.id) { |
||||
|
this.getInfo() |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
// 获取信息 |
||||
|
getInfo () { |
||||
|
this.$http.get(`/pli/power/rentContractFile/${this.dataForm.id}`).then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.dataForm = { |
||||
|
...this.dataForm, |
||||
|
...res.data |
||||
|
} |
||||
|
}).catch(() => {}) |
||||
|
}, |
||||
|
// 表单提交 |
||||
|
dataFormSubmitHandle: debounce(function () { |
||||
|
this.$refs['dataForm'].validate((valid) => { |
||||
|
if (!valid) { |
||||
|
return false |
||||
|
} |
||||
|
this.$http[!this.dataForm.id ? 'post' : 'put']('/pli/power/rentContractFile/', this.dataForm).then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.$message({ |
||||
|
message: this.$t('prompt.success'), |
||||
|
type: 'success', |
||||
|
duration: 500, |
||||
|
onClose: () => { |
||||
|
this.visible = false |
||||
|
this.$emit('refreshDataList') |
||||
|
} |
||||
|
}) |
||||
|
}).catch(() => {}) |
||||
|
}) |
||||
|
}, 1000, { 'leading': true, 'trailing': false }) |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
@ -0,0 +1,71 @@ |
|||||
|
<template> |
||||
|
<el-card shadow="never" class="aui-card--fill"> |
||||
|
<div class="mod-rent__rentContractFile}"> |
||||
|
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()"> |
||||
|
<el-form-item> |
||||
|
<el-input v-model="dataForm.id" placeholder="id" clearable></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button @click="getDataList()">{{ $t('query') }}</el-button> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%"> |
||||
|
<el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column> |
||||
|
<el-table-column prop="id" label="ID" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="referenceId" label="引用ID" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="fileUrl" label="文件地址" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="fileType" label="文件类型" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="delFlag" label="删除标识 0：未删除，1：删除" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="revision" label="乐观锁" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="createdBy" label="创建人" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="createdTime" label="创建时间" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="updatedBy" label="更新人" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="updatedTime" label="更新时间" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150"> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{ $t('update') }}</el-button> |
||||
|
<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
<el-pagination |
||||
|
:current-page="page" |
||||
|
:page-sizes="[10, 20, 50, 100]" |
||||
|
:page-size="limit" |
||||
|
:total="total" |
||||
|
layout="total, sizes, prev, pager, next, jumper" |
||||
|
@size-change="pageSizeChangeHandle" |
||||
|
@current-change="pageCurrentChangeHandle"> |
||||
|
</el-pagination> |
||||
|
<!-- 弹窗, 新增 / 修改 --> |
||||
|
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update> |
||||
|
</div> |
||||
|
</el-card> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import mixinViewModule from '@/mixins/view-module' |
||||
|
import AddOrUpdate from './rentcontractfile-add-or-update' |
||||
|
export default { |
||||
|
mixins: [mixinViewModule], |
||||
|
data () { |
||||
|
return { |
||||
|
mixinViewModuleOptions: { |
||||
|
getDataListURL: '/pli/power/rentContractFile/page', |
||||
|
getDataListIsPage: true, |
||||
|
deleteURL: '/pli/power/rentContractFile', |
||||
|
deleteIsBatch: true |
||||
|
}, |
||||
|
dataForm: { |
||||
|
id: '' |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
components: { |
||||
|
AddOrUpdate |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
@ -0,0 +1,273 @@ |
|||||
|
<template> |
||||
|
<el-dialog :visible.sync="visible" :title="dataForm.flag === '1' ? '查看' : '审核'" :close-on-click-modal="false" :close-on-press-escape="false"> |
||||
|
<el-form :inline="true" :model="dataForm" :rules="dataRule" ref="dataForm" |
||||
|
@keyup.enter.native="dataFormSubmitHandle()" label-width="120px" disabled> |
||||
|
<div v-if="dataForm.flag === '2'"> |
||||
|
<div style="height: 30px;font-weight: bold;">房屋信息</div> |
||||
|
<el-form-item label="所属社区" prop="gridName"> |
||||
|
<el-input v-model="dataForm.gridName" placeholder="网格"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="所属网格" prop="gridName"> |
||||
|
<el-input v-model="dataForm.gridName" placeholder="所属网格"></el-input> |
||||
|
</el-form-item> |
||||
|
<br/> |
||||
|
<el-form-item label="房屋" prop="homeName"> |
||||
|
<el-input v-model="dataForm.homeName" placeholder="房屋"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="房主姓名" prop="ownerName"> |
||||
|
<el-input v-model="dataForm.ownerName" placeholder="房主姓名"></el-input> |
||||
|
</el-form-item> |
||||
|
<br/> |
||||
|
|
||||
|
<div style="height: 30px;font-weight: bold;">居住成员信息</div> |
||||
|
<el-table v-loading="dataListLoading" :data="dataForm.tenantList" border style="width: 100%"> |
||||
|
<el-table-column label="序号" header-align="center" align="center" width="50px"> |
||||
|
<template slot-scope="scope"> |
||||
|
{{scope.$index+1}} |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="name" label="姓名" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="yfzgx" label="与户主关系" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="mobile" label="手机" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="idCard" label="身份证号" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="imgList" label="照片" header-align="center" align="center"> |
||||
|
<template slot-scope="scope"> |
||||
|
<div v-for="(item,index) in scope.row.imgList" :key="index"> |
||||
|
<img :src="item.fileUrl" @click="imgShow(item.fileUrl)" width="40" height="40" /> |
||||
|
</div> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
<br/> |
||||
|
</div> |
||||
|
|
||||
|
<div style="height: 30px;font-weight: bold;">合同信息</div> |
||||
|
<div style="height: 30px;">出租人信息</div> |
||||
|
<el-form-item label="出租人姓名" prop="lessorName"> |
||||
|
<el-input v-model="dataForm.lessorName" placeholder="出租人姓名"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="出租人身份证" prop="lessorIdCard"> |
||||
|
<el-input v-model="dataForm.lessorIdCard" placeholder="出租人身份证"></el-input> |
||||
|
</el-form-item> |
||||
|
<br/> |
||||
|
<el-form-item label="出租人手机" prop="lessorMobile"> |
||||
|
<el-input v-model="dataForm.lessorMobile" placeholder="出租人手机"></el-input> |
||||
|
</el-form-item> |
||||
|
<br/> |
||||
|
|
||||
|
<div style="height: 30px;">承租人信息</div> |
||||
|
<el-form-item label="承租人姓名" prop="lesseeName"> |
||||
|
<el-input v-model="dataForm.lesseeName" placeholder="承租人姓名"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="承租人身份证" prop="lesseeIdCard"> |
||||
|
<el-input v-model="dataForm.lesseeIdCard" placeholder="承租人身份证"></el-input> |
||||
|
</el-form-item> |
||||
|
<br/> |
||||
|
<el-form-item label="承租人手机" prop="lesseeMobile"> |
||||
|
<el-input v-model="dataForm.lesseeMobile" placeholder="承租人手机"></el-input> |
||||
|
</el-form-item> |
||||
|
<br/> |
||||
|
|
||||
|
<div style="height: 30px;font-weight: bold;">合同内容</div> |
||||
|
<el-form-item label="签署日期" prop="signDate"> |
||||
|
<el-input v-model="dataForm.signDate" placeholder="签署日期"></el-input> |
||||
|
</el-form-item> |
||||
|
<br/> |
||||
|
<el-form-item label="合同开始日期" prop="startDate"> |
||||
|
<el-input v-model="dataForm.startDate" placeholder="合同开始日期"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="合同结束日期" prop="endDate"> |
||||
|
<el-input v-model="dataForm.endDate" placeholder="合同结束日期"></el-input> |
||||
|
</el-form-item> |
||||
|
<br/> |
||||
|
|
||||
|
<el-form-item label="合同附件" prop="fileList"> |
||||
|
<template slot-scope="scope"> |
||||
|
<label v-for="(item,index) in dataForm.fileList" :key="index"> |
||||
|
<img :src="item.fileUrl" @click="imgShow(item.fileUrl)" width="100" height="100" /> |
||||
|
</label> |
||||
|
</template> |
||||
|
</el-form-item> |
||||
|
|
||||
|
</el-form> |
||||
|
<template slot="footer"> |
||||
|
<el-button @click="visible = false">{{ $t('cancel') }}</el-button> |
||||
|
<el-button v-if="dataForm.state === '0'" type="danger" @click="checkHandle('2')">{{ $t('checkBTGBtn') }}</el-button> |
||||
|
<el-button v-if="dataForm.state === '0'" type="primary" @click="checkHandle('1')">{{ $t('checkTGBtn') }}</el-button> |
||||
|
</template> |
||||
|
<el-dialog :visible.sync="dialogVisible" :modal="false"> |
||||
|
<img width="100%" :src="dialogImageUrl" alt=""> |
||||
|
</el-dialog> |
||||
|
</el-dialog> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import debounce from 'lodash/debounce' |
||||
|
export default { |
||||
|
data () { |
||||
|
return { |
||||
|
visible: false, |
||||
|
dataForm: { |
||||
|
id: '', |
||||
|
flag: '', |
||||
|
gridId: '', |
||||
|
gridName: '', |
||||
|
buildId: '', |
||||
|
buildName: '', |
||||
|
unitId: '', |
||||
|
unitName: '', |
||||
|
homeId: '', |
||||
|
homeName: '', |
||||
|
ownerName: '', |
||||
|
state: '', |
||||
|
lessorName: '', |
||||
|
lessorIdCard: '', |
||||
|
lessorMobile: '', |
||||
|
lesseeName: '', |
||||
|
lesseeIdCard: '', |
||||
|
lesseeMobile: '', |
||||
|
signDate: '', |
||||
|
startDate: '', |
||||
|
endDate: '' |
||||
|
}, |
||||
|
dataListLoading: false, |
||||
|
dialogVisible: false, |
||||
|
dialogImageUrl: '' |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
dataRule () { |
||||
|
return { |
||||
|
gridId: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
gridName: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
buildId: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
buildName: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
unitId: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
unitName: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
homeId: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
homeName: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
ownerName: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
state: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
lessorName: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
lessorIdCard: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
lessorMobile: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
lesseeName: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
lesseeIdCard: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
lesseeMobile: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
signDate: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
startDate: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
endDate: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
] |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
init () { |
||||
|
this.visible = true |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs['dataForm'].resetFields() |
||||
|
if (this.dataForm.id) { |
||||
|
this.getInfo() |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
// 查看大图 |
||||
|
imgShow(url){ |
||||
|
this.dialogImageUrl = url |
||||
|
this.dialogVisible = true |
||||
|
}, |
||||
|
// 获取信息 |
||||
|
getInfo () { |
||||
|
this.$http.get(`/pli/power/rentContractInfo/${this.dataForm.id}`).then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.dataForm = { |
||||
|
...this.dataForm, |
||||
|
...res.data |
||||
|
} |
||||
|
}).catch(() => {}) |
||||
|
}, |
||||
|
// 审核提交方法 |
||||
|
checkHandle: function (type) { |
||||
|
const params = { |
||||
|
id: this.dataForm.id, |
||||
|
state: type |
||||
|
} |
||||
|
this.$http.post('/pli/power/rentContractInfo/review', params).then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.$message({ |
||||
|
message: this.$t('prompt.success'), |
||||
|
type: 'success', |
||||
|
duration: 500, |
||||
|
onClose: () => { |
||||
|
this.visible = false |
||||
|
this.$emit('refreshDataList') |
||||
|
} |
||||
|
}) |
||||
|
}).catch(() => {}) |
||||
|
}, |
||||
|
// 表单提交 |
||||
|
dataFormSubmitHandle: debounce(function () { |
||||
|
this.$refs['dataForm'].validate((valid) => { |
||||
|
if (!valid) { |
||||
|
return false |
||||
|
} |
||||
|
this.$http[!this.dataForm.id ? 'post' : 'put']('/pli/power/rentContractInfo/', this.dataForm).then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.$message({ |
||||
|
message: this.$t('prompt.success'), |
||||
|
type: 'success', |
||||
|
duration: 500, |
||||
|
onClose: () => { |
||||
|
this.visible = false |
||||
|
this.$emit('refreshDataList') |
||||
|
} |
||||
|
}) |
||||
|
}).catch(() => {}) |
||||
|
}) |
||||
|
}, 1000, { 'leading': true, 'trailing': false }) |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
@ -0,0 +1,436 @@ |
|||||
|
<template> |
||||
|
<el-card shadow="never" class="aui-card--fill"> |
||||
|
<div class="mod-rent__rentContractInfo}"> |
||||
|
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()"> |
||||
|
<el-form-item label="所属网格" label-width="100px" |
||||
|
prop="gridId"> |
||||
|
<el-select |
||||
|
v-model.trim="dataForm.gridId" |
||||
|
placeholder="请选择" |
||||
|
clearable |
||||
|
@change="handleChangeGrid" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in optionsG" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="所属房屋" label-width="100px"> |
||||
|
<div class="resi-cell-value"> |
||||
|
<div class="resi-cell-col"> |
||||
|
<el-form-item prop="villageId"> |
||||
|
<el-select |
||||
|
v-model.trim="dataForm.villageId" |
||||
|
placeholder="请选择小区" |
||||
|
clearable |
||||
|
@clear="handleClearVillage" |
||||
|
@change="handleChangeV" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in optionsV" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item prop="buildId"> |
||||
|
<el-select |
||||
|
v-model.trim="dataForm.buildId" |
||||
|
placeholder="楼号" |
||||
|
clearable |
||||
|
style="width: 120px;" |
||||
|
:disabled="changeVDisabled" |
||||
|
@clear="handleClearBuild" |
||||
|
@change="handleChangeB" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in optionsB" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item prop="unitId"> |
||||
|
<el-select |
||||
|
v-model.trim="dataForm.unitId" |
||||
|
:disabled="changeBDisabled" |
||||
|
placeholder="单元" |
||||
|
clearable |
||||
|
style="width: 120px;" |
||||
|
@click="handleClearDan" |
||||
|
@change="handleChangeD" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in optionsD" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item prop="homeId"> |
||||
|
<el-select |
||||
|
v-model.trim="dataForm.homeId" |
||||
|
:disabled="changeDDisabled" |
||||
|
placeholder="房号" |
||||
|
clearable |
||||
|
style="width: 120px;" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in optionsH" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-form-item> |
||||
|
<br/> |
||||
|
<el-form-item label="出租人" label-width="100px"> |
||||
|
<el-input v-model="dataForm.lessorName" placeholder='承租人' clearable @keyup.native="btKeyUpLessorName"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="出租身份证" label-width="100px"> |
||||
|
<el-input v-model="dataForm.lessorIdCard" placeholder='承租人身份证' clearable @keyup.native="btKeyUpLessorIdCard"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="出租手机号" label-width="100px"> |
||||
|
<el-input v-model="dataForm.lessorMobile" placeholder='承租人手机号' clearable @keyup.native="btKeyUpLessorMobile"></el-input> |
||||
|
</el-form-item> |
||||
|
<br/> |
||||
|
<el-form-item label="承租人" label-width="100px"> |
||||
|
<el-input v-model="dataForm.lesseeName" placeholder='承租人' clearable @keyup.native="btKeyUpLesseeName"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="承租人身份证" label-width="100px"> |
||||
|
<el-input v-model="dataForm.lesseeIdCard" placeholder='承租人身份证' clearable @keyup.native="btKeyUpLesseeIdCard"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="承租人手机号" label-width="100px"> |
||||
|
<el-input v-model="dataForm.lesseeMobile" placeholder='承租人手机号' clearable @keyup.native="btKeyUpLesseeMobile"></el-input> |
||||
|
</el-form-item> |
||||
|
<br/> |
||||
|
|
||||
|
<el-form-item label="合同到期时间" prop="endDate" label-width="100px"> |
||||
|
<el-select v-model="dataForm.endDate" placeholder="合同到期时间" clearable> |
||||
|
<el-option v-for="item in endDateArr" :key="item.dictValue" :label="item.dictName" :value="item.dictValue"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="合同签订时间" prop="startTime" label-width="100px"> |
||||
|
<el-date-picker v-model="dataForm.startTime" |
||||
|
type="date" |
||||
|
:picker-options="pickerBeginDateBefore" |
||||
|
value-format="yyyy-MM-dd" |
||||
|
format="yyyy-MM-dd" |
||||
|
placeholder="选择日期时间" |
||||
|
style="width:200px" @change="changeTime"> |
||||
|
</el-date-picker> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="至" prop="endTime"> |
||||
|
<el-date-picker v-model="dataForm.endTime" |
||||
|
type="date" |
||||
|
:picker-options="pickerBeginDateAfter" |
||||
|
value-format="yyyy-MM-dd" |
||||
|
format="yyyy-MM-dd" |
||||
|
placeholder="选择日期时间" |
||||
|
style="width:200px" @change="changeTime"> |
||||
|
</el-date-picker> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button @click="getDataList()">{{ $t('query') }}</el-button> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button v-if="false" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%"> |
||||
|
<el-table-column label="序号" header-align="center" align="center" width="50px"> |
||||
|
<template slot-scope="scope"> |
||||
|
{{scope.$index+1}} |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="gridName" label="所属网格" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column label="所属房屋" header-align="center" align="center"> |
||||
|
<template slot-scope="scope"> |
||||
|
{{scope.row.villageName}}{{scope.row.buildName}}{{scope.row.unitName}}{{scope.row.homeName}} |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<!-- <el-table-column prop="buildName" label="楼号" header-align="center" align="center"></el-table-column>--> |
||||
|
<!-- <el-table-column prop="unitName" label="单元" header-align="center" align="center"></el-table-column>--> |
||||
|
<!-- <el-table-column prop="homeName" label="房屋" header-align="center" align="center"></el-table-column>--> |
||||
|
<el-table-column prop="lessorName" label="出租人" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="lessorMobile" label="手机号" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="lesseeName" label="承租人" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="lesseeMobile" label="手机号" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="signDate" label="合同签订时间" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="startDate" label="合同开始时间" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="endDate" label="合同结束时间" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150"> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id,'1')">{{ $t('lookBtn') }}</el-button> |
||||
|
<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
<el-pagination |
||||
|
:current-page="page" |
||||
|
:page-sizes="[10, 20, 50, 100]" |
||||
|
:page-size="limit" |
||||
|
:total="total" |
||||
|
layout="total, sizes, prev, pager, next, jumper" |
||||
|
@size-change="pageSizeChangeHandle" |
||||
|
@current-change="pageCurrentChangeHandle"> |
||||
|
</el-pagination> |
||||
|
<!-- 弹窗, 新增 / 修改 --> |
||||
|
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update> |
||||
|
</div> |
||||
|
</el-card> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import mixinViewModule from '@/mixins/view-module' |
||||
|
import AddOrUpdate from './rentcontractinfo-add-or-update' |
||||
|
export default { |
||||
|
mixins: [mixinViewModule], |
||||
|
data: function () { |
||||
|
return { |
||||
|
mixinViewModuleOptions: { |
||||
|
getDataListURL: '/pli/power/rentContractInfo/page', |
||||
|
getDataListIsPage: true, |
||||
|
deleteURL: '/pli/power/rentContractInfo', |
||||
|
deleteIsBatch: true |
||||
|
}, |
||||
|
optionsV: [], |
||||
|
optionsB: [], |
||||
|
optionsH: [], |
||||
|
optionsD: [], |
||||
|
optionsG: [], |
||||
|
dataForm: { |
||||
|
id: '', |
||||
|
gridId: '', |
||||
|
villageId: '', |
||||
|
buildId: '', |
||||
|
unitId: '', |
||||
|
homeId: '', |
||||
|
lesseeName: '', |
||||
|
lesseeIdCard: '', |
||||
|
lesseeMobile: '', |
||||
|
lessorName: '', |
||||
|
lessorIdCard: '', |
||||
|
lessorMobile: '', |
||||
|
startTime: '', |
||||
|
endTime: '', |
||||
|
endDate: '' |
||||
|
}, |
||||
|
pickerBeginDateBefore: { |
||||
|
disabledDate: (time) => { |
||||
|
let beginDateVal = this.dataForm.endTime |
||||
|
if (beginDateVal) { |
||||
|
return time.getTime() > new Date(beginDateVal + ' 00:00:00').getTime() |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
pickerBeginDateAfter: { |
||||
|
disabledDate: (time) => { |
||||
|
let EndDateVal = this.dataForm.startTime |
||||
|
if (EndDateVal) { |
||||
|
return time.getTime() < new Date(EndDateVal + ' 00:00:00').getTime() |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
endDateArr: [ |
||||
|
{dictValue: '0', dictName: '近一个月'}, |
||||
|
{dictValue: '1', dictName: '近两个月'}, |
||||
|
{dictValue: '2', dictName: '近三个月'}, |
||||
|
{dictValue: '3', dictName: '到期的房屋合同'} |
||||
|
] |
||||
|
} |
||||
|
}, |
||||
|
components: { |
||||
|
AddOrUpdate |
||||
|
}, |
||||
|
created () { |
||||
|
this.getGridList() |
||||
|
this.getValiheList() |
||||
|
}, |
||||
|
computed: { |
||||
|
changeVDisabled() { |
||||
|
return !this.dataForm.villageId |
||||
|
}, |
||||
|
changeBDisabled() { |
||||
|
return !this.dataForm.buildId |
||||
|
}, |
||||
|
changeDDisabled() { |
||||
|
return !this.dataForm.unitId |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
// 新增 / 修改 |
||||
|
addOrUpdateHandle (id,flag) { |
||||
|
this.addOrUpdateVisible = true |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs.addOrUpdate.dataForm.id = id |
||||
|
this.$refs.addOrUpdate.dataForm.flag = flag |
||||
|
this.$refs.addOrUpdate.init() |
||||
|
}) |
||||
|
}, |
||||
|
btKeyUpLesseeIdCard (e) { |
||||
|
e.target.value = e.target.value.replace(/[`~!#$%^&*()_\+=<>?:"{}|~！#￥%……&*（）={}|《》？：“”【】\\[\]、；‘’，。、\s+]/g, '') |
||||
|
this.dataForm.lesseeIdCard = e.target.value |
||||
|
}, |
||||
|
btKeyUpLesseeMobile (e) { |
||||
|
e.target.value = e.target.value.replace(/[`~!#$%^&*()_\+=<>?:"{}|~！#￥%……&*（）={}|《》？：“”【】\\[\]、；‘’，。、\s+]/g, '') |
||||
|
this.dataForm.lesseeMobile = e.target.value |
||||
|
}, |
||||
|
btKeyUpLesseeName (e) { |
||||
|
e.target.value = e.target.value.replace(/[`~!#$%^&*()_\+=<>?:"{}|~！#￥%……&*（）={}|《》？：“”【】\\[\]、；‘’，。、\s+]/g, '') |
||||
|
this.dataForm.lesseeName = e.target.value |
||||
|
}, |
||||
|
btKeyUpLessorIdCard (e) { |
||||
|
e.target.value = e.target.value.replace(/[`~!#$%^&*()_\+=<>?:"{}|~！#￥%……&*（）={}|《》？：“”【】\\[\]、；‘’，。、\s+]/g, '') |
||||
|
this.dataForm.lessorIdCard = e.target.value |
||||
|
}, |
||||
|
btKeyUpLessorMobile (e) { |
||||
|
e.target.value = e.target.value.replace(/[`~!#$%^&*()_\+=<>?:"{}|~！#￥%……&*（）={}|《》？：“”【】\\[\]、；‘’，。、\s+]/g, '') |
||||
|
this.dataForm.lessorMobile = e.target.value |
||||
|
}, |
||||
|
btKeyUpLessorName (e) { |
||||
|
e.target.value = e.target.value.replace(/[`~!#$%^&*()_\+=<>?:"{}|~！#￥%……&*（）={}|《》？：“”【】\\[\]、；‘’，。、\s+]/g, '') |
||||
|
this.dataForm.lessorName = e.target.value |
||||
|
}, |
||||
|
handleClearVillage() { |
||||
|
this.dataForm.buildId = '' |
||||
|
this.dataForm.homeId = '' |
||||
|
}, |
||||
|
handleClearBuild() { |
||||
|
this.dataForm.buildId = '' |
||||
|
this.dataForm.unitId = '' |
||||
|
this.dataForm.homeId = '' |
||||
|
}, |
||||
|
handleClearDan() { |
||||
|
this.dataForm.unitId = '' |
||||
|
this.dataForm.homeId = '' |
||||
|
}, |
||||
|
handleChangeGrid(val) { |
||||
|
console.log('val', val) |
||||
|
this.dataForm.villageId = '' |
||||
|
this.dataForm.buildId = '' |
||||
|
this.dataForm.unitId = '' |
||||
|
this.dataForm.homeId = '' |
||||
|
this.getValiheList() |
||||
|
}, |
||||
|
getGridList() { |
||||
|
const { user } = this.$store.state |
||||
|
this.$http |
||||
|
.post('/gov/org/customergrid/gridoption', { agencyId: user.agencyId, purpose: 'query' }) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取查询详情成功', res.data) |
||||
|
this.optionsG = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
getValiheList() { |
||||
|
const { user } = this.$store.state |
||||
|
this.$http |
||||
|
.post('/gov/org/icneighborhood/neighborhoodoption', { |
||||
|
gridId: this.dataForm.gridId, |
||||
|
agencyId: '' |
||||
|
// agencyId: user.agencyId |
||||
|
}) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取查询详情成功', res.data) |
||||
|
this.optionsV = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
getBuildList() { |
||||
|
this.$http |
||||
|
.post('/gov/org/icbuilding/buildingoption', { |
||||
|
neighborHoodId: this.dataForm.villageId |
||||
|
}) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取查询详情成功', res.data) |
||||
|
this.optionsB = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
getUniList() { |
||||
|
this.$http |
||||
|
.post('/gov/org/icbuildingunit/unitoption', { |
||||
|
buildingId: this.dataForm.buildId |
||||
|
}) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取查询详情成功', res.data) |
||||
|
this.optionsD = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
getHouseList() { |
||||
|
this.$http |
||||
|
.post('/gov/org/ichouse/houseoption', { unitId: this.dataForm.unitId }) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取查询详情成功', res.data) |
||||
|
this.optionsH = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
handleChangeV(val) { |
||||
|
console.log('val', val) |
||||
|
this.dataForm.buildId = '' |
||||
|
this.dataForm.unitId = '' |
||||
|
this.dataForm.homeId = '' |
||||
|
this.getBuildList() |
||||
|
}, |
||||
|
handleChangeB(val) { |
||||
|
console.log('val', val) |
||||
|
this.dataForm.unitId = '' |
||||
|
this.dataForm.homeId = '' |
||||
|
this.getUniList() |
||||
|
}, |
||||
|
handleChangeD(val) { |
||||
|
console.log('val', val) |
||||
|
this.dataForm.homeId = '' |
||||
|
this.getHouseList() |
||||
|
}, |
||||
|
}, |
||||
|
} |
||||
|
</script> |
||||
@ -0,0 +1,398 @@ |
|||||
|
<template> |
||||
|
<el-card shadow="never" class="aui-card--fill"> |
||||
|
<div class="mod-rent__rentContractInfo}"> |
||||
|
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()"> |
||||
|
<el-form-item label="所属网格" label-width="100px" |
||||
|
prop="gridId"> |
||||
|
<el-select |
||||
|
v-model.trim="dataForm.gridId" |
||||
|
placeholder="请选择" |
||||
|
clearable |
||||
|
@change="handleChangeGrid" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in optionsG" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="所属房屋" label-width="100px"> |
||||
|
<div class="resi-cell-value"> |
||||
|
<div class="resi-cell-col"> |
||||
|
<el-form-item prop="villageId"> |
||||
|
<el-select |
||||
|
v-model.trim="dataForm.villageId" |
||||
|
placeholder="请选择小区" |
||||
|
clearable |
||||
|
@clear="handleClearVillage" |
||||
|
@change="handleChangeV" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in optionsV" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item prop="buildId"> |
||||
|
<el-select |
||||
|
v-model.trim="dataForm.buildId" |
||||
|
placeholder="楼号" |
||||
|
clearable |
||||
|
style="width: 120px;" |
||||
|
:disabled="changeVDisabled" |
||||
|
@clear="handleClearBuild" |
||||
|
@change="handleChangeB" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in optionsB" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item prop="unitId"> |
||||
|
<el-select |
||||
|
v-model.trim="dataForm.unitId" |
||||
|
:disabled="changeBDisabled" |
||||
|
placeholder="单元" |
||||
|
clearable |
||||
|
style="width: 120px;" |
||||
|
@click="handleClearDan" |
||||
|
@change="handleChangeD" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in optionsD" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item prop="homeId"> |
||||
|
<el-select |
||||
|
v-model.trim="dataForm.homeId" |
||||
|
:disabled="changeDDisabled" |
||||
|
placeholder="房号" |
||||
|
clearable |
||||
|
style="width: 120px;" |
||||
|
> |
||||
|
<el-option |
||||
|
v-for="item in optionsH" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value" |
||||
|
> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-form-item> |
||||
|
<br/> |
||||
|
<el-form-item label="审核状态" prop="scanFlag" label-width="100px"> |
||||
|
<el-select v-model="dataForm.state" placeholder="审核状态" clearable> |
||||
|
<el-option v-for="item in stateArr" :key="item.dictValue" :label="item.dictName" :value="item.dictValue"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="承租人身份证" label-width="100px"> |
||||
|
<el-input v-model="dataForm.lesseeIdCard" placeholder='承租人身份证' clearable @keyup.native="btKeyUpLesseeIdCard"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="承租人手机号" label-width="100px"> |
||||
|
<el-input v-model="dataForm.lesseeMobile" placeholder='承租人手机号' clearable @keyup.native="btKeyUpLesseeMobile"></el-input> |
||||
|
</el-form-item> |
||||
|
<br/> |
||||
|
<el-form-item label="承租人" label-width="100px"> |
||||
|
<el-input v-model="dataForm.lesseeName" placeholder='承租人' clearable @keyup.native="btKeyUpLesseeName"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="审核时间" prop="startTime" label-width="100px"> |
||||
|
<el-date-picker v-model="dataForm.startTime" |
||||
|
type="date" |
||||
|
:picker-options="pickerBeginDateBefore" |
||||
|
value-format="yyyy-MM-dd" |
||||
|
format="yyyy-MM-dd" |
||||
|
placeholder="选择日期时间" |
||||
|
style="width:200px" @change="changeTime"> |
||||
|
</el-date-picker> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="至" prop="endTime"> |
||||
|
<el-date-picker v-model="dataForm.endTime" |
||||
|
type="date" |
||||
|
:picker-options="pickerBeginDateAfter" |
||||
|
value-format="yyyy-MM-dd" |
||||
|
format="yyyy-MM-dd" |
||||
|
placeholder="选择日期时间" |
||||
|
style="width:200px" @change="changeTime"> |
||||
|
</el-date-picker> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button @click="getDataList()">{{ $t('query') }}</el-button> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button v-if="false" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%"> |
||||
|
<el-table-column label="序号" header-align="center" align="center" width="50px"> |
||||
|
<template slot-scope="scope"> |
||||
|
{{scope.$index+1}} |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="gridName" label="所属网格" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column label="所属房屋" header-align="center" align="center"> |
||||
|
<template slot-scope="scope"> |
||||
|
{{scope.row.villageName}}{{scope.row.buildName}}{{scope.row.unitName}}{{scope.row.homeName}} |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<!-- <el-table-column prop="buildName" label="楼号" header-align="center" align="center"></el-table-column>--> |
||||
|
<!-- <el-table-column prop="unitName" label="单元" header-align="center" align="center"></el-table-column>--> |
||||
|
<!-- <el-table-column prop="homeName" label="房屋" header-align="center" align="center"></el-table-column>--> |
||||
|
<el-table-column prop="lesseeName" label="承租人" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="lesseeIdCard" label="身份证" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="lesseeMobile" label="手机" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="state" label="审核状态" header-align="center" align="center"> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-tag v-if="scope.row.state === '1'" size="small" type="success">审核通过</el-tag> |
||||
|
<el-tag v-else-if="scope.row.state === '2'" size="small" type="danger">审核不通过</el-tag> |
||||
|
<el-tag v-else size="small">未审核</el-tag> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="isBlack" label="是否黑名单人员" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150"> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-button v-if="scope.row.state === '0'" type="text" size="small" @click="addOrUpdateHandle(scope.row.id,'2')">{{ $t('checkBtn') }}</el-button> |
||||
|
<el-button v-else type="text" size="small" @click="addOrUpdateHandle(scope.row.id,'2')">{{ $t('lookBtn') }}</el-button> |
||||
|
<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
<el-pagination |
||||
|
:current-page="page" |
||||
|
:page-sizes="[10, 20, 50, 100]" |
||||
|
:page-size="limit" |
||||
|
:total="total" |
||||
|
layout="total, sizes, prev, pager, next, jumper" |
||||
|
@size-change="pageSizeChangeHandle" |
||||
|
@current-change="pageCurrentChangeHandle"> |
||||
|
</el-pagination> |
||||
|
<!-- 弹窗, 新增 / 修改 --> |
||||
|
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update> |
||||
|
</div> |
||||
|
</el-card> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import mixinViewModule from '@/mixins/view-module' |
||||
|
import AddOrUpdate from './rentcontractinfo-add-or-update' |
||||
|
export default { |
||||
|
mixins: [mixinViewModule], |
||||
|
data () { |
||||
|
return { |
||||
|
mixinViewModuleOptions: { |
||||
|
getDataListURL: '/pli/power/rentContractInfo/page', |
||||
|
getDataListIsPage: true, |
||||
|
deleteURL: '/pli/power/rentContractInfo', |
||||
|
deleteIsBatch: true |
||||
|
}, |
||||
|
optionsV: [], |
||||
|
optionsB: [], |
||||
|
optionsH: [], |
||||
|
optionsD: [], |
||||
|
optionsG: [], |
||||
|
dataForm: { |
||||
|
id: '', |
||||
|
gridId: '', |
||||
|
villageId: '', |
||||
|
buildId: '', |
||||
|
unitId: '', |
||||
|
homeId: '', |
||||
|
lesseeIdCard: '', |
||||
|
state: '0', |
||||
|
lesseeMobile: '', |
||||
|
lesseeName: '', |
||||
|
startTime: '', |
||||
|
endTime: '' |
||||
|
}, |
||||
|
stateArr: [ |
||||
|
{dictValue: '0', dictName: '未审核'}, |
||||
|
{dictValue: '1', dictName: '审核通过'}, |
||||
|
{dictValue: '2', dictName: '审核不通过'} |
||||
|
] |
||||
|
} |
||||
|
}, |
||||
|
components: { |
||||
|
AddOrUpdate |
||||
|
}, |
||||
|
created () { |
||||
|
this.getGridList() |
||||
|
this.getValiheList() |
||||
|
}, |
||||
|
computed: { |
||||
|
changeVDisabled() { |
||||
|
return !this.dataForm.villageId |
||||
|
}, |
||||
|
changeBDisabled() { |
||||
|
return !this.dataForm.buildId |
||||
|
}, |
||||
|
changeDDisabled() { |
||||
|
return !this.dataForm.unitId |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
// 新增 / 修改 |
||||
|
addOrUpdateHandle (id,flag) { |
||||
|
this.addOrUpdateVisible = true |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs.addOrUpdate.dataForm.id = id |
||||
|
this.$refs.addOrUpdate.dataForm.flag = flag |
||||
|
this.$refs.addOrUpdate.init() |
||||
|
}) |
||||
|
}, |
||||
|
btKeyUpLesseeIdCard (e) { |
||||
|
e.target.value = e.target.value.replace(/[`~!#$%^&*()_\+=<>?:"{}|~！#￥%……&*（）={}|《》？：“”【】\\[\]、；‘’，。、\s+]/g, '') |
||||
|
this.dataForm.lesseeIdCard = e.target.value |
||||
|
}, |
||||
|
btKeyUpLesseeMobile (e) { |
||||
|
e.target.value = e.target.value.replace(/[`~!#$%^&*()_\+=<>?:"{}|~！#￥%……&*（）={}|《》？：“”【】\\[\]、；‘’，。、\s+]/g, '') |
||||
|
this.dataForm.lesseeMobile = e.target.value |
||||
|
}, |
||||
|
btKeyUpLesseeName (e) { |
||||
|
e.target.value = e.target.value.replace(/[`~!#$%^&*()_\+=<>?:"{}|~！#￥%……&*（）={}|《》？：“”【】\\[\]、；‘’，。、\s+]/g, '') |
||||
|
this.dataForm.lesseeName = e.target.value |
||||
|
}, |
||||
|
handleClearVillage() { |
||||
|
this.dataForm.buildId = '' |
||||
|
this.dataForm.homeId = '' |
||||
|
}, |
||||
|
handleClearBuild() { |
||||
|
this.dataForm.buildId = '' |
||||
|
this.dataForm.unitId = '' |
||||
|
this.dataForm.homeId = '' |
||||
|
}, |
||||
|
handleClearDan() { |
||||
|
this.dataForm.unitId = '' |
||||
|
this.dataForm.homeId = '' |
||||
|
}, |
||||
|
handleChangeGrid(val) { |
||||
|
console.log('val', val) |
||||
|
this.dataForm.villageId = '' |
||||
|
this.dataForm.buildId = '' |
||||
|
this.dataForm.unitId = '' |
||||
|
this.dataForm.homeId = '' |
||||
|
this.getValiheList() |
||||
|
}, |
||||
|
getGridList() { |
||||
|
const { user } = this.$store.state |
||||
|
this.$http |
||||
|
.post('/gov/org/customergrid/gridoption', { agencyId: user.agencyId, purpose: 'query' }) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取查询详情成功', res.data) |
||||
|
this.optionsG = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
getValiheList() { |
||||
|
const { user } = this.$store.state |
||||
|
this.$http |
||||
|
.post('/gov/org/icneighborhood/neighborhoodoption', { |
||||
|
gridId: this.dataForm.gridId, |
||||
|
agencyId: '' |
||||
|
// agencyId: user.agencyId |
||||
|
}) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取查询详情成功', res.data) |
||||
|
this.optionsV = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
getBuildList() { |
||||
|
this.$http |
||||
|
.post('/gov/org/icbuilding/buildingoption', { |
||||
|
neighborHoodId: this.dataForm.villageId |
||||
|
}) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取查询详情成功', res.data) |
||||
|
this.optionsB = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
getUniList() { |
||||
|
this.$http |
||||
|
.post('/gov/org/icbuildingunit/unitoption', { |
||||
|
buildingId: this.dataForm.buildId |
||||
|
}) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取查询详情成功', res.data) |
||||
|
this.optionsD = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
getHouseList() { |
||||
|
this.$http |
||||
|
.post('/gov/org/ichouse/houseoption', { unitId: this.dataForm.unitId }) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取查询详情成功', res.data) |
||||
|
this.optionsH = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
handleChangeV(val) { |
||||
|
console.log('val', val) |
||||
|
this.dataForm.buildId = '' |
||||
|
this.dataForm.unitId = '' |
||||
|
this.dataForm.homeId = '' |
||||
|
this.getBuildList() |
||||
|
}, |
||||
|
handleChangeB(val) { |
||||
|
console.log('val', val) |
||||
|
this.dataForm.unitId = '' |
||||
|
this.dataForm.homeId = '' |
||||
|
this.getUniList() |
||||
|
}, |
||||
|
handleChangeD(val) { |
||||
|
console.log('val', val) |
||||
|
this.dataForm.homeId = '' |
||||
|
this.getHouseList() |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
@ -0,0 +1,159 @@ |
|||||
|
<template> |
||||
|
<el-dialog :visible.sync="visible" :title="!dataForm.id ? $t('add') : $t('update')" :close-on-click-modal="false" :close-on-press-escape="false"> |
||||
|
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()" :label-width="$i18n.locale === 'en-US' ? '120px' : '80px'"> |
||||
|
<el-form-item label="合同ID" prop="contractId"> |
||||
|
<el-input v-model="dataForm.contractId" placeholder="合同ID"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="姓名" prop="name"> |
||||
|
<el-input v-model="dataForm.name" placeholder="姓名"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="身份证" prop="idCard"> |
||||
|
<el-input v-model="dataForm.idCard" placeholder="身份证"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="手机号" prop="mobile"> |
||||
|
<el-input v-model="dataForm.mobile" placeholder="手机号"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="与房主关系" prop="yfzgx"> |
||||
|
<el-input v-model="dataForm.yfzgx" placeholder="与房主关系"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="照片" prop="img"> |
||||
|
<el-input v-model="dataForm.img" placeholder="照片"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="删除标记 0：未删除，1：已删除" prop="delFlag"> |
||||
|
<el-input v-model="dataForm.delFlag" placeholder="删除标记 0：未删除，1：已删除"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="乐观锁" prop="revision"> |
||||
|
<el-input v-model="dataForm.revision" placeholder="乐观锁"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="创建人" prop="createdBy"> |
||||
|
<el-input v-model="dataForm.createdBy" placeholder="创建人"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="创建时间" prop="createdTime"> |
||||
|
<el-input v-model="dataForm.createdTime" placeholder="创建时间"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="更新人" prop="updatedBy"> |
||||
|
<el-input v-model="dataForm.updatedBy" placeholder="更新人"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="更新时间" prop="updatedTime"> |
||||
|
<el-input v-model="dataForm.updatedTime" placeholder="更新时间"></el-input> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<template slot="footer"> |
||||
|
<el-button @click="visible = false">{{ $t('cancel') }}</el-button> |
||||
|
<el-button type="primary" @click="dataFormSubmitHandle()">{{ $t('confirm') }}</el-button> |
||||
|
</template> |
||||
|
</el-dialog> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import debounce from 'lodash/debounce' |
||||
|
export default { |
||||
|
data () { |
||||
|
return { |
||||
|
visible: false, |
||||
|
dataForm: { |
||||
|
id: '', |
||||
|
contractId: '', |
||||
|
name: '', |
||||
|
idCard: '', |
||||
|
mobile: '', |
||||
|
yfzgx: '', |
||||
|
img: '', |
||||
|
delFlag: '', |
||||
|
revision: '', |
||||
|
createdBy: '', |
||||
|
createdTime: '', |
||||
|
updatedBy: '', |
||||
|
updatedTime: '' |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
dataRule () { |
||||
|
return { |
||||
|
contractId: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
name: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
idCard: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
mobile: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
yfzgx: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
img: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
delFlag: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
revision: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
createdBy: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
createdTime: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
updatedBy: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
], |
||||
|
updatedTime: [ |
||||
|
{ required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
] |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
init () { |
||||
|
this.visible = true |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs['dataForm'].resetFields() |
||||
|
if (this.dataForm.id) { |
||||
|
this.getInfo() |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
// 获取信息 |
||||
|
getInfo () { |
||||
|
this.$http.get(`/pli/power/rentTenantInfo/${this.dataForm.id}`).then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.dataForm = { |
||||
|
...this.dataForm, |
||||
|
...res.data |
||||
|
} |
||||
|
}).catch(() => {}) |
||||
|
}, |
||||
|
// 表单提交 |
||||
|
dataFormSubmitHandle: debounce(function () { |
||||
|
this.$refs['dataForm'].validate((valid) => { |
||||
|
if (!valid) { |
||||
|
return false |
||||
|
} |
||||
|
this.$http[!this.dataForm.id ? 'post' : 'put']('/pli/power/rentTenantInfo/', this.dataForm).then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.$message({ |
||||
|
message: this.$t('prompt.success'), |
||||
|
type: 'success', |
||||
|
duration: 500, |
||||
|
onClose: () => { |
||||
|
this.visible = false |
||||
|
this.$emit('refreshDataList') |
||||
|
} |
||||
|
}) |
||||
|
}).catch(() => {}) |
||||
|
}) |
||||
|
}, 1000, { 'leading': true, 'trailing': false }) |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
@ -0,0 +1,74 @@ |
|||||
|
<template> |
||||
|
<el-card shadow="never" class="aui-card--fill"> |
||||
|
<div class="mod-rent__rentTenantInfo}"> |
||||
|
<el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()"> |
||||
|
<el-form-item> |
||||
|
<el-input v-model="dataForm.id" placeholder="id" clearable></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button @click="getDataList()">{{ $t('query') }}</el-button> |
||||
|
</el-form-item> |
||||
|
<el-form-item> |
||||
|
<el-button type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle" style="width: 100%"> |
||||
|
<el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column> |
||||
|
<el-table-column prop="id" label="主键" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="contractId" label="合同ID" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="name" label="姓名" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="idCard" label="身份证" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="mobile" label="手机号" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="yfzgx" label="与房主关系" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="img" label="照片" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="delFlag" label="删除标记 0：未删除，1：已删除" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="revision" label="乐观锁" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="createdBy" label="创建人" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="createdTime" label="创建时间" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="updatedBy" label="更新人" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column prop="updatedTime" label="更新时间" header-align="center" align="center"></el-table-column> |
||||
|
<el-table-column :label="$t('handle')" fixed="right" header-align="center" align="center" width="150"> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">{{ $t('update') }}</el-button> |
||||
|
<el-button type="text" size="small" @click="deleteHandle(scope.row.id)">{{ $t('delete') }}</el-button> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
<el-pagination |
||||
|
:current-page="page" |
||||
|
:page-sizes="[10, 20, 50, 100]" |
||||
|
:page-size="limit" |
||||
|
:total="total" |
||||
|
layout="total, sizes, prev, pager, next, jumper" |
||||
|
@size-change="pageSizeChangeHandle" |
||||
|
@current-change="pageCurrentChangeHandle"> |
||||
|
</el-pagination> |
||||
|
<!-- 弹窗, 新增 / 修改 --> |
||||
|
<add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update> |
||||
|
</div> |
||||
|
</el-card> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import mixinViewModule from '@/mixins/view-module' |
||||
|
import AddOrUpdate from './renttenantinfo-add-or-update' |
||||
|
export default { |
||||
|
mixins: [mixinViewModule], |
||||
|
data () { |
||||
|
return { |
||||
|
mixinViewModuleOptions: { |
||||
|
getDataListURL: '/pli/power/rentTenantInfo/page', |
||||
|
getDataListIsPage: true, |
||||
|
deleteURL: '/pli/power/rentTenantInfo', |
||||
|
deleteIsBatch: true |
||||
|
}, |
||||
|
dataForm: { |
||||
|
id: '' |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
components: { |
||||
|
AddOrUpdate |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
File diff suppressed because it is too large
Loading…
Reference in new issue