Skip to content

F
founder_vue
Commit 641c1b53 by liyuhang19990520
Options

卡片、删除前判断、比中信息接口姓名和时间、角色设置显示、毛玻璃、以及其他ui样式

parent dc4e0d0c
Showing with 211 additions and 125 deletions
src/views/SystemManage/GroupManage.vue
......@@ -92,7 +92,12 @@
>
<el-table-column type="selection" height width="auto">
</el-table-column>
<el-table-column prop="name" label="用户组" :width="width1">
<el-table-column
prop="name"
label="用户组"
:width="width1"
show-overflow-tooltip
>
</el-table-column>
<el-table-column
prop="roleNames"
......@@ -166,7 +171,7 @@
cursor: pointer;
"
src="../../assets/img/qbryk/bj.png"
@click="openedit(scope.row.id)"
@click="openedit(scope.row)"
/>
</Confirmation>
<Confirmation
......@@ -281,7 +286,7 @@
v-show="isShowEditGroupDialogBg"
@click="canceledit"
></div>
<div class="addUserDialog" v-show="isShowEditGroupDialog">
<div class="addUserDialog dialog" v-show="isShowEditGroupDialog">
<div class="head-title">
<div class="left">编辑用户组</div>
<div class="close" @click="canceledit">
......@@ -327,8 +332,8 @@
</el-form-item>
<el-form-item class="info-item" label="启用状态:" prop="status">
<el-radio-group class="radio-info" v-model="editFormParams.status">
<el-radio :label="1">启用</el-radio>
<el-radio :label="0">停用</el-radio>
<el-radio :label="1" class="qiyong">启用</el-radio>
<el-radio :label="0" class="tingyong">停用</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item class="addbtns">
......@@ -353,7 +358,7 @@
<div class="head-title">
<div class="left">
<img class="title-img" :src="src" alt="" />
{{ title.unitname }}
{{ checkItem.name }}
</div>
<div class="close" @click="cancelrole">
<img src="@/assets/img/manage/close.png" alt="" />
......@@ -368,20 +373,13 @@
</div>
</div>
<div class="default-role-group">
<div class="default-btn">
<span>指纹入库员</span>
<div class="triangle">
<i class="el-icon-close"></i>
</div>
</div>
<div class="default-btn">
<span>综合认定员</span>
<div class="triangle">
<i class="el-icon-close"></i>
</div>
</div>
<div class="default-btn">
<span>高级认定员</span>
<div
class="default-btn"
v-for="item in checkItem.roleNames &&
checkItem.roleNames.split(',')"
:key="item"
>
<span>{{ item }}</span>
<div class="triangle">
<i class="el-icon-close"></i>
</div>
......@@ -392,24 +390,8 @@
添加完成
</div>
<div class="add-role-group">
<div class="default-btn">
<span>指纹入库员</span>
<img src="@/assets/img/jiahao.png" alt="" />
</div>
<div class="default-btn">
<span>综合认定员</span>
<img src="@/assets/img/jiahao.png" alt="" />
</div>
<div class="default-btn">
<span>高级认定员</span>
<img src="@/assets/img/jiahao.png" alt="" />
</div>
<div class="default-btn">
<span>指纹入库员</span>
<img src="@/assets/img/jiahao.png" alt="" />
</div>
<div class="default-btn custom">
<span>综合认定员</span>
<div class="default-btn" v-for="item in userArr" :key="item.id">
<span>{{ item.name }}</span>
<img src="@/assets/img/jiahao.png" alt="" />
</div>
<div class="default-btn custom">
......@@ -651,6 +633,8 @@ export default {
isShowUserDialog: false, // 用户设置 弹窗
isShowRoleDialogBg: false, // 角色设置 背景
isShowRoleDialog: false, // 角色设置 弹窗
checkItem: {}, //选中后的信息
userArr: [], //用户集合
};
},
computed: {
......@@ -668,6 +652,19 @@ export default {
this.selectBoo = false;
this.$refs.multipleTable.clearSelection();
},
searchUser() {
let self = this;
this.$axios
.get("/system/roles")
.then((res) => {
if (res.data !== null) {
self.userArr = res.data;
} else {
this.$message.error("获取角色信息失败！");
}
})
.catch(() => {});
},
clear() {
this.searchParams.page.page = 1; //必填
this.searchParams.page.total = 20; //必填
......@@ -763,7 +760,9 @@ export default {
this.isShowAddUserDialogBg = false;
},
// 打开编辑弹窗
openedit(id) {
openedit(row) {
this.checkItem = row;
let id = row.id;
var usergroup = new URLSearchParams();
usergroup.append("Id", id);
this.$axios
......@@ -800,6 +799,7 @@ export default {
},
// 打开用户设置弹窗
setUser(row) {
this.checkItem = row;
// this.visible.setUserVisible = true;
this.isShowUserDialog = true;
this.isShowUserDialogBg = true;
......@@ -807,6 +807,7 @@ export default {
},
// 打开角色弹窗
setRole(row) {
this.checkItem = row;
// this.visible.setRoleVisible = true;
this.isShowRoleDialog = true;
this.isShowRoleDialogBg = true;
......@@ -906,6 +907,7 @@ export default {
},
mounted() {
this.search();
this.searchUser();
},
watch: {
selectBoo: {
......
src/views/SystemManage/PermissionManage.vue
......@@ -71,7 +71,7 @@
<div class="table">
<el-table
:height="userWidths.height"
style="width: 100%;"
style="width: 100%"
highlight-current-row
ref="multipleTable"
:key="key1"
......@@ -136,11 +136,7 @@
</div>
</template>
</el-table-column>
<el-table-column
prop="status"
label="启用状态"
:width="userWidths.width1"
>
<el-table-column prop="status" label="启用状态" width="110">
<template slot-scope="scope">
<div v-if="scope.row.status === 0" class="circle-red"></div>
<div v-if="scope.row.status === 1" class="circle-blue"></div>
......@@ -156,7 +152,12 @@
<el-table-column prop="active" label="操作">
<template slot-scope="scope">
<img
style="width: 1.125rem;height: 1.125rem;margin-right: 1.125rem;cursor: pointer"
style="
width: 1.125rem;
height: 1.125rem;
margin-right: 1.125rem;
cursor: pointer;
"
src="../../assets/img/qbryk/bj.png"
@click="userEdit(scope.row.userId, scope.row.roleName)"
/>
......@@ -278,7 +279,11 @@
<template slot-scope="scope">
<div class="group-item">
<svg-icon
style="width: 1rem;height: .8125rem;margin-bottom: -0.0625rem;"
style="
width: 1rem;
height: 0.8125rem;
margin-bottom: -0.0625rem;
"
icon-class="group-item"
/>
{{ scope.row.userCount }}
......@@ -290,9 +295,7 @@
</el-table-column>
<el-table-column>
<template slot-scope="scope">
<div class="set-btn" :width="groupWidths.btnwidth">
用户设置
</div>
<div class="set-btn" :width="groupWidths.btnwidth">用户设置</div>
</template>
</el-table-column>
......@@ -333,7 +336,12 @@
<el-table-column prop="active" label="操作">
<template slot-scope="scope">
<img
style="width: 1.125rem;height: 1.125rem;margin-right: 1.125rem;cursor: pointer"
style="
width: 1.125rem;
height: 1.125rem;
margin-right: 1.125rem;
cursor: pointer;
"
src="../../assets/img/qbryk/bj.png"
@click="groupEdit(scope.row.id)"
/>
......@@ -407,7 +415,7 @@ export default {
width2: 100,
width5: 220,
width1: 100,
height: 480
height: 480,
},
// 搜索用户
userSearchParams: {
......@@ -420,18 +428,18 @@ export default {
page: {
total: 20,
count: 0,
page: 1
}
page: 1,
},
},
src: require("@/assets/img/police-badge.png"),
groupTableData: [],
// 用户组列表的表格宽度
groupWidths: {
width3: 110,
width3: 220,
width2: 400,
width1: 200,
height: 480,
btnwidth: 200
btnwidth: 200,
},
// 搜索用户组
groupSearchParams: {
......@@ -445,9 +453,9 @@ export default {
page: {
total: 20,
count: 0,
page: 1
}
}
page: 1,
},
},
};
},
computed: {
......@@ -466,7 +474,7 @@ export default {
this.groupSearchParams.page.count / this.groupSearchParams.page.total
) + 1
);
}
},
},
methods: {
getUser() {
......@@ -508,19 +516,19 @@ export default {
this.searchGroup();
},
// 用户当期页发生变化
userHandleCurrPageChange: function(val) {
userHandleCurrPageChange: function (val) {
this.userSearchParams.page.page = val;
this.searchUser();
},
// 用户每页展示数量发生变化
userHandleSizeChange: function(val) {
userHandleSizeChange: function (val) {
this.userSearchParams.page.total = val;
this.searchUser();
},
// 获取用户信息
searchUser() {
console.info("搜索用户列表");
this.$axios.get("/system/users").then(res => {
this.$axios.get("/system/users").then((res) => {
console.info(res);
this.userTableData = res.data;
});
......@@ -543,24 +551,24 @@ export default {
name: "UserPermission",
params: {
id: id,
rolename: rolename
}
rolename: rolename,
},
});
},
// 用户组当前页发生变化
groupHandleCurrPageChange: function(val) {
groupHandleCurrPageChange: function (val) {
this.groupSearchParams.page.page = val;
this.searchGroup();
},
// 用户组每页展示数量发生变化
groupHandleSizeChange: function(val) {
groupHandleSizeChange: function (val) {
this.groupSearchParams.page.total = val;
this.searchGroup();
},
// 获取用户组信息
searchGroup() {
this.$axios.get("/system/user-groups").then(res => {
this.$axios.get("/system/user-groups").then((res) => {
console.info(res);
this.groupTableData = res.data;
});
......@@ -582,8 +590,8 @@ export default {
this.$router.push({
name: "GroupPermission",
params: {
id: id
}
id: id,
},
});
},
......@@ -606,11 +614,11 @@ export default {
// roleId;/必填
this.$axios
.post("/login/permission/add", permission)
.then(res => {
.then((res) => {
console.log(res);
this.$message.success(res.message);
})
.catch(failResponse => {});
.catch((failResponse) => {});
},
// 删除权限
del() {
......@@ -618,11 +626,11 @@ export default {
permission.append("menuId", "888");
this.$axios
.post("/login/permission/deletePermissionById", permission)
.then(res => {
.then((res) => {
console.log(res);
this.$message.success(res.message);
})
.catch(failResponse => {});
.catch((failResponse) => {});
},
// 编辑权限
edit() {
......@@ -630,10 +638,10 @@ export default {
permission.append("menuId", "777");
this.$axios
.post("/login/permission/querypermissionInfo", permission)
.then(res => {
.then((res) => {
console.log(res);
})
.catch(failResponse => {});
.catch((failResponse) => {});
// menuId;//权限id
// menuname;//菜单名称
// pid;//父级权限id
......@@ -649,10 +657,10 @@ export default {
permission1.append("menuname", "修改菜单名字");
this.$axios
.post("/login/permission/update", permission1)
.then(res => {
.then((res) => {
console.log(res);
})
.catch(failResponse => {});
.catch((failResponse) => {});
},
// 刷新
search() {
......@@ -664,22 +672,27 @@ export default {
permission.append("total", "20"); //必填
this.$axios
.post("/login/permission/querypermissionAll", permission)
.then(res => {
.then((res) => {
console.log(res);
this.$message.success(res.message);
})
.catch(failResponse => {});
}
.catch((failResponse) => {});
},
},
mounted() {
this.isUser = true;
if (this.isUser) {
this.searchUser();
}
}
},
};
</script>
<style lang="css">
.el-tooltip__popper {
font-size: 14px;
max-width: 50%;
}
</style>
<style scoped lang="scss">
@import "scss/permission";
</style>
src/views/SystemManage/RoleManage.vue
<template>
<el-container class="manage-page" direction="vertical">
<div class="sider">
<div class="sider" @click="resetEdit('screen')">
<div class="btns">
<div class="add" @click="add">
<div class="add" @click.stop="add">
<svg-icon
style="
width: 0.8125rem;
......@@ -73,6 +73,7 @@
>1</el-checkbox
>
<div
@click.stop="() => {}"
:class="{
'diy-role-item': true,
active: item.id === diyRoleItemIndex,
......@@ -96,8 +97,15 @@
<img
class="img"
:src="editurl"
v-if="!item.edit"
@click.stop="editDiyRoleItem(item)"
/>
<img
class="img"
v-else
src="~@/assets/img/duigou.png"
@click.stop="editName(item)"
/>
</div>
</div>
</div>
......@@ -105,7 +113,7 @@
</div>
</div>
</div>
<div class="main">
<div class="main" @click="resetEdit('screen')">
<div class="header">
<div class="btns">
<div class="btn" :class="{ active: funFlag }" @click="funAuth">
......@@ -300,9 +308,20 @@ export default {
roleMenusSelection: function (val) {
console.info(val);
},
diyRoleItemIndex: {
handler(val, oldval) {
this.oldCurrtId = oldval;
let arr = [...this.diyRoleList, ...this.defaultRoleBtns];
let obj = arr.find((i) => i.id == val);
this.checkItem = JSON.parse(JSON.stringify(obj));
console.log(this.checkItem);
},
},
// checkItem: null
btnType: {
immediate: true,
handler(val) {
handler(val, oldval) {
this.oldBtnType = oldval;
if (val == "default") {
this.disabled = true;
} else {
......@@ -341,6 +360,12 @@ export default {
btnCheckList: [],
//手动新添加的用户集合
customAddUser: [],
//点击后的对象信息
checkItem: null,
//上一次选中的对象id
oldCurrtId: null,
//上一次选中的对象类型
oldBtnType: null,
};
},
methods: {
......@@ -490,9 +515,12 @@ export default {
this.checkList = [];
}
});
let arr = [...this.diyRoleList, ...this.defaultRoleBtns];
let obj = arr.find((i) => i.id == this.diyRoleItemIndex);
this.checkItem = JSON.parse(JSON.stringify(obj));
console.info("角色权限===》", this.defaultRoleBtns);
console.info("角色权限===》", this.diyRoleList);
console.info("选中的角色信息", this.checkItem);
} else {
this.$message.error("获取角色信息失败！");
}
......@@ -529,6 +557,20 @@ export default {
this.$refs.diyRoles.scrollTop = this.$refs.diyRoles.scrollHeight;
}, 20);
},
//查看用户组的信息
viewGroupItem(id) {
let arr = [...this.diyRoleList, ...this.defaultRoleBtns];
let obj = arr.find((i) => i.id == id);
return JSON.parse(JSON.stringify(obj));
},
//修改名
editName(item) {
let edit;
let index = this.diyRoleList.findIndex((i) => i.id == item.id);
if (!item.edit && typeof item.edit != Boolean) edit = false;
edit = !item.edit;
this.$set(this.diyRoleList[index], "edit", edit);
},
// 编辑
edit() {
console.info("编辑数据");
......@@ -567,7 +609,10 @@ export default {
this.viewSelect(item);
},
//重置编辑状态
resetEdit() {
resetEdit(type) {
if (type == "screen") {
}
let newArr = this.diyRoleList.map((i) => {
i.edit = false;
return i;
......
src/views/SystemManage/UserManage.vue
......@@ -106,7 +106,12 @@
</el-table-column>
<el-table-column prop="policeNumber" label="警号" :width="width2">
</el-table-column>
<el-table-column prop="userGroupNames" label="用户组" :width="width3">
<el-table-column
prop="userGroupNames"
label="用户组"
show-overflow-tooltip
:width="width3"
>
</el-table-column>
<el-table-column prop="unitName" label="所属单位" :width="width5">
</el-table-column>
......@@ -121,6 +126,7 @@
class="tags"
v-for="item in scope.row.roleNames &&
scope.row.roleNames.split(',')"
:key="item"
>
{{ item }}
</div>
......@@ -136,6 +142,7 @@
<div
v-for="(item, index) in scope.row.permissionNames &&
scope.row.permissionNames.split(',')"
:key="index"
>
{{ index > 0 ? "/" : "" }}
{{ item }}
......@@ -430,7 +437,7 @@ export default {
if (value === "") {
callback(new Error("请输入用户名！"));
} else {
if (/[\u4e00-\u9fa5]+/g.test(value) || value.length >= 8) {
if (/[\u4e00-\u9fa5]+/g.test(value) || value.length > 8) {
callback(new Error("用户名不可为汉字字符，最长8位！"));
} else {
callback();
......@@ -490,7 +497,7 @@ export default {
if (value === "") {
callback(new Error("请输入密码！"));
} else {
if (value.length >= 8) {
if (value.length > 8) {
callback(new Error("密码长度需在8位数以内！"));
} else {
callback();
......@@ -574,7 +581,7 @@ export default {
{ validator: validateTruename, trigger: "blur", required: true },
], //用户真实姓名
policeNumber: [
{ validator: validatePolicemanid, trigger: "blur", required: true },
{ validator: validatePolicemanid, trigger: "blur", required: false },
], //警号
phoneNumber: [
{ validator: validateTelphone, trigger: "blur", required: true },
......@@ -967,6 +974,12 @@ const data1 = [
},
];
</script>
<style lang="css">
.el-tooltip__popper {
font-size: 14px;
max-width: 50%;
}
</style>
<style scoped lang="scss">
.delSelection /deep/ .el-table-column--selection .cell {
display: none;
......@@ -981,6 +994,7 @@ const data1 = [
.info {
margin-top: 0px !important;
}
@import "scss/user";
@import "./scss/dialog_table";
</style>
src/views/SystemManage/scss/group.scss
......@@ -567,7 +567,7 @@
left: calc(50% - 471.5px);
z-index: 1000;
width: 626px;
height: 440px;
padding-bottom: 20px;
background: #ffffff;
box-shadow: 0px 14px 30px 0px rgba(0, 21, 51, 0.25);
border-radius: 6px;
......@@ -609,7 +609,8 @@
//border: saddlebrown 1px solid;
.default-role-group {
width: 578px;
height: auto;
max-height: 125px;
overflow: auto;
background: #fdfeff;
box-shadow: 1px 0px 3px 0px rgba(5, 95, 231, 0.3), -1px 1px 3px 0px rgba(5, 95, 231, 0.24);
border-radius: 4px;
......@@ -620,6 +621,7 @@
flex-wrap: wrap;
.default-btn {
position: relative;
margin: 5px 0;
width: 160px;
height: 32px;
background: #f6f8fa;
......@@ -660,8 +662,9 @@
margin: 16px 0 16px 0;
}
.add-role-group {
overflow: auto;
width: 578px;
height: 111px;
height: 150px;
background: #f6f8fa;
box-shadow: 1px 0px 3px 0px rgba(5, 95, 231, 0.3), -1px 1px 3px 0px rgba(5, 95, 231, 0.24);
border-radius: 4px;
......
src/views/cxyrd/TT.scss
......@@ -177,17 +177,17 @@ $phone: var(--phone, #606266); //#ff4242;
}
}
.bz-src-item{
.bz-src-item {
width: 333px;
height: 150px;
.img{
border: 1px #CCCCCC solid;
.img {
border: 1px #cccccc solid;
width: 105px;
height: 150px;
position: relative;
top: -105px;
margin-right: 5px;
.title{
.title {
text-align: center;
position: relative;
bottom: -100px;
......@@ -195,24 +195,25 @@ $phone: var(--phone, #606266); //#ff4242;
width: 104px;
height: 20px;
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #000000 100%);
color: #FFFFFF;
color: #ffffff;
font-size: 12px;
line-height: 20px;
z-index: 100;
}
}
.item{
.item {
height: 150px;
width: 220px;
font-size: 14px;
.title{
.title {
color: #999999;
height:22px ;
height: 22px;
width: 180px;
height: 22px;
}
.value{
color: #333333; height:22px ;
.value {
color: #333333;
height: 22px;
width: 180px;
height: 22px;
}
......@@ -347,21 +348,29 @@ $phone: var(--phone, #606266); //#ff4242;
}
.finger {
box-sizing: border-box;
border: #001e33 1px solid;
border-radius: 8px;
border: 1px solid #cccccc;
background: #ffffff;
box-shadow: 0px 14px 30px 2px rgba(0, 21, 51, 0.16);
width: calc(50vh - 35px);
height: calc(50vh - 35px);;
height: calc(50vh - 35px);
margin-bottom: 20px;
// .wtx {
// position: absolute;
// width: 75%;
// left: 50%;
// top: 45%;
// transform: translate(-50%, -50%);
// > span {
// display: inline-block;
// margin-top: 20px;
// font-size: 14px;
// color: #cccccc;
// }
//}
}}
position: relative;
.wtx {
position: absolute;
width: 100%;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
}
img {
width: 100% !important;
}
span {
font-size: 17px;
}
}
}
.bzActive {
filter: blur(2px);
}
vue.config.js
/*
* @Author: your name
* @Date: 2021-09-07 09:57:48
* @LastEditTime: 2021-11-15 21:11:13
* @LastEditTime: 2021-11-17 14:02:53
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \指纹系统\founder_vue\vue.config.js
......@@ -92,12 +92,12 @@ module.exports = {
// target: "http://192.168.0.137:8080/", //统一的请求头部每次修改都要重启才会生效 http://39.99.224.27:8006/
// target: "http://172.18.108.2:8099/", // 张 认定
// target: "http://192.168.128.110:8099", // 湖南-张
// target: "http://192.168.128.114:8099", // 湖南-马
target: "http://192.168.128.114:8099", // 湖南-马
// target: "http://192.168.128.116:8099", // 湖南-王
// target: "http://172.18.116.73:8099/", //统一的请求头部每次修改都要重启才会生效 http://39.99.224.27:8006/ ma
// target: "http://127.0.0.1:8099",
// target: "http://47.92.225.109:5602",
target: "http://www.meetfood.cn:2390/", // 湖南-线上
// target: "http://www.meetfood.cn:2390/", // 湖南-线上
ws: true,
changeOrigin: true,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment