|
|
@@ -1,16 +1,17 @@
|
|
|
<template>
|
|
|
<div class="container">
|
|
|
<van-search
|
|
|
- v-model="keywords"
|
|
|
+ v-model="queryParams.keyword"
|
|
|
placeholder="请输入搜索关键词"
|
|
|
:left-icon="searchImg"
|
|
|
:right-icon="closeImg"
|
|
|
class="common-search"
|
|
|
+ @click-right-icon.stop="searchCancel"
|
|
|
@search="onSearch"
|
|
|
/>
|
|
|
<van-dropdown-menu>
|
|
|
- <van-dropdown-item v-model="areaType" :options="columns" />
|
|
|
- <van-dropdown-item v-model="value2" :options="option2" />
|
|
|
+ <van-dropdown-item v-model="queryParams.county" :options="columns" @change="onSearch" />
|
|
|
+ <van-dropdown-item v-model="queryParams.professional_group" :options="option2" @change="onSearch" />
|
|
|
</van-dropdown-menu>
|
|
|
|
|
|
<van-list
|
|
|
@@ -29,7 +30,7 @@
|
|
|
<div style="display: flex; margin-top: 10px">
|
|
|
<div style="font-weight: bold">{{ item.name }}</div>
|
|
|
<div class="notOnline" style="color: #638dce">
|
|
|
- {{ item.title }}
|
|
|
+ {{ item.professional_title }}
|
|
|
</div>
|
|
|
</div>
|
|
|
<div style="font-size: 13px; margin-top: 5px; color: #979797">
|
|
|
@@ -52,91 +53,80 @@
|
|
|
</div>
|
|
|
</van-list>
|
|
|
</div>
|
|
|
- <!-- <expertinformation-->
|
|
|
- <!-- v-if="isShowInform"-->
|
|
|
- <!-- class="modal-overlay"-->
|
|
|
- <!-- />-->
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
import searchImg from "@/assets/images/search.png";
|
|
|
import closeImg from "@/assets/images/close.png";
|
|
|
import onlineUser from "@/assets/images/threePreventionResponsiblePerson/onlineUsers.png";
|
|
|
-import offlineUser from "@/assets/images/threePreventionResponsiblePerson/offlineUsers.png";
|
|
|
-import expertinformation from "@/views/disasterRiskMonitor/expertinformation.vue";
|
|
|
+import {getExpertList} from "@/api/expert";
|
|
|
|
|
|
const router = useRouter();
|
|
|
-const keywords = ref();
|
|
|
-const areaType = ref("440900000");
|
|
|
-const value2 = ref("a");
|
|
|
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
|
|
-const { district_type } = toRefs<any>(proxy?.useDict("district_type"));
|
|
|
+const { district_type, expert_type } = toRefs<any>(proxy?.useDict("district_type", "expert_type"));
|
|
|
const columns = computed(() => {
|
|
|
- let data = [{ text: "茂名市", value: "440900000" }];
|
|
|
+ let data = [{ text: "茂名市", value: "" }];
|
|
|
if (district_type.value && district_type.value.length > 0) {
|
|
|
district_type.value.forEach(item => {
|
|
|
- data.push({ text: item.label, value: item.value });
|
|
|
+ data.push({ text: item.label, value: item.label });
|
|
|
});
|
|
|
}
|
|
|
return data;
|
|
|
});
|
|
|
-const option2 = [
|
|
|
- { text: "所有", value: "a" },
|
|
|
- { text: "自然灾害", value: "b" },
|
|
|
- { text: "事故灾难", value: "c" },
|
|
|
- { text: "公共卫生", value: "d" },
|
|
|
- { text: "社会安全", value: "e" },
|
|
|
- { text: "其他", value: "f" }
|
|
|
-];
|
|
|
-const list = ref([
|
|
|
- {
|
|
|
- id: "1",
|
|
|
- name: "谢和平",
|
|
|
- unit: "国务院学位委员会、深圳大学深地科学与绿色能源研究院",
|
|
|
- position: "委员、院长",
|
|
|
- title: "教授",
|
|
|
- expertType: "其它突发事件"
|
|
|
- },
|
|
|
- {
|
|
|
- id: "2",
|
|
|
- name: "谢和平",
|
|
|
- unit: "国务院学位委员会、深圳大学深地科学与绿色能源研究院",
|
|
|
- position: "委员、院长",
|
|
|
- title: "教授",
|
|
|
- expertType: "其它突发事件"
|
|
|
- },
|
|
|
- {
|
|
|
- id: "3",
|
|
|
- name: "谢和平",
|
|
|
- unit: "国务院学位委员会、深圳大学深地科学与绿色能源研究院",
|
|
|
- position: "委员、院长",
|
|
|
- title: "教授",
|
|
|
- expertType: "其它突发事件"
|
|
|
- },
|
|
|
- {
|
|
|
- id: "4",
|
|
|
- name: "谢和平",
|
|
|
- unit: "国务院学位委员会、深圳大学深地科学与绿色能源研究院",
|
|
|
- position: "委员、院长",
|
|
|
- title: "教授",
|
|
|
- expertType: "其它突发事件"
|
|
|
- },
|
|
|
- {
|
|
|
- id: "5",
|
|
|
- name: "谢和平",
|
|
|
- unit: "国务院学位委员会、深圳大学深地科学与绿色能源研究院",
|
|
|
- position: "委员、院长",
|
|
|
- title: "教授",
|
|
|
- expertType: "其它突发事件"
|
|
|
+const option2 = computed(() => {
|
|
|
+ let data = [{ text: "所有", value: "" }];
|
|
|
+ if (expert_type.value && expert_type.value.length > 0) {
|
|
|
+ expert_type.value.forEach(item => {
|
|
|
+ data.push({ text: item.label, value: item.label });
|
|
|
+ });
|
|
|
}
|
|
|
-]);
|
|
|
+ return data;
|
|
|
+});
|
|
|
+const queryParams = reactive({
|
|
|
+ page: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ keyword: '',
|
|
|
+ county: '',
|
|
|
+ professional_group: ''
|
|
|
+})
|
|
|
+const list = ref([]);
|
|
|
const loading = ref(false);
|
|
|
const finished = ref(true);
|
|
|
-// const onLoad = () => {};
|
|
|
|
|
|
const personInform = item => {
|
|
|
router.push({ name: "Expertinformation", query: { id: item.id } });
|
|
|
};
|
|
|
+
|
|
|
+const onLoad = () => {
|
|
|
+ getExpertList(queryParams).then((res: any) => {
|
|
|
+ const item = res.data || [];
|
|
|
+ // 重置 persons 数组（如果是第一页）
|
|
|
+ if (queryParams.page == 1) {
|
|
|
+ list.value = [];
|
|
|
+ }
|
|
|
+ // 将新数据添加到 persons 数组中
|
|
|
+ item.forEach(temp => {
|
|
|
+ list.value.push(temp);
|
|
|
+ });
|
|
|
+ // 检查是否加载了所有数据
|
|
|
+ if (list.value.length >= res.total) {
|
|
|
+ finished.value = true;
|
|
|
+ } else {
|
|
|
+ finished.value = false;
|
|
|
+ }
|
|
|
+ queryParams.page++;
|
|
|
+ loading.value = false;
|
|
|
+ });
|
|
|
+}
|
|
|
+const searchCancel = () => {
|
|
|
+ queryParams.keyword = "";
|
|
|
+ onSearch();
|
|
|
+}
|
|
|
+const onSearch = () => {
|
|
|
+ queryParams.page = 1;
|
|
|
+ onLoad();
|
|
|
+};
|
|
|
+onLoad()
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
@@ -199,13 +189,9 @@ const personInform = item => {
|
|
|
.notOnline {
|
|
|
font-size: 12px;
|
|
|
background-color: #f1f3fb;
|
|
|
- padding-left: 5px;
|
|
|
- height: 15px;
|
|
|
- width: 35px;
|
|
|
- padding-bottom: 18px;
|
|
|
+ padding: 2px 5px;
|
|
|
border-radius: 2px;
|
|
|
color: #ffffff;
|
|
|
- margin-top: 5px;
|
|
|
margin-left: 10px;
|
|
|
}
|
|
|
.text-ellipsis {
|
