Skip to content

Z
zhongtai-ui
提交 11025751 authored 作者: 黎业扬's avatar 黎业扬
浏览文件
操作

yang

上级 735c67da
显示空白字符变更
内嵌 并排
正在显示 包含 398 行增加 和 60 行删除
src/api/backstage/point.js
浏览文件 @ 11025751
......@@ -100,3 +100,11 @@ export function exportPoint(query) {
params: query
})
}
// 根据父类id 获取子区域列表
export function getAreaByParentId(id) {
return request({
url: '/backstage/area/getAreaByParentId?parentId='+id,
method: 'get',
})
}
src/views/backstage/point/index.vue
浏览文件 @ 11025751
......@@ -60,7 +60,7 @@
<!-- @keyup.enter.native="handleQuery"-->
<!-- />-->
<!-- </el-form-item>-->
<el-form-item label="统计点类型" prop="type">
<!-- <el-form-item label="统计点类型" prop="type">
<el-select v-model="queryParams.type" placeholder="请选择统计点类型" clearable size="small">
<el-option label="省级" value="1" />
<el-option label="市级" value="2" />
......@@ -68,16 +68,55 @@
<el-option label="乡级" value="4" />
<el-option label="村级" value="5" />
<el-option label="自然村" value="6" />
</el-select>
</el-form-item> -->
<!--
联动筛选 省级、地级、县级、乡级、行政村级、自然村
-->
<!-- 省级 -->
<el-form-item label="省级" prop="type">
<el-select v-model="provinceList.id" clearable size="small" @change="selectChanged01" >
<el-option v-for="item in provinceList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<!-- 地级 -->
<el-form-item label="地级" prop="type">
<el-select v-model="cityList.id" clearable size="small" @change="selectChanged02" >
<el-option v-for="item in cityList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<!-- 县级 -->
<el-form-item label="县级" prop="type">
<el-select v-model="districtList.id" clearable size="small" @change="selectChanged03" >
<el-option v-for="item in districtList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<!-- 乡级 -->
<el-form-item label="乡级" prop="type">
<el-select v-model="streetList.id" clearable size="small" @change="selectChanged04" >
<el-option v-for="item in streetList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<!-- 行政村级 -->
<el-form-item label="行政村级" prop="type">
<el-select v-model="administrativeVillageList.id" clearable size="small" @change="selectChanged05" >
<el-option v-for="item in administrativeVillageList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<!-- 自然村 -->
<el-form-item label="自然村" prop="type">
<el-select v-model="naturalVillageList.id" clearable size="small" @change="selectChanged06" >
<el-option v-for="item in naturalVillageList" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
<div style="display:flex;justify-content: space-between;">
<el-form-item>
<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-row :gutter="10" style="margin:0;" >
<el-col :span="1.5">
<el-button
type="primary"
......@@ -116,8 +155,11 @@
v-hasPermi="['backstage:point:export']"
>导出</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
<!-- <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> -->
</el-row>
</div>
</el-form>
<el-table
:data="pointList"
......@@ -153,7 +195,7 @@
</template>
</el-table-column>
<el-table-column min-width="50px" label="统计点类型" align="center" prop="type" >
<<template scope="scope">
<template scope="scope">
<span v-if="scope.row.type == 1">省级</span>
<span v-if="scope.row.type == 2">市级</span>
<span v-if="scope.row.type == 3">县级</span>
......@@ -305,7 +347,20 @@
</template>
<script>
import { getProjectList, changeStatus, listBySuperiorId, listByProvince, cascadeList, listPoint, getPoint, delPoint, addPoint, updatePoint, exportPoint } from "@/api/backstage/point";
import {
getProjectList,
changeStatus,
listBySuperiorId,
listByProvince,
cascadeList,
listPoint,
getPoint,
delPoint,
addPoint,
updatePoint,
exportPoint,
getAreaByParentId
} from "@/api/backstage/point";
export default {
name: "Point",
......@@ -454,11 +509,41 @@ export default {
levelValue:[
{required: true, message: "统计点所属层级不能为空，请选择统计点层级", trigger: 'change' }
],
}
},
/*
联动筛选层级的内容
*/
// getParams: {
// pageNum: 1,
// pageSize: 1000,
// type: 1,
// },
provinceList: [], //省级
cityList: [], //地级
districtList: [], //县级
streetList: [], //乡级
administrativeVillageList: [], //行政村级
naturalVillageList: [], //自然村
provinceId: null, //省级
cityId: null, //地级
districtId: null, //县级
streetId: null, //乡级
administrativeVillageId: null, //行政村级
naturalVillageId: null, //自然村
};
},
created() {
this.getList();
this.getGangedList(1)
// this.getGangedList(2)
// this.getGangedList(3)
// this.getGangedList(4)
// this.getGangedList(5)
// this.getGangedList(6)
},
methods: {
/** 查询统计点列表 */
......@@ -470,6 +555,249 @@ export default {
this.loading = false;
});
},
// 联动获取筛选层级的子项
getGangedList(type){
listByProvince({
pageNum: 1,
pageSize: 1000,
type,
}).then(response => {
if(type==1){
this.provinceList = response.rows
console.log("获取省级列表",response.rows)
}
if(type==2){
this.cityList = response.rows
console.log("获取地级列表",response.rows)
}
if(type==3){
this.districtList = response.rows
console.log("获取县级列表",response.rows)
}
if(type==4){
this.streetList = response.rows
console.log("获取乡级列表",response.rows)
}
if(type==5){
this.administrativeVillageList = response.rows
console.log("获取行政村级列表",response.rows)
}
if(type==6){
this.naturalVillageList = response.rows
console.log("获取自然村列表",response.rows)
}
})
},
// 筛选-省级
selectChanged01(e){
this.provinceId = e
getAreaByParentId(e).then(response => {
if(response.code==200&&e){
// 获取当前项的名称
this.provinceList.forEach(item => {
if(item.id==e){
this.queryParams.totalLevelName = item.name
}
})
// 获取地级列表
this.cityList = response.data
console.log("获取地级列表",response.data)
// 清空其他项
this.districtList = []
this.streetList = []
this.administrativeVillageList = []
this.naturalVillageList = []
}else{
// 恢复默认内容
this.queryParams.totalLevelName = null
// this.getGangedList(2)
// this.getGangedList(3)
// this.getGangedList(4)
// this.getGangedList(5)
// this.getGangedList(6)
// 清空其他项
this.cityList = []
this.districtList = []
this.streetList = []
this.administrativeVillageList = []
this.naturalVillageList = []
}
})
},
// 筛选-地级
selectChanged02(e){
this.cityId = e
getAreaByParentId(e).then(response => {
if(response.code==200&&e){
// 获取当前项的名称
this.cityList.forEach(item => {
if(item.id==e){
this.queryParams.totalLevelName = item.name
}
})
// 获取县级列表
this.districtList = response.data
console.log("获取县级列表",response.data)
// 清空其他项
this.streetList = []
this.administrativeVillageList = []
this.naturalVillageList = []
}else{
// 恢复默认内容
// this.getGangedList(3)
// this.getGangedList(4)
// this.getGangedList(5)
// this.getGangedList(6)
// 获取上一级的名称
this.provinceList.forEach(item => {
if(item.id==this.provinceId){
this.queryParams.totalLevelName = item.name
}
})
// 清空其他项
this.districtList = []
this.streetList = []
this.administrativeVillageList = []
this.naturalVillageList = []
}
})
},
// 筛选-县级
selectChanged03(e){
this.districtId = e
getAreaByParentId(e).then(response => {
if(response.code==200&&e){
// 获取当前项的名称
this.districtList.forEach(item => {
if(item.id==e){
this.queryParams.totalLevelName = item.name
}
})
// 获取乡级列表
this.streetList = response.data
console.log("获取乡级列表",response.data)
// 清空其他项
this.administrativeVillageList = []
this.naturalVillageList = []
}else{
// 恢复默认内容
// this.getGangedList(4)
// this.getGangedList(5)
// this.getGangedList(6)
// 获取上一级的名称
this.cityList.forEach(item => {
if(item.id==this.cityId){
this.queryParams.totalLevelName = item.name
}
})
// 清空其他项
this.streetList = []
this.administrativeVillageList = []
this.naturalVillageList = []
}
})
},
// 筛选-乡级
selectChanged04(e){
this.streetId = e
getAreaByParentId(e).then(response => {
if(response.code==200&&e){
// 获取当前项的名称
this.streetList.forEach(item => {
if(item.id==e){
this.queryParams.totalLevelName = item.name
}
})
// 获取行政村级列表
this.administrativeVillageList = response.data
console.log("获取行政村级列表",response.data)
// 清空其他项
this.naturalVillageList = []
}else{
// 恢复默认内容
// this.getGangedList(5)
// this.getGangedList(6)
// 获取上一级的名称
this.districtList.forEach(item => {
if(item.id==this.districtId){
this.queryParams.totalLevelName = item.name
}
})
// 清空其他项
this.administrativeVillageList = []
this.naturalVillageList = []
}
})
},
// 筛选-行政村级
selectChanged05(e){
this.administrativeVillageId = e
getAreaByParentId(e).then(response => {
if(response.code==200&&e){
// 获取当前项的名称
this.naturalVillageList.forEach(item => {
if(item.id==e){
this.queryParams.totalLevelName = item.name
}
})
// 获取自然村列表
this.naturalVillageList = response.data
console.log("获取自然村列表",response.data)
}else{
// 恢复默认内容
// this.getGangedList(6)
// 获取上一级的名称
this.streetList.forEach(item => {
if(item.id==this.streetId){
this.queryParams.totalLevelName = item.name
}
})
// 清空其他项
this.naturalVillageList = []
}
})
},
// 筛选-自然村
selectChanged06(e){
this.naturalVillageId = e
if(e){
// 获取当前项的名称
this.naturalVillageList.forEach(item => {
if(item.id==e){
this.queryParams.totalLevelName = item.name
}
})
}else{
// 获取上一级的名称
this.administrativeVillageList.forEach(item => {
if(item.id==this.administrativeVillageId){
this.queryParams.totalLevelName = item.name
}
})
}
},
// 取消按钮
cancel() {
this.open = false;
......@@ -501,6 +829,7 @@ export default {
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.queryParams.totalLevelName = null;
this.handleQuery();
},
// 多选框选中数据
......
src/views/backstage/project/index.vue
浏览文件 @ 11025751
......@@ -195,7 +195,8 @@
:options="statisticsPoints"
:props="{multiple: true, expandTrigger: 'hover',checkStrictly: true}"
filterable
clearable></el-cascader>
clearable
></el-cascader>
</div>
</el-form-item>
</el-form>
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论