hmy_farmer-main
blame | 历史 | 补丁 | 提交 | 提交对比 | 忽略空白
xuxueyang
2024-09-09 c3319db3d83f2d4fa7fdf06e3792496ce77d90aa 
 sub_pages/customer/shop/shop.vue


@@ -2,15 +2,7 @@


   <view class="brand-detail" style="background: #20613D;">







      <view class="brand-top-info">



         <view class="search-container  flex" style="padding-left: 20rpx;padding-right: 20rpx;padding-top: 20rpx">



            <view class="flex1 input">



               <u-input placeholder="请输入花名" v-model="search_flow">



                  <template slot="suffix">



                     <uni-icons color="#20613D" type="search" size="24" @tap="buttonSearchFlow"></uni-icons>



                  </template>



               </u-input>



            </view>



         </view>







         <view class="info-brand m-t-12" v-if="id">



            <view class="flex">



               <image class="store-logo" :src="dto.cover"></image>



@@ -38,21 +30,21 @@


         </view>



         <view class="tj-info m-t-12">



            <view class="form-item">



               <view class="value">0</view>



               <view class="value">{{page.total || 0}}</view>



               <view class="label">发布</view>



            </view>



            <view class="form-item">



               <view class="value">0</view>



               <view class="value">*</view>



               <view class="label">获赞</view>



            </view>



            <view class="form-item">



               <view class="value">0</view>



               <view class="value">*</view>



               <view class="label">粉丝</view>



            </view>



            <view class="form-item">



            <!-- <view class="form-item">



               <view class="value">0</view>



               <view class="label">关注</view>



            </view>



            </view> -->



         </view>



         <view class="p10" style="padding-left: 20rpx;padding-right: 20rpx;">



            <top-tabs :tabs="tabs" :flg="flg" @change="changeTab">



@@ -61,82 +53,124 @@


         </view>



      </view>



      <view class="brand-info">



         <view v-if="flg==='0'" class="brand-info-0">



            <view class="component-filter-container" style="padding-top: 12rpx;">



               <view class="flex1">



                  排序



         <view v-show="flg==='0'||flg==='1'" class="brand-info-0">



            <view class="search-container  flex"



               style="padding-left: 20rpx;padding-right: 20rpx;padding-top: 20rpx">



               <view class="flex1 input">



                  <u-input placeholder="请输入花名" v-model="query.name" clearable @confirm="buttonSearchFlow" @clear="()=>{



               $nextTick(()=>{buttonSearchFlow()})



            }">



                     <template slot="suffix">



                        <uni-icons color="#20613D" type="search" size="24"



                           @click="buttonSearchFlow"></uni-icons>



                     </template>



                  </u-input>



               </view>



            </view>



            <view class="component-filter-container" style="padding-top: 12rpx;" v-show="flg==='0'">



               <view class="flex1" @click.stop="$refs.popup_column.open()">



                  排序{{ query.columnStr&&('-'+query.columnStr) || '' }}



                  <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 class="flex1">



                  参数



               <view class="flex1" @click.stop="$refs.popup_level.open()">



                  {{ query.levelStr || '级别' }}



                  <image src="../../../static/common/icon-arrow-down.png" class="icon-arrow-down"></image>



               </view>



            </view>



            <view class="top-title">



            <view class="top-title m-t-12" v-show="flg==='0'">



               报价已包含打包费、材料费、交易佣金



            </view>



            <view class="component-shop-item flex" v-for="(item,index) of list" :key="index"



               @click.stop="toDetail(item)">



               <view class="img">



                  <image class="img img100" :src="item.cover" lazy-load>



                  </image>



                  <view class="level">



                     {{item.levelStr||''}}



            <no-data v-if="(!list||list.length==0)&&true" style="width: 100%;margin-top: 120rpx;"></no-data>



            <view class="flex m-t-12 flex-wrap-normal">



               <view class="type-list" v-if="flg==='1'">



                  <view v-for="(item,index) of catgoryTree" @click="changeType(item)"



                     :class="[query.categoryRoot===item.id?'current':'']" :key="index"



                     class="p10 flex type-item">



                     {{item.name || '-'}}



                  </view>



               </view>



               <view class="flex1">







               <view class="m-l-12 info-container flex1">



                  <view class="title">



                     {{item.name}}



                     <view class="price">



                        ￥{{item.price}}/扎



                     </view>



                  </view>



                  <view class="shop-name">



                     {{item.categoryStr}}



                  </view>



                  <view class="other-info flex">



                     <view class="m-r-15">



                        已售:{{item.sales || 0}}



                     </view>



                     <view class="m-r-15">



                        剩余:{{item.stock || 0}}



                     </view>



                     <view class="m-r-15">



                        {{item.unit}}



                     </view>



                  </view>



                  <view class="bottom-buttons  flex">



                     <view class="m-l-0 m-r-a">



                        <view class="m-r-15">



                           颜色:{{item.color||'-'}}







                  <view class="component-shop-item flex" v-for="(item,index) of list" :key="index"



                     :class="flg==='1'?'flg-category':''">



                     <view class="img" @click.stop="toDetail(item)">



                        <image class="img img100" :src="item.cover" lazy-load>



                        </image>



                        <view class="level">



                           {{item.levelStr||''}}



                        </view>



                     </view>



                     <view class="icons flex">



                        <uni-icons v-if="item.shopnum&&item.shopnum>=1" type="minus" size="32"



                           @click.stop="addnum(item,-1)"></uni-icons>



                        <view class="curnums" @click="updateItemNum(item)" v-if="item.shopnum&&item.shopnum>=1">



                           {{ item.shopnum }}







                     <view class="m-l-12 info-container flex1">



                        <view class="title" @click.stop="toDetail(item)">



                           {{item.name}}



                           <!-- #ifdef PUB_CUSTOMER_DEV -->



                           <view class="price component-price-new">



                              ￥{{item.priceMember||item.price}}/扎<span class="tip">会员价</span>



                              <view class="component-price-old">



                                 ￥{{item.price}}/扎



                              </view>



                           </view>



                           <!-- #endif -->



                           <!-- #ifndef PUB_CUSTOMER_DEV -->



                           <view class="price">



                              ￥{{item.price}}/扎



                           </view>



                           <!-- #endif -->







                        </view>



                        <uni-icons v-if="!item.shopnum||item.shopnum<=99" type="plus-filled" size="32"



                           @click.stop="addnum(item,1)"></uni-icons>



                        <view class="tags" v-if="item.tags||false" @click.stop="toDetail(item)">



                           <!--       <view class="tag red">限时抢购</view>



                        <view class="tag green">品质严选</view> -->



                           <view class="tag red" v-for="(tag,k) of item.tagArr" :class="[k===0?'red':'green']"



                              :key="tag">{{



                          tag



                        }}



                           </view>



                        </view>



                        <!--    <view class="shop-name" @click.stop="toDetail(item)">



                        {{item.categoryStr}}



                     </view> -->



                        <view class="other-info flex" @click.stop="toDetail(item)">



                           <view class="m-r-15">



                              已售:{{ ((item.sales||0) +(item.realSales||0)) || 0}}



                           </view>



                           <view class="m-r-15">



                              剩余:{{item.stock || 0}}



                           </view>



                           <view class="m-r-15">



                              {{item.unit}}



                           </view>



                        </view>



                        <view class="bottom-buttons  flex">



                           <view class="m-l-0 m-r-a">



                              <view class="m-r-15 desc-gray other-info">



                                 颜色:{{item.color||'-'}}



                              </view>



                           </view>



                           <view class="icons flex">



                              <uni-icons v-if="item.shopnum&&item.shopnum>=1" type="minus" size="32"



                                 @click.stop="addnum(item,-1)"></uni-icons>



                              <view class="curnums" @click.stop="updateItemNum(item)"



                                 v-if="item.shopnum&&item.shopnum>=1">



                                 {{ item.shopnum }}



                              </view>



                              <uni-icons v-if="!item.shopnum||item.shopnum<=99" type="plus-filled" size="32"



                                 @click.stop="addnum(item,1)"></uni-icons>



                           </view>



                        </view>



                     </view>



                  </view>



               </view>



            </view>







         </view>







         <view v-if="flg==='1'" class="brand-info-1">



            <trade :hidefooter="true" :catgoryTree="catgoryTree" v-if="catgoryTree" ref="trade"></trade>



            <!-- // 构建一个分类树 -->



            <!-- catgoryTree -->







         <!-- <view v-show="flg==='1'" class="brand-info-1">



            <trade :hidefooter="true" :supplierId="id" :catgoryTree="catgoryTree" v-if="catgoryTree" ref="trade">



            </trade>



         </view>



          -->



         <view v-if="flg==='2'" class="brand-info-3">



            <view class="title">



               基础信息



@@ -155,17 +189,68 @@


            </view>



            <view class="form-input flex">



               <view class="label">身份认证</view>



               <view class="value">个人身份认证</view>



               <view class="value">{{dto.idcardTypeStr||'未认证'}}</view>



            </view>



            <!--    <view class="form-input flex">



               <view class="label">&nbsp;&nbsp;</view>



               <view class="value">{{'已实名'}}</view>



            </view> -->



         </view>



      </view>



      <uni-popup ref="popup_column" type="bottom">



         <view class="component-popup_input_all">



            <view class="text-center m-b-40" style="font-size: 48rpx;font-weight: 600;">点击选择不同排序</view>



            <view v-for="(item,i) in order_columns" :key="i" class="m-t-20">



               <view class="m-t-12 flex value-items">



                  <view class="value-item" @click="()=>{



                     if(each.value!==query.value){



                        query.column = each.value



                        query.columnStr = each.label



                        refreshList('post')



                        $refs.popup_column.close()



                     }																																						


                  }" :class="[query.column==each.value?'cur':'']" v-for="(each, j) in item" :key="j">



                     {{ each.label || '-' }}



                  </view>



               </view>



            </view>



            <view class="button-space"></view>



            <view>



               <view class="button-green" @click="$refs.popup_column.close()">关闭



               </view>



            </view>



         </view>



      </uni-popup>











      <uni-popup ref="popup_level" type="bottom">



         <view class="component-popup_input_all">



            <view class="text-center m-b-40" style="font-size: 48rpx;font-weight: 600;">点击选择不同级别</view>



            <view v-for="(item,i) in level_columns" :key="i" class="m-t-20">



               <view class="m-t-12 flex value-items">



                  <view class="value-item" @click="()=>{



                     if(each.value!==query.value){



                        query.level = each.value



                        query.levelStr = each.label



                        refreshList('post')



                        $refs.popup_level.close()



                     }																																						


                  }" :class="[query.level==each.value?'cur':'']" v-for="(each, j) in item" :key="j">



                     {{ each.label || '-' }}



                  </view>



               </view>



            </view>



            <view class="button-space"></view>



            <view>



               <view class="button-green" @click="$refs.popup_level.close()">关闭



               </view>



            </view>



         </view>



      </uni-popup>



   </view>



</template>







<script>



   import trade from '@/sub_pages/customer/trade/trade.vue'



   import trade from './shop-trade.vue'



   import http from "../../../plugins/http";







   export default {



@@ -174,7 +259,7 @@


      },



      data() {



         return {



            search_flow: '',



            // search_flow: '',



            flg: '0',



            tabs: [{



                  name: '全部商品'



@@ -193,24 +278,111 @@


            list: [],



            id: '',



            catgoryTree: undefined,



            query: {



               columnStr: '',



               column: '',



               levelStr: '',



               level: '',



               name: '',



               categoryRoot: '',



            },



            level_show: false,



            level_columns: [



               []



            ],







            order_show: false,



            order_columns: [



               []



            ]



         }



      },



      onShow() {



         //避免商品数目不一样			


         this.refreshList('post')



      },



      async onPullDownRefresh() {



         if (this.id) {



            await this.getDetail()



         }



         await this.refreshList('post')



         uni.stopPullDownRefresh()







      },



      onLoad(options) {



         this.id = options.id || ''



         // this.page.size =



         this.page.size = 300



         if (this.id) {



            this.getDetail()



         }



         this.listApi = `/api/customer/flower/list`



         this.query.supplierId = this.id



         this.getList('post')



         this.$http.request('get', '/api/code/value', {



            params: {



               type: 'FLOWER_LEVEL'



            }



         }).then(res => {



            var data = res.data



            this.level_columns = [data || []]



            this.level_columns[0].unshift({



               label: '全部',



               value: ''



            })



         })



         this.$http.request('get', '/api/code/value', {



            params: {



               type: 'FLOWER_ORDER_BY'



            }



         }).then(res => {



            var data = res.data



            this.order_columns = [data || []]



            this.order_columns[0].unshift({



               label: '默认',



               value: ''



            })



         })



      },



      onReachBottom() {



         if (this.flg === '0') {



            this.getMore('post')



      // #ifdef PUB_CUSTOMER



      onShareAppMessage() {



         let that = this;



         var name = that.currentInfo.customerDTO && that.currentInfo.customerDTO.name || that.currentInfo.supplierDTO &&



            that.currentInfo.supplierDTO.name || that.currentInfo.partnerDTO && that.currentInfo.partnerDTO.name || ''



         var url =



            `/sub_pages/customer/shop/shop?id=${this.id}&shareId=${this.currentInfo&&this.currentInfo.id||''}&shareName=${name||''}`; //你的转发页面路径拼接参数



         return {



            title: this.dto.id && this.dto.name ? (this.dto.name + " 的店铺") : "花满芫",



            path: url,



         }



      },



      onShareTimeline() {



         let that = this;



         var name = that.currentInfo.customerDTO && that.currentInfo.customerDTO.name || that.currentInfo.supplierDTO &&



            that.currentInfo.supplierDTO.name || that.currentInfo.partnerDTO && that.currentInfo.partnerDTO.name || ''



         var url =



            `/sub_pages/customer/shop/shop?id=${this.id}&shareId=${this.currentInfo&&this.currentInfo.id||''}&shareName=${name||''}`; //你的转发页面路径拼接参数



         return {



            title: this.dto.id && this.dto.name ? (this.dto.name + " 的店铺") : "花满芫",



            path: url,



         }



      },



      // #endif



      onReachBottom() {



         // if (this.flg === '0') {



         //    this.getMore('post')



         // }



      },



      methods: {



         getList_after() {



            if (this.list) {



               for (var item of this.list) {



                  item.tagArr = []



                  if (item.tags) {



                     item.tagArr = item.tags.split(",") || []



                  }



               }



            }



         },







         async getDetail() {



            {



@@ -278,7 +450,13 @@


         },



         async changeTab(flg) {



            console.log('changeTab', flg)



            if ('0' === ('' + flg)) {



               //刷新list数据



               this.query.categoryRoot = ''



               this.refreshList('post')



            }



            if ('1' === ('' + flg)) {



               this.list = []



               if (!this.catgoryTree) {



                  this.$message.showLoading()



                  const {



@@ -295,21 +473,38 @@


                  if (code === 0) {



                     // data 分类树



                     this.catgoryTree = data || []



                     let tmp = this



                     this.$nextTick(() => {



                        tmp.$refs.trade.refInit(tmp.catgoryTree)



                     })



                     // let tmp = this



                     // this.$nextTick(() => {



                     //    tmp.$refs.trade.refInit(tmp.catgoryTree)



                     // })



                  }



                  this.$message.hideLoading()



               }



               //如果存在第一个分类，根据一级分类查询



               if (this.catgoryTree.length > 0) {



                  this.query.categoryRoot = this.catgoryTree[0].id



                  //然后刷新



                  this.refreshList('post')







               }







            }



            this.flg = '' + flg



            //如果没有加载数据，需要加载一下











         },



         buttonSearchFlow() {



         changeType(item) {



            if (item.id !== this.query.categoryRoot) {



               this.query.categoryRoot = item.id || ''



               this.refreshList('post')



               //拼接二级分类，然后查询商品列表



            }







         },



         buttonSearchFlow() {



            // this.query.name = this.search_flow || ''



            this.refreshList('post')



         },



         async updateItemNum(item) {



            const res = await this.$message.confirm('', {



@@ -348,7 +543,7 @@


            if (!item.stock) {



               item.stock = 0



            }



            if (item.shopnum + addnum > item.stock) {



            if (addnum > 0 & item.shopnum + addnum > item.stock) {



               this.$message.showToast('库存不足，无法修改')



               return



            }



@@ -373,12 +568,43 @@


            }



         },







         toDetail(item) {



            uni.navigateTo({



               url: `/sub_pages/customer/trade/detail?id=${item.id}`



            })



         },



      }



   }



</script>







<style lang="scss" scoped>



   .brand-detail {



      .tags {



         margin-top: 12rpx;



         display: flex;







         .tag {



            // min-width: 60rpx;



            padding-left: 10rpx;



            padding-right: 10rpx;



            line-height: 30rpx;



            background: #FEE6E6;



            border-radius: 10rpx;



            font-size: 18rpx;



            color: #CD1212;



            margin-right: 6rpx;



            text-align: center;



         }







         .tag.green {



            color: rgba(110, 159, 102, 1);



            background: rgba(202, 229, 214, 1);



            border-radius: 10rpx;



            // opacity: 0.57;



         }



      }







      // min-height: 99vh;



      .brand-info {



         background: #FFFFFF;



         // border-radius: 40rpx 40rpx 0rpx 0rpx;



@@ -387,9 +613,62 @@


         overflow: hidden;



         overflow-y: scroll;



         padding: 40rpx 32rpx;



         height: calc(100vh - 650rpx);



         min-height: calc(100vh - 470rpx);



         max-height: calc(100vh - 470rpx);



         padding-top: 0rpx;







         .type-list {



            max-width: 140rpx;



            min-width: 140rpx;



            background: #EEF7F5;



            border-radius: 8rpx;



            min-height: calc(100vh - 600rpx);



            // max-height: calc(100vh - 600rpx);



            overflow-y: scroll;



            margin-right: 10rpx;







            .type-item {



               text-align: center;



               font-weight: 400;



               font-size: 24rpx;



               color: #000000;



               display: block;



               line-height: 60rpx;



               // padding-left: 30rpx;



               // padding-right: 30rpx;



            }







            .type-item.current {



               font-weight: 600;



               color: #04BA97;



            }



         }







         .flg-category.component-shop-item {



            .img {



               width: 140rpx;



               height: 140rpx;



               margin-top: 10rpx;



            }







            .info-container {



               .title {



                  margin-top: 0rpx;



               }







               .shop-name {}







               .other-info {



                  margin-bottom: 60rpx;



               }







               .bottom-buttons {



                  bottom: -50rpx;



               }



            }







         }







         .brand-info-0 {



            .top-title {



               height: 60rpx;