后台管理系统【商品分类】

最新推荐文章于 2025-03-30 14:16:42 发布

前端念初

最新推荐文章于 2025-03-30 14:16:42 发布

阅读量841

点赞数

文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/weixin_62765236/article/details/127234314

版权

本文介绍如何使用Vue.js框架来开发后台商品分类管理系统，通过JavaScript技术实现商品分类的增删改查功能，详细讲解关键代码和实现逻辑。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<template>
  <div>
      <!-- A面包屑导航区域 -->
			<el-breadcrumb separator-class="el-icon-arrow-right">
				<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
				<el-breadcrumb-item>用户管理</el-breadcrumb-item>
				<el-breadcrumb-item>商品分类</el-breadcrumb-item>
			</el-breadcrumb>

      <!-- B卡片视图区域 -->
      <el-card>
        <el-row>
          <el-col><el-button type="primary" @click="showAddCateDialog">
          添加分类</el-button></el-col>
        </el-row>
       <!-- 表格  树型表格  需要在main.js引入一下  npm i vue-table-with-tree-grid -S -->
        <tree-table class="treeTable" :data="catelist" :columns="columns"
         :selection-type="false" :expand-type="false"
         show-index index-text="#" border :show-row-hover="false">
                <!-- 是否有效 -->
          <template slot="isok" slot-scope="scope">
              <i class="el-icon-success" 
              v-if="scope.row.cat_deleted===false"
              style="color:lightgreen">
              </i>
              <i class="el-icon-error" 
              v-else
              style="color:lightgreen">
              </i>
          </template>
          <!-- 排序 -->
          <template slot="order" slot-scope="scope">
             <el-tag size="mini" v-if="scope.row.cat_level===0">一级</el-tag>
             <el-tag size="mini" v-else-if="scope.row.cat_level===1" type="success">
             二级</el-tag>
             <el-tag size="mini" v-else type="warning">三级</el-tag>
          </template>
          <!-- 操作  编辑 删除按钮-->
          <template slot="opt" slot-scope="scope">  
            <!-- {
  {scope.row}}           -->
              <el-button size="mini" icon="el-icon-edit" type="primary" @click="showCateEditDialog(scope.row.cat_id)">
                编辑</

最低0.47元/天解锁文章