|
|
<template>
|
|
|
<view class="tm-quickCity fulled">
|
|
|
|
|
|
<view @click="qiehuan"><slot ></slot></view>
|
|
|
<view @click.stop="qiehuan" v-if="showbgOpen" class="tm-quickCity-fullbg fulled fixed b-0 l-0" :style="{height:sysHeight+'px'}">
|
|
|
|
|
|
<view :style="{height:(height+250+content_jian_height)+'rpx'}" @click.stop="" :class="[black_tmeme?'grey-darken-5 bk':'white']" class=" tm-quickCity-wk absolute fulled round-t-10" >
|
|
|
<view class="tm-quickCity-title px-32 pt-32 shadow-4 relative">
|
|
|
<view class="text-size-g text-weight-b mb-32 relative">
|
|
|
<view>
|
|
|
请选择城市位置
|
|
|
</view>
|
|
|
<view @click.stop="qiehuan" class="tm-calendar-close rounded flex-center" :class="black_tmeme?'grey-darken-3':'grey-lighten-3'">
|
|
|
<tm-icons dense name="icon-times" size="24" :color="black_tmeme?'white':'grey'"></tm-icons>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="flex-start pb-24">
|
|
|
|
|
|
<view :class="[pageIndex==0?`outlined ${color_tmeme} text-weight-b`:'outlined grey',black_tmeme?'bk':'']" @click="indexChange(0)" class=" px-12 py-6 round-10 flex-center text-size-s mr-24 flex-shrink">
|
|
|
<text>{{childrenIndx[0]!==null?childrenIndx[0].title:'请选择省'}}</text>
|
|
|
|
|
|
</view>
|
|
|
<view v-if="childrenIndx[0]!==null" class="flex-center pr-24">
|
|
|
<tm-icons :color="black_tmeme?'white':'grey'" :size="24" dense name="icon-angle-right"></tm-icons>
|
|
|
</view>
|
|
|
<view style="max-width: 120rpx;" :class="[pageIndex==1?`outlined ${color_tmeme} text-weight-b`:'outlined grey',black_tmeme?'bk':'']" @click="indexChange(1)" v-if="childrenIndx[0]!==null" class="px-12 py-6 round-10 flex-center text-size-s mr-24 pb-10 ">
|
|
|
|
|
|
<text class="text-overflow">{{childrenIndx[1]!==null?childrenIndx[1].title:'请选择市'}}</text>
|
|
|
</view>
|
|
|
<view v-if="childrenIndx[1]!==null" class="flex-center pr-24">
|
|
|
<tm-icons :color="black_tmeme?'white':'grey'" :size="24" dense name="icon-angle-right"></tm-icons>
|
|
|
</view>
|
|
|
<view style="max-width: 220rpx;" :class="[pageIndex==2?`outlined ${color_tmeme} text-weight-b`:'outlined grey',black_tmeme?'bk':'']" @click="indexChange(2)" v-if="childrenIndx[1]!==null" class="px-12 py-6 round-10 flex-center text-size-s mr-24 pb-10 ">
|
|
|
|
|
|
<text class="text-overflow">{{childrenIndx[2]!==null?childrenIndx[2].title:'请选择县/区'}}</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view v-if="hotCity_chuli.length>0" class="tm-quickCity-jg py-24">
|
|
|
<view :class="[black_tmeme?'grey-darken-5':'grey-lighten-4 text']" class="text-size-s text-weight-b py-12 px-32">热门城市</view>
|
|
|
<view class="px-20 pt-12">
|
|
|
<tm-tags model="text" rounded :black="black_tmeme" @click="selectedDefaultHot(index)" v-for="(item,index) in hotCity_chuli" :key="index" color="white" :fllowTheme="fllowTheme">
|
|
|
{{item[1]?item[1]:item[0]}}
|
|
|
</tm-tags>
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
<view v-show="pageIndex==0">
|
|
|
<tm-quickIndex :black="black_tmeme" :fllowTheme="false" :color="color_tmeme" key="ref_k_1" v-model="active" :height="content_height" :list="list">
|
|
|
<template v-slot:cell="{data}">
|
|
|
<view @click="cityClick_pr(data,0)" :class="[data.black?'bk':'',data.children!==data.total-1?'border-grey-lighten-4-b-1':'']" class="py-24 mx-32 flex-between">
|
|
|
<view class="text-size-n flex-start" >
|
|
|
<view v-if="data.item['checked']" class="mr-24">
|
|
|
<tm-icons :color="data.color" dense name="icon-check"></tm-icons>
|
|
|
</view>
|
|
|
<text :class="[data.item['checked']?'text-'+data.color+' text-weight-b':'']" class="text-size-n">
|
|
|
{{data.title}}
|
|
|
</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
</tm-quickIndex>
|
|
|
</view>
|
|
|
<view v-if="pageIndex==1">
|
|
|
<tm-quickIndex :black="black_tmeme" :fllowTheme="false" :color="color_tmeme" key="ref_k_2" v-model="active_2" v-if="childrenIndx[0]" :height="content_height" :list="childrenIndx[0].children">
|
|
|
<template #cell="{data}">
|
|
|
<view @click="cityClick_pr(data,1)" :class="[data.black?'bk':'',data.children!==data.total-1?'border-grey-lighten-4-b-1':'']" class="py-24 mx-32 border-grey-lighten-4-b-1 flex-between">
|
|
|
<view class="text-size-n flex-start" >
|
|
|
<view v-if="data.item['checked']" class="mr-24">
|
|
|
<tm-icons :color="data.color" dense name="icon-check"></tm-icons>
|
|
|
</view>
|
|
|
<text :class="[data.item['checked']?'text-'+data.color+' text-weight-b':'']" class="text-size-n">
|
|
|
{{data.title}}
|
|
|
</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
</template>
|
|
|
</tm-quickIndex>
|
|
|
</view>
|
|
|
<view v-if="pageIndex==2">
|
|
|
<tm-quickIndex :black="black_tmeme" :fllowTheme="false" :color="color_tmeme" key="ref_k_3" v-model="active_3" v-if="childrenIndx[1]" :height="content_height" :list="childrenIndx[1].children">
|
|
|
<template #cell="{data}">
|
|
|
<view @click="cityClick_pr(data,2)" :class="[data.black?'bk':'',data.children!==data.total-1?'border-grey-lighten-4-b-1':'']" class="py-24 mx-32 border-grey-lighten-4-b-1 flex-between">
|
|
|
<view class="text-size-n flex-start" >
|
|
|
<view v-if="data.item['checked']" class="mr-24">
|
|
|
<tm-icons :color="data.color" dense name="icon-check"></tm-icons>
|
|
|
</view>
|
|
|
<text :class="[data.item['checked']?'text-'+data.color+' text-weight-b':'']" class="text-size-n">
|
|
|
{{data.title}}
|
|
|
</text>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
</template>
|
|
|
</tm-quickIndex>
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
/**
|
|
|
* 城区索引选择
|
|
|
* @property {Boolean} value = [true|false] 显示和隐藏组件，请使用v-model或者value.sync你也可以不提供些参数，使用默认插槽也可打开，请见示例。
|
|
|
* @property {Array} default-value = [] 默认选择的地址:[],字符串数组，如["江西省","南昌市"]。使用.sync双向绑定。
|
|
|
* @property {Array} hot-city = [] 默认选择的地址:[],格式同default-value
|
|
|
* @property {String} color = [] 默认：primary,主题色
|
|
|
* @property {Number} height = [] 默认：1000,组件高度，单位rpx
|
|
|
* @property {Boolean} black = [true|false] 默认：false,是否深色模式
|
|
|
* @property {Function} change 选中地址时触发，返回当前选中的地区数组。
|
|
|
*/
|
|
|
import provinceData from '@/tm-vuetify/tool/util/province.js';
|
|
|
import cityData from '@/tm-vuetify/tool/util/city.js';
|
|
|
import areaData from '@/tm-vuetify/tool/util/area.js';
|
|
|
import queryCnChart from "@/tm-vuetify/tool/function/findCnChart.js";
|
|
|
|
|
|
|
|
|
import tmQuickIndex from "@/tm-vuetify/components/tm-quickIndex/tm-quickIndex.vue"
|
|
|
import tmListitem from "@/tm-vuetify/components/tm-listitem/tm-listitem.vue"
|
|
|
import tmGrouplist from "@/tm-vuetify/components/tm-grouplist/tm-grouplist.vue"
|
|
|
import tmIcons from "@/tm-vuetify/components/tm-icons/tm-icons.vue"
|
|
|
import tmTags from "@/tm-vuetify/components/tm-tags/tm-tags.vue"
|
|
|
export default {
|
|
|
components:{tmQuickIndex,tmListitem,tmGrouplist,tmIcons,tmTags
|
|
|
},
|
|
|
name:"tm-quickCity",
|
|
|
model:{
|
|
|
event:'input',
|
|
|
prop:'value'
|
|
|
},
|
|
|
props:{
|
|
|
defaultValue:{
|
|
|
type:Array,
|
|
|
default:()=>{
|
|
|
return [];
|
|
|
}
|
|
|
},
|
|
|
hotCity:{
|
|
|
type:Array,
|
|
|
default:()=>[["江西省","南昌市"],["北京市"],["广东省","广州市"],["浙江省","杭州市"],["重庆市"],["湖南省","长沙市"],["湖北省","武汉市"],["四川省","成都市"]]
|
|
|
},
|
|
|
color:{
|
|
|
type:String,
|
|
|
default:"primary"
|
|
|
},
|
|
|
height:{
|
|
|
type:String|Number,
|
|
|
default:900
|
|
|
},
|
|
|
value:{
|
|
|
type:Boolean,
|
|
|
default:false
|
|
|
},
|
|
|
black:{
|
|
|
type:Boolean,
|
|
|
default:null
|
|
|
},
|
|
|
// 跟随主题色的改变而改变。
|
|
|
fllowTheme:{
|
|
|
type:Boolean|String,
|
|
|
default:true
|
|
|
}
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
|
|
|
list:[],
|
|
|
active:0,
|
|
|
active_2:0,
|
|
|
active_3:0,
|
|
|
childrenIndx:[null,null,null],
|
|
|
indexobj:{
|
|
|
pr:null,
|
|
|
ar:null,
|
|
|
co:null
|
|
|
},
|
|
|
pageIndex:0,
|
|
|
sysHeight:0,
|
|
|
showbgOpen:false,
|
|
|
|
|
|
content_height:0,
|
|
|
content_jian_height:0,
|
|
|
hotCity_chuli:[]
|
|
|
};
|
|
|
},
|
|
|
watch:{
|
|
|
value:function(val){
|
|
|
this.show = val;
|
|
|
|
|
|
}
|
|
|
},
|
|
|
destroyed() {
|
|
|
this.list=[];
|
|
|
this.childrenIndx=[];
|
|
|
},
|
|
|
computed:{
|
|
|
|
|
|
|
|
|
black_tmeme: function() {
|
|
|
if (this.black !== null) return this.black;
|
|
|
return this.$tm.vx.state().tmVuetify.black;
|
|
|
},
|
|
|
color_tmeme:function(){
|
|
|
if(this.$tm.vx.state().tmVuetify.color!==null&&this.$tm.vx.state().tmVuetify.color && this.fllowTheme){
|
|
|
return this.$tm.vx.state().tmVuetify.color;
|
|
|
}
|
|
|
return this.color;
|
|
|
},
|
|
|
show:{
|
|
|
get:function(){
|
|
|
return this.showbgOpen;
|
|
|
},
|
|
|
set:function(val){
|
|
|
this.showbgOpen = val;
|
|
|
this.$emit('input',val);
|
|
|
this.$emit('update:value',val);
|
|
|
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
async mounted() {
|
|
|
this.sysHeight = uni.getSystemInfoSync().windowHeight;
|
|
|
this.show = this.value;
|
|
|
this.content_height = this.height;
|
|
|
this.hotCity_chuli_fun();
|
|
|
await this.chiliFormatCity_area()
|
|
|
await this.setDefaultValue();
|
|
|
await this.content_heightToh();
|
|
|
},
|
|
|
methods: {
|
|
|
hotCity_chuli_fun(){
|
|
|
let hot = uni.$tm.deepClone(this.hotCity);
|
|
|
let hostar = [];
|
|
|
hot.forEach(item=>{
|
|
|
if(item.length==1) hostar.push([item[0],null,null])
|
|
|
if(item.length==2) hostar.push([item[0],item[1],null])
|
|
|
if(item.length==3) hostar.push([item[0],item[1],item[2]])
|
|
|
})
|
|
|
this.hotCity_chuli = [...hostar];
|
|
|
},
|
|
|
async qiehuan(){
|
|
|
this.show = !this.showbgOpen
|
|
|
await this.content_heightToh();
|
|
|
|
|
|
},
|
|
|
async content_heightToh(){
|
|
|
// if(!this.showbgOpen) return;
|
|
|
if(this.hotCity_chuli.length==0){
|
|
|
return this.height;
|
|
|
}
|
|
|
this.$nextTick(async function(){
|
|
|
let h = await this.$Querey(".tm-quickCity-jg",this).catch(e=>{});
|
|
|
|
|
|
if(!h[0]) return;
|
|
|
h = h[0].height;
|
|
|
|
|
|
let blv = uni.upx2px(4) / 4;
|
|
|
this.content_jian_height = (h+h*blv)
|
|
|
this.content_height = parseInt(this.height - this.content_jian_height);
|
|
|
})
|
|
|
},
|
|
|
async selectedDefaultHot(index){
|
|
|
|
|
|
this.$emit('update:defaultValue',this.hotCity[index]);
|
|
|
let chl = this.childrenIndx[0];
|
|
|
if(chl){
|
|
|
this.$set(this.list[chl.index].children[chl.childrenIndex],'checked',false)
|
|
|
}
|
|
|
this.childrenIndx=[null,null,null];
|
|
|
this.$nextTick(async function(){
|
|
|
|
|
|
await this.setDefaultValue()
|
|
|
|
|
|
this.cityClick_pr(this.list[this.childrenIndx[0]],this.childrenIndx[0])
|
|
|
})
|
|
|
},
|
|
|
async setDefaultValue(){
|
|
|
let t = this;
|
|
|
function chuili(ix){
|
|
|
let pitem = null;
|
|
|
let chilIndex=-1;
|
|
|
let pdindex = -1;
|
|
|
if(ix==0&&t.defaultValue[ix]){
|
|
|
pdindex = t.list.findIndex((item)=>{
|
|
|
let citem = item.children
|
|
|
|
|
|
let index = citem.findIndex(ditem=>{
|
|
|
if(ditem.title == t.defaultValue[ix]){
|
|
|
pitem = ditem;
|
|
|
}
|
|
|
return ditem.title == t.defaultValue[ix]
|
|
|
})
|
|
|
if(index>-1){
|
|
|
chilIndex = index;
|
|
|
}
|
|
|
return index>-1;
|
|
|
})
|
|
|
}else if(t.defaultValue[ix]){
|
|
|
let dsst = t.childrenIndx[ix-1].children
|
|
|
|
|
|
pdindex = dsst.findIndex((item)=>{
|
|
|
let citem = item.children
|
|
|
|
|
|
let index = citem.findIndex(ditem=>{
|
|
|
if(ditem.title == t.defaultValue[ix]){
|
|
|
pitem = ditem;
|
|
|
}
|
|
|
return ditem.title == t.defaultValue[ix]
|
|
|
})
|
|
|
if(index>-1){
|
|
|
chilIndex = index;
|
|
|
}
|
|
|
return index>-1;
|
|
|
})
|
|
|
}
|
|
|
return {prevent:pdindex,chileIndex:chilIndex,item:pitem};
|
|
|
}
|
|
|
let d = chuili(0)
|
|
|
if(d.prevent>-1){
|
|
|
let chl = this.childrenIndx[0];
|
|
|
if(chl){
|
|
|
this.$set(this.list[chl.index].children[chl.childrenIndex],'checked',false)
|
|
|
}
|
|
|
t.childrenIndx.splice(0,1,{
|
|
|
index:d.prevent,
|
|
|
childrenIndex:d.chileIndex,
|
|
|
title:d.item.title,
|
|
|
children:t.chuliKey(d.item.children)
|
|
|
})
|
|
|
|
|
|
t.active = d.prevent;
|
|
|
this.$set(this.list[d.prevent].children[d.chileIndex],'checked',true)
|
|
|
}
|
|
|
if(t.defaultValue[1]){
|
|
|
let d = chuili(1)
|
|
|
let chl = this.childrenIndx[1];
|
|
|
if(chl){
|
|
|
this.$set(this.childrenIndx[0].children[chl.index].children[chl.childrenIndex],'checked',false)
|
|
|
}
|
|
|
t.childrenIndx.splice(1,1,{
|
|
|
index:d.prevent,
|
|
|
childrenIndex:d.chileIndex,
|
|
|
title:d.item.title,
|
|
|
children:t.chuliKey(d.item.children)
|
|
|
})
|
|
|
this.$set(this.childrenIndx[0].children[d.prevent].children[d.chileIndex],'checked',true)
|
|
|
}else{
|
|
|
|
|
|
}
|
|
|
await uni.$tm.sleep(50)
|
|
|
if(t.defaultValue[2]){
|
|
|
let d = chuili(2)
|
|
|
|
|
|
let chl = this.childrenIndx[2];
|
|
|
|
|
|
if(chl){
|
|
|
this.$set(this.childrenIndx[1].children[chl.index].children[chl.childrenIndex],'checked',false)
|
|
|
}
|
|
|
t.childrenIndx.splice(2,1,{
|
|
|
index:d.prevent,
|
|
|
childrenIndex:d.chileIndex,
|
|
|
title:d.item.title,
|
|
|
children:[]
|
|
|
})
|
|
|
|
|
|
this.$set(this.childrenIndx[1].children[d.prevent].children[d.chileIndex],'checked',true)
|
|
|
|
|
|
}
|
|
|
},
|
|
|
indexChange(index){
|
|
|
let t= this;
|
|
|
this.pageIndex = index;
|
|
|
this.childrenIndx.forEach((item,idx)=>{
|
|
|
if(idx===index && item!==null){
|
|
|
if(t.defaultValue[idx]==item.title){
|
|
|
if(idx==0){
|
|
|
t.active = item.index;
|
|
|
}else if(idx==1){
|
|
|
t.active_2 = item.index;
|
|
|
}else if(idx==2){
|
|
|
t.active_3 = item.index;
|
|
|
}
|
|
|
|
|
|
}
|
|
|
}
|
|
|
})
|
|
|
|
|
|
},
|
|
|
cityClick_pr(data_item,tindex){
|
|
|
if(tindex===0){
|
|
|
let chl = this.childrenIndx[0];
|
|
|
if(chl){
|
|
|
this.$set(this.list[chl.index].children[chl.childrenIndex],'checked',false)
|
|
|
}
|
|
|
this.childrenIndx=[{
|
|
|
index:data_item.prevent,
|
|
|
childrenIndex:data_item.children,
|
|
|
title:data_item.title,
|
|
|
children:this.chuliKey(data_item.item.children)
|
|
|
},null,null]
|
|
|
this.$set(this.indexobj,'pr',data_item.prevent)
|
|
|
this.$set(this.indexobj,'ar',null)
|
|
|
this.$set(this.indexobj,'co',null)
|
|
|
this.pageIndex=1;
|
|
|
|
|
|
this.$set(this.list[data_item.prevent].children[data_item.children],'checked',true)
|
|
|
}else if(tindex===1){
|
|
|
let chl = this.childrenIndx[1]
|
|
|
|
|
|
if(chl){
|
|
|
this.$set(this.childrenIndx[0].children[chl.index].children[chl.childrenIndex],'checked',false)
|
|
|
}
|
|
|
this.childrenIndx.splice(1,1,{
|
|
|
index:data_item.prevent,
|
|
|
childrenIndex:data_item.children,
|
|
|
title:data_item.title,
|
|
|
children:this.chuliKey(data_item.item.children)
|
|
|
})
|
|
|
this.childrenIndx.splice(2,1,null)
|
|
|
this.$set(this.indexobj,'pr',data_item.prevent)
|
|
|
this.$set(this.indexobj,'ar',data_item.prevent)
|
|
|
this.$set(this.indexobj,'co',null)
|
|
|
this.pageIndex=2;
|
|
|
this.$set(this.childrenIndx[0].children[data_item.prevent].children[data_item.children],'checked',true)
|
|
|
}else if(tindex===2){
|
|
|
let chl = this.childrenIndx[2]
|
|
|
|
|
|
if(chl){
|
|
|
this.$set(this.childrenIndx[1].children[chl.index].children[chl.childrenIndex],'checked',false)
|
|
|
}
|
|
|
this.childrenIndx.splice(2,1,{
|
|
|
index:data_item.prevent,
|
|
|
childrenIndex:data_item.children,
|
|
|
title:data_item.title,
|
|
|
children:[]
|
|
|
})
|
|
|
this.$set(this.indexobj,'pr',data_item.prevent)
|
|
|
this.$set(this.indexobj,'ar',data_item.prevent)
|
|
|
this.$set(this.indexobj,'co',data_item.prevent)
|
|
|
this.$set(this.childrenIndx[1].children[data_item.prevent].children[data_item.children],'checked',true)
|
|
|
}
|
|
|
let cdite = this.defaultValue;
|
|
|
this.childrenIndx.forEach((item,index)=>{
|
|
|
if(item){
|
|
|
cdite.splice(index,1,item.title)
|
|
|
}else{
|
|
|
cdite.splice(index,1,null)
|
|
|
}
|
|
|
})
|
|
|
this.$emit("update:defaultValue",cdite)
|
|
|
this.$emit("change",cdite)
|
|
|
},
|
|
|
//处理地区数据以便符合规范。
|
|
|
async chiliFormatCity_area() {
|
|
|
|
|
|
let list = [];
|
|
|
let list_index_Str = []
|
|
|
provinceData.forEach((item,index)=>{
|
|
|
let quick = queryCnChart(item.label[0])["0"];
|
|
|
|
|
|
if(item.label=='重庆市'){
|
|
|
quick = 'C'
|
|
|
|
|
|
}
|
|
|
list.push({
|
|
|
id:item.value,
|
|
|
text:item.label,
|
|
|
quick:quick,
|
|
|
children:[]
|
|
|
})
|
|
|
|
|
|
})
|
|
|
cityData.forEach((item,index)=>{
|
|
|
item.forEach((citem,cindex)=>{
|
|
|
list[index].children.push({
|
|
|
id:citem.value,
|
|
|
text:citem.label,
|
|
|
quick:queryCnChart(citem.label[0])["0"],
|
|
|
children:[]
|
|
|
})
|
|
|
})
|
|
|
})
|
|
|
list.forEach((item,index)=>{
|
|
|
item.children.forEach((citem,cindex)=>{
|
|
|
areaData[index][cindex].forEach(jitem=>{
|
|
|
list[index].children[cindex].children.push({
|
|
|
id:jitem.value,
|
|
|
quick:queryCnChart(jitem.label[0])["0"],
|
|
|
text:jitem.label
|
|
|
})
|
|
|
})
|
|
|
})
|
|
|
})
|
|
|
|
|
|
|
|
|
function sortFun(a,b){
|
|
|
var nameA = a.quick.toUpperCase(); // ignore upper and lowercase
|
|
|
var nameB = b.quick.toUpperCase(); // ignore upper and lowercase
|
|
|
|
|
|
if (nameA < nameB) {
|
|
|
return -1;
|
|
|
}
|
|
|
if (nameA > nameB) {
|
|
|
return 1;
|
|
|
}
|
|
|
// names must be equal
|
|
|
return 0;
|
|
|
}
|
|
|
|
|
|
function sort(itemArray){
|
|
|
if(typeof itemArray === 'object' && Array.isArray(itemArray)){
|
|
|
itemArray.sort(sortFun)
|
|
|
}else{
|
|
|
return itemArray;
|
|
|
}
|
|
|
|
|
|
for(let i=0;i<itemArray.length;i++){
|
|
|
let cl = itemArray[i]['children'];
|
|
|
if(typeof cl === 'object' && Array.isArray(cl)){
|
|
|
|
|
|
itemArray[i]['children'] = sort(cl);
|
|
|
}
|
|
|
|
|
|
}
|
|
|
return itemArray;
|
|
|
}
|
|
|
|
|
|
let plst = sort(list);
|
|
|
|
|
|
function fenzu(ar){
|
|
|
let jg = {};
|
|
|
for(let i=0;i<ar.length;i++){
|
|
|
let cl = ar[i]['children'];
|
|
|
if(typeof cl === 'object' && Array.isArray(cl)){
|
|
|
if(typeof jg[ar[i].quick] !=='undefined'){
|
|
|
jg[ar[i].quick].push({
|
|
|
title:ar[i].text,
|
|
|
index:ar[i].quick,
|
|
|
children:fenzu(cl)
|
|
|
})
|
|
|
}else{
|
|
|
jg[ar[i].quick] = [];
|
|
|
|
|
|
jg[ar[i].quick].push({
|
|
|
title:ar[i].text,
|
|
|
index:ar[i].quick,
|
|
|
children:fenzu(cl)
|
|
|
})
|
|
|
}
|
|
|
}else{
|
|
|
if(typeof jg[ar[i].quick] !=='undefined'){
|
|
|
jg[ar[i].quick].push({
|
|
|
title:ar[i].text,
|
|
|
index:ar[i].quick,
|
|
|
children:ar[i]
|
|
|
})
|
|
|
}else{
|
|
|
jg[ar[i].quick] = [];
|
|
|
|
|
|
jg[ar[i].quick].push({
|
|
|
title:ar[i].text,
|
|
|
index:ar[i].quick,
|
|
|
children:ar[i]
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
return jg;
|
|
|
}
|
|
|
let ruslt = fenzu(plst);
|
|
|
let tddd = this.chuliKey(ruslt);
|
|
|
this.list = tddd;
|
|
|
|
|
|
return tddd;
|
|
|
|
|
|
},
|
|
|
|
|
|
chuliKey(arritem){
|
|
|
let ruslt = arritem;
|
|
|
let zuihojg = [];
|
|
|
let keyarray = Object.keys(arritem);
|
|
|
for(let i=0;i<keyarray.length;i++){
|
|
|
zuihojg.push({
|
|
|
title:keyarray[i],
|
|
|
index:keyarray[i],
|
|
|
children:ruslt[keyarray[i]]
|
|
|
})
|
|
|
|
|
|
}
|
|
|
return zuihojg;
|
|
|
}
|
|
|
},
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
.tm-quickCity{
|
|
|
.tm-quickCity-fullbg{
|
|
|
background-color: rgba(0,0,0,0.3);
|
|
|
|
|
|
z-index: 501;
|
|
|
.tm-quickCity-wk{
|
|
|
bottom: 0;
|
|
|
left: 0;
|
|
|
.tm-quickCity-title{
|
|
|
z-index: 10;
|
|
|
.tm-calendar-close {
|
|
|
position: absolute;
|
|
|
top: 0rpx;
|
|
|
right: 0rpx;
|
|
|
height: 50rpx;
|
|
|
line-height: 50rpx;
|
|
|
width: 50rpx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
</style>
|