格式化代码, 海报默认显示产品

This commit is contained in:
mengxiaolong
2020-12-15 09:46:22 +08:00
parent b31e7182f0
commit 50e40cb348

View File

@@ -2,32 +2,22 @@
<div class="poster-list-container">
<van-sticky>
<van-tabs :line-width="45" v-model="active" @change="tabChange" sticky>
<van-tab :name="index" :title="item.name" v-for="(item, index) in posterTypeList" :key="index">
<!-- <img src="@/assets/images/u10199.png" /> -->
</van-tab>
<van-tab :name="index" :title="item.name" v-for="(item, index) in posterTypeList" :key="index"> </van-tab>
</van-tabs>
</van-sticky>
<van-grid :border="false" :column-num="3" :class="pageCount-1?'pb40':''">
<van-grid :border="false" :column-num="3" :class="pageCount - 1 ? 'pb40' : ''">
<van-grid-item v-for="(item, index) in posterList" :key="index">
<img :src="item.posterNarrowUrl | urlFormat" @click="posterPreview(item.posterId, item.posterType)" />
<!-- <img src="@/assets/images/banner.png" @click="posterPreview(item.posterId)" /> -->
</van-grid-item>
</van-grid>
<van-pagination
v-model="pageNum"
:page-count="pageCount"
@change="change"
class="bottom-btn"
style="background-color:#fff"
v-if="pageCount-1"
/>
<van-pagination v-model="pageNum" :page-count="pageCount" @change="change" class="bottom-btn" style="background-color:#fff" v-if="pageCount - 1" />
</div>
</template>
<script>
import { Tab, Tabs, Sticky, Grid, GridItem,Pagination } from 'vant'
import { getPosterType, getAppPosterList, getPosterList } from '@/api/ebiz/poster/poster'
import { Tab, Tabs, Sticky, Grid, GridItem, Pagination } from 'vant'
import { getPosterType, getAppPosterList } from '@/api/ebiz/poster/poster'
import config from '@/config'
export default {
name: 'posterList',
@@ -37,12 +27,12 @@ export default {
[Sticky.name]: Sticky,
[Grid.name]: Grid,
[GridItem.name]: GridItem,
[Pagination.name]: Pagination,
[Pagination.name]: Pagination
},
data() {
return {
posterTypeList: [], //海报类型
active: '0',
active: 3,
posterType: '',
srcUrl: '@/images/u10199.png',
pageNum: 1,
@@ -60,7 +50,7 @@ export default {
let res = await getPosterType({})
if (res.result == 0) {
this.posterTypeList = res.content.paterTypeList
this.posterType = res.content.paterTypeList[0].code
this.posterType = this.posterTypeList[3].code
this.getPosterList()
} else {
this.$toast(res.resultMessage)
@@ -76,26 +66,21 @@ export default {
pageSize: this.pageSize
}
console.log(param)
let res = await getAppPosterList(param)
if (res.result == 0) {
this.pageCount = Math.ceil(res.pageInfo.total/9)
this.pageCount = Math.ceil(res.pageInfo.total / 9)
this.posterList = res.pageInfo.list
} else {
this.$toast(res.resultMessage)
}
},
tabChange(name, title) {
tabChange(name) {
this.posterType = this.posterTypeList[name].code
this.pageNum= 1,
this.posterList=[],
this.pageCount = 1
;(this.pageNum = 1), (this.posterList = []), (this.pageCount = 1)
this.getPosterList()
console.log(name, title)
},
change(){
change() {
this.getPosterList()
console.log(this.pageNum)
},
posterPreview(id, posterType) {
this.$jump({
@@ -111,7 +96,6 @@ console.log(this.pageNum)
},
filters: {
urlFormat(url) {
console.log((config.imgDomain + `/returnImageStream?a=b.jpg&imgPath=${url}`).replace(/\+/g, '%2B'))
return (config.imgDomain + `/returnImageStream?a=b.jpg&imgPath=${url}`).replace(/\+/g, '%2B')
}
}
@@ -119,19 +103,19 @@ console.log(this.pageNum)
</script>
<style scoped>
.poster-list-container img{
.poster-list-container img {
width: 100%;
}
.poster-list-container >>> .van-pagination__item--active{
background-color: #E9332E
.poster-list-container >>> .van-pagination__item--active {
background-color: #e9332e;
}
.poster-list-container >>> .van-pagination__item{
color: #E9332E
.poster-list-container >>> .van-pagination__item {
color: #e9332e;
}
.poster-list-container >>> .van-pagination__item--active{
color: #fff
.poster-list-container >>> .van-pagination__item--active {
color: #fff;
}
.poster-list-container >>> .van-pagination__item--disabled{
color: #7d7e80
.poster-list-container >>> .van-pagination__item--disabled {
color: #7d7e80;
}
</style>