mirror of
https://github.com/jekip/naive-ui-admin.git
synced 2026-02-11 16:52:28 +08:00
1.9.0
This commit is contained in:
@@ -46,7 +46,7 @@
|
||||
const source = ref(props.startVal);
|
||||
const disabled = ref(false);
|
||||
let outputValue = useTransition(source);
|
||||
|
||||
|
||||
const value = computed(() => formatNumber(unref(outputValue)));
|
||||
|
||||
watchEffect(() => {
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
{{ schema.label }}
|
||||
<n-tooltip trigger="hover" :style="schema.labelMessageStyle">
|
||||
<template #trigger>
|
||||
<n-icon size="18" class="cursor-pointer text-gray-400">
|
||||
<n-icon size="18" class="text-gray-400 cursor-pointer">
|
||||
<QuestionCircleOutlined />
|
||||
</n-icon>
|
||||
</template>
|
||||
|
||||
@@ -80,6 +80,15 @@ export function useForm(props?: Props): UseFormReturnType {
|
||||
const form = await getForm();
|
||||
return form.validate(nameList);
|
||||
},
|
||||
|
||||
setLoading: (value: boolean) => {
|
||||
loadedRef.value = value;
|
||||
},
|
||||
|
||||
setSchema: async (values) => {
|
||||
const form = await getForm();
|
||||
form.setSchema(values);
|
||||
},
|
||||
};
|
||||
|
||||
return [register, methods];
|
||||
|
||||
@@ -32,24 +32,28 @@ export function useFormEvents({
|
||||
}
|
||||
|
||||
// 提交
|
||||
async function handleSubmit(e?: Event): Promise<void> {
|
||||
async function handleSubmit(e?: Event): Promise<object | boolean> {
|
||||
e && e.preventDefault();
|
||||
loadingSub.value = true;
|
||||
const { submitFunc } = unref(getProps);
|
||||
if (submitFunc && isFunction(submitFunc)) {
|
||||
await submitFunc();
|
||||
return;
|
||||
loadingSub.value = false;
|
||||
return false;
|
||||
}
|
||||
const formEl = unref(formElRef);
|
||||
if (!formEl) return;
|
||||
if (!formEl) return false;
|
||||
try {
|
||||
await validate();
|
||||
const values = getFieldsValue();
|
||||
loadingSub.value = false;
|
||||
emit('submit', formModel);
|
||||
return;
|
||||
} catch (error) {
|
||||
emit('submit', values);
|
||||
return values;
|
||||
} catch (error: any) {
|
||||
emit('submit', false);
|
||||
loadingSub.value = false;
|
||||
return;
|
||||
console.error(error);
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -96,6 +100,10 @@ export function useFormEvents({
|
||||
});
|
||||
}
|
||||
|
||||
function setLoading(value: boolean): void {
|
||||
loadingSub.value = value;
|
||||
}
|
||||
|
||||
return {
|
||||
handleSubmit,
|
||||
validate,
|
||||
@@ -103,5 +111,6 @@ export function useFormEvents({
|
||||
getFieldsValue,
|
||||
clearValidate,
|
||||
setFieldsValue,
|
||||
setLoading,
|
||||
};
|
||||
}
|
||||
|
||||
@@ -47,11 +47,13 @@ export interface FormProps {
|
||||
export interface FormActionType {
|
||||
submit: () => Promise<any>;
|
||||
setProps: (formProps: Partial<FormProps>) => Promise<void>;
|
||||
setFieldsValue: (values: Recordable) => Promise<void>;
|
||||
setSchema: (schemaProps: Partial<FormSchema[]>) => Promise<void>;
|
||||
setFieldsValue: (values: Recordable) => void;
|
||||
clearValidate: (name?: string | string[]) => Promise<void>;
|
||||
getFieldsValue: () => Recordable;
|
||||
resetFields: () => Promise<void>;
|
||||
validate: (nameList?: any[]) => Promise<any>;
|
||||
setLoading: (status: boolean) => void;
|
||||
}
|
||||
|
||||
export type RegisterFn = (formInstance: FormActionType) => void;
|
||||
|
||||
@@ -21,16 +21,7 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {
|
||||
getCurrentInstance,
|
||||
ref,
|
||||
nextTick,
|
||||
unref,
|
||||
computed,
|
||||
useAttrs,
|
||||
defineEmits,
|
||||
defineProps,
|
||||
} from 'vue';
|
||||
import { getCurrentInstance, ref, nextTick, unref, computed, useAttrs } from 'vue';
|
||||
import { basicProps } from './props';
|
||||
import startDrag from '@/utils/Drag';
|
||||
import { deepMerge } from '@/utils';
|
||||
@@ -93,7 +84,6 @@
|
||||
|
||||
function handleSubmit() {
|
||||
subLoading.value = true;
|
||||
console.log(subLoading.value);
|
||||
emit('on-ok');
|
||||
}
|
||||
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<div class="tableAction">
|
||||
<div class="flex items-center justify-center">
|
||||
<template v-for="(action, index) in getActions" :key="`${index}-${action.label}`">
|
||||
<n-button v-bind="action" class="mx-2">
|
||||
<n-button v-bind="action" class="mx-1">
|
||||
{{ action.label }}
|
||||
<template #icon v-if="action.hasOwnProperty('icon')">
|
||||
<n-icon :component="action.icon" />
|
||||
@@ -16,7 +16,7 @@
|
||||
@select="select"
|
||||
>
|
||||
<slot name="more"></slot>
|
||||
<n-button v-bind="getMoreProps" class="mx-2" v-if="!$slots.more" icon-placement="right">
|
||||
<n-button v-bind="getMoreProps" class="mx-1" v-if="!$slots.more" icon-placement="right">
|
||||
<div class="flex items-center">
|
||||
<span>更多</span>
|
||||
<n-icon size="14" class="ml-1">
|
||||
|
||||
@@ -17,7 +17,7 @@
|
||||
:class="getWrapperClass"
|
||||
ref="elRef"
|
||||
@options-change="handleOptionsChange"
|
||||
@pressEnter="handleEnter"
|
||||
@press-enter="handleEnter"
|
||||
/>
|
||||
</div>
|
||||
<div class="editable-cell-action" v-if="!getRowEditable">
|
||||
|
||||
@@ -31,8 +31,8 @@ export function useDataSource(
|
||||
return rowKey
|
||||
? rowKey
|
||||
: () => {
|
||||
return 'key';
|
||||
};
|
||||
return 'key';
|
||||
};
|
||||
});
|
||||
|
||||
const getDataSourceRef = computed(() => {
|
||||
@@ -53,7 +53,7 @@ export function useDataSource(
|
||||
const sizeField = APISETTING.sizeField;
|
||||
const totalField = APISETTING.totalField;
|
||||
const listField = APISETTING.listField;
|
||||
|
||||
const itemCount = APISETTING.countField;
|
||||
let pageParams = {};
|
||||
const { page = 1, pageSize = 10 } = unref(getPaginationInfo) as PaginationProps;
|
||||
|
||||
@@ -66,23 +66,27 @@ export function useDataSource(
|
||||
|
||||
let params = {
|
||||
...pageParams,
|
||||
...opt,
|
||||
};
|
||||
if (beforeRequest && isFunction(beforeRequest)) {
|
||||
// The params parameter can be modified by outsiders
|
||||
params = (await beforeRequest(params)) || params;
|
||||
}
|
||||
const res = await request(params);
|
||||
|
||||
const resultTotal = res[totalField] || 0;
|
||||
const resultTotal = res[totalField];
|
||||
const currentPage = res[pageField];
|
||||
const total = res[itemCount];
|
||||
const results = res[listField] ? res[listField] : [];
|
||||
|
||||
// 如果数据异常,需获取正确的页码再次执行
|
||||
if (resultTotal) {
|
||||
if (page > resultTotal) {
|
||||
const currentTotalPage = Math.ceil(total / pageSize);
|
||||
if (page > currentTotalPage) {
|
||||
setPagination({
|
||||
[pageField]: resultTotal,
|
||||
page: currentTotalPage,
|
||||
itemCount: total,
|
||||
});
|
||||
fetch(opt);
|
||||
return await fetch(opt);
|
||||
}
|
||||
}
|
||||
let resultInfo = res[listField] ? res[listField] : [];
|
||||
@@ -92,12 +96,13 @@ export function useDataSource(
|
||||
}
|
||||
dataSourceRef.value = resultInfo;
|
||||
setPagination({
|
||||
[pageField]: currentPage,
|
||||
[totalField]: resultTotal,
|
||||
page: currentPage,
|
||||
pageCount: resultTotal,
|
||||
itemCount: total,
|
||||
});
|
||||
if (opt && opt[pageField]) {
|
||||
setPagination({
|
||||
[pageField]: opt[pageField] || 1,
|
||||
page: opt[pageField] || 1,
|
||||
});
|
||||
}
|
||||
emit('fetch-success', {
|
||||
@@ -108,9 +113,9 @@ export function useDataSource(
|
||||
console.error(error);
|
||||
emit('fetch-error', error);
|
||||
dataSourceRef.value = [];
|
||||
// setPagination({
|
||||
// pageCount: 0,
|
||||
// });
|
||||
setPagination({
|
||||
pageCount: 0,
|
||||
});
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
|
||||
@@ -1,28 +1,40 @@
|
||||
import type { PaginationProps } from '../types/pagination';
|
||||
import type { BasicTableProps } from '../types/table';
|
||||
import { computed, unref, ref, ComputedRef } from 'vue';
|
||||
import { computed, unref, ref, ComputedRef, watch } from 'vue';
|
||||
|
||||
import { isBoolean } from '@/utils/is';
|
||||
import { APISETTING, DEFAULTPAGESIZE, PAGESIZES } from '../const';
|
||||
import { DEFAULTPAGESIZE, PAGESIZES } from '../const';
|
||||
|
||||
export function usePagination(refProps: ComputedRef<BasicTableProps>) {
|
||||
const configRef = ref<PaginationProps>({});
|
||||
const show = ref(true);
|
||||
|
||||
watch(
|
||||
() => unref(refProps).pagination,
|
||||
(pagination) => {
|
||||
if (!isBoolean(pagination) && pagination) {
|
||||
configRef.value = {
|
||||
...unref(configRef),
|
||||
...(pagination ?? {}),
|
||||
};
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
const getPaginationInfo = computed((): PaginationProps | boolean => {
|
||||
const { pagination } = unref(refProps);
|
||||
if (!unref(show) || (isBoolean(pagination) && !pagination)) {
|
||||
return false;
|
||||
}
|
||||
const { totalField } = APISETTING;
|
||||
return {
|
||||
pageSize: DEFAULTPAGESIZE,
|
||||
pageSizes: PAGESIZES,
|
||||
page: 1, //当前页
|
||||
pageSize: DEFAULTPAGESIZE, //分页大小
|
||||
pageSizes: PAGESIZES, // 每页条数
|
||||
showSizePicker: true,
|
||||
showQuickJumper: true,
|
||||
prefix: (pagingInfo) => `共 ${pagingInfo.itemCount} 条`, // 不需要可以通过 pagination 重置或者删除
|
||||
...(isBoolean(pagination) ? {} : pagination),
|
||||
...unref(configRef),
|
||||
pageCount: unref(configRef)[totalField],
|
||||
};
|
||||
});
|
||||
|
||||
|
||||
@@ -5,4 +5,5 @@ export type ComponentType =
|
||||
| 'NCheckbox'
|
||||
| 'NSwitch'
|
||||
| 'NDatePicker'
|
||||
| 'NTimePicker';
|
||||
| 'NTimePicker'
|
||||
| 'NCascader';
|
||||
|
||||
@@ -1,8 +1,10 @@
|
||||
export interface PaginationProps {
|
||||
page?: number;
|
||||
pageCount?: number;
|
||||
pageSize?: number;
|
||||
pageSizes?: number[];
|
||||
showSizePicker?: boolean;
|
||||
showQuickJumper?: boolean;
|
||||
page?: number; //受控模式下的当前页
|
||||
itemCount?: number; //总条数
|
||||
pageCount?: number; //总页数
|
||||
pageSize?: number; //受控模式下的分页大小
|
||||
pageSizes?: number[]; //每页条数, 可自定义
|
||||
showSizePicker?: boolean; //是否显示每页条数的选择器
|
||||
showQuickJumper?: boolean; //是否显示快速跳转
|
||||
prefix?: any; //分页前缀
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { ref, onMounted, onUnmounted } from 'vue';
|
||||
import { debounce } from 'lodash';
|
||||
import { debounce } from 'lodash-es';
|
||||
|
||||
/**
|
||||
* description: 获取页面宽度
|
||||
|
||||
@@ -259,8 +259,7 @@
|
||||
title: props.title,
|
||||
isDrawer: false,
|
||||
placement: 'right',
|
||||
alertText:
|
||||
'该功能主要实时预览各种布局效果,更多完整配置在 projectSetting.ts 中设置,建议在生产环境关闭该布局预览功能。',
|
||||
alertText: '该功能主要实时预览各种布局效果,更多完整配置在 projectSetting.ts 中设置',
|
||||
appThemeList: designStore.appThemeList,
|
||||
});
|
||||
|
||||
|
||||
@@ -35,7 +35,7 @@
|
||||
<div
|
||||
:id="`tag${element.fullPath.split('/').join('\/')}`"
|
||||
class="tabs-card-scroll-item"
|
||||
:class="{ 'active-item': activeKey === element.path }"
|
||||
:class="{ 'active-item': activeKey === element.fullPath }"
|
||||
@click.stop="goPage(element)"
|
||||
@contextmenu="handleContextMenu($event, element)"
|
||||
>
|
||||
|
||||
@@ -26,8 +26,17 @@
|
||||
:placement="'left'"
|
||||
class="layout-side-drawer"
|
||||
>
|
||||
<Logo :collapsed="collapsed" />
|
||||
<AsideMenu @clickMenuItem="collapsed = false" />
|
||||
<n-layout-sider
|
||||
:position="fixedMenu"
|
||||
:collapsed="false"
|
||||
:width="menuWidth"
|
||||
:native-scrollbar="false"
|
||||
:inverted="inverted"
|
||||
class="layout-sider"
|
||||
>
|
||||
<Logo :collapsed="collapsed" />
|
||||
<AsideMenu v-model:location="getMenuLocation" />
|
||||
</n-layout-sider>
|
||||
</n-drawer>
|
||||
|
||||
<n-layout :inverted="inverted">
|
||||
|
||||
@@ -66,6 +66,7 @@ import {
|
||||
NTimePicker,
|
||||
NBackTop,
|
||||
NSkeleton,
|
||||
NCascader,
|
||||
} from 'naive-ui';
|
||||
|
||||
// https://www.naiveui.com/en-US/os-theme/docs/import-on-demand
|
||||
@@ -136,6 +137,7 @@ const naive = create({
|
||||
NTimePicker,
|
||||
NBackTop,
|
||||
NSkeleton,
|
||||
NCascader,
|
||||
],
|
||||
});
|
||||
|
||||
|
||||
@@ -9,6 +9,8 @@ export default {
|
||||
listField: 'list',
|
||||
// 接口返回总页数字段名
|
||||
totalField: 'pageCount',
|
||||
//总数字段名
|
||||
countField: 'itemCount',
|
||||
},
|
||||
//默认分页数量
|
||||
defaultPageSize: 10,
|
||||
|
||||
@@ -23,7 +23,7 @@ import {
|
||||
VisualMapComponent,
|
||||
TimelineComponent,
|
||||
CalendarComponent,
|
||||
GraphicComponent
|
||||
GraphicComponent,
|
||||
} from 'echarts/components';
|
||||
|
||||
import { SVGRenderer } from 'echarts/renderers';
|
||||
@@ -49,7 +49,7 @@ echarts.use([
|
||||
VisualMapComponent,
|
||||
TimelineComponent,
|
||||
CalendarComponent,
|
||||
GraphicComponent
|
||||
GraphicComponent,
|
||||
]);
|
||||
|
||||
export default echarts;
|
||||
|
||||
@@ -153,6 +153,9 @@
|
||||
const message = useMessage();
|
||||
|
||||
function handleSubmit(values: Recordable) {
|
||||
if (!values) {
|
||||
return message.error('请填写完整信息');
|
||||
}
|
||||
console.log(values);
|
||||
message.success(JSON.stringify(values));
|
||||
}
|
||||
|
||||
@@ -176,6 +176,9 @@
|
||||
});
|
||||
|
||||
function handleSubmit(values: Recordable) {
|
||||
if (!values) {
|
||||
return message.error('请填写完整信息');
|
||||
}
|
||||
console.log(values);
|
||||
message.success(JSON.stringify(values));
|
||||
}
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
方式,ref方式,也支持,使用方式和其他组件一致,如:modalRef.value.closeModal()
|
||||
</n-card>
|
||||
</div>
|
||||
<n-card :bordered="false" class="proCard mt-4">
|
||||
<n-card :bordered="false" class="mt-4 proCard">
|
||||
<n-alert title="Modal嵌套Form" type="info">
|
||||
使用 useModal 进行弹窗展示和操作,并演示了在Modal内和Form组件,组合使用方法
|
||||
</n-alert>
|
||||
@@ -250,6 +250,7 @@
|
||||
const formRes = await submit();
|
||||
if (formRes) {
|
||||
closeModal();
|
||||
console.log('formRes', formRes);
|
||||
message.success('提交成功');
|
||||
} else {
|
||||
message.error('验证失败,请填写完整信息');
|
||||
|
||||
@@ -29,7 +29,7 @@
|
||||
name="files"
|
||||
:width="100"
|
||||
:height="100"
|
||||
@uploadChange="uploadChange"
|
||||
@upload-change="uploadChange"
|
||||
v-model:value="formValue.images"
|
||||
helpText="单个文件不超过2MB,最多只能上传10个文件"
|
||||
/>
|
||||
|
||||
@@ -12,11 +12,11 @@
|
||||
<template #header-extra>
|
||||
<n-tag type="success">日</n-tag>
|
||||
</template>
|
||||
<div class="py-1 px-1 flex justify-between">
|
||||
<div class="flex justify-between px-1 py-1">
|
||||
<n-skeleton v-if="loading" :width="100" size="medium" />
|
||||
<CountTo v-else :startVal="1" :endVal="visits.dayVisits" class="text-3xl" />
|
||||
</div>
|
||||
<div class="py-1 px-1 flex justify-between">
|
||||
<div class="flex justify-between px-1 py-1">
|
||||
<div class="text-sn">
|
||||
<n-skeleton v-if="loading" :width="100" size="medium" />
|
||||
<template v-else>
|
||||
@@ -61,7 +61,7 @@
|
||||
<template #header-extra>
|
||||
<n-tag type="info">周</n-tag>
|
||||
</template>
|
||||
<div class="py-1 px-1 flex justify-between">
|
||||
<div class="flex justify-between px-1 py-1">
|
||||
<n-skeleton v-if="loading" :width="100" size="medium" />
|
||||
<CountTo
|
||||
v-else
|
||||
@@ -71,8 +71,8 @@
|
||||
class="text-3xl"
|
||||
/>
|
||||
</div>
|
||||
<div class="py-2 px-2 flex justify-between">
|
||||
<div class="text-sn flex-1">
|
||||
<div class="flex justify-between px-2 py-2">
|
||||
<div class="flex-1 text-sn">
|
||||
<n-progress
|
||||
type="line"
|
||||
:percentage="saleroom.degree"
|
||||
@@ -104,11 +104,11 @@
|
||||
<template #header-extra>
|
||||
<n-tag type="warning">周</n-tag>
|
||||
</template>
|
||||
<div class="py-1 px-1 flex justify-between">
|
||||
<div class="flex justify-between px-1 py-1">
|
||||
<n-skeleton v-if="loading" :width="100" size="medium" />
|
||||
<CountTo v-else :startVal="1" :endVal="orderLarge.weekLarge" class="text-3xl" />
|
||||
</div>
|
||||
<div class="py-1 px-1 flex justify-between">
|
||||
<div class="flex justify-between px-1 py-1">
|
||||
<div class="text-sn">
|
||||
<n-skeleton v-if="loading" :width="100" size="medium" />
|
||||
<template v-else>
|
||||
@@ -153,11 +153,11 @@
|
||||
<template #header-extra>
|
||||
<n-tag type="error">月</n-tag>
|
||||
</template>
|
||||
<div class="py-1 px-1 flex justify-between">
|
||||
<div class="flex justify-between px-1 py-1">
|
||||
<n-skeleton v-if="loading" :width="100" size="medium" />
|
||||
<CountTo v-else prefix="¥" :startVal="1" :endVal="volume.weekLarge" class="text-3xl" />
|
||||
</div>
|
||||
<div class="py-1 px-1 flex justify-between">
|
||||
<div class="flex justify-between px-1 py-1">
|
||||
<div class="text-sn">
|
||||
<n-skeleton v-if="loading" :width="100" size="medium" />
|
||||
<template v-else>
|
||||
@@ -245,7 +245,7 @@
|
||||
const visits = ref<any>({});
|
||||
const saleroom = ref<any>({});
|
||||
const orderLarge = ref<any>({});
|
||||
const volume = ref({});
|
||||
const volume = ref(<any>{});
|
||||
|
||||
// 图标列表
|
||||
const iconList = [
|
||||
|
||||
@@ -16,15 +16,15 @@
|
||||
</n-gi>
|
||||
<n-gi>
|
||||
<div class="flex justify-end w-full">
|
||||
<div class="flex flex-1 flex-col justify-center text-right">
|
||||
<div class="flex flex-col justify-center flex-1 text-right">
|
||||
<span class="text-secondary">项目数</span>
|
||||
<span class="text-2xl">16</span>
|
||||
</div>
|
||||
<div class="flex flex-1 flex-col justify-center text-right">
|
||||
<div class="flex flex-col justify-center flex-1 text-right">
|
||||
<span class="text-secondary">待办</span>
|
||||
<span class="text-2xl">3/15</span>
|
||||
</div>
|
||||
<div class="flex flex-1 flex-col justify-center text-right">
|
||||
<div class="flex flex-col justify-center flex-1 text-right">
|
||||
<span class="text-secondary">消息</span>
|
||||
<span class="text-2xl">35</span>
|
||||
</div>
|
||||
@@ -54,12 +54,12 @@
|
||||
<GithubOutlined />
|
||||
</n-icon>
|
||||
</span>
|
||||
<span class="text-lg ml-4">Github</span>
|
||||
<span class="ml-4 text-lg">Github</span>
|
||||
</div>
|
||||
<div class="flex mt-2 h-10 text-gray-400">
|
||||
<div class="flex h-10 mt-2 text-gray-400">
|
||||
是一个面向开源及私有软件项目的托管平台。
|
||||
</div>
|
||||
<div class="flex mt-2 h-10 text-gray-400"> 开源君,2021-07-04 </div>
|
||||
<div class="flex h-10 mt-2 text-gray-400"> 开源君,2021-07-04 </div>
|
||||
</n-card>
|
||||
<n-card
|
||||
size="small"
|
||||
@@ -72,10 +72,10 @@
|
||||
<LogoVue />
|
||||
</n-icon>
|
||||
</span>
|
||||
<span class="text-lg ml-4">Vue</span>
|
||||
<span class="ml-4 text-lg">Vue</span>
|
||||
</div>
|
||||
<div class="flex mt-2 h-10 text-gray-400"> 渐进式 JavaScript 框架 </div>
|
||||
<div class="flex mt-2 h-10 text-gray-400"> 学不动也要学,2021-07-04 </div>
|
||||
<div class="flex h-10 mt-2 text-gray-400"> 渐进式 JavaScript 框架 </div>
|
||||
<div class="flex h-10 mt-2 text-gray-400"> 学不动也要学,2021-07-04 </div>
|
||||
</n-card>
|
||||
<n-card
|
||||
size="small"
|
||||
@@ -88,10 +88,10 @@
|
||||
<Html5Outlined />
|
||||
</n-icon>
|
||||
</span>
|
||||
<span class="text-lg ml-4">Html5</span>
|
||||
<span class="ml-4 text-lg">Html5</span>
|
||||
</div>
|
||||
<div class="flex mt-2 h-10 text-gray-400"> HTML5是互联网的下一代标准。 </div>
|
||||
<div class="flex mt-2 h-10 text-gray-400"> 撸码也是一种艺术 2021-04-01 </div>
|
||||
<div class="flex h-10 mt-2 text-gray-400"> HTML5是互联网的下一代标准。 </div>
|
||||
<div class="flex h-10 mt-2 text-gray-400"> 撸码也是一种艺术 2021-04-01 </div>
|
||||
</n-card>
|
||||
<n-card
|
||||
size="small"
|
||||
@@ -104,10 +104,10 @@
|
||||
<LogoAngular />
|
||||
</n-icon>
|
||||
</span>
|
||||
<span class="text-lg ml-4">Angular</span>
|
||||
<span class="ml-4 text-lg">Angular</span>
|
||||
</div>
|
||||
<div class="flex mt-2 h-10 text-gray-400"> 现代 Web 开发平台,百万粉丝热捧。 </div>
|
||||
<div class="flex mt-2 h-10 text-gray-400"> 铁粉君 2021-07-04。 </div>
|
||||
<div class="flex h-10 mt-2 text-gray-400"> 现代 Web 开发平台,百万粉丝热捧。 </div>
|
||||
<div class="flex h-10 mt-2 text-gray-400"> 铁粉君 2021-07-04。 </div>
|
||||
</n-card>
|
||||
<n-card
|
||||
size="small"
|
||||
@@ -120,10 +120,10 @@
|
||||
<LogoReact />
|
||||
</n-icon>
|
||||
</span>
|
||||
<span class="text-lg ml-4">React</span>
|
||||
<span class="ml-4 text-lg">React</span>
|
||||
</div>
|
||||
<div class="flex mt-2 h-10 text-gray-400"> 用于构建用户界面的 JavaScript 库。 </div>
|
||||
<div class="flex mt-2 h-10 text-gray-400"> 技术牛 2021-07-04。 </div>
|
||||
<div class="flex h-10 mt-2 text-gray-400"> 用于构建用户界面的 JavaScript 库。 </div>
|
||||
<div class="flex h-10 mt-2 text-gray-400"> 技术牛 2021-07-04。 </div>
|
||||
</n-card>
|
||||
<n-card
|
||||
size="small"
|
||||
@@ -136,10 +136,10 @@
|
||||
<LogoJavascript />
|
||||
</n-icon>
|
||||
</span>
|
||||
<span class="text-lg ml-4">Js</span>
|
||||
<span class="ml-4 text-lg">Js</span>
|
||||
</div>
|
||||
<div class="flex mt-2 h-10 text-gray-400"> 路是走出来的,而不是空想出来的。 </div>
|
||||
<div class="flex mt-2 h-10 text-gray-400"> 架构组 2021-07-04 </div>
|
||||
<div class="flex h-10 mt-2 text-gray-400"> 路是走出来的,而不是空想出来的。 </div>
|
||||
<div class="flex h-10 mt-2 text-gray-400"> 架构组 2021-07-04 </div>
|
||||
</n-card>
|
||||
</div>
|
||||
</n-card>
|
||||
@@ -235,7 +235,7 @@
|
||||
<DashboardOutlined />
|
||||
</n-icon>
|
||||
</span>
|
||||
<span class="text-lx text-center">主控台</span>
|
||||
<span class="text-center text-lx">主控台</span>
|
||||
</div>
|
||||
</n-card>
|
||||
<n-card size="small" class="cursor-pointer project-card-item" hoverable>
|
||||
@@ -245,7 +245,7 @@
|
||||
<ProfileOutlined />
|
||||
</n-icon>
|
||||
</span>
|
||||
<span class="text-lx text-center">列表</span>
|
||||
<span class="text-center text-lx">列表</span>
|
||||
</div>
|
||||
</n-card>
|
||||
<n-card size="small" class="cursor-pointer project-card-item" hoverable>
|
||||
@@ -255,7 +255,7 @@
|
||||
<FileProtectOutlined />
|
||||
</n-icon>
|
||||
</span>
|
||||
<span class="text-lx text-center">表单</span>
|
||||
<span class="text-center text-lx">表单</span>
|
||||
</div>
|
||||
</n-card>
|
||||
<n-card size="small" class="cursor-pointer project-card-item" hoverable>
|
||||
@@ -265,7 +265,7 @@
|
||||
<ApartmentOutlined />
|
||||
</n-icon>
|
||||
</span>
|
||||
<span class="text-lx text-center">权限管理</span>
|
||||
<span class="text-center text-lx">权限管理</span>
|
||||
</div>
|
||||
</n-card>
|
||||
<n-card size="small" class="cursor-pointer project-card-item" hoverable>
|
||||
@@ -275,7 +275,7 @@
|
||||
<SettingOutlined />
|
||||
</n-icon>
|
||||
</span>
|
||||
<span class="text-lx text-center">系统管理</span>
|
||||
<span class="text-center text-lx">系统管理</span>
|
||||
</div>
|
||||
</n-card>
|
||||
<n-card size="small" class="cursor-pointer project-card-item" hoverable>
|
||||
@@ -285,7 +285,7 @@
|
||||
<DashboardOutlined />
|
||||
</n-icon>
|
||||
</span>
|
||||
<span class="text-lx text-center">主控台</span>
|
||||
<span class="text-center text-lx">主控台</span>
|
||||
</div>
|
||||
</n-card>
|
||||
</div>
|
||||
@@ -298,6 +298,10 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
export default { name: 'DashboardWorkplace' };
|
||||
</script>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import schoolboy from '@/assets/images/schoolboy.png';
|
||||
import {
|
||||
|
||||
@@ -63,7 +63,7 @@
|
||||
name="files"
|
||||
:width="100"
|
||||
:height="100"
|
||||
@uploadChange="uploadChange"
|
||||
@upload-change="uploadChange"
|
||||
v-model:value="uploadList"
|
||||
helpText="单个文件不超过20MB,最多只能上传10个文件"
|
||||
/>
|
||||
|
||||
@@ -12,9 +12,9 @@
|
||||
<n-step title="确认转账信息" description="确认转账信息" />
|
||||
<n-step title="完成转账" description="恭喜您,转账成功" />
|
||||
</n-steps>
|
||||
<step1 v-if="currentTab === 1" @nextStep="nextStep" />
|
||||
<step2 v-if="currentTab === 2" @nextStep="nextStep" @prevStep="prevStep" />
|
||||
<step3 v-if="currentTab === 3" @prevStep="prevStep" @finish="finish" />
|
||||
<step1 v-if="currentTab === 1" @next-step="nextStep" />
|
||||
<step2 v-if="currentTab === 2" @next-step="nextStep" @prevStep="prevStep" />
|
||||
<step3 v-if="currentTab === 3" @prev-step="prevStep" @finish="finish" />
|
||||
</n-space>
|
||||
</n-card>
|
||||
</div>
|
||||
|
||||
@@ -63,7 +63,6 @@
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { h, reactive, ref } from 'vue';
|
||||
// import { useMessage } from 'naive-ui';
|
||||
import { BasicTable, TableAction } from '@/components/Table';
|
||||
import { BasicForm, FormSchema, useForm } from '@/components/Form/index';
|
||||
import { getTableList } from '@/api/table/list';
|
||||
@@ -217,7 +216,6 @@
|
||||
|
||||
const router = useRouter();
|
||||
const formRef: any = ref(null);
|
||||
// const message = useMessage();
|
||||
const actionRef = ref();
|
||||
|
||||
const showModal = ref(false);
|
||||
@@ -228,11 +226,6 @@
|
||||
date: null,
|
||||
});
|
||||
|
||||
const params = ref({
|
||||
pageSize: 5,
|
||||
name: 'xiaoMa',
|
||||
});
|
||||
|
||||
const actionColumn = reactive({
|
||||
width: 220,
|
||||
title: '操作',
|
||||
@@ -285,7 +278,7 @@
|
||||
},
|
||||
});
|
||||
|
||||
const [register, {}] = useForm({
|
||||
const [register, { getFieldsValue }] = useForm({
|
||||
gridProps: { cols: '1 s:1 m:2 l:3 xl:4 2xl:4' },
|
||||
labelWidth: 80,
|
||||
schemas,
|
||||
@@ -296,7 +289,7 @@
|
||||
}
|
||||
|
||||
const loadDataTable = async (res) => {
|
||||
return await getTableList({ ...formParams, ...params.value, ...res });
|
||||
return await getTableList({ ...getFieldsValue(), ...res });
|
||||
};
|
||||
|
||||
function onCheckedRow(rowKeys) {
|
||||
|
||||
Reference in New Issue
Block a user