@ -0,0 +1,40 @@ | |||
// 文字益处处理 | |||
.text-ellipsis{ | |||
overflow:hidden; //超出的文本隐藏 | |||
text-overflow:ellipsis; //溢出用省略号显示 | |||
white-space:nowrap; //溢出不换行 | |||
} | |||
.text-ellipsis-2{ | |||
overflow: hidden; | |||
text-overflow: ellipsis; | |||
display:-webkit-box; //作为弹性伸缩盒子模型显示。 | |||
-webkit-box-orient:vertical; //设置伸缩盒子的子元素排列方式--从上到下垂直排列 | |||
-webkit-line-clamp:2; //显示的行 | |||
} | |||
.text-ellipsis-3{ | |||
overflow: hidden; | |||
text-overflow: ellipsis; | |||
display:-webkit-box; //作为弹性伸缩盒子模型显示。 | |||
-webkit-box-orient:vertical; //设置伸缩盒子的子元素排列方式--从上到下垂直排列 | |||
-webkit-line-clamp:3; //显示的行 | |||
} | |||
.share{ | |||
padding: 0; | |||
margin: 0; | |||
background-color: #fff; | |||
display: flex !important; | |||
flex-direction: column !important; | |||
justify-content: center !important; | |||
align-items: center !important; | |||
font-size: 26rpx; | |||
} | |||
.share::after{ | |||
border: none; | |||
padding: 0; | |||
margin: 0; | |||
width: 0; | |||
height: 0; | |||
} |
@ -1,81 +0,0 @@ | |||
<template> | |||
<view @click="$emit('confirm')" :style="{ | |||
position: 'fixed', | |||
display: 'flex', | |||
justifyContent: 'center', | |||
alignItems: 'center', | |||
width: '100vw', | |||
bottom: bottom | |||
}"> | |||
<button :style="{ | |||
color: color, | |||
backgroundColor: backgroundColor, | |||
fontSize: fontSize, | |||
width: width, | |||
height: height, | |||
borderRadius: borderRadius | |||
}"> | |||
{{ text }} | |||
</button> | |||
</view> | |||
</template> | |||
<script> | |||
export default { | |||
props: { | |||
color: { | |||
default: '#000000' // 设置默认颜色值 | |||
}, | |||
backgroundColor: { | |||
default: '#FFFFFF' // 设置默认背景颜色 | |||
}, | |||
fontSize: { | |||
default: '36rpx' // 设置默认字体大小 | |||
}, | |||
text: { | |||
default: '按钮' // 设置默认文本内容 | |||
}, | |||
width: { | |||
default: '150rpx' // 设置默认宽度 | |||
}, | |||
height: { | |||
default: '60rpx' // 设置默认高度 | |||
}, | |||
borderRadius: { | |||
default: '40rpx' // 设置默认高度 | |||
}, | |||
bottom: { | |||
default: '40rpx' // 设置默认距离底部高度 | |||
}, | |||
}, | |||
data() { | |||
return { | |||
} | |||
}, | |||
methods: { | |||
} | |||
} | |||
</script> | |||
<style scoped lang="less"> | |||
// .container { | |||
// position: fixed; | |||
// display: flex; | |||
// justify-content: center; | |||
// /* 水平居中 */ | |||
// align-items: center; | |||
// /* 垂直居中 */ | |||
// width: 100%; | |||
// /* 使容器宽度覆盖整个屏幕 */ | |||
// } | |||
button { | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
} | |||
</style> |
@ -0,0 +1,116 @@ | |||
<template> | |||
<!-- 联系客服弹框 --> | |||
<uv-overlay :show="show" @click="close"> | |||
<view class="warp"> | |||
<view class="rect" @tap.stop> | |||
<view class="title">联系客服</view> | |||
<view class="center">确定拨打客服电话?</view> | |||
<view class="bottom"> | |||
<view class="btn1" | |||
@click="close"> | |||
取消 | |||
</view> | |||
<view class="btn2" | |||
@click="confirm"> | |||
确定 | |||
</view> | |||
</view> | |||
</view> | |||
</view> | |||
</uv-overlay> | |||
</template> | |||
<script> | |||
export default { | |||
data() { | |||
return { | |||
show: false, | |||
phone:'', | |||
} | |||
}, | |||
onLoad() { | |||
this.getCustomPhone() | |||
}, | |||
methods: { | |||
getCustomPhone(){ | |||
this.$api('customUser', {}, res => { | |||
this.phone = res.result.phone | |||
}) | |||
}, | |||
open() { | |||
this.show = true | |||
}, | |||
close() { | |||
this.show = false | |||
}, | |||
// 拨打电话 | |||
confirm() { | |||
this.show = false | |||
uni.makePhoneCall({ | |||
phoneNumber: this.phone, | |||
success() { | |||
console.log('安卓拨打成功'); | |||
}, | |||
fail() { | |||
console.log('安卓拨打失败'); | |||
} | |||
}) | |||
}, | |||
} | |||
} | |||
</script> | |||
<style scoped lang="scss"> | |||
.warp { | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
height: 100%; | |||
} | |||
.rect { | |||
width: 600rpx; | |||
height: 300rpx; | |||
background-color: #fff; | |||
border-radius: 20rpx; | |||
overflow: hidden; | |||
.title { | |||
padding: 10rpx 0 0 15rpx; | |||
background-color: $uni-color; | |||
color: #FFF; | |||
text-align: left; | |||
width: 100%; | |||
height: 18%; | |||
font-size: 36rpx; | |||
} | |||
.center { | |||
height: 40%; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
font-size: 36rpx; | |||
} | |||
.bottom { | |||
display: flex; | |||
justify-content: center; | |||
gap: 50rpx; | |||
view{ | |||
height: 60rpx; | |||
line-height: 60rpx; | |||
padding: 0 50rpx; | |||
border-radius: 30rpx; | |||
} | |||
.btn1{ | |||
background-color: #fff; | |||
} | |||
.btn2{ | |||
background-color: $uni-color; | |||
color: #fff; | |||
} | |||
} | |||
} | |||
</style> |