| | |
| | | </el-col> |
| | | |
| | | <el-col :span="12"> |
| | | <el-form-item label="区域" prop="areaDivideId"> |
| | | <el-form-item label="场景" prop="defenseSceneId"> |
| | | <el-select class="command-select" popper-class="command-select-popper" |
| | | v-model="formData.areaDivideId" placeholder="请选择" clearable |
| | | @change="handleAreaChange"> |
| | | <el-option v-for="item in areaList" :key="item.id" :label="item.areaName" |
| | | v-model="formData.defenseSceneId" placeholder="请选择" clearable |
| | | @change="handleSceneChange"> |
| | | <el-option v-for="item in sceneList" :key="item.id" :label="item.sceneName" |
| | | :value="item.id" /> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | |
| | | <el-col :span="12"> |
| | | <el-form-item label="场景" prop="defenseSceneId"> |
| | | <el-form-item label="区域" prop="areaDivideId"> |
| | | <el-select class="command-select" popper-class="command-select-popper" |
| | | v-model="formData.defenseSceneId" placeholder="请先选择区域" clearable |
| | | :disabled="!formData.areaDivideId" @change="handleSceneChange"> |
| | | <el-option v-for="item in sceneList" :key="item.id" :label="item.sceneName" |
| | | v-model="formData.areaDivideId" placeholder="请先选择场景" clearable |
| | | :disabled="!formData.defenseSceneId" @change="handleAreaChange"> |
| | | <el-option v-for="item in areaList" :key="item.id" :label="item.areaName" |
| | | :value="item.id" /> |
| | | </el-select> |
| | | </el-form-item> |
| | |
| | | } |
| | | |
| | | async function handleAreaChange (areaId) { |
| | | formData.value.defenseSceneId = '' |
| | | if (areaId) { |
| | | await loadSceneList(areaId) |
| | | } else { |
| | | sceneList.value = [] |
| | | } |
| | | } |
| | | |
| | | // 场景选择变化处理 |
| | | async function handleSceneChange (sceneId) { |
| | | const find = sceneList.value.find(item => item.id === sceneId) |
| | | const find = areaList.value.find(item => item.id === areaId) |
| | | formData.value.longitude = find?.longitude |
| | | formData.value.latitude = find?.latitude |
| | | } |
| | | |
| | | // 场景选择变化处理 |
| | | async function handleSceneChange (sceneId) { |
| | | formData.value.areaDivideId = '' |
| | | |
| | | if (sceneId) { |
| | | await loadAreaList(sceneId) |
| | | } else { |
| | | areaList.value = [] |
| | | } |
| | | } |
| | | |
| | | // 加载区域列表 |
| | | async function loadAreaList () { |
| | | const res = await fwAreaDivideListApi() |
| | | async function loadAreaList (sceneId) { |
| | | const res = await fwAreaDivideListApi({sceneId}) |
| | | areaList.value = res?.data?.data ?? [] |
| | | } |
| | | |
| | | // 加载场景列表 |
| | | async function loadSceneList(areaId) { |
| | | const res = await fwDefenseSceneListApi({areaId}) |
| | | async function loadSceneList() { |
| | | const res = await fwDefenseSceneListApi() |
| | | sceneList.value = res?.data?.data ?? [] |
| | | } |
| | | |
| | |
| | | defineExpose({ open }) |
| | | |
| | | onMounted(() => { |
| | | loadAreaList() |
| | | loadSceneList() |
| | | }) |
| | | </script> |
| | | <style scoped lang="scss"> |