You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
247 lines
6.9 KiB
247 lines
6.9 KiB
<template>
|
|
<view>
|
|
<view class="se-pos se-pos-lt" style="z-index: -1;width: 750rpx;height: 388rpx;
|
|
background: linear-gradient(168deg,#669a32 0%, #669a32 72%);
|
|
border-radius: 0rpx 0rpx 80rpx 80rpx;">
|
|
</view>
|
|
<view class="se-flex se-flex-h-sb se-px-20 se-pb-10 se-pt-10 se-zi-s" style="background-color: transparent;">
|
|
<view class="se-c-white se-fs-28">
|
|
<view class="se-c-white se-py-5 se-px-10 se-fw-6 se-br-12 se-fs-28 se-display-ib">
|
|
环保
|
|
</view>
|
|
<text class="se-ml-10 se-fw-6 se-fs-22">寻找你想要的</text>
|
|
</view>
|
|
</view>
|
|
<view class="se-px-40 se-py-20">
|
|
<view class=" se-br-50 se-c-black se-px-20 se-py-5 se-flex se-flex-h-sb se-fs-26">
|
|
<view class="se-pl-10 se-pr-20 se-flex se-flex-h se-h-40 se-lh-40 " @click="handleAreaChange()">
|
|
<text class="se-pr-20 se-c-white nobreak">{{city?city:'未知'}}</text>
|
|
<u-icon name="arrow-down-fill" color="#ffffff"></u-icon>
|
|
</view>
|
|
<view class="se-ml-20 se-w-p-100">
|
|
<u-search :disabled="true" @click="onSearch()" :showAction="false" bgColor="#ffffff" placeholder="搜索" v-model="keyword"></u-search>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="se-pb-20 se-pt-40 se-zi-s">
|
|
<view class="se-px-20">
|
|
<u-swiper height="300rpx" style="background-color: transparent;height: 300rpx;" keyName="image" :list="swiperList" @click="swiperClick"></u-swiper>
|
|
</view>
|
|
<!-- <view class="se-pt-10 se-bgc-white se-px-0 se-py-10 se-ta-l se-c-orange se-flex se-flex-ai-c se-fs-26">
|
|
<image class="se-a-80" src="@/static/image/aed60x.png" mode=""></image>
|
|
<text class="se-ml-10">今日有6个工作息新发布....</text>
|
|
</view> -->
|
|
</view>
|
|
<view class="se-my-20 se-pt-20 se-bgc-white se-grid">
|
|
<navigator :url="item.url" v-for="(item, index) in nav" :key="index" class="se-flex-v-c se-pt-10 se-mb-10">
|
|
<image class="se-a-100 se-br-20" :src="item.img" mode=""></image>
|
|
<text class="se-w-150 se-h-60 se-lh-30 se-c-black se-fs-22 se-ta-c se-mt-10 se-toe-2">{{item.name}}</text>
|
|
</navigator>
|
|
</view>
|
|
<view class="se-px-30 se-py-30 se-bgc-white se-c-black">
|
|
精品二手车
|
|
</view>
|
|
<view class="se-grid-2">
|
|
<view class="items-box se-br-5 se-px-10" v-for="(items,indexs) in list" :key="indexs" @click="onDetail(items)">
|
|
<image class="se-w-p-100 se-h-200 se-py-5" :src="items.image" mode=""></image>
|
|
<view class="se-c-black se-fs-24 se-fw-6 se-mt-10">
|
|
{{ items.goodsName }}
|
|
</view>
|
|
<view class="se-flex se-mt-10">
|
|
<view class="se-tag">
|
|
{{items.cartypeId_dictText}}
|
|
</view>
|
|
<view class="se-tag">
|
|
{{items.categorytwoId_dictText}}
|
|
</view>
|
|
</view>
|
|
<view class="se-flex se-flex-h-sb se-w-p-100 se-pt-20">
|
|
<view class="se-fs-24 se-display-ib">
|
|
<text class="se-c-orange se-fs-30 se-fw-6"><text class="se-fs-24">￥</text>{{items.price}}<text class="se-fs-24">元</text></text>
|
|
</view>
|
|
<view class="se-display-ib se-bgc-orange se-px-15 se-br-40 se-flex-h-c se-h-40 se-lh-40 se-ta-c se-fs-22 se-c-white se-b">
|
|
<text>查看详情</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { getInfo,queryGoodsList,queryBannerList } from "@/common/api.js"
|
|
import QQMapWX from "@/util/qqmap-wx-jssdk.min.js"
|
|
export default{
|
|
components:{
|
|
|
|
},
|
|
data(){
|
|
return {
|
|
city:"",
|
|
swiperList: [
|
|
"https://cdn.uviewui.com/uview/swiper/swiper1.png"
|
|
],
|
|
nav:[
|
|
{
|
|
img:"../../static/image/nav1.png",
|
|
name:"新车商城",
|
|
url:"/pages_subpack/category/index"
|
|
},
|
|
{
|
|
img:"../../static/image/nav2.png",
|
|
name:"二手车商城",
|
|
url:"/pages_subpack/category/index"
|
|
},
|
|
{
|
|
img:"../../static/image/nav3.png",
|
|
name:"环卫设备及配件",
|
|
url:"/pages_subpack/category/index"
|
|
},
|
|
{
|
|
img:"../../static/image/nav4.png",
|
|
name:"车辆租赁",
|
|
url:"/pages_subpack/category/index"
|
|
},
|
|
{
|
|
img:"../../static/image/nav5.png",
|
|
name:"新闻资讯",
|
|
url:"/pages_subpack/news/index"
|
|
},
|
|
{
|
|
img:"../../static/image/nav6.png",
|
|
name:"帮助寻车",
|
|
url:"/pages_subpack/category/index"
|
|
}
|
|
],
|
|
pageNo:1,
|
|
pageSize:10,
|
|
list:[]
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
this.onPageList()
|
|
this.getLocation()
|
|
this.onQueryBannerList()
|
|
},
|
|
onPullDownRefresh() {
|
|
let that = this
|
|
that.pageNo = 1
|
|
that.list = []
|
|
that.onPageList()
|
|
},
|
|
onReachBottom() {
|
|
let that = this
|
|
that.pageNo = that.pageNo + 1
|
|
that.onPageList()
|
|
},
|
|
methods:{
|
|
onSearch(){
|
|
uni.navigateTo({
|
|
url:"/pages_subpack/category/index"
|
|
})
|
|
},
|
|
handleAreaChange(){
|
|
console.info("获取地址")
|
|
},
|
|
swiperClick(event){
|
|
console.info(event)
|
|
},
|
|
onDetail(event){
|
|
uni.navigateTo({
|
|
url:"/pages_subpack/detail/index?goodsId="+event.id
|
|
})
|
|
},
|
|
getLocation(){
|
|
const that = this;
|
|
wx.getLocation({
|
|
type: 'wgs84',
|
|
success: function (res) {
|
|
console.log('当前位置的经度：' + res.longitude);
|
|
console.log('当前位置的纬度：' + res.latitude);
|
|
const qqmapsdk = new QQMapWX({
|
|
key: 'TT7BZ-Z3LW4-KOAUB-KWHOA-SBJJ6-Y5B6R' // 必填
|
|
});
|
|
qqmapsdk.reverseGeocoder({
|
|
location: {
|
|
latitude: res.latitude,
|
|
longitude: res.longitude
|
|
},
|
|
success: function(response) {
|
|
that.city = response.result.ad_info.city
|
|
console.log('逆地理编码结果：', response);
|
|
},
|
|
fail: function(error) {
|
|
console.error('逆地理编码失败：', error);
|
|
}
|
|
});
|
|
}
|
|
})
|
|
},
|
|
onQueryBannerList(){
|
|
let that = this
|
|
let params={}
|
|
queryBannerList(params).then(response=>{
|
|
console.info("queryBannerList",response)
|
|
that.swiperList = response.result.records
|
|
}).catch(error=>{
|
|
|
|
})
|
|
},
|
|
onPageList(){
|
|
let that = this
|
|
let params={
|
|
pageNo:that.pageNo,
|
|
pageSize:that.pageSize
|
|
}
|
|
queryGoodsList(params).then((response) => {
|
|
console.info('queryGoodsList',response)
|
|
that.list = that.list.concat(response.result.records)
|
|
}).catch((error) =>{
|
|
|
|
})
|
|
},
|
|
}
|
|
|
|
}
|
|
</script>
|
|
<style>
|
|
.nobreak {
|
|
white-space: nowrap;
|
|
}
|
|
page{
|
|
background-color: #f5f5f5;
|
|
}
|
|
.enterprise{
|
|
background: #ff7a31;
|
|
border: 4rpx solid rgba(255,255,255,0.50);
|
|
border-radius: 14rpx;
|
|
}
|
|
.master{
|
|
background: #f0b744;
|
|
border: 4rpx solid rgba(255,255,255,0.50);
|
|
border-radius: 14rpx;
|
|
}
|
|
.items-box{
|
|
background: #ffffff;
|
|
border-radius: 8rpx;
|
|
box-shadow: 0rpx 4rpx 16rpx 0rpx rgba(0,0,0,0.05);
|
|
padding: 20rpx;
|
|
}
|
|
.se-tag{
|
|
padding: 5rpx 10rpx;
|
|
background: #fff2df;
|
|
border-radius: 4rpx;
|
|
border: 2rpx solid rgba(0,0,0,0.00);
|
|
font-size: 16rpx;
|
|
font-family: PingFang SC, PingFang SC-Bold;
|
|
font-weight: 700;
|
|
text-align: center;
|
|
color: #fab143;
|
|
margin-left: 10rpx;
|
|
}
|
|
|
|
.se-tag:first-child{
|
|
margin-left: 0rpx;
|
|
}
|
|
</style>
|