xxb
127 lines
5.0 KiB
PHP
127 lines
5.0 KiB
PHP
<form id="vue-edit" class="am-form am-form-horizontal" action="/sys/addr/edit" data-auto="true" method="post" style="width: 90%;padding:25px 30px 20px 0;margin: 0 auto">
|
|
<div class="am-form-group">
|
|
<label class="am-para-label"><span class="com-must-star">*</span>城市：</label>
|
|
<div class="am-para-input wp50">
|
|
<select style="display: inline;width: 45%" name="city_id" v-model="info.city_id">
|
|
<option value="">选择城市</option>
|
|
<option :value="v.id" v-for="(v,i) in cityAry">{{v.name}}</option>
|
|
</select>
|
|
<select name="county_id" style="display: inline;width: 50%" v-model="info.county_id">
|
|
<option value="">选择行政区</option>
|
|
<option :value="v.id" v-for="(v,i) in countyAry">{{v.name}}</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="am-form-group">
|
|
<label class="am-para-label"><span class="com-must-star">*</span>地址：</label>
|
|
<div class="am-para-input"><input type="text" placeholder="请输地址" name="title" v-model="info.title"/></div>
|
|
</div>
|
|
<div class="am-form-group" style="margin-bottom: 2rem">
|
|
<div class="am-para-input"><button class="am-btn am-btn-secondary" type="button" @click="saveEdit">提交</button></div>
|
|
</div>
|
|
</form>
|
|
<script>
|
|
var loading = 0;
|
|
var vue_obj;
|
|
$(function(){
|
|
vue_obj = new Vue({
|
|
el: '#vue-edit',
|
|
data: {
|
|
info:{},
|
|
cityAry:[],
|
|
countyAry:[],
|
|
action:''
|
|
},
|
|
mounted:function(){
|
|
var vm = this;
|
|
vm.info = <?=json_encode($info)?>;
|
|
vm.action = '<?=$action?>';
|
|
vm.init_citys();
|
|
},
|
|
methods:{
|
|
init_citys:function() {
|
|
var vm = this;
|
|
$.ajax({
|
|
type: 'get',
|
|
url: '/common/area',
|
|
dataType: 'json',
|
|
data: {
|
|
id: '350',
|
|
key: 'city',
|
|
type: 1
|
|
},
|
|
success: function (response) {
|
|
if (response.code == 1) {
|
|
vm.cityAry = response.data;
|
|
}
|
|
}
|
|
});
|
|
},
|
|
saveEdit:function(){
|
|
var vm = this;
|
|
if(1 == loading){
|
|
return 0;
|
|
}
|
|
loading = 1;
|
|
|
|
$.ajax({
|
|
url: vm.action,
|
|
type: 'post',
|
|
dataType: 'json',
|
|
data: {info:vm.info},
|
|
beforeSend: function () {
|
|
layer.load(1, {
|
|
shade: [0.1, '#fff'] //0.1透明度的白色背景
|
|
});
|
|
},
|
|
success: function (data) {
|
|
loading = 0;
|
|
if (data['code']) {
|
|
layer.msg(data.msg, {
|
|
icon: 1,
|
|
time: 2000
|
|
}, function () {
|
|
window.location.reload();
|
|
});
|
|
} else {
|
|
layer.msg(data.msg, {icon: 2});
|
|
}
|
|
},
|
|
complete: function () {
|
|
loading = 0;
|
|
layer.closeAll('loading');
|
|
}
|
|
});
|
|
}
|
|
},
|
|
watch:{
|
|
'info.city_id':function(nv, ov){
|
|
var that = this;
|
|
if(nv == ''){
|
|
that.countyAry = [];
|
|
that.info.county_id = '';
|
|
} else {
|
|
if(nv.substring(0,4) != that.info.county_id.substring(0, 4)){
|
|
that.info.county_id = '';
|
|
}
|
|
$.ajax({
|
|
type: 'get',
|
|
url: '/common/area',
|
|
dataType: 'json',
|
|
data: {
|
|
id: nv,
|
|
key:'county',
|
|
type:1
|
|
},
|
|
success:function(response){
|
|
if (response.code == 1) {
|
|
that.countyAry = response.data;
|
|
}
|
|
}
|
|
});
|
|
}
|
|
}
|
|
}
|
|
});
|
|
});
|
|
</script>
|