|
|
@@ -18,8 +18,10 @@
|
|
|
<view v-if="activeType === 'goods'" class="panel">
|
|
|
<view class="search-row">
|
|
|
<button class="admin-button-com middle small-btn blue" @click="changeSearchType">
|
|
|
- <text>{{ searchTypeLabel }}</text>
|
|
|
- <zui-svg-icon class="search-type-icon" icon="general-switch" :width="14" :height="14" color="#fff" />
|
|
|
+ <view class="small-btn-inner">
|
|
|
+ <text class="small-btn-text">{{ searchTypeLabel }}</text>
|
|
|
+ <zui-svg-icon class="search-type-icon" icon="general-switch" :width="14" :height="14" color="#fff" />
|
|
|
+ </view>
|
|
|
</button>
|
|
|
<view class="search-box">
|
|
|
<text class="search-icon">⌕</text>
|
|
|
@@ -30,9 +32,9 @@
|
|
|
|
|
|
<view class="filter-row">
|
|
|
<view class="filter-tabs">
|
|
|
- <view class="filter-tab" :class="{ active: priceType === -1 }" @click="switchPriceTab(-1)">全部</view>
|
|
|
- <view class="filter-tab" :class="{ active: priceType === 0 }" @click="switchPriceTab(0)">无价</view>
|
|
|
- <view class="filter-tab" :class="{ active: priceType === 1 }" @click="switchPriceTab(1)">有价</view>
|
|
|
+ <button class="filter-chip" :class="{ active: priceType === -1 }" @click="switchPriceTab(-1)">全部</button>
|
|
|
+ <button class="filter-chip" :class="{ active: priceType === 0 }" @click="switchPriceTab(0)">无价</button>
|
|
|
+ <button class="filter-chip" :class="{ active: priceType === 1 }" @click="switchPriceTab(1)">有价</button>
|
|
|
</view>
|
|
|
<view class="action-btns">
|
|
|
<button class="admin-button-com middle blue tool-btn" @click="openFilterPanel"> <zui-svg-icon class="tool-btn-icon" icon="general-filter" :width="14" :height="14" color="#fff" />筛选</button>
|
|
|
@@ -110,23 +112,22 @@
|
|
|
|
|
|
<view v-else class="panel item-panel">
|
|
|
<view class="search-row">
|
|
|
- <button class="admin-button-com middle blue image-class-btn" @click="selectFlowerNumFn">图片分类</button>
|
|
|
+ <button class="admin-button-com middle blue image-class-btn" @click="selectFlowerNumFn">图片筛选</button>
|
|
|
<view class="search-box">
|
|
|
<text class="search-icon">⌕</text>
|
|
|
- <input v-model="globalPy" class="search-input" placeholder="请输入/搜索商品名称" confirm-type="search" @confirm="searchItem" />
|
|
|
+ <input v-model="globalPy" class="search-input" placeholder="请输入" confirm-type="search" @confirm="searchItem" />
|
|
|
</view>
|
|
|
- <!-- 批发店锁定时不展示添花材,避免绕过蒙板引导 -->
|
|
|
- <button v-if="!pfItemLocked" class="admin-button-com middle blue add-btn" @click="addCurrent">添花材</button>
|
|
|
+ <!-- 锁定时仍展示,由蒙板挡住点击,与下方花材列表一致 -->
|
|
|
+ <button class="admin-button-com middle blue add-btn" @click="addCurrent">添花材</button>
|
|
|
</view>
|
|
|
|
|
|
<view class="filter-row">
|
|
|
- <view class="filter-tabs item-filter-tabs">
|
|
|
- <view class="filter-tab" :class="{ active: globalLookStock === 0 }" @click="changeHasStock(0)">全部</view>
|
|
|
- <view class="filter-tab" :class="{ active: globalLookStock === 1 }" @click="changeHasStock(1)">有库存</view>
|
|
|
- <view class="filter-tab" :class="{ active: globalLookStock === 2 }" @click="changeHasStock(2)">没库存</view>
|
|
|
+ <view class="filter-tabs">
|
|
|
+ <button class="filter-chip" :class="{ active: globalLookStock === 0 }" @click="changeHasStock(0)">全部</button>
|
|
|
+ <button class="filter-chip" :class="{ active: globalLookStock === 1 }" @click="changeHasStock(1)">有库存</button>
|
|
|
+ <button class="filter-chip" :class="{ active: globalLookStock === 2 }" @click="changeHasStock(2)">没库存</button>
|
|
|
</view>
|
|
|
<view class="action-btns">
|
|
|
- <button class="admin-button-com middle blue tool-btn tool-btn--wide" @click="selectFlowerNumFn"><zui-svg-icon class="tool-btn-icon" icon="general-filter" :width="14" :height="14" color="#fff" />筛选</button>
|
|
|
<button class="admin-button-com middle blue tool-btn" @click="refreshItem"><zui-svg-icon class="tool-btn-icon" icon="general-refresh" :width="14" :height="14" color="#fff" />刷新</button>
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -253,9 +254,9 @@
|
|
|
@click.stop
|
|
|
>
|
|
|
<view class="pf-item-tip-card" @click.stop>
|
|
|
- <text class="pf-item-tip-text">请到批发端修改花材</text>
|
|
|
+ <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 default pf-tip-btn" @click="switchType('goods')">返回花束栏</button>
|
|
|
<button class="admin-button-com middle blue pf-tip-btn" @click="goToPfMiniProgram">去批发端</button>
|
|
|
</view>
|
|
|
</view>
|
|
|
@@ -1356,20 +1357,38 @@ page {
|
|
|
white-space: nowrap;
|
|
|
}
|
|
|
|
|
|
-/* 名称/编号合并按钮:文字+切换图标同一行,宽度随内容伸缩 */
|
|
|
+/* 名称/编号合并按钮:内层 flex,保证文字与切换图标垂直居中 */
|
|
|
.admin-button-com.middle.small-btn {
|
|
|
width: auto;
|
|
|
min-width: 120upx;
|
|
|
height: 68upx;
|
|
|
padding: 0 16upx;
|
|
|
+ line-height: 1;
|
|
|
display: inline-flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
+ box-sizing: border-box;
|
|
|
+}
|
|
|
+
|
|
|
+.small-btn-inner {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ height: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.small-btn-text {
|
|
|
+ line-height: 1;
|
|
|
+ font-size: 26upx;
|
|
|
}
|
|
|
|
|
|
.search-type-icon {
|
|
|
flex-shrink: 0;
|
|
|
margin-left: 6upx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
}
|
|
|
|
|
|
.image-class-btn {
|
|
|
@@ -1377,12 +1396,14 @@ page {
|
|
|
font-size: 24upx;
|
|
|
}
|
|
|
|
|
|
+/* 搜索框:图标与输入文字垂直居中 */
|
|
|
.search-box {
|
|
|
flex: 1;
|
|
|
- height: 64upx;
|
|
|
+ height: 68upx;
|
|
|
border: 2upx solid #e2e2e2;
|
|
|
border-radius: 34upx;
|
|
|
display: flex;
|
|
|
+ flex-direction: row;
|
|
|
align-items: center;
|
|
|
padding: 0 24upx;
|
|
|
box-sizing: border-box;
|
|
|
@@ -1391,16 +1412,25 @@ page {
|
|
|
}
|
|
|
|
|
|
.search-icon {
|
|
|
- font-size: 42upx;
|
|
|
+ font-size: 32upx;
|
|
|
+ line-height: 1;
|
|
|
color: #8d8d8d;
|
|
|
margin-right: 12upx;
|
|
|
+ flex-shrink: 0;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ height: 100%;
|
|
|
}
|
|
|
|
|
|
.search-input {
|
|
|
flex: 1;
|
|
|
- height: 60upx;
|
|
|
+ height: 64upx;
|
|
|
+ line-height: 64upx;
|
|
|
font-size: 26upx;
|
|
|
color: #333;
|
|
|
+ padding: 0;
|
|
|
+ margin: 0;
|
|
|
+ background: transparent;
|
|
|
}
|
|
|
|
|
|
/* 搜索行右侧:添花束 / 添花材 — 高度对齐左侧按钮,与搜索框间隔 10upx */
|
|
|
@@ -1430,44 +1460,49 @@ page {
|
|
|
.filter-tabs {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
+ flex: 1;
|
|
|
+ min-width: 0;
|
|
|
+ margin-right: 16upx;
|
|
|
}
|
|
|
|
|
|
-.filter-tab + .filter-tab {
|
|
|
- margin-left: 50upx;
|
|
|
-}
|
|
|
-
|
|
|
-.item-filter-tabs .filter-tab + .filter-tab {
|
|
|
- margin-left: 42upx;
|
|
|
+/* 左侧状态筛选:描边浅色按钮,与右侧实心绿按钮区分;高度与 tool-btn 一致 */
|
|
|
+.filter-chip {
|
|
|
+ height: 68upx;
|
|
|
+ padding: 0 18upx;
|
|
|
+ margin: 0;
|
|
|
+ font-size: 24upx;
|
|
|
+ line-height: 1;
|
|
|
+ color: #666;
|
|
|
+ background: #f5f6f8;
|
|
|
+ border: 2upx solid #e5e7eb;
|
|
|
+ border-radius: 8upx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ white-space: nowrap;
|
|
|
+ display: inline-flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ flex-shrink: 0;
|
|
|
}
|
|
|
|
|
|
-.filter-tab {
|
|
|
- height: 56upx;
|
|
|
- line-height: 56upx;
|
|
|
- font-size: 26upx;
|
|
|
- color: #111;
|
|
|
- font-weight: 600;
|
|
|
- position: relative;
|
|
|
- white-space: nowrap;
|
|
|
+.filter-chip::after {
|
|
|
+ border: none;
|
|
|
}
|
|
|
|
|
|
-.filter-tab.active {
|
|
|
- color: #22a500;
|
|
|
+.filter-chip + .filter-chip {
|
|
|
+ margin-left: 12upx;
|
|
|
}
|
|
|
|
|
|
-.filter-tab.active::after {
|
|
|
- content: "";
|
|
|
- position: absolute;
|
|
|
- left: 0;
|
|
|
- right: 0;
|
|
|
- bottom: -4upx;
|
|
|
- height: 4upx;
|
|
|
- background: #22a500;
|
|
|
- border-radius: 4upx;
|
|
|
+.filter-chip.active {
|
|
|
+ color: #09C567;
|
|
|
+ background: #eefaf3;
|
|
|
+ border-color: #09C567;
|
|
|
+ font-weight: 600;
|
|
|
}
|
|
|
|
|
|
.action-btns {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
+ flex-shrink: 0;
|
|
|
}
|
|
|
|
|
|
.action-btns > * + * {
|