12 changed files with 590 additions and 83 deletions
|
Before Width: | Height: | Size: 1.4 MiB After Width: | Height: | Size: 1.4 MiB |
|
After Width: | Height: | Size: 8.0 KiB |
|
After Width: | Height: | Size: 499 B |
|
After Width: | Height: | Size: 4.2 KiB |
|
After Width: | Height: | Size: 15 KiB |
|
After Width: | Height: | Size: 7.5 KiB |
@ -0,0 +1,194 @@ |
|||
<style lang="less" scoped> |
|||
.search{ |
|||
position:absolute; |
|||
top:120px; |
|||
left:40px; |
|||
display:flex; |
|||
align-items: center; |
|||
&>div{ |
|||
margin-right:20px; |
|||
} |
|||
} |
|||
</style> |
|||
<template> |
|||
<div class="search"> |
|||
<el-select |
|||
filterable |
|||
remote |
|||
reserve-keyword |
|||
:remote-method="getVillage" |
|||
:loading="loading" |
|||
v-model="formData.villageId" |
|||
popper-class="search-popper" |
|||
placeholder="选择小区"> |
|||
<el-option v-for="(v,k) in villageList" :key="k" :value="v.projectId" :label="v.name"/> |
|||
</el-select> |
|||
<el-select v-model="formData.buildId" popper-class="search-popper" placeholder="选择楼栋"> |
|||
<el-option v-for="(v,k) in buildList" :key="k" :value="v.buildId" :label="v.buildName"/> |
|||
</el-select> |
|||
<el-select v-model="formData.unitId" popper-class="search-popper" placeholder="选择单元"> |
|||
<el-option v-for="(v,k) in unitList" :key="k" :value="v.unitId" :label="v.unitName"/> |
|||
</el-select> |
|||
<el-select v-model="formData.floorId" popper-class="search-popper" placeholder="选择楼层"> |
|||
<el-option v-for="(v,k) in floorList" :key="k" :value="v.floorId" :label="v.floorName"/> |
|||
</el-select> |
|||
<el-select |
|||
v-model="formData.roomId" |
|||
@change="emit('update:modelValue',$event);formData.userId=''" |
|||
popper-class="search-popper" |
|||
placeholder="选择房间"> |
|||
<el-option v-for="(v,k) in roomList" :key="k" :value="v.roomId" :label="v.roomName"/> |
|||
</el-select> |
|||
<el-select |
|||
filterable |
|||
remote |
|||
reserve-keyword |
|||
:remote-method="person" |
|||
:loading="loading" |
|||
v-model="formData.userId" |
|||
popper-class="search-popper" |
|||
style="--w:80px;" |
|||
value-key="userName" |
|||
@change="emit('update:modelValue',$event.roomId);formData.roomId=''" |
|||
placeholder="请输入住户"> |
|||
<el-option class="user" v-for="(v,k) in personList" :key="k" :value="v" :label="v.userName"> |
|||
<span style="float:left;margin-right:20px;">{{v.userName}}</span> |
|||
<span class="over" style="float:right;max-width:210px;over">{{v.address}}</span> |
|||
</el-option> |
|||
</el-select> |
|||
<el-date-picker |
|||
popper-class="date-popper" |
|||
type="daterange" |
|||
:clearable="false" |
|||
start-placeholder="开始时间" |
|||
end-placeholder="结束时间" |
|||
v-model="date" |
|||
@change="emit('update:date',$event)"/> |
|||
</div> |
|||
</template> |
|||
<script setup> |
|||
import request from '@/config/request' |
|||
import { inject, onMounted, reactive, ref, shallowRef, watch } from "vue" |
|||
|
|||
var emit=defineEmits() |
|||
var msg=inject("msg") |
|||
|
|||
var demo=ref([]) |
|||
var formData=reactive({ |
|||
villageId:"", |
|||
buildId:"", |
|||
unitId:"", |
|||
floorId:"", |
|||
roomId:"", |
|||
userId:"", |
|||
}) |
|||
var date=ref([]) |
|||
var loading=ref(false) |
|||
|
|||
var villageList=shallowRef([]) |
|||
var buildList=shallowRef([]) |
|||
var unitList=shallowRef([]) |
|||
var floorList=shallowRef([]) |
|||
var roomList=shallowRef([]) |
|||
var personList=shallowRef([]) |
|||
|
|||
//小区 |
|||
async function getVillage(e){ |
|||
if(e){ |
|||
loading.value=true |
|||
var res=await request("/project",{ |
|||
method:"post", |
|||
params:{projectName:e}} |
|||
) |
|||
loading.value=false |
|||
if(res.statu){ |
|||
villageList.value=res.data |
|||
}else{ |
|||
msg.error(res.msg||"获取小区失败！") |
|||
} |
|||
} |
|||
} |
|||
//楼栋 |
|||
watch(()=>formData.villageId, async n=>{ |
|||
var res=await request("/build",{ |
|||
method:"post", |
|||
params:{ |
|||
projectId:n, |
|||
buildName:'', |
|||
} |
|||
}) |
|||
if(res.statu){ |
|||
buildList.value=res.data |
|||
}else{ |
|||
msg.error(res.msg||"获取小区楼栋失败！") |
|||
} |
|||
}) |
|||
//单元 |
|||
watch(()=>formData.buildId, async n=>{ |
|||
var res=await request("/unit",{ |
|||
method:"post", |
|||
params:{ |
|||
buildId:n, |
|||
unitName:"", |
|||
} |
|||
}) |
|||
if(res.statu){ |
|||
unitList.value=res.data |
|||
}else{ |
|||
msg.error(res.msg||"获取单元失败！") |
|||
} |
|||
}) |
|||
//楼层 |
|||
watch(()=>formData.unitId, async n=>{ |
|||
var res=await request("/floor",{ |
|||
method:"post", |
|||
params:{ |
|||
unitId:n, |
|||
floorName:"", |
|||
} |
|||
}) |
|||
if(res.statu){ |
|||
floorList.value=res.data |
|||
}else{ |
|||
msg.error(res.msg||"获取楼层失败！") |
|||
} |
|||
}) |
|||
//住户 |
|||
async function person(e){ |
|||
if(e){ |
|||
loading.value=true |
|||
var res=await request("/roomRelationPerson",{ |
|||
method:"post", |
|||
params:{userName:e} |
|||
}) |
|||
loading.value=false |
|||
if(res.statu){ |
|||
personList.value=res.data.map(v=>({ |
|||
...v, |
|||
id:`${v.userPhone}_${Math.random()}_${v.roomId}` |
|||
})) |
|||
}else{ |
|||
msg.error(res.msg||"获取住户失败！") |
|||
} |
|||
} |
|||
} |
|||
//房间 |
|||
watch(()=>formData.floorId, async n=>{ |
|||
formData.roomId='' |
|||
var res=await request("/room",{ |
|||
method:"post", |
|||
params:{ |
|||
floorId:n, |
|||
roomName:"", |
|||
} |
|||
}) |
|||
if(res.statu){ |
|||
roomList.value=res.data |
|||
}else{ |
|||
msg.error(res.msg||"获取房间失败！") |
|||
} |
|||
}) |
|||
onMounted(async ()=>{ |
|||
|
|||
}) |
|||
</script> |
|||
Loading…
Reference in new issue