|
|
@@ -1,8 +1,18 @@
|
|
|
<template>
|
|
|
<view class="goods-manage-page">
|
|
|
- <view class="top-tabs">
|
|
|
- <view class="top-tab" :class="{ active: activeType === 'goods' }" @click="switchType('goods')">花束</view>
|
|
|
- <view class="top-tab" :class="{ active: activeType === 'item' }" @click="switchType('item')">花材</view>
|
|
|
+ <view class="modern-tabs-container">
|
|
|
+ <view class="modern-tabs">
|
|
|
+ <view class="modern-tab" :class="{ active: activeType === 'goods' }" @click="switchType('goods')">
|
|
|
+ <view class="tab-content">
|
|
|
+ <text class="tab-text">花束</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="modern-tab" :class="{ active: activeType === 'item' }" @click="switchType('item')">
|
|
|
+ <view class="tab-content">
|
|
|
+ <text class="tab-text">花材</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
|
|
|
<view v-if="activeType === 'goods'" class="panel">
|
|
|
@@ -105,6 +115,18 @@
|
|
|
</view>
|
|
|
|
|
|
<view v-else class="panel">
|
|
|
+ <!-- 已开通批发店：进入花材页仅展示引导，不加载零售端花材列表 -->
|
|
|
+ <view v-if="pfItemLocked" class="pf-item-tip-panel">
|
|
|
+ <view class="pf-item-tip-card">
|
|
|
+ <text class="pf-item-tip-text">请到批发端修改花材</text>
|
|
|
+ <view class="pf-item-tip-actions">
|
|
|
+ <button class="admin-button-com middle default pf-tip-btn" @click="switchType('goods')">返回花束</button>
|
|
|
+ <button class="admin-button-com middle blue pf-tip-btn" @click="goToPfMiniProgram">去批发端</button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <block v-else>
|
|
|
<view class="search-row">
|
|
|
<button class="admin-button-com middle blue image-class-btn" @click="selectFlowerNumFn">图片分类</button>
|
|
|
<view class="search-box">
|
|
|
@@ -245,9 +267,14 @@
|
|
|
<app-wrapper-empty v-else title="暂无花材" :is-empty="$util.isEmpty(globalItemData)" />
|
|
|
</scroll-view>
|
|
|
</view>
|
|
|
+ </block>
|
|
|
</view>
|
|
|
|
|
|
- <button class="admin-button-com big blue footer-btn" @click="addCurrent">{{ activeType === 'goods' ? '新增花束' : '新增花材' }}</button>
|
|
|
+ <button
|
|
|
+ v-if="!(activeType === 'item' && pfItemLocked)"
|
|
|
+ class="admin-button-com big blue footer-btn"
|
|
|
+ @click="addCurrent"
|
|
|
+ >{{ activeType === 'goods' ? '新增花束' : '新增花材' }}</button>
|
|
|
|
|
|
<view v-if="showFilterPanel" class="filter-overlay" @click="closeFilterPanel">
|
|
|
<view class="filter-panel" @click.stop>
|
|
|
@@ -292,17 +319,7 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
- <!-- 已开通花材批发店时，引导去批发端小程序修改花材，避免在零售端误改 -->
|
|
|
- <modal-module
|
|
|
- :show="showPfItemTip"
|
|
|
- content="请到销花宝批发端修改花材"
|
|
|
- color="#333"
|
|
|
- :size="32"
|
|
|
- padding="30rpx 30rpx"
|
|
|
- :button="pfItemTipButtons"
|
|
|
- :maskClosable="true"
|
|
|
- @click="onPfItemTipClick"
|
|
|
- />
|
|
|
+ <!-- 花材引导已改为页内居中提示（pfItemLocked），不再使用弹框 -->
|
|
|
|
|
|
<modal-module :show="printLabelShow" @click="dialogInputConfirm" :maskClosable="true" title="数量" padding="30rpx 30rpx">
|
|
|
<template v-slot:content>
|
|
|
@@ -491,13 +508,8 @@ export default {
|
|
|
remarkFocus: false,
|
|
|
// 花材是否已懒加载过，避免重复 initItem 请求
|
|
|
itemInited: false,
|
|
|
- // 已开通批发店时切换花材的引导弹窗
|
|
|
- showPfItemTip: false,
|
|
|
- // 引导弹窗按钮：沿用 modal-module 默认描边/实心样式
|
|
|
- pfItemTipButtons: [
|
|
|
- { text: "返回花束", plain: true },
|
|
|
- { text: "去批发端", plain: false }
|
|
|
- ]
|
|
|
+ // 已开通批发店时进入花材页：页内引导，不加载零售花材
|
|
|
+ pfItemLocked: false
|
|
|
}
|
|
|
},
|
|
|
// 汇总门店、登录人与字典信息；只读取 Vuex，不修改全局状态。
|
|
|
@@ -515,7 +527,7 @@ export default {
|
|
|
this.getAppIdList = res.data
|
|
|
})
|
|
|
this.getCategoryData()
|
|
|
- // 深链直接进花材时走同一套切换逻辑，以便已开通批发店时弹出引导而非误加载花材
|
|
|
+ // 深链直接进花材时走同一套切换逻辑（已开通批发店则页内引导）
|
|
|
if (options && options.type === "item") {
|
|
|
this.switchType("item")
|
|
|
}
|
|
|
@@ -543,42 +555,31 @@ export default {
|
|
|
},
|
|
|
/**
|
|
|
* 切换花束 / 花材面板。
|
|
|
- * 已开通花材批发店（pfShopId>0）时切到花材只弹引导，不切换面板、不加载花材；
|
|
|
- * 未开通时才切换并按需懒加载花材数据。
|
|
|
+ * 已开通花材批发店（pfShopId>0）时仍进入花材页，但锁定为页内引导（不加载零售花材）；
|
|
|
+ * 未开通时切换并按需懒加载花材数据。
|
|
|
* @param {string} type goods | item
|
|
|
*/
|
|
|
switchType(type) {
|
|
|
if (type === this.activeType) return
|
|
|
if (type === "item") {
|
|
|
- // 零售店已绑定批发店：花材应在批发端维护，此处拦截并引导跳转销花宝
|
|
|
+ this.activeType = "item"
|
|
|
+ // 零售店已绑定批发店：花材应在批发端维护，页内提示并引导跳转销花宝
|
|
|
if (Number(this.getMyShopInfo && this.getMyShopInfo.pfShopId) > 0) {
|
|
|
- this.showPfItemTip = true
|
|
|
+ this.pfItemLocked = true
|
|
|
return
|
|
|
}
|
|
|
- this.activeType = "item"
|
|
|
+ this.pfItemLocked = false
|
|
|
this.ensureItemLoaded()
|
|
|
return
|
|
|
}
|
|
|
+ this.pfItemLocked = false
|
|
|
this.activeType = "goods"
|
|
|
},
|
|
|
- // 关闭「去批发端」引导弹窗，保持当前仍在花束面板。
|
|
|
- closePfItemTip() {
|
|
|
- this.showPfItemTip = false
|
|
|
- },
|
|
|
- // 处理引导弹窗按钮：0 返回花束，1 跳转批发端小程序。
|
|
|
- onPfItemTipClick(val) {
|
|
|
- if (!val || val.index == 0) {
|
|
|
- this.closePfItemTip()
|
|
|
- return
|
|
|
- }
|
|
|
- this.goToPfMiniProgram()
|
|
|
- },
|
|
|
/**
|
|
|
* 打开批发端小程序（现网「销花宝」，测试环境「花惠宝」）。
|
|
|
* appId 取自 getWeixinId 的 ghs.miniAppId；未缓存时再请求一次。
|
|
|
*/
|
|
|
goToPfMiniProgram() {
|
|
|
- this.closePfItemTip()
|
|
|
const openGhs = appIdList => {
|
|
|
const appId = appIdList && appIdList.ghs && appIdList.ghs.miniAppId
|
|
|
if (!appId) {
|
|
|
@@ -1248,40 +1249,59 @@ page {
|
|
|
flex-direction: column;
|
|
|
}
|
|
|
|
|
|
-.top-tabs {
|
|
|
- display: flex;
|
|
|
- align-items: flex-end;
|
|
|
- height: 100upx;
|
|
|
- padding: 0 120upx 0;
|
|
|
- box-sizing: border-box;
|
|
|
+/* 顶部花束/花材切换：对齐 admin/item/list2.vue 的 modern-tabs */
|
|
|
+.modern-tabs-container {
|
|
|
+ padding: 0;
|
|
|
+ background-color: #f8f9fa;
|
|
|
+ width: 100%;
|
|
|
flex-shrink: 0;
|
|
|
}
|
|
|
|
|
|
-.top-tab {
|
|
|
+.modern-tabs {
|
|
|
+ display: flex;
|
|
|
+ background-color: #ffffff;
|
|
|
+ padding: 6upx;
|
|
|
+ box-shadow: 0 2upx 12upx rgba(0, 0, 0, 0.06);
|
|
|
+ border: 2upx solid #f0f2f5;
|
|
|
+ position: relative;
|
|
|
+ z-index: 5;
|
|
|
+ width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.modern-tab {
|
|
|
flex: 1;
|
|
|
- height: 84upx;
|
|
|
- line-height: 84upx;
|
|
|
text-align: center;
|
|
|
- font-size: 34upx;
|
|
|
- color: #777;
|
|
|
- font-weight: 700;
|
|
|
+ padding: 30upx 0;
|
|
|
position: relative;
|
|
|
+ transition: all 0.35s cubic-bezier(0.25, 1, 0.5, 1);
|
|
|
+ border-radius: 12upx;
|
|
|
+ margin: 0 2upx;
|
|
|
+ background-color: #e2dfdf;
|
|
|
+ border: 2upx solid #f2f4f7;
|
|
|
+ box-shadow: none;
|
|
|
}
|
|
|
|
|
|
-.top-tab.active {
|
|
|
- color: #35a511;
|
|
|
+.modern-tab .tab-content {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
}
|
|
|
|
|
|
-.top-tab.active::after {
|
|
|
- content: "";
|
|
|
- position: absolute;
|
|
|
- left: 50%;
|
|
|
- bottom: 4upx;
|
|
|
- transform: translateX(-50%);
|
|
|
- width: 78upx;
|
|
|
- height: 6upx;
|
|
|
- border-radius: 6upx;
|
|
|
- background: #35a511;
|
|
|
+.modern-tab .tab-text {
|
|
|
+ font-size: 30upx;
|
|
|
+ color: #666;
|
|
|
+ font-weight: 700;
|
|
|
+}
|
|
|
+
|
|
|
+.modern-tab.active {
|
|
|
+ background: #09C567;
|
|
|
+}
|
|
|
+
|
|
|
+.modern-tab.active .tab-text {
|
|
|
+ color: #ffffff;
|
|
|
+ font-weight: 700;
|
|
|
+ font-size: 30upx;
|
|
|
}
|
|
|
|
|
|
.panel {
|
|
|
@@ -1291,6 +1311,47 @@ page {
|
|
|
flex-direction: column;
|
|
|
}
|
|
|
|
|
|
+/* 已开通批发店时的花材页内引导：居中卡片，替代原弹框 */
|
|
|
+.pf-item-tip-panel {
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ padding: 40upx 48upx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background: #f5f6f8;
|
|
|
+}
|
|
|
+
|
|
|
+.pf-item-tip-card {
|
|
|
+ width: 100%;
|
|
|
+ max-width: 620upx;
|
|
|
+ background: #fff;
|
|
|
+ border-radius: 16upx;
|
|
|
+ padding: 56upx 40upx 40upx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ box-shadow: 0 4upx 24upx rgba(0, 0, 0, 0.06);
|
|
|
+}
|
|
|
+
|
|
|
+.pf-item-tip-text {
|
|
|
+ display: block;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 32upx;
|
|
|
+ color: #333;
|
|
|
+ line-height: 1.5;
|
|
|
+ margin-bottom: 48upx;
|
|
|
+}
|
|
|
+
|
|
|
+.pf-item-tip-actions {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
+
|
|
|
+.pf-tip-btn {
|
|
|
+ width: 46%;
|
|
|
+ margin: 0;
|
|
|
+}
|
|
|
+
|
|
|
.search-row {
|
|
|
display: flex;
|
|
|
align-items: center;
|
