|
|
@@ -104,91 +104,124 @@
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
|
|
|
- <!-- 新增账号 -->
|
|
|
+ <!-- 添加角色 -->
|
|
|
<el-dialog
|
|
|
- class="account"
|
|
|
- v-model="accountVisible"
|
|
|
+ class="addRoles"
|
|
|
+ v-model="addRolesVisible"
|
|
|
:close-on-click-modal="false"
|
|
|
:close-on-press-escape="false"
|
|
|
- :title="accountTitle"
|
|
|
+ :title="addRolesTitle"
|
|
|
align-center
|
|
|
- width="600"
|
|
|
- :before-close="cancelAccount"
|
|
|
+ width="900"
|
|
|
+ :before-close="cancelAddRoles"
|
|
|
>
|
|
|
- <el-form
|
|
|
- ref="accountRef"
|
|
|
- :model="accountRuleForm"
|
|
|
- :rules="accountRules"
|
|
|
- class="demo-ruleForm"
|
|
|
- label-width="80px"
|
|
|
- :size="formSize"
|
|
|
- label-position="right"
|
|
|
- status-icon
|
|
|
- >
|
|
|
- <el-form-item label="角色" prop="role">
|
|
|
- <el-select
|
|
|
- v-model="accountRuleForm.role"
|
|
|
- placeholder="请选择"
|
|
|
- style="width: 220px"
|
|
|
- @change="roleChange"
|
|
|
- :disabled="roleId == 2 || roleId == 3 || roleId == 4"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="item in roleData"
|
|
|
- :key="item.id"
|
|
|
- :label="item.name"
|
|
|
- :value="item.id"
|
|
|
- />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="用户名" prop="user">
|
|
|
- <el-input
|
|
|
- v-model="accountRuleForm.user"
|
|
|
- placeholder="建设单位可填写单位名称"
|
|
|
- clearable
|
|
|
- style="width: 220px"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- <!-- <span class="resetPassword"
|
|
|
- >注：建设单位时用户名可填写单位名称</span
|
|
|
- > -->
|
|
|
- <el-form-item label="联系人" prop="">
|
|
|
- <el-input
|
|
|
- v-model="accountRuleForm.contacts"
|
|
|
- placeholder="请输入联系人"
|
|
|
- clearable
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="联系电话" prop="">
|
|
|
- <el-input
|
|
|
- v-model="accountRuleForm.phone"
|
|
|
- placeholder="请输入联系电话"
|
|
|
- clearable
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="账号" prop="account">
|
|
|
- <el-input
|
|
|
- v-model="accountRuleForm.account"
|
|
|
- placeholder="请输入账号"
|
|
|
- clearable
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- <span class="resetPassword"
|
|
|
- >注：新增账号统一默认密码为JXSJG_123</span
|
|
|
+ <div class="rolesNames">
|
|
|
+ <span>角色名称: </span>
|
|
|
+ <el-input
|
|
|
+ :clearable="true"
|
|
|
+ v-model.trim="addRoleName"
|
|
|
+ class="w-50 m-2"
|
|
|
+ style="width: 450px"
|
|
|
+ placeholder="请输入角色名称"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="rolesName">
|
|
|
+ <div class="rolePermission">角色权限: </div>
|
|
|
+ <div>
|
|
|
+ <!-- <el-table
|
|
|
+ :row-class-name="tableRowClassName"
|
|
|
+ :data="addRolesData.list"
|
|
|
+ style="width: 100%"
|
|
|
+ :span-method="arraySpanMethod"
|
|
|
+ :header-cell-style="{
|
|
|
+ background: 'rgba(240, 243, 247, 1)',
|
|
|
+ height: '50px',
|
|
|
+ }"
|
|
|
>
|
|
|
- <el-form-item class="options">
|
|
|
+ <el-table-column align="center" prop="one" label="一级" />
|
|
|
+ <el-table-column align="center" prop="two" label="二级" />
|
|
|
+ <el-table-column width="600" label="功能">
|
|
|
+ <template #default="{ row }">
|
|
|
+ <div class="checkBoxSel">
|
|
|
+ <el-tree
|
|
|
+ :ref="`addRolesData${row.four}`"
|
|
|
+ style="max-width: 600px"
|
|
|
+ :data="row.three"
|
|
|
+ show-checkbox
|
|
|
+ node-key="id"
|
|
|
+ :props="defaultProps"
|
|
|
+ default-expand-all
|
|
|
+ @check="
|
|
|
+ (data, nodes) => editMemberCheckChange(data, nodes, row)
|
|
|
+ "
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </template></el-table-column
|
|
|
+ >
|
|
|
+ </el-table> -->
|
|
|
+
|
|
|
+ <table cellspacing="0" border-collapse="collapse">
|
|
|
+ <tr align="center">
|
|
|
+ <td>一级</td>
|
|
|
+ <td>二级</td>
|
|
|
+ <td>功能</td>
|
|
|
+ </tr>
|
|
|
+ <!-- 房态管理 1 -->
|
|
|
+ <tr align="center">
|
|
|
+ <td>房态管理</td>
|
|
|
+ <td>/</td>
|
|
|
+ <td>
|
|
|
+ <el-tree
|
|
|
+ ref="addRolesData1"
|
|
|
+ style="max-width: 600px"
|
|
|
+ :data="addRolesList1.three"
|
|
|
+ show-checkbox
|
|
|
+ node-key="id"
|
|
|
+ :props="defaultProps"
|
|
|
+ default-expand-all
|
|
|
+ @check="
|
|
|
+ (data, nodes) =>
|
|
|
+ editMemberCheckChange(data, nodes, addRolesList1.one)
|
|
|
+ "
|
|
|
+ />
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ <!-- 楼栋单元管理 2 -->
|
|
|
+ <tr align="center">
|
|
|
+ <td :rowspan="4">房间管理</td>
|
|
|
+ <td>楼栋单元管理</td>
|
|
|
+ <td>
|
|
|
+ <el-tree
|
|
|
+ ref="addRolesData2"
|
|
|
+ style="max-width: 600px"
|
|
|
+ :data="addRolesList2.three"
|
|
|
+ show-checkbox
|
|
|
+ node-key="id"
|
|
|
+ :props="defaultProps"
|
|
|
+ default-expand-all
|
|
|
+ @check="
|
|
|
+ (data, nodes) =>
|
|
|
+ editMemberCheckChange(data, nodes, addRolesList2.two)
|
|
|
+ "
|
|
|
+ />
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="options">
|
|
|
+ <div class="btn">
|
|
|
<el-button
|
|
|
+ color="rgba(41, 109, 227, 1)"
|
|
|
class="queding"
|
|
|
type="primary"
|
|
|
- @click="confirmAccount(accountRef)"
|
|
|
+ @click="confirmEdit"
|
|
|
>
|
|
|
- 确认
|
|
|
+ 确定
|
|
|
</el-button>
|
|
|
- <el-button class="quxiao" @click="cancelAccount"
|
|
|
- > 取消 </el-button
|
|
|
- >
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
+ <el-button @click="cancelAddRoles">取消</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</el-dialog>
|
|
|
|
|
|
<!-- 项目导入 -->
|
|
|
@@ -295,23 +328,69 @@ const selectData = reactive({
|
|
|
const api = ref("");
|
|
|
|
|
|
// 新增账号 (--------------------------------------------------------)
|
|
|
-const accountVisible = ref(false);
|
|
|
-const accountTitle = ref();
|
|
|
-const accountRef = ref();
|
|
|
-
|
|
|
-const accountRuleForm = reactive({
|
|
|
- role: "", // 角色
|
|
|
- user: "", // 用户名
|
|
|
- contacts: "", // 联系人
|
|
|
- phone: "", // 联系电话
|
|
|
- account: "", // 账号
|
|
|
- id: "",
|
|
|
+const addRolesVisible = ref(false);
|
|
|
+const addRolesTitle = ref();
|
|
|
+const addRolesData = ref();
|
|
|
+const defaultProps = ref({
|
|
|
+ children: "children",
|
|
|
+ label: "name",
|
|
|
});
|
|
|
-// 新增账号表单验证
|
|
|
-const accountRules = reactive({
|
|
|
- role: [{ required: true, message: "角色不能为空", trigger: "blur" }],
|
|
|
- user: [{ required: true, message: "用户名不能为空", trigger: "blur" }],
|
|
|
- account: [{ required: true, message: "账号不能为空", trigger: "blur" }],
|
|
|
+
|
|
|
+const addRoleName=ref()
|
|
|
+const addRolesData1 = ref(); // 房态管理
|
|
|
+const addRolesList1 = reactive({
|
|
|
+ one: "房态管理",
|
|
|
+ two: "/",
|
|
|
+ three: [
|
|
|
+ {
|
|
|
+ name: "全部",
|
|
|
+ id: 0,
|
|
|
+ children: [
|
|
|
+ { name: "预定", id: 1 },
|
|
|
+ { name: "退房", id: 2 },
|
|
|
+ { name: "维修", id: 3 },
|
|
|
+ { name: "关房", id: 4 },
|
|
|
+ { name: "置脏", id: 5 },
|
|
|
+ { name: "置净", id: 6 },
|
|
|
+ { name: "退款", id: 7 },
|
|
|
+ { name: "入住", id: 8 },
|
|
|
+ { name: "锁房", id: 9 },
|
|
|
+ // { name: "日志", id: 10 },
|
|
|
+ { name: "换房", id: 11 },
|
|
|
+ { name: "开房", id: 12 },
|
|
|
+ // { name: "门锁管理", id: 13 },
|
|
|
+ { name: "查看界面", id: 14 },
|
|
|
+ { name: "开电", id: 15 },
|
|
|
+ { name: "关电", id: 16 },
|
|
|
+ { name: "取消预定", id: 17 },
|
|
|
+ { name: "取消维修", id: 18 },
|
|
|
+ { name: "查看密码", id: 19 },
|
|
|
+ { name: "退款", id: 20 },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ four: "1",
|
|
|
+ checkedSel: [],
|
|
|
+});
|
|
|
+
|
|
|
+const addRolesData2 = ref(); // 楼栋单元管理
|
|
|
+const addRolesList2 = reactive({
|
|
|
+ one: "房间管理",
|
|
|
+ two: "楼栋单元管理",
|
|
|
+ three: [
|
|
|
+ {
|
|
|
+ name: "全部",
|
|
|
+ id: 0,
|
|
|
+ children: [
|
|
|
+ { name: "添加", id: 1 },
|
|
|
+ { name: "编辑", id: 2 },
|
|
|
+ { name: "删除", id: 3 },
|
|
|
+ { name: "查看界面", id: 4 },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ four: "2",
|
|
|
+ checkedSel: [],
|
|
|
});
|
|
|
|
|
|
// 项目导入
|
|
|
@@ -370,19 +449,19 @@ const searchBtn = lodash.debounce(async () => {
|
|
|
|
|
|
// 角色新增
|
|
|
const addProjectbtn = () => {
|
|
|
- accountVisible.value = true;
|
|
|
- accountTitle.value = "角色新增";
|
|
|
+ addRolesVisible.value = true;
|
|
|
+ addRolesTitle.value = "角色新增";
|
|
|
};
|
|
|
// 取消角色新增
|
|
|
-const cancelAccount = () => {
|
|
|
- accountVisible.value = false;
|
|
|
+const cancelAddRoles = () => {
|
|
|
+ addRolesVisible.value = false;
|
|
|
accountRef.value.resetFields();
|
|
|
};
|
|
|
|
|
|
//编辑项目
|
|
|
const edit = (row) => {
|
|
|
- accountVisible.value = true;
|
|
|
- accountTitle.value = "角色编辑";
|
|
|
+ addRolesVisible.value = true;
|
|
|
+ addRolesTitle.value = "角色编辑";
|
|
|
console.log(row);
|
|
|
};
|
|
|
// 删除pdf文件 （装配式相关附件）
|
|
|
@@ -509,7 +588,7 @@ onUnmounted(() => {
|
|
|
width: calc(100% - 60px);
|
|
|
margin: 0 auto;
|
|
|
color: #000;
|
|
|
-
|
|
|
+
|
|
|
// border-bottom: 1px solid rgb(231, 231, 231);
|
|
|
.filter {
|
|
|
display: flex;
|
|
|
@@ -638,78 +717,156 @@ onUnmounted(() => {
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- // 项目新增样式
|
|
|
- :deep(.account) {
|
|
|
- // height: 300px;
|
|
|
+ // 添加角色
|
|
|
+ :deep(.addRoles) {
|
|
|
+ // height: 420px;
|
|
|
border-radius: 11px;
|
|
|
-
|
|
|
.el-dialog__header {
|
|
|
border-radius: 11px 11px 0 0;
|
|
|
background: rgba(237, 241, 245, 1);
|
|
|
font-weight: 600;
|
|
|
margin: 0;
|
|
|
- height: 32px;
|
|
|
-
|
|
|
.el-dialog__headerbtn {
|
|
|
outline: none;
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
.el-dialog__body {
|
|
|
- padding: 30px 30px 0 30px;
|
|
|
- .el-form {
|
|
|
- .formLi {
|
|
|
- width: 100%;
|
|
|
- margin-bottom: 5px;
|
|
|
- display: flex;
|
|
|
- .el-form-item {
|
|
|
- .el-input {
|
|
|
- width: 120px;
|
|
|
- }
|
|
|
- &:nth-child(2) {
|
|
|
- .el-form-item__label {
|
|
|
- display: none;
|
|
|
+ padding: 20px 30px 10px 30px;
|
|
|
+
|
|
|
+ .rolesName {
|
|
|
+ margin: 15px 0;
|
|
|
+ color: #000;
|
|
|
+ height: 600px;
|
|
|
+ overflow: auto;
|
|
|
+ .rolePermission {
|
|
|
+ margin: 10px 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-table--fit {
|
|
|
+ height: 600px;
|
|
|
+
|
|
|
+ .el-table__header-wrapper {
|
|
|
+ background-color: #000;
|
|
|
+ font-size: 16px;
|
|
|
+ tr {
|
|
|
+ color: #000;
|
|
|
+ th {
|
|
|
+ border-left: 1px solid #dcdfe6 !important;
|
|
|
+ &:last-child {
|
|
|
+ border-right: 1px solid #dcdfe6 !important;
|
|
|
}
|
|
|
- .el-form-item__content {
|
|
|
- margin-left: 10px !important;
|
|
|
+ .cell {
|
|
|
+ text-align: center;
|
|
|
}
|
|
|
}
|
|
|
- &:nth-child(3) {
|
|
|
- .el-form-item__label {
|
|
|
- display: none;
|
|
|
- }
|
|
|
- .el-form-item__content {
|
|
|
- margin-left: 10px !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-table__row {
|
|
|
+ height: 50px;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #000;
|
|
|
+ .el-tree-node__children {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ .el-tree-node {
|
|
|
+ width: 140px;
|
|
|
+ .el-tree-node__content {
|
|
|
+ padding-left: 0 !important;
|
|
|
}
|
|
|
}
|
|
|
+ // border: 1px solid red;
|
|
|
}
|
|
|
}
|
|
|
- .resetPassword {
|
|
|
- color: rgba(43, 151, 252, 1);
|
|
|
- padding-left: 40px;
|
|
|
- display: inline-block;
|
|
|
- margin-bottom: 15px;
|
|
|
+
|
|
|
+ .el-table__row td {
|
|
|
+ padding: 0;
|
|
|
+ // border: 0;
|
|
|
}
|
|
|
- .options {
|
|
|
- margin: 60px 0 40px 0;
|
|
|
- .el-form-item__content {
|
|
|
- display: flex;
|
|
|
- flex-direction: row-reverse;
|
|
|
- .queding {
|
|
|
- margin-left: 20px;
|
|
|
- background: linear-gradient(
|
|
|
- 90deg,
|
|
|
- rgba(33, 107, 255, 1) 0%,
|
|
|
- rgba(102, 182, 255, 1) 100%
|
|
|
- );
|
|
|
- border: none;
|
|
|
+ td {
|
|
|
+ border-left: 1px solid #dcdfe6;
|
|
|
+ .checkBoxSel {
|
|
|
+ padding-left: 20px;
|
|
|
+ .el-checkbox {
|
|
|
+ .el-checkbox__label {
|
|
|
+ color: #000;
|
|
|
+ }
|
|
|
}
|
|
|
- .quxiao {
|
|
|
- border: 1px solid rgba(43, 151, 252, 1);
|
|
|
- color: rgba(43, 151, 252, 1);
|
|
|
+ }
|
|
|
+ &:last-child {
|
|
|
+ border-right: 1px solid #dcdfe6;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-table__row:hover {
|
|
|
+ td {
|
|
|
+ background-color: #ffffff !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-button--primary {
|
|
|
+ margin-left: 5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ // .el-table__body .even {
|
|
|
+ // background-color: #fff;
|
|
|
+ // }
|
|
|
+
|
|
|
+ // .el-table__body .odd {
|
|
|
+ // background-color: rgba(240, 243, 247, 1);
|
|
|
+ // }
|
|
|
+ }
|
|
|
+ table {
|
|
|
+ width: 840px;
|
|
|
+ // height: 600px;
|
|
|
+ tr {
|
|
|
+ td {
|
|
|
+ border-top: 1px solid #7c7c7c;
|
|
|
+ border-left: 1px solid #7c7c7c;
|
|
|
+ }
|
|
|
+ td:nth-child(1) {
|
|
|
+ width: 120px;
|
|
|
+ }
|
|
|
+ td:last-child {
|
|
|
+ border-right: 1px solid #7c7c7c;
|
|
|
+ padding: 10px 0;
|
|
|
+ .el-tree {
|
|
|
+ .el-tree-node__children {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ .el-tree-node {
|
|
|
+ width: 140px;
|
|
|
+ .el-tree-node__content {
|
|
|
+ padding-left: 0 !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // border: 1px solid red;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ tr:nth-child(1) {
|
|
|
+ td {
|
|
|
+ height: 40px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ tr:last-child {
|
|
|
+ td {
|
|
|
+ border-bottom: 1px solid #7c7c7c;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .options {
|
|
|
+ margin: 10px 20px 10px 0;
|
|
|
+ width: 100%;
|
|
|
+ .btn {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: row-reverse;
|
|
|
+ }
|
|
|
+ .queding {
|
|
|
+ color: #fff;
|
|
|
+ margin-left: 15px;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
hzj18279462576@163.com