zhuce
/
lilishop-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改样式 和查看虚拟实物

master
夜良king 2021-12-31 18:22:30 +08:00
parent 35de0c031d
commit fada0a735f
5 changed files with 86 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
buyer/src/components/goodsDetail/ShowGoods.vue
View File

@ -7,6 +7,8 @@
<div class="item-detail-big-img">
<pic-zoom :url="imgList[imgIndex].url" :scale="2"></pic-zoom>
</div>
<div v-if="skuDetail.goodsType !== 'VIRTUAL_GOODS'" style="margin-top:10px;rgb(153, 149, 149);">实物商品</div>
<div v-else-if="skuDetail.goodsType == 'VIRTUAL_GOODS'" style="margin-top:10px;rgb(153, 149, 149);">虚拟商品</div>
<div class="item-detail-img-row">
<div
class="item-detail-img-small"

16
buyer/src/components/nav/CateNav.vue
View File

@ -4,14 +4,15 @@
<div class="all-categories hover-pointer" @mouseenter="showFirstList = true" @mouseleave="showFirstList = false">全部商品分类</div>
<ul class="nav-item" v-if="showNavBar">
<li
class ="nav-lis"
v-for="(item, index) in navList.list"
:key="index"
@click="linkTo(item.url)"
>
{{ item.name }}
</li>
</ul>
</div>
</ul>
</div> <hr style="width:1200px;height:2px;background:#e4393c;margin-top:-1px;margin-bottom:5px;"/>
<!-- 全部商品分类 -->
<div class="cate-list" v-show="showAlways || showFirstList" @mouseenter="showFirstList = true" @mouseleave="showFirstList = false">
<!-- 第一级分类 -->
@ -155,6 +156,10 @@ export default {
</script>
<style scoped lang="scss">
.nav-lis:hover{
color:#e4393c !important;
cursor: pointer;
}
.cate-nav{
width: 1200px;
position: relative;
@ -170,9 +175,10 @@ export default {
width: 200px;
line-height: 40px;
color: #fff;
background-color: $theme_color;
background-color: #e4393c;
text-align: center;
font-size: 16px;
border-bottom:none;
}
.nav-item {
width: 1000px;
@ -180,13 +186,13 @@ export default {
line-height: 40px;
overflow: hidden;
list-style: none;
background-color: #eee;
// background-color: #eee;
display: flex;
li {
float: left;
font-weight: bold;
margin-left: 20px;
color: rgb(89, 88, 88);
color: rgb(129, 127, 127);
font-size: 15px;
&:hover {
color: $theme_color;

47
buyer/src/components/nav/GoodsClassNav.vue
View File

@ -414,7 +414,7 @@ export default {
font-size: 18px;
font-weight: bold;
&:hover {
color: $theme_color;
color: #e4393c;
cursor: pointer;
}
}
@ -428,8 +428,8 @@ export default {
text-align: center;
margin: 0 3px;
&:hover {
color: $theme_color;
border-color: $theme_color;
color: #e4393c;
border-color: #e4393c;
border-bottom-color: #fff;
cursor: pointer;
ul {
@ -447,7 +447,7 @@ export default {
width: 300px;
padding: 5px 10px;
background: #fff;
border: 1px solid $theme_color;
border: 1px solid #e4393c;
z-index: 1;
&::before {
content: "";
@ -470,7 +470,7 @@ export default {
margin: 3px 0;
text-align: left;
&:hover {
color: $theme_color;
color: #e4393c;
cursor: pointer;
}
}
@ -489,23 +489,23 @@ export default {
background-color: #f3f3f3;
border: 1px solid #ddd;
&:hover {
border-color: $theme_color;
border-color: #e4393c;
background-color: #fff;
.ivu-icon {
color: #fff;
background-color: $theme_color;
background-color: #e4393c;
}
}
span:nth-child(2) {
color: $theme_color;
color: #e4393c;
}
.ivu-icon {
position: absolute;
right: 0;
top: 0;
color: $theme_color;
color: #e4393c;
line-height: 22px;
width: 21px;
height: 22px;
@ -545,7 +545,7 @@ export default {
width: 100px;
height: 50px;
float: left;
line-height: 50px;
line-height: 45px;
border: 1px solid #ddd;
margin: -1px -1px 0 0;
overflow: hidden;
@ -557,7 +557,8 @@ export default {
}
&:hover {
border-color: $theme_color;
border-color: #e4393c;
border: 2px solid #e4393c;
top: 0;
left: 0;
position: relative;
@ -571,7 +572,7 @@ export default {
display: inline-block;
width: 100%;
height: 100%;
color: $theme_color;
color: #e4393c;
text-align: center;
font-size: 12px;
cursor: pointer;
@ -584,7 +585,7 @@ export default {
div {
width: 0;
border-top: 20px solid transparent;
border-right: 20px solid $theme_color;
border-right: 20px solid #e4393c;
}
.ivu-icon {
font-size: 12px;
@ -597,7 +598,7 @@ export default {
}
}
.border-color {
border-color: $theme_color;
border-color: #e4393c;
z-index: 1;
}
}
@ -619,8 +620,8 @@ export default {
font-size: 12px;
&:hover {
cursor: pointer;
color: $theme_color;
border-color: $theme_color;
color: #e4393c;
border-color: #e4393c;
}
}
}
@ -666,14 +667,14 @@ export default {
height: 30px;
float: left;
line-height: 30px;
color: $primary_color;
color:#4d9cf1;
overflow: hidden;
position: relative;
font-size: 12px;
padding: 2px;
cursor: pointer;
&:hover {
color: $theme_color;
color: #e4393c;
}
}
}
@ -695,8 +696,8 @@ export default {
font-size: 12px;
&:hover {
cursor: pointer;
color: $theme_color;
border-color: $theme_color;
color: #e4393c;
border-color: #e4393c;
}
}
}
@ -716,11 +717,13 @@ export default {
}
.more-options{
margin: 5px;
color: #2d8cf0;
color: #4d9cf1;
font-size: 12px;
cursor: pointer;
text-align: right;
}
.more-options:hover{
color:#0165d1;
}
/** 其他筛选项 end */
</style>

54
buyer/src/pages/GoodsList.vue
View File

@ -68,8 +68,14 @@
已有<span>{{ item.content.commentNum || 0 }}</span
>人评价
</div>
<div class="goods-show-seller">
<Tag class="goods-show-buyer" v-if="item.content.selfOperated" size="default" color="error">自营</Tag>{{ item.content.storeName }}
<div class="goods-show-seller" >
<Tag class="goods-show-buyer" v-if="item.content.selfOperated" size="default" color="error">自营
</Tag>
<div class="goods-show-right" >
<div class="goods-show-middle" v-if="goodsListType.content.goodsType == 'VIRTUAL_GOODS'">虚拟</div>
<div class="goods-show-middle" v-else-if="goodsListType.content.goodsType == 'PHYSICAL_GOODS'">实物</div>
</div>
<span class="text-bottom" style="color:#e4393c;">{{ item.content.storeName }}</span>
</div>
</div>
</div>
@ -112,6 +118,7 @@ export default {
],
goodsList: [], // 商品列表
loading: false, // 加载状态
goodsListType:"",
total: 0, // 列表总数
params: { // 请求参数
pageNumber: 0,
@ -178,6 +185,9 @@ export default {
if (res.success) {
this.goodsList = res.result.content;
this.total = res.result.totalElements;
for(var i = 0;i<this.goodsList.length; i++){
this.goodsListType = this.goodsList[i];
}
}
}).catch(() => {
this.loading = false;
@ -210,16 +220,24 @@ export default {
.goods-show-info>.goods-show-seller>.goods-show-buyer{
height:16px;width:30px;
white-space: nowrap;
line-height:16px;
line-height:17px;
text-align: center;
padding:0 3px;
background-color:#E23A3A;
}
.goods-show-seller{
// padding:3px 0;
vertical-align: middle;
}
.container {
margin: 15px auto;
width: 1200px;
min-width: 1000px;
position: relative;
}
.price-sort:hover{
color:#E23A3A;
}
.goods-box {
display: flex;
}
@ -228,10 +246,32 @@ export default {
width: 200px;
border: 1px solid #ccc;
}
.goods-show-right{
width:35px;
height:17px;
// vertical-align:middle;
overflow: hidden;
margin-top:1.5px;
margin-right: 5px;
line-height: 16px;
background:white;
border-radius:4px;
margin-bottom:5px;
float:left;
text-align:center;
border:1px solid rgba(112, 123, 187, 0.8);
color:rgba(112, 123, 187, 0.8);
}
.goods-show-middle:hover{
color:rgba(2, 15, 88, 0.6);
border:0.2px solid rgba(0, 13, 87, 0.6);
border-radius:4px;
line-height: 18px;
}
.item-as-title {
width: 100%;
height: 36px;
color: $theme_color;
color: #e4393c;
line-height: 36px;
font-size: 18px;
}
@ -242,7 +282,7 @@ export default {
float: right;
margin-right: 15px;
font-size: 10px;
color: #ccc;
color: rgb(204, 204, 204);
}
.item-as {
width: 160px;
@ -332,7 +372,7 @@ export default {
background-color: #fff;
}
.goods-list-tool span:hover {
border-color: $theme_color;
border-color: #e4393c;
position: relative;
text-decoration: none;
z-index: 1;
@ -344,7 +384,7 @@ export default {
.goods-list-tool-active {
color: #fff;
border-left: 1px solid #ccc;
background-color: $theme_color !important;
background-color: #e4393c !important;
}
/* ---------------商品栏结束------------------- */

2
manager/src/styles/common.scss
View File

@ -93,7 +93,7 @@ ul,li{
$success_color: #68cabe;
$warning_color: #fa6419;
$error_color: #ff3c2a;
$theme_color: #FF5C58;
$theme_color: #FF5C58;
.theme_color {
color: $theme_color !important;
}