apps/supplier-dispatch-h5
9
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

二手车交易，全部接口对接

Browse Source
This commit is contained in:
zhouxueli
2025-03-12 09:32:57 +08:00
parent 76c6d6ef5b
commit 5371e43b53
9 changed files with 380 additions and 188 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/api/secondHandCar.js
View File

@ -82,7 +82,15 @@ export function auditCarInfo(data){
return request({
url: '/toc-user/car-admin/auditCarInfo',
method:'POST',
// contentType: 'application/json',
data
})
}
// 保存信息记录
export function saveRecord(data){
return request({
url: '/toc-user/car-record/saveRecord',
method:'POST',
contentType: 'application/json',
data
})
}

9
src/utils/myMixins.js
View File

@ -77,6 +77,15 @@ export const myMixins = {
} else {
// 这里是重复点击的判断
}
},
formatNumber(num) {
if (num < 10000) {
// 小于 5 位数，显示为 0.x 万
return `${(num / 10000).toFixed(1)}`;
} else {
// 大于或等于 5 位数，显示为 x 万，四舍五入到小数点后一位
return `${Math.round(num / 1000) / 10}`;
}
}
}
}

44
src/views/secondHandCar/carSource.vue
View File

@ -17,9 +17,12 @@
<div class="oneContent content">
<img class="sort" src="@/assets/secondHandCar/one_cheyuan.png" />
<div class="uploadWrap">
<upload-common style="margin-right:4px" @success1="getDrivingLicense" :text="'行驶证照片'" :multiple="false" />
<upload-common style="margin-right: 4px" @success2="getPlateColor" :text="'车辆45度照'" :multiple="false" />
<upload-common @success3="getOtherImg" :text="'其他照片0/6'" :multiple="true" />
<upload-common @success1="getDrivingLicense" @delete1="deleteImg1"
:text="'行驶证照片'" :multiple="false" :files.sync="vehicleLicensePhotoList"/>
<upload-common @success2="getPlateColor" @delete2="deleteImg2"
:text="'车辆45度照'" :multiple="false" :files.sync="vehicleAnglePhotoList" />
<upload-common @success3="getOtherImg" @delete3="handleDeleteOtherImg"
:text="'其他照片0/6'" :multiple="true" :files.sync="otherImgSrcList"/>
</div>
</div>
<div class="line"></div>
@ -106,6 +109,9 @@
<img class="sort" src="@/assets/secondHandCar/three.png" />
<el-input class="ipt" v-model.trim="form.desc" type="textarea" :autosize="{ minRows: 6, maxRows: 6 }"
maxlength="500" show-word-limit placeholder="描述车辆信息：如事故、额外加装、无线遥控"></el-input>
<div v-if="type==2" style="margin: 10px 3px">不通过原因</div>
<el-input v-if="type==2" class="ipt" v-model.trim="auditReason" type="textarea" :autosize="{ minRows: 2, maxRows: 6 }"
maxlength="200" show-word-limit placeholder="请填写不通过原因"></el-input>
<div class="checkedWrap" v-if="type==1">
<img v-show="radio==1" @click="radio=0" class="radioIcon" src="@/assets/secondHandCar/checked.png" />
<img v-show="radio==0" @click="radio=1" class="radioIcon" src="@/assets/secondHandCar/uncheck.png" />
@ -126,7 +132,7 @@
closeable
position="bottom"
>
<van-area title="标题" :area-list="areaList" closeable="true"
<van-area title="标题" :area-list="areaList" closeable="true" :value="form.areaCode ? String(form.areaCode) : ''"
@cancel="areaShow = false" @confirm="confirmHandle"/>
</van-popup>
</div>
@ -164,9 +170,8 @@ export default {
maxPrice:'',
desc:'',
},
price:'',
radio: 0,
type:'',//1为发布 2为审核
type:'',//1为发布&修改 2为审核
areaList: areaList,
areaShow:false,
areaName:'',
@ -176,13 +181,16 @@ export default {
auditRemark:'',
auditReason:'',
queryType:'',
vehicleLicensePhotoList:[],
vehicleAnglePhotoList:[],
otherImgSrcList:[],
}
},
async mounted() {
const urlParams = new URLSearchParams(window.location.search);
this.type=this.$route.query.type || urlParams.get('type');
this.id=this.$route.query.id
this.queryType=this.$route.query.queryType
this.id=this.$route.query.id || urlParams.get('id');
this.queryType=this.$route.query.queryType || urlParams.get('queryType');
if( this.id){
let res = await carInfoDetail({
id:this.id,
@ -194,8 +202,11 @@ export default {
this.form.emissionStandard=res.data.emissionStandard?.code
this.auditRemark=res.data?.auditRemark
this.areaName=res.data?.areaName
this.otherImgSrc=res.data?.otherPhoto?.split(',')
this.otherImgSrc?.map(item=>this.otherImgSrcList.push({url:item}))
this.vehicleLicensePhotoList=[{url:res.data?.vehicleLicensePhoto}]
this.vehicleAnglePhotoList=[{url:res.data?.vehicleAnglePhoto}]
}
console.log("---",this.type,this.form)
},
methods:{
confirmHandle(val){
@ -218,15 +229,26 @@ export default {
this.form.registerDate=data.info.registerDate +' 00:00:00'
this.form.vehicleType=data.info.vehicleType
},
deleteImg1(){
this.form.vehicleLicensePhoto=''
},
getPlateColor(data){
console.log("getPlateColor",data)
this.form.vehicleAnglePhoto=data.url
this.form.licenseType=data.colorStatus
this.form.vehicleFrontLicensePlate=data.plateType
},
deleteImg2(){
this.form.vehicleAnglePhoto=''
},
getOtherImg(data){
this.otherImgSrc.push(data)
console.log("getOtherImg",data)
this.otherImgSrc.push(data.url)
},
handleDeleteOtherImg(file,index) {
// this.otherImgSrc = this.otherImgSrc.filter((item) => item !== file.url);
this.otherImgSrc = this.otherImgSrc.filter((item,i) => index !== i);
this.otherImgSrcList = this.otherImgSrcList.filter((item,i) => index !== i);
console.log("删除后的 otherImgSrc", this.otherImgSrc,this.otherImgSrcList);
},
// 审核操作
async auditHandle(type){

234
src/views/secondHandCar/components/upload-common.vue
View File

@ -1,108 +1,159 @@
<template>
<!-- <div>-->
<van-uploader
v-model="files"
:after-read="handleFileRead"
:before-delete="deleteHandle"
:preview-size="105"
accept="image "
:max-size="5 * 1024 * 1024"
:max-count="multiple ? 6 : 1"
>
<div class="upload">
<img class="icon" src="@/assets/secondHandCar/upload.png" />
<span class="text">{{ text }}</span>
</div>
</van-uploader>
<!-- </div>-->
<van-uploader
v-model="filesList"
:after-read="handleFileRead"
:before-delete="deleteHandle"
:preview-size="103"
accept="image "
:max-size="5 * 1024 * 1024"
:max-count="multiple ? 6 : 1"
>
<div class="upload">
<img class="icon" src="@/assets/secondHandCar/upload.png"/>
<span class="text">{{ displayText }}</span>
</div>
<template v-if="text.includes('其他照片')" #preview-cover="{ index }">
<div class="preview-cover van-ellipsis">{{ index + 1 }}/6</div>
</template>
</van-uploader>
</template>
<script>
import {ocrHandler, uploadImage} from "@/api/mine";
export default {
name: "uploadCommon",
props:{
text:{
type:String,
default:''
props: {
text: {
type: String,
default: ''
},
multiple:{
multiple: {
type: Boolean,
default: false
},
files: {
type: Array,
default: () => []
}
},
data(){
return{
files: [],
data() {
return {
filesList: ''
}
},
methods:{
deleteHandle(file,detail){
console.log("file,detail",file,detail)
mounted() {
this.filesList = this.files || []; // 确保 filesList 是数组
},
watch: {
files: {
immediate: true, // 立即执行一次
handler(newVal) {
this.filesList = newVal || []; // 同步更新 filesList
},
async handleFileRead(file) {
const formData = new FormData();
formData.append("file" , file.file);
let res = await uploadImage(formData);
console.log("res",res)
if(this.text == '行驶证照片'){
// 行驶证识别
let result = await ocrHandler({
ocrType: 3,
imageUrl: res.data,
cardSide: 'FRONT'
});
// console.log("result",result)
let data={url:res?.data,info:{...result?.data?.frontInfo}}
this.$emit('success1',data)
}else if(this.text == '车辆45度照'){
let result = await ocrHandler({
ocrType: 10,
imageUrl: res.data,
cardSide: 'FRONT'
});
// console.log("result",result)
let num =this.getVehicleLicense(result.data.color)
let data={url:res?.data,colorStr:result.data.color,colorStatus:num,plateType:result.data.number }
this.$emit('success2',data)
}else{
this.$emit('success3',res?.data)
}
},
filesList: {
handler(newVal) {
this.$emit("update:files", newVal);
},
getVehicleLicense(color) {
let vehicleLicense=''
if( color == '蓝' ) {
vehicleLicense = 1
} else if(color == '黄') {
vehicleLicense = 2
} else if(color == '临牌') {
vehicleLicense = 4
} else if(color.includes('绿')) {
vehicleLicense = 3
} else {
vehicleLicense = 5
}
return vehicleLicense
},
}
deep: true, // 深度监听
},
},
computed: {
displayText() {
if (this.text === "其他照片0/6") {
return `其他照片 ${this.filesList.length}/${this.multiple ? 6 : 1}`;
}
return this.text;
},
},
methods: {
async deleteHandle(file, detail) {
console.log("file, detail", file, detail);
this.filesList = this.filesList.filter((item) => item !== file);
console.log("this.filesList =", this.filesList)
// 根据 text 的不同，通知父组件删除对应的数据
if (this.text === "行驶证照片") {
this.$emit("delete1"); // 通知父组件删除行驶证数据
} else if (this.text === "车辆45度照") {
this.$emit("delete2"); // 通知父组件删除车辆45度照数据
} else {
console.log("delete3", file)
this.$emit("delete3", file, detail.index); // 通知父组件删除其他照片数据
}
return true;
},
async handleFileRead(file) {
const formData = new FormData();
formData.append("file", file.file);
let res = await uploadImage(formData);
console.log("res", res)
// 为文件添加唯一标识符
file.uid = Date.now(); // 使用时间戳作为唯一标识符
if (this.text == '行驶证照片') {
// 行驶证识别
let result = await ocrHandler({
ocrType: 3,
imageUrl: res.data,
cardSide: 'FRONT'
});
let data = {url: res?.data, info: {...result?.data?.frontInfo}}
this.$emit('success1', data)
} else if (this.text == '车辆45度照') {
let result = await ocrHandler({
ocrType: 10,
imageUrl: res.data,
cardSide: 'FRONT'
});
let num = this.getVehicleLicense(result.data.color)
let data = {url: res?.data, colorStr: result.data.color, colorStatus: num, plateType: result.data.number}
this.$emit('success2', data)
} else {
this.$emit('success3', {url: res?.data, uid: file.uid})
}
},
getVehicleLicense(color) {
let vehicleLicense = ''
if (color == '蓝') {
vehicleLicense = 1
} else if (color == '黄') {
vehicleLicense = 2
} else if (color == '临牌') {
vehicleLicense = 4
} else if (color.includes('绿')) {
vehicleLicense = 3
} else {
vehicleLicense = 5
}
return vehicleLicense
},
}
}
</script>
<style scoped lang="scss">
::v-deep .van-uploader{
.preview-cover {
position: absolute;
bottom: 0;
box-sizing: border-box;
width: 100%;
padding: 4px;
color: #fff;
font-size: 12px;
text-align: center;
background: rgba(0, 0, 0, 0.3);
}
.upload:last-child{
//margin-right: 0px !important;
::v-deep .van-uploader {
margin-bottom: 5px;
}
.upload{
//margin-right: 5px;
.upload {
position: relative;
width: 105px;
width: 103px;
height: 70px;
background: #F1F6FF;
box-shadow: 0px 0px 2px 0px rgba(235,235,235,0.38);
box-shadow: 0px 0px 2px 0px rgba(235, 235, 235, 0.38);
border-radius: 4px;
border: 1px solid #B8CBE9;
display: flex;
@ -113,11 +164,13 @@ export default {
box-sizing: border-box;
padding-top: 14px;
padding-bottom: 3px;
.icon{
.icon {
width: 30px;
height: 30px;
}
.text{
.text {
width: 80px;
background: #5A6FFF;
border-radius: 7px;
@ -128,15 +181,20 @@ export default {
color: #FFFFFF;
}
}
::v-deep .van-uploader__preview{
margin: 0;
//margin-left: 4px;
::v-deep .van-uploader__preview {
margin: 0 4px 4px 0;
}
::v-deep .van-uploader__preview-image{
::v-deep .van-uploader__input-wrapper {
margin: 0 4px 4px 0;
}
::v-deep .van-uploader__preview-image {
height: 70px !important;
border-radius: 4px !important;
border-radius: 4px !important;
}
::v-deep .van-uploader__preview-delete {
background-image: url('@/assets/secondHandCar/delete.png'); /* 替换为你的图片路径 */
background-size: cover;
@ -145,10 +203,8 @@ export default {
width: 15px;
height: 15px;
}
::v-deep .van-uploader__preview-delete-icon {
display: none !important; /* 强制隐藏伪元素 */
}
::v-deep .van-uploader__wrapper{
justify-content: space-between;
}
</style>

44
src/views/secondHandCar/forSale.vue
View File

@ -31,7 +31,7 @@
<span>{{ detailInfo.createTime?.substring(0,10) }}</span><span>{{ detailInfo.areaName }}</span><span>发布</span>
</div>
<div class="price">
<span>{{ detailInfo.maxPrice / 10000 }}</span>
<span>{{ formatNumber(detailInfo.maxPrice) }}</span>
<span>万</span>
</div>
</div>
@ -92,7 +92,7 @@
<script>
import {myMixins} from "@/utils/myMixins"
import {carInfoDetail} from "@/api/secondHandCar";
import {carInfoDetail,saveRecord} from "@/api/secondHandCar";
export default {
name: "forSale",
mixins:[myMixins],
@ -104,11 +104,17 @@ export default {
queryType:'',
detailInfo:'',
imgSrcList:[],
duration:'',
startTime: null, // 记录进入时间
recordType:1,
}
},
async mounted() {
this.id=this.$route.query.id
this.queryType=this.$route.query.queryType
// 页面加载时记录进入时间
this.startTime = new Date();
const urlParams = new URLSearchParams(window.location.search);
this.id=this.$route.query.id || urlParams.get('id');
this.queryType=this.$route.query.queryType || urlParams.get('queryType');
if( this.id){
let res = await carInfoDetail({
id:this.id,
@ -116,22 +122,30 @@ export default {
})
this.detailInfo=res?.data
this.imgSrcList=res.data.otherPhoto?.split(',') || []
console.log("=",res,this.imgSrcList)
/*this.form={...res.data}
this.form.licenseType=res.data.licenseType?.code
this.form.boardType=res.data.boardType?.code
this.form.emissionStandard=res.data.emissionStandard?.code
this.auditRemark=res.data?.auditRemark
this.areaName=res.data?.areaName*/
}
},
beforeUnmount() {
this.getDuration()
},
methods:{
onChange(index) {
this.current = index;
getDuration(){
// 页面卸载时记录离开时间并计算浏览时长
const endTime = new Date();
const duration = (endTime - this.startTime) / 1000; // 计算时长（秒）
// console.log('页面卸载时间:', endTime);
console.log('浏览时长:', duration, '秒');
this.saveRecord(duration);
},
async saveRecord(duration){
await saveRecord({type:this.recordType,carInfoId:this.id,duration})
},
handle(){
this.recordType=2
this.getDuration()
window.location.href = `tel:${this.detailInfo.contactNumber}`;
},
onChange(index) {
this.current = index;
},
}
}

47
src/views/secondHandCar/indexList.vue
View File

@ -68,7 +68,8 @@
<div class="contentItem">
<div class="item" v-for="(item,index) in pageList" :key="index" @click="viewCarSource(item)">
<div class="left">
<img :src="item.vehicleAnglePhoto" />
<img class="img" v-if="item.vehicleAnglePhoto" :src="item.vehicleAnglePhoto" />
<div v-else class="qiugou">{{item.vehicleType?.substring(0,2)}}</div>
</div>
<div class="right">
<div class="title">{{item.vehicleType}}</div>
@ -77,8 +78,13 @@
<div v-else class="type">{{ item.boardType?.label }} |
{{item.vehicleType }} | {{item.emissionStandard?.label}}</div>
<!-- <div class="date" v-show="activeTab==0">注册日期： 2025-03-07</div>-->
<div class="price"><span>￥</span> <span>{{priceHandle(item.maxPrice) }}</span> <span>万</span> </div>
<div class="date" v-show="activeTab==0 && item.registerDate">注册日期： {{item.registerDate?.substring(0,10)}}</div>
<div v-if="activeTab==0" class="price"><span>￥</span> <span>{{formatNumber(item.maxPrice) }}</span> <span>万</span> </div>
<div v-else class="priceRange">
<span class="num">{{formatNumber(item.minPrice) }}</span> <span class="danwei">万</span>
<span class="su">~</span>
<span class="num">{{formatNumber(item.maxPrice) }}</span> <span class="danwei">万</span>
</div>
<div class="line"></div>
</div>
</div>
@ -165,9 +171,6 @@ export default {
goMine(){//我的发布
this.$router.push({ name: "mineRelease",})
},
priceHandle(item){
return item/10000
},
viewCarSource(item){
if(this.activeTab===0){//车源查看
this.$router.push({ name: "forSale", query: {type:1 , id:item.id,queryType:1 }})
@ -354,7 +357,7 @@ export default {
}
.contentWrap{
width: 100%;
height: calc(100% - 150px);
height: calc(100% - 80px);
overflow-y: auto;
background-color: #F2F2F2 ;
box-sizing: border-box;
@ -371,13 +374,20 @@ export default {
justify-content: space-between;
}
.left{
img{
.img, .qiugou{
width: 115px;
height: 77px;
background: linear-gradient( 90deg, rgba(5,32,54,0.88) 0%, rgba(69,87,103,0.19) 64%, rgba(133,141,152,0) 100%);
border-radius: 7px;
margin-right: 10px;
}
.qiugou{
line-height: 77px;
text-align: center;
color: #FFFFFF;
font-size: 18px;
letter-spacing: 5px;
background-color: #6C81CD;
}
}
.right{
.title{
@ -420,6 +430,25 @@ export default {
line-height: 16px;
}
}
.priceRange{
color: #FF5533;
display: flex;
align-items: center;
.num{
font-weight: bold;
font-size: 18px;
margin-right: 5px;
}
.danwei{
font-weight: 600;
font-size: 11px;
}
.su{
font-weight: 600;
font-size: 11px;
margin: 0 6px;
}
}
.line{
width: 224px;
border-bottom: 2px solid #F5F5F5;

61
src/views/secondHandCar/mineRelease.vue
View File

@ -24,7 +24,7 @@
</div>
<div class="right">
<div class="title">
<span>牵引车</span>
<span>{{item.vehicleType}}</span>
<img class="titleImg" :src="getStatus(item.status?.code)" />
</div>
<div v-if="activeTab==0" class="type">{{ item.boardType?.label }} | {{ item.licenseType?.label }} |
@ -32,12 +32,17 @@
<div v-else class="type">{{ item.boardType?.label }} |
{{item.vehicleType }} | {{item.emissionStandard?.label}}</div>
<div class="price"><span>{{ priceHandle(item.maxPrice) }}</span> <span>万</span> </div>
<div v-if="item.type==1" class="price"><span>{{formatNumber(item.maxPrice) }}</span> <span>万</span> </div>
<div v-else class="priceRange">
<span class="num">{{formatNumber(item.minPrice) }}</span> <span class="danwei">万</span>
<span class="su">~</span>
<span class="num">{{formatNumber(item.maxPrice) }}</span> <span class="danwei">万</span>
</div>
<div class="btnWrap">
<img v-if="[1,2].includes(activeTab)" @click.stop="reviseHandle(item)" class="revise" src="@/assets/secondHandCar/revise.png" />
<img v-if="[1,2].includes(activeTab)" @click.stop="xiajiaHandle(item)" class="xiajia" src="@/assets/secondHandCar/xiajia.png" />
<img v-if="[2,3].includes(activeTab)" @click.stop="polishHandle(item)" class="polish" src="@/assets/secondHandCar/polish.png" />
<img v-if="activeTab == 3" @click.stop="reShangJiaHandle(item)" class="reshangjia" src="@/assets/secondHandCar/reshangjia.png" />
<img v-if="[1,2].includes(activeTab)" @click.stop="noMultipleClicks(reviseHandle,item)" class="revise" src="@/assets/secondHandCar/revise.png" />
<img v-if="[1,2].includes(activeTab)" @click.stop="noMultipleClicks(xiajiaHandle,item)" class="xiajia" src="@/assets/secondHandCar/xiajia.png" />
<img v-if="[2,3].includes(activeTab)" @click.stop="noMultipleClicks(polishHandle,item)" class="polish" src="@/assets/secondHandCar/polish.png" />
<img v-if="activeTab == 3" @click.stop="noMultipleClicks(reShangJiaHandle,item)" class="reshangjia" src="@/assets/secondHandCar/reshangjia.png" />
</div>
<div class="line"></div>
</div>
@ -56,7 +61,7 @@
<van-radio name="2">不卖了</van-radio>
</van-radio-group>
<div class="btnWrap">
<div class="btn" @click="submitHandle">确认</div>
<div class="btn" @click="noMultipleClicks(submitHandle)">确认</div>
</div>
</div>
</van-popup>
@ -128,9 +133,6 @@ export default {
this.poupShow=false
await this.getList()
},
priceHandle(item){
return item/10000
},
reviseHandle(item){//修改
this.$router.push({
name: item.type==1 ? "carSource" : 'wantBuy',
@ -138,13 +140,23 @@ export default {
})
},
async polishHandle(item){//檫亮
await usedCarPolish(item.id)
this.$toast('你的曝光度已提升')
await this.getList()
try {
await usedCarPolish(item.id)
this.$toast('你的曝光度已提升')
await this.getList()
}catch (e){
console.log('polishHandle',e)
} finally {
console.log(1122)
}
},
async reShangJiaHandle(item){//重新上架
await usedCarReShelf(item.id)
await this.getList()
try {
await usedCarReShelf(item.id)
await this.getList()
} catch (e) {
console.log('reShangJiaHandle',e)
}
},
xiajiaHandle(item){//下架
this.poupShow=true
@ -322,6 +334,25 @@ export default {
line-height: 16px;
}
}
.priceRange{
color: #FF5533;
display: flex;
align-items: center;
.num{
font-weight: bold;
font-size: 18px;
margin-right: 5px;
}
.danwei{
font-weight: 600;
font-size: 11px;
}
.su{
font-weight: 600;
font-size: 11px;
margin: 0 6px;
}
}
.line{
width: 224px;
border-bottom: 2px solid #F5F5F5;

37
src/views/secondHandCar/wantBuy.vue
View File

@ -23,7 +23,7 @@
<van-radio name="拖车" :class="{'checked':form.vehicleType=='拖车','vehicleRadio':true}">拖车</van-radio>
<van-radio name="地库车" :class="{'checked':form.vehicleType=='地库车','vehicleRadio':true}">地库车</van-radio>
<van-radio name="牵引车" :class="{'checked':form.vehicleType=='牵引车','vehicleRadio':true}">牵引车</van-radio>
<van-radio name="随车" :class="{'checked':form.vehicleType=='随车','vehicleRadio':true}">随车吊</van-radio>
<van-radio name="随车吊" :class="{'checked':form.vehicleType=='随车吊','vehicleRadio':true}">随车吊</van-radio>
<van-radio name="其他" :class="{'checked':form.vehicleType=='其他','vehicleRadio':true}">其他</van-radio>
</van-radio-group>
<van-field
@ -91,22 +91,11 @@
</div>
<div class="btnWrap" >
<div v-if="type==1" class="btn commonBtn" @click="noMultipleClicks(submitHandle)">发布</div>
<div class="auditBtn">
<div v-else class="auditBtn">
<div class="commonBtn" @click="noMultipleClicks(auditHandle,0)">审核不通过</div>
<div class="commonBtn" @click="noMultipleClicks(auditHandle,1)"><span style="margin-right: 6px">✔</span>审核通过</div>
</div>
</div>
<!-- <div class="item">
<span> <span class="star">*</span>审核结果 </span>
<div>
<img @click="radio=0" class="radioIcon" src="@/assets/secondHandCar/checked.png" />
<span>通过</span>
</div>
<div>
<img @click="radio=0" class="radioIcon" src="@/assets/secondHandCar/uncheck.png" />
<span>不通过</span>
</div>
</div>-->
</div>
</div>
</div>
@ -144,8 +133,8 @@ export default {
async mounted() {
const urlParams = new URLSearchParams(window.location.search);
this.type=this.$route.query.type || urlParams.get('type');
this.id=this.$route.query.id
this.queryType=this.$route.query.queryType
this.id=this.$route.query.id || urlParams.get('id');
this.queryType=this.$route.query.queryType || urlParams.get('queryType');
if( this.id){
let res = await carInfoDetail({
id:this.id,
@ -160,10 +149,10 @@ export default {
methods:{
// 审核操作
async auditHandle(type){
/* if (type==0 && !this.auditReason){
if (!type && !this.auditReason){
this.$toast('请填写不通过原因')
return
}*/
}
try {
await auditCarInfo({
id: this.id,
@ -243,11 +232,17 @@ export default {
.headerWrap{
width: 100%;
box-sizing: border-box;
padding: 15px 16px;
padding-top: 15px;
padding-bottom: 15px;
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
.navWrap{
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
box-sizing: border-box;
padding: 0 16px 10px;
}
.bg{
position: absolute;
width: 100%;

82
src/views/secondHandCar/wantBuySale.vue
View File

@ -8,19 +8,17 @@
<div class="contentWrap">
<div class="titleWrap wrapCommon">
<div class="info">
<span>牵引车</span>
<span>全落地</span>
<span>黄牌</span>
<span>帕菲特</span>
<span>八万公里</span>
<span>国5</span>
<span>{{ detailInfo.vehicleType }}</span>
<span>{{ detailInfo.boardType?.label }}</span>
<span>{{ detailInfo.emissionStandard?.label }}</span>
</div>
<div class="time">
<span>2025-03-05</span><span>江苏苏州</span><span>发布</span>
<span>{{ detailInfo.createTime?.substring(0,10) }}</span><span>发布</span>
</div>
<div class="price">
<span>20.5</span>
<span>万</span>
<span class="num">{{formatNumber(detailInfo.minPrice) }}</span> <span class="danwei">万</span>
<span class="su">~</span>
<span class="num">{{formatNumber(detailInfo.maxPrice) }}</span> <span class="danwei">万</span>
</div>
</div>
<div class="detailInfoWrap wrapCommon">
@ -29,26 +27,24 @@
</div>
<div class="descItem descCommon">
<div class="itemInfo">
<span>拖车</span>
<span>{{ detailInfo.vehicleType }}</span>
<span>拖车类型</span>
</div>
<div class="suGang"></div>
<div class="itemInfo">
<span>全落地&nbsp;&nbsp;</span>
<span>{{ detailInfo.boardType?.label }}&nbsp;&nbsp;</span>
<span>拖车落板</span>
</div>
<div class="suGang"></div>
<div class="itemInfo">
<span>国五</span>
<span>{{ detailInfo.emissionStandard?.label }}</span>
<span>排放标准</span>
</div>
</div>
<div>
<img class="descImg" src="@/assets/secondHandCar/description.png" />
</div>
<div class="descCommon desc">
事故事故手动阀时空裂缝就能看拉萨你发凯撒老大飞机考拉说法你时空裂缝距离考试纽福克斯就发了斯
</div>
<div class="descCommon desc">{{detailInfo.desc}}</div>
</div>
<div class="btn" @click="noMultipleClicks(handle)">我有车源</div>
</div>
@ -57,23 +53,54 @@
<script>
import {myMixins} from "@/utils/myMixins"
import {carInfoDetail, saveRecord} from "@/api/secondHandCar";
export default {
name: "wantBuySale",
mixins:[myMixins],
data(){
return{
current: 0,
noClick:true
noClick:true,
id:'',
queryType:'',
detailInfo:'',
duration:'',
startTime: null, // 记录进入时间
recordType:1,
}
},
async mounted() {
// 页面加载时记录进入时间
this.startTime = new Date();
const urlParams = new URLSearchParams(window.location.search);
this.id=this.$route.query.id || urlParams.get('id');
this.queryType=this.$route.query.queryType || urlParams.get('queryType');
if( this.id) {
let res = await carInfoDetail({
id: this.id,
queryType: this.queryType,
})
this.detailInfo = res?.data
}
},
beforeUnmount() {
this.getDuration()
},
methods:{
onChange(index) {
this.current = index;
getDuration(){
// 页面卸载时记录离开时间并计算浏览时长
const endTime = new Date();
const duration = (endTime - this.startTime) / 1000; // 计算时长（秒）
// console.log('页面卸载时间:', endTime);
console.log('浏览时长:', duration, '秒');
this.saveRecord(duration);
},
async saveRecord(duration){
await saveRecord({type:this.recordType,carInfoId:this.id,duration})
},
handle(){
this.recordType=2
this.getDuration()
window.location.href = `tel:${this.detailInfo.contactNumber}`;
},
}
}
@ -139,21 +166,22 @@ export default {
span:first-child{
margin-right: 20px;
}
span:last-child{
margin-left: 10px;
}
}
.price{
color: #FF5533;
line-height: 28px;
font-weight: 600;
span:first-child{
display: flex;
align-items: center;
.num{
font-size: 20px;
margin-right: 4px;
margin-right: 4px;
}
span:last-child{
.danwei,.su{
font-size: 11px;
}
.su{
margin: 0 4px;
}
}
}
.detailInfoWrap{