style: lint

src/components/common/AppPage.vue

@@ -9,7 +9,9 @@
 <template>
   <main class="cus-scroll h-full flex-col flex-1 bg-#f5f6fb dark:bg-#121212">
     <transition name="fade-slide" mode="out-in" appear>
-      <main :class="{ 'flex-1': full }" class="m-12"><slot /></main>
+      <main :class="{ 'flex-1': full }" class="m-12">
+        <slot />
+      </main>
     </transition>
     <slot v-if="$slots.footer" name="footer" />
     <TheFooter v-else-if="showFooter" class="mb-12 mt-auto" />

src/components/common/CommonPage.vue

@@ -27,8 +27,10 @@
                 <span class="ml-4">返回</span>
               </div>
             </template>
-            <div class="mr-12 h-16 w-4 rounded-l-2 bg-primary"></div>
-            <h2 class="font-normal">{{ title ?? route.meta?.title }}</h2>
+            <div class="mr-12 h-16 w-4 rounded-l-2 bg-primary" />
+            <h2 class="font-normal">
+              {{ title ?? route.meta?.title }}
+            </h2>
             <slot name="title-suffix" />
           </div>
           <slot name="action" />

src/components/common/TheLogo.vue

@@ -7,6 +7,6 @@
  --------------------------------->
 <template>
   <div class="h-40 w-40 rounded-4 bg-primary p-1/100">
-    <img src="@/assets/images/isme.png" alt="Logo" />
+    <img src="@/assets/images/isme.png" alt="Logo">
   </div>
 </template>

src/components/common/ThemeSetting.vue

@@ -16,6 +16,7 @@
 <script setup>
 import { getPresetColors } from '@arco-design/color'
 import { useAppStore } from '@/store'
+
 const appStore = useAppStore()
 
 const primaryColors = Object.entries(getPresetColors()).map(([, value]) => value.primary)

src/components/me/crud/QueryItem.vue

@@ -8,10 +8,10 @@
 
 <template>
   <div class="flex items-center">
-    <label v-if="label || label === 0" class="flex-shrink-0" :style="{ width: labelWidth + 'px' }">
+    <label v-if="label || label === 0" class="flex-shrink-0" :style="{ width: `${labelWidth}px` }">
       {{ label }}
     </label>
-    <div :style="{ width: contentWidth + 'px' }" class="flex-shrink-0">
+    <div :style="{ width: `${contentWidth}px` }" class="flex-shrink-0">
       <slot />
     </div>
   </div>

src/components/me/crud/index.vue

@@ -25,7 +25,7 @@
     </form>
   </AppCard>
 
-  <n-data-table
+  <NDataTable
     :remote="remote"
     :loading="loading"
     :scroll-x="scrollX"
@@ -78,10 +78,10 @@ const props = defineProps({
   },
   /**
    * ! 约定接口入参出参
-   * * 分页模式需约定分页接口入参
+   * 分页模式需约定分页接口入参
    *    @pageSize 分页参数：一页展示多少条，默认10
    *    @pageNo   分页参数：页码，默认1
-   * * 需约定接口出参
+   * 需约定接口出参
    *    @pageData 分页模式必须,非分页模式如果没有pageData则取上一层data
    *    @total    分页模式必须，非分页模式如果没有total则取上一层data.length
    */
@@ -111,10 +111,12 @@ async function handleQuery() {
     })
     tableData.value = data?.pageData || data
     pagination.itemCount = data.total ?? data.length
-  } catch (error) {
+  }
+  catch (error) {
     tableData.value = []
     pagination.itemCount = 0
-  } finally {
+  }
+  finally {
     emit('onDataChange', tableData.value)
     loading.value = false
   }
@@ -140,16 +142,17 @@ function onPageChange(currentPage) {
   }
 }
 function onChecked(rowKeys) {
-  if (props.columns.some((item) => item.type === 'selection')) {
+  if (props.columns.some(item => item.type === 'selection')) {
     emit('onChecked', rowKeys)
   }
 }
 function handleExport(columns = props.columns, data = tableData.value) {
-  if (!data?.length) return $message.warning('没有数据')
-  const columnsData = columns.filter((item) => !!item.title && !item.hideInExcel)
-  const thKeys = columnsData.map((item) => item.key)
-  const thData = columnsData.map((item) => item.title)
-  const trData = data.map((item) => thKeys.map((key) => item[key]))
+  if (!data?.length)
+    return $message.warning('没有数据')
+  const columnsData = columns.filter(item => !!item.title && !item.hideInExcel)
+  const thKeys = columnsData.map(item => item.key)
+  const thData = columnsData.map(item => item.title)
+  const trData = data.map(item => thKeys.map(key => item[key]))
   const sheet = utils.aoa_to_sheet([thData, ...trData])
   const workBook = utils.book_new()
   utils.book_append_sheet(workBook, sheet, '数据报表')

src/components/me/modal/index.vue

@@ -18,9 +18,11 @@
   >
     <n-card :style="modalOptions.contentStyle" :closable="modalOptions.closable" @close="close()">
       <template #header>
-        <header class="modal-header">{{ modalOptions.title }}</header>
+        <header class="modal-header">
+          {{ modalOptions.title }}
+        </header>
       </template>
-      <slot></slot>
+      <slot />
 
       <!-- 底部按钮 -->
       <template #footer>
@@ -46,6 +48,7 @@
 
 <script setup>
 import { initDrag } from './utils'
+
 const props = defineProps({
   width: {
     type: String,
@@ -101,6 +104,17 @@ const show = ref(false)
 // 声明一个modalOptions变量，用于存储模态框的配置信息
 const modalOptions = ref({})
 
+const okLoading = computed({
+  get() {
+    return !!modalOptions.value?.okLoading
+  },
+  set(v) {
+    if (modalOptions.value) {
+      modalOptions.value.okLoading = v
+    }
+  },
+})
+
 // 打开模态框
 async function open(options = {}) {
   // 将props和options合并赋值给modalOptions
@@ -111,7 +125,7 @@ async function open(options = {}) {
   await nextTick()
   initDrag(
     Array.prototype.at.call(document.querySelectorAll('.modal-header'), -1),
-    Array.prototype.at.call(document.querySelectorAll('.modal-box'), -1)
+    Array.prototype.at.call(document.querySelectorAll('.modal-box'), -1),
   )
 }
 
@@ -131,7 +145,8 @@ async function handleOk(data) {
     const res = await modalOptions.value.onOk(data)
     // 如果onOk函数的返回值不为false，则关闭模态框
     res !== false && close()
-  } catch (error) {
+  }
+  catch (error) {
     okLoading.value = false
     console.error(error)
   }
@@ -149,7 +164,8 @@ async function handleCancel(data) {
 
     // 如果onCancel函数的返回值不为false，则关闭模态框
     res !== false && close()
-  } catch (error) {
+  }
+  catch (error) {
     okLoading.value = false
     console.error(error)
   }
@@ -159,21 +175,10 @@ async function onAfterLeave() {
   await nextTick()
   initDrag(
     Array.prototype.at.call(document.querySelectorAll('.modal-header'), -1),
-    Array.prototype.at.call(document.querySelectorAll('.modal-box'), -1)
+    Array.prototype.at.call(document.querySelectorAll('.modal-box'), -1),
   )
 }
 
-const okLoading = computed({
-  get() {
-    return !!modalOptions.value?.okLoading
-  },
-  set(v) {
-    if (modalOptions.value) {
-      modalOptions.value.okLoading = v
-    }
-  },
-})
-
 // 定义一个defineExpose函数，用于暴露open、close、handleOk、handleCancel函数
 defineExpose({
   open,

src/components/me/modal/utils.js

@@ -15,7 +15,8 @@ function getCss(element, key) {
 
 // 初始化拖拽
 export function initDrag(bar, box) {
-  if (!bar || !box) return
+  if (!bar || !box)
+    return
   const params = {
     left: 0,
     top: 0,
@@ -50,7 +51,8 @@ export function initDrag(bar, box) {
     }
   }
   document.onmousemove = function (e) {
-    if (e.target !== bar && !params.flag) return
+    if (e.target !== bar && !params.flag)
+      return
 
     e.preventDefault() // 阻止默认事件
     // 如果拖拽标志为true
@@ -60,11 +62,11 @@ export function initDrag(bar, box) {
       const disX = nowX - params.currentX // 鼠标移动的X距离
       const disY = nowY - params.currentY // 鼠标移动的Y距离
 
-      let left = parseInt(params.left) + disX // 盒子元素的新left值
-      let top = parseInt(params.top) + disY // 盒子元素的新top值
+      const left = Number.parseInt(params.left) + disX // 盒子元素的新left值
+      const top = Number.parseInt(params.top) + disY // 盒子元素的新top值
 
-      box.style.left = left + 'px'
-      box.style.top = top + 'px'
+      box.style.left = `${left}px`
+      box.style.top = `${top}px`
     }
   }
 }