Merge branch 'qjh' of https://bdgit.educoder.net/pvtfxms7o/yudao

front-end/mall4uni/src/pages/category/category.vue

@@ -2,14 +2,10 @@
   <view class="container">
     <!-- 头部搜索区 -->
     <view class="search-bar">
-      <view
-        class="search-box"
-        @tap="toSearchPage"
-      >
-        <image
-          src="@/static/images/icon/search.png"
-          class="search-img"
-        />
+      <view class="search-box"
+            @tap="toSearchPage">
+        <image src="@/static/images/icon/search.png"
+               class="search-img" />
         <text class="sear-input">
           搜索您想要的商品
         </text>
@@ -18,75 +14,52 @@
     <!-- 滚动内容区 -->
     <view class="main">
       <!-- 左侧菜单start -->
-      <scroll-view
-        scroll-y="true"
-        class="leftmenu"
-      >
-        <block
-          v-for="(item, index) in categoryList"
-          :key="index"
-        >
-          <view
-            :class="'menu-item ' + (selIndex==index?'active':'') + ' '"
+      <scroll-view scroll-y="true"
+                   class="leftmenu">
+        <block v-for="(item, index) in categoryList"
+               :key="index">
+          <view :class="'menu-item ' + (selIndex==index?'active':'') + ' '"
                 :data-index="index"
                 :data-id="item.categoryId"
-            @tap="onMenuTab"
-          >
+                @tap="onMenuTab">
             {{ item.categoryName }}
           </view>
         </block>
-        <view
-          v-if="!categoryList || !categoryList.length"
-          class="ca-empty"
-        >
-          {{ categoryList && categoryList.length ? '该分类下暂无商品' : '暂无商品' }}
+        <view v-if="!categoryList ||!categoryList.length"
+              class="ca-empty">
+          {{ categoryList && categoryList.length? '该分类下暂无商品' : '暂无商品' }}
         </view>
       </scroll-view>
       <!-- 左侧菜单end -->
-
       <!-- 右侧内容start -->
-      <scroll-view
-        scroll-y="true"
-        class="rightcontent"
-      >
+      <scroll-view scroll-y="true"
+                   class="rightcontent">
         <view class="adver-map">
           <view class="item-a">
-            <image
-              :src="util.checkFileUrl(categoryImg)"
-              mode="widthFix"
-            />
+            <image :src="util.checkFileUrl(categoryImg)"
+                   mode="widthFix" />
           </view>
         </view>
         <!-- 子分类 -->
-        <view
-          v-if="subCategoryList.length"
-          class="th-cate-con"
-        >
-          <block
-            v-for="(thCateItem, index) in subCategoryList"
-            :key="index"
-          >
+        <view v-if="subCategoryList.length"
+              class="th-cate-con">
+          <block v-for="(thCateItem, index) in subCategoryList"
+                 :key="index">
             <view class="sub-category">
-              <view
-                class="sub-category-item"
+              <view class="sub-category-item"
                     :data-categoryid="thCateItem.categoryId"
                     :data-parentid="thCateItem.parentId"
-                @tap="toCatePage"
-              >
-                <image
-                  :src="util.checkFileUrl(thCateItem.pic)"
+                    @tap="toCatePage">
+                <image :src="util.checkFileUrl(thCateItem.pic)"
                        class="more-pic"
-                  mode="widthFix"
-                />
+                       mode="widthFix" />
                 <text>{{ thCateItem.categoryName }}</text>
               </view>
             </view>
           </block>
         </view>
-        <view
-          v-else
-          class="cont-item empty"
-        >
+        <view v-else
+              class="cont-item empty">
           该分类下暂无子分类~
         </view>
       </scroll-view>
@@ -96,15 +69,24 @@
 </template>
 
 <script setup>
-import util from '@/utils/util.js'
-const categoryList = ref([])
-const subCategoryList = ref([])
-const categoryImg = ref('')
-const parentId = ref('')
-/**
- * 生命周期函数--监听页面加载
- */
-onLoad(() => {
+  import util from '@/utils/util.js'
+  import { ref, onLoad } from 'vue'
+  import { uni } from '@dcloudio/uni-app'
+  import { http } from '@/utils/http.js' // 假设http请求相关的配置在这里引入，实际根据你的项目结构调整
+
+  // 响应式变量，用于存储分类列表数据，初始值为空数组
+  const categoryList = ref([])
+  // 响应式变量，用于存储子分类列表数据，初始值为空数组
+  const subCategoryList = ref([])
+  // 响应式变量，用于存储分类图片的路径，初始值为空字符串
+  const categoryImg = ref('')
+  // 响应式变量，用于存储父分类ID，初始值为空字符串
+  const parentId = ref('')
+  // 响应式变量，用于记录当前选中的分类菜单项索引，初始值为0
+  const selIndex = ref(0)
+
+  // 生命周期函数 - 在页面加载时触发，一般用于初始化页面数据等操作
+  onLoad(() => {
     // 加载分类列表
     http.request({
       url: '/category/categoryInfo',
@@ -119,30 +101,26 @@ onLoad(() => {
         getProdList(data[0].categoryId)
         parentId.value = categoryList.value[0].categoryId
       })
-})
+  })
 
-const selIndex = ref(0)
-/**
- * 分类点击事件
- */
-const onMenuTab = (e) => {
+  // 分类点击事件处理函数
+  const onMenuTab = (e) => {
     const index = e.currentTarget.dataset.index
     getProdList(categoryList.value[index].categoryId)
     parentId.value = categoryList.value[index].categoryId
     categoryImg.value = categoryList.value[index].pic
     selIndex.value = index
-}
+  }
 
-/**
- * 跳转搜索页
- */
-const toSearchPage = () => {
+  // 跳转搜索页函数
+  const toSearchPage = () => {
     uni.navigateTo({
       url: '/pages/search-page/search-page'
     })
-}
+  }
 
-const getProdList = (categoryId) => {
+  // 获取产品列表的函数
+  const getProdList = (categoryId) => {
     // 加载分类列表
     http.request({
       url: '/category/categoryInfo',
@@ -154,20 +132,18 @@ const getProdList = (categoryId) => {
       .then(({ data }) => {
         subCategoryList.value = data
       })
-}
+  }
 
-/**
- * 跳转子分类商品页面
- */
-const toCatePage = (e) => {
+  // 跳转子分类商品页面的函数
+  const toCatePage = (e) => {
     const { categoryid } = e.currentTarget.dataset
     uni.navigateTo({
       url: `/pages/sub-category/sub-category?parentId=${parentId.value}&categoryId=${categoryid}`
     })
-}
+  }
 
 </script>
 
 <style scoped lang="scss">
-@import "./category.scss";
+  @import "./category.scss";
 </style>