mirror of
https://github.com/certd/certd.git
synced 2026-05-15 20:47:31 +08:00
🔱: [client] sync upgrade with 12 commits [trident-sync]
refactor: 1.11.0 refactor: 1.11.0 refactor: 1.11.0 refactor: 1.11.0 refactor: ts化 refactor: ts化 feat: 全面TS化 perf: 全面ts化 refactor: 继续优化ts perf: ts定义优化 fix: 修复wangeditor无法上传视频的bug
This commit is contained in:
+6
-5
@@ -1,7 +1,8 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/AdvancedBigData";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +10,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +18,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +26,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +34,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+7
-8
@@ -1,19 +1,19 @@
|
||||
import * as api from "./api";
|
||||
import { message } from "ant-design-vue";
|
||||
import { dict } from "@fast-crud/fast-crud";
|
||||
export default function ({ expose }) {
|
||||
const pageRequest = async (query) => {
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
@@ -41,7 +41,6 @@ export default function ({ expose }) {
|
||||
columns: {
|
||||
id: {
|
||||
title: "ID",
|
||||
key: "id",
|
||||
type: "number",
|
||||
column: {
|
||||
width: 50
|
||||
@@ -7,30 +7,18 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud, useExpose } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud.js";
|
||||
|
||||
export default defineComponent({
|
||||
name: "AdvancedBigData",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions, output } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
|
||||
const { crudBinding, crudRef, crudExpose, output } = useFs({ createCrudOptions });
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+2
-1
@@ -1,5 +1,6 @@
|
||||
// @ts-ignore
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "AdvancedBigData",
|
||||
idGenerator: 0,
|
||||
copyTimes: 1000
|
||||
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/AdvancedFromBackend";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
|
||||
@@ -1,11 +1,20 @@
|
||||
<template>
|
||||
<fs-crud v-if="crudBinding" ref="crudRef" v-bind="crudBinding" />
|
||||
<fs-page>
|
||||
<template #header>
|
||||
<div class="title">CrudOptions从后台加载</div>
|
||||
<div class="more">
|
||||
<a target="_blank" href="http://fast-crud.docmirror.cn/api/use.html#usefsasync">文档</a>
|
||||
</div>
|
||||
</template>
|
||||
<fs-crud v-if="crudBinding" ref="crudRef" v-bind="crudBinding" />
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, ref, onMounted, Ref } from "vue";
|
||||
import { useCrud, dict, useExpose, useFs, UseFsProps, CrudBinding, CreateCrudOptionsRet, useFsAsync } from "@fast-crud/fast-crud";
|
||||
import { defineComponent, onMounted, ref, Ref } from "vue";
|
||||
import { CrudBinding, useFsAsync } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "AdvancedFromBackend",
|
||||
setup() {
|
||||
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/AdvancedInDialog";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+13
-16
@@ -1,19 +1,22 @@
|
||||
import * as api from "./api";
|
||||
export default function ({ expose }) {
|
||||
const pageRequest = async (query) => {
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, EditReq, UserPageQuery, UserPageRes, dict } from "@fast-crud/fast-crud";
|
||||
import { SearchOutlined } from "@ant-design/icons-vue";
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
@@ -68,23 +71,16 @@ export default function ({ expose }) {
|
||||
},
|
||||
render: {
|
||||
title: "复杂输入(render)",
|
||||
type: "text",
|
||||
form: {
|
||||
title: "复杂输入",
|
||||
component: {
|
||||
render(context) {
|
||||
render(context: any) {
|
||||
console.log("context scope", context);
|
||||
return (
|
||||
<a-input-group compact>
|
||||
<a-input
|
||||
placeholder={"render1 input"}
|
||||
style="width: 50%"
|
||||
v-model={[context.form.render, "value"]}
|
||||
/>
|
||||
<a-input
|
||||
placeholder={"render2 input"}
|
||||
style="width: 50%"
|
||||
v-model={[context.form.render2, "value"]}
|
||||
/>
|
||||
<a-input placeholder={"render1 input"} style="width: 50%" v-model={[context.form.render, "value"]} />
|
||||
<a-input placeholder={"render2 input"} style="width: 50%" v-model={[context.form.render2, "value"]} />
|
||||
</a-input-group>
|
||||
);
|
||||
}
|
||||
@@ -93,6 +89,7 @@ export default function ({ expose }) {
|
||||
},
|
||||
render2: {
|
||||
title: "我的值是由复杂输入列输入的",
|
||||
type: "text",
|
||||
column: {
|
||||
width: "300px"
|
||||
},
|
||||
@@ -4,31 +4,19 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "fs-in-dialog",
|
||||
name: "FsInDialog",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+2
-1
@@ -1,5 +1,6 @@
|
||||
// @ts-ignore
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "AdvancedInDialog",
|
||||
idGenerator: 0
|
||||
};
|
||||
@@ -1,32 +1,30 @@
|
||||
<template>
|
||||
<fs-page>
|
||||
<template #header>
|
||||
<div class="title">
|
||||
对话框中显示crud
|
||||
</div>
|
||||
<div class="title">对话框中显示crud</div>
|
||||
</template>
|
||||
<div style="padding:50px">
|
||||
<div style="padding: 50px">
|
||||
<a-button type="primary" @click="openDialog">打开对话框</a-button>
|
||||
</div>
|
||||
|
||||
<a-modal v-model:visible="dialogShow" width="80%" title="fs-crud in dialog">
|
||||
<div style="height: 400px;position: relative">
|
||||
<fs-in-dialog ></fs-in-dialog>
|
||||
<div style="height: 400px; position: relative">
|
||||
<fs-in-dialog></fs-in-dialog>
|
||||
</div>
|
||||
</a-modal>
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<script lang="ts">
|
||||
import { defineComponent, ref } from "vue";
|
||||
import FsInDialog from './crud/index.vue'
|
||||
import FsInDialog from "./crud/index.vue";
|
||||
export default defineComponent({
|
||||
name: "InDialog",
|
||||
components:{FsInDialog},
|
||||
components: { FsInDialog },
|
||||
setup() {
|
||||
const dialogShow = ref(false)
|
||||
function openDialog(){
|
||||
dialogShow.value=true
|
||||
const dialogShow = ref(false);
|
||||
function openDialog() {
|
||||
dialogShow.value = true;
|
||||
}
|
||||
return {
|
||||
dialogShow,
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import * as api from "./api";
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, ScopeContext, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
export default function ({ expose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
@@ -30,7 +30,6 @@ export default function ({ expose }: CreateCrudOptionsProps): CreateCrudOptionsR
|
||||
columns: {
|
||||
id: {
|
||||
title: "ID",
|
||||
key: "id",
|
||||
type: "number",
|
||||
column: {
|
||||
width: 50
|
||||
@@ -51,7 +50,7 @@ export default function ({ expose }: CreateCrudOptionsProps): CreateCrudOptionsR
|
||||
cache: true
|
||||
}),
|
||||
form: {
|
||||
valueChange({ form, value, getComponentRef }: ScopeContext) {
|
||||
valueChange({ form, value, getComponentRef }) {
|
||||
form.city = undefined; // 将“city”的值置空
|
||||
form.county = undefined; // 将“county”的值置空
|
||||
if (value) {
|
||||
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/AdvancedLocalPagination";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+11
-9
@@ -1,14 +1,16 @@
|
||||
import * as api from "./api";
|
||||
import * as api from "./api.js";
|
||||
import _ from "lodash-es";
|
||||
import { dict } from "@fast-crud/fast-crud";
|
||||
export default function ({ expose, localDataRef }) {
|
||||
const pageRequest = async ({ page, query }) => {
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
|
||||
export default function ({ crudExpose, localDataRef }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
const { page } = query;
|
||||
//总数据
|
||||
let data = localDataRef.value;
|
||||
//获取请求参数
|
||||
const limit = page.limit;
|
||||
let offset = page.offset;
|
||||
data = data.filter((item) => {
|
||||
const offset = page.offset;
|
||||
data = data.filter((item: any) => {
|
||||
// 根据你的业务,编写你的本地查询逻辑
|
||||
// text改成你的查询字段
|
||||
if (query.status && item.status !== query.status) {
|
||||
@@ -33,7 +35,7 @@ export default function ({ expose, localDataRef }) {
|
||||
records
|
||||
};
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
await api.UpdateObj(form);
|
||||
//更新本地数据
|
||||
@@ -45,7 +47,7 @@ export default function ({ expose, localDataRef }) {
|
||||
}
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
const id = await api.AddObj(form);
|
||||
//本地添加
|
||||
form.id = id;
|
||||
@@ -53,7 +55,7 @@ export default function ({ expose, localDataRef }) {
|
||||
return id;
|
||||
};
|
||||
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
await api.DelObj(row.id);
|
||||
//本地删除那一条记录
|
||||
const tableData = localDataRef.value;
|
||||
@@ -11,9 +11,9 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
<script lang="ts">
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud, useExpose } from "@fast-crud/fast-crud";
|
||||
import { useCrud, useExpose, useFs } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { GetList } from "./api";
|
||||
|
||||
@@ -36,16 +36,10 @@ export default defineComponent({
|
||||
const ret = await GetList({ page: { offset: 0, limit: 99999999 }, query: {}, sort: {} });
|
||||
localDataRef.value = ret.records;
|
||||
|
||||
//然后再初始化crud
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ expose, localDataRef });
|
||||
// 初始化crud配置
|
||||
useCrud({ expose, crudOptions });
|
||||
const { crudExpose } = useFs({ crudBinding, crudRef, createCrudOptions, localDataRef });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
await expose.doRefresh();
|
||||
await crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+2
-1
@@ -1,5 +1,6 @@
|
||||
// @ts-ignore
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "AdvancedLocalPagination",
|
||||
idGenerator: 0
|
||||
};
|
||||
+6
-6
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/AdvancedNest";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
@@ -41,7 +41,7 @@ export function GetObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function BatchDelete(ids) {
|
||||
export function BatchDelete(ids: any[]) {
|
||||
return request({
|
||||
url: apiPrefix + "/batchDelete",
|
||||
method: "post",
|
||||
+6
-6
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/AdvancedAside";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
@@ -41,7 +41,7 @@ export function GetObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function BatchDelete(ids) {
|
||||
export function BatchDelete(ids: any[]) {
|
||||
return request({
|
||||
url: apiPrefix + "/batchDelete",
|
||||
method: "post",
|
||||
+10
-5
@@ -1,14 +1,19 @@
|
||||
import * as api from "./api";
|
||||
import { dict } from "@fast-crud/fast-crud";
|
||||
export default function ({ expose }) {
|
||||
const editRequest = async ({ form, row }) => {
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
|
||||
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 }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
const addRequest = async ({ form }) => {
|
||||
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
@@ -6,37 +6,26 @@
|
||||
</fs-crud>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose, useCrud } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import createCrudOptions from "./crud.js";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "AsideTable",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions, selectedIds } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
crudBinding,
|
||||
crudRef,
|
||||
setSearchFormData: expose.setSearchFormData,
|
||||
doRefresh: expose.doRefresh
|
||||
setSearchFormData: crudExpose.setSearchFormData,
|
||||
doRefresh: crudExpose.doRefresh
|
||||
};
|
||||
}
|
||||
});
|
||||
|
||||
+2
-1
@@ -1,5 +1,6 @@
|
||||
// @ts-ignore
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "AdvancedAside",
|
||||
idGenerator: 0
|
||||
};
|
||||
+13
-7
@@ -1,21 +1,27 @@
|
||||
import * as api from "./api";
|
||||
import { ref, shallowRef } from "vue";
|
||||
import SubTable from "./sub-table/index.vue";
|
||||
import { compute } from "@fast-crud/fast-crud";
|
||||
export default function ({ expose, asideTableRef }) {
|
||||
const editRequest = async ({ form, row }) => {
|
||||
import { AddReq, compute, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
|
||||
export default function ({ crudExpose, asideTableRef }: 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 }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
const addRequest = async ({ form }) => {
|
||||
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
const currentRow = ref();
|
||||
|
||||
const onCurrentRowChange = (id) => {
|
||||
const onCurrentRowChange = (id: number) => {
|
||||
currentRow.value = id;
|
||||
asideTableRef.value.setSearchFormData({ form: { gradeId: id } });
|
||||
asideTableRef.value.doRefresh();
|
||||
@@ -23,7 +29,7 @@ export default function ({ expose, asideTableRef }) {
|
||||
return {
|
||||
crudOptions: {
|
||||
table: {
|
||||
customRow(record, index) {
|
||||
customRow(record: any, index: number) {
|
||||
const clazz = record.id === currentRow.value ? "fs-current-row" : "";
|
||||
return {
|
||||
onClick() {
|
||||
@@ -13,34 +13,24 @@
|
||||
</a-row>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose, useCrud } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted, ref } from "vue";
|
||||
import createCrudOptions from "./crud.js";
|
||||
import AsideTable from "./aside-table/index.vue";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "FeatureNest",
|
||||
// eslint-disable-next-line vue/no-unused-components
|
||||
components: { AsideTable },
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const asideTableRef = ref();
|
||||
const { crudOptions } = createCrudOptions({ expose, asideTableRef });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions, asideTableRef });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+2
-1
@@ -1,5 +1,6 @@
|
||||
// @ts-ignore
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "AdvancedNest",
|
||||
idGenerator: 0
|
||||
};
|
||||
+6
-6
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/AdvancedSubTable";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
@@ -41,7 +41,7 @@ export function GetObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function BatchDelete(ids) {
|
||||
export function BatchDelete(ids: any[]) {
|
||||
return request({
|
||||
url: apiPrefix + "/batchDelete",
|
||||
method: "post",
|
||||
+11
-5
@@ -1,20 +1,26 @@
|
||||
import * as api from "./api";
|
||||
export default function ({ expose, props, ctx }) {
|
||||
const editRequest = async ({ form, row }) => {
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
|
||||
export default function ({ crudExpose, props, ctx }: 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 }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
const addRequest = async ({ form }) => {
|
||||
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
return {
|
||||
crudOptions: {
|
||||
table: {
|
||||
customRow(record, index) {
|
||||
customRow(record: any, index: number) {
|
||||
const clazz = record.id === props.modelValue ? "fs-current-row" : "";
|
||||
return {
|
||||
onClick() {
|
||||
@@ -7,10 +7,11 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted, watch } from "vue";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted, watch } from "vue";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose, useCrud } from "@fast-crud/fast-crud";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "SubTable",
|
||||
props: {
|
||||
@@ -19,23 +20,11 @@ export default defineComponent({
|
||||
},
|
||||
emits: ["update:modelValue"],
|
||||
setup(props, ctx) {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ expose, props, ctx });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions, props, ctx });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
//你的业务代码
|
||||
|
||||
+2
-1
@@ -1,5 +1,6 @@
|
||||
// @ts-ignore
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "AdvancedSubTable",
|
||||
idGenerator: 0
|
||||
};
|
||||
@@ -1,6 +1,6 @@
|
||||
import * as api from "./api.js";
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
export default function ({ expose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
// @ts-ignore
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "BasisColumnsSet",
|
||||
idGenerator: 0
|
||||
};
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/FormComputeMore";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
// @ts-ignore
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "FormComputeMore",
|
||||
idGenerator: 0
|
||||
};
|
||||
|
||||
@@ -1,8 +1,9 @@
|
||||
import * as api from "./api";
|
||||
import { requestForMock } from "/src/api/service";
|
||||
import { AddReq, ButtonProps, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, EditReq, RowHandleProps, useCompute, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, EditReq, GetContextFn, ScopeContext, useCompute, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
import { message } from "ant-design-vue";
|
||||
import { ref, computed } from "vue";
|
||||
import { computed, ref } from "vue";
|
||||
|
||||
const { asyncCompute, compute } = useCompute();
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
@@ -59,7 +60,7 @@ export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOpti
|
||||
rowHandle: {
|
||||
fixed: "right",
|
||||
show: computed(() => {
|
||||
return false;
|
||||
return true;
|
||||
}),
|
||||
buttons: {
|
||||
edit: {
|
||||
@@ -71,13 +72,7 @@ export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOpti
|
||||
show: compute(({ row }) => {
|
||||
return row.editable;
|
||||
})
|
||||
},
|
||||
custom: compute(({ row }) => {
|
||||
return {
|
||||
text: "动态按钮:" + row.id,
|
||||
show: true
|
||||
};
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
columns: {
|
||||
@@ -162,7 +157,7 @@ export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOpti
|
||||
vModel: "value",
|
||||
placeholder: "异步计算远程获取options",
|
||||
options: asyncCompute({
|
||||
async asyncFn(watchValue, context) {
|
||||
async asyncFn(watchValue: any, context: GetContextFn) {
|
||||
const url = "/mock/dicts/OpenStatusEnum?remote";
|
||||
return await requestForMock({ url });
|
||||
}
|
||||
@@ -181,10 +176,10 @@ export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOpti
|
||||
vModel: "value",
|
||||
placeholder: "异步计算远程获取options",
|
||||
options: asyncCompute({
|
||||
watch({ form }: any) {
|
||||
watch({ form }: ScopeContext) {
|
||||
return form.compute;
|
||||
},
|
||||
async asyncFn(watchValue) {
|
||||
async asyncFn(watchValue: string) {
|
||||
message.info("监听switch,触发远程获取options");
|
||||
const url = watchValue ? "/mock/dicts/OpenStatusEnum?remote" : "/mock/dicts/moreOpenStatusEnum?remote";
|
||||
return await requestForMock({ url });
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
// @ts-ignore
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "FormCompute",
|
||||
idGenerator: 0
|
||||
};
|
||||
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/BasisI18n";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+10
-7
@@ -1,22 +1,25 @@
|
||||
import * as api from "./api";
|
||||
import { dict } from "@fast-crud/fast-crud";
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
import { useI18n } from "vue-i18n";
|
||||
export default function ({ expose }) {
|
||||
const { t } = useI18n();
|
||||
const pageRequest = async (query) => {
|
||||
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
@@ -14,32 +14,19 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
import { message } from "ant-design-vue";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import createCrudOptions from "./crud.js";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "BasisI18n",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+1
-1
@@ -1,5 +1,5 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "BasisI18n",
|
||||
idGenerator: 0
|
||||
};
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/BasisLayoutCard";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+9
-8
@@ -1,23 +1,24 @@
|
||||
import * as api from "./api";
|
||||
import { dict } from "@fast-crud/fast-crud";
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
import { computed } from "vue";
|
||||
|
||||
export default function ({ crudExpose }) {
|
||||
const pageRequest = async (query) => {
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
let cityDictRef = dict({
|
||||
|
||||
const cityDictRef = dict({
|
||||
value: "id",
|
||||
label: "text",
|
||||
data: [
|
||||
@@ -48,7 +49,7 @@ export default function ({ crudExpose }) {
|
||||
options: computed(() => {
|
||||
return cityDictRef.data;
|
||||
})
|
||||
},
|
||||
} as any,
|
||||
columns: {
|
||||
id: {
|
||||
title: "ID",
|
||||
@@ -10,27 +10,15 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "BasisLayoutCard",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { crudExpose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ crudExpose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ crudExpose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
|
||||
+1
-1
@@ -1,5 +1,5 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "BasisLayoutCard",
|
||||
idGenerator: 0
|
||||
};
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/BasisLayoutCustom";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+8
-7
@@ -1,22 +1,23 @@
|
||||
import * as api from "./api";
|
||||
import { dict } from "@fast-crud/fast-crud";
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
import CustomLayout from "./custom-layout.vue";
|
||||
import { shallowRef } from "vue";
|
||||
export default function ({ crudExpose }) {
|
||||
const pageRequest = async (query) => {
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
return {
|
||||
crudOptions: {
|
||||
container: {
|
||||
@@ -26,7 +27,7 @@ export default function ({ crudExpose }) {
|
||||
show: true,
|
||||
name: "city",
|
||||
type: "card"
|
||||
},
|
||||
} as any,
|
||||
request: {
|
||||
pageRequest,
|
||||
addRequest,
|
||||
@@ -13,27 +13,15 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud.js";
|
||||
|
||||
export default defineComponent({
|
||||
name: "BasisLayoutCustom",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { crudExpose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ crudExpose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ crudExpose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
|
||||
+1
-1
@@ -1,5 +1,5 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "BasisLayoutCustom",
|
||||
idGenerator: 0
|
||||
};
|
||||
@@ -15,7 +15,7 @@
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import { useFs, UseFsProps } from "@fast-crud/fast-crud";
|
||||
import { CrudOptions, DynamicType, useFs, UseFsProps } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud.js";
|
||||
import _ from "lodash-es";
|
||||
export default defineComponent({
|
||||
@@ -26,7 +26,7 @@ export default defineComponent({
|
||||
|
||||
setTimeout(() => {
|
||||
//合并新的crudOptions
|
||||
const newOptions = _.merge(crudOptions, {
|
||||
const newOptions: DynamicType<CrudOptions> = _.merge(crudOptions, {
|
||||
columns: {
|
||||
text: {
|
||||
title: "追加字段",
|
||||
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/BasisValueChange";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+11
-10
@@ -1,19 +1,20 @@
|
||||
import * as api from "./api";
|
||||
import { message } from "ant-design-vue";
|
||||
import { dict } from "@fast-crud/fast-crud";
|
||||
export default function ({ expose }) {
|
||||
const pageRequest = async (query) => {
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, UserPageQuery, UserPageRes, ValueChangeContext } from "@fast-crud/fast-crud";
|
||||
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
@@ -52,12 +53,12 @@ export default function ({ expose }) {
|
||||
name: "fs-dict-switch",
|
||||
vModel: "checked"
|
||||
},
|
||||
valueChange(context) {
|
||||
valueChange(context: ValueChangeContext) {
|
||||
console.log("column value changed:", context);
|
||||
}
|
||||
},
|
||||
form: {
|
||||
valueChange({ value, key, form }) {
|
||||
valueChange({ value, key, form }: ValueChangeContext) {
|
||||
console.log("valueChanged,", key, value, form);
|
||||
message.info(`valueChanged:${key}=${value}`);
|
||||
}
|
||||
@@ -67,7 +68,7 @@ export default function ({ expose }) {
|
||||
title: "value-change",
|
||||
type: "text",
|
||||
form: {
|
||||
valueChange({ value, key, form }) {
|
||||
valueChange({ value, key, form }: ValueChangeContext) {
|
||||
console.log("valueChanged,", key, value, form);
|
||||
message.info(`valueChanged:${key}=${value}`);
|
||||
}
|
||||
@@ -81,7 +82,7 @@ export default function ({ expose }) {
|
||||
},
|
||||
form: {
|
||||
valueChange: {
|
||||
handle({ value, key, form, immediate }) {
|
||||
handle({ value, key, form, immediate }: ValueChangeContext) {
|
||||
console.log("valueChange,", key, value, "isImmediate=", immediate);
|
||||
message.info(`valueChanged:${key}=${value},isImmediate=${immediate}`);
|
||||
},
|
||||
@@ -10,30 +10,19 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud, useExpose } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud.js";
|
||||
|
||||
export default defineComponent({
|
||||
name: "BasisValueChange",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions, output } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose, output } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+1
-1
@@ -1,5 +1,5 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "BasisValueChange",
|
||||
idGenerator: 0
|
||||
};
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/ComponentButton";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+8
-7
@@ -1,22 +1,23 @@
|
||||
import * as api from "./api";
|
||||
import { requestForMock } from "/src/api/service";
|
||||
import { dict, compute } from "@fast-crud/fast-crud";
|
||||
import { AddReq, compute, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
import { message } from "ant-design-vue";
|
||||
export default function ({ expose }) {
|
||||
const pageRequest = async (query) => {
|
||||
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
@@ -4,31 +4,19 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud.js";
|
||||
|
||||
export default defineComponent({
|
||||
name: "ComponentButton",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+1
-1
@@ -1,5 +1,5 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "ComponentButton",
|
||||
idGenerator: 0
|
||||
};
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/ComponentCascader";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+11
-11
@@ -1,19 +1,20 @@
|
||||
import * as api from "./api";
|
||||
import { requestForMock } from "/src/api/service";
|
||||
import { dict } from "@fast-crud/fast-crud";
|
||||
export default function ({ crudRef }) {
|
||||
const pageRequest = async (query) => {
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
return {
|
||||
@@ -47,7 +48,6 @@ export default function ({ crudRef }) {
|
||||
search: { show: true },
|
||||
type: "dict-cascader",
|
||||
dict: dict({
|
||||
cloneable: false,
|
||||
isTree: true,
|
||||
url: "/mock/dicts/cascaderData?single"
|
||||
})
|
||||
@@ -61,7 +61,7 @@ export default function ({ crudRef }) {
|
||||
label: "name",
|
||||
isTree: true,
|
||||
prototype: true,
|
||||
getNodesByValues(values) {
|
||||
getNodesByValues(values: any) {
|
||||
//给cell展示组件调用,根据value值获取节点,每行都会请求一次
|
||||
if (values == null) {
|
||||
return [];
|
||||
@@ -87,7 +87,7 @@ export default function ({ crudRef }) {
|
||||
isLeaf: false
|
||||
}
|
||||
],
|
||||
loadData: async (selectedOptions) => {
|
||||
loadData: async (selectedOptions: any) => {
|
||||
console.log("lazyLoad", selectedOptions);
|
||||
const targetOption = selectedOptions[selectedOptions.length - 1];
|
||||
targetOption.loading = true;
|
||||
@@ -122,8 +122,8 @@ export default function ({ crudRef }) {
|
||||
form: {
|
||||
component: {
|
||||
showSearch: {
|
||||
filter: (inputValue, path) => {
|
||||
return path.some((option) => option.label.toLowerCase().indexOf(inputValue.toLowerCase()) > -1);
|
||||
filter: (inputValue: any, path: any) => {
|
||||
return path.some((option: any) => option.label.toLowerCase().indexOf(inputValue.toLowerCase()) > -1);
|
||||
}
|
||||
},
|
||||
"change-on-select": true
|
||||
@@ -4,31 +4,19 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import createCrudOptions from "./crud.js";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "ComponentCascader",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+1
-1
@@ -1,5 +1,5 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "ComponentCascader",
|
||||
idGenerator: 0
|
||||
};
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/ComponentCheckbox";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+7
-7
@@ -1,19 +1,19 @@
|
||||
import * as api from "./api";
|
||||
import { requestForMock } from "/src/api/service";
|
||||
import { dict } from "@fast-crud/fast-crud";
|
||||
export default function ({ crudRef }) {
|
||||
const pageRequest = async (query) => {
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
return {
|
||||
@@ -4,31 +4,19 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "ComponentCheckbox",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+1
-1
@@ -1,5 +1,5 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "ComponentCheckbox",
|
||||
idGenerator: 0
|
||||
};
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/ComponentDate";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+10
-9
@@ -1,23 +1,24 @@
|
||||
import * as api from "./api";
|
||||
import { utils } from "@fast-crud/fast-crud";
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, EditReq, ScopeContext, UserPageQuery, UserPageRes, utils } from "@fast-crud/fast-crud";
|
||||
import dayjs from "dayjs";
|
||||
|
||||
console.log("utils", utils);
|
||||
export default function ({ expose }) {
|
||||
const pageRequest = async (query) => {
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
@@ -116,8 +117,8 @@ export default function ({ expose }) {
|
||||
form: {
|
||||
component: {
|
||||
valueFormat: "YYYY-MM-DD HH:mm:ss", //输入值的格式
|
||||
events: {
|
||||
onChange(context) {
|
||||
on: {
|
||||
onChange(context: ScopeContext) {
|
||||
console.log("change", context);
|
||||
}
|
||||
}
|
||||
@@ -175,7 +176,7 @@ export default function ({ expose }) {
|
||||
form: {
|
||||
component: {
|
||||
valueFormat: "YYYY-MM-DD HH:mm:ss", //输入值的格式
|
||||
disabledDate(current) {
|
||||
disabledDate(current: any) {
|
||||
return current && current < dayjs().endOf("day");
|
||||
}
|
||||
}
|
||||
@@ -2,40 +2,25 @@
|
||||
<fs-page>
|
||||
<fs-crud ref="crudRef" v-bind="crudBinding">
|
||||
<template #actionbar-right>
|
||||
<a-alert
|
||||
style="margin-left: 10px"
|
||||
message="关于日期时间,建议前后端统一使用时间戳(long类型)进行交互,可以避免时区转化带来的问题"
|
||||
/>
|
||||
<a-alert style="margin-left: 10px" message="关于日期时间,建议前后端统一使用时间戳(long类型)进行交互,可以避免时区转化带来的问题" />
|
||||
</template>
|
||||
</fs-crud>
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import createCrudOptions from "./crud.js";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "ComponentDate",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "ComponentDate",
|
||||
idGenerator: 0
|
||||
};
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/ComponentEditor";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+20
-21
@@ -1,20 +1,23 @@
|
||||
import * as api from "./api";
|
||||
import { utils, dict, compute } from "@fast-crud/fast-crud";
|
||||
export default function ({ expose }) {
|
||||
const pageRequest = async (query) => {
|
||||
import { utils, dict, compute, CreateCrudOptionsProps, CreateCrudOptionsRet, UserPageQuery, UserPageRes, EditReq, DelReq, AddReq, ScopeContext } from "@fast-crud/fast-crud";
|
||||
import { FsUploaderFormOptions } from "@fast-crud/fast-extends";
|
||||
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
@@ -26,7 +29,6 @@ export default function ({ expose }) {
|
||||
columns: {
|
||||
id: {
|
||||
title: "ID",
|
||||
key: "id",
|
||||
type: "number",
|
||||
column: {
|
||||
width: 50
|
||||
@@ -41,22 +43,19 @@ export default function ({ expose }) {
|
||||
column: {
|
||||
width: 400
|
||||
},
|
||||
form:{
|
||||
col: { span: 24 },
|
||||
},
|
||||
form: {
|
||||
col: { span: 24 }
|
||||
}
|
||||
},
|
||||
text: {
|
||||
title: "摘要",
|
||||
type: "textarea",
|
||||
form:{
|
||||
col: { span: 24 },
|
||||
form: {
|
||||
col: { span: 24 }
|
||||
},
|
||||
viewForm: {
|
||||
component: {
|
||||
name: null,
|
||||
render(h, scope) {
|
||||
return <div>{scope.value}</div>;
|
||||
}
|
||||
render(scope: ScopeContext) {
|
||||
return <div>{scope.value}</div>;
|
||||
}
|
||||
}
|
||||
},
|
||||
@@ -77,9 +76,9 @@ export default function ({ expose }) {
|
||||
width: 300,
|
||||
show: false
|
||||
},
|
||||
type: ["editor-wang5"], // 富文本图片上传依赖file-uploader,请先配置好file-uploader
|
||||
type: "editor-wang5", // 富文本图片上传依赖file-uploader,请先配置好file-uploader
|
||||
form: {
|
||||
helper:"示例已升级到wangEditor5版本,原来的editor-wang目前仍然可以使用,后续fs升级可能会将其删除,请尽快升级到editor-wang5版本",
|
||||
helper: "示例已升级到wangEditor5版本,原来的editor-wang目前仍然可以使用,后续fs升级可能会将其删除,请尽快升级到editor-wang5版本",
|
||||
col: { span: 24 },
|
||||
// 动态显隐字段
|
||||
// show: compute(({ form }) => {
|
||||
@@ -94,10 +93,10 @@ export default function ({ expose }) {
|
||||
config: {},
|
||||
uploader: {
|
||||
type: "form",
|
||||
buildUrl(res) {
|
||||
buildUrl(res: any) {
|
||||
return res.url;
|
||||
}
|
||||
}
|
||||
} as FsUploaderFormOptions
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -8,31 +8,19 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "ComponentEditor",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "ComponentEditor",
|
||||
idGenerator: 0
|
||||
};
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/ComponentIcon";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+7
-5
@@ -1,19 +1,21 @@
|
||||
import * as api from "./api";
|
||||
export default function ({ expose }) {
|
||||
const pageRequest = async (query) => {
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
@@ -4,31 +4,19 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted, ref } from "vue";
|
||||
import createCrudOptions from "./crud.js";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "ComponentIcon",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
const value = ref(null);
|
||||
|
||||
+4
-4
@@ -1,20 +1,20 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "ComponentIcon",
|
||||
idGenerator: 0
|
||||
};
|
||||
const list = [
|
||||
{
|
||||
icon: "ri:24-hours-fill",
|
||||
svg:"svg:icon-compass"
|
||||
svg: "svg:icon-compass"
|
||||
},
|
||||
{
|
||||
icon: "ion:add-circle-outline",
|
||||
svg:"svg:icon-left-circle"
|
||||
svg: "svg:icon-left-circle"
|
||||
},
|
||||
{
|
||||
icon: "ion:american-football-sharp",
|
||||
svg:"svg:icon-Dollar"
|
||||
svg: "svg:icon-Dollar"
|
||||
}
|
||||
];
|
||||
options.list = list;
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/ComponentJson";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+11
-9
@@ -1,19 +1,21 @@
|
||||
import * as api from "./api";
|
||||
export default function ({ expose }) {
|
||||
const pageRequest = async (query) => {
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, EditReq, UserPageQuery, UserPageRes, ValueBuilderContext, ValueResolveContext } from "@fast-crud/fast-crud";
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
@@ -38,13 +40,13 @@ export default function ({ expose }) {
|
||||
title: "json",
|
||||
type: "json",
|
||||
form: {
|
||||
valueBuilder({ form }) {
|
||||
valueBuilder({ form }: ValueBuilderContext) {
|
||||
if (form.json == null) {
|
||||
return;
|
||||
}
|
||||
form.json = JSON.parse(form.json);
|
||||
},
|
||||
valueResolve({ form }) {
|
||||
valueResolve({ form }: ValueResolveContext) {
|
||||
if (form.json == null) {
|
||||
return;
|
||||
}
|
||||
@@ -58,13 +60,13 @@ export default function ({ expose }) {
|
||||
form: {
|
||||
// 上面form.wrapper.onOpened里面配置了异步加载
|
||||
helper: "在onOpened里面配置异步加载json字符串",
|
||||
valueBuilder({ form }) {
|
||||
valueBuilder({ form }: ValueBuilderContext) {
|
||||
if (form.async == null) {
|
||||
return;
|
||||
}
|
||||
form.async = JSON.parse(form.async);
|
||||
},
|
||||
valueResolve({ form }) {
|
||||
valueResolve({ form }: ValueResolveContext) {
|
||||
if (form.async == null) {
|
||||
return;
|
||||
}
|
||||
@@ -4,31 +4,19 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud.js";
|
||||
|
||||
export default defineComponent({
|
||||
name: "ComponentJson",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+2
-2
@@ -1,9 +1,9 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "ComponentJson",
|
||||
idGenerator: 0
|
||||
};
|
||||
const list = [
|
||||
const list: any = [
|
||||
{
|
||||
json: '{"a":1,"b":2}',
|
||||
async: null
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/ComponentNumber";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj :any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+10
-9
@@ -1,21 +1,22 @@
|
||||
import * as api from "./api";
|
||||
import { requestForMock } from "/src/api/service";
|
||||
import { dict } from "@fast-crud/fast-crud";
|
||||
export default function ({ expose }) {
|
||||
const pageRequest = async (query) => {
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
@@ -55,8 +56,8 @@ export default function ({ expose }) {
|
||||
type: "number",
|
||||
form: {
|
||||
component: {
|
||||
formatter: (value) => `${value}%`,
|
||||
parser: (value) => value.replace("%", "")
|
||||
formatter: (value: any) => `${value}%`,
|
||||
parser: (value: any) => value.replace("%", "")
|
||||
}
|
||||
},
|
||||
column: {
|
||||
@@ -4,31 +4,19 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import createCrudOptions from "./crud.js";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "ComponentNumber",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+1
-1
@@ -1,5 +1,5 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "ComponentNumber",
|
||||
idGenerator: 0
|
||||
};
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/ComponentRadio";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+7
-6
@@ -1,20 +1,21 @@
|
||||
import * as api from "./api";
|
||||
import { dict } from "@fast-crud/fast-crud";
|
||||
export default function ({ expose }) {
|
||||
const pageRequest = async (query) => {
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
@@ -4,31 +4,19 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted, ref } from "vue";
|
||||
import createCrudOptions from "./crud.js";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "ComponentRadio",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
const value = ref(null);
|
||||
|
||||
+1
-1
@@ -1,5 +1,5 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "ComponentRadio",
|
||||
idGenerator: 0
|
||||
};
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/ComponentSelect";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+13
-14
@@ -1,6 +1,6 @@
|
||||
import * as api from "./api";
|
||||
import { requestForMock } from "/src/api/service";
|
||||
import { dict } from "@fast-crud/fast-crud";
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, dict, DictOnReadyContext, EditReq, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
import { ref } from "vue";
|
||||
import _ from "lodash-es";
|
||||
function useSearchRemote() {
|
||||
@@ -27,7 +27,7 @@ function useSearchRemote() {
|
||||
// for fetch callback order
|
||||
return;
|
||||
}
|
||||
const data = body.results.map((user) => ({
|
||||
const data = body.results.map((user: any) => ({
|
||||
text: `${user.name.first} ${user.name.last}`,
|
||||
value: user.login.username
|
||||
}));
|
||||
@@ -41,19 +41,19 @@ function useSearchRemote() {
|
||||
searchState: state
|
||||
};
|
||||
}
|
||||
export default function ({ expose }) {
|
||||
const pageRequest = async (query) => {
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
@@ -145,7 +145,7 @@ export default function ({ expose }) {
|
||||
showSearch: true,
|
||||
//默认的filterOption仅支持value的过滤,label并不会加入查询
|
||||
//所以需要自定义filterOption
|
||||
filterOption(inputValue, option) {
|
||||
filterOption(inputValue: any, option: any) {
|
||||
return option.label.indexOf(inputValue) >= 0 || option.value.indexOf(inputValue) >= 0;
|
||||
}
|
||||
}
|
||||
@@ -153,6 +153,7 @@ export default function ({ expose }) {
|
||||
},
|
||||
search: {
|
||||
title: "远程搜索",
|
||||
type: "text",
|
||||
search: { show: true, component: { style: { width: "240px" } } },
|
||||
form: {
|
||||
component: {
|
||||
@@ -165,7 +166,7 @@ export default function ({ expose }) {
|
||||
allowClear: true,
|
||||
placeholder: "输入远程搜索,数据仅供演示",
|
||||
options: searchState.data,
|
||||
onSearch(value) {
|
||||
onSearch(value: any) {
|
||||
fetchUser(value);
|
||||
},
|
||||
children: {
|
||||
@@ -206,10 +207,8 @@ export default function ({ expose }) {
|
||||
},
|
||||
disabledOptions: {
|
||||
title: "禁用某个选项",
|
||||
key: "disabledOptions",
|
||||
type: "dict-select",
|
||||
dict: dict({
|
||||
cloneable: true,
|
||||
url: "/mock/dicts/OpenStatusEnum?disabledOptions"
|
||||
}),
|
||||
form: {
|
||||
@@ -217,7 +216,7 @@ export default function ({ expose }) {
|
||||
dict: {
|
||||
// 此处dict配置会覆盖上面dict的属性
|
||||
prototype: true, // form表单的dict设置为原型复制,每次初始化时都会重新loadDict
|
||||
onReady({ dict }) {
|
||||
onReady({ dict }: DictOnReadyContext) {
|
||||
console.log("字典请求ready", dict);
|
||||
dict.data[0].disabled = true; // 禁用某个选项, 还可以自己修改选项
|
||||
}
|
||||
@@ -233,13 +232,12 @@ export default function ({ expose }) {
|
||||
title: "默认值",
|
||||
type: "dict-select",
|
||||
dict: dict({
|
||||
cloneable: true,
|
||||
url: "/mock/dicts/OpenStatusEnum?disabledOptions"
|
||||
}),
|
||||
form: {
|
||||
component: {
|
||||
//监听 dict-change事件
|
||||
onDictChange({ dict, form, key }) {
|
||||
onDictChange({ dict, form, key }: any) {
|
||||
console.log("dict data changed", dict, key);
|
||||
if (dict.data != null && form.firstDefault == null) {
|
||||
form.firstDefault = dict.data[0].value;
|
||||
@@ -311,6 +309,7 @@ export default function ({ expose }) {
|
||||
},
|
||||
statusSimple: {
|
||||
title: "普通选择",
|
||||
type: "text",
|
||||
form: {
|
||||
component: {
|
||||
name: "a-select",
|
||||
@@ -8,31 +8,19 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "ComponentSelect",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions, dynamicUpdateDictOptions } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose, dynamicUpdateDictOptions } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+1
-1
@@ -1,5 +1,5 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "ComponentSelect",
|
||||
idGenerator: 0
|
||||
};
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/ComponentSwitch";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+8
-7
@@ -1,20 +1,21 @@
|
||||
import * as api from "./api";
|
||||
import { dict, compute } from "@fast-crud/fast-crud";
|
||||
export default function ({ expose }) {
|
||||
const pageRequest = async (query) => {
|
||||
import { dict, compute, CreateCrudOptionsProps, CreateCrudOptionsRet, UserPageQuery, UserPageRes, EditReq, DelReq, AddReq } from "@fast-crud/fast-crud";
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
@@ -94,7 +95,7 @@ export default function ({ expose }) {
|
||||
component: {
|
||||
name: "fs-dict-switch",
|
||||
vModel: "checked",
|
||||
onChange: (value) => {
|
||||
onChange: (value: any) => {
|
||||
console.log("onChange", value);
|
||||
}
|
||||
// onChange: compute((context) => {
|
||||
@@ -4,31 +4,19 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "ComponentSwitch",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+1
-1
@@ -1,5 +1,5 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "ComponentSwitch",
|
||||
idGenerator: 0
|
||||
};
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/ComponentText";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
+13
-18
@@ -1,22 +1,23 @@
|
||||
import * as api from "./api";
|
||||
import { compute } from "@fast-crud/fast-crud";
|
||||
import { resolveDirective, withDirectives } from "vue";
|
||||
import { AddReq, CreateCrudOptionsProps, CreateCrudOptionsRet, DelReq, EditReq, ScopeContext, UserPageQuery, UserPageRes } from "@fast-crud/fast-crud";
|
||||
import { SearchOutlined } from "@ant-design/icons-vue";
|
||||
|
||||
export default function ({ expose }) {
|
||||
const pageRequest = async (query) => {
|
||||
export default function ({ crudExpose }: CreateCrudOptionsProps): CreateCrudOptionsRet {
|
||||
const pageRequest = async (query: UserPageQuery): Promise<UserPageRes> => {
|
||||
return await api.GetList(query);
|
||||
};
|
||||
const editRequest = async ({ form, row }) => {
|
||||
const editRequest = async ({ form, row }: EditReq) => {
|
||||
form.id = row.id;
|
||||
return await api.UpdateObj(form);
|
||||
};
|
||||
const delRequest = async ({ row }) => {
|
||||
const delRequest = async ({ row }: DelReq) => {
|
||||
return await api.DelObj(row.id);
|
||||
};
|
||||
|
||||
const addRequest = async ({ form }) => {
|
||||
const addRequest = async ({ form }: AddReq) => {
|
||||
return await api.AddObj(form);
|
||||
};
|
||||
|
||||
return {
|
||||
crudOptions: {
|
||||
request: {
|
||||
@@ -92,23 +93,16 @@ export default function ({ expose }) {
|
||||
},
|
||||
render: {
|
||||
title: "复杂输入(render)",
|
||||
type: "text",
|
||||
form: {
|
||||
title: "复杂输入",
|
||||
component: {
|
||||
render(context) {
|
||||
render(context: ScopeContext) {
|
||||
console.log("context scope", context);
|
||||
return (
|
||||
<a-input-group compact>
|
||||
<a-input
|
||||
placeholder={"render1 input"}
|
||||
style="width: 50%"
|
||||
v-model={[context.form.render, "value"]}
|
||||
/>
|
||||
<a-input
|
||||
placeholder={"render2 input"}
|
||||
style="width: 50%"
|
||||
v-model={[context.form.render2, "value"]}
|
||||
/>
|
||||
<a-input placeholder={"render1 input"} style="width: 50%" v-model={[context.form.render, "value"]} />
|
||||
<a-input placeholder={"render2 input"} style="width: 50%" v-model={[context.form.render2, "value"]} />
|
||||
</a-input-group>
|
||||
);
|
||||
}
|
||||
@@ -117,6 +111,7 @@ export default function ({ expose }) {
|
||||
},
|
||||
render2: {
|
||||
title: "我的值是由复杂输入列输入的",
|
||||
type: "text",
|
||||
column: {
|
||||
width: "300px"
|
||||
},
|
||||
@@ -4,31 +4,19 @@
|
||||
</fs-page>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { defineComponent, ref, onMounted } from "vue";
|
||||
import { useCrud } from "@fast-crud/fast-crud";
|
||||
<script lang="ts">
|
||||
import { defineComponent, onMounted } from "vue";
|
||||
import { useFs } from "@fast-crud/fast-crud";
|
||||
import createCrudOptions from "./crud";
|
||||
import { useExpose } from "@fast-crud/fast-crud";
|
||||
|
||||
export default defineComponent({
|
||||
name: "ComponentText",
|
||||
setup() {
|
||||
// crud组件的ref
|
||||
const crudRef = ref();
|
||||
// crud 配置的ref
|
||||
const crudBinding = ref();
|
||||
// 暴露的方法
|
||||
const { expose } = useExpose({ crudRef, crudBinding });
|
||||
// 你的crud配置
|
||||
const { crudOptions } = createCrudOptions({ expose });
|
||||
// 初始化crud配置
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars,no-unused-vars
|
||||
const { resetCrudOptions } = useCrud({ expose, crudOptions });
|
||||
// 你可以调用此方法,重新初始化crud配置
|
||||
// resetCrudOptions(options)
|
||||
const { crudBinding, crudRef, crudExpose } = useFs({ createCrudOptions });
|
||||
|
||||
// 页面打开后获取列表数据
|
||||
onMounted(() => {
|
||||
expose.doRefresh();
|
||||
crudExpose.doRefresh();
|
||||
});
|
||||
|
||||
return {
|
||||
|
||||
+1
-1
@@ -1,5 +1,5 @@
|
||||
import mockUtil from "/src/mock/base";
|
||||
const options = {
|
||||
const options: any = {
|
||||
name: "ComponentText",
|
||||
idGenerator: 0
|
||||
};
|
||||
+5
-5
@@ -1,7 +1,7 @@
|
||||
import { requestForMock } from "/src/api/service";
|
||||
const request = requestForMock;
|
||||
const apiPrefix = "/mock/ComponentTree";
|
||||
export function GetList(query) {
|
||||
export function GetList(query: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/page",
|
||||
method: "get",
|
||||
@@ -9,7 +9,7 @@ export function GetList(query) {
|
||||
});
|
||||
}
|
||||
|
||||
export function AddObj(obj) {
|
||||
export function AddObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/add",
|
||||
method: "post",
|
||||
@@ -17,7 +17,7 @@ export function AddObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function UpdateObj(obj) {
|
||||
export function UpdateObj(obj: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/update",
|
||||
method: "post",
|
||||
@@ -25,7 +25,7 @@ export function UpdateObj(obj) {
|
||||
});
|
||||
}
|
||||
|
||||
export function DelObj(id) {
|
||||
export function DelObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/delete",
|
||||
method: "post",
|
||||
@@ -33,7 +33,7 @@ export function DelObj(id) {
|
||||
});
|
||||
}
|
||||
|
||||
export function GetObj(id) {
|
||||
export function GetObj(id: any) {
|
||||
return request({
|
||||
url: apiPrefix + "/info",
|
||||
method: "get",
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user