调整样式
This commit is contained in:
parent
43aef69366
commit
81e98c189e
@ -1,335 +1,701 @@
|
||||
<!-- 选择页 -->
|
||||
<!-- 历史订单列表-->
|
||||
|
||||
<template>
|
||||
<view class="content">
|
||||
<view class="bil">
|
||||
<view class="c-top">
|
||||
<view class="top-icon" @click="getback()">
|
||||
<uni-icons type="left" size="18"></uni-icons>
|
||||
<view class="">返回</view>
|
||||
<view style="background: #317dfa">
|
||||
<VNavigationBar title="扣车"></VNavigationBar>
|
||||
<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="车牌号搜索">
|
||||
<uni-icons @click="licenseNum = ''" type="clear" color="#8E8E93"></uni-icons>
|
||||
</view>
|
||||
<view class="">扣车</view>
|
||||
<view style="width: 20%; height: 100%; "></view>
|
||||
<view class="search-button" @click="getlist()">搜索</view>
|
||||
</view>
|
||||
<view class="input-box">
|
||||
<view class="hui-input">
|
||||
<input type="text" placeholder="输入姓名/车牌号/手机号" v-model="connectionName">
|
||||
<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)">
|
||||
<view style="margin-bottom: 4px;">{{item.text}}</view>
|
||||
<view class="gang" v-if="item.id == gindex"></view>
|
||||
</view> -->
|
||||
<view class="tap-box" :class="{'cc' : gindex == 9 }" @click="getindex(9)">
|
||||
<view style="margin-bottom: 4px;">扣车中 ({{one}}) </view>
|
||||
<view class="gang" v-if="9 == gindex"></view>
|
||||
</view>
|
||||
<view class="anniu" @click="getlist">
|
||||
<text>搜索</text>
|
||||
<view class="tap-box" :class="{'cc' : gindex == 3 }" @click="getindex(3)">
|
||||
<view style="margin-bottom: 4px;">已解扣 ({{two}}) </view>
|
||||
<view class="gang" v-if="3 == gindex"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="tap-lan">
|
||||
<view class="tap-box" v-for="(item,index) in kolist" :key="index" @click="iditem(item.id)">
|
||||
<view class="">{{item.text}}</view>
|
||||
<view class="gang" v-if="tabid == item.id"></view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="dil">
|
||||
<view class="ques" v-if="orderList.length== 0 ">
|
||||
<image src="../../static/quesheng.png" mode=""></image>
|
||||
</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>
|
||||
<view class="dadahuii">
|
||||
<view class="mubu">
|
||||
<view class="ques" v-if="listarr.length== 0 ">
|
||||
<image src="../../static/quesheng.png" mode=""></image>
|
||||
</view>
|
||||
<view class="boxa" v-for="(item,index) in listarr" :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="item.rescueStatus < 6" @click="dialogToggle(item.id)">
|
||||
<text>解扣</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
|
||||
<view class="yihang">取车地点：{{item.kcPosition || ''}}</view>
|
||||
</view>
|
||||
<view class="janniu" v-if="item.rescueStatus < 6" @click="dialogToggle(item.id)">
|
||||
<text>解扣</text>
|
||||
</view>
|
||||
</view>
|
||||
<uni-popup ref="alertDialog" type="dialog">
|
||||
<uni-popup-dialog :type="msgType" cancelText="关闭" confirmText="同意" title="通知" content="您确认解扣吗" @confirm="dialogConfirm"
|
||||
@close="dialogClose"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
<!-- <view class="boxt" v-for="(item,index) in orderList" :key="index" @click="godetail(item.id)">
|
||||
<view class="boxt-left">
|
||||
<view class="left-lan">
|
||||
<view class="">{{item.rescueTypeStr}}</view>
|
||||
</view>
|
||||
<view class="text1">{{item.kcPosition}}</view>
|
||||
<view class="text1">
|
||||
<text>姓名：</text>
|
||||
<text style="font-weight: 400;">{{item.connectionName}}</text>
|
||||
</view>
|
||||
<view class="text1">
|
||||
<text>手机号：</text>
|
||||
<text style="font-weight: 400;">{{item.connectionPhone}}</text>
|
||||
</view>
|
||||
<view class="text1">
|
||||
<text>车牌号：</text>
|
||||
<text style="color: #207efe;"> {{item.licenseNum}}</text>
|
||||
</view>
|
||||
<view class="text1">
|
||||
<text>时间：</text>
|
||||
<text style="font-weight: 400;"> {{item.rescueTime}}</text>
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
<view class="boxt-right">
|
||||
|
||||
<view class="aniiu" v-if="gindex == 3">
|
||||
还车
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
|
||||
|
||||
<view style="width: 100%; height: 60px;"></view>
|
||||
</view>
|
||||
<uni-popup ref="alertDialog" type="dialog">
|
||||
<uni-popup-dialog :type="msgType" cancelText="关闭" confirmText="同意" title="通知" content="您确认解扣吗" @confirm="dialogConfirm"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
<!-- <tabBar></tabBar> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import tabBar from '../../components/tabBar/tabBar.vue'
|
||||
import request from '../../utils/request';
|
||||
import tabBar from'../../components/tabBar/tabBar.vue'
|
||||
|
||||
export default{
|
||||
data(){
|
||||
return{
|
||||
msgType:'',
|
||||
tabid:1,
|
||||
pageNum: 1,//第几页
|
||||
pageSize: 10,//一页多少张
|
||||
totalPages: 0,//总数
|
||||
jkid:'',
|
||||
connectionName:'',
|
||||
kolist:[
|
||||
{text:'扣车中',id:1},
|
||||
{text:'已解扣',id:2},
|
||||
import VNavigationBar from 'components/VNavigationBar.vue'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
msgType:'',
|
||||
jkid: '',
|
||||
one: 0,
|
||||
two: 0,
|
||||
three: 0,
|
||||
gindex: 9,
|
||||
orderList: [],
|
||||
licenseNum: '',
|
||||
rescueStatus: '',
|
||||
total: 0,
|
||||
pageNum: 1, //第几页
|
||||
pageSize: 10, //一页多少张
|
||||
totalPages: 0, //总数
|
||||
arrtap: [{
|
||||
text: '扣车中',
|
||||
id: 9
|
||||
},
|
||||
{
|
||||
text: '已解扣',
|
||||
id: 3
|
||||
}
|
||||
],
|
||||
listarr:[]
|
||||
arrbox: []
|
||||
}
|
||||
},
|
||||
components:{
|
||||
components: {
|
||||
tabBar,
|
||||
VNavigationBar
|
||||
},
|
||||
onLoad(option) {
|
||||
this.isAppointment = option.isAppointment
|
||||
},
|
||||
onShow() {
|
||||
if (option.id) {
|
||||
this.gindex = option.id
|
||||
}
|
||||
this.getthree()
|
||||
this.getlist()
|
||||
},
|
||||
onReachBottom() {
|
||||
console.log('执行了');
|
||||
if (this.pageNum >= this.totalPages) {
|
||||
if (this.orderList.length >= this.totalPages) {
|
||||
uni.showToast({
|
||||
title: '没有下一页数据',
|
||||
icon: 'none'
|
||||
})
|
||||
|
||||
|
||||
} else {
|
||||
this.pageNum++
|
||||
|
||||
|
||||
this.getlist()
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
getlist(){
|
||||
let data = {
|
||||
connectionName:this.connectionName,
|
||||
rescueStatus:this.tabid,
|
||||
pageSize:this.pageSize,
|
||||
pageNum:this.pageNum,
|
||||
}
|
||||
|
||||
methods: {
|
||||
dialogToggle(id) {
|
||||
this.jkid = id
|
||||
this.$refs.alertDialog.open()
|
||||
},
|
||||
dialogConfirm(){
|
||||
console.log('ok');
|
||||
this.jiekou(this.jkid)
|
||||
this.getlist()
|
||||
this.$refs.alertDialog.close()
|
||||
|
||||
},
|
||||
jiekou(id){
|
||||
let data = {
|
||||
rescueId:id,
|
||||
}
|
||||
request({
|
||||
url: '/app/rescueInfo/openKc',
|
||||
method: 'post',
|
||||
params:data
|
||||
}).then((res)=>{
|
||||
console.log('jie',res);
|
||||
if(res.code == 200 ){
|
||||
this.getlist()
|
||||
}
|
||||
})
|
||||
},
|
||||
getthree() {
|
||||
|
||||
request({
|
||||
url: '/app/rescueInfo/getKcList',
|
||||
method: 'get',
|
||||
params:data
|
||||
}).then((res)=>{
|
||||
console.log('扣车',res);
|
||||
if(res.code == 200 ){
|
||||
if (this.pageNum != 1) {
|
||||
this.listarr = this.listarr.concat(res.rows)
|
||||
}else{
|
||||
this.listarr = res.rows
|
||||
}
|
||||
let total = res.total
|
||||
this.totalPages = Math.ceil(total / this.pageSize);
|
||||
params: {
|
||||
connectionName: '',
|
||||
rescueStatus: 9,
|
||||
pageSize: 10,
|
||||
pageNum: 1,
|
||||
}
|
||||
|
||||
}).then((res) => {
|
||||
if (res.code == 200) {
|
||||
this.one = res.total
|
||||
}
|
||||
})
|
||||
request({
|
||||
url: '/app/rescueInfo/getKcList',
|
||||
method: 'get',
|
||||
params: {
|
||||
connectionName: '',
|
||||
rescueStatus: 3,
|
||||
pageSize: 10,
|
||||
pageNum: 1,
|
||||
}
|
||||
}).then((res) => {
|
||||
if (res.code == 200) {
|
||||
this.two = res.total
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
dialogToggle(id) {
|
||||
this.jkid = id
|
||||
this.$refs.alertDialog.open()
|
||||
},
|
||||
dialogConfirm(){
|
||||
console.log('ok');
|
||||
this.jiekou(this.jkid )
|
||||
this.getlist()
|
||||
this.$refs.alertDialog.close()
|
||||
|
||||
},
|
||||
jiekou(id){
|
||||
godetail(id) {
|
||||
|
||||
},
|
||||
getjiji(id) {
|
||||
request({
|
||||
url: '/app/rescueInfo/hcOpen',
|
||||
method: 'post',
|
||||
params: {
|
||||
rescueId: id
|
||||
}
|
||||
}).then((res) => {
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: "操作成功"
|
||||
})
|
||||
this.orderList = []
|
||||
this.getlist()
|
||||
this.getthree()
|
||||
}
|
||||
})
|
||||
},
|
||||
getlist() {
|
||||
let data = {
|
||||
rescueId:id,
|
||||
connectionName: this.licenseNum,
|
||||
rescueStatus: this.gindex,
|
||||
pageSize: this.pageSize,
|
||||
pageNum: this.pageNum,
|
||||
}
|
||||
request({
|
||||
url: '/app/rescueInfo/openKc',
|
||||
method: 'post',
|
||||
params:data
|
||||
}).then((res)=>{
|
||||
console.log('jie',res);
|
||||
if(res.code == 200 ){
|
||||
|
||||
this.getlist()
|
||||
url: '/app/rescueInfo/getKcList',
|
||||
method: 'get',
|
||||
params: data
|
||||
}).then((res) => {
|
||||
if (res.code == 200) {
|
||||
if (this.pageNum != 1) {
|
||||
this.orderList = this.orderList.concat(res.rows)
|
||||
} else {
|
||||
this.orderList = res.rows
|
||||
}
|
||||
|
||||
this.totalPages = res.total
|
||||
}
|
||||
})
|
||||
},
|
||||
iditem(id){
|
||||
this.listarr = []
|
||||
this.tabid = id
|
||||
getback() {
|
||||
uni.navigateBack({
|
||||
delta: 1,
|
||||
})
|
||||
},
|
||||
getindex(index) {
|
||||
this.orderList = []
|
||||
this.gindex = index
|
||||
this.getlist()
|
||||
},
|
||||
getback(){
|
||||
uni.navigateBack()
|
||||
},
|
||||
getsx(id){
|
||||
uni.navigateTo({
|
||||
url:'/pages/rescue/initiate?id='+id+'&isAppointment='+this.isAppointment
|
||||
})
|
||||
},
|
||||
goindex(){
|
||||
uni.navigateTo({
|
||||
url:'/pages/index/index'
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.content{
|
||||
width: 100%;
|
||||
background: #EEEEEE;
|
||||
|
||||
}
|
||||
|
||||
.mubu{
|
||||
width: 100%;
|
||||
background: #EEEEEE;
|
||||
}
|
||||
.bil{
|
||||
width: 100%;
|
||||
background-color: white;
|
||||
box-sizing: border-box;
|
||||
padding: 18px;
|
||||
padding-top: 50px;
|
||||
padding-bottom: 0px;
|
||||
}
|
||||
.top-icon{
|
||||
.car-card-line {
|
||||
display: flex;
|
||||
color: #999999;
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
|
||||
}
|
||||
.c-top{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
align-items: center;
|
||||
}
|
||||
.top-white{
|
||||
color: #333333;
|
||||
font-size: 19px;
|
||||
|
||||
.car-card {
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
// margin-top: 40px;
|
||||
width: 70px;
|
||||
height: 28px;
|
||||
line-height: 28px;
|
||||
border-radius: 10px 0 10px 0;
|
||||
background: #edf3fe;
|
||||
color: #4487fa;
|
||||
text-align: center;
|
||||
}
|
||||
.input-box{
|
||||
|
||||
.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%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.hui-input{
|
||||
|
||||
width: 75%;
|
||||
height: 40px;
|
||||
background: #EEEEEE;
|
||||
border-radius: 31px;
|
||||
height: calc(100vh);
|
||||
background-color: #f6f7fc;
|
||||
box-sizing: border-box;
|
||||
padding: 10px;
|
||||
input{
|
||||
width: 100%;
|
||||
}
|
||||
//padding-top: 45px;
|
||||
}
|
||||
.anniu{
|
||||
width: 80px;
|
||||
height: 40px;
|
||||
background: linear-gradient(262deg, #0163A8 0%, #25499C 100%);
|
||||
border-radius: 31px;
|
||||
|
||||
.top-icon {
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
|
||||
padding: 5px 14px;
|
||||
background: #317dfa;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
}
|
||||
|
||||
.dil {
|
||||
background-color: #f6f7fc;
|
||||
box-sizing: border-box;
|
||||
padding: 15px 12px;
|
||||
height: calc(100% - 155px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.h-text {
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
.search-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 16px;
|
||||
color: white;
|
||||
}
|
||||
.tap-lan{
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
|
||||
.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 {
|
||||
margin-left: 10px;
|
||||
width: 78%;
|
||||
height: 56rpx;
|
||||
background: #fff;
|
||||
border-radius: 50px;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
margin-top: 10px;
|
||||
align-items: center;
|
||||
padding: 0px 10px;
|
||||
|
||||
input {
|
||||
margin-left: 5px;
|
||||
flex: 1;
|
||||
width: 0;
|
||||
font-size: 14px;
|
||||
color: #999999;
|
||||
|
||||
}
|
||||
}
|
||||
.tap-box{
|
||||
width: 20%;
|
||||
|
||||
.top-tap {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
.tap-box {
|
||||
width: 33%;
|
||||
font-size: 15px;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
}
|
||||
.gang{
|
||||
width: 50px;
|
||||
height: 5px;
|
||||
background: #4B67BA;
|
||||
border-radius: 4px;
|
||||
margin: 5px auto;
|
||||
|
||||
|
||||
.gang {
|
||||
width: 80%;
|
||||
height: 3px;
|
||||
margin: 1px auto;
|
||||
border-radius: 12px;
|
||||
background: white;
|
||||
}
|
||||
.dadahuii{
|
||||
|
||||
.d-box {
|
||||
width: 100%;
|
||||
background: #EEEEEE;
|
||||
height: calc(80vh);
|
||||
}
|
||||
.boxa{
|
||||
background: #FFFFFF;
|
||||
// height: 100px;
|
||||
background: white;
|
||||
border-radius: 10px;
|
||||
margin-bottom: 15px;
|
||||
box-sizing: border-box;
|
||||
padding: 15px;
|
||||
width: 95%;
|
||||
border-radius: 10px;
|
||||
margin: 10px auto;
|
||||
padding: 8px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
padding-top: 30px;
|
||||
}
|
||||
.box-bs{
|
||||
|
||||
.d-y-top {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
width: 40px;
|
||||
height: 20px;
|
||||
border-radius: 0px 0px 6px 0px;
|
||||
background-color: #339DFF;
|
||||
color: white;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.t-right {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
.bq {
|
||||
width: 55px;
|
||||
height: 20px;
|
||||
background: #FFD7D7;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #FF4C4C;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.bq2 {
|
||||
width: 55px;
|
||||
height: 20px;
|
||||
background: #CDE2FF;
|
||||
border-radius: 4px;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #3289FF;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
|
||||
.d-left {
|
||||
margin-left: 10px;
|
||||
display: flex;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #666666;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.t-left {
|
||||
margin-left: 10px;
|
||||
display: flex;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.x-left {
|
||||
margin-left: 10px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.cc {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.hong {
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #F85021;
|
||||
}
|
||||
|
||||
.ques {
|
||||
margin: 0px auto;
|
||||
margin-top: 40px;
|
||||
width: 80%;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.boxt {
|
||||
// height: 110px;
|
||||
width: 100%;
|
||||
background-color: white;
|
||||
border-radius: 6px;
|
||||
margin-top: 14px;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
box-sizing: border-box;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.boxt-left {
|
||||
width: 80%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.left-lan {
|
||||
width: 50px;
|
||||
height: 25px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
background-color: #207EFE;
|
||||
font-size: 14px;
|
||||
color: white;
|
||||
border-radius: 0px 0px 6px 0px;
|
||||
}
|
||||
|
||||
.text1 {
|
||||
margin-left: 24px;
|
||||
margin-top: 5px;
|
||||
color: #333333;
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.lanzi {
|
||||
font-weight: bold;
|
||||
color: #4C98FF;
|
||||
}
|
||||
|
||||
.text2 {
|
||||
margin-left: 24px;
|
||||
margin-top: 5px;
|
||||
color: #333333;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.boxt-right {
|
||||
width: 20%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.zhtai {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
width: 60px;
|
||||
height: 25px;
|
||||
box-sizing: border-box;
|
||||
background: #FFD7D7;
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: #FF4C4C;
|
||||
font-size: 14px;
|
||||
|
||||
}
|
||||
|
||||
.dianhua {
|
||||
position: absolute;
|
||||
bottom: -110px;
|
||||
right: 10px;
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #3289FF;
|
||||
|
||||
}
|
||||
|
||||
.ticon {
|
||||
|
||||
|
||||
width: 12px;
|
||||
height: 13px;
|
||||
margin-right: 5px;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.aniiu {
|
||||
width: 55px;
|
||||
height: 55px;
|
||||
border-radius: 50%;
|
||||
background: #3289FF;
|
||||
color: white;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.boxa-box {
|
||||
box-sizing: border-box;
|
||||
width: 95%;
|
||||
margin: 8px auto;
|
||||
}
|
||||
|
||||
.boxa {
|
||||
background: #FFFFFF;
|
||||
padding: 15px;
|
||||
box-shadow: 0px 0px 8px -5px #888888;
|
||||
}
|
||||
|
||||
.box-bs {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin: 10px auto;
|
||||
}
|
||||
.zc{
|
||||
font-size: 14px;
|
||||
|
||||
.zc {
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #363636
|
||||
}
|
||||
.hei-title{
|
||||
font-size: 16px;
|
||||
|
||||
.hei-title {
|
||||
margin-left: 10px;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #363636;
|
||||
}
|
||||
.yihang{
|
||||
font-size: 14px;
|
||||
|
||||
.yihang {
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #363636;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.right-box{
|
||||
|
||||
.right-box {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.janniu{
|
||||
width: 120px;
|
||||
height: 30px;
|
||||
background: #FF4D4F;
|
||||
border-radius: 26px;
|
||||
|
||||
.janniu {
|
||||
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{
|
||||
|
||||
.ques {
|
||||
width: 90%;
|
||||
margin: 100px auto;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
@ -43,7 +43,8 @@
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
<image class="start-end" src="@/static/icons/initiate/qiehuan.png" mode="aspectFit"></image>
|
||||
<image v-if="rescueType == 1" class="start-end" src="@/static/icons/initiate/qiehuan.png" mode="aspectFit">
|
||||
</image>
|
||||
</view>
|
||||
<view style="color: #000;font-size: 34rpx;font-weight: bold;padding: 24rpx 0;">救援信息</view>
|
||||
<!-- 填空 -->
|
||||
@ -168,8 +169,7 @@
|
||||
rescueSceneImage: [],
|
||||
rescueTime: '请选择约定时间',
|
||||
carzhi: 0,
|
||||
car: [
|
||||
{
|
||||
car: [{
|
||||
text: '大',
|
||||
id: 1
|
||||
},
|
||||
@ -249,7 +249,7 @@
|
||||
url: '/system/dict-data/page?pageNo=1&pageSize=100&dictType=fee_type',
|
||||
method: 'get'
|
||||
}).then(res => {
|
||||
console.log('res: ',res);
|
||||
console.log('res: ', res);
|
||||
if (res.data && res.data.list && res.data.list.length > 0) {
|
||||
this.manei = res.data.list.map(m => {
|
||||
return {
|
||||
@ -271,7 +271,7 @@
|
||||
url: '/system/dict-data/page?pageNo=1&pageSize=100&dictType=rescue_car_type',
|
||||
method: 'get'
|
||||
}).then(res => {
|
||||
console.log('res: ',res);
|
||||
console.log('res: ', res);
|
||||
if (res.data && res.data.list && res.data.list.length > 0) {
|
||||
this.car = res.data.list.map(m => {
|
||||
return {
|
||||
|
||||
@ -1,29 +1,30 @@
|
||||
<!-- 道路救援 首页-->
|
||||
<template>
|
||||
<view class="content">
|
||||
<view class="dil">
|
||||
<!-- 顶部 -->
|
||||
<view class="content-top" :style="{ paddingTop: homeHeaderPaddingTop + 'px' }">
|
||||
<view class="top-two">
|
||||
<view class="top-left">
|
||||
<view class="left1">
|
||||
<text>日期</text>
|
||||
</view>
|
||||
<view class="left2">
|
||||
<text>{{currentTime || ''}}</text>
|
||||
</view>
|
||||
<!-- 顶部 -->
|
||||
<view class="content-top" :style="{ paddingTop: homeHeaderPaddingTop + 'px' }">
|
||||
<view class="top-two">
|
||||
<view class="top-left">
|
||||
<view class="left1">
|
||||
<text>日期</text>
|
||||
</view>
|
||||
<!-- #ifdef APP-PLUS || H5 -->
|
||||
<view class="top-right">
|
||||
<view style="color: #fff;" class="">{{positionInfo}}</view>
|
||||
<!-- <view class=""> -->
|
||||
<image class="top-right-icon" src="@/static/icons/bottom.png" mode="aspectFit"></image>
|
||||
<!-- <uni-icons type="location-filled" color="#fff" size="16"></uni-icons> -->
|
||||
<!-- </view> -->
|
||||
<view class="left2">
|
||||
<text>{{currentTime || ''}}</text>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
<!-- #ifdef APP-PLUS || H5 -->
|
||||
<view class="top-right">
|
||||
<view style="color: #fff;" class="">{{positionInfo}}</view>
|
||||
<!-- <view class=""> -->
|
||||
<image class="top-right-icon" src="@/static/icons/bottom.png" mode="aspectFit"></image>
|
||||
<!-- <uni-icons type="location-filled" color="#fff" size="16"></uni-icons> -->
|
||||
<!-- </view> -->
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="dil">
|
||||
|
||||
<!-- 标签切换 -->
|
||||
<!-- <view class="yijian">
|
||||
@ -32,10 +33,10 @@
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="box">
|
||||
<view class="xz-box" id="y3" @click="getsxs(6)">
|
||||
<view class="xz-box" id="y1" @click="getsxs(6)">
|
||||
<view class="box-wenzi">事故救援</view>
|
||||
</view>
|
||||
<view class="xz-box" id="y3" @click="getsxs(7)">
|
||||
<view class="xz-box" id="y2" @click="getsxs(7)">
|
||||
<view class="box-wenzi">秩序救援</view>
|
||||
</view>
|
||||
<view class="xz-box" id="y3" @click="getsxs(5)">
|
||||
@ -46,23 +47,17 @@
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="box-tap">
|
||||
<!-- <view class="box-tap">
|
||||
<view class="tap-left">
|
||||
|
||||
<view class="left-img1" @click="getone()" v-if="one == true">
|
||||
<image src="../../static/jyz.png" mode=""></image>
|
||||
<view class="gang"></view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="zi3" style="margin-right: 20px;" v-if="one == false" @click="getone()">救援中</view>
|
||||
|
||||
<view class="left-img1" v-if="one == false" @click="getone()">
|
||||
<image src="../../static/jyls.png" mode=""></image>
|
||||
<view class="gang"></view>
|
||||
</view>
|
||||
|
||||
<!-- <view class="zi3" @click="getone()" v-if="one == true">救援历史</view> -->
|
||||
</view>
|
||||
<view class="tap-right" @click="gohistory()">
|
||||
<view class="zi3">
|
||||
@ -72,13 +67,21 @@
|
||||
<uni-icons color: #666666; type="right" size="18"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="four-box-header">
|
||||
<text class="four-box-header-title">救援推荐</text>
|
||||
|
||||
<view class="four-box-header-extra" @click="gohistory()">
|
||||
<text style="color: #929292;">历史订单</text>
|
||||
<uni-icons type="right" color="#929292"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
<view class="tap-box">
|
||||
<view class="ques" v-if="orderList.length== 0 ">
|
||||
<image src="../../static/quesheng.png" mode=""></image>
|
||||
</view>
|
||||
<view class="boxtList">
|
||||
<view class="boxt" v-for="(item,index) in orderList" :key="index">
|
||||
<view class="boxt" v-for="(item,index) in orderList" :key="index" @click="godetail(item.id)">
|
||||
<view class="orderCardHeader">
|
||||
<text class="orderCardType">{{item.rescueTypeStr}}</text> <text
|
||||
class="orderCardTitle">{{ item.rescuePosition }}</text>
|
||||
@ -131,9 +134,10 @@
|
||||
<view class="orderCardFooter">
|
||||
<text class="orderCardDateTime">{{ item.rescueTime || "" }}</text>
|
||||
<view class="orderCardBtnGroup">
|
||||
<view v-if="role[0] == 'ddzx' && item.rescueStatus <= 2 " @click="getzhipai(item.id)"
|
||||
<view v-if="role[0] == 'ddzx' && item.rescueStatus <= 2 " @click.stop="getzhipai(item.id)"
|
||||
class="orderCardBtnGroupItem">指派司机</view>
|
||||
<view v-if="item.rescueStatus > 2" @click="gettel(item.driverPhoneNum)" class="orderCardBtnGroupItem">
|
||||
<view v-if="item.rescueStatus > 2" @click.stop="gettel(item.driverPhoneNum)"
|
||||
class="orderCardBtnGroupItem">
|
||||
联系司机</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -432,8 +436,7 @@
|
||||
.content {
|
||||
width: 100%;
|
||||
height: calc(100vh);
|
||||
background-color: #F6F6F6;
|
||||
|
||||
background: #F7F8FC;
|
||||
}
|
||||
|
||||
.content-top {
|
||||
@ -590,12 +593,27 @@
|
||||
}
|
||||
}
|
||||
|
||||
.four-box-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 34rpx 0;
|
||||
}
|
||||
|
||||
.four-box-header-title {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.four-box-header-extra {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.dil {
|
||||
background-color: #F6F6F6;
|
||||
background: #F7F8FC;
|
||||
box-sizing: border-box;
|
||||
padding: 45px 12px;
|
||||
padding: 32rpx;
|
||||
}
|
||||
|
||||
.four-box {
|
||||
margin-top: 15px;
|
||||
width: 100%;
|
||||
@ -912,23 +930,37 @@
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
margin-top: 20px;
|
||||
border-radius: 20rpx;
|
||||
background-color: #fff;
|
||||
|
||||
.box-wenzi {
|
||||
font-size: 40rpx;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
|
||||
#y1 {
|
||||
background-image: url('../../static/tc.png');
|
||||
background-image: url('~@/static/images/homeOrderCard/dzf.png');
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
#y2 {
|
||||
background-image: url('../../static/sy.png');
|
||||
background-image: url('~@/static/images/homeOrderCard/dqc.png');
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
#y3 {
|
||||
background-image: url('../../static/dd.png');
|
||||
background-image: url('~@/static/images/homeOrderCard/jyz.png');
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
#y4 {
|
||||
background-image: url('../../static/ht.png');
|
||||
background-image: url('~@/static/images/homeOrderCard/ywc.png');
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
#y5 {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user