jiangyy
3 years ago
10 changed files with 3779 additions and 480 deletions
|
Before Width: | Height: | Size: 751 B After Width: | Height: | Size: 1.4 KiB |
|
Before Width: | Height: | Size: 753 B After Width: | Height: | Size: 1.1 KiB |
@ -0,0 +1,813 @@ |
|||||
|
<template> |
||||
|
<div class="resi-container"> |
||||
|
<!-- <el-card class="resi-card"> --> |
||||
|
<el-row class="resi-row-box" :class="!isArrow && 'resi-row-more'"> |
||||
|
<el-row v-if="showGrid" class="resi-row"> |
||||
|
<el-col :span="6"> |
||||
|
<div class="resi-cell"> |
||||
|
<div class="resi-cell-label">所属组织</div> |
||||
|
<div class="resi-cell-value"> |
||||
|
<el-cascader class="customer_cascader" |
||||
|
ref="myCascader" |
||||
|
v-model="agencyIdArray" |
||||
|
:options="orgOptions" |
||||
|
:props="orgOptionProps" |
||||
|
:show-all-levels="false" |
||||
|
@change="handleChangeAgency"></el-cascader> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-col> |
||||
|
<!-- <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" |
||||
|
filterable |
||||
|
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" |
||||
|
filterable |
||||
|
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" |
||||
|
filterable |
||||
|
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" |
||||
|
filterable |
||||
|
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(itemList, 4)" |
||||
|
:key="index" |
||||
|
class="resi-row" |
||||
|
> |
||||
|
<el-col v-for="n in item" :key="n.id" :span="computdSpan(item.length)"> |
||||
|
<div class="resi-cell"> |
||||
|
<div class="resi-cell-label" :class="item.length != 4 && 'resi-cell-label1'">{{ 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 == 'inputRange'"> |
||||
|
<!-- <el-input |
||||
|
v-model.trim="form[n.columnName]" |
||||
|
class="resi-cell-input" |
||||
|
size="small" |
||||
|
clearable |
||||
|
placeholder="请输入内容" |
||||
|
/> --> |
||||
|
<inputRange v-model="form[n.columnName]" :type="n.validType" @change="handleAgeChange" /> |
||||
|
</template> |
||||
|
<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" |
||||
|
:collapse-tags="n.multiSelect == 1 ? true : false" |
||||
|
:multiple="n.multiSelect == 1 ? true : false" |
||||
|
> |
||||
|
<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> |
||||
|
<template v-else-if="n.itemType === 'checkbox'"> |
||||
|
<el-checkbox-group v-model="form[n.columnName]"> |
||||
|
<el-checkbox v-for="ns in n.options" :key="ns.value" :label="ns.value">{{ns.label}}</el-checkbox> |
||||
|
<!-- <el-checkbox label="n.la"></el-checkbox> --> |
||||
|
</el-checkbox-group> |
||||
|
</template> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
</el-row> |
||||
|
<el-row v-if="isArrow" 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 v-if="isArrow" 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> |
||||
|
import inputRange from './rangeInput.vue' |
||||
|
export default { |
||||
|
name: 'ResiSearch', |
||||
|
components: { |
||||
|
inputRange |
||||
|
}, |
||||
|
props: { |
||||
|
formList: { |
||||
|
type: Array, |
||||
|
default: () => [] |
||||
|
}, |
||||
|
columnName: { |
||||
|
type: String, |
||||
|
default: '' |
||||
|
}, |
||||
|
showGrid: { |
||||
|
type: Boolean, |
||||
|
default: false |
||||
|
}, |
||||
|
isArrow: { |
||||
|
type: Boolean, |
||||
|
default: false |
||||
|
} |
||||
|
}, |
||||
|
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 (item.itemType == 'checkbox') _form[item.columnName] = [] |
||||
|
else if (item.queryType == 'resi_category' && columnName ){ |
||||
|
_form[item.columnName] = [columnName] |
||||
|
} else if (columnName && columnName === item.columnName) _form[item.columnName] = '1' |
||||
|
else if (item.itemType == 'inputRange') _form[item.columnName] = { start: '', end: ''} |
||||
|
else _form[item.columnName] = '' |
||||
|
}) |
||||
|
return _form |
||||
|
} |
||||
|
let itemList = this.formList.map(item => { |
||||
|
if (item.itemType == 'inputRange' && item.funType == 'agetoyear') { |
||||
|
item.columnName = 'age' |
||||
|
} |
||||
|
return { |
||||
|
...item |
||||
|
} |
||||
|
}) |
||||
|
let form = initForm(itemList, this.columnName) |
||||
|
let tempFormList = itemList.map(item => { |
||||
|
|
||||
|
return { |
||||
|
...item, |
||||
|
isChange:( item.queryType == 'resi_category' && this.columnName) || this.columnName === item.columnName ? true : false |
||||
|
} |
||||
|
}) |
||||
|
let constForm = { |
||||
|
...form, |
||||
|
GRID_ID: '', |
||||
|
VILLAGE_ID: '', |
||||
|
BUILD_ID: '', |
||||
|
UNIT_ID: '', |
||||
|
HOME_ID: '' |
||||
|
} |
||||
|
let orgOptionProps = { |
||||
|
multiple: false, |
||||
|
value: 'agencyId', |
||||
|
label: 'agencyName', |
||||
|
children: 'subAgencyList', |
||||
|
checkStrictly: true |
||||
|
} |
||||
|
|
||||
|
return { |
||||
|
pageLoading: false, |
||||
|
openSearch: false, |
||||
|
optionsV: [], |
||||
|
optionsB: [], |
||||
|
optionsH: [], |
||||
|
optionsD: [], |
||||
|
optionsG: [], |
||||
|
orgOptions: [], |
||||
|
orgOptionProps, |
||||
|
agencyIdArray:[], |
||||
|
value: '', |
||||
|
itemList, |
||||
|
fixedList: [], |
||||
|
fixedForm: { |
||||
|
AGENCY_ID: '', |
||||
|
GRID_ID: '', |
||||
|
VILLAGE_ID: '', |
||||
|
BUILD_ID: '', |
||||
|
UNIT_ID: '', |
||||
|
HOME_ID: '' |
||||
|
}, |
||||
|
constForm, |
||||
|
form: { |
||||
|
...form, |
||||
|
AGENCY_ID: '', |
||||
|
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]) |
||||
|
} |
||||
|
} |
||||
|
] |
||||
|
}, |
||||
|
|
||||
|
queryType:{ |
||||
|
'AGENCY_ID':'like' |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
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.getOrgTreeList() |
||||
|
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) |
||||
|
}, |
||||
|
computdSpan(len) { |
||||
|
return len == 1 ? 24 : 6 |
||||
|
}, |
||||
|
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) { |
||||
|
if (n == 'age') { |
||||
|
this.form.age = { |
||||
|
start: '', |
||||
|
end: '' |
||||
|
} |
||||
|
} else if (typeof this.form[n] == 'object') this.form[n] = [] |
||||
|
else this.form[n] = '' |
||||
|
|
||||
|
} |
||||
|
this. agencyIdArray=[] |
||||
|
// let arr3 = [...arr1, ...arr] |
||||
|
this.$emit('search', []) |
||||
|
// this.handleSearch() |
||||
|
// this.orgOptions = []; |
||||
|
}, |
||||
|
handleSearch() { |
||||
|
// console.log('formmmmm---', this.form) |
||||
|
const itemTypes = ['daterange', 'timerange', 'checkbox'] |
||||
|
let a = this.tempFormList.filter(item => item.itemType != 'inputRange') |
||||
|
let arr = a.filter((n) => n.isChange).map((item) => { |
||||
|
return { |
||||
|
queryType: item.queryType, |
||||
|
tableName: item.tableName, |
||||
|
columnName: item.columnName, |
||||
|
// columnValue: [] |
||||
|
columnValue: this.form[item.columnName] && |
||||
|
(itemTypes.includes(item.queryType) || |
||||
|
itemTypes.includes(item.itemType) || item.multiSelect == 1 |
||||
|
? this.form[item.columnName] |
||||
|
: [this.form[item.columnName].toString()]) |
||||
|
} |
||||
|
}) |
||||
|
const arr2 = arr.filter(item => item.columnValue.length > 0) |
||||
|
let arr1 = this.fixedList |
||||
|
.filter((n) => n.columnValue.length > 0) |
||||
|
.map((item) => { |
||||
|
return { |
||||
|
...item |
||||
|
} |
||||
|
}) |
||||
|
let arr3 = [...arr1, ...arr2] |
||||
|
this.$emit('search', arr3) |
||||
|
return arr3 |
||||
|
}, |
||||
|
handleOpenSearch() { |
||||
|
this.openSearch = !this.openSearch |
||||
|
}, |
||||
|
handleAgeChange(val) { |
||||
|
console.log('val----age---', val) |
||||
|
if (val.end) { |
||||
|
const s = this.computedBirth(val.end) |
||||
|
const e = this.computedBirth(val.start) |
||||
|
this.form.BIRTHDAY = [s, e] |
||||
|
} |
||||
|
}, |
||||
|
handleChangeAgency(val) { |
||||
|
let obj = this.$refs["myCascader"].getCheckedNodes()[0].data |
||||
|
if (obj) { |
||||
|
if(obj.level === 'grid'){ |
||||
|
this.form.GRID_ID = this.agencyIdArray.length > 0 ? this.agencyIdArray[this.agencyIdArray.length - 1] : ''; |
||||
|
this.form.AGENCY_ID='' |
||||
|
}else{ |
||||
|
this.form.AGENCY_ID = this.agencyIdArray.length > 0 ? this.agencyIdArray[this.agencyIdArray.length - 1] : ''; |
||||
|
this.form.GRID_ID = '' |
||||
|
} |
||||
|
|
||||
|
}else{ |
||||
|
this.form.AGENCY_ID='' |
||||
|
this.form.GRID_ID = '' |
||||
|
} |
||||
|
|
||||
|
this.form.VILLAGE_ID = '' |
||||
|
this.form.BUILD_ID = '' |
||||
|
this.form.UNIT_ID = '' |
||||
|
this.form.HOME_ID = '' |
||||
|
this.getValiheList() |
||||
|
}, |
||||
|
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: this.queryType[val]?this.queryType[val]:'equal',//'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: this.queryType[val]?this.queryType[val]:'equal',//'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 |
||||
|
}) |
||||
|
}, |
||||
|
getOrgTreeList() { |
||||
|
const { user } = this.$store.state |
||||
|
this.$http |
||||
|
.post('/gov/org/customeragency/agencygridtree', {}) |
||||
|
.then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} else { |
||||
|
console.log('获取组织树成功', res.data) |
||||
|
this.orgOptions=[] |
||||
|
this.orgOptions .push( res.data) |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
return this.$message.error('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
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: this.form.AGENCY_ID, |
||||
|
// 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('网络错误') |
||||
|
}) |
||||
|
}, |
||||
|
computedBirth(age) { |
||||
|
let now = new Date(); |
||||
|
let nowYear = now.getFullYear(); |
||||
|
let nowMonth = now.getMonth()+1; |
||||
|
let nowDay = now.getDate(); // 按照减法原理，先day相减，不够向month借；然后month相减，不够向year借；最后year相减。 |
||||
|
let subYear = nowYear - age |
||||
|
if(nowMonth < 10){ |
||||
|
nowMonth = '0'+ nowMonth |
||||
|
} |
||||
|
if(nowDay < 10){ |
||||
|
nowDay = '0' + nowDay |
||||
|
} |
||||
|
console.log(subYear+'-'+nowMonth+'-'+nowDay); |
||||
|
return subYear + '-' + nowMonth + '-' + nowDay |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scope> |
||||
|
// .resi-container { |
||||
|
// position: relative; |
||||
|
// overflow: visible; |
||||
|
// } |
||||
|
// .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: 214px; |
||||
|
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; |
||||
|
min-width: 70px; |
||||
|
box-sizing: border-box; |
||||
|
margin-right: 15px; |
||||
|
text-align: right; |
||||
|
// line-height: 32; |
||||
|
} |
||||
|
.resi-cell-label1 { |
||||
|
width: max-content; |
||||
|
} |
||||
|
.resi-cell-value-radio { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
min-height: 32px; |
||||
|
} |
||||
|
.resi-cell-input { |
||||
|
max-width: 200px; |
||||
|
} |
||||
|
.resi-cell--daterange { |
||||
|
max-width: 240px; |
||||
|
} |
||||
|
.resi-cell-select { |
||||
|
max-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,951 @@ |
|||||
|
<template> |
||||
|
<div> |
||||
|
<!-- <div> |
||||
|
<el-checkbox v-model="personChecked"></el-checkbox> |
||||
|
<span @click="clickTab('person')" |
||||
|
:class="['tab-title',{'tab-title-sel':personSel}]">人员信息</span> |
||||
|
<el-checkbox v-model="houseChecked"></el-checkbox> |
||||
|
<span @click="clickTab('house')" |
||||
|
:class="['tab-title',{'tab-title-sel':houseSel}]">房屋信息</span> |
||||
|
|
||||
|
</div> --> |
||||
|
<div class="m-main"> |
||||
|
<div v-for="(ruleItem,ruleIndex) in smartRuleList" |
||||
|
:key="ruleIndex" |
||||
|
class="row-item"> |
||||
|
<el-select class="item_width_1" |
||||
|
v-model="selSmartType" |
||||
|
size="mini" |
||||
|
placeholder="请选择"> |
||||
|
<el-option v-for="item in smartList1" |
||||
|
@click.native="handleSelSmartType(item.value)" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
</div> |
||||
|
|
||||
|
<div v-if="houseSel" |
||||
|
style="margin-top:10px"> |
||||
|
<div v-for="(houseItem,houseIndex) in houseRuleList" |
||||
|
:key="houseIndex" |
||||
|
class="row-item"> |
||||
|
<el-input class="item_width_1" |
||||
|
size="mini" |
||||
|
placeholder="请输入" |
||||
|
:disabled="true" |
||||
|
v-model="houseTitleName"> |
||||
|
</el-input> |
||||
|
<el-select class="item_width_1" |
||||
|
v-model="houseItem.colKey" |
||||
|
size="mini" |
||||
|
placeholder="请选择"> |
||||
|
<el-option v-for="item in houseItemList" |
||||
|
@click.native="handleSelHouseItem(houseIndex,item)" |
||||
|
:key="item.colKey" |
||||
|
:label="item.label" |
||||
|
:value="item.colKey"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
<el-select class="item_width_1" |
||||
|
v-model="houseItem.queryType" |
||||
|
size="mini" |
||||
|
placeholder="请选择"> |
||||
|
<el-option v-for="item in queryList" |
||||
|
@click.native="handleSelHouseQuery(houseIndex,item)" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
<div v-if="houseItem.queryType!=='is_null'&&houseItem.queryType!=='is_not_null'"> |
||||
|
|
||||
|
<el-select v-if="houseItem.colType==='select'||houseItem.colType==='radio'||houseItem.colType==='checkbox'" |
||||
|
class="item_width_2" |
||||
|
v-model="houseItem.colVal" |
||||
|
size="mini" |
||||
|
placeholder="请选择"> |
||||
|
<el-option v-for="item in houseItem.colOption" |
||||
|
@click.native="handleSelHouseValue(houseIndex,item)" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
<el-input-number v-else-if="houseItem.colType==='inputNum'" |
||||
|
class="item_width_2" |
||||
|
v-model="houseItem.colVal" |
||||
|
:min="0" |
||||
|
size="mini" |
||||
|
label="请输入"></el-input-number> |
||||
|
<el-date-picker v-else-if="houseItem.colType==='datepicker'||houseItem.colType==='date'" |
||||
|
v-model="houseItem.colVal" |
||||
|
class="item_width_2" |
||||
|
type="datetime" |
||||
|
size="mini" |
||||
|
value-format="yyyy-MM-dd HH:mm:ss" |
||||
|
value="yyyy-MM-dd HH:mm:ss" |
||||
|
placeholder="开始时间"> |
||||
|
</el-date-picker> |
||||
|
<el-input v-else |
||||
|
class="item_width_2" |
||||
|
size="mini" |
||||
|
placeholder="请输入" |
||||
|
v-model="houseItem.colVal"> |
||||
|
</el-input> |
||||
|
</div> |
||||
|
|
||||
|
<el-select v-if="houseIndex<(houseRuleList.length-1)" |
||||
|
class="item_width_1" |
||||
|
v-model="houseItem.nextLogicalRel" |
||||
|
size="mini" |
||||
|
placeholder="请选择"> |
||||
|
<el-option v-for="item in logicalList" |
||||
|
@click.native="handleSelHouseLogical(houseIndex,item)" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
|
||||
|
<img v-if=" houseIndex<houseRuleList.length-1" |
||||
|
class="img_del" |
||||
|
src="@/assets/img/icon-del.png" |
||||
|
@click="delHouse(houseIndex)"> |
||||
|
<img v-if=" houseIndex==houseRuleList.length-1" |
||||
|
class="img_del" |
||||
|
src="@/assets/img/icon-add.png" |
||||
|
@click="addHouse(houseIndex)"> |
||||
|
|
||||
|
</div> |
||||
|
|
||||
|
</div> |
||||
|
|
||||
|
<div v-if="personSel"> |
||||
|
<div v-for="(personItem,personIndex) in resiRuleList" |
||||
|
:key="personIndex" |
||||
|
class="row-item"> |
||||
|
|
||||
|
<el-select class="item_width_1" |
||||
|
v-model="personItem.itemGroupId" |
||||
|
size="mini" |
||||
|
placeholder="请选择"> |
||||
|
<el-option v-for="item in groupList" |
||||
|
@click.native="handleSelGroup(personIndex,item)" |
||||
|
:key="item.id" |
||||
|
:label="item.label" |
||||
|
:value="item.id"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
<el-select class="item_width_1" |
||||
|
v-model="personItem.itemId" |
||||
|
size="mini" |
||||
|
placeholder="请选择"> |
||||
|
<el-option v-for="item in personItem.itemList" |
||||
|
@click.native="handleSelGroupItem(personIndex,item)" |
||||
|
:key="item.itemId" |
||||
|
:label="item.label" |
||||
|
:value="item.itemId"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
<el-select class="item_width_1" |
||||
|
v-model="personItem.queryType" |
||||
|
size="mini" |
||||
|
placeholder="请选择"> |
||||
|
<el-option v-for="item in queryList" |
||||
|
@click.native="handleSelPersonQuery(personIndex,item)" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
<div v-if="personItem.queryType!=='is_null'&&personItem.queryType!=='is_not_null'"> |
||||
|
|
||||
|
<el-select v-if="personItem.colType==='select'||personItem.colType==='radio'||personItem.colType==='checkbox'" |
||||
|
class="item_width_2" |
||||
|
v-model="personItem.colVal" |
||||
|
size="mini" |
||||
|
placeholder="请选择"> |
||||
|
<el-option v-for="item in personItem.colOption" |
||||
|
@click.native="handleSelPersonValue(personIndex,item)" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
<el-input-number v-else-if="personItem.colType==='inputNum'" |
||||
|
class="item_width_2" |
||||
|
v-model="personItem.colVal" |
||||
|
:min="0" |
||||
|
size="mini" |
||||
|
label="请输入"></el-input-number> |
||||
|
|
||||
|
<el-date-picker v-else-if="personItem.colType==='datepicker'||personItem.colType==='date'" |
||||
|
v-model="personItem.colVal" |
||||
|
class="item_width_2" |
||||
|
type="datetime" |
||||
|
value-format="yyyy-MM-dd HH:mm:ss" |
||||
|
value="yyyy-MM-dd HH:mm:ss" |
||||
|
placeholder="开始时间"> |
||||
|
</el-date-picker> |
||||
|
<el-input v-else |
||||
|
class="item_width_2" |
||||
|
size="mini" |
||||
|
placeholder="请输入" |
||||
|
v-model="personItem.colVal"> |
||||
|
</el-input> |
||||
|
|
||||
|
</div> |
||||
|
|
||||
|
<el-select v-if="personIndex<(resiRuleList.length-1)" |
||||
|
class="item_width_1" |
||||
|
v-model="personItem.nextLogicalRel" |
||||
|
size="mini" |
||||
|
placeholder="请选择"> |
||||
|
<el-option v-for="item in logicalList" |
||||
|
@click.native="handleSelPersonLogical(personIndex,item)" |
||||
|
:key="item.value" |
||||
|
:label="item.label" |
||||
|
:value="item.value"> |
||||
|
</el-option> |
||||
|
</el-select> |
||||
|
|
||||
|
<img v-if="personIndex<resiRuleList.length-1" |
||||
|
class="img_del" |
||||
|
src="@/assets/img/icon-del.png" |
||||
|
@click="delPerson(personIndex)"> |
||||
|
<img v-if="personIndex==resiRuleList.length-1" |
||||
|
class="img_del" |
||||
|
src="@/assets/img/icon-add.png" |
||||
|
@click="addPerson(personIndex)"> |
||||
|
|
||||
|
</div> |
||||
|
|
||||
|
</div> |
||||
|
|
||||
|
</div> |
||||
|
|
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { mapGetters } from 'vuex' |
||||
|
import { Loading } from 'element-ui' // 引入Loading服务 |
||||
|
import { requestPost } from '@/js/dai/request' |
||||
|
|
||||
|
|
||||
|
let loading // 加载动画 |
||||
|
export default { |
||||
|
data () { |
||||
|
return { |
||||
|
|
||||
|
personChecked: false, |
||||
|
houseChecked: false, |
||||
|
|
||||
|
houseSel: true, |
||||
|
personSel: false, |
||||
|
|
||||
|
selSmartType: 'fangwu', |
||||
|
smartList1: [ |
||||
|
{ |
||||
|
value: 'fangwu', |
||||
|
label: '房屋信息' |
||||
|
}, |
||||
|
{ |
||||
|
value: 'jumin', |
||||
|
label: '居民信息' |
||||
|
} |
||||
|
], |
||||
|
groupList: [], |
||||
|
queryList: [], |
||||
|
logicalList: [ |
||||
|
{ |
||||
|
label: '并且', |
||||
|
value: 'and' |
||||
|
}, |
||||
|
{ |
||||
|
label: '或者', |
||||
|
value: 'or' |
||||
|
} |
||||
|
], |
||||
|
houseItemList: [],//房屋信息第二列 |
||||
|
|
||||
|
resiRuleList: [ |
||||
|
{ |
||||
|
ruleDesc: '',//规则描述文字，例如：基础信息性别等于女 |
||||
|
nextLogicalRel: '',//与上一条的关系；and、or |
||||
|
itemGroupId: '', |
||||
|
itemId: '', |
||||
|
queryType: '', |
||||
|
colTable: '', |
||||
|
colKey: '', |
||||
|
colVal: '', |
||||
|
|
||||
|
itemList: [], |
||||
|
colType: '',//详细参数的组件类型 |
||||
|
colOption: [], |
||||
|
itemGroupName: '', |
||||
|
itemLabel: '', |
||||
|
queryTypeName: '', |
||||
|
colValLabel: '', |
||||
|
nextLogicalRelName: '', |
||||
|
} |
||||
|
], |
||||
|
|
||||
|
houseRuleList: [ |
||||
|
{ |
||||
|
ruleDesc: '', |
||||
|
nextLogicalRel: '',//与上一条的关系；and、or |
||||
|
queryType: '', |
||||
|
colTable: '', |
||||
|
colKey: '', |
||||
|
colVal: '', |
||||
|
|
||||
|
titleName: '房屋信息', |
||||
|
colType: '',//详细参数的组件类型 |
||||
|
colOption: [], |
||||
|
itemGroupName: '房屋信息', |
||||
|
itemLabel: '', |
||||
|
queryTypeName: '', |
||||
|
colValLabel: '', |
||||
|
nextLogicalRelName: '', |
||||
|
} |
||||
|
], |
||||
|
houseTitleName: '房屋信息', |
||||
|
|
||||
|
okflag: false, |
||||
|
|
||||
|
showPersonList: false, |
||||
|
ruleList: {}, |
||||
|
|
||||
|
smartRuleList: [], |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
watch: { |
||||
|
|
||||
|
}, |
||||
|
components: { |
||||
|
// personListItem |
||||
|
}, |
||||
|
async created () { |
||||
|
// this.startLoading() |
||||
|
await this.loadPersonGroup() |
||||
|
await this.loadHouseItem() |
||||
|
await this.loadDicOption() |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
|
||||
|
methods: { |
||||
|
handleSelSmartType (value) { |
||||
|
if (value === '房屋') { |
||||
|
this.houseSel = true |
||||
|
this.personSel = false |
||||
|
} else { |
||||
|
this.houseSel = false |
||||
|
this.personSel = true |
||||
|
} |
||||
|
}, |
||||
|
async setRule (resiRuleList, houseRuleList) { |
||||
|
// this.startLoading() |
||||
|
if (this.groupList.length == 0 || this.houseItemList.length === 0) { |
||||
|
setTimeout(() => { |
||||
|
this.setRule(resiRuleList, houseRuleList); |
||||
|
}, 500); |
||||
|
return false |
||||
|
} |
||||
|
|
||||
|
|
||||
|
this.resiRuleList = resiRuleList |
||||
|
if (this.resiRuleList && this.resiRuleList.length > 0) { |
||||
|
this.personChecked = true |
||||
|
for (let i = 0; i < this.resiRuleList.length; i++) { |
||||
|
let element = this.resiRuleList[i] |
||||
|
|
||||
|
let selGroup = this.groupList.filter((item) => |
||||
|
element.itemGroupId === item.id |
||||
|
); |
||||
|
console.log(selGroup) |
||||
|
|
||||
|
if (selGroup.length > 0) { |
||||
|
await this.handleSelGroup(i, selGroup[0], true) |
||||
|
|
||||
|
|
||||
|
let selItem = element.itemList.filter((item) => |
||||
|
element.itemId === item.itemId); |
||||
|
if (selItem.length > 0) { |
||||
|
await this.handleSelGroupItem(i, selItem[0], true) |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
this.houseRuleList = houseRuleList |
||||
|
if (this.houseRuleList && this.houseRuleList.length > 0) { |
||||
|
this.houseChecked = true |
||||
|
this.houseRuleList.forEach((element, index) => { |
||||
|
|
||||
|
let selHouseItem = this.houseItemList.filter((item) => |
||||
|
element.colKey === item.colKey |
||||
|
); |
||||
|
|
||||
|
if (selHouseItem.length > 0) { |
||||
|
this.handleSelHouseItem(index, selHouseItem[0], true) |
||||
|
} |
||||
|
|
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
getRule () { |
||||
|
this.okflag = false |
||||
|
|
||||
|
let messageObj = this.validateRule(this.personChecked, this.houseChecked) |
||||
|
|
||||
|
// console.log('resiRuleList', this.resiRuleList) |
||||
|
// console.log('houseRuleList', this.houseRuleList) |
||||
|
|
||||
|
if (messageObj) { |
||||
|
this.$message.error(messageObj) |
||||
|
|
||||
|
} else { |
||||
|
|
||||
|
if (this.resiRuleList.length > 0) { |
||||
|
this.resiRuleList[this.resiRuleList.length - 1].nextLogicalRel = '' |
||||
|
} |
||||
|
|
||||
|
if (this.houseRuleList.length > 0) { |
||||
|
this.houseRuleList[this.houseRuleList.length - 1].nextLogicalRel = '' |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
this.okflag = true |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
validateRule (valPerson, valHouse) { |
||||
|
|
||||
|
let message = '' |
||||
|
if (valPerson) { |
||||
|
|
||||
|
this.resiRuleList.forEach((item, index) => { |
||||
|
|
||||
|
if (item.itemGroupId === '' || |
||||
|
item.itemId === '' || |
||||
|
item.queryType === '' || |
||||
|
item.colKey === '' |
||||
|
) { |
||||
|
message = '匹配规则' + (this.index + 1) + '人员信息不完整，请填写完整！' |
||||
|
return message |
||||
|
} |
||||
|
if ((index != this.resiRuleList.length - 1) && item.nextLogicalRel === '') { |
||||
|
message = '匹配规则' + (this.index + 1) + '人员信息不完整，请填写完整！' |
||||
|
return message |
||||
|
} |
||||
|
|
||||
|
if ((item.queryType !== 'is_null' && item.queryType !== 'is_not_null') && item.colVal === '') { |
||||
|
message = '匹配规则' + (this.index + 1) + '人员信息不完整，请填写完整！' |
||||
|
return message |
||||
|
} |
||||
|
|
||||
|
}); |
||||
|
|
||||
|
|
||||
|
} |
||||
|
|
||||
|
if (valHouse) { |
||||
|
|
||||
|
this.houseRuleList.forEach((item, index) => { |
||||
|
|
||||
|
if (item.itemGroupId === '' || |
||||
|
item.itemId === '' || |
||||
|
item.queryType === '' || |
||||
|
item.colKey === '' |
||||
|
) { |
||||
|
message = '匹配规则' + (this.index + 1) + '房屋信息不完整，请填写完整！' |
||||
|
return message |
||||
|
} |
||||
|
if ((index != this.houseRuleList.length - 1) && item.nextLogicalRel === '') { |
||||
|
message = '匹配规则' + (this.index + 1) + '房屋信息不完整，请填写完整！' |
||||
|
return message |
||||
|
} |
||||
|
|
||||
|
if ((item.queryType !== 'is_null' && item.queryType !== 'is_not_null') && item.colVal === '') { |
||||
|
message = '匹配规则' + (this.index + 1) + '房屋信息不完整，请填写完整！' |
||||
|
return message |
||||
|
} |
||||
|
|
||||
|
|
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
return message |
||||
|
}, |
||||
|
|
||||
|
handlePreview () { |
||||
|
if (!this.personChecked && !this.houseChecked) { |
||||
|
this.$message.info('请勾选要预览的规则') |
||||
|
return false |
||||
|
} |
||||
|
|
||||
|
this.getRule() |
||||
|
if (!this.okflag) { |
||||
|
return false |
||||
|
} |
||||
|
this.ruleList = {} |
||||
|
this.ruleList = { |
||||
|
resiRuleList: [], |
||||
|
houseRuleList: [], |
||||
|
|
||||
|
} |
||||
|
|
||||
|
if (this.personChecked) { |
||||
|
this.ruleList.resiRuleList = this.resiRuleList |
||||
|
} |
||||
|
if (this.houseChecked) { |
||||
|
this.ruleList.houseRuleList = this.houseRuleList |
||||
|
} |
||||
|
|
||||
|
|
||||
|
this.showPersonList = true |
||||
|
}, |
||||
|
|
||||
|
handleClose () { |
||||
|
this.showPersonList = false |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
|
||||
|
//选择人员信息第一列下拉框 |
||||
|
async handleSelGroup (personIndex, item, isSet) { |
||||
|
const url = '/oper/customize/icformitem/getItemListV2' |
||||
|
// const url = 'http://yapi.elinkservice.cn/mock/245/gov/org/isServiceProject/service/serviceScopeTree' |
||||
|
let params = { |
||||
|
policyFlag: '1', |
||||
|
groupId: item.id, |
||||
|
|
||||
|
} |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
|
||||
|
if (code === 0) { |
||||
|
|
||||
|
let oneData = this.resiRuleList[personIndex] |
||||
|
oneData.itemGroupName = item.label |
||||
|
oneData.itemList = data |
||||
|
oneData.colTable = item.tableName |
||||
|
|
||||
|
if (!isSet) {//如果是详情，赋值，不需要置空 |
||||
|
oneData.nextLogicalRel = '' |
||||
|
oneData.itemId = '' |
||||
|
oneData.queryType = '' |
||||
|
oneData.colKey = '' |
||||
|
oneData.colVal = '' |
||||
|
} |
||||
|
|
||||
|
this.$set(this.resiRuleList, personIndex, oneData) |
||||
|
|
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
//选择人员信息第二列下拉框 |
||||
|
async handleSelGroupItem (personIndex, item, isSet) { |
||||
|
|
||||
|
let oneData = this.resiRuleList[personIndex] |
||||
|
|
||||
|
oneData.colKey = item.columnName |
||||
|
oneData.colType = item.itemType |
||||
|
oneData.itemLabel = item.label |
||||
|
|
||||
|
if (!isSet) {//如果是详情，赋值，不需要置空 |
||||
|
oneData.nextLogicalRel = '' |
||||
|
oneData.queryType = '' |
||||
|
oneData.colVal = '' |
||||
|
} |
||||
|
|
||||
|
if (item.optionSourceType === 'remote') { |
||||
|
const url = item.optionSourceValue |
||||
|
|
||||
|
let params = {} |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
|
||||
|
if (code === 0) { |
||||
|
oneData.colOption = data |
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
} else { |
||||
|
oneData.colOption = item.options |
||||
|
} |
||||
|
|
||||
|
|
||||
|
this.$set(this.resiRuleList, personIndex, oneData) |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
//选择人员信息第三列 |
||||
|
handleSelPersonQuery (personIndex, item) { |
||||
|
let oneData = this.resiRuleList[personIndex] |
||||
|
oneData.queryTypeName = item.label |
||||
|
|
||||
|
oneData.nextLogicalRel = '' |
||||
|
oneData.colVal = '' |
||||
|
oneData.colValLabel = '' |
||||
|
|
||||
|
this.$set(this.resiRuleList, personIndex, oneData) |
||||
|
}, |
||||
|
//选择人员信息第四列 |
||||
|
handleSelPersonValue (personIndex, item) { |
||||
|
let oneData = this.resiRuleList[personIndex] |
||||
|
|
||||
|
oneData.colValLabel = item.label |
||||
|
oneData.nextLogicalRel = '' |
||||
|
|
||||
|
this.$set(this.resiRuleList, personIndex, oneData) |
||||
|
}, |
||||
|
//选择人员信息第五列 |
||||
|
handleSelPersonLogical (personIndex, item) { |
||||
|
let oneData = this.resiRuleList[personIndex] |
||||
|
|
||||
|
oneData.nextLogicalRelName = item.label |
||||
|
|
||||
|
this.$set(this.resiRuleList, personIndex, oneData) |
||||
|
}, |
||||
|
|
||||
|
//选择房屋信息第二列下拉框 |
||||
|
async handleSelHouseItem (houseIndex, item, isSet) { |
||||
|
|
||||
|
let oneData = this.houseRuleList[houseIndex] |
||||
|
|
||||
|
oneData.colTable = item.tableName |
||||
|
oneData.colType = item.itemType |
||||
|
oneData.itemLabel = item.label |
||||
|
|
||||
|
if (!isSet) {//如果是详情，赋值，不需要置空 |
||||
|
oneData.nextLogicalRel = '' |
||||
|
oneData.queryType = '' |
||||
|
oneData.colVal = '' |
||||
|
} |
||||
|
|
||||
|
if (item.optionSourceType === 'remote') { |
||||
|
const url = item.optionSourceUrl |
||||
|
let params = {} |
||||
|
if (item.optionSourceParam) { |
||||
|
params = JSON.parse(item.optionSourceParam) |
||||
|
} else { |
||||
|
params = {} |
||||
|
} |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
|
||||
|
if (code === 0) { |
||||
|
oneData.colOption = data |
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
} else { |
||||
|
oneData.colOption = [] |
||||
|
} |
||||
|
|
||||
|
this.$set(this.houseRuleList, houseIndex, oneData) |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
//选择房屋第三列 |
||||
|
handleSelHouseQuery (houseIndex, item) { |
||||
|
let oneData = this.houseRuleList[houseIndex] |
||||
|
oneData.queryTypeName = item.label |
||||
|
|
||||
|
oneData.nextLogicalRel = '' |
||||
|
oneData.colVal = '' |
||||
|
oneData.colValLabel = '' |
||||
|
|
||||
|
this.$set(this.houseRuleList, houseIndex, oneData) |
||||
|
}, |
||||
|
//选择房屋第四列 |
||||
|
handleSelHouseValue (houseIndex, item) { |
||||
|
let oneData = this.houseRuleList[houseIndex] |
||||
|
oneData.colValLabel = item.label |
||||
|
oneData.nextLogicalRel = '' |
||||
|
|
||||
|
this.$set(this.houseRuleList, houseIndex, oneData) |
||||
|
}, |
||||
|
//选择房屋第五列 |
||||
|
handleSelHouseLogical (houseIndex, item) { |
||||
|
let oneData = this.houseRuleList[houseIndex] |
||||
|
oneData.nextLogicalRelName = item.label |
||||
|
|
||||
|
this.$set(this.houseRuleList, houseIndex, oneData) |
||||
|
}, |
||||
|
|
||||
|
|
||||
|
|
||||
|
clickTab (type) { |
||||
|
if (type === 'person') { |
||||
|
this.personSel = true |
||||
|
this.houseSel = false |
||||
|
|
||||
|
} |
||||
|
if (type === 'house') { |
||||
|
this.personSel = false |
||||
|
this.houseSel = true |
||||
|
|
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
addRule () { |
||||
|
if (this.personSel) { |
||||
|
this.addPerson() |
||||
|
} |
||||
|
|
||||
|
if (this.houseSel) { |
||||
|
this.addHouse() |
||||
|
} |
||||
|
|
||||
|
|
||||
|
}, |
||||
|
|
||||
|
addPerson () { |
||||
|
|
||||
|
let obj = { |
||||
|
ruleDesc: '',//规则描述文字，例如：基础信息性别等于女 |
||||
|
nextLogicalRel: '',//与上一条的关系；and、or |
||||
|
itemGroupId: '', |
||||
|
itemId: '', |
||||
|
queryType: '', |
||||
|
colTable: '', |
||||
|
colKey: '', |
||||
|
colVal: '', |
||||
|
|
||||
|
itemList: [], |
||||
|
colType: '',//详细参数的组件类型 |
||||
|
colOption: [], |
||||
|
itemGroupName: '', |
||||
|
itemLabel: '', |
||||
|
queryTypeName: '', |
||||
|
colValLabel: '', |
||||
|
nextLogicalRelName: '', |
||||
|
} |
||||
|
|
||||
|
this.resiRuleList.push(obj) |
||||
|
}, |
||||
|
|
||||
|
delPerson (index) { |
||||
|
this.resiRuleList.splice(index, 1); |
||||
|
}, |
||||
|
|
||||
|
addHouse () { |
||||
|
|
||||
|
let obj = { |
||||
|
ruleDesc: '', |
||||
|
nextLogicalRel: '',//与上一条的关系；and、or |
||||
|
queryType: '', |
||||
|
colTable: '', |
||||
|
colKey: '', |
||||
|
colVal: '', |
||||
|
|
||||
|
titleName: '房屋信息', |
||||
|
colType: '',//详细参数的组件类型 |
||||
|
colOption: [], |
||||
|
itemGroupName: '房屋信息', |
||||
|
itemLabel: '', |
||||
|
queryTypeName: '', |
||||
|
colValLabel: '', |
||||
|
nextLogicalRelName: '', |
||||
|
} |
||||
|
|
||||
|
this.houseRuleList.push(obj) |
||||
|
}, |
||||
|
|
||||
|
delHouse (index) { |
||||
|
this.houseRuleList.splice(index, 1); |
||||
|
}, |
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
|
||||
|
// 获取人员信息---第一列 |
||||
|
async loadPersonGroup () { |
||||
|
const url = '/oper/customize/icformitemgroup/list' |
||||
|
// const url = 'http://yapi.elinkservice.cn/mock/245/gov/org/isServiceProject/service/serviceScopeTree' |
||||
|
let params = { |
||||
|
formCode: 'resi_base_info', |
||||
|
policyFlag: '1' |
||||
|
} |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.groupList = data |
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
|
||||
|
|
||||
|
}, |
||||
|
// 获取房屋信息--第二列 |
||||
|
async loadHouseItem () { |
||||
|
const url = '/heart/policy/item-list/' + 'house' |
||||
|
|
||||
|
let params = {} |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.houseItemList = data |
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
|
||||
|
|
||||
|
}, |
||||
|
|
||||
|
async loadDicOption () { |
||||
|
const url = '/sys/dict/data/dictlist' |
||||
|
// const url = 'http://yapi.elinkservice.cn/mock/245/gov/org/isServiceProject/service/serviceScopeTree' |
||||
|
let params = { |
||||
|
dictType: "sql_query_type" |
||||
|
} |
||||
|
|
||||
|
const { data, code, msg } = await requestPost(url, params) |
||||
|
|
||||
|
if (code === 0) { |
||||
|
this.queryList = data |
||||
|
} else { |
||||
|
this.$message.error(msg) |
||||
|
} |
||||
|
|
||||
|
}, |
||||
|
|
||||
|
|
||||
|
// 开启加载动画 |
||||
|
startLoading () { |
||||
|
loading = Loading.service({ |
||||
|
lock: true, // 是否锁定 |
||||
|
text: '正在加载……', // 加载中需要显示的文字 |
||||
|
background: 'rgba(0,0,0,.7)' // 背景颜色 |
||||
|
}) |
||||
|
}, |
||||
|
// 结束加载动画 |
||||
|
endLoading () { |
||||
|
// clearTimeout(timer); |
||||
|
if (loading) { |
||||
|
loading.close() |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
dataRule () { |
||||
|
return { |
||||
|
|
||||
|
|
||||
|
serviceTimeStart: [ |
||||
|
{ required: true, message: '服务时间不能为空', trigger: 'blur' } |
||||
|
], |
||||
|
serviceScope: [ |
||||
|
{ required: true, message: '服务范围不能为空', trigger: 'blur' } |
||||
|
], |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
feedbackDataRule () { |
||||
|
return { |
||||
|
|
||||
|
|
||||
|
serviceGoal: [ |
||||
|
{ required: true, message: '服务目标不能为空', trigger: 'blur' } |
||||
|
], |
||||
|
|
||||
|
serviceEffect: [ |
||||
|
{ required: true, message: '服务效果不能为空', trigger: 'blur' } |
||||
|
], |
||||
|
servicePeopleNumber: [ |
||||
|
{ required: true, message: '服务人数不能为空', trigger: 'blur' } |
||||
|
], |
||||
|
serviceStatus: [ |
||||
|
{ required: true, message: '服务状态不能为空', trigger: 'blur' } |
||||
|
], |
||||
|
satisfaction: [ |
||||
|
{ required: true, message: '满意度不能为空', trigger: 'blur' } |
||||
|
], |
||||
|
address: [ |
||||
|
{ required: true, message: '地址不能为空', trigger: 'blur' } |
||||
|
] |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
}, |
||||
|
props: { |
||||
|
|
||||
|
formType: { |
||||
|
type: String, |
||||
|
required: 'true' |
||||
|
}, |
||||
|
index: { |
||||
|
type: Number, |
||||
|
default: 1 |
||||
|
}, |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
|
||||
|
<style lang="scss" scoped > |
||||
|
.m-main { |
||||
|
display: flex; |
||||
|
margin-top: 15px; |
||||
|
} |
||||
|
|
||||
|
.tab-title { |
||||
|
margin-right: 20px; |
||||
|
cursor: pointer; |
||||
|
} |
||||
|
|
||||
|
.tab-title-sel { |
||||
|
color: #3e8ef7; |
||||
|
text-decoration: underline; |
||||
|
} |
||||
|
|
||||
|
.row-item { |
||||
|
display: flex; |
||||
|
margin-bottom: 10px; |
||||
|
} |
||||
|
.item_width_1 { |
||||
|
width: 120px; |
||||
|
margin-right: 10px; |
||||
|
} |
||||
|
.item_width_2 { |
||||
|
width: 200px; |
||||
|
margin-right: 10px; |
||||
|
} |
||||
|
|
||||
|
/deep/ .el-checkbox { |
||||
|
margin-right: 10px; |
||||
|
} |
||||
|
/deep/.el-checkbox:last-of-type { |
||||
|
margin-right: 10px; |
||||
|
} |
||||
|
|
||||
|
.img_del { |
||||
|
width: 25px; |
||||
|
height: 25px; |
||||
|
margin-top: 3px; |
||||
|
cursor: pointer; |
||||
|
} |
||||
|
</style> |
||||
File diff suppressed because it is too large
Loading…
Reference in new issue