|
|
@@ -13,6 +13,9 @@
|
|
|
<div class="search-btn" @click="onSearchKeyword">搜索</div>
|
|
|
</template>
|
|
|
</van-search>
|
|
|
+ <div class="box3">
|
|
|
+ <Select v-model="area" :columns="district_type" canSelectAll @confirm="onSelectConfirm" />
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<Map
|
|
|
ref="mapRef"
|
|
|
@@ -68,10 +71,13 @@
|
|
|
import searchImg from "@/assets/images/search.png";
|
|
|
import { onMounted, reactive, ref } from "vue";
|
|
|
import { ElTable, ElTableColumn } from "element-plus";
|
|
|
+import {useDict} from "@/utils/dict";
|
|
|
+
|
|
|
+const { district_type } = toRefs<any>(useDict('district_type'));
|
|
|
let mapRef = ref();
|
|
|
-let pointType = ref([]);
|
|
|
let eventDetails = ref({});
|
|
|
let keyword = ref("");
|
|
|
+let area = ref("");
|
|
|
let tags = reactive([
|
|
|
{ name: "超堰顶", num: 1, icon: "icon1", checked: true },
|
|
|
{ name: "超警戒河道站", num: 1, icon: "icon2", checked: true },
|
|
|
@@ -111,6 +117,11 @@ let iconList = reactive({
|
|
|
size: [20, 20]
|
|
|
}
|
|
|
});
|
|
|
+
|
|
|
+const onSelectConfirm = (data) => {
|
|
|
+ initData();
|
|
|
+}
|
|
|
+
|
|
|
const onSearchKeyword = val => {
|
|
|
keyword.value = val;
|
|
|
initData();
|
|
|
@@ -306,6 +317,14 @@ const getTableRowClass = ({ rowIndex }) => {
|
|
|
.box1 {
|
|
|
padding: 13px 9px;
|
|
|
background-color: #ffffff;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ .common-search {
|
|
|
+ margin-right: 5px;
|
|
|
+ }
|
|
|
+ .select-box {
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
}
|
|
|
.box2 {
|
|
|
position: relative;
|
|
|
@@ -358,7 +377,7 @@ const getTableRowClass = ({ rowIndex }) => {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- .common-search {
|
|
|
+ .van-search.common-search {
|
|
|
border: 1px solid #dce0ee;
|
|
|
border-radius: 2px;
|
|
|
padding: 0;
|
|
|
@@ -470,4 +489,7 @@ const getTableRowClass = ({ rowIndex }) => {
|
|
|
height: 33px;
|
|
|
background-size: 100% 100%;
|
|
|
}
|
|
|
+.box3 {
|
|
|
+ width: 75px;
|
|
|
+}
|
|
|
</style>
|
