feat(components): 在图片组件中添加长按显示菜单功能

This commit is contained in:
2026-05-07 15:12:59 +08:00
parent 2f24661cd9
commit d113d6125b
125 changed files with 622 additions and 368 deletions

View File

@@ -135,7 +135,7 @@
<view class="list-wrap" style="display: flex;">
<view class="name-wrap">
<image :src="$util.img(goodsSkuDetail.merchinfo.merch_image)" mode="widthFix"
style="width: 100rpx;height: 100rpx;border-radius: 50rpx;"></image>
style="width: 100rpx;height: 100rpx;border-radius: 50rpx;" show-menu-by-longpress></image>
</view>
<view class="other-wrap">
<view class="address" style="margin-left: 30rpx;">
@@ -219,8 +219,8 @@
@click="selectStore(item)">
<view class="item-box">
<view class="item-image">
<image :src="$util.img(item.store_image)" v-if="item.store_image" />
<image :src="$util.getDefaultImage().store" v-else />
<image :src="$util.img(item.store_image)" v-if="item.store_image" show-menu-by-longpress/>
<image :src="$util.getDefaultImage().store" v-else show-menu-by-longpress/>
</view>
<view class="item-info">
<view class="item-title">
@@ -248,7 +248,7 @@
<view class="detail-community" v-if="goodsSkuDetail.qr_data && goodsSkuDetail.qr_data.qr_state == 1">
<view class="community-box">
<image :src="$util.img('public/uniapp/goods/detail_erweiImage.png')" mode="aspectFill"></image>
<image :src="$util.img('public/uniapp/goods/detail_erweiImage.png')" mode="aspectFill" show-menu-by-longpress></image>
<view class="community-content">
<view class="community-title">{{ goodsSkuDetail.qr_data.qr_name }}</view>
<view class="community-txt">{{ goodsSkuDetail.qr_data.community_describe }}</view>
@@ -301,10 +301,10 @@
<view class="evaluator-face">
<image v-if="item.member_headimg" :src="$util.img(item.member_headimg)"
@error="item.member_headimg = $util.getDefaultImage().head"
mode="aspectFill" />
mode="aspectFill" show-menu-by-longpress/>
<image v-else :src="$util.getDefaultImage().head"
@error="item.member_headimg = $util.getDefaultImage().head"
mode="aspectFill" />
mode="aspectFill" show-menu-by-longpress/>
</view>
<view class="evaluator-name-wrap">
<text class="evaluator-name using-hidden"
@@ -325,7 +325,7 @@
<view class="evaluate-img" v-if="item.images">
<view class="img-box" v-for="(img, img_index) in item.images" :key="img_index"
@click="previewEvaluate(index, img_index, 'images')">
<image :src="$util.img(img)" mode="aspectFill" />
<image :src="$util.img(img)" mode="aspectFill" show-menu-by-longpress/>
</view>
</view>
</scroll-view>

View File

@@ -6,38 +6,38 @@
<text class="promotion-mark ">限时折扣</text>
<text class="title">当前商品正在参加{{ item.promotion_name }}</text>
<text class="iconfont icon-right"></text>
<!-- <view class="img-wrap"><image :src="$util.img('public/uniapp/goods/detail_more.png')" mode="aspectFit" /></view> -->
<!-- <view class="img-wrap"><image :src="$util.img('public/uniapp/goods/detail_more.png')" mode="aspectFit" show-menu-by-longpress/></view> -->
</view>
<view v-else-if="item.promotion_type == 'groupbuy'" class="item" @click="redirectTo('/pages_promotion/groupbuy/detail', { groupbuy_id: item.groupbuy_id })">
<!-- <view v-else-if="item.promotion_type == 'groupbuy'" class="item" @click="redirectTo('/pages_promotion/groupbuy/detail', { id: item.groupbuy_id })"> -->
<text class="promotion-mark ">团购</text>
<text class="title">当前商品正在参加{{ item.promotion_name }}</text>
<text class="iconfont icon-right"></text>
<!-- <view class="img-wrap"><image :src="$util.img('public/uniapp/goods/detail_more.png')" mode="aspectFit" /></view> -->
<!-- <view class="img-wrap"><image :src="$util.img('public/uniapp/goods/detail_more.png')" mode="aspectFit" show-menu-by-longpress/></view> -->
</view>
<view v-else-if="item.promotion_type == 'pintuan'" class="item" @click="redirectTo('/pages_promotion/pintuan/detail', { pintuan_id: item.pintuan_id })">
<text class="promotion-mark ">拼团</text>
<text class="title">当前商品正在参加{{ item.promotion_name }}</text>
<text class="iconfont icon-right"></text>
<!-- <view class="img-wrap"><image :src="$util.img('public/uniapp/goods/detail_more.png')" mode="aspectFit" /></view> -->
<!-- <view class="img-wrap"><image :src="$util.img('public/uniapp/goods/detail_more.png')" mode="aspectFit" show-menu-by-longpress/></view> -->
</view>
<view v-else-if="item.promotion_type == 'seckill'" class="item" @click="redirectTo('/pages_promotion/seckill/detail', { seckill_id: item.id })">
<text class="promotion-mark ">秒杀</text>
<text class="title">当前商品正在参加{{ item.promotion_name }}</text>
<text class="iconfont icon-right"></text>
<!-- <view class="img-wrap"><image :src="$util.img('public/uniapp/goods/detail_more.png')" mode="aspectFit" /></view> -->
<!-- <view class="img-wrap"><image :src="$util.img('public/uniapp/goods/detail_more.png')" mode="aspectFit" show-menu-by-longpress/></view> -->
</view>
<view v-else-if="item.promotion_type == 'topic'" class="item" @click="redirectTo('/pages_promotion/topics/goods_detail', { id: item.id })">
<text class="promotion-mark ">专题活动</text>
<text class="title">当前商品正在参加{{ item.promotion_name }}</text>
<text class="iconfont icon-right"></text>
<!-- <view class="img-wrap"><image :src="$util.img('public/uniapp/goods/detail_more.png')" mode="aspectFit" /></view> -->
<!-- <view class="img-wrap"><image :src="$util.img('public/uniapp/goods/detail_more.png')" mode="aspectFit" show-menu-by-longpress/></view> -->
</view>
<view v-else-if="item.promotion_type == 'bargain'" class="item" @click="redirectTo('/pages_promotion/bargain/detail', { b_id: item.bargain_id })">
<text class="promotion-mark ">砍价</text>
<text class="title">当前商品正在参加{{ item.promotion_name }}</text>
<text class="iconfont icon-right"></text>
<!-- <view class="img-wrap"><image :src="$util.img('public/uniapp/goods/detail_more.png')" mode="aspectFit" /></view> -->
<!-- <view class="img-wrap"><image :src="$util.img('public/uniapp/goods/detail_more.png')" mode="aspectFit" show-menu-by-longpress/></view> -->
</view>
<view v-else-if="item.promotion_type == 'pinfan'" class="item" @click="redirectTo('/pages_promotion/pinfan/detail', { pinfan_id: item.pintuan_id })">
<text class="promotion-mark ">拼团返利</text>

View File

@@ -4,7 +4,7 @@
<view class="round bg-gradual-orange flex justify-start shadow" style="padding: 3px;">
<view class="cu-avatar cu-a-sm round" :style="{ backgroundImage: 'url(' + $util.img(penpaiData.img) + ')' }">
<!-- #ifdef APP-NVUE -->
<!-- <image :src="penpaiData.img" class="avatarimg"></image> -->
<!-- <image :src="penpaiData.img" class="avatarimg" show-menu-by-longpress></image> -->
<!-- #endif -->
</view>
<view class="padding-lr-sm flex align-center">

View File

@@ -34,7 +34,7 @@
@click="singleElection(siteIndex, cartIndex)"></view>
<view @click="toGoodsDetail(item)" class="goods-img">
<image :src="$util.img(item.sku_image, { size: 'mid' })"
@error="imageError(siteIndex, cartIndex)" mode="aspectFill" />
@error="imageError(siteIndex, cartIndex)" mode="aspectFill" show-menu-by-longpress/>
</view>
<view class="goods-info">
<view>
@@ -66,7 +66,7 @@
<text class="unit price-style small">.{{
parseFloat(item.member_price).toFixed(2).split('.')[1]
}}</text>
<image :src="$util.img('public/uniapp/index/VIP.png')" />
<image :src="$util.img('public/uniapp/index/VIP.png')" show-menu-by-longpress/>
</view>
</view>
</block>
@@ -81,7 +81,7 @@
parseFloat(item.discount_price).toFixed(2).split('.')[1]
}}</text>
<image
:src="$util.img('public/uniapp/index/discount.png')" />
:src="$util.img('public/uniapp/index/discount.png')" show-menu-by-longpress/>
</view>
</view>
</block>
@@ -96,7 +96,7 @@
<text class="unit price-style small">.{{
parseFloat(item.member_price).toFixed(2).split('.')[1]
}}</text>
<image :src="$util.img('public/uniapp/index/VIP.png')" />
<image :src="$util.img('public/uniapp/index/VIP.png')" show-menu-by-longpress/>
</view>
</view>
</block>
@@ -150,7 +150,7 @@
<view class="iconfont icon-yuan_checked color-tip"></view>
<view class="goods-img">
<image :src="$util.img(goodsItem.sku_image, { size: 'mid' })"
mode="aspectFill" />
mode="aspectFill" show-menu-by-longpress/>
</view>
<view class="goods-info">
<view class="goods-name">{{ goodsItem.sku_name }}</view>
@@ -176,7 +176,7 @@
<text class="unit price-style small">.{{
parseFloat(goodsItem.member_price).toFixed(2).split('.')[1]
}}</text>
<image :src="$util.img('public/uniapp/index/VIP.png')" />
<image :src="$util.img('public/uniapp/index/VIP.png')" show-menu-by-longpress/>
</template>
<template v-else>
<text class="unit price-style small">{{
@@ -256,7 +256,7 @@
:style="{ backgroundColor: discount.coupon_info.receive_type != 'wait' ? '#F2F2F2' : 'var(--main-color-shallow)' }">
<view class="info-wrap">
<image class="coupon-line" mode="heightFix"
:src="$util.img('public/uniapp/coupon/coupon_line.png')" />
:src="$util.img('public/uniapp/coupon/coupon_line.png')" show-menu-by-longpress/>
<view class="coupon-money">
<template v-if="discount.coupon_info.type == 'reward'">
<text class="unit">{{ $lang('common.currencySymbol') }}</text>

View File

@@ -49,7 +49,7 @@
<text class="price price-font">{{ parseFloat(goodsSkuDetail.member_price).toFixed(2).split('.')[0] }}</text>
<text class="price-symbol price-font">.{{ parseFloat(goodsSkuDetail.member_price).toFixed(2).split('.')[1] }}</text>
<view class="member-vip-wrap">
<image :src="$util.img('public/uniapp/goods/member_vip.png')" mode="aspectFit"/>
<image :src="$util.img('public/uniapp/goods/member_vip.png')" mode="aspectFit" show-menu-by-longpress/>
</view>
<view class="member-price-wrap" v-if="!goodsSkuDetail.market_price_show">
<text class="unit price-font">原价</text>
@@ -140,7 +140,7 @@
v-for="(item, index) in goodsSkuDetail.card_info.relation_goods"
@click="$util.redirectTo('/pages_goods/detail', { goods_id: item.goods_id })"
>
<image :src="$util.img(item.sku_image)" mode="aspectFill"/>
<image :src="$util.img(item.sku_image)" mode="aspectFill" show-menu-by-longpress/>
<view class="content">
<view class="name multi-hidden">{{ item.sku_name }}</view>
<view class="price">¥{{ item.price }}</view>
@@ -221,13 +221,13 @@
<text>{{ bundling[0].bl_name }}</text>
</view>
<text class="iconfont icon-right"></text>
<!-- <view class="more-img-wrap"><image :src="$util.img('public/uniapp/goods/detail_more.png')" mode="aspectFit" /></view> -->
<!-- <view class="more-img-wrap"><image :src="$util.img('public/uniapp/goods/detail_more.png')" mode="aspectFit" show-menu-by-longpress/></view> -->
</view>
<scroll-view class="combo-goods-wrap color-tip" scroll-x="true">
<view class="goods-wrap">
<view class="goods-item" @click="toGoodsDetail(skuId)" v-if="bundlingType == true">
<view class="combo-img">
<image :src="$util.img(goodsSkuDetail.sku_image, { size: 'mid' })" @error="imageError()" />
<image :src="$util.img(goodsSkuDetail.sku_image, { size: 'mid' })" @error="imageError()" show-menu-by-longpress/>
<view class="price-wrap">
<text class="unit price-font">{{ $lang('common.currencySymbol') }}</text>
<text class="price price-font">{{ goodsSkuDetail.price }}</text>
@@ -239,7 +239,7 @@
<template v-if="index < 3">
<view class="goods-item" @click="toGoodsDetail(item.sku_id)">
<view class="combo-img">
<image :src="$util.img(item.sku_image, { size: 'mid' })" @error="bundlingImageError(0, index)" />
<image :src="$util.img(item.sku_image, { size: 'mid' })" @error="bundlingImageError(0, index)" show-menu-by-longpress/>
<view class="price-wrap">
<text class="unit price-font">{{ $lang('common.currencySymbol') }}</text>
<text class="price price-font">{{ item.price }}</text>
@@ -272,7 +272,7 @@
<view class="goods-wrap">
<view class="goods-item" @click="toGoodsDetail(skuId)">
<view class="combo-img">
<image :src="$util.img(goodsSkuDetail.sku_image, { size: 'mid' })" @error="imageError()" />
<image :src="$util.img(goodsSkuDetail.sku_image, { size: 'mid' })" @error="imageError()" show-menu-by-longpress/>
<view class="price-wrap">
<text class="unit price-font">{{ $lang('common.currencySymbol') }}</text>
<text class="price price-font">{{ goodsSkuDetail.price }}</text>
@@ -284,7 +284,7 @@
<template v-if="goods_index < 3">
<view class="goods-item" @click="toGoodsDetail(goods.sku_id)">
<view class="combo-img">
<image :src="$util.img(goods.sku_image, { size: 'mid' })" @error="bundlingImageError(index, goods_index)" />
<image :src="$util.img(goods.sku_image, { size: 'mid' })" @error="bundlingImageError(index, goods_index)" show-menu-by-longpress/>
<view class="price-wrap">
<text class="unit price-font">{{ $lang('common.currencySymbol') }}</text>
<text class="price price-font">{{ goods.price }}</text>
@@ -323,7 +323,7 @@
<view class="coupon-item ns-gradient-diy-goods-list" v-for="(item, index) in couponList" :key="index" v-if="hackReset">
<view class="coupon-info" :style="{ backgroundColor: item.useState == 2 ? '#F2F2F2' : 'var(--main-color-shallow)' }">
<view class="info-wrap" :class="{ disabled: item.useState == 2 }">
<image class="coupon-line" mode="heightFix" :src="$util.img('public/uniapp/coupon/coupon_line.png')"></image>
<image class="coupon-line" mode="heightFix" :src="$util.img('public/uniapp/coupon/coupon_line.png')" show-menu-by-longpress></image>
<view class="coupon-money">
<template v-if="item.type == 'reward'">
<text class="unit">{{ $lang('common.currencySymbol') }}</text>