update 优化

xuxueyang

2024-09-12 73341eba8e313c2aead0476026bc362b8c4be4b1

 sub_pages/customer/trade/trade.vue

@@ -1,5 +1,5 @@
<template>
   <view class="container-trade" :style="{'min-height':hidefooter?'':'calc(100vh - 20rpx)'}">
   <view class="container-trade" :style="{'min-height':hidefooter?'':'calc(100vh - 20rpx)','max-height':hidefooter?'':'calc(100vh - 20rpx)'}">
      <view class="search-container m-t-12 flex" v-if="!hidefooter">
         <!-- <view class="flex m-r-20">
            <view class="m-r-10" style="line-height: 80rpx;" @click="changeSearchType">
@@ -9,7 +9,8 @@

         </view> -->
         <view class="flex m-r-20">
            <um-dropdown width="200rpx" style="line-height: 80rpx;" @change="fnChange" :defaultIndex="def" rangeKey="label" :optionList="typeList"></um-dropdown>
            <um-dropdown width="200rpx" style="line-height: 80rpx;" @change="fnChange" :defaultIndex="def"
               rangeKey="label" :optionList="typeList"></um-dropdown>
         </view>
                
         <view class="flex1 input">
@@ -21,7 +22,8 @@
                  <uni-icons color="#20613D" type="search" size="24" @click="buttonSearchFlow"></uni-icons>
               </template>
            </u-input> -->
            <u-input :placeholder="search_home_placeholder" v-model="search_flow" clearable @confirm="buttonSearchFlow" @clear="()=>{
            <u-input :placeholder="search_home_placeholder" v-model="search_flow" clearable
               @confirm="buttonSearchFlow" @clear="()=>{
               $nextTick(()=>{buttonSearchFlow()})
            }">
               <!-- <u--text text="http://" slot="prefix" margin="0 3px 0 0" type="tips"></u--text> -->
@@ -34,7 +36,7 @@
                        
         </view>
      </view>
      <view class="canteen-items" :style="{'min-height':hidefooter?'':'calc(100vh - 340rpx)'}">
      <view class="canteen-items" :style="{'min-height':hidefooter?'':'calc(100vh - 340rpx)','max-height':hidefooter?'':'calc(100vh - 340rpx)'}">
         <view v-if="(!list||list.length==0)&&true" style="width: 100%;min-height: 200rpx;">
            &nbsp;
         </view>
@@ -47,43 +49,36 @@
               </view>
            </view>
            <view class="canteen-item-container">
               <!--               <view class="component-filter-container" style="padding-top: 12rpx;">-->
               <!--                  <view class="flex1" @click="openParamPop">-->
               <!--                     筛选-->
               <!--                  </view>-->
               <!--                  <view class="flex1">-->
               <!--                     颜色<image src="../../../static/common/icon-arrow-down.png" class="icon-arrow-down"></image>-->
               <!--                  </view>-->
               <!--                  <view class="flex1">-->
               <!--                     筛选<image src="../../../static/common/icon-arrow-down.png" class="icon-arrow-down"></image>-->
               <!--                  </view>-->
               <!--               </view>-->
               <!--               <u-divider></u-divider>-->
               <view class="flex">
                  <view v-for="(item,index) of listFilter" :key="item.id" class="canteen-item list"
                     @click.stop="toDetailList(item)">
               <view v-for="(item,index) of listFilter" :key="item.id"
                  class="canteen-item list flex flex-wrap-normal" @click.stop="toDetailList(item)">
                     <view class="m-r-10">
                        <!-- @click.stop="previewImg(item.imageUrl)" -->
                        <image :src="item.imageUrl" :class="[!item.stock?'':'']" mode="scaleToFill"
                           class="cover" :lazy-load="true">
                     <image :src="item.imageUrl" :class="[!item.stock?'':'']" mode="scaleToFill" class="cover"
                        :lazy-load="true">
                        </image>
                     </view>
                  <view class="flex1">
                     <view class="cateen_infos list">
                        <view class="title">{{item.name}}</view>

                        <view class="title flex">
                           {{item.name}}
                           <view class="desc m-l-a m-r-0">在售 {{item.stock||'0'}} 扎</view>
                        </view>
                        <view class="price">
                           <!-- <view>会员价</view> -->
                           <view>￥{{item.priceLowMember || 0}}-{{item.priceHighMember||0}}</view>
                           <view>￥{{item.priceLowMember || 0}}-{{item.priceHighMember||0}}/扎</view>
                        </view>                        
                        <!-- <view class="price component-price-old">￥{{item.priceLow || 0}}-{{item.priceHigh||0}}</view> -->
								

                        <view class="desc">在售 {{item.stock||'0'}} 扎</view>
                        <view class="flex info">
                           <view class="m-r-15">
                              库存:{{item.stock || 0}}
                           </view>
                           <view>
                              {{item.unit || ''}}
                           </view>
                     </view>

                  </view>
                  </view>
               </view>

                  <view style="padding-bottom:40rpx">
                  </view>
               </view>
               <footer-msg v-if="!hidefooter" :more="page.total>0&&page.total>page.current*page.size"></footer-msg>

@@ -142,8 +137,7 @@
            currentCategory: {},
            type: 'category', //supplier
            def: 0,
            typeList:[
               {
            typeList: [{
                  label: '按鲜花',
                  value: 'flower',
               },
@@ -401,7 +395,7 @@
   .container-trade {
      background-color: #FFFFFF;
      padding-top: 20rpx;

      // overflow-x: scroll;
      .search-container {
         margin: 0rpx 30rpx 20rpx 30rpx;
      }
@@ -455,14 +449,15 @@
         // margin-left: 30rpx;

         .canteen-item {
            margin: 0 auto;
            width: 164rpx;
            // margin: 0 auto;
            // width: 164rpx;
            // width: 690rpx;
            // max-width: 690rpx;
            min-height: 266rpx;
            // min-height: 266rpx;
            background: #FFFFFF;
            margin-bottom: 44rpx;
            max-width: 164rpx;
            // margin-bottom: 44rpx;
            // max-width: 164rpx;
            margin-bottom: 20rpx;

            .cover {
               width: 164rpx;
@@ -477,12 +472,13 @@
               font-size: 28rpx;
               color: #000000;
               line-height: 40rpx;
               min-height: 80rpx;
               // min-height: 50rpx;
               text-align: center;
               // margin-top: 10rpx;
            }

            .desc {
               margin-top: 8rpx;
               // margin-top: 8rpx;
               font-weight: 400;
               font-size: 24rpx;
               color: #6E9F66;
@@ -491,6 +487,7 @@
               background-color: rgba(202, 229, 214, 0.57);
               border-radius: 4rpx;
               text-align: center;
               // margin-top: 12rpx;

            }

@@ -499,9 +496,17 @@
               font-size: 28rpx;
               color: #CF0000;
               line-height: 34rpx;
               text-align: center;
               text-align: left;
               margin-top: 12rpx;
            }

            .info {
               font-weight: 400;
               font-size: 28rpx;
               margin-top: 12rpx;
               color: #666666;
               line-height: 40rpx;
            }



@@ -512,23 +517,24 @@
            width: 100%;
            min-height: 300rpx;
            max-height: calc(100vh - 270rpx);
            overflow-y: scroll;
            padding-right: 20rpx;
            overflow-x: scroll;
         }

         .canteen-item:nth-child(3n+1) {
            margin-left: 0rpx;
            margin-right: 15rpx;
         }
         // .canteen-item:nth-child(3n+1) {
         //    margin-left: 0rpx;
         //    margin-right: 15rpx;
         // }

         .canteen-item:nth-child(3n+2) {
            margin-left: 15rpx;
            margin-right: 15rpx;
         }
         // .canteen-item:nth-child(3n+2) {
         //    margin-left: 15rpx;
         //    margin-right: 15rpx;
         // }

         .canteen-item:nth-child(3n+3) {
            margin-left: 15rpx;
            margin-right: 0rpx;
         }
         // .canteen-item:nth-child(3n+3) {
         //    margin-left: 15rpx;
         //    margin-right: 0rpx;
         // }
      }

      .canteen-footer-shop {