Compare commits
3 Commits
6703db7cc5
...
399eba7335
| Author | SHA1 | Date | |
|---|---|---|---|
| 399eba7335 | |||
| 55bff8f100 | |||
| 627006ff53 |
@ -120,23 +120,23 @@
|
||||
width: 100%;
|
||||
height: 458rpx;
|
||||
margin-top: -88rpx;
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/fea9ad54f32d4705a633874efd534e70e507030ea5a7604b0110fdf7292f1f4d.png');
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/60fc2b85464857c82643d346c4ef6b387e4e4d3d923b4816b717e0d645454491.jpg');
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.lvv{
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/ed254fe4a03c16933e608f8adeb3e700a24ec4620064746a516c10da395b9395.png') !important;
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/d7527e651cf2aef01871872e3e808f30ccddcb9a59c4db1e6d8f038216515d15.jpg') !important;
|
||||
background-size: 100% 100% !important;
|
||||
}
|
||||
.bluev{
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/8728b7f2de5a0d2d8a74ef0c17a275f82b265a3d8d11993ec7c424c3ad454f0b.png') !important;
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/27d4737ae9482948b0336d0e6f63e887dd70ad192f4c727cdd6ff37409a94765.jpg') !important;
|
||||
background-size: 100% 100% !important;
|
||||
}
|
||||
.pinkv{
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/b44a3035cd4f676504a7003607bfb9aa457ffe1335c12d1e26dcffb45e3bfec8.png') !important;
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/4934eb152ba1302ce28963b1bc554caff9b31bac04596dfc04058435e48cbf8f.jpg') !important;
|
||||
background-size: 100% 100% !important;
|
||||
}
|
||||
.orangev{
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/ebc89def2a0cf1db1ce6b5aec26407e24e49c85dcf81a1d1c759afe414da033f.png') !important;
|
||||
background: url('https://zysc.fjptzykj.com:3000/shangcheng/d317e16aa7a7497e5bf410ca7f8b8d96698bd83ed6b382aa9d40229dddac7060.jpg') !important;
|
||||
background-size: 100% 100% !important;
|
||||
}
|
||||
.list-content {
|
||||
@ -194,7 +194,8 @@
|
||||
font-weight: 500;
|
||||
width: auto;
|
||||
height: auto;
|
||||
background: linear-gradient(90deg, #ff6600 0%, #fe832a 100%);
|
||||
// background: linear-gradient(90deg, #ff6600 0%, #fe832a 100%);
|
||||
background:#e93422;
|
||||
color: #ffffff;
|
||||
border-radius: 19rpx;
|
||||
padding: 4rpx 14rpx;
|
||||
@ -236,8 +237,8 @@
|
||||
border-radius: 25rpx;
|
||||
font-size: 24rpx;
|
||||
color: #fff;
|
||||
background: linear-gradient(90deg, #ff6600 0%, #fe832a 100%);
|
||||
// background: rgba(72,204,82);
|
||||
// background: linear-gradient(90deg, #ff6600 0%, #fe832a 100%);
|
||||
background: #e93422;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -185,11 +185,15 @@ const kefuName = ref('众悦商城客服');
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
.chat-wrap {
|
||||
|
||||
::v-deep(.chat-wrap){
|
||||
.ui-bar{
|
||||
position: fixed !important;
|
||||
width: 100%;
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
.page-bg {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: var(--ui-BG-Main);
|
||||
|
||||
@ -6,8 +6,12 @@
|
||||
<!-- 商品分类（左） -->
|
||||
<scroll-view class="side-menu-wrap" scroll-y :style="[{ height: pageHeight + 'px' }]">
|
||||
<view class="menu-item ss-flex" v-for="(item, index) in state.categoryList" :key="item.id"
|
||||
:class="[{ 'menu-item-active': index === state.activeMenu }]" @tap="onMenu(index)">
|
||||
<view class="menu-title ss-line-1">
|
||||
:class="[
|
||||
{ 'menu-item-active': index === state.activeMenu && state.themeType == '' },
|
||||
{ [state.themeType + 'vv']: index === state.activeMenu && state.themeType }
|
||||
]"
|
||||
@tap="onMenu(index)">
|
||||
<view class="menu-title ss-line-1" :class="state.themeType && index === state.activeMenu ? `${state.themeType}v` : ''">
|
||||
{{ item.name }}
|
||||
</view>
|
||||
</view>
|
||||
@ -25,7 +29,7 @@
|
||||
:activeMenu="state.activeMenu" />
|
||||
<!-- 样式2 -->
|
||||
<second-second ref="secondRef" v-show="state.typeId === '2'" :data="state.categoryList"
|
||||
:activeMenu="state.activeMenu" />
|
||||
:activeMenu="state.activeMenu" :vl="state.themeType" />
|
||||
|
||||
<uni-load-more v-if="
|
||||
(state.style === 'first_one' || state.style === 'first_two') &&
|
||||
@ -60,6 +64,7 @@
|
||||
import {
|
||||
handleTree
|
||||
} from '@/sheep/util';
|
||||
const app = computed(() => sheep.$store('app'));
|
||||
const state = reactive({
|
||||
style: 'second_one', // first_one（一级 - 样式一）, first_two（二级 - 样式二）, second_one（二级）
|
||||
categoryList: [], // 商品分类树
|
||||
@ -73,9 +78,9 @@
|
||||
pageSize: 6,
|
||||
},
|
||||
loadStatus: '',
|
||||
typeId:'1'
|
||||
typeId:'1',
|
||||
themeType:app.value.platform.themeType
|
||||
});
|
||||
const app = computed(() => sheep.$store('app'));
|
||||
state.typeId = app.value.platform.goodsType;//判断是什么样式
|
||||
// console.log(app.value.platform.goodsType,"------------------------")
|
||||
const secondRef = ref(null);
|
||||
@ -102,7 +107,7 @@
|
||||
const onMenu = (val) => {
|
||||
state.activeMenu = val;
|
||||
if (state.style === 'second_one' && secondRef.value) {
|
||||
secondRef.value.onFilterItem(state.categoryList[state.activeMenu].children[0].id);
|
||||
secondRef.value.onFilterItem(state.categoryList[state.activeMenu].children[0].id,0);
|
||||
}
|
||||
if (state.style === 'first_one' || state.style === 'first_two') {
|
||||
state.pagination.pageNo = 1;
|
||||
@ -153,6 +158,9 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
|
||||
|
||||
.s-category {
|
||||
:deep() {
|
||||
.side-menu-wrap {
|
||||
@ -242,4 +250,64 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* 主题颜色 */
|
||||
|
||||
.lvv{
|
||||
color:rgba(72,204,82) !important;
|
||||
}
|
||||
.bluev{
|
||||
color:rgba(28,165,233) !important;
|
||||
}
|
||||
.pinkv{
|
||||
color:#ff448f !important;
|
||||
}
|
||||
.orangev{
|
||||
color:#fe5c2d !important;
|
||||
}
|
||||
|
||||
.lvvv{
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 2px;
|
||||
height: 100%;
|
||||
background:rgba(72,204,82) !important;
|
||||
}
|
||||
}
|
||||
.bluevv{
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 2px;
|
||||
height: 100%;
|
||||
background:rgba(28,165,233);
|
||||
}
|
||||
}
|
||||
.pinkvv{
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 2px;
|
||||
height: 100%;
|
||||
background:#ff448f !important;
|
||||
}
|
||||
}
|
||||
.orangevv{
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 2px;
|
||||
height: 100%;
|
||||
background:#fe5c2d !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -3,7 +3,11 @@
|
||||
<view>
|
||||
<view class="top_class">
|
||||
<scroll-view scroll-x class="scroll">
|
||||
<view @click="onFilterItem(item.id)" class="list on"
|
||||
<view @click="onFilterItem(item.id,index)" class="list"
|
||||
:class="[
|
||||
{ 'on': index == state.currItem && props.vl == '' },
|
||||
{ [props.vl + 'v']: index == state.currItem && props.vl }
|
||||
]"
|
||||
v-for="(item, index) in props.data[activeMenu].children" :key="index">
|
||||
{{item.name}}
|
||||
</view>
|
||||
@ -42,7 +46,11 @@
|
||||
</view>
|
||||
</view>
|
||||
<slot name="cart">
|
||||
<view class="buy-box ss-flex ss-col-center ss-row-center"> 去购买</view>
|
||||
<view class="buy-box ss-flex ss-col-center ss-row-center"
|
||||
:class="[
|
||||
{ [props.vl + 'v']: props.vl }
|
||||
]"
|
||||
> 去购买</view>
|
||||
</slot>
|
||||
</view>
|
||||
</view>
|
||||
@ -89,6 +97,10 @@
|
||||
default: () => ({}),
|
||||
},
|
||||
activeMenu: [Number, String],
|
||||
vl: {
|
||||
type: String,
|
||||
default:''
|
||||
},
|
||||
});
|
||||
|
||||
const state = reactive({
|
||||
@ -106,14 +118,17 @@
|
||||
iconStatus: false, // true - 单列布局；false - 双列布局
|
||||
keyword: '',
|
||||
categoryId: 0,
|
||||
loadStatus: ''
|
||||
loadStatus: '',
|
||||
currItem:0
|
||||
});
|
||||
|
||||
// 清空列表
|
||||
function emptyList() {
|
||||
state.pagination.list = [];
|
||||
}
|
||||
const onFilterItem = (id) => {
|
||||
const onFilterItem = (id,index) => {
|
||||
console.log(index,"indexindex")
|
||||
state.currItem = index
|
||||
// 清空 + 加载数据
|
||||
emptyList();
|
||||
getList(id);
|
||||
@ -166,6 +181,24 @@
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
.lvv{
|
||||
background:rgba(72,204,82) !important;
|
||||
color:white !important;
|
||||
}
|
||||
.bluev{
|
||||
background:rgba(28,165,233) !important;
|
||||
color:white !important;
|
||||
}
|
||||
.pinkv{
|
||||
background:#ff448f !important;
|
||||
color:white !important;
|
||||
}
|
||||
.orangev{
|
||||
background:#fe5c2d !important;
|
||||
color:white !important;
|
||||
}
|
||||
|
||||
//lg
|
||||
.lg-goods-card {
|
||||
overflow: hidden;
|
||||
|
||||
@ -604,7 +604,8 @@
|
||||
z-index: 2;
|
||||
width: 68rpx;
|
||||
height: 38rpx;
|
||||
background: linear-gradient(90deg, #fe832a 0%, #ff6600 100%);
|
||||
// background: linear-gradient(90deg, #fe832a 0%, #ff6600 100%);
|
||||
background: #e93422;
|
||||
border-radius: 10rpx 0px 10rpx 0px;
|
||||
font-size: 24rpx;
|
||||
font-weight: 500;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user