Merge branch 'bd-dev' of http://47.94.45.65:3000/angelo/web-base-h5 into bd-test
This commit is contained in:
commit
3f13d82fe1
|
|
@ -232,7 +232,6 @@ export default {
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.newShareMember = uni.getStorageSync('User')?.loginType !== 0
|
this.newShareMember = uni.getStorageSync('User')?.loginType !== 0
|
||||||
console.log(this.newShareMember, '...this.newShareMember')
|
|
||||||
this.setSpecial({
|
this.setSpecial({
|
||||||
value: this.specialArea,
|
value: this.specialArea,
|
||||||
})
|
})
|
||||||
|
|
@ -245,7 +244,6 @@ export default {
|
||||||
this.setSmallCarLength(0)
|
this.setSmallCarLength(0)
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
console.log('beforeDestroy........?')
|
|
||||||
this.setSmallCarLength(0)
|
this.setSmallCarLength(0)
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
|
@ -326,7 +324,7 @@ export default {
|
||||||
// })
|
// })
|
||||||
this.oneList = res.data
|
this.oneList = res.data
|
||||||
this.oneId = this.oneList[0] ? this.oneList[0].pkId : ''
|
this.oneId = this.oneList[0] ? this.oneList[0].pkId : ''
|
||||||
this.getClassIfyTwo(this.oneList[0].pkId)
|
// this.getClassIfyTwo(this.oneList[0].pkId)
|
||||||
this.getAllGoods(this.oneList[0].pkId)
|
this.getAllGoods(this.oneList[0].pkId)
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -13,7 +13,7 @@ module.exports = vm => {
|
||||||
|
|
||||||
//#ifdef DEV_SERVER
|
//#ifdef DEV_SERVER
|
||||||
console.log('DEV_SERVER')
|
console.log('DEV_SERVER')
|
||||||
config.baseURL = 'http://192.168.2.102:8080'
|
config.baseURL = 'https://t-app.beida666.com/prod-api'
|
||||||
//#endif
|
//#endif
|
||||||
|
|
||||||
//#ifdef QA_SERVER
|
//#ifdef QA_SERVER
|
||||||
|
|
|
||||||
|
|
@ -232,6 +232,14 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/specialArea/drawer-list",
|
||||||
|
"style": {
|
||||||
|
"app-plus": {
|
||||||
|
"titleNView": false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"path": "pages/specialArea/haIndex",
|
"path": "pages/specialArea/haIndex",
|
||||||
"style": {
|
"style": {
|
||||||
|
|
|
||||||
|
|
@ -605,8 +605,17 @@ export default {
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
if (item.specialArea == 30) {
|
if (item.specialArea === 3) {
|
||||||
this.goAreaUrl()
|
uni.navigateTo({
|
||||||
|
url:
|
||||||
|
'/pages/specialArea/drawer-list?label=' +
|
||||||
|
item.specialAreaName +
|
||||||
|
'&specialArea=' +
|
||||||
|
item.specialArea +
|
||||||
|
'&children=' +
|
||||||
|
JSON.stringify(this.zoneList[tapx].children) +
|
||||||
|
'&diff=1',
|
||||||
|
})
|
||||||
} else {
|
} else {
|
||||||
uni.navigateTo({
|
uni.navigateTo({
|
||||||
url:
|
url:
|
||||||
|
|
|
||||||
File diff suppressed because it is too large
Load Diff
|
|
@ -4,14 +4,56 @@
|
||||||
<view class="index_header">
|
<view class="index_header">
|
||||||
<view>{{ titLabel }}</view>
|
<view>{{ titLabel }}</view>
|
||||||
</view>
|
</view>
|
||||||
<!-- 分类抽屉按钮 -->
|
<view class="shareImg" v-if="specialArea == 7" @click="goShare">
|
||||||
<view class="category-drawer-btn" @click="openCategoryDrawer">
|
<u-icon name="share-square" size="24" color="#005BAC"> </u-icon>
|
||||||
<u-icon name="list" size="20" color="#005BAC"></u-icon>
|
|
||||||
<text>分类</text>
|
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
<u-scroll-list
|
||||||
|
:indicator="false"
|
||||||
|
v-if="itemChildren.length > 1"
|
||||||
|
class="tabList_a"
|
||||||
|
>
|
||||||
|
<view class="tab">
|
||||||
|
<view
|
||||||
|
v-for="(item, index) in itemChildren"
|
||||||
|
:key="index"
|
||||||
|
@click="setSpecial(item)"
|
||||||
|
v-show="item.isShow"
|
||||||
|
:class="[specialArea == item.value ? 'actTab' : 'tab_i']"
|
||||||
|
>
|
||||||
|
<view>{{ item.label }}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-scroll-list>
|
||||||
<view class="index_btm">
|
<view class="index_btm">
|
||||||
<view class="index_r full-width">
|
<!-- sangelxiu1 会员专区 隐藏分类-->
|
||||||
|
<view class="index_l" v-if="!newShareMember">
|
||||||
|
<view
|
||||||
|
v-for="item in oneList"
|
||||||
|
:class="['classIfy', oneId == item.pkId ? 'actOne' : '']"
|
||||||
|
@click="
|
||||||
|
((oneId = item.pkId),
|
||||||
|
getAllGoods(item.pkId),
|
||||||
|
getClassIfyTwo(item.pkId))
|
||||||
|
"
|
||||||
|
:key="item.pkId"
|
||||||
|
>{{ item.classifyName }}</view
|
||||||
|
>
|
||||||
|
</view>
|
||||||
|
<view :class="newShareMember ? 'index_r_2' : 'index_r'">
|
||||||
|
<u-scroll-list :indicator="false" class="tabList">
|
||||||
|
<view class="tab">
|
||||||
|
<view
|
||||||
|
v-for="(item, index) in twoList"
|
||||||
|
:key="index"
|
||||||
|
@click="((twoId = item.pkId), getAllGoods1(item.pkId))"
|
||||||
|
:class="[twoId == item.pkId ? 'actTab' : 'tab_i']"
|
||||||
|
>
|
||||||
|
<view>{{ item.classifyName }}</view>
|
||||||
|
<!-- <view :class="[twoId == item.pkId ? 'heng' : 'heng1']"></view> -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-scroll-list>
|
||||||
<view class="search">
|
<view class="search">
|
||||||
<u--input
|
<u--input
|
||||||
placeholder="请输入商品名称"
|
placeholder="请输入商品名称"
|
||||||
|
|
@ -25,41 +67,11 @@
|
||||||
></u--input>
|
></u--input>
|
||||||
</view>
|
</view>
|
||||||
<view class="goodList">
|
<view class="goodList">
|
||||||
<!-- 空状态提示 -->
|
|
||||||
<view v-if="goodList.length === 0" class="empty-state">
|
|
||||||
<view class="empty-icon">
|
|
||||||
<u-icon :name="getEmptyIcon()" size="80" color="#d0d0d0"></u-icon>
|
|
||||||
</view>
|
|
||||||
<view class="empty-title">{{ getEmptyTitle() }}</view>
|
|
||||||
<view class="empty-desc">{{ getEmptyDesc() }}</view>
|
|
||||||
<view class="empty-tips">
|
|
||||||
<text v-for="(tip, index) in getEmptyTips()" :key="index">
|
|
||||||
• {{ tip }}
|
|
||||||
</text>
|
|
||||||
</view>
|
|
||||||
<view class="empty-actions">
|
|
||||||
<view class="empty-action primary" @click="openCategoryDrawer">
|
|
||||||
<u-icon name="list" size="16" color="#ffffff"></u-icon>
|
|
||||||
<text>浏览分类</text>
|
|
||||||
</view>
|
|
||||||
<view
|
|
||||||
class="empty-action secondary"
|
|
||||||
@click="clearSearch"
|
|
||||||
v-if="waresName"
|
|
||||||
>
|
|
||||||
<u-icon name="close-circle" size="16" color="#005bac"></u-icon>
|
|
||||||
<text>清除搜索</text>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<!-- 商品列表 -->
|
|
||||||
<view
|
<view
|
||||||
v-for="item in goodList"
|
v-for="item in goodList"
|
||||||
:key="item.waresCode"
|
:key="item.waresCode"
|
||||||
class="goodList_i"
|
class="goodList_i"
|
||||||
@tap="goDetails(item)"
|
@tap="goDetails(item)"
|
||||||
v-else
|
|
||||||
>
|
>
|
||||||
<view style="display: flex; flex: 1">
|
<view style="display: flex; flex: 1">
|
||||||
<view
|
<view
|
||||||
|
|
@ -214,75 +226,6 @@
|
||||||
:carLength="shopCarLength"
|
:carLength="shopCarLength"
|
||||||
:specialArea="specialArea"
|
:specialArea="specialArea"
|
||||||
></cartBall>
|
></cartBall>
|
||||||
|
|
||||||
<!-- 分类抽屉遮罩 -->
|
|
||||||
<view
|
|
||||||
class="drawer-mask"
|
|
||||||
:class="{ show: showCategoryDrawer }"
|
|
||||||
@click="closeCategoryDrawer"
|
|
||||||
v-if="showCategoryDrawer"
|
|
||||||
></view>
|
|
||||||
|
|
||||||
<!-- 分类抽屉 -->
|
|
||||||
<view class="category-drawer" :class="{ show: showCategoryDrawer }">
|
|
||||||
<view class="drawer-header">
|
|
||||||
<text class="drawer-title">商品分类</text>
|
|
||||||
<u-icon
|
|
||||||
name="close"
|
|
||||||
size="20"
|
|
||||||
color="#666"
|
|
||||||
@click="closeCategoryDrawer"
|
|
||||||
></u-icon>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="drawer-content">
|
|
||||||
<view
|
|
||||||
v-for="item in oneList"
|
|
||||||
:key="item.pkId"
|
|
||||||
class="drawer-menu-group"
|
|
||||||
>
|
|
||||||
<!-- 一级分类 -->
|
|
||||||
<view
|
|
||||||
class="drawer-first-level"
|
|
||||||
:class="{ active: oneId == item.pkId }"
|
|
||||||
>
|
|
||||||
<view class="drawer-menu-text" @click="selectFirstLevel(item)">{{
|
|
||||||
truncateText(item.classifyName, 12)
|
|
||||||
}}</view>
|
|
||||||
<!-- <view
|
|
||||||
v-if="item.children && item.children.length > 0"
|
|
||||||
class="drawer-expand-icon"
|
|
||||||
:class="{ expanded: expandedMenus.includes(item.pkId) }"
|
|
||||||
@click="toggleExpand(item.pkId)"
|
|
||||||
>
|
|
||||||
<u-icon
|
|
||||||
name="arrow-right"
|
|
||||||
size="16"
|
|
||||||
:color="oneId == item.pkId ? '#fff' : '#666'"
|
|
||||||
></u-icon>
|
|
||||||
</view> -->
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view
|
|
||||||
class="drawer-second-level-container"
|
|
||||||
:class="{ expanded: expandedMenus.includes(item.pkId) }"
|
|
||||||
v-if="item.children && item.children.length > 0"
|
|
||||||
>
|
|
||||||
<view
|
|
||||||
v-for="subItem in item.children"
|
|
||||||
:key="subItem.pkId"
|
|
||||||
class="drawer-second-level"
|
|
||||||
:class="{ active: twoId == subItem.pkId }"
|
|
||||||
@click="selectSecondLevel(subItem)"
|
|
||||||
>
|
|
||||||
<view class="drawer-sub-menu-text">{{
|
|
||||||
truncateText(subItem.classifyName, 12)
|
|
||||||
}}</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -336,8 +279,6 @@ export default {
|
||||||
countryList: [],
|
countryList: [],
|
||||||
isCountry: false,
|
isCountry: false,
|
||||||
waresName: '',
|
waresName: '',
|
||||||
expandedMenus: [], // 存储展开的一级菜单ID
|
|
||||||
showCategoryDrawer: false, // 控制分类抽屉显示
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onLoad(options) {
|
onLoad(options) {
|
||||||
|
|
@ -407,8 +348,6 @@ export default {
|
||||||
},
|
},
|
||||||
onShow() {
|
onShow() {
|
||||||
this.newShareMember = uni.getStorageSync('User')?.loginType !== 0
|
this.newShareMember = uni.getStorageSync('User')?.loginType !== 0
|
||||||
// 确保抽屉是关闭的
|
|
||||||
this.showCategoryDrawer = false
|
|
||||||
let that = this
|
let that = this
|
||||||
uni.$on('returnData', function (data) {
|
uni.$on('returnData', function (data) {
|
||||||
that.specialArea = data.value
|
that.specialArea = data.value
|
||||||
|
|
@ -417,7 +356,7 @@ export default {
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
// 获取国家
|
// 获取国家
|
||||||
// this.getJScountry()
|
this.getJScountry()
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.$refs.cart.getCar()
|
this.$refs.cart.getCar()
|
||||||
})
|
})
|
||||||
|
|
@ -427,138 +366,11 @@ export default {
|
||||||
this.setSmallCarLength(0)
|
this.setSmallCarLength(0)
|
||||||
},
|
},
|
||||||
beforeDestroy() {
|
beforeDestroy() {
|
||||||
|
console.log('beforeDestroy........?')
|
||||||
this.setSmallCarLength(0)
|
this.setSmallCarLength(0)
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
...mapActions(['setSmallCarLength', 'setShopCarLength']),
|
...mapActions(['setSmallCarLength', 'setShopCarLength']),
|
||||||
getAllCategory() {
|
|
||||||
api
|
|
||||||
.getAllCategory({
|
|
||||||
specialArea: this.specialArea,
|
|
||||||
pkCountry: this.pkCountry,
|
|
||||||
})
|
|
||||||
.then(res => {
|
|
||||||
if (res.code === 200) {
|
|
||||||
const tempList = res.data || []
|
|
||||||
this.oneList = tempList.map(item => {
|
|
||||||
const children = item.children
|
|
||||||
if (children && children.length > 0) {
|
|
||||||
item.children = [
|
|
||||||
{ classifyName: '全部', pkId: item.pkId },
|
|
||||||
...children,
|
|
||||||
]
|
|
||||||
}
|
|
||||||
return {
|
|
||||||
...item,
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
// 默认全部展开
|
|
||||||
this.expandedMenus = this.oneList.map(item => item.pkId)
|
|
||||||
|
|
||||||
// 选择第一个分类
|
|
||||||
if (this.oneList[0]) {
|
|
||||||
this.oneId = this.oneList[0].pkId
|
|
||||||
this.twoId = this.oneList[0].pkId
|
|
||||||
this.getAllGoods(this.oneList[0].pkId)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
truncateText(text, maxLength) {
|
|
||||||
if (!text) return ''
|
|
||||||
if (text.length <= maxLength) return text
|
|
||||||
return text.substring(0, maxLength) + '...'
|
|
||||||
},
|
|
||||||
// 选择一级分类(不影响展开状态)
|
|
||||||
selectFirstLevel(item) {
|
|
||||||
this.oneId = item.pkId
|
|
||||||
this.twoId = item.pkId
|
|
||||||
this.getAllGoods(item.pkId)
|
|
||||||
},
|
|
||||||
// 切换展开状态(不影响选择状态)
|
|
||||||
toggleExpand(pkId) {
|
|
||||||
const index = this.expandedMenus.indexOf(pkId)
|
|
||||||
if (index === -1) {
|
|
||||||
this.expandedMenus.push(pkId)
|
|
||||||
} else {
|
|
||||||
this.expandedMenus.splice(index, 1)
|
|
||||||
}
|
|
||||||
},
|
|
||||||
// 保留原方法以兼容其他地方的调用
|
|
||||||
toggleFirstLevel(item) {
|
|
||||||
this.selectFirstLevel(item)
|
|
||||||
},
|
|
||||||
// 选择二级分类
|
|
||||||
selectSecondLevel(item) {
|
|
||||||
this.twoId = item.pkId
|
|
||||||
this.getAllGoods1(item.pkId)
|
|
||||||
// 不自动关闭抽屉,让用户手动关闭
|
|
||||||
},
|
|
||||||
// 打开分类抽屉
|
|
||||||
openCategoryDrawer() {
|
|
||||||
this.showCategoryDrawer = true
|
|
||||||
},
|
|
||||||
// 关闭分类抽屉
|
|
||||||
closeCategoryDrawer() {
|
|
||||||
this.showCategoryDrawer = false
|
|
||||||
},
|
|
||||||
// 获取空状态图标
|
|
||||||
getEmptyIcon() {
|
|
||||||
if (this.waresName) {
|
|
||||||
return 'search'
|
|
||||||
}
|
|
||||||
return 'shopping-cart'
|
|
||||||
},
|
|
||||||
// 获取空状态标题
|
|
||||||
getEmptyTitle() {
|
|
||||||
if (this.waresName) {
|
|
||||||
return '未找到相关商品'
|
|
||||||
}
|
|
||||||
return '暂无商品'
|
|
||||||
},
|
|
||||||
// 获取空状态描述
|
|
||||||
getEmptyDesc() {
|
|
||||||
if (this.waresName) {
|
|
||||||
return `没有找到包含"${this.waresName}"的商品`
|
|
||||||
}
|
|
||||||
|
|
||||||
// 如果二级分类ID不等于一级分类ID,说明选择了具体的二级分类
|
|
||||||
if (this.twoId !== this.oneId) {
|
|
||||||
const currentCategory = this.oneList.find(
|
|
||||||
item => item.pkId === this.oneId
|
|
||||||
)
|
|
||||||
if (currentCategory && currentCategory.children) {
|
|
||||||
const subCategory = currentCategory.children.find(
|
|
||||||
sub => sub.pkId === this.twoId
|
|
||||||
)
|
|
||||||
if (subCategory) {
|
|
||||||
return `"${subCategory.classifyName}"分类下还没有商品哦`
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// 显示一级分类名称
|
|
||||||
const currentCategory = this.oneList.find(
|
|
||||||
item => item.pkId === this.oneId
|
|
||||||
)
|
|
||||||
if (currentCategory) {
|
|
||||||
return `"${currentCategory.classifyName}"分类下还没有商品哦`
|
|
||||||
}
|
|
||||||
return '当前分类下还没有商品哦'
|
|
||||||
},
|
|
||||||
// 获取空状态提示
|
|
||||||
getEmptyTips() {
|
|
||||||
if (this.waresName) {
|
|
||||||
return ['检查搜索词是否正确', '浏览其他分类商品']
|
|
||||||
}
|
|
||||||
return ['试试其他分类', '商品正在陆续上架中']
|
|
||||||
},
|
|
||||||
// 清除搜索
|
|
||||||
clearSearch() {
|
|
||||||
this.waresName = ''
|
|
||||||
this.getAllGoods1()
|
|
||||||
},
|
|
||||||
changeCountry() {
|
changeCountry() {
|
||||||
this.isCountry = true
|
this.isCountry = true
|
||||||
},
|
},
|
||||||
|
|
@ -597,8 +409,18 @@ export default {
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
setSpecial(item) {
|
setSpecial(item) {
|
||||||
this.specialArea = item.value
|
if (item.value == 21) {
|
||||||
this.getAllCategory()
|
// uni.navigateTo({
|
||||||
|
// url:
|
||||||
|
// '/pages/specialArea/haIndex?label=' +
|
||||||
|
// this.titLabel +
|
||||||
|
// '&specialArea=21&children=' +
|
||||||
|
// JSON.stringify(this.itemChildren),
|
||||||
|
// })
|
||||||
|
} else {
|
||||||
|
this.specialArea = item.value
|
||||||
|
this.getClassIfy()
|
||||||
|
}
|
||||||
},
|
},
|
||||||
addCar(item) {
|
addCar(item) {
|
||||||
let carList = {
|
let carList = {
|
||||||
|
|
@ -652,10 +474,6 @@ export default {
|
||||||
// })
|
// })
|
||||||
this.oneList = res.data
|
this.oneList = res.data
|
||||||
this.oneId = this.oneList[0] ? this.oneList[0].pkId : ''
|
this.oneId = this.oneList[0] ? this.oneList[0].pkId : ''
|
||||||
|
|
||||||
// 默认全部展开
|
|
||||||
this.expandedMenus = this.oneList.map(item => item.pkId)
|
|
||||||
|
|
||||||
this.getClassIfyTwo(this.oneList[0].pkId)
|
this.getClassIfyTwo(this.oneList[0].pkId)
|
||||||
this.getAllGoods(this.oneList[0].pkId)
|
this.getAllGoods(this.oneList[0].pkId)
|
||||||
})
|
})
|
||||||
|
|
@ -795,222 +613,38 @@ export default {
|
||||||
margin-bottom: 10rpx;
|
margin-bottom: 10rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 分类抽屉按钮 */
|
|
||||||
.category-drawer-btn {
|
|
||||||
position: fixed;
|
|
||||||
top: 10rpx;
|
|
||||||
right: 20rpx;
|
|
||||||
z-index: 999;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding: 16rpx 20rpx;
|
|
||||||
|
|
||||||
font-size: 24rpx;
|
|
||||||
color: #005bac;
|
|
||||||
font-weight: 500;
|
|
||||||
|
|
||||||
text {
|
|
||||||
margin-left: 8rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
&:active {
|
|
||||||
transform: scale(0.95);
|
|
||||||
background: rgba(240, 247, 255, 0.95);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.index_btm {
|
.index_btm {
|
||||||
flex: 1;
|
flex: 1; // display: flex;
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.index_r {
|
.index_l {
|
||||||
flex: 1;
|
width: 198rpx;
|
||||||
background: #fff;
|
padding: 10rpx 0;
|
||||||
|
font-size: 11px;
|
||||||
|
font-family:
|
||||||
|
PingFang SC-Regular,
|
||||||
|
PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #000000;
|
||||||
|
overflow-y: auto;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
|
position: absolute;
|
||||||
&.full-width {
|
height: 86vh;
|
||||||
margin-left: 0;
|
background: #f2f2f2;
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 分类抽屉遮罩 */
|
|
||||||
.drawer-mask {
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
background: rgba(0, 0, 0, 0.5);
|
|
||||||
z-index: 1000;
|
|
||||||
opacity: 0;
|
|
||||||
transition: opacity 0.3s ease;
|
|
||||||
|
|
||||||
&.show {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 分类抽屉样式 */
|
|
||||||
.category-drawer {
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 600rpx;
|
|
||||||
height: 100vh;
|
|
||||||
background: #f8f9fa;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
z-index: 1001;
|
|
||||||
transform: translateX(-100%);
|
|
||||||
transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
|
|
||||||
|
|
||||||
&.show {
|
|
||||||
transform: translateX(0);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.drawer-header {
|
.index_r {
|
||||||
display: flex;
|
// flex: 1;
|
||||||
justify-content: space-between;
|
background: #fff;
|
||||||
align-items: center;
|
margin-left: 198rpx; // padding: 20rpx;
|
||||||
padding: 40rpx 30rpx 30rpx;
|
// display: flex;
|
||||||
background: #ffffff;
|
|
||||||
border-bottom: 1px solid #e9ecef;
|
|
||||||
|
|
||||||
.drawer-title {
|
|
||||||
font-size: 32rpx;
|
|
||||||
font-weight: 600;
|
|
||||||
color: #333333;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.drawer-content {
|
.index_r_2 {
|
||||||
flex: 1;
|
// flex: 1;
|
||||||
overflow-y: auto;
|
background: #fff;
|
||||||
padding: 20rpx 0;
|
margin-left: 20rpx; // padding: 20rpx;
|
||||||
|
// display: flex;
|
||||||
/* 抽屉滚动条 */
|
|
||||||
&::-webkit-scrollbar {
|
|
||||||
width: 4rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
&::-webkit-scrollbar-track {
|
|
||||||
background: transparent;
|
|
||||||
}
|
|
||||||
|
|
||||||
&::-webkit-scrollbar-thumb {
|
|
||||||
background: rgba(0, 0, 0, 0.1);
|
|
||||||
border-radius: 2rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.drawer-menu-group {
|
|
||||||
margin-bottom: 8rpx;
|
|
||||||
background: #ffffff;
|
|
||||||
border-radius: 12rpx;
|
|
||||||
margin: 0 20rpx 12rpx;
|
|
||||||
overflow: hidden;
|
|
||||||
box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.04);
|
|
||||||
|
|
||||||
.drawer-first-level {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
font-size: 30rpx;
|
|
||||||
font-weight: 600;
|
|
||||||
color: #333333;
|
|
||||||
transition: all 0.3s ease;
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
&.active {
|
|
||||||
background: linear-gradient(135deg, #005bac 0%, #0066cc 100%);
|
|
||||||
color: #ffffff;
|
|
||||||
|
|
||||||
.drawer-expand-icon {
|
|
||||||
.u-icon {
|
|
||||||
color: #ffffff !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.drawer-menu-text {
|
|
||||||
flex: 1;
|
|
||||||
font-size: 30rpx;
|
|
||||||
line-height: 1.3;
|
|
||||||
padding: 32rpx 24rpx;
|
|
||||||
cursor: pointer;
|
|
||||||
|
|
||||||
&:active {
|
|
||||||
background: rgba(0, 0, 0, 0.05);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.drawer-expand-icon {
|
|
||||||
transition: transform 0.3s ease;
|
|
||||||
padding: 32rpx 24rpx 32rpx 8rpx;
|
|
||||||
cursor: pointer;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
&:active {
|
|
||||||
background: rgba(0, 0, 0, 0.05);
|
|
||||||
}
|
|
||||||
|
|
||||||
&.expanded {
|
|
||||||
transform: rotate(90deg);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.drawer-second-level-container {
|
|
||||||
max-height: 0;
|
|
||||||
overflow: hidden;
|
|
||||||
transition: max-height 0.4s ease;
|
|
||||||
background: #f8f9fa;
|
|
||||||
|
|
||||||
&.expanded {
|
|
||||||
max-height: 1000rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.drawer-second-level {
|
|
||||||
padding: 24rpx 48rpx;
|
|
||||||
font-size: 28rpx;
|
|
||||||
color: #666666;
|
|
||||||
border-top: 1px solid #e9ecef;
|
|
||||||
transition: all 0.2s ease;
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
&:active {
|
|
||||||
background: #e9ecef;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.active {
|
|
||||||
background: linear-gradient(135deg, #005bac 0%, #0066cc 100%);
|
|
||||||
color: #fff;
|
|
||||||
font-weight: 500;
|
|
||||||
|
|
||||||
&::before {
|
|
||||||
content: '';
|
|
||||||
position: absolute;
|
|
||||||
left: 24rpx;
|
|
||||||
top: 50%;
|
|
||||||
transform: translateY(-50%);
|
|
||||||
width: 8rpx;
|
|
||||||
height: 8rpx;
|
|
||||||
background: #005bac;
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.drawer-sub-menu-text {
|
|
||||||
font-size: 28rpx;
|
|
||||||
line-height: 1.3;
|
|
||||||
margin-left: 20rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -1122,95 +756,6 @@ export default {
|
||||||
height: calc(100vh - 320rpx);
|
height: calc(100vh - 320rpx);
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
|
|
||||||
/* 空状态样式 */
|
|
||||||
.empty-state {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
height: 100%;
|
|
||||||
min-height: 500rpx;
|
|
||||||
padding: 80rpx 40rpx;
|
|
||||||
|
|
||||||
.empty-icon {
|
|
||||||
margin-bottom: 40rpx;
|
|
||||||
opacity: 0.6;
|
|
||||||
animation: float 3s ease-in-out infinite;
|
|
||||||
}
|
|
||||||
|
|
||||||
.empty-title {
|
|
||||||
font-size: 36rpx;
|
|
||||||
font-weight: 600;
|
|
||||||
color: #333333;
|
|
||||||
margin-bottom: 16rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.empty-desc {
|
|
||||||
font-size: 28rpx;
|
|
||||||
color: #666666;
|
|
||||||
margin-bottom: 40rpx;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 1.5;
|
|
||||||
}
|
|
||||||
|
|
||||||
.empty-tips {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 50rpx;
|
|
||||||
|
|
||||||
text {
|
|
||||||
font-size: 24rpx;
|
|
||||||
color: #999999;
|
|
||||||
margin-bottom: 8rpx;
|
|
||||||
line-height: 1.4;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.empty-actions {
|
|
||||||
display: flex;
|
|
||||||
gap: 20rpx;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.empty-action {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding: 20rpx 32rpx;
|
|
||||||
border-radius: 50rpx;
|
|
||||||
font-size: 26rpx;
|
|
||||||
font-weight: 500;
|
|
||||||
transition: all 0.3s ease;
|
|
||||||
|
|
||||||
text {
|
|
||||||
margin-left: 8rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.primary {
|
|
||||||
background: linear-gradient(135deg, #005bac 0%, #0066cc 100%);
|
|
||||||
color: #ffffff;
|
|
||||||
box-shadow: 0 4rpx 12rpx rgba(0, 91, 172, 0.3);
|
|
||||||
|
|
||||||
&:active {
|
|
||||||
transform: scale(0.95);
|
|
||||||
box-shadow: 0 2rpx 8rpx rgba(0, 91, 172, 0.4);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.secondary {
|
|
||||||
background: rgba(0, 91, 172, 0.1);
|
|
||||||
color: #005bac;
|
|
||||||
border: 2rpx solid rgba(0, 91, 172, 0.2);
|
|
||||||
|
|
||||||
&:active {
|
|
||||||
transform: scale(0.95);
|
|
||||||
background: rgba(0, 91, 172, 0.15);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.goodList_i {
|
.goodList_i {
|
||||||
// display: flex;
|
// display: flex;
|
||||||
border-bottom: 1px solid #eee;
|
border-bottom: 1px solid #eee;
|
||||||
|
|
@ -1569,15 +1114,4 @@ export default {
|
||||||
left: 100%;
|
left: 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 空状态浮动动画 */
|
|
||||||
@keyframes float {
|
|
||||||
0%,
|
|
||||||
100% {
|
|
||||||
transform: translateY(0);
|
|
||||||
}
|
|
||||||
50% {
|
|
||||||
transform: translateY(-10rpx);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue