小组管理-增删改查

src/api/school/class.js

@@ -42,3 +42,44 @@ export function delClass(classId) {
     method: 'delete'
   })
 }
+
+//无条件查询班级管理
+export function findUnconditional() {
+  return request({
+    url: '/school/class/findUnconditional',
+    method: 'get'
+  })
+}
+
+//查看小组信息
+export function findGroup(data) {
+  return request({
+    url: '/group/group/list',
+    method: 'get',
+    data
+  })
+}
+
+//添加小祖
+export function addGroup(data) {
+  return request({
+    url: '/group/group/saveGroup',
+    method: 'post',
+    data
+  })
+}
+// 删除小组管理
+export function delGroup(groupId) {
+  return request({
+    url: '/group/group/' + groupId,
+    method: 'delete'
+  })
+}
+// 修改小组管理
+export function updateGroup(data) {
+  return request({
+    url: '/group/group/'+data.groupId,
+    method: 'put',
+    data: data
+  })
+}

src/components/DictTag/index.vue

@@ -82,7 +82,7 @@ export default {
         return pre + " " + cur;
       })
     }
-  }
+  },
 };
 </script>
 <style scoped>

src/views/school/class/index.vue

@@ -10,12 +10,14 @@
         />
       </el-form-item>
       <el-form-item label="班级状态" prop="classState">
-        <el-input
+        <el-select v-model="queryParams.classState" placeholder="请选择班级状态  1 - 未开班  2 - 开班" clearable>
-          v-model="queryParams.classState"
+          <el-option
-          placeholder="请输入班级状态  1 - 未开班  2 - 开班"
+            v-for="dict in dict.type.clazz_on_off"
-          clearable
+            :key="dict.value"
-          @keyup.enter.native="handleQuery"
+            :label="dict.label"
-        />
+            :value="dict.value"
+          />
+        </el-select>
       </el-form-item>
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
@@ -69,17 +71,94 @@
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
+<!--    查看小组信息-->
+    <el-dialog title="小组管理" :visible.sync="dialogTableVisible" @selection-change="handleSelectionChangegroup">
+      <el-button type="success" @click="handleAddGroup" icon="el-icon-plus" circle style="position: absolute; top: 10px; right: 10px;">新增</el-button>
+
+      <el-table :data="groupList" style="width: 100%">
+
+        <el-table-column label="小组序号" width="180">
+          <template slot-scope="scope">
+            <span style="margin-left: 10px">{{ scope.row.groupId }}</span>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="小组名称" width="180">
+          <template slot-scope="scope">
+            <span style="margin-left: 10px">{{ scope.row.groupName }}</span>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="小组人数" width="180">
+          <template slot-scope="scope">
+            <span style="margin-left: 10px">{{ scope.row.groupPeople }}</span>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="小组人员" width="180">
+          <template slot-scope="scope">
+            <span style="margin-left: 10px">{{ scope.row.groupPersonnel }}</span>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="操作">
+          <template slot-scope="scope">
+            <el-button size="mini" @click="handleEdit(scope.row)">编辑</el-button>
+            <el-button size="mini" type="danger" @click="handleDeletegroup(scope.row)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+
+      <!--    小组列表分也-->
+      <pagination
+        v-show="grouptotal>0"
+        :total="grouptotal"
+        :page.sync="queryGroup.pageNum"
+        :limit.sync="queryGroup.pageSize"
+        @pagination="findByGroup"
+      />
+    </el-dialog>
+
+
+
+    <!-- 添加或修改小组管理对话框 -->
+    <el-dialog :title="title" :visible.sync="addupdate" width="500px" append-to-body>
+      <el-form ref="form" :model="group" :rules="rules" label-width="80px">
+        <el-form-item label="小组名称" prop="groupName">
+          <el-input v-model="group.groupName" placeholder="请输入小组名称" />
+        </el-form-item>
+        <el-form-item label="小组人数" prop="groupPeople">
+          <el-input v-model="group.groupPeople" placeholder="请输入小组人数" />
+        </el-form-item>
+        <el-form-item label="小组人员" prop="groupPersonnel">
+          <el-input v-model="group.groupPersonnel" placeholder="请输入小组人员" />
+        </el-form-item>
+        <el-form-item label="班级">
+          <el-select v-model="group.classId" placeholder="请选择班级">
+            <el-option v-for="item in classDown" :label="item.className" :value="item.classId"></el-option>
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitFormgroup">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+
+
     <el-table v-loading="loading" :data="classList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column label="班级ID" align="center" prop="classId" />
       <el-table-column label="班级名称" align="center" prop="className" />
-      <el-table-column label="班级状态  1 - 未开班  2 - 开班" align="center" prop="classState">
+      <el-table-column label="班级状态" align="center" prop="classState">
         <template slot-scope="scope">
-          <dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.classState"/>
+          <dict-tag :options="dict.type.clazz_on_off" :value="scope.row.classState"/>
         </template>
       </el-table-column>
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
+
           <el-button
             size="mini"
             type="text"
@@ -87,6 +166,15 @@
             @click="handleUpdate(scope.row)"
             v-hasPermi="['school:class:edit']"
           >修改</el-button>
+
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="findByGroup(scope.row.classId)"
+            v-hasPermi="['school:class:edit']"
+          >查看小组</el-button>
+
           <el-button
             size="mini"
             type="text"
@@ -113,7 +201,14 @@
           <el-input v-model="form.className" placeholder="请输入班级名称" />
         </el-form-item>
         <el-form-item label="班级状态  1 - 未开班  2 - 开班" prop="classState">
-          <el-input v-model="form.classState" placeholder="请输入班级状态  1 - 未开班  2 - 开班" />
+          <el-select v-model="form.classState" placeholder="请选择班级状态  1 - 未开班  2 - 开班">
+            <el-option
+              v-for="dict in dict.type.clazz_on_off"
+              :key="dict.value"
+              :label="dict.label"
+              :value="parseInt(dict.value)"
+            ></el-option>
+          </el-select>
         </el-form-item>
       </el-form>
       <div slot="footer" class="dialog-footer">
@@ -125,12 +220,46 @@
 </template>
 
 <script>
-import { listClass, getClass, delClass, addClass, updateClass } from "@/api/school/class";
+import {
+  listClass,
+  getClass,
+  delClass,
+  addClass,
+  updateClass,
+  findGroup,
+  findUnconditional,
+  addGroup, updateGroup, delGroup
+} from "@/api/school/class";
 
 export default {
   name: "Class",
+  dicts: ['clazz_on_off'],
   data() {
     return {
+      // 选中数组
+      idss: [],
+      // 非单个禁用
+      singles: true,
+      // 非多个禁用
+      multiples: true,
+      // xiaozu总条数
+      grouptotal: 0,
+      //小组查询
+      queryGroup:{
+        pageNum: 1,
+        pageSize: 5,
+        classId: 0,
+      },
+      // 表单参数
+      group: {},
+      //显示弹出窗
+      addupdate:false,
+      //存储班级下拉
+      classDown:[],
+      //展示小组管理列表
+      dialogTableVisible: false,
+      //小组集合
+      groupList:[],
       // 遮罩层
       loading: true,
       // 选中数组
@@ -165,8 +294,80 @@ export default {
   },
   created() {
     this.getList();
+    this.queryAllClasslist();
   },
   methods: {
+    handleDeletegroup(row)
+    {
+      const groupIds = row.groupId || this.ids;
+      this.$modal.confirm('是否确认删除小组管理编号为"' + groupIds + '"的数据项？').then(function() {
+        return delGroup(groupIds);
+      }).then(() => {
+        this.getList();
+        this.$modal.msgSuccess("删除成功");
+      }).catch(() => {});
+    },
+    // 多选框选中数据
+    handleSelectionChangegroup(selection) {
+      this.idss = selection.map(item => item.groupId)
+      this.singles = selection.length!==1
+      this.multiples = !selection.length
+    },
+    handleEdit(row){
+      this.resetgroup();
+      this.group = row
+      this.addupdate = true;
+      this.title = "修改小组管理";
+    },
+    /** 提交按钮 */
+    submitFormgroup() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          if (this.group.groupId != null) {
+            updateGroup(this.group).then(response => {
+              this.$modal.msgSuccess("修改成功");
+              this.addupdate = false;
+              this.queryGroup();
+            });
+          } else {
+            addGroup(this.group).then(response => {
+              this.$modal.msgSuccess("新增成功");
+              this.addupdate = false;
+              this.queryGroup();
+            });
+          }
+        }
+      });
+    },
+    // 表单重置
+    resetgroup() {
+      this.group = {
+        groupId: null,
+        groupName: null,
+        groupPeople: null,
+        groupPersonnel: null,
+        classId: null
+      }
+    },
+    handleAddGroup(){
+      this.resetgroup();
+      this.addupdate = true;
+      this.title = "添加小组管理";
+    },
+    //无条件查询班级管理下拉
+    queryAllClasslist(){
+      findUnconditional().then(res=>{
+        this.classDown = res.data.rows
+      })
+    },
+    findByGroup(classId){
+      this.queryGroup.classId = classId
+      findGroup(this.queryGroup).then(res=>{
+        this.dialogTableVisible = true
+        this.grouptotal = res.data.total
+        this.groupList = res.data.rows
+      })
+    },
     /** 查询班级管理列表 */
     getList() {
       this.loading = true;