Browse Source

Merge branch 'deploy' of chelingzhu-web/zxyj-admin-html into master

lilei 4 years ago
parent
commit
1710df00d3

+ 21 - 0
src/api/station.js

@@ -57,3 +57,24 @@ export const stationUnBind = (params) => {
     data: params
   })
 }
+// 查询省
+export const getProvince = () => {
+  return axios.request({
+    url: `/area/PROVINCE`,
+    method: 'get'
+  })
+}
+// 查询市
+export const getCityByPro = params => {
+  return axios.request({
+    url: `/area/CITY/${params.id}`,
+    method: 'get'
+  })
+}
+// 查询区
+export const getDistrictByCity = params => {
+  return axios.request({
+    url: `/area/DISTRICT/${params.id}`,
+    method: 'get'
+  })
+}

+ 97 - 28
src/views/equipmentManage/network/editModal.vue

@@ -25,16 +25,31 @@
           placeholder="请输入网点名称(最多30个字符)"
           allowClear />
       </a-form-item>
-      <a-form-item label="地址" :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol">
-        <a-cascader
-          id="network-edit-areas"
-          v-decorator="[
-            'options',
-            {initialValue: areas,
-             rules: [{ required: true, message: '请选择省市区' }]}
-          ]"
-          :options="options"
-          placeholder="请选择省市区" />
+      <a-form-item label="地址" required :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol" style="margin: 0;">
+        <a-row :gutter="20">
+          <!-- 地址 -->
+          <a-col span="8">
+            <a-form-item>
+              <a-select id="network-edit-provinceCode" @change="getCityList" v-decorator="['formData.provinceCode', { initialValue: formData.provinceCode, rules: [{ required: true, message: '请选择省' }] }]" placeholder="请选择省">
+                <a-select-option v-for="item in addrProvinceList" :value="item.id" :key="item.id + 'a'">{{ item.name }}</a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col span="8">
+            <a-form-item prop="cityCode">
+              <a-select id="network-edit-cityCode" v-decorator="['formData.cityCode', { initialValue: formData.cityCode, rules: [{ required: true, message: '请选择市' }] }]" @change="getAreaList" placeholder="请选择市">
+                <a-select-option v-for="item in addrCityList" :value="item.id" :key="item.id + 'b'">{{ item.name }}</a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col span="8">
+            <a-form-item prop="districtCode">
+              <a-select id="network-edit-districtCode" v-decorator="['formData.districtCode', { initialValue: formData.districtCode, rules: [{ required: true, message: '请选择区' }] }]" @change="areaCharged" placeholder="请选择区/县">
+                <a-select-option v-for="item in addrDistrictList" :value="item.id" :key="item.id + 'c'">{{ item.name }}</a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+        </a-row>
       </a-form-item>
       <a-form-item label="详细地址" :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol">
         <a-input
@@ -125,8 +140,7 @@
 </template>
 
 <script>
-import addrData, { province, city, area } from '@/api/address'
-import { stationSave, stationFind } from '@/api/station'
+import { stationSave, stationFind, getProvince, getCityByPro, getDistrictByCity } from '@/api/station'
 import { goldExListQuery } from '@/api/exchangeSetting.js'
 import { deliveryTimeListQuery } from '@/api/openTimeSetting.js'
 export default {
@@ -151,19 +165,23 @@ export default {
       },
       formData: {
         name: null, //  网点名称
-        provinceCode: null, //  省
-        cityCode: null, // 市
-        districtCode: null, // 区
+        provinceCode: undefined, //  省
+        provinceName: '',
+        cityCode: undefined, // 市
+        cityName: '',
+        districtCode: undefined, // 区
+        districtName: '',
         address: '', //  详细地址
         lat: '', //  纬度
         lng: '', //  经度
         goldExRuleNo: undefined, //  兑换规则
         deliveryTimeRuleNo: undefined //  投递时间段
       },
-      options: addrData, //  省市区下拉数据
-      areas: [], //  省市区 值
       goldExRuleNoList: [], //  兑换规则下拉数据
-      deliveryTimeRuleNoList: [] //  投递时间段下拉数据
+      deliveryTimeRuleNoList: [], //  投递时间段下拉数据
+      addrProvinceList: [], //  省下拉
+      addrCityList: [], //  市下拉
+      addrDistrictList: [] //  区下拉
     }
   },
   computed: {
@@ -177,8 +195,12 @@ export default {
       stationFind({ id: this.networkId }).then(res => {
         if (res.status == 200) {
           //  省市区
-          this.areas = [res.data.provinceCode, res.data.cityCode, res.data.districtCode]
+          this.getCityList(res.data.provinceCode)
+          this.getAreaList(res.data.cityCode)
           this.form.setFieldsValue({ 'formData.name': res.data.name })
+          this.form.setFieldsValue({ 'formData.provinceCode': res.data.provinceCode })
+          this.form.setFieldsValue({ 'formData.cityCode': res.data.cityCode })
+          this.form.setFieldsValue({ 'formData.districtCode': res.data.districtCode })
           this.form.setFieldsValue({ 'formData.address': res.data.address })
           this.form.setFieldsValue({ 'formData.lat': res.data.lat })
           this.form.setFieldsValue({ 'formData.lng': res.data.lng })
@@ -193,16 +215,11 @@ export default {
       const _this = this
       this.form.validateFields((err, values) => {
         if (!err) {
-          if (values.options.length) {
-            values.formData.provinceCode = values.options[0]
-            values.formData.provinceName = _.find(province, ['code', values.options[0]]).name
-            values.formData.cityCode = values.options[1]
-            values.formData.cityName = _.find(city, ['code', values.options[1]]).name
-            values.formData.districtCode = values.options[2]
-            values.formData.districtName = _.find(area, ['code', values.options[2]]).name
-          }
           const formData = values.formData
           formData.id = this.networkId || null
+          formData.provinceName = _this.addrProvinceList.find(item => item.id == formData.provinceCode).name
+          formData.cityName = _this.addrCityList.find(item => item.id == formData.cityCode).name
+          formData.districtName = _this.addrDistrictList.find(item => item.id == formData.districtCode).name
           stationSave(formData).then(res => {
             if (res.status == 200) {
               _this.$message.success(res.message)
@@ -234,6 +251,58 @@ export default {
           this.goldExRuleNoList = []
         }
       })
+    },
+    // 获取省列表'
+    getProvinceList () {
+      getProvince().then(res => {
+        if (res.status == 200) {
+          this.addrProvinceList = res.data || []
+        } else {
+          this.addrProvinceList = []
+        }
+      })
+    },
+    // 获取城市列表
+    getCityList (val) {
+      this.addrCityList = []
+      this.addrDistrictList = []
+      this.form.setFieldsValue({ 'formData.cityCode': undefined })
+      this.form.setFieldsValue({ 'formData.districtCode': undefined })
+      this.form.setFieldsValue({ 'formData.address': '' })
+      this.getCityListRequest(val)
+    },
+    getCityListRequest (val) {
+      getCityByPro({
+        id: val
+      }).then(res => {
+        if (res.status == 200) {
+          this.addrCityList = res.data || []
+        } else {
+          this.addrCityList = []
+        }
+      })
+    },
+    // 获取区县列表
+    getAreaList (val) {
+      this.addrDistrictList = []
+      this.form.setFieldsValue({ 'formData.districtCode': undefined })
+      this.form.setFieldsValue({ 'formData.address': '' })
+      this.getAreaListRequest(val)
+    },
+    getAreaListRequest (val) {
+      getDistrictByCity({
+        id: val
+      }).then(res => {
+        if (res.status == 200) {
+          this.addrDistrictList = res.data || []
+        } else {
+          this.addrDistrictList = []
+        }
+      })
+    },
+    // 区县变更
+    areaCharged (val) {
+      this.form.setFieldsValue({ 'formData.address': '' })
     }
   },
   watch: {
@@ -246,9 +315,9 @@ export default {
       if (!newValue) {
         this.$emit('close')
       } else {
+        this.getProvinceList()
         this.getdeliveryTimeRule() //  投递时间段
         this.getgoldExRule() //  兑换规则
-        this.areas = []
         this.form.resetFields()
       }
     },

+ 82 - 29
src/views/equipmentManage/network/network.vue

@@ -20,13 +20,24 @@
             </a-form-item>
           </a-col>
           <a-col :span="6">
-            <a-form-item label="区域" :label-col="formItemLayout.labelCol" :wrapper-col="formItemLayout.wrapperCol">
-              <a-cascader
-                id="network-areas"
-                v-model="areas"
-                :options="options"
-                placeholder="请选择省市区"
-                @change="addrChange"/>
+            <a-form-item prop="provinceCode" label="省:">
+              <a-select v-model="queryParam.provinceCode" @change="getCityList" placeholder="请选择省">
+                <a-select-option v-for="item in addrProvinceList" :value="item.id" :key="item.id + 'a'">{{ item.name }}</a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :span="6">
+            <a-form-item prop="cityCode" label="市:">
+              <a-select v-model="queryParam.cityCode" @change="getAreaList" placeholder="请选择市">
+                <a-select-option v-for="item in addrCityList" :value="item.id" :key="item.id + 'b'">{{ item.name }}</a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :span="6">
+            <a-form-item prop="districtCode" label="区:">
+              <a-select v-model="queryParam.districtCode" placeholder="请选择区/县">
+                <a-select-option v-for="item in addrDistrictList" :value="item.id" :key="item.id + 'c'">{{ item.name }}</a-select-option>
+              </a-select>
             </a-form-item>
           </a-col>
           <a-col :span="6">
@@ -84,12 +95,11 @@
 
 <script>
 import { STable, VSelect } from '@/components'
-import addrData from '@/api/address'
 import moment from 'moment'
 import editNetworkModal from './editModal.vue'
 import detailsNetworkModal from './detailsModal.vue'
 import equipmentModal from './equipmentModal.vue'
-import { stationList } from '@/api/station'
+import { stationList, getProvince, getCityByPro, getDistrictByCity } from '@/api/station'
 export default {
   name: 'Network',
   components: { STable, VSelect, editNetworkModal, detailsNetworkModal, equipmentModal },
@@ -104,9 +114,9 @@ export default {
         beginDate: null, // 开始时间
         endDate: null, // 结束时间
         queryWord: '', //  网点名称
-        provinceCode: null, //  省
-        cityCode: null, // 市
-        districtCode: null // 区
+        provinceCode: undefined, //  省
+        cityCode: undefined, // 市
+        districtCode: undefined // 区
       },
       // 表头
       columns: [
@@ -138,14 +148,15 @@ export default {
       // 将默认当天时间日期回显在时间选择框中
       time: [],
       dateFormat: 'YYYY-MM-DD',
-      options: addrData, //  省市区下拉数据
-      areas: [], //  省市区 值
       orderTotal: '', // 合计开单数量
       openNetworkModal: false, //  新增编辑网点信息
       networkId: null, //  网点id
       networkNo: null, //  网点编号
       openDetailModal: false, //  网点信息详情
-      openBindModal: false //  绑定箱体设备
+      openBindModal: false, //  绑定箱体设备
+      addrProvinceList: [],  //  省下拉
+      addrCityList: [],  //  市下拉
+      addrDistrictList: [],  //  区下拉
     }
   },
   methods: {
@@ -161,25 +172,18 @@ export default {
         this.queryParam.endDate = dateStrings[1]
       }
     },
-    //  省市区  change
-    addrChange (val) {
-      this.queryParam.provinceCode = val[0]
-      this.queryParam.cityCode = val[1]
-      this.queryParam.districtCode = val[2]
-    },
     // 重置
     handleReset () {
-      this.queryParam.beginDate = null
-      this.queryParam.endDate = null
+      this.queryParam.beginDate = undefined
+      this.queryParam.endDate = undefined
       this.queryParam.queryWord = ''
-      this.queryParam.provinceCode = null
-      this.queryParam.cityCode = null
-      this.queryParam.districtCode = null
+      this.queryParam.provinceCode = undefined
+      this.queryParam.cityCode = undefined
+      this.queryParam.districtCode = undefined
       this.time = []
-      this.areas = []
       this.$refs.table.refresh(true)
-      this.networkId = null
-      this.networkNo = null
+      this.networkId = undefined
+      this.networkNo = undefined
     },
     //  新增、编辑网点
     handleEdit (row) {
@@ -206,7 +210,56 @@ export default {
       this.openDetailModal = false
       this.openBindModal = false
       this.$refs.table.refresh()
+    },
+    // 获取省列表'
+    getProvinceList () {
+      getProvince().then(res => {
+        if (res.status == 200) {
+          this.addrProvinceList = res.data || []
+        } else {
+          this.addrProvinceList = []
+        }
+      })
+    },
+    // 获取城市列表
+    getCityList (val) {
+      this.addrCityList = []
+      this.addrDistrictList = []
+      this.queryParam.cityCode = undefined
+      this.queryParam.districtCode = undefined
+      this.getCityListRequest(val)
+    },
+    getCityListRequest (val) {
+      getCityByPro({
+        id: val
+      }).then(res => {
+        if (res.status == 200) {
+          this.addrCityList = res.data || []
+        } else {
+          this.addrCityList = []
+        }
+      })
+    },
+    // 获取区县列表
+    getAreaList (val) {
+      this.addrDistrictList = []
+      this.queryParam.districtCode = undefined
+      this.getAreaListRequest(val)
+    },
+    getAreaListRequest (val) {
+      getDistrictByCity({
+        id: val
+      }).then(res => {
+        if (res.status == 200) {
+          this.addrDistrictList = res.data || []
+        } else {
+          this.addrDistrictList = []
+        }
+      })
     }
+  },
+  mounted () {
+    this.getProvinceList()
   }
 }
 </script>