aBin 5 years ago
parent
commit
d7f7759bcc
  1. 76
      src/components/PlatformList/PlatformList.vue
  2. 2
      src/config/api-user.js
  3. 27
      src/store/modules/home/mutations.js
  4. 9
      src/store/modules/home/state.js
  5. 172
      src/views/IncubationPlatform/Children/Products.vue
  6. 140
      src/views/IncubationPlatform/Children/ShareChild/InsDet.vue

76
src/components/PlatformList/PlatformList.vue

@ -1,17 +1,26 @@
<template> <template>
<div> <div>
<div class="inner d-flex flex-wrap"> <div class="inner d-flex flex-wrap">
<div v-for="(item, index) in list" :key="index" class="item-box" :class="(index + 1) % 4 === 0 ? 'margin-0' : ''"> <div
<img :src="item.visitLocation" style="height: 220px; width: 100%; border: 1px solid #ccc" /> :class="(index + 1) % 4 === 0 ? 'margin-0' : ''"
<p class="font-24 my-4">{{ item.name }}</p> :key="index"
<p class="font-16 baseColor" style="text-align: right; cursor: pointer" @click="jump(item.id)">了解更多</p> class="item-box mb-6"
v-for="(item, index) in list"
>
<img :src="item.imgUrl" style="height: 220px; width: 100%; border: 1px solid #ccc" />
<p class="font-24 my-4 title">{{ item.name }}</p>
<p
@click="jump(item.id)"
class="font-16 baseColor"
style="text-align: right; cursor: pointer"
>了解更多</p>
</div> </div>
</div> </div>
<div class="inner"> <div class="inner">
<a-pagination <a-pagination
:current="current" :current="current"
:total="total"
:page-size="pageSize" :page-size="pageSize"
:total="total"
@change="onShowSizeChange" @change="onShowSizeChange"
class="pagination" class="pagination"
show-less-items show-less-items
@ -34,7 +43,7 @@ export default {
current: 1, current: 1,
}; };
}, },
computed: mapState('home', ['listState', 'labList', 'LabIpt', 'insList', 'InsIpt', 'shareCurrent']), computed: mapState('home', ['listState', 'labList', 'LabIpt', 'insList', 'InsIpt', 'shareCurrent', 'productList', 'productIpt']),
watch: { watch: {
shareCurrent(val) { shareCurrent(val) {
console.log(val); console.log(val);
@ -72,13 +81,31 @@ export default {
this.setShareCurrent(1); this.setShareCurrent(1);
} }
}, },
productList(val) {
if (this.shareCurrent === 1) {
this.monitor(this.listState);
}
this.current = 1;
this.setShareCurrent(1);
},
productIpt(val) {
if (this.productIpt.isBtn === 1) {
if (this.shareCurrent === 1) {
this.monitor(this.listState);
}
this.current = 1;
this.setShareCurrent(1);
}
},
}, },
created() { created() {
this.current = this.shareCurrent; this.current = this.shareCurrent;
if (this.listState === 0) { if (this.listState === 0) {
this.getSear(); this.getSear();
} else { } else if (this.listState === 1) {
this.getSelI(); this.getSelI();
} else {
this.getProductLists();
} }
}, },
methods: { methods: {
@ -125,6 +152,27 @@ export default {
console.log(error); console.log(error);
} }
}, },
//
async getProductLists() {
try {
const params = {
param: {
content: this.productIpt.content, //
modelIds: this.productList, // ID
pageNum: this.shareCurrent,
pageSize: this.pageSize,
},
};
const res = await selInstrument(params);
const { code, msg, data } = res.data;
if (code === 200) {
this.list = data.list;
this.total = parseInt(data.total);
}
} catch (error) {
console.log(error);
}
},
// //
onShowSizeChange(current, size) { onShowSizeChange(current, size) {
this.current = current; this.current = current;
@ -134,8 +182,10 @@ export default {
monitor(val) { monitor(val) {
if (val === 0) { if (val === 0) {
this.getSear(); this.getSear();
} else { } else if (val === 1) {
this.getSelI(); this.getSelI();
} else {
this.getProductLists();
} }
}, },
// / // /
@ -152,6 +202,12 @@ export default {
name: 'InsDet', name: 'InsDet',
params: { id }, params: { id },
}); });
} else if (this.listState === 3) {
this.$router.push({
path: '/NewPlatform/ServiceDet',
name: 'ServiceDet',
params: { id },
});
} }
}, },
}, },
@ -168,6 +224,10 @@ export default {
width: 20.5%; width: 20.5%;
margin-right: 6%; margin-right: 6%;
border-radius: 4px; border-radius: 4px;
.title {
text-align: center;
}
} }
.margin-0 { .margin-0 {

2
src/config/api-user.js

@ -26,4 +26,4 @@ export const getSmscode = params => axios.get(`${users}/smscode`, params);
export const changePassword = params => axios.post(`${users}/password`, params); export const changePassword = params => axios.post(`${users}/password`, params);
// 通过userId获取token // 通过userId获取token
export const getUserId = params => axios.post(`${users}/userId`, params); export const getUserId = params => axios.get(`${users}/userId`, params);

27
src/store/modules/home/mutations.js

@ -233,6 +233,33 @@ const mutations = {
setLabId(state, num) { setLabId(state, num) {
state.LabId = num; state.LabId = num;
}, },
/**
* 改变孵化平台-产品展示所选类型所选类型
* @param {object} state
* @param {List} list
*/
setProductList(state, list) {
state.productList = list;
},
/**
* 改变孵化平台-产品展示所选类型搜索框内容
* @param {object} state
* @param {object} obj
*/
setProductIpt(state, obj) {
state.productIpt = { ...obj };
},
/**
* 改变当前孵化平台-产品展示 详情的 id
* @param {object} state
* @param {number} num
*/
setProductId(state, num) {
state.productId = num;
},
}; };
export default mutations; export default mutations;

9
src/store/modules/home/state.js

@ -31,7 +31,7 @@ const state = {
}, },
achCurrent: 1, // 知识产权与技术转移转化服务平台-成果列表页数 achCurrent: 1, // 知识产权与技术转移转化服务平台-成果列表页数
achId: 0, // 知识产权与技术转移转化服务平台-成果详情页Id achId: 0, // 知识产权与技术转移转化服务平台-成果详情页Id
listState: 0, // 科技资源开放共享服务平台-列表展示数据(0:实验室,1:仪器//默认0) listState: 0, // 科技资源开放共享服务平台-列表展示数据(0:实验室,1:仪器//默认0, 2:研究院,3:产品
shareCurrent: 1, // 科技资源开放共享服务平台-列表当前处于第几页 shareCurrent: 1, // 科技资源开放共享服务平台-列表当前处于第几页
labList: [], // 科技资源开放共享服务平台-实验室所选类型 labList: [], // 科技资源开放共享服务平台-实验室所选类型
LabIpt: { LabIpt: {
@ -46,6 +46,13 @@ const state = {
isBtn: 0, isBtn: 0,
}, },
LabId: 0, // 当前研究院详情Id LabId: 0, // 当前研究院详情Id
productList: [], // 孵化平台-产品展示所选类型
productIpt: {
// 产品展示搜索框内容
content: '',
isBtn: 0,
},
productId: 0, // 当前产品详情Id
}; };
export default state; export default state;

172
src/views/IncubationPlatform/Children/Products.vue

@ -1,27 +1,34 @@
<template> <template>
<div> <div>
<h-nav /> <h-nav />
<bread-crumb class="inner" :arr="arr" /> <div class="inner">
<div> <bread-crumb :arr="arr" />
<div class="search-background"> <div>
<div class="d-flex"> <div class="search-background">
<div class="flex-3 flex-wrap"> <div class="d-flex">
<span class="ins-title">研究开发实验室</span> <div class="flex-3 flex-wrap">
<span <span class="ins-title">产品类目</span>
:class="item.isActive ? 'act-color' : ''" <span
:key="index" :class="item.isActive ? 'act-color' : ''"
@click="choose(index, 0)" :key="index"
class="ins-name" @click="choose(index)"
v-for="(item, index) in laboratory" class="ins-name"
> v-for="(item, index) in productLists"
{{ item.name }} >{{ item.name }}</span>
</span> </div>
</div> <div class="flex-1 align-center">
<div class="flex-1 align-center"> <a-input-search
<a-input-search @search="searchLab" class="item-search" enter-button="搜索" placeholder="搜索实验室" v-model="LabIpt" /> @search="searchProduct"
class="item-search"
enter-button="搜索"
placeholder="请输入"
v-model="productIpt"
/>
</div>
</div> </div>
</div> </div>
</div> </div>
<p class="font-bold-24">产品展示</p>
</div> </div>
<platform-list /> <platform-list />
</div> </div>
@ -43,28 +50,18 @@ export default {
{ name: '孵化平台', url: '/IncubationPlatform/MakerSpace' }, { name: '孵化平台', url: '/IncubationPlatform/MakerSpace' },
{ name: '产品展示', url: '' }, { name: '产品展示', url: '' },
], ],
LabIpt: '', // productIpt: '', //
laboratory: [], // productLists: [], //
labList: [], // productList: [], //
InsIpt: '', //
instrument: [], //
insList: [], //
}; };
}, },
watch: { watch: {
LabIpt(val) { productIpt(val) {
const obj = {
content: this.LabIpt,
isBtn: 0,
};
this.setLabIpt(obj);
},
InsIpt(val) {
const obj = { const obj = {
content: this.InsIpt, content: this.productIpt,
isBtn: 0, isBtn: 0,
}; };
this.setInsIpt(obj); this.setProductIpt(obj);
}, },
}, },
created() { created() {
@ -72,99 +69,60 @@ export default {
content: '', content: '',
isBtn: 0, isBtn: 0,
}; };
this.setLabList([]); this.setProductList([]);
this.setInsList([]); this.setProductIpt(obj);
this.setLabIpt(obj); this.getType(3);
this.setInsIpt(obj);
this.getType(1);
this.getType(2);
}, },
methods: { methods: {
...mapMutations('home', ['setLabList', 'setInsList', 'setLabIpt', 'setInsIpt', 'setListState']), ...mapMutations('home', ['setProductIpt', 'setProductList', 'setListState']),
async getType(num) { async getType(num) {
try { try {
const params = { param: { model: num } }; const params = { param: { model: num } };
const res = await selModel(params); const res = await selModel(params);
const { code, mst, data } = res.data; const { code, mst, data } = res.data;
if (code === 200) { if (code === 200) {
if (num === 1) { this.productLists = data;
this.instrument = data; for (let i = 0; i < this.productLists.length; i++) {
for (let i = 0; i < this.instrument.length; i++) { this.productLists[i].isActive = false;
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) { } catch (error) {
console.log(error); console.log(error);
} }
}, },
// //
choose(index, num) { choose(index) {
const that = this; this.productList = [];
if (num === 0) { const { productLists } = this;
this.labList = []; for (let i = 0; i < productLists.length; i++) {
const { laboratory, instrument } = this; productLists[i].isActive = false;
for (let i = 0; i < instrument.length; i++) {
instrument[i].isActive = false;
}
this.setListState(0);
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 { laboratory, instrument } = this;
for (let i = 0; i < laboratory.length; i++) {
laboratory[i].isActive = false;
}
this.setListState(1);
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.setInsList(this.insList);
} }
}, this.setListState(3);
searchLab() { productLists[index].isActive = !productLists[index].isActive;
const { instrument } = this; this.productLists = [...productLists];
for (let i = 0; i < instrument.length; i++) { for (let i = 0; i < productLists.length; i++) {
instrument[i].isActive = false; if (productLists[i].isActive) {
this.productList.push(productLists[i].id);
}
} }
this.instrument = [...instrument]; this.setProductList(this.productList);
this.setListState(0);
this.InsIpt = '';
const obj = {
content: this.LabIpt,
isBtn: 1,
};
this.setLabIpt(obj);
}, },
searchIns() {
const { laboratory } = this; //
for (let i = 0; i < laboratory.length; i++) { searchProduct() {
laboratory[i].isActive = false; const { productLists } = this;
for (let i = 0; i < productLists.length; i++) {
productLists[i].isActive = false;
} }
this.laboratory = [...laboratory]; this.productLists = [...productLists];
this.setListState(1); this.setListState(3);
this.LabIpt = ''; this.productIpt = '';
const obj = { const obj = {
content: this.InsIpt, content: this.productIpt,
isBtn: 1, isBtn: 1,
}; };
this.setInsIpt(obj); this.setProductList(obj);
}, },
}, },
}; };
@ -172,7 +130,7 @@ export default {
<style lang="stylus" scoped> <style lang="stylus" scoped>
.inner { .inner {
margin: 10px auto 15px; margin: 40px auto;
} }
.search-background { .search-background {
@ -180,7 +138,7 @@ export default {
border: 1px solid rgba(0, 0, 0, 0.06); border: 1px solid rgba(0, 0, 0, 0.06);
height: auto; height: auto;
padding: 0 20px; padding: 0 20px;
width: 82%; width: 100%;
margin: 40px auto; margin: 40px auto;
line-height: 44px; line-height: 44px;
} }

140
src/views/IncubationPlatform/Children/ShareChild/InsDet.vue

@ -1,140 +0,0 @@
<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.manufactor }}</p>
<p>{{ obj.model }}</p>
<p>{{ obj.specifications }}</p>
<p>{{ obj.performance }}</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>
</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.purpose"></div>
</div>
</div>
</template>
<script>
import { selInstrumentMes } from 'config/api';
export default {
name: 'InsDet',
data() {
return {
obj: {},
id: 0,
};
},
created() {
this.id = this.$route.params.id;
this.getData();
},
methods: {
async getData() {
try {
const params = { param: { id: this.id } };
const res = await selInstrumentMes(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 {
border-bottom: 1px solid rgba(0, 0, 0, 0.14901960784313725);
position: relative;
padding-bottom: 24px;
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>
Loading…
Cancel
Save