mirror of
https://github.com/certd/certd.git
synced 2026-04-24 04:17:25 +08:00
🔱: [client] sync upgrade with 6 commits [trident-sync]
chore: build: publish success fix: 修复新页面编辑无法正确获取数据的bug Closes https://github.com/fast-crud/fast-crud/issues/460 fix: 修复antdv4示例没有源码跳转按钮的bug pref: 添加代码编辑器功能 - 新增 fs-editor-code组件实现代码编辑功能 - 支持 javascript、json、yaml三种语言 - 集成 monaco-editor 并配置相关 worker - 添加代码格式校验功能 - 在 fast-extends 中引入新功能模块
This commit is contained in:
@@ -40,6 +40,7 @@ export default defineComponent({
|
||||
position: fixed;
|
||||
right: 3px;
|
||||
bottom: 20px;
|
||||
z-index: 1000;
|
||||
.fs-source-link {
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<script lang="ts" setup>
|
||||
import { BasicLayout, LockScreen, UserDropdown } from "/@/vben/layouts";
|
||||
|
||||
import FsSourceLink from "./components/source-link/index.vue";
|
||||
import { computed } from "vue";
|
||||
import { VBEN_DOC_URL } from "/@/vben/constants";
|
||||
import { BookOpenText } from "/@/vben/icons";
|
||||
@@ -43,5 +43,8 @@ async function handleLogout() {
|
||||
<template #lock-screen>
|
||||
<LockScreen :avatar @to-login="handleLogout" />
|
||||
</template>
|
||||
<template #extra>
|
||||
<FsSourceLink />
|
||||
</template>
|
||||
</BasicLayout>
|
||||
</template>
|
||||
|
||||
@@ -188,7 +188,7 @@ const mockUtil: any = {
|
||||
handle(req: any) {
|
||||
let id = req.params.id;
|
||||
id = parseInt(id);
|
||||
const current = findById(req.body.id, list);
|
||||
const current = findById(id, list);
|
||||
return {
|
||||
code: 0,
|
||||
msg: "success",
|
||||
|
||||
@@ -2,7 +2,6 @@ import "./iconify";
|
||||
import "./iconfont";
|
||||
import FastCrud from "./fast-crud";
|
||||
import permission from "./permission";
|
||||
|
||||
function install(app: any, options: any = {}) {
|
||||
app.use(FastCrud, options);
|
||||
app.use(permission);
|
||||
|
||||
@@ -304,6 +304,12 @@ export const crudResources = [
|
||||
path: "/crud/component/editor",
|
||||
component: "/crud/component/editor/index.vue"
|
||||
},
|
||||
{
|
||||
title: "代码编辑器",
|
||||
name: "ComponentCode",
|
||||
path: "/crud/component/code",
|
||||
component: "/crud/component/code/index.vue"
|
||||
},
|
||||
{
|
||||
title: "图标",
|
||||
name: "ComponentIcon",
|
||||
|
||||
@@ -21,6 +21,7 @@ export default async function ({ crudExpose }: CreateCrudOptionsProps): Promise<
|
||||
|
||||
return {
|
||||
crudOptions: {
|
||||
id: "right-table",
|
||||
pagination: {
|
||||
showSizeChanger: false, // antdv
|
||||
showQuickJumper: false // antdv
|
||||
|
||||
@@ -31,6 +31,7 @@ export default function ({ crudExpose, context: { asideTableRef } }: CreateCrudO
|
||||
};
|
||||
return {
|
||||
crudOptions: {
|
||||
id: "main-table",
|
||||
table: {
|
||||
customRow(record: any, index: number) {
|
||||
const clazz = record.id === currentRow.value ? "fs-current-row" : "";
|
||||
|
||||
@@ -21,6 +21,7 @@ export default function ({ crudExpose, context: { props, ctx } }: CreateCrudOpti
|
||||
|
||||
return {
|
||||
crudOptions: {
|
||||
id: "sub-table",
|
||||
table: {
|
||||
customRow(record: any, index: number) {
|
||||
const clazz = record.id === props.modelValue ? "fs-current-row" : "";
|
||||
|
||||
@@ -0,0 +1,42 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/ComponentJson";
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
data: query
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
data: obj
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
data: obj
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
params: { id }
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/get",
|
||||
method: "get",
|
||||
params: { id }
|
||||
});
|
||||
}
|
||||
@@ -0,0 +1,110 @@
|
||||
import * as api from "./api";
|
||||
|
||||
import { FsEditorCodeValidators } from "@fast-crud/fast-extends";
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, EditReq, UserPageQuery, UserPageRes, ValueBuilderContext, ValueResolveContext } from "@fast-crud/fast-crud";
|
||||
export default async function ({ crudExpose }: CreateCrudOptionsProps): Promise<CreateCrudOptionsRet> {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
if (form.id == null) {
|
||||
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
|
||||
},
|
||||
form: {
|
||||
wrapper: {
|
||||
async onOpened({ mode, formRef }) {
|
||||
// if (!formRef.form.async) {
|
||||
// setTimeout(() => {
|
||||
// formRef.form.async = { aaa: "11", bb: "111" };
|
||||
// }, 2000);
|
||||
// }
|
||||
}
|
||||
}
|
||||
},
|
||||
columns: {
|
||||
javascript: {
|
||||
title: "js code",
|
||||
type: "editor-code",
|
||||
form: {
|
||||
show: true,
|
||||
component: {
|
||||
language: "javascript"
|
||||
}
|
||||
}
|
||||
},
|
||||
yaml: {
|
||||
title: "yaml",
|
||||
type: "editor-code",
|
||||
form: {
|
||||
show: true,
|
||||
rules: FsEditorCodeValidators.yamlRule,
|
||||
component: {
|
||||
language: "yaml",
|
||||
schema: {
|
||||
//数据校验提示
|
||||
type: "object",
|
||||
properties: {
|
||||
p1: {
|
||||
enum: ["v1", "v2"],
|
||||
description: "数据校验提示"
|
||||
},
|
||||
property: {
|
||||
description: "I have a description"
|
||||
},
|
||||
titledProperty: {
|
||||
title: "I have a title",
|
||||
description: "I also have a description"
|
||||
},
|
||||
markdown: {
|
||||
markdownDescription: "Even **markdown** _descriptions_ `are` ~~not~~ supported!"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
json: {
|
||||
title: "json",
|
||||
type: "editor-code",
|
||||
form: {
|
||||
show: true,
|
||||
rules: FsEditorCodeValidators.jsonRule,
|
||||
component: {
|
||||
language: "json",
|
||||
vModel: "modelValue",
|
||||
schema: {
|
||||
//校验提示
|
||||
type: "object",
|
||||
properties: {
|
||||
p1: {
|
||||
enum: ["v1", "v2"],
|
||||
description: "数据校验示例"
|
||||
}
|
||||
}
|
||||
},
|
||||
config: {}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
@@ -0,0 +1,32 @@
|
||||
<template>
|
||||
<fs-page>
|
||||
<fs-crud ref="crudRef" v-bind="crudBinding" />
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted, ref } from "vue";
|
||||
import { useFsAsync, useFsRef } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud.js";
|
||||
|
||||
export default defineComponent({
|
||||
name: "ComponentCode",
|
||||
setup() {
|
||||
const { crudRef, crudBinding } = useFsRef();
|
||||
|
||||
const monacoRef = ref();
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(async () => {
|
||||
const { crudExpose } = await useFsAsync({ crudBinding, crudRef, createCrudOptions });
|
||||
|
||||
await crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
crudBinding,
|
||||
crudRef,
|
||||
monacoRef
|
||||
};
|
||||
}
|
||||
});
|
||||
</script>
|
||||
@@ -0,0 +1,24 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options: any = {
|
||||
name: "ComponentJson",
|
||||
idGenerator: 0
|
||||
};
|
||||
const list: any = [
|
||||
{
|
||||
json: '{"p1":1,"b":2}',
|
||||
yaml: `
|
||||
property: 1
|
||||
p1: 3
|
||||
services:
|
||||
certd:
|
||||
container_name: certd
|
||||
`,
|
||||
javascript: `console.log(123)`
|
||||
},
|
||||
{
|
||||
json: '{"p1":3,"b":4}'
|
||||
}
|
||||
];
|
||||
options.list = list;
|
||||
const mock = mockUtil.buildMock(options);
|
||||
export default mock;
|
||||
Reference in New Issue
Block a user