8712b1bd by 任超

style:菜单

1 parent c961dd90
/*
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-03-24 17:24:52
* @LastEditTime: 2023-03-24 17:28:37
*/
import Vue from 'vue'
import router from "./router";
......@@ -33,7 +33,6 @@ router.beforeEach(async (to, from, next) => {
if (!hasUser) {
store.dispatch("user/getUserInfo");
}
debugger
if (hasAddRoute) {
next();
} else {
......
......@@ -3,7 +3,7 @@
<!-- 表单部分 -->
<div class="from-clues-header">
<el-form @submit.native.prevent :model="ruleForm" label-width="120px">
<el-form-item>
<el-form-item v-if="BASE_API.THEME == 'jg'">
<Breadcrumb />
</el-form-item>
<el-row :gutter="20">
......
<!--
* @Author: xiaomiao 1158771342@qq.com
* @Date: 2023-03-09 20:54:28
* @LastEditors: xiaomiao 1158771342@qq.com
* @LastEditTime: 2023-03-16 19:40:40
* @LastEditors: Please set LastEditors
* @LastEditTime: 2023-03-27 09:13:22
* @FilePath: \上报\bdcjg-web\src\views\system\information\index.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
......@@ -10,7 +10,7 @@
<div class="information from-clues">
<div class="from-clues-header">
<el-form ref="ruleForm" label-width="100px">
<el-form-item>
<el-form-item v-if="BASE_API.THEME == 'jg'">
<Breadcrumb />
</el-form-item>
<el-row class="mb-5">
......@@ -34,60 +34,64 @@
</div>
</template>
<script>
import "@/utils/flexible.js";
import BaseSet from "./base-set.vue";
import PasswordEdit from "./password-edit.vue";
export default {
components: {
BaseSet,
PasswordEdit,
import "@/utils/flexible.js";
import BaseSet from "./base-set.vue";
import PasswordEdit from "./password-edit.vue";
export default {
components: {
BaseSet,
PasswordEdit,
},
data () {
return {
isshow: true,
};
},
computed: {
userData () {
return this.$store.state.user.userInfo;
},
data () {
return {
isshow: true,
};
},
watch: {},
created () { },
mounted () { },
methods: {
information () {
this.isshow = true;
},
computed: {
userData () {
return this.$store.state.user.userInfo;
},
password () {
this.isshow = false;
},
watch: {},
created () { },
mounted () { },
methods: {
information () {
this.isshow = true;
},
password () {
this.isshow = false;
},
},
};
},
};
</script>
<style scoped lang="scss">
@import "~@/styles/mixin.scss";
.information {
@import "~@/styles/mixin.scss";
.information {
display: flex;
flex-direction: column;
.btnColRight {
margin-top: 10px;
display: flex;
flex-direction: column;
.btnColRight {
margin-top: 10px;
display: flex;
justify-content: center;
// background-color: cadetblue;
height: 30px;
}
/deep/.content {
.el-input__inner {
background: none;
}
.user-info {
background: none;
}
justify-content: center;
// background-color: cadetblue;
height: 30px;
}
/deep/.content {
.el-input__inner {
background: none;
}
.boxin {
flex: 1;
.user-info {
background: none;
}
}
</style>
.boxin {
flex: 1;
}
}</style>
......
......@@ -2,7 +2,7 @@
<div class="timedTask from-clues">
<div class="from-clues-header">
<el-form ref="ruleForm" :model="form" label-width="100px">
<el-form-item>
<el-form-item v-if="BASE_API.THEME == 'jg'">
<Breadcrumb />
</el-form-item>
<el-row class="mb-5">
......
......@@ -2,7 +2,7 @@
<div class="timedTask from-clues">
<div class="from-clues-header">
<el-form ref="ruleForm" :model="form" label-width="100px">
<el-form-item>
<el-form-item v-if="BASE_API.THEME == 'jg'">
<Breadcrumb />
</el-form-item>
<el-row class="mb-5">
......
......@@ -2,7 +2,7 @@
<div class="timedTask from-clues">
<div class="from-clues-header">
<el-form ref="form" :model="form" label-width="80px">
<el-form-item>
<el-form-item v-if="BASE_API.THEME == 'jg'">
<Breadcrumb />
</el-form-item>
<el-row>
......
......@@ -2,7 +2,7 @@
<div class="timedTask from-clues">
<div class="from-clues-header">
<el-form ref="ruleForm" :model="form" label-width="100px">
<el-form-item>
<el-form-item v-if="BASE_API.THEME == 'jg'">
<Breadcrumb />
</el-form-item>
<el-row class="mt-10">
......@@ -38,388 +38,389 @@
</div>
</template>
<script>
import {
getUuid,
judgeSort,
realMove,
findParents,
removeTreeListItem,
} from "@/utils/operation";
import {
resetPassword,
getUserList, getUserLists
} from "@/api/personnelManage";
import { api, deleteAction, getAction } from '@/api/manageApi'
import data from "./data";
import { deleteDomStr } from '@/utils/proDomStr'
import tableMixin from "@/mixins/tableMixin.js";
import EditDialog from "./edit-dialog.vue";
import { updateOrder } from "@/api/orders"
export default {
name: "menus",
mixins: [tableMixin],
components: {
EditDialog,
},
data () {
return {
isDialog: false,
taskData: null,
keyList: [],
form: {
loginName: "",
name: "",
code: "",
import {
getUuid,
judgeSort,
realMove,
findParents,
removeTreeListItem,
} from "@/utils/operation";
import {
resetPassword,
getUserList, getUserLists
} from "@/api/personnelManage";
import { api, deleteAction, getAction } from '@/api/manageApi'
import data from "./data";
import { deleteDomStr } from '@/utils/proDomStr'
import tableMixin from "@/mixins/tableMixin.js";
import EditDialog from "./edit-dialog.vue";
import { updateOrder } from "@/api/orders"
export default {
name: "menus",
mixins: [tableMixin],
components: {
EditDialog,
},
data () {
return {
isDialog: false,
taskData: null,
keyList: [],
form: {
loginName: "",
name: "",
code: "",
},
queryParam: {},
selectType: "0",
queryName: "",
organizationId: "", // 组织机构ID
departmentId: "", // 部门ID
departmentList: [], // 部门列表
levelList: [], // 职务级别
sexList: [],
typeOptions: [
{
value: "0",
label: "姓名",
},
queryParam: {},
selectType: "0",
queryName: "",
organizationId: "", // 组织机构ID
departmentId: "", // 部门ID
departmentList: [], // 部门列表
levelList: [], // 职务级别
sexList: [],
typeOptions: [
{
value: "0",
label: "姓名",
},
{
value: "1",
label: "工号",
},
{
value: "2",
label: "部门",
},
{
value: "1",
label: "工号",
},
{
value: "2",
label: "部门",
},
{
value: "3",
label: "机构",
},
],
selectionList: [],
tableData: {
columns: [
{
value: "3",
label: "机构",
label: "序号",
type: "index",
width: "50",
index: this.indexMethod,
},
],
]
.concat(data.columns())
.concat([
{
label: "职位",
render: (h, scope) => {
return (
<div v-show={scope.row.jobLevel !== null}>{scope.row.jobLevel ? "干事" : "经理"}</div>
)
selectionList: [],
tableData: {
columns: [
}
},
{
label: "序号",
type: "index",
width: "50",
index: this.indexMethod,
label: "负责人",
render: (h, scope) => {
return (
<i v-show={scope.row.isDuty !== null} class="el-icon-check" />
)
}
},
]
.concat(data.columns())
.concat([
{
label: "职位",
render: (h, scope) => {
return (
<div v-show={scope.row.jobLevel !== null}>{scope.row.jobLevel ? "干事" : "经理"}</div>
)
}
},
{
label: "负责人",
render: (h, scope) => {
return (
<i v-show={scope.row.isDuty !== null} class="el-icon-check" />
)
}
{
label: "排序",
width: 300,
render: (h, scope) => {
return (
<div>
<el-button
type="text"
class='movebtnColor'
disabled={scope.row.isTop}
onClick={() => {
this.updateOrder(scope.row, 'TOP');
}}
>
置顶
</el-button>
<el-button
type="text"
class='movebtnColor'
disabled={scope.row.isTop}
onClick={() => {
this.updateOrder(scope.row, 'UP');
}}
>
上移
</el-button>
<el-button
type="text"
class='movebtnColor'
disabled={scope.row.isBottom}
onClick={() => {
this.updateOrder(scope.row, 'DOWN');
}}
>
下移
</el-button>
<el-button
type="text"
size="mini"
class='movebtnColor'
disabled={scope.row.isBottom}
onClick={() => {
this.updateOrder(scope.row, 'BOTTOM');
}}
>
置底
</el-button>
</div>
);
},
{
label: "排序",
width: 300,
render: (h, scope) => {
return (
<div>
<el-button
type="text"
class='movebtnColor'
disabled={scope.row.isTop}
onClick={() => {
this.updateOrder(scope.row, 'TOP');
}}
>
置顶
</el-button>
<el-button
type="text"
class='movebtnColor'
disabled={scope.row.isTop}
onClick={() => {
this.updateOrder(scope.row, 'UP');
}}
>
上移
</el-button>
<el-button
type="text"
class='movebtnColor'
disabled={scope.row.isBottom}
onClick={() => {
this.updateOrder(scope.row, 'DOWN');
}}
>
下移
</el-button>
<el-button
type="text"
size="mini"
class='movebtnColor'
disabled={scope.row.isBottom}
onClick={() => {
this.updateOrder(scope.row, 'BOTTOM');
}}
>
置底
</el-button>
</div>
);
},
},
{
label: "操作",
width: 380,
render: (h, scope) => {
return (
<div>
<el-button
type="text"
size="mini"
class='resetbtnColor'
onClick={() => {
this.resetPassword(scope.row.id);
}}
>
重置
</el-button>
<el-button
type="text"
size="mini"
class='successColor'
onClick={() => {
this.handleEdit(scope.row);
}}
>
修改
</el-button>
<el-button
type="text"
size="mini"
class='delColor'
onClick={() => {
this.handleDelete(scope.row.id, scope.row.name);
}}
>
删除
</el-button>
</div>
);
},
},
]),
data: [],
},
};
},
created () {
this.getTableList();
},
computed: {
departmentid () {
return this.$store.state.user.userInfo;
},
},
methods: {
handleAdd () {
this.isDialog = true
this.$refs.dialogForm.adds();
this.$refs.dialogForm.title = "添加";
},
// 查询
getTableList () {
this.queryParam = {
name: this.form.name,
code: this.form.code,
loginName: this.form.loginName,
};
getUserLists(this.queryParam).then((res) => {
if (res.status === 1) {
this.loading = false;
this.tableData.data = res.content;
this.tableData.data = judgeSort(this.tableData.data);
let arr = []
this.tableData.data.forEach((item) => {
arr.push(item.departmentId)
})
this.getDepts(arr)
} else {
this.$message.error({ message: res.message, showClose: true })
}
})
},
// 获取组织机构
getDepts (deptIdArr) {
let params = {
queryOptions: {
conditionGroup: {
conditions: [
{
label: "操作",
width: 380,
render: (h, scope) => {
return (
<div>
<el-button
type="text"
size="mini"
class='resetbtnColor'
onClick={() => {
this.resetPassword(scope.row.id);
}}
>
重置
</el-button>
<el-button
type="text"
size="mini"
class='successColor'
onClick={() => {
this.handleEdit(scope.row);
}}
>
修改
</el-button>
<el-button
type="text"
size="mini"
class='delColor'
onClick={() => {
this.handleDelete(scope.row.id, scope.row.name);
}}
>
删除
</el-button>
</div>
);
},
property: "id",
value: deptIdArr,
operator: "IN",
},
]),
data: [],
],
queryRelation: "AND",
},
orderBys: [],
},
};
},
created () {
this.getTableList();
},
computed: {
departmentid () {
return this.$store.state.user.userInfo;
},
},
methods: {
handleAdd () {
this.isDialog = true
this.$refs.dialogForm.adds();
this.$refs.dialogForm.title = "添加";
},
// 查询
getTableList () {
this.queryParam = {
name: this.form.name,
code: this.form.code,
loginName: this.form.loginName,
};
getUserLists(this.queryParam).then((res) => {
if (res.status === 1) {
this.loading = false;
this.tableData.data = res.content;
this.tableData.data = judgeSort(this.tableData.data);
let arr = []
getAction(api.departments, params).then(
(res) => {
let deptsList = res.content;
deptsList.forEach((ele) => {
this.tableData.data.forEach((item) => {
arr.push(item.departmentId)
})
this.getDepts(arr)
} else {
this.$message.error({ message: res.message, showClose: true })
}
})
},
// 获取组织机构
getDepts (deptIdArr) {
let params = {
queryOptions: {
conditionGroup: {
conditions: [
{
property: "id",
value: deptIdArr,
operator: "IN",
},
],
queryRelation: "AND",
},
orderBys: [],
},
};
getAction(api.departments, params).then(
(res) => {
let deptsList = res.content;
deptsList.forEach((ele) => {
this.tableData.data.forEach((item) => {
if (ele.id == item.departmentId) {
item.departmentName = ele.name
}
})
if (ele.id == item.departmentId) {
item.departmentName = ele.name
}
})
})
},
(err) => {
console.log("err :", err);
}
);
},
// getTableList () {
// this.loading = true;
},
(err) => {
console.log("err :", err);
}
);
},
// getTableList () {
// this.loading = true;
// getUserList().then((res) => {
// if (res.status === 1) {
// console.log("res人员列表", res);
// this.loading = false;
// this.tableData.data = res.content;
// this.tableData.data = judgeSort(this.tableData.data);
// } else {
// this.$message.error({ message: res.message, showClose: true });
// }
// });
// },
// getUserList().then((res) => {
// if (res.status === 1) {
// console.log("res人员列表", res);
// this.loading = false;
// this.tableData.data = res.content;
// this.tableData.data = judgeSort(this.tableData.data);
// } else {
// this.$message.error({ message: res.message, showClose: true });
// }
// });
// },
// 重置用户密码
resetPassword (data) {
const ids = []
if (data instanceof Array) {
data.forEach((item) => {
ids.push(item.id)
})
} else {
ids.push(data)
}
if (ids.length === 0) {
this.$message({
message: '请选择需要重置密码的用户!',
showClose: true
})
return
}
this.$confirm(
`<div class="customer-message-wrapper">
// 重置用户密码
resetPassword (data) {
const ids = []
if (data instanceof Array) {
data.forEach((item) => {
ids.push(item.id)
})
} else {
ids.push(data)
}
if (ids.length === 0) {
this.$message({
message: '请选择需要重置密码的用户!',
showClose: true
})
return
}
this.$confirm(
`<div class="customer-message-wrapper">
<h5 class="title">确定要重置密码吗</h5>
<p class="result">执行后,数据将
<span >无法恢复</span>
</p>
</div>`,
'执行确认',
{
dangerouslyUseHTMLString: true,
customClass: 'customer-delete',
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}
)
.then(() => {
resetPassword(ids).then((res) => {
if (res.status === 1) {
this.$message.success({ message: res.message, showClose: true })
this.getTableList()
} else {
this.$message.error({ message: res.message, showClose: true })
}
})
})
.catch(() => { })
},
//排序
updateOrder (record, operate) {
const findIndex = this.tableData.data.findIndex(item => item.id === record.id)
let swapId = ''
if (operate === 'UP') {
swapId = this.tableData.data[findIndex - 1].id
} else if (operate === 'DOWN') {
swapId = this.tableData.data[findIndex + 1].id
}
updateOrder('/rest/users', record, operate, swapId).then(res => {
if (res.status === 1) {
this.$message.success({ message: res.message, showClose: true })
this.getTableList();
} else {
this.$message.error({ message: res.message, showClose: true })
}
})
},
// 修改人员信息
handleEdit (row) {
console.log("rowwwww", row);
this.isDialog = true
this.$refs.dialogForm.edit(row);
this.$refs.dialogForm.title = "修改";
},
// 删除
handleDelete (id, content) {
this.$confirm(deleteDomStr(content), '执行确认', {
'执行确认',
{
dangerouslyUseHTMLString: true,
customClass: 'customer-delete',
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
deleteAction(`${api.users}/${id}`).then((res) => {
if (res.status === 1) {
this.$message.success({ message: res.message, showClose: true })
} else {
this.$message.error({ message: res.message, showClose: true })
}
}
)
.then(() => {
resetPassword(ids).then((res) => {
if (res.status === 1) {
this.$message.success({ message: res.message, showClose: true })
this.getTableList()
})
} else {
this.$message.error({ message: res.message, showClose: true })
}
})
.catch(() => { })
},
// 新增回显
reloadTableData () {
this.getTableList()
},
})
.catch(() => { })
},
};
//排序
updateOrder (record, operate) {
const findIndex = this.tableData.data.findIndex(item => item.id === record.id)
let swapId = ''
if (operate === 'UP') {
swapId = this.tableData.data[findIndex - 1].id
} else if (operate === 'DOWN') {
swapId = this.tableData.data[findIndex + 1].id
}
updateOrder('/rest/users', record, operate, swapId).then(res => {
if (res.status === 1) {
this.$message.success({ message: res.message, showClose: true })
this.getTableList();
} else {
this.$message.error({ message: res.message, showClose: true })
}
})
},
// 修改人员信息
handleEdit (row) {
console.log("rowwwww", row);
this.isDialog = true
this.$refs.dialogForm.edit(row);
this.$refs.dialogForm.title = "修改";
},
// 删除
handleDelete (id, content) {
this.$confirm(deleteDomStr(content), '执行确认', {
dangerouslyUseHTMLString: true,
customClass: 'customer-delete',
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
deleteAction(`${api.users}/${id}`).then((res) => {
if (res.status === 1) {
this.$message.success({ message: res.message, showClose: true })
} else {
this.$message.error({ message: res.message, showClose: true })
}
this.getTableList()
})
})
.catch(() => { })
},
// 新增回显
reloadTableData () {
this.getTableList()
},
},
};
</script>
<style scoped lang="scss">
@import "~@/styles/mixin.scss";
// .btnColRight {
// height: 30px;
// .button {
// position: absolute;
// left: 30px;
// }
// }
/deep/.el-button.is-disabled.el-button--text {
width: 64px;
height: 28px;
background: rgba(255, 255, 255, 0.1);
border-radius: 16px;
}
@import "~@/styles/mixin.scss";
// .btnColRight {
// height: 30px;
// .button {
// position: absolute;
// left: 30px;
// }
// }
/deep/.el-button.is-disabled.el-button--text {
width: 64px;
height: 28px;
background: rgba(255, 255, 255, 0.1);
border-radius: 16px;
}
</style>
......