修改首页5个搜索

This commit is contained in:
熊丽君
2022-02-24 11:35:19 +08:00
parent 4b3984e06a
commit 66f401a07a
8 changed files with 605 additions and 543 deletions

View File

@ -1,111 +1,108 @@
<template> <template>
<div class="collectAndVisit"> <div class="collectAndVisit">
<div>{{ visit_count }}</div> <div>{{ visit_count }}</div>
<div class="heart_w"> <div class="heart_w">
<div class="heart" @click="change()" :class="{ in: state.isCollect }"></div> <div
<span>{{ state.collect }}</span> class="heart"
</div> @click="change()"
:class="{ in: state.isCollect }"
></div>
<span>{{ state.collect }}</span>
</div> </div>
</div>
</template> </template>
<script setup> <script setup>
import request from '@/utils/request' import request from "@/utils/request";
import { reactive } from 'vue'; import { reactive } from "vue";
function launch (id) { function launch(id) {
return request({ return request({
url: '/v1/user/collect/launch', url: "/v1/user/collect/launch",
method: 'post', method: "post",
data: { kind: props.kind, object_id: props.object_id, } data: { kind: props.kind, object_id: props.object_id },
}) });
} }
let flag = true; let flag = true;
const props = defineProps({ const props = defineProps({
is_collect: { is_collect: {
type: Boolean, type: Boolean,
required: true, required: true,
}, },
collect_count: { collect_count: {
type: Number, type: Number,
required: true, required: true,
}, },
visit_count: { visit_count: {
type: Number, type: Number,
required: true, required: true,
}, },
kind: { kind: {
type: Number, type: Number,
required: true, required: true,
}, },
object_id: { object_id: {
type: String, type: String,
required: true, required: true,
}, },
}); });
const state = reactive({ const state = reactive({
collect: props.collect_count, collect: props.collect_count,
isCollect: props.is_collect, isCollect: props.is_collect,
}) });
async function postData () { async function postData() {
if (flag) { if (flag) {
flag = false;
await launch()
.then((res) => {
if (200 == res.code) {
state.isCollect = res.data;
if (res.data) {
state.collect++;
} else {
state.collect--;
}
}
flag = true;
})
.catch(() => {
flag = false; flag = false;
await launch().then(res => { });
if (200 == res.code) { }
state.isCollect = res.data;
if (res.data) {
state.collect++;
} else {
state.collect--;
}
}
flag = true;
}).catch(() => {
flag = false;
});
}
} }
function change () { function change() {
postData();
postData();
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.collectAndVisit { .collectAndVisit {
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
.heart_w { .heart_w {
vertical-align: text-bottom; vertical-align: text-bottom;
span { span {
vertical-align: text-bottom; vertical-align: text-bottom;
position: relative; position: relative;
top: 1px; top: 1px;
}
}
.heart {
cursor: pointer;
user-select: none;
vertical-align: text-bottom;
display: inline-block;
width: 18.3px;
height: 16.4px;
margin-right: 5px;
background-size: cover;
background-image: url(./img/heart0.png);
}
.in {
background-image: url(./img/heart1.png);
} }
}
.heart {
cursor: pointer;
user-select: none;
vertical-align: text-bottom;
display: inline-block;
width: 18.3px;
height: 16.4px;
margin-right: 5px;
background-size: cover;
background-image: url(./img/heart0.png);
}
.in {
background-image: url(./img/heart1.png);
}
} }
</style> </style>

View File

@ -22,9 +22,23 @@
<!-- <div class="labelList"> <!-- <div class="labelList">
<div v-for="item in data.industrys">{{ item }}</div> <div v-for="item in data.industrys">{{ item }}</div>
</div>--> </div>-->
<div v-if="data.industrys" class="line"> <div v-if="data.industrys" class="line" style="overflow: hidden">
所属领域 <el-col>所属领域</el-col>
<span>{{ data.industrys[data.industrys.length - 1] }}</span> <el-col
:title="data.industrys[data.industrys.length - 1]"
style="display: inline-block; width: calc(100% - 86px)"
>
<span
style="
display: inline-block;
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
"
>{{ data.industrys[data.industrys.length - 1] }}</span
>
</el-col>
</div> </div>
<div class="line"> <div class="line">
所在机构 所在机构

View File

@ -1,136 +1,144 @@
<template> <template>
<div class="box"> <div class="box">
<div class="wrap"> <div class="wrap">
<div class="img"> <div class="img">
<!-- <img :src="data.image" alt /> --> <!-- <img :src="data.image" alt /> -->
<img src="https://t7.baidu.com/it/u=1951548898,3927145&fm=193&f=GIF" /> <img src="./img/achieve.png" />
</div> </div>
<div class="content"> <div class="content">
<div class="tit" @click="handleDetail(data.id)">{{ data.title }}</div> <div class="tit" @click="handleDetail(data.id)">{{ data.title }}</div>
<slot name="des" /> <slot name="des" />
<div v-if="data.industrys" class="line"> <div v-if="data.industrys" class="line">
所属领域 所属领域
<span>{{ data.industrys[data.industrys.length - 1] }}</span> <span>{{ data.industrys[data.industrys.length - 1] }}</span>
</div>
<div class="line">
合作模式
<span>{{ data.mode_title }}</span>
</div>
<div class="line">
技术成熟度
<span>{{ data.maturity_title }}</span>
</div>
</div>
<div>
<div class="keywords">
<wordcloud v-if="data.keywords" :data="createdData(data.customers)"></wordcloud>
</div>
<collectAndVisit :is_collect="data.is_collect" :collect_count="data.collect_count" :visit_count="data.visit_count" :object_id="data.id" :kind="1005"/>
</div>
</div> </div>
<div class="line">
合作模式
<span>{{ data.mode_title }}</span>
</div>
<div class="line">
技术成熟度
<span>{{ data.maturity_title }}</span>
</div>
</div>
<div>
<div class="keywords">
<wordcloud
v-if="data.keywords"
:data="createdData(data.customers)"
></wordcloud>
</div>
<collectAndVisit
:is_collect="data.is_collect"
:collect_count="data.collect_count"
:visit_count="data.visit_count"
:object_id="data.id"
:kind="1005"
/>
</div>
</div> </div>
</div>
</template> </template>
<script setup> <script setup>
import wordcloud from './wordcloud.vue' import wordcloud from "./wordcloud.vue";
import collectAndVisit from './collectAndVisit.vue' import collectAndVisit from "./collectAndVisit.vue";
const router = useRouter(); const router = useRouter();
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,
required: true, required: true,
}, },
}); });
function handleDetail (id) { function handleDetail(id) {
let routeData = router.resolve({ path: `/searchList/1/detail/${id}` }); let routeData = router.resolve({ path: `/searchList/1/detail/${id}` });
window.open(routeData.href, '_blank'); window.open(routeData.href, "_blank");
} }
function createdData (arr) { function createdData(arr) {
let l = []; let l = [];
let snap = JSON.parse(JSON.stringify(arr)) let snap = JSON.parse(JSON.stringify(arr));
snap.map(e => { snap.map((e) => {
l.push({ name: e, value: 30 }) l.push({ name: e, value: 30 });
return { name: e, value: 30 } return { name: e, value: 30 };
}) });
return l; return l;
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.box { .box {
width: 100%; width: 100%;
height: 190px; height: 190px;
background: #ffffff; background: #ffffff;
padding: 20px; padding: 20px;
box-sizing: border-box; box-sizing: border-box;
.wrap { .wrap {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
.img { .img {
width: 200px; width: 200px;
height: 150px; height: 150px;
margin-right: 10px; margin-right: 10px;
img { img {
display: block; display: block;
margin: 0; margin: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
}
.keywords {
width: 129px;
height: 129px;
}
.content {
flex: 1;
overflow: hidden;
.labelList {
overflow: hidden;
div {
padding: 2px 4px;
float: left;
background: #0054ff;
border-radius: 4px;
margin-right: 5px;
margin-bottom: 5px;
font-size: 14px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #ffffff;
}
}
.line {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #666666;
margin: 10px 0;
span {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333;
}
}
.tit {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 100%;
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: bold;
color: #333333;
overflow: hidden;
cursor: pointer;
}
}
} }
.keywords {
width: 129px;
height: 129px;
}
.content {
flex: 1;
overflow: hidden;
.labelList {
overflow: hidden;
div {
padding: 2px 4px;
float: left;
background: #0054ff;
border-radius: 4px;
margin-right: 5px;
margin-bottom: 5px;
font-size: 14px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #ffffff;
}
}
.line {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #666666;
margin: 10px 0;
span {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333;
}
}
.tit {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 100%;
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: bold;
color: #333333;
overflow: hidden;
cursor: pointer;
}
}
}
} }
</style> </style>

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.0 KiB

View File

@ -6,9 +6,9 @@
@handleQuery="handleQuery" @handleQuery="handleQuery"
> >
<template v-slot> <template v-slot>
<el-row type="flex" style="padding: 20px 0;"> <el-row type="flex" style="padding: 20px 0">
<div style="flex: 1"> <div style="flex: 1">
<div style="position: relative;"> <div style="position: relative">
<industrySelect @industryChange="industryChange"></industrySelect> <industrySelect @industryChange="industryChange"></industrySelect>
<div class="total"> <div class="total">
共找到 共找到
@ -16,7 +16,7 @@
</div> </div>
<div v-loading="loading"> <div v-loading="loading">
<section v-for="item in state.list" :key="item.id"> <section v-for="item in state.list" :key="item.id">
<div style="border: 1px solid #DCDCDC;margin-bottom: 10px;"> <div style="border: 1px solid #dcdcdc; margin-bottom: 10px">
<gainItem :data="item"></gainItem> <gainItem :data="item"></gainItem>
</div> </div>
</section> </section>
@ -44,17 +44,20 @@
<script setup> <script setup>
import webContact from "@/components/webContact/index.vue"; import webContact from "@/components/webContact/index.vue";
import request from '@/utils/request' import request from "@/utils/request";
const router = useRouter(); const router = useRouter();
import { onMounted } from 'vue'; import { onMounted } from "vue";
import searchContainer from './components/searchContainer.vue' import searchContainer from "./components/searchContainer.vue";
import industrySelect from './components/industrySelect.vue' import industrySelect from "./components/industrySelect.vue";
import gainItem from './components/gainItem.vue' import gainItem from "./components/gainItem.vue";
import wordcloud from './components/wordcloud.vue' import wordcloud from "./components/wordcloud.vue";
function handleDetail (id) { function handleDetail(id) {
let routeData = router.resolve({ path: `/searchList/0/detail/${id}`, query: { keyword: state.keyword } }); let routeData = router.resolve({
window.open(routeData.href, '_blank'); path: `/searchList/0/detail/${id}`,
query: { keyword: state.keyword },
});
window.open(routeData.href, "_blank");
} }
const loading = ref(true); const loading = ref(true);
@ -63,33 +66,35 @@ const state = reactive({
total: 1, total: 1,
pageSize: 10, pageSize: 10,
pageSizes: [10, 10 << 1, 10 << 2, 10 << 3], pageSizes: [10, 10 << 1, 10 << 2, 10 << 3],
keyword: '', keyword: "",
industryList: [], industryList: [],
id1: '', id1: "",
id2: '', id2: "",
id3: '', id3: "",
val: 3, val: 3,
arr: [{ arr: [
"name": "Cat", {
"value": 26 name: "Cat",
}, value: 26,
{ },
"name": "fish", {
"value": 19 name: "fish",
}] value: 19,
},
],
}); });
function createdData (arr) { function createdData(arr) {
let l = []; let l = [];
let snap = JSON.parse(JSON.stringify(arr)) let snap = JSON.parse(JSON.stringify(arr));
snap.map(e => { snap.map((e) => {
l.push({ name: e, value: 30 }) l.push({ name: e, value: 30 });
return { name: e, value: 30 } return { name: e, value: 30 };
}) });
return l; return l;
} }
function search () { function search() {
let industry = ''; let industry = "";
if (state.id1) { if (state.id1) {
industry += state.id1; industry += state.id1;
} }
@ -100,19 +105,23 @@ function search () {
industry += `-${state.id3}`; industry += `-${state.id3}`;
} }
return request({ return request({
url: '/v1/search', url: "/v1/search",
method: 'post', method: "post",
data: { industry, mode: 2, page_num: state.pageNum, page_size: state.pageSize, keyword: state.keyword } data: {
}) industry,
mode: 2,
page_num: state.pageNum,
page_size: state.pageSize,
keyword: state.keyword,
},
});
} }
function handleQuery(keyword) {
function handleQuery (keyword) {
state.keyword = keyword; state.keyword = keyword;
getDataList() getDataList();
} }
function industryChange (industry) { function industryChange(industry) {
if (industry.id1) { if (industry.id1) {
state.id1 = industry.id1; state.id1 = industry.id1;
} }
@ -122,23 +131,25 @@ function industryChange (industry) {
if (industry.id3) { if (industry.id3) {
state.id3 = industry.id3; state.id3 = industry.id3;
} }
getDataList() getDataList();
} }
function getDataList () { function getDataList() {
loading.value = true; loading.value = true;
search().then(res => { search()
if (200 == res.code) { .then((res) => {
// 总条数 if (200 == res.code) {
state.total = res.data.count; console.log(res);
state.list = res.data.data; // 总条数
state.total = res.data.count;
state.list = res.data.data;
loading.value = false;
}
})
.catch(() => {
loading.value = false; loading.value = false;
} });
}).catch(() => {
loading.value = false;
})
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

View File

@ -1,295 +1,310 @@
<template> <template>
<div v-loading="loading"> <div v-loading="loading">
<searchContainer bannerKey="首页>成果列表" title="成果库" @handleQuery="handleQuery"> <searchContainer
<template v-slot> bannerKey="首页>成果库>成果详情"
<div class="head"> title="成果库"
<el-breadcrumb separator="/"> @handleQuery="handleQuery"
<el-breadcrumb-item> >
<span class="one">找成果</span> <template v-slot>
</el-breadcrumb-item> <div class="head">
<el-breadcrumb-item> <el-breadcrumb separator="/">
<span>成果详情</span> <el-breadcrumb-item>
</el-breadcrumb-item> <span class="one">找成果</span>
</el-breadcrumb> </el-breadcrumb-item>
</div> <el-breadcrumb-item>
<el-row type="flex" style="padding-bottom: 20px;"> <span>成果详情</span>
<div style="flex: 1"> </el-breadcrumb-item>
<gainItem :data="state.expertDetail"> </el-breadcrumb>
<template v-slot:des> </div>
<div>{{state.expertDetail.introduce}}</div> <el-row type="flex" style="padding-bottom: 20px">
</template> <div style="flex: 1">
</gainItem> <gainItem :data="state.expertDetail">
<div class="btns"> <template v-slot:des>
<div class="order">预约对接</div> <div>{{ state.expertDetail.introduce }}</div>
<div class="share">一键分享</div> </template>
</div> </gainItem>
<div class="btns">
<div class="order">预约对接</div>
<div class="share">一键分享</div>
</div>
<div class="detail"> <div class="detail">
<div style="padding: 20px 0;"> <div style="padding: 20px 0">
<div class="pointTit">技术视频</div> <div class="pointTit">技术视频</div>
</div> </div>
<div style="padding: 20px 0;"> <div style="padding: 20px 0">
<div class="pointTit">产品详情</div> <div class="pointTit">产品详情</div>
</div> </div>
<div class="html" v-html="state.expertDetail.introduce"></div> <div class="html" v-html="state.expertDetail.introduce"></div>
</div> </div>
</div> </div>
<div class="r"> <div class="r">
<webContact /> <webContact />
</div> </div>
</el-row> </el-row>
</template> </template>
</searchContainer> </searchContainer>
</div> </div>
</template> </template>
<script setup> <script setup>
import webContact from "@/components/webContact/index.vue"; import webContact from "@/components/webContact/index.vue";
import gainItem from './components/gainItem.vue' import gainItem from "./components/gainItem.vue";
import loadMore from './components/loadMore.vue' import loadMore from "./components/loadMore.vue";
import request from '@/utils/request' import request from "@/utils/request";
const router = useRouter(); const router = useRouter();
const route = useRoute(); const route = useRoute();
import { onMounted } from 'vue'; import { onMounted } from "vue";
import searchContainer from './components/searchContainer.vue' import searchContainer from "./components/searchContainer.vue";
import wordcloud from './components/wordcloud.vue' import wordcloud from "./components/wordcloud.vue";
import productItem from './components/productItem.vue' import productItem from "./components/productItem.vue";
const loading = ref(true); const loading = ref(true);
const state = reactive({ const state = reactive({
pageNum: 1, pageNum: 1,
pageSize: 4, pageSize: 4,
keyword: '', keyword: "",
val: 3, val: 3,
expertDetail: {}, expertDetail: {},
arr: [{ arr: [
"name": "Cat", {
"value": 26 name: "Cat",
value: 26,
}, },
{ {
"name": "fish", name: "fish",
"value": 19 value: 19,
}], },
activeName: 'first' ],
activeName: "first",
}); });
// 建议 列表前4条 // 建议 列表前4条
function recommend () { function recommend() {
return request({ return request({
url: '/v1/search', url: "/v1/search",
method: 'post', method: "post",
data: { mode: 5, page_num: state.pageNum, page_size: state.pageSize, keyword: state.keyword } data: {
}) mode: 5,
page_num: state.pageNum,
page_size: state.pageSize,
keyword: state.keyword,
},
});
} }
// 成果详情 // 成果详情
function achievementDetail (id) { function achievementDetail(id) {
return request({ return request({
url: '/v1/technology/achievement/detail', url: "/v1/technology/achievement/detail",
method: 'post', method: "post",
data: { id: id } data: { id: id },
}) });
} }
function createdData(arr) {
function createdData (arr) { let l = [];
let l = []; let snap = JSON.parse(JSON.stringify(arr));
let snap = JSON.parse(JSON.stringify(arr)) snap.map((e) => {
snap.map(e => { l.push({ name: e, value: 30 });
l.push({ name: e, value: 30 }) return { name: e, value: 30 };
return { name: e, value: 30 } });
}) return l;
return l;
} }
function handleDetail (id) { function handleDetail(id) {
let routeData = router.resolve({ path: `/searchList/0/detail/${id}`, query: { keyword: state.keyword } }); let routeData = router.resolve({
window.open(routeData.href, '_blank'); path: `/searchList/0/detail/${id}`,
query: { keyword: state.keyword },
});
window.open(routeData.href, "_blank");
} }
function handleList (mode, keyword) { function handleList(mode, keyword) {
router.push({ path: `/searchList/${mode}`, query: { keyword } }); router.push({ path: `/searchList/${mode}`, query: { keyword } });
} }
// 首次加载数据,其后跳转页面 // 首次加载数据,其后跳转页面
let flag = true; let flag = true;
function handleQuery (keyword) { function handleQuery(keyword) {
state.keyword = keyword; state.keyword = keyword;
if (flag) { if (flag) {
getDataList(); getDataList();
flag = false; flag = false;
} else { } else {
handleList(0, keyword); handleList(0, keyword);
} }
} }
function getDataList() {
function getDataList () { loading.value = true;
loading.value = true; let id = route.params.id;
let id = route.params.id; if (!id) return;
if (!id) return achievementDetail(id)
achievementDetail(id).then(res => { .then((res) => {
if (200 == res.code) { if (200 == res.code) {
state.expertDetail = res.data; console.log(res.data);
loading.value = false; state.expertDetail = res.data;
}
}).catch(() => {
loading.value = false; loading.value = false;
}
})
.catch(() => {
loading.value = false;
}); });
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
:deep(.el-tabs) { :deep(.el-tabs) {
.el-tabs__item { .el-tabs__item {
color: #666666; color: #666666;
font-size: 14px; font-size: 14px;
} }
.el-tabs__item:hover { .el-tabs__item:hover {
opacity: 0.8; opacity: 0.8;
} }
.el-tabs__item.is-active { .el-tabs__item.is-active {
font-size: 16px; font-size: 16px;
font-family: Source Han Sans CN; font-family: Source Han Sans CN;
font-weight: bold; font-weight: bold;
color: #333333; color: #333333;
} }
.el-tabs__active-bar { .el-tabs__active-bar {
background-color: #333333; background-color: #333333;
height: 4px; height: 4px;
} }
.el-tabs__nav-wrap::after { .el-tabs__nav-wrap::after {
background-color: transparent; background-color: transparent;
} }
} }
.head { .head {
padding: 15px 0px; padding: 15px 0px;
span { span {
font-size: 16px; font-size: 16px;
font-family: Source Han Sans CN; font-family: Source Han Sans CN;
font-weight: 400; font-weight: 400;
color: #666666; color: #666666;
} }
.one { .one {
color: #333333; color: #333333;
} }
} }
.r { .r {
display: inline-block; display: inline-block;
width: 325px; width: 325px;
margin-left: 14px; margin-left: 14px;
min-height: 200px; min-height: 200px;
} }
.detail { .detail {
width: 661px; width: 661px;
box-sizing: border-box; box-sizing: border-box;
padding: 20px; padding: 20px;
background: #fff; background: #fff;
.describe { .describe {
font-size: 14px; font-size: 14px;
font-family: Source Han Sans CN; font-family: Source Han Sans CN;
font-weight: 400; font-weight: 400;
color: #666666; color: #666666;
margin-bottom: 5px; margin-bottom: 5px;
} }
} }
.pointTit { .pointTit {
position: relative; position: relative;
padding-left: 10px; padding-left: 10px;
font-size: 16px; font-size: 16px;
font-family: Source Han Sans CN; font-family: Source Han Sans CN;
font-weight: 500; font-weight: 500;
color: #333333; color: #333333;
&:before { &:before {
content: ""; content: "";
top: 8px; top: 8px;
left: 0px; left: 0px;
position: absolute; position: absolute;
display: block; display: block;
width: 5px; width: 5px;
height: 5px; height: 5px;
background: #0054ff; background: #0054ff;
} }
} }
.btns { .btns {
overflow: hidden; overflow: hidden;
padding: 0 20px 20px 20px; padding: 0 20px 20px 20px;
width: 100%; width: 100%;
background-color: #fff; background-color: #fff;
margin-top: -20px; margin-top: -20px;
div { div {
margin-top: 20px; margin-top: 20px;
text-align: center; text-align: center;
float: right; float: right;
cursor: pointer; cursor: pointer;
user-select: none; user-select: none;
width: 101px; width: 101px;
height: 36px; height: 36px;
font-size: 14px; font-size: 14px;
font-family: Source Han Sans CN; font-family: Source Han Sans CN;
font-weight: 400; font-weight: 400;
line-height: 36px; line-height: 36px;
box-sizing: border-box; box-sizing: border-box;
&:hover { &:hover {
opacity: 0.7; opacity: 0.7;
}
}
.share {
color: #333333;
background: #f2f6ff;
border: 1px solid #dcdcdc;
margin-right: 10px;
}
.order {
background: #0054ff;
color: #ffffff;
border: none;
} }
}
.share {
color: #333333;
background: #f2f6ff;
border: 1px solid #dcdcdc;
margin-right: 10px;
}
.order {
background: #0054ff;
color: #ffffff;
border: none;
}
} }
.achievementItem, .achievementItem,
.loadMoreItem { .loadMoreItem {
padding: 20px; padding: 20px;
background-color: #fff; background-color: #fff;
margin-bottom: 10px; margin-bottom: 10px;
.tit { .tit {
margin-left: -8px; margin-left: -8px;
font-size: 16px; font-size: 16px;
font-family: Source Han Sans CN; font-family: Source Han Sans CN;
font-weight: bold; font-weight: bold;
color: #333333; color: #333333;
} }
.line { .line {
margin: 10px 0; margin: 10px 0;
font-size: 14px; font-size: 14px;
font-family: Source Han Sans CN; font-family: Source Han Sans CN;
font-weight: 400; font-weight: 400;
color: #666666; color: #666666;
} }
} }
.patentItem { .patentItem {
padding: 20px; padding: 20px;
background-color: #fff; background-color: #fff;
margin-bottom: 10px; margin-bottom: 10px;
.tit { .tit {
font-size: 16px; font-size: 16px;
font-family: Source Han Sans CN; font-family: Source Han Sans CN;
font-weight: bold; font-weight: bold;
color: #333333; color: #333333;
} }
.line { .line {
padding-left: 8px; padding-left: 8px;
margin: 10px 0; margin: 10px 0;
font-size: 14px; font-size: 14px;
font-family: Source Han Sans CN; font-family: Source Han Sans CN;
font-weight: 400; font-weight: 400;
color: #666666; color: #666666;
} }
} }
</style> </style>

View File

@ -6,9 +6,9 @@
@handleQuery="handleQuery" @handleQuery="handleQuery"
> >
<template v-slot> <template v-slot>
<el-row type="flex" style="padding: 20px 0;"> <el-row type="flex" style="padding: 20px 0">
<div style="flex: 1"> <div style="flex: 1">
<div style="position: relative;"> <div style="position: relative">
<industrySelect @industryChange="industryChange"></industrySelect> <industrySelect @industryChange="industryChange"></industrySelect>
<div class="total"> <div class="total">
共找到 共找到
@ -16,7 +16,7 @@
</div> </div>
<div v-loading="loading"> <div v-loading="loading">
<section v-for="item in state.list" :key="item.id"> <section v-for="item in state.list" :key="item.id">
<div style="border: 1px solid #DCDCDC;margin-bottom: 10px;"> <div style="border: 1px solid #dcdcdc; margin-bottom: 10px">
<gainItem :data="item"></gainItem> <gainItem :data="item"></gainItem>
</div> </div>
</section> </section>
@ -44,17 +44,20 @@
<script setup> <script setup>
import webContact from "@/components/webContact/index.vue"; import webContact from "@/components/webContact/index.vue";
import request from '@/utils/request' import request from "@/utils/request";
const router = useRouter(); const router = useRouter();
import { onMounted } from 'vue'; import { onMounted } from "vue";
import searchContainer from './components/searchContainer.vue' import searchContainer from "./components/searchContainer.vue";
import industrySelect from './components/industrySelect.vue' import industrySelect from "./components/industrySelect.vue";
import gainItem from './components/gainItem.vue' import gainItem from "./components/gainItem.vue";
import wordcloud from './components/wordcloud.vue' import wordcloud from "./components/wordcloud.vue";
function handleDetail (id) { function handleDetail(id) {
let routeData = router.resolve({ path: `/searchList/0/detail/${id}`, query: { keyword: state.keyword } }); let routeData = router.resolve({
window.open(routeData.href, '_blank'); path: `/searchList/0/detail/${id}`,
query: { keyword: state.keyword },
});
window.open(routeData.href, "_blank");
} }
const loading = ref(true); const loading = ref(true);
@ -63,33 +66,35 @@ const state = reactive({
total: 1, total: 1,
pageSize: 10, pageSize: 10,
pageSizes: [10, 10 << 1, 10 << 2, 10 << 3], pageSizes: [10, 10 << 1, 10 << 2, 10 << 3],
keyword: '', keyword: "",
industryList: [], industryList: [],
id1: '', id1: "",
id2: '', id2: "",
id3: '', id3: "",
val: 3, val: 3,
arr: [{ arr: [
"name": "Cat", {
"value": 26 name: "Cat",
}, value: 26,
{ },
"name": "fish", {
"value": 19 name: "fish",
}] value: 19,
},
],
}); });
function createdData (arr) { function createdData(arr) {
let l = []; let l = [];
let snap = JSON.parse(JSON.stringify(arr)) let snap = JSON.parse(JSON.stringify(arr));
snap.map(e => { snap.map((e) => {
l.push({ name: e, value: 30 }) l.push({ name: e, value: 30 });
return { name: e, value: 30 } return { name: e, value: 30 };
}) });
return l; return l;
} }
function search () { function search() {
let industry = ''; let industry = "";
if (state.id1) { if (state.id1) {
industry += state.id1; industry += state.id1;
} }
@ -100,19 +105,23 @@ function search () {
industry += `-${state.id3}`; industry += `-${state.id3}`;
} }
return request({ return request({
url: '/v1/search', url: "/v1/search",
method: 'post', method: "post",
data: { industry, mode: 3, page_num: state.pageNum, page_size: state.pageSize, keyword: state.keyword } data: {
}) industry,
mode: 4,
page_num: state.pageNum,
page_size: state.pageSize,
keyword: state.keyword,
},
});
} }
function handleQuery(keyword) {
function handleQuery (keyword) {
state.keyword = keyword; state.keyword = keyword;
getDataList() getDataList();
} }
function industryChange (industry) { function industryChange(industry) {
if (industry.id1) { if (industry.id1) {
state.id1 = industry.id1; state.id1 = industry.id1;
} }
@ -122,23 +131,24 @@ function industryChange (industry) {
if (industry.id3) { if (industry.id3) {
state.id3 = industry.id3; state.id3 = industry.id3;
} }
getDataList() getDataList();
} }
function getDataList () { function getDataList() {
loading.value = true; loading.value = true;
search().then(res => { search()
if (200 == res.code) { .then((res) => {
// 总条数 if (200 == res.code) {
state.total = res.data.count; // 总条数
state.list = res.data.data; state.total = res.data.count;
state.list = res.data.data;
loading.value = false;
}
})
.catch(() => {
loading.value = false; loading.value = false;
} });
}).catch(() => {
loading.value = false;
})
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

View File

@ -483,6 +483,13 @@ function getDataList() {
expert(id) expert(id)
.then((res) => { .then((res) => {
if (200 == res.code) { if (200 == res.code) {
let str = " ".repeat(8);
let nbsp = "\u00A0".repeat(8);
res.data.introduce = res.data.introduce.replace(/\n/g, "<br>");
res.data.introduce = res.data.introduce.replace(
new RegExp(str, "g"),
nbsp
);
state.expertDetail = res.data; state.expertDetail = res.data;
loading.value = false; loading.value = false;
} }