直接上图片 效果图如下
<template>
<view class="introScroll">
<view class="topView">
<!-- 城市搜索输入框 -->
<view class="serchView">
<view class="serch">
<image class="serchIconImage" src="/static/app-plus/image/center/centertool/shopRecruit/img_search_logo.png"></image>
<input @input="cityInputListener" adjust-position="false" class="serchInput" placeholder="输入城市名称进行搜索" type="text" />
</view>
</view>
<!-- 定位城市-标题 -->
<view class="nowCityTextTipsView">
<text class="nowLocationCity">当前定位城市</text>
</view>
<!-- 定位城市-内容 -->
<view class="againLocationView">
<text class="loactionText">{{nowCity}}</text>
<text class="loactionStatusText">{{locationStatus}}</text>
<image :animation="animation" @click="locationImageClick" class="refreshImage" src="/static/app-plus/image/index/refreshIcon.png"></image>
</view>
</view>
<!-- 右侧字母 -->
<view class='city_right'>
<text class='letter_item' v-for='(item,index) in letter' :key='index' @tap.stop='letterTap(index)'>{{item}}</text>
</view>
<scroll-view scroll-with-animation="true" class="cityListView" scroll-y="true" :scroll-into-view="scrollId">
<!-- 热门城市 -->
<text class="hotCityTips" :id="'re'">热门城市</text>
<view class='new_city_box'>
<text class='new_city_text' v-for='(item,index) in hotCityList' :key='index' @tap.stop='cityTap(index)'>{{item.city}}</text>
</view>
<!-- 城市列表 -->
<view class="forCityView">
<view class="forCityItem" v-for="(item,index) in allCityList" :key="index">
<view v-if="item.show" :id="item.letter" class="letterItemFirst">{{item.letter}}</view>
<text @click="cityItemClick(index)" class="itemCityContent">{{item.city}}</text>
<view v-if="!item.last" class="line"></view>
</view>
</view>
</scroll-view>
</view>
</template>
<script>
export default {
data() {
return {
nowCity: '',
locationStatus: '定位成功',
letter: ['热', "A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T",
"U", "V", "W", "X", "Y", "Z"
],
//热门城市
hotCityList: [],
//全部城市
allCityList: [],
//滑动到指定位置
scrollId: '',
//动画
animation: {},
//接口请求的数据
cityList: []
}
},
onLoad(options) {
//设置title标题
this.nowCity = '北京'
this.hotCityList = this.returnHotCity()
uni.setNavigationBarTitle({
title: '当前城市-' + this.nowCity
})
//获取全国城市
this.getCityList()
},
methods: {
//拼音点击事件
letterTap(index) {
console.log(index)
if (this.letter[index] == '热') {
this.scrollId = 're'
} else {
this.scrollId = this.letter[index]
}
},
//搜索
cityInputListener(e) {
let value = e.detail.value
let cityAll = this.allCityList
let newArray = []
for (let i = 0; i < cityAll.length; i++) {
if (cityAll[i].city.indexOf(value) != -1 || cityAll[i].letter == value.toUpperCase()) {
newArray.push(cityAll[i])
}
}
if (value == '') {
this.formatCityData(this.cityList)
} else {
this.formatCityData(newArray)
}
},
//定位
locationImageClick() {
var that = this
this.animation = uni.createAnimation()
this.animation.rotate(360).step()
this.animation = this.animation.export()
this.locationStatus = '定位中...'
uni.getLocation({
geocode: true, // 是否解析地址信息（返回详细格式化地址信息）
success: res => {
// 获取当前位置坐标
if (res.address != undefined) {
that.nowCity = res.address.city;
that.locationStatus = '定位成功'
}
},
fail: res => {
that.nowCity = '获取定位信息失败'
console.log("获取定位信息失败");
}
});
},
//获取城市列表
getCityList() {
this.cityList = getAllCity()
this.formatCityData(getAllCity())
},
formatCityData: function(array) {
for (let i = 0; i < array.length; i++) {
if (i == 0) {
//第一条显示首字母
array[i].show = true
} else if (array[i].letter != array[i - 1].letter) {
//首字母与上一条不一样需要显示
array[i].show = true
array[i - 1].last = true
}
if (array.length == 1) {
array[0].last = true
}
array.show = false
}
this.allCityList = array
},
//城市条目点击
cityItemClick(index) {
var data = this.allCityList[index]
uni.$emit('data', data);
uni.navigateBack({
delta: 1,
})
},
//热门城市点击
cityTap(index) {
var data = this.hotCityList[index]
uni.$emit('data', data);
uni.navigateBack({
delta: 1,
})
},
returnHotCity() {
var list = [{
"city": "北京"
}, {
"city": "天津"
}, {
"city": "上海"
}, {
"city": "杭州"
}, {
"city": "南京"
}, {
"city": "广州"
}, {
"city": "深圳"
}, {
"city": "武汉"
}, {
"city": "成都"
}, {
"city": "厦门"
}]
return list;
},
getAllCity() {
var list = [{
"city": "阿拉善盟",
"letter": "A"
}, {
"city": "阿拉善",
"letter": "A"
}, {
"city": "鞍山",
"letter": "A"
}, {
"city": "安庆",
"letter": "A"
}, {
"city": "安阳",
"letter": "A"
}, {
"city": "阿坝",
"letter": "A"
}, {
"city": "安顺",
"letter": "A"
}, {
"city": "阿里",
"letter": "A"
}, {
"city": "安康",
"letter": "A"
}, {
"city": "阿克苏",
"letter": "A"
}, {
"city": "阿勒泰",
"letter": "A"
}, {
"city": "澳门",
"letter": "A"
}, {
"city": "北京",
"letter": "B"
}, {
"city": "保定",
"letter": "B"
}, {
"city": "包头",
"letter": "B"
}, {
"city": "巴彦淖尔",
"letter": "B"
}, {
"city": "巴彦淖尔盟",
"letter": "B"
}, {
"city": "巴彦浩特",
"letter": "B"
}, {
"city": "本溪",
"letter": "B"
}, {
"city": "白山",
"letter": "B"
}, {
"city": "白城",
"letter": "B"
}, {
"city": "蚌埠",
"letter": "B"
}, {
"city": "亳州",
"letter": "B"
}, {
"city": "滨州",
"letter": "B"
}, {
"city": "北海",
"letter": "B"
}, {
"city": "百色",
"letter": "B"
}, {
"city": "巴中",
"letter": "B"
}, {
"city": "毕节",
"letter": "B"
}, {
"city": "保山",
"letter": "B"
}, {
"city": "版纳",
"letter": "B"
}, {
"city": "宝鸡",
"letter": "B"
}, {
"city": "白银",
"letter": "B"
}, {
"city": "博尔塔拉",
"letter": "B"
}, {
"city": "巴音郭楞",
"letter": "B"
}, {
"city": "重庆",
"letter": "C"
}, {
"city": "承德",
"letter": "C"
}, {
"city": "沧州",
"letter": "C"
}, {
"city": "长治",
"letter": "C"
}, {
"city": "赤峰",
"letter": "C"
}, {
"city": "朝阳",
"letter": "C"
}, {
"city": "长春",
"letter": "C"
}, {
"city": "常州",
"letter": "C"
}, {
"city": "滁州",
"letter": "C"
}, {
"city": "巢湖",
"letter": "C"
}, {
"city": "池州",
"letter": "C"
}, {
"city": "长沙",
"letter": "C"
}, {
"city": "常德",
"letter": "C"
}, {
"city": "郴州",
"letter": "C"
}, {
"city": "潮阳",
"letter": "C"
}, {
"city": "潮州",
"letter": "C"
}, {
"city": "崇左",
"letter": "C"
}, {
"city": "成都",
"letter": "C"
}, {
"city": "楚雄",
"letter": "C"
}, {
"city": "昌都",
"letter": "C"
}, {
"city": "昌吉",
"letter": "C"
}, {
"city": "大同",
"letter": "D"
}, {
"city": "大连",
"letter": "D"
}, {
"city": "丹东",
"letter": "D"
}, {
"city": "大庆",
"letter": "D"
}, {
"city": "大兴安岭",
"letter": "D"
}, {
"city": "东营",
"letter": "D"
}, {
"city": "德州",
"letter": "D"
}, {
"city": "东莞",
"letter": "D"
}, {
"city": "儋州",
"letter": "D"
}, {
"city": "达川",
"letter": "D"
}, {
"city": "德阳",
"letter": "D"
}, {
"city": "达州",
"letter": "D"
}, {
"city": "都匀",
"letter": "D"
}, {
"city": "大理",
"letter": "D"
}, {
"city": "德宏",
"letter": "D"
}, {
"city": "迪庆",
"letter": "D"
}, {
"city": "定西",
"letter": "D"
}, {
"city": "钓鱼岛",
"letter": "D"
}, {
"city": "鄂尔多斯",
"letter": "E"
}, {
"city": "鄂州",
"letter": "E"
}, {
"city": "恩施",
"letter": "E"
}, {
"city": "抚顺",
"letter": "F"
}, {
"city": "阜新",
"letter": "F"
}, {
"city": "阜阳",
"letter": "F"
}, {
"city": "福州",
"letter": "F"
}, {
"city": "抚州",
"letter": "F"
}, {
"city": "佛山",
"letter": "F"
}, {
"city": "防城港",
"letter": "F"
}, {
"city": "赣州",
"letter": "G"
}, {
"city": "广州",
"letter": "G"
}, {
"city": "桂林",
"letter": "G"
}, {
"city": "贵港",
"letter": "G"
}, {
"city": "广元",
"letter": "G"
}, {
"city": "广安",
"letter": "G"
}, {
"city": "甘孜",
"letter": "G"
}, {
"city": "贵阳",
"letter": "G"
}, {
"city": "甘南",
"letter": "G"
}, {
"city": "格尔木",
"letter": "G"
}, {
"city": "果洛",
"letter": "G"
}, {
"city": "固原",
"letter": "G"
}, {
"city": "邯郸",
"letter": "H"
}, {
"city": "衡水",
"letter": "H"
}, {
"city": "呼和浩特",
"letter": "H"
}, {
"city": "呼伦贝尔",
"letter": "H"
}, {
"city": "海拉尔",
"letter": "H"
}, {
"city": "葫芦岛",
"letter": "H"
}, {
"city": "珲春",
"letter": "H"
}, {
"city": "哈尔滨",
"letter": "H"
}, {
"city": "鹤岗",
"letter": "H"
}, {
"city": "黑河",
"letter": "H"
}, {
"city": "淮安",
"letter": "H"
}, {
"city": "杭州",
"letter": "H"
}, {
"city": "湖州",
"letter": "H"
}, {
"city": "合肥",
"letter": "H"
}, {
"city": "淮南",
"letter": "H"
}, {
"city": "淮北",
"letter": "H"
}, {
"city": "黄山",
"letter": "H"
}, {
"city": "菏泽",
"letter": "H"
}, {
"city": "鹤壁",
"letter": "H"
}, {
"city": "潢川",
"letter": "H"
}, {
"city": "黄石",
"letter": "H"
}, {
"city": "黄冈",
"letter": "H"
}, {
"city": "衡阳",
"letter": "H"
}, {
"city": "怀化",
"letter": "H"
}, {
"city": "惠州",
"letter": "H"
}, {
"city": "河源",
"letter": "H"
}, {
"city": "贺州",
"letter": "H"
}, {
"city": "河池",
"letter": "H"
}, {
"city": "海口",
"letter": "H"
}, {
"city": "红河",
"letter": "H"
}, {
"city": "汉中",
"letter": "H"
}, {
"city": "海东",
"letter": "H"
}, {
"city": "海北",
"letter": "H"
}, {
"city": "黄南",
"letter": "H"
}, {
"city": "海南",
"letter": "H"
}, {
"city": "海西",
"letter": "H"
}, {
"city": "哈密",
"letter": "H"
}, {
"city": "和田",
"letter": "H"
}, {
"city": "晋城",
"letter": "J"
}, {
"city": "晋中",
"letter": "J"
}, {
"city": "集宁",
"letter": "J"
}, {
"city": "锦州",
"letter": "J"
}, {
"city": "吉林",
"letter": "J"
}, {
"city": "鸡西",
"letter": "J"
}, {
"city": "佳木斯",
"letter": "J"
}, {
"city": "嘉兴",
"letter": "J"
}, {
"city": "金华",
"letter": "J"
}, {
"city": "景德镇",
"letter": "J"
}, {
"city": "九江",
"letter": "J"
}, {
"city": "吉安",
"letter": "J"
}, {
"city": "济南",
"letter": "J"
}, {
"city": "济宁",
"letter": "J"
}, {
"city": "焦作",
"letter": "J"
}, {
"city": "济源",
"letter": "J"
}, {
"city": "荆门",
"letter": "J"
}, {
"city": "荆州",
"letter": "J"
}, {
"city": "江汉",
"letter": "J"
}, {
"city": "吉首",
"letter": "J"
}, {
"city": "江门",
"letter": "J"
}, {
"city": "揭阳",
"letter": "J"
}, {
"city": "嘉峪关",
"letter": "J"
}, {
"city": "金昌",
"letter": "J"
}, {
"city": "酒泉",
"letter": "J"
}, {
"city": "开封",
"letter": "K"
}, {
"city": "凯里",
"letter": "K"
}, {
"city": "昆明",
"letter": "K"
}, {
"city": "克拉玛依",
"letter": "K"
}, {
"city": "奎屯",
"letter": "K"
}, {
"city": "克孜勒苏",
"letter": "K"
}, {
"city": "喀什",
"letter": "K"
}, {
"city": "廊坊",
"letter": "L"
}, {
"city": "临汾",
"letter": "L"
}, {
"city": "吕梁",
"letter": "L"
}, {
"city": "临河",
"letter": "L"
}, {
"city": "辽阳",
"letter": "L"
}, {
"city": "辽源",
"letter": "L"
}, {
"city": "连云港",
"letter": "L"
}, {
"city": "丽水",
"letter": "L"
}, {
"city": "六安",
"letter": "L"
}, {
"city": "龙岩",
"letter": "L"
}, {
"city": "莱芜",
"letter": "L"
}, {
"city": "临沂",
"letter": "L"
}, {
"city": "聊城",
"letter": "L"
}, {
"city": "洛阳",
"letter": "L"
}, {
"city": "漯河",
"letter": "L"
}, {
"city": "娄底",
"letter": "L"
}, {
"city": "柳州",
"letter": "L"
}, {
"city": "来宾",
"letter": "L"
}, {
"city": "泸州",
"letter": "L"
}, {
"city": "乐山",
"letter": "L"
}, {
"city": "凉山",
}, {
"city": "六盘水",
"letter": "L"
}, {
"city": "丽江",
"letter": "L"
}, {
"city": "临沧",
"letter": "L"
}, {
"city": "拉萨",
"letter": "L"
}, {
"city": "林芝",
"letter": "L"
}, {
"city": "兰州",
"letter": "L"
}, {
"city": "陇南",
"letter": "L"
}, {
"city": "临夏",
"letter": "L"
}, {
"city": "梅河口",
"letter": "M"
}, {
"city": "牡丹江",
"letter": "M"
}, {
"city": "马鞍山",
"letter": "M"
}, {
"city": "茂名",
"letter": "M"
}, {
"city": "梅州",
"letter": "M"
}, {
"city": "绵阳",
"letter": "M"
}, {
"city": "眉山",
"letter": "M"
}, {
"city": "南京",
"letter": "N"
}, {
"city": "南通",
"letter": "N"
}, {
"city": "宁波",
"letter": "N"
}, {
"city": "南平",
"letter": "N"
}, {
"city": "宁德",
"letter": "N"
}, {
"city": "南昌",
"letter": "N"
}, {
"city": "南阳",
"letter": "N"
}, {
"city": "南宁",
"letter": "N"
}, {
"city": "内江",
"letter": "N"
}, {
"city": "南充",
"letter": "N"
}, {
"city": "怒江",
"letter": "N"
}, {
"city": "怒江傈",
"letter": "N"
}, {
"city": "那曲",
"letter": "N"
}, {
"city": "盘锦",
"letter": "P"
}, {
"city": "莆田",
"letter": "P"
}, {
"city": "萍乡",
"letter": "P"
}, {
"city": "平顶山",
"letter": "P"
}, {
"city": "濮阳",
"letter": "P"
}, {
"city": "攀枝花",
"letter": "P"
}, {
"city": "平凉",
"letter": "P"
}, {
"city": "秦皇岛",
"letter": "Q"
}, {
"city": "齐齐哈尔",
"letter": "Q"
}, {
"city": "七台河",
"letter": "Q"
}, {
"city": "衢州",
"letter": "Q"
}, {
"city": "泉州",
"letter": "Q"
}, {
"city": "青岛",
"letter": "Q"
}, {
"city": "潜江",
"letter": "Q"
}, {
"city": "清远",
"letter": "Q"
}, {
"city": "钦州",
"letter": "Q"
}, {
"city": "琼海",
"letter": "Q"
}, {
"city": "黔西南",
"letter": "Q"
}, {
"city": "黔东南",
"letter": "Q"
}, {
"city": "黔南",
"letter": "Q"
}, {
"city": "曲靖",
"letter": "Q"
}, {
"city": "庆阳",
"letter": "Q"
}, {
"city": "日照",
"letter": "R"
}, {
"city": "日喀则",
"letter": "R"
}, {
"city": "上海",
"letter": "S"
}, {
"city": "石家庄",
"letter": "S"
}, {
"city": "朔州",
"letter": "S"
}, {
"city": "沈阳",
"letter": "S"
}, {
"city": "四平",
"letter": "S"
}, {
"letter": "S"
}, {
"city": "双鸭山",
"letter": "S"
}, {
"city": "绥化",
"letter": "S"
}, {
"city": "苏州",
"letter": "S"
}, {
"city": "宿迁",
"letter": "S"
}, {
"city": "绍兴",
"letter": "S"
}, {
"city": "宿州",
"letter": "S"
}, {
"city": "三明",
"letter": "S"
}, {
"city": "上饶",
"letter": "S"
}, {
"city": "三门峡",
"letter": "S"
}, {
"city": "商丘",
"letter": "S"
}, {
"letter": "S"
}, {
"city": "随州",
"letter": "S"
}, {
"city": "神农架林区",
"letter": "S"
}, {
"city": "邵阳",
"letter": "S"
}, {
"city": "韶关",
"letter": "S"
}, {
"city": "深圳",
"letter": "S"
}, {
"city": "汕头",
"letter": "S"
}, {
"letter": "S"
}, {
"city": "汕尾",
"letter": "S"
}, {
"city": "三亚",
"letter": "S"
}, {
"city": "三沙地区",
"letter": "S"
}, {
"city": "遂宁",
"letter": "S"
}, {
"city": "思茅",
"letter": "S"
}, {
"letter": "S"
}, {
"city": "商洛",
"letter": "S"
}, {
"city": "石嘴山",
"letter": "S"
}, {
"city": "石河子",
"letter": "S"
}, {
"city": "天津",
"letter": "T"
}, {
"city": "唐山",
"letter": "T"
}, {
"city": "太原",
"letter": "T"
}, {
"city": "通辽",
"letter": "T"
}, {
"city": "铁岭",
"letter": "T"
}, {
"city": "通化",
"letter": "T"
}, {
"city": "泰州",
"letter": "T"
}, {
"city": "台州",
"letter": "T"
}, {
"city": "铜陵",
"letter": "T"
}, {
"city": "泰安",
"letter": "T"
}, {
"city": "天门",
"letter": "T"
}, {
"city": "铜仁",
"letter": "T"
}, {
"city": "铜川",
"letter": "T"
}, {
"city": "天水",
"letter": "T"
}, {
"city": "吐鲁番",
"letter": "T"
}, {
"city": "塔城",
"letter": "T"
}, {
"city": "台湾",
"letter": "T"
}, {
"city": "乌海",
"letter": "W"
}, {
"city": "乌兰察布",
"letter": "W"
}, {
"city": "乌兰浩特",
"letter": "W"
}, {
"city": "乌兰察布盟",
"letter": "W"
}, {
"city": "未知",
"letter": "W"
}, {
"city": "无锡",
"letter": "W"
}, {
"city": "温州",
"letter": "W"
}, {
"city": "芜湖",
"letter": "W"
}, {
"city": "潍坊",
"letter": "W"
}, {
"city": "威海",
"letter": "W"
}, {
"city": "武汉",
"letter": "W"
}, {
"city": "梧州",
"letter": "W"
}, {
"city": "文昌",
"letter": "W"
}, {
"city": "文山",
"letter": "W"
}, {
"city": "渭南",
"letter": "W"
}, {
"city": "武威",
"letter": "W"
}, {
"city": "吴忠",
"letter": "W"
}, {
"city": "乌鲁木齐",
"letter": "W"
}, {
"city": "五家渠",
"letter": "W"
}, {
"city": "邢台",
"letter": "X"
}, {
"city": "忻州",
"letter": "X"
}, {
"city": "锡林浩特",
"letter": "X"
}, {
"city": "兴安盟",
"letter": "X"
}, {
"city": "锡林郭勒盟",
"letter": "X"
}, {
"city": "兴安",
"letter": "X"
}, {
"city": "锡林郭勒",
"letter": "X"
}, {
"city": "徐州",
"letter": "X"
}, {
"letter": "X"
}, {
"city": "厦门",
"letter": "X"
}, {
"city": "新余",
"letter": "X"
}, {
"city": "新乡",
"letter": "X"
}, {
"city": "许昌",
"letter": "X"
}, {
"city": "信阳",
"letter": "X"
}, {
"city": "仙桃",
"letter": "X"
}, {
"city": "襄阳",
"letter": "X"
}, {
"city": "孝感",
"letter": "X"
}, {
"city": "咸宁",
"letter": "X"
}, {
"city": "湘潭",
"letter": "X"
}, {
"city": "湘西",
"letter": "X"
}, {
"city": "兴义",
"letter": "X"
}, {
"city": "西双版纳",
"letter": "X"
}, {
"city": "西安",
"letter": "X"
}, {
"city": "咸阳",
"letter": "X"
}, {
"city": "西宁",
"letter": "X"
}, {
"city": "香港",
"letter": "X"
}, {
"city": "阳泉",
"letter": "Y"
}, {
"city": "运城",
"letter": "Y"
}, {
"city": "营口",
"letter": "Y"
}, {
"city": "延吉",
"letter": "Y"
}, {
"city": "延边",
"letter": "Y"
}, {
"city": "伊春",
"letter": "Y"
}, {
"city": "盐城",
"letter": "Y"
}, {
"city": "扬州",
"letter": "Y"
}, {
"city": "鹰潭",
"letter": "Y"
}, {
"city": "宜春",
"letter": "Y"
}, {
"city": "烟台",
"letter": "Y"
}, {
"city": "宜昌",
"letter": "Y"
}, {
"city": "岳阳",
"letter": "Y"
}, {
"city": "益阳",
"letter": "Y"
}, {
"city": "永州",
"letter": "Y"
}, {
"city": "阳江",
"letter": "Y"
}, {
"city": "云浮",
"letter": "Y"
}, {
"city": "玉林",
"letter": "Y"
}, {
"city": "宜宾",
"letter": "Y"
}, {
"city": "雅安",
"letter": "Y"
}, {
"city": "玉溪",
"letter": "Y"
}, {
"city": "延安",
"letter": "Y"
}, {
"city": "榆林",
"letter": "Y"
}, {
"city": "玉树",
"letter": "Y"
}, {
"city": "银川",
"letter": "Y"
}, {
"city": "伊犁",
"letter": "Y"
}, {
"city": "张家口",
"letter": "Z"
}, {
"city": "镇江",
"letter": "Z"
}, {
"city": "舟山",
"letter": "Z"
}, {
"city": "漳州",
"letter": "Z"
}, {
"city": "淄博",
"letter": "Z"
}, {
"city": "枣庄",
"letter": "Z"
}, {
"city": "郑州",
"letter": "Z"
}, {
"city": "周口",
"letter": "Z"
}, {
"city": "驻马店",
"letter": "Z"
}, {
"city": "株洲",
"letter": "Z"
}, {
"city": "张家界",
"letter": "Z"
}, {
"city": "株洲",
"letter": "Z"
}, {
"city": "珠海",
"letter": "Z"
}, {
"city": "湛江",
"letter": "Z"
}, {
"city": "肇庆",
"letter": "Z"
}, {
"city": "中山",
"letter": "Z"
}, {
"city": "自贡",
"letter": "Z"
}, {
"city": "资阳",
"letter": "Z"
}, {
"city": "遵义",
"letter": "Z"
}, {
"city": "昭通",
"letter": "Z"
}, {
"city": "张掖",
"letter": "Z"
}, {
"city": "中卫",
"letter": "Z"
}]
return list;
}
}
}
</script>
<style>
page {
height: 100%;
background-color: #F5F5F5;
}
.introScroll {
height: 100%;
width: 100%;
display: flex;
position: relative;
}
.topView {
display: flex;
flex-direction: column;
position: fixed;
z-index: 99;
width: 100%;
}
.serchView {
width: 100%;
height: 110rpx;
display: flex;
flex-direction: column;
background-color: #FFFFFF;
align-items: center;
justify-content: center;
}
.serch {
width: 690rpx;
height: 70rpx;
background: #F7F7F7;
border-radius: 35rpx;
display: flex;
flex-direction: row;
align-items: center;
}
.serchIconImage {
width: 30rpx;
height: 26rpx;
margin-left: 30rpx;
}
.serchInput {
height: 70rpx;
width: 600rpx;
margin-left: 12rpx;
font-size: 30rpx;
color: #000000;
}
.nowCityTextTipsView {
display: flex;
flex-direction: column;
justify-content: center;
background-color: #F5F5F5;
height: 50rpx;
width: 100%;
padding-bottom: 14rpx;
}
.nowLocationCity {
line-height: 50rpx;
font-size: 28rpx;
color: #999999;
margin-left: 36rpx;
margin-top: 15rpx;
}
.againLocationView {
height: 88rpx;
display: flex;
flex-direction: row;
align-items: center;
position: relative;
width: 100%;
background-color: #FFFFFF;
}
.loactionText {
font-size: 30rpx;
color: #129DFF;
margin-left: 30rpx;
}
.loactionStatusText {
margin-left: 50rpx;
font-size: 30rpx;
color: #999999;
}
.refreshImage {
position: absolute;
right: 48rpx;
padding: 10rpx;
width: 38rpx;
height: 38rpx;
}
.cityListView {
display: flex;
flex-direction: column;
height: 100%;
margin-top: 265rpx;
position: relative;
overflow: scroll;
}
.city_right {
z-index: 99;
width: 60rpx;
display: flex;
height: 100%;
position: absolute;
right: 0;
flex-direction: column;
justify-content: center;
top: 120rpx;
}
.letter_item {
display: block;
font-size: 20rpx;
color: #666;
text-align: center;
padding-left: 20rpx;
padding-top: 3rpx;
padding-bottom: 3rpx;
font-weight: bold;
}
.hotCityTips {
margin-left: 30rpx;
margin-top: 30rpx;
font-size: 30rpx;
color: #999999;
}
.new_city_box {
margin-top: 26rpx;
display: flex;
flex-wrap: wrap;
padding: 0 60rpx 0 20rpx;
}
.new_city_text {
width: 114rpx;
text-align: center;
font-size: 24rpx;
line-height: 42rpx;
color: #333;
background: #fff;
border-radius: 21rpx;
margin: 0 10rpx 20rpx 10rpx;
}
.forCityView {
width: 100%;
padding-bottom: 30rpx;
}
.forCityItem {
display: flex;
flex-direction: column;
}
.letterItemFirst {
height: 49rpx;
padding-left: 40rpx;
font-size: 30rpx;
line-height: 49rpx;
color: #000;
background: #f7f7f7;
width: 100%;
}
.itemCityContent {
display: inline-block;
width: 100%;
height: 88rpx;
font-size: 34rpx;
color: #000000;
padding-left: 40rpx;
background-color: #FFFFFF;
line-height: 88rpx;
}
.line {
width: 642rpx;
height: 1rpx;
background-color: #ebebeb;
margin-left: 40rpx;
}
</style>
9280
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
