sf

jiangping

2025-04-30 dcdb0231034810232f2542f3865666ebf72daf11

 company_admin/src/views/business/category.vue

@@ -1,81 +1,95 @@
<template>
    <TableLayout :permissions="['business:category:query']">
      <!-- 搜索表单 -->
      <el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="100px" inline>
        <el-form-item label="类别名称" prop="name">
          <el-input v-model="searchForm.name" placeholder="请输入类别名称" @keypress.enter.native="search"></el-input>
        </el-form-item>
        <section>
          <el-button type="primary" @click="search">搜索</el-button>
          <!-- <el-button type="primary" :loading="isWorking.export" v-permissions="['business:category:exportExcel']" @click="exportExcel">导出</el-button> -->
          <el-button @click="reset">重置</el-button>
        </section>
      </el-form>
      <!-- 表格和分页 -->
      <template v-slot:table-wrap>
        <ul class="toolbar" v-permissions="['business:category:create']">
          <li><el-button type="primary" @click="$refs.operaCategoryWindow.open('新建类别')" icon="el-icon-plus" v-permissions="['business:category:create']">新建</el-button></li>
        </ul>
        <el-table
          v-loading="isWorking.search"
          :data="tableData.list"
          stripe
          border
          :header-cell-style="rowStyle"
          :cell-style="rowStyle"
  <TableLayout :permissions="['business:category:query']">
    <!-- 搜索表单 -->
    <el-form ref="searchForm" slot="search-form" :model="searchForm" label-width="100px" inline>
      <el-form-item label="类别名称" prop="name">
        <el-input v-model="searchForm.name" placeholder="请输入类别名称" @keypress.enter.native="search"></el-input>
      </el-form-item>
      <el-form-item label="类型" prop="type">
        <el-select v-model="searchForm.type" clearable placeholder="请选择">
          <el-option
            v-for="item in typeList"
            :key="item.id"
            :label="item.name"
            :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>
      <section>
        <el-button type="primary" @click="search">搜索</el-button>
        <!-- <el-button type="primary" :loading="isWorking.export" v-permissions="['business:category:exportExcel']" @click="exportExcel">导出</el-button> -->
        <el-button @click="reset">重置</el-button>
      </section>
    </el-form>
    <!-- 表格和分页 -->
    <template v-slot:table-wrap>
      <ul class="toolbar" v-permissions="['business:category:create']">
        <li><el-button type="primary" @click="$refs.operaCategoryWindow.open('新建类别')" icon="el-icon-plus" v-permissions="['business:category:create']">新建</el-button></li>
      </ul>
      <el-table
        v-loading="isWorking.search"
        :data="tableData.list"
        stripe
        border
        :header-cell-style="rowStyle"
        :cell-style="rowStyle"
      >
        <el-table-column prop="imgurl" label="图标" min-width="100px">
          <template slot-scope="{row}">
              <el-image
              v-if="row.imgurl"
              style="width: 70px; height: 70px"
              :src="row.prefixUrl + row.imgurl"
              :preview-src-list="[row.prefixUrl + row.imgurl]"
              fit="cover"></el-image>
          </template>
        </el-table-column>
        <el-table-column prop="name" label="类别名称" min-width="100px"></el-table-column>
        <el-table-column prop="categoryName" label="类型" min-width="100px">
          <template slot-scope="{row}">
            <span v-if="row.type == 0">自定义</span>
            <span v-else>系统</span>
          </template>
        </el-table-column>
        <el-table-column prop="sortnum" label="排序码(升序)" min-width="100px"></el-table-column>
        <el-table-column prop="createDate" label="创建时间" min-width="100px"></el-table-column>
        <el-table-column prop="status" label="状态" min-width="100px">
          <template slot-scope="{row}">
              <el-switch
                  v-model="row.status"
                  @change="changeStatus(row)"
                  active-color="#13ce66"
                  inactive-color="#ff4949"
                  :active-value="0"
                  :inactive-value="1">
              </el-switch>
          </template>
        </el-table-column>
        <el-table-column
          v-if="containPermissions(['business:category:update', 'business:category:delete'])"
          label="操作"
          min-width="120"
          fixed="right"
        >
          <el-table-column prop="imgurl" label="图标" min-width="100px">
            <template slot-scope="{row}">
                <el-image
                v-if="row.imgurl"
                style="width: 70px; height: 70px"
                :src="row.prefixUrl + row.imgurl"
                :preview-src-list="[row.prefixUrl + row.imgurl]"
                fit="cover"></el-image>
            </template>
          </el-table-column>
          <el-table-column prop="name" label="类别名称" min-width="100px"></el-table-column>
          <el-table-column prop="attrFirst" label="属性1" min-width="100px"></el-table-column>
          <el-table-column prop="attrSecond" label="属性2" min-width="100px"></el-table-column>
          <el-table-column prop="sortnum" label="排序码(升序)" min-width="100px"></el-table-column>
          <el-table-column prop="createDate" label="创建时间" min-width="100px"></el-table-column>
          <el-table-column prop="status" label="状态" min-width="100px">
            <template slot-scope="{row}">
                <el-switch
                    v-model="row.status"
                    @change="changeStatus(row)"
                    active-color="#13ce66"
                    inactive-color="#ff4949"
                    :active-value="0"
                    :inactive-value="1">
                </el-switch>
            </template>
          </el-table-column>
          <el-table-column
            v-if="containPermissions(['business:category:update', 'business:category:delete'])"
            label="操作"
            min-width="120"
            fixed="right"
          >
            <template slot-scope="{row}">
              <el-button type="text" @click="edit(row.id)" icon="el-icon-edit" v-permissions="['business:category:update']">编辑</el-button>
              <el-button type="text" @click="deleteById(row)" icon="el-icon-delete" v-permissions="['business:category:delete']">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <pagination
          @size-change="handleSizeChange"
          @current-change="handlePageChange"
          :pagination="tableData.pagination"
        >
        </pagination>
      </template>
      <!-- 新建/修改 -->
      <OperaCategoryWindow ref="operaCategoryWindow" @success="handlePageChange"/>
    </TableLayout>
  </template>
          <template slot-scope="{row}">
            <el-button type="text" @click="edit(row.id)" icon="el-icon-edit" v-permissions="['business:category:update']">编辑</el-button>
            <el-button type="text" @click="deleteById(row)" icon="el-icon-delete" v-permissions="['business:category:delete']">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        @size-change="handleSizeChange"
        @current-change="handlePageChange"
        :pagination="tableData.pagination"
      >
      </pagination>
    </template>
    <!-- 新建/修改 -->
    <OperaCategoryWindow ref="operaCategoryWindow" @success="handlePageChange"/>
  </TableLayout>
</template>
  
  <script>
<script>
  import BaseTable from '@/components/base/BaseTable'
  import TableLayout from '@/layouts/TableLayout'
  import Pagination from '@/components/common/Pagination'
@@ -89,8 +103,13 @@
      return {
        // 搜索
        searchForm: {
          name: ''
        }
          name: '',
          type: ''
        },
        typeList: [
          { name: '自定义', id: 0 },
          { name: '系统', id: 1 }
        ]
      }
    },
    created () {
@@ -129,13 +148,22 @@
              sortnum: res.sortnum,
              paramList: res.paramList,
              imgurl: res.imgurl,
              budgetList: res.budgetList,
              fileList: res.imgurl ? [ {url: res.prefixUrl + res.imgurl} ] : []
              budgetList: res.budgetList.length > 0 ? res.budgetList : [{ maxamount: '', minamount: '' }],
              type: res.type,
              platCateId: res.platCateId,
              tableData: res.paramList.map(item => {
                return {
                  id: item.id,
                  name: item.name,
                  isselect: item.isselect,
                  isshow: item.isshow
                }
              }),
              fileList: res.imgurl ? [{ url: res.prefixUrl + res.imgurl }] : []
            }
            this.$refs.operaCategoryWindow.open('编辑类别', obj)
          })
      }
    }
  }
  </script>
  
</script>