提交 d8cde625 authored 作者: 王鹏飞's avatar 王鹏飞

预览图片修改

上级 31ce206e
<template> <template>
<div class="serv-box"> <div class="serv-box">
<img class="top-bar" src="../../assets/images/top-bar.png" alt /> <img class="top-bar" src="../../assets/images/top-bar.png" alt="">
<ul class="contact-info"> <ul class="contact-info">
<li> <li>
<img src="../../assets/images/ser-icon1.png" alt /> <img src="../../assets/images/ser-icon1.png" alt="">
<div class="txt"> <div class="txt"><span>客服微信:</span> 18610017891</div>
<span>客服微信:</span> 18610017891
</div>
</li> </li>
<li> <li>
<img src="../../assets/images/ser-icon2.png" alt /> <img src="../../assets/images/ser-icon2.png" alt="">
<div class="txt"> <div class="txt"><span>客服电话:</span> 18610017891</div>
<span>客服电话:</span> 18610017891
</div>
</li> </li>
<li> <li>
<img src="../../assets/images/ser-icon3.png" alt /> <img src="../../assets/images/ser-icon3.png" alt="">
<div class="txt"> <div class="txt"><span>工作时间:</span> 工作日9:00-12:00,13:00-18:00</div>
<span>工作时间:</span> 工作日9:00-12:00,13:00-18:00
</div>
</li> </li>
</ul> </ul>
<div class="code"> <div class="code">
<div class="txt">想了解更多,保存二维码图片,扫码关注我们</div> <div class="txt">想了解更多,保存二维码图片,扫码关注我们</div>
<img <img @click="imagePreview" src="https://zws-imgs-pub.ezijing.com/static/public/d720ec7c4eed91788de652fb7962a911.png" alt="">
@click="imagePreview"
src="https://zws-imgs-pub.ezijing.com/static/public/d720ec7c4eed91788de652fb7962a911.png"
alt
/>
</div> </div>
</div> </div>
</template> </template>
...@@ -42,55 +32,52 @@ export default { ...@@ -42,55 +32,52 @@ export default {
}, },
methods: { methods: {
imagePreview() { imagePreview() {
// ImagePreview(['https://zws-imgs-pub.ezijing.com/static/public/d720ec7c4eed91788de652fb7962a911.png']) ImagePreview(['https://zws-imgs-pub.ezijing.com/static/public/d720ec7c4eed91788de652fb7962a911.png'])
wx.previewImage({
urls: ['https://zws-imgs-pub.ezijing.com/static/public/d720ec7c4eed91788de652fb7962a911.png']
})
} }
} }
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.top-bar { .top-bar{
width: 100%; width: 100%;
display: block; display: block;
} }
.contact-info { .contact-info{
padding-left: 0.7rem; padding-left: .7rem;
padding-top: 0.2rem; padding-top: .2rem;
li { li{
display: flex; display: flex;
margin-bottom: 0.48rem; margin-bottom: .48rem;
img { img{
width: 0.5rem; width: .5rem;
height: 0.5rem; height: .5rem;
display: block; display: block;
} }
.txt { .txt{
margin-left: 0.3rem; margin-left: .3rem;
line-height: 0.5rem; line-height: .5rem;
font-size: 0.3rem; font-size:.3rem;
color: rgba(34, 34, 34, 1); color:rgba(34,34,34,1);
span { span{
font-weight: bold; font-weight:bold;
} }
} }
} }
} }
.code { .code{
margin-top: 0.84rem; margin-top: .84rem;
.txt { .txt{
text-align: center; text-align: center;
font-weight: bold; font-weight:bold;
color: rgba(34, 34, 34, 1); color:rgba(34,34,34,1);
line-height: 100%; line-height:100%;
font-size: 0.3rem; font-size: .3rem;
} }
img { img{
width: 4.3rem; width: 4.3rem;
display: block; display: block;
margin: 0.25rem auto; margin: .25rem auto;
} }
} }
</style> </style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论