|
|
@@ -83,10 +83,6 @@
|
|
|
|
|
|
<!-- 底部操作栏 -->
|
|
|
<view class="bottom-bar" v-if="showBottomBar">
|
|
|
- <view class="service-btn" @click="contactService">
|
|
|
- <!-- 假设有一个客服图标 -->
|
|
|
- <u-icon name="server-man" size="60" color="#666"></u-icon>
|
|
|
- </view>
|
|
|
<view class="btn-group">
|
|
|
<u-button v-if="orderInfo.showComplaint == 1" shape="circle" plain :custom-style="btnStyle"
|
|
|
@click="handleAction('complaint')">投诉</u-button>
|
|
|
@@ -104,13 +100,38 @@
|
|
|
|
|
|
<!-- 占位符 -->
|
|
|
<view style="height: 120rpx;" v-if="showBottomBar"></view>
|
|
|
+
|
|
|
+ <!-- 客服按钮 -->
|
|
|
+ <FloatingDrag :width="126" :height="140" :initial-position="servicePosition"
|
|
|
+ @position-change="handlePositionChange">
|
|
|
+ <!-- #ifdef MP-ALIPAY -->
|
|
|
+ <button class="service-btn" @click="navigateToCustomerService">
|
|
|
+ <image src="/static/img/kf.png" mode="widthFix" style="width: 126rpx; height: 140rpx"></image>
|
|
|
+ </button>
|
|
|
+ <!-- #endif -->
|
|
|
+ <!-- #ifndef MP-ALIPAY -->
|
|
|
+ <button class="service-btn" open-type="contact">
|
|
|
+ <image src="/static/img/kf.png" mode="widthFix" style="width: 126rpx; height: 140rpx"></image>
|
|
|
+ </button>
|
|
|
+ <!-- #endif -->
|
|
|
+ </FloatingDrag>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+ import FloatingDrag from "@/components/floating-drag.vue";
|
|
|
export default {
|
|
|
+ components: {
|
|
|
+ FloatingDrag
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
+ // 客服按钮位置
|
|
|
+ servicePosition: {
|
|
|
+ left: "auto",
|
|
|
+ right: 0,
|
|
|
+ bottom: "20%",
|
|
|
+ },
|
|
|
conditionTypeMap: {
|
|
|
'1': '良好',
|
|
|
'2': '中等',
|
|
|
@@ -205,12 +226,16 @@
|
|
|
// 跳转协商历史页面 (如果有)
|
|
|
uni.showToast({ title: '协商历史功能开发中', icon: 'none' });
|
|
|
},
|
|
|
- contactService() {
|
|
|
+ navigateToCustomerService() {
|
|
|
// 联系客服
|
|
|
uni.navigateTo({
|
|
|
- url: '/pages/service/index'
|
|
|
+ url: '/pages/customer-service/index'
|
|
|
});
|
|
|
},
|
|
|
+ // 处理位置变更
|
|
|
+ handlePositionChange(position) {
|
|
|
+ this.servicePosition = position;
|
|
|
+ },
|
|
|
handleAction(type) {
|
|
|
switch (type) {
|
|
|
case 'cancel':
|
|
|
@@ -247,6 +272,15 @@
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
+ .service-btn {
|
|
|
+ height: max-content;
|
|
|
+ background-color: transparent;
|
|
|
+ padding: 0;
|
|
|
+ &::after {
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
.refund-detail-page {
|
|
|
min-height: 100vh;
|
|
|
background-color: #F5F5F5;
|
|
|
@@ -278,7 +312,6 @@
|
|
|
|
|
|
.refund-amount-box {
|
|
|
margin-top: 30rpx;
|
|
|
- border-top: 1rpx solid #eee;
|
|
|
padding-top: 30rpx;
|
|
|
|
|
|
.amount-row {
|
|
|
@@ -316,7 +349,7 @@
|
|
|
|
|
|
.goods-cover {
|
|
|
width: 140rpx;
|
|
|
- height: 140rpx;
|
|
|
+ height: 160rpx;
|
|
|
border-radius: 8rpx;
|
|
|
margin-right: 20rpx;
|
|
|
flex-shrink: 0;
|
|
|
@@ -428,6 +461,8 @@
|
|
|
.btn-group {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
+ justify-content: flex-end;
|
|
|
+ width: 100%;
|
|
|
}
|
|
|
}
|
|
|
}
|
