<template>
|
<view>
|
<picker :disabled="isTownUser" mode="multiSelector" @columnchange="bindMultiPickerColumnChange" @change="change"
|
range-key="adName" :range="multiArray">
|
<view class="uni-input">
|
{{showVal.adName}}
|
</view>
|
</picker>
|
</view>
|
</template>
|
|
<script>
|
import {
|
regionList,
|
getRegionList
|
} from "@/api/dataCenter/region/region.js"
|
export default {
|
props: {
|
defaultValue: {
|
type: Object
|
},
|
isTown: {
|
type: Boolean,
|
default: false
|
}
|
},
|
data() {
|
return {
|
multiArray: [],
|
showVal: {
|
adName: ""
|
},
|
adBase: uni.getStorageSync("adCodeBase"),
|
isTownUser: false
|
}
|
},
|
created() {
|
if (this.adBase.adGrad >= 4) {
|
this.isTownUser = true
|
}
|
},
|
mounted() {
|
let adCodeBase = this.adBase
|
if (adCodeBase) {
|
this.multiArray.push([{
|
adName: adCodeBase.adName,
|
adCode: adCodeBase.adCode,
|
adGrad: adCodeBase.adGrad,
|
guid: adCodeBase.guid,
|
pAdCode: adCodeBase.pAdCode,
|
padCode: adCodeBase.padCode
|
}])
|
if (this.defaultValue && this.defaultValue.adGrad != '1') {
|
this.showVal = this.defaultValue
|
} else {
|
this.showVal = this.multiArray[0][0]
|
}
|
if (adCodeBase.adGrad < 4) {
|
this.getRegionList(this.multiArray[0][0])
|
}
|
}
|
},
|
methods: {
|
|
bindMultiPickerColumnChange(e) {
|
const {
|
column,
|
value
|
} = e.detail
|
if (column < this.multiArray.length - 1) {
|
this.getRegionList(this.multiArray[column][value], column, false)
|
}
|
|
},
|
getRegionList(region, columnIndex, isPush = true) {
|
// debugger
|
if (region) {
|
if (region.adCode && region.adCode == "") {
|
return
|
} else if (!region.adCode) {
|
return
|
}
|
|
if (!this.isTown) {
|
if (region.adGrad >= 3) return
|
}
|
} else {
|
return
|
}
|
|
let params = {
|
p_ad_code: region.adCode
|
}
|
|
//当当前region为直管时且登录行政区不为湖北省时
|
if (region.adName.indexOf("直管") > -1 && this.adBase.adGrad != 1) {
|
let column = []
|
column.push({
|
adName: "请选择",
|
adCode: "",
|
adGrad: 99,
|
guid: region.ad_code,
|
pAdCode: params.p_ad_code,
|
padCode: params.p_ad_code
|
})
|
//向最后添加空数据
|
this.$set(this.multiArray, this.multiArray[0].length + 1, column);
|
return
|
}
|
|
|
|
|
regionList(params).then(res => {
|
let data = res.resultList
|
if (data.length <= 0) {
|
if (region.adName.indexOf("直管") > -1) {
|
let c = []
|
c.push({
|
adName: "请选择",
|
adCode: "",
|
adGrad: 99,
|
guid: region.ad_code,
|
pAdCode: params.p_ad_code,
|
padCode: params.p_ad_code
|
})
|
//当前为直管，后一列清空
|
this.$set(this.multiArray, columnIndex + 1, c);
|
|
//显示乡镇的话,最后一列也清空
|
if (this.isTown && this.adBase.adGrad == 1) {
|
this.$set(this.multiArray, 3, c);
|
}
|
}
|
return
|
}
|
data = data.sort((a, b) => a.order_ids - b.order_ids)
|
let column = []
|
column.push({
|
adName: "请选择",
|
adCode: "",
|
adGrad: 99,
|
guid: region.ad_code,
|
pAdCode: params.p_ad_code,
|
padCode: params.p_ad_code
|
})
|
data.forEach(region => {
|
column.push({
|
adName: region.ads_name,
|
adCode: region.ad_code,
|
adGrad: region.ad_grad,
|
guid: region.ad_code,
|
pAdCode: region.p_ad_code,
|
padCode: region.p_ad_code
|
})
|
})
|
|
let adGrad = ""
|
if (this.isTown) {
|
adGrad = 4
|
} else {
|
adGrad = 3
|
}
|
|
if (region.adGrad < adGrad && isPush) {
|
this.multiArray.push(column)
|
this.getRegionList(column[1], 1)
|
} else if (!isPush) {
|
this.$set(this.multiArray, columnIndex + 1, column);
|
this.getRegionList(column[1], columnIndex + 1, false)
|
}
|
})
|
},
|
|
change(e) {
|
let value = e.detail.value
|
let region = {}
|
if (value[3] && value[3] != 0) {
|
region = this.multiArray[3][value[3]]
|
} else if (value[2] && value[2] != 0) {
|
region = this.multiArray[2][value[2]]
|
} else if (value[1] && value[1] != 0) {
|
region = this.multiArray[1][value[1]]
|
} else {
|
region = this.multiArray[0][value[0]]
|
}
|
this.showVal = region
|
console.log(region,"====region====")
|
this.$emit("regionChange", region)
|
}
|
|
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
::v-deep .picker-box {
|
width: 100%;
|
height: 90rpx;
|
// background-color: #05B7B4;
|
z-index: 1;
|
}
|
|
::v-deep .uni-picker-view-content {
|
padding: 80rpx 0 !important;
|
}
|
|
.top {
|
display: flex;
|
align-items: center;
|
padding: 20px;
|
|
.icon {
|
margin-right: 60rpx;
|
}
|
|
.search {
|
flex: 1;
|
}
|
}
|
|
.main {
|
.picker-view {
|
width: 750rpx;
|
height: 240rpx;
|
margin-top: 20rpx;
|
}
|
|
.item {
|
line-height: 80rpx;
|
height: 80rpx;
|
text-align: center;
|
}
|
}
|
|
.footer {
|
padding: 40rpx;
|
|
.btn {
|
height: 74rpx;
|
background: linear-gradient(90deg, #5B70F7 0%, #51A3FA 100%);
|
border-radius: 6rpx;
|
}
|
|
|
}
|
</style>
|
