角色管理

src/routers/modules/base.js

@@ -398,7 +398,7 @@ var routers = [
                 component: () => import('@/views/base/personRoleInfo-list.vue'),
                 meta: {
                         roles: ["admin"],
-                        title: '角色管理'
+                        title: '用户角色管理'
                 }
         },
 ]

src/views/base/personRoleInfo-detail.vue

@@ -11,21 +11,15 @@
     :modal-append-to-body="false"
     style="text-align: left"
     @close="closeDialog"
+    :close-on-click-modal="false"
   >
     <div class="user-panel" v-loading="loading">
       <el-form
         ref="form"
         :model="formModel"
         :rules="ruleValidate"
-        :label-width="'100px'"
+        :label-width="'20%'"
       >
-        <el-form-item label="" prop="id">
-          <el-input
-            v-model="formModel.id"
-            placeholder="请输入"
-            style="width: 300px"
-          ></el-input>
-        </el-form-item>
         <el-form-item label="用户角色名称" prop="personRoleName">
           <el-input
             v-model="formModel.personRoleName"
@@ -34,18 +28,26 @@
           ></el-input>
         </el-form-item>
         <el-form-item label="适用于与场景id" prop="sceneId">
-          <el-input
+          <el-select
             v-model="formModel.sceneId"
-            placeholder="请输入适用于与场景id"
-            style="width: 300px"
-          ></el-input>
+            filterable
+            placeholder="请选择"
+            style="width: 200px"
+          >
+            <el-option
+              v-for="result in sceneData"
+              :key="result.id"
+              :label="result.sceneName"
+              :value="result.id"
+            ></el-option>
+          </el-select>
         </el-form-item>
         <el-form-item label="是否启用" prop="useEnable">
-          <el-input
+          <el-switch
             v-model="formModel.useEnable"
-            placeholder="请输入是否启用"
-            style="width: 300px"
-          ></el-input>
+            active-color="#13ce66"
+            inactive-color="#ff4949"
+          ></el-switch>
         </el-form-item>
         <el-form-item label="备注" prop="remark">
           <el-input
@@ -54,41 +56,6 @@
             style="width: 300px"
           ></el-input>
         </el-form-item>
-        <el-form-item label="创建人" prop="createBy">
-          <el-input
-            v-model="formModel.createBy"
-            placeholder="请输入创建人"
-            style="width: 300px"
-          ></el-input>
-        </el-form-item>
-        <el-form-item label="创建时间" prop="createTime">
-          <el-input
-            v-model="formModel.createTime"
-            placeholder="请输入创建时间"
-            style="width: 300px"
-          ></el-input>
-        </el-form-item>
-        <el-form-item label="更新人" prop="updateBy">
-          <el-input
-            v-model="formModel.updateBy"
-            placeholder="请输入更新人"
-            style="width: 300px"
-          ></el-input>
-        </el-form-item>
-        <el-form-item label="更新时间" prop="updateTime">
-          <el-input
-            v-model="formModel.updateTime"
-            placeholder="请输入更新时间"
-            style="width: 300px"
-          ></el-input>
-        </el-form-item>
-        <el-form-item label="是否删除" prop="delFlag">
-          <el-input
-            v-model="formModel.delFlag"
-            placeholder="请输入是否删除"
-            style="width: 300px"
-          ></el-input>
-        </el-form-item>
       </el-form>
     </div>
     <span slot="footer" class="dialog-footer">
@@ -104,9 +71,10 @@ import Constant from "@/constant";
 import personRoleInfoApi from "@/api/base/personRoleInfo";
 
 export default {
-  props: ["businessKey", "title"],
+  props: ["businessKey", "title", "sceneData"],
   data() {
     return {
+      formModel: {},
       ruleValidate: {
         id: [{ required: true, message: "不能为空", trigger: "blur" }],
         personRoleName: [
@@ -119,25 +87,6 @@ export default {
             trigger: "blur",
           },
         ],
-        useEnable: [
-          { required: true, message: "是否启用不能为空", trigger: "blur" },
-        ],
-        remark: [{ required: true, message: "备注不能为空", trigger: "blur" }],
-        createBy: [
-          { required: true, message: "创建人不能为空", trigger: "blur" },
-        ],
-        createTime: [
-          { required: true, message: "创建时间不能为空", trigger: "blur" },
-        ],
-        updateBy: [
-          { required: true, message: "更新人不能为空", trigger: "blur" },
-        ],
-        updateTime: [
-          { required: true, message: "更新时间不能为空", trigger: "blur" },
-        ],
-        delFlag: [
-          { required: true, message: "是否删除不能为空", trigger: "blur" },
-        ],
       },
       showDialog: true,
       loading: false,
@@ -188,6 +137,10 @@ export default {
     var self = this;
 
     (function () {
+      if (self.formModel.useEnable == null) {
+        self.formModel.useEnable = 0;
+      }
+
       if (self.businessKey.length == 0) {
         return personRoleInfoApi.create();
       } else {

src/views/base/personRoleInfo-list.vue

@@ -6,7 +6,7 @@
         <a href="#">系统管理</a>
       </el-breadcrumb-item>
       <el-breadcrumb-item>
-        <a href="/personRoleInfo">角色管理</a>
+        <a href="/personRoleInfo">用户角色管理</a>
       </el-breadcrumb-item>
     </el-breadcrumb>
     <el-divider></el-divider>
@@ -19,26 +19,34 @@
       inline
       class="demo-form-inline"
     >
-      <el-form-item label="用户角色名称" prop="personRoleName">
-        <el-input
-          type="text"
-          size="mini"
-          v-model="queryModel.personRoleName"
-        ></el-input>
-      </el-form-item>
-      <el-form-item label="适用于与场景id" prop="sceneId">
-        <el-input
-          type="text"
-          size="mini"
+      <el-form-item label="适用场景" prop="sceneId">
+        <el-select
           v-model="queryModel.sceneId"
-        ></el-input>
+          filterable
+          placeholder="请选择"
+          style="width: 110px"
+          size="mini"
+        >
+          <el-option
+            v-for="result in sceneData"
+            :key="result.id"
+            :label="result.sceneName"
+            :value="result.id"
+          ></el-option>
+        </el-select>
       </el-form-item>
       <el-form-item label="是否启用" prop="useEnable">
-        <el-input
-          type="text"
-          size="mini"
+        <el-select
           v-model="queryModel.useEnable"
-        ></el-input>
+          filterable
+          placeholder="请选择"
+          style="width: 80px"
+          size="mini"
+        >
+          <el-option label="全部" value=""></el-option>
+          <el-option label="是" value="1"></el-option>
+          <el-option label="否" value="0"></el-option>
+        </el-select>
       </el-form-item>
       <el-form-item>
         <el-button
@@ -131,6 +139,7 @@
       v-if="showModal"
       :businessKey="businessKey"
       :title="modalTitle"
+      :sceneData="sceneData"
       @close="onDetailModalClose"
     ></personRoleInfo-detail>
   </div>
@@ -139,6 +148,7 @@
 import Constant from "@/constant";
 import PersonRoleInfoDetail from "./personRoleInfo-detail";
 import personRoleInfoApi from "@/api/base/personRoleInfo";
+import sceneInfoApi from "@/api/base/sceneInfo";
 import NProgress from "nprogress"; // progress bar
 import "nprogress/nprogress.css"; // progress bar style
 
@@ -148,16 +158,8 @@ export default {
 
     return {
       queryModel: {
-        id: "",
-        personRoleName: "",
         sceneId: "",
         useEnable: "",
-        remark: "",
-        createBy: "",
-        createTime: "",
-        updateBy: "",
-        updateTime: "",
-        delFlag: "",
       },
       loading: false,
       tableData: [],
@@ -172,8 +174,15 @@ export default {
       showModal: false,
       modalTitle: "",
       businessKey: "",
+      sceneData: [],
     };
   },
+  created() {
+    sceneInfoApi.list().then((response) => {
+      var jsonData = response.data;
+      this.sceneData = jsonData.data;
+    });
+  },
   methods: {
     changePage(pageIndex) {
       var self = this;
@@ -186,16 +195,8 @@ export default {
       formData.append("pageIndex", self.pageIndex);
       formData.append("pageSize", self.pageSize);
 
-      formData.append("id", self.queryModel.id);
-      formData.append("personRoleName", self.queryModel.personRoleName);
       formData.append("sceneId", self.queryModel.sceneId);
       formData.append("useEnable", self.queryModel.useEnable);
-      formData.append("remark", self.queryModel.remark);
-      formData.append("createBy", self.queryModel.createBy);
-      formData.append("createTime", self.queryModel.createTime);
-      formData.append("updateBy", self.queryModel.updateBy);
-      formData.append("updateTime", self.queryModel.updateTime);
-      formData.append("delFlag", self.queryModel.delFlag);
 
       if (this.field != null) {
         formData.append("field", this.field);
@@ -244,11 +245,13 @@ export default {
       this.modalTitle = "新增";
       this.businessKey = "";
       this.showModal = true;
+      this.sceneData = this.sceneData;
     },
     handleEdit(record) {
       this.modalTitle = "编辑";
       this.businessKey = record.id;
       this.showModal = true;
+      this.sceneData = this.sceneData;
     },
     handleDelete(record) {
       var self = this;