mirror of
https://github.com/certd/certd.git
synced 2026-05-16 21:27:34 +08:00
chore: code format
This commit is contained in:
xiaojunnuo
@@ -4,14 +4,14 @@ export async function GetList(query: any) {
|
||||
return await request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "post",
|
||||
data: query
|
||||
data: query,
|
||||
});
|
||||
}
|
||||
|
||||
export async function GetTree() {
|
||||
return await request({
|
||||
url: apiPrefix + "/tree",
|
||||
method: "post"
|
||||
method: "post",
|
||||
});
|
||||
}
|
||||
|
||||
@@ -19,7 +19,7 @@ export async function AddObj(obj: any) {
|
||||
return await request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
data: obj
|
||||
data: obj,
|
||||
});
|
||||
}
|
||||
|
||||
@@ -27,7 +27,7 @@ export async function UpdateObj(obj: any) {
|
||||
return await request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
data: obj
|
||||
data: obj,
|
||||
});
|
||||
}
|
||||
|
||||
@@ -35,7 +35,7 @@ export async function DelObj(id: any) {
|
||||
return await request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
params: { id }
|
||||
params: { id },
|
||||
});
|
||||
}
|
||||
|
||||
@@ -43,6 +43,6 @@ export async function GetObj(id: any) {
|
||||
return await request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "post",
|
||||
params: { id }
|
||||
params: { id },
|
||||
});
|
||||
}
|
||||
|
||||
@@ -3,150 +3,149 @@ import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, Edi
|
||||
import { useI18n } from "vue-i18n";
|
||||
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const { t } = useI18n();
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
const list = await api.GetTree();
|
||||
const { t } = useI18n();
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
const list = await api.GetTree();
|
||||
|
||||
return {
|
||||
offset: 0,
|
||||
records: list,
|
||||
total: 10000,
|
||||
limit: 10000
|
||||
};
|
||||
};
|
||||
return {
|
||||
offset: 0,
|
||||
records: list,
|
||||
total: 10000,
|
||||
limit: 10000,
|
||||
};
|
||||
};
|
||||
|
||||
async function afterChange() {
|
||||
await permissionTreeDict.reloadDict();
|
||||
}
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
const ret = await api.UpdateObj(form);
|
||||
await afterChange();
|
||||
return ret;
|
||||
};
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
const ret = await api.DelObj(row.id);
|
||||
await afterChange();
|
||||
return ret;
|
||||
};
|
||||
async function afterChange() {
|
||||
await permissionTreeDict.reloadDict();
|
||||
}
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
const ret = await api.UpdateObj(form);
|
||||
await afterChange();
|
||||
return ret;
|
||||
};
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
const ret = await api.DelObj(row.id);
|
||||
await afterChange();
|
||||
return ret;
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
const ret = await api.AddObj(form);
|
||||
await afterChange();
|
||||
return ret;
|
||||
};
|
||||
const permissionTreeDict = dict({
|
||||
url: "/sys/authority/permission/tree",
|
||||
isTree: true,
|
||||
value: "id",
|
||||
label: "title",
|
||||
async onReady({ dict }: any) {
|
||||
dict.setData([{ id: -1, title: t("certd.rootNode"), children: dict.data }]);
|
||||
}
|
||||
});
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
pageRequest,
|
||||
addRequest,
|
||||
editRequest,
|
||||
delRequest
|
||||
},
|
||||
actionbar: {
|
||||
show: false
|
||||
},
|
||||
toolbar: {
|
||||
show: false
|
||||
},
|
||||
table: {
|
||||
show: false
|
||||
// scroll: { fixed: true }
|
||||
},
|
||||
rowHandle: {
|
||||
fixed: "right"
|
||||
},
|
||||
search: {
|
||||
show: false
|
||||
},
|
||||
pagination: {
|
||||
show: false,
|
||||
pageSize: 100000
|
||||
},
|
||||
columns: {
|
||||
id: {
|
||||
title: "id",
|
||||
type: "number",
|
||||
form: { show: false }, // 表单配置
|
||||
column: {
|
||||
width: 120,
|
||||
sortable: "custom"
|
||||
}
|
||||
},
|
||||
title: {
|
||||
title: t("certd.permissionName"),
|
||||
type: "text",
|
||||
form: {
|
||||
rules: [
|
||||
{ required: true, message: t("certd.enterPermissionName") },
|
||||
{ max: 50, message: t("certd.max50Chars") }
|
||||
],
|
||||
component: {
|
||||
placeholder: t("certd.permissionName")
|
||||
}
|
||||
},
|
||||
column: {
|
||||
width: 200
|
||||
}
|
||||
},
|
||||
permission: {
|
||||
title: t("certd.permissionCode"),
|
||||
type: "text",
|
||||
column: {
|
||||
width: 170
|
||||
},
|
||||
form: {
|
||||
rules: [
|
||||
{ required: true, message: t("certd.enterPermissionCode") },
|
||||
{ max: 100, message: t("certd.max100Chars") }
|
||||
],
|
||||
component: {
|
||||
placeholder: t("certd.examplePermissionCode")
|
||||
}
|
||||
}
|
||||
},
|
||||
sort: {
|
||||
title: t("certd.sortOrder"),
|
||||
type: "number",
|
||||
column: {
|
||||
width: 100
|
||||
},
|
||||
form: {
|
||||
value: 100,
|
||||
rules: [{ required: true, type: "number", message: t("certd.sortRequired") }]
|
||||
}
|
||||
},
|
||||
parentId: {
|
||||
title: t("certd.parentNode"),
|
||||
type: "dict-tree",
|
||||
column: {
|
||||
width: 100
|
||||
},
|
||||
dict: permissionTreeDict,
|
||||
form: {
|
||||
value: -1,
|
||||
component: {
|
||||
multiple: false,
|
||||
defaultExpandAll: true,
|
||||
dict: { cache: false },
|
||||
fieldNames: {
|
||||
value: "id",
|
||||
label: "title"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
};
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
const ret = await api.AddObj(form);
|
||||
await afterChange();
|
||||
return ret;
|
||||
};
|
||||
const permissionTreeDict = dict({
|
||||
url: "/sys/authority/permission/tree",
|
||||
isTree: true,
|
||||
value: "id",
|
||||
label: "title",
|
||||
async onReady({ dict }: any) {
|
||||
dict.setData([{ id: -1, title: t("certd.rootNode"), children: dict.data }]);
|
||||
},
|
||||
});
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
pageRequest,
|
||||
addRequest,
|
||||
editRequest,
|
||||
delRequest,
|
||||
},
|
||||
actionbar: {
|
||||
show: false,
|
||||
},
|
||||
toolbar: {
|
||||
show: false,
|
||||
},
|
||||
table: {
|
||||
show: false,
|
||||
// scroll: { fixed: true }
|
||||
},
|
||||
rowHandle: {
|
||||
fixed: "right",
|
||||
},
|
||||
search: {
|
||||
show: false,
|
||||
},
|
||||
pagination: {
|
||||
show: false,
|
||||
pageSize: 100000,
|
||||
},
|
||||
columns: {
|
||||
id: {
|
||||
title: "id",
|
||||
type: "number",
|
||||
form: { show: false }, // 表单配置
|
||||
column: {
|
||||
width: 120,
|
||||
sortable: "custom",
|
||||
},
|
||||
},
|
||||
title: {
|
||||
title: t("certd.permissionName"),
|
||||
type: "text",
|
||||
form: {
|
||||
rules: [
|
||||
{ required: true, message: t("certd.enterPermissionName") },
|
||||
{ max: 50, message: t("certd.max50Chars") },
|
||||
],
|
||||
component: {
|
||||
placeholder: t("certd.permissionName"),
|
||||
},
|
||||
},
|
||||
column: {
|
||||
width: 200,
|
||||
},
|
||||
},
|
||||
permission: {
|
||||
title: t("certd.permissionCode"),
|
||||
type: "text",
|
||||
column: {
|
||||
width: 170,
|
||||
},
|
||||
form: {
|
||||
rules: [
|
||||
{ required: true, message: t("certd.enterPermissionCode") },
|
||||
{ max: 100, message: t("certd.max100Chars") },
|
||||
],
|
||||
component: {
|
||||
placeholder: t("certd.examplePermissionCode"),
|
||||
},
|
||||
},
|
||||
},
|
||||
sort: {
|
||||
title: t("certd.sortOrder"),
|
||||
type: "number",
|
||||
column: {
|
||||
width: 100,
|
||||
},
|
||||
form: {
|
||||
value: 100,
|
||||
rules: [{ required: true, type: "number", message: t("certd.sortRequired") }],
|
||||
},
|
||||
},
|
||||
parentId: {
|
||||
title: t("certd.parentNode"),
|
||||
type: "dict-tree",
|
||||
column: {
|
||||
width: 100,
|
||||
},
|
||||
dict: permissionTreeDict,
|
||||
form: {
|
||||
value: -1,
|
||||
component: {
|
||||
multiple: false,
|
||||
defaultExpandAll: true,
|
||||
dict: { cache: false },
|
||||
fieldNames: {
|
||||
value: "id",
|
||||
label: "title",
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
+174
-168
@@ -1,20 +1,27 @@
|
||||
<template>
|
||||
<a-tree v-if="computedTree" ref="treeRef" class="fs-permission-tree" :class="{ 'is-editable': editable }"
|
||||
:selectable="false" show-line :show-icon="false" :default-expand-all="true" :tree-data="computedTree"
|
||||
@check="onChecked">
|
||||
<template #title="scope">
|
||||
<div class="node-title-pane">
|
||||
<div class="node-title">{{ scope.title }}</div>
|
||||
<div v-if="editable === true" class="node-suffix">
|
||||
<fs-icon v-if="actions.add !== false" :icon="$fsui.icons.add" @click.stop="add(scope)" />
|
||||
<fs-icon v-if="actions.edit !== false && scope.id !== -1" :icon="$fsui.icons.edit"
|
||||
@click.stop="edit(scope)" />
|
||||
<fs-icon v-if="actions.remove !== false && scope.id !== -1" :icon="$fsui.icons.remove"
|
||||
@click.stop="remove(scope)" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</a-tree>
|
||||
<a-tree
|
||||
v-if="computedTree"
|
||||
ref="treeRef"
|
||||
class="fs-permission-tree"
|
||||
:class="{ 'is-editable': editable }"
|
||||
:selectable="false"
|
||||
show-line
|
||||
:show-icon="false"
|
||||
:default-expand-all="true"
|
||||
:tree-data="computedTree"
|
||||
@check="onChecked"
|
||||
>
|
||||
<template #title="scope">
|
||||
<div class="node-title-pane">
|
||||
<div class="node-title">{{ scope.title }}</div>
|
||||
<div v-if="editable === true" class="node-suffix">
|
||||
<fs-icon v-if="actions.add !== false" :icon="$fsui.icons.add" @click.stop="add(scope)" />
|
||||
<fs-icon v-if="actions.edit !== false && scope.id !== -1" :icon="$fsui.icons.edit" @click.stop="edit(scope)" />
|
||||
<fs-icon v-if="actions.remove !== false && scope.id !== -1" :icon="$fsui.icons.remove" @click.stop="remove(scope)" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</a-tree>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
@@ -24,171 +31,170 @@ import { computed, defineComponent, ref } from "vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
|
||||
export default defineComponent({
|
||||
name: "FsPermissionTree",
|
||||
props: {
|
||||
/**
|
||||
* 树形数据
|
||||
* */
|
||||
tree: {},
|
||||
/**
|
||||
* 是否可编辑
|
||||
*/
|
||||
editable: {
|
||||
default: true
|
||||
},
|
||||
actions: {
|
||||
default: {}
|
||||
}
|
||||
} as any,
|
||||
emits: ["add", "edit", "remove"],
|
||||
setup(props: any, ctx) {
|
||||
const { t } = useI18n();
|
||||
const treeRef = ref();
|
||||
const computedTree = computed(() => {
|
||||
if (props.tree == null) {
|
||||
return null;
|
||||
}
|
||||
const clone = cloneDeep(props.tree);
|
||||
utils.deepdash.forEachDeep(clone, (value: any, key: any, pNode: any, context: any) => {
|
||||
if (value == null) {
|
||||
return;
|
||||
}
|
||||
if (!(value instanceof Object) || value instanceof Array) {
|
||||
return;
|
||||
}
|
||||
if (value.class === "is-leaf") {
|
||||
//处理过，无需再次处理
|
||||
return;
|
||||
}
|
||||
value.class = "is-twig";
|
||||
if (value.children != null && value.children.length > 0) {
|
||||
return;
|
||||
}
|
||||
const parents = context.parents;
|
||||
if (parents.length < 2) {
|
||||
return;
|
||||
}
|
||||
const parent = parents[parents.length - 2].value;
|
||||
//看parent下面的children，是否全部都没有children
|
||||
for (const child of parent.children) {
|
||||
if (child.children != null && child.children.length > 0) {
|
||||
//存在child有children
|
||||
return;
|
||||
}
|
||||
}
|
||||
// 所有的子节点都没有children
|
||||
parent.class = "is-twig"; // 连接叶子节点的末梢枝杈节点
|
||||
let i = 0;
|
||||
for (const child of parent.children) {
|
||||
child.class = "is-leaf";
|
||||
if (i !== 0) {
|
||||
child.class += " leaf-after";
|
||||
}
|
||||
i++;
|
||||
}
|
||||
});
|
||||
return [
|
||||
{
|
||||
title: t("certd.rootNode"),
|
||||
id: -1,
|
||||
children: clone
|
||||
}
|
||||
];
|
||||
});
|
||||
function add(scope: any) {
|
||||
ctx.emit("add", scope.dataRef);
|
||||
}
|
||||
function edit(scope: any) {
|
||||
ctx.emit("edit", scope.dataRef);
|
||||
}
|
||||
function remove(scope: any) {
|
||||
ctx.emit("remove", scope.dataRef);
|
||||
}
|
||||
function onChecked(a: any, b: any, c: any) {
|
||||
utils.logger.info("chedcked", a, b, c);
|
||||
}
|
||||
function getChecked() {
|
||||
const checked = treeRef.value.checkedKeys;
|
||||
const halfChecked = treeRef.value.halfCheckedKeys;
|
||||
return {
|
||||
checked,
|
||||
halfChecked
|
||||
};
|
||||
}
|
||||
return {
|
||||
computedTree,
|
||||
add,
|
||||
edit,
|
||||
remove,
|
||||
treeRef,
|
||||
onChecked,
|
||||
getChecked,
|
||||
t
|
||||
};
|
||||
}
|
||||
name: "FsPermissionTree",
|
||||
props: {
|
||||
/**
|
||||
* 树形数据
|
||||
* */
|
||||
tree: {},
|
||||
/**
|
||||
* 是否可编辑
|
||||
*/
|
||||
editable: {
|
||||
default: true,
|
||||
},
|
||||
actions: {
|
||||
default: {},
|
||||
},
|
||||
} as any,
|
||||
emits: ["add", "edit", "remove"],
|
||||
setup(props: any, ctx) {
|
||||
const { t } = useI18n();
|
||||
const treeRef = ref();
|
||||
const computedTree = computed(() => {
|
||||
if (props.tree == null) {
|
||||
return null;
|
||||
}
|
||||
const clone = cloneDeep(props.tree);
|
||||
utils.deepdash.forEachDeep(clone, (value: any, key: any, pNode: any, context: any) => {
|
||||
if (value == null) {
|
||||
return;
|
||||
}
|
||||
if (!(value instanceof Object) || value instanceof Array) {
|
||||
return;
|
||||
}
|
||||
if (value.class === "is-leaf") {
|
||||
//处理过，无需再次处理
|
||||
return;
|
||||
}
|
||||
value.class = "is-twig";
|
||||
if (value.children != null && value.children.length > 0) {
|
||||
return;
|
||||
}
|
||||
const parents = context.parents;
|
||||
if (parents.length < 2) {
|
||||
return;
|
||||
}
|
||||
const parent = parents[parents.length - 2].value;
|
||||
//看parent下面的children，是否全部都没有children
|
||||
for (const child of parent.children) {
|
||||
if (child.children != null && child.children.length > 0) {
|
||||
//存在child有children
|
||||
return;
|
||||
}
|
||||
}
|
||||
// 所有的子节点都没有children
|
||||
parent.class = "is-twig"; // 连接叶子节点的末梢枝杈节点
|
||||
let i = 0;
|
||||
for (const child of parent.children) {
|
||||
child.class = "is-leaf";
|
||||
if (i !== 0) {
|
||||
child.class += " leaf-after";
|
||||
}
|
||||
i++;
|
||||
}
|
||||
});
|
||||
return [
|
||||
{
|
||||
title: t("certd.rootNode"),
|
||||
id: -1,
|
||||
children: clone,
|
||||
},
|
||||
];
|
||||
});
|
||||
function add(scope: any) {
|
||||
ctx.emit("add", scope.dataRef);
|
||||
}
|
||||
function edit(scope: any) {
|
||||
ctx.emit("edit", scope.dataRef);
|
||||
}
|
||||
function remove(scope: any) {
|
||||
ctx.emit("remove", scope.dataRef);
|
||||
}
|
||||
function onChecked(a: any, b: any, c: any) {
|
||||
utils.logger.info("chedcked", a, b, c);
|
||||
}
|
||||
function getChecked() {
|
||||
const checked = treeRef.value.checkedKeys;
|
||||
const halfChecked = treeRef.value.halfCheckedKeys;
|
||||
return {
|
||||
checked,
|
||||
halfChecked,
|
||||
};
|
||||
}
|
||||
return {
|
||||
computedTree,
|
||||
add,
|
||||
edit,
|
||||
remove,
|
||||
treeRef,
|
||||
onChecked,
|
||||
getChecked,
|
||||
t,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.fs-permission-tree {
|
||||
.ant-tree-list-holder-inner {
|
||||
flex-direction: row !important;
|
||||
flex-wrap: wrap;
|
||||
.ant-tree-list-holder-inner {
|
||||
flex-direction: row !important;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.is-twig {
|
||||
width: 100%;
|
||||
}
|
||||
.is-twig {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.is-leaf {
|
||||
.is-leaf {
|
||||
//border-bottom: 1px solid #ddd;
|
||||
&::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
//border-bottom: 1px solid #ddd;
|
||||
&::before {
|
||||
display: none;
|
||||
}
|
||||
&.leaf-after {
|
||||
.ant-tree-indent-unit {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
&.leaf-after {
|
||||
.ant-tree-indent-unit {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.node-title-pane {
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.node-title-pane {
|
||||
border-bottom: 1px solid #ddd;
|
||||
}
|
||||
}
|
||||
}
|
||||
//.is-twig ul {
|
||||
// display: flex;
|
||||
// flex-wrap: wrap;
|
||||
//}
|
||||
.node-title-pane {
|
||||
display: flex;
|
||||
|
||||
//.is-twig ul {
|
||||
// display: flex;
|
||||
// flex-wrap: wrap;
|
||||
//}
|
||||
.node-title-pane {
|
||||
display: flex;
|
||||
.node-title {
|
||||
width: 110px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
.node-title {
|
||||
width: 110px;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
&.is-editable {
|
||||
.ant-tree-title {
|
||||
&:hover {
|
||||
.node-suffix {
|
||||
visibility: visible;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.is-editable {
|
||||
.ant-tree-title {
|
||||
&:hover {
|
||||
.node-suffix {
|
||||
visibility: visible;
|
||||
}
|
||||
}
|
||||
}
|
||||
.node-suffix {
|
||||
visibility: hidden;
|
||||
|
||||
.node-suffix {
|
||||
visibility: hidden;
|
||||
|
||||
>* {
|
||||
margin-left: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
> * {
|
||||
margin-left: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,20 +1,18 @@
|
||||
<template>
|
||||
<fs-page>
|
||||
<template #header>
|
||||
<div class="title">{{ t("certd.permissionManagement") }}</div>
|
||||
</template>
|
||||
<fs-crud ref="crudRef" v-bind="crudBinding">
|
||||
<a-button v-permission="'1sys:auth:per:add'" style="margin-left: 20px" @click="addHandle({})">
|
||||
<fs-icon :icon="ui.icons.add"></fs-icon>
|
||||
{{ t("certd.adda") }}
|
||||
</a-button>
|
||||
<fs-permission-tree class="permission-tree mt-10" :tree="crudBinding.data" :checkable="false"
|
||||
:actions="permission" @add="addHandle" @edit="editHandle" @remove="removeHandle"></fs-permission-tree>
|
||||
</fs-crud>
|
||||
</fs-page>
|
||||
<fs-page>
|
||||
<template #header>
|
||||
<div class="title">{{ t("certd.permissionManagement") }}</div>
|
||||
</template>
|
||||
<fs-crud ref="crudRef" v-bind="crudBinding">
|
||||
<a-button v-permission="'1sys:auth:per:add'" style="margin-left: 20px" @click="addHandle({})">
|
||||
<fs-icon :icon="ui.icons.add"></fs-icon>
|
||||
{{ t("certd.adda") }}
|
||||
</a-button>
|
||||
<fs-permission-tree class="permission-tree mt-10" :tree="crudBinding.data" :checkable="false" :actions="permission" @add="addHandle" @edit="editHandle" @remove="removeHandle"></fs-permission-tree>
|
||||
</fs-crud>
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, onActivated, onMounted, ref } from "vue";
|
||||
import createCrudOptions from "./crud.js";
|
||||
@@ -24,58 +22,58 @@ import { useFs, useUi } from "@fast-crud/fast-crud";
|
||||
import { useI18n } from "vue-i18n";
|
||||
|
||||
export default defineComponent({
|
||||
name: "AuthorityManager",
|
||||
components: { FsPermissionTree },
|
||||
setup() {
|
||||
// 此处传入permission进行通用按钮权限设置，会通过commonOptions去设置actionbar和rowHandle的按钮的show属性
|
||||
// 更多关于按钮权限的源代码设置，请参考 ./src/plugin/fast-crud/index.js （75-77行）
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions, context: { permission: "sys:auth:per" } });
|
||||
const { t } = useI18n();
|
||||
name: "AuthorityManager",
|
||||
components: { FsPermissionTree },
|
||||
setup() {
|
||||
// 此处传入permission进行通用按钮权限设置，会通过commonOptions去设置actionbar和rowHandle的按钮的show属性
|
||||
// 更多关于按钮权限的源代码设置，请参考 ./src/plugin/fast-crud/index.js （75-77行）
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions, context: { permission: "sys:auth:per" } });
|
||||
const { t } = useI18n();
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(async () => {
|
||||
await crudExpose.doRefresh();
|
||||
});
|
||||
onActivated(async () => {
|
||||
await crudExpose.doRefresh();
|
||||
});
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(async () => {
|
||||
await crudExpose.doRefresh();
|
||||
});
|
||||
onActivated(async () => {
|
||||
await crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
const { ui } = useUi();
|
||||
const { ui } = useUi();
|
||||
|
||||
//用户业务代码
|
||||
//用户业务代码
|
||||
|
||||
async function addHandle(item: any) {
|
||||
await crudExpose.openAdd({ row: { parentId: item?.id ?? -1 } });
|
||||
}
|
||||
async function editHandle(item: any) {
|
||||
await crudExpose.openEdit({ row: item });
|
||||
}
|
||||
async function removeHandle(item: any) {
|
||||
await crudExpose.doRemove({ row: { id: item.id }, index: null });
|
||||
}
|
||||
async function addHandle(item: any) {
|
||||
await crudExpose.openAdd({ row: { parentId: item?.id ?? -1 } });
|
||||
}
|
||||
async function editHandle(item: any) {
|
||||
await crudExpose.openEdit({ row: item });
|
||||
}
|
||||
async function removeHandle(item: any) {
|
||||
await crudExpose.doRemove({ row: { id: item.id }, index: null });
|
||||
}
|
||||
|
||||
const { hasPermissions } = usePermission();
|
||||
const permission = ref({
|
||||
add: hasPermissions("1sys:auth:per:add"),
|
||||
edit: hasPermissions("1sys:auth:per:edit"),
|
||||
remove: hasPermissions("1sys:auth:per:remove"),
|
||||
});
|
||||
const { hasPermissions } = usePermission();
|
||||
const permission = ref({
|
||||
add: hasPermissions("1sys:auth:per:add"),
|
||||
edit: hasPermissions("1sys:auth:per:edit"),
|
||||
remove: hasPermissions("1sys:auth:per:remove"),
|
||||
});
|
||||
|
||||
return {
|
||||
ui,
|
||||
crudBinding,
|
||||
crudRef,
|
||||
addHandle,
|
||||
editHandle,
|
||||
removeHandle,
|
||||
permission,
|
||||
t
|
||||
};
|
||||
},
|
||||
return {
|
||||
ui,
|
||||
crudBinding,
|
||||
crudRef,
|
||||
addHandle,
|
||||
editHandle,
|
||||
removeHandle,
|
||||
permission,
|
||||
t,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
<style lang="less">
|
||||
.permission-tree {
|
||||
margin-left: 20px;
|
||||
margin-left: 20px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -4,7 +4,7 @@ export async function GetList(query: any) {
|
||||
return await request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "post",
|
||||
data: query
|
||||
data: query,
|
||||
});
|
||||
}
|
||||
|
||||
@@ -12,7 +12,7 @@ export async function AddObj(obj: any) {
|
||||
return await request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
data: obj
|
||||
data: obj,
|
||||
});
|
||||
}
|
||||
|
||||
@@ -20,7 +20,7 @@ export async function UpdateObj(obj: any) {
|
||||
return await request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
data: obj
|
||||
data: obj,
|
||||
});
|
||||
}
|
||||
|
||||
@@ -28,7 +28,7 @@ export async function DelObj(id: any) {
|
||||
return await request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
params: { id }
|
||||
params: { id },
|
||||
});
|
||||
}
|
||||
|
||||
@@ -36,7 +36,7 @@ export async function GetObj(id: any) {
|
||||
return await request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "post",
|
||||
params: { id }
|
||||
params: { id },
|
||||
});
|
||||
}
|
||||
|
||||
@@ -50,7 +50,7 @@ export async function getPermissionIds(roleId: any) {
|
||||
return await request({
|
||||
url: apiPrefix + "/getPermissionIds",
|
||||
method: "post",
|
||||
params: { id: roleId }
|
||||
params: { id: roleId },
|
||||
});
|
||||
}
|
||||
|
||||
@@ -65,6 +65,6 @@ export async function DoAuthz(roleId: any, permissionIds: any) {
|
||||
return await request({
|
||||
url: apiPrefix + "/authz",
|
||||
method: "post",
|
||||
data: { roleId, permissionIds }
|
||||
data: { roleId, permissionIds },
|
||||
});
|
||||
}
|
||||
|
||||
@@ -3,84 +3,84 @@ import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, EditReq,
|
||||
import { useI18n } from "vue-i18n";
|
||||
|
||||
export default function ({ crudExpose, context: { authz } }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const { t } = useI18n();
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
const { t } = useI18n();
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
pageRequest,
|
||||
addRequest,
|
||||
editRequest,
|
||||
delRequest
|
||||
},
|
||||
rowHandle: {
|
||||
width: 300,
|
||||
buttons: {
|
||||
authz: {
|
||||
type: "link",
|
||||
text: "授权",
|
||||
async click(context) {
|
||||
await authz.authzOpen(context.record.id);
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
columns: {
|
||||
id: {
|
||||
title: "id",
|
||||
type: "text",
|
||||
form: { show: false }, // 表单配置
|
||||
column: {
|
||||
width: 70,
|
||||
sorter: true
|
||||
}
|
||||
},
|
||||
name: {
|
||||
title: t("certd.roleName"),
|
||||
type: "text",
|
||||
search: { show: true },
|
||||
form: {
|
||||
rules: [
|
||||
{ required: true, message: t("certd.enterRoleName") },
|
||||
{ max: 50, message: t("certd.max50Chars") }
|
||||
]
|
||||
}, // 表单配置
|
||||
column: {
|
||||
sorter: true
|
||||
}
|
||||
},
|
||||
createTime: {
|
||||
title: t("certd.createTime"),
|
||||
type: "datetime",
|
||||
column: {
|
||||
sorter: true
|
||||
},
|
||||
form: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
updateTime: {
|
||||
title: t("certd.updateTime"),
|
||||
type: "datetime",
|
||||
column: {
|
||||
sorter: true
|
||||
},
|
||||
form: { show: false } // 表单配置
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
pageRequest,
|
||||
addRequest,
|
||||
editRequest,
|
||||
delRequest,
|
||||
},
|
||||
rowHandle: {
|
||||
width: 300,
|
||||
buttons: {
|
||||
authz: {
|
||||
type: "link",
|
||||
text: "授权",
|
||||
async click(context) {
|
||||
await authz.authzOpen(context.record.id);
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
columns: {
|
||||
id: {
|
||||
title: "id",
|
||||
type: "text",
|
||||
form: { show: false }, // 表单配置
|
||||
column: {
|
||||
width: 70,
|
||||
sorter: true,
|
||||
},
|
||||
},
|
||||
name: {
|
||||
title: t("certd.roleName"),
|
||||
type: "text",
|
||||
search: { show: true },
|
||||
form: {
|
||||
rules: [
|
||||
{ required: true, message: t("certd.enterRoleName") },
|
||||
{ max: 50, message: t("certd.max50Chars") },
|
||||
],
|
||||
}, // 表单配置
|
||||
column: {
|
||||
sorter: true,
|
||||
},
|
||||
},
|
||||
createTime: {
|
||||
title: t("certd.createTime"),
|
||||
type: "datetime",
|
||||
column: {
|
||||
sorter: true,
|
||||
},
|
||||
form: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
updateTime: {
|
||||
title: t("certd.updateTime"),
|
||||
type: "datetime",
|
||||
column: {
|
||||
sorter: true,
|
||||
},
|
||||
form: { show: false }, // 表单配置
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
@@ -1,18 +1,15 @@
|
||||
<template>
|
||||
<fs-page>
|
||||
<template #header>
|
||||
<div class="title">{{ t("certd.roleManagement") }}</div>
|
||||
</template>
|
||||
<fs-crud ref="crudRef" v-bind="crudBinding" />
|
||||
<a-modal v-model:open="authzDialogVisible" width="860px" :title="t('certd.assignPermissions')"
|
||||
@ok="updatePermission">
|
||||
<fs-permission-tree ref="permissionTreeRef" v-model:checked-keys="checkedKeys" :tree="permissionTreeData"
|
||||
:editable="false" checkable :replace-fields="{ key: 'id', label: 'title' }"> </fs-permission-tree>
|
||||
</a-modal>
|
||||
</fs-page>
|
||||
<fs-page>
|
||||
<template #header>
|
||||
<div class="title">{{ t("certd.roleManagement") }}</div>
|
||||
</template>
|
||||
<fs-crud ref="crudRef" v-bind="crudBinding" />
|
||||
<a-modal v-model:open="authzDialogVisible" width="860px" :title="t('certd.assignPermissions')" @ok="updatePermission">
|
||||
<fs-permission-tree ref="permissionTreeRef" v-model:checked-keys="checkedKeys" :tree="permissionTreeData" :editable="false" checkable :replace-fields="{ key: 'id', label: 'title' }"> </fs-permission-tree>
|
||||
</a-modal>
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, onActivated, onMounted, ref } from "vue";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
@@ -25,103 +22,103 @@ import { UseCrudPermissionCompProps, UseCrudPermissionExtraProps } from "/@/plug
|
||||
import { useI18n } from "vue-i18n";
|
||||
|
||||
function useAuthz() {
|
||||
const checkedKeys = ref();
|
||||
const checkedKeys = ref();
|
||||
|
||||
const permissionTreeData = ref();
|
||||
const permissionTreeData = ref();
|
||||
|
||||
const permissionTreeRef = ref();
|
||||
const authzDialogVisible = ref(false);
|
||||
const permissionTreeRef = ref();
|
||||
const authzDialogVisible = ref(false);
|
||||
|
||||
const currentRoleId = ref();
|
||||
const currentRoleId = ref();
|
||||
|
||||
// 如果勾选节点中存在非叶子节点，tree组件会将其所有子节点全部勾选
|
||||
// 所以要找出所有叶子节点，仅勾选叶子节点，tree组件会将父节点同步勾选
|
||||
function getAllCheckedLeafNodeId(tree: any, checkedIds: any, temp: any) {
|
||||
for (let i = 0; i < tree.length; i++) {
|
||||
const item = tree[i];
|
||||
if (item.children && item.children.length !== 0) {
|
||||
getAllCheckedLeafNodeId(item.children, checkedIds, temp);
|
||||
} else {
|
||||
if (checkedIds.indexOf(item.id) !== -1) {
|
||||
temp.push(item.id);
|
||||
}
|
||||
}
|
||||
}
|
||||
return temp;
|
||||
}
|
||||
function authzClose() {
|
||||
authzDialogVisible.value = false;
|
||||
}
|
||||
async function authzOpen(roleId: any) {
|
||||
permissionTreeData.value = await permissionApi.GetTree();
|
||||
checkedKeys.value = [];
|
||||
currentRoleId.value = roleId;
|
||||
// this.treeData = ret.data
|
||||
await updateChecked(roleId);
|
||||
authzDialogVisible.value = true;
|
||||
}
|
||||
async function updateChecked(roleId: any) {
|
||||
let checkedIds = await api.getPermissionIds(roleId);
|
||||
// 找出所有的叶子节点
|
||||
checkedIds = getAllCheckedLeafNodeId(permissionTreeData.value, checkedIds, []);
|
||||
checkedKeys.value = checkedIds;
|
||||
}
|
||||
async function updatePermission() {
|
||||
const roleId = currentRoleId.value;
|
||||
const { checked, halfChecked } = permissionTreeRef.value.getChecked();
|
||||
const allChecked = [...checked, ...halfChecked];
|
||||
await api.DoAuthz(roleId, allChecked);
|
||||
authzClose();
|
||||
//await updateChecked(roleId);
|
||||
// 如果勾选节点中存在非叶子节点，tree组件会将其所有子节点全部勾选
|
||||
// 所以要找出所有叶子节点，仅勾选叶子节点，tree组件会将父节点同步勾选
|
||||
function getAllCheckedLeafNodeId(tree: any, checkedIds: any, temp: any) {
|
||||
for (let i = 0; i < tree.length; i++) {
|
||||
const item = tree[i];
|
||||
if (item.children && item.children.length !== 0) {
|
||||
getAllCheckedLeafNodeId(item.children, checkedIds, temp);
|
||||
} else {
|
||||
if (checkedIds.indexOf(item.id) !== -1) {
|
||||
temp.push(item.id);
|
||||
}
|
||||
}
|
||||
}
|
||||
return temp;
|
||||
}
|
||||
function authzClose() {
|
||||
authzDialogVisible.value = false;
|
||||
}
|
||||
async function authzOpen(roleId: any) {
|
||||
permissionTreeData.value = await permissionApi.GetTree();
|
||||
checkedKeys.value = [];
|
||||
currentRoleId.value = roleId;
|
||||
// this.treeData = ret.data
|
||||
await updateChecked(roleId);
|
||||
authzDialogVisible.value = true;
|
||||
}
|
||||
async function updateChecked(roleId: any) {
|
||||
let checkedIds = await api.getPermissionIds(roleId);
|
||||
// 找出所有的叶子节点
|
||||
checkedIds = getAllCheckedLeafNodeId(permissionTreeData.value, checkedIds, []);
|
||||
checkedKeys.value = checkedIds;
|
||||
}
|
||||
async function updatePermission() {
|
||||
const roleId = currentRoleId.value;
|
||||
const { checked, halfChecked } = permissionTreeRef.value.getChecked();
|
||||
const allChecked = [...checked, ...halfChecked];
|
||||
await api.DoAuthz(roleId, allChecked);
|
||||
authzClose();
|
||||
//await updateChecked(roleId);
|
||||
|
||||
message.success("授权成功");
|
||||
}
|
||||
message.success("授权成功");
|
||||
}
|
||||
|
||||
return {
|
||||
authzOpen,
|
||||
updatePermission,
|
||||
authzDialogVisible,
|
||||
permissionTreeData,
|
||||
checkedKeys,
|
||||
permissionTreeRef,
|
||||
};
|
||||
return {
|
||||
authzOpen,
|
||||
updatePermission,
|
||||
authzDialogVisible,
|
||||
permissionTreeData,
|
||||
checkedKeys,
|
||||
permissionTreeRef,
|
||||
};
|
||||
}
|
||||
|
||||
export default defineComponent({
|
||||
name: "RoleManager",
|
||||
components: { FsPermissionTree },
|
||||
setup() {
|
||||
//授权配置
|
||||
const { t } = useI18n();
|
||||
const authz = useAuthz();
|
||||
const permission: UseCrudPermissionCompProps = {
|
||||
prefix: "sys:auth:role", //权限代码前缀
|
||||
extra: ({ hasActionPermission }: UseCrudPermissionExtraProps): any => {
|
||||
//额外按钮权限控制
|
||||
return { rowHandle: { buttons: { authz: { show: hasActionPermission("authz") } } } };
|
||||
},
|
||||
};
|
||||
name: "RoleManager",
|
||||
components: { FsPermissionTree },
|
||||
setup() {
|
||||
//授权配置
|
||||
const { t } = useI18n();
|
||||
const authz = useAuthz();
|
||||
const permission: UseCrudPermissionCompProps = {
|
||||
prefix: "sys:auth:role", //权限代码前缀
|
||||
extra: ({ hasActionPermission }: UseCrudPermissionExtraProps): any => {
|
||||
//额外按钮权限控制
|
||||
return { rowHandle: { buttons: { authz: { show: hasActionPermission("authz") } } } };
|
||||
},
|
||||
};
|
||||
|
||||
// 初始化crud配置
|
||||
// 此处传入permission进行通用按钮权限设置，会通过commonOptions去设置actionbar和rowHandle的按钮的show属性
|
||||
// 更多关于按钮权限的源代码设置，请参考 ./src/plugin/fast-crud/index.js （75-77行）
|
||||
// 初始化crud配置
|
||||
// 此处传入permission进行通用按钮权限设置，会通过commonOptions去设置actionbar和rowHandle的按钮的show属性
|
||||
// 更多关于按钮权限的源代码设置，请参考 ./src/plugin/fast-crud/index.js （75-77行）
|
||||
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions, context: { authz, permission } });
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions, context: { authz, permission } });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
onActivated(async () => {
|
||||
await crudExpose.doRefresh();
|
||||
});
|
||||
return {
|
||||
crudBinding,
|
||||
crudRef,
|
||||
...authz,
|
||||
t
|
||||
};
|
||||
},
|
||||
onActivated(async () => {
|
||||
await crudExpose.doRefresh();
|
||||
});
|
||||
return {
|
||||
crudBinding,
|
||||
crudRef,
|
||||
...authz,
|
||||
t,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
@@ -6,282 +6,281 @@ import dayjs from "dayjs";
|
||||
import { useSettingStore } from "/@/store/settings";
|
||||
import { useI18n } from "vue-i18n";
|
||||
|
||||
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const { t } = useI18n();
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
const { t } = useI18n();
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
const userStore = useUserStore();
|
||||
const userStore = useUserStore();
|
||||
|
||||
const settingStore = useSettingStore();
|
||||
const userValidTimeEnabled = compute(() => {
|
||||
return settingStore.sysPublic.userValidTimeEnabled === true;
|
||||
});
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
pageRequest,
|
||||
addRequest,
|
||||
editRequest,
|
||||
delRequest,
|
||||
},
|
||||
rowHandle: {
|
||||
fixed: "right",
|
||||
buttons: {
|
||||
unlock: {
|
||||
title: t("certd.unlockLogin"),
|
||||
text: null,
|
||||
type: "link",
|
||||
icon: "ion:lock-open-outline",
|
||||
click: async ({ row }) => {
|
||||
Modal.confirm({
|
||||
title: t("certd.notice"),
|
||||
content: t("certd.confirmUnlock"),
|
||||
onOk: async () => {
|
||||
await api.Unlock(row.id);
|
||||
notification.success({
|
||||
message: t("certd.unlockSuccess"),
|
||||
});
|
||||
},
|
||||
});
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
table: {
|
||||
scroll: {
|
||||
//使用固定列时需要设置此值，并且大于等于列宽度之和的值
|
||||
x: 1400,
|
||||
},
|
||||
},
|
||||
columns: {
|
||||
id: {
|
||||
title: "id",
|
||||
type: "text",
|
||||
form: { show: false }, // 表单配置
|
||||
column: {
|
||||
width: 100,
|
||||
sorter: true,
|
||||
},
|
||||
},
|
||||
createTime: {
|
||||
title: t("certd.createTime"),
|
||||
type: "datetime",
|
||||
form: { show: false }, // 表单配置
|
||||
column: {
|
||||
width: 180,
|
||||
sorter: true,
|
||||
},
|
||||
},
|
||||
// updateTime: {
|
||||
// title: "修改时间",
|
||||
// type: "datetime",
|
||||
// form: { show: false }, // 表单配置
|
||||
// column: {
|
||||
// sortable: "update_time",
|
||||
// width: 180
|
||||
// }
|
||||
// },
|
||||
username: {
|
||||
title: t("certd.username"),
|
||||
type: "text",
|
||||
search: { show: true }, // 开启查询
|
||||
form: {
|
||||
rules: [
|
||||
{ required: true, message: t("certd.enterUsername") },
|
||||
{ max: 50, message: t("certd.max50Chars") },
|
||||
],
|
||||
},
|
||||
editForm: { component: { disabled: false } },
|
||||
column: {
|
||||
sorter: true,
|
||||
width: 200,
|
||||
},
|
||||
},
|
||||
password: {
|
||||
title: t("certd.password"),
|
||||
type: "text",
|
||||
key: "password",
|
||||
column: {
|
||||
show: false,
|
||||
},
|
||||
form: {
|
||||
rules: [{ max: 50, message: t("certd.max50Chars") }],
|
||||
component: {
|
||||
showPassword: true,
|
||||
},
|
||||
helper: t("certd.modifyPasswordIfFilled"),
|
||||
},
|
||||
},
|
||||
nickName: {
|
||||
title: t("certd.nickName"),
|
||||
type: "text",
|
||||
search: { show: true }, // 开启查询
|
||||
form: {
|
||||
rules: [{ max: 50, message: t("certd.max50Chars") }],
|
||||
},
|
||||
column: {
|
||||
sorter: true,
|
||||
},
|
||||
},
|
||||
email: {
|
||||
title: t("certd.emaila"),
|
||||
type: "text",
|
||||
search: { show: true }, // 开启查询
|
||||
form: {
|
||||
rules: [{ max: 50, message: t("certd.max50Chars") }],
|
||||
},
|
||||
column: {
|
||||
sorter: true,
|
||||
width: 160,
|
||||
},
|
||||
},
|
||||
mobile: {
|
||||
title: t("certd.mobile"),
|
||||
type: "text",
|
||||
search: { show: true }, // 开启查询
|
||||
form: {
|
||||
rules: [{ max: 50, message: t("certd.max50Chars") }],
|
||||
},
|
||||
column: {
|
||||
sorter: true,
|
||||
width: 130,
|
||||
},
|
||||
},
|
||||
avatar: {
|
||||
title: t("certd.avatar"),
|
||||
type: "cropper-uploader",
|
||||
column: {
|
||||
width: 70,
|
||||
component: {
|
||||
style: {
|
||||
height: "30px",
|
||||
width: "auto",
|
||||
},
|
||||
buildUrl(key: string) {
|
||||
return `api/basic/file/download?&key=` + key;
|
||||
},
|
||||
},
|
||||
},
|
||||
form: {
|
||||
component: {
|
||||
vModel: "modelValue",
|
||||
valueType: "key",
|
||||
cropper: {
|
||||
aspectRatio: 1,
|
||||
autoCropArea: 1,
|
||||
viewMode: 0,
|
||||
},
|
||||
onReady: null,
|
||||
uploader: {
|
||||
type: "form",
|
||||
action: "/basic/file/upload",
|
||||
name: "file",
|
||||
headers: {
|
||||
Authorization: "Bearer " + userStore.getToken,
|
||||
},
|
||||
successHandle(res: any) {
|
||||
return res;
|
||||
},
|
||||
},
|
||||
buildUrl(key: string) {
|
||||
return `api/basic/file/download?&key=` + key;
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
status: {
|
||||
title: t("certd.status"),
|
||||
type: "dict-switch",
|
||||
dict: dict({
|
||||
data: [
|
||||
{ label: t("certd.enabled"), value: 1, color: "green" },
|
||||
{ label: t("certd.disabled"), value: 0, color: "red" },
|
||||
],
|
||||
}),
|
||||
column: {
|
||||
align: "center",
|
||||
sorter: true,
|
||||
width: 100,
|
||||
},
|
||||
},
|
||||
validTime: {
|
||||
title: t("certd.validTime"),
|
||||
type: "date",
|
||||
form: {
|
||||
show: userValidTimeEnabled,
|
||||
},
|
||||
column: {
|
||||
align: "center",
|
||||
sorter: true,
|
||||
width: 100,
|
||||
show: userValidTimeEnabled,
|
||||
cellRender({ value }) {
|
||||
if (value == null || value === 0) {
|
||||
return "";
|
||||
}
|
||||
if (value < dayjs().valueOf()) {
|
||||
return <a-tag color={"red"}>{t("certd.expired")}</a-tag>;
|
||||
}
|
||||
const date = dayjs(value).format("YYYY-MM-DD");
|
||||
return (
|
||||
<a-tag color={"green"} title={date}>
|
||||
<fs-time-humanize modelValue={value} options={{ largest: 1, units: ["y", "d", "h"] }} useFormatGreater={30000000000} />
|
||||
</a-tag>
|
||||
);
|
||||
},
|
||||
},
|
||||
valueBuilder({ value, row, key }) {
|
||||
if (value != null) {
|
||||
row[key] = dayjs(value);
|
||||
}
|
||||
},
|
||||
valueResolve({ value, row, key }) {
|
||||
if (value != null) {
|
||||
row[key] = value.valueOf();
|
||||
}
|
||||
},
|
||||
},
|
||||
remark: {
|
||||
title: t("certd.remark"),
|
||||
type: "text",
|
||||
column: {
|
||||
sorter: true,
|
||||
},
|
||||
form: {
|
||||
rules: [{ max: 100, message: t("certd.max100Chars") }],
|
||||
},
|
||||
},
|
||||
roles: {
|
||||
title: t("certd.roles"),
|
||||
type: "dict-select",
|
||||
dict: dict({
|
||||
url: "/sys/authority/role/list",
|
||||
value: "id",
|
||||
label: "name",
|
||||
}), // 数据字典
|
||||
form: {
|
||||
component: { mode: "multiple" },
|
||||
},
|
||||
column: {
|
||||
width: 250,
|
||||
sortable: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
const settingStore = useSettingStore();
|
||||
const userValidTimeEnabled = compute(() => {
|
||||
return settingStore.sysPublic.userValidTimeEnabled === true;
|
||||
});
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
pageRequest,
|
||||
addRequest,
|
||||
editRequest,
|
||||
delRequest,
|
||||
},
|
||||
rowHandle: {
|
||||
fixed: "right",
|
||||
buttons: {
|
||||
unlock: {
|
||||
title: t("certd.unlockLogin"),
|
||||
text: null,
|
||||
type: "link",
|
||||
icon: "ion:lock-open-outline",
|
||||
click: async ({ row }) => {
|
||||
Modal.confirm({
|
||||
title: t("certd.notice"),
|
||||
content: t("certd.confirmUnlock"),
|
||||
onOk: async () => {
|
||||
await api.Unlock(row.id);
|
||||
notification.success({
|
||||
message: t("certd.unlockSuccess"),
|
||||
});
|
||||
},
|
||||
});
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
table: {
|
||||
scroll: {
|
||||
//使用固定列时需要设置此值，并且大于等于列宽度之和的值
|
||||
x: 1400,
|
||||
},
|
||||
},
|
||||
columns: {
|
||||
id: {
|
||||
title: "id",
|
||||
type: "text",
|
||||
form: { show: false }, // 表单配置
|
||||
column: {
|
||||
width: 100,
|
||||
sorter: true,
|
||||
},
|
||||
},
|
||||
createTime: {
|
||||
title: t("certd.createTime"),
|
||||
type: "datetime",
|
||||
form: { show: false }, // 表单配置
|
||||
column: {
|
||||
width: 180,
|
||||
sorter: true,
|
||||
},
|
||||
},
|
||||
// updateTime: {
|
||||
// title: "修改时间",
|
||||
// type: "datetime",
|
||||
// form: { show: false }, // 表单配置
|
||||
// column: {
|
||||
// sortable: "update_time",
|
||||
// width: 180
|
||||
// }
|
||||
// },
|
||||
username: {
|
||||
title: t("certd.username"),
|
||||
type: "text",
|
||||
search: { show: true }, // 开启查询
|
||||
form: {
|
||||
rules: [
|
||||
{ required: true, message: t("certd.enterUsername") },
|
||||
{ max: 50, message: t("certd.max50Chars") },
|
||||
],
|
||||
},
|
||||
editForm: { component: { disabled: false } },
|
||||
column: {
|
||||
sorter: true,
|
||||
width: 200,
|
||||
},
|
||||
},
|
||||
password: {
|
||||
title: t("certd.password"),
|
||||
type: "text",
|
||||
key: "password",
|
||||
column: {
|
||||
show: false,
|
||||
},
|
||||
form: {
|
||||
rules: [{ max: 50, message: t("certd.max50Chars") }],
|
||||
component: {
|
||||
showPassword: true,
|
||||
},
|
||||
helper: t("certd.modifyPasswordIfFilled"),
|
||||
},
|
||||
},
|
||||
nickName: {
|
||||
title: t("certd.nickName"),
|
||||
type: "text",
|
||||
search: { show: true }, // 开启查询
|
||||
form: {
|
||||
rules: [{ max: 50, message: t("certd.max50Chars") }],
|
||||
},
|
||||
column: {
|
||||
sorter: true,
|
||||
},
|
||||
},
|
||||
email: {
|
||||
title: t("certd.emaila"),
|
||||
type: "text",
|
||||
search: { show: true }, // 开启查询
|
||||
form: {
|
||||
rules: [{ max: 50, message: t("certd.max50Chars") }],
|
||||
},
|
||||
column: {
|
||||
sorter: true,
|
||||
width: 160,
|
||||
},
|
||||
},
|
||||
mobile: {
|
||||
title: t("certd.mobile"),
|
||||
type: "text",
|
||||
search: { show: true }, // 开启查询
|
||||
form: {
|
||||
rules: [{ max: 50, message: t("certd.max50Chars") }],
|
||||
},
|
||||
column: {
|
||||
sorter: true,
|
||||
width: 130,
|
||||
},
|
||||
},
|
||||
avatar: {
|
||||
title: t("certd.avatar"),
|
||||
type: "cropper-uploader",
|
||||
column: {
|
||||
width: 70,
|
||||
component: {
|
||||
style: {
|
||||
height: "30px",
|
||||
width: "auto",
|
||||
},
|
||||
buildUrl(key: string) {
|
||||
return `api/basic/file/download?&key=` + key;
|
||||
},
|
||||
},
|
||||
},
|
||||
form: {
|
||||
component: {
|
||||
vModel: "modelValue",
|
||||
valueType: "key",
|
||||
cropper: {
|
||||
aspectRatio: 1,
|
||||
autoCropArea: 1,
|
||||
viewMode: 0,
|
||||
},
|
||||
onReady: null,
|
||||
uploader: {
|
||||
type: "form",
|
||||
action: "/basic/file/upload",
|
||||
name: "file",
|
||||
headers: {
|
||||
Authorization: "Bearer " + userStore.getToken,
|
||||
},
|
||||
successHandle(res: any) {
|
||||
return res;
|
||||
},
|
||||
},
|
||||
buildUrl(key: string) {
|
||||
return `api/basic/file/download?&key=` + key;
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
status: {
|
||||
title: t("certd.status"),
|
||||
type: "dict-switch",
|
||||
dict: dict({
|
||||
data: [
|
||||
{ label: t("certd.enabled"), value: 1, color: "green" },
|
||||
{ label: t("certd.disabled"), value: 0, color: "red" },
|
||||
],
|
||||
}),
|
||||
column: {
|
||||
align: "center",
|
||||
sorter: true,
|
||||
width: 100,
|
||||
},
|
||||
},
|
||||
validTime: {
|
||||
title: t("certd.validTime"),
|
||||
type: "date",
|
||||
form: {
|
||||
show: userValidTimeEnabled,
|
||||
},
|
||||
column: {
|
||||
align: "center",
|
||||
sorter: true,
|
||||
width: 100,
|
||||
show: userValidTimeEnabled,
|
||||
cellRender({ value }) {
|
||||
if (value == null || value === 0) {
|
||||
return "";
|
||||
}
|
||||
if (value < dayjs().valueOf()) {
|
||||
return <a-tag color={"red"}>{t("certd.expired")}</a-tag>;
|
||||
}
|
||||
const date = dayjs(value).format("YYYY-MM-DD");
|
||||
return (
|
||||
<a-tag color={"green"} title={date}>
|
||||
<fs-time-humanize modelValue={value} options={{ largest: 1, units: ["y", "d", "h"] }} useFormatGreater={30000000000} />
|
||||
</a-tag>
|
||||
);
|
||||
},
|
||||
},
|
||||
valueBuilder({ value, row, key }) {
|
||||
if (value != null) {
|
||||
row[key] = dayjs(value);
|
||||
}
|
||||
},
|
||||
valueResolve({ value, row, key }) {
|
||||
if (value != null) {
|
||||
row[key] = value.valueOf();
|
||||
}
|
||||
},
|
||||
},
|
||||
remark: {
|
||||
title: t("certd.remark"),
|
||||
type: "text",
|
||||
column: {
|
||||
sorter: true,
|
||||
},
|
||||
form: {
|
||||
rules: [{ max: 100, message: t("certd.max100Chars") }],
|
||||
},
|
||||
},
|
||||
roles: {
|
||||
title: t("certd.roles"),
|
||||
type: "dict-select",
|
||||
dict: dict({
|
||||
url: "/sys/authority/role/list",
|
||||
value: "id",
|
||||
label: "name",
|
||||
}), // 数据字典
|
||||
form: {
|
||||
component: { mode: "multiple" },
|
||||
},
|
||||
column: {
|
||||
width: 250,
|
||||
sortable: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user