Files
2022-10-31 17:46:09 +08:00

148 lines
4.0 KiB
Vue

<template>
<div class="app-container">
<el-radio-group
v-model="queryParams.searchType"
size="small"
@change="handleQuery"
>
<el-badge :value="12" class="count-badge" :hidden="true">
<el-radio-button label="1">企业</el-radio-button>
</el-badge>
<el-radio-button label="2">成果</el-radio-button>
<el-radio-button label="4">专利</el-radio-button>
<el-radio-button label="5">专家</el-radio-button>
<el-radio-button label="6">服务需求</el-radio-button>
<el-radio-button label="7">技术需求</el-radio-button>
<!-- <el-radio-button label="4">实验室</el-radio-button> -->
</el-radio-group>
<div v-if="dataList.length" style="margin-top: 20px" v-loading="loading">
<section v-for="item in dataList" :key="item.id">
<div style="border: 1px solid #dcdcdc; margin-bottom: 10px">
<enterpriseItem
:data="item"
v-if="queryParams.searchType == 1"
></enterpriseItem>
<AchievementItem
:data="item"
v-else-if="queryParams.searchType == 2"
></AchievementItem>
<gainItem
:data="item"
v-else-if="queryParams.searchType == 4"
></gainItem>
<expertItem
:data="item"
v-else-if="queryParams.searchType == 5"
></expertItem>
<serviceDemandItem
:data="item"
v-else-if="queryParams.searchType == 6"
></serviceDemandItem>
<TechnologyDemandItem
:data="item"
v-else-if="queryParams.searchType == 7"
></TechnologyDemandItem>
</div>
</section>
</div>
<el-empty v-else></el-empty>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
</div>
</template>
<script setup name="Post">
import { search } from "@/api/website/home/index";
import gainItem from "@/views/website/searchList/components/gainItem.vue";
import expertItem from "@/views/website/searchList/components/expertItem.vue";
import serviceDemandItem from "@/views/website/searchList/components/serviceDemandItem.vue";
import enterpriseItem from "../../components/enterpriseItem.vue";
import TechnologyDemandItem from "@/views/website/searchList/components/technologyDemandItem.vue";
import AchievementItem from "@/views/website/searchList/components/achievementItem.vue";
import { useRoute, useRouter } from "vue-router";
import { watch } from "vue";
const route = useRoute();
const router = useRouter();
const dataList = ref([]);
const loading = ref(true);
const total = ref(0);
const queryType = computed(() => {
if (queryParams.value.searchType == 1) {
return 2;
} else if (queryParams.value.searchType == 2) {
return 1;
} else if (queryParams.value.searchType == 4) {
return 2;
} else if (queryParams.value.searchType == 5) {
return 2;
} else if (queryParams.value.searchType == 6) {
return 1;
} else if (queryParams.value.searchType == 7) {
return 1;
}
});
// router.replace({
// path: "/extension/results",
// query: {
// keyword: route.query.keyword,
// queryType: queryType,
// },
// });
// watch(
// queryType,
// (val) => {
// console.log(val);
// },
// { immediate: true }
// );
const data = reactive({
queryParams: {
pageNum: 1,
pageSize: 10,
query: route.query.keyword,
searchType: "1",
queryType: queryType,
},
});
const { queryParams } = toRefs(data);
/** 查询列表 */
async function getList() {
const resp = await search(queryParams.value);
dataList.value = resp.list;
total.value = resp.total;
loading.value = false;
}
/** 搜索按钮操作 */
function handleQuery() {
queryParams.value.pageNum = 1;
getList();
}
handleQuery();
</script>
<style lang="scss" scoped>
.btn_info {
height: 35px;
line-height: 35px;
text-align: center;
color: #fff;
background-color: #787878;
}
:deep(.count-badge) {
z-index: 99;
}
</style>