绿满眶商城微信小程序-uniapp
zxl
2025-07-11 9e0d2563ee3adc08b27f365e315855d776fd08f0
pages/supplier/publish-goods/chooseCategery.vue
New file
@@ -0,0 +1,66 @@
<template>
   <view class="container">
      <scroll-view scroll-y="true" style="height: 70vh">
         <view class="categeryContainer">
            <view class="categeryItem" v-for="item in categeryList" :key="item.id" @click="chooseCategery(item.id,item.name)">
               <view class="cateGeryName" :class="{chooseCategeryStyle:chooseCategeryId==item.id}">
                  {{item.name}}
               </view>
            </view>
         </view>
      </scroll-view>
      <view class="">您当前选择的商品类别是:{{categeryName}}</view>
   </view>
</template>
<script>
   import {
      getMyActivityList
   } from '@/api/supplier.js'
   export default {
      data() {
         return {
            categeryName:'',
            chooseCategeryId: '',
            categeryList: [],
         }
      },
      methods:{
         // 父组件获取选择的分类
         getCategery() {
            return this.chooseCategeryId
         },
         chooseCategery(id,name){
            this.chooseCategeryId =id
            this.categeryName = name
            this.$emit("choose", this.chooseCategeryId)
         }
      },
      async mounted() {
         const categeryList = await getMyActivityList();
         this.categeryList = categeryList.data.result;
      }
   }
</script>
<style>
   .categeryContainer {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: flex-start;
   }
   .categeryItem {
      height: 120rpx;
      display: flex;
      align-items: center;
      justify-content: center;
   }
   .chooseCategeryStyle{
      color: #e06c75;
      font-weight: bold;
      font-size: 1.2em;
   }
</style>