forked from TALL/check-work
15 changed files with 854 additions and 79 deletions
@ -0,0 +1,107 @@ |
|||
<template> |
|||
<div> |
|||
<div class="inner d-flex justify-space-between flex-wrap"> |
|||
<div v-for="(item, index) in list" :key="index" class="item-box"> |
|||
<p class="font-24 my-3" style="cursor: pointer" @click="detail(item.id)">{{ item.name }}</p> |
|||
<p class="font-16" style="color: rgba(0, 0, 0, 0.45); cursor: pointer" @click="detail(item.id)">编号：{{ item.identifier }}</p> |
|||
<p class="font-16 baseColor item-more"> |
|||
<a-button type="primary" style="cursor: pointer">转化意向填报</a-button> |
|||
</p> |
|||
</div> |
|||
</div> |
|||
<div class="inner"> |
|||
<a-pagination |
|||
:current="achCurrent" |
|||
:total="total" |
|||
:page-size="pageSize" |
|||
@change="onShowSizeChange" |
|||
class="pagination" |
|||
show-less-items |
|||
show-quick-jumper |
|||
/> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapMutations, mapState } from 'vuex'; |
|||
import { selRes } from 'config/api'; |
|||
export default { |
|||
name: 'PlatformList', |
|||
data() { |
|||
return { |
|||
list: [], |
|||
pageSize: 12, |
|||
total: 0, |
|||
}; |
|||
}, |
|||
computed: mapState('home', ['achList', 'achIpt', 'achCurrent']), |
|||
watch: { |
|||
achList(val) { |
|||
this.getData(); |
|||
}, |
|||
achIpt(val) { |
|||
if (val.isBtn === 1) { |
|||
this.getData(); |
|||
} |
|||
}, |
|||
}, |
|||
created() { |
|||
this.getData(); |
|||
}, |
|||
methods: { |
|||
...mapMutations('home', ['setAchCurrent', 'setAchId']), |
|||
// 改变单当前页数 |
|||
onShowSizeChange(current, size) { |
|||
this.setAchCurrent(current); |
|||
this.getData(); |
|||
}, |
|||
// 获取成果列表 |
|||
async getData() { |
|||
try { |
|||
const params = { |
|||
param: { |
|||
content: this.achIpt.content, |
|||
modelIds: this.achList, |
|||
pageNum: this.achCurrent, |
|||
pageSize: 12, |
|||
}, |
|||
}; |
|||
const res = await selRes(params); |
|||
const { code, msg, data } = res.data; |
|||
if (code === 200) { |
|||
this.list = data.list; |
|||
this.total = parseInt(data.total); |
|||
} |
|||
} catch (error) { |
|||
console.log(error); |
|||
} |
|||
}, |
|||
// 点击查看详情 |
|||
detail(id) { |
|||
this.setAchId(id); |
|||
this.$router.push('/NewPlatform/AchDet'); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="stylus" scoped> |
|||
.pagination { |
|||
margin: 40px 0; |
|||
text-align: right; |
|||
} |
|||
|
|||
.item-box { |
|||
width: 24%; |
|||
background: #fff; |
|||
margin-bottom: 40px; |
|||
padding: 10px; |
|||
} |
|||
|
|||
.item-more { |
|||
text-align: right; |
|||
margin-bottom: 0 !important; |
|||
margin-top: 40px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,126 @@ |
|||
<template> |
|||
<div> |
|||
<div class="inner d-flex justify-space-between flex-wrap"> |
|||
<div v-for="(item, index) in list" :key="index"> |
|||
<img :src="item.imgUrl" style="height: 220px" /> |
|||
<p class="font-24 my-4">{{ item.title }}</p> |
|||
<p class="font-16 baseColor" style="text-align: right; cursor: pointer">了解更多→</p> |
|||
</div> |
|||
</div> |
|||
<div class="inner"> |
|||
<a-pagination |
|||
:current="current" |
|||
:total="total" |
|||
:page-size="pageSize" |
|||
@change="onShowSizeChange" |
|||
class="pagination" |
|||
show-less-items |
|||
show-quick-jumper |
|||
/> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { selInstrument, searchFront } from 'config/api'; |
|||
export default { |
|||
name: 'PlatformList', |
|||
data() { |
|||
return { |
|||
list: [ |
|||
{ |
|||
imgUrl: 'https://www.sxwikionline.com/gateway/greenvalley/uploads/upload/20210104/86d502b304944e0c849bff8dcf55ac08.jpg', |
|||
title: 'XX实验平台', |
|||
id: 1, |
|||
}, |
|||
{ |
|||
imgUrl: 'https://www.sxwikionline.com/gateway/greenvalley/uploads/upload/20210104/86d502b304944e0c849bff8dcf55ac08.jpg', |
|||
title: 'XX实验平台', |
|||
id: 2, |
|||
}, |
|||
{ |
|||
imgUrl: 'https://www.sxwikionline.com/gateway/greenvalley/uploads/upload/20210104/86d502b304944e0c849bff8dcf55ac08.jpg', |
|||
title: 'XX实验平台', |
|||
id: 3, |
|||
}, |
|||
{ |
|||
imgUrl: 'https://www.sxwikionline.com/gateway/greenvalley/uploads/upload/20210104/86d502b304944e0c849bff8dcf55ac08.jpg', |
|||
title: 'XX实验平台', |
|||
id: 4, |
|||
}, |
|||
{ |
|||
imgUrl: 'https://www.sxwikionline.com/gateway/greenvalley/uploads/upload/20210104/86d502b304944e0c849bff8dcf55ac08.jpg', |
|||
title: 'XX实验平台', |
|||
id: 5, |
|||
}, |
|||
{ |
|||
imgUrl: 'https://www.sxwikionline.com/gateway/greenvalley/uploads/upload/20210104/86d502b304944e0c849bff8dcf55ac08.jpg', |
|||
title: 'XX实验平台', |
|||
id: 6, |
|||
}, |
|||
], |
|||
current: 1, |
|||
pageSize: 6, |
|||
total: 20, |
|||
}; |
|||
}, |
|||
created() { |
|||
this.getSelI(); |
|||
this.getSear(); |
|||
}, |
|||
methods: { |
|||
// 查询仪器列表 |
|||
async getSelI() { |
|||
try { |
|||
const params = { |
|||
param: { |
|||
content: '', // 搜索框内容 |
|||
modelIds: [], // 分类ID数组 |
|||
pageNum: 1, |
|||
pageSize: 6, |
|||
}, |
|||
}; |
|||
const res = await selInstrument(params); |
|||
const { code, msg, data } = res.data; |
|||
if (code === 200) { |
|||
console.log(data); |
|||
} |
|||
} catch (error) { |
|||
console.log(error); |
|||
} |
|||
}, |
|||
// 查询实验室（研究院）列表 |
|||
async getSear() { |
|||
try { |
|||
const params = { |
|||
param: { |
|||
name: '', // 搜索框内容 |
|||
moldIds: [], // 分类ID数组 |
|||
pageNum: 1, |
|||
pageSize: 6, |
|||
}, |
|||
}; |
|||
const res = await searchFront(params); |
|||
const { code, msg, data } = res.data; |
|||
if (code === 200) { |
|||
console.log(data); |
|||
} |
|||
} catch (error) { |
|||
console.log(error); |
|||
} |
|||
}, |
|||
// 改变单当前页数 |
|||
onShowSizeChange(current, size) { |
|||
console.log(current); |
|||
this.current = current; |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="stylus" scoped> |
|||
.pagination { |
|||
margin: 40px 0; |
|||
text-align: right; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,138 @@ |
|||
<template> |
|||
<div class="inner equ-box"> |
|||
<div class="equ-info d-flex"> |
|||
<img :src="obj.img" alt="" /> |
|||
<div class="equ-info-box"> |
|||
<p class="equ-name">{{ obj.name }}</p> |
|||
<div class="d-flex flex-wrap"> |
|||
<div style="width: 200px" class="equ-info-left"> |
|||
<p>成果名字：</p> |
|||
<p>学科分类：</p> |
|||
<p>联系人：</p> |
|||
<p>联系方式：</p> |
|||
<p>转让形式：</p> |
|||
<p>成果表现形式：</p> |
|||
<p>成果阶段：</p> |
|||
</div> |
|||
<div style="width: 500px"> |
|||
<p>{{ obj.name }}</p> |
|||
<p>{{ obj.classification }}</p> |
|||
<p> |
|||
<span v-for="(item, index) in obj.selPeoList" :key="index">{{ item.contactsName }}</span> |
|||
</p> |
|||
<p> |
|||
<span v-for="(item, index) in obj.selPeoList" :key="index">{{ item.contactsPhone }}</span> |
|||
</p> |
|||
<p>{{ obj.layout }}</p> |
|||
<p>{{ obj.performance }}</p> |
|||
<p>{{ obj.stage }}</p> |
|||
</div> |
|||
</div> |
|||
<p class="equ-btn"> |
|||
<a-button style="margin-right: 20px">转化意向</a-button> |
|||
<a-button type="primary">加入购物车</a-button> |
|||
</p> |
|||
</div> |
|||
</div> |
|||
<div class="content-box"> |
|||
<div v-dompurify-html="obj.content"></div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapState } from 'vuex'; |
|||
import { selResMes } from 'config/api'; |
|||
export default { |
|||
name: 'AchDet', |
|||
data() { |
|||
return { obj: {} }; |
|||
}, |
|||
computed: mapState('home', ['achId']), |
|||
created() { |
|||
this.getData(); |
|||
}, |
|||
methods: { |
|||
async getData() { |
|||
try { |
|||
const params = { param: { id: this.achId } }; |
|||
const res = await selResMes(params); |
|||
const { code, data, msg } = res.data; |
|||
if (code === 200) { |
|||
console.log(data); |
|||
this.obj = data; |
|||
} |
|||
} catch (error) { |
|||
console.log(error); |
|||
} |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="stylus" scoped> |
|||
.equ-box { |
|||
background: #fff; |
|||
padding: 20px; |
|||
margin: 60px auto; |
|||
} |
|||
|
|||
.equ-info { |
|||
height: 300px; |
|||
border-bottom: 1px solid rgba(0, 0, 0, 0.14901960784313725); |
|||
position: relative; |
|||
|
|||
img { |
|||
width: 300px; |
|||
height: 300px; |
|||
} |
|||
} |
|||
|
|||
.equ-name { |
|||
font-size: 24px; |
|||
font-family: Microsoft YaHei; |
|||
font-weight: bold; |
|||
line-height: 31px; |
|||
color: rgba(0, 0, 0, 0.85); |
|||
opacity: 1; |
|||
} |
|||
|
|||
.equ-info-box { |
|||
position: relative; |
|||
font-size: 16px; |
|||
margin-left: 20px; |
|||
height: 300px; |
|||
font-family: Microsoft YaHei; |
|||
font-weight: 400; |
|||
color: rgba(0, 0, 0, 0.65); |
|||
opacity: 1; |
|||
|
|||
p { |
|||
margin-bottom: 6px; |
|||
} |
|||
} |
|||
|
|||
.equ-info-left { |
|||
font-size: 16px; |
|||
font-family: Microsoft YaHei; |
|||
font-weight: 400; |
|||
color: rgba(0, 0, 0, 0.45); |
|||
opacity: 1; |
|||
|
|||
p { |
|||
margin-bottom: 6px; |
|||
} |
|||
} |
|||
|
|||
.equ-btn { |
|||
position: absolute; |
|||
bottom: 0; |
|||
} |
|||
|
|||
.content-box { |
|||
min-height: 400px; |
|||
padding: 20px; |
|||
font-size: 16px; |
|||
color: rgba(0, 0, 0, 0.65); |
|||
} |
|||
</style> |
|||
@ -1,20 +1,194 @@ |
|||
<template> |
|||
<div> |
|||
<sen-nav /> |
|||
<div style="width: 100%; height: 50px; background: skyblue; color: #000">搜索条</div> |
|||
<div> |
|||
<div class="search-background"> |
|||
<div class="d-flex"> |
|||
<div class="flex-3 flex-wrap"> |
|||
<span class="ins-title">研究开发实验室：</span> |
|||
<span |
|||
v-for="(item, index) in laboratory" |
|||
:key="index" |
|||
:class="item.isActive ? 'act-color' : ''" |
|||
class="ins-name" |
|||
@click="choose(index, 0)" |
|||
> |
|||
{{ item.name }} |
|||
</span> |
|||
</div> |
|||
<div class="flex-1 align-center"> |
|||
<a-input-search class="item-search" v-model="InsIpt" placeholder="搜索实验室" enter-button="搜索" @search="searchIns" /> |
|||
</div> |
|||
</div> |
|||
<div style="border-top: 1px solid rgba(0, 0, 0, 0.06)" class="flex-3 flex-wrap"> |
|||
<div class="flex-3 flex-wrap"> |
|||
<span class="ins-title">大型科研设施与仪器：</span> |
|||
<span |
|||
v-for="(item, index) in instrument" |
|||
:key="index" |
|||
:class="item.isActive ? 'act-color' : ''" |
|||
class="ins-name" |
|||
@click="choose(index, 1)" |
|||
> |
|||
{{ item.name }} |
|||
</span> |
|||
</div> |
|||
<div class="flex-1 align-center"> |
|||
<a-input-search class="item-search" v-model="LabIpt" placeholder="搜索仪器" enter-button="搜索" @search="searchLab" /> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<platform-list /> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { selModel } from 'config/api'; |
|||
import PlatformList from 'components/PlatformList/PlatformList.vue'; |
|||
import SenNav from './components/SenNav.vue'; |
|||
import { mapMutations } from 'vuex'; |
|||
export default { |
|||
name: 'Share', |
|||
components: { SenNav }, |
|||
components: { SenNav, PlatformList }, |
|||
data() { |
|||
return { |
|||
str: '这是科技资源开放共享服务平台', |
|||
list: [], |
|||
LabIpt: '', // 实验室搜索框内容 |
|||
laboratory: [], // 实验室 |
|||
labList: [], // 实验室类型选择列表 |
|||
InsIpt: '', // 仪器搜索框内容 |
|||
instrument: [], // 仪器 |
|||
insList: [], // 仪器类型选择列表 |
|||
}; |
|||
}, |
|||
watch: { |
|||
LabIpt(val) { |
|||
const obj = { |
|||
content: this.LabIpt, |
|||
isBtn: 0, |
|||
}; |
|||
this.setLabIpt(obj); |
|||
}, |
|||
InsIpt(val) { |
|||
const obj = { |
|||
content: this.InsIpt, |
|||
isBtn: 0, |
|||
}; |
|||
this.setInsIpt(obj); |
|||
}, |
|||
}, |
|||
created() { |
|||
const obj = { |
|||
content: '', |
|||
isBtn: 0, |
|||
}; |
|||
this.setLabList([]); |
|||
this.setInsList([]); |
|||
this.setLabIpt(obj); |
|||
this.setInsIpt(obj); |
|||
this.getType(1); |
|||
this.getType(2); |
|||
}, |
|||
methods: { |
|||
...mapMutations('home', ['setLabList', 'setInsList', 'setLabIpt', 'setInsIpt']), |
|||
async getType(num) { |
|||
try { |
|||
const params = { param: { model: num } }; |
|||
const res = await selModel(params); |
|||
const { code, mst, data } = res.data; |
|||
if (code === 200) { |
|||
if (num === 1) { |
|||
this.instrument = data; |
|||
for (let i = 0; i < this.instrument.length; i++) { |
|||
this.instrument[i].isActive = false; |
|||
} |
|||
} else if (num === 2) { |
|||
this.laboratory = data; |
|||
for (let i = 0; i < this.laboratory.length; i++) { |
|||
this.laboratory[i].isActive = false; |
|||
} |
|||
} |
|||
} |
|||
} catch (error) { |
|||
console.log(error); |
|||
} |
|||
}, |
|||
// 选中类型时触发 |
|||
choose(index, num) { |
|||
const that = this; |
|||
if (num === 0) { |
|||
this.labList = []; |
|||
const { laboratory } = this; |
|||
laboratory[index].isActive = !laboratory[index].isActive; |
|||
this.laboratory = [...laboratory]; |
|||
for (let i = 0; i < laboratory.length; i++) { |
|||
if (laboratory[i].isActive) { |
|||
this.labList.push(laboratory[i].id); |
|||
} |
|||
} |
|||
this.setLabList(this.labList); |
|||
} else if (num === 1) { |
|||
this.insList = []; |
|||
const { instrument } = this; |
|||
instrument[index].isActive = !instrument[index].isActive; |
|||
this.instrument = [...instrument]; |
|||
for (let i = 0; i < instrument.length; i++) { |
|||
if (instrument[i].isActive) { |
|||
this.insList.push(instrument[i].id); |
|||
} |
|||
} |
|||
this.setLabList(this.insList); |
|||
} |
|||
}, |
|||
searchLab() { |
|||
const obj = { |
|||
content: this.LabIpt, |
|||
isBtn: 1, |
|||
}; |
|||
this.setLabIpt(obj); |
|||
}, |
|||
searchIns() { |
|||
const obj = { |
|||
content: this.InsIpt, |
|||
isBtn: 1, |
|||
}; |
|||
this.setInsIpt(obj); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="stylus" scoped> |
|||
.search-background { |
|||
background: rgba(0, 0, 0, 0.02); |
|||
border: 1px solid rgba(0, 0, 0, 0.06); |
|||
height: auto; |
|||
padding: 0 20px; |
|||
width: 82%; |
|||
margin: 40px auto; |
|||
line-height: 44px; |
|||
} |
|||
|
|||
.item-search { |
|||
width: 100%; |
|||
height: 32px; |
|||
} |
|||
|
|||
.ins-title { |
|||
font-size: 16px; |
|||
font-weight: bold; |
|||
color: rgba(0, 0, 0, 0.65); |
|||
} |
|||
|
|||
.ins-name { |
|||
font-size: 16px; |
|||
color: rgba(0, 0, 0, 0.65); |
|||
padding: 0 10px; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
.act-color { |
|||
color: #13ACC4 !important; |
|||
} |
|||
</style> |
|||
|
|||
@ -1,19 +1,135 @@ |
|||
<template> |
|||
<div> |
|||
<sen-nav /> |
|||
<div> |
|||
<div class="search-background"> |
|||
<div class="d-flex"> |
|||
<div class="flex-3 flex-wrap"> |
|||
<span class="ins-title">技术领域：</span> |
|||
<span |
|||
:class="item.isActive ? 'act-color' : ''" |
|||
v-for="(item, index) in list" |
|||
:key="index" |
|||
class="ins-name" |
|||
@click="choose(index)" |
|||
> |
|||
{{ item.name }} |
|||
</span> |
|||
</div> |
|||
<div class="flex-1 align-center"> |
|||
<a-input-search class="item-search" v-model="fruitIpt" placeholder="搜索成果" enter-button="搜索" @search="searchFruit" /> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<fruit /> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapMutations } from 'vuex'; |
|||
import { selModel } from 'config/api'; |
|||
import Fruit from 'components/PlatformList/Fruit.vue'; |
|||
import SenNav from './components/SenNav.vue'; |
|||
export default { |
|||
name: 'Transfer', |
|||
components: { SenNav }, |
|||
components: { SenNav, Fruit }, |
|||
data() { |
|||
return { |
|||
str: '这是知识产权与技术转移转化服务平台', |
|||
list: [], |
|||
achList: [], |
|||
fruitIpt: '', |
|||
}; |
|||
}, |
|||
watch: { |
|||
fruitIpt(val) { |
|||
const obj = { |
|||
content: this.fruitIpt, |
|||
isBtn: 0, |
|||
}; |
|||
this.setAchIpt(obj); |
|||
}, |
|||
}, |
|||
created() { |
|||
this.getType(); |
|||
this.setAchList([]); |
|||
}, |
|||
methods: { |
|||
...mapMutations('home', ['setAchList', 'setAchIpt']), |
|||
// 获取类型列表 |
|||
async getType() { |
|||
try { |
|||
const params = { param: { model: 0 } }; |
|||
const res = await selModel(params); |
|||
const { code, mst, data } = res.data; |
|||
if (code === 200) { |
|||
this.list = data; |
|||
for (var i = 0; i < this.list.length; i++) { |
|||
this.list[i].isActive = false; |
|||
} |
|||
console.log(this.list); |
|||
} |
|||
} catch (error) { |
|||
console.log(error); |
|||
} |
|||
}, |
|||
// 点击搜索 |
|||
searchFruit() { |
|||
const obj = { |
|||
content: this.fruitIpt, |
|||
isBtn: 1, |
|||
}; |
|||
this.setAchIpt(obj); |
|||
}, |
|||
// 选中类型时触发 |
|||
choose(index) { |
|||
const that = this; |
|||
that.achList = []; |
|||
const { list } = this; |
|||
list[index].isActive = !list[index].isActive; |
|||
this.list = [...list]; |
|||
for (let i = 0; i < list.length; i++) { |
|||
if (list[i].isActive) { |
|||
this.achList.push(list[i].id); |
|||
} |
|||
} |
|||
this.setAchList(this.achList); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="stylus" scoped> |
|||
.search-background { |
|||
background: rgba(0, 0, 0, 0.02); |
|||
border: 1px solid rgba(0, 0, 0, 0.06); |
|||
height: auto; |
|||
padding: 0 20px; |
|||
width: 82%; |
|||
margin: 40px auto; |
|||
line-height: 44px; |
|||
} |
|||
|
|||
.item-search { |
|||
width: 100%; |
|||
height: 32px; |
|||
} |
|||
|
|||
.ins-title { |
|||
font-size: 16px; |
|||
font-weight: bold; |
|||
color: rgba(0, 0, 0, 0.65); |
|||
} |
|||
|
|||
.ins-name { |
|||
font-size: 16px; |
|||
color: rgba(0, 0, 0, 0.65); |
|||
padding: 0 10px; |
|||
cursor: pointer; |
|||
} |
|||
|
|||
.act-color { |
|||
color: #13ACC4 !important; |
|||
} |
|||
</style> |
|||
|
|||
Loading…
Reference in new issue