| | |
| | | <!-- 名片展示区域 --> |
| | | <view class="content"> |
| | | <view class="business-card"> |
| | | <image style="width: 100%;" @tap="viewPicture(businessImage)" mode="widthFix" :src="businessImage"> |
| | | <image class="card-image" @tap="viewPicture(businessImage)" mode="widthFix" :src="businessImage"> |
| | | </image> |
| | | </view> |
| | | |
| | |
| | | <view class="btn" @click="switchCard()">切换名片</view> |
| | | <button open-type="share" class="btn">分享名片</button> |
| | | <view class="btn" @click="topUpCard()">置顶名片</view> |
| | | <view class="btn" @click="gotoChatList()">聊天记录</view> |
| | | </view> |
| | | |
| | | <!-- 数据统计区域 --> |
| | |
| | | <text class="close" @click="closePopup">×</text> |
| | | </view> |
| | | <scroll-view scroll-y="true" class="card-scroll"> |
| | | <view class="card-item" v-for="(card, index) in businessList" :key="index" |
| | | @click="selectCard(index)"> |
| | | <view :class="{active: card.is_default==1}" class="card-preview"> |
| | | <image style="width: 650rpx;border-radius: 12rpx;" :src="card.mp" mode="widthFix"></image> |
| | | <image v-show="card.is_default==1" src="@/static/icon/mrmp.png" class="mrmp"> |
| | | </image> |
| | | <uni-swipe-action> |
| | | <view v-for="(card, index) in businessList" :key="index"> |
| | | <uni-swipe-action-item :right-options="rightOptions" @click="handleDel(index, card)"> |
| | | <view @click="selectCard(index)" class="card-item"> |
| | | <view :class="{active: card.is_default==1}" class="card-preview"> |
| | | <image style="width: 650rpx;border-radius: 12rpx;" :src="card.mp" |
| | | mode="widthFix"></image> |
| | | <image v-show="card.is_default==1" src="@/static/icon/mrmp.png" class="mrmp"> |
| | | </image> |
| | | </view> |
| | | </view> |
| | | </uni-swipe-action-item> |
| | | </view> |
| | | </view> |
| | | </uni-swipe-action> |
| | | <view class="add-card" @click="addNewCard()"> |
| | | <text class="icon iconfont icon-add"></text> |
| | | <text>添加新名片</text> |
| | |
| | | |
| | | <script> |
| | | import Popup from '@/components/uni-popup.vue'; |
| | | import uniSwipeAction from '@/uni_modules/uni-swipe-action/components/uni-swipe-action/uni-swipe-action.vue'; |
| | | import uniSwipeActionItem from '@/uni_modules/uni-swipe-action/components/uni-swipe-action-item/uni-swipe-action-item.vue'; |
| | | export default { |
| | | components: { |
| | | Popup |
| | | Popup, |
| | | uniSwipeAction, |
| | | uniSwipeActionItem |
| | | }, |
| | | data() { |
| | | return { |
| | | businessImage: '', |
| | | business_card_id: '', |
| | | height: 0, |
| | | cardWidth: 0, // 名片宽度 |
| | | businessList: [], |
| | | current: 0, |
| | | statistics: {}, |
| | |
| | | showPayment: false, // 显示支付弹窗 |
| | | paymentMethod: 'balance', // 支付方式 |
| | | topSetting: {}, // 置顶设置 |
| | | userInfo: {} // 用户信息 |
| | | userInfo: {}, // 用户信息 |
| | | rightOptions: [{ |
| | | text: '删除', |
| | | style: { |
| | | backgroundColor: '#FF3B30' |
| | | } |
| | | }] |
| | | }; |
| | | }, |
| | | onLoad() { |
| | | this.screenWidth = uni.getSystemInfoSync().windowWidth * 2 - 70; |
| | | // 计算名片宽度:屏幕宽度减去左右padding(40rpx) |
| | | const systemInfo = uni.getSystemInfoSync(); |
| | | this.cardWidth = (systemInfo.windowWidth * 2) - 40; // rpx单位 |
| | | }, |
| | | onShow() { |
| | | this.getbusinessList(); |
| | | this.getVisitorList(); |
| | | }, |
| | |
| | | }, function(res) { |
| | | _this.businessList = res.data.data; |
| | | if (_this.businessList.length > 0) { |
| | | for(let i in _this.businessList){ |
| | | if(_this.businessList[i].is_default==1){ |
| | | _this.current=i; |
| | | for (let i in _this.businessList) { |
| | | if (_this.businessList[i].is_default == 1) { |
| | | _this.current = i; |
| | | } |
| | | } |
| | | _this.getbusiness(_this.businessList[_this.current].user_id) |
| | |
| | | this.gotoPage( |
| | | `/pages/plus/business/add?business_card_id=${this.businessList[this.current].business_card_id}` |
| | | ); |
| | | } else { |
| | | this.gotoPage( |
| | | `/pages/plus/business/add` |
| | | ); |
| | | } |
| | | }, |
| | | switchCard() { |
| | |
| | | }, |
| | | shareCard() { |
| | | // 分享名片逻辑 |
| | | |
| | | |
| | | }, |
| | | viewAllVisitors() { |
| | | // 查看全部访客 |
| | | this.gotoPage('/pages/plus/business/visitors'); |
| | | }, |
| | | |
| | | // 跳转到聊天记录页面 |
| | | gotoChatList() { |
| | | uni.navigateTo({ |
| | | url: '/pages/plus/business/chat/list' |
| | | }); |
| | | }, |
| | | // 置顶名片 |
| | | topUpCard() { |
| | |
| | | if (this.paymentMethod === 'balance') { |
| | | // 直接跳转支付 |
| | | uni.redirectTo({ |
| | | url: '/pages/order/cashier?order_id=' + res.data.order_id + |
| | | url: '/pages/plus/business/cashier?order_id=' + res.data.order_id + |
| | | '&order_type=100' |
| | | }); |
| | | } else { |
| | | // 跳转到收银台支付 |
| | | uni.redirectTo({ |
| | | url: '/pages/order/cashier?order_id=' + res.data.order_id + |
| | | url: '/pages/plus/business/cashier?order_id=' + res.data.order_id + |
| | | '&order_type=100' |
| | | }); |
| | | } |
| | |
| | | } else { |
| | | return date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate(); |
| | | } |
| | | }, |
| | | // 删除名片 |
| | | handleDel(index, card) { |
| | | // 防止删除默认名片 |
| | | if (card.is_default === 1) { |
| | | this.showToast('默认名片不能删除'); |
| | | return; |
| | | } |
| | | |
| | | uni.showModal({ |
| | | title: '提示', |
| | | content: '确定要删除这个名片吗?', |
| | | success: (res) => { |
| | | if (res.confirm) { |
| | | // 调用删除接口 |
| | | this._post('plus.business.business/delete', { |
| | | business_card_id: card.business_card_id |
| | | }, (res) => { |
| | | if (res.code === 1) { |
| | | // 删除成功,更新列表 |
| | | this.businessList.splice(index, 1); |
| | | this.showToast('删除成功'); |
| | | |
| | | // 如果删除的是当前选中的名片,切换到第一个名片 |
| | | if (index === this.current) { |
| | | if (this.businessList.length > 0) { |
| | | this.current = 0; |
| | | this.getStatistics(this.businessList[this.current] |
| | | .business_card_id); |
| | | } |
| | | } else if (index < this.current) { |
| | | // 如果删除的是当前选中名片之前的,current减1 |
| | | this.current--; |
| | | } |
| | | } else { |
| | | this.showToast(res.msg || '删除失败'); |
| | | } |
| | | }); |
| | | } |
| | | } |
| | | }); |
| | | }, |
| | | // 显示提示信息 |
| | | showToast(msg) { |
| | | uni.showToast({ |
| | | title: msg, |
| | | icon: 'none', |
| | | duration: 2000 |
| | | }); |
| | | } |
| | | }, |
| | | onShareAppMessage() { |
| | |
| | | background: #fff; |
| | | border-radius: 20rpx; |
| | | overflow: hidden; |
| | | box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.08); |
| | | |
| | | .card-image { |
| | | width: 100%; |
| | | display: block; |
| | | // 确保图片清晰度,使用高质量渲染 |
| | | image-rendering: -webkit-optimize-contrast; |
| | | image-rendering: crisp-edges; |
| | | } |
| | | |
| | | .top-image { |
| | | width: 100%; |
| | |
| | | |
| | | .icon { |
| | | font-size: 32rpx; |
| | | color: #37bde6; |
| | | color: #D41003; |
| | | margin-right: 16rpx; |
| | | } |
| | | |
| | |
| | | |
| | | .btn { |
| | | flex: 1; |
| | | background: #37bde6; |
| | | background: #D41003; |
| | | color: #fff; |
| | | text-align: center; |
| | | padding: 24rpx 0; |
| | |
| | | .card-preview { |
| | | border-radius: 12rpx; |
| | | position: relative; |
| | | overflow: hidden; |
| | | |
| | | image { |
| | | // 保持图片原始清晰度 |
| | | display: block; |
| | | image-rendering: -webkit-optimize-contrast; |
| | | } |
| | | |
| | | .mrmp { |
| | | height: 50rpx; |
| | |
| | | |
| | | &.active { |
| | | background: #f5f5f5; |
| | | border: #37bde6 solid 1rpx; |
| | | border: #D41003 solid 1rpx; |
| | | } |
| | | |
| | | .card-company { |
| | |
| | | align-items: center; |
| | | justify-content: center; |
| | | padding: 30rpx; |
| | | color: #37bde6; |
| | | color: #D41003; |
| | | font-size: 30rpx; |
| | | |
| | | .icon { |
| | |
| | | position: relative; |
| | | |
| | | &.active { |
| | | border-color: #37bde6; |
| | | border-color: #D41003; |
| | | background: #f0f9ff; |
| | | } |
| | | |
| | |
| | | } |
| | | |
| | | .checked { |
| | | color: #37bde6; |
| | | color: #D41003; |
| | | font-size: 36rpx; |
| | | } |
| | | } |