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