19 changed files with 3298 additions and 1683 deletions
@ -1,9 +1,11 @@ |
|||||
import type { App } from 'vue'; |
import type { App } from 'vue'; |
||||
|
|
||||
import { hasPerm } from './permission'; |
import { hasPerm } from './permission'; |
||||
|
import { hasButton } from './permission/button'; |
||||
|
|
||||
// 全局注册 directive
|
// 全局注册 directive
|
||||
export function setupDirective(app: App<Element>) { |
export function setupDirective(app: App<Element>) { |
||||
// 使 v-hasPerm 在所有组件中都可用
|
// 使 v-hasPerm 在所有组件中都可用
|
||||
app.directive('hasPerm', hasPerm); |
app.directive('hasPerm', hasPerm); |
||||
|
app.directive('hasButton', hasButton); |
||||
} |
} |
||||
|
|||||
@ -0,0 +1,23 @@ |
|||||
|
import { Directive, DirectiveBinding } from 'vue'; |
||||
|
import { useUserStore } from "@/store/modules/user"; |
||||
|
|
||||
|
/** |
||||
|
* 按钮权限 |
||||
|
*/ |
||||
|
export const hasButton: Directive = { |
||||
|
mounted(el: HTMLElement, binding: DirectiveBinding) { |
||||
|
const userStore = useUserStore(); |
||||
|
// const { value,oldValue } = binding;
|
||||
|
// console.log("按钮权限",el,"-->",binding,"-->",value,"-->",oldValue,"-->",userStore.myPower);
|
||||
|
console.log("按钮权限",el,"-->",binding,"-->","-->",userStore.myPower); |
||||
|
// if (value) {
|
||||
|
// const requiredPerms = value; // DOM绑定需要的按钮权限标识
|
||||
|
// const hasPerm = userStore.myPower.menuIdAry.some((perm: any) => {
|
||||
|
// return requiredPerms.includes(perm);
|
||||
|
// });
|
||||
|
// if (!hasPerm) {
|
||||
|
// el.parentNode?.removeChild(el);
|
||||
|
// }
|
||||
|
// }
|
||||
|
} |
||||
|
} |
||||
File diff suppressed because it is too large
File diff suppressed because it is too large
File diff suppressed because it is too large
@ -0,0 +1,308 @@ |
|||||
|
<!-- |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-11-26 10:13:15 |
||||
|
@ 备注: 编辑角色使用人 |
||||
|
--> |
||||
|
<script lang='ts' setup> |
||||
|
import type { getSystemPower,AppPowerTree,systemList } from "@/api/system/roleapi/types"; |
||||
|
import { savePickRoleMan,getPowerPageUser,getRolePeople } from "@/api/system/roleapi/postrole"; |
||||
|
import type { TreeInstance } from 'element-plus' |
||||
|
import type {RoleListTree} from '@/api/role/types' |
||||
|
import { Search } from '@element-plus/icons-vue' |
||||
|
import SvgIcon from "@/components/SvgIcon/index.vue"; |
||||
|
|
||||
|
const squareUrl = ref<string>( |
||||
|
"https://cube.elemecdn.com/9/c2/f0ee8a3c7c9638a54940382568c9dpng.png" |
||||
|
); |
||||
|
|
||||
|
const props = defineProps({ |
||||
|
show: { |
||||
|
type: Boolean, |
||||
|
default: false |
||||
|
}, |
||||
|
org: { |
||||
|
type: Array as () => orgInfo[], |
||||
|
default: () => [] |
||||
|
}, |
||||
|
roleInfo: { |
||||
|
type: Object as () => RoleListTree, |
||||
|
default: () => ({}) |
||||
|
} |
||||
|
}) |
||||
|
const userLoading = ref(false) |
||||
|
const emit = defineEmits(['update:show']) |
||||
|
const isShow = computed(() => { |
||||
|
if(props.show){ |
||||
|
getPowerPageUserSub() |
||||
|
getPickUser() |
||||
|
} |
||||
|
return props.show |
||||
|
}) |
||||
|
const roleInfo = computed(() => { |
||||
|
return props.roleInfo |
||||
|
}) |
||||
|
const orgTree = computed(() => { |
||||
|
return props.org |
||||
|
}) |
||||
|
const treeBoxHeightOrg = ref(400) |
||||
|
const treeRefOrgUser = ref<TreeInstance>() |
||||
|
const propsOrg = { |
||||
|
value: 'id', |
||||
|
label: 'name', |
||||
|
// disabled:'status', |
||||
|
children: 'child', |
||||
|
} |
||||
|
const userPage = reactive({ |
||||
|
page: 1, |
||||
|
pageSize: 20, |
||||
|
orgId: '', |
||||
|
name: '', |
||||
|
total: 0 |
||||
|
}) |
||||
|
const userPowerList = ref<systemList>({}) //人员树 |
||||
|
const userPowerListPick = ref<systemList[]>([]) //人员树 |
||||
|
const pickUserKey = ref<string[]>([]) //选择的使用人key |
||||
|
const searchQuery = ref('') //行政组织搜索 |
||||
|
//搜索行政组织 |
||||
|
const onQuePeople = (query: string) => { |
||||
|
console.log(query) |
||||
|
treeRefOrgUser.value!.filter(query) |
||||
|
} |
||||
|
const filterMethodOrg = (query: string, node: any) => { |
||||
|
return node.name!.includes(query) |
||||
|
} |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-11-26 10:19:05 |
||||
|
@ 功能: 关闭弹窗 |
||||
|
*/ |
||||
|
const closeDialog = () => { |
||||
|
emit('update:show', false) |
||||
|
userPowerList.value = |
||||
|
pickUserKey.value=[] |
||||
|
userPowerListPick.value=[] |
||||
|
} |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-11-26 16:32:58 |
||||
|
@ 功能: 选择行政组织 |
||||
|
*/ |
||||
|
const pickOrgTree = (node: any) => { |
||||
|
userPage.page = 1 |
||||
|
userPage.name = '' |
||||
|
userPage.orgId = node.id |
||||
|
console.log(userPage) |
||||
|
getPowerPageUserSub() |
||||
|
} |
||||
|
|
||||
|
const getPowerPageUserSub = () => { |
||||
|
userLoading.value = true |
||||
|
getPowerPageUser(userPage).then(({data})=>{ |
||||
|
console.log("获取平台授权项目用户------->",data) |
||||
|
userPowerList.value = data.list |
||||
|
userPage.total = data.total |
||||
|
userLoading.value = false |
||||
|
}) |
||||
|
} |
||||
|
const pickName = ref("") |
||||
|
const getPickUser = () => { |
||||
|
getRolePeople({ |
||||
|
roleId: roleInfo.value.id*1, |
||||
|
name: pickName.value |
||||
|
}).then(({data})=>{ |
||||
|
console.log("获取角色使用人------->",data) |
||||
|
if(data.list && Array.isArray(data.list)){ |
||||
|
userPowerListPick.value = data.list |
||||
|
}else{ |
||||
|
userPowerListPick.value = [] |
||||
|
} |
||||
|
|
||||
|
pickUserKey.value = data.userKey |
||||
|
}) |
||||
|
} |
||||
|
const pickUserInfo = (item: any) => { |
||||
|
let isPick = true |
||||
|
if(pickUserKey.value.includes(item.id)){ |
||||
|
pickUserKey.value = pickUserKey.value.filter((i) => i !== item.id) |
||||
|
isPick = false |
||||
|
}else{ |
||||
|
pickUserKey.value.push(item.id) |
||||
|
isPick = true |
||||
|
} |
||||
|
if(isPick){ |
||||
|
userPowerListPick.value.push(item) |
||||
|
}else{ |
||||
|
userPowerListPick.value = userPowerListPick.value.filter((i) => i.id !== item.id) |
||||
|
} |
||||
|
} |
||||
|
//判断是否已经选中 |
||||
|
const isPick = (item: any) => { |
||||
|
return pickUserKey.value.includes(item.id) |
||||
|
} |
||||
|
//删除选中的使用人 |
||||
|
const delUserPick = (item: any) => { |
||||
|
pickUserKey.value = pickUserKey.value.filter((i) => i !== item.id) |
||||
|
userPowerListPick.value = userPowerListPick.value.filter((i) => i.id !== item.id) |
||||
|
} |
||||
|
/** |
||||
|
@ 作者: 秦东 |
||||
|
@ 时间: 2025-11-27 10:18:29 |
||||
|
@ 功能: 保存人员 |
||||
|
*/ |
||||
|
const saveRolePeople = () => { |
||||
|
console.log("保存角色使用人------->",roleInfo.value.id*1,pickUserKey.value) |
||||
|
savePickRoleMan({ |
||||
|
roleId: roleInfo.value.id*1, |
||||
|
userKey: pickUserKey.value |
||||
|
}).then((data)=>{ |
||||
|
console.log("保存角色使用人------->",data) |
||||
|
if(data.code === 0){ |
||||
|
ElMessage.success("保存成功") |
||||
|
closeDialog() |
||||
|
}else{ |
||||
|
ElMessage.error(data.msg || "保存失败") |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
onMounted(() => { |
||||
|
getPickUser() |
||||
|
}) |
||||
|
</script> |
||||
|
<template> |
||||
|
<el-dialog |
||||
|
v-model="isShow" |
||||
|
:title="`编辑<<${roleInfo.label}>>角色使用人`" |
||||
|
width="800" |
||||
|
destroy-on-close |
||||
|
:before-close="closeDialog" |
||||
|
> |
||||
|
<el-row class="dialog-row" :gutter="10"> |
||||
|
<el-col :span="8"> |
||||
|
<div class="quan"> |
||||
|
<div class="searchBox"> |
||||
|
<el-input v-model="searchQuery" placeholder="请输入要查找的行政组织" :prefix-icon="Search" @input="onQuePeople" clearable /> |
||||
|
</div> |
||||
|
<el-tree-v2 |
||||
|
ref="treeRefOrgUser" |
||||
|
style="max-width: 100%;" |
||||
|
:data="orgTree" |
||||
|
:props="propsOrg" |
||||
|
:filter-method="filterMethodOrg" |
||||
|
:height="treeBoxHeightOrg" |
||||
|
:v-loading="roleLoading" |
||||
|
:highlight-current="true" |
||||
|
:check-on-click-node="true" |
||||
|
:expand-on-click-node="false" |
||||
|
@node-click="pickOrgTree" |
||||
|
> |
||||
|
</el-tree-v2> |
||||
|
</div> |
||||
|
</el-col> |
||||
|
<el-col :span="9"> |
||||
|
<div class="quan"> |
||||
|
<div class="searchBox"> |
||||
|
<el-input v-model="userPage.name" placeholder="请输入姓名、工号" :prefix-icon="Search" clearable /> |
||||
|
</div> |
||||
|
<el-scrollbar v-loading="userLoading" height="370px"> |
||||
|
<div v-for="item in userPowerList" :key="item.id" :class="isPick(item)?'userBox active':'userBox'" @click="pickUserInfo(item)"> |
||||
|
<el-avatar shape="square" :size="size" :src="item.icon?item.icon:squareUrl" /> |
||||
|
<div class="userInfo"> |
||||
|
<el-text type="primary" >{{ item.name }}({{ item.code }})</el-text> |
||||
|
<el-text type="primary" >{{ item.org }}</el-text> |
||||
|
</div> |
||||
|
<div style="width: 40px;"> |
||||
|
|
||||
|
</div> |
||||
|
</div> |
||||
|
</el-scrollbar> |
||||
|
<div class="paginationBox"> |
||||
|
|
||||
|
<el-pagination |
||||
|
v-model:current-page="userPage.page" |
||||
|
:page-size="userPage.pageSize" |
||||
|
:pager-count="7" |
||||
|
layout="prev, pager, next" |
||||
|
:total="userPage.total" |
||||
|
@change="getPowerPageUserSub" |
||||
|
/> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-col> |
||||
|
<el-col :span="7"> |
||||
|
<div class="quan"> |
||||
|
<div class="searchBox"> |
||||
|
<!-- <el-input v-model="pickName" placeholder="请输入姓名、工号" :prefix-icon="Search" clearable /> --> |
||||
|
已经选择的使用人 |
||||
|
</div> |
||||
|
<el-scrollbar height="415px"> |
||||
|
<div v-for="item in userPowerListPick" :key="item.id" class="userBox" > |
||||
|
<el-avatar shape="square" :size="size" :src="item.icon?item.icon:squareUrl" /> |
||||
|
<div class="userInfo"> |
||||
|
<el-text type="primary" >{{ item.name }}({{ item.code }})</el-text> |
||||
|
<el-text type="primary" >{{ item.org }}</el-text> |
||||
|
</div> |
||||
|
<div> |
||||
|
<svg-icon icon-class="dels" @click="delUserPick(item)" /> |
||||
|
</div> |
||||
|
</div> |
||||
|
</el-scrollbar> |
||||
|
</div> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
<template #footer> |
||||
|
<div class="dialog-footer"> |
||||
|
<el-button @click="closeDialog">取消</el-button> |
||||
|
<el-button type="primary" @click="saveRolePeople"> |
||||
|
确认 |
||||
|
</el-button> |
||||
|
</div> |
||||
|
</template> |
||||
|
</el-dialog> |
||||
|
</template> |
||||
|
<style lang='scss' scoped> |
||||
|
.dialog-row{ |
||||
|
width: 100%; |
||||
|
.quan{ |
||||
|
width: 100%; |
||||
|
border: 1px solid #ccc; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
.searchBox{ |
||||
|
padding: 5px 10px 5px 10px; |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
.userBox{ |
||||
|
width: 100%; |
||||
|
|
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: space-between; |
||||
|
padding: 5px 10px; |
||||
|
border-bottom: 1px dashed rgba($color: #000000, $alpha: 0.2); |
||||
|
|
||||
|
.userInfo{ |
||||
|
width: 60%; |
||||
|
} |
||||
|
div{ |
||||
|
span{ |
||||
|
display: flex; |
||||
|
width: 100%; |
||||
|
padding: 0 5px; |
||||
|
color:rgba($color: #000000, $alpha: 0.6); |
||||
|
} |
||||
|
} |
||||
|
svg{ |
||||
|
cursor: pointer; |
||||
|
color: #FF0000; |
||||
|
} |
||||
|
} |
||||
|
.userBox.active { |
||||
|
background-color: #a0cfff; |
||||
|
} |
||||
|
.paginationBox{ |
||||
|
width: 100%; |
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
} |
||||
|
</style> |
||||
@ -1,248 +0,0 @@ |
|||||
<!-- |
|
||||
@ 作者: 秦东 |
|
||||
@ 时间: 2023-09-26 09:12:55 |
|
||||
@ 备注: 编辑自定义表单数据 |
|
||||
--> |
|
||||
<script lang='ts' setup> |
|
||||
import { ref, reactive, onMounted, computed, nextTick } from 'vue' |
|
||||
import { useRouter } from 'vue-router' |
|
||||
import { |
|
||||
string2json, |
|
||||
stringToObj |
|
||||
} from '@/utils/DesignForm/form' |
|
||||
|
|
||||
import { haveCustomerFormVersion } from '@/api/taskapi/management' |
|
||||
import { judgeSubmitCancel } from '@/api/DesignForm/requestapi' |
|
||||
|
|
||||
import '@/assets/scss/element-var.scss' |
|
||||
import '@/assets/scss/index.scss' |
|
||||
import '@/assets/iconfont/iconfont.css' |
|
||||
import 'element-plus/dist/index.css' |
|
||||
|
|
||||
const props = defineProps({ |
|
||||
iseditopen:{ |
|
||||
type:Boolean, |
|
||||
default:true |
|
||||
}, |
|
||||
versionid:{ |
|
||||
type:String, |
|
||||
default:"" |
|
||||
}, |
|
||||
versiontitle:{ |
|
||||
type:String, |
|
||||
default:"" |
|
||||
}, |
|
||||
masterskey:{ |
|
||||
type:String, |
|
||||
default:"" |
|
||||
}, |
|
||||
infoid:{ |
|
||||
type:String, |
|
||||
default:"" |
|
||||
}, |
|
||||
drawerwith:{ |
|
||||
type:Number, |
|
||||
default:0 |
|
||||
} |
|
||||
}) |
|
||||
const submitButton = { |
|
||||
type: "div", |
|
||||
control:{}, |
|
||||
config:{ |
|
||||
textAlign: "center", |
|
||||
span: "" |
|
||||
}, |
|
||||
list: [ |
|
||||
{ |
|
||||
type: "button", |
|
||||
control:{ |
|
||||
label: "保存", |
|
||||
type: "primary", |
|
||||
key: "submit" |
|
||||
}, |
|
||||
config:{ |
|
||||
textAlign: "center" |
|
||||
} |
|
||||
} |
|
||||
] |
|
||||
} |
|
||||
const cancelButton = { |
|
||||
type: "div", |
|
||||
control:{}, |
|
||||
config:{ |
|
||||
textAlign: "center", |
|
||||
span: "" |
|
||||
}, |
|
||||
list: [ |
|
||||
{ |
|
||||
type: "button", |
|
||||
control:{ |
|
||||
label: "返回", |
|
||||
type: "danger", |
|
||||
key: "cancel" |
|
||||
}, |
|
||||
config:{ |
|
||||
textAlign: "center" |
|
||||
} |
|
||||
} |
|
||||
] |
|
||||
} |
|
||||
const submitAndCancelButton = { |
|
||||
type: "div", |
|
||||
control:{}, |
|
||||
config:{ |
|
||||
span: 24, |
|
||||
textAlign: "center" |
|
||||
}, |
|
||||
list: [ |
|
||||
{ |
|
||||
type: "button", |
|
||||
control:{ |
|
||||
label: "保存", |
|
||||
type: "primary", |
|
||||
key: "submit" |
|
||||
}, |
|
||||
config:{ |
|
||||
span: 0 |
|
||||
} |
|
||||
}, |
|
||||
{ |
|
||||
type: "button", |
|
||||
control:{ |
|
||||
label: "返回", |
|
||||
type: "danger", |
|
||||
key: "cancel" |
|
||||
}, |
|
||||
config:{ |
|
||||
span: 0 |
|
||||
} |
|
||||
} |
|
||||
] |
|
||||
}; |
|
||||
const loadingData = ref(false) |
|
||||
const formEl = ref() |
|
||||
const state = reactive<any>({ |
|
||||
type: 1, // 1新增;2修改;3查看(表单模式) ;4查看; 5设计 |
|
||||
formData: { |
|
||||
list: [], |
|
||||
form: {}, |
|
||||
config: {} |
|
||||
}, |
|
||||
dict: {}, |
|
||||
formId: props.versionid, |
|
||||
id: props.masterskey, |
|
||||
loading: true |
|
||||
}) |
|
||||
const formType = computed(() => { |
|
||||
// 带有参数id为编辑状态 |
|
||||
if (props.infoid) { |
|
||||
return 2 |
|
||||
} else { |
|
||||
return 1 |
|
||||
} |
|
||||
}) |
|
||||
const emits = defineEmits(["update:iseditopen","searchquery"]); |
|
||||
const isShow = computed({ |
|
||||
get: () => props.iseditopen, |
|
||||
set: (val) => { |
|
||||
emits("update:iseditopen", val); |
|
||||
}, |
|
||||
}); |
|
||||
//获取表单数据 |
|
||||
const getTaskFormData = () =>{ |
|
||||
loadingData.value = true; |
|
||||
haveCustomerFormVersion({id:props.versionid}) |
|
||||
.then(({ data }) =>{ |
|
||||
// console.log("表单数据",data) |
|
||||
state.id=props.versionid |
|
||||
state.formData = stringToObj(data.mastesform) |
|
||||
state.dict = string2json(data.dict) |
|
||||
|
|
||||
judgeSubmitCancel({"name":data.mastesformjson}) |
|
||||
.then((data:any) =>{ |
|
||||
if(data.code == 0){ |
|
||||
if (data.data == 3 || data.data == 4){ |
|
||||
state.formData.list.push(submitButton) |
|
||||
} |
|
||||
} |
|
||||
}) |
|
||||
}) |
|
||||
.finally(()=>{ |
|
||||
formEl.value.getData({ formId: props.versionid, id: props.masterskey}) |
|
||||
loadingData.value = false; |
|
||||
}) |
|
||||
} |
|
||||
|
|
||||
const drawerWith = ref<number>(0); |
|
||||
onMounted(()=>{ |
|
||||
drawerWith.value = window.innerWidth - 220 |
|
||||
|
|
||||
}); |
|
||||
window.addEventListener("resize", function(){ |
|
||||
drawerWith.value = window.innerWidth -220 |
|
||||
}) |
|
||||
const beforeSubmit = (params: any) => { |
|
||||
params.formId = props.masterskey |
|
||||
params.id = props.versionid |
|
||||
// emits("update:isopen", false); |
|
||||
// console.log(params,"===========================>") |
|
||||
return params |
|
||||
} |
|
||||
const afterSubmit = (type: string) => { |
|
||||
if (type === 'success') { |
|
||||
// router.go(-1) |
|
||||
// console.log("表单提交成功") |
|
||||
emits("searchquery"); |
|
||||
closeAppSubmit(); |
|
||||
|
|
||||
} |
|
||||
} |
|
||||
const closeAppSubmit = () => { |
|
||||
emits("update:iseditopen", false); |
|
||||
initData(); |
|
||||
} |
|
||||
const initData = () => { |
|
||||
state.formData = { |
|
||||
list: [], |
|
||||
form: {}, |
|
||||
config: {} |
|
||||
}; |
|
||||
state.dict = {}; |
|
||||
state.formId = 0; |
|
||||
state.id = 0; |
|
||||
state.loading = true; |
|
||||
} |
|
||||
watch(()=>props.iseditopen,()=>{ |
|
||||
if(props.iseditopen){ |
|
||||
getTaskFormData(); |
|
||||
}else{ |
|
||||
initData() |
|
||||
} |
|
||||
}) |
|
||||
const changeKeyVal = (key:any,val:any,type:any,attribute:any) => { |
|
||||
|
|
||||
} |
|
||||
</script> |
|
||||
<template> |
|
||||
<el-drawer v-model="isShow" v-loading="loadingData" :title="versiontitle" :close-on-click-modal="false" :close-on-press-escape="false" :destroy-on-close="true" :size="props.drawerwith" class="drawerClass" > |
|
||||
<div class="drawerBody"> |
|
||||
<ak-form |
|
||||
ref="formEl" |
|
||||
:form-data="state.formData" |
|
||||
:type="formType" |
|
||||
:dict="state.dict" |
|
||||
request-url="getFormContent" |
|
||||
add-url="saveFormContent" |
|
||||
edit-url="editFormContent" |
|
||||
:before-submit="beforeSubmit" |
|
||||
:after-submit="afterSubmit" |
|
||||
:close-app-submit="closeAppSubmit" |
|
||||
:change-key-val="changeKeyVal" |
|
||||
/> |
|
||||
</div> |
|
||||
|
|
||||
</el-drawer> |
|
||||
</template> |
|
||||
<style lang='scss' scoped> |
|
||||
|
|
||||
</style> |
|
||||
File diff suppressed because one or more lines are too long
Loading…
Reference in new issue