地址选择

components/mobile/enterpriseCertification/stepOne.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="f-main">
     <div class="content-top">
-      <p>企业认证</p>
+      <p>企业认证{{this.allCityData}}</p>
     </div>
     <div class="f-form">
       <div class="page-part">
@@ -57,7 +57,9 @@
     <div>
       <mt-popup v-model="popupVisible" position="bottom" class="mint-popup">
         <template>
-          <address-choose/>
+          <!--<address-choose/>-->
+          <mt-picker :slots="myAddressSlots"></mt-picker>
+          <p>地址3级联动：{{myAddressProvince}} {{myAddressCity}} {{myAddresscounty}}</p>
         </template>
       </mt-popup>
     </div>
@@ -65,14 +67,15 @@
 </template>
 
 <script>
-  import addressChoose from '~components/mobile/enterpriseCertification/addressChoose.vue'
+  // import addressChoose from '~components/mobile/enterpriseCertification/addressChoose.vue'
   export default {
     name: 'step-one',
     components: {
-      addressChoose
+      // addressChoose
     },
     data () {
       return {
+        allCityData: {'北京市': {'市辖区': ['东城区', '西城区', '朝阳区', '延庆区']}},
         uploadFileChecked: false,
         isPdf: false,
         popupVisible: false,
@@ -88,37 +91,49 @@
           businessCodeImage: '',
           corporation: '',
           regAddress: ''
-        }
+        },
+        myAddressSlots: [
+          {
+            flex: 1,
+            defaultIndex: 1,
+            values: ['东城区', '西城区', '朝阳区', '延庆区'],
+            // values: Object.keys(this.allCityData),
+            className: 'slot1',
+            textAlign: 'center'
+          }, {
+            divider: true,
+            content: '-',
+            className: 'slot2'
+          }, {
+            flex: 1,
+            values: [],
+            className: 'slot3',
+            textAlign: 'center'
+          },
+          {
+            divider: true,
+            content: '-',
+            className: 'slot4'
+          },
+          {
+            flex: 1,
+            values: [],
+            className: 'slot5',
+            textAlign: 'center'
+          }
+        ],
+        myAddressProvince: '省',
+        myAddressCity: '市',
+        myAddresscounty: '区/县'
       }
     },
-    // mounted () {
-    //   // 获取城市地址
-    //   this.$http.get('/data/city.json').then(response => {
-    //     this.allCityData = response.data
-    //     for (let province in response.data) {
-    //       this.cityData.province = response.data[province]
-    //       console.log('省', this.cityData.province)
-    //       for (let city in this.cityData.province) {
-    //         this.cityData.city = this.cityData.province[city]
-    //         console.log('市', this.cityData.city)
-    //         for (let street in this.cityData.city) {
-    //           this.cityData.district = this.cityData.city[street]
-    //           console.log('区', this.cityData.district)
-    //         }
-    //       }
-    //     }
-    //   })
-    // },
+    mounted () {
+      // 获取城市地址
+      this.$http.get('/data/city.json').then(response => {
+        // this.allCityData = response.data
+      })
+    },
     methods: {
-      onDateChange (picker, values) {
-        if (values[0] > values[1]) {
-          picker.setSlotValue(1, values[0])
-        }
-        this.dateStart = values[0]
-        this.dateEnd = values[1]
-        console.log(values[0], '0')
-        console.log(values[1], '1')
-      },
       // 弹窗处理
       downToast (type) {
         this.$toast({