公司管理功能完善

src/api/company-manage/index.js

@@ -25,8 +25,14 @@ export const editCompanyAPI = (data) => {
     return request.post('/system/dept/edit', data)
 }
 /**
- *  @data 编辑参数 编辑公司信息提交接口
+ *  @data  注销
  */
-export const editDeptLogoutAPI = (data) => {
+export const turnOnOffAPI = (data) => {
-    return request.post('/system/dept/deptLogout', data)
+    return request.post('/system/dept/turnOnOff', data)
+}
+/**
+ *  @data 查询参数 获取地址信息
+ */
+export const getAddressListAPI = (data) => {
+    return request.get('/system/address/list', { params: data })
 }

src/api/permission-template/index.js

@@ -0,0 +1,27 @@
+import request from '@/utils/request'
+
+/**
+ *  @data 新增权限模板参数 权限模板新增接口
+ */
+export const addTemplateAPI = (data) => {
+    return request.post('/system/template', data)
+}
+/**
+ *  @data 修改权限模板参数 权限模板修改接口
+ */
+export const editTemplateAPI = (data) => {
+    return request.get('/system/dept/edit', data)
+}
+/**
+ *  @data 查询参数 权限模板列表接口
+ */
+export const getTemplateListAPI = (data) => {
+    return request.get(`/system/template/list`, { params: data })
+}
+/**
+ *  @data 删除参数 权限模板删除接口
+ *  @ids  参数
+ */
+export const deleteTemplateAPI = (data) => {
+    return request.post('/system/template/delete', data)
+}

src/views/company-manage/components/add-form.vue

@@ -2,7 +2,7 @@
     <!-- 新增修改弹框 -->
     <div>
         <el-dialog
-            width="50%"
+            width="55%"
             :title="dialogTitle"
             :visible.sync="dialogVisible"
             :before-close="handleClose"
@@ -19,6 +19,76 @@
                 <el-form-item label="公司名称：" prop="deptName">
                     <el-input v-model="addOrEditForm.deptName" clearable />
                 </el-form-item>
+                <el-form-item label="公司地址：" prop="province">
+                    <el-row>
+                        <el-col :span="6">
+                            <el-form-item prop="province">
+                                <el-select
+                                    filterable
+                                    clearable
+                                    placeholder="请选择所在省"
+                                    @change="onChangeProvince"
+                                    v-model="addOrEditForm.province"
+                                    style="width: 95%"
+                                >
+                                    <el-option
+                                        :key="item.code"
+                                        :label="item.name"
+                                        :value="item.code"
+                                        v-for="item in provinceList"
+                                    />
+                                </el-select>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="6">
+                            <el-form-item prop="city">
+                                <el-select
+                                    filterable
+                                    clearable
+                                    placeholder="请选择所在市"
+                                    @change="onChangeCity"
+                                    v-model="addOrEditForm.city"
+                                    style="width: 95%"
+                                >
+                                    <el-option
+                                        :key="item.code"
+                                        :label="item.name"
+                                        :value="item.code"
+                                        v-for="item in cityList"
+                                    />
+                                </el-select>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="6">
+                            <el-form-item prop="district">
+                                <el-select
+                                    filterable
+                                    clearable
+                                    placeholder="请选择所在区/县"
+                                    v-model="addOrEditForm.district"
+                                    style="width: 95%"
+                                >
+                                    <el-option
+                                        :key="item.code"
+                                        :label="item.name"
+                                        :value="item.code"
+                                        v-for="item in areaList"
+                                    />
+                                </el-select>
+                            </el-form-item>
+                        </el-col>
+                        <el-col :span="6">
+                            <el-form-item prop="address">
+                                <el-input
+                                    clearable
+                                    style="width: 95%"
+                                    placeholder="请输入详细地址"
+                                    v-model="addOrEditForm.address"
+                                />
+                            </el-form-item>
+                        </el-col>
+                    </el-row>
+                </el-form-item>
                 <el-form-item label="公司简称：" prop="deptAbbreviation">
                     <el-input
                         v-model="addOrEditForm.deptAbbreviation"
@@ -41,10 +111,10 @@
                     <el-radio-group v-model="addOrEditForm.status">
                         <el-radio label="0"> 启用 </el-radio>
                         <el-radio label="1"> 停用 </el-radio>
-                        <el-radio label="2"> 注销 </el-radio>
+                        <!-- <el-radio label="2"> 注销 </el-radio> -->
                     </el-radio-group>
                 </el-form-item>
-                <TitleTip :titleText="`基础设置`" />
+                <!-- <TitleTip :titleText="`基础设置`" /> -->
                 <el-form-item label="默认密码：" prop="initPassword">
                     <el-input v-model="addOrEditForm.initPassword" clearable />
                 </el-form-item>
@@ -106,7 +176,7 @@
                 <el-form-item label="角色：" prop="roles">
                     <el-input disabled v-model="addOrEditForm.roles" />
                 </el-form-item>
-                <el-form-item class="handle">
+                <el-form-item class="handle" v-if="formType !== 1">
                     <el-button
                         @click="
                             () => {
@@ -144,8 +214,9 @@
 <script>
 import {
     addCompanyAPI,
-    getDeptDetailsAPI,
     editCompanyAPI,
+    getDeptDetailsAPI,
+    getAddressListAPI,
 } from '@/api/company-manage/index.js'
 import { validateNewPassword } from '@/utils/validate'
 import { getToken } from '@/utils/auth'
@@ -170,6 +241,9 @@ export default {
             uploadFileUrl: process.env.VUE_APP_BASE_API + '/file/upload',
             fileType: ['svg'],
             dialogInnerVisible: false,
+            provinceList: [],
+            cityList: [],
+            areaList: [],
             previewUrl: '',
             headers: {
                 Authorization: 'Bearer ' + getToken(),
@@ -188,6 +262,10 @@ export default {
                 fileList: [],
                 status: '',
                 roles: '公司管理员',
+                province: '',
+                city: '',
+                district: '',
+                address: '',
             },
             addOrEditFormRef: {
                 deptName: [
@@ -283,6 +361,34 @@ export default {
                         trigger: 'blur',
                     },
                 ],
+                province: [
+                    {
+                        required: true,
+                        message: '请选择省',
+                        trigger: 'change',
+                    },
+                ],
+                city: [
+                    {
+                        required: true,
+                        message: '请选择市',
+                        trigger: 'change',
+                    },
+                ],
+                district: [
+                    {
+                        required: true,
+                        message: '请选择区/县',
+                        trigger: 'blur',
+                    },
+                ],
+                address: [
+                    {
+                        required: true,
+                        message: '请输入详细地址',
+                        trigger: 'blur',
+                    },
+                ],
             },
         }
     },
@@ -306,6 +412,7 @@ export default {
             this.$refs.addOrEditFormRef.resetFields()
             this.$emit('update:formDialogVisible', false)
         },
+        // 表单提交
         onSubmitForm() {
             this.$refs.addOrEditFormRef.validate(async (valid) => {
                 if (valid) {
@@ -321,6 +428,10 @@ export default {
                         parentId,
                         userId,
                         status,
+                        province,
+                        city,
+                        district,
+                        address,
                     } = this.addOrEditForm
                     const params = {
                         deptName,
@@ -329,6 +440,10 @@ export default {
                         logo,
                         initPassword,
                         orderNum: 200,
+                        province,
+                        city,
+                        district,
+                        address,
                         sysUser: {
                             nickName,
                             phonenumber,
@@ -374,17 +489,19 @@ export default {
             }
             this.$modal.loading('图片正在上传，请稍候...')
         },
+        // 移除
         handleRemove(file) {
             this.addOrEditForm.fileList = this.addOrEditForm.fileList.filter(
                 (item) => item.uid !== file.uid,
             )
             this.addOrEditForm.logo = ''
         },
+        // 预览 LOGO
         handlePreview(file) {
             this.dialogInnerVisible = true
             this.previewUrl = file.url
         },
-
+        // 上传成功
         handleSuccess(res) {
             if (res.code === 200) {
                 this.addOrEditForm.logo = res.data.url
@@ -394,11 +511,12 @@ export default {
             }
             this.$modal.closeLoading()
         },
+        // 详情时预览 LOGO
         onViewLogoImg(url) {
             this.dialogInnerVisible = true
             this.previewUrl = url
         },
-
+        // 设置默认LOGO
         onDefaultLogo() {
             this.addOrEditForm.fileList = [
                 {
@@ -408,14 +526,32 @@ export default {
             this.addOrEditForm.logo =
                 'http://36.33.26.201:17788/statics/2025/01/03/logo_20250103151123A002.svg'
         },
-        // 文件个数超出
+        // 文件个数超出限制
         handleExceed() {
             this.$modal.msgError(`上传的LOGO数量不能超过 1 个`)
         },
+
+        // 获取地址
+        async getAddressListData(parentCode = 0) {
+            const { data: res } = await getAddressListAPI({ parentCode })
+            return res
+        },
+        // 获取省
+        async getProvinceData() {
+            this.provinceList = await this.getAddressListData()
+        },
+        // 省change事件
+        async onChangeProvince(val) {
+            this.cityList = await this.getAddressListData(val)
+        },
+        // 市change事件
+        async onChangeCity(val) {
+            this.areaList = await this.getAddressListData(val)
+        },
     },
     async mounted() {
+        this.getProvinceData()
         if (this.formType === 1 || this.formType === 2) {
-            // console.log(this.detailsId, 'detailsId')
             const { data: res } = await getDeptDetailsAPI(this.detailsId)
             const {
                 deptName,
@@ -427,8 +563,15 @@ export default {
                 parentId,
                 sysUser,
                 status,
+                province,
+                city,
+                district,
+                address,
             } = res
 
+            this.cityList = await this.getAddressListData(province)
+            this.areaList = await this.getAddressListData(city)
+
             const { userName, nickName, userId } = sysUser
             Object.assign(this.addOrEditForm, {
                 deptName,
@@ -443,6 +586,10 @@ export default {
                 userName,
                 nickName,
                 status,
+                province,
+                city,
+                district,
+                address,
                 fileList: [{ url: logo }],
             })
         }

src/views/company-manage/components/company-card.vue

@@ -60,6 +60,7 @@
             <el-button
                 type="text"
                 icon="el-icon-chat-dot-round"
+                v-if="companyInfo.delFlag == 0"
                 @click="onClickButton(1)"
             >
                 详情
@@ -68,23 +69,28 @@
                 type="text"
                 icon="el-icon-edit"
                 @click="onClickButton(2)"
+                v-if="companyInfo.delFlag == 0"
             >
                 编辑
             </el-button>
             <el-button
                 type="text"
-                icon="el-icon-delete"
+                :style="{
+                    color: companyInfo.delFlag == 0 ? '#409EFF' : '#999',
+                }"
+                :icon="
+                    companyInfo.delFlag == 0 ? 'el-icon-delete' : 'el-icon-back'
+                "
                 @click="onClickButton(3)"
-                v-if="companyInfo.status != 2"
             >
-                注销
+                {{ companyInfo.delFlag == 0 ? '注销' : '撤回注销' }}
             </el-button>
         </div>
     </div>
 </template>
 
 <script>
-import { editDeptLogoutAPI } from '@/api/company-manage/index.js'
+import { turnOnOffAPI } from '@/api/company-manage/index.js'
 export default {
     props: {
         companyInfo: {
@@ -124,23 +130,27 @@ export default {
             if (type === 1 || type === 2) {
                 this.$emit('openAddForm', type, this.companyInfo.deptId)
             } else {
-                if (this.companyInfo.status == 2) {
-                    this.$modal.msgError('该公司已注销，无法重复注销')
-                    return
-                }
                 this.$modal
-                    .confirm('是否确认注销')
+                    .confirm(
+                        `是否确认${
+                            this.companyInfo.delFlag == 0 ? '注销' : '撤回注销'
+                        }`,
+                    )
                     .then(async () => {
                         // 组装参数
-                        const { deptId, deptName, orderNum } = this.companyInfo
+                        const { deptId, deptName, orderNum, delFlag } =
+                            this.companyInfo
                         const params = {
                             deptId,
                             deptName,
                             orderNum,
+                            delFlag: delFlag == 0 ? 2 : 0,
                         }
-                        const res = await editDeptLogoutAPI(params)
+                        const res = await turnOnOffAPI(params)
                         if (res.code === 200) {
-                            this.$modal.msgSuccess('注销成功')
+                            this.$modal.msgSuccess(
+                                `${delFlag == 0 ? '注销成功' : '已撤回注销'}`,
+                            )
                             this.$emit('updateTableList')
                         }
                     })
@@ -156,8 +166,8 @@ export default {
     padding: 12px 10px;
     border-radius: 6px;
     background-color: #f7f8fc;
-    min-height: 220px;
+    min-height: 260px;
-    max-height: 220px;
+    max-height: 260px;
     display: flex;
     flex-direction: column;
     justify-content: space-around;

src/views/company-manage/index.vue

@@ -113,12 +113,12 @@ export default {
     flex-wrap: wrap;
     overflow-y: auto;
     .company-items {
-        width: calc((100% - 30px) / 3);
+        width: calc((100% - 60px) / 5);
         margin-right: 15px;
         margin-bottom: 15px;
     }
 
-    & .company-items:nth-child(3n) {
+    & .company-items:nth-child(5n) {
         margin-right: 0;
     }
 }

src/views/permission-template/index.vue

@@ -0,0 +1,632 @@
+<template>
+    <div class="app-container">
+        <el-form
+            :model="queryParams"
+            ref="queryForm"
+            size="small"
+            :inline="true"
+            v-show="showSearch"
+        >
+            <el-form-item label="模板名称" prop="roleName">
+                <el-input
+                    v-model="queryParams.roleName"
+                    placeholder="请输入模板名称"
+                    clearable
+                    style="width: 240px"
+                    @keyup.enter.native="handleQuery"
+                />
+            </el-form-item>
+            <el-form-item>
+                <el-button
+                    type="primary"
+                    icon="el-icon-search"
+                    size="mini"
+                    @click="handleQuery"
+                    >搜索</el-button
+                >
+                <el-button
+                    icon="el-icon-refresh"
+                    size="mini"
+                    @click="resetQuery"
+                    >重置</el-button
+                >
+            </el-form-item>
+        </el-form>
+
+        <el-row :gutter="10" class="mb8">
+            <el-col :span="1.5">
+                <el-button
+                    type="primary"
+                    plain
+                    icon="el-icon-plus"
+                    size="mini"
+                    @click="handleAdd"
+                    v-hasPermi="['system:role:add']"
+                    >新增
+                </el-button>
+            </el-col>
+            <el-col :span="1.5">
+                <el-button
+                    type="success"
+                    plain
+                    icon="el-icon-edit"
+                    size="mini"
+                    :disabled="single"
+                    @click="handleUpdate"
+                    v-hasPermi="['system:role:edit']"
+                    >修改
+                </el-button>
+            </el-col>
+            <el-col :span="1.5">
+                <el-button
+                    type="danger"
+                    plain
+                    icon="el-icon-delete"
+                    size="mini"
+                    :disabled="multiple"
+                    @click="handleDelete"
+                    v-hasPermi="['system:role:remove']"
+                    >删除
+                </el-button>
+            </el-col>
+
+            <right-toolbar
+                :showSearch.sync="showSearch"
+                @queryTable="getList"
+            ></right-toolbar>
+        </el-row>
+
+        <el-table
+            v-loading="loading"
+            :data="roleList"
+            @selection-change="handleSelectionChange"
+            :selectable="checkSelectable"
+            :row-class-name="getRowClassName"
+        >
+            <el-table-column type="selection" min-width="55" align="center" />
+            <el-table-column
+                label="模板编号"
+                prop="roleId"
+                min-width="120"
+                align="center"
+            />
+            <el-table-column
+                label="模板名称"
+                align="center"
+                prop="roleName"
+                :show-overflow-tooltip="true"
+                min-width="150"
+            />
+
+            <el-table-column
+                label="创建时间"
+                align="center"
+                prop="createTime"
+                min-width="180"
+            >
+                <template slot-scope="scope">
+                    <span>{{ parseTime(scope.row.createTime) }}</span>
+                </template>
+            </el-table-column>
+            <el-table-column
+                label="操作"
+                align="center"
+                class-name="small-padding fixed-width"
+            >
+                <template
+                    slot-scope="scope"
+                    v-if="scope.row.roleId !== 1 && scope.row.isBuiltIn !== '0'"
+                >
+                    <el-button
+                        size="mini"
+                        type="text"
+                        icon="el-icon-edit"
+                        @click="handleUpdate(scope.row)"
+                        v-hasPermi="['system:role:edit']"
+                        >修改
+                    </el-button>
+                    <el-button
+                        size="mini"
+                        type="text"
+                        icon="el-icon-delete"
+                        @click="handleDelete(scope.row)"
+                        v-hasPermi="['system:role:remove']"
+                        >删除
+                    </el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+
+        <pagination
+            v-show="total > 0"
+            :total="total"
+            :page.sync="queryParams.pageNum"
+            :limit.sync="queryParams.pageSize"
+            @pagination="getList"
+        />
+
+        <!-- 添加或修改角色配置对话框 -->
+        <el-dialog
+            :title="title"
+            :visible.sync="open"
+            width="500px"
+            append-to-body
+        >
+            <el-form
+                ref="form"
+                :model="form"
+                :rules="rules"
+                label-width="100px"
+            >
+                <el-form-item label="模板名称" prop="roleName">
+                    <el-input
+                        v-model="form.roleName"
+                        placeholder="请输入角色名称"
+                    />
+                </el-form-item>
+
+                <el-form-item label="菜单权限">
+                    <el-checkbox
+                        v-model="menuExpand"
+                        @change="handleCheckedTreeExpand($event, 'menu')"
+                        >展开/折叠</el-checkbox
+                    >
+                    <el-checkbox
+                        v-model="menuNodeAll"
+                        @change="handleCheckedTreeNodeAll($event, 'menu')"
+                        >全选/全不选
+                    </el-checkbox>
+                    <el-checkbox
+                        v-model="form.menuCheckStrictly"
+                        @change="handleCheckedTreeConnect($event, 'menu')"
+                        >父子联动
+                    </el-checkbox>
+                    <el-tree
+                        class="tree-border"
+                        :data="menuOptions"
+                        show-checkbox
+                        ref="menu"
+                        node-key="id"
+                        :check-strictly="!form.menuCheckStrictly"
+                        empty-text="加载中，请稍候"
+                        :props="defaultProps"
+                    ></el-tree>
+                </el-form-item>
+                <el-form-item label="备注">
+                    <el-input
+                        v-model="form.remark"
+                        type="textarea"
+                        placeholder="请输入内容"
+                    ></el-input>
+                </el-form-item>
+            </el-form>
+            <div slot="footer" class="dialog-footer">
+                <el-button type="primary" @click="submitForm">确 定</el-button>
+                <el-button @click="cancel">取 消</el-button>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+import {
+    listRole,
+    getRole,
+    delRole,
+    addRole,
+    updateRole,
+    dataScope,
+    changeRoleStatus,
+    deptTreeSelect,
+} from '@/api/system/role'
+import {
+    treeselect as menuTreeselect,
+    roleMenuTreeselect,
+} from '@/api/system/menu'
+
+export default {
+    name: 'Role',
+    dicts: ['sys_normal_disable'],
+    data() {
+        return {
+            // 遮罩层
+            loading: true,
+            // 选中数组
+            ids: [],
+            // 非单个禁用
+            single: true,
+            // 非多个禁用
+            multiple: true,
+            // 显示搜索条件
+            showSearch: true,
+            // 总条数
+            total: 0,
+            // 角色表格数据
+            roleList: [],
+            // 弹出层标题
+            title: '',
+            // 是否显示弹出层
+            open: false,
+            // 是否显示弹出层（数据权限）
+            openDataScope: false,
+            menuExpand: false,
+            menuNodeAll: false,
+            deptExpand: true,
+            deptNodeAll: false,
+            // 日期范围
+            dateRange: [],
+            // 数据范围选项
+            dataScopeOptions: [
+                {
+                    value: '1',
+                    label: '全部数据权限',
+                },
+                {
+                    value: '2',
+                    label: '自定数据权限',
+                },
+                {
+                    value: '3',
+                    label: '本部门数据权限',
+                },
+                {
+                    value: '4',
+                    label: '本部门及以下数据权限',
+                },
+                {
+                    value: '5',
+                    label: '仅本人数据权限',
+                },
+            ],
+            // 菜单列表
+            menuOptions: [],
+            // 部门列表
+            deptOptions: [],
+            // 查询参数
+            queryParams: {
+                pageNum: 1,
+                pageSize: 10,
+                roleName: undefined,
+                roleKey: undefined,
+                status: undefined,
+            },
+            // 表单参数
+            form: {},
+            defaultProps: {
+                children: 'children',
+                label: 'label',
+            },
+            // 表单校验
+            rules: {
+                roleName: [
+                    {
+                        required: true,
+                        message: '角色名称不能为空',
+                        trigger: 'blur',
+                    },
+                ],
+                roleKey: [
+                    {
+                        required: true,
+                        message: '权限字符不能为空',
+                        trigger: 'blur',
+                    },
+                ],
+                roleSort: [
+                    {
+                        required: true,
+                        message: '角色顺序不能为空',
+                        trigger: 'blur',
+                    },
+                ],
+            },
+        }
+    },
+    created() {
+        this.getList()
+    },
+    methods: {
+        /** 查询角色列表 */
+        getList() {
+            this.loading = true
+            listRole(this.addDateRange(this.queryParams, this.dateRange)).then(
+                (response) => {
+                    this.roleList = response.rows
+                    this.total = response.total
+                    this.loading = false
+                },
+            )
+        },
+        /** 查询菜单树结构 */
+        getMenuTreeselect() {
+            menuTreeselect().then((response) => {
+                this.menuOptions = response.data
+            })
+        },
+        // 所有菜单节点数据
+        getMenuAllCheckedKeys() {
+            // 目前被选中的菜单节点
+            let checkedKeys = this.$refs.menu.getCheckedKeys()
+            // 半选中的菜单节点
+            let halfCheckedKeys = this.$refs.menu.getHalfCheckedKeys()
+            checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys)
+            return checkedKeys
+        },
+        // 所有部门节点数据
+        getDeptAllCheckedKeys() {
+            // 目前被选中的部门节点
+            let checkedKeys = this.$refs.dept.getCheckedKeys()
+            // 半选中的部门节点
+            let halfCheckedKeys = this.$refs.dept.getHalfCheckedKeys()
+            checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys)
+            return checkedKeys
+        },
+        /** 根据角色ID查询菜单树结构 */
+        getRoleMenuTreeselect(roleId) {
+            return roleMenuTreeselect(roleId).then((response) => {
+                this.menuOptions = response.menus
+                return response
+            })
+        },
+        /** 根据角色ID查询部门树结构 */
+        getDeptTree(roleId) {
+            return deptTreeSelect(roleId).then((response) => {
+                this.deptOptions = response.depts
+                return response
+            })
+        },
+        // 角色状态修改
+        handleStatusChange(row) {
+            let text = row.status === '0' ? '启用' : '停用'
+            this.$modal
+                .confirm('确认要"' + text + '""' + row.roleName + '"角色吗？')
+                .then(function () {
+                    return changeRoleStatus(row.roleId, row.status)
+                })
+                .then(() => {
+                    this.$modal.msgSuccess(text + '成功')
+                })
+                .catch(function () {
+                    row.status = row.status === '0' ? '1' : '0'
+                })
+        },
+        // 取消按钮
+        cancel() {
+            this.open = false
+            this.reset()
+        },
+        // 取消按钮（数据权限）
+        cancelDataScope() {
+            this.openDataScope = false
+            this.reset()
+        },
+        // 表单重置
+        reset() {
+            if (this.$refs.menu != undefined) {
+                this.$refs.menu.setCheckedKeys([])
+            }
+            ;(this.menuExpand = false),
+                (this.menuNodeAll = false),
+                (this.deptExpand = true),
+                (this.deptNodeAll = false),
+                (this.form = {
+                    roleId: undefined,
+                    roleName: undefined,
+                    roleKey: undefined,
+                    roleSort: 0,
+                    status: '0',
+                    menuIds: [],
+                    deptIds: [],
+                    menuCheckStrictly: true,
+                    deptCheckStrictly: true,
+                    remark: undefined,
+                })
+            this.resetForm('form')
+        },
+        /** 搜索按钮操作 */
+        handleQuery() {
+            this.queryParams.pageNum = 1
+            this.getList()
+        },
+        /** 重置按钮操作 */
+        resetQuery() {
+            this.dateRange = []
+            this.resetForm('queryForm')
+            this.handleQuery()
+        },
+        // 多选框选中数据
+        handleSelectionChange(selection) {
+            // 过滤掉不可选的行（虽然界面上不可选，但为了安全起见还是过滤一次）
+            const validSelection = selection.filter((row) =>
+                this.checkSelectable(row),
+            )
+
+            // 更新选中的roleId数组
+            this.ids = validSelection.map((item) => item.roleId)
+            // 更新单选和多选状态
+            this.single = validSelection.length !== 1
+            this.multiple = !validSelection.length
+        },
+        // 更多操作触发
+        handleCommand(command, row) {
+            switch (command) {
+                case 'handleDataScope':
+                    this.handleDataScope(row)
+                    break
+                case 'handleAuthUser':
+                    this.handleAuthUser(row)
+                    break
+                default:
+                    break
+            }
+        },
+        // 树权限（展开/折叠）
+        handleCheckedTreeExpand(value, type) {
+            if (type == 'menu') {
+                let treeList = this.menuOptions
+                for (let i = 0; i < treeList.length; i++) {
+                    this.$refs.menu.store.nodesMap[treeList[i].id].expanded =
+                        value
+                }
+            } else if (type == 'dept') {
+                let treeList = this.deptOptions
+                for (let i = 0; i < treeList.length; i++) {
+                    this.$refs.dept.store.nodesMap[treeList[i].id].expanded =
+                        value
+                }
+            }
+        },
+        // 树权限（全选/全不选）
+        handleCheckedTreeNodeAll(value, type) {
+            if (type == 'menu') {
+                this.$refs.menu.setCheckedNodes(value ? this.menuOptions : [])
+            } else if (type == 'dept') {
+                this.$refs.dept.setCheckedNodes(value ? this.deptOptions : [])
+            }
+        },
+        // 树权限（父子联动）
+        handleCheckedTreeConnect(value, type) {
+            if (type == 'menu') {
+                this.form.menuCheckStrictly = value ? true : false
+            } else if (type == 'dept') {
+                this.form.deptCheckStrictly = value ? true : false
+            }
+        },
+        /** 新增按钮操作 */
+        handleAdd() {
+            this.reset()
+            this.getMenuTreeselect()
+            this.open = true
+            this.title = '添加权限模板'
+        },
+        /** 修改按钮操作 */
+        handleUpdate(row) {
+            this.reset()
+            const roleId = row.roleId || this.ids
+            const roleMenu = this.getRoleMenuTreeselect(roleId)
+            getRole(roleId).then((response) => {
+                this.form = response.data
+                this.open = true
+                this.$nextTick(() => {
+                    roleMenu.then((res) => {
+                        let checkedKeys = res.checkedKeys
+                        checkedKeys.forEach((v) => {
+                            this.$nextTick(() => {
+                                this.$refs.menu.setChecked(v, true, false)
+                            })
+                        })
+                    })
+                })
+                this.title = '修改角色'
+            })
+        },
+        /** 选择角色权限范围触发 */
+        dataScopeSelectChange(value) {
+            if (value !== '2') {
+                this.$refs.dept.setCheckedKeys([])
+            }
+        },
+        /** 分配数据权限操作 */
+        handleDataScope(row) {
+            this.reset()
+            const deptTreeSelect = this.getDeptTree(row.roleId)
+            getRole(row.roleId).then((response) => {
+                this.form = response.data
+                this.openDataScope = true
+                this.$nextTick(() => {
+                    deptTreeSelect.then((res) => {
+                        this.$refs.dept.setCheckedKeys(res.checkedKeys)
+                    })
+                })
+                this.title = '分配数据权限'
+            })
+        },
+        /** 分配用户操作 */
+        handleAuthUser: function (row) {
+            const roleId = row.roleId
+            this.$router.push('/system/role-auth/user/' + roleId)
+        },
+        /** 提交按钮 */
+        submitForm: function () {
+            this.$refs['form'].validate((valid) => {
+                if (valid) {
+                    if (this.form.roleId != undefined) {
+                        this.form.menuIds = this.getMenuAllCheckedKeys()
+                        updateRole(this.form).then((response) => {
+                            this.$modal.msgSuccess('修改成功')
+                            this.open = false
+                            this.getList()
+                        })
+                    } else {
+                        this.form.menuIds = this.getMenuAllCheckedKeys()
+                        addRole(this.form).then((response) => {
+                            this.$modal.msgSuccess('新增成功')
+                            this.open = false
+                            this.getList()
+                        })
+                    }
+                }
+            })
+        },
+        /** 提交按钮（数据权限） */
+        submitDataScope: function () {
+            if (this.form.roleId != undefined) {
+                this.form.deptIds = this.getDeptAllCheckedKeys()
+                dataScope(this.form).then((response) => {
+                    this.$modal.msgSuccess('修改成功')
+                    this.openDataScope = false
+                    this.getList()
+                })
+            }
+        },
+        /** 删除按钮操作 */
+        handleDelete(row) {
+            const roleIds = row.roleId || this.ids
+            this.$modal
+                .confirm('是否确认删除角色编号为"' + roleIds + '"的数据项？')
+                .then(function () {
+                    return delRole(roleIds)
+                })
+                .then(() => {
+                    this.getList()
+                    this.$modal.msgSuccess('删除成功')
+                })
+                .catch(() => {})
+        },
+        /** 导出按钮操作 */
+        handleExport() {
+            this.download(
+                'system/role/export',
+                {
+                    ...this.queryParams,
+                },
+                `role_${new Date().getTime()}.xlsx`,
+            )
+        },
+        // 检查行是否可选
+        checkSelectable(row) {
+            return !(row.roleId === 1 || row.isBuiltIn === '0')
+        },
+
+        getRowClassName(row) {
+            return !this.checkSelectable(row) ? 'disabled-row' : ''
+        },
+    },
+}
+</script>
+
+<style>
+.disabled-row {
+    background-color: #f5f7fa !important;
+    color: #909399;
+    cursor: not-allowed;
+}
+
+.disabled-row .el-checkbox__input {
+    cursor: not-allowed !important;
+}
+
+.disabled-row:hover td {
+    background-color: #f5f7fa !important;
+}
+</style>

src/views/system/dept/index.vue

@@ -1,118 +1,12 @@
 <template>
-  <div class="app-container">
+    <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
+        <el-form
-      <el-form-item label="部门名称" prop="deptName">
+            :model="queryParams"
-        <el-input
+            ref="queryForm"
-          v-model="queryParams.deptName"
+            size="small"
-          placeholder="请输入部门名称"
+            :inline="true"
-          clearable
+            v-show="showSearch"
-          @keyup.enter.native="handleQuery"
+        >
-        />
-      </el-form-item>
-      <el-form-item label="状态" prop="status">
-        <el-select v-model="queryParams.status" placeholder="部门状态" clearable>
-          <el-option
-            v-for="dict in dict.type.sys_normal_disable"
-            :key="dict.value"
-            :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>
-        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-      </el-form-item>
-    </el-form>
-
-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button
-          type="primary"
-          plain
-          icon="el-icon-plus"
-          size="mini"
-          @click="handleAdd"
-          v-hasPermi="['system:dept:add']"
-        >新增
-        </el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="info"
-          plain
-          icon="el-icon-sort"
-          size="mini"
-          @click="toggleExpandAll"
-        >展开/折叠
-        </el-button>
-      </el-col>
-      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row>
-
-    <el-table
-      v-if="refreshTable"
-      v-loading="loading"
-      :data="deptList"
-      row-key="deptId"
-      :default-expand-all="isExpandAll"
-      :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
-    >
-      <el-table-column prop="deptName" label="部门名称" min-width="260"></el-table-column>
-      <el-table-column prop="orderNum" label="排序" min-width="200"></el-table-column>
-      <el-table-column prop="status" label="状态" min-width="100">
-        <template slot-scope="scope">
-          <dict-tag :options="dict.type.sys_normal_disable" :value="scope.row.status"/>
-        </template>
-      </el-table-column>
-      <el-table-column label="创建时间" align="center" prop="createTime" min-width="200">
-        <template slot-scope="scope">
-          <span>{{ parseTime(scope.row.createTime) }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" align="center" min-width="200" class-name="small-padding fixed-width">
-        <template slot-scope="scope">
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-edit"
-            @click="handleUpdate(scope.row)"
-            v-hasPermi="['system:dept:edit']"
-          >修改
-          </el-button>
-          <el-button
-            size="mini"
-            type="text"
-            icon="el-icon-plus"
-            @click="handleAdd(scope.row)"
-            v-hasPermi="['system:dept:add']"
-          >新增
-          </el-button>
-          <el-button
-            v-if="scope.row.parentId != 0"
-            size="mini"
-            type="text"
-            icon="el-icon-delete"
-            @click="handleDelete(scope.row)"
-            v-hasPermi="['system:dept:remove']"
-          >删除
-          </el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-
-    <!-- 添加或修改部门对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-row>
-          <el-col :span="24" v-if="form.parentId !== 0">
-            <el-form-item label="上级部门" prop="parentId">
-              <treeselect v-model="form.parentId" :options="deptOptions" :normalizer="normalizer" placeholder="选择上级部门" />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-row>
-          <el-col :span="12">
             <el-form-item label="部门名称" prop="deptName">
                 <el-input
                     v-model="queryParams.deptName"
@@ -240,11 +134,7 @@
                         >新增
                     </el-button>
                     <el-button
-                        v-if="
+                        v-if="scope.row.parentId != 0"
-                            config.isAddRootCompany
-                                ? true
-                                : scope.row.parentId != 0
-                        "
                         size="mini"
                         type="text"
                         icon="el-icon-delete"
@@ -271,11 +161,7 @@
                                 v-model="form.parentId"
                                 :options="deptOptions"
                                 :normalizer="normalizer"
-                                :placeholder="
+                                placeholder="选择上级部门"
-                                    config.isAddRootCompany
-                                        ? '选择上级部门，如果不选择则创建顶级部门'
-                                        : '选择上级部门'
-                                "
                             />
                         </el-form-item>
                     </el-col>
@@ -406,78 +292,11 @@ import Treeselect from '@riophae/vue-treeselect'
 import '@riophae/vue-treeselect/dist/vue-treeselect.css'
 
 export default {
-  name: 'Dept',
+    name: 'Dept',
-  computed: {
+    computed: {
-    config() {
+        config() {
-      return JSON.parse(localStorage.getItem('systemConfig')) // 获取 JSON 对象
+            return JSON.parse(localStorage.getItem('systemConfig')) // 获取 JSON 对象
-    }
+        },
-  },
-  dicts: ['sys_normal_disable'],
-  components: { Treeselect },
-  data() {
-    return {
-      // 遮罩层
-      loading: true,
-      // 显示搜索条件
-      showSearch: true,
-      // 表格树数据
-      deptList: [],
-      // 部门树选项
-      deptOptions: [],
-      // 弹出层标题
-      title: '',
-      // 是否显示弹出层
-      open: false,
-      // 是否展开，默认全部展开
-      isExpandAll: true,
-      // 重新渲染表格状态
-      refreshTable: true,
-      // 查询参数
-      queryParams: {
-        deptName: undefined,
-        status: undefined
-      },
-      // 表单参数
-      form: {},
-      // 表单校验
-      rules: {
-        parentId: [
-          { required: true, message: "上级部门不能为空", trigger: "blur" }
-        ],
-        deptName: [
-          { required: true, message: '部门名称不能为空', trigger: 'blur' }
-        ],
-        orderNum: [
-          { required: true, message: '显示排序不能为空', trigger: 'blur' }
-        ],
-        email: [
-          {
-            type: 'email',
-            message: '请输入正确的邮箱地址',
-            trigger: ['blur', 'change']
-          }
-        ],
-        phone: [
-          {
-            pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
-            message: '请输入正确的手机号码',
-            trigger: 'blur'
-          }
-        ]
-      }
-    }
-  },
-  created() {
-    this.getList()
-  },
-  methods: {
-    /** 查询部门列表 */
-    getList() {
-      this.loading = true
-      listDept(this.queryParams).then(response => {
-        this.deptList = this.handleTree(response.data, 'deptId')
-        this.loading = false
-      })
     },
     dicts: ['sys_normal_disable'],
     components: { Treeselect },
@@ -508,16 +327,13 @@ export default {
             form: {},
             // 表单校验
             rules: {
-                parentId: JSON.parse(localStorage.getItem('systemConfig'))
+                parentId: [
-                    .isAddRootCompany
+                    {
-                    ? []
+                        required: true,
-                    : [
+                        message: '上级部门不能为空',
-                          {
+                        trigger: 'blur',
-                              required: true,
+                    },
-                              message: '上级部门不能为空',
+                ],
-                              trigger: 'blur',
-                          },
-                      ],
                 deptName: [
                     {
                         required: true,

vue.config.js

@@ -35,7 +35,8 @@ module.exports = {
         proxy: {
             // detail: https://cli.vuejs.org/config/#devserver-proxy
             [process.env.VUE_APP_BASE_API]: {
-                target: `http://192.168.2.209:38080`,
+                // target: `http://192.168.2.209:38080`,
+                target: `http://192.168.2.76:38080`,
                 // target: `http://192.168.0.244:18877`,
                 changeOrigin: true,
                 pathRewrite: {