You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
103 lines
2.0 KiB
103 lines
2.0 KiB
<template>
|
|
<view class="head">
|
|
<view class="df aic jcsa">
|
|
<div class="df">
|
|
<div class="time">2023.09.12-2023.10.12</div>
|
|
<u-icon name="arrow-down"></u-icon>
|
|
</div>
|
|
</view>
|
|
<view class="xuknm"></view>
|
|
<view class="">
|
|
<u-tabs :list="list1" lineWidth=0 :activeStyle="{
|
|
width:'142rpx',
|
|
height:'50rpx',
|
|
background:'#21BBF3',
|
|
borderRadius:'30rpx',
|
|
display:'flex',
|
|
alignItems:'center',
|
|
justifyContent:'space-around',
|
|
color:'#fff',
|
|
fontWeight:'400',
|
|
fontSize:'20rpx',
|
|
lineHeight:'28rpx',
|
|
}" :inactiveStyle="{
|
|
width:'142rpx',
|
|
height:'50rpx',
|
|
background:'#FFFFFF',
|
|
borderRadius:'30rpx',
|
|
border:'2rpx solid #EBEBEB',
|
|
fontSize:'20rpx',
|
|
fontWeight:'400',
|
|
color:'#222222',
|
|
lineHeight:'28rpx',
|
|
display:'flex',
|
|
alignItems:'center',
|
|
justifyContent:'space-around',
|
|
}" @click="click"></u-tabs>
|
|
<commodity v-if="index==0"></commodity>
|
|
<classify v-if="index==1"></classify>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import commodity from "./commodity.vue"
|
|
import classify from "./classify.vue"
|
|
export default {
|
|
components:{
|
|
commodity,classify
|
|
},
|
|
data() {
|
|
return {
|
|
index:0,
|
|
list1:[
|
|
{name:'商品'},
|
|
{name:'分类'}
|
|
]
|
|
};
|
|
},
|
|
methods: {
|
|
click(item) {
|
|
console.log('item', item);
|
|
this.index=item.index
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
::v-deep{
|
|
.u-tabs__wrapper__nav{
|
|
width: 100% !important;
|
|
|
|
}
|
|
.u-tabs__wrapper__nav__item{
|
|
padding: 0 90rpx !important;
|
|
}
|
|
}
|
|
.head{
|
|
padding: 40rpx 32rpx 32rpx 32rpx;
|
|
margin: 0 auto;
|
|
margin-top: 24rpx;
|
|
width: 702rpx;
|
|
height: 1256rpx;
|
|
background: #FFFFFF;
|
|
box-sizing: border-box;
|
|
border-radius: 16rpx;
|
|
.time{
|
|
margin-right: 12rpx;
|
|
font-size: 24rpx;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #585858;
|
|
line-height: 34rpx;
|
|
}
|
|
.xuknm{
|
|
width: 638rpx;
|
|
height: 2rpx;
|
|
background: #F2F2F2;
|
|
border-radius: 16rpx;
|
|
margin: 28rpx 0 30rpx 0;
|
|
}
|
|
}
|
|
</style>
|
|
|