|
|
|
@ -1,7 +1,7 @@ |
|
|
|
|
<template> |
|
|
|
|
<view class="container"> |
|
|
|
|
|
|
|
|
|
<view class="bannerBox"> |
|
|
|
|
<custom_navbar :title="navbar_title" @getNavHeight="getNavHeight" :theme="theme" /> |
|
|
|
|
<view class="bannerBox" :style="'margin-top:-'+margin_top+'px'"> |
|
|
|
|
<u-swiper |
|
|
|
|
:list="banner" |
|
|
|
|
keyName="image" |
|
|
|
@ -36,14 +36,14 @@ |
|
|
|
|
<image src="/static/img/index/title_zj.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="listBox"> |
|
|
|
|
<view class="photoBox"> |
|
|
|
|
<view class="photoBox" v-for="(item,index) in specs_list" :key="index"> |
|
|
|
|
<view class="photoTop"> |
|
|
|
|
<view class="topLeft"> |
|
|
|
|
<image src="/static/img/index/zj_icon.png" mode="widthFix"></image> |
|
|
|
|
<image :src="item.icon" mode="widthFix" @error="specsErr(index)"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="topCenter"> |
|
|
|
|
<view class="title">一寸照</view> |
|
|
|
|
<view class="desc">25×35mm | 413×579px</view> |
|
|
|
|
<view class="title">{{item.title}}</view> |
|
|
|
|
<view class="desc">{{item.w_h_mm.w}}×{{item.w_h_mm.h}}mm | {{item.w_h_px.w}}×{{item.w_h_px.h}}px</view> |
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
<view class="topRight"> |
|
|
|
@ -54,60 +54,7 @@ |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
<view class="photoBox"> |
|
|
|
|
<view class="photoTop"> |
|
|
|
|
<view class="topLeft"> |
|
|
|
|
<image src="/static/img/index/zj_icon.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="topCenter"> |
|
|
|
|
<view class="title">二寸照</view> |
|
|
|
|
<view class="desc">25×35mm | 413×579px</view> |
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
<view class="topRight"> |
|
|
|
|
<view class="distance"> |
|
|
|
|
<image src="/static/img/index/right.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<view class="photoBox"> |
|
|
|
|
<view class="photoTop"> |
|
|
|
|
<view class="topLeft"> |
|
|
|
|
<image src="/static/img/index/zj_icon.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="topCenter"> |
|
|
|
|
<view class="title">大一寸照</view> |
|
|
|
|
<view class="desc">25×35mm | 413×579px</view> |
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
<view class="topRight"> |
|
|
|
|
<view class="distance"> |
|
|
|
|
<image src="/static/img/index/right.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
<view class="photoBox"> |
|
|
|
|
<view class="photoTop"> |
|
|
|
|
<view class="topLeft"> |
|
|
|
|
<image src="/static/img/index/zj_icon.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="topCenter"> |
|
|
|
|
<view class="title">小一寸照</view> |
|
|
|
|
<view class="desc">25×35mm | 413×579px</view> |
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
<view class="topRight"> |
|
|
|
|
<view class="distance"> |
|
|
|
|
<image src="/static/img/index/right.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
<view class="indexTitle"> |
|
|
|
@ -116,30 +63,13 @@ |
|
|
|
|
|
|
|
|
|
<view class="picList"> |
|
|
|
|
<scroll-view class="scrollBox" scroll-x="true" @scroll="scroll1" scroll-left="0"> |
|
|
|
|
<view class="picBox"> |
|
|
|
|
<view class="picBox" v-for="(item,index) in album_list" :key="index"> |
|
|
|
|
<view class="pic"> |
|
|
|
|
<image src="/static/img/index/pic.png" mode="widthFix"></image> |
|
|
|
|
<image :src="item.face" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="pic_title">风格名称</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="picBox"> |
|
|
|
|
<view class="pic"> |
|
|
|
|
<image src="/static/img/index/pic.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="pic_title">风格名称</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="picBox"> |
|
|
|
|
<view class="pic"> |
|
|
|
|
<image src="/static/img/index/pic.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="pic_title">风格名称</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="picBox"> |
|
|
|
|
<view class="pic"> |
|
|
|
|
<image src="/static/img/index/pic.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="pic_title">风格名称</view> |
|
|
|
|
<view class="pic_title">{{item.title}}</view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
</scroll-view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
@ -149,54 +79,54 @@ |
|
|
|
|
|
|
|
|
|
<view class="picList"> |
|
|
|
|
<scroll-view class="scrollBox" scroll-x="true" @scroll="scroll2" scroll-left="0"> |
|
|
|
|
<view class="picBox"> |
|
|
|
|
<view class="picBox" v-for="(item,index) in cartoon_list" :key="index"> |
|
|
|
|
<view class="pic"> |
|
|
|
|
<image src="/static/img/index/pic.png" mode="widthFix"></image> |
|
|
|
|
<image :src="item.face" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="pic_title">风格名称</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="picBox"> |
|
|
|
|
<view class="pic"> |
|
|
|
|
<image src="/static/img/index/pic.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="pic_title">风格名称</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="picBox"> |
|
|
|
|
<view class="pic"> |
|
|
|
|
<image src="/static/img/index/pic.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="pic_title">风格名称</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="picBox"> |
|
|
|
|
<view class="pic"> |
|
|
|
|
<image src="/static/img/index/pic.png" mode="widthFix"></image> |
|
|
|
|
</view> |
|
|
|
|
<view class="pic_title">风格名称</view> |
|
|
|
|
<view class="pic_title">{{item.title}}</view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
</scroll-view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
<view class="spaceBox"></view> |
|
|
|
|
</view> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
<script> |
|
|
|
|
import custom_navbar from "./components/header.vue"; |
|
|
|
|
export default { |
|
|
|
|
components: { |
|
|
|
|
custom_navbar |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
data() { |
|
|
|
|
return { |
|
|
|
|
banner: [ |
|
|
|
|
// { |
|
|
|
|
// adImg:'/static/img/index/banner.png', |
|
|
|
|
// } |
|
|
|
|
], |
|
|
|
|
sceneList:[], //场景 |
|
|
|
|
hotList:[],//热门 |
|
|
|
|
navbar_title: '智能拍照合成', |
|
|
|
|
theme: "blue", |
|
|
|
|
margin_top: -7, |
|
|
|
|
|
|
|
|
|
banner: [ |
|
|
|
|
// { |
|
|
|
|
// adImg:'/static/img/index/banner.png', |
|
|
|
|
// } |
|
|
|
|
], |
|
|
|
|
sceneList:[], //场景 |
|
|
|
|
specs_list:[],//证件 |
|
|
|
|
album_list:[],//写真 |
|
|
|
|
cartoon_list:[],//卡通 |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
computed:{ |
|
|
|
|
|
|
|
|
|
onPageScroll(e) { |
|
|
|
|
if (e.scrollTop > 50) { |
|
|
|
|
this.theme = 'white'; |
|
|
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
|
|
this.theme = 'blue'; |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
onLoad() { |
|
|
|
|
var _this = this; |
|
|
|
@ -225,6 +155,9 @@ |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
getNavHeight(e) { |
|
|
|
|
this.margin_top += e; |
|
|
|
|
}, |
|
|
|
|
goTo(url) |
|
|
|
|
{ |
|
|
|
|
uni.$u.route({ |
|
|
|
@ -275,16 +208,29 @@ |
|
|
|
|
var _this =this; |
|
|
|
|
_this.$api.get('api/photo/hot_list', {},function(res){ |
|
|
|
|
console.log('热门原始',res); |
|
|
|
|
var hotList = res; |
|
|
|
|
hotList.forEach((item, index) => { |
|
|
|
|
hotList[index].image = _this.$api.ossurl(item.image); |
|
|
|
|
var specs_list= res.specs_list; |
|
|
|
|
specs_list.forEach((item, index) => { |
|
|
|
|
specs_list[index].icon = _this.$api.ossurl(item.icon); |
|
|
|
|
}); |
|
|
|
|
_this.specs_list = specs_list; |
|
|
|
|
var album_list= res.album_list; |
|
|
|
|
album_list.forEach((item, index) => { |
|
|
|
|
album_list[index].face = _this.$api.ossurl(item.face); |
|
|
|
|
}); |
|
|
|
|
_this.album_list = album_list; |
|
|
|
|
var cartoon_list= res.cartoon_list; |
|
|
|
|
cartoon_list.forEach((item, index) => { |
|
|
|
|
cartoon_list[index].face = _this.$api.ossurl(item.face); |
|
|
|
|
}); |
|
|
|
|
console.log('热门修正',hotList); |
|
|
|
|
_this.hotList = hotList; |
|
|
|
|
_this.cartoon_list = cartoon_list; |
|
|
|
|
|
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
//证件照图片加载失败默认 |
|
|
|
|
specsErr(index) |
|
|
|
|
{ |
|
|
|
|
this.specs_list[index].icon = '/static/img/index/zj_icon.png'; |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
//滚动监控 |
|
|
|
|
scroll1(e) { |
|
|
|
@ -414,7 +360,7 @@ |
|
|
|
|
|
|
|
|
|
.contentBox{ |
|
|
|
|
width:746rpx; |
|
|
|
|
height: 500rpx; |
|
|
|
|
height: auto; |
|
|
|
|
background: linear-gradient( 180deg, #DBD9FF 0%, #F5F6FB 100%); |
|
|
|
|
border-radius: 28rpx 28rpx 0rpx 0rpx; |
|
|
|
|
border: 2rpx solid #FFFFFF; |
|
|
|
@ -488,7 +434,7 @@ |
|
|
|
|
.topRight .distance image{ width: 32rpx; height: 32rpx; margin-right: 24rpx;} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.picList{ width: 100%; height: 360rpx;} |
|
|
|
|
.picList{ width: 100%; height: 360rpx; } |
|
|
|
|
|
|
|
|
|
.scrollBox { |
|
|
|
|
margin-top: 20rpx; |
|
|
|
|