angelo
/
web-store-retail-h5
forked from angelo/web-retail-h5
3
0
Fork 0
Code Pull Requests Activity

feat(regionSelect): 会员选择区域

This commit is contained in:
woody 2025-08-12 15:38:30 +08:00
parent a0c6fc5418
commit b6fa19b0de
3 changed files with 150 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
pages/commonMixins/regionSelect.js
View File

@ -20,7 +20,7 @@ export default {
if (!gradeValue) return
this.gradeValue = gradeValue
const params = {
type: gradeValue === 80 ? 'city' : 'county',
type: 'county',
}
getRegionAreaList(params).then(res => {
this.provinceList = res.data.filter(item => item.parent === 0)
@ -44,7 +44,6 @@ export default {
)
},
getCityFilterList() {
if (this.gradeValue === 80) return
if (!this.countyList.length) {
this.cityList = []
}
@ -53,7 +52,7 @@ export default {
)
},
getCountyFilterList() {
if (!this.gradeValue || this.gradeValue === 80) {
if (!this.gradeValue) {
this.countyList = []
}
},

190
pages/mine/index.vue
View File

@ -97,49 +97,79 @@
</view>
</view>
<!-- 收益区域 -->
<view class="my_order" v-if="regionInfoVisible">
<view class="my_title">
<text class="thetitle">收益区域</text>
</view>
<template
v-if="
regionInfo.provinceVal || regionInfo.cityVal || regionInfo.countyVal
"
<!-- 区域信息Tab -->
<view class="my_order" v-if="showRegionTabs">
<u-tabs
:list="regionTabList"
@change="onRegionTabChange"
:current="currentRegionTab"
:activeColor="'#005BAC'"
:inactiveColor="'#999999'"
:lineWidth="30"
:lineHeight="4"
:lineColor="'#005BAC'"
:itemStyle="'padding: 15rpx 25rpx; font-size: 20rpx;'"
>
<view class="region-info-box">
<view class="region-info-item">
<text class="region-info-label">{{ '省' }}</text>
<text class="region-info-value">{{
regionInfo.provinceVal || '-'
}}</text>
</view>
<view class="region-info-item">
<text class="region-info-label">{{ '市' }}</text>
<text class="region-info-value">{{
regionInfo.cityVal || '-'
}}</text>
</view>
<view class="region-info-item">
<text class="region-info-label">{{ '区' }}</text>
<text class="region-info-value">{{
regionInfo.countyVal || '-'
}}</text>
</view>
</view>
</template>
<template v-else>
<view class="region-select-action">
<u-button
@click="openRegionSelect"
color="#005BAC"
shape="circle"
text="选择区域"
></u-button>
</view>
</template>
</view>
</u-tabs>
<!-- Tab内容区域 -->
<view class="tab-content">
<!-- 已选区域内容 -->
<view v-if="currentRegionTab === 0 && hasRegionData">
<view class="region-info-box">
<view class="region-info-item">
<text class="region-info-label">{{ '省' }}</text>
<text class="region-info-value">{{
regionInfo.provinceVal || '-'
}}</text>
</view>
<view class="region-info-item">
<text class="region-info-label">{{ '市' }}</text>
<text class="region-info-value">{{
regionInfo.cityVal || '-'
}}</text>
</view>
<view class="region-info-item">
<text class="region-info-label">{{ '区' }}</text>
<text class="region-info-value">{{
regionInfo.countyVal || '-'
}}</text>
</view>
</view>
</view>
<!-- 配送中心内容 -->
<view v-if="currentRegionTab === 1 && hasDistributionData">
<view class="region-info-box">
<view class="region-info-item">
<text class="region-info-label">{{ '省' }}</text>
<text class="region-info-value">{{
dstributionCenter.provinceVal || '-'
}}</text>
</view>
<view class="region-info-item">
<text class="region-info-label">{{ '市' }}</text>
<text class="region-info-value">{{
dstributionCenter.cityVal || '-'
}}</text>
</view>
<view class="region-info-item">
<text class="region-info-label">{{ '区' }}</text>
<text class="region-info-value">{{
dstributionCenter.countyVal || '-'
}}</text>
</view>
</view>
</view>
<!-- 配送中心无数据状态 -->
<view v-if="currentRegionTab === 1 && !hasDistributionData">
<view class="empty-state">
<text class="empty-text">暂无配送中心信息</text>
</view>
</view>
</view>
</view>
<view class="my_order">
<view class="order_flex">
<template v-for="(item, index) in otherMenuList">
@ -362,6 +392,7 @@ export default {
ifSpecial: false,
awardsList: '',
regionInfo: {},
dstributionCenter: {},
smallAreaBox: 0,
totalBox: 0,
// performanceData: {},
@ -369,6 +400,7 @@ export default {
totalSumPv: 0,
smallAreaPv: 0,
isNormal: false,
currentRegionTab: 0, // 当前选中的tab索引
}
},
onShow() {
@ -378,7 +410,7 @@ export default {
return
}
this.isNormal = isNormal
// this.getRegionSelect()
this.getRegionSelect()
this.getMemberBoxCount()
this.getMarketDynamicBoxCount()
// this.getUserAwardss()
@ -428,8 +460,8 @@ export default {
marketWrapperVisible() {
return this.userInfo.memberSign !== MEMBER_SIGN.ZERO_LEVEL
},
regionInfoVisible() {
return this.regionInfo?.regionStatus === 0
dstributionCenterVisible() {
return !!this.dstributionCenter
},
formattedTotalSumPv() {
const value = String(this.totalSumPv || '0.00')
@ -463,9 +495,54 @@ export default {
decimal: parts.length > 1 ? `.${parts[1]}` : '',
}
},
// 是否有已选区域数据
hasRegionData() {
return !!(
this.regionInfo &&
(this.regionInfo.provinceVal ||
this.regionInfo.cityVal ||
this.regionInfo.countyVal)
)
},
// 是否有配送中心数据
hasDistributionData() {
return !!(
this.dstributionCenter &&
(this.dstributionCenter.provinceVal ||
this.dstributionCenter.cityVal ||
this.dstributionCenter.countyVal)
)
},
showRegionTabs() {
return !!(
(this.regionInfo && Object.keys(this.regionInfo).length) ||
(this.dstributionCenter && Object.keys(this.dstributionCenter).length)
)
},
regionTabList() {
const tabs = []
if (this.regionInfo) {
tabs.push({
name: '已选区域',
})
}
if (this.dstributionCenter) {
tabs.push({
name: '配送中心',
})
}
return tabs
},
},
methods: {
// Tab切换事件
onRegionTabChange({ index }) {
this.currentRegionTab = index
},
getRegionSelect() {
uni.showLoading({
title: '加载中...',
@ -473,7 +550,12 @@ export default {
getRegionSelect()
.then(res => {
if (res.code == 200) {
this.regionInfo = res.data
this.regionInfo = (res.data || []).filter(
item => item.businessType === 1
)?.[0]
this.dstributionCenter = (res.data || []).filter(
item => item.businessType === 2
)?.[0]
}
})
.finally(() => {
@ -1347,7 +1429,25 @@ export default {
}
}
/* Tab相关样式 */
.tab-content {
padding: 0;
}
.empty-state {
padding: 60rpx 20rpx;
text-align: center;
}
.empty-text {
font-size: 28rpx;
color: #999999;
}
.region-select-action {
padding: 30rpx 20rpx;
}
::v-deep .u-tabs__wrapper__nav__item__text {
font-size: 26rpx !important;
}
</style>

6
pages/regiest/index.vue
View File

@ -55,7 +55,7 @@
/>
</u-form-item>
<u-form-item
v-if="[60, 70, 80].includes(gradeValue) && provinceList.length"
v-if="[80].includes(gradeValue) && provinceList.length"
@click="regionSelectHandle"
required
label="会员区域"
@ -827,7 +827,7 @@ export default {
if (res.code == 200) {
if (res.data.isEnough) {
this.form.pkGradeVal = res.data.pkGradeVal
if ([60, 70, 80].includes(res.data.gradeValue)) {
if ([80].includes(res.data.gradeValue)) {
this.gradeValue = res.data.gradeValue
this.getRegionAreaList(res.data.gradeValue)
}
@ -1188,7 +1188,7 @@ export default {
},
goBuy() {
const extParams = {}
if ([60, 70, 80].includes(this.gradeValue) && this.provinceList.length) {
if ([80].includes(this.gradeValue) && this.provinceList.length) {
if (!this.regionAddress.length) {
uni.showToast({
title: '请选择会员区域',