Skip to content

M
mallapp
Commit 38c2e88b authored by zhengke's avatar zhengke
Browse files
Options

修改

parent fd33398d
Hide whitespace changes
Inline Side-by-side
Showing with 222 additions and 240 deletions
components/goods/style5.vue
View file @ 38c2e88b
...@@ -107,7 +107,7 @@ export default { ...@@ -107,7 +107,7 @@ export default {
.her-scoller { .her-scoller {
overflow-x: auto !important; overflow-x: auto !important;
padding: 12px; padding: 12px;
display: flex; /* display: flex; */
white-space: nowrap; white-space: nowrap;
} }
/* .her-scoller::after { /* .her-scoller::after {
...@@ -122,6 +122,7 @@ export default { ...@@ -122,6 +122,7 @@ export default {
border: 1rpx solid transparent; border: 1rpx solid transparent;
border-radius: 10rpx; border-radius: 10rpx;
padding-bottom: 10rpx; padding-bottom: 10rpx;
display:inline-block;
/* float: left; */ /* float: left; */
} }
.her-scoller .good-five .tips { .her-scoller .good-five .tips {
......
components/study/style5.vue
View file @ 38c2e88b
...@@ -8,12 +8,10 @@ ...@@ -8,12 +8,10 @@
'padding-right':goodsInfo.PaddingRight+'px', 'padding-right':goodsInfo.PaddingRight+'px',
'padding-bottom':goodsInfo.PaddingBottom+'px', 'padding-bottom':goodsInfo.PaddingBottom+'px',
'padding-left':goodsInfo.PaddingLeft+'px', 'padding-left':goodsInfo.PaddingLeft+'px',
}"> }">
<view class="good-five" @click="openGood(item)" v-for="(item, gli) in goodsInfo.list" :style="{borderRadius:goodsInfo.SearchFilletPX==0?10:goodsInfo.SearchFilletPX+'px'}" :key="gli"> <view class="myStudy_five_study" @click="openGood(item)" v-for="(item, gli) in goodsInfo.list" :style="{borderRadius:goodsInfo.SearchFilletPX==0?10:goodsInfo.SearchFilletPX+'px'}" :key="gli">
<view class="img-box"> <view class="img-box">
<view class="img-show"> <image style="width: 100%; height: 100%;" mode="aspectFill" :src="item.picUrl" />
<image style="width: 100%; height: 100%;" mode="aspectFill" :src="item.picUrl" />
</view>
</view> </view>
<view class="good-info"> <view class="good-info">
<view class="good-name" v-if="item.name">{{ item.name }}</view> <view class="good-name" v-if="item.name">{{ item.name }}</view>
...@@ -68,86 +66,77 @@ ...@@ -68,86 +66,77 @@
</script> </script>
<style> <style>
.her-scoller-study { .myStudy_five_study {
padding: 12px; position: relative;
} margin-bottom: 14px;
.her_Two_study{ display: flex;
overflow-x: auto !important; box-sizing: border-box;
display: flex; padding: 0 1px 1px 0;
white-space: nowrap; width:600px;
} }
.her-scoller-study .good-five { .myStudy_five_study:last-child{
position: relative; margin-bottom:0!important;
margin-right: 12px; }
width: 30%; .myStudy_five_study .img-box {
border-radius: 10rpx; width: 110px;
padding-bottom: 10rpx; height: 70px;
overflow: hidden; border-radius: 4px;
} overflow: hidden;
.her-scoller-study .good-five .tips { box-shadow: 0 4px 10px 1px #D2D2D2;
width: 64rpx; }
height: 64rpx;
position: absolute; .myStudy_five_study .good-info {
top: 0; padding: 0 12px 12px 12px;
left: 0; flex: 1;
z-index: 4; border: 10rpx;
} padding-bottom: 0;
.her-scoller-study .good-five .img-box { display: flex;
width: 100%; flex-direction: column;
height: 0; /* width:20%; */
padding-top: 100%; }
position: relative;
} .myStudy_five_study .good-info .good-name {
.her-scoller-study .good-five .img-box .img-show { font-size: 13px;
position: absolute; margin-bottom:5px;
left: 0; overflow: hidden;
top: 0; text-overflow: ellipsis;
bottom: 0; -webkit-line-clamp: 1;
right: 0; -webkit-box-orient: vertical;
width: 100%; display: inline-block;
height: 100%; width:130px;
overflow: hidden; }
z-index: 2;
} .myStudy_five_study .good-info .good-price-info {
.her-scoller-study .good-five .guding { display: flex;
position: relative; justify-items: center;
} padding-bottom: 10rpx;
.her-scoller-study .good-five .guding .img-box { }
position: absolute;
left: 0; .myStudy_five_study .good-info .good-price-info .price {
right: 0; color: #999999;
bottom: 0; flex: 1;
top: 0; font-size: 14px;
} white-space: nowrap;
.her-scoller-study .good-five .good-info { text-overflow: ellipsis;
padding: 6rpx; overflow: hidden;
padding-bottom: 0; }
}
.her-scoller-study .good-five .good-info .good-name { .myStudy_five_study .good-info .good-price-info .buy {
overflow: hidden; width: 24px;
text-overflow: ellipsis; text-align: right;
display: block; }
-webkit-line-clamp: 2; .her_Two_study {
-webkit-box-orient: vertical; overflow-x: auto !important;
margin-bottom: 4rpx; display: flex;
font-size: 13px; white-space: nowrap;
width: 100%; }
} .style_five_label{
.her-scoller-study .good-five .good-info .good-price-info { float:left;
display: flex; padding: 2px 4px;
justify-items: center; border-radius: 2px;
align-items: center; font-size: 10px;
} color: #FAF8F9;
.her-scoller-study .good-five .good-info .good-price-info .price { margin:0 5px 5px 0;
color: #999999; }
flex: 1;
font-size: 12px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
.her-scoller-study .good-five .good-info .good-price-info .buy {
width: 24px;
text-align: right;
}
</style> </style>
components/studyArticle/style5.vue
View file @ 38c2e88b
<template> <template>
<view class="her-scoller-study" :style="{ <view style="width:100%;padding: 12px;" :style="{
'background-color': goodsInfo.backgroundColor 'background-color': goodsInfo.backgroundColor,
}"> }">
<view class="her_Two_study" :style="{ <view class="her_Two_study" :style="{
'background-color': goodsInfo.backgroundColor, 'padding-top':goodsInfo.PaddingTop+'px',
'padding-top':goodsInfo.PaddingTop+'px', 'padding-right':goodsInfo.PaddingRight+'px',
'padding-right':goodsInfo.PaddingRight+'px', 'padding-bottom':goodsInfo.PaddingBottom+'px',
'padding-bottom':goodsInfo.PaddingBottom+'px', 'padding-left':goodsInfo.PaddingLeft+'px'
'padding-left':goodsInfo.PaddingLeft+'px', }">
}"> <view class="good-five-stydy" v-for="(item, gli) in goodsInfo.list" :key="gli" :style="{'borderRadius':goodsInfo.SearchFilletPX+'px'}" @click="openGood(item)">
<view class="good-five" @click="openGood(item)" v-for="(item, gli) in goodsInfo.list" :style="{borderRadius:goodsInfo.SearchFilletPX==0?10:goodsInfo.SearchFilletPX+'px'}" :key="gli"> <view class="img-box">
<view class="img-box"> <image style="width: 100%; height: 100%;" mode="aspectFill" :src="item.picUrl" />
<view class="img-show"> </view>
<image style="width: 100%; height: 100%;" mode="aspectFill" :src="item.picUrl" /> <view class="good-info">
</view> <view class="good-name" v-if="item.name">{{ item.name }}</view>
</view> <view style="overflow: hidden;">
<view class="good-info"> <view class="style_five_label"
<view class="good-name" v-if="item.name">{{ item.name }}</view> :style="{background:mainColor}" v-for="(subItem,subIndex) in item.lableNameList" :key="subIndex">
<view> {{subItem}}
<view style="display:inline-block;padding: 2px 4px;border-radius: 2px;font-size: 10px;color: #FAF8F9;margin-right:5px" </view>
:style="{background:mainColor}" v-for="(subItem,subIndex) in item.lableNameList" :key="subIndex"> </view>
{{subItem}} </view>
</view> </view>
</view> </view>
</view> <auth v-if="showAuth" @changeuserinfo="reloadUserinfo" @gbAuth="gbAuth"></auth>
</view> </view>
</view> </template>
<auth v-if="showAuth" @changeuserinfo="reloadUserinfo" @gbAuth="gbAuth"></auth>
</view> <script>
</template> import goodSku from '../goods/goodsku';
<script> import auth from '@/components/auth/index.vue';
import auth from '@/components/auth/index.vue'; export default {
export default { components: {
components: { auth
auth },
}, props: ['goodsInfo'],
props: ['goodsInfo'], data() {
data() { return {
return { mainColor: '',
mainColor: '', showAuth: false,
showAuth: false, u: {},
u: {}, };
}; },
}, created() {
created() { this.mainColor = this.$uiConfig.mainColor;
this.mainColor = this.$uiConfig.mainColor;
}, },
methods: { mounted(){
openGood(item) {
this.u = uni.getStorageSync('mall_UserInfo'); },
methods: {
openGood(item) {
uni.navigateTo({ url: "/pages/school/articleDetails?ID=" + item.id }); this.u = uni.getStorageSync('mall_UserInfo');
},
reloadUserinfo() { uni.navigateTo({ url: "/pages/school/articleDetails?ID=" + item.id });
this.u = uni.getStorageSync('mall_UserInfo');
// this.showAuth = false; },
}, reloadUserinfo() {
//关闭登录窗口 this.u = uni.getStorageSync('mall_UserInfo');
gbAuth() { // this.showAuth = false;
this.showAuth = false; },
} //关闭登录窗口
} gbAuth() {
}; this.showAuth = false;
</script> }
}
<style> };
.her-scoller-study { </script>
padding: 12px;
} <style>
.her_Two_study{ .good-five-stydy {
overflow-x: auto !important; position: relative;
display: flex; margin-bottom: 14px;
white-space: nowrap; display: flex;
} box-sizing: border-box;
.her-scoller-study .good-five { padding: 0 1px 1px 0;
position: relative; width:600px;
margin-right: 12px; }
width: 30%; .good-five-stydy:last-child{
padding-bottom: 10rpx; margin-bottom:0!important;
/* border:1px solid rgb(226, 226, 226); */ }
overflow: hidden; .good-five-stydy .img-box {
} width: 110px;
.her-scoller-study .good-five .tips { height: 70px;
width: 64rpx; border-radius: 4px;
height: 64rpx; overflow: hidden;
position: absolute; box-shadow: 0 4px 10px 1px #D2D2D2;
top: 0; }
left: 0;
z-index: 4; .good-five-stydy .good-info {
} padding: 0 12px 12px 12px;
.her-scoller-study .good-five .img-box { flex: 1;
width: 100%; border: 10rpx;
height: 0; padding-bottom: 0;
padding-top: 100%; display: flex;
position: relative; flex-direction: column;
} /* width:20%; */
.her-scoller-study .good-five .img-box .img-show { }
position: absolute;
left: 0; .good-five-stydy .good-info .good-name {
top: 0; font-size: 13px;
bottom: 0; margin-bottom:5px;
right: 0; overflow: hidden;
width: 100%; text-overflow: ellipsis;
height: 100%; -webkit-line-clamp: 1;
overflow: hidden; -webkit-box-orient: vertical;
z-index: 2; display: inline-block;
} width:130px;
.her-scoller-study .good-five .guding { }
position: relative;
} .good-five-stydy .good-info .good-price-info {
.her-scoller-study .good-five .guding .img-box { display: flex;
position: absolute; justify-items: center;
left: 0; align-items: flex-end;
right: 0; height: 22px;
bottom: 0; flex: 1;
top: 0; padding-bottom: 10rpx;
} }
.her-scoller-study .good-five .good-info {
padding: 6rpx; .good-five-stydy .good-info .good-price-info .price {
padding-bottom: 0; color: #999999;
} flex: 1;
.her-scoller-study .good-five .good-info .good-name { font-size: 14px;
overflow: hidden; white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
display: block; overflow: hidden;
-webkit-line-clamp: 2; }
-webkit-box-orient: vertical;
margin-bottom: 4rpx; .good-five-stydy .good-info .good-price-info .buy {
font-size: 13px; width: 24px;
width: 100%; text-align: right;
} }
.her-scoller-study .good-five .good-info .good-price-info { .her_Two_study { overflow-x: auto !important; display: flex; white-space: nowrap; }
display: flex; .style_five_label{
justify-items: center; float:left;
align-items: center; padding: 2px 4px;
} border-radius: 2px;
.her-scoller-study .good-five .good-info .good-price-info .price { font-size: 10px;
color: #999999; color: #FAF8F9;
flex: 1; margin:0 5px 5px 0;
font-size: 12px; }
white-space: nowrap; </style>
text-overflow: ellipsis;
overflow: hidden;
}
.her-scoller-study .good-five .good-info .good-price-info .buy {
width: 24px;
text-align: right;
}
</style>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment