diff --git a/pages/recommend/index.vue b/pages/recommend/index.vue index 5fddcf6..d962c55 100644 --- a/pages/recommend/index.vue +++ b/pages/recommend/index.vue @@ -35,15 +35,20 @@ + + {{idx+1}} + - {{ item.goodsName }} - ¥ {{ item.rankingDetails.price }} - 交易类型:{{ item.rankingDetails.goodsEntrust == 1 ? '转让' : '授权'}} + {{ item.goodsName }} + + ¥ {{ item.rankingDetails.price }} + 交易类型:{{ item.rankingDetails.goodsEntrust == 1 ? '转让' : '授权'}} + @@ -114,6 +119,8 @@ export default { scrollTop: 0, // 菜单 menus, + rank_font_arr: ['rank_one', 'rank_two', 'rank_three', 'rank_four', 'rank_five'], + rank_bg_arr: ['bg_one', 'bg_two', 'bg_three', 'bg_four', 'bg_five'] } }, @@ -145,6 +152,7 @@ export default { if (this.searchValue == '') { this.$error('请输入搜索关键词'); } else { + this.getCatList() } }, @@ -176,7 +184,7 @@ export default { goods_type: '', //1.文化资源数据,2.文化数字内容 lbdSet: 1, //1 热门标的推荐 2 交易(销售) 3 点击 pageIndex: this.page, - pageRows: 10, + pageRows: 5, typeStatus: 1, } @@ -185,6 +193,9 @@ export default { } else if (type === 2) { param.lbdSet = 3 } + if (this.searchValue != '') { + param.goodsName = this.searchValue + } this.bindData(param) }, // 标的详情 @@ -373,23 +384,31 @@ export default { overflow: hidden; .name { - width: 45%; + width: 42%; height: 200rpx; - float: left; - margin-left: 51%; - margin-top: -45%; + position: absolute; display: inline-block; - font-size: 26rpx; + margin-left: 250rpx; + margin-top: -225rpx; font-weight: bold; - color: #444444; - .name-price{ - color: #fe7730; - margin-top: 30rpx; + .name-name { + font-size: 26rpx; + color: #444444; } - .name-type{ - color: #cec7bf; - margin-top: 20rpx; + + .name-bottom { + position: absolute; + top: 125rpx; + + .name-price{ + color: #fe7730; + margin-bottom: 10rpx; + } + + .name-type{ + color: #cec7bf; + } } } @@ -404,6 +423,55 @@ export default { display: inline-block; } + .cate-top-rank { + position: relative; + float: left; + z-index: 9999; + width: 0; + height: 0; + border-right: 50px solid transparent; /* 控制三角形的大小 */ + + .cate-top-num { + float: left; + margin-top: -80rpx; + margin-left: 23rpx; + font-family: 'Impact'; + font-size: 28rpx; + font-weight: 900; + } + .rank_one{ + color: #e99d42; + } + .rank_two{ + color: #93d2f3; + } + .rank_three{ + color: #9b7d31; + } + .rank_four{ + color: #93d2f3; + } + .rank_five{ + color: #93d2ef; + } + } + .bg_one { + border-top: 50px solid #febd45; /* 控制三角形的颜色 */ + } + .bg_two { + border-top: 50px solid #b4fdff; /* 控制三角形的颜色 */ + } + .bg_three { + border-top: 50px solid #cba43f; /* 控制三角形的颜色 */ + } + .bg_four { + border-top: 50px solid #10476e; /* 控制三角形的颜色 */ + } + .bg_five { + border-top: 50px solid #10476e; /* 控制三角形的颜色 */ + } + + .cate-img-padding { width: 250rpx; height: 250rpx; @@ -419,6 +487,7 @@ export default { width: 100%; height: 100%; position: absolute; + z-index: 10; top: 0; left: 0; }