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