DetailsBaseInfo.vue
1.56 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<!-- 基本信息 - 已完成详情、在途详情、待提货详情 -->
<template>
<view class="">
<view class="baseInfo">
<view class="addrCont">
<view class="startAddr">{{itemData.startAddress}}</view>
<view class="endAddr">{{itemData.endAddress}}</view>
</view>
<view class="carInfo">
<view class="line"> <text>任务编号</text> <text class="ritEl">{{itemData.transportTaskId}}</text> </view>
<view class="line"> <text>联系人</text> <text class="ritEl">{{itemData.startHandover}}</text> </view>
<view class="line">
<text>联系电话</text>
<view class="phoneCont">
<text class="ritEl">{{itemData.startHandoverPhone}}</text>
<image @click="callPhone(itemData.startHandoverPhone)" class="phone" src="../../../static/sj_phone.png" mode=""></image>
</view>
</view>
<view class="line"> <text>提货时间</text> <text class="ritEl">{{itemData.planDepartureTime}}</text> </view>
<view class="line"> <text>预计送达时间</text> <text class="ritEl">{{itemData.planArrivalTime}}</text> </view>
</view>
</view>
</view>
</template>
<script setup >
// 获取父组件值、方法
const props = defineProps({
itemData: {
type: Object,
default: () => {}
}
});
// 拨打电话
const callPhone = (phone) => {
uni.makePhoneCall({
phoneNumber: phone
});
}
</script>
<style src="../index.scss" lang="scss"></style>
<style lang="scss">
.phoneCont{
display: flex;
align-items: center;
.phone{
position: relative;
padding-left: 10rpx;
top: -4rpx;
width: 48rpx;
height: 48rpx;
}
}
</style>