扣车管理

This commit is contained in:
nyoung 2024-08-21 20:22:02 +08:00
parent 854d4810a4
commit 293496ff05

View File

@ -2,14 +2,18 @@
<template>
<view class="content">
<view class="top-icon">
<view class="h-text" @click="getback()">返回</view>
<view class="s-input">
<uni-icons type="search" color=" #999999" size="16"></uni-icons>
<input type="text" v-model="licenseNum" placeholder="车牌号搜索">
</view>
<view class="h-text" @click="getlist()">搜索</view>
</view>
<VNavigationBar title="扣车管理"></VNavigationBar>
<!-- <view class="top-icon">-->
<!-- <view class="h-text" style="font-size: 20px;font-weight: bold;color: white" @click="getback()"><</view>-->
<!-- <div style="text-align: center;width: 100%;color: white;">扣车管理</div>-->
<!-- </view>-->
<view class="search-box">
<view class="s-input">
<uni-icons type="search" color=" #999999" size="16"></uni-icons>
<input type="text" v-model="licenseNum" placeholder="车牌号搜索">
</view>
<view class="search-button" @click="getlist()">搜索</view>
</view>
<view class="top-tap">
<!-- <view class="tap-box" :class="{'cc' : gindex == item.id }" v-for="(item,index) in arrtap" :key="index"
@click="getindex(item.id)">
@ -33,23 +37,28 @@
<view class="ques" v-if="orderList.length== 0 ">
<image src="../../static/quesheng.png" mode=""></image>
</view>
<view class="boxa" v-for="(item,index) in orderList" :key="index">
<view class="hei-title">{{item.licenseNum || ''}}</view>
<view class="box-bs">
<view class="zc">车主{{item.connectionName || ''}}</view>
<view class="zc">联系电话{{item.connectionPhone || ''}}</view>
</view>
<view class="yihang">扣车时间{{item.createTime || ''}}</view>
<view class="yihang">扣车地点{{item.rescuePosition || ''}}</view>
<view class="yihang">取车地点{{item.kcPosition || ''}}</view>
<view class="right-box">
<view class="janniu" v-if="gindex == 3" @click="getjiji(item.id)">
<text>还车</text>
</view>
</view>
</view>
<view class="boxa-box" v-for="(item,index) in orderList" :key="index">
<view class="boxa" :style="{borderRadius: gindex === 3 ? '10px 10px 0 0' : '10px'}">
<view class="car-card-line">
<view class="car-card-line">
<view class="car-card">车牌号</view>
<view class="hei-title">{{item.licenseNum || ''}}</view>
</view>
<view class="car-card-state" :class="8 == gindex ? 'state-blue' : 3 == gindex ? 'state-green' : 'state-red'">{{ 8 == gindex ? '已还车' : 3 == gindex ? '已解扣' : '扣车中' }}</view>
</view>
<view class="box-bs">
<view class="zc">车主{{item.connectionName || ''}}</view>
<view class="zc">联系电话{{item.connectionPhone || ''}}</view>
</view>
<view class="yihang">扣车时间{{item.createTime || ''}}</view>
<view class="yihang">扣车地点{{item.rescuePosition || ''}}</view>
<view class="yihang">取车地点{{item.kcPosition || ''}}</view>
</view>
<view class="janniu" v-if="gindex == 3" @click="getjiji(item.id)">
<text>立即还车</text>
</view>
</view>
<!-- <view class="boxt" v-for="(item,index) in orderList" :key="index" @click="godetail(item.id)">
<view class="boxt-left">
<view class="left-lan">
@ -73,7 +82,7 @@
<text style="font-weight: 400;"> {{item.rescueTime}}</text>
</view>
</view>
<view class="boxt-right">
@ -94,14 +103,32 @@
<script>
import tabBar from '../../components/tabBar/tabBar.vue'
import request from '../../utils/request';
import VNavigationBar from 'components/VNavigationBar.vue'
export default {
data() {
return {
one: 0,
two: 0,
three: 0,
gindex: 9,
orderList: [],
gindex: 3,
orderList: [
{
licenseNum: '鲁A8L2P8',
connectionName: '孙强',
connectionPhone: '13589497326',
createTime: '2024-08-21 08:42:25',
rescuePosition: '山东省济南市山东省济南市山东省济南市山东省济南市山东省济南市',
kcPosition: '蓝安集团'
},
{
licenseNum: '鲁A8L2P8',
connectionName: '孙强',
connectionPhone: '13589497326',
createTime: '2024-08-21 08:42:25',
rescuePosition: '山东省济南市山东省济南市山东省济南市山东省济南市山东省济南市',
kcPosition: '蓝安集团'
}
],
licenseNum: '',
rescueStatus: '',
total: 0,
@ -127,6 +154,7 @@
},
components: {
tabBar,
VNavigationBar
},
onLoad() {
this.getthree()
@ -261,10 +289,46 @@
</script>
<style scoped lang="scss">
.car-card-line{
display: flex;
justify-content: space-between;
align-items: center;
}
.car-card{
font-size: 15px;
font-weight: bold;
width: 70px;
height: 28px;
line-height: 28px;
border-radius: 10px 0 10px 0;
background: #edf3fe;
color: #4487fa;
text-align: center;
}
.car-card-state{
font-size: 15px;
width: 70px;
height: 28px;
line-height: 28px;
text-align: center;
}
.state-blue{
background: #edf3fe;
color: #4487fa;
}
.state-red{
background: #fbeced;
color: #d63338;
}
.state-green{
background: #edf7ec;
color: #48be3a;
}
.content {
width: 100%;
height: calc(100vh);
background-color: #F6F6F6;
background-color: #f6f7fc;
box-sizing: border-box;
padding-top: 45px;
}
@ -274,7 +338,7 @@
width: 100%;
padding: 5px 14px;
background: white;
background: #317dfa;
display: flex;
justify-content: space-between;
align-items: center;
@ -282,7 +346,7 @@
}
.dil {
background-color: #F6F6F6;
background-color: #f6f7fc;
box-sizing: border-box;
padding: 15px 12px;
}
@ -290,13 +354,32 @@
.h-text {
font-size: 14px;
font-weight: 400;
color: #999999;
color: #ffffff;
}
.search-box{
background: rgb(49, 125, 250);
display: flex;
align-items: center;
justify-content: center;
}
.search-button{
width: 15%;
height: 30px;
font-size: 14px;
margin: 10px;
line-height: 30px;
text-align: center;
color: #ffffff;
background: rgba(255, 255, 255, 0.3);
border-radius: 15px;
}
.s-input {
width: 78%;
width: 75%;
height: 30px;
background: #F3F3F3;
background: #ffffff;
border-radius: 50px;
box-sizing: border-box;
display: flex;
@ -313,7 +396,7 @@
.top-tap {
width: 100%;
background: white;
background: #317dfa;
display: flex;
align-items: center;
box-sizing: border-box;
@ -324,16 +407,16 @@
width: 33%;
font-size: 15px;
font-weight: 400;
color: #666666;
color: #ffffff;
text-align: center;
}
.gang {
width: 80%;
height: 5px;
margin: 0 auto;
height: 3px;
margin: 1px auto;
border-radius: 12px;
background: linear-gradient(87deg, #B6E1FF 0%, #339DFF 100%);
background: white;
}
.d-box {
@ -552,20 +635,21 @@
color: white;
display: flex;
align-items: center;
font-style: 18px;
font-size: 18px;
font-weight: bold;
justify-content: center;
}
.boxa-box{
box-sizing: border-box;
width: 95%;
margin: 8px auto;
}
.boxa {
background: #FFFFFF;
border-radius: 10px;
box-sizing: border-box;
padding: 15px;
width: 95%;
border-radius: 10px;
margin: 10px auto;
}
background: #FFFFFF;
padding: 15px;
box-shadow: 0px 0px 8px -5px #888888;
}
.box-bs {
width: 100%;
@ -576,19 +660,20 @@
}
.zc {
font-size: 14px;
font-size: 16px;
font-weight: 400;
color: #363636
}
.hei-title {
font-size: 16px;
margin-left: 10px;
font-size: 18px;
font-weight: 600;
color: #363636;
}
.yihang {
font-size: 14px;
font-size: 16px;
font-weight: 400;
color: #363636;
margin-top: 10px;
@ -603,15 +688,15 @@
}
.janniu {
width: 120px;
height: 30px;
background: #FF4D4F;
border-radius: 26px;
width: 100%;
height: 45px;
background: #317cfa;
border-radius: 0 0 10px 10px;
display: flex;
align-items: center;
justify-content: center;
color: white;
font-size: 14px;
font-size: 16px;
}
.ques {
@ -619,4 +704,4 @@
margin: 100px auto;
}
</style>
</style>