From d7754789bf22227e59eeaae728da1c8a54f4c823 Mon Sep 17 00:00:00 2001
From: easy <1358086367@qq.com>
Date: Thu, 16 Feb 2023 14:47:40 +0800
Subject: [PATCH 1/4] =?UTF-8?q?update:=20=E7=94=A8=E6=88=B7=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=E6=B7=BB=E5=8A=A0=E6=8C=89=E9=92=AE=E6=9D=83=E9=99=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../system/User/components/EditUserDialog.vue | 32 ++++---
 src/views/system/User/index.vue               | 93 +++++++++++++++++--
 2 files changed, 102 insertions(+), 23 deletions(-)

diff --git a/src/views/system/User/components/EditUserDialog.vue b/src/views/system/User/components/EditUserDialog.vue
index aabc2898..52487cd8 100644
--- a/src/views/system/User/components/EditUserDialog.vue
+++ b/src/views/system/User/components/EditUserDialog.vue
@@ -110,11 +110,13 @@
                             placeholder="请选择角色"
                             :options="form.roleOptions"
                         ></a-select>
-                        <span
-                            class="add-item"
+                        <PermissionButton
+                            :uhasPermission="`${rolePermission}:update`"
                             @click="form.clickAddItem('roleIdList', 'Role')"
-                            ><AIcon type="PlusOutlined"
-                        /></span>
+                            class="add-item"
+                        >
+                            <AIcon type="PlusOutlined" />
+                        </PermissionButton>
                     </a-form-item>
                 </a-col>
                 <a-col :span="12">
@@ -132,13 +134,13 @@
                                 {{ name }}
                             </template>
                         </a-tree-select>
-                        <span
+                        <PermissionButton
+                            :uhasPermission="`${deptPermission}:update`"
+                            @click="form.clickAddItem('roleIdList', 'Role')"
                             class="add-item"
-                            @click="
-                                form.clickAddItem('orgIdList', 'Department')
-                            "
-                            ><AIcon type="PlusOutlined"
-                        /></span>
+                        >
+                            <AIcon type="PlusOutlined" />
+                        </PermissionButton>
                     </a-form-item>
                 </a-col>
             </a-row>
@@ -186,7 +188,8 @@
 </template>
 
 <script setup lang="ts">
-import { FormInstance, message, TreeProps } from 'ant-design-vue';
+import PermissionButton from '@/components/PermissionButton/index.vue';
+import { FormInstance, message } from 'ant-design-vue';
 // import Progress from './Progress.vue';
 import {
     validateField_api,
@@ -201,6 +204,9 @@ import { Rule } from 'ant-design-vue/es/form';
 import { DefaultOptionType } from 'ant-design-vue/es/vc-tree-select/TreeSelect';
 import { AxiosResponse } from 'axios';
 
+const deptPermission = 'system/Department';
+const rolePermission = 'system/Role';
+
 const emits = defineEmits(['confirm']);
 // 弹窗相关
 const dialog = reactive({
@@ -339,7 +345,7 @@ const form = reactive({
                 return;
         }
         console.log(params);
-        
+
         api(params).then(() => {
             message.success('操作成功');
             cb && cb();
@@ -407,7 +413,7 @@ type optionType = {
                 .ant-select {
                     flex: 1;
                 }
-                .add-item {
+                .ant-btn {
                     width: 32px;
                     height: 32px;
                     border: 1px solid #1d39c4;
diff --git a/src/views/system/User/index.vue b/src/views/system/User/index.vue
index 63078f1c..047af707 100644
--- a/src/views/system/User/index.vue
+++ b/src/views/system/User/index.vue
@@ -11,12 +11,19 @@
             :defaultParams="{ sorts: [{ name: 'createTime', order: 'desc' }] }"
         >
             <template #headerTitle>
-                <a-button
+                <!-- <a-button
                     type="primary"
                     @click="table.openDialog('add')"
                     style="margin-right: 10px"
                     ><AIcon type="PlusOutlined" />新增</a-button
+                > -->
+                <PermissionButton
+                    :uhasPermission="`${permission}:add`"
+                    type="primary"
+                    @click="table.openDialog('add')"
                 >
+                    <AIcon type="PlusOutlined" />新增
+                </PermissionButton>
             </template>
             <template #type="slotProps">
                 {{ slotProps.type.name }}
@@ -33,7 +40,7 @@
             </template>
             <template #action="slotProps">
                 <a-space :size="16">
-                    <a-tooltip>
+                    <!-- <a-tooltip>
                         <template #title>编辑</template>
                         <a-button
                             style="padding: 0"
@@ -42,9 +49,8 @@
                         >
                             <AIcon type="EditOutlined" />
                         </a-button>
-                    </a-tooltip>
-
-                    <a-popconfirm
+                    </a-tooltip> -->
+                    <!-- <a-popconfirm
                         :title="`确定${slotProps.status ? '禁用' : '启用'}吗？`"
                         ok-text="确定"
                         cancel-text="取消"
@@ -59,8 +65,8 @@
                                 <play-circle-outlined v-else />
                             </a-button>
                         </a-tooltip>
-                    </a-popconfirm>
-                    <a-tooltip>
+                    </a-popconfirm> -->
+                    <!-- <a-tooltip>
                         <template #title>重置密码</template>
                         <a-button
                             style="padding: 0"
@@ -69,8 +75,8 @@
                         >
                             <AIcon type="icon-zhongzhimima" />
                         </a-button>
-                    </a-tooltip>
-                    <a-popconfirm
+                    </a-tooltip> -->
+                    <!-- <a-popconfirm
                         title="确认删除"
                         ok-text="确定"
                         cancel-text="取消"
@@ -89,7 +95,60 @@
                                 <AIcon type="DeleteOutlined" />
                             </a-button>
                         </a-tooltip>
-                    </a-popconfirm>
+                    </a-popconfirm> -->
+
+                    <PermissionButton
+                        :uhasPermission="`${permission}:update`"
+                        type="link"
+                        :tooltip="{
+                            title: '编辑',
+                        }"
+                        @click="table.openDialog('edit')"
+                    >
+                        <AIcon type="EditOutlined" />
+                    </PermissionButton>
+                    <PermissionButton
+                        :uhasPermission="`${permission}:action`"
+                        type="link"
+                        :tooltip="{
+                            title: `${slotProps.status ? '禁用' : '启用'}`,
+                        }"
+                        :popConfirm="{
+                            title: `确定${
+                                slotProps.status ? '禁用' : '启用'
+                            }吗？`,
+                            onConfirm: () => table.changeStatus(slotProps),
+                        }"
+                    >
+                        <stop-outlined v-if="slotProps.status" />
+                        <play-circle-outlined v-else />
+                    </PermissionButton>
+                    <PermissionButton
+                        :uhasPermission="`${permission}:update`"
+                        type="link"
+                        :tooltip="{
+                            title: '重置密码',
+                        }"
+                        @click="table.openDialog('reset', slotProps)"
+                    >
+                        <AIcon type="icon-zhongzhimima" />
+                    </PermissionButton>
+                    <PermissionButton
+                        type="link"
+                        :uhasPermission="`${permission}:delete`"
+                        :tooltip="{
+                            title: slotProps.status
+                                ? '请先禁用，再删除'
+                                : '删除',
+                        }"
+                        :popConfirm="{
+                            title: `确认删除`,
+                            onConfirm: () => table.clickDel(slotProps),
+                        }"
+                        :disabled="slotProps.status"
+                    > 
+                        <AIcon type="DeleteOutlined" />
+                    </PermissionButton>
                 </a-space>
             </template>
         </JTable>
@@ -101,6 +160,7 @@
 </template>
 
 <script setup lang="ts" name="UserMange">
+import PermissionButton from '@/components/PermissionButton/index.vue';
 import EditUserDialog from './components/EditUserDialog.vue';
 import {
     getUserType_api,
@@ -110,6 +170,9 @@ import {
 } from '@/api/system/user';
 import { StopOutlined, PlayCircleOutlined } from '@ant-design/icons-vue';
 import { message } from 'ant-design-vue';
+
+const permission = 'system/User';
+
 const query = {
     columns: [
         {
@@ -292,5 +355,15 @@ type modalType = '' | 'add' | 'edit' | 'reset';
 <style lang="less" scoped>
 .user-container {
     padding: 24px;
+
+    :deep(.ant-table-tbody) {
+        .ant-table-cell {
+            .ant-space-item {
+                .ant-btn-link {
+                    padding: 0;
+                }
+            }
+        }
+    }
 }
 </style>

From 0929185967d7c47a0c86da13481e4b0fb8d7f750 Mon Sep 17 00:00:00 2001
From: easy <1358086367@qq.com>
Date: Thu, 16 Feb 2023 16:35:39 +0800
Subject: [PATCH 2/4] =?UTF-8?q?update:=20=E7=BB=84=E7=BB=87=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=E6=B7=BB=E5=8A=A0=E6=8C=89=E9=92=AE=E6=9D=83=E9=99=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../system/Department/components/LeftTree.vue | 84 +++++++++++++----
 src/views/system/Department/device/index.vue  | 75 ++++++++-------
 src/views/system/Department/index.vue         |  5 +-
 src/views/system/Department/product/index.vue | 94 +++++++++++--------
 src/views/system/Department/user/index.vue    | 46 ++++-----
 .../system/User/components/EditUserDialog.vue |  2 +
 6 files changed, 192 insertions(+), 114 deletions(-)

diff --git a/src/views/system/Department/components/LeftTree.vue b/src/views/system/Department/components/LeftTree.vue
index df99f733..7057903b 100644
--- a/src/views/system/Department/components/LeftTree.vue
+++ b/src/views/system/Department/components/LeftTree.vue
@@ -10,9 +10,17 @@
                 <search-outlined />
             </template>
         </a-input>
-        <a-button type="primary" @click="openDialog()" class="add-btn">
-            新增
-        </a-button>
+        <div class="add-btn">
+            <PermissionButton
+                type="primary"
+                class="add-btn"
+                :uhasPermission="`${permission}:add`"
+                @click="openDialog()"
+            >
+                新增
+            </PermissionButton>
+        </div>
+
         <a-tree
             :tree-data="treeData"
             v-model:selected-keys="selectedKeys"
@@ -22,13 +30,13 @@
             <template #title="{ name, data }">
                 <span>{{ name }}</span>
                 <span class="func-btns" @click="(e) => e.stopPropagation()">
-                    <a-tooltip>
+                    <!-- <a-tooltip>
                         <template #title>编辑</template>
                         <a-button style="padding: 0" type="link">
                             <edit-outlined @click="openDialog(data)" />
                         </a-button>
-                    </a-tooltip>
-                    <a-tooltip>
+                    </a-tooltip> -->
+                    <!-- <a-tooltip>
                         <template #title>新增子组织</template>
                         <a-button style="padding: 0" type="link">
                             <plus-circle-outlined
@@ -42,9 +50,9 @@
                                 "
                             />
                         </a-button>
-                    </a-tooltip>
+                    </a-tooltip> -->
 
-                    <a-popconfirm
+                    <!-- <a-popconfirm
                         title="确认删除"
                         ok-text="确定"
                         cancel-text="取消"
@@ -56,7 +64,45 @@
                                 <delete-outlined />
                             </a-button>
                         </a-tooltip>
-                    </a-popconfirm>
+                    </a-popconfirm> -->
+
+                    <PermissionButton
+                        :uhasPermission="`${permission}:update`"
+                        type="link"
+                        :tooltip="{
+                            title: '新增子组织',
+                        }"
+                        @click="openDialog(data)"
+                    >
+                        <AIcon type="EditOutlined" />
+                    </PermissionButton>
+                    <PermissionButton
+                        :uhasPermission="`${permission}:add`"
+                        type="link"
+                        :tooltip="{
+                            title: '新增子组织',
+                        }"
+                        @click="
+                            openDialog({
+                                ...data,
+                                id: '',
+                                parentId: data.id,
+                            })
+                        "
+                    >
+                        <AIcon type="PlusCircleOutlined" />
+                    </PermissionButton>
+                    <PermissionButton
+                        type="link"
+                        :uhasPermission="`${permission}:delete`"
+                        :tooltip="{ title: '删除' }"
+                        :popConfirm="{
+                            title: `确定要删除吗`,
+                            onConfirm: () => delDepartment(data.id),
+                        }"
+                    >
+                        <AIcon type="DeleteOutlined" />
+                    </PermissionButton>
                 </span>
             </template>
         </a-tree>
@@ -71,19 +117,17 @@
 </template>
 
 <script setup lang="ts">
+import PermissionButton from '@/components/PermissionButton/index.vue';
 import { getTreeData_api, delDepartment_api } from '@/api/system/department';
 import { debounce, cloneDeep, omit } from 'lodash-es';
 import { ArrayToTree } from '@/utils/utils';
 import EditDepartmentDialog from './EditDepartmentDialog.vue';
 
-import {
-    SearchOutlined,
-    EditOutlined,
-    PlusCircleOutlined,
-    DeleteOutlined,
-} from '@ant-design/icons-vue';
+import { SearchOutlined } from '@ant-design/icons-vue';
 import { message } from 'ant-design-vue';
 
+const permission = 'system/Department';
+
 const save = useRoute().query.save;
 const emits = defineEmits(['change']);
 const searchValue = ref(''); // 搜索内容
@@ -195,7 +239,10 @@ function init() {
 
     .add-btn {
         margin: 24px 0;
-        width: 100%;
+
+        :deep(.ant-btn-primary) {
+            width: 100%;
+        }
     }
 
     :deep(.ant-tree-treenode) {
@@ -210,8 +257,9 @@ function init() {
                 .func-btns {
                     display: none;
                     font-size: 14px;
-                    .ant-btn {
-                        height: 22px;
+                    .ant-btn-link {
+                        padding: 0 4px;
+                        height: 24px;
                     }
                 }
                 &:hover {
diff --git a/src/views/system/Department/device/index.vue b/src/views/system/Department/device/index.vue
index b4cdf49a..7073887a 100644
--- a/src/views/system/Department/device/index.vue
+++ b/src/views/system/Department/device/index.vue
@@ -14,29 +14,38 @@
         >
             <template #headerTitle>
                 <a-space>
-                    <a-button type="primary" @click="table.clickAdd">
-                        <plus-outlined />资产分配
-                    </a-button>
+                    <PermissionButton
+                        :uhasPermission="`${permission}:assert`"
+                        type="primary"
+                        @click="table.clickAdd"
+                    >
+                        <AIcon type="PlusOutlined" />资产分配
+                    </PermissionButton>
                     <a-dropdown trigger="hover">
                         <a-button>批量操作</a-button>
                         <template #overlay>
                             <a-menu>
                                 <a-menu-item>
-                                    <a-popconfirm
-                                        title="是否批量解除绑定"
-                                        ok-text="确定"
-                                        cancel-text="取消"
-                                        @confirm="table.clickUnBind()"
+                                    <PermissionButton
+                                        :uhasPermission="`${permission}:bind`"
+                                        :popConfirm="{
+                                            title: `是否批量解除绑定`,
+                                            onConfirm: () =>
+                                                table.clickUnBind(),
+                                        }"
                                     >
-                                        <a-button>
-                                            <DisconnectOutlined /> 批量解绑
-                                        </a-button>
-                                    </a-popconfirm>
+                                        <AIcon
+                                            type="DisconnectOutlined"
+                                        />批量解绑
+                                    </PermissionButton>
                                 </a-menu-item>
                                 <a-menu-item>
-                                    <a-button @click="table.clickEdit()">
-                                        <EditOutlined /> 批量编辑
-                                    </a-button>
+                                    <PermissionButton
+                                        :uhasPermission="`${permission}:assert`"
+                                        @click="table.clickEdit()"
+                                    >
+                                        <AIcon type="EditOutlined" />批量编辑
+                                    </PermissionButton>
                                 </a-menu-item>
                             </a-menu>
                         </template>
@@ -102,21 +111,22 @@
                         </a-row>
                     </template>
                     <template #actions>
-                        <a-button
+                        <PermissionButton
+                            :uhasPermission="`${permission}:assert`"
                             @click="table.clickEdit(slotProps)"
-                            style="margin-right: 10px"
                         >
                             <AIcon type="EditOutlined" />
-                        </a-button>
-                        <a-popconfirm
-                            title="是否解除绑定"
-                            ok-text="确定"
-                            cancel-text="取消"
-                            @confirm="table.clickUnBind(slotProps)"
-                            ><a-button>
-                                <AIcon type="DisconnectOutlined" />
-                            </a-button>
-                        </a-popconfirm>
+                        </PermissionButton>
+
+                        <PermissionButton
+                            :uhasPermission="`${permission}:bind`"
+                            :popConfirm="{
+                                title: `是否解除绑定`,
+                                onConfirm: () => table.clickUnBind(slotProps),
+                            }"
+                        >
+                            <AIcon type="DisconnectOutlined" />
+                        </PermissionButton>
                     </template>
                 </CardBox>
             </template>
@@ -143,11 +153,8 @@
 </template>
 
 <script setup lang="ts" name="device">
-import {
-    PlusOutlined,
-    EditOutlined,
-    DisconnectOutlined,
-} from '@ant-design/icons-vue';
+import PermissionButton from '@/components/PermissionButton/index.vue';
+
 import AddDeviceOrProductDialog from '../components/AddDeviceOrProductDialog.vue';
 import EditPermissionDialog from '../components/EditPermissionDialog.vue';
 import { getImage } from '@/utils/comm';
@@ -163,6 +170,8 @@ import { intersection } from 'lodash-es';
 import { dictType } from '../typing.d.ts';
 import { message } from 'ant-design-vue';
 
+const permission = 'system/Department';
+
 const emits = defineEmits(['update:bindBool']);
 const props = defineProps<{
     parentId: string;
@@ -453,7 +462,7 @@ nextTick(() => {
             }
         }
         .card-tools {
-            .ant-btn {
+            span {
                 color: #252525;
             }
         }
diff --git a/src/views/system/Department/index.vue b/src/views/system/Department/index.vue
index 3aa18fc3..ca9a2f3a 100644
--- a/src/views/system/Department/index.vue
+++ b/src/views/system/Department/index.vue
@@ -55,8 +55,9 @@ const openDeviceBind = () => {
                 flex-basis: 300px;
             }
             .right {
-                flex: 1 1 auto;
-                .ant-tabs-nav {
+                width: calc(100% - 300px);
+
+                .ant-tabs-nav-wrap {
                     padding-left: 24px;
                 }
             }
diff --git a/src/views/system/Department/product/index.vue b/src/views/system/Department/product/index.vue
index be21dbc5..b69609d4 100644
--- a/src/views/system/Department/product/index.vue
+++ b/src/views/system/Department/product/index.vue
@@ -14,29 +14,38 @@
         >
             <template #headerTitle>
                 <a-space>
-                    <a-button type="primary" @click="table.clickAdd">
-                        <plus-outlined />资产分配
-                    </a-button>
+                    <PermissionButton
+                        :uhasPermission="`${permission}:assert`"
+                        type="primary"
+                        @click="table.clickAdd"
+                    >
+                        <AIcon type="PlusOutlined" />资产分配
+                    </PermissionButton>
                     <a-dropdown trigger="hover">
                         <a-button>批量操作</a-button>
                         <template #overlay>
                             <a-menu>
                                 <a-menu-item>
-                                    <a-popconfirm
-                                        title="是否批量解除绑定"
-                                        ok-text="确定"
-                                        cancel-text="取消"
-                                        @confirm="table.clickUnBind()"
+                                    <PermissionButton
+                                        :uhasPermission="`${permission}:bind`"
+                                        :popConfirm="{
+                                            title: `是否批量解除绑定`,
+                                            onConfirm: () =>
+                                                table.clickUnBind(),
+                                        }"
                                     >
-                                        <a-button>
-                                            <DisconnectOutlined /> 批量解绑
-                                        </a-button>
-                                    </a-popconfirm>
+                                        <AIcon
+                                            type="DisconnectOutlined"
+                                        />批量解绑
+                                    </PermissionButton>
                                 </a-menu-item>
                                 <a-menu-item>
-                                    <a-button @click="table.clickEdit()">
-                                        <EditOutlined /> 批量编辑
-                                    </a-button>
+                                    <PermissionButton
+                                        :uhasPermission="`${permission}:assert`"
+                                        @click="()=>table.clickEdit()"
+                                    >
+                                        <AIcon type="EditOutlined" />批量编辑
+                                    </PermissionButton>
                                 </a-menu-item>
                             </a-menu>
                         </template>
@@ -102,21 +111,22 @@
                         </a-row>
                     </template>
                     <template #actions>
-                        <a-button
-                            @click="table.clickEdit(slotProps)"
-                            style="margin-right: 10px"
+                        <PermissionButton
+                            :uhasPermission="`${permission}:assert`"
+                            @click="() => table.clickEdit(slotProps)"
                         >
                             <AIcon type="EditOutlined" />
-                        </a-button>
-                        <a-popconfirm
-                            title="是否解除绑定"
-                            ok-text="确定"
-                            cancel-text="取消"
-                            @confirm="table.clickUnBind(slotProps)"
-                            ><a-button>
-                                <AIcon type="DisconnectOutlined" />
-                            </a-button>
-                        </a-popconfirm>
+                        </PermissionButton>
+
+                        <PermissionButton
+                            :uhasPermission="`${permission}:bind`"
+                            :popConfirm="{
+                                title: `是否解除绑定`,
+                                onConfirm: () => table.clickUnBind(slotProps),
+                            }"
+                        >
+                            <AIcon type="DisconnectOutlined" />
+                        </PermissionButton>
                     </template>
                 </CardBox>
             </template>
@@ -138,17 +148,17 @@
                 asset-type="product"
                 @confirm="table.refresh"
             />
-            <NextDialog ref="nextDialogRef" @confirm="emits('openDeviceBind')" />
+            <NextDialog
+                ref="nextDialogRef"
+                @confirm="emits('openDeviceBind')"
+            />
         </div>
     </div>
 </template>
 
 <script setup lang="ts" name="product">
-import {
-    PlusOutlined,
-    EditOutlined,
-    DisconnectOutlined,
-} from '@ant-design/icons-vue';
+import PermissionButton from '@/components/PermissionButton/index.vue';
+
 import AddDeviceOrProductDialog from '../components/AddDeviceOrProductDialog.vue';
 import EditPermissionDialog from '../components/EditPermissionDialog.vue';
 import NextDialog from '../components/NextDialog.vue';
@@ -164,7 +174,9 @@ import { intersection } from 'lodash-es';
 import { dictType } from '../typing.d.ts';
 import { message } from 'ant-design-vue';
 
-const emits = defineEmits(['openDeviceBind'])
+const permission = 'system/Department';
+
+const emits = defineEmits(['openDeviceBind']);
 const props = defineProps<{
     parentId: string;
 }>();
@@ -363,6 +375,8 @@ const table = {
         }
     },
     clickAdd: () => {
+        console.log(222)
+        console.log(addDialogRef.value)
         addDialogRef.value && addDialogRef.value.openDialog();
     },
     clickEdit: (row?: any) => {
@@ -405,10 +419,10 @@ const table = {
             tableRef.value.reload();
         });
     },
-    addConfirm: ()=>{
-        table.refresh()
-        nextDialogRef.value && nextDialogRef.value.openDialog()
-    }
+    addConfirm: () => {
+        table.refresh();
+        nextDialogRef.value && nextDialogRef.value.openDialog();
+    },
 };
 
 const addDialogRef = ref();
@@ -428,7 +442,7 @@ table.init();
             }
         }
         .card-tools {
-            .ant-btn {
+            span {
                 color: #252525;
             }
         }
diff --git a/src/views/system/Department/user/index.vue b/src/views/system/Department/user/index.vue
index c0a51ca9..53f582ca 100644
--- a/src/views/system/Department/user/index.vue
+++ b/src/views/system/Department/user/index.vue
@@ -15,23 +15,24 @@
             model="TABLE"
         >
             <template #headerTitle>
-                <a-button
+                <PermissionButton
                     type="primary"
+                    :uhasPermission="`${permission}:bind-user`"
                     @click="table.openDialog"
-                    style="margin-right: 10px"
+                    style="margin-right: 15px;"
                 >
                     <AIcon type="PlusOutlined" />绑定用户
-                </a-button>
-                <a-popconfirm
-                    title="是否解除绑定"
-                    ok-text="确定"
-                    cancel-text="取消"
-                    @confirm="table.unBind()"
+                </PermissionButton>
+                <div style="display: inline-block;width: 12px;height: 1px;"></div>
+                <PermissionButton
+                    :uhasPermission="`${permission}:bind`"
+                    :popConfirm="{
+                        title: `是否解除绑定`,
+                        onConfirm: () => table.unBind(),
+                    }"
                 >
-                    <a-button
-                        ><AIcon type="DisconnectOutlined" />批量解绑</a-button
-                    >
-                </a-popconfirm>
+                    <AIcon type="DisconnectOutlined" />批量解绑
+                </PermissionButton>
             </template>
             <template #status="slotProps">
                 <BadgeStatus
@@ -45,16 +46,16 @@
             </template>
             <template #action="slotProps">
                 <a-space :size="16">
-                    <a-popconfirm
-                        title="是否解除绑定"
-                        ok-text="确定"
-                        cancel-text="取消"
-                        @confirm="table.unBind(slotProps)"
+                    <PermissionButton
+                        type="link"
+                        :uhasPermission="`${permission}:bind`"
+                        :popConfirm="{
+                            title: `是否解除绑定`,
+                            onConfirm: () => table.unBind(slotProps),
+                        }"
                     >
-                        <a-button style="padding: 0" type="link">
-                            <AIcon type="DisconnectOutlined" />
-                        </a-button>
-                    </a-popconfirm>
+                        <AIcon type="DisconnectOutlined" />
+                    </PermissionButton>
                 </a-space>
             </template>
         </JTable>
@@ -70,10 +71,13 @@
 </template>
 
 <script setup lang="ts" name="user">
+import PermissionButton from '@/components/PermissionButton/index.vue';
 import AddBindUserDialog from './components/addBindUserDialog.vue';
 import { getBindUserList_api, unBindUser_api } from '@/api/system/department';
 import { message } from 'ant-design-vue';
 
+const permission = 'system/Department';
+
 const addDialogRef = ref();
 
 const props = defineProps<{
diff --git a/src/views/system/User/components/EditUserDialog.vue b/src/views/system/User/components/EditUserDialog.vue
index 52487cd8..c61c9c78 100644
--- a/src/views/system/User/components/EditUserDialog.vue
+++ b/src/views/system/User/components/EditUserDialog.vue
@@ -100,6 +100,7 @@
                     </a-form-item>
                 </a-col>
             </a-row>
+            <!-- 还差页面权限 -->
             <a-row :gutter="24" v-if="form.IsShow('add', 'edit')">
                 <a-col :span="12">
                     <a-form-item name="roleIdList" label="角色" class="flex">
@@ -110,6 +111,7 @@
                             placeholder="请选择角色"
                             :options="form.roleOptions"
                         ></a-select>
+                        
                         <PermissionButton
                             :uhasPermission="`${rolePermission}:update`"
                             @click="form.clickAddItem('roleIdList', 'Role')"

From d692480d41b4f4e6a2392e64612a405b9fe1d1e5 Mon Sep 17 00:00:00 2001
From: easy <1358086367@qq.com>
Date: Thu, 16 Feb 2023 17:35:44 +0800
Subject: [PATCH 3/4] =?UTF-8?q?update:=20=E8=A7=92=E8=89=B2=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=E6=B7=BB=E5=8A=A0=E6=8C=89=E9=92=AE=E6=9D=83=E9=99=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/system/Role/index.vue | 71 +++++++++++++++++++--------------
 1 file changed, 41 insertions(+), 30 deletions(-)

diff --git a/src/views/system/Role/index.vue b/src/views/system/Role/index.vue
index bc6f6244..05ceb912 100644
--- a/src/views/system/Role/index.vue
+++ b/src/views/system/Role/index.vue
@@ -10,36 +10,38 @@
             :params="query.params"
         >
             <template #headerTitle>
-                <a-button type="primary" @click="table.clickAdd"
-                    ><plus-outlined />新增</a-button
+                <PermissionButton
+                    type="primary"
+                    :uhasPermission="`${permission}:add`"
+                    @click="table.clickAdd"
                 >
+                    <AIcon type="PlusOutlined" />新增
+                </PermissionButton>
             </template>
 
             <template #action="slotProps">
                 <a-space :size="16">
-                    <a-tooltip>
-                        <template #title>编辑</template>
-                        <a-button
-                            style="padding: 0"
-                            type="link"
-                            @click="table.clickEdit(slotProps)"
-                        >
-                            <edit-outlined />
-                        </a-button>
-                    </a-tooltip>
-                    <a-popconfirm
-                        title="确定要删除吗？"
-                        ok-text="确定"
-                        cancel-text="取消"
-                        @confirm="table.clickDel(slotProps)"
+                    <PermissionButton
+                        :uhasPermission="`${permission}:update`"
+                        type="link"
+                        :tooltip="{
+                            title: '编辑',
+                        }"
+                        @click="table.clickEdit(slotProps)"
                     >
-                        <a-tooltip>
-                            <template #title>删除</template>
-                            <a-button style="padding: 0" type="link">
-                                <delete-outlined />
-                            </a-button>
-                        </a-tooltip>
-                    </a-popconfirm>
+                        <AIcon type="EditOutlined" />
+                    </PermissionButton>
+                    <PermissionButton
+                        type="link"
+                        :uhasPermission="`${permission}:delete`"
+                        :tooltip="{ title: '删除' }"
+                        :popConfirm="{
+                            title: `确定要删除吗`,
+                            onConfirm: () => table.clickDel(slotProps),
+                        }"
+                    >
+                        <AIcon type="DeleteOutlined" />
+                    </PermissionButton>
                 </a-space>
             </template>
         </JTable>
@@ -51,14 +53,13 @@
 </template>
 
 <script setup lang="ts" name="Role">
-import {
-    EditOutlined,
-    DeleteOutlined,
-    PlusOutlined,
-} from '@ant-design/icons-vue';
+import PermissionButton from '@/components/PermissionButton/index.vue';
 import AddDialog from './components/AddDialog.vue';
 import { getRoleList_api, delRole_api } from '@/api/system/role';
 import { message } from 'ant-design-vue';
+
+const permission = 'system/Role';
+
 const addDialogRef = ref(); // 新增弹窗实例
 const router = useRouter();
 const route = useRoute();
@@ -143,4 +144,14 @@ nextTick(() => {
 });
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.role-container {
+
+    :deep(.ant-table-cell) {
+        .ant-btn-link {
+            padding: 0;
+        }
+    }
+}
+
+</style>

From 184e10d239cd77e2fe0bb709e196bc09408a09aa Mon Sep 17 00:00:00 2001
From: wangshuaiswim <shuai-1991@qq.com>
Date: Thu, 16 Feb 2023 18:03:10 +0800
Subject: [PATCH 4/4] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8DPermissionButton?=
 =?UTF-8?q?=E4=B8=ADpopconfirm=E6=96=B9=E6=B3=95=E8=B0=83=E7=94=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/PermissionButton/index.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/PermissionButton/index.vue b/src/components/PermissionButton/index.vue
index cd95769d..965c4c19 100644
--- a/src/components/PermissionButton/index.vue
+++ b/src/components/PermissionButton/index.vue
@@ -1,7 +1,7 @@
 <template>
   <template v-if="isPermission">
     <template v-if="popConfirm">
-      <a-popconfirm v-bind="popConfirm" @confirm="conform" :disabled="!isPermission || props.disabled">
+      <a-popconfirm v-bind="popConfirm" :disabled="!isPermission || props.disabled">
         <a-tooltip v-if="tooltip" v-bind="tooltip">
           <slot v-if="noButton"></slot>
           <a-button v-else v-bind="_buttonProps" :disabled="_isPermission" >
@@ -106,9 +106,9 @@ const _isPermission = computed(() =>
     : true
 )
 
-const conform = (e: MouseEvent) => {
-  props.popConfirm?.onConfirm?.(e)
-}
+// const conform = (e: MouseEvent) => {
+//   props.popConfirm?.onConfirm?.(e)
+// }
 </script>
 <style scoped lang="less">