157 lines
4.0 KiB
Vue
157 lines
4.0 KiB
Vue
<template>
|
||
<view class="addrDetails uni-page">
|
||
<u-navbar title="地址详情" autoBack bg-color="#fff0e7" placeholder></u-navbar>
|
||
<view class="v-card">
|
||
<view class="v-card-item title">
|
||
{{ detailsInfo.title }}
|
||
</view>
|
||
<view class="v-card-item address">
|
||
<text>地址:</text>
|
||
<text style="padding: 0 40rpx;"> {{ address }}</text>
|
||
<Copy :text="address"></Copy>
|
||
</view>
|
||
<view class="v-card-item">
|
||
<text>电话:</text>
|
||
<text class="phone" style="padding: 0 40rpx;">
|
||
<view v-if="phone[0]">
|
||
<text style="padding-right: 40rpx;">{{ phone[0] }}</text>
|
||
<u-icon disabled name="phone-fill" color="#14F269" size="60rpx" @click="callPhone(phone[0])"></u-icon>
|
||
</view>
|
||
<view v-if="phone[1]">
|
||
<text style="padding-right: 40rpx;">{{ phone[1] }}</text>
|
||
<u-icon name="phone-fill" color="#14F269" size="60rpx" @click="callPhone(phone[1])"></u-icon>
|
||
</view>
|
||
</text>
|
||
<!-- <Copy :text="detailsInfo.province + ''+ detailsInfo.address"></Copy> -->
|
||
|
||
</view>
|
||
<view class="v-card-item">
|
||
<text class="label">地址是否经过核实:</text>
|
||
<view class="v-type" style="padding: 0 40rpx;">
|
||
<u-checkbox :checked="detailsInfo.is_check === 1" activeColor="#E08745" label="已核实" shape="circle"></u-checkbox>
|
||
</view>
|
||
</view>
|
||
<view class="v-card-item">
|
||
<text class="label">能否通信:</text>
|
||
<view class="v-type" style="padding: 0 40rpx;">
|
||
<u-checkbox disabled :checked="detailsInfo.is_phone === 1" activeColor="#E08745" label="已核实" shape="circle"></u-checkbox>
|
||
</view>
|
||
</view>
|
||
<view class="v-card-item">
|
||
<text class="label">支持的邮寄类型:</text>
|
||
<view class="v-type" style="padding: 0 40rpx;" v-if="loading">
|
||
<u-checkbox v-if="detailsInfo.mail_type[0]" disabled activeColor="#E08745" label="明信片" shape="circle" ></u-checkbox>
|
||
<u-checkbox v-if="detailsInfo.mail_type[1]" disabled activeColor="#E08745" label="普通信封" shape="circle"></u-checkbox>
|
||
</view>
|
||
</view>
|
||
<view class="v-card-item">
|
||
<text class="label">支持的邮寄方式:</text>
|
||
<view class="v-type" style="padding: 0 40rpx;" v-if="loading">
|
||
<u-checkbox v-if="detailsInfo.mail_action[0]" disabled activeColor="#E08745" label="平信" shape="circle"></u-checkbox>
|
||
<u-checkbox v-if="detailsInfo.mail_action[1]" disabled activeColor="#E08745" label="挂号信" shape="circle"></u-checkbox>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { getAddrDetails } from '@/request/yyf.js';
|
||
import Copy from '@/components/Copy/Copy.vue';
|
||
export default {
|
||
components: {
|
||
Copy
|
||
},
|
||
data() {
|
||
return {
|
||
params: {
|
||
id: ''
|
||
},
|
||
detailsInfo: {},
|
||
phone: '',
|
||
address: '',
|
||
loading: false
|
||
}
|
||
},
|
||
onLoad() {
|
||
let { id } = this.$Route.query;
|
||
this.params.id = id;
|
||
this.getDetails();
|
||
},
|
||
methods: {
|
||
async getDetails() {
|
||
const { data } = await getAddrDetails(this.params);
|
||
if(data.code === 1) {
|
||
this.loading = true;
|
||
|
||
this.detailsInfo = data.data;
|
||
this.address = this.detailsInfo.province + ' ' + this.detailsInfo.address;
|
||
if(data.data.phone[0]) {
|
||
this.phone = data.data.phone[0].split('，');
|
||
}
|
||
}
|
||
},
|
||
callPhone(phone) {
|
||
uni.makePhoneCall({
|
||
phoneNumber: phone
|
||
});
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.v-card {
|
||
padding: 40rpx;
|
||
background-color: #fff;
|
||
border-radius: 40rpx;
|
||
|
||
.v-card-item {
|
||
padding: 10rpx 0;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.label {
|
||
width: 200rpx;
|
||
}
|
||
}
|
||
|
||
.title {
|
||
font-size: 32rpx;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.phone {
|
||
flex: 1;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
view {
|
||
display: flex;
|
||
align-items: center;
|
||
}
|
||
}
|
||
|
||
.v-type {
|
||
display: flex;
|
||
}
|
||
|
||
::v-deep .u-checkbox {
|
||
white-space: nowrap;
|
||
min-width: 160rpx;
|
||
text {
|
||
color: #606266 !important;
|
||
}
|
||
|
||
.u-checkbox__icon-wrap {
|
||
background: #E08745 !important;
|
||
border-color: #E08745 !important;
|
||
|
||
.u-icon__icon, .uicon-checkbox-mark {
|
||
color: #fff !important;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style>
|