qichexitong/car-system-app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

2.26(评价，展厅

Browse Source
This commit is contained in:
Hong
2024-02-26 19:17:21 +08:00
parent 0972e2fe45
commit 2543133816
20 changed files with 1644 additions and 278 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
api/carShop/order/order.js
View File

@@ -69,4 +69,19 @@ export function getInformationMyOrder() {
method: 'get',
})
}
//租车提前还车审核 /api/front/car/information/give/audit
export function getInformationGiveAudit(data) {
return request({
url: `/api/front/car/information/give/audit`,
method: 'post',
data
})
}
//租车还车 /api/front/car/information/give/ensure/{id}
export function getInformationEnsure(id) {
return request({
url: `/api/front/car/information/give/ensure/${id}`,
method: 'get',
})
}

25
api/myOrder/index.js
View File

@@ -149,7 +149,7 @@ export function getInformationOrderList(data) {
return request({
url: `/api/front/car/information/user/order/list`,
method: 'get',
params:data
params: data
})
}
//租车订单详情 /api/front/car/information/user/order/list
@@ -166,4 +166,27 @@ export function getInformationGiveCar(data) {
method: 'post',
data
})
}
//取消租车订单 /api/front/car/information/user/order/cancel/{id}
export function getInformationCancel(id) {
return request({
url: `/api/front/car/information/user/order/cancel/${id}`,
method: 'get',
})
}
//评价租车订单 /api/front/car/information/user/reply
export function getInformationReply(data) {
return request({
url: `/api/front/car/information/user/reply`,
method: 'post',
data
})
}
//租车评价列表 /api/front/car/information/user/reply/list
export function getInformationReplyList(params) {
return request({
url: `/api/front/car/information/user/reply/list`,
method: 'get',
params
})
}

15
api/showroom/showroom.js
View File

@@ -117,4 +117,19 @@ export function informationCreate(data) {
'method': 'post',
data
})
}
//车商发布列表
export function informationDealerList(data) {
return request({
'url': `/api/front/car/information/user/info/page/dealer/${data.id}`,
'method': 'get',
params: data
})
}
//车商租车商品详情
export function getInformationInfo(orderNo) {
return request({
'url': `/api/front/car/information/user/product/info/${orderNo}`,
'method': 'get',
})
}

4
config.js
View File

@@ -1,10 +1,10 @@
// 应用全局配置
module.exports = {
//正式
baseUrl: 'https://mall.lianxianke.cn/car_app_api',
// baseUrl: 'https://mall.lianxianke.cn/car_app_api',
TOKENNAME: 'Authori-zation',
//薛磊测试
// baseUrl: 'http://192.168.31.226:8081/car_app_api',
baseUrl: 'http://192.168.31.226:8081/car_app_api',
fileUploadUrl: 'https://mall.lianxianke.cn/car_app_api/api/front/upload/image',
WebSocketUrl: 'ws://121.199.24.205:9107/lxk/websocket',
WebSocketOpen: false,

79
data/carConfigTabList.js Normal file
View File

@@ -0,0 +1,79 @@
export const carPowerList = [{
name: '全部',
value: -1
}, {
name: '纯电',
value: 0
}, {
name: '油电',
value: 1
}, {
name: '油',
value: 2
}]
export const carTenancyList = [{
name: '全部',
value: -1
}, {
name: '3个月',
value: 3
}, {
name: '6个月',
value: 6
}, {
name: '9个月',
value: 9
}, {
name: '12个月',
value: 12
}]
export const carPriceList = [{
name: '10万以下',
value: 1
}, {
name: '10-20万',
value: 2
}, {
name: '20-30万',
value: 3
}, {
name: '30-50万',
value: 4
}, {
name: '50-100万',
value: 5
}, {
name: '100万以上',
value: 6
}]
export const carAgeList = [{
name: '1年',
value: 1
}, {
name: '2年',
value: 2
}, {
name: '3年',
value: 3
}, {
name: '4年',
value: 4
}, {
name: '5年',
value: 5
}, {
name: '6年',
value: 6
}, {
name: '7年',
value: 7
}, {
name: '8年',
value: 8
}, {
name: '9年',
value: 9
}, {
name: '10年以上',
value: 10
}]

32
pages.json
View File

@@ -1271,6 +1271,38 @@
"navigationBarTitleText" : "选择话题",
"enablePullDownRefresh" : false
}
},
{
"path" : "pages/carShop/order/examine_contract/examine_contract",
"style" :
{
"navigationBarTitleText" : "查看合同",
"enablePullDownRefresh" : false
}
},
{
"path" : "pages/driver/mine/my_order/evaluate_order/evaluate_order",
"style" :
{
"navigationBarTitleText" : "发布评价",//租车订单
"enablePullDownRefresh" : false
}
},
{
"path" : "pages/driver/mine/my_order/evaluate_order/review_x",
"style" :
{
"navigationBarTitleText" : "评价详情",//租车订单
"enablePullDownRefresh" : false
}
},
{
"path" : "pages/driver/mine/my_order/evaluate_order/evaluate_list",
"style" :
{
"navigationBarTitleText" : "我的评价",//租车订单
"enablePullDownRefresh" : false
}
}
],
"tabBar": {

59
pages/carShop/order/car_rental/advanced.vue
View File

@@ -10,47 +10,47 @@
<view class="buy-info">
<view class="f-jcsb cont-list">
<view class="c444 f-28 cont-list-title">租赁人</view>
<view class="f-28 c111">张晨</view>
<view class="f-28 c111">{{formData.realName}}</view>
</view>
<view class="f-jcsb cont-list cont-ma48">
<view class="c444 f-28 cont-list-title">品牌/车系</view>
<view class="f-28 c111">BYD 元plus冠军版</view>
<view class="f-28 c111">{{formData.brandName}}/{{formData.modelName}}</view>
</view>
<view class="f-jcsb cont-list cont-ma48">
<!-- <view class="f-jcsb cont-list cont-ma48">
<view class="c444 f-28 cont-list-title">车型</view>
<view class="f-28 c111">轿车</view>
</view>
</view> -->
<view class="f-jcsb cont-list cont-ma48">
<view class="c444 f-28 cont-list-title">车牌号码</view>
<view class="f-28 c111">浙A·15J6R</view>
<view class="f-28 c111">{{formData.carNo}}</view>
</view>
<view class="f-jcsb cont-list cont-ma48">
<view class="c444 f-28 cont-list-title">车架号</view>
<view class="f-28 c111">15658-5565</view>
<view class="f-28 c111">{{formData.vinId}}</view>
</view>
<view class="f-jcsb cont-list cont-ma48">
<view class="c444 f-28 cont-list-title">租赁时间</view>
<view class="f-28 c111">6个月</view>
<view class="f-28 c111">{{formData.monthRent}}个月</view>
</view>
<view class="f-jcsb cont-list cont-ma48">
<view class="c444 f-28 cont-list-title">租赁期间</view>
<view class="f-28 c111">2023-01-01 至2023-06-30</view>
<view class="f-28 c111">{{formData.takeTime}} 至{{formData.giveTime}}</view>
</view>
<view class="f-jcsb cont-list cont-ma48">
<view class="c444 f-28 cont-list-title">还车原因</view>
<view class="f-28 c111 cont-list-cont">
<view>阿萨德几哈时间跨度卡号打卡机阿萨阿萨德哈萨克</view>
<image style="width: 100rpx;height: 100rpx;" src="@/static/htz-image-upload/play.png" mode="">
<view>{{formData.giveCause}}</view>
<image style="width: 100rpx;height: 100rpx;" v-for="img in formData.giveImage" :src="img" mode="">
</image>
</view>
</view>
</view>
<view class="bottom-butt-caozuo f-jce">
<view class="flex">
<u-button type="primary" text="拒绝" plain color="##111111" shape="circle" @click=""
<u-button type="primary" text="拒绝" plain color="##111111" shape="circle" @click="auditFn(0)"
:customStyle="{width:'192rpx',height:'80rpx',marginLeft: '24rpx'}"></u-button>
<u-button type="primary" text="通过" color="#13AFA8" shape="circle" @click="navInAdvanceFn"
<u-button type="primary" text="通过" color="#13AFA8" shape="circle" @click="auditFn(1)"
:customStyle="{width:'192rpx',height:'80rpx',marginLeft: '24rpx'}"></u-button>
</view>
</view>
@@ -58,20 +58,40 @@
</template>
<script>
import {
getProductOrderInfo,
getInformationGiveAudit
} from "@/api/carShop/order/order.js"
export default {
data() {
return {}
return {
formData: {}
}
},
methods: {
//提前还车
navInAdvanceFn() {
uni.navigateTo({
url: '/pages/driver/mine/my_order/rentCars/in_advance'
auditFn(flag) {
let obj = {
orderId: this.formData.id,
isAudit: flag == 1 ? true : false
}
getInformationGiveAudit(obj).then(res => {
uni.navigateBack()
})
}
},
onLoad(options) {
// console.log(options);
getProductOrderInfo(options.id).then(res => {
console.log(res.data);
this.formData = res.data
if (res.data.giveImage) {
this.formData.giveImage = res.data.giveImage.split(',')
} else {
this.formData.giveImage = []
}
})
}
}
</script>
@@ -113,11 +133,14 @@
.cont-list {
padding-bottom: 16rpx;
border-bottom: 1rpx solid #eee;
.cont-list-title{
.cont-list-title {
width: 160rpx;
}
.cont-list-cont{
.cont-list-cont {
width: calc(100% - 180rpx);
text-align: end;
}
}

40
pages/carShop/order/car_rental/car_rental_order.vue
View File

@@ -46,11 +46,11 @@
</view>
<view class="order-list-butt f-a-i justify-end">
<view class="f-a-i">
<view class="butt-list" v-if="item.status!=1&&item.status!=0" @click.stop="">
<view class="butt-list" v-if="item.status!=1&&item.status!=0" @click.stop="examineContractFn(item)">
<u-button type="primary" text="查看合同" plain color="#13AFA8" shape="circle"
:customStyle="{height:'56rpx'}"></u-button>
</view>
<view class="butt-list" v-if="item.status==1" @click.stop="navAdvancedFn(item)">
<view class="butt-list" v-if="item.giveStatus==1" @click.stop="navAdvancedFn(item)">
<u-button type="primary" text="查看原因" plain color="#13AFA8" shape="circle"
:customStyle="{height:'56rpx'}"></u-button>
</view>
@@ -58,7 +58,7 @@
<u-button type="primary" text="是否还车" plain color="#13AFA8" shape="circle"
:customStyle="{height:'56rpx'}"></u-button>
</view>
<view class="butt-list" v-if="!item.isExpire&&item.giveStatus==2" @click.stop="navAdvancedFn(item)">
<view class="butt-list" v-if="!item.isExpire&&item.giveStatus==2&&item.status!=3" @click.stop="alsoFn(item)">
<u-button type="primary" text="是否还车" plain color="#13AFA8" shape="circle"
:customStyle="{height:'56rpx'}"></u-button>
</view>
@@ -71,27 +71,47 @@
</view>
</view>
</z-paging>
<promptBox ref="pbox" @confirm="confirm"></promptBox>
</view>
</template>
<script>
import promptBox from "@/components/prompt-box/prompt-box.vue"
import {
carRentelList
} from "@/data/carShoptabs.js"
import {
getInformationOrderList
getInformationOrderList,
getInformationEnsure
} from "@/api/carShop/order/order.js"
import config from '@/config';
export default {
components: {
promptBox
},
data() {
return {
config,
carRentelList,
actTab: -1,
dataList: [],
orderId:''
};
},
methods: {
//还车
alsoFn(item){
this.orderId=item.id
this.$refs.pbox.show = true
this.$refs.pbox.tipContent.content = '您确定要还车吗？'
this.$refs.pbox.tipContent.cancelText = '取消'
},
confirm(){
getInformationEnsure(this.orderId).then(res=>{
console.log(res);
this.$refs.paging.refresh();
})
},
//提车
navCarSubmitFn(item) {
uni.navigateTo({
@@ -110,6 +130,12 @@
url: `/pages/carShop/order/car_rental/rental_particulars?id=${item.id}`
})
},
//查看合同 pages/carShop/order/examine_contract/examine_contract
examineContractFn(item){
uni.navigateTo({
url: `/pages/carShop/order/examine_contract/examine_contract?id=${item.id}`
})
},
clickTabFn(tab) {
this.actTab = tab.value
this.$refs.paging.refresh();
@@ -123,10 +149,16 @@
type: this.actTab
}
getInformationOrderList(obj).then(res => {
console.log(res.data.list);
this.$refs.paging.complete(res.data.list);
})
},
},
onShow() {
if(this.$refs.paging){
this.$refs.paging.refresh();
}
}
}
</script>

13
pages/carShop/order/car_rental/rental_particulars.vue
View File

@@ -90,11 +90,11 @@
</view>
<view class="bottom-butt-caozuo f-jce">
<view class="flex">
<u-button type="primary" text="查看原因" color="#13AFA8" shape="circle" @click=""
<u-button v-if="formData.giveStatus==1" type="primary" text="查看原因" color="#13AFA8" shape="circle" @click=""
:customStyle="{width:'192rpx',height:'80rpx',marginLeft: '24rpx',}"></u-button>
<u-button type="primary" text="查看合同" color="#13AFA8" shape="circle" @click=""
<u-button type="primary" text="查看合同" color="#13AFA8" shape="circle" @click="examineContractFn"
:customStyle="{width:'192rpx',height:'80rpx',marginLeft: '24rpx'}"></u-button>
<u-button type="primary" text="提车" color="#13AFA8" shape="circle" @click="navCarSubmitFn"
<u-button v-if="formData.status==1" type="primary" text="提车" color="#13AFA8" shape="circle" @click="navCarSubmitFn"
:customStyle="{width:'192rpx',height:'80rpx',marginLeft: '24rpx'}"></u-button>
</view>
</view>
@@ -110,6 +110,12 @@
}
},
methods: {
//查看合同 pages/carShop/order/examine_contract/examine_contract
examineContractFn(item){
uni.navigateTo({
url: `/pages/carShop/order/examine_contract/examine_contract?id=${this.formData.id}`
})
},
//提车
navCarSubmitFn(item){
uni.navigateTo({
@@ -124,6 +130,7 @@
}
},
onLoad(options) {
console.log(options.id);
getProductOrderInfo(options.id).then(res => {
this.formData = res.data
})

46
pages/carShop/order/examine_contract/examine_contract.vue Normal file
View File

@@ -0,0 +1,46 @@
<template>
<view>
<image v-if="formData.contractUrl" class="contract-image" :src="formData.contractUrl" mode="widthFix"></image>
<view v-else class="contract-view">暂无合同</view>
</view>
</template>
<script>
import {
getProductOrderInfo
} from "@/api/carShop/order/order.js"
import {
getInformationOrderDealer,
} from "@/api/myOrder/index.js"
export default {
data() {
return {
formData:{}
};
},
onLoad(options) {
if(options.type==1){
getInformationOrderDealer(options.id).then(res => {
console.log(res.data);
this.formData = res.data
})
}else{
getProductOrderInfo(options.id).then(res => {
console.log(res.data);
this.formData = res.data
})
}
}
}
</script>
<style lang="scss">
.contract-image{
width: 100%;
}
.contract-view{
margin-top: 180rpx;
text-align: center;
}
</style>

1
pages/driver/mine/my_evaluate/my_evaluate.vue
View File

@@ -53,7 +53,6 @@
},
//评价
queryList(pageNo, pageSize) {
// 此处请求仅为演示，请替换为自己项目中的请求
let obj = {
page: pageNo,
limit: pageSize,

185
pages/driver/mine/my_order/evaluate_order/evaluate_list.vue Normal file
View File

@@ -0,0 +1,185 @@
<template>
<view>
<z-paging ref="paging" v-model="dataList" @query="queryList">
<view>
<view v-for="(item,index) in dataList" :key="index">
<view class="evaluate-list">
<view style="margin-bottom: 24rpx;">{{item.comment}}</view>
<view class="flex-wrap align-center justify-between">
<image v-for="(imageUrl,imageIndex) in item.pics" :key="imageUrl" class="image-list"
:src="imageUrl" mode="" @click="examineFn(item.pics)">
</image>
<block v-if="item.pics.length%3-1>0">
<image v-for="(item2,index2) in (item.pics.length%3-1)<0?0:(item.pics.length%3-1)"
:key="item2" class="image-list"></image>
</block>
</view>
<view :class="['f-a-i','car-rental']">
<image :src="item.carInformation.image" mode=""></image>
<view class="car-rental-cont">
<view class="car-rental-cont-name">{{item.carInformation.title}}</view>
<view class="car-rental-cont-auto-age">车龄 {{item.carInformation.carAge}}年 | 租期
{{item.carInformation.monthRent}}年</view>
<view class="car-rental-cont-price">¥{{item.carRentalProduct.rentalPrice}}<text
class="car-rental-cont-price-tit">元/月</text>
</view>
</view>
</view>
<view class="f-jcsb">
<view class="f-a-i">
<u-rate :count="5" v-model="item.star" active-color="#F68D1F" gutter="2"
inactive-color="#b2b2b2"></u-rate>
<text>{{item.star}}.0分</text>
</view>
<view>
{{item.createTime}}
</view>
</view>
</view>
</view>
</view>
</z-paging>
</view>
</template>
<script>
import {
getInformationReplyList
} from "@/api/myOrder/index.js"
export default {
data() {
return {
dataList: [],
typeOne: 1,
carRentalProductId: '',
};
},
methods: {
//查看
examineFn(arr, index) {
uni.previewImage({
current: index,
urls: arr
})
},
//评价
queryList(pageNo, pageSize) {
let obj = {
page: pageNo,
limit: pageSize,
carRentalProductId: this.carRentalProductId
}
getInformationReplyList(obj).then(res => {
console.log(res.data.list);
this.$refs.paging.complete(res.data.list);
})
},
},
onLoad(options) {
this.typeOne = options.options
console.log(options);
this.carRentalProductId = options.id
}
}
</script>
<style lang="scss">
page {
background: #f5f5f5;
}
.car-rental {
width: calc(100%);
margin: 24rpx 0 24rpx 0;
padding: 24rpx;
border-bottom: 1rpx solid #eee;
background: #f5f5f5;
.car-rental-cont {
height: 150rpx;
width: calc(100% - 218rpx);
margin-left: 16rpx;
display: flex;
flex-direction: column;
justify-content: space-around;
.car-rental-cont-name {
font-size: 32rpx;
font-weight: 400;
color: #111111;
}
.car-rental-cont-price {
font-size: 32rpx;
font-weight: 500;
color: #111111;
}
.car-rental-cont-total-payment {
font-size: 24rpx;
font-weight: 400;
color: #666666;
}
}
image {
width: 202rpx;
height: 150rpx;
}
}
.evaluate-list {
background: #fff;
margin: 24rpx;
padding: 32rpx 24rpx;
border-radius: 8rpx;
.evaluate-list-shop {
padding: 24rpx;
background: #f5f5f5;
margin-top: 24rpx;
margin-bottom: 28rpx;
.evaluate-list-shop-name {
font-size: 32rpx;
font-weight: 400;
color: #111111;
}
.evaluate-list-shop-type {
font-size: 29rpx;
font-weight: 400;
color: #000000;
}
}
}
.image-list {
width: 202rpx;
height: 202rpx;
border-radius: 8rpx;
margin-bottom: 24rpx;
// margin-right: 24rpx;
}
.content {
width: 728rpx;
.image-box {
margin-right: 24rpx;
margin-bottom: 24rpx;
width: 202rpx;
height: 202rpx;
image {
width: 202rpx;
height: 202rpx;
border-radius: 8rpx;
}
}
}
.noMargin {
margin-right: 0;
}
</style>

293
pages/driver/mine/my_order/evaluate_order/evaluate_order.vue Normal file
View File

@@ -0,0 +1,293 @@
<template>
<view class="pushreview">
<view class="rev_all">
<view class="review">
<view class="f-a-i">
<text class="pingjia">评价 </text>
<u-rate :count="5" v-model="pushData.star" active-color="#F68D1F" inactive-color="#E4E4E4"
:allowHalf='true'></u-rate>
<view class="l_score" v-if="pushData.star"> {{pushData.star}}分 </view>
</view>
<u-textarea v-model="pushData.comment" placeholder="评价一下我们的服务怎么样吧~" count :maxlength='100' border='none'
height='150'></u-textarea>
<view class="up_down">
<view class="content flex-wrap align-center">
<view class="image-box rel" v-for="(item,index) in imageList" :key="index">
<image :src="item" mode=""></image>
<image @click="DelPic(index)" class="reduce abs" :src="clearIcon" mode=""></image>
</view>
<image :src="uploadIcon" mode="" @click="getImage"></image>
</view>
</view>
</view>
<view class="line_view"></view>
<view class="reviewbtn" @click="reviewSubmit">提 交</view>
</view>
</view>
</template>
<script>
import {
getInformationReply
} from "@/api/myOrder/index.js"
export default {
data() {
return {
uploadIcon: 'https://qicheoss.oss-cn-shanghai.aliyuncs.com/static/images/images/order_upLoadbg.png',
clearIcon: 'https://qicheoss.oss-cn-shanghai.aliyuncs.com/static/images/images/order_close.png',
orderObj: {},
pushData: {
comment: "",
id: null,
pics: [],
star: null
},
picObj: {
value: ''
},
reviewList: [],
isShowView: true, //控制myReview
imageList: [],
//订单id
orderId: "",
//订单编号
orderSn: ""
}
},
watch: {
value: {
handler(nV, oV) {
this.pushData.pics.push(nV)
},
deep: true,
}
},
onLoad(options) {
this.orderId = options.id
},
methods: {
async getReviewList() {
const review = await getReviewListAPI(this.reviewData)
this.reviewList = review.data.list
},
async reviewSubmit() {
this.pushData.pics = this.imageList
let obj={
pics:this.imageList,
id:this.orderId,
star:this.pushData.star,
comment:this.pushData.comment
}
getInformationReply(obj).then(res => {
uni.redirectTo({
url: `/pages/driver/mine/my_order/evaluate_order/review_x?evaluateData=${encodeURIComponent(JSON.stringify(obj))}`
});
})
},
//传图片
getImage() {
this.$util.uploadImageOne({
count: 9,
sizeType: ['original'],
sourceType: ['album', 'camera'],
dir: 'crmebimage/public/product/'
}, null, res => {
this.imageList.push(res.data)
this.videoOrImage = false
uni.hideLoading();
});
},
/**删除图片*/
DelPic(key) {
this.imageList.splice(key, 1)
},
confirm() {
this.$emit('confirm', this.imageList.join(','))
}
}
}
</script>
<style lang="scss" scoped>
.content {
padding: 32rpx 0 32rpx 0;
image {
width: 202rpx;
height: 202rpx;
border-radius: 8rpx;
}
}
.image-box {
position: relative;
margin: 8rpx;
.upload-bg {
width: 112rpx;
height: 112rpx;
border-radius: 8rpx;
}
.reduce {
position: absolute;
top: -10rpx;
right: -10rpx;
width: 40rpx;
height: 40rpx;
}
}
.form-item {
// width: 100%;
// border:1px solid red;
// display: flex;
// justify-content: flex-end;
.push_circle_black {
width: 40rpx;
height: 40rpx;
}
.fault-item {
padding: 16rpx 0;
border-bottom: 1rpx solid #f5f5f5;
line-height: 40rpx;
image {
width: 40rpx;
height: 40rpx;
}
}
}
.rev_all {
background: #FFFFFF;
height: 100vh;
}
.review {
// background: #FFFFFF;
border-radius: 8rpx;
padding: 32rpx 24rpx;
.up_up {
margin-bottom: 32rpx;
font-size: 38rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #000000;
}
.up_centre {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 48rpx;
.up_centre_l {
display: flex;
justify-content: space-between;
align-items: center;
.pingjia {
margin-right: 12rpx;
font-size: 32rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #111111;
}
.l_score {
margin-left: 8rpx;
font-size: 32rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 600;
color: #F68D1F;
}
}
}
.text_area {
margin-bottom: 56rpx;
}
.up_down {
.upload-bg {
width: 168rpx;
height: 168rpx;
}
}
}
.line_view {
height: 0rpx;
border-radius: 0rpx;
opacity: 0.3;
border: 1rpx solid #AAAAAA;
}
.review_foot {
// border: 1px solid red;
// background: #FFFFFF;
padding: 32rpx 24rpx;
margin-bottom: 100rpx;
.foot_up {
font-size: 32rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #000000;
margin-bottom: 24rpx;
}
.foot_down {
display: flex;
justify-content: space-between;
align-items: center;
padding: 24rpx;
background: #F5F5F5;
margin-bottom: 24rpx;
.foot_down_l {
font-size: 28rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #111111;
}
.foot_down_r {
font-size: 29rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #000000;
}
}
}
.reviewbtn {
// width: 702rpx;
height: 96rpx;
background: #13AFA8;
border-radius: 60rpx;
opacity: 1;
font-size: 34rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #FFFFFF;
text-align: center;
line-height: 94rpx;
margin-top: 150rpx;
}
.pushreview {
background-color: #F5F5F5;
height: 100vh;
padding: 16rpx 24rpx;
}
</style>

191
pages/driver/mine/my_order/evaluate_order/review_x.vue Normal file
View File

@@ -0,0 +1,191 @@
<template>
<view class="myreview">
<!-- 发布评价 => 提交 -->
<view class="componview">
<image class="com_img"
src="https://qicheoss.oss-cn-shanghai.aliyuncs.com/static/images/images/order_component.png" mode="">
</image>
</view>
<view class="review_down">
<view class="evaluate-list-header flex">
<image :src="userInfo.avatar" mode=""></image>
<view class="evaluate-list-header-cont">
<view class="flex justify-between">
<view class="f-28 c000">{{userInfo.nickname}}</view>
<view class="f-24 c999"> {{'暂无'}}</view>
</view>
<view class="flex align-center">
<u-rate :count="5" v-model="evaluateData.star" active-color="#F68D1F" gutter="2"
inactive-color="#b2b2b2"></u-rate>
<text>{{evaluateData.star}}.0分</text>
</view>
</view>
</view>
<view class="up_up">
<!-- 工作人员服务态度很好，维修的很仔细，休息室很干净，维修的很仔细。 -->
{{ evaluateData.comment }}
</view>
<!-- 判断是否有图 -->
<view class="flex-wrap align-center justify-between">
<image v-for="(item,index) in evaluateData.pics" :key="index" class="image-list" :src="item" mode="">
</image>
<block>
<view v-for="(item2,index2) in (evaluateData.pics.length%3-1)<0?0:(evaluateData.pics.length%3-1)"
:key="index2" class="image-list"></view>
</block>
</view>
</view>
</view>
</template>
<script>
import {
getCarOrderDetail
} from "@/api/myOrder/index.js"
import {
times
} from '@/uni_modules/uview-ui/libs/function/digit';
export default {
data() {
return {
count: 5,
reviewList: [],
isShowView: false,
timer: null,
evaluateData: {},
//用户信息
userInfo: {}
}
},
onLoad(options) {
this.evaluateData = JSON.parse(decodeURIComponent(options.evaluateData))
//用户信息
this.userInfo = uni.getStorageSync('userInfo')
},
onShow() {},
methods: {
},
// beforeDestroy
beforeDestroy() {
}
}
</script>
<style lang="scss" scoped>
.componview {
display: flex;
justify-content: center;
align-items: center;
.com_img {
width: 148rpx;
height: 148rpx;
margin: 48rpx 0 32rpx 0;
}
}
.review_img {
margin-bottom: 12rpx;
.re_img {
width: 200rpx;
height: 200rpx;
margin: 12rpx;
}
}
.review_down {
background: #FFFFFF;
border-radius: 8rpx;
padding: 32rpx 24rpx;
margin-bottom: 24rpx;
}
.up_up {
font-size: 28rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #000000;
margin-bottom: 24rpx;
}
.up_centre {
display: flex;
justify-content: space-between;
align-items: center;
padding: 24rpx;
background: #F5F5F5;
margin-bottom: 24rpx;
.up_cen_l {
font-size: 32rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #111111;
}
.up_cen_r {
font-size: 29rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #000000;
}
}
.up_down {
display: flex;
justify-content: space-between;
align-items: center;
.up_down_l {
display: flex;
justify-content: space-between;
align-items: center;
.l_score {
font-size: 28rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #111111;
margin-left: 8rpx;
}
}
.up_down_r {
font-size: 24rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 500;
color: #999999;
}
}
.myreview {
background-color: #F5F5F5;
height: 100vh;
padding: 16rpx 24rpx;
}
.image-list {
width: 202rpx;
height: 202rpx;
border-radius: 8rpx;
margin-bottom: 24rpx;
}
.evaluate-list-header {
margin-bottom: 32rpx;
.evaluate-list-header-cont {
width: calc(100% - 88rpx);
margin-left: 16rpx;
}
image {
width: 72rpx;
height: 72rpx;
border-radius: 50%;
}
}
</style>

1
pages/driver/mine/my_order/rentCars/in_advance.vue
View File

@@ -95,6 +95,7 @@
orderId:this.orderData.id,
giveCause:this.giveCause
}
console.log(obj,'啊山东快书');
getInformationGiveCar(obj).then(res=>{
uni.showToast({
title: '提交成功',

73
pages/driver/mine/my_order/rentCars/rent_order.vue
View File

@@ -7,7 +7,7 @@
@click="clickTabFn(tab)" :key="index">{{tab.name}}</view>
</view>
</view>
<view class="my-evaluate f-jcsb f-a-i" @click="navMyevaluateFn">
<view class="my-evaluate f-jcsb f-a-i" @click="navMyevaluateFn" v-if="actTab==3">
<view class="f-a-i">
<u-icon name="chat" color="#999" size="18"></u-icon>
我的评价
@@ -37,7 +37,7 @@
<image :src="item.image" mode=""></image>
<view class="car-rental-cont">
<view class="car-rental-cont-name">{{item.title}}</view>
<view class="car-rental-cont-auto-age">车龄 {{item.carAge}}年 | 租期 {{item.monthRent}}年</view>
<view class="car-rental-cont-auto-age">车龄 {{item.carAge}}年 | 租期 {{item.monthRent}}个月</view>
<view class="car-rental-cont-price">¥{{item.price}}<text
class="car-rental-cont-price-tit">元/月</text>
</view>
@@ -54,23 +54,30 @@
<view style="">去这里</view>
</view>
<view class="f-a-i">
<u-button v-if="item.status==3" type="primary" text="查看合同" plain color="#333333"
shape="circle" @click=""
:customStyle="{width:'160rpx',height:'56rpx',marginLeft: '16rpx'}"></u-button>
<u-button v-if="item.status==3" type="primary" text="去评价" plain color="#333333"
shape="circle" @click=""
:customStyle="{width:'160rpx',height:'56rpx',marginLeft: '16rpx'}"></u-button>
<u-button type="primary" text="联系客服" plain color="#333333" shape="circle" @click=""
:customStyle="{width:'160rpx',height:'56rpx',marginLeft: '16rpx'}"></u-button>
<view @click.stop="navInAdvanceFn(item)">
<u-button v-if="item.status==2" type="primary" text="提前还车" plain color="#333333"
shape="circle"
:customStyle="{width:'160rpx',height:'56rpx',marginLeft: '16rpx'}"></u-button>
:customStyle="buttStyle"></u-button>
<view v-if="item.status==3" @click.stop="examineContractFn(item)">
<u-button type="primary" text="查看合同" plain color="#333333" shape="circle"
:customStyle="buttStyle"></u-button>
</view>
<view v-if="item.status==3&&!item.isReply" @click.stop="navEvaluate(item)">
<u-button type="primary" text="去评价" plain color="#333333" shape="circle" @click=""
:customStyle="buttStyle"></u-button>
</view>
<view v-if="item.status==2" @click.stop="navInAdvanceFn(item)">
<u-button v-if="item.giveStatus==1" text="待审核" type="primary" plain color="#333333"
shape="circle" :customStyle="buttStyle">
</u-button>
<u-button v-else-if="item.giveStatus==2" text="审核通过" type="primary" plain
color="#333333" shape="circle" :customStyle="buttStyle">
</u-button>
<u-button v-else text="提前还车" type="primary" plain color="#333333" shape="circle"
:customStyle="buttStyle">
</u-button>
</view>
</view>
</view>
<view v-if="item.status==4" class="order-list-butt-refund">
<view v-if="item.refundStatus==3" class="order-list-butt-refund">
退款成功 退定金 ¥{{item.payPrice}}
</view>
</view>
@@ -85,7 +92,7 @@
tabsList4
} from "@/data/tabsData2.js"
import {
getInformationOrderList
getInformationOrderList,
} from "@/api/myOrder/index.js"
import config from '@/config';
export default {
@@ -95,19 +102,40 @@
tabsList4,
actTab: -1,
dataList: [],
buttStyle: {
width: '160rpx',
height: '56rpx',
marginLeft: '16rpx'
}
};
},
methods: {
//去评价 pages/driver/mine/my_evaluate/evaluate_issue
navEvaluate(item) {
console.log(item);
uni.navigateTo({
url: `/pages/driver/mine/my_order/evaluate_order/evaluate_order?id=${item.id}`
})
},
//查看合同 pages/carShop/order/examine_contract/examine_contract
examineContractFn(item) {
uni.navigateTo({
url: `/pages/carShop/order/examine_contract/examine_contract?id=${item.id}&type=1`
})
},
//提前还车
navInAdvanceFn(item) {
uni.navigateTo({
url: `/pages/driver/mine/my_order/rentCars/in_advance?id=${item.id}`
})
if (item.giveStatus != 2 && item.giveStatus != 1) {
uni.navigateTo({
url: `/pages/driver/mine/my_order/rentCars/in_advance?id=${item.id}`
})
}
},
//我的评价
navMyevaluateFn() {
console.log('我的评价');
uni.navigateTo({
url: '/pages/driver/mine/my_evaluate/my_evaluate'
url: '/pages/driver/mine/my_order/evaluate_order/evaluate_list'
})
},
//详情
@@ -132,6 +160,11 @@
this.$refs.paging.complete(res.data.list);
})
},
},
onShow() {
if (this.$refs.paging) {
this.$refs.paging.refresh();
}
}
}
</script>

79
pages/driver/mine/my_order/rentCars/rent_particulars.vue
View File

@@ -3,80 +3,88 @@
<u-navbar title="" safeAreaInsetTop placeholder>
<view class="u-nav-slot f-a-i" slot="left">
<u-icon name="arrow-left" size="19"></u-icon>
<view class="state">代付款</view>
<view class="state">
<text v-if="orderData.status==0">待支付</text>
<text v-if="orderData.status==1">未提车</text>
<text v-if="orderData.status==2">租赁期</text>
<text v-if="orderData.status==3">已还车</text>
<text v-if="orderData.status==4">已取消</text>
</view>
</view>
</u-navbar>
<view class="cont car-info flex">
<view class="car-info-cont">
<view class="car-info-cont-name">
汽车标题
{{orderData.title}}
</view>
<view class="car-info-cont-label">
<view class="f-a-i" v-for="(item,index) in 7">
<text>BYD</text>
<u-line v-if="index!=7-1" direction="col" length="10" margin="0 12rpx"></u-line>
<view class="f-a-i" v-for="(item,index) in orderData.tags" :key="index">
<text>{{item.name}}</text>
<u-line v-if="index!=orderData.tags-1" direction="col" length="10" margin="0 12rpx"></u-line>
</view>
</view>
</view>
<view class="">
<image src="@/static/images/app/serve/serve_zuche.png" mode=""></image>
<image :src="orderData.image" mode=""></image>
</view>
</view>
<view class="title">租赁信息</view>
<view class="buy-info">
<view class="f-jcsb cont-list">
<view>车主姓名</view>
<view>张春</view>
<view>{{orderData.realName}}</view>
</view>
<view class="f-jcsb cont-list cont-ma48">
<view>身份证</view>
<view>266625116728899065</view>
<view>{{orderData.idCard}}</view>
</view>
<view class="f-jcsb cont-list cont-ma48">
<view>手机号码</view>
<view>13566568926</view>
<view>{{orderData.phone}}</view>
</view>
</view>
<view class="title">费用及时间</view>
<view class="buy-info">
<view class="f-jcsb cont-list">
<view>租赁费用</view>
<view>¥320,000</view>
<view>¥{{orderData.price}}</view>
</view>
<view class="f-jcsb cont-list cont-ma48">
<view>租赁期限</view>
<view>6个月</view>
<view>{{orderData.monthRent}}个月</view>
</view>
<view class="f-jcsb cont-list cont-ma48">
<view>优惠抵扣</view>
<view>-￥200</view>
<view>-￥{{orderData.couponPrice?orderData.couponPrice:0}}</view>
</view>
<view class="f-jcsb cont-list cont-ma48">
<view>实付押金</view>
<view>¥2,800.00</view>
<view>¥{{orderData.payPrice}}</view>
</view>
<view class="f-jcsb cont-list cont-ma48">
<view>租赁期限</view>
<view>2023-10-01指2023-10-10</view>
<view>{{orderData.takeTime}}~{{orderData.giveTime}}</view>
</view>
<view class="f-jcsb cont-list cont-ma48">
<view>下单时间</view>
<view>2023-10-10 12:01:32</view>
<view>{{orderData.takeTime}}</view>
</view>
<view class="f-jcsb cont-list cont-ma48">
<view>提车时间</view>
<view>2023-10-10 12:01:32</view>
<view>{{orderData.takeTime}}</view>
</view>
</view>
<view class="bottom-butt-caozuo f-jce">
<view class="flex">
<u-button type="primary" text="取消订单" plain color="#333333" shape="circle" @click=""
:customStyle="{width:'192rpx',height:'80rpx',marginLeft: '24rpx'}"></u-button>
<u-button type="primary" text="联系客服" plain color="#333333" shape="circle" @click=""
:customStyle="{width:'192rpx',height:'80rpx',marginLeft: '24rpx',}"></u-button>
<u-button type="primary" text="查看合同" plain color="#333333" shape="circle" @click=""
<u-button v-if="orderData.status==0" type="primary" text="取消订单" plain color="#333333" shape="circle"
@click="getInformationCancelFn"
:customStyle="{width:'192rpx',height:'80rpx',marginLeft: '24rpx'}"></u-button>
<u-button type="primary" text="提前还车" color="#13AFA8" shape="circle" @click="navInAdvanceFn"
<u-button v-if="orderData.status==3" type="primary" text="查看合同" plain color="#333333" shape="circle"
@click="" :customStyle="{width:'192rpx',height:'80rpx',marginLeft: '24rpx'}"></u-button>
<u-button v-if="orderData.status==2&&orderData.giveStatus==0" type="primary" text="提前还车" color="#13AFA8"
shape="circle" @click="navInAdvanceFn"
:customStyle="{width:'192rpx',height:'80rpx',marginLeft: '24rpx'}"></u-button>
</view>
</view>
@@ -84,20 +92,43 @@
</template>
<script>
import {
getInformationOrderDealer,
getInformationCancel
} from "@/api/myOrder/index.js"
export default {
data() {
return {}
return {
orderData: {},
orderId: ''
}
},
methods: {
//取消订单
getInformationCancelFn() {
getInformationCancel(this.orderId).then(res => {
// this.orderData = res.data
this.getInformationOrderDealerFn()
})
},
//提前还车
navInAdvanceFn(){
navInAdvanceFn() {
uni.navigateTo({
url:'/pages/driver/mine/my_order/rentCars/in_advance'
url: `/pages/driver/mine/my_order/rentCars/in_advance?id=${this.orderId}&type==1`
})
},
getInformationOrderDealerFn() {
getInformationOrderDealer(this.orderId).then(res => {
this.orderData = res.data
})
}
},
onLoad(options) {
}
this.orderId = options.id
getInformationOrderDealer(options.id).then(res => {
this.orderData = res.data
})
},
}
</script>

313
pages/driver/showroom/carList/carList.vue
View File

@@ -1,11 +1,11 @@
<template>
<view>
<u-navbar placeholder>
<view class="back-icon" slot="left" @click="$tab.navigateBack()">
<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" >
比亚迪
<view class="brand-name flex align-center justify-between" slot="left" @click="brandShow=true">
{{brandName}}
<u-icon name="arrow-down-fill" size="10" color="#000"></u-icon>
</view>
</u-navbar>
@@ -16,56 +16,61 @@
</view>
<view class="select-content">
<view class="content-box">
<view :class="['content-item', powerId == index && 'active-item']" @click="powerId = index" v-for="(item,index) in 6" :key="index">
纯动力
<view :class="['content-item', powerId == item.value && 'active-item']"
@click="powerFn(item.value)" v-for="(item) in carPowerList" :key="item.value">
{{item.name}}
</view>
</view>
</view>
</view>
<view class="power flex align-center justify-between">
<view class="title">
车型
型号
</view>
<view class="select-content">
<view class="content-box">
<view :class="['content-item', powerId == index && 'active-item']" @click="powerId = index" v-for="(item,index) in 6" :key="index">
轿车
<view :class="['content-item', modelId == item.id && 'active-item']" @click="modelFn(item.id)"
v-for="(item) in modelList" :key="item.id">
{{item.name}}
</view>
</view>
</view>
</view>
<view class="power flex align-center justify-between" v-show="type == 0">
<view class="power flex align-center justify-between" v-show="type == 2">
<view class="title">
车龄
</view>
<view class="select-content">
<view class="content-box">
<view :class="['content-item', powerId == index && 'active-item']" @click="powerId = index" v-for="(item,index) in 6" :key="index">
1年内
<view :class="['content-item', carAgeId == item.value && 'active-item']"
@click="carAgeFn(item.value)" v-for="(item) in carAgeList" :key="item.value">
{{item.name}}
</view>
</view>
</view>
</view>
<view class="power flex align-center justify-between" v-show="type==0">
<view class="power flex align-center justify-between" v-show="type==2">
<view class="title">
租期
</view>
<view class="select-content">
<view class="content-box">
<view :class="['content-item', powerId == index && 'active-item']" @click="powerId = index" v-for="(item,index) in 6" :key="index">
3个月
<view :class="['content-item', tenancyId == item.value && 'active-item']"
@click="tenancyFn(item.value)" v-for="(item) in carTenancyList" :key="item.value">
{{item.name}}
</view>
</view>
</view>
</view>
<view class="power flex align-center justify-between" v-show="type==1 || type == 2">
<view class="power flex align-center justify-between" v-show="type==0 || type == 1">
<view class="title">
价格
</view>
<view class="select-content">
<view class="content-box">
<view :class="['content-item', powerId == index && 'active-item']" @click="powerId = index" v-for="(item,index) in 6" :key="index">
10-15万
<view :class="['content-item', priceId == item.value && 'active-item']"
@click="priceFn(item.value) " v-for="(item) in carPriceList" :key="item.value">
{{item.name}}
</view>
</view>
</view>
@@ -81,16 +86,35 @@
<u-icon name="arrow-right" size="8" color="#999999"></u-icon>
</view>
</view>
<view class="car-item flex align-center" v-for="(item,index) in 10" @click="link(item)">
<image class="car-image" src="@/static/images/logo/logo.jpg" mode=""></image>
<view class="car-info">
<view class="car-title flex align-center">
汽车标题
<view class="content">
<z-paging use-page-scroll ref="paging" v-model="carList" @query="queryList">
<view class="car-info flex align-center" v-for="(item,index) in carList" @click="link(item)">
<image v-if="type==2" :src="item.image" mode=""></image>
<image v-else :src="item.mainImage" mode=""></image>
<view class="info" v-if="type==2">
<view class="name">{{item.title}}</view>
<view class="time">
车龄 {{item.carAge}}年 | 租期 {{item.monthRent}}个月
</view>
<view class="price">{{item.minGuidePrice}}~{{item.maxGuidePrice}}元<text class="one">/月
</text>
</view>
</view>
<view class="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">
<text>月供：</text>
<text class="f-32 c111 price">{{item.monthTributePrice}}元 </text>
<text class="ml-2"> x {{item.monthTribute}}</text> 期
</view>
<view v-if="type==1" class="f-24 c666">
<text>月租：</text>
<text class="f-32 c111 price">{{item.monthRentPrice}}元 </text>
<text class="ml-2"> x {{item.monthRent}}</text> 期
</view>
</view>
</view>
<view class="car-price flex align-center">
月供：<text class="num">1200元</text> x24期
</view>
</view>
</z-paging>
</view>
</view>
<u-popup :show="storeShow" round="16" closeable @close="storeShow = false">
@@ -111,27 +135,134 @@
</view>
</view>
</u-popup>
<u-picker :show="brandShow" :columns="brandList" keyName="name" @cancel="brandShow=false"
@confirm="brandConfirm"></u-picker>
</view>
</template>
<script>
import {
carPowerList,
carTenancyList,
carPriceList,
carAgeList
} from "@/data/carConfigTabList.js"
import {
modelBrandList
} from '@/api/system/config';
import {
getProductList,
getInformationList
} from "@/api/showroom/showroom.js"
export default {
data() {
return {
//品牌
brandList: [],
brandShow: false,
brandName: '全部',
//型号
modelList: [],
modelId: -1,
//动力
carPowerList,
powerId: -1,
//车龄
carAgeList,
carAgeId: -1,
//租期
carTenancyList,
tenancyId: -1,
//金额
carPriceList,
priceId: -1,
//商家
storeShow: false,
type: 0
type: 0,
carList: []
};
},
onLoad(option) {
console.log(option);
this.type = option.type
this.brandId = option.brandId
//获取品牌列表
modelBrandList().then(res => {
console.log(res.data);
this.brandList = [res.data]
res.data.forEach(item => {
if (this.brandId == item.id) {
this.brandName = item.name
this.brandId = item.id
this.modelList = item.carModelList
}
})
})
},
methods: {
link(item) {
if(this.type == 0) {
this.$tab.navigateTo(`../carRental/index`)
//动力
powerFn(value) {
this.powerId = value
this.$refs.paging.reload()
},
//型号
modelFn(value) {
this.modelId = value
this.$refs.paging.reload()
},
//车龄
carAgeFn(value) {
this.carAgeId = value
this.$refs.paging.reload()
},
//租期
tenancyFn(value) {
this.tenancyId = value
this.$refs.paging.reload()
},
//价格
priceFn(value) {
this.priceId = value
this.$refs.paging.reload()
},
//列表
queryList(page, limit) {
let obj = {
page: page,
limit: limit,
brandId: this.brandId,
type: this.type,
modelId: this.modelId,
powerType: this.powerId,
priceType: this.priceId,
monthRent:this.tenancyId,
carAge:this.carAgeId
}
console.log(obj);
if (this.type == 2) {
getInformationList(obj).then(res => {
this.$refs.paging.complete(res.data.list);
})
} else {
this.$tab.navigateTo(`../carBuy/index`)
getProductList(obj).then(res => {
this.$refs.paging.complete(res.data.list);
})
}
},
//选择品牌
brandConfirm(e) {
console.log(e);
this.brandShow = false
this.brandName = e.value[0].name
this.brandId = e.value[0].id
this.modelList = e.value[0].carModelList
this.$refs.paging.reload()
},
link(item) {
if (this.type == 2) {
this.$tab.navigateTo(`../carRental/index?id=${item.id}`)
} else {
this.$tab.navigateTo(`../carBuy/index?id=${item.id}&type=${this.type}`)
}
}
}
@@ -142,18 +273,22 @@
.back-icon {
margin-right: 28rpx;
}
.brand-name {
width: 140rpx;
width: 180rpx;
font-size: 36rpx;
font-weight: bold;
color: #000000;
line-height: 36rpx;
}
.tabs-box {
padding: 24rpx;
width: 750rpx;
.power {
margin-bottom: 16rpx;
.title {
margin-right: 24rpx;
width: 116rpx;
@@ -165,6 +300,7 @@
line-height: 52rpx;
text-align: center;
}
.select-content {
display: flex;
align-items: center;
@@ -172,10 +308,12 @@
width: 586rpx;
height: 52rpx;
overflow-x: auto;
.content-box {
display: flex;
align-items: center;
height: 52rpx;
.content-item {
margin-right: 24rpx;
width: 162rpx;
@@ -187,20 +325,23 @@
line-height: 52rpx;
text-align: center;
}
.active-item {
background-color: #13AFA8;
color: #fff;
}
}
}
}
}
.car-list-content {
padding: 0 24rpx;
width: 750rpx;
border-radius: 16rpx 16rpx 0 0;
background-color: #F5F5F5;
.car-list-title {
.left {
font-size: 24rpx;
@@ -209,6 +350,7 @@
color: #999999;
line-height: 88rpx;
}
.right-btn {
font-size: 28rpx;
font-family: PingFang SC, PingFang SC;
@@ -217,46 +359,8 @@
line-height: 40rpx;
}
}
.car-item {
margin-bottom: 24rpx;
padding: 24rpx;
width: 710rpx;
background: #FFFFFF;
border-radius: 8rpx;
.car-image {
width: 202rpx;
height: 150rpx;
border-radius: 4rpx;
}
.car-info {
margin-left: 24rpx;
height: 150rpx;
.car-title {
height: 75rpx;
font-size: 32rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #111111;
line-height: 44rpx;
}
.car-price {
height: 75rpx;
font-size: 24rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
color: #666666;
line-height: 38rpx;
.num {
margin-right: 16rpx;
font-size: 32rpx;
font-weight: bold;
color: #111111;
line-height: 38rpx;
}
}
}
}
}
.popup-box {
.popup-title {
width: 750rpx;
@@ -269,12 +373,15 @@
line-height: 128rpx;
text-align: center;
}
.popup-select-box {
width: 750rpx;
height: 552rpx;
overflow-y: auto;
.store-list {
padding: 32rpx 0;
.store-list-item {
margin-bottom: 24rpx;
margin-left: 24rpx;
@@ -284,6 +391,7 @@
background-color: #f5f5f5;
font-size: 28rpx;
color: #111111;
.checked {
bottom: 0;
right: 0;
@@ -293,10 +401,69 @@
}
}
}
.popup-btn {
padding: 16rpx 24rpx;
width: 750rpx;
height: 166rpx;
}
}
</style>
.content {
margin: 0 auto;
padding: 0 24rpx;
padding-bottom: 24rpx;
width: 702rpx;
background-color: #FFFFFF;
border-radius: 0 0 16rpx 16rpx;
z-index: 0;
.car-info {
padding: 24rpx 0;
border-bottom: 1rpx solid #ededed;
}
.name {
font-size: 32rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #111111;
line-height: 44rpx;
}
.price {
margin-top: 12rpx;
font-size: 32rpx;
font-family: Roboto, Roboto;
font-weight: 500;
color: #111111;
line-height: 38rpx;
.one {
font-size: 24rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
color: #666666;
line-height: 36rpx;
}
}
.info {
.time {
margin-top: 8rpx;
font-size: 26rpx;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
color: #666666;
line-height: 36rpx;
}
}
image {
margin-right: 16rpx;
width: 202rpx;
height: 150rpx;
}
}
</style>

307
pages/driver/showroom/carRental/index.vue
View File

@@ -44,43 +44,49 @@
</view>
</view>
<view class="flex align-center shop-price">
{{commodityDeta.carDrive}} | {{commodityDeta.modelName}} |{{commodityDeta.powerType==1?'油电':commodityDeta.powerType==2?'油':'纯电'}}
{{commodityDeta.carDrive}} | {{commodityDeta.modelName}}
|{{commodityDeta.powerType==1?'油电':commodityDeta.powerType==2?'油':'纯电'}}
</view>
</view>
<view v-if=""></view>
<view class="store-list" v-for="(item,index) in commodityDeta.carRentalProduct">
<view class="store-item">
<view class="store-title-box flex align-center justify-between">
<view class="store-title flex align-center">
{{item.carDealerName}}
<u-icon name="arrow-right" size="12"></u-icon>
<z-paging use-page-scroll ref="paging" v-model="carList" @query="queryList">
<view class="store-list" v-for="(item,index) in carList">
<view class="store-item">
<view class="store-title-box flex align-center justify-between">
<view class="store-title flex align-center">
{{item.carDealerName}}
<u-icon name="arrow-right" size="12"></u-icon>
</view>
<view class="flex align-center">
<text
class="star">{{item.countResponse.replyChance?item.countResponse.replyChance:5.0}}</text>
<text class="reply">{{item.countResponse.sumCount}}条评论</text>
</view>
</view>
<view class="flex align-center">
<text class="star">5.0</text>
<text class="reply">236条评论</text>
<view class="store-tags">
<text v-for="tag in item.tags">{{tag.name}}</text>
<!-- <text v-for="(item, index) in 3">2年车龄</text> -->
</view>
</view>
<view class="store-tags">
<text>{{item.tagId}}</text>
<!-- <text v-for="(item, index) in 3">2年车龄</text> -->
</view>
<view class="store-info">
优惠政策/优惠活动/纯文字展示
</view>
<view class="store-btns flex align-center justify-between">
<view class="store-btns-left">
<text class="price">{{item.rentalPrice}}</text>
<text>/月</text>
<view class="store-info">
优惠政策/优惠活动/纯文字展示
</view>
<view class="store-tags-right flex align-center">
<text>租期 {{item.monthRent}}个月</text>
<view class="btn-item">
<u-button @click="promptlyCarFn(item)" :customStyle="{width: '152rpx', height: '60rpx', fontSize: '28rpx', padding: 0}" color="#13AFA8" shape="circle">立即订车</u-button>
<view class="store-btns flex align-center justify-between">
<view class="store-btns-left">
<text class="price">{{item.rentalPrice}}</text>
<text>/月</text>
</view>
<view class="store-tags-right flex align-center">
<text>租期 {{item.monthRent}}个月</text>
<view class="btn-item">
<u-button @click="promptlyCarFn(item)"
:customStyle="{width: '152rpx', height: '60rpx', fontSize: '28rpx', padding: 0}"
color="#13AFA8" shape="circle">立即订车</u-button>
</view>
</view>
</view>
</view>
</view>
</view>
</z-paging>
<!-- 规格选择 -->
<u-popup :show="parameterShow" round="16" @close="parameterShow = false" closeable>
<view class="popup-box">
@@ -149,28 +155,16 @@
<view class="popup-box">
<view :class="['popup-title', 'rel', scrollState && 'popup-title-active']">
{{carDealerData.title}}
<image @click="closeStorePopup" v-if="scrollState" class="abs" src="@/static/images/icon/x_3.png" mode=""></image>
<image @click="closeStorePopup" v-if="scrollState" class="abs" src="@/static/images/icon/x_3.png"
mode=""></image>
</view>
<view class="popup-tabs-box">
<u-tabs
lineColor="#555"
lineHeight="4rpx"
lineWidth="58rpx"
:scrollable="false"
:activeStyle="{color: '#000'}"
:itemStyle="{height: '60rpx'}"
:list="storeInfoTabs"
<u-tabs lineColor="#555" lineHeight="4rpx" lineWidth="58rpx" :scrollable="false"
:activeStyle="{color: '#000'}" :itemStyle="{height: '60rpx'}" :list="storeInfoTabs"
@click="tabChange"></u-tabs>
</view>
<scroll-view
scroll-y
scroll-with-animation
class="scroll-view"
:style="`height: calc(${scrollHeight})`"
upper-threshold="0"
@scroll="scrollView"
@scrolltoupper="scrolltoupper"
:scroll-into-view="viewId">
<scroll-view scroll-y scroll-with-animation class="scroll-view" :style="`height: calc(${scrollHeight})`"
upper-threshold="0" @scroll="scrollView" @scrolltoupper="scrolltoupper" :scroll-into-view="viewId">
<view class="comment-scroll-box">
<view class="popup-car-list" id="detail">
<view class="popup-car-title">
@@ -181,8 +175,8 @@
</view>
<view class="popup-car-box">
<view class="car-list">
<view class="car-item" v-for="(item, index) in 6" :key="index">
<image src="@/static/htz-image-upload/play.png" mode=""></image>
<view class="car-item" v-for="(item, index) in branner" :key="index">
<image :src="item" mode=""></image>
</view>
</view>
</view>
@@ -191,39 +185,43 @@
<view class="comment-title flex align-center justify-between">
<view class="">
<text>用户评价</text>
<text class="num">4.86分</text>
<text class="num">{{carDealerData.countResponse.replyChance}}分</text>
</view>
<view class="comrel flex align-center">
评价(206)
<view class="comrel flex align-center" @click="navEvaluateFn(carDealerData)">
评价({{carDealerData.countResponse.sumCount}})
<u-icon name="arrow-right" size="12" color="#999999"></u-icon>
</view>
</view>
<view class="comment-content-item">
<view class="user-info flex align-center justify-between">
<view class="right flex align-center">
<image src="@/static/images/logo/logo.png" mode=""></image>
<image :src="carDealerData.replyResponse.avatar" mode=""></image>
<view class="user-detail flex-column justify-between">
<view class="name">
陈客户
{{carDealerData.replyResponse.nickname}}
</view>
<view class="flex align-center">
<view class="flex align-center">
<u-icon v-for="(item, index) in 5" name="star-fill" :color="value>index ? '#F68D1F' : '#D9D9D9'"></u-icon>
<u-icon v-for="(item, index) in carDealerData.replyResponse.star"
name="star-fill"
:color="carDealerData.replyResponse.star>index ? '#F68D1F' : '#D9D9D9'"></u-icon>
</view>
<!-- <u-rate disabled activeColor="#F68D1F" inactiveColor="#D9D9D9" :count="count" v-model="value"></u-rate> -->
<text class="fen">{{value.toFixed(1)}}</text>
<text class="fen">{{carDealerData.replyResponse.star}}</text>
</view>
</view>
</view>
<view class="">
2023/02/08
{{carDealerData.replyResponse.createTime}}
</view>
</view>
<view class="comment-text">
工作人员服务态度很好，维修的很仔细，休息室很干净，维修的很仔细。
{{carDealerData.replyResponse.comment}}
</view>
<view class="comment-image flex-wrap align-center">
<image :style="index%3==2&&'marginRight: 0'" v-for="(item, index) in 5" :key="index" src="@/static/htz-image-upload/play.png" mode=""></image>
<image :style="index%3==2&&'marginRight: 0'"
v-for="(item, index) in carDealerData.replyResponse.pics" :key="index"
:src="item" mode=""></image>
</view>
</view>
</view>
@@ -236,8 +234,11 @@
订车规则
</view>
<view class="">
<image class="guize" src="@/static/images/app/welfare/invite_btn.png" mode=""></image>
<image class="guize" src="@/static/images/app/welfare/invite_btn.png" mode=""></image>
<image v-for="(rules,index) in carDealerData.rulesImage" class="guize" :src="rules"
:key="index" mode="" @click="examineFn(carDealerData.rulesImage,index)">
</image>
<!-- <image class="guize" src="@/static/images/app/welfare/invite_btn.png" mode="">
</image> -->
</view>
</view>
<view class="popup-read-content">
@@ -245,7 +246,8 @@
订车流程
</view>
<view class="read-images flex align-center justify-between">
<image v-for="(item, index) in 4" :key="index" class="liucheng" src="@/static/images/app/mine/pay.png" mode=""></image>
<image v-for="(process, index) in carDealerData.processImage" :key="index"
class="liucheng" :src="process" mode="" @click="examineFn(carDealerData.rulesImage,index)"></image>
</view>
</view>
</view>
@@ -256,13 +258,17 @@
<view class="popup-read-content">
<view class="problem-tabs">
<view class="problem-tabs-box flex align-center">
<text :class="['problem-tabs-item', categoryId == index && 'problem-active-item']" @click="categoryId = index" v-for="(item,index) in problemType" :key="index">
<text
:class="['problem-tabs-item', categoryId == index && 'problem-active-item']"
@click="categoryId = index" v-for="(item,index) in problemType"
:key="index">
{{item}}
</text>
</view>
</view>
<view class="">
<image class="problem-image" src="@/static/images/app/mine/gold_bg.png" mode="widthFix"></image>
<image class="problem-image" src="@/static/images/app/mine/gold_bg.png"
mode="widthFix"></image>
</view>
</view>
</view>
@@ -271,7 +277,8 @@
<view class="comment-btns fixed-bottom">
<view class="comment-btn flex align-center justify-between">
<view class="contact-icon flex align-center">
<image @click="phoneShow = true" src="@/static/images/app/icon/phone.png" mode="heightFix"></image>
<image @click="phoneShow = true" src="@/static/images/app/icon/phone.png" mode="heightFix">
</image>
<image src="@/static/images/app/icon/message.png" mode="heightFix"></image>
</view>
<view class="right-btn flex align-center">
@@ -284,7 +291,9 @@
</view>
</view>
<view class="right-btn-box">
<u-button @click="navEndOrderFn" :customStyle="{width: '232rpx', height: '96rpx', fontSize: '34rpx',marign:0}" color="#333333" shape="circle" >立即订车</u-button>
<u-button @click="navEndOrderFn"
:customStyle="{width: '232rpx', height: '96rpx', fontSize: '34rpx',marign:0}"
color="#333333" shape="circle">立即订车</u-button>
</view>
</view>
</view>
@@ -307,12 +316,18 @@
</template>
<script>
import { storeInfoTabs } from '@/data/tabsData'
import {getProductInfoDealer } from "@/api/showroom/showroom.js"
import {getInformationInfo } from "@/api/carShop/car/car.js"
import {
storeInfoTabs
} from '@/data/tabsData'
import {
getProductInfoDealer,
informationDealerList,
getInformationInfo
} from "@/api/showroom/showroom.js"
export default {
data() {
return {
carList: [],
//规格弹出
parameterShow: false,
storeShow: false,
@@ -324,7 +339,7 @@
categoryId: 0,
viewId: 'detail',
scrollHeight: '1052rpx',
storeInfoTabs, // 弹窗tab栏
storeInfoTabs, // 弹窗tab栏
problemType: ['换车', '押金', '租金', '类目名', '类目名', '类目名'],
config: getApp().globalData.config,
//商品详情
@@ -336,35 +351,73 @@
actArr: [],
specTabArr: [],
//车商商品信息
carDealerData:{}
carDealerData: {
countResponse: {},
replyResponse: {}
},
//订单id
orderId: ''
};
},
methods: {
//查看
examineFn(arr,index){
uni.previewImage({
current:index,
urls:arr
})
},
//车商发布列表
//请求列表
queryList(page, limit) {
informationDealerList({
page: page,
limit: limit,
id: this.orderId
}).then(res => {
// console.log(res.data.carRentalProduct);
this.$refs.paging.complete(res.data.carRentalProduct);
this.commodityDeta = res.data
this.branner = res.data.sliderImage.split(',')
})
},
//确认订单 pages/driver/showroom/confirmOrder/confirmOrder
navEndOrderFn() {
this.$store.dispatch('Cardmoney',null)
this.$store.dispatch('Cardmoney', null)
uni.navigateTo({
url: `/pages/driver/showroom/confirmOrder/confirmOrder?type=2`,
success:res=>{
// 通过eventChannel向被打开页面传送数据
res.eventChannel.emit('form', {...this.carDealerData})
success: res => {
// 通过eventChannel向被打开页面传送数据
res.eventChannel.emit('form', {
...this.carDealerData
})
}
})
},
//立即订车 获取详情
promptlyCarFn(item){
promptlyCarFn(item) {
this.storeShow = true;
getInformationInfo(item.id).then(res=>{
this.carDealerData=res.data
this.carDealerData.depositMoney=item.depositMoney
getInformationInfo(item.id).then(res => {
console.log(res.data);
this.carDealerData = res.data
this.carDealerData.depositMoney = item.depositMoney
console.log(this.carDealerData.replyResponse);
console.log(res.data.rulesImage.split(','));
console.log(res.data.processImage.split(','));
//订车规则
this.carDealerData.rulesImage = res.data.rulesImage.split(',')
//订车流程
this.carDealerData.processImage = res.data.processImage.split(',')
if (res.data.replyResponse.pics) {
this.carDealerData.replyResponse.pics = this.carDealerData.replyResponse.pics.split(',')
}
})
},
//拨打电话
callPhone(e) {
uni.makePhoneCall({
phoneNumber: e,
fail: (err) => {
}
fail: (err) => {}
})
},
closeStorePopup() {
@@ -385,13 +438,13 @@
},
scrollView(e) {
// console.log(this.scrollTop<e.detail.scrollTop);
if(this.scrollTop<e.detail.scrollTop) {
if (this.scrollTop < e.detail.scrollTop) {
this.scrollHeight = '100vh - 188rpx'
this.scrollState = true
}
this.scrollTop = e.detail.scrollTop
},
//立即购买
buyImmediatelyFn() {
this.specificationShow = true
@@ -436,10 +489,17 @@
getIntegralOrderProduct(this.commodityDeta.id).then(res => {
this.getProductInfoDealerFn(this.commodityDeta.id)
})
}
},
//去评论列表
navEvaluateFn(item){
uni.navigateTo({
url: `/pages/driver/mine/my_order/evaluate_order/evaluate_list?id=${item.id}`
})
},
},
onLoad(options) {
this.getProductInfoDealerFn(options.id)
this.orderId = options.id
// this.getProductInfoDealerFn(options.id)
},
onShow() {},
}
@@ -462,9 +522,11 @@
.info-introduce {
padding: 40rpx 24rpx 32rpx 24rpx;
background: #FFFFFF;
.title-info {
width: 572rpx;
}
.btns-box {
height: 49rpx;
font-size: 24rpx;
@@ -473,6 +535,7 @@
color: #999999;
line-height: 36rpx;
}
.shop-price {
font-size: 28rpx;
font-family: PingFang SC, PingFang SC;
@@ -481,34 +544,40 @@
margin-top: 32rpx;
}
}
.store-list {
padding: 24rpx;
.store-item {
padding: 24rpx;
width: 702rpx;
background: #FFFFFF;
border-radius: 8rpx;
.store-title-box {
.store-title {
font-size: 32rpx;
color: #111111;
line-height: 44rpx;
}
.star {
margin-right: 12rpx;
font-size: 32rpx;
font-weight: bold;
color: #13AFA8;
}
.reply {
font-size: 24rpx;
color: #666666;
}
}
.store-tags {
marign-top: 12rpx;
text {
margin-right: 16rpx;
padding: 0 16rpx;
@@ -516,17 +585,21 @@
line-height: 42rpx;
}
}
.store-info {
margin-top: 24rpx;
font-size: 28rpx;
color: #666666;
}
.store-btns {
margin-top: 24rpx;
.store-btns-left {
font-size: 24rpx;
color: #666666;
line-height: 28rpx;
.price {
font-size: 32rpx;
font-family: Roboto, Roboto;
@@ -534,9 +607,11 @@
color: #F20808;
}
}
.store-tags-right {
font-size: 24rpx;
color: #999999;
.btn-item {
margin-left: 16rpx;
}
@@ -544,6 +619,7 @@
}
}
}
.u-nav-slot {
width: 174rpx;
height: 64rpx;
@@ -584,6 +660,7 @@
font-size: 12px;
}
}
.popup-box {
.popup-title {
font-size: 30rpx;
@@ -591,6 +668,7 @@
color: #222222;
line-height: 128rpx;
text-align: center;
image {
top: 50%;
left: 16rpx;
@@ -598,32 +676,40 @@
height: 48rpx;
}
}
.popup-title-active {
padding-top: 62rpx;
line-height: 66rpx;
}
.popup-tabs-box {
border-bottom: 1rpx solid #ededed;
}
.scroll-view {
height: 1052rpx;
transition: height 0.5s;
}
.comment-scroll-box {
// overflow-y: auto;
background-color: #F5F5F5;
padding-bottom: 220rpx;
}
.popup-car-list {
padding: 24rpx 0 24rpx 24rpx;
background-color: #fff;
background-color: #fff;
.popup-car-title {
font-size: 36rpx;
color: #111111;
line-height: 50rpx;
}
.popup-tags-list {
margin-top: 16rpx;
text {
margin-right: 16rpx;
padding: 0 16rpx;
@@ -633,19 +719,23 @@
line-height: 42rpx;
}
}
.popup-car-box {
margin-top: 32rpx;
height: 155rpx;
overflow-x: auto;
.car-list {
display: flex;
flex-direction:row;
flex-direction: row;
align-items: center;
height: 155rpx;
.car-item {
margin-right: 24rpx;
width: 202rpx;
height: 152rpx;
image {
width: 202rpx;
height: 150rpx;
@@ -653,17 +743,20 @@
border-radius: 8rpx;
}
}
}
}
}
.must-read {
padding: 0 24rpx;
.popup-read-title {
font-size: 36rpx;
color: #111111;
line-height: 100rpx;
}
.popup-read-content {
margin-top: 24rpx;
padding: 24rpx;
@@ -671,26 +764,32 @@
border-radius: 8rpx;
font-size: 28rpx;
color: #000000;
.read-new-title {
font-size: 32rpx;
color: #111111;
}
.read-images {
margin-top: 32rpx;
}
.guize {
margin-top: 32rpx;
width: 654rpx;
height: 156rpx;
}
.liucheng {
width: 128rpx;
height: 128rpx;
border-radius: 50%;
}
.problem-tabs {
margin-bottom: 32rpx;
overflow-x: auto;
.problem-tabs-box {
.problem-tabs-item {
margin-right: 24rpx;
@@ -702,41 +801,49 @@
font-size: 26rpx;
color: #444444;
}
.problem-active-item {
background-color: #13AFA8;
color: #fff;
}
}
}
.problem-image {
width: 654rpx;
border-radius: 8rpx;
}
}
}
.comment-box {
background-color: #F5F5F5;
.comment-title {
padding: 0 24rpx;
line-height: 100rpx;
font-size: 32rpx;
color: #111111;
.num {
font-size: 32rpx;
font-weight: bold;
color: #F78D1F;
}
.comrel {
font-size: 28rpx;
color: #999999;
}
}
.comment-content-item {
margin: 0 auto;
padding: 32rpx 24rpx;
width: 702rpx;
border-radius: 8rpx;
background-color: #ffffff;
.user-info {
.right {
.user-detail {
@@ -744,13 +851,16 @@
font-size: 28rpx;
font-weight: bold;
color: #000000;
.name {
padding-left: 12rpx;
}
.fen {
color: #F68D1F;
}
}
image {
width: 72rpx;
height: 72rpx;
@@ -758,13 +868,16 @@
}
}
}
.comment-text {
margin-top: 32rpx;
font-size: 28rpx;
color: #000000;
}
.comment-image {
margin-top: 24rpx;
image {
margin-right: 24rpx;
margin-bottom: 24rpx;
@@ -775,12 +888,15 @@
}
}
}
.comment-btns {
width: 750rpx;
background-color: #fff;
border-top: 2rpx solid #eeeeee;
.comment-btn {
padding: 6rpx 24rpx 8rpx 40rpx;
.right-btn {
.right-price {
margin-right: 24rpx;
@@ -788,9 +904,11 @@
font-size: 32rpx;
font-weight: bold;
color: #111111;
.yue {
font-weight: 400;
}
.right-mouth {
width: 112rpx;
height: 24rpx;
@@ -798,11 +916,13 @@
color: #666666;
}
}
.right-btn-box {
height: 96rpx;
}
}
}
.contact-icon {
image {
margin-right: 36rpx;
@@ -810,11 +930,13 @@
}
}
}
.popup-content {
margin: 0 auto;
width: 610rpx;
height: 456rpx;
overflow-y: auto;
.popup-srcoll {
.popup-srcoll-title {
margin-top: 32rpx;
@@ -822,13 +944,16 @@
color: #111111;
line-height: 44rpx;
}
.popup-srcoll-content {
.item {
margin-top: 16rpx;
view {
width: 50%;
line-height: 36rpx;
font-size: 28rpx;
text {
color: #666;
}
@@ -838,24 +963,28 @@
}
}
}
.popup-phone-box {
.btn-item {
margin: 0 auto;
width: 686rpx;
height: 112rpx;
image {
width: 32rpx;
height: 32rpx;
}
}
.btn-item-1 {
border-bottom: 1rpx solid #eee;
font-size: 34rpx;
color: #333333;
}
.btn-item-2 {
font-size: 34rpx;
color: rgba(153,153,153,0.9);
color: rgba(153, 153, 153, 0.9);
}
}
</style>

151
pages/driver/showroom/index.vue
View File

@@ -49,9 +49,30 @@
</view>
<view class="select-content">
<view class="content-box">
<view :class="['content-item', brandId == index && 'active-item']"
@click="brandId = index" v-for="(item,index) in 6" :key="index">
比亚迪
<view :class="['content-item', brandId == -1 && 'active-item']"
@click="brandId = -1">
全部
</view>
<view :class="['content-item', brandId == item.id && 'active-item']"
@click="endbrandFn(item)" v-for="(item,index) in brandList" :key="item.id">
{{item.name}}
</view>
</view>
</view>
</view>
<view class="brand">
<view class="title">
选择型号
</view>
<view class="select-content">
<view class="content-box">
<view :class="['content-item', modelId == -1 && 'active-item']"
@click="modelId = -1">
全部
</view>
<view :class="['content-item', modelId == item.id && 'active-item']"
@click="modelId = item.id" v-for="(item) in modelList" :key="item.id">
{{item.name}}
</view>
</view>
</view>
@@ -62,69 +83,66 @@
</view>
<view class="select-content">
<view class="content-box">
<view :class="['content-item', powerId == index && 'active-item']"
@click="powerId = index" v-for="(item,index) in 6" :key="index">
纯电动
<view :class="['content-item', powerId == item.value && 'active-item']"
@click="powerId = item.value" v-for="(item,index) in carPowerList" :key="index">
{{item.name}}
</view>
</view>
</view>
</view>
<view class="brand">
<view class="title">
选择车型
</view>
<view class="select-content">
<view class="content-box">
<view :class="['content-item', modelId == index && 'active-item']"
@click="modelId = index" v-for="(item,index) in 6" :key="index">
轿车
</view>
</view>
</view>
</view>
<view class="brand" v-show="form.type == 1 || form.type == 2">
<view class="brand" v-show="form.type != 2">
<view class="title">
选择价格
</view>
<view class="select-content">
<view class="content-box">
<view :class="['content-item', priceId == index && 'active-item']"
@click="priceId = index" v-for="(item,index) in 6" :key="index">
10-15万
<view :class="['content-item', priceId == -1 && 'active-item']"
@click="priceId = -1">
不限
</view>
<view :class="['content-item', priceId == item.value && 'active-item']"
@click="priceId = item.value" v-for="(item,index) in carPriceList"
:key="item.value">
{{item.name}}
</view>
</view>
</view>
</view>
<view class="brand" v-show="form.type == 0">
<view class="brand" v-show="form.type == 2">
<view class="title">
选择车龄
</view>
<view class="select-content">
<view class="content-box">
<view :class="['content-item', priceId == index && 'active-item']"
@click="priceId = index" v-for="(item,index) in 6" :key="index">
1年内
<view :class="['content-item', carAgeId == -1 && 'active-item']"
@click="carAgeId = -1">
不限
</view>
<view :class="['content-item', carAgeId == item.value && 'active-item']"
@click="carAgeId = item.value" v-for="(item,index) in carAgeList"
:key="item.value">
{{item.name}}
</view>
</view>
</view>
</view>
<view class="brand" v-show="form.type == 0">
<view class="brand" v-show="form.type == 2">
<view class="title">
选择租期
</view>
<view class="select-content">
<view class="content-box">
<view :class="['content-item', priceId == index && 'active-item']"
@click="priceId = index" v-for="(item,index) in 6" :key="index">
3个月
<view :class="['content-item', tenancyId == item.value && 'active-item']"
@click="tenancyId = item.value" v-for="(item,index) in carTenancyList"
:key="index">
{{item.name}}
</view>
</view>
</view>
</view>
<view class="btns flex align-center">
<u-button @click="reset">重置</u-button>
<u-button style="margin-left: 40rpx;" color="#333333"
@click="$tab.navigateTo(`./carList/carList?type=${form.type}`)">确定</u-button>
<u-button style="margin-left: 40rpx;" color="#333333" @click="navCarList()">确定</u-button>
</view>
</view>
</view>
@@ -140,7 +158,8 @@
<view class="time">
车龄 {{item.carAge}}年 | 租期 {{item.monthRent}}个月
</view>
<view class="price">{{item.minGuidePrice}}~{{item.maxGuidePrice}}元<text class="one">/月 </text></view>
<view class="price">{{item.minGuidePrice}}~{{item.maxGuidePrice}}元<text class="one">/月 </text>
</view>
</view>
<view class="flex flex-column justify-around" style="height: 98rpx;" v-else>
<view class="name">{{item.title}}</view>
@@ -164,12 +183,19 @@
</template>
<script>
import {
carPowerList,
carTenancyList,
carPriceList,
carAgeList
} from "@/data/carConfigTabList.js"
import {
getProductList,
getInformationList
} from "@/api/showroom/showroom.js"
import {
brannerList
brannerList,
modelBrandList
} from '@/api/system/config';
import {
mapGetters
@@ -177,12 +203,26 @@
export default {
data() {
return {
//品牌
brandList: [],
//车型
modelList: [],
//动力
carPowerList,
//车龄
carAgeList,
//租期
carTenancyList,
//金额
carPriceList,
scrollTop: 0,
brannerIndex: 0,
brandId: -1,
powerId: -1,
modelId: -1,
priceId: -1,
carAgeId: -1,
tenancyId: -1,
height: 0,
show: false,
showNavImg: false,
@@ -194,7 +234,7 @@
text: '租车',
type: 2
}, {
text: '卖车',
text: '买车',
type: 0
}, {
text: '租买灵活',
@@ -222,6 +262,17 @@
}
},
methods: {
//筛选
navCarList() {
console.log('类型', this.form.type);
console.log('品牌', this.brandId);
console.log('型号', this.modelId);
console.log('动力', this.powerId);
console.log('价格', this.priceId);
console.log('车龄', this.carAgeId);
console.log('租期', this.tenancyId);
this.$tab.navigateTo(`./carList/carList?type=${this.form.type}&brandId=${this.brandId}`)
},
//tab this.$refs.paging.reload()
actTabFn(type) {
this.form.type = type
@@ -233,9 +284,9 @@
getInformationList({
page: page,
limit: limit,
powerType: this.powerId
}).then(res => {
// console.log(res, '列表');
this.carList = res.data.list
this.$refs.paging.complete(res.data.list);
})
} else {
getProductList({
@@ -243,7 +294,7 @@
limit: limit,
type: this.form.type
}).then(res => {
this.carList = res.data.list
this.$refs.paging.complete(res.data.list);
})
}
},
@@ -274,16 +325,27 @@
success: res => {
this.height = res.height / res.width * 750
},
fail: err => {
}
fail: err => {}
})
this.branner = res.data.list
})
},
//选择品牌获取 车型
endbrandFn(item) {
this.brandId = item.id;
this.modelList = item.carModelList
}
},
onLoad() {
//获取品牌列表
modelBrandList().then(res => {
console.log(res.data);
this.brandList = res.data
this.modelList = res.data[0].carModelList
})
},
onShow() {
this.getBranner()
// this.getProductListFn()
}
}
</script>
@@ -438,6 +500,7 @@
padding: 24rpx 0;
border-bottom: 1rpx solid #ededed;
}
.name {
font-size: 32rpx;
font-family: PingFang SC, PingFang SC;
@@ -445,6 +508,7 @@
color: #111111;
line-height: 44rpx;
}
.price {
margin-top: 12rpx;
font-size: 32rpx;
@@ -452,7 +516,7 @@
font-weight: 500;
color: #111111;
line-height: 38rpx;
.one {
font-size: 24rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
@@ -461,6 +525,7 @@
line-height: 36rpx;
}
}
.info {
.time {
margin-top: 8rpx;