控制器区
<?php
namespace app\index\controller;
use think\Controller;
use app\index\model\Region as regionModel;
class Index extends Controller
{
/**
* 城市三级联动
* @return array|mixed
*/
public function index()
{
if(request()->isPost())
{
$regionModel=new regionModel();
$type=input('post.type');
$parent=input('post.parent');
$province=$regionModel->region($type,$parent);
$position=$regionModel->position();
return ['province'=>$province,'position'=>$position];
}
return $this->fetch();
}
/**
* 市
* @return array
*/
public function searchCity()
{
if(request()->isPost())
{
$regionModel=new regionModel();
$id=input('post.id');
$city=$regionModel->searchCity($id);
return ['city'=>$city];
}
return ['error'=>'异常错误'];
}
/**
* 县
* @return array
*/
public function searchCounty()
{
if(request()->isPost())
{
$regionModel=new regionModel();
$id=input('post.id');
$county=$regionModel->searchCounty($id);
return ['county'=>$county];
}
return ['error'=>'异常错误'];
}
/**
* 乡镇
* @return array
*/
public function searchTown()
{
if(request()->isPost())
{
$regionModel=new regionModel();
$id=input('post.id');
$town=$regionModel->searchTown($id);
return ['town'=>$town];
}
return ['error'=>'异常错误'];
}
/**
* 村庄
* @return array
*/
public function searchVillage()
{
if(request()->isPost())
{
$regionModel=new regionModel();
$id=input('post.id');
$village=$regionModel->searchVillage($id);
return ['village'=>$village];
}
return ['error'=>'异常错误'];
}
html区
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" href="/static/admin/js/bootstrap.min.css">
<script type="text/javascript" src="/static/admin/layui/layui.js"></script>
<link rel="stylesheet" href="/static/admin/layui/css/layui.css">
<script type="text/javascript" src="/static/vue/vue.js"></script>
<title>Title</title>
</head>
<body>
<div id="app" class="form-inline" style="margin-top: 20px;margin-left: 20px;">
<div class="form-group searchMargin">
<label for="type1">省份：</label>
<select class="form-control" id="type1" name="region_id" @change="provinceSearch('#type1')">
<option value="">选择省份</option>
<option v-for="province in provinceModel" value="{{province.region_id}}">{{province.region_name}}</option>
</select>
</div>
<div class="form-group searchMargin" id="city">
<label for="type2">市区：</label>
<select class="form-control" id="type2" name="region_id" @change="citySearch('#type2')" >
<option value="">选择市区</option>
<option v-for="city in cityModel" value="{{city.region_id}}">{{city.region_name}}</option>
</select>
</div>
<div class="form-group searchMargin" id="country">
<label for="type3">乡/县：</label>
<select class="form-control" id="type3" name="region_id" >
<option value="">选择乡/县</option>
<option v-for="country in countryModel" value="{{country.region_id}}">{{country.region_name}}</option>
</select>
</div>
<div class="form-group searchMargin" id="img">
</div>
<div class="form-group searchMargin">
<input type="file" name="file" lay-type="file" class="layui-upload-file">
</div>
<!--五级联动start-->
<br/>
<br/>
<div class="form-group searchMargin" id="province">
<label for="type4">省份：</label>
<select class="form-control" id="type4" name="province_id" @change="positionSearch('#type4')">
<option value="">选择省份</option>
<option v-for="province in positionModel" value="{{province.province_id}}">{{province.province_name}}</option>
</select>
</div>
<div class="form-group searchMargin" id="municipal">
<label for="type5">市：</label>
<select class="form-control" id="type5" name="city_id" @change="countySearch('#type5')">
<option value="">选择市</option>
<option v-for="municipal in municipalModel" value="{{municipal.city_id}}">{{municipal.city_name}}</option>
</select>
</div>
<div class="form-group searchMargin" id="county">
<label for="type6">县：</label>
<select class="form-control" id="type6" name="county_id" @change="townSearch('#type6')">
<option value="">选择县</option>
<option v-for="county in countyModel" value="{{county.county_id}}">{{county.county_name}}</option>
</select>
</div>
<div class="form-group searchMargin" id="town">
<label for="type7">镇：</label>
<select class="form-control" id="type7" name="town_id" @change="villageSearch('#type7')">
<option value="">选择镇</option>
<option v-for="town in townModel" value="{{town.town_id}}">{{town.town_name}}</option>
</select>
</div>
<div class="form-group searchMargin" id="village">
<label for="type8">村：</label>
<select class="form-control" id="type8" name="village_id" >
<option value="">选择村</option>
<option v-for="village in villageModel" value="{{village.village_id}}">{{village.village_name}}</option>
</select>
</div>
<!--五级联动end-->
<div class="form-group searchMargin" id="timimg">
<label for="type3">定时发布时间：</label>
<div class="layui-inline">
<input class="layui-input" @blur="send()" name="timing" placeholder="自定义日期格式" onclick="layui.laydate({elem: this, istime: true, format: 'YYYY-MM-DD hh:mm:ss'})">
</div>
<button class="layui-btn" type="submit" @click="send()">确定</button>
</div>
</div>
</body>
<script type="text/javascript">
layui.use(['layer','jquery','upload','laydate'],function () {
let layer=layui.layer,$=layui.jquery;
layui.upload({
url:'/index/index/upload',
method:'post',
success:function (res) {
$("#img").append('<img src="/upload/image/'+res.info+'">');
console.log(res);
}
});
let app=new Vue({
el:'#app',
data:{
//三级联动
provinceModel:'', //省
cityModel:'', //市
countryModel:'', //县
//五级联动
positionModel:'', //省份
municipalModel:'', //市
countyModel:'', //县
townModel:'', //镇
villageModel:'', //村
type:1,
start:'',
end:'',
parent:1,
times:'',
cgi:{
list:'/',
searchCity:'/index/index/searchCity'
}
},
methods:{
showData:function () {
layer.msg('加载中...',{icon:16,time:1000});
let self=this;
$.ajax({
type:'post',
url:self.cgi.list,
data:{type:this.type,parent:this.parent},
dataType:'json',
success:function (result) {
console.log(result);
self.positionModel=result.position;
self.provinceModel=result.province;
}
})
},
provinceSearch:function (index) {
let parent=$(index).val();
let self=this;
$.ajax({
type:'post',
url:self.cgi.list,
data:{parent:parent,type:2},
dataType:'json',
success:function (result) {
console.log(result);
self.cityModel=result.province;
}
})
},
citySearch:function (index) {
let parent=$(index).val();
let self=this;
$.ajax({
type:'post',
url:self.cgi.list,
data:{parent:parent,type:3},
dataType:'json',
success:function (result) {
console.log(result);
self.countryModel=result.province;
}
})
},
/* <!--五级联动-->*/
positionSearch:function (index) {
let id=$(index).val();
let self=this;
$.ajax({
type:'post',
url:'/index/index/searchCity',
data:{id:id},
dataType:'json',
success:function (result) {
console.log(result);
self.municipalModel=result.city;
}
})
},
countySearch:function (index) {
let id=$(index).val();
let self=this;
$.ajax({
type:'post',
url:'/index/index/searchCounty',
data:{id:id},
dataType:'json',
success:function (result) {
console.log(result);
self.countyModel=result.county;
}
})
},
townSearch:function (index) {
let id=$(index).val();
let self=this;
$.ajax({
type:'post',
url:'/index/index/searchTown',
data:{id:id},
dataType:'json',
success:function (result) {
console.log(result);
self.townModel=result.town;
}
})
},
villageSearch:function (index) {
let id=$(index).val();
let self=this;
$.ajax({
type:'post',
url:'/index/index/searchVillage',
data:{id:id},
dataType:'json',
success:function (result) {
console.log(result);
self.villageModel=result.village;
}
})
},
send:function(){
let timing=$("input[name=timing]").val();
layer.msg(timing);
}
},
ready:function () {
this.showData();
}
});
});
</script>
</html>方法区
<?php
/**
* 城市联动Model
* Created by PhpStorm.
* User: 尔等已死
* Date: 2017/1/14
* Time: 13:03
* Description：Region
*/
namespace app\index\model;
use think\Model;
class Region extends Model
{
/**
* 地区三级联动
* @param $type
* @param $parent
* @return false|\PDOStatement|string|\think\Collection
*/
public function region($type,$parent)
{
return db('region')->where(array('region_type'=>$type,'parent_id'=>$parent))->cache(true)->select();
}
/**
* 地区五级联动 省份
* @return false|\PDOStatement|string|\think\Collection
*/
public function position()
{
return db('position')->field('province_name,province_id')->group('province_id')->cache(true)->select();
}
/**
* 地区五级联动 市
* @param $id
* @return false|\PDOStatement|string|\think\Collection
*/
public function searchCity($id)
{
return db('position')->field('city_name,city_id')->group('city_id')->where(array('province_id'=>$id))->cache(true)->select();
}
/**
* 地区五级联动 县
* @param $id
* @return false|\PDOStatement|string|\think\Collection
*/
public function searchCounty($id)
{
return db('position')->field('county_name,county_id')->group('county_id')->where(array('city_id'=>$id))->cache(true)->select();
}
/**
* 地区五级联动 镇
* @param $id
* @return false|\PDOStatement|string|\think\Collection
*/
public function searchTown($id)
{
return db('position')->field('town_name,town_id')->group('town_id')->where(array('county_id'=>$id))->cache(true)->select();
}
/**
* 地区五级联动 村
* @param $id
* @return false|\PDOStatement|string|\think\Collection
*/
public function searchVillage($id)
{
return db('position')->field('village_name,village_id')->group('village_id')->where(array('town_id'=>$id))->cache(true)->select();
}
}
1776
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
