Partially translate user settings

pull/436/head
Lorenzo 2025-06-26 00:56:43 +02:00
parent b50121ad0b
commit 0b3472d227
8 changed files with 881 additions and 767 deletions

View File

@ -300,4 +300,48 @@ export default {
nickName: "Nickname",
max50Chars: "Maximum 50 characters",
myInfo: "My Information",
siteMonitorSettings: "Site Monitor Settings",
notificationChannel: "Notification Channel",
setNotificationChannel: "Set the notification channel",
retryTimes: "Retry Times",
monitorRetryTimes: "Number of retry attempts for monitoring requests",
monitorCronSetting: "Monitoring Schedule",
cronTrigger: "Scheduled trigger for monitoring",
save: "Save",
editSchedule: "Edit Schedule",
timerTrigger: "Timer Trigger",
schedule: "Schedule",
selectCron: "Please select a schedule Cron",
batchEditSchedule: "Batch Edit Schedule",
editTrigger: "Edit Trigger",
triggerName: "Trigger Name",
requiredField: "This field is required",
type: "Type",
enterName: "Please enter a name",
confirmDeleteTrigger: "Are you sure you want to delete this trigger?",
notificationType: "Notification Type",
selectNotificationType: "Please select a notification type",
notificationName: "Notification Name",
helperNotificationName: "Fill freely, helps to distinguish when multiple notifications of the same type exist",
isDefault: "Is Default",
yes: "Yes",
no: "No",
selectIsDefault: "Please select if default",
prompt: "Prompt",
confirmSetDefaultNotification: "Are you sure to set as default notification?",
test: "Test",
scope: "Scope",
scopeOpenApiOnly: "Open API Only",
scopeFullAccount: "Full Account Permissions",
required: "This field is required",
scopeHelper: "Open API only allows access to open APIs; full account permissions allow access to all APIs",
add: "Generate New Key",
gen: {
text: "API Test",
title: "x-certd-token",
okText: "Confirm",
contentPart1: "Test the x-certd-token below, you can use it within 3 minutes to test ",
openApi: "Open API",
contentPart2: " request testing",
},
};

View File

@ -306,4 +306,48 @@ export default {
nickName: "昵称",
max50Chars: "最大50个字符",
myInfo: "我的信息",
siteMonitorSettings: "站点监控设置",
notificationChannel: "通知渠道",
setNotificationChannel: "设置通知渠道",
retryTimes: "重试次数",
monitorRetryTimes: "监控请求重试次数",
monitorCronSetting: "监控定时设置",
cronTrigger: "定时触发监控",
save: "保存",
editSchedule: "修改定时",
timerTrigger: "定时触发",
schedule: "定时",
selectCron: "请选择定时Cron",
batchEditSchedule: "批量修改定时",
editTrigger: "编辑触发器",
triggerName: "触发器名称",
requiredField: "此项必填",
type: "类型",
enterName: "请输入名称",
confirmDeleteTrigger: "确定要删除此触发器吗?",
notificationType: "通知类型",
selectNotificationType: "请选择通知类型",
notificationName: "通知名称",
helperNotificationName: "随便填,当多个相同类型的通知时,便于区分",
isDefault: "是否默认",
yes: "是",
no: "否",
selectIsDefault: "请选择是否默认",
prompt: "提示",
confirmSetDefaultNotification: "确定设置为默认通知?",
test: "测试",
scope: "权限范围",
scopeOpenApiOnly: "仅开放接口",
scopeFullAccount: "账户所有权限",
required: "此项必填",
scopeHelper: "仅开放接口只可以访问开放接口,账户所有权限可以访问所有接口",
add: "生成新的Key",
gen: {
text: "接口测试",
title: "x-certd-token",
okText: "确定",
contentPart1: "测试x-certd-token如下您可以在3分钟内使用它进行",
openApi: "开放接口",
contentPart2: "请求测试",
},
};

View File

@ -1,37 +1,41 @@
<template>
<fs-page class="page-user-settings page-site-monitor-setting">
<template #header>
<div class="title">站点监控设置</div>
</template>
<div class="user-settings-form settings-form">
<a-form :model="formState" name="basic" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }" autocomplete="off">
<a-form-item label="通知渠道" :name="['notificationId']">
<div class="flex">
<NotificationSelector v-model="formState.notificationId" />
</div>
<div class="helper">设置通知渠道</div>
</a-form-item>
<a-form-item label="重试次数" :name="['retryTimes']">
<div class="flex">
<a-input-number v-model:value="formState.retryTimes" />
</div>
<div class="helper">监控请求重试次数</div>
</a-form-item>
<a-form-item label="监控定时设置" :name="['cron']">
<div class="flex flex-baseline">
<cron-editor v-model="formState.cron" :disabled="!settingsStore.isPlus" :allow-every-min="userStore.isAdmin" />
<vip-button class="ml-5" mode="button"></vip-button>
</div>
<div class="helper">定时触发监控</div>
</a-form-item>
<a-form-item label=" " :colon="false" :wrapper-col="{ span: 16 }">
<loading-button type="primary" html-type="button" :click="doSave">保存</loading-button>
</a-form-item>
</a-form>
</div>
</fs-page>
<fs-page class="page-user-settings page-site-monitor-setting">
<template #header>
<div class="title">{{ t("certd.siteMonitorSettings") }}</div>
</template>
<div class="user-settings-form settings-form">
<a-form :model="formState" name="basic" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }"
autocomplete="off">
<a-form-item :label="t('certd.notificationChannel')" :name="['notificationId']">
<div class="flex">
<NotificationSelector v-model="formState.notificationId" />
</div>
<div class="helper">{{ t('certd.setNotificationChannel') }}</div>
</a-form-item>
<a-form-item :label="t('certd.retryTimes')" :name="['retryTimes']">
<div class="flex">
<a-input-number v-model:value="formState.retryTimes" />
</div>
<div class="helper">{{ t('certd.monitorRetryTimes') }}</div>
</a-form-item>
<a-form-item :label="t('certd.monitorCronSetting')" :name="['cron']">
<div class="flex flex-baseline">
<cron-editor v-model="formState.cron" :disabled="!settingsStore.isPlus"
:allow-every-min="userStore.isAdmin" />
<vip-button class="ml-5" mode="button"></vip-button>
</div>
<div class="helper">{{ t('certd.cronTrigger') }}</div>
</a-form-item>
<a-form-item label=" " :colon="false" :wrapper-col="{ span: 16 }">
<loading-button type="primary" html-type="button" :click="doSave">{{ t('certd.save')
}}</loading-button>
</a-form-item>
</a-form>
</div>
</fs-page>
</template>
<script setup lang="tsx">
import { reactive } from "vue";
import * as api from "./api";
@ -41,38 +45,41 @@ import { merge } from "lodash-es";
import { useSettingStore } from "/src/store/settings";
import NotificationSelector from "/@/views/certd/notification/notification-selector/index.vue";
import { useUserStore } from "/@/store/user";
import { useI18n } from "vue-i18n";
const { t } = useI18n();
const settingsStore = useSettingStore();
const userStore = useUserStore();
defineOptions({
name: "UserSecurity",
name: "UserSecurity",
});
const formState = reactive<Partial<UserSiteMonitorSetting>>({
notificationId: 0,
notificationId: 0,
});
async function loadUserSettings() {
const data: any = await api.SiteMonitorSettingsGet();
merge(formState, data);
const data: any = await api.SiteMonitorSettingsGet();
merge(formState, data);
}
loadUserSettings();
const doSave = async (form: any) => {
await api.SiteMonitorSettingsSave({
...formState,
});
notification.success({
message: "保存成功",
});
await api.SiteMonitorSettingsSave({
...formState,
});
notification.success({
message: t("certd.saveSuccess"),
});
};
</script>
<style lang="less">
.page-user-settings {
.user-settings-form {
width: 700px;
margin: 20px;
}
.user-settings-form {
width: 700px;
margin: 20px;
}
}
</style>

View File

@ -5,238 +5,241 @@ import { forEach, get, merge, set } from "lodash-es";
import { Modal } from "ant-design-vue";
import * as api from "/@/views/sys/cname/provider/api";
import { mitter } from "/@/utils/util.mitt";
import { useI18n } from "vue-i18n";
export function notificationProvide(api: any) {
provide("notificationApi", api);
provide("get:plugin:type", () => {
return "notification";
});
provide("notificationApi", api);
provide("get:plugin:type", () => {
return "notification";
});
}
export function getCommonColumnDefine(crudExpose: any, typeRef: any, api: any) {
const notificationTypeDictRef = dict({
url: "/pi/notification/getTypeDict",
});
const defaultPluginConfig = {
component: {
name: "a-input",
vModel: "value",
},
};
const { t } = useI18n();
function buildDefineFields(define: any, form: any, mode: string) {
const formWrapperRef = crudExpose.getFormWrapperRef();
const columnsRef = toRef(formWrapperRef.formOptions, "columns");
const notificationTypeDictRef = dict({
url: "/pi/notification/getTypeDict",
});
const defaultPluginConfig = {
component: {
name: "a-input",
vModel: "value",
},
};
for (const key in columnsRef.value) {
if (key.indexOf(".") >= 0) {
delete columnsRef.value[key];
}
}
console.log('crudBinding.value[mode + "Form"].columns', columnsRef.value);
forEach(define.input, (value: any, mapKey: any) => {
const key = "body." + mapKey;
const field = {
...value,
key,
};
const column = merge({ title: key }, defaultPluginConfig, field);
//eval
useReference(column);
function buildDefineFields(define: any, form: any, mode: string) {
const formWrapperRef = crudExpose.getFormWrapperRef();
const columnsRef = toRef(formWrapperRef.formOptions, "columns");
if (column.required) {
if (!column.rules) {
column.rules = [];
}
column.rules.push({ required: true, message: "此项必填" });
}
for (const key in columnsRef.value) {
if (key.indexOf(".") >= 0) {
delete columnsRef.value[key];
}
}
console.log('crudBinding.value[mode + "Form"].columns', columnsRef.value);
forEach(define.input, (value: any, mapKey: any) => {
const key = "body." + mapKey;
const field = {
...value,
key,
};
const column = merge({ title: key }, defaultPluginConfig, field);
//eval
useReference(column);
//设置默认值
if (column.value != null && get(form, key) == null) {
set(form, key, column.value);
}
//字段配置赋值
columnsRef.value[key] = column;
console.log("form", columnsRef.value, form);
});
}
if (column.required) {
if (!column.rules) {
column.rules = [];
}
column.rules.push({ required: true, message: t("certd.requiredField") });
}
const currentDefine = ref();
//设置默认值
if (column.value != null && get(form, key) == null) {
set(form, key, column.value);
}
//字段配置赋值
columnsRef.value[key] = column;
console.log("form", columnsRef.value, form);
});
}
return {
id: {
title: "ID",
key: "id",
type: "number",
column: {
width: 100,
},
form: {
show: false,
},
},
type: {
title: "通知类型",
type: "dict-select",
dict: notificationTypeDictRef,
search: {
show: false,
},
column: {
width: 200,
component: {
color: "auto",
},
},
editForm: {
component: {
disabled: false,
},
},
form: {
component: {
disabled: false,
showSearch: true,
filterOption: (input: string, option: any) => {
input = input?.toLowerCase();
return option.value.toLowerCase().indexOf(input) >= 0 || option.label.toLowerCase().indexOf(input) >= 0;
},
renderLabel(item: any) {
return (
<span class={"flex-o flex-between"}>
{item.label}
{item.needPlus && <fs-icon icon={"mingcute:vip-1-line"} className={"color-plus"}></fs-icon>}
</span>
);
},
},
rules: [{ required: true, message: "请选择通知类型" }],
valueChange: {
immediate: true,
async handle({ value, mode, form, immediate }) {
if (value == null) {
return;
}
const lastTitle = currentDefine.value?.title;
const define = await api.GetProviderDefine(value);
currentDefine.value = define;
console.log("define", define);
const currentDefine = ref();
if (!immediate) {
form.body = {};
if (define.needPlus) {
mitter.emit("openVipModal");
}
}
return {
id: {
title: "ID",
key: "id",
type: "number",
column: {
width: 100,
},
form: {
show: false,
},
},
type: {
title: t("certd.notificationType"),
type: "dict-select",
dict: notificationTypeDictRef,
search: {
show: false,
},
column: {
width: 200,
component: {
color: "auto",
},
},
editForm: {
component: {
disabled: false,
},
},
form: {
component: {
disabled: false,
showSearch: true,
filterOption: (input: string, option: any) => {
input = input?.toLowerCase();
return option.value.toLowerCase().indexOf(input) >= 0 || option.label.toLowerCase().indexOf(input) >= 0;
},
renderLabel(item: any) {
return (
<span class={"flex-o flex-between"}>
{item.label}
{item.needPlus && <fs-icon icon={"mingcute:vip-1-line"} className={"color-plus"}></fs-icon>}
</span>
);
},
},
rules: [{ required: true, message: t("certd.selectNotificationType") }],
valueChange: {
immediate: true,
async handle({ value, mode, form, immediate }) {
if (value == null) {
return;
}
const lastTitle = currentDefine.value?.title;
const define = await api.GetProviderDefine(value);
currentDefine.value = define;
console.log("define", define);
if (!form.name || form.name === lastTitle) {
form.name = define.title;
}
buildDefineFields(define, form, mode);
},
},
helper: computed(() => {
const define = currentDefine.value;
if (define == null) {
return "";
}
return define.desc;
}),
},
} as ColumnCompositionProps,
name: {
title: "通知名称",
search: {
show: true,
},
type: ["text"],
form: {
rules: [{ required: true, message: "请填写名称" }],
helper: "随便填,当多个相同类型的通知时,便于区分",
},
column: {
width: 200,
},
},
isDefault: {
title: "是否默认",
type: "dict-switch",
dict: dict({
data: [
{ label: "是", value: true, color: "success" },
{ label: "否", value: false, color: "default" },
],
}),
form: {
value: false,
rules: [{ required: true, message: "请选择是否默认" }],
order: 999,
},
column: {
align: "center",
width: 100,
component: {
name: "a-switch",
vModel: "checked",
disabled: compute(({ value }) => {
return value === true;
}),
on: {
change({ row }) {
Modal.confirm({
title: "提示",
content: "确定设置为默认通知?",
onOk: async () => {
await api.SetDefault(row.id);
await crudExpose.doRefresh();
},
onCancel: async () => {
await crudExpose.doRefresh();
},
});
},
},
},
},
} as ColumnCompositionProps,
test: {
title: "测试",
form: {
show: compute(({ form }) => {
return !!form.type;
}),
component: {
name: "api-test",
action: "TestRequest",
},
order: 990,
col: {
span: 24,
},
},
column: {
show: false,
},
},
setting: {
column: { show: false },
form: {
show: false,
valueBuilder({ value, form }) {
form.body = {};
if (!value) {
return;
}
const setting = JSON.parse(value);
for (const key in setting) {
form.body[key] = setting[key];
}
},
valueResolve({ form }) {
const setting = form.body;
form.setting = JSON.stringify(setting);
},
},
} as ColumnCompositionProps,
};
if (!immediate) {
form.body = {};
if (define.needPlus) {
mitter.emit("openVipModal");
}
}
if (!form.name || form.name === lastTitle) {
form.name = define.title;
}
buildDefineFields(define, form, mode);
},
},
helper: computed(() => {
const define = currentDefine.value;
if (define == null) {
return "";
}
return define.desc;
}),
},
} as ColumnCompositionProps,
name: {
title: t("certd.notificationName"),
search: {
show: true,
},
type: ["text"],
form: {
rules: [{ required: true, message: t("certd.enterName") }],
helper: t("certd.helperNotificationName"),
},
column: {
width: 200,
},
},
isDefault: {
title: t("certd.isDefault"),
type: "dict-switch",
dict: dict({
data: [
{ label: t("certd.yes"), value: true, color: "success" },
{ label: t("certd.no"), value: false, color: "default" },
],
}),
form: {
value: false,
rules: [{ required: true, message: t("certd.selectIsDefault") }],
order: 999,
},
column: {
align: "center",
width: 100,
component: {
name: "a-switch",
vModel: "checked",
disabled: compute(({ value }) => {
return value === true;
}),
on: {
change({ row }) {
Modal.confirm({
title: t("certd.prompt"),
content: t("certd.confirmSetDefaultNotification"),
onOk: async () => {
await api.SetDefault(row.id);
await crudExpose.doRefresh();
},
onCancel: async () => {
await crudExpose.doRefresh();
},
});
},
},
},
},
} as ColumnCompositionProps,
test: {
title: t("certd.test"),
form: {
show: compute(({ form }) => {
return !!form.type;
}),
component: {
name: "api-test",
action: "TestRequest",
},
order: 990,
col: {
span: 24,
},
},
column: {
show: false,
},
},
setting: {
column: { show: false },
form: {
show: false,
valueBuilder({ value, form }) {
form.body = {};
if (!value) {
return;
}
const setting = JSON.parse(value);
for (const key in setting) {
form.body[key] = setting[key];
}
},
valueResolve({ form }) {
const setting = form.body;
form.setting = JSON.stringify(setting);
},
},
} as ColumnCompositionProps,
};
}

View File

@ -5,181 +5,182 @@ import { OPEN_API_DOC, openkeyApi } from "./api";
import { useModal } from "/@/use/use-modal";
export default function ({ crudExpose, context }: CreateCrudOptionsProps): CreateCrudOptionsRet {
const { t } = useI18n();
const api = openkeyApi;
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
return await api.GetList(query);
};
const editRequest = async (req: EditReq) => {
const { form, row } = req;
form.id = row.id;
const res = await api.UpdateObj(form);
return res;
};
const delRequest = async (req: DelReq) => {
const { row } = req;
return await api.DelObj(row.id);
};
const { t } = useI18n();
const api = openkeyApi;
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
return await api.GetList(query);
};
const editRequest = async (req: EditReq) => {
const { form, row } = req;
form.id = row.id;
const res = await api.UpdateObj(form);
return res;
};
const delRequest = async (req: DelReq) => {
const { row } = req;
return await api.DelObj(row.id);
};
const addRequest = async (req: AddReq) => {
const { form } = req;
const res = await api.AddObj(form);
return res;
};
const model = useModal();
return {
crudOptions: {
request: {
pageRequest,
addRequest,
editRequest,
delRequest,
},
search: {
show: false,
},
form: {
labelCol: {
//固定label宽度
span: null,
style: {
width: "100px",
},
},
col: {
span: 22,
},
wrapper: {
width: 600,
},
},
actionbar: {
buttons: {
add: {
text: "生成新的Key",
},
},
},
rowHandle: {
width: 300,
fixed: "right",
buttons: {
view: { show: true },
copy: { show: false },
edit: { show: false },
remove: { show: true },
gen: {
text: "接口测试",
size: "mini",
icon: "devicon-plain:vitest",
type: "primary",
async click({ row }) {
const apiToken = await api.GetApiToken(row.id);
const addRequest = async (req: AddReq) => {
const { form } = req;
const res = await api.AddObj(form);
return res;
};
const model = useModal();
return {
crudOptions: {
request: {
pageRequest,
addRequest,
editRequest,
delRequest,
},
search: {
show: false,
},
form: {
labelCol: {
//固定label宽度
span: null,
style: {
width: "100px",
},
},
col: {
span: 22,
},
wrapper: {
width: 600,
},
},
actionbar: {
buttons: {
add: {
text: t("certd.actionbar.add"),
},
},
},
rowHandle: {
width: 300,
fixed: "right",
buttons: {
view: { show: true },
copy: { show: false },
edit: { show: false },
remove: { show: true },
gen: {
text: t("certd.gen.text"),
size: "mini",
icon: "devicon-plain:vitest",
type: "primary",
async click({ row }) {
const apiToken = await api.GetApiToken(row.id);
model.success({
title: "x-certd-token",
maskClosable: true,
okText: "确定",
width: 600,
content: () => {
return (
<div>
<div class={"m-10 p-10"}>
x-certd-token3使
<a href={OPEN_API_DOC} target={"_blank"}>
</a>
</div>
<div class={"m-10 p-10"} style={{ border: "1px solid #333" }}>
<fs-copyable model-value={apiToken}></fs-copyable>
</div>
</div>
);
},
});
},
},
},
},
columns: {
id: {
title: "ID",
key: "id",
type: "number",
search: {
show: false,
},
column: {
width: 100,
editable: {
disabled: true,
},
},
form: {
show: false,
},
},
keyId: {
title: "KeyId",
type: ["text", "copyable"],
search: {
show: true,
},
form: {
show: false,
},
column: {
width: 250,
sorter: true,
},
},
keySecret: {
title: "KeySecret",
type: ["text", "copyable"],
form: {
show: false,
},
column: {
width: 580,
sorter: true,
},
},
scope: {
title: "权限范围",
type: "dict-radio",
dict: dict({
data: [
{ label: "仅开放接口", value: "open", color: "blue" },
{ label: "账户所有权限", value: "user", color: "red" },
],
}),
form: {
value: "open",
show: true,
rules: [{ required: true, message: "此项必填" }],
helper: "仅开放接口只可以访问开放接口,账户所有权限可以访问所有接口",
component: {
vModel: "value",
},
},
column: {
width: 120,
align: "center",
sorter: true,
},
},
createTime: {
title: "创建时间",
type: "datetime",
search: {
show: false,
},
form: {
show: false,
},
},
},
},
};
model.success({
title: t("certd.gen.title"),
maskClosable: true,
okText: t("certd.gen.okText"),
width: 600,
content: () => {
return (
<div>
<div class={"m-10 p-10"}>
{t("certd.gen.contentPart1")}
<a href={OPEN_API_DOC} target={"_blank"}>
{t("certd.gen.openApi")}
</a>
{t("certd.gen.contentPart2")}
</div>
<div class={"m-10 p-10"} style={{ border: "1px solid #333" }}>
<fs-copyable model-value={apiToken}></fs-copyable>
</div>
</div>
);
},
});
},
},
},
},
columns: {
id: {
title: "ID",
key: "id",
type: "number",
search: {
show: false,
},
column: {
width: 100,
editable: {
disabled: true,
},
},
form: {
show: false,
},
},
keyId: {
title: "KeyId",
type: ["text", "copyable"],
search: {
show: true,
},
form: {
show: false,
},
column: {
width: 250,
sorter: true,
},
},
keySecret: {
title: "KeySecret",
type: ["text", "copyable"],
form: {
show: false,
},
column: {
width: 580,
sorter: true,
},
},
scope: {
title: t("certd.scope"),
type: "dict-radio",
dict: dict({
data: [
{ label: t("certd.scopeOpenApiOnly"), value: "open", color: "blue" },
{ label: t("certd.scopeFullAccount"), value: "user", color: "red" },
],
}),
form: {
value: "open",
show: true,
rules: [{ required: true, message: t("certd.required") }],
helper: t("certd.scopeHelper"),
component: {
vModel: "value",
},
},
column: {
width: 120,
align: "center",
sorter: true,
},
},
createTime: {
title: t("certd.fields.createTime"),
type: "datetime",
search: {
show: false,
},
form: {
show: false,
},
},
},
},
};
}

View File

@ -1,62 +1,70 @@
<template>
<fs-button icon="mdi:format-list-group" type="link" text="修改定时" @click="openFormDialog"></fs-button>
<fs-button icon="mdi:format-list-group" type="link" :text="t('certd.editSchedule')"
@click="openFormDialog"></fs-button>
</template>
<script setup lang="ts">
import * as api from "../api";
import { useFormWrapper } from "@fast-crud/fast-crud";
import { useI18n } from "vue-i18n";
const { t } = useI18n();
const props = defineProps<{
selectedRowKeys: any[];
selectedRowKeys: any[];
}>();
const emit = defineEmits<{
change: any;
change: any;
}>();
async function batchUpdateRequest(form: any) {
await api.BatchUpdateTrigger(props.selectedRowKeys, {
title: "定时触发",
type: "timer",
props: form.props,
});
emit("change");
await api.BatchUpdateTrigger(props.selectedRowKeys, {
title: "定时触发",
type: "timer",
props: form.props,
});
emit("change");
}
const { openCrudFormDialog } = useFormWrapper();
async function openFormDialog() {
const crudOptions: any = {
columns: {
"props.cron": {
title: "定时",
form: {
component: {
name: "cron-editor",
vModel: "modelValue",
},
rules: [{ required: true, message: "请选择定时Cron" }],
},
},
},
form: {
mode: "edit",
//@ts-ignore
async doSubmit({ form }) {
await batchUpdateRequest(form);
},
col: {
span: 22,
},
labelCol: {
style: {
width: "100px",
},
},
wrapper: {
title: "批量修改定时",
width: 600,
},
},
} as any;
await openCrudFormDialog({ crudOptions });
const crudOptions: any = {
columns: {
"props.cron": {
title: t("certd.schedule"),
form: {
component: {
name: "cron-editor",
vModel: "modelValue",
},
rules: [{ required: true, message: t("certd.selectCron") }],
},
},
},
form: {
mode: "edit",
//@ts-ignore
async doSubmit({ form }) {
await batchUpdateRequest(form);
},
col: {
span: 22,
},
labelCol: {
style: {
width: "100px",
},
},
wrapper: {
title: t("certd.batchEditSchedule"),
width: 600,
},
},
} as any;
await openCrudFormDialog({ crudOptions });
}
</script>

View File

@ -3,7 +3,7 @@
class="pi-trigger-form" @after-open-change="triggerDrawerOnAfterVisibleChange">
<template #title>
<div>
编辑触发器
{{ t("certd.editTrigger") }}
<a-button v-if="mode === 'edit'" @click="triggerDelete()">
<template #icon>
<DeleteOutlined />
@ -16,27 +16,28 @@
<a-form ref="triggerFormRef" class="trigger-form" :model="currentTrigger" :label-col="labelCol"
:wrapper-col="wrapperCol">
<fs-form-item v-model="currentTrigger.title" :item="{
title: '触发器名称',
title: t('certd.triggerName'),
key: 'title',
component: {
name: 'a-input',
vModel: 'value',
disabled: !editMode,
},
rules: [{ required: true, message: '此项必填' }],
rules: [{ required: true, message: t('certd.requiredField') }],
}" />
<fs-form-item v-model="currentTrigger.type" :item="{
title: '类型',
title: t('certd.type'),
key: 'type',
value: 'timer',
component: {
name: 'a-select',
vModel: 'value',
disabled: !editMode,
options: [{ value: 'timer', label: '定时' }],
options: [{ value: 'timer', label: t('certd.schedule') }],
},
rules: [{ required: true, message: '此项必填' }],
rules: [{ required: true, message: t('certd.requiredField') }],
}" />
<fs-form-item v-model="currentTrigger.props.cron" :item="{
@ -93,11 +94,12 @@ export default {
{
type: "string",
required: true,
message: "请输入名称",
message: t("certd.enterName"),
},
],
});
const triggerDrawerShow = () => {
triggerDrawerVisible.value = true;
};
@ -118,10 +120,11 @@ export default {
const triggerAdd = emit => {
mode.value = "add";
const trigger = { id: nanoid(), title: "定时触发", type: "timer", props: {} };
const trigger = { id: nanoid(), title: t("certd.timerTrigger"), type: "timer", props: {} };
triggerOpen(trigger, emit);
};
const triggerEdit = (trigger, emit) => {
mode.value = "edit";
triggerOpen(trigger, emit);
@ -147,8 +150,8 @@ export default {
const triggerDelete = () => {
Modal.confirm({
title: "确认",
content: `确定要删除此触发器吗?`,
title: t("certd.confirm"),
content: t("certd.confirmDeleteTrigger"),
async onOk() {
callback.value("delete");
triggerDrawerClose();
@ -156,6 +159,7 @@ export default {
});
};
const blankFn = () => {
return {};
};

View File

@ -4,282 +4,285 @@ import { useUserStore } from "/@/store/user";
import { Modal, notification } from "ant-design-vue";
import dayjs from "dayjs";
import { useSettingStore } from "/@/store/settings";
import { useI18n } from "vue-i18n";
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
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: "解除登录锁定",
text: null,
type: "link",
icon: "ion:lock-open-outline",
click: async ({ row }) => {
Modal.confirm({
title: "提示",
content: "确定要解除该用户的登录锁定吗?",
onOk: async () => {
await api.Unlock(row.id);
notification.success({
message: "解除成功",
});
},
});
},
},
},
},
table: {
scroll: {
//使用固定列时需要设置此值,并且大于等于列宽度之和的值
x: 1400,
},
},
columns: {
id: {
title: "id",
type: "text",
form: { show: false }, // 表单配置
column: {
width: 100,
sorter: true,
},
},
createTime: {
title: "创建时间",
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: "用户名",
type: "text",
search: { show: true }, // 开启查询
form: {
rules: [
{ required: true, message: "请输入用户名" },
{ max: 50, message: "最大50个字符" },
],
},
editForm: { component: { disabled: false } },
column: {
sorter: true,
width: 200,
},
},
password: {
title: "密码",
type: "text",
key: "password",
column: {
show: false,
},
form: {
rules: [{ max: 50, message: "最大50个字符" }],
component: {
showPassword: true,
},
helper: "填写则修改密码",
},
},
nickName: {
title: "昵称",
type: "text",
search: { show: true }, // 开启查询
form: {
rules: [{ max: 50, message: "最大50个字符" }],
},
column: {
sorter: true,
},
},
email: {
title: "邮箱",
type: "text",
search: { show: true }, // 开启查询
form: {
rules: [{ max: 50, message: "最大50个字符" }],
},
column: {
sorter: true,
width: 160,
},
},
mobile: {
title: "手机号",
type: "text",
search: { show: true }, // 开启查询
form: {
rules: [{ max: 50, message: "最大50个字符" }],
},
column: {
sorter: true,
width: 130,
},
},
avatar: {
title: "头像",
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: "状态",
type: "dict-switch",
dict: dict({
data: [
{ label: "启用", value: 1, color: "green" },
{ label: "禁用", value: 0, color: "red" },
],
}),
column: {
align: "center",
sorter: true,
width: 100,
},
},
validTime: {
title: "有效期",
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"}></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: "备注",
type: "text",
column: {
sorter: true,
},
form: {
rules: [{ max: 100, message: "最大100个字符" }],
},
},
roles: {
title: "角色",
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: "解除登录锁定",
text: null,
type: "link",
icon: "ion:lock-open-outline",
click: async ({ row }) => {
Modal.confirm({
title: "提示",
content: "确定要解除该用户的登录锁定吗?",
onOk: async () => {
await api.Unlock(row.id);
notification.success({
message: "解除成功",
});
},
});
},
},
},
},
table: {
scroll: {
//使用固定列时需要设置此值,并且大于等于列宽度之和的值
x: 1400,
},
},
columns: {
id: {
title: "id",
type: "text",
form: { show: false }, // 表单配置
column: {
width: 100,
sorter: true,
},
},
createTime: {
title: "创建时间",
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: "用户名",
type: "text",
search: { show: true }, // 开启查询
form: {
rules: [
{ required: true, message: "请输入用户名" },
{ max: 50, message: "最大50个字符" },
],
},
editForm: { component: { disabled: false } },
column: {
sorter: true,
width: 200,
},
},
password: {
title: "密码",
type: "text",
key: "password",
column: {
show: false,
},
form: {
rules: [{ max: 50, message: "最大50个字符" }],
component: {
showPassword: true,
},
helper: "填写则修改密码",
},
},
nickName: {
title: t("certd.nickName"),
type: "text",
search: { show: true }, // 开启查询
form: {
rules: [{ max: 50, message: t("certd.max50Chars") }],
},
column: {
sorter: true,
},
},
email: {
title: "邮箱",
type: "text",
search: { show: true }, // 开启查询
form: {
rules: [{ max: 50, message: "最大50个字符" }],
},
column: {
sorter: true,
width: 160,
},
},
mobile: {
title: "手机号",
type: "text",
search: { show: true }, // 开启查询
form: {
rules: [{ max: 50, message: "最大50个字符" }],
},
column: {
sorter: true,
width: 130,
},
},
avatar: {
title: "头像",
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: "状态",
type: "dict-switch",
dict: dict({
data: [
{ label: "启用", value: 1, color: "green" },
{ label: "禁用", value: 0, color: "red" },
],
}),
column: {
align: "center",
sorter: true,
width: 100,
},
},
validTime: {
title: "有效期",
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"}></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: "备注",
type: "text",
column: {
sorter: true,
},
form: {
rules: [{ max: 100, message: "最大100个字符" }],
},
},
roles: {
title: "角色",
type: "dict-select",
dict: dict({
url: "/sys/authority/role/list",
value: "id",
label: "name",
}), // 数据字典
form: {
component: { mode: "multiple" },
},
column: {
width: 250,
sortable: true,
},
},
},
},
};
}