瑶都万能墙
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

284 lines
4.5 KiB

<template>
<view class="item" @click="$emit('click')">
<!-- <image :src="item.imageTitle"
@click.stop="previewImage([item.imageTitle])"
mode="aspectFill"></image> -->
<!-- <view class="text">
<view class="title">
{{ item.title }}
</view>
<view class="createBy">
{{ item.num }}余座
{{ item.startTime }}出发
</view>
<view class="createBy">
{{ item.startAddress }}
{{ item.endAddress }}
</view>
<view class="createBy">
<view class="">
{{ $dayjs(item.createTime).format('YYYY-MM-DD') }}
</view>
<callPhone
style="margin-left: auto;"
:phone="item.phone"
title="司机"/>
</view>
</view> -->
<view class="zhaoche">
<view class="touxinag">
<image :src="item.imageTitle" mode="aspectFill"></image>
</view>
<view class="box">
<view class="chezhaoren">
<uv-icon name="car-fill" color="#2979ff" size="50"></uv-icon>
<!-- 车找人 -->{{item.createBy}}
</view>
<view class="lianxi">
<!-- <uv-icon name="phone-fill" color="#fff" size="40"></uv-icon>
联系 -->
<callPhone
style="margin-left: auto;"
:phone="item.phone"
type="2"
:phoneTitle="item.title"
:pid="item.id"
title="应聘"/>
</view>
</view>
</view>
<view class="address">
<view class="shi">
<view class="zhi">
{{item.startAddress}}
</view>
</view>
<view class="oo">
</view>
<view class="ads">
<view class="zhon">
</view>
<view class="zhi">
{{item.endAddress}}
</view>
</view>
</view>
<view class="pepo">
空位{{item.num}}
</view>
<!-- <view class="time">
出发时间{{item.startTime}}
</view> -->
<view class="Vehicleinformation">
<view class="chexing">
车型suv
</view>
<view class="Licenseplate">
车牌湘A.9999
</view>
</view>
</view>
</template>
<script>
import mixinsSex from '@/mixins/sex.js'
export default {
mixins: [mixinsSex],
props: ['item'],
data() {
return {
};
},
methods: {
// callPhone() {
// uni.makePhoneCall({
// phoneNumber: this.item.phone
// })
// },
// callPhone() {
// uni.makePhoneCall({
// phoneNumber: this.item.userPhone,
// success() {
// console.log('安卓拨打成功');
// },
// fail() {
// console.log('安卓拨打失败');
// }
// })
// },
},
}
</script>
<style lang="scss" scoped>
.item {
padding: 15rpx;
background-color: #fff;
overflow: hidden;
border-radius: 10rpx;
color: #777;
// display: flex;
font-size: 24rpx;
margin: 30rpx 0;
position: relative;
.zhaoche {
width: 100%;
margin: 20rpx 10rpx;
display: flex;
justify-content: space-between;
.touxinag {
height: 150rpx;
width: 150rpx;
image {
width: 100%;
height: 100%;
}
}
.box {
margin-top: 20rpx;
width: 70%;
display: flex;
justify-content: space-around;
// background-color: gold;
.chezhaoren {
display: flex;
justify-content: center;
align-items: center;
margin-right: auto;
margin-left: 10rpx;
border: 1rpx solid $uni-color;
height: 40rpx;
padding: 16rpx;
color: $uni-color;
border-radius: 10rpx;
}
.lianxi {
// color: #fff;
// background-color: $uni-color;
// height: 70rpx;
// display: flex;
// justify-content: center;
// align-items: center;
// width: 120rpx;
// border-radius: 15rpx;
// margin: 0rpx 20rpx;
}
}
}
.address {
display: flex;
margin: 0rpx 10rpx;
align-items: center;
.shi {
margin-right: 10rpx;
background-color: $uni-color;
color: white;
width: 30rpx;
height: 30rpx;
padding: 5rpx;
border-radius: 50%;
text-align: center;
}
.zhi {
margin-top: 5rpx;
}
.oo {
margin: 0rpx 5rpx;
}
}
.ads {
display: flex;
margin: 10rpx 10rpx;
.zhon {
margin-right: 10rpx;
background-color: red;
color: white;
width: 30rpx;
height: 30rpx;
padding: 5rpx;
border-radius: 50%;
text-align: center;
}
}
.pepo{
margin: 10rpx 10rpx;
}
.time {
margin: 10rpx 10rpx;
}
.Vehicleinformation {
margin: 10rpx 10rpx;
// display: flex;
.chexing {
}
.Licenseplate {
margin: 5rpx 0rpx;
}
}
.chezhuxinxi {
display: flex;
margin: 10rpx 10rpx;
.sex {
margin-top: 5rpx;
}
.name {
margin-left: 8rpx;
}
}
}
</style>