2023-08-22 16:01:58 +08:00
|
|
|
<template>
|
|
|
|
<view>
|
|
|
|
<u-sticky bgColor="#0122C7" style="width: 100vw">
|
|
|
|
<u-tabs :list="tabLists" @change="sectionChange" lineColor="#fff" :scrollable="false" lineWidth="40"
|
|
|
|
inactiveStyle="color:#fff" activeStyle="color:#fff"></u-tabs>
|
|
|
|
</u-sticky>
|
|
|
|
<view class="serch">
|
2023-08-23 11:35:09 +08:00
|
|
|
<u-search placeholder="输入车牌号进行搜索" :show-action="true" bg-color="white" v-model="keywords"></u-search>
|
2023-08-22 16:01:58 +08:00
|
|
|
</view>
|
|
|
|
|
|
|
|
<view v-if="curNow==0" class="personnel_list">
|
2023-08-23 11:35:09 +08:00
|
|
|
<view v-if="dataList.length">
|
|
|
|
<view class="cards" v-for="item,index in dataList" :key="index">
|
|
|
|
<view class="cards_head">
|
|
|
|
<text>XSDSDSD</text>
|
|
|
|
</view>
|
|
|
|
<view class="cards_content">
|
|
|
|
<view class="right">
|
|
|
|
<view class="li">
|
|
|
|
<text>车牌号: </text>
|
|
|
|
<text> { item.name }</text>
|
|
|
|
</view>
|
|
|
|
<view class="li">
|
|
|
|
<text>行驶总里程: </text>
|
|
|
|
<text>{ item.phone }</text>
|
|
|
|
<view style="float: right;">
|
|
|
|
<u-checkbox-group v-model="checked">
|
|
|
|
<u-checkbox active-color="#0122C7" :label="item" :name="item" shape="square"
|
|
|
|
label=""></u-checkbox>
|
|
|
|
</u-checkbox-group>
|
2023-08-22 16:01:58 +08:00
|
|
|
|
2023-08-23 11:35:09 +08:00
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="li">
|
|
|
|
<text>本公司签约时间: </text>
|
|
|
|
<text> 所属片区 </text>
|
2023-08-22 16:01:58 +08:00
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
2023-08-23 11:35:09 +08:00
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
2023-08-24 18:32:34 +08:00
|
|
|
<view v-if="dataList.length==0&&!isNewCheck">
|
2023-08-23 11:35:09 +08:00
|
|
|
<view class="empty">
|
|
|
|
<view>
|
|
|
|
当前没有可以签约的的车辆,快去签约新车吧!
|
|
|
|
</view>
|
2023-08-24 18:32:34 +08:00
|
|
|
<u-button @click="showPop=true" type="primary" style="background-color: #0122C7;border: none;"
|
|
|
|
class="btn">
|
|
|
|
签约新车</u-button>
|
2023-08-22 16:01:58 +08:00
|
|
|
</view>
|
|
|
|
</view>
|
2023-08-24 18:32:34 +08:00
|
|
|
<view style="padding: 0 60rpx;" v-if="isNewCheck">
|
|
|
|
你已发起租赁{{newCarNum}}两新车的申请,后台正在为您加急处理中,请稍后~~
|
|
|
|
</view>
|
2023-08-22 16:01:58 +08:00
|
|
|
</view>
|
|
|
|
|
|
|
|
<view v-else>
|
2023-08-24 18:32:34 +08:00
|
|
|
|
|
|
|
<view class="personnel_list" @click="toDetail('/subpkg/property/vehicle_a')">
|
2023-08-22 16:01:58 +08:00
|
|
|
<view class="cards">
|
|
|
|
<view class="cards_head">
|
|
|
|
<text>车牌号</text>
|
|
|
|
|
|
|
|
</view>
|
|
|
|
<view class="cards_content">
|
|
|
|
<view class="right">
|
|
|
|
<view class="li">
|
|
|
|
<text>行驶总里程: </text>
|
|
|
|
<text> { item.name }</text>
|
|
|
|
</view>
|
|
|
|
<view class="li">
|
|
|
|
<text>本公司签约时间: </text>
|
|
|
|
<text>{ item.phone }</text>
|
|
|
|
</view>
|
|
|
|
<view class="li">
|
|
|
|
<text>承租公司: </text>
|
|
|
|
<text> 所属片区 </text>
|
|
|
|
</view>
|
|
|
|
<view class="li">
|
|
|
|
<text>负责人: </text>
|
|
|
|
<text> 所属片区 </text>
|
|
|
|
</view>
|
|
|
|
<view class="li">
|
|
|
|
<text>联系方式: </text>
|
|
|
|
<text> 所属片区 </text>
|
|
|
|
</view>
|
|
|
|
<view class="li">
|
|
|
|
<text>所属区域: </text>
|
|
|
|
<text> 所属片区 </text>
|
|
|
|
</view>
|
|
|
|
<view class="li">
|
|
|
|
<text>承租时间: </text>
|
|
|
|
<text> 所属片区 </text>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
</view>
|
2023-08-24 18:32:34 +08:00
|
|
|
<u-modal :show="showPop" @close="showPop=false" @confirm="confirm" :closeOnClickOverlay="true"
|
|
|
|
:title="newcarTit">
|
|
|
|
<view class="slot-content">
|
|
|
|
<u--input placeholder="请输入内容" type="number" v-model="newCarNum"></u--input>
|
|
|
|
</view>
|
|
|
|
</u-modal>
|
|
|
|
<view class="" v-if='!curNow && dataList.length>0'>
|
|
|
|
<view class="add" @click="showPop=true">
|
|
|
|
<u-icon name="plus-circle" color="#0122C7" size="60"></u-icon>
|
|
|
|
签约新车
|
|
|
|
</view>
|
|
|
|
<mybtn position="position" text="签约" @click="signFn">
|
|
|
|
<u-icon name="edit-pen-fill" color="white" size="20"></u-icon>
|
|
|
|
</mybtn>
|
|
|
|
</view>
|
2023-08-22 16:01:58 +08:00
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
import mybtn from "@/components/mybtn/mybtn.vue"
|
2023-08-23 11:35:09 +08:00
|
|
|
import {
|
|
|
|
Toast
|
|
|
|
} from "../../libs/uniApi";
|
|
|
|
// Toast("请至少选择一辆车")
|
2023-08-22 16:01:58 +08:00
|
|
|
export default {
|
|
|
|
components: {
|
|
|
|
mybtn
|
|
|
|
},
|
|
|
|
name: "vehicle",
|
|
|
|
data() {
|
|
|
|
return {
|
2023-08-24 18:32:34 +08:00
|
|
|
isNewCheck: false,
|
|
|
|
showPop: false,
|
|
|
|
dataList: [1, 2, 3],
|
2023-08-22 16:01:58 +08:00
|
|
|
tabLists: [{
|
|
|
|
name: '未出租',
|
|
|
|
}, {
|
|
|
|
name: '已出租'
|
|
|
|
}, ],
|
|
|
|
curNow: 0,
|
|
|
|
checked: 0,
|
|
|
|
keywords: "",
|
2023-08-24 18:32:34 +08:00
|
|
|
newCarNum: "",
|
|
|
|
newcarTit: "请输入你想要的车辆数量"
|
2023-08-22 16:01:58 +08:00
|
|
|
|
|
|
|
|
|
|
|
};
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
signFn() {
|
2023-08-23 11:35:09 +08:00
|
|
|
console.log(this.checked)
|
|
|
|
if (!this.checked.length) Toast("请至少选择一辆车")
|
|
|
|
else {
|
|
|
|
this.toDetail("/subpkg/property/chosseCompany")
|
|
|
|
}
|
2023-08-22 16:01:58 +08:00
|
|
|
},
|
2023-08-24 18:32:34 +08:00
|
|
|
confirm() {
|
|
|
|
if (!this.newCarNum) return
|
|
|
|
console.log(this.newCarNum)
|
|
|
|
this.showPop = false
|
|
|
|
this.isNewCheck = true
|
|
|
|
// this.newCarNum = ""
|
2023-08-22 16:01:58 +08:00
|
|
|
|
2023-08-24 18:32:34 +08:00
|
|
|
},
|
2023-08-22 16:01:58 +08:00
|
|
|
toDetail(url) {
|
|
|
|
uni.navigateTo({
|
|
|
|
url
|
|
|
|
})
|
|
|
|
},
|
|
|
|
sectionChange(index) {
|
|
|
|
this.curNow = index.index;
|
|
|
|
console.log(this.curNow)
|
|
|
|
// this.getOrderList()
|
|
|
|
},
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style lang="scss">
|
|
|
|
.serch {
|
|
|
|
margin: 28rpx 28rpx 0 28rpx;
|
|
|
|
}
|
|
|
|
|
2023-08-24 18:32:34 +08:00
|
|
|
.add {
|
|
|
|
position: fixed;
|
|
|
|
bottom: 100rpx;
|
|
|
|
right: 0;
|
|
|
|
}
|
|
|
|
|
2023-08-22 16:01:58 +08:00
|
|
|
.personnel_list {
|
|
|
|
padding: 28rpx 0;
|
|
|
|
margin-bottom: 130rpx;
|
|
|
|
|
2023-08-24 18:32:34 +08:00
|
|
|
|
|
|
|
|
2023-08-23 11:35:09 +08:00
|
|
|
.empty {
|
2023-08-24 18:32:34 +08:00
|
|
|
padding-top: 200rpx;
|
2023-08-23 11:35:09 +08:00
|
|
|
text-align: center;
|
|
|
|
|
|
|
|
.btn {
|
|
|
|
width: 30vw;
|
|
|
|
margin-top: 10rpx;
|
2023-08-24 18:32:34 +08:00
|
|
|
margin: 10rpx auto;
|
2023-08-23 11:35:09 +08:00
|
|
|
|
|
|
|
}
|
|
|
|
|
2023-08-24 18:32:34 +08:00
|
|
|
|
|
|
|
|
2023-08-23 11:35:09 +08:00
|
|
|
// height: 80vh;
|
|
|
|
// background-color: red;
|
|
|
|
}
|
|
|
|
|
2023-08-22 16:01:58 +08:00
|
|
|
.cards {
|
|
|
|
margin: 0 auto;
|
|
|
|
margin-bottom: 28rpx;
|
|
|
|
width: 694rpx;
|
|
|
|
background: #ffffff;
|
|
|
|
border-radius: 30rpx;
|
|
|
|
opacity: 1;
|
|
|
|
overflow: hidden;
|
|
|
|
// box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.6);
|
|
|
|
|
|
|
|
.cards_head {
|
|
|
|
padding: 28rpx;
|
|
|
|
background-color: $theme-oa-color;
|
|
|
|
color: white;
|
|
|
|
height: 100rpx;
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
}
|
|
|
|
|
|
|
|
.cards_content {
|
|
|
|
padding: 10rpx 28rpx;
|
|
|
|
display: flex;
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
|
|
.left {
|
|
|
|
text-align: center;
|
|
|
|
// padding: 15rpx 25rpx;
|
|
|
|
padding-top: 20rpx;
|
|
|
|
|
|
|
|
width: 160rpx;
|
|
|
|
background-color: $theme-oa-color;
|
|
|
|
color: white;
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
|
|
.cir {
|
|
|
|
width: 120rpx;
|
|
|
|
height: 120rpx;
|
|
|
|
background-color: #ffffff;
|
|
|
|
margin-left: 25rpx;
|
|
|
|
border-radius: 120rpx;
|
|
|
|
position: relative;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
.right {
|
|
|
|
display: flex;
|
|
|
|
flex-direction: column;
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
|
|
.li {
|
|
|
|
margin: 10rpx 0;
|
|
|
|
width: 85vw;
|
|
|
|
|
|
|
|
.check_box {
|
|
|
|
// background-color: #ff0000;
|
|
|
|
// color: red;
|
|
|
|
}
|
|
|
|
|
|
|
|
// background-color: red;
|
|
|
|
text:nth-child(1) {
|
|
|
|
margin-right: 20rpx;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</style>
|