基础模块

Your Name

2022-07-11 efb4569338df5aeeba8317921bb5ee164dc03ed9

 src/views/system/department/index.vue

@@ -19,18 +19,11 @@
         <el-table
            :data="tableData.data"
            style="width: 100%"
            row-key="id"
            default-expand-all
            row-key="depId"
            :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
         >
            <el-table-column prop="name" label="部门名称" show-overflow-tooltip> </el-table-column>
            <el-table-column prop="status" label="部门状态" show-overflow-tooltip>
               <template #default="scope">
                  <el-tag type="success" v-if="scope.row.status">启用</el-tag>
                  <el-tag type="info" v-else>禁用</el-tag>
               </template>
            </el-table-column>
            <el-table-column prop="info" label="部门描述" show-overflow-tooltip></el-table-column>
            <el-table-column prop="depName" label="部门名称" show-overflow-tooltip> </el-table-column>
            <el-table-column prop="depInfo" label="部门描述" show-overflow-tooltip></el-table-column>
            <el-table-column label="操作" show-overflow-tooltip width="140">
               <template #default="scope">
                  <el-button size="small" text type="primary" @click="onOpenDeptDialog('新增','')">新增</el-button>
@@ -40,7 +33,7 @@
            </el-table-column>
         </el-table>
      </el-card>
      <deptDialog ref="deptDialog" />
      <deptDialog ref="deptDialog" @getDepartmentList="initTableData"/>
   </div>
</template>

@@ -49,6 +42,7 @@
import { ElMessageBox, ElMessage } from 'element-plus';
import deptDialog from '/@/views/system/department/component/deptDialog.vue';
import {departmentApi} from "/@/api/department";
import {useRoleApi} from "/@/api/role";

// 定义接口来定义对象的类型
interface TableDataRow {
@@ -56,7 +50,7 @@
   status: boolean;
   parentId: number;
   info: string;
   id: number;
    depId: number;
   children?: TableDataRow[];
}
interface TableDataState {
@@ -93,18 +87,31 @@
         }
      };
      // 打开新增菜单弹窗
      const onOpenDeptDialog = (type: string,value: any) => {
         deptDialog.value.openDialog(type,value,state.tableData.data);
      const onOpenDeptDialog = (type: string, value: any) => {
         deptDialog.value.openDialog(type, value, state.tableData.data);
      };
      // 删除当前行
      const onTabelRowDel = (row: TableDataRow) => {
         ElMessageBox.confirm(`此操作将永久删除部门：${row.id}, 是否继续?`, '提示', {
         ElMessageBox.confirm(`此操作将永久删除部门：${row.depId}, 是否继续?`, '提示', {
            confirmButtonText: '删除',
            cancelButtonText: '取消',
            type: 'warning',
         }).then(() => {
               ElMessage.success('删除成功');
         }).catch(() => {});
         }).then(async () => {
                let res = await departmentApi().deleteDepartment({depId:row.depId})
                if(res.data.code ==='200'){
                    ElMessage({
                        type:'success',
                        duration:2000,
                        message:'删除成功'
                    })
                    await initTableData()
                }else{
                    ElMessage({
                        type:'warning',
                        message:res.data.msg
                    })
                }
            }).catch(() => {});
      };
      // 页面加载时
      onMounted(() => {
@@ -112,6 +119,7 @@
      });
      return {
         deptDialog,
         initTableData,
         onOpenDeptDialog,
         onTabelRowDel,
         ...toRefs(state),