forked from TALL/check-work
6 changed files with 169 additions and 257 deletions
@ -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…
Reference in new issue