仅看在售

src/views/product/HopeMarket.vue

@@ -70,10 +70,10 @@
                         </template>
                     </van-tab>
                 </van-tabs>
+                <div class="flex1"></div>
+                <van-checkbox @change="getData(true)" class="sala" v-model="salable">仅看在售</van-checkbox>
                 <div class="allCategories" :class="{ prim: search }" @click="categorySelections">
-                    <div class="allCategories_con" :class="categorySelection ? 'allCategories_con_one' : ''">
-                        全部类目
-                    </div>
+                    <div class="allCategories_con" :class="categorySelection ? 'allCategories_con_one' : ''">筛选</div>
                     <img class="allCategories_img" src="@assets/shaixuan_pre.png" v-if="search" alt="" />
                     <img class="allCategories_img" src="@assets/shaixuan.png" v-else alt="" />
                     <!-- <van-icon name="icon-shaixuan1" class-prefix="font_family" /> -->
@@ -132,9 +132,7 @@
                 </div>
                 <!-- <div class="banner-wrapper" v-if="showSetting" @touchstart="touchEvent"></div> -->
             </div>
-            <!-- <van-checkbox v-if="source == 'TRANSFER' && !title" @change="getData(true)" class="sala" v-model="salable"
-                >仅看在售</van-checkbox
-            > -->
+
             <!-- <van-button
                 @click="changeSort"
                 v-if="source == 'TRANSFER' && !title"
@@ -158,6 +156,26 @@
 
         <product-select ref="select" @select="selectEvent"></product-select>
         <van-overlay :show="show" @click="(show = false), (categorySelection = false)"></van-overlay>
+        <div class="classify-content" v-if="search">
+            <div class="classify-list">
+                <!-- <div class="classify-info">
+                        <div class="text1">发行量</div>
+                        <div class="text2">{{ displayInformation.totalNum }}</div>
+                    </div> -->
+                <div class="classify-info">
+                    <div class="text1">流通量</div>
+                    <div class="text2">{{ displayInformation.tranferingNum }}</div>
+                </div>
+                <div class="classify-info">
+                    <div class="text1">寄售中</div>
+                    <div class="text2">{{ displayInformation.consignmentNum }}</div>
+                </div>
+                <div class="classify-info">
+                    <div class="text1">仅展示</div>
+                    <div class="text2">{{ displayInformation.onlyShowNum }}</div>
+                </div>
+            </div>
+        </div>
         <van-pull-refresh
             success-text="加载成功"
             success-duration="500"
@@ -172,24 +190,6 @@
                 :immediate-check="false"
                 @load="getData"
             >
-                <div class="classify-list" v-if="search">
-                    <!-- <div class="classify-info">
-                        <div class="text1">发行量</div>
-                        <div class="text2">{{ displayInformation.totalNum }}</div>
-                    </div> -->
-                    <div class="classify-info">
-                        <div class="text1">流通量</div>
-                        <div class="text2">{{ displayInformation.tranferingNum }}</div>
-                    </div>
-                    <div class="classify-info">
-                        <div class="text1">寄售中</div>
-                        <div class="text2">{{ displayInformation.consignmentNum }}</div>
-                    </div>
-                    <div class="classify-info">
-                        <div class="text1">仅展示</div>
-                        <div class="text2">{{ displayInformation.onlyShowNum }}</div>
-                    </div>
-                </div>
                 <template v-for="(item, index) in showList" :key="index">
                     <product-info dark v-model:info="list[index]" @update:info="init"></product-info>
                 </template>
@@ -723,7 +723,7 @@ export default {
         box-sizing: border-box;
         background: #222426;
         display: flex;
-        justify-content: space-between;
+        // justify-content: space-between;
         flex-wrap: wrap;
         // transition: height ease-in-out 0.4s;
         .series_selection_con {
@@ -750,37 +750,17 @@ export default {
     }
 }
 /deep/.sala {
-    position: absolute;
-    right: 16px;
-    bottom: 11px;
-    color: @text3!important;
-    min-width: 92px;
-    font-size: 14px;
-    background: #272b2e !important;
-    // .van-checkbox__icon {
-    //     color: #fff;
-    //     transform: scale(0.6);
-
-    //     .van-icon {
-    //         border-color: @text3;
-    //     }
-
-    //     &.van-checkbox__icon--checked {
-    //         .van-icon {
-    //             border-width: 0;
-    //             .linear();
-    //             &::before {
-    //                 color: #fff;
-    //             }
-    //         }
-    //     }
-    // }
-    // .van-checkbox__label {
-    //     color: @text3;
-    //     margin-left: 0px;
-    //     font-size: @font1;
-    // }
+    color: #939599 !important;
+    white-space: nowrap;
+    font-size: 12px;
+    color: #939599;
+    line-height: 24px;
+    --van-checkbox-label-color: #939599;
+    --van-checkbox-size: 14px;
+    --van-checkbox-label-margin: 4px;
+    margin-right: 20px;
 }
+
 .swiperContent {
     background: #222426;
     border-bottom: 1px solid #272b2e;
@@ -927,13 +907,15 @@ export default {
         }
     }
 }
-
+.classify-content {
+    background-color: #222426;
+    padding:0 16px 16px;
+}
 .classify-list {
     .flex();
     justify-content: space-between;
-    background: #373b3e;
+    background: #272b2e;
     border-radius: 8px;
-    margin: 8px;
 
     .classify-info {
         width: 33%;