feat: 角色管理

src/views/serv/SubClassEdit.vue

@@ -45,7 +45,7 @@
         </a-col>
         <a-col :span="23">
           <a-form-item label="服务详情">
-            <RichText ref="RichText" :height="700" />
+            <RichText ref="RichText" :height="900" />
           </a-form-item>
         </a-col>
       </a-row>

src/views/system/role/SysRoleDetail.vue

@@ -3,40 +3,58 @@
     <a-form @submit="handleSubmit" :form="form" class="cust-detail-form">
       <header-tool-bar>
         <span class="cust-title" slot="title">
-          <a-icon type="hdd"/>角色管理明细
+          <a-icon type="hdd" />角色管理明细
         </span>
         <a-button-group slot="extra">
-          <a-button type='primary' htmlType='submit'>保存</a-button>
+          <a-button type="primary" htmlType="submit">保存</a-button>
           <a-button type="primary" @click="back" ghost>返回</a-button>
         </a-button-group>
       </header-tool-bar>
       <a-card title="基础数据" class="cust-normal-card">
         <a-row>
           <a-col :span="6">
-            <a-form-item
-              v-bind="formItemLayout"
-              label='编号'>
+            <a-form-item v-bind="formItemLayout" label="编号">
               <a-input
-                v-decorator="['sysRole.code', {initialValue:sysRole.code, rules: [{ required: true, message: '请输入编号' }]}]"/>
+                v-decorator="[
+                  'sysRole.code',
+                  {
+                    initialValue: sysRole.code,
+                    rules: [{ required: true, message: '请输入编号' }]
+                  }
+                ]"
+              />
             </a-form-item>
           </a-col>
           <a-col :span="6">
-            <a-form-item
-              v-bind="formItemLayout"
-              label='名称'>
+            <a-form-item v-bind="formItemLayout" label="名称">
               <a-input
-                v-decorator="['sysRole.name', {initialValue:sysRole.name,rules: [{ required: true, message: '请输入名称' }]}]"/>
+                v-decorator="[
+                  'sysRole.name',
+                  {
+                    initialValue: sysRole.name,
+                    rules: [{ required: true, message: '请输入名称' }]
+                  }
+                ]"
+              />
             </a-form-item>
           </a-col>
           <a-col :span="6">
-            <a-form-item
-              v-bind="formItemLayout"
-              label='状态'>
+            <a-form-item v-bind="formItemLayout" label="状态">
               <a-select
-                :disabled="this.id==1"
-                v-decorator="['sysRole.available', {initialValue:sysRole.available,rules: [{ required: true, message: '请选择状态' }]}]"
+                :disabled="this.id == 1"
+                v-decorator="[
+                  'sysRole.available',
+                  {
+                    initialValue: sysRole.available,
+                    rules: [{ required: true, message: '请选择状态' }]
+                  }
+                ]"
               >
-                <a-select-option v-for="item in typeList" :key="item.id" :value="item.valueInt">{{item.name}}
+                <a-select-option
+                  v-for="item in typeList"
+                  :key="item.id"
+                  :value="item.valueInt"
+                  >{{ item.name }}
                 </a-select-option>
               </a-select>
             </a-form-item>
@@ -44,12 +62,17 @@
         </a-row>
         <a-row>
           <a-col :span="24">
-            <a-form-item
-              v-bind="formmarkItemLayout"
-              label='备注'>
+            <a-form-item v-bind="formmarkItemLayout" label="备注">
               <a-textarea
                 :autoSize="{ minRows: 2, maxRows: 6 }"
-                v-decorator="['sysRole.remark', {initialValue:sysRole.remark,rules: [{ required: true, message: '请输入备注' }]}]"/>
+                v-decorator="[
+                  'sysRole.remark',
+                  {
+                    initialValue: sysRole.remark,
+                    rules: [{ required: true, message: '请输入备注' }]
+                  }
+                ]"
+              />
             </a-form-item>
           </a-col>
         </a-row>
@@ -63,11 +86,23 @@
           :pagination="false"
           :defaultExpandAllRows="true"
           class="cust-card-table"
-          :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: updateSelect,onSelect:rowSelect,onSelectAll:rowSelectAll}"
+          :scroll="{ y: $store.getters.size[1] - 450 }"
+          :rowSelection="{
+            selectedRowKeys: selectedRowKeys,
+            onChange: updateSelect,
+            onSelect: rowSelect,
+            onSelectAll: rowSelectAll
+          }"
           bordered
         >
           <span slot="action" slot-scope="text, record">
-              <a-checkbox v-for="item in record.sysBusinessOperateList" :key="item.id" :checked="item.selected" @change="onChange(item,record)">{{item.name}}</a-checkbox>
+            <a-checkbox
+              v-for="item in record.sysBusinessOperateList"
+              :key="item.id"
+              :checked="item.selected"
+              @change="onChange(item, record)"
+              >{{ item.name }}</a-checkbox
+            >
           </span>
         </a-table>
       </a-card>
@@ -76,18 +111,23 @@
 </template>
 
 <script>
-  import HeaderToolBar from '@/components/page/HeaderToolBar'
-  import {getDetail, save} from '@/api/system/sysRole'
+import HeaderToolBar from '@/components/page/HeaderToolBar'
+import { getDetail, save } from '@/api/system/sysRole'
 
-  let listPathName = 'sysrolelist';
-  const columns = [
-    {title: '业务名称', width: 300, dataIndex: 'name'},
-    {title: '操作', key: 'operation', dataIndex: 'sysBusinessOperateList', scopedSlots: {customRender: 'action'}}
-  ]
+let listPathName = 'sysRoleList'
+const columns = [
+  { title: '业务名称', width: 300, dataIndex: 'name' },
+  {
+    title: '操作',
+    key: 'operation',
+    dataIndex: 'sysBusinessOperateList',
+    scopedSlots: { customRender: 'action' }
+  }
+]
 
-  export default {
-    name: "SysRoleDetail",
-    components: {HeaderToolBar},
+export default {
+  name: 'SysRoleDetail',
+  components: { HeaderToolBar },
   data() {
     return {
       id: 0,
@@ -102,19 +142,19 @@
       selectedRowKeys: [],
       formItemLayout: {
         labelCol: {
-            sm: {span: 8},
+          sm: { span: 8 }
         },
         wrapperCol: {
-            sm: {span: 16},
-          },
+          sm: { span: 16 }
+        }
       },
       formmarkItemLayout: {
         labelCol: {
-            sm: {span: 2},
+          sm: { span: 2 }
         },
         wrapperCol: {
-            sm: {span: 22},
-          },
+          sm: { span: 22 }
+        }
       }
     }
   },
@@ -130,19 +170,24 @@
     onChange(item, record) {
       item.selected = !item.selected
       if (item.selected == true) {
-          if (record.sysBusinessOperateList.filter(opt => opt.selected != true).length == 0) {
+        if (
+          record.sysBusinessOperateList.filter((opt) => opt.selected != true)
+            .length == 0
+        ) {
           this.selectedRowKeys.push(item.businessId)
         }
       } else {
-          this.selectedRowKeys = this.selectedRowKeys.filter(key => key != record.id)
+        this.selectedRowKeys = this.selectedRowKeys.filter(
+          (key) => key != record.id
+        )
       }
     },
     initData() {
       this.id = this.$route.query.id || 0
-        getDetail(this.id).then(resp => {
+      getDetail(this.id).then((resp) => {
         if (resp && resp.code == SYS_CONST.REQUEST.SUCCEED) {
           this.sysRole = resp.data.sysRole
-            this.sysRole.available = this.sysRole.available?1:0
+          this.sysRole.available = this.sysRole.available ? 1 : 0
           this.itemList = []
           if (resp.data.sysBusinessTreeList) {
             this.itemList = resp.data.sysBusinessTreeList[0].children
@@ -154,37 +199,45 @@
         }
       })
     },
-      checkChildren(list){
-        list.map(m=>{
-          if (m.children.length==0)   {
+    checkChildren(list) {
+      list.map((m) => {
+        if (m.children.length == 0) {
           m.children = null
-          }else {
+        } else {
           this.checkChildren(m.children)
         }
       })
     },
     checkSelectRow(businessList) {
-        let count = 0;
-        businessList.map(m => {
-          if (m.children == null && m.sysBusinessOperateList.filter(opt => opt.selected != true).length == 0) {
+      let count = 0
+      businessList.map((m) => {
+        if (
+          m.children == null &&
+          m.sysBusinessOperateList.filter((opt) => opt.selected != true)
+            .length == 0
+        ) {
           this.selectedRowKeys.push(m.id)
-            count++;
+          count++
         }
         if (m.children != null) {
-            let checkedCount = this.checkSelectRow(m.children);
-            if (checkedCount === m.children.length){
-              this.selectedRowKeys.push(m.id);
-              count++;
+          let checkedCount = this.checkSelectRow(m.children)
+          if (checkedCount === m.children.length) {
+            this.selectedRowKeys.push(m.id)
+            count++
           }
         }
       })
-        return count;
+      return count
     },
     handleSubmit(e) {
-        e.preventDefault();
-        this.getSelectedOperate();
+      e.preventDefault()
+      this.getSelectedOperate()
       if (this.saveOperatedList.length == 0) {
-          this.$notification.error({message: '系统提示', description: "请至少勾选一个业务操作", duration: 4,});
+        this.$notification.error({
+          message: '系统提示',
+          description: '请至少勾选一个业务操作',
+          duration: 4
+        })
         return
       }
       this.form.validateFieldsAndScroll((err, values) => {
@@ -193,13 +246,19 @@
             sysRole: this.$valueCopy(this.sysRole, values.sysRole),
             saveOperatedList: this.saveOperatedList
           }
-            save(saveData).then(resp => {
+          save(saveData).then((resp) => {
             if (resp && resp.code == SYS_CONST.REQUEST.SUCCEED) {
-                this.$notification.success({message: '系统提示', description: "保存成功", duration: 4,});
-                this.$router.push({name: listPathName, query: {isModify: this.id != 0}})
+              this.$notification.success({
+                message: '系统提示',
+                description: '保存成功',
+                duration: 4
+              })
+              this.$router.push({
+                name: listPathName,
+                query: { isModify: this.id != 0 }
+              })
             }
           })
-
         }
       })
     },
@@ -207,10 +266,10 @@
       this.selectedRowKeys = selectedRowKeys
     },
     rowSelect(record, selected) {
-        let curList = this.getCurList(record.id, this.itemList);
-        curList.map(m => {
+      let curList = this.getCurList(record.id, this.itemList)
+      curList.map((m) => {
         if (m.id == record.id) {
-            m.sysBusinessOperateList.map(o => {
+          m.sysBusinessOperateList.map((o) => {
             o.selected = selected
           })
           if (m.children != null) {
@@ -229,19 +288,19 @@
           curList = this.getCurList(curId, item.children)
         }
         if (curList.length > 0) {
-            break;
+          break
         }
       }
-        return curList;
+      return curList
     },
     selectOperateByBusiness(businessList, selected) {
-        businessList.map(m => {
+      businessList.map((m) => {
         if (selected) {
           this.selectedRowKeys.push(m.id)
         } else {
-            this.selectedRowKeys = this.selectedRowKeys.filter(s => s != m.id)
+          this.selectedRowKeys = this.selectedRowKeys.filter((s) => s != m.id)
         }
-          m.sysBusinessOperateList.map(o => {
+        m.sysBusinessOperateList.map((o) => {
           o.selected = selected
         })
         if (m.children != null) {
@@ -253,7 +312,7 @@
       this.selectOperateByBusiness(this.itemList, selected)
     },
     back() {
-        this.$router.push({name: listPathName})
+      this.$router.push({ name: listPathName })
     },
     modifyItem(type, item) {
       if (type == SYS_CONST.OPT_TYPE.ADD) {
@@ -267,10 +326,10 @@
       this.getSaveOperateByList(this.itemList)
     },
     getSaveOperateByList(businessList) {
-        businessList.map(m => {
-          m.sysBusinessOperateList.map(o => {
+      businessList.map((m) => {
+        m.sysBusinessOperateList.map((o) => {
           if (o.selected == true) {
-              this.saveOperatedList.push(o.id);
+            this.saveOperatedList.push(o.id)
           }
         })
         if (m.children != null) {
@@ -279,6 +338,6 @@
       })
     }
   }
-  };
+}
 </script>
 

src/views/system/role/SysRoleList.vue

@@ -75,7 +75,6 @@
         </span>
         <span slot="tags" slot-scope="text, record">
             <a-switch
-              :disabled="record.id==1"
               checkedChildren="启用"
               unCheckedChildren="禁用"
               @click="setStatus(record)"