This commit is contained in:
DL
2024-03-23 19:21:00 +08:00
parent d6a2f94cbb
commit 410dc1867f
4 changed files with 146 additions and 56 deletions

View File

@@ -28,6 +28,9 @@ export const carTenancyList = [{
value: 12
}]
export const carPriceList = [{
name: '全部',
value: -1
}, {
name: '10万以下',
value: 1
}, {
@@ -47,6 +50,9 @@ export const carPriceList = [{
value: 6
}]
export const carAgeList = [{
name: '全部',
value: -1
}, {
name: '1年',
value: 1
}, {

View File

@@ -4,12 +4,34 @@
<view class="back-icon" slot="left" @click="$tab.navigateBack()">
<u-icon name="arrow-left" size="22"></u-icon>
</view>
<view class="brand-name flex align-center justify-between" slot="left" @click="brandShow=true">
{{brandName}}
<!-- 品牌 -->
<!-- <view class="brand-name flex align-center justify-between" slot="left" @click="brandShow=true">
<text style="margin-right: 8rpx;">{{brandName}}</text>
<u-icon name="arrow-down-fill" size="10" color="#000"></u-icon>
</view> -->
<!-- 地址 -->
<view class="nav-city flex align-center justify-between" slot="left"
@click="$tab.navigateTo('/pagesA/serve/repair/re_create/select_city')">
<u-icon name="map" color="#111" size="18"></u-icon>
<text style="margin:0 8rpx;">{{selectCity||'杭州'}}</text>
<!-- <u-icon name="arrow-right" color="#111" size="10"></u-icon> -->
</view>
</u-navbar>
<view class="tabs-box bg-white">
<view class="power flex align-center justify-between">
<view class="title">
品牌
</view>
<view class="select-content">
<view class="content-box">
<view :class="['content-item', brandId == -1 && 'active-item']" @click="brandFn(-1)">全部</view>
<view :class="['content-item', brandId == item.id && 'active-item']" @click="brandFn(item)"
v-for="(item) in brandList" :key="item.id">
{{item.name}}
</view>
</view>
</view>
</view>
<view class="power flex align-center justify-between">
<view class="title">
动力
@@ -29,9 +51,11 @@
</view>
<view class="select-content">
<view class="content-box">
<view :class="['content-item', modelId == -1 && 'active-item']" @click="modelFn(-1)">全部</view>
<view :class="['content-item', modelId == item.id && 'active-item']" @click="modelFn(item.id)"
v-for="(item) in modelList" :key="item.id">
{{item.name}}
<!-- <u-notice-bar :text="item.name" speed="20" color='#444444' bgColor='#f5f5f5' fontSize='26rpx'></u-notice-bar> -->
</view>
</view>
</view>
@@ -100,9 +124,9 @@
</text>
</view>
</view>
<view class="flex flex-column justify-around" style="height: 98rpx;" v-else>
<view class="info1 flex flex-column justify-around" style="height: 98rpx;" v-else>
<view class="name">{{item.title}}</view>
<view v-if="type==0" class="f-24 c666">
<view v-if="type==0" class="price1 f-24 c666">
<text>月供</text>
<text class="f-32 c111 price">{{item.monthTributePrice}} </text>
<text class="ml-2"> x {{item.monthTribute}}</text>
@@ -124,13 +148,16 @@
</view>
<view class="popup-select-box">
<view class="store-list flex-wrap align-center">
<view class="store-list-item flex-center rel" v-for="(item,index) in carUserList" @click="actcarDealerFn(item)">
<view class="store-list-item flex-center rel" v-for="(item,index) in carUserList"
@click="actcarDealerFn(item)">
{{item.name}}
<!-- #ifdef MP-WEIXIN -->
<image class="checked abs" v-if="carDealerId==item.id" :src="`${config.aliyunOssUrl}/static/images/app/icon/checked_1.png`" mode=""></image>
<image class="checked abs" v-if="carDealerId==item.id"
:src="`${config.aliyunOssUrl}/static/images/app/icon/checked_1.png`" mode=""></image>
<!-- #endif -->
<!-- #ifdef APP -->
<image class="checked abs" v-if="carDealerId==item.id" src="@/static/images/app/icon/checked_1.png" mode=""></image>
<image class="checked abs" v-if="carDealerId==item.id"
src="@/static/images/app/icon/checked_1.png" mode=""></image>
<!-- #endif -->
</view>
</view>
@@ -160,14 +187,22 @@
getProductList,
getInformationList
} from "@/api/showroom/showroom.js"
import {
mapGetters
} from 'vuex'
import {
getLocationFn
} from "@/utils/index.js"
export default {
data() {
return {
config: getApp().globalData.config,
menuWidth: getApp().globalData.menuWidth,
//品牌
brandList: [],
brandShow: false,
brandName: '全部',
brandName: '全部品牌',
brandId: -1,
//型号
modelList: [],
modelId: -1,
@@ -188,21 +223,27 @@
type: 0,
carList: [],
//搜索数量
allNum:0,
allNum: 0,
//车商列表
carUserList:[],
carDealerId:'',
carUserList: [],
carDealerId: '',
//商家名称
carDealerName:'商家'
carDealerName: '商家'
};
},
computed: {
...mapGetters(['selectCity'])
},
onLoad(option) {
// console.log(option);
this.type = option.type
this.brandId = option.brandId
//获取品牌列表
modelBrandList().then(res => {
this.brandList = [res.data]
// console.log(res,'品牌');
// this.brandList = [res.data]
this.brandList = res.data
// this.brandList.unshift({ id: -1, name: "全部"});
res.data.forEach(item => {
if (this.brandId == item.id) {
this.brandName = item.name
@@ -213,18 +254,32 @@
})
//获取车商列表
getCarDealerList().then(res => {
this.carUserList=res.data
this.carUserList = res.data
})
//获取当前位置
getLocationFn()
},
methods: {
//选择商家
actcarDealerFn(item){
this.carDealerId=item.id
this.carDealerName=item.name
actcarDealerFn(item) {
this.carDealerId = item.id
this.carDealerName = item.name
},
//确认选择商家
affirmFn(){
this.storeShow=false
affirmFn() {
this.storeShow = false
this.$refs.paging.reload()
},
//品牌
brandFn(value) {
if (value == -1) {
this.brandId = value
this.modelList = []
} else {
this.brandId = value.id
this.modelList = value.carModelList
}
// this.modelList.unshift({ id: -1, brandId:value.id, name: "全部" });
this.$refs.paging.reload()
},
//动力
@@ -262,18 +317,18 @@
modelId: this.modelId,
powerType: this.powerId,
priceType: this.priceId,
monthRent:this.tenancyId,
carAge:this.carAgeId,
carDealerId:this.carDealerId
monthRent: this.tenancyId,
carAge: this.carAgeId,
carDealerId: this.carDealerId
}
if (this.type == 2) {
getInformationList(obj).then(res => {
this.allNum=res.data.total
this.allNum = res.data.total
this.$refs.paging.complete(res.data.list);
})
} else {
getProductList(obj).then(res => {
this.allNum=res.data.total
this.allNum = res.data.total
this.$refs.paging.complete(res.data.list);
})
}
@@ -298,12 +353,25 @@
</script>
<style lang="scss">
.nav-city {
// min-width: 140rpx;
font-size: 30rpx;
font-weight: 500;
color: #000;
line-height: 40rpx;
text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.15);
.black {
color: #000
}
}
.back-icon {
margin-right: 28rpx;
}
.brand-name {
width: 180rpx;
// width: 180rpx;
font-size: 36rpx;
font-weight: bold;
color: #000000;
@@ -352,6 +420,11 @@
color: #444444;
line-height: 52rpx;
text-align: center;
// white-space: nowrap;
// overflow: hidden;
// text-overflow: ellipsis; /* 文本溢出时显示省略号 */
// cursor: pointer; /* 设置点击时的鼠标样式为手型 */
}
.active-item {
@@ -476,6 +549,12 @@
}
}
.info1 {
.price1 {
margin-top: 16rpx;
}
}
.info {
.time {
margin-top: 8rpx;
@@ -488,9 +567,10 @@
}
image {
margin-right: 16rpx;
margin-right: 24rpx;
width: 202rpx;
height: 150rpx;
border-radius: 8rpx;
}
}

View File

@@ -136,7 +136,7 @@
</view>
</view>
<view style="height: 68rpx;" />
<view style="height: 15rpx;" />
</view>
</u-popup>
<!-- 车商详情 -->
@@ -227,10 +227,10 @@
订前必读
</view>
<view class="popup-read-content">
<view class="read-new-title">
<!-- <view class="read-new-title">
订车规则
</view>
<view class="">
</view> -->
<view class="img-box">
<image v-for="(rules,index) in carDealerData.rulesImage" class="guize" :src="rules"
:key="index" mode="widthFix" >
</image>
@@ -239,7 +239,7 @@
</image> -->
</view>
</view>
<view class="popup-read-content">
<!-- <view class="popup-read-content">
<view class="read-new-title">
订车流程
</view>
@@ -247,9 +247,8 @@
<image v-for="(process, index) in carDealerData.processImage" :key="index"
class="liucheng" :src="process" mode="widthFix"
></image>
<!-- @click="examineFn(carDealerData.rulesImage,index)" -->
</view>
</view>
</view> -->
</view>
<view class="must-read" id="problem">
<view class="popup-read-title">
@@ -266,7 +265,7 @@
</text>
</view>
</view>
<view class="">
<view class="img-box">
<!-- #ifdef MP-WEIXIN -->
<image class="problem-image" :src="`${config.aliyunOssUrl}/static/images/app/mine/gold_bg.png`" mode="widthFix"></image>
<!-- #endif -->
@@ -307,7 +306,7 @@
</view>
</view>
</view>
<view style="height: 68rpx;" />
<view style="height: 15rpx;" />
</view>
</view>
</u-popup>
@@ -600,7 +599,8 @@
}
.store-list {
padding: 24rpx;
padding: 24rpx 24rpx 0 24rpx;
// border: 1px solid red;
.store-item {
padding: 24rpx;
@@ -828,6 +828,10 @@
border-radius: 8rpx;
font-size: 28rpx;
color: #000000;
.img-box{
text-align: center;
}
.read-new-title {
font-size: 32rpx;
@@ -839,7 +843,7 @@
}
.guize {
margin-top: 32rpx;
// margin-top: 32rpx;
width: 654rpx;
// height: 156rpx;
}

View File

@@ -1,13 +1,13 @@
<template>
<view>
<u-overlay :show="show" @click="show = false;" z-index="777"></u-overlay>
<view :class="['nav-box', 'fixed-top', 'rel', showNavImg && 'bg-white']">
<!-- #ifdef MP-WEIXIN -->
<!-- <view :class="['nav-box', 'fixed-top', 'rel', showNavImg && 'bg-white']">
#ifdef MP-WEIXIN
<view :style="{height: `${$u.sys().statusBarHeight}px;`}" />
<!-- #endif -->
<!-- #ifdef APP -->
#endif
#ifdef APP
<view :style="`height: ${$u.sys().statusBarHeight}px;`" />
<!-- #endif -->
#endif
<view class="nav-btn flex align-center justify-between">
<view class="nav-city flex align-center justify-between"
@@ -16,20 +16,20 @@
<text style="z-index: 99999; " :class="showNavImg&&'black'">{{selectCity||'杭州'}}</text>
<u-icon name="arrow-right" :color="showNavImg && '#111' || '#fff'" size="10"></u-icon>
</view>
<!-- #ifdef MP-WEIXIN -->
#ifdef MP-WEIXIN
<view class="nav-msg flex-center rel" :style="{'margin-right': `${menuWidth}px`}" @click="toMessagePages">
<u-icon name="chat" :color="showNavImg && '#111' || '#fff'" size="20"></u-icon>
<view class="num abs flex-column-center" v-if="unreadNum>0"> {{unreadNum}} </view>
</view>
<!-- #endif -->
<!-- #ifdef APP -->
#endif
#ifdef APP
<view class="nav-msg flex-center rel" @click="toMessagePages">
<u-icon name="chat" :color="showNavImg && '#111' || '#fff'" size="20"></u-icon>
<view class="num abs flex-column-center" v-if="unreadNum>0"> {{unreadNum}} </view>
</view>
<!-- #endif -->
#endif
</view>
</view>
</view> -->
<u-swiper style="z-index: 888;" :height="`${height}rpx`" keyName="image" imgMode="widthFix" :list="branner" radius='0'></u-swiper>
<u-sticky zIndex="9999" @fixed="fixed" offsetTop="0" :customNavHeight="$u.sys().statusBarHeight + 42">
<view class="tab-box-all rel">
@@ -44,15 +44,15 @@
<!-- #ifdef MP-WEIXIN -->
<view class="icons flex align-center">
<image :src="`${config.aliyunOssUrl}/static/images/app/icon/search-black.png`" mode=""></image>
<image :src="`${config.aliyunOssUrl}/static/images/app/icon/search-black.png`" mode="" @click="toCarListPages"></image>
<!-- <image @click="show = !show" :src="`${config.aliyunOssUrl}/static/images/app/icon/mune.png`" mode=""></image> -->
<image @click="isshow" :src="`${config.aliyunOssUrl}/static/images/app/icon/mune.png`" mode=""></image>
<!-- <image @click="isshow" :src="`${config.aliyunOssUrl}/static/images/app/icon/mune.png`" mode=""></image> -->
</view>
<!-- #endif -->
<!-- #ifdef APP -->
<view class="icons flex align-center">
<image src="@/static/images/app/icon/search-black.png" mode=""></image>
<image @click="show = !show" src="@/static/images/app/icon/mune.png" mode=""></image>
<!-- <image @click="show = !show" src="@/static/images/app/icon/mune.png" mode=""></image> -->
</view>
<!-- #endif -->
</view>
@@ -221,7 +221,7 @@
import {
mapGetters
} from 'vuex'
import {getLocationFn} from "@/utils/index.js"
// import {getLocationFn} from "@/utils/index.js"
export default {
data() {
return {
@@ -318,6 +318,10 @@
// console.log('租期', this.tenancyId);
this.$tab.navigateTo(`./carList/carList?type=${this.form.type}&brandId=${this.brandId}`)
},
// 去商家
toCarListPages(){
this.$tab.navigateTo(`./carList/carList?type=${this.form.type}&brandId=${this.brandId}`)
},
//tab this.$refs.paging.reload()
actTabFn(type) {
this.form.type = type
@@ -359,10 +363,6 @@
})
}
},
// fixed(e) {
// console.log(e,'123321123');
// this.scrollTop = e
// },
reset() {
this.brandId = -1
this.modelId = -1
@@ -403,7 +403,7 @@
this.modelList = res.data[0].carModelList
})
//获取当前位置
getLocationFn()
// getLocationFn()
},
onShow() {
this.getBranner()