feat(upgrade): 升级单选择区域

components/region-address.vue

@@ -0,0 +1,144 @@
+<template>
+  <view>
+    <u-picker
+      @cancel="pickershow = false"
+      :show="pickershow"
+      ref="uPicker"
+      :defaultIndex="defaultIndex"
+      :columns="columns"
+      @confirm="confirm"
+      keyName="name"
+      @change="changeHandler"
+    ></u-picker>
+  </view>
+</template>
+
+<script>
+import * as api from '@/config/goods'
+import { mapGetters } from 'vuex'
+export default {
+  data() {
+    return {
+      columns: [],
+      pickershow: false,
+      diqu: '',
+      form: {},
+      defaultIndex: [],
+      user: '',
+    }
+  },
+  props: {
+    defaultCode: {
+      type: Array,
+      default: () => [],
+    },
+    cityList: {
+      type: Array,
+      default: () => [],
+    },
+    provinceList: {
+      type: Array,
+      default: () => [],
+    },
+    countyList: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  watch: {
+    defaultCode: {
+      deep: true,
+      handler(n) {
+        if (this.cityList.length > 0) {
+          this.getDefaultIndex(n)
+        } else {
+          this.getAllAreaList(
+            uni.getStorageSync('pkCountry') || this.user.pkSettleCountry
+          ).then(res => {
+            if (res) {
+              this.getDefaultIndex(n)
+            }
+          })
+        }
+      },
+    },
+  },
+  created() {},
+  methods: {
+    getDefaultIndex(province) {
+      const cityList = this.cityList.filter(item => item.parent === province)
+      const countyList = this.countyList.filter(
+        item => item.parent === cityList[0].pkId
+      )
+
+      const columns = [this.provinceList, cityList]
+      if (countyList.length) {
+        columns.push(countyList)
+      }
+      this.columns = columns
+      this.defaultIndex = [0, 0]
+      if (countyList.length) {
+        this.defaultIndex.push(0)
+      }
+      this.$emit('getAddressData', columns)
+    },
+    setShow(province) {
+      this.pickershow = true
+      this.getDefaultIndex(province)
+    },
+    getCityList(province) {
+      const cityList = this.cityList.filter(item => item.parent === province)
+      return cityList
+    },
+    getCountyList(city) {
+      const countyList = this.countyList.filter(item => item.parent === city)
+      return countyList
+    },
+    changeHandler(e) {
+      const {
+        columnIndex,
+        value,
+        values, // values为当前变化列的数组内容
+        index,
+        indexs,
+        // 微信小程序无法将picker实例传出来，只能通过ref操作
+        picker = this.$refs.uPicker,
+      } = e
+      // 当第一列值发生变化时，变化第二列(后一列)对应的选项
+      if (columnIndex === 0) {
+        const province = this.provinceList[index]
+        const cityList = this.getCityList(province.pkId)
+        picker.setColumnValues(1, cityList)
+        if (this.countyList.length) {
+          const city = cityList[0]
+          const countyList = this.getCountyList(city.pkId)
+          picker.setColumnValues(2, countyList)
+        }
+        // picker为选择器this实例，变化第二列对应的选项
+      } else if (columnIndex === 1 && this.countyList.length) {
+        const city = cityList[indexs[columnIndex]]
+        const countyList = this.getCountyList(city.pkId)
+        picker.setColumnValues(2, countyList)
+      }
+    },
+    // 回调参数为包含columnIndex、value、values
+    confirm(e) {
+      this.pickershow = false
+      this.$emit('setAddress', e.value)
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.picker {
+  display: flex;
+  justify-content: space-between;
+  width: 100%;
+  border-width: 0.5px !important;
+  border-color: #dadbde !important;
+  border-style: solid;
+  border-radius: 4px;
+  padding: 6px 9px;
+}
+</style>

config/order.js

@@ -54,3 +54,7 @@ export const upgradeOrder = data =>
 // 确认收货
 export const confirmReceipt = orderCode =>
   http.put(`/sale/api/my-order/confirm/${orderCode}`)
+
+// 获取注册升级区域列表
+export const getRegionAreaList = params =>
+  http.get('/retail-member/api/retail-member/query-region', { params })

config/request.js

@@ -20,7 +20,7 @@ module.exports = vm => {
 
     //#ifdef DEV_SERVER
     console.log('DEV_SERVER')
-    config.baseURL = 'http://192.168.0.104:8080'
+    config.baseURL = 'http://192.168.0.86:8080'
     //#endif
 
     //#ifdef QA_SERVER

pages/commonMixins/regionSelect.js

@@ -0,0 +1,64 @@
+import { getRegionAreaList } from '@/config/order.js'
+
+export default {
+  data() {
+    return {
+      regionList: [],
+      provinceList: [],
+      cityList: [],
+      countyList: [],
+      regionCity: '',
+      regionProvince: '',
+      regionCounty: '',
+      gradeValue: null,
+      defaultRegionSelectCode: [],
+    }
+  },
+  computed: {},
+  methods: {
+    getRegionAreaList(gradeValue) {
+      if (!gradeValue) return
+      this.gradeValue = gradeValue
+      const params = {
+        type: 'county',
+      }
+      getRegionAreaList(params).then(res => {
+        this.provinceList = res.data.filter(item => item.parent === 0)
+        this.cityList = res.data.filter(item =>
+          this.provinceList.find(province => province.pkId === item.parent)
+        )
+        this.countyList = res.data.filter(item =>
+          this.cityList.find(city => city.pkId === item.parent)
+        )
+        this.getProvinceFilterList()
+        this.getCityFilterList()
+        this.getCountyFilterList()
+      })
+    },
+    getProvinceFilterList() {
+      if (!this.cityList.length) {
+        this.provinceList = []
+      }
+      this.provinceList = this.provinceList.filter(
+        item => !!this.cityList.find(city => city.parent === item.pkId)
+      )
+    },
+    getCityFilterList() {
+      if (this.gradeValue === 80) return
+      if (!this.countyList.length) {
+        this.cityList = []
+      }
+      this.cityList = this.cityList.filter(
+        item => !!this.countyList.find(county => county.parent === item.pkId)
+      )
+    },
+    getCountyFilterList() {
+      if (!this.gradeValue || this.gradeValue === 80) {
+        this.countyList = []
+      }
+    },
+  },
+  onShow() {
+    // this.getRegionAreaList()
+  },
+}

pages/regiest/index.vue

@@ -10,6 +10,27 @@
             disabled
           />
         </u-form-item>
+        <u-form-item
+          v-if="[60, 70, 80].includes(gradeValue)"
+          @click="regionSelectHandle"
+          label="会员区域"
+          borderBottom
+          prop="regionProvince"
+        >
+          <view class="disFlex justBwn">
+            <view v-if="regionAddress.length">
+              {{ regionAddress.map(item => item.name).join('-') }}
+            </view>
+            <view
+              v-else
+              class="uni-input-placeholder input-placeholder"
+              style="position: relative !important"
+              >请选择区域</view
+            >
+            <!-- <u-input v-model="form.regionProvince" border="none" disabled /> -->
+            <u-icon name="arrow-right"></u-icon>
+          </view>
+        </u-form-item>
         <u-form-item
           v-show="isRegiest"
           :label="'推荐编号'"
@@ -401,6 +422,13 @@
       :defaultCode="defaultCode"
       @addressData="addressData"
     ></v-address>
+    <RegionAddress
+      ref="regionAddress"
+      :provinceList="provinceList"
+      :cityList="cityList"
+      :countyList="countyList"
+      @setAddress="setRegionAddress"
+    ></RegionAddress>
   </view>
 </template>
 
@@ -415,14 +443,19 @@ import {
   REPURCHASE_AREA,
   REISSUE_AREA,
 } from '@/util/specialAreaMap'
+import regionSelect from '@/pages/commonMixins/regionSelect'
+import RegionAddress from '@/components/region-address.vue'
 export default {
+  mixins: [regionSelect],
   components: {
     'v-address': address,
     mustAgreeMent,
     agreement,
+    RegionAddress,
   },
   data() {
     return {
+      regionAddress: [],
       isDeliveryWay: true,
       pt: false,
       isDp: false,
@@ -433,6 +466,7 @@ export default {
       defaultCode: [],
       moren: '',
       addressList: [],
+      userInfo: uni.getStorageSync('User'),
       deliList: [],
       transList: [],
       queryCardList: [],
@@ -444,7 +478,6 @@ export default {
       isTrans: false,
       countryIndex: 0,
       isCountry: false,
-      userInfo: '',
       countryList: [],
       isClick: 0,
       specialArea: '',
@@ -574,6 +607,7 @@ export default {
       },
       delId: '',
       selTable: [],
+      gradeValue: '',
     }
   },
   computed: {
@@ -618,8 +652,6 @@ export default {
     this.getPageList()
     // 幂等性
     this.getGenerate()
-    //  登录信息
-    this.userInfo = uni.getStorageSync('User')
     this.setPageTitle(this.specialArea)
   },
   onShow() {
@@ -627,6 +659,14 @@ export default {
     this.getAddressList()
   },
   methods: {
+    regionSelectHandle() {
+      console.log(this.provinceList, '....pkId')
+      this.$refs.regionAddress.setShow(this.provinceList[0].pkId)
+    },
+    setRegionAddress(area) {
+      console.log(area, '....area')
+      this.regionAddress = area
+    },
     setPageTitle(areaId) {
       const areaList = [
         REGIEST_AREA,
@@ -788,6 +828,10 @@ export default {
         if (res.code == 200) {
           if (res.data.isEnough) {
             this.form.pkGradeVal = res.data.pkGradeVal
+            if ([60, 70, 80].includes(res.data.gradeValue)) {
+              this.gradeValue = res.data.gradeValue
+              this.getRegionAreaList(res.data.gradeValue)
+            }
           } else {
             this.form.pkGradeVal = ''
             uni.showToast({
@@ -1144,6 +1188,19 @@ export default {
       })
     },
     goBuy() {
+      const extParams = {}
+      if ([60, 70, 80].includes(this.gradeValue) && this.provinceList.length) {
+        if (!this.regionAddress.length) {
+          uni.showToast({
+            title: '请选择会员区域',
+            icon: 'none',
+          })
+          return
+        }
+        extParams.regionProvince = this.regionAddress[0]?.pkId || -1
+        extParams.regionCity = this.regionAddress[1]?.pkId || -1
+        extParams.regionCounty = this.regionAddress[2]?.pkId || -1
+      }
       this.$refs.uForm.validate().then(res => {
         this.isLoading = true
         let deleteList = []

pages/upgrade/index.vue

@@ -674,6 +674,7 @@ export default {
       }
       api.memLevel(params).then(res => {
         if (res.code == 200) {
+          console.log(res.data, 'res.data.memLevel')
           if (res.data.isEnough) {
             this.form.pkGradeVal = res.data.pkGradeVal
           } else {