pnpm run lint:fix

README.md

@@ -16,7 +16,6 @@ TODO
 
 TODO
 
-
 ## Documentation and examples
 
 [https://ideal-world.github.io/task-table/](https://ideal-world.github.io/task-table/)

docs/TableDemo.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import type { Ref } from 'vue';
-import { onMounted, ref, toRaw } from 'vue';
-import { IwEvents, IwProps, IwUtils } from '../src';
+import type { Ref } from 'vue'
+import { onMounted, ref, toRaw } from 'vue'
+import { IwEvents, IwProps, IwUtils } from '../src'
 
 const selectedRecordPks: Ref<any[]> = ref([])
 
@@ -58,7 +58,9 @@ function attachDict(data: { [columnName: string]: any }[]) {
       d[`creator${IwProps.DATA_DICT_POSTFIX}`] = [NAME_DICT.find(dict => dict.value === d.creator)!]
     }
     if (d.stats) {
-      d[`stats${IwProps.DATA_DICT_POSTFIX}`] = d.stats.map((s) => { return STATS_DICT.find(dict => dict.value === s)! })
+      d[`stats${IwProps.DATA_DICT_POSTFIX}`] = d.stats.map((s) => {
+        return STATS_DICT.find(dict => dict.value === s)!
+      })
     }
     return d
   })
@@ -164,7 +166,9 @@ const events: IwProps.TableEventProps = {
       })
     }
     if (group && group.item && !byGroupValue) {
-      let dataGroup: { [key: string]: any[] } = IwUtils.basic.groupBy(data, (d) => { return d[group.item!.columnName] })
+      let dataGroup: { [key: string]: any[] } = IwUtils.basic.groupBy(data, (d) => {
+        return d[group.item!.columnName]
+      })
       if (group.item.hideEmptyRecord) {
         dataGroup = Object.fromEntries(Object.entries(dataGroup).filter(([_, value]) => value.length > 0))
       }
@@ -366,7 +370,9 @@ const events: IwProps.TableEventProps = {
 
   modifyLayout: async (changedLayoutId: string, changedLayoutProps: IwProps.LayoutModifyProps): Promise<void> => {
     // eslint-disable-next-line ts/no-use-before-define
-    const currLayout = tableProps.value.layouts.find((layout) => { return layout.id === changedLayoutId })!
+    const currLayout = tableProps.value.layouts.find((layout) => {
+      return layout.id === changedLayoutId
+    })!
     if (changedLayoutProps.title) {
       currLayout.title = changedLayoutProps.title
     }
@@ -399,14 +405,18 @@ const events: IwProps.TableEventProps = {
       currLayout.agg = changedLayoutProps.agg
     }
     if (changedLayoutProps.changedColumn) {
-      const col = currLayout.columns!.find((col) => { return col.name === changedLayoutProps.changedColumn!.name })!
+      const col = currLayout.columns!.find((col) => {
+        return col.name === changedLayoutProps.changedColumn!.name
+      })!
       Object.assign(col, changedLayoutProps.changedColumn)
     }
   },
 
   deleteLayout: async (deletedLayoutId: string): Promise<void> => {
     // eslint-disable-next-line ts/no-use-before-define
-    tableProps.value.layouts.splice(tableProps.value.layouts.findIndex((layout) => { return layout.id === deletedLayoutId }), 1)
+    tableProps.value.layouts.splice(tableProps.value.layouts.findIndex((layout) => {
+      return layout.id === deletedLayoutId
+    }), 1)
   },
 
   loadHolidays: async (_startTime: Date, _endTime: Date): Promise<Date[]> => {
@@ -449,7 +459,9 @@ const events: IwProps.TableEventProps = {
     if (dictName === 'creator') {
       let nameDict: IwProps.DictItemProps[] = JSON.parse(JSON.stringify(NAME_DICT))
       if (filterValue) {
-        nameDict = nameDict.filter((dict) => { return dict.title.includes(filterValue) || dict.value.includes(filterValue) })
+        nameDict = nameDict.filter((dict) => {
+          return dict.title.includes(filterValue) || dict.value.includes(filterValue)
+        })
       }
       const totalNumber = nameDict.length
       if (slice) {
@@ -463,7 +475,9 @@ const events: IwProps.TableEventProps = {
     else {
       let statsDict: IwProps.DictItemProps[] = JSON.parse(JSON.stringify(STATS_DICT))
       if (filterValue) {
-        statsDict = statsDict.filter((dict) => { return dict.title.includes(filterValue) || dict.value.includes(filterValue) })
+        statsDict = statsDict.filter((dict) => {
+          return dict.title.includes(filterValue) || dict.value.includes(filterValue)
+        })
       }
       const totalNumber = statsDict.length
       if (slice) {
@@ -481,7 +495,9 @@ const events: IwProps.TableEventProps = {
     Object.entries(conds).forEach(([columnName, values]) => {
       if (columnName === 'creator') {
         let nameDict: IwProps.DictItemProps[] = JSON.parse(JSON.stringify(NAME_DICT))
-        nameDict = nameDict.filter((dict) => { return values.find(val => dict.title.includes(val) || dict.value.includes(val)) })
+        nameDict = nameDict.filter((dict) => {
+          return values.find(val => dict.title.includes(val) || dict.value.includes(val))
+        })
         const totalNumber = nameDict.length
         if (slice) {
           nameDict = nameDict.slice(slice.offsetNumber, slice.offsetNumber + slice.fetchNumber)
@@ -493,7 +509,9 @@ const events: IwProps.TableEventProps = {
       }
       else {
         let statsDict: IwProps.DictItemProps[] = JSON.parse(JSON.stringify(STATS_DICT))
-        statsDict = statsDict.filter((dict) => { return values.find(val => dict.title.includes(val) || dict.value.includes(val)) })
+        statsDict = statsDict.filter((dict) => {
+          return values.find(val => dict.title.includes(val) || dict.value.includes(val))
+        })
         const totalNumber = statsDict.length
         if (slice) {
           statsDict = statsDict.slice(slice.offsetNumber, slice.offsetNumber + slice.fetchNumber)

postcss.config.js

@@ -3,6 +3,6 @@ export default {
     'postcss-import': {},
     'tailwindcss/nesting': 'postcss-nesting',
     'tailwindcss': {},
-    'autoprefixer': {}
+    'autoprefixer': {},
   },
 }

src/assets/icon.ts

@@ -44,13 +44,13 @@ export const CANCEL = 'octicon-x-24'
 export const SEARCH = 'octicon-search-24'
 export const SETTING = 'octicon-gear-24'
 
-export const FIRST  = 'octicon-move-to-start-24'
-export const LAST  = 'octicon-move-to-end-24'
-export const PREVIOUS  = 'octicon-chevron-left-24'
-export const NEXT  = 'octicon-chevron-right-24'
+export const FIRST = 'octicon-move-to-start-24'
+export const LAST = 'octicon-move-to-end-24'
+export const PREVIOUS = 'octicon-chevron-left-24'
+export const NEXT = 'octicon-chevron-right-24'
 
-export const ASC  = 'octicon-sort-asc-24'
-export const DESC  = 'octicon-sort-desc-24'
+export const ASC = 'octicon-sort-asc-24'
+export const DESC = 'octicon-sort-desc-24'
 
 export const TILE_ALL_DATA = 'octicon-multi-select-24'
 export const ONLY_PARENT_DATA = 'octicon-x-24'

src/components/common/IconPicker.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import { ref } from 'vue';
-import { MenuOffsetKind } from './Menu';
-import MenuComp from './Menu.vue';
+import { ref } from 'vue'
+import { MenuOffsetKind } from './Menu'
+import MenuComp from './Menu.vue'
 
 const emit = defineEmits(['selectIcon'])
 const iconCompRef = ref<InstanceType<typeof MenuComp>>()

src/components/common/Menu.vue

@@ -39,9 +39,12 @@ async function showContextMenu(attachObj: HTMLElement | MouseEvent, offset: Menu
   // 菜单已初始化
   isInit.value = true
 
-  if (!force
-    && (attachObj instanceof HTMLElement && contextmenuRef.value!.contains(attachObj)
-    || attachObj instanceof MouseEvent && attachObj.target instanceof HTMLElement && contextmenuRef.value!.contains(attachObj.target))) {
+  if (
+    !force
+    && (
+      (attachObj instanceof HTMLElement && contextmenuRef.value!.contains(attachObj)) || (attachObj instanceof MouseEvent && attachObj.target instanceof HTMLElement && contextmenuRef.value!.contains(attachObj.target))
+    )
+  ) {
     return
   }
 

src/components/common/Scrollable.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import { onMounted, ref } from 'vue';
-import * as iconSvg from '../../assets/icon';
+import { onMounted, ref } from 'vue'
+import * as iconSvg from '../../assets/icon'
 
 const scrollableRef = ref<HTMLElement | null>(null)
 const scrollableMainRef = ref<HTMLElement | null>(null)

src/components/function/CellEdit.vue

@@ -224,7 +224,8 @@ onMounted(() => {
   // 容器冒泡捕捉到单击事件后，尝试离开编辑模式
   // After the container captures the click event, try to leave edit mode
   containerEle.addEventListener('click', (e) => {
-    if (!curColumnConf.value || e.target && e.target instanceof HTMLElement && e.target.closest(`.iw-edit-container`)) {
+    if (!curColumnConf.value
+      || (e.target && e.target instanceof HTMLElement && e.target.closest(`.iw-edit-container`))) {
       return
     }
     // 在编辑模式下，且点击的不是编辑容器(cellEditContainerRef)，则尝试离开编辑模式

src/components/function/ColumnResize.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { onMounted, ref } from 'vue';
+import { onMounted, ref } from 'vue'
 
 const props = defineProps<{
   // 可调整大小的元素类名。必须是 ``relative`` 定位
@@ -137,8 +137,8 @@ onMounted(() => {
     const targetEleRect = targetEle.getBoundingClientRect()
     // 边界计算
     // Boundary calculation
-    if (!props.handleLeft && targetEleRect.right - e.clientX < 5
-      || props.handleLeft && e.clientX - targetEleRect.left < 5
+    if ((!props.handleLeft && targetEleRect.right - e.clientX < 5)
+      || (props.handleLeft && e.clientX - targetEleRect.left < 5)
     ) {
       prepareResize(dragEle, targetEle, e)
     }

src/components/function/GroupSetting.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
-import * as iconSvg from '../../assets/icon';
-import type { GroupDataProps } from '../../props';
-import type { ColumnConf } from '../conf';
-import * as eb from '../eventbus';
+import * as iconSvg from '../../assets/icon'
+import type { GroupDataProps } from '../../props'
+import type { ColumnConf } from '../conf'
+import * as eb from '../eventbus'
 
 const props = defineProps<{
   // 布局ID

src/components/function/TableLocalesSetting.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { changeLocale } from '../../locales';
+import { changeLocale } from '../../locales'
 
 function changeLocales(locale: 'zh' | 'en') {
   changeLocale(locale)

src/components/function/TableResizeSetting.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
-import * as iconSvg from '../../assets/icon';
-import type { TableStyleModifyProps, TableStyleProps } from '../../props';
-import { SizeKind } from '../../props';
-import * as eb from '../eventbus';
+import * as iconSvg from '../../assets/icon'
+import type { TableStyleModifyProps, TableStyleProps } from '../../props'
+import { SizeKind } from '../../props'
+import * as eb from '../eventbus'
 
 const props = defineProps<{
   // 表格样式

src/components/function/TableThemeSetting.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import type { TableStyleModifyProps } from '../../props';
-import * as eb from '../eventbus';
+import type { TableStyleModifyProps } from '../../props'
+import * as eb from '../eventbus'
 
 async function changeTheme(e: Event) {
   const targetEle = e.target as HTMLInputElement

src/index.ts

@@ -23,6 +23,5 @@ export {
   IwProps,
   IwEvents,
   IwUtils,
-  IwTaskTable
+  IwTaskTable,
 }
-

src/props/eventProps.ts

@@ -170,7 +170,7 @@ export interface TableEventProps {
    * 加载假日列表
    *
    * Load holidays
-   * 
+   *
    * @param startTime 开始时间 / Start time
    * @param endTime 结束时间 / End time
    * @returns 假日列表 / Holidays

src/props/index.ts

@@ -23,4 +23,3 @@ export * from './enumProps'
 export * from './eventProps'
 export * from './functionProps'
 export * from './kernelProps'
-

src/utils/vueHelper.ts

@@ -19,11 +19,14 @@ export function deepToRaw<T extends Record<string, any>>(sourceObj: T): T {
   const objectIterator = (input: any): any => {
     if (Array.isArray(input)) {
       return input.map(item => objectIterator(item))
-    } if (isRef(input)) {
+    }
+    else if (isRef(input)) {
       return objectIterator(toRaw(input.value))
-    } if (isReactive(input) || isProxy(input)) {
+    }
+    else if (isReactive(input) || isProxy(input)) {
       return objectIterator(toRaw(input))
-    } if (input && typeof input === 'object') {
+    }
+    else if (input && typeof input === 'object') {
       return Object.keys(input).reduce((acc, key) => {
         acc[key as keyof typeof acc] = objectIterator(input[key])
         return acc

test/utils/basic.test.ts

@@ -1,4 +1,4 @@
-import { assert, describe, expect, it } from 'vitest'
+import { describe, expect, it } from 'vitest'
 import { groupBy } from '../../src/utils/basic'
 
 describe('groupBy', () => {