From 66e88145c7a9981ab9cd6f5dc04980d34f7c0548 Mon Sep 17 00:00:00 2001
From: easy <1358086367@qq.com>
Date: Tue, 17 Jan 2023 11:38:16 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=A7=92=E8=89=B2=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/system/role.ts                        |   3 +
 src/components/Search/Search.vue              |   2 +-
 src/router/menu.ts                            |   5 +-
 .../system/Role/components/AddDialog.vue      |  27 ++++
 src/views/system/Role/index.vue               | 124 ++++++++++++++++++
 5 files changed, 159 insertions(+), 2 deletions(-)
 create mode 100644 src/api/system/role.ts
 create mode 100644 src/views/system/Role/components/AddDialog.vue
 create mode 100644 src/views/system/Role/index.vue

diff --git a/src/api/system/role.ts b/src/api/system/role.ts
new file mode 100644
index 00000000..f5764379
--- /dev/null
+++ b/src/api/system/role.ts
@@ -0,0 +1,3 @@
+import server from '@/utils/request';
+
+export const getRoleList_api = (data: any): Promise<any> => server.post(`/role/_query/`, data);
\ No newline at end of file
diff --git a/src/components/Search/Search.vue b/src/components/Search/Search.vue
index 90992988..cc0bf08b 100644
--- a/src/components/Search/Search.vue
+++ b/src/components/Search/Search.vue
@@ -71,7 +71,7 @@
       </div>
     </div>
   </div>
-</template>
+</template> 
 
 <script setup lang='ts' name='Search'>
 import SearchItem from './Item.vue'
diff --git a/src/router/menu.ts b/src/router/menu.ts
index 38e82f62..2db5bb76 100644
--- a/src/router/menu.ts
+++ b/src/router/menu.ts
@@ -101,7 +101,10 @@ export default [
         path:'/system/api',
         component: ()=>import('@/views/system/apiPage/index.vue')
     },
-
+    {
+        path:'/system/Role',
+        component: ()=>import('@/views/system/Role/index.vue')
+    },
     // 初始化
     {
       path: '/init-home',
diff --git a/src/views/system/Role/components/AddDialog.vue b/src/views/system/Role/components/AddDialog.vue
new file mode 100644
index 00000000..32cf2d51
--- /dev/null
+++ b/src/views/system/Role/components/AddDialog.vue
@@ -0,0 +1,27 @@
+<template>
+    <a-modal
+        v-model:visible="dialog.visible"
+        title="新增"
+        @ok="dialog.handleOk"
+    >
+        <p>Some contents...</p>
+        <p>Some contents...</p>
+        <p>Some contents...</p>
+    </a-modal>
+</template>
+
+<script setup lang="ts">
+const emits = defineEmits(['refresh']);
+const props = defineProps({
+    open: Number,
+});
+
+const dialog = reactive({
+    visible: false,
+    handleOk: () => {
+        emits('refresh');
+    },
+});
+</script>
+
+<style scoped></style>
diff --git a/src/views/system/Role/index.vue b/src/views/system/Role/index.vue
new file mode 100644
index 00000000..e5ebeb01
--- /dev/null
+++ b/src/views/system/Role/index.vue
@@ -0,0 +1,124 @@
+<template>
+    <a-card class="role-container">
+        <Search :columns="query.columns" />
+
+        <JTable
+            :ref="tableRef"
+            :columns="table.columns"
+            :request="getRoleList_api"
+            model="TABLE"
+            :params="query.params"
+        >
+            <template #headerTitle>
+                <a-button type="primary" @click="table.clickAdd"
+                    ><plus-outlined />新增</a-button
+                >
+            </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)"
+                    >
+                        <a-tooltip>
+                            <template #title>删除</template>
+                            <a-button style="padding: 0" type="link">
+                                <delete-outlined />
+                            </a-button>
+                        </a-tooltip>
+                    </a-popconfirm>
+                </a-space>
+            </template>
+        </JTable>
+    </a-card>
+</template>
+
+<script setup lang="ts" name="Role">
+import {
+    EditOutlined,
+    DeleteOutlined,
+    PlusOutlined,
+} from '@ant-design/icons-vue';
+import { getRoleList_api } from '@/api/system/role';
+
+// 筛选
+const query = reactive({
+    columns: [
+        {
+            title: '标识',
+            dataIndex: 'id',
+            key: 'id',
+            ellipsis: true,
+            fixed: 'left',
+        },
+        {
+            title: '名称',
+            dataIndex: 'name',
+            key: 'name',
+            ellipsis: true,
+        },
+        {
+            title: '描述',
+            key: 'description',
+            ellipsis: true,
+            dataIndex: 'description',
+            filters: true,
+            onFilter: true,
+        },
+        {
+            title: '操作',
+            valueType: 'option',
+            width: 200,
+            fixed: 'right',
+        },
+    ],
+    params: {},
+});
+// 表格
+const tableRef = ref();
+const table = reactive({
+    columns: [
+        {
+            title: '标识',
+            dataIndex: 'id',
+            key: 'id',
+        },
+        {
+            title: '名称',
+            dataIndex: 'name',
+            key: 'name',
+        },
+        {
+            title: '说明',
+            dataIndex: 'description',
+            key: 'description',
+        },
+        {
+            title: '操作',
+            dataIndex: 'action',
+            key: 'action',
+            scopedSlots: true,
+        },
+    ],
+    tableData: [],
+    clickAdd: () => {},
+    clickDel: (row: any) => {},
+    clickEdit: (row: any) => {},
+});
+
+</script>
+
+<style lang="less" scoped></style>