|
@@ -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()
|
|
|
}
|
|
|
},
|