cxc/yshopb2c-uniapp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

优化首页样式

Browse Source
This commit is contained in:
gaoxs
2020-07-14 09:34:34 +08:00
parent e8240a54a7
commit 63c3530314
9 changed files with 767 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
assets/css/style.css
View File

File diff suppressed because one or more lines are too long

2
assets/css/style.css.map
View File

File diff suppressed because one or more lines are too long

38
assets/css/style.less
View File

@ -1251,21 +1251,24 @@ page {
}
.index .news {
align-items: center;
height: 0.77*100rpx;
border-top: 1px solid #f4f4f4;
padding: 0 0.3*100rpx;
box-shadow: 0 0.1*100rpx 0.3*100rpx #f5f5f5;
-moz-box-shadow: 0 0.1*100rpx 0.3*100rpx #f5f5f5;
-o-box-shadow: 0 0.1*100rpx 0.3*100rpx #f5f5f5;
background: #fffbe8;
}
.index .news .pictrue {
width: 1.24*100rpx;
height: 0.28*100rpx;
width: 26rpx;
height: 26rpx;
border-right: 1px solid #ddd;
padding-right: 0.23*100rpx;
box-sizing: content-box;
-moz-box-sizing: content-box;
margin-right: 20rpx;
}
.index .news .pictrue image {
@ -1275,7 +1278,7 @@ page {
}
.index .news .new-banner {
width: 5.23*100rpx;
flex: 1;
overflow: hidden;
height: 0.77*100rpx;
}
@ -1404,10 +1407,16 @@ page {
.index .wrapper .title .text .name {
color: #282828;
font-size: 0.3*100rpx;
font-size: 28rpx;
font-weight: bold;
margin-bottom: 0.05*100rpx;
position: relative;
display: flex;
align-items: center;
}
.index .wrapper .title .text .name .iconfont {
margin-right: 10rpx;
}
.index .wrapper .title .text .name .new {
@ -1661,6 +1670,13 @@ page {
.index .wrapper.hot .newProducts .newProductsItem {
border: 0;
}
.index .wrapper.hot .title .text{
color: #fff;
font-size:28rpx;
.iconfont{
margin-right: 10rpx;
}
}
.index .wrapper.hot .newProducts {
white-space: nowrap;
@ -4241,17 +4257,17 @@ page {
}
.bargain-list .list {
background-color: #fff;
border: 0.06*100rpx solid #eb3729;
border-radius: 0.3*100rpx;
margin: .3*100rpx 0.3*100rpx 0.66*100rpx 0.3*100rpx;
padding: 0 0.24*100rpx;
}
.bargain-list .list .item {
border-bottom: 1px solid #eee;
position: relative;
height: 2.23*100rpx;
background-color: #fff;
padding: 0 .24*100rpx;
margin: 0 auto .2*100rpx auto;
}
.bargain-list .list .item .pictrue {
@ -8521,3 +8537,11 @@ page {
height: 1326px !important;
}
}
.text .name .icon-jingpintuijian, .text .name .icon-xinpin{
color: #00f !important;
}
.text .name .icon-shoucang{
color: #ea3526!important;
}

664
assets/iconfont/iconfont.css
View File

File diff suppressed because one or more lines are too long

6
pages/activity/GoodsBargain/index.vue
View File

@ -29,11 +29,11 @@
</view>
<view class="load font-color-red" v-if="!status" @click="getBargainList">点击加载更多</view>
</view>
<view class="noCommodity" style="background-color: #fff;" v-if="bargainLis.length === 0">
<!-- <view class="noCommodity" style="background-color: #fff;" v-if="bargainLis.length === 0">
<view class="noPictrue">
<image src="@/static/images/noGood.png" class="image" />
</view>
</view>
</view> -->
</view>
</template>
<script>
@ -79,6 +79,6 @@ export default {
<style >
page{
background: #eb3729;
background-color: rgb(245, 245, 245);
}
</style>

102
pages/home/index.vue
View File

@ -11,7 +11,7 @@
</view>
<view class="fixed-header-box"></view>
<view class="slider-banner banner">
<swiper indicatorDots="true" v-if="banner.length > 0" autoplay circular >
<swiper indicatorDots="true" v-if="banner.length > 0" autoplay circular>
<block v-for="(item, bannerIndex) in banner" :key="bannerIndex">
<swiper-item>
<view @click="goRoll(item)" class="swiper-item">
@ -21,7 +21,16 @@
</block>
</swiper>
</view>
<view class="news acea-row row-between-wrapper">
<view class="nav acea-row">
<view @click="goWxappUrl(item)" class="item" v-for="(item, menusIndex) in menus" :key="menusIndex">
<view class="pictrue">
<image :src="item.pic" />
</view>
<view>{{ item.name }}</view>
</view>
</view>
<view class="news acea-row ">
<view class="pictrue" v-if="$VUE_APP_RESOURCES_URL">
<image src="@/static/images/news.png" />
</view>
@ -41,20 +50,13 @@
</swiper>
</view>
</view>
<view class="nav acea-row">
<view @click="goWxappUrl(item)" class="item" v-for="(item, menusIndex) in menus" :key="menusIndex">
<view class="pictrue">
<image :src="item.pic" />
</view>
<view>{{ item.name }}</view>
</view>
</view>
<view class="wrapper hot" v-if="bastList.length > 0">
<view class="wrapper hot" v-if="likeInfo.length > 0">
<image class="bg" src="../../static/images/index-bg.png" mode="widthFix"></image>
<view class="title no-border acea-row row-between-wrapper">
<view class="text">
<view class="name line1">热门榜单</view>
</view>
<div class="text line1">
<span class="iconfont icon-remen"></span>
<span class="label">热门榜单</span>
</div>
<view @click="goHotNewGoods(2)" class="more">
更多
<text class="iconfont icon-jiantou"></text>
@ -77,7 +79,10 @@
<view class="wrapper" v-if="bastList.length > 0">
<view class="title no-border acea-row row-between-wrapper">
<view class="text">
<view class="name line1">精品推荐</view>
<div class="name line1">
<span class="iconfont icon-jingpintuijian"></span>
<span class="label">精品推荐</span>
</div>
</view>
<view @click="goHotNewGoods(1)" class="more">
更多
@ -91,8 +96,8 @@
<view class="title acea-row row-between-wrapper">
<view class="text">
<view class="name line1">
首发新品
<text class="new font-color-red">NEW~</text>
<span class="iconfont icon-xinpin"></span>
<span class="label">首发新品</span>
</view>
</view>
<view @click="goHotNewGoods(3)" class="more">
@ -117,7 +122,10 @@
<view class="wrapper" v-if="benefit.length > 0">
<view class="title acea-row row-between-wrapper">
<view class="text">
<view class="name line1">促销单品</view>
<div class="name line1 new-name">
<span class="iconfont icon-shoucang"></span>
<span class="txt">猜你喜欢</span>
</div>
</view>
<view @click="goGoodsPromotion(4)" class="more">
更多
@ -131,7 +139,11 @@
</template>
<script>
// import { swiper, swiperSlide } from "vue-awesome-swiper";
import { mapState, mapMutations, mapActions } from 'vuex';
import {
mapState,
mapMutations,
mapActions
} from 'vuex';
import GoodList from '@/components/GoodList';
import PromotionGood from '@/components/PromotionGood';
@ -258,8 +270,8 @@
},
methods: {
...mapActions(["getLocation"]),
goRoll(item){
if(item.uniapp_url){
goRoll(item) {
if (item.uniapp_url) {
this.$yrouter.push(item.uniapp_url)
}
},
@ -292,7 +304,7 @@
setOpenShare: function() {},
startQr: function() {
uni.scanCode({
success: (res) =>{
success: (res) => {
let option = handleUrlParam(res.result)
console.log(option)
@ -302,27 +314,39 @@
switch (option.pageType) {
case 'good':
// 跳转商品详情
this.$yrouter.push({path:'/pages/shop/GoodsCon/index',query:{
q:res.result
}});
this.$yrouter.push({
path: '/pages/shop/GoodsCon/index',
query: {
q: res.result
}
});
break;
case 'group':
// 跳转团购
this.$yrouter.push({path:'/pages/activity/GroupRule/index',query:{
q:res.result
}});
this.$yrouter.push({
path: '/pages/activity/GroupRule/index',
query: {
q: res.result
}
});
break;
case 'dargain':
// 跳转砍价
this.$yrouter.push({path:'/pages/activity/DargainDetails/index',query:{
q:res.result
}});
this.$yrouter.push({
path: '/pages/activity/DargainDetails/index',
query: {
q: res.result
}
});
break;
default:
// 跳转分销
this.$yrouter.push({path:'/pages/Loading/index',query:{
this.$yrouter.push({
path: '/pages/Loading/index',
query: {
}});
}
});
break;
}
@ -342,17 +366,17 @@
height: 100%;
}
.fixed-header{
.fixed-header {
position: fixed;
z-index: 99;
top:0;
left:0;
right:0;
top: 0;
left: 0;
right: 0;
background: #fff;
box-shadow: 0 0 20rpx -10rpx #aaa;
&+.fixed-header-box{
height:98rpx
&+.fixed-header-box {
height: 98rpx
}
}
</style>

BIN
static/images/news.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 4.5 KiB

After

Width:  |  Height:  |  Size: 18 KiB

BIN
static/images/share-info.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 7.8 KiB

2
utils/request.js
View File

@ -65,7 +65,7 @@ function baseRequest(options) {
if (res.status !== 200) {
return Promise.reject({ msg: "请求失败", res, data });
}
if ([410000, 410001, 410002].indexOf(data.status) !== -1) {
if ([401, 403].indexOf(data.status) !== -1) {
handleLoginFailure();
return Promise.reject({ msg: res.data.msg, res, data, toLogin: true });
} else if (data.status === 200) {