|
@@ -0,0 +1,132 @@
|
|
|
+<style lang="less">
|
|
|
+.custome-service-panel {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ bottom: 0;
|
|
|
+ right: 0;
|
|
|
+ left: 0;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ z-index: 2;
|
|
|
+ &.show {
|
|
|
+ display: flex;
|
|
|
+ }
|
|
|
+ &.hide {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .panel-mask {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ right: 0;
|
|
|
+ left: 0;
|
|
|
+ bottom: 0;
|
|
|
+ background: rgba(0, 0, 0, 0.2);
|
|
|
+ }
|
|
|
+ .content {
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0px;
|
|
|
+ text-align: center;
|
|
|
+ border-radius: 16px 16px 0px 0px;
|
|
|
+ background: #ffffff;
|
|
|
+ width: 100%;
|
|
|
+ height: 296rpx;
|
|
|
+
|
|
|
+ .sp-text {
|
|
|
+ height: 100rpx;
|
|
|
+ color: #1db1b2;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ line-height: 100rpx;
|
|
|
+ }
|
|
|
+ .dir {
|
|
|
+ height: 16rpx;
|
|
|
+ background: #f1f4f6;
|
|
|
+ }
|
|
|
+ .text {
|
|
|
+ color: #8b949e;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ line-height: 100rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
|
|
+
|
|
|
+<template>
|
|
|
+ <cover-view
|
|
|
+ class="{{'custome-service-panel '+(show?'show':'hide')}}"
|
|
|
+ v-on:touchmove.stop="stopProgration"
|
|
|
+ >
|
|
|
+ <cover-view
|
|
|
+ class="panel-mask"
|
|
|
+ v-on:click="closePanel"
|
|
|
+ ></cover-view>
|
|
|
+ <cover-view class="content">
|
|
|
+ <cover-view>
|
|
|
+ <cover-view
|
|
|
+ class="sp-text"
|
|
|
+ @click="callPhone"
|
|
|
+ >
|
|
|
+ 呼叫 {{ phone }}
|
|
|
+ </cover-view>
|
|
|
+ <cover-view class="dir"></cover-view>
|
|
|
+ <cover-view
|
|
|
+ class="text"
|
|
|
+ v-on:click="closePanel"
|
|
|
+ >取消</cover-view>
|
|
|
+ </cover-view>
|
|
|
+ </cover-view>
|
|
|
+ </cover-view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import wepy from '@wepy/core'
|
|
|
+import config from '@config'
|
|
|
+import { mapState } from '@wepy/x'
|
|
|
+import store from '@/store'
|
|
|
+
|
|
|
+wepy.component({
|
|
|
+ store,
|
|
|
+ data: {
|
|
|
+ h5StaticPath: config.h5StaticPath,
|
|
|
+ h5Origin: config.h5Origin,
|
|
|
+ showLink: `${config.h5Origin}/#/wx-external-link`
|
|
|
+ },
|
|
|
+ props: {
|
|
|
+ show: Boolean,
|
|
|
+ phone: String
|
|
|
+
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState({ userInfo: state => state.user.userInfo })
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ callPhone() {
|
|
|
+ let _this = this
|
|
|
+ wx.makePhoneCall({
|
|
|
+ phoneNumber: this.phone,
|
|
|
+ complete() {
|
|
|
+ _this.$emit('custome-service-close', false)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ closePanel() {
|
|
|
+ this.$emit('custome-service-close', false)
|
|
|
+ },
|
|
|
+ stopProgration() { }
|
|
|
+ }
|
|
|
+})
|
|
|
+</script>
|
|
|
+
|
|
|
+
|
|
|
+<config>
|
|
|
+{
|
|
|
+
|
|
|
+}
|
|
|
+</config>
|