业务代理商-三级区域选择-data-picker多余组件清理

This commit is contained in:
WindowBird 2025-08-19 18:05:45 +08:00
parent e23be989d7
commit 95a9d76b4a

View File

@ -47,58 +47,67 @@
<!-- 服务区域选择 - 三级选择 --> <!-- 服务区域选择 - 三级选择 -->
<view class="form-item"> <view class="form-item">
<view class="form-label">请选择您的服务区域</view> <view class="form-label">请选择您的服务区域</view>
<!-- 省份选择 --> <!-- 省份选择 -->
<view class="region-picker-item"> <view class="region-picker-item">
<view class="picker-label">省份</view> <view class="picker-label">省份</view>
<picker <picker
:range="provinceList" :range="provinceList"
:value="selectedProvinceIndex"
range-key="name" range-key="name"
@change="onProvinceChange" @change="onProvinceChange"
:value="selectedProvinceIndex"
> >
<view class="picker-display"> <view class="picker-display">
<text class="picker-text">{{ selectedProvince ? selectedProvince.name : '请选择省份' }}</text> <text class="picker-text">{{
selectedProvince ? selectedProvince.name : '请选择省份'
}}</text>
<text class="picker-arrow"></text> <text class="picker-arrow"></text>
</view> </view>
</picker> </picker>
</view> </view>
<!-- 城市选择 --> <!-- 城市选择 -->
<view class="region-picker-item" v-if="selectedProvince"> <view v-if="selectedProvince" class="region-picker-item">
<view class="picker-label">城市</view> <view class="picker-label">城市</view>
<picker <picker
:range="cityList" :range="cityList"
:value="selectedCityIndex"
range-key="name" range-key="name"
@change="onCityChange" @change="onCityChange"
:value="selectedCityIndex"
> >
<view class="picker-display"> <view class="picker-display">
<text class="picker-text">{{ selectedCity ? selectedCity.name : '请选择城市' }}</text> <text class="picker-text">{{
selectedCity ? selectedCity.name : '请选择城市'
}}</text>
<text class="picker-arrow"></text> <text class="picker-arrow"></text>
</view> </view>
</picker> </picker>
</view> </view>
<!-- 区县选择 --> <!-- 区县选择 -->
<view class="region-picker-item" v-if="selectedCity"> <view v-if="selectedCity" class="region-picker-item">
<view class="picker-label">区县</view> <view class="picker-label">区县</view>
<picker <picker
:range="districtList" :range="districtList"
:value="selectedDistrictIndex"
range-key="name" range-key="name"
@change="onDistrictChange" @change="onDistrictChange"
:value="selectedDistrictIndex"
> >
<view class="picker-display"> <view class="picker-display">
<text class="picker-text">{{ selectedDistrict ? selectedDistrict.name : '请选择区县' }}</text> <text class="picker-text">{{
selectedDistrict ? selectedDistrict.name : '请选择区县'
}}</text>
<text class="picker-arrow"></text> <text class="picker-arrow"></text>
</view> </view>
</picker> </picker>
</view> </view>
<!-- 显示完整地址 --> <!-- 显示完整地址 -->
<view class="selected-address" v-if="selectedDistrict"> <view v-if="selectedDistrict" class="selected-address">
<text class="address-text">已选择: {{ selectedProvince.name }} {{ selectedCity.name }} {{ selectedDistrict.name }}</text> <text class="address-text"
>已选择: {{ selectedProvince.name }} {{ selectedCity.name }}
{{ selectedDistrict.name }}
</text>
</view> </view>
</view> </view>
@ -128,7 +137,11 @@
<!-- 提交按钮 --> <!-- 提交按钮 -->
<view class="submit-section"> <view class="submit-section">
<button :disabled="!canSubmit || submitting" class="submit-btn" @click="submitApplication"> <button
:disabled="!canSubmit || submitting"
class="submit-btn"
@click="submitApplication"
>
{{ submitting ? '提交中...' : '申请成为代理商' }} {{ submitting ? '提交中...' : '申请成为代理商' }}
</button> </button>
</view> </view>
@ -156,13 +169,10 @@
<script> <script>
import commonEnum from '../../enum/commonEnum' import commonEnum from '../../enum/commonEnum'
import { applyForAgent, getAgentAgreement, getServiceAreas } from '@/api/agents' import { applyForAgent, getAgentAgreement, getServiceAreas } from '@/api/agents'
import uniDataPicker from '@/uni_modules/uni-data-picker/components/uni-data-picker/uni-data-picker.vue'
export default { export default {
name: 'AgentsPage', name: 'AgentsPage',
components: { components: {},
uniDataPicker
},
computed: { computed: {
commonEnum() { commonEnum() {
return commonEnum return commonEnum
@ -184,7 +194,7 @@ export default {
this.loadServiceAreas() this.loadServiceAreas()
this.loadAgreement() this.loadAgreement()
this.loadRegionTreeData() this.loadRegionTreeData()
// //
console.log('页面加载完成,三级选择器已初始化') console.log('页面加载完成,三级选择器已初始化')
}, },
@ -244,10 +254,10 @@ export default {
] ]
// ID // ID
this.areaIdMap = { this.areaIdMap = {
'福建省宁德市福鼎市': 8, 福建省宁德市福鼎市: 8,
'福建省宁德市霞浦县': 9, 福建省宁德市霞浦县: 9,
'福建省宁德市古田县': 10, 福建省宁德市古田县: 10,
'福建省宁德市屏南县': 11, 福建省宁德市屏南县: 11,
} }
} }
}, },
@ -256,8 +266,8 @@ export default {
extractRegionData(regions) { extractRegionData(regions) {
const names = [] const names = []
const idMap = {} const idMap = {}
const extractData = (regionList) => { const extractData = regionList => {
regionList.forEach(region => { regionList.forEach(region => {
names.push(region.name) names.push(region.name)
idMap[region.name] = region.id idMap[region.name] = region.id
@ -266,7 +276,7 @@ export default {
} }
}) })
} }
extractData(regions) extractData(regions)
return { names, idMap } return { names, idMap }
}, },
@ -405,7 +415,7 @@ export default {
城市: this.selectedCity?.name, 城市: this.selectedCity?.name,
区县: this.selectedDistrict?.name, 区县: this.selectedDistrict?.name,
完整地址: this.formData.serviceArea, 完整地址: this.formData.serviceArea,
区域ID: regionId 区域ID: regionId,
}) })
const response = await applyForAgent(requestData) const response = await applyForAgent(requestData)
@ -482,14 +492,14 @@ export default {
{ id: 8, name: '福鼎市' }, { id: 8, name: '福鼎市' },
{ id: 9, name: '霞浦县' }, { id: 9, name: '霞浦县' },
{ id: 10, name: '古田县' }, { id: 10, name: '古田县' },
{ id: 11, name: '屏南县' } { id: 11, name: '屏南县' },
] ],
} },
] ],
} },
] ]
} }
// //
this.initThreeLevelData() this.initThreeLevelData()
}, },
@ -498,7 +508,7 @@ export default {
initThreeLevelData() { initThreeLevelData() {
// //
this.provinceList = this.regionTreeData this.provinceList = this.regionTreeData
// areaIdMap // areaIdMap
this.initAreaIdMap() this.initAreaIdMap()
}, },
@ -506,7 +516,7 @@ export default {
// ID // ID
initAreaIdMap() { initAreaIdMap() {
const idMap = {} const idMap = {}
const extractIds = (regions) => { const extractIds = regions => {
regions.forEach(region => { regions.forEach(region => {
idMap[region.name] = region.id idMap[region.name] = region.id
if (region.children && region.children.length > 0) { if (region.children && region.children.length > 0) {
@ -524,17 +534,17 @@ export default {
const index = e.detail.value const index = e.detail.value
this.selectedProvinceIndex = index this.selectedProvinceIndex = index
this.selectedProvince = this.provinceList[index] this.selectedProvince = this.provinceList[index]
// //
this.selectedCity = null this.selectedCity = null
this.selectedCityIndex = -1 this.selectedCityIndex = -1
this.selectedDistrict = null this.selectedDistrict = null
this.selectedDistrictIndex = -1 this.selectedDistrictIndex = -1
// //
this.cityList = this.selectedProvince.children || [] this.cityList = this.selectedProvince.children || []
this.districtList = [] this.districtList = []
// //
this.updateServiceArea() this.updateServiceArea()
}, },
@ -544,14 +554,14 @@ export default {
const index = e.detail.value const index = e.detail.value
this.selectedCityIndex = index this.selectedCityIndex = index
this.selectedCity = this.cityList[index] this.selectedCity = this.cityList[index]
// //
this.selectedDistrict = null this.selectedDistrict = null
this.selectedDistrictIndex = -1 this.selectedDistrictIndex = -1
// //
this.districtList = this.selectedCity.children || [] this.districtList = this.selectedCity.children || []
// //
this.updateServiceArea() this.updateServiceArea()
}, },
@ -561,7 +571,7 @@ export default {
const index = e.detail.value const index = e.detail.value
this.selectedDistrictIndex = index this.selectedDistrictIndex = index
this.selectedDistrict = this.districtList[index] this.selectedDistrict = this.districtList[index]
// //
this.updateServiceArea() this.updateServiceArea()
}, },
@ -806,7 +816,7 @@ export default {
.agreement-modal-content { .agreement-modal-content {
flex: 1; flex: 1;
padding:50rpx; padding: 50rpx;
max-width: 500rpx; max-width: 500rpx;
max-height: 600rpx; max-height: 600rpx;
overflow-y: auto; overflow-y: auto;
@ -843,7 +853,7 @@ export default {
border-radius: 8rpx; border-radius: 8rpx;
font-size: 24rpx; font-size: 24rpx;
color: #666; color: #666;
text { text {
display: block; display: block;
margin-bottom: 5rpx; margin-bottom: 5rpx;
@ -853,14 +863,14 @@ export default {
// //
.region-picker-item { .region-picker-item {
margin-bottom: 20rpx; margin-bottom: 20rpx;
.picker-label { .picker-label {
font-size: 26rpx; font-size: 26rpx;
color: #666; color: #666;
margin-bottom: 10rpx; margin-bottom: 10rpx;
font-weight: 500; font-weight: 500;
} }
.picker-display { .picker-display {
height: 80rpx; height: 80rpx;
background: #ffffff; background: #ffffff;
@ -872,17 +882,17 @@ export default {
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
cursor: pointer; cursor: pointer;
&:active { &:active {
background: #f5f5f5; background: #f5f5f5;
} }
.picker-text { .picker-text {
font-size: 28rpx; font-size: 28rpx;
color: #333; color: #333;
flex: 1; flex: 1;
} }
.picker-arrow { .picker-arrow {
font-size: 24rpx; font-size: 24rpx;
color: #999; color: #999;
@ -896,7 +906,7 @@ export default {
background: #f8f9fa; background: #f8f9fa;
border-radius: 12rpx; border-radius: 12rpx;
border: 2rpx solid #e9ecef; border: 2rpx solid #e9ecef;
.address-text { .address-text {
font-size: 28rpx; font-size: 28rpx;
color: #495057; color: #495057;