|
@@ -1,66 +1,76 @@
|
|
|
<style scoped>
|
|
|
-.transfer {
|
|
|
- display: flex;
|
|
|
-}
|
|
|
-.transfer .transfer-box {
|
|
|
- width: 350px;
|
|
|
- height: 250px;
|
|
|
- border: 1px solid #dadfe3;
|
|
|
- display: flex;
|
|
|
- overflow-x: auto;
|
|
|
- overflow-y: hidden;
|
|
|
- box-sizing: border-box;
|
|
|
- margin-right: 25px;
|
|
|
-}
|
|
|
-.content-box {
|
|
|
- min-width: 174px;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- border-right: 1px solid #dadfe3;
|
|
|
-}
|
|
|
-.content-box .content-title {
|
|
|
- width: 100%;
|
|
|
- background: #f8f9fa;
|
|
|
- border-bottom: 1px solid #dadfe3;
|
|
|
- padding: 5px 15px;
|
|
|
- font-size: 16px;
|
|
|
- font-weight: 700;
|
|
|
- line-height: 30px;
|
|
|
-}
|
|
|
-.content-box .content {
|
|
|
- width: 100%;
|
|
|
- height: 85%;
|
|
|
- overflow: auto;
|
|
|
-}
|
|
|
-.content-box .content p:hover {
|
|
|
- background: #edf1f5;
|
|
|
- cursor: pointer;
|
|
|
-}
|
|
|
-.content-box .content p:hover span {
|
|
|
- display: inline-block;
|
|
|
-}
|
|
|
-.content-box .content p span {
|
|
|
- display: none;
|
|
|
-}
|
|
|
-p {
|
|
|
- padding: 5px;
|
|
|
- margin-bottom: 0;
|
|
|
- border-bottom: 1px solid #f2f2f2;
|
|
|
-}
|
|
|
-.backgroundOnly {
|
|
|
- background: #edf1f5;
|
|
|
-}
|
|
|
+ .transfer {
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+
|
|
|
+ .transfer .transfer-box {
|
|
|
+ width: 350px;
|
|
|
+ height: 250px;
|
|
|
+ border: 1px solid #dadfe3;
|
|
|
+ display: flex;
|
|
|
+ overflow-x: auto;
|
|
|
+ overflow-y: hidden;
|
|
|
+ box-sizing: border-box;
|
|
|
+ margin-right: 25px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .content-box {
|
|
|
+ min-width: 174px;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ border-right: 1px solid #dadfe3;
|
|
|
+ }
|
|
|
+
|
|
|
+ .content-box .content-title {
|
|
|
+ width: 100%;
|
|
|
+ background: #f8f9fa;
|
|
|
+ border-bottom: 1px solid #dadfe3;
|
|
|
+ padding: 5px 15px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 700;
|
|
|
+ line-height: 30px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .content-box .content {
|
|
|
+ width: 100%;
|
|
|
+ height: 85%;
|
|
|
+ overflow: auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ .content-box .content p:hover {
|
|
|
+ background: #edf1f5;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+
|
|
|
+ .content-box .content p:hover span {
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+
|
|
|
+ .content-box .content p span {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ p {
|
|
|
+ padding: 5px;
|
|
|
+ margin-bottom: 0;
|
|
|
+ border-bottom: 1px solid #f2f2f2;
|
|
|
+ }
|
|
|
+
|
|
|
+ .backgroundOnly {
|
|
|
+ background: #edf1f5;
|
|
|
+ }
|
|
|
</style>
|
|
|
<style>
|
|
|
-.transfer .ant-checkbox-group {
|
|
|
- width: 100px;
|
|
|
- overflow-x: hidden;
|
|
|
-}
|
|
|
-.transfer .ant-checkbox-group-item {
|
|
|
- display: inline-block;
|
|
|
- margin-right: 8px;
|
|
|
- width: 100%;
|
|
|
-}
|
|
|
+ .transfer .ant-checkbox-group {
|
|
|
+ width: 100px;
|
|
|
+ overflow-x: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+ .transfer .ant-checkbox-group-item {
|
|
|
+ display: inline-block;
|
|
|
+ margin-right: 8px;
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
</style>
|
|
|
|
|
|
<template>
|
|
@@ -69,21 +79,13 @@ p {
|
|
|
<div class="content-box">
|
|
|
<p class="content-title">省份</p>
|
|
|
<div class="content" style="position:relative">
|
|
|
- <div
|
|
|
- style="position:absolute;top:0;left:0;width:100%;height:100%;background: rgba(0, 0, 0, 0.5)"
|
|
|
- v-if="loading"
|
|
|
- ></div>
|
|
|
+ <!-- <div style="position:absolute;top:0;left:0;width:100%;height:100%;background: rgba(0, 0, 0, 0.5)"
|
|
|
+ v-if="loading"></div> -->
|
|
|
<p><input type="checkbox" class="select_all" @change="checkAllBox" v-model="checkAll" /> 全选</p>
|
|
|
|
|
|
<p v-for="(item, index) of province" :key="item.value" :class="{ backgroundOnly: provinceIndex == index }">
|
|
|
- <input
|
|
|
- class="checkItem"
|
|
|
- type="checkbox"
|
|
|
- :value="item.value"
|
|
|
- :id="item.value"
|
|
|
- v-model="checkMatched"
|
|
|
- @change="checkOne(item, index)"
|
|
|
- />
|
|
|
+ <input class="checkItem" type="checkbox" :value="item.value" :id="item.value" v-model="checkMatched"
|
|
|
+ @change="checkOne(item, index)" />
|
|
|
<span @click="showCity(item, index)" style="color:black;display:inline-block;margin-left:5px;width:80%">{{
|
|
|
item.label
|
|
|
}}</span>
|
|
@@ -102,14 +104,8 @@ p {
|
|
|
/> 全选
|
|
|
</p>-->
|
|
|
<p v-for="(item, index) of city" :key="item.id" :class="{ backgroundOnly: cityIndex == index }">
|
|
|
- <input
|
|
|
- class="checkItem"
|
|
|
- type="checkbox"
|
|
|
- :value="item.value"
|
|
|
- :id="item.value"
|
|
|
- v-model="checkMatchedCity"
|
|
|
- @change="checkOneCity(item, index)"
|
|
|
- />
|
|
|
+ <input class="checkItem" type="checkbox" :value="item.value" :id="item.value" v-model="checkMatchedCity"
|
|
|
+ @change="checkOneCity(item, index)" />
|
|
|
{{ item.label }}
|
|
|
</p>
|
|
|
</div>
|
|
@@ -119,9 +115,8 @@ p {
|
|
|
<div class="content-box">
|
|
|
<p class="content-title">
|
|
|
已选
|
|
|
- <span style="float:right;font-weight:normal;color:blue;cursor: pointer;font-size:14px" @click="clear"
|
|
|
- >清空</span
|
|
|
- >
|
|
|
+ <span style="float:right;font-weight:normal;color:blue;cursor: pointer;font-size:14px"
|
|
|
+ @click="clear">清空</span>
|
|
|
</p>
|
|
|
<div class="content">
|
|
|
<p v-for="(item, index) of checkData" :key="index">
|
|
@@ -138,269 +133,282 @@ p {
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
|
|
-import { getProvince } from '@/api/manage'
|
|
|
-import $ from 'jquery'
|
|
|
-export default {
|
|
|
- name: 'ByteDanceUserOrientationTemplateList',
|
|
|
- components: {},
|
|
|
- props: {
|
|
|
- dataValue: {
|
|
|
- type: Array,
|
|
|
- default() {
|
|
|
- return []
|
|
|
+ import {
|
|
|
+ JeecgListMixin
|
|
|
+ } from '@/mixins/JeecgListMixin'
|
|
|
+ import {
|
|
|
+ getProvince
|
|
|
+ } from '@/api/manage'
|
|
|
+ import $ from 'jquery'
|
|
|
+ export default {
|
|
|
+ name: 'ByteDanceUserOrientationTemplateList',
|
|
|
+ components: {},
|
|
|
+ props: {
|
|
|
+ dataValue: {
|
|
|
+ type: Array,
|
|
|
+ default () {
|
|
|
+ return []
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- showClass: false,
|
|
|
- showCityData: false,
|
|
|
- checkData: [],
|
|
|
- checkMatched: [],
|
|
|
- province: [],
|
|
|
- city: [],
|
|
|
- area: [],
|
|
|
- CityData: '/kuaishou/batch/getRegion',
|
|
|
- provinceIndex: null,
|
|
|
- cityIndex: null,
|
|
|
- checkAll: false,
|
|
|
- checkMatchedCity: [],
|
|
|
- checkAllCity: false,
|
|
|
- nowProvince: null,
|
|
|
- loading: false
|
|
|
- }
|
|
|
- },
|
|
|
- computed: {},
|
|
|
- mounted() {
|
|
|
- this.$nextTick(() => {
|
|
|
- // this.getData()
|
|
|
- // if (this.dataValue.length > 0) {
|
|
|
- // this.checkData = this.dataValue
|
|
|
- // this.checkMatched = this.dataValue.map(item => {
|
|
|
- // return item.value
|
|
|
- // })
|
|
|
- // this.checkMatchedCity = this.dataValue.map(item => {
|
|
|
- // return item.value
|
|
|
- // })
|
|
|
- // this.$emit('update:checkData', this.checkData)
|
|
|
- // }
|
|
|
- })
|
|
|
- },
|
|
|
- watch: {
|
|
|
- dataValue: {
|
|
|
- immediate: true, // immediate选项可以开启首次赋值监听
|
|
|
- handler(n, o) {
|
|
|
- this.getData().then(()=>{
|
|
|
- if (n.length > 0) {
|
|
|
- this.checkData = n
|
|
|
- this.checkMatched = n.map(item => {
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ showClass: false,
|
|
|
+ showCityData: false,
|
|
|
+ checkData: [],
|
|
|
+ checkMatched: [],
|
|
|
+ province: [],
|
|
|
+ city: [],
|
|
|
+ area: [],
|
|
|
+ CityData: '/kuaishou/batch/getRegion',
|
|
|
+ provinceIndex: null,
|
|
|
+ cityIndex: null,
|
|
|
+ checkAll: false,
|
|
|
+ checkMatchedCity: [],
|
|
|
+ checkAllCity: false,
|
|
|
+ nowProvince: null,
|
|
|
+ loading: false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {},
|
|
|
+ mounted() {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.getData().then(() => {
|
|
|
+ if (this.dataValue.length > 0) {
|
|
|
+ this.checkData = this.dataValue
|
|
|
+ this.checkMatched = this.dataValue.map(item => {
|
|
|
return item.value
|
|
|
})
|
|
|
- this.checkMatchedCity = n.map(item => {
|
|
|
+ this.checkMatchedCity = this.dataValue.map(item => {
|
|
|
return item.value
|
|
|
})
|
|
|
this.$emit('update:checkData', this.checkData)
|
|
|
}
|
|
|
})
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- getData() {
|
|
|
- this.loading = true
|
|
|
- return new Promise(function(resolve, reject) {
|
|
|
- getProvince(this.CityData, { level: 1 }).then(res => {
|
|
|
- if (res.code == '0') {
|
|
|
- // this.province.push(...res.result.records)
|
|
|
- this.province = res.result.map(item => {
|
|
|
- return {
|
|
|
- label: item.name,
|
|
|
- value: item.regionId
|
|
|
- }
|
|
|
- })
|
|
|
- this.province = this.province.filter(item=>{
|
|
|
- return item.label != '台湾'&&item.label != '香港'&&item.label != '澳门'
|
|
|
- })
|
|
|
- this.loading = false
|
|
|
- resolve()
|
|
|
- }
|
|
|
- })
|
|
|
- })
|
|
|
-
|
|
|
+
|
|
|
+ })
|
|
|
},
|
|
|
- showCity(item, index) {
|
|
|
- this.city = []
|
|
|
- this.showCityData = false
|
|
|
- this.showClass = false
|
|
|
- this.provinceIndex = index
|
|
|
- this.cityIndex = null
|
|
|
- this.nowProvince = item
|
|
|
- this.checkMatchedCity = []
|
|
|
- getProvince(this.CityData, { parent: item.value }).then(res => {
|
|
|
- if (res.code == '0') {
|
|
|
- this.city = res.result.map(item => {
|
|
|
- return {
|
|
|
- label: item.name,
|
|
|
- value: item.regionId
|
|
|
+ watch: {
|
|
|
+ dataValue: {
|
|
|
+ immediate: true, // immediate选项可以开启首次赋值监听
|
|
|
+ handler(n, o) {
|
|
|
+ this.getData().then(() => {
|
|
|
+ if (n.length > 0) {
|
|
|
+ this.checkData = n
|
|
|
+ this.checkMatched = n.map(item => {
|
|
|
+ return item.value
|
|
|
+ })
|
|
|
+ this.checkMatchedCity = n.map(item => {
|
|
|
+ return item.value
|
|
|
+ })
|
|
|
+ this.$emit('update:checkData', this.checkData)
|
|
|
}
|
|
|
})
|
|
|
- if (this.checkMatched.indexOf(item.value) != -1) {
|
|
|
- this.checkAllCity = true
|
|
|
- this.checkMatchedCity = this.city.map(item => {
|
|
|
- return item.value
|
|
|
- })
|
|
|
- } else {
|
|
|
- this.checkMatchedCity = this.checkData.map(item => {
|
|
|
- return item.value
|
|
|
- })
|
|
|
- }
|
|
|
- // this.city.push(...res.result.records)
|
|
|
- this.showCityData = true
|
|
|
+
|
|
|
}
|
|
|
- })
|
|
|
+ }
|
|
|
},
|
|
|
- checkAllBox() {
|
|
|
- this.checkMatched = []
|
|
|
- this.checkData = []
|
|
|
- if (this.checkAll) {
|
|
|
- this.checkMatched = this.province.map(item => {
|
|
|
- return item.value
|
|
|
+ methods: {
|
|
|
+ getData() {
|
|
|
+ this.loading = true
|
|
|
+ var that = this
|
|
|
+ return new Promise(function (resolve, reject) {
|
|
|
+ getProvince(that.CityData, {
|
|
|
+ level: 1
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code == '0') {
|
|
|
+ // this.province.push(...res.result.records)
|
|
|
+ that.province = res.result.map(item => {
|
|
|
+ return {
|
|
|
+ label: item.name,
|
|
|
+ value: item.regionId
|
|
|
+ }
|
|
|
+ })
|
|
|
+ that.province = that.province.filter(item => {
|
|
|
+ return item.label != '台湾' && item.label != '香港' && item.label != '澳门'
|
|
|
+ })
|
|
|
+ that.loading = false
|
|
|
+ resolve()
|
|
|
+ }
|
|
|
+ })
|
|
|
})
|
|
|
- this.checkData.push(...this.province)
|
|
|
- } else {
|
|
|
- this.checkMatched = []
|
|
|
- this.checkData = []
|
|
|
+
|
|
|
+ },
|
|
|
+ showCity(item, index) {
|
|
|
+ this.city = []
|
|
|
+ this.showCityData = false
|
|
|
+ this.showClass = false
|
|
|
+ this.provinceIndex = index
|
|
|
+ this.cityIndex = null
|
|
|
+ this.nowProvince = item
|
|
|
this.checkMatchedCity = []
|
|
|
- }
|
|
|
- this.$emit('update:checkData', this.checkData)
|
|
|
- },
|
|
|
- checkOne(item, index) {
|
|
|
- if (this.checkMatched.indexOf(item.value) == -1) {
|
|
|
- var index1 = this.checkData.findIndex(v => v.value === item.value)
|
|
|
- this.checkData.splice(index1, 1)
|
|
|
- if (this.nowProvince) {
|
|
|
- if (this.nowProvince.value == item.value) {
|
|
|
- this.checkMatchedCity = []
|
|
|
- }
|
|
|
- }
|
|
|
- } else {
|
|
|
- this.checkData.push(item)
|
|
|
- var data = []
|
|
|
- getProvince(this.CityData, { parent: item.value }).then(res => {
|
|
|
+ getProvince(this.CityData, {
|
|
|
+ parent: item.value
|
|
|
+ }).then(res => {
|
|
|
if (res.code == '0') {
|
|
|
- data = res.result.map(item => {
|
|
|
+ this.city = res.result.map(item => {
|
|
|
return {
|
|
|
label: item.name,
|
|
|
value: item.regionId
|
|
|
}
|
|
|
})
|
|
|
- for (var i = 0; i < this.checkData.length; i++) {
|
|
|
- for (let j = 0; j < data.length; j++) {
|
|
|
- if (this.checkData[i].value == data[j].value) {
|
|
|
- this.checkData.splice(i, 1)
|
|
|
- }
|
|
|
- }
|
|
|
+ if (this.checkMatched.indexOf(item.value) != -1) {
|
|
|
+ this.checkAllCity = true
|
|
|
+ this.checkMatchedCity = this.city.map(item => {
|
|
|
+ return item.value
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ this.checkMatchedCity = this.checkData.map(item => {
|
|
|
+ return item.value
|
|
|
+ })
|
|
|
}
|
|
|
+ // this.city.push(...res.result.records)
|
|
|
+ this.showCityData = true
|
|
|
}
|
|
|
})
|
|
|
-
|
|
|
- if (this.nowProvince) {
|
|
|
- if (item.value == this.nowProvince.value) {
|
|
|
- this.checkMatchedCity = this.city.map(item => {
|
|
|
- return item.value
|
|
|
- })
|
|
|
- }
|
|
|
+ },
|
|
|
+ checkAllBox() {
|
|
|
+ this.checkMatched = []
|
|
|
+ this.checkData = []
|
|
|
+ if (this.checkAll) {
|
|
|
+ this.checkMatched = this.province.map(item => {
|
|
|
+ return item.value
|
|
|
+ })
|
|
|
+ this.checkData.push(...this.province)
|
|
|
+ } else {
|
|
|
+ this.checkMatched = []
|
|
|
+ this.checkData = []
|
|
|
+ this.checkMatchedCity = []
|
|
|
}
|
|
|
- }
|
|
|
- if (this.checkMatched.length == this.province.length) {
|
|
|
- this.checkAll = true
|
|
|
- } else {
|
|
|
- this.checkAll = false
|
|
|
- }
|
|
|
- this.$emit('update:checkData', this.checkData)
|
|
|
- },
|
|
|
- checkAllBoxCity() {
|
|
|
- this.checkMatchedCity = []
|
|
|
- if (this.checkAllCity) {
|
|
|
- this.checkMatchedCity = this.city.map(item => {
|
|
|
- return item.value
|
|
|
- })
|
|
|
- this.checkMatched.push(this.nowProvince.value)
|
|
|
- this.checkData.push(this.nowProvince)
|
|
|
- } else {
|
|
|
- this.checkMatchedCity = []
|
|
|
- var index = this.checkData.findIndex(v => v.value === this.nowProvince.value)
|
|
|
- var index1 = this.checkMatched.findIndex(v => v === this.nowProvince.value)
|
|
|
- this.checkData.splice(index, 1)
|
|
|
- this.checkMatched.splice(index1, 1)
|
|
|
- }
|
|
|
- this.$emit('update:checkData', this.checkData)
|
|
|
- },
|
|
|
- checkOneCity(item, index) {
|
|
|
- var allCity = this.checkMatchedCity.filter(v => {
|
|
|
- return v.toString().slice(0, 2) == this.nowProvince.value
|
|
|
- })
|
|
|
-
|
|
|
- if (allCity.length == this.city.length) {
|
|
|
- this.checkMatched.push(this.nowProvince.value)
|
|
|
- this.checkData.push(this.nowProvince)
|
|
|
- for (var i = 0; i < allCity.length; i++) {
|
|
|
- for (var j = 0; j < this.checkData.length; j++) {
|
|
|
- if (allCity[i] == this.checkData[j].value) {
|
|
|
- this.checkData.splice(j, 1)
|
|
|
- j--
|
|
|
+ this.$emit('update:checkData', this.checkData)
|
|
|
+ },
|
|
|
+ checkOne(item, index) {
|
|
|
+ if (this.checkMatched.indexOf(item.value) == -1) {
|
|
|
+ var index1 = this.checkData.findIndex(v => v.value === item.value)
|
|
|
+ this.checkData.splice(index1, 1)
|
|
|
+ if (this.nowProvince) {
|
|
|
+ if (this.nowProvince.value == item.value) {
|
|
|
+ this.checkMatchedCity = []
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
- }
|
|
|
- if (this.checkMatchedCity.indexOf(item.value) != -1) {
|
|
|
- if (allCity.length != this.city.length) {
|
|
|
+ } else {
|
|
|
this.checkData.push(item)
|
|
|
+ var data = []
|
|
|
+ getProvince(this.CityData, {
|
|
|
+ parent: item.value
|
|
|
+ }).then(res => {
|
|
|
+ if (res.code == '0') {
|
|
|
+ data = res.result.map(item => {
|
|
|
+ return {
|
|
|
+ label: item.name,
|
|
|
+ value: item.regionId
|
|
|
+ }
|
|
|
+ })
|
|
|
+ for (var i = 0; i < this.checkData.length; i++) {
|
|
|
+ for (let j = 0; j < data.length; j++) {
|
|
|
+ if (this.checkData[i].value == data[j].value) {
|
|
|
+ this.checkData.splice(i, 1)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ if (this.nowProvince) {
|
|
|
+ if (item.value == this.nowProvince.value) {
|
|
|
+ this.checkMatchedCity = this.city.map(item => {
|
|
|
+ return item.value
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
if (this.checkMatched.length == this.province.length) {
|
|
|
this.checkAll = true
|
|
|
} else {
|
|
|
this.checkAll = false
|
|
|
}
|
|
|
- } else {
|
|
|
- if (this.checkMatched.indexOf(this.nowProvince.value) != -1) {
|
|
|
- var index1 = this.checkData.findIndex(v => v.value === this.nowProvince.value)
|
|
|
- var index2 = this.checkMatched.findIndex(v => v === this.nowProvince.value)
|
|
|
- this.checkData.splice(index1, 1)
|
|
|
- this.checkMatched.splice(index2, 1)
|
|
|
- this.checkAll = false
|
|
|
- var data = this.city.filter(v => {
|
|
|
- return v.value != item.value
|
|
|
+ this.$emit('update:checkData', this.checkData)
|
|
|
+ },
|
|
|
+ checkAllBoxCity() {
|
|
|
+ this.checkMatchedCity = []
|
|
|
+ if (this.checkAllCity) {
|
|
|
+ this.checkMatchedCity = this.city.map(item => {
|
|
|
+ return item.value
|
|
|
})
|
|
|
- this.checkData.push(...data)
|
|
|
+ this.checkMatched.push(this.nowProvince.value)
|
|
|
+ this.checkData.push(this.nowProvince)
|
|
|
} else {
|
|
|
- var index1 = this.checkData.findIndex(v => v.value === item.value)
|
|
|
- this.checkData.splice(index1, 1)
|
|
|
+ this.checkMatchedCity = []
|
|
|
+ var index = this.checkData.findIndex(v => v.value === this.nowProvince.value)
|
|
|
+ var index1 = this.checkMatched.findIndex(v => v === this.nowProvince.value)
|
|
|
+ this.checkData.splice(index, 1)
|
|
|
+ this.checkMatched.splice(index1, 1)
|
|
|
}
|
|
|
- }
|
|
|
- this.$emit('update:checkData', this.checkData)
|
|
|
- },
|
|
|
- clear() {
|
|
|
- this.checkData = []
|
|
|
- this.checkMatched = []
|
|
|
- this.checkMatchedCity = []
|
|
|
- this.checkAll = false
|
|
|
- this.$emit('update:checkData', this.checkData)
|
|
|
- },
|
|
|
- detele(item, index) {
|
|
|
- // if (this.checkMatched.indexOf(this.nowProvince.value) != -1) {
|
|
|
- var index1 = this.checkMatched.findIndex(v => v === item.value)
|
|
|
- var index2 = this.checkData.findIndex(v => v.value === item.value)
|
|
|
- this.checkData.splice(index2, 1)
|
|
|
- this.checkMatched.splice(index1, 1)
|
|
|
- this.checkAll = false
|
|
|
- // } else {
|
|
|
- // }
|
|
|
+ this.$emit('update:checkData', this.checkData)
|
|
|
+ },
|
|
|
+ checkOneCity(item, index) {
|
|
|
+ var allCity = this.checkMatchedCity.filter(v => {
|
|
|
+ return v.toString().slice(0, 2) == this.nowProvince.value
|
|
|
+ })
|
|
|
|
|
|
- this.$emit('update:checkData', this.checkData)
|
|
|
+ if (allCity.length == this.city.length) {
|
|
|
+ this.checkMatched.push(this.nowProvince.value)
|
|
|
+ this.checkData.push(this.nowProvince)
|
|
|
+ for (var i = 0; i < allCity.length; i++) {
|
|
|
+ for (var j = 0; j < this.checkData.length; j++) {
|
|
|
+ if (allCity[i] == this.checkData[j].value) {
|
|
|
+ this.checkData.splice(j, 1)
|
|
|
+ j--
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (this.checkMatchedCity.indexOf(item.value) != -1) {
|
|
|
+ if (allCity.length != this.city.length) {
|
|
|
+ this.checkData.push(item)
|
|
|
+ }
|
|
|
+ if (this.checkMatched.length == this.province.length) {
|
|
|
+ this.checkAll = true
|
|
|
+ } else {
|
|
|
+ this.checkAll = false
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (this.checkMatched.indexOf(this.nowProvince.value) != -1) {
|
|
|
+ var index1 = this.checkData.findIndex(v => v.value === this.nowProvince.value)
|
|
|
+ var index2 = this.checkMatched.findIndex(v => v === this.nowProvince.value)
|
|
|
+ this.checkData.splice(index1, 1)
|
|
|
+ this.checkMatched.splice(index2, 1)
|
|
|
+ this.checkAll = false
|
|
|
+ var data = this.city.filter(v => {
|
|
|
+ return v.value != item.value
|
|
|
+ })
|
|
|
+ this.checkData.push(...data)
|
|
|
+ } else {
|
|
|
+ var index1 = this.checkData.findIndex(v => v.value === item.value)
|
|
|
+ this.checkData.splice(index1, 1)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.$emit('update:checkData', this.checkData)
|
|
|
+ },
|
|
|
+ clear() {
|
|
|
+ this.checkData = []
|
|
|
+ this.checkMatched = []
|
|
|
+ this.checkMatchedCity = []
|
|
|
+ this.checkAll = false
|
|
|
+ this.$emit('update:checkData', this.checkData)
|
|
|
+ },
|
|
|
+ detele(item, index) {
|
|
|
+ // if (this.checkMatched.indexOf(this.nowProvince.value) != -1) {
|
|
|
+ var index1 = this.checkMatched.findIndex(v => v === item.value)
|
|
|
+ var index2 = this.checkData.findIndex(v => v.value === item.value)
|
|
|
+ this.checkData.splice(index2, 1)
|
|
|
+ this.checkMatched.splice(index1, 1)
|
|
|
+ this.checkAll = false
|
|
|
+ // } else {
|
|
|
+ // }
|
|
|
+
|
|
|
+ this.$emit('update:checkData', this.checkData)
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
-</script>
|
|
|
+</script>
|