|
@@ -5,7 +5,7 @@
|
|
|
|
|
|
<div class="select-div">
|
|
<div class="select-div">
|
|
<span class="address-title">省:</span>
|
|
<span class="address-title">省:</span>
|
|
- <el-select class="input" v-model="dept1" clearable :popper-append-to-body="false" placeholder="请选择">
|
|
|
|
|
|
+ <el-select class="input" v-model="dept1" clearable :popper-append-to-body="false" placeholder="请选择" @change="provinceChange">
|
|
<el-option
|
|
<el-option
|
|
v-for="item in provinces"
|
|
v-for="item in provinces"
|
|
:key="item.value"
|
|
:key="item.value"
|
|
@@ -15,7 +15,7 @@
|
|
</el-option>
|
|
</el-option>
|
|
</el-select>
|
|
</el-select>
|
|
<span class="address-title">地市:</span>
|
|
<span class="address-title">地市:</span>
|
|
- <el-select class="input" v-model="dept2" clearable :popper-append-to-body="false" placeholder="请选择">
|
|
|
|
|
|
+ <el-select class="input" v-model="dept2" clearable :popper-append-to-body="false" placeholder="请选择" @change="cityChange">
|
|
<el-option
|
|
<el-option
|
|
v-for="item in citys"
|
|
v-for="item in citys"
|
|
:key="item.value"
|
|
:key="item.value"
|
|
@@ -25,7 +25,7 @@
|
|
</el-option>
|
|
</el-option>
|
|
</el-select>
|
|
</el-select>
|
|
<span class="address-title">县(市区):</span>
|
|
<span class="address-title">县(市区):</span>
|
|
- <el-select class="input" v-model="dept3" clearable :popper-append-to-body="false" placeholder="请选择">
|
|
|
|
|
|
+ <el-select class="input" v-model="dept3" clearable :popper-append-to-body="false" placeholder="请选择" @change="areaChange">
|
|
<el-option
|
|
<el-option
|
|
v-for="item in areas"
|
|
v-for="item in areas"
|
|
:key="item.value"
|
|
:key="item.value"
|
|
@@ -35,7 +35,7 @@
|
|
</el-option>
|
|
</el-option>
|
|
</el-select>
|
|
</el-select>
|
|
<span class="address-title">乡镇(街道):</span>
|
|
<span class="address-title">乡镇(街道):</span>
|
|
- <el-select class="input1" clearable :popper-append-to-body="false" v-model="dept4" placeholder="请选择">
|
|
|
|
|
|
+ <el-select class="input1" clearable :popper-append-to-body="false" v-model="dept4" placeholder="请选择" @change="countyChange">
|
|
<el-option
|
|
<el-option
|
|
v-for="item in countys"
|
|
v-for="item in countys"
|
|
:key="item.value"
|
|
:key="item.value"
|
|
@@ -101,66 +101,19 @@
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
<script>
|
|
<script>
|
|
- import {} from "../api";
|
|
|
|
|
|
+ import storageUtil from '../util/storageUtil'
|
|
|
|
+ import { findDept, visitDeptPage, visitPersonPage } from '../api'
|
|
|
|
|
|
export default {
|
|
export default {
|
|
name: "Home",
|
|
name: "Home",
|
|
components: {},
|
|
components: {},
|
|
data() {
|
|
data() {
|
|
return {
|
|
return {
|
|
- provinces: [
|
|
|
|
- {
|
|
|
|
- value: '1',
|
|
|
|
- label: '吉林省',
|
|
|
|
- }, {
|
|
|
|
- value: '2',
|
|
|
|
- label: '辽宁省'
|
|
|
|
- }
|
|
|
|
- ], // 省份
|
|
|
|
- citys: [
|
|
|
|
- {
|
|
|
|
- value: '3',
|
|
|
|
- label: '长春市',
|
|
|
|
- }, {
|
|
|
|
- value: '4',
|
|
|
|
- label: '四平市'
|
|
|
|
- }, {
|
|
|
|
- value: '5',
|
|
|
|
- label: '辽源市'
|
|
|
|
- }, {
|
|
|
|
- value: '6',
|
|
|
|
- label: '白城市'
|
|
|
|
- }], // 市
|
|
|
|
- areas: [
|
|
|
|
- {
|
|
|
|
- value: '7',
|
|
|
|
- label: '宽城区'
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- value: '8',
|
|
|
|
- label: '朝阳区'
|
|
|
|
- },
|
|
|
|
- ], // 县
|
|
|
|
- countys: [
|
|
|
|
- {
|
|
|
|
- value: '9',
|
|
|
|
- label: '南广街道办事处'
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- value: '10',
|
|
|
|
- label: '西广街道办事处'
|
|
|
|
- },
|
|
|
|
- ], // 乡
|
|
|
|
- villages: [
|
|
|
|
- {
|
|
|
|
- value: '11',
|
|
|
|
- label: '东三条社区'
|
|
|
|
- },
|
|
|
|
- {
|
|
|
|
- value: '12',
|
|
|
|
- label: '西三条社区'
|
|
|
|
- },
|
|
|
|
- ], // 村
|
|
|
|
|
|
+ provinces: [], // 省份
|
|
|
|
+ citys: [], // 市
|
|
|
|
+ areas: [], // 县
|
|
|
|
+ countys: [], // 乡
|
|
|
|
+ villages: [], // 村
|
|
dept1: '',
|
|
dept1: '',
|
|
dept2: '',
|
|
dept2: '',
|
|
dept3: '',
|
|
dept3: '',
|
|
@@ -172,118 +125,82 @@
|
|
dataArr1: [],
|
|
dataArr1: [],
|
|
// 左二
|
|
// 左二
|
|
dataArr2: [],
|
|
dataArr2: [],
|
|
- listData: [
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
-
|
|
|
|
- ],
|
|
|
|
- listData1: [
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '张三', address: '桃园办事处', num: 56236},
|
|
|
|
- {name: '李四', address: '背景办事处', num: 50000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- {name: '周五', address: '背景办事处', num: 48000},
|
|
|
|
- ],
|
|
|
|
|
|
+ listData: [], //地区
|
|
|
|
+ listData1: [], //个人
|
|
isText:false
|
|
isText:false
|
|
};
|
|
};
|
|
},
|
|
},
|
|
- mounted() {
|
|
|
|
|
|
+ async mounted() {
|
|
|
|
+ this.provinces = await this.findDept({'level': '1'});
|
|
|
|
+ this.loadDeptData({});
|
|
|
|
+ this.loadPersonData({});
|
|
|
|
+
|
|
|
|
+ const deptArray = storageUtil.read('dept-array');
|
|
|
|
+ if(deptArray != null && deptArray != '' && deptArray.length > 0) {
|
|
|
|
+ for(let i = 0; i < deptArray.length; i++) {
|
|
|
|
+ this['dept' + (i + 1)] = deptArray[i];
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ if(this.dept1 != '') {
|
|
|
|
+ this.citys = await this.findDept({ fid: this.dept1 });
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ if(this.dept2 != '') {
|
|
|
|
+ this.areas = await this.findDept({ fid: this.dept2 });
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ if(this.dept3 != '') {
|
|
|
|
+ this.countys = await this.findDept({ fid: this.dept3 });
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ if(this.dept4 != '') {
|
|
|
|
+ this.villages = await this.findDept({ fid: this.dept4 });
|
|
|
|
+ }
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
|
|
+ //获取地区
|
|
|
|
+ async findDept(data) {
|
|
|
|
+ const result = await findDept(data, 'POST');
|
|
|
|
+ return result;
|
|
|
|
+ },
|
|
|
|
+ async provinceChange(val) {
|
|
|
|
+ this.citys = await this.findDept({ fid: val });
|
|
|
|
+ this.dept2 = '';
|
|
|
|
+ this.dept3 = '';
|
|
|
|
+ this.dept4 = '';
|
|
|
|
+ this.dept5 = '';
|
|
|
|
+ },
|
|
|
|
+ async cityChange(val) {
|
|
|
|
+ this.areas = await this.findDept({ fid: val });
|
|
|
|
+ this.dept3 = '';
|
|
|
|
+ this.dept4 = '';
|
|
|
|
+ this.dept5 = '';
|
|
|
|
+ },
|
|
|
|
+ async areaChange(val) {
|
|
|
|
+ this.countys = await this.findDept({ fid: val });
|
|
|
|
+ this.dept4 = '';
|
|
|
|
+ this.dept5 = '';
|
|
|
|
+ },
|
|
|
|
+ async countyChange(val) {
|
|
|
|
+ this.villages = await this.findDept({ fid: val });
|
|
|
|
+ this.dept5 = '';
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ async loadDeptData(obj) {
|
|
|
|
+ const result = await visitDeptPage(obj, 'POST');
|
|
|
|
+ this.listData = result;
|
|
|
|
+ },
|
|
|
|
+
|
|
|
|
+ async loadPersonData(obj) {
|
|
|
|
+ const result = await visitPersonPage(obj, 'POST');
|
|
|
|
+ this.listData1 = result;
|
|
|
|
+ },
|
|
|
|
+
|
|
//糊掉首页
|
|
//糊掉首页
|
|
goHome() {
|
|
goHome() {
|
|
- this.$router.push({
|
|
|
|
- path: '/'
|
|
|
|
- });
|
|
|
|
|
|
+ storageUtil.save('dept-array', '');
|
|
|
|
+ this.$router.push({ path: '/' });
|
|
},
|
|
},
|
|
// 省市选择框 展开
|
|
// 省市选择框 展开
|
|
zhankai() {
|
|
zhankai() {
|
|
@@ -296,13 +213,30 @@
|
|
},
|
|
},
|
|
// 省市选择框 确认
|
|
// 省市选择框 确认
|
|
queren() {
|
|
queren() {
|
|
- console.log(this.dept1)
|
|
|
|
- console.log(this.dept2)
|
|
|
|
- console.log(this.dept3)
|
|
|
|
- console.log(this.dept4)
|
|
|
|
- console.log(this.dept5)
|
|
|
|
- console.log(this.date)
|
|
|
|
- console.log("确定了")
|
|
|
|
|
|
+ let arr = new Array();
|
|
|
|
+ if(this.dept1 != '') {
|
|
|
|
+ arr.push(this.dept1);
|
|
|
|
+ }
|
|
|
|
+ if(this.dept2 != '') {
|
|
|
|
+ arr.push(this.dept2);
|
|
|
|
+ }
|
|
|
|
+ if(this.dept3 != '') {
|
|
|
|
+ arr.push(this.dept3);
|
|
|
|
+ }
|
|
|
|
+ if(this.dept4 != '') {
|
|
|
|
+ arr.push(this.dept4);
|
|
|
|
+ }
|
|
|
|
+ if(this.dept5 != '') {
|
|
|
|
+ arr.push(this.dept5);
|
|
|
|
+ }
|
|
|
|
+ storageUtil.save('dept-array', arr);
|
|
|
|
+
|
|
|
|
+ let param = {};
|
|
|
|
+ if(this.date != '' && this.date != null) {
|
|
|
|
+ param = {time: this.date};
|
|
|
|
+ }
|
|
|
|
+ this.loadDeptData(param);
|
|
|
|
+ this.loadPersonData(param);
|
|
},
|
|
},
|
|
// 滚动颜色
|
|
// 滚动颜色
|
|
scrollTextisColor: function (i) {
|
|
scrollTextisColor: function (i) {
|
|
@@ -324,7 +258,6 @@
|
|
} else if (i == 2) {
|
|
} else if (i == 2) {
|
|
return require("../assets/Ranking/3.png")
|
|
return require("../assets/Ranking/3.png")
|
|
}
|
|
}
|
|
-
|
|
|
|
},
|
|
},
|
|
},
|
|
},
|
|
computed: {
|
|
computed: {
|