mirrors2/naive-ui-admin
1
0
Fork 0
mirror of https://github.com/jekip/naive-ui-admin.git synced 2026-02-04 13:42:27 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix bug #22 表格列默认开启 ellipsis 属性

Browse Source
This commit is contained in:
啊俊
2021-08-08 15:17:02 +08:00
parent d973b2a543
commit 8f05b20ffa
14 changed files with 56 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@@ -38,7 +38,7 @@
"makeit-captcha": "^1.2.5",
"mitt": "^2.1.0",
"mockjs": "^1.1.0",
"naive-ui": "^2.16.0",
"naive-ui": "^2.16.1",
"pinia": "^2.0.0-beta.3",
"qs": "^6.10.1",
"vfonts": "^0.1.0",

4
src/components/Table/src/Table.vue
View File

@@ -233,9 +233,6 @@
getCacheColumns,
setCacheColumnsField,
emit,
getSize: () => {
return unref(getBindValues).size;
},
};
const getCanResize = computed(() => {
@@ -288,7 +285,6 @@
densitySelect,
updatePage,
updatePageSize,
updateCheckedRowKeys,
pagination,
tableAction,
};

2
src/components/Table/src/hooks/useColumns.ts
View File

@@ -52,6 +52,8 @@ export function useColumns(propsRef: ComputedRef<BasicTableProps>) {
return hasPermission(column.auth) && isIfShow(column);
})
.map((column) => {
//默认 ellipsis 为true
column.ellipsis = typeof column.ellipsis === 'undefined' ? { tooltip: true } : false;
const { edit } = column;
if (edit) {
column.render = renderEditCell(column);

6
src/layout/components/Menu/index.vue
View File

@@ -40,7 +40,8 @@
default: 'left',
},
},
setup(props) {
emits: ['update:collapsed'],
setup(props, { emit }) {
// 当前路由
const currentRoute = useRoute();
const router = useRouter();
@@ -72,6 +73,9 @@
() => settingStore.menuSetting.mixMenu,
() => {
updateMenu();
if (props.collapsed) {
emit('update:collapsed', !props.collapsed);
}
}
);

11
src/views/comp/table/CellColumns.ts
View File

@@ -5,10 +5,12 @@ export const columns = [
{
title: 'id',
key: 'id',
width: 100,
},
{
title: '编码',
key: 'no',
width: 100,
},
{
title: '名称',
@@ -22,6 +24,7 @@ export const columns = [
{
title: '头像',
key: 'avatar',
width: 100,
render(row) {
return h(NAvatar, {
size: 48,
@@ -47,29 +50,33 @@ export const columns = [
},
edit: true,
width: 200,
ellipsis: false,
},
{
title: '开始日期',
key: 'beginTime',
edit: true,
width: 250,
width: 160,
editComponent: 'NDatePicker',
editComponentProps: {
type: 'datetime',
format: 'yyyy-MM-dd HH:mm:ss',
},
ellipsis: false,
},
{
title: '结束日期',
key: 'endTime',
width: 200,
width: 160,
},
{
title: '创建时间',
key: 'date',
width: 160,
},
{
title: '停留时间',
key: 'time',
width: 160,
},
];

1
src/views/comp/table/basic.vue
View File

@@ -8,6 +8,7 @@
:row-key="(row) => row.id"
ref="actionRef"
:actionColumn="actionColumn"
:scroll-x="1360"
@update:checked-row-keys="onCheckedRow"
>
<template #toolbar>

14
src/views/comp/table/basicColumns.ts
View File

@@ -5,19 +5,22 @@ export const columns = [
{
title: 'id',
key: 'id',
width: 100,
},
{
title: '编码',
key: 'no',
width: 100,
},
{
title: '名称',
key: 'name',
width: 200,
width: 100,
},
{
title: '头像',
key: 'avatar',
width: 100,
render(row) {
return h(NAvatar, {
size: 48,
@@ -28,21 +31,22 @@ export const columns = [
{
title: '地址',
key: 'address',
width: 200,
width: 150,
},
{
title: '开始日期',
key: 'beginTime',
width: 200,
width: 160,
},
{
title: '结束日期',
key: 'endTime',
width: 200,
width: 160,
},
{
title: '状态',
key: 'status',
width: 100,
render(row) {
return h(
NTag,
@@ -58,9 +62,11 @@ export const columns = [
{
title: '创建时间',
key: 'date',
width: 160,
},
{
title: '停留时间',
key: 'time',
width: 160,
},
];

15
src/views/comp/table/editCell.vue
View File

@@ -7,10 +7,10 @@
:request="loadDataTable"
:row-key="(row) => row.id"
ref="actionRef"
:actionColumn="actionColumn"
@edit-end="editEnd"
@edit-change="onEditChange"
@update:checked-row-keys="onCheckedRow"
:scroll-x="1300"
>
<template #toolbar>
<n-button type="primary" @click="reloadTable">刷新数据</n-button>
@@ -35,19 +35,6 @@
pageSize: 5,
name: 'xiaoMa',
},
actionColumn: {
width: 150,
title: '操作',
key: 'action',
fixed: 'right',
align: 'center',
render(record) {
return h(TableAction, {
style: 'button',
actions: createActions(record),
});
},
},
});
function handleEdit(record) {

1
src/views/comp/table/editRow.vue
View File

@@ -11,6 +11,7 @@
@edit-end="editEnd"
@edit-change="onEditChange"
@update:checked-row-keys="onCheckedRow"
:scroll-x="1530"
>
<template #toolbar>
<n-button type="primary" @click="reloadTable">刷新数据</n-button>

11
src/views/comp/table/rowColumns.ts
View File

@@ -5,10 +5,12 @@ export const columns = [
{
title: 'id',
key: 'id',
width: 100,
},
{
title: '编码',
key: 'no',
width: 100,
},
{
title: '名称',
@@ -23,6 +25,7 @@ export const columns = [
{
title: '头像',
key: 'avatar',
width: 100,
render(row) {
return h(NAvatar, {
size: 48,
@@ -49,23 +52,25 @@ export const columns = [
},
edit: true,
width: 200,
ellipsis: false,
},
{
title: '开始日期',
key: 'beginTime',
editRow: true,
edit: true,
width: 250,
width: 160,
editComponent: 'NDatePicker',
editComponentProps: {
type: 'datetime',
format: 'yyyy-MM-dd HH:mm:ss',
},
ellipsis: false,
},
{
title: '结束日期',
key: 'endTime',
width: 200,
width: 160,
},
{
title: '状态',
@@ -81,9 +86,11 @@ export const columns = [
{
title: '创建时间',
key: 'date',
width: 160,
},
{
title: '停留时间',
key: 'time',
width: 160,
},
];

38
src/views/list/basicList/columns.ts
View File

@@ -5,14 +5,17 @@ export const columns = [
{
title: 'id',
key: 'id',
width: 100,
},
{
title: '名称',
key: 'name',
width: 100,
},
{
title: '头像',
key: 'avatar',
width: 100,
render(row) {
return h(NAvatar, {
size: 48,
@@ -27,48 +30,21 @@ export const columns = [
ifShow: (_column) => {
return true; // 根据业务控制是否显示
},
width: 150,
},
{
title: '开始日期',
key: 'beginTime',
width: 160,
},
{
title: '结束日期',
key: 'endTime',
width: 160,
},
{
title: '创建时间',
key: 'date',
width: 100,
},
// {
// title: '操作',
// key: 'actions',
// width: 150,
// //简单写一下例子，不建议这么写，过段时间，这里封二次封装
// render() {
// return [
// h(
// NButton,
// {
// size: 'small',
// type: 'error',
// style: 'margin-right:10px',
// onClick: () => {
// }
// },
// { default: () => '删除' }
// ),
// h(
// NButton,
// {
// size: 'small',
// onClick: () => {
//
// }
// },
// { default: () => '编辑' }
// )
// ]
// }
// }
];

3
src/views/list/basicList/index.vue
View File

@@ -13,6 +13,7 @@
ref="actionRef"
:actionColumn="actionColumn"
@update:checked-row-keys="onCheckedRow"
:scroll-x="1090"
>
<template #tableTitle>
<n-button type="primary" @click="addTable">
@@ -230,7 +231,7 @@
name: 'xiaoMa',
},
actionColumn: {
width: 250,
width: 220,
title: '操作',
key: 'action',
fixed: 'right',

22
tsconfig.json
View File

@@ -16,18 +16,9 @@
"noUnusedLocals": true,
"noUnusedParameters": true,
"experimentalDecorators": true,
"lib": [
"dom",
"esnext"
],
"types": [
"vite/client",
"jest"
],
"typeRoots": [
"./node_modules/@types/",
"./types"
],
"lib": ["dom", "esnext"],
"types": ["vite/client", "jest"],
"typeRoots": ["./node_modules/@types/", "./types"],
"noImplicitAny": false,
"skipLibCheck": true,
"paths": {
@@ -40,7 +31,6 @@
"src/**/*.d.ts",
"src/**/*.tsx",
"src/**/*.vue",
"types/*.ts",
"types/**/*.d.ts",
"types/**/*.ts",
"build/**/*.ts",
@@ -48,9 +38,5 @@
"mock/**/*.ts",
"vite.config.ts"
],
"exclude": [
"node_modules",
"dist",
"**/*.js"
]
"exclude": ["node_modules", "dist", "**/*.js"]
}

8
yarn.lock
View File

@@ -4999,10 +4999,10 @@ mute-stream@0.0.7:
resolved "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz#3075ce93bc21b8fab43e1bc4da7e8115ed1e7bab"
integrity sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s=
naive-ui@^2.16.0:
version "2.16.0"
resolved "https://registry.nlark.com/naive-ui/download/naive-ui-2.16.0.tgz#42d8b6120ab061e46a316ac074c5b788139cd744"
integrity sha1-Qti2EgqwYeRqMWrAdMW3iBOc10Q=
naive-ui@^2.16.1:
version "2.16.1"
resolved "https://registry.yarnpkg.com/naive-ui/-/naive-ui-2.16.1.tgz#0599e6748f498ad8f4f2f4c6c0637c1f1d860827"
integrity sha512-ku7ZxxBMp2fHD2eKV1gUDO6LmvMPUKYx0JzgtiCHRC8B88t4Ch5Momf+CfuYIM5NeVexzcmlahadslB74Bgbfw==
dependencies:
"@css-render/plugin-bem" "^0.15.4"
"@css-render/vue3-ssr" "^0.15.4"