This commit is contained in:
liuye
2022-06-14 17:20:10 +08:00

View File

@@ -2,14 +2,14 @@
<div class="SelectGird"> <div class="SelectGird">
<div class="header-middle"> <div class="header-middle">
<div class="hint"> <div class="hint">
<span v-for="(item, index) in slectList" :key="index"> <span v-for="(item, index) in selectList" :key="index">
<span v-if="index" style="margin:0 4px;" v-text="`/`"/> <span v-if="index" style="margin:0 4px;" v-text="`/`"/>
<span style="color:#3F8DF5" @click="girdNameClick(item, index)" v-text="item.girdName"/> <span style="color:#3F8DF5" @click="girdNameClick(item, index)" v-text="item.girdName"/>
</span> </span>
</div> </div>
<div class="showTypes"> <div class="showTypes">
<div v-if="treeList.length > 0"> <div v-if="options.length > 0">
<div class="cards" v-for="(item, index) in treeList" :key="index" @click="itemClick(item)"> <div class="cards" v-for="(item, index) in options" :key="index" @click="itemClick(item)">
<div class="imges"> <div class="imges">
<img src="./img/xzh.png" alt="" class="imgselect" v-if="item.isChecked" <img src="./img/xzh.png" alt="" class="imgselect" v-if="item.isChecked"
@click.stop="girdClick(item, index)"/> @click.stop="girdClick(item, index)"/>
@@ -37,12 +37,13 @@ import {mapState} from "vuex";
export default { export default {
name: 'SelectGird', name: 'SelectGird',
appName: "网格选择",
data() { data() {
return { return {
SelectGird: {}, SelectGird: {},
allData: null, allData: null,
treeList: [], options: [],
slectList: [], selectList: [],
parentGirdId: '', parentGirdId: '',
isFormMap: 0, //1为网格地图 一级不允许选中 isFormMap: 0, //1为网格地图 一级不允许选中
} }
@@ -50,15 +51,15 @@ export default {
computed: { computed: {
...mapState(['user']), ...mapState(['user']),
isMyGirds() { isMyGirds() {
return this.$route.query.self == true return this.$route?.query.self == true
}, },
isGridMember() { isGridMember() {
return this.user.girdCheckType > 0 return this.user.girdCheckType > 0
}, },
//是否是网格员申报 //是否是网格员申报
isApply: v => v.$route.query.formType == 2, isApply: v => v.$route?.query.formType == 2,
clearable: v => v.$route.query.clearable, clearable: v => v.$route?.query.clearable,
selected: v => [v.$route.query.selected].flat() selected: v => [v.$route?.query.selected].flat()
}, },
onLoad(option) { onLoad(option) {
if (option.isFormMap) { if (option.isFormMap) {
@@ -68,7 +69,7 @@ export default {
}, },
methods: { methods: {
getAllGrids() { getAllGrids() {
this.slectList = [] this.selectList = []
let {girdMemberId} = this.user, let {girdMemberId} = this.user,
url = `/app/appgirdmemberinfo/queryMyGirdListByLevel2AndUser`, url = `/app/appgirdmemberinfo/queryMyGirdListByLevel2AndUser`,
params = {girdMemberId} params = {girdMemberId}
@@ -94,15 +95,15 @@ export default {
params: {girdId: last} params: {girdId: last}
}).then(res => { }).then(res => {
if (res?.data) { if (res?.data) {
this.slectList = [{girdName: '可选范围', id: ''}, res.data.filter(e => !!this.allData.find(a => a.id == e.id))].flat() this.selectList = [{girdName: '可选范围', id: ''}, res.data.filter(e => !!this.allData.find(a => a.id == e.id))].flat()
this.getGridsByGridMemberAndParent({id: last}) this.getGridsByGridMemberAndParent({id: last})
} }
}) })
} else { } else {
this.treeList = this.allData.filter((e, i, arr) => !arr.map(e => e.id).includes(e.parentGirdId) || this.isMyGirds) this.options = this.allData.filter((e, i, arr) => !arr.map(e => e.id).includes(e.parentGirdId) || this.isMyGirds)
this.treeList.map((item) => item.isChecked = this.selected.includes(item.id)) this.options.map((item) => item.isChecked = this.selected.includes(item.id))
let obj = {girdName: '可选范围', id: ''} let obj = {girdName: '可选范围', id: ''}
this.slectList.push(obj) this.selectList.push(obj)
} }
}, },
itemClick(row) { itemClick(row) {
@@ -111,33 +112,33 @@ export default {
girdName: row.girdName, girdName: row.girdName,
id: row.id, id: row.id,
} }
this.slectList.push(obj) this.selectList.push(obj)
this.getGridsByGridMemberAndParent(row) this.getGridsByGridMemberAndParent(row)
} }
}, },
getGridsByGridMemberAndParent(row) { getGridsByGridMemberAndParent(row) {
let {id: parentGirdId} = row let {id: parentGirdId} = row
this.treeList = this.allData.filter(e => e.parentGirdId == parentGirdId) this.options = this.allData.filter(e => e.parentGirdId == parentGirdId)
this.treeList.map((item) => item.isChecked = this.selected.includes(item.id)) this.options.map((item) => item.isChecked = this.selected.includes(item.id))
}, },
girdNameClick(row, index) { girdNameClick(row, index) {
if (!index) { //第一级别 if (!index) { //第一级别
this.slectList = [] this.selectList = []
this.treeInit(true) this.treeInit(true)
} else { } else {
this.slectList.splice(index, 8) this.selectList.splice(index, 8)
this.getGridsByGridMemberAndParent(row) this.getGridsByGridMemberAndParent(row)
} }
}, },
girdClick(row, index) { girdClick(row, index) {
if (this.treeList[index].isChecked) {//取消 if (this.options[index].isChecked) {//取消
this.treeList[index].isChecked = false this.options[index].isChecked = false
this.SelectGird = {} this.SelectGird = {}
} else { } else {
this.treeList.map((item) => { this.options.map((item) => {
item.isChecked = false item.isChecked = false
}) })
this.treeList[index].isChecked = true this.options[index].isChecked = true
this.SelectGird = row this.SelectGird = row
} }
this.$forceUpdate() this.$forceUpdate()
@@ -236,7 +237,6 @@ export default {
} }
} }
} }
} }
.subBtn { .subBtn {
@@ -267,6 +267,5 @@ export default {
} }
} }
} }
} }
</style> </style>