<template>
|
<el-row>
|
<el-col :span="17">
|
<el-form label-position="right" label-width="60px" :inline="false">
|
<el-form-item label="区域">
|
<OptionLocation2
|
:level="3"
|
:initValue="true"
|
:checkStrictly="false"
|
:allOption="true"
|
v-model="location"
|
></OptionLocation2>
|
</el-form-item>
|
<OptionGridGroup
|
ref="gridGroupRef"
|
v-model="gridGroup"
|
></OptionGridGroup>
|
</el-form>
|
</el-col>
|
<el-col :span="4">
|
<el-form-item>
|
<el-button
|
:loading="loading"
|
:disabled="!gridGroup"
|
type="primary"
|
class="el-button-custom"
|
size="small"
|
@click="handleClick"
|
>
|
查询
|
</el-button>
|
</el-form-item>
|
</el-col>
|
<el-col :span="3">
|
<el-form-item>
|
<el-button
|
:loading="loading"
|
type="primary"
|
class="el-button-custom"
|
size="small"
|
@click="handleImportClick"
|
>
|
导入
|
</el-button>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-dialog title="导入" v-model="importVisible" destroy-on-close>
|
<SatelliteImport
|
@submit="handleImportSubmit"
|
:disabled="!gridGroup"
|
:grid-group="gridGroup"
|
></SatelliteImport>
|
</el-dialog>
|
</template>
|
<script setup>
|
import SatelliteImport from './SatelliteImport.vue';
|
import { ref, watch } from 'vue';
|
|
defineProps({
|
loading: Boolean
|
});
|
|
const location = ref(undefined);
|
const gridGroup = ref(undefined);
|
const gridGroupRef = ref(null);
|
const importVisible = ref(false);
|
|
const emits = defineEmits(['search']);
|
|
watch(location, (nv, ov) => {
|
if (nv != ov) {
|
const area = {
|
provinceCode: nv.pCode,
|
provinceName: nv.pName,
|
cityCode: nv.cCode,
|
cityName: nv.cName,
|
districtCode: nv.dCode,
|
districtName: nv.dName,
|
townCode: nv.tCode,
|
townName: nv.tName
|
};
|
gridGroupRef.value.fetchGridGroup(area);
|
}
|
});
|
|
watch(gridGroup, (nv, ov) => {
|
// 首次进入自动触发一次查询事件
|
if (ov == undefined && nv != ov) {
|
handleClick();
|
}
|
});
|
|
function handleClick() {
|
emits('search', gridGroup.value);
|
}
|
|
function handleImportSubmit() {
|
importVisible.value = false;
|
emits('search', gridGroup.value);
|
}
|
|
function handleImportClick() {
|
importVisible.value = true;
|
}
|
</script>
|
