This commit is contained in:
熊丽君
2022-02-08 08:42:23 +08:00
18 changed files with 1385 additions and 121 deletions

View File

@ -92,6 +92,10 @@ function submitForm() {
}
</script>
<style lang="scss" scoped>
.el-form {
padding: 15px;
background-color: #fff;
}
.el-form-item {
margin-bottom: 15px;
}

View File

@ -112,9 +112,8 @@ watch(
pagePath.value = newVal;
}
);
onMounted(() => {
pagePath.value = route.path;
});
pagePath.value = route.path;
function handlePath(path) {
pagePath.value = path;
router.push(path);

View File

@ -47,6 +47,18 @@ export const constantRoutes = [
path: 'searchList/0/detail/:id',
component: () => import('../views/website/searchList/index0Detail.vue'),
},
{
path: 'searchList/1',
component: () => import('../views/website/searchList/index1.vue'),
},
{
path: 'searchList/4',
component: () => import('../views/website/searchList/index4.vue'),
},
{
path: 'searchList/4/detail/:id',
component: () => import('../views/website/searchList/index4Detail.vue'),
},
{
path: 'solution/:name',
name: 'solution',

View File

@ -25,7 +25,10 @@
<div class="a">领域</div>
<div class="b">专家数量</div>
</div>
<div v-if="Object.keys(getIndustry(snapTree)).length > 0" v-for="(v,k) in getIndustry(snapTree)">
<div
v-if="Object.keys(getIndustry(snapTree)).length > 0"
v-for="(v,k) in getIndustry(snapTree)"
>
<div class="a" :title="k">{{ k }}</div>
<div class="b">{{ v }}</div>
</div>
@ -128,9 +131,9 @@ const state = reactive({
isShowTips: false,//是否显示下载提示
});
onMounted(async () => {
onMounted(() => {
// 数据接口
await getExpert().then(res => {
getExpert().then(res => {
if (200 == res.code) {
treeData = res.data;
snapTree.value = res.data;
@ -156,21 +159,24 @@ onMounted(async () => {
state.echartsMap = echarts.init(dom);
state.echartsMap.on('click', echartsMapClick);
state.map = new AMap.Map('container', {
resizeEnable: true,
center: [116.30946, 39.937629],
zoom: 3
});
state.opts = {
subdistrict: 1, //返回下一级行政区
showbiz: false //最后一级返回街道信息
};
state.district = new AMap.DistrictSearch(state.opts);//注意:需要使用插件同步下发功能才能这样直接使用
state.district.search('中国', (status, result) => {
if (status == 'complete') {
getData(result.districtList[0], '', 100000);
}
});
setTimeout(() => {
state.map = new AMap.Map('container', {
resizeEnable: true,
center: [116.30946, 39.937629],
zoom: 3
});
state.opts = {
subdistrict: 1, //返回下一级行政区
showbiz: false //最后一级返回街道信息
};
state.district = new AMap.DistrictSearch(state.opts);//注意:需要使用插件同步下发功能才能这样直接使用
state.district.search('中国', (status, result) => {
if (status == 'complete') {
getData(result.districtList[0], '', 100000);
}
});
}, 1000)
});
@ -447,15 +453,14 @@ function loadMap (mapName, data) {
border-right: 1px solid #0054ff;
text-align: center;
line-height: 42px;
overflow:hidden;
white-space:nowrap;
text-overflow:ellipsis;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.b {
text-align: center;
line-height: 42px;
width: 90px;
}
}
</style>

View File

@ -128,9 +128,9 @@ const state = reactive({
isShowTips: false,//是否显示下载提示
});
onMounted(async () => {
onMounted(() => {
// 数据接口
await laboratory().then(res => {
laboratory().then(res => {
if (200 == res.code) {
treeData = res.data;
snapTree.value = res.data;
@ -156,21 +156,23 @@ onMounted(async () => {
state.echartsMap = echarts.init(dom);
state.echartsMap.on('click', echartsMapClick);
state.map = new AMap.Map('container', {
resizeEnable: true,
center: [116.30946, 39.937629],
zoom: 3
});
state.opts = {
subdistrict: 1, //返回下一级行政区
showbiz: false //最后一级返回街道信息
};
state.district = new AMap.DistrictSearch(state.opts);//注意:需要使用插件同步下发功能才能这样直接使用
state.district.search('中国', (status, result) => {
if (status == 'complete') {
getData(result.districtList[0], '', 100000);
}
});
setTimeout(() => {
state.map = new AMap.Map('container', {
resizeEnable: true,
center: [116.30946, 39.937629],
zoom: 3
});
state.opts = {
subdistrict: 1, //返回下一级行政区
showbiz: false //最后一级返回街道信息
};
state.district = new AMap.DistrictSearch(state.opts);//注意:需要使用插件同步下发功能才能这样直接使用
state.district.search('中国', (status, result) => {
if (status == 'complete') {
getData(result.districtList[0], '', 100000);
}
});
}, 2000)
});

View File

@ -128,9 +128,9 @@ const state = reactive({
isShowTips: false,//是否显示下载提示
});
onMounted(async () => {
onMounted(() => {
// 数据接口
await achievement().then(res => {
achievement().then(res => {
if (200 == res.code) {
treeData = res.data;
snapTree.value = res.data;
@ -156,21 +156,23 @@ onMounted(async () => {
state.echartsMap = echarts.init(dom);
state.echartsMap.on('click', echartsMapClick);
state.map = new AMap.Map('container', {
resizeEnable: true,
center: [116.30946, 39.937629],
zoom: 3
});
state.opts = {
subdistrict: 1, //返回下一级行政区
showbiz: false //最后一级返回街道信息
};
state.district = new AMap.DistrictSearch(state.opts);//注意:需要使用插件同步下发功能才能这样直接使用
state.district.search('中国', (status, result) => {
if (status == 'complete') {
getData(result.districtList[0], '', 100000);
}
});
setTimeout(() => {
state.map = new AMap.Map('container', {
resizeEnable: true,
center: [116.30946, 39.937629],
zoom: 3
});
state.opts = {
subdistrict: 1, //返回下一级行政区
showbiz: false //最后一级返回街道信息
};
state.district = new AMap.DistrictSearch(state.opts);//注意:需要使用插件同步下发功能才能这样直接使用
state.district.search('中国', (status, result) => {
if (status == 'complete') {
getData(result.districtList[0], '', 100000);
}
});
}, 3000)
});

View File

@ -128,9 +128,9 @@ const state = reactive({
isShowTips: false,//是否显示下载提示
});
onMounted(async () => {
onMounted(() => {
// 数据接口
await demand().then(res => {
demand().then(res => {
if (200 == res.code) {
treeData = res.data;
snapTree.value = res.data;
@ -156,21 +156,23 @@ onMounted(async () => {
state.echartsMap = echarts.init(dom);
state.echartsMap.on('click', echartsMapClick);
state.map = new AMap.Map('container', {
resizeEnable: true,
center: [116.30946, 39.937629],
zoom: 3
});
state.opts = {
subdistrict: 1, //返回下一级行政区
showbiz: false //最后一级返回街道信息
};
state.district = new AMap.DistrictSearch(state.opts);//注意:需要使用插件同步下发功能才能这样直接使用
state.district.search('中国', (status, result) => {
if (status == 'complete') {
getData(result.districtList[0], '', 100000);
}
});
setTimeout(() => {
state.map = new AMap.Map('container', {
resizeEnable: true,
center: [116.30946, 39.937629],
zoom: 3
});
state.opts = {
subdistrict: 1, //返回下一级行政区
showbiz: false //最后一级返回街道信息
};
state.district = new AMap.DistrictSearch(state.opts);//注意:需要使用插件同步下发功能才能这样直接使用
state.district.search('中国', (status, result) => {
if (status == 'complete') {
getData(result.districtList[0], '', 100000);
}
});
}, 4000)
});

View File

@ -128,9 +128,9 @@ const state = reactive({
isShowTips: false,//是否显示下载提示
});
onMounted(async () => {
onMounted(() => {
// 数据接口
await company().then(res => {
company().then(res => {
if (200 == res.code) {
treeData = res.data;
snapTree.value = res.data;
@ -156,21 +156,23 @@ onMounted(async () => {
state.echartsMap = echarts.init(dom);
state.echartsMap.on('click', echartsMapClick);
state.map = new AMap.Map('container', {
resizeEnable: true,
center: [116.30946, 39.937629],
zoom: 3
});
state.opts = {
subdistrict: 1, //返回下一级行政区
showbiz: false //最后一级返回街道信息
};
state.district = new AMap.DistrictSearch(state.opts);//注意:需要使用插件同步下发功能才能这样直接使用
state.district.search('中国', (status, result) => {
if (status == 'complete') {
getData(result.districtList[0], '', 100000);
}
});
setTimeout(() => {
state.map = new AMap.Map('container', {
resizeEnable: true,
center: [116.30946, 39.937629],
zoom: 3
});
state.opts = {
subdistrict: 1, //返回下一级行政区
showbiz: false //最后一级返回街道信息
};
state.district = new AMap.DistrictSearch(state.opts);//注意:需要使用插件同步下发功能才能这样直接使用
state.district.search('中国', (status, result) => {
if (status == 'complete') {
getData(result.districtList[0], '', 100000);
}
});
}, 5000)
});

View File

@ -1,5 +1,5 @@
<template>
<div class="fullPage" ref="fullPage">
<div v-loading="loading" class="fullPage" ref="fullPage">
<div
class="fullPageContainer"
ref="fullPageContainer"
@ -45,7 +45,7 @@
</template>
<script setup lang="ts">
import { reactive, onMounted, getCurrentInstance } from "vue";
import { reactive, onMounted, getCurrentInstance, ref } from "vue";
const { proxy } = getCurrentInstance();
import index1 from './comp/index1.vue';
import index2 from './comp/index2.vue';
@ -56,7 +56,14 @@ import index6 from './comp/index6.vue';
import index7 from './comp/index7.vue';
import index8 from './comp/index8.vue';
const loading = ref(true);
setTimeout(() => {
loading.value = false;
}, 1000)
onMounted(() => {
})
function next() { // 往下切换
let len = 8; // 页面的个数
if (state.fullpage.current + 1 <= len) { // 如果当前页面编号+1 小于总个数,则可以执行向下滑动
@ -129,26 +136,26 @@ let state = reactive({
zIndex: 1,
title: "index3",
},
{
comp: index4,
zIndex: 1,
title: "index4",
},
{
comp: index5,
zIndex: 1,
title: "index5",
},
{
comp: index6,
zIndex: 1,
title: "index6",
},
{
comp: index7,
zIndex: 1,
title: "index7",
},
// {
// comp: index4,
// zIndex: 1,
// title: "index4",
// },
// {
// comp: index5,
// zIndex: 1,
// title: "index5",
// },
// {
// comp: index6,
// zIndex: 1,
// title: "index6",
// },
// {
// comp: index7,
// zIndex: 1,
// title: "index7",
// },
{
comp: index8,
zIndex: 1,
@ -182,5 +189,4 @@ let state = reactive({
background-position: center center;
background-repeat: no-repeat;
}
</style>

View File

@ -146,7 +146,6 @@ function getData () {
._r {
flex: 1;
background-color: #fff;
padding: 15px;
}
}
}

View File

@ -0,0 +1,162 @@
<template>
<div class="box">
<div class="wrap">
<div class="img">
<!-- <img :src="data.image" alt /> -->
<img src="https://t7.baidu.com/it/u=1951548898,3927145&fm=193&f=GIF" />
</div>
<div class="content">
<div class="tit">
<span style="cursor: pointer;" @click="handleDetail(data.id)">姓名{{ data.name }}</span>
<div>
<span style="vertical-align: middle;">匹配度</span>
<el-rate style="display: inline-block" v-model="state.val" disabled></el-rate>
</div>
</div>
<!-- <div class="labelList">
<div v-for="item in data.industrys">{{ item }}</div>
</div>-->
<div v-if="data.industrys" class="line">
所属领域
<span>{{ data.industrys[data.industrys.length - 1] }}</span>
</div>
<div class="line">
所在机构
<span>{{ data.research_name }}</span>
</div>
<div
v-if="data.patent_title"
class="line"
v-for="(patent_title,index) in data.patent_title"
:key="index"
>{{ patent_title }}</div>
</div>
<div class="keywordsWrap">
<div class="keywords">
<wordcloud v-if="data.keywords" :data="createdData(data.keywords)"></wordcloud>
</div>
</div>
</div>
<slot></slot>
</div>
</template>
<script setup>
import wordcloud from './wordcloud.vue'
const router = useRouter();
import collectAndVisit from './collectAndVisit.vue'
const props = defineProps({
data: {
type: Object,
required: true,
},
});
function handleDetail (id) {
let routeData = router.resolve({ path: `/searchList/4/detail/${id}` });
window.open(routeData.href, '_blank');
}
const state = reactive({
val: 3,
});
function createdData (arr) {
let l = [];
let snap = JSON.parse(JSON.stringify(arr))
snap.map(e => {
l.push({ name: e, value: 30 })
return { name: e, value: 30 }
})
return l;
}
</script>
<style lang="scss" scoped>
.box {
width: 100%;
background: #ffffff;
padding: 20px;
box-sizing: border-box;
.wrap {
display: flex;
flex-direction: row;
.img {
width: 90px;
margin-right: 12px;
margin-right: 10px;
display: flex;
align-items: center;
justify-content: center;
img {
width: 90px;
height: 90px;
border-radius: 50%;
}
}
.keywordsWrap {
display: flex;
align-items: center;
justify-content: center;
}
.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;
display: flex;
& > span {
flex: 1;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: bold;
color: #333333;
overflow: hidden;
}
& > div {
width: 175px;
vertical-align: middle;
}
}
}
}
}
</style>

View File

@ -0,0 +1,76 @@
<template>
<div v-loading="loading">
<section v-for="item in state.list">
<slot :item="item"></slot>
</section>
<div class="loadMore" v-if="isShowLoadMore" @click="getDataList()">加载更多</div>
</div>
</template>
<script setup>
import { onMounted } from 'vue';
const loading = ref(true);
const isShowLoadMore = computed({
get() {
return state.total > state.list.length;
},
});
const props = defineProps({
getData: {
type: Function,
required: true,
},
params: {
type: Object,
required: true,
default: {}
},
pageNum: {
type: Number,
default: 1,
},
pageSize: {
type: Number,
default: 5,
},
});
const state = reactive({
list: [],
pageNum: props.pageNum,
pageSize: props.pageSize,
total: 0,
});
async function getDataList () {
loading.value = true;
let snap = {
page_num: state.pageNum,
page_size: state.pageSize,
};
let _data = Object.assign({}, snap, props.params);
console.log('_data',_data)
let { code, data, msg } = await props.getData(_data);
if (200 == code) {
state.list.push.apply(state.list,data.data);
state.total = data.count;
state.pageNum++;
}
loading.value = false;
}
onMounted(() => {
getDataList()
});
</script>
<style scoped>
.loadMore {
width: 100%;
height: 30px;
line-height: 30px;
text-align: center;
background-color: #fff;
cursor: pointer;
user-select: none;
}
</style>

View File

@ -15,7 +15,7 @@
</el-input>
</div>
</div>
<div class="conter1000">
<div class="conter1000">
<slot ></slot>
</div>
</div>

View File

@ -54,7 +54,7 @@
/>
</div>
</div>
<div class="r">1</div>
<div class="r"><webContact /></div>
</el-row>
</template>
</searchContainer>
@ -62,6 +62,7 @@
</template>
<script setup>
import webContact from "@/components/webContact/index.vue";
import request from '@/utils/request'
const router = useRouter();
import { onMounted } from 'vue';

View File

@ -138,7 +138,7 @@
</div>
</div>
</div>
<div class="r">1</div>
<div class="r"><webContact /></div>
</el-row>
</template>
</searchContainer>
@ -146,6 +146,7 @@
</template>
<script setup>
import webContact from "@/components/webContact/index.vue";
import request from '@/utils/request'
const router = useRouter();
const route = useRoute();
@ -274,7 +275,6 @@ function getDataList () {
width: 325px;
margin-left: 14px;
min-height: 200px;
background-color: #fff;
}
.product {

View File

@ -0,0 +1,241 @@
<template>
<div class="index">
<searchContainer bannerKey="首页>找成果" title="成果库" @handleQuery="handleQuery">
<template v-slot>
<el-row type="flex" style="padding: 20px 0;">
<div style="flex: 1">
<div style="position: relative;">
<industrySelect @industryChange="industryChange"></industrySelect>
<div class="total">
共找到
<span>{{ state.total }}</span> 个成果
</div>
<div v-loading="loading">
<div class="item" v-for="item in state.list" :key="item.id">
<el-row type="flex" style="padding: 40px 20px;">
<div class="img">
<!-- <img :src="item.image" alt /> -->
<img src="https://t7.baidu.com/it/u=1951548898,3927145&fm=193&f=GIF" alt />
</div>
<div class="content">
<div class="tit" @click="handleDetail(item.id)">
<div style="float: right;">
<span>匹配度</span>
<el-rate style="display: inline-block" v-model="state.val" disabled></el-rate>
</div>
<div class="text" style="flex: 1">{{ item.name }}</div>
</div>
<div class="line">
企业规模 <span>{{item.kind_title}}</span>
</div>
<div class="line">
核心产品及应用场景 <span>{{item.product}}</span>
</div>
<div class="line">
企业网站 <a :href="item.url"><span>{{item.url}}</span></a>
</div>
</div>
<div class="keywords" style="flex: 1">
<wordcloud :data="createdData(item.keywords)"></wordcloud>
</div>
</el-row>
</div>
</div>
<pagination
class="pagination"
:total="state.total"
:pageSizes="state.pageSizes"
v-model:page="state.pageNum"
v-model:limit="state.pageSize"
:autoScroll="false"
@pagination="getDataList"
/>
</div>
</div>
<div class="r"><webContact /></div>
</el-row>
</template>
</searchContainer>
</div>
</template>
<script setup>
import webContact from "@/components/webContact/index.vue";
import request from '@/utils/request'
const router = useRouter();
import { onMounted } from 'vue';
import searchContainer from './components/searchContainer.vue'
import industrySelect from './components/industrySelect.vue'
import wordcloud from './components/wordcloud.vue'
function handleDetail (id) {
let routeData = router.resolve({ path: `/searchList/0/detail/${id}`, query: {keyword: state.keyword}});
window.open(routeData.href, '_blank');
}
const loading = ref(true);
const state = reactive({
pageNum: 1,
total: 1,
pageSize: 10,
pageSizes: [10, 10 << 1, 10 << 2, 10 << 3],
keyword: '',
industryList: [],
id1: '',
id2: '',
id3: '',
val: 3,
arr: [{
"name": "Cat",
"value": 26
},
{
"name": "fish",
"value": 19
}]
});
function createdData(arr) {
let l = [];
let snap = JSON.parse(JSON.stringify(arr))
snap.map(e=>{
l.push({name: e,value: 30})
return {name: e,value: 30}
})
return l;
}
function search () {
let industry = '';
if (state.id1) {
industry += state.id1;
}
if (state.id2) {
industry += `-${state.id2}`;
}
if (state.id3) {
industry += `-${state.id3}`;
}
return request({
url: '/v1/search',
method: 'post',
data: { industry, mode: 2, page_num: state.pageNum, page_size: state.pageSize, keyword: state.keyword }
})
}
function handleQuery (keyword) {
state.keyword = keyword;
getDataList()
}
function industryChange (industry) {
if (industry.id1) {
state.id1 = industry.id1;
}
if (industry.id2) {
state.id2 = industry.id2;
}
if (industry.id3) {
state.id3 = industry.id3;
}
getDataList()
}
function getDataList () {
loading.value = true;
search().then(res => {
if (200 == res.code) {
// 总条数
state.total = res.data.count;
state.list = res.data.data;
loading.value = false;
}
}).catch(() => {
loading.value = false;
})
}
</script>
<style lang="scss" scoped>
.total {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333333;
margin-bottom: 20px;
span {
font-size: 30px;
color: #0054ff;
}
}
.r {
display: inline-block;
width: 325px;
margin-left: 14px;
min-height: 200px;
background-color: #fff;
}
.item {
height: 200px;
overflow: hidden;
background-color: #fff;
margin-bottom: 16px;
.img {
width: 90px;
margin-right: 12px;
display: flex;
align-items:center;
justify-content:center;
img {
width: 90px;
height: 90px;
border-radius: 50%;
}
}
.content {
display: inline-block;
width: 390px;
.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;
}
}
}
.keywords {
flex: 1;
width: 129px;
height: 129px;
}
.tit {
width: 100%;
overflow: hidden;
cursor: pointer;
.text {
margin-right: 200px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 20px;
font-family: Source Han Sans CN;
font-weight: bold;
color: #333333;
}
}
}
</style>

View File

@ -0,0 +1,157 @@
<template>
<div class="index">
<searchContainer bannerKey="首页>找专家" title="专家库" @handleQuery="handleQuery">
<template v-slot>
<el-row type="flex" style="padding: 20px 0;">
<div style="flex: 1">
<div style="position: relative;">
<industrySelect @industryChange="industryChange"></industrySelect>
<div class="total">
共找到
<span>{{ state.total }}</span> 位专家
</div>
<div v-loading="loading">
<section v-for="item in state.list" :key="item.id">
<expertItem style="width: 661px;" :data="item"></expertItem>
</section>
</div>
<pagination
class="pagination"
:total="state.total"
:pageSizes="state.pageSizes"
v-model:page="state.pageNum"
v-model:limit="state.pageSize"
:autoScroll="false"
@pagination="getDataList"
/>
</div>
</div>
<div class="r"><webContact /></div>
</el-row>
</template>
</searchContainer>
</div>
</template>
<script setup>
import webContact from "@/components/webContact/index.vue";
import request from '@/utils/request'
const router = useRouter();
import { onMounted } from 'vue';
import searchContainer from './components/searchContainer.vue'
import industrySelect from './components/industrySelect.vue'
import expertItem from './components/expertItem.vue'
import wordcloud from './components/wordcloud.vue'
function handleDetail (id) {
let routeData = router.resolve({ path: `/searchList/0/detail/${id}`, query: {keyword: state.keyword}});
window.open(routeData.href, '_blank');
}
const loading = ref(true);
const state = reactive({
pageNum: 1,
total: 1,
pageSize: 10,
pageSizes: [10, 10 << 1, 10 << 2, 10 << 3],
keyword: '',
industryList: [],
id1: '',
id2: '',
id3: '',
val: 3,
arr: [{
"name": "Cat",
"value": 26
},
{
"name": "fish",
"value": 19
}]
});
function createdData(arr) {
let l = [];
let snap = JSON.parse(JSON.stringify(arr))
snap.map(e=>{
l.push({name: e,value: 30})
return {name: e,value: 30}
})
return l;
}
function search () {
let industry = '';
if (state.id1) {
industry += state.id1;
}
if (state.id2) {
industry += `-${state.id2}`;
}
if (state.id3) {
industry += `-${state.id3}`;
}
return request({
url: '/v1/search',
method: 'post',
data: { industry, mode: 5, page_num: state.pageNum, page_size: state.pageSize, keyword: state.keyword }
})
}
function handleQuery (keyword) {
state.keyword = keyword;
getDataList()
}
function industryChange (industry) {
if (industry.id1) {
state.id1 = industry.id1;
}
if (industry.id2) {
state.id2 = industry.id2;
}
if (industry.id3) {
state.id3 = industry.id3;
}
getDataList()
}
function getDataList () {
loading.value = true;
search().then(res => {
if (200 == res.code) {
// 总条数
state.total = res.data.count;
state.list = res.data.data;
loading.value = false;
}
}).catch(() => {
loading.value = false;
})
}
</script>
<style lang="scss" scoped>
.total {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333333;
margin-bottom: 20px;
span {
font-size: 30px;
color: #0054ff;
}
}
.r {
display: inline-block;
width: 325px;
margin-left: 14px;
min-height: 200px;
background-color: #fff;
}
</style>

View File

@ -0,0 +1,594 @@
<template>
<div v-loading="loading">
<searchContainer bannerKey="首页>找专家" title="专家库" @handleQuery="handleQuery">
<template v-slot>
<div class="head">
<el-breadcrumb separator="/">
<el-breadcrumb-item>
<span class="one">找专家</span>
</el-breadcrumb-item>
<el-breadcrumb-item>
<span>专家详情</span>
</el-breadcrumb-item>
</el-breadcrumb>
</div>
<el-row type="flex" style="padding-bottom: 20px;">
<div style="flex: 1">
<expertItem :data="state.expertDetail"></expertItem>
<div class="btns">
<div class="order">预约对接</div>
<div class="share">一键分享</div>
</div>
<div class="detail">
<div style="padding: 20px 0;">
<div class="pointTit">个人简介</div>
</div>
<div class="html" v-html="state.expertDetail.introduce"></div>
<div style="padding: 20px 0;">
<div class="pointTit">研究方向</div>
</div>
<section v-if="state.expertDetail.researchs">
<div
v-for="item in state.expertDetail.researchs"
class="describe"
>{{ item }}</div>
</section>
<div style="padding: 20px 0;">
<div class="pointTit">专家视频</div>
</div>
</div>
<div v-if="state.expertDetail.id" style="padding: 20px 0;">
<el-tabs v-model="state.activeName">
<el-tab-pane label="代表成果及合作模式" name="first">
<loadMore
:getData="achievement"
:params="{ expert_id: state.expertDetail.id }"
>
<template #default="scope">
<div class="achievementItem">
<div class="tit">【代表成果】{{ scope.item.title }}</div>
<div class="line">
技术领域:
<span>{{ scope.item.industrys[scope.item.industrys.length - 1] }}</span>
</div>
<div class="line">
完成单位:
<span>{{ scope.item.cooperation_mode_title }}</span>
</div>
<div class="line">
合作模式:
<span>{{ scope.item.cooperation_mode_title }}</span>
</div>
</div>
</template>
</loadMore>
</el-tab-pane>
<el-tab-pane label="科研项目" name="second">
<loadMore
:getData="project"
:params="{ expert_id: state.expertDetail.id }"
>
<template #default="scope">
<div class="loadMoreItem">
<div class="tit">【科研项目】{{ scope.item.title }}</div>
<div class="line">
<el-row>
<el-col
:span="12"
>发布日期:{{ parseTime(scope.item.created_at) }}</el-col>
</el-row>
</div>
<div class="line">
<el-row>
<el-col
:span="12"
>开始日期:{{ parseTime(scope.item.begin_at) }}</el-col>
<el-col
:span="12"
>结束日期:{{ parseTime(scope.item.finish_at) }}</el-col>
</el-row>
</div>
<div class="line">
<el-row>
<el-col
:span="12"
>科研负责人:{{ scope.item.director }}</el-col>
<el-col
:span="12"
>项目类型:{{ scope.item.kind }}</el-col>
</el-row>
</div>
<div class="line">
<el-row>
<el-col
:span="12"
>资助经费:{{ scope.item.amount }}元</el-col>
<el-col
:span="12"
>资助来源:{{ scope.item.source }}</el-col>
</el-row>
</div>
</div>
</template>
</loadMore>
</el-tab-pane>
<el-tab-pane label="代表专利" name="third">
<loadMore
:getData="patent"
:params="{ expert_id: state.expertDetail.id }"
>
<template #default="scope">
<div class="patentItem">
<div class="tit">【发明专利】{{ scope.item.title }}</div>
<div class="line">
申请日期:
<span>{{ scope.item.apply_at }}</span>
</div>
<div class="line">
<p>摘要:</p>
<span>{{ scope.item.description }}</span>
</div>
</div>
</template>
</loadMore>
</el-tab-pane>
<el-tab-pane label="代表论文" name="fourth">
<loadMore
:getData="paper"
:params="{ expert_id: state.expertDetail.id }"
>
<template #default="scope">
<div class="loadMoreItem">
<div class="tit">【期刊论文】{{ scope.item.title }}</div>
<div class="line">
<el-row>
<el-col
:span="12"
>出版日期: {{ parseTime(scope.item.publish_at) }}</el-col>
<el-col :span="12">刊物: {{ scope.item.ext }}</el-col>
</el-row>
</div>
<div class="line">
关键词:
<span
v-for="keyword in scope.item.keywords"
style="margin-right: 10px;"
>{{ keyword }}</span>
</div>
<div class="line">
<p>摘要:</p>
<span>{{ scope.item.remark }}</span>
</div>
</div>
</template>
</loadMore>
</el-tab-pane>
<el-tab-pane label="已合作企业" name="five">
<loadMore
:getData="cooperate"
:params="{ expert_id: state.expertDetail.id }"
>
<template #default="scope">
<div class="loadMoreItem">
<el-row v-loading="scope.item['loading']">
<el-col :span="12">
<div
class="tit"
style="line-height: 35px;margin: 0"
>{{ scope.item.name }}</div>
</el-col>
<el-col
v-if="scope.item['patent']"
@click="() => { delete scope.item['patent']; }"
style="cursor: pointer;"
:offset="6"
:span="6"
>所发表专利 {{ scope.item['patent'].length }} 篇</el-col>
<el-col
v-else-if="scope.item['paper']"
@click="() => { delete scope.item['paper']; }"
style="cursor: pointer;"
:offset="6"
:span="6"
>所发表论文 {{ scope.item['paper'].length }} 篇</el-col>
<el-col v-else :span="12">
<el-row>
<el-col :span="12">
<div
class="line"
@click="cooperateDetail(scope.item, 'patent')"
style="cursor: pointer;"
>专利:{{ scope.item.patent_count }}</div>
</el-col>
<el-col :span="12">
<div
class="line"
@click="cooperateDetail(scope.item, 'paper')"
style="cursor: pointer;"
>论文:{{ scope.item.paper_count }}</div>
</el-col>
</el-row>
</el-col>
</el-row>
</div>
<div
class="patentItem"
v-for="item in scope.item['patent']"
>
<div class="tit">【发明专利】{{ item.title }}</div>
<div class="line">
申请日期:
<span>{{ item.apply_at }}</span>
</div>
<div class="line">
<p>摘要:</p>
<span>{{ item.description }}</span>
</div>
</div>
<div
class="loadMoreItem"
v-for="item in scope.item['paper']"
>
<div class="tit">【期刊论文】{{ item.title }}</div>
<div class="line">
<el-row>
<el-col
:span="12"
>出版日期: {{ parseTime(item.publish_at) }}</el-col>
<el-col :span="12">刊物: {{ item.ext }}</el-col>
</el-row>
</div>
<div class="line">
关键词:
<span
v-for="keyword in item.keywords"
style="margin-right: 10px;"
>{{ keyword }}</span>
</div>
<div class="line">
<p>摘要:</p>
<span>{{ item.remark }}</span>
</div>
</div>
</template>
</loadMore>
</el-tab-pane>
</el-tabs>
</div>
<div style="padding: 20px 0;">
<div class="pointTit">专家推荐</div>
</div>
<div>
<section v-for="item in state.list" :key="item.id">
<expertItem :data="item"></expertItem>
</section>
</div>
</div>
<div class="r">
<webContact />
</div>
</el-row>
</template>
</searchContainer>
</div>
</template>
<script setup>
import webContact from "@/components/webContact/index.vue";
import expertItem from './components/expertItem.vue'
import loadMore from './components/loadMore.vue'
import request from '@/utils/request'
const router = useRouter();
const route = useRoute();
import { onMounted } from 'vue';
import searchContainer from './components/searchContainer.vue'
import wordcloud from './components/wordcloud.vue'
import productItem from './components/productItem.vue'
const loading = ref(true);
const state = reactive({
pageNum: 1,
pageSize: 4,
keyword: '',
val: 3,
expertDetail: {},
arr: [{
"name": "Cat",
"value": 26
},
{
"name": "fish",
"value": 19
}],
activeName: 'first'
});
// 建议 列表前4条
function recommend () {
return request({
url: '/v1/search',
method: 'post',
data: { mode: 5, page_num: state.pageNum, page_size: state.pageSize, keyword: state.keyword }
})
}
// 专家详情
function expert (id) {
return request({
url: '/v1/manage/expert',
method: 'post',
data: { expert_id: id }
})
}
// 合作成果
function achievement (data) {
return request({
url: '/v1/manage/expert/achievement',
method: 'post',
data,
})
}
// 科研项目
function project (data) {
return request({
url: '/v1/manage/expert/project',
method: 'post',
data,
})
}
// 代表专利
function patent (data) {
return request({
url: '/v1/manage/expert/patent',
method: 'post',
data,
})
}
// 代表论文
function paper (data) {
return request({
url: '/v1/manage/expert/paper',
method: 'post',
data,
})
}
// 合作企业
function cooperate (data) {
return request({
url: '/v1/manage/expert/cooperate',
method: 'post',
data,
})
}
async function cooperateDetail (item, type) {
item['loading'] = true;
let { code, msg, data } = await request({
url: '/v1/manage/expert/cooperate/detail',
method: 'post',
data: { id: item.id },
});
if (200 == code) {
item[type] = data[type];
}
item['loading'] = false;
}
function createdData (arr) {
let l = [];
let snap = JSON.parse(JSON.stringify(arr))
snap.map(e => {
l.push({ name: e, value: 30 })
return { name: e, value: 30 }
})
return l;
}
function handleDetail (id) {
let routeData = router.resolve({ path: `/searchList/0/detail/${id}`, query: { keyword: state.keyword } });
window.open(routeData.href, '_blank');
}
function handleList (mode, keyword) {
router.push({ path: `/searchList/${mode}`, query: { keyword } });
}
// 首次加载数据,其后跳转页面
let flag = true;
function handleQuery (keyword) {
state.keyword = keyword;
if (flag) {
getDataList();
flag = false;
} else {
handleList(0, keyword);
}
}
function getDataList () {
loading.value = true;
recommend().then(res => {
if (200 == res.code) {
// 总条数
state.total = res.data.count;
state.list = res.data.data;
}
})
let id = route.params.id;
if (!id) return
expert(id).then(res => {
if (200 == res.code) {
state.expertDetail = res.data;
loading.value = false;
}
}).catch(() => {
loading.value = false;
});
// companyProduct(id).then(res => {
// if (200 == res.code) {
// state.companyProduct = res.data.data;
// }
// })
}
</script>
<style lang="scss" scoped>
:deep(.el-tabs) {
.el-tabs__item {
color: #666666;
font-size: 14px;
}
.el-tabs__item:hover {
opacity: 0.8;
}
.el-tabs__item.is-active {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: bold;
color: #333333;
}
.el-tabs__active-bar {
background-color: #333333;
height: 4px;
}
.el-tabs__nav-wrap::after {
background-color: transparent;
}
}
.head {
padding: 15px 0px;
span {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #666666;
}
.one {
color: #333333;
}
}
.r {
display: inline-block;
width: 325px;
margin-left: 14px;
min-height: 200px;
}
.detail {
width: 661px;
box-sizing: border-box;
padding: 20px;
background: #fff;
.describe {
font-size: 14px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #666666;
margin-bottom: 5px;
}
}
.pointTit {
position: relative;
padding-left: 10px;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: 500;
color: #333333;
&:before {
content: "";
top: 8px;
left: 0px;
position: absolute;
display: block;
width: 5px;
height: 5px;
background: #0054ff;
}
}
.btns {
overflow: hidden;
padding: 0 20px 20px 20px;
width: 100%;
background-color: #fff;
margin-top: -20px;
div {
text-align: center;
float: right;
cursor: pointer;
user-select: none;
width: 101px;
height: 36px;
font-size: 14px;
font-family: Source Han Sans CN;
font-weight: 400;
line-height: 36px;
box-sizing: border-box;
&:hover {
opacity: 0.7;
}
}
.share {
color: #333333;
background: #f2f6ff;
border: 1px solid #dcdcdc;
margin-right: 10px;
}
.order {
background: #0054ff;
color: #ffffff;
border: none;
}
}
.achievementItem,
.loadMoreItem {
padding: 20px;
background-color: #fff;
margin-bottom: 10px;
.tit {
margin-left: -8px;
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: bold;
color: #333333;
}
.line {
margin: 10px 0;
font-size: 14px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #666666;
}
}
.patentItem {
padding: 20px;
background-color: #fff;
margin-bottom: 10px;
.tit {
font-size: 16px;
font-family: Source Han Sans CN;
font-weight: bold;
color: #333333;
}
.line {
padding-left: 8px;
margin: 10px 0;
font-size: 14px;
font-family: Source Han Sans CN;
font-weight: 400;
color: #666666;
}
}
</style>