elink-star
/
ShibeiWorkPlatform_Frontend
11
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

ff

shibei_master
13176889840 4 years ago
parent
49e99f3dca
commit
e6d5424295
1 changed files with 179 additions and 99 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 278
      src/views/components/resiSearch.vue

278
src/views/components/resiSearch.vue
View File

@ -7,13 +7,20 @@
<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-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">
:value="item.value"
>
</el-option>
</el-select>
</div>
@ -23,50 +30,91 @@
<div class="resi-cell">
<div class="resi-cell-label">所属小区</div>
<div class="resi-cell-value">
<el-select v-model.trim="form.VILLAGE_ID" placeholder="请选择小区" size="small"
clearable class="resi-cell-select"
@clear="handleClearVillage" @change="handleChangeV">
<el-select
v-model.trim="form.VILLAGE_ID"
placeholder="请选择小区"
size="small"
clearable
class="resi-cell-select"
@clear="handleClearVillage"
@change="handleChangeV"
>
<el-option
v-for="item in optionsV"
:key="item.value"
:label="item.label"
:value="item.value">
:value="item.value"
>
</el-option>
</el-select>
<el-select v-model.trim="form.BUILD_ID" placeholder="楼号" size="small" clearable
class="resi-cell-select" :disabled="changeVDisabled" @clear="handleClearBuild" @change="handleChangeB">
<el-select
v-model.trim="form.BUILD_ID"
placeholder="楼号"
size="small"
clearable
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">
:value="item.value"
>
</el-option>
</el-select>
<el-select v-model.trim="form.UNIT_ID" :disabled="changeBDisabled" placeholder="单元" size="small" clearable class="resi-cell-select" @click="handleClearDan" @change="handleChangeD">
<el-select
v-model.trim="form.UNIT_ID"
:disabled="changeBDisabled"
placeholder="单元"
size="small"
clearable
class="resi-cell-select"
@click="handleClearDan"
@change="handleChangeD"
>
<el-option
v-for="item in optionsD"
:key="item.value"
:label="item.label"
:value="item.value">
:value="item.value"
>
</el-option>
</el-select>
<el-select v-model.trim="form.HOME_ID" :disabled="changeDDisabled" placeholder="楼号" size="small" clearable class="resi-cell-select">
<el-select
v-model.trim="form.HOME_ID"
:disabled="changeDDisabled"
placeholder="楼号"
size="small"
clearable
class="resi-cell-select"
>
<el-option
v-for="item in optionsH"
:key="item.value"
:label="item.label"
:value="item.value">
:value="item.value"
>
</el-option>
</el-select>
</div>
</div>
</el-col>
</el-row>
<el-row v-for="(item, index) in sliceList(formList, 4)" :key="index" class="resi-row">
<el-row
v-for="(item, index) in sliceList(formList, 4)"
:key="index"
class="resi-row"
>
<el-col v-for="n in item" :key="n.id" :span="6">
<div class="resi-cell">
<div class="resi-cell-label">{{n.label}}</div>
<div class="resi-cell-value" :class="n.itemType === 'radio' && 'resi-cell-value-radio'">
<div class="resi-cell-label">{{ n.label }}</div>
<div
class="resi-cell-value"
:class="n.itemType === 'radio' && 'resi-cell-value-radio'"
>
<el-input
v-if="n.itemType === 'input' || n.itemType === 'textarea'"
v-model.trim="form[n.columnName]"
@ -74,7 +122,7 @@
size="small"
clearable
placeholder="请输入内容"
>
>
</el-input>
<template v-else-if="n.itemType === 'datepicker'">
<el-date-picker
@ -90,7 +138,8 @@
size="small"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
:picker-options="pickerOptions">
:picker-options="pickerOptions"
>
</el-date-picker>
<el-date-picker
v-else
@ -101,15 +150,24 @@
clearable
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
placeholder="选择日期">
placeholder="选择日期"
>
</el-date-picker>
</template>
<el-select v-else-if="n.itemType === 'select' || n.itemType === 'radio'" v-model.trim="form[n.columnName]" placeholder="请选择" size="small" clearable class="resi-cell-select">
<el-select
v-else-if="n.itemType === 'select' || n.itemType === 'radio'"
v-model.trim="form[n.columnName]"
placeholder="请选择"
size="small"
clearable
class="resi-cell-select"
>
<el-option
v-for="item in n.options"
:key="item.value"
:label="item.label"
:value="item.value">
:value="item.value"
>
</el-option>
</el-select>
<el-cascader
@ -119,20 +177,22 @@
:props="{ checkStrictly: true }"
clearable
size="small"
class="resi-cell-select">
class="resi-cell-select"
>
</el-cascader>
</div>
</div>
</el-col>
</el-row>
</el-row>
<el-row class="resi-search">
<!-- <el-col :span="20">
<el-button type="primary" size="mini">查询</el-button>
</el-col> -->
<el-col :span="24">
<el-button type="primary" size="mini" @click="handleSearch">查询</el-button>
<el-col :span="24">
<el-button type="primary" size="mini" @click="handleSearch"
>查询</el-button
>
</el-col>
</el-row>
<div class="resi-down" @click="handleOpenSearch">
@ -152,7 +212,7 @@ export default {
default: () => []
}
},
data () {
data() {
let initForm = (arr) => {
let _form = {}
// console.log('formInfo', obj)
@ -160,13 +220,13 @@ export default {
// _form = { ...obj }
// return _form
// }
arr.forEach(item => {
arr.forEach((item) => {
_form[item.columnName] = ''
})
return _form
}
let form = initForm(this.formList)
let tempFormList = [ ...this.formList ]
let tempFormList = [...this.formList]
let constForm = {
...form,
GRID_ID: '',
@ -203,36 +263,40 @@ export default {
},
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])
shortcuts: [
{
text: '最近一周',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
picker.$emit('pick', [start, end])
}
},
{
text: '最近一个月',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
picker.$emit('pick', [start, end])
}
},
{
text: '最近三个月',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
picker.$emit('pick', [start, end])
}
}
}]
]
}
}
},
computed: {
sliceList () {
sliceList() {
return function (data, count) {
if (data !== undefined) {
let index = 0
@ -248,19 +312,19 @@ export default {
}
}
},
changeVDisabled () {
changeVDisabled() {
return !this.form.VILLAGE_ID
},
changeBDisabled () {
changeBDisabled() {
return !this.form.BUILD_ID
},
changeDDisabled () {
changeDDisabled() {
return !this.form.UNIT_ID
}
},
watch: {
form: {
handler (val, val2) {
handler(val, val2) {
// console.log('valpppp----', val, val2)
for (let n in val) {
if (this.constForm[n] !== val[n]) {
@ -273,55 +337,64 @@ export default {
deep: true
}
},
created () {
created() {
// this.initForm()
// console.log('formcccc---', this.form)
this.getGridList()
this.getValiheList()
},
methods: {
initForm () {
this.formList.forEach(item => {
initForm() {
this.formList.forEach((item) => {
this.$set(this.form, item.columnName, '')
})
console.log('formcccc---', this.form)
},
handleClearVillage () {
handleClearVillage() {
this.form.BUILD_ID = ''
this.form.HOME_ID = ''
},
handleClearBuild () {
handleClearBuild() {
this.form.BUILD_ID = ''
this.form.UNIT_ID = ''
this.form.HOME_ID = ''
},
handleClearDan () {
handleClearDan() {
this.form.UNIT_ID = ''
this.form.HOME_ID = ''
},
handleSearch () {
handleSearch() {
// console.log('formmmmm---', this.form)
const itemTypes = ['daterange', 'timerange']
let arr = this.tempFormList.filter(n => n.isChange).map(item => {
return {
queryType: item.queryType,
tableName: item.tableName,
columnName: item.columnName,
// columnValue: []
columnValue: (itemTypes.includes(item.queryType) || itemTypes.includes(item.itemType)) ? this.form[item.columnName] : [this.form[item.columnName].toString()]
}
})
let arr1 = this.fixedList.filter(n => n.columnValue.length > 0).map(item => {
return {
...item
}
})
let arr3 = [ ...arr1, ...arr ]
let arr = this.tempFormList
.filter((n) => n.isChange)
.map((item) => {
return {
queryType: item.queryType,
tableName: item.tableName,
columnName: item.columnName,
// columnValue: []
columnValue:
itemTypes.includes(item.queryType) ||
itemTypes.includes(item.itemType)
? this.form[item.columnName]
: [this.form[item.columnName].toString()]
}
})
let arr1 = this.fixedList
.filter((n) => n.columnValue.length > 0)
.map((item) => {
return {
...item
}
})
let arr3 = [...arr1, ...arr]
this.$emit('search', arr3)
},
handleOpenSearch () {
handleOpenSearch() {
this.openSearch = !this.openSearch
},
handleChangeGrid (val) {
handleChangeGrid(val) {
console.log('val', val)
this.form.VILLAGE_ID = ''
this.form.BUILD_ID = ''
@ -329,26 +402,26 @@ export default {
this.form.HOME_ID = ''
this.getValiheList()
},
handleChangeV (val) {
handleChangeV(val) {
console.log('val', val)
this.form.BUILD_ID = ''
this.form.UNIT_ID = ''
this.form.HOME_ID = ''
this.getBuildList()
},
handleChangeB (val) {
handleChangeB(val) {
console.log('val', val)
this.form.UNIT_ID = ''
this.form.HOME_ID = ''
this.getUniList()
},
handleChangeD (val) {
handleChangeD(val) {
console.log('val', val)
this.form.HOME_ID = ''
this.getHouseList()
},
// 监听基础form
handleChangeForm (val) {
handleChangeForm(val) {
for (let n in this.fixedForm) {
if (n === val) {
if (this.fixedList.length > 0) {
@ -378,11 +451,11 @@ export default {
}
}
console.log('fixedList----999', this.fixedList)
this.tempFormList.forEach(item => {
this.tempFormList.forEach((item) => {
if (item.columnName === val) item.isChange = true
})
},
getGridList () {
getGridList() {
const { user } = this.$store.state
this.$http
.post('/gov/org/customergrid/gridoption', { agencyId: user.agencyId })
@ -398,10 +471,13 @@ export default {
return this.$message.error('网络错误')
})
},
getValiheList () {
getValiheList() {
const { user } = this.$store.state
this.$http
.post('/gov/org/icneighborhood/neighborhoodoption', { gridId: this.form.GRID_ID, agencyId: user.agencyId })
.post('/gov/org/icneighborhood/neighborhoodoption', {
gridId: this.form.GRID_ID,
agencyId: user.agencyId
})
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
@ -414,9 +490,11 @@ export default {
return this.$message.error('网络错误')
})
},
getBuildList () {
getBuildList() {
this.$http
.post('/gov/org/icbuilding/buildingoption', { neighborHoodId: this.form.VILLAGE_ID })
.post('/gov/org/icbuilding/buildingoption', {
neighborHoodId: this.form.VILLAGE_ID
})
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
@ -429,9 +507,11 @@ export default {
return this.$message.error('网络错误')
})
},
getUniList () {
getUniList() {
this.$http
.post('/gov/org/icbuildingunit/unitoption', { buildingId: this.form.BUILD_ID })
.post('/gov/org/icbuildingunit/unitoption', {
buildingId: this.form.BUILD_ID
})
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg)
@ -444,7 +524,7 @@ export default {
return this.$message.error('网络错误')
})
},
getHouseList () {
getHouseList() {
this.$http
.post('/gov/org/ichouse/houseoption', { unitId: this.form.UNIT_ID })
.then(({ data: res }) => {
@ -458,7 +538,7 @@ export default {
.catch(() => {
return this.$message.error('网络错误')
})
},
}
}
}
</script>
@ -480,7 +560,7 @@ export default {
box-sizing: border-box;
margin-left: -23rpx;
cursor: pointer;
background: #FFFFFF;
background: #ffffff;
border-radius: 0 0 10px 10px;
img {
display: block;
@ -489,11 +569,11 @@ export default {
.resi-row-box {
height: 104px;
overflow: hidden;
transition: height .5s;
transition: height 0.5s;
}
.resi-row-more {
height: max-content;
transition: height .5s;
transition: height 0.5s;
}
.resi-row {
margin-bottom: 20px;

Write Preview
Loading…
Cancel
Save