From ee5d8f59c2eb945bfc1251be48c1a7da94e5bd27 Mon Sep 17 00:00:00 2001
From: Krauss <3317187936@qq.com>
Date: Wed, 2 Oct 2024 18:34:55 +0800
Subject: [PATCH] 10-2-18:23

---
 src/router/index.js      |   6 +
 src/views/BookView.vue   |   3 +-
 src/views/LayoutView.vue |   2 +-
 src/views/TypeView.vue   | 288 +++++++++++++++++++++++++++++++++++++++
 4 files changed, 297 insertions(+), 2 deletions(-)
 create mode 100644 src/views/TypeView.vue

diff --git a/src/router/index.js b/src/router/index.js
index 9a35320..58cc513 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -41,6 +41,12 @@ const routes = [
         name: 'book',
         component: () => import('../views/BookView.vue')
       },
+      {
+        path: 'type',
+        name: 'type',
+        component: () => import('../views/TypeView.vue')
+      },
+
     ]
   },
 
diff --git a/src/views/BookView.vue b/src/views/BookView.vue
index 3bcf72e..337a818 100644
--- a/src/views/BookView.vue
+++ b/src/views/BookView.vue
@@ -76,11 +76,12 @@
             <el-input v-model="form.press"  autocomplete="off" style="width: 90%"></el-input>
           </el-form-item>
           <el-form-item label="封面:" label-width="20%">
-            <el-upload action="http://localhost:8080/api/files/upload" :on-success="successUpload">
 
+            <el-upload action="http://localhost:8080/api/files/upload" :on-success="successUpload">
               <el-button size="small" type="primary">点击上传</el-button>
               <div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
             </el-upload>
+
           </el-form-item>
         </el-form>
         <div slot="footer" class="dialog-footer">
diff --git a/src/views/LayoutView.vue b/src/views/LayoutView.vue
index 316ec37..84d2477 100644
--- a/src/views/LayoutView.vue
+++ b/src/views/LayoutView.vue
@@ -46,7 +46,7 @@
             </template>
             <el-menu-item-group>
               <el-menu-item index="/book">图书信息</el-menu-item>
-              <el-menu-item index="/">yyy信息</el-menu-item>
+              <el-menu-item index="/type">图书分类</el-menu-item>
             </el-menu-item-group>
           </el-submenu>
         </el-menu>
diff --git a/src/views/TypeView.vue b/src/views/TypeView.vue
new file mode 100644
index 0000000..7902fb3
--- /dev/null
+++ b/src/views/TypeView.vue
@@ -0,0 +1,288 @@
+<template>
+  <div>
+
+    <div style="margin-bottom:15px">
+    <el-input v-model="params.name" style="width: 200px" placeholder="请输入分类名称"></el-input>
+    <el-input v-model="params.description" style="width: 200px; margin-left:5px" placeholder="请输入描述"></el-input>
+    <el-button type="warning" style="margin-left: 10px;" @click="findBySearch()">查询</el-button>
+    <el-button type="danger" style="margin-left: 10px;" @click="reset()">清空</el-button>
+    <el-button type="primary" style="margin-left: 10px;" @click="add()">新增</el-button>
+
+      <el-popconfirm title="确定删除吗？" @confirm="delBatch()">
+        <el-button slot="reference" type="danger" style="margin-left: 5px" >批量删除</el-button>
+      </el-popconfirm>
+
+      <el-button type="success" style="margin-left: 10px;" @click="outport()">导出报表</el-button>
+
+      <el-upload action="http://localhost:8080/api/type/upload" :on-success="successUpload" style="display: inline-block;margin-left: 10px" :show-file-list="false">
+        <el-button size="small" type="primary">点击上传</el-button>
+      </el-upload>
+
+    </div>
+
+    <div>
+      <el-table :data="tableData" style="width: 100%" @selection-change="handleSelectionChange" ref="table" :row-key="getRowKeys">
+
+        <el-table-column
+            ref="table"
+            type="selection"
+            width="55"
+            align="center"
+            :reserve-selection="true">
+        </el-table-column>
+
+        <el-table-column prop="name" label="分类名称" width="180"></el-table-column>
+        <el-table-column prop="description" label="描述"></el-table-column>
+        <el-table-column label="操作">
+
+          <template v-slot="scope">
+
+            <el-button type="primary" @click="edit(scope.row)">编辑</el-button>
+
+
+               <el-popconfirm title="确定删除吗？" @confirm="del(scope.row.id)">
+                <el-button slot="reference" type="danger" style="margin-left: 5px" >删除</el-button>
+               </el-popconfirm>
+
+
+
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+
+    <div style="margin-top: 10px">
+      <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="params.pageNum"
+          :page-sizes="[5, 10, 15, 20]"
+          :page-size="params.pageSize"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="total">
+      </el-pagination>
+    </div>
+
+    <div>
+      <el-dialog title="请填写信息" :visible.sync="dialogFormVisible" width="30%">
+        <el-form :model="form">
+
+          <el-form-item label="分类名称" label-width="15%">
+            <el-input v-model="form.name"  autocomplete="off" style="width: 90%"></el-input>
+          </el-form-item>
+
+          <el-form-item label="描述" label-width="15%">
+            <el-input v-model="form.description"  autocomplete="off" style="width: 90%"></el-input>
+          </el-form-item>
+
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+          <el-button @click="dialogFormVisible = false">取 消</el-button>
+          <el-button @click="submit()" type="primary">确 定</el-button>
+        </div>
+      </el-dialog>
+    </div>
+
+  </div>
+
+
+</template>
+
+<script>
+import request from "@/utils/request";
+
+
+export default {
+
+  data() {
+    return {
+      multipleSelection: [],
+      tableData: [],
+      form: {},
+      params: {
+        pageNum: 1,
+        pageSize: 5,
+        name: '',
+        description:'',
+      },
+      total: 0,
+      dialogFormVisible: false
+    }
+  },
+
+  //页面加载的时候在此函数做一些事情
+  created() {
+    this.findBySearch()
+  },
+
+  //方法
+  methods:{
+
+
+    findBySearch() {
+      request.get("/type/search",{
+         params: this.params //携带params里的参数
+      }).then(res => {
+        if (res.code === '0'){
+            this.tableData = res.data.list;
+            this.total = res.data.total;
+        }else{
+
+        }
+      })
+    },
+
+    add(){
+      this.form = {};//新增之前先把值清空
+      this.dialogFormVisible = true;
+
+    },
+
+    reset(){
+      this.params = {
+        name: '',
+        description: '',
+        pageNum: 1,
+        pageSize: 5,
+
+      }
+      this.findBySearch()
+    },
+
+    handleSizeChange(pageSize){
+    this.params.pageSize = pageSize;
+    this.findBySearch()
+    },
+
+    handleCurrentChange(pageNum){
+    this.params.pageNum = pageNum;
+    this.findBySearch()
+    },
+
+    submit() {
+      request.post("/type/save",this.form).then(res =>{
+        if(res.code === '0'){
+          this.$message({
+            message: '操作成功',
+            type: 'success'
+          });
+          this.dialogFormVisible = false;
+          this.findBySearch();
+        }else{
+          this.$message({
+            message: res.msg,
+            type: 'error'
+          });
+        }
+      })
+    },
+
+    edit(obj){
+      this.form = obj;
+      this.dialogFormVisible = true;
+    },
+
+    del(id){
+      request.delete("/type/deleteById/"+id).then(res => {
+        if (res.code === '0'){
+          this.$message({
+            message: '删除成功',
+            type: 'success'
+          });
+          this.findBySearch();
+        }else{
+
+        }
+      })
+
+    },
+
+
+
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+
+    delBatch(){
+      if (this.multipleSelection.length === 0){
+        this.$message.warning("请勾选要批量删除的选项！")
+        return;
+      }
+
+      request.put("/type/deleteBatch",this.multipleSelection).then(res =>{
+        if(res.code === '0'){
+          this.$message({
+            message: '操作成功',
+            type: 'success'
+          });
+          this.findBySearch();
+        }else{
+          this.$message({
+            message: res.msg,
+            type: 'error'
+          });
+        }
+      })
+    },
+
+    getRowKeys(row) {
+      return row.id
+      // 需要return的是一个唯一的标识值
+    },
+
+    outport(){
+      let user = localStorage.getItem('user');
+      location.href = 'http://localhost:8080/api/type/outport?token='+JSON.parse(user).token
+    },
+
+    successUpload(res){
+      if (res.code === '0'){
+        this.$message.success("批量导入成功")
+        this.findBySearch()
+      }else {
+        this.$message.error(res.msg);
+      }
+    }
+
+
+
+
+
+
+  }
+}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+</script>
\ No newline at end of file
-- 
Gitee