Merge branch 'master' of http://120.26.64.82:3000/BFFE/SZYGM1.0

src/styles/index.scss

@@ -1,8 +1,8 @@
-@import "./variables.scss";
-@import "./transition.scss";
-@import "./scss-suger.scss";
-@import "./reset-style.scss";
-@import "./elemenet-style-overflow.scss";
+@import './variables.scss';
+@import './transition.scss';
+@import './scss-suger.scss';
+@import './reset-style.scss';
+@import './elemenet-style-overflow.scss';
 
 //scroll
 @mixin main-show-wh() {
@@ -85,7 +85,7 @@
       background: #eb2f3b;
       border-radius: 50%;
       margin-right: 15px;
-      background: url("@/assets/status/ic_close_hint.png") no-repeat;
+      background: url('@/assets/status/ic_close_hint.png') no-repeat;
       background-size: 100% 100%;
       display: inline-block;
       position: relative;
@@ -123,13 +123,11 @@
 .flex {
   display: flex;
   justify-content: space-between;
-  align-items: center;
 }
 
 .flex-end {
   display: flex;
   justify-content: flex-end;
-  align-items: center;
 }
 .br {
   border: 1px solid #d2d6df;

src/theme/index.scss

@@ -31,6 +31,10 @@
 .el-radio__input.is-checked + .el-radio__label {
   color: #ac014d;
 }
+.el-form-item__label {
+  color: #303133;
+  font-weight: 400;
+}
 .manageTitle {
   position: relative;
   padding-left: 12px;
@@ -66,6 +70,9 @@
   border-radius: 4px;
   padding: 30px 24px;
 }
+.t30 {
+  margin-top: 30px;
+}
 .el-button.is-plain {
   color: #ac014d;
   &:hover,

src/views/userManagement/role/auth.vue

@@ -1,9 +1,92 @@
 <template>
-  <div class="auth scroll-y">到底</div>
+  <div class="auth scroll-y">
+    <div class="flex auth-content">
+      <div class="box role-info auth-list">
+        <div class="manageTitle">角色信息</div>
+        <div class="role-info-content t30">
+          <el-form ref="ruleFormRef" :model="ruleForm" class="demo-ruleForm">
+            <el-form-item label="角色名称" prop="roleName">
+              <el-input disabled v-model="ruleForm.roleName" size="default" placeholder="请输入角色名称" />
+            </el-form-item>
+            <el-form-item label="角色描述" prop="roleDesc">
+              <el-input disabled v-model="ruleForm.roleDesc" size="default" type="textarea" :rows="3" placeholder="请输入角色描述" />
+            </el-form-item>
+            <el-form-item label="是否启用" prop="roleStatus">
+              <el-radio-group disabled v-model="ruleForm.roleStatus">
+                <el-radio label="1">启用</el-radio>
+                <el-radio label="2"> 禁用</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </el-form>
+        </div>
+      </div>
+      <div class="box auth-list">
+        <div class="manageTitle">权限树</div>
+      </div>
+      <div class="box auth-list">
+        <div class="flex">
+          <div class="manageTitle">权限规则</div>
+          <el-radio-group v-model="auth">
+            <el-radio label="1">显示权限</el-radio>
+            <el-radio label="2">显示及编辑权限</el-radio>
+          </el-radio-group>
+        </div>
+        <div class="t30">
+          <el-form :model="form" class="demo-ruleForm">
+            <el-form-item label="许可查询行">
+              <el-input size="default" v-model="form.QueryRow" placeholder="请输入内容"></el-input>
+            </el-form-item>
+            <el-form-item label="许可查询列">
+              <el-input size="default" v-model="form.QueryCol" placeholder="请输入内容"></el-input>
+            </el-form-item>
+            <el-form-item label="许可删除行">
+              <el-input size="default" v-model="form.DeleteRow" placeholder="请输入内容"></el-input>
+            </el-form-item>
+            <el-form-item label="许可新增列">
+              <el-input size="default" v-model="form.NewCol" placeholder="请输入内容"></el-input>
+            </el-form-item>
+            <el-form-item label="许可编辑行">
+              <el-input size="default" v-model="form.EditRow" placeholder="请输入内容"></el-input>
+            </el-form-item>
+            <el-form-item label="许可编辑列">
+              <el-input size="default" v-model="form.EditCol" placeholder="请输入内容"></el-input>
+            </el-form-item>
+          </el-form>
+        </div>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script setup lang="ts">
+import { ref, reactive } from "vue";
+const ruleForm = reactive({
+  roleName: "11",
+  roleDesc: "22",
+  roleStatus: "2",
+});
+const auth = ref("1");
+const form = reactive({
+  QueryRow: "",
+  QueryCol: "",
+  DeleteRow: "",
+  NewCol: "",
+  EditRow: "",
+  EditCol: "",
+});
 </script>
 
 <style lang="scss" scoped>
+.auth {
+  &-content {
+    height: 100%;
+  }
+  &-list {
+    flex: 1;
+    margin-right: 24px;
+    &:last-child {
+      margin-right: 0;
+    }
+  }
+}
 </style>