1

auto-imports.d.ts

@@ -1,5 +1,5 @@
 // Generated by 'unplugin-auto-import'
 export {}
 declare global {
-
+  const layer: typeof import('@layui/layer-vue')['layer']
 }

components.d.ts

@@ -15,11 +15,13 @@ declare module 'vue' {
     LayButtonContainer: typeof import('@layui/layui-vue')['LayButtonContainer']
     LayButtonGroup: typeof import('@layui/layui-vue')['LayButtonGroup']
     LayCard: typeof import('@layui/layui-vue')['LayCard']
+    LayCascader: typeof import('@layui/layui-vue')['LayCascader']
     LayCheckbox: typeof import('@layui/layui-vue')['LayCheckbox']
     LayCol: typeof import('@layui/layui-vue')['LayCol']
     LayConfigProvider: typeof import('@layui/layui-vue')['LayConfigProvider']
     LayContainer: typeof import('@layui/layui-vue')['LayContainer']
     LayCountUp: typeof import('@layui/layui-vue')['LayCountUp']
+    LayDate: typeof import('@layui/layui-vue')['LayDate']
     LayDatePicker: typeof import('@layui/layui-vue')['LayDatePicker']
     LayDropdown: typeof import('@layui/layui-vue')['LayDropdown']
     LayDropdownMenu: typeof import('@layui/layui-vue')['LayDropdownMenu']
@@ -61,6 +63,7 @@ declare module 'vue' {
     LayTimeline: typeof import('@layui/layui-vue')['LayTimeline']
     LayTimelineItem: typeof import('@layui/layui-vue')['LayTimelineItem']
     LayTree: typeof import('@layui/layui-vue')['LayTree']
+    LayUpload: typeof import('@layui/layui-vue')['LayUpload']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
   }

src/api/module/home.ts

@@ -1,6 +1,6 @@
 import Http from '../http';
 export const login = function(loginForm: any) {
-    return Http.post('/api/backend/user/login', loginForm)
+    return Http.post('/api/backend/login/login', loginForm)
 }
 //基础评分项列表
 export const homeGetHierarchicalData = function(date: any) {
@@ -164,6 +164,25 @@ export const menuDataDel= function(date: any) {
 }
 
 
+//角色列表
+export const authGroupData= function(date: any) {
+    return Http.post('/api/backend/auth_group/getAuthGroupData', date)
+}
+//角色列表(新增)
+export const authGroupDataAdd= function(date: any) {
+    return Http.post('/api/backend/auth_group/create', date)
+}
+//角色列表(编辑)
+export const authGroupDataEdit= function(date: any) {
+    return Http.post('/api/backend/auth_group/update', date)
+}
+//角色列表(删除)
+export const authGroupDataDel= function(date: any) {
+    return Http.post('/api/backend/auth_group/delete', date)
+}
+
+
+
 
 
 

src/store/user.ts

@@ -16,6 +16,7 @@ export const useUserStore = defineStore({
   actions: {
     async loadMenus(){
       this.menus =  menu.menus;
+      console.log(this.menus);
     },
     async loadPermissions(){
       // const { data, code } = await permission();

src/views/login/index.vue

@@ -111,8 +111,8 @@ export default defineComponent({
     const loginQrcodeText = ref('')
     const remember = ref(false)
     const loginForm = reactive({
-      account: 'admin',
+      username: 'admin',
-      password: '123456',
+      password: 'admin888',
       vercode: 'DqJFN'
     })
 
@@ -124,8 +124,8 @@ export default defineComponent({
           loging.value = false;
           if (res.code == 1) {
             layer.msg('登陆成功！', { icon: 1 }, async () => {
-              userStore.token = res.data.password;
+              userStore.token = res.data.token;
-              userStore.userInfo=res.data;
+              userStore.userInfo=res.data.user;
               await userStore.loadMenus()
               await userStore.loadPermissions()
               router.push('/home')

src/views/system/index.vue

@@ -4,29 +4,13 @@
       <div :style="{ width: isFold ? `0px` : `300px` }" class="left-tree">
         <!-- tree -->
         <div v-show="!isFold">
-          <lay-button type="normal" size="sm" @click="toAdd">
+         科室列表
-            <lay-icon type="layui-icon-addition"></lay-icon>新建
-          </lay-button>
-          <lay-button type="warm" size="sm" @click="toEdit">
-            <lay-icon type="layui-icon-edit"></lay-icon>修改
-          </lay-button>
-          <lay-button type="danger" size="sm" @click="toDelete">
-            <lay-icon type="layui-icon-delete"></lay-icon>删除
-          </lay-button>
         </div>
-
+        <lay-tree v-show="!isFold" style="margin-top: 10px" :data="data" v-model:selectedKey="selectedKey"
-        <lay-tree
+                  :showLine="false"  @node-click="handleClick">
-            v-show="!isFold"
-            style="margin-top: 10px"
-            :data="data"
-            v-model:selectedKey="selectedKey"
-            :showLine="showLine"
-            :expandKeys="[1, 3, 4]"
-            @node-click="handleClick"
-        >
           <template #title="{ data }">
             <span :class="selectedKey == data.id ? 'isChecked' : ''">
-              {{ data.title }} {{ data.id }}
+              {{ data.name }}
             </span>
           </template>
         </lay-tree>
@@ -41,266 +25,197 @@
           <lay-form>
             <lay-row>
               <lay-col :md="5">
-                <lay-form-item label="用户账号" label-width="80">
+                <lay-form-item label="用户名" label-width="80">
-                  <lay-input
+                  <lay-input v-model="searchQuery.username" placeholder="请输入" size="sm" :allow-clear="true"
-                      v-model="searchQuery.userAccount"
+                             style="width: 98%"></lay-input>
-                      placeholder="请输入"
-                      size="sm"
-                      :allow-clear="true"
-                      style="width: 98%"
-                  ></lay-input>
                 </lay-form-item>
               </lay-col>
               <lay-col :md="5">
-                <lay-form-item label="用户名" label-width="80">
+                <lay-form-item label="手机号" label-width="80">
-                  <lay-input
+                  <lay-input v-model="searchQuery.mobile" placeholder="请输入" size="sm" :allow-clear="true"
-                      v-model="searchQuery.userName"
+                             style="width: 98%"></lay-input>
-                      placeholder="请输入"
-                      size="sm"
-                      :allow-clear="true"
-                      style="width: 98%"
-                  ></lay-input>
                 </lay-form-item>
               </lay-col>
               <lay-col :md="5">
                 <lay-form-item label="性别" label-width="80">
-                  <lay-select
+                  <lay-select class="search-input" size="sm" v-model="searchQuery.gender" :allow-clear="true"
-                      class="search-input"
+                              placeholder="请选择">
-                      size="sm"
+                    <lay-select-option :value="0" label="未知"></lay-select-option>
-                      v-model="searchQuery.sex"
+                    <lay-select-option :value="1" label="男"></lay-select-option>
-                      :allow-clear="true"
+                    <lay-select-option :value="2" label="女"></lay-select-option>
-                      placeholder="请选择"
-                  >
-                    <lay-select-option
-                        value="man"
-                        label="男"
-                    ></lay-select-option>
-                    <lay-select-option
-                        value="woman"
-                        label="女"
-                    ></lay-select-option>
                   </lay-select>
                 </lay-form-item>
               </lay-col>
               <lay-col :md="5">
                 <lay-form-item label-width="20">
-                  <lay-button
+                  <lay-button style="margin-left: 20px" type="normal" size="sm" @click="toSearch">
-                      style="margin-left: 20px"
-                      type="normal"
-                      size="sm"
-                      @click="toSearch"
-                  >
                     查询
                   </lay-button>
-                  <lay-button size="sm" @click="toReset"> 重置 </lay-button>
+                  <lay-button size="sm" @click="toReset"> 重置</lay-button>
                 </lay-form-item>
               </lay-col>
             </lay-row>
           </lay-form>
         </lay-card>
-        <lay-table
+        <lay-table :page="page" :height="'100%'" :columns="columns" :loading="loading" :default-toolbar="true"
-            :page="page"
+                   :data-source="dataSource" v-model:selected-keys="selectedKeys" @change="change"
-            :height="'100%'"
+                   @sortChange="sortChange">
-            :columns="columns"
-            :loading="loading"
-            :default-toolbar="true"
-            :data-source="dataSource"
-            v-model:selected-keys="selectedKeys"
-            @change="change"
-            @sortChange="sortChange"
-        >
           <template #status="{ row }">
-            <lay-switch
+            <lay-switch :model-value="row.status" @change="changeStatus($event, row)"></lay-switch>
-                :model-value="row.status"
-                @change="changeStatus($event, row)"
-            ></lay-switch>
           </template>
           <template #role="{ row }">
             <lay-tag color="#165DFF" variant="light">{{ row.role }}</lay-tag>
           </template>
 
           <template v-slot:toolbar>
-            <lay-button
+            <lay-button size="sm" type="primary" @click="changeAddShow()">新增</lay-button>
-                size="sm"
-                type="primary"
-                @click="changeVisible11('新增', null)"
-            >新增</lay-button
-            >
             <lay-button size="sm" @click="toRemove">删除</lay-button>
           </template>
           <template v-slot:operator="{ row }">
-            <lay-button
+            <lay-button size="xs" border="green" border-style="dashed">编辑
-                size="xs"
+            </lay-button>
-                border="green"
+            <lay-popconfirm content="确定要删除此用户吗?" @confirm="confirm" @cancel="cancel">
-                border-style="dashed"
+              <lay-button size="xs" border="red" border-style="dashed">删除</lay-button>
-                @click="changeVisible11('编辑', row)"
-            >编辑</lay-button
-            >
-            <lay-popconfirm
-                content="确定要删除此用户吗?"
-                @confirm="confirm"
-                @cancel="cancel"
-            >
-              <lay-button size="xs" border="red" border-style="dashed"
-              >删除</lay-button
-              >
             </lay-popconfirm>
           </template>
         </lay-table>
       </div>
     </div>
-    <lay-layer v-model="visible11" :title="title" :area="['500px', '450px']">
+    <lay-layer v-model="addShow" :title="title" :area="['750px', '100%']" :type="4" :shade="true" :btn="addButton">
       <div style="padding: 20px">
-        <lay-form :model="model11" ref="layFormRef11" required>
+        <lay-form :model="model11" ref="layFormRef11" required mode="inline">
-          <lay-form-item label="用户账号" prop="account">
+          <lay-form-item label="头像" prop="username">
-            <lay-input v-model="model11.account"></lay-input>
+            <lay-upload ref="uploadRef" :number="1" field="file" :size="1000" :headers="{token:userStore.token}" url="/api/common/upload" @cutdone="getCutDone" v-model="file1" :auto="true"  acceptMime="images" @cutcancel="getCutCancel" :cut="false" :cutOptions="cutOptions" @done="getFileDone">
+              <template #preview>
+                <div class="easy-wrap" v-if="model11.avatar">
+                  <img :src="model11.avatar" style="width: 100px;height: 100px"/>
+                </div>
+              </template>
+            </lay-upload>
           </lay-form-item>
-          <lay-form-item label="用户名" prop="name">
+          <lay-form-item label="账户" prop="username">
-            <lay-input v-model="model11.name"></lay-input>
+            <lay-input v-model="model11.username" size="lg" placeholder="请输入账户"></lay-input>
           </lay-form-item>
-          <lay-form-item label="性别" prop="sex">
+          <lay-form-item label="密码" prop="password" v-if="title === '新增'">
-            <lay-select v-model="model11.sex" style="width: 100%">
+            <lay-input type="password" v-model="model11.password" size="lg" placeholder="请输入密码"></lay-input>
-              <lay-select-option value="男" label="男"></lay-select-option>
+          </lay-form-item>
-              <lay-select-option value="女" label="女"></lay-select-option>
+          <lay-form-item label="姓名" prop="nickname">
+            <lay-input v-model="model11.nickname" size="lg" placeholder="请输入姓名"></lay-input>
+          </lay-form-item>
+          <lay-form-item label="手机号" prop="mobile">
+            <lay-input v-model="model11.mobile" size="lg" placeholder="请输入手机号"></lay-input>
+          </lay-form-item>
+          <lay-form-item label="身份证号" prop="member_code">
+            <lay-input v-model="model11.member_code" size="lg" placeholder="请输入身份证号"></lay-input>
+          </lay-form-item>
+          <lay-form-item label="邮箱" prop="email">
+            <lay-input v-model="model11.email" size="lg" placeholder="请输入邮箱"></lay-input>
+          </lay-form-item>
+          <lay-form-item label="工号" prop="work_number">
+            <lay-input v-model="model11.work_number" size="lg" placeholder="请输入工号"></lay-input>
+          </lay-form-item>
+          <lay-form-item label="性别" prop="gender">
+            <lay-select v-model="model11.gender" style="width:180px;">
+              <lay-select-option :value="0" label="未选择"></lay-select-option>
+              <lay-select-option :value="1" label="男"></lay-select-option>
+              <lay-select-option :value="2" label="女"></lay-select-option>
             </lay-select>
           </lay-form-item>
-          <lay-form-item label="角色" prop="role">
+          <lay-form-item label="科室" prop="group_id">
-            <lay-input v-model="model11.role"></lay-input>
+            <lay-cascader size="lg" style="width:180px;" :options="data" search :replaceFields="{ label:'name',value:'id',children:'children'}" v-model="model11.group_id" placeholder="选择科室" allow-clear></lay-cascader>
+          </lay-form-item>
+          <lay-form-item label="党支部" prop="party_id">
+            <lay-cascader size="lg" style="width:180px;" :options="partyList" search :replaceFields="{ label:'name',value:'id',children:'children'}" v-model="model11.party_id" placeholder="选择党支部" allow-clear></lay-cascader>
+          </lay-form-item>
+          <lay-form-item label="角色组" prop="auth_group_id">
+            <lay-select v-model="model11.auth_group_id" style="width:180px;"  placeholder="选择党角色组" >
+              <lay-select-option size="lg" v-for="item in authList" :value="item.id" :label="item.name"></lay-select-option>
+            </lay-select>
           </lay-form-item>
           <lay-form-item label="状态" prop="status">
-            <lay-switch :model-value="model11.status"></lay-switch>
+            <lay-select v-model="model11.status" placeholder="请选择" size="lg" style="width:180px;">
-          </lay-form-item>
+              <lay-select-option :value="1" label="禁用"></lay-select-option>
-        </lay-form>
+              <lay-select-option :value="2" label="启用"></lay-select-option>
-        <div style="width: 100%; text-align: center">
-          <lay-button size="sm" type="primary" @click="toSubmit"
-          >保存</lay-button
-          >
-          <lay-button size="sm" @click="toCancel">取消</lay-button>
-        </div>
-      </div>
-    </lay-layer>
-
-    <lay-layer v-model="visible22" :title="title22" :area="['700px', '400px']">
-      <div style="padding: 20px">
-        <lay-form :model="model22" ref="layFormRef11" required>
-          <lay-row>
-            <lay-col md="12">
-              <lay-form-item label="上级机构" prop="organization">
-                <lay-select v-model="model22.organization" style="width: 100%">
-                  <lay-select-option value="1" label="研发部">
-                  </lay-select-option>
-                  <lay-select-option value="2" label="测试部">
-                  </lay-select-option>
-                  <lay-select-option value="3" label="设计部">
-                  </lay-select-option>
-                  <lay-select-option value="4" label="市场部">
-                  </lay-select-option>
-                  <lay-select-option value="5" label="运维部">
-                  </lay-select-option>
             </lay-select>
           </lay-form-item>
-              <lay-form-item label="机构名称" prop="name">
-                <lay-input v-model="model22.name"></lay-input>
-              </lay-form-item>
-              <lay-form-item label="机构全称" prop="fullName">
-                <lay-input v-model="model22.fullName"></lay-input>
-              </lay-form-item>
-              <lay-form-item label="机构代码" prop="code">
-                <lay-input v-model="model22.code"></lay-input>
-              </lay-form-item>
-            </lay-col>
-            <lay-col md="12">
-              <lay-form-item label="机构类型" prop="type">
-                <lay-select v-model="model22.type" style="width: 100%">
-                  <lay-select-option value="1" label="公司"></lay-select-option>
-                  <lay-select-option value="2" label="子公司">
-                  </lay-select-option>
-                  <lay-select-option value="3" label="部门"></lay-select-option>
-                  <lay-select-option value="4" label="小组"></lay-select-option>
-                </lay-select>
-              </lay-form-item>
-              <lay-form-item label="排序号" prop="sort">
-                <lay-input-number
-                    style="width: 100%"
-                    v-model="model22.sort"
-                    position="right"
-                ></lay-input-number>
-              </lay-form-item>
-              <lay-form-item label="备注" prop="remark">
-                <lay-textarea
-                    placeholder="请输入备注"
-                    v-model="model22.remark"
-                    :rows="4"
-                ></lay-textarea>
-              </lay-form-item>
-            </lay-col>
-          </lay-row>
         </lay-form>
-        <div style="width: 100%; text-align: center">
-          <lay-button size="sm" type="primary" @click="toSubmit"
-          >保存</lay-button
-          >
-          <lay-button size="sm" @click="toCancel">取消</lay-button>
-        </div>
       </div>
     </lay-layer>
   </lay-container>
 </template>
 <script setup lang="ts">
-import { ref, reactive } from 'vue'
+import {ref, reactive, onMounted} from 'vue'
-import { layer } from '@layui/layui-vue'
+import {layer} from '@layui/layui-vue'
+import {authGroupData, menuData, menuDataAdd, menuDataEdit, partyGroupData, userGroupData} from "@/api/module/home";
+const cutUrl = ref("");
+const uploadRef = ref(null)
+import { useRouter } from 'vue-router'
+import {useUserStore} from "@/store/user";
+const userStore = useUserStore()
+const groupList= ref([]);
+const cutOptions = {
+  copperOption: {
+    center: false,
+    aspectRatio: 1,
+  }
+}
+const file1 = ref([]);
+const getCutDone=(res)=>{
+  console.log("getCutDone",res);
+  cutUrl.value = res.msg;
+};
 
-const data = ref([
+const getCutCancel=(res)=>{
-  {
+  console.log("getCutCancel",res);
-    title: 'xxxx公司',
+};
-    id: 1,
+
-    checked: true,
+const getFileDone=(res)=>{
-    children: [
+
-      {
+  var date= JSON.parse(res.data);
-        title: '研发部',
+  console.log("getFileDone",date);
-        id: 2,
+  model11.avatar = date.data.fullurl;
-        children: [
+  //uploadRef.value.submit()
-          {
+};
-            title: '研发一部',
+onMounted(()=>{
-            id: 3
+  console.log(userStore.token);
-          },
+  getLeftList();
-          {
+  getPartyList();
-            title: '研发二部',
+  getAuthList();
-            id: 4
+})
-          },
+const partyList = ref([])
-          {
+const getPartyList = () => {
-            title: '研发三部',
+  partyGroupData({}).then((res) => {
-            id: 5
+    console.log(res)
+    if (res.code == 1) {
+      partyList.value = res.data;
+    } else {
+      layer.msg(res.msg, { icon: 2 })
     }
-        ]
+  })
-      },
+}
-      {
+const getLeftList = () => {
-        title: '测试部',
+  userGroupData({}).then((res) => {
-        id: 6,
+    console.log(res)
-        children: [
+    if (res.code == 1) {
-          {
+      data.value = res.data;
-            title: '测试一部',
+    } else {
-            id: 7,
+      layer.msg(res.msg, { icon: 2 })
-            disabled: true
-          },
-          {
-            title: '测试二部',
-            id: 8
     }
-        ]
+  })
-      },
+}
-      {
+const authList = ref([])
-        title: '设计部',
+const getAuthList = () => {
-        id: 9
+  authGroupData({}).then((res) => {
-      },
+    console.log(res)
-      {
+    if (res.code == 1) {
-        title: '市场部',
+      authList.value = res.data;
-        id: 10
+    } else {
+      layer.msg(res.msg, { icon: 2 })
     }
-    ]
+  })
-  }
+}
-])
+//左侧
-const showLine = ref(false)
+const data = ref([])
 const selectedKey = ref('')
 const selectedNode = ref({
   id: 0,
@@ -308,91 +223,49 @@ const selectedNode = ref({
 })
 const isFold = ref(false)
 const searchQuery = ref({
-  userAccount: '',
+  username: '',
-  userName: '',
+  mobile: '',
-  sex: ''
+  gender: 0
 })
+
 function toReset() {
   searchQuery.value = {
-    userAccount: '',
+    username: '',
-    userName: '',
+    mobile: '',
-    sex: ''
+    gender: 0
   }
 }
+
 function handleClick(node: any) {
   selectedNode.value = JSON.parse(JSON.stringify(node))
   page.current = selectedNode.value.id
   change(page)
 }
-function toAdd() {
-  visible22.value = true
-}
-function toEdit() {
-  model22.value = {
-    organization: '1',
-    name: '研发部',
-    fullName: 'xxxx公司-研发部',
-    code: '001',
-    type: '1',
-    sort: 1,
-    remark: '备注'
-  }
-  visible22.value = true
-}
-function toDelete() {
-  if (selectedKey.value == '') {
-    layer.msg('您未选择组织机构，请先选择要删除的组织机构', {
-      icon: 3,
-      time: 2000
-    })
-    return
-  }
-  layer.confirm(
-      '您将删除所选中的组织机构 [ ' + selectedNode.value.title + ' ] ？',
-      {
-        title: '提示',
-        btn: [
-          {
-            text: '确定',
-            callback: (id: any) => {
-              layer.msg('您已成功删除')
-              layer.close(id)
-            }
-          },
-          {
-            text: '取消',
-            callback: (id: any) => {
-              layer.msg('您已取消操作')
-              layer.close(id)
-            }
-          }
-        ]
-      }
-  )
-}
-
-function toSearch() {
-  page.current = 1
-  change(page)
-}
-
 const loading = ref(false)
 const selectedKeys = ref()
-const page = reactive({ current: 1, limit: 10, total: 100 })
+const page = reactive({current: 1, limit: 10, total: 100})
 const columns = ref([
-  { title: '选项', width: '55px', type: 'checkbox', fixed: 'left' },
+  {title: '选项', width: '55px', type: 'checkbox', fixed: 'left'},
-  { title: '编号', width: '80px', key: 'id', fixed: 'left', sort: 'id' },
+  {title: '编号', width: '80px', key: 'id', fixed: 'left', sort: 'id'},
-  { title: '用户账号', width: '80px', key: 'account', sort: 'account' },
+  {title: '用户名', width: '100px', key: 'username', sort: 'username'},
-  { title: '用户名', width: '80px', key: 'name', sort: 'name' },
+  {title: '昵称', width: '100px', key: 'nickname'},
-  { title: '性别', width: '80px', key: 'sex', sort: 'sex' },
+  {title: '手机号', width: '120px', key: 'mobile'},
-  { title: '角色', width: '120px', key: 'role', customSlot: 'role' },
+  {title: '邮箱', width: '150px', key: 'email'},
   {
-    title: '创建时间',
+    title: '性别', width: '80px', key: 'gender',
-    width: '120px',
+    customSlot: 'gender',
-    key: 'joinTime'
+    render: (row: any) => {
+      return row.gender === 1 ? '男' : row.gender === 2 ? '女' : '未知'
+    }
   },
-  { title: '状态', width: '120px', key: 'status', sort: 'status' },
+  {title: '身份证号', width: '180px', key: 'member_code'},
-
+  {
+    title: '创建时间', width: '160px', key: 'createtime',
+    render: (row: any) => {
+      return new Date(row.createtime * 1000).toLocaleString()
+    }
+  },
+  {title: '状态', width: '100px', key: 'status', customSlot: 'status'},
   {
     title: '操作',
     width: '150px',
@@ -411,109 +284,18 @@ const change = (page: any) => {
 const sortChange = (key: any, sort: number) => {
   layer.msg(`字段${key} - 排序${sort}, 你可以利用 sort-change 实现服务端排序`)
 }
-const dataSource = ref([
+const dataSource = ref([])
-  {
-    id: '1',
-    name: '管理员',
-    sex: '男',
-    role: '管理员',
-    account: 'admin',
-    joinTime: '2022-02-09 18:34:56',
-    status: true
-  },
-  {
-    id: '2',
-    name: '张三2',
-    sex: '男',
-    role: '普通用户',
-    account: '用户2',
-    joinTime: '2022-02-09 18:34:56',
-    status: true
-  },
-  {
-    id: '3',
-    name: '李四3',
-    sex: '男',
-    role: '普通用户',
-    account: '用户3',
-    joinTime: '2022-02-09 18:34:56',
-    status: true
-  },
-  {
-    id: '4',
-    name: '用户4',
-    sex: '男',
-    role: '普通用户',
-    account: '用户4',
-    joinTime: '2022-02-09 18:34:56',
-    status: true
-  },
-  {
-    id: '5',
-    name: '王五5',
-    sex: '男',
-    role: '普通用户',
-    account: '用户5',
-    joinTime: '2022-02-09 18:34:56',
-    status: true
-  },
-  {
-    id: '6',
-    name: '赵六6',
-    sex: '男',
-    role: '普通用户',
-    account: '用户6',
-    joinTime: '2022-02-09 18:34:56',
-    status: true
-  },
-  {
-    id: '7',
-    name: '黄齐7',
-    sex: '男',
-    role: '普通用户',
-    account: '用户7',
-    joinTime: '2022-02-09 18:34:56',
-    status: true
-  },
-  {
-    id: '8',
-    name: '用户8',
-    sex: '男',
-    role: '普通用户',
-    account: '用户8',
-    joinTime: '2022-02-09 18:34:56',
-    status: true
-  },
-  {
-    id: '9',
-    name: '游客9',
-    sex: '男',
-    role: '游客',
-    account: '游客9',
-    joinTime: '用户22-02-09 18:34:56',
-    status: true
-  },
-  {
-    id: '10',
-    name: '用户10',
-    sex: '女',
-    role: '普通用户',
-    account: 'user10',
-    joinTime: '2022-02-09 18:34:56 18:34:56',
-    status: true
-  }
-])
 const changeStatus = (isChecked: boolean, row: any) => {
   dataSource.value.forEach((item) => {
     if (item.id === row.id) {
-      layer.msg('Success', { icon: 1 }, () => {
+      layer.msg('Success', {icon: 1}, () => {
         item.status = isChecked
       })
     }
   })
 }
 const remove = () => {
-  layer.msg(selectedKeys.value, { area: '50%' })
+  layer.msg(selectedKeys.value, {area: '50%'})
 }
 const loadDataSource = (page: number, pageSize: number) => {
   var response = []
@@ -532,31 +314,26 @@ const loadDataSource = (page: number, pageSize: number) => {
   }
   return response
 }
-const model11 = ref({
+const model11 = reactive({
-  name: '',
+  username: '',
-  role: '',
+  nickname: '',
-  sex: '',
+  mobile: '',
-  status: '',
+  email: '',
-  account: ''
+  member_code: '',
+  work_number: '',
+  gender: 0,
+  password: '',
+  status: 1,
+  auth_group_id: '',
+  group_id: '',
+  party_id: '',
+  avatar: ''
 })
 const layFormRef11 = ref()
-const visible11 = ref(false)
+const addShow = ref(false)
 const title = ref('新增')
-const changeVisible11 = (text: any, row: any) => {
+const changeAddShow = () => {
-  title.value = text
+  addShow.value = true;
-  if (row != null) {
-    let info = JSON.parse(JSON.stringify(row))
-    model11.value = info
-  } else {
-    model11.value = {
-      name: '',
-      role: '',
-      sex: '',
-      status: '',
-      account: ''
-    }
-  }
-  visible11.value = !visible11.value
 }
 const submit11 = function () {
   layFormRef11.value.validate((isValidate: any, model: any, errors: any) => {
@@ -588,9 +365,10 @@ const clearValidate11 = function () {
 const reset11 = function () {
   layFormRef11.value.reset()
 }
+
 function toRemove() {
   if (selectedKeys.value.length == 0) {
-    layer.msg('您未选择数据，请先选择要删除的数据', { icon: 3, time: 2000 })
+    layer.msg('您未选择数据，请先选择要删除的数据', {icon: 3, time: 2000})
     return
   }
   layer.confirm('您将删除所有选中的数据？', {
@@ -613,18 +391,22 @@ function toRemove() {
     ]
   })
 }
+
 function toSubmit() {
-  layer.msg('保存成功！', { icon: 1, time: 1000 })
+  layer.msg('保存成功！', {icon: 1, time: 1000})
   visible11.value = false
   visible22.value = false
 }
+
 function toCancel() {
   visible11.value = false
   visible22.value = false
 }
+
 function confirm() {
   layer.msg('您已成功删除')
 }
+
 function cancel() {
   layer.msg('您已取消操作')
 }
@@ -638,9 +420,39 @@ const model22 = ref({
   sort: 0,
   remark: ''
 })
-const layFormRef22 = ref()
 const visible22 = ref(false)
-const title22 = ref('新建')
+const addButton = ref([
+  {
+    text: "确认",
+    callback: async () => {
+      console.log(model11);
+      // if (addData.title == '') {
+      //   layer.msg('菜单名称不能为空！', { icon: 2 })
+      //   return;
+      // }
+      // if (addIsEdit.value == 1) {
+      //   addData.name=addData.title;
+      //   var res = await menuDataAdd(addData);
+      // } else {
+      //   var res = await menuDataEdit(addData);
+      // }
+      // console.log(res)
+      // if (res.code == 1) {
+      //   layer.msg('提交成功！', { icon: 1 })
+      //   addShow.value = false;
+      //   getHierarchicalData();
+      // } else {
+      //   layer.msg(res.msg, { icon: 2 })
+      // }
+    }
+  },
+  {
+    text: "取消",
+    callback: () => {
+      //addShow.value = false;
+    }
+  }
+])
 </script>
 
 <style scoped>
@@ -652,6 +464,7 @@ const title22 = ref('新建')
   background-color: #fff;
   overflow: hidden;
 }
+
 .left-tree {
   display: inline-block;
   padding: 20px 15px 0 5px;
@@ -660,6 +473,7 @@ const title22 = ref('新建')
   box-sizing: border-box;
   position: relative;
 }
+
 /* todo layui-tree-entry 设置无效 */
 .layui-tree-entry {
   position: relative;
@@ -668,6 +482,7 @@ const title22 = ref('新建')
   line-height: 20px;
   white-space: nowrap;
 }
+
 .isFold {
   position: absolute;
   top: 36%;
@@ -680,6 +495,7 @@ const title22 = ref('新建')
   border: 1px solid #e6e6e6;
   cursor: pointer;
 }
+
 .search-input {
   display: inline-block;
   width: 98%;
@@ -692,4 +508,3 @@ const title22 = ref('新建')
   color: red;
 }
 </style>
-

src/views/system/menu.vue

@@ -67,6 +67,7 @@ const addData = reactive({
   title: '',
   icon: '',
   url: '',
+  name:'',
   status: 1,
   pid: 0,
 })
@@ -144,6 +145,8 @@ const editShowMsd = (data) => {
   addShow.value = true;
   addData.id = data.id;
   addData.title = data.title;
+  addData.pid = data.pid;
+  addData.name = data.title;
   addData.icon = data.icon;
   addData.url = data.url;
   addData.status = parseInt(data.status);
@@ -171,6 +174,7 @@ const addButton = ref([
         return;
       }
       if (addIsEdit.value == 1) {
+        addData.name=addData.title;
         var res = await menuDataAdd(addData);
       } else {
         var res = await menuDataEdit(addData);

src/views/system/permission.vue

@@ -28,7 +28,7 @@
         <lay-card>
           <div style="padding: 10px">
             <span style="font-size: 18px;vertical-align: center;margin-right: 20px">角色列表</span>
-            <lay-button type="primary" @click="visible11=true" size="sm">新增角色</lay-button>
+            <lay-button type="primary" @click="openAdd" size="sm">新增角色</lay-button>
           </div>
           <lay-table
               :page="page"
@@ -47,32 +47,37 @@
             <template v-slot:password="{ data }">
               {{ data.password }}
             </template>
-            <template v-slot:operator="{}">
+            <template v-slot:operator="{ data }">
-              <lay-button-group>
+              <lay-space>
-                <lay-button type="normal" size="sm">编辑</lay-button>
+                <span v-if="data.id!=1" style="color: #00A394;cursor: pointer" @click="editDo(data)">编辑</span>
-                <lay-button type="danger" size="sm">删除</lay-button>
+                <lay-popconfirm trigger="click" content="确定要删除吗？" @confirm="delShowMsd(data)">
-              </lay-button-group>
+                  <span v-if="data.id!=1" style="color: #00A394;cursor: pointer">删除</span>
+                </lay-popconfirm>
+                <span v-if="data.id==1">-</span>
+              </lay-space>
             </template>
           </lay-table>
         </lay-card>
       </lay-col>
     </lay-row>
   </lay-container>
-  <lay-layer v-model="visible11" title="新增角色" :type="4" :shade="true" :area="['700px','100%']" :btn="action11">
+  <lay-layer v-model="visible11" :title="addIsEdit == 1 ? '新增角色' : '编辑角色'" :type="4" :shade="true"
+             :area="['700px','100%']" :btn="action11">
     <lay-container fluid="true" style="padding: 20px">
-      <lay-form  label-position="left" :model="model">
+      <lay-form label-position="left" :model="addData">
         <lay-form-item label="角色名称" prop="username">
-          <lay-input v-model="model.username" placeholder="请输入角色名称"></lay-input>
+          <lay-input v-model="addData.name" placeholder="请输入角色名称"></lay-input>
         </lay-form-item>
         <lay-form-item label="角色描述" prop="desc">
-          <lay-textarea placeholder="请输入角色描述" v-model="model.describe"></lay-textarea>
+          <lay-textarea placeholder="请输入角色描述" v-model="addData.describe"></lay-textarea>
         </lay-form-item>
         <lay-form-item label="角色权限" prop="desc">
           <lay-tree
+              :default-expand-all="true"
               :tail-node-icon="false"
               :data="data9"
               :showCheckbox="showCheckbox2"
-              v-model:checkedKeys="checkedKeys2"
+              v-model:checkedKeys="addData.rules"
               :replaceFields="replaceFields">
           </lay-tree>
         </lay-form-item>
@@ -82,68 +87,119 @@
 </template>
 
 <script setup lang="ts">
-import {ref, watch} from 'vue'
+import {onMounted, reactive, ref, watch} from 'vue'
 import {layer} from '@layui/layer-vue'
-const model = ref({
+import {
-  username: '',
+  menuData,
-  password: '',
+  authGroupData,
-  describe: ''
+  authGroupDataAdd,
+  authGroupDataEdit,
+  authGroupDataDel,
+} from "@/api/module/home";
+
+const addData = reactive({
+  name: '',
+  describe: '',
+  rules: []
 })
+const addIsEdit = ref(1)
+onMounted(() => {
+  getList();
+  getHierarchicalData()
+})
+const openAdd = () => {
+  visible11.value = true;
+  addData.id = 0;
+  addData.name = '';
+  addData.describe = '';
+  addData.rules = [];
+}
+const editDo = (data) => {
+  console.log(data);
+  visible11.value = true;
+  addData.name = data.name;
+  addData.describe = data.describe;
+  addData.rules = data.rules;
+  addIsEdit.value = 2;
+}
+const getList = () => {
+  authGroupData({}).then((res) => {
+    console.log(res)
+    if (res.code == 1) {
+      dataSource.value = res.data;
+    } else {
+      layer.msg(res.msg, {icon: 2})
+    }
+  })
+}
+const delShowMsd = async (data) => {
+  var res = await authGroupDataDel({id: data.id});
+  console.log(res)
+  if (res.code == 1) {
+    layer.msg('删除成功！', {icon: 1})
+    getList();
+  } else {
+    layer.msg(res.msg, {icon: 2})
+  }
+}
+const getHierarchicalData = () => {
+  menuData({}).then((res) => {
+    console.log(res)
+    if (res.code == 1) {
+      data9.value = res.data;
+    } else {
+      layer.msg(res.msg, {icon: 2})
+    }
+  })
+}
 const action11 = ref([
   {
     text: "确认",
-    callback: () => {
+    callback: async () => {
-      layer.confirm("确认操作", { shade: false });
+      console.log(addData);
+      if (addData.name == '') {
+        layer.msg('角色名称不能为空！', {icon: 2})
+        return;
+      }
+      if (addData.describe == '') {
+        layer.msg('角色描述不能为空！', {icon: 2})
+        return;
+      }
+      if (addData.describe.length == 0 || addData.describe == '') {
+        layer.msg('请选择菜单！', {icon: 2})
+        return;
+      }
+      addData.rules = addData.rules.join(',');
+      if (addIsEdit.value == 1) {
+        var res = await authGroupDataAdd(addData);
+      } else {
+        var res = await authGroupDataEdit(addData);
+      }
+      if (res.code == 1) {
+        layer.msg('提交成功！', {icon: 1})
+        visible11.value = false;
+        getList();
+      } else {
+        layer.msg(res.msg, {icon: 2})
+      }
     }
   },
   {
     text: "取消",
     callback: () => {
-      layer.confirm("取消操作", { shade: false });
+      visible11.value = false;
     }
   }
 ])
-const checkedKeys2 = ref([]);
 const showCheckbox2 = ref(true);
 const replaceFields = ref({
-  id: 'key',
+  id: 'id',
-  title: 'name',
+  title: 'title',
-  children: 'child'
+  children: 'children'
 })
 
-const data9 = ref([{
+const data9 = ref([]);
-  name: '一级1',
-  key: 1,
-  child: [
-    {
-      name: '一级1-1',
-      key: 11,
-    },
-    {
-      name: '一级1-2',
-      key: 12,
-    }
-  ]
-},
-  {
-    name: '一级2',
-    key: 2,
-    child: [
-      {
-        name: '一级2-1',
-        key: 21,
-      },
-      {
-        name: '一级2-2',
-        key: 22,
-      }
-    ]
-  }]);
-const active = ref(1)
 const visible11 = ref(false)
-const selectedKeys = ref(['1'])
-const checkbox = ref(true)
-const defaultToolbar = ref(true)
 const page = ref({total: 1, limit: 10, current: 1})
 
 const columns = [
@@ -158,15 +214,12 @@ const columns = [
     title: '角色名称',
     width: '100px',
     align: 'center',
-    customSlot: 'username',
+    key: 'name'
-    key: 'username'
   },
   {
     title: '角色描述',
     width: '150px',
-    customSlot: 'password',
+    key: 'describe'
-    align: 'center',
-    key: 'password'
   },
   {
     title: '操作',
@@ -178,32 +231,7 @@ const columns = [
   }
 ]
 
-const dataSource = [
+const dataSource = ref([]);
-  {
-    id: '1',
-    username: 'shana',
-    password: '夏娜',
-    remark: '1',
-    age: '2024-01'
-  },
-  {
-    id: '2',
-    username: 'shana',
-    password: '夏娜',
-    remark: '2',
-    age: '2024-01'
-  }
-]
-
-const rowClick = function (data: any) {
-}
-
-const rowDoubleClick = function (data: any) {
-}
-
-const change = function ({current, limit}: any) {
-  layer.msg('current:' + current + ' limit:' + limit)
-}
 
 function toSearch() {
   layer.load(2, {time: 3000})