👣 重构底层

kicc-ui/src/components/Cropper/src/CopperModal.vue

@@ -1,12 +1,12 @@
 <template>
   <BasicModal
     v-bind="$attrs"
-    @register="register"
-    :title="t('component.cropper.modalTitle')"
     width="800px"
     :canFullscreen="false"
-    @ok="handleOk"
+    :title="t('component.cropper.modalTitle')"
     :okText="t('component.cropper.okText')"
+    @register="register"
+    @ok="handleOk"
   >
     <div :class="prefixCls">
       <div :class="`${prefixCls}-left`">
@@ -24,7 +24,7 @@
         <div :class="`${prefixCls}-toolbar`">
           <Upload :fileList="[]" accept="image/*" :beforeUpload="handleBeforeUpload">
             <Tooltip :title="t('component.cropper.selectImage')" placement="bottom">
-              <a-button size="small" preIcon="ant-design:upload-outlined" type="primary" />
+              <a-button size="small" preIcon="ant-design:upload-outlined" type="primary"/>
             </Tooltip>
           </Upload>
           <Space>
@@ -96,14 +96,14 @@
       </div>
       <div :class="`${prefixCls}-right`">
         <div :class="`${prefixCls}-preview`">
-          <img :src="previewSource" v-if="previewSource" :alt="t('component.cropper.preview')" />
+          <img v-if="previewSource" :src="previewSource" :alt="t('component.cropper.preview')">
         </div>
         <template v-if="previewSource">
           <div :class="`${prefixCls}-group`">
-            <Avatar :src="previewSource" size="large" />
+            <Avatar :src="previewSource" size="large"/>
-            <Avatar :src="previewSource" :size="48" />
+            <Avatar :src="previewSource" :size="48"/>
-            <Avatar :src="previewSource" :size="64" />
+            <Avatar :src="previewSource" :size="64"/>
-            <Avatar :src="previewSource" :size="80" />
+            <Avatar :src="previewSource" :size="80"/>
           </div>
         </template>
       </div>

kicc-ui/src/components/Cropper/src/Cropper.vue

@@ -7,7 +7,7 @@
       :alt="alt"
       :crossorigin="crossorigin"
       :style="getImageStyle"
-    />
+    >
   </div>
 </template>
 <script lang="ts">

kicc-ui/src/components/Cropper/src/CropperAvatar.vue

@@ -9,22 +9,22 @@
           color="#d6d6d6"
         />
       </div>
-      <img :src="sourceValue" v-if="sourceValue" alt="avatar" />
+      <img v-if="sourceValue" :src="sourceValue" alt="avatar">
     </div>
     <a-button
-      :class="`${prefixCls}-upload-btn`"
-      @click="openModal"
       v-if="showBtn"
+      :class="`${prefixCls}-upload-btn`"
       v-bind="btnProps"
+      @click="openModal"
     >
       {{ btnText ? btnText : t('component.cropper.selectImage') }}
     </a-button>
 
     <CopperModal
-      @register="register"
-      @uploadSuccess="handleUploadSuccess"
       :uploadApi="uploadApi"
       :src="sourceValue"
+      @register="register"
+      @uploadSuccess="handleUploadSuccess"
     />
   </div>
 </template>

kicc-ui/src/components/Drawer/src/BasicDrawer.vue

@@ -1,6 +1,6 @@
 <template>
-  <Drawer :class="prefixCls" @close="onClose" v-bind="getBindValues">
+  <Drawer :class="prefixCls" v-bind="getBindValues" @close="onClose">
-    <template #title v-if="!$slots.title">
+    <template v-if="!$slots.title" #title>
       <DrawerHeader
         :title="getMergeProps.title"
         :isDetail="isDetail"
@@ -8,24 +8,28 @@
         @close="onClose"
       >
         <template #titleToolbar>
-          <slot name="titleToolbar"></slot>
+          <slot name="titleToolbar"/>
         </template>
       </DrawerHeader>
     </template>
     <template v-else #title>
-      <slot name="title"></slot>
+      <slot name="title"/>
     </template>
 
     <ScrollContainer
-      :style="getScrollContentStyle"
       v-loading="getLoading"
+      :style="getScrollContentStyle"
       :loading-tip="loadingText || t('common.loadingText')"
     >
-      <slot></slot>
+      <slot/>
     </ScrollContainer>
-    <DrawerFooter v-bind="getProps" @close="onClose" @ok="handleOk" :height="getFooterHeight">
+    <DrawerFooter v-bind="getProps"
-      <template #[item]="data" v-for="item in Object.keys($slots)">
+                  :height="getFooterHeight"
-        <slot :name="item" v-bind="data || {}"></slot>
+                  @close="onClose"
+                  @ok="handleOk"
+    >
+      <template v-for="item in Object.keys($slots)" #[item]="data">
+        <slot :name="item" v-bind="data || {}"/>
       </template>
     </DrawerFooter>
   </Drawer>
@@ -119,7 +123,7 @@
             ? `${footerHeight}px`
             : `${footerHeight.replace('px', '')}px`;
         }
-        return `0px`;
+        return '0px';
       });
 
       const getScrollContentStyle = computed((): CSSProperties => {

kicc-ui/src/components/Drawer/src/components/DrawerFooter.vue

@@ -1,26 +1,30 @@
 <template>
-  <div :class="prefixCls" :style="getStyle" v-if="showFooter || $slots.footer">
+  <div v-if="showFooter || $slots.footer" :class="prefixCls" :style="getStyle">
     <template v-if="!$slots.footer">
-      <slot name="insertFooter"></slot>
+      <slot name="insertFooter"/>
-      <a-button v-bind="cancelButtonProps" @click="handleClose" class="mr-2" v-if="showCancelBtn">
+      <a-button v-if="showCancelBtn"
+                v-bind="cancelButtonProps"
+                class="mr-2"
+                @click="handleClose"
+      >
         {{ cancelText }}
       </a-button>
-      <slot name="centerFooter"></slot>
+      <slot name="centerFooter"/>
       <a-button
+        v-if="showOkBtn"
         :type="okType"
-        @click="handleOk"
         v-bind="okButtonProps"
         class="mr-2"
         :loading="confirmLoading"
-        v-if="showOkBtn"
+        @click="handleOk"
       >
         {{ okText }}
       </a-button>
-      <slot name="appendFooter"></slot>
+      <slot name="appendFooter"/>
     </template>
 
     <template v-else>
-      <slot name="footer"></slot>
+      <slot name="footer"/>
     </template>
   </div>
 </template>

kicc-ui/src/components/Drawer/src/components/DrawerHeader.vue

@@ -1,19 +1,19 @@
 <template>
   <BasicTitle v-if="!isDetail" :class="prefixCls">
-    <slot name="title"></slot>
+    <slot name="title"/>
     {{ !$slots.title ? title : '' }}
   </BasicTitle>
 
-  <div :class="[prefixCls, `${prefixCls}--detail`]" v-else>
+  <div v-else :class="[prefixCls, `${prefixCls}--detail`]">
     <span :class="`${prefixCls}__twrap`">
-      <span @click="handleClose" v-if="showDetailBack">
+      <span v-if="showDetailBack" @click="handleClose">
-        <ArrowLeftOutlined :class="`${prefixCls}__back`" />
+        <ArrowLeftOutlined :class="`${prefixCls}__back`"/>
       </span>
       <span v-if="title">{{ title }}</span>
     </span>
 
     <span :class="`${prefixCls}__toolbar`">
-      <slot name="titleToolbar"></slot>
+      <slot name="titleToolbar"/>
     </span>
   </div>
 </template>

kicc-ui/src/components/Dropdown/src/Dropdown.vue

@@ -1,34 +1,34 @@
 <template>
   <Dropdown :trigger="trigger" v-bind="$attrs">
     <span>
-      <slot></slot>
+      <slot/>
     </span>
     <template #overlay>
       <Menu :selectedKeys="selectedKeys">
         <template v-for="item in dropMenuList" :key="`${item.event}`">
           <MenuItem
             v-bind="getAttr(item.event)"
-            @click="handleClickMenu(item)"
             :disabled="item.disabled"
+            @click="handleClickMenu(item)"
           >
             <Popconfirm
               v-if="popconfirm && item.popConfirm"
               v-bind="getPopConfirmAttrs(item.popConfirm)"
             >
-              <template #icon v-if="item.popConfirm.icon">
+              <template v-if="item.popConfirm.icon" #icon>
-                <Icon :icon="item.popConfirm.icon" />
+                <Icon :icon="item.popConfirm.icon"/>
               </template>
               <div>
-                <Icon :icon="item.icon" v-if="item.icon" />
+                <Icon v-if="item.icon" :icon="item.icon"/>
                 <span class="ml-1">{{ item.text }}</span>
               </div>
             </Popconfirm>
             <template v-else>
-              <Icon :icon="item.icon" v-if="item.icon" />
+              <Icon v-if="item.icon" :icon="item.icon"/>
               <span class="ml-1">{{ item.text }}</span>
             </template>
           </MenuItem>
-          <MenuDivider v-if="item.divider" :key="`d-${item.event}`" />
+          <MenuDivider v-if="item.divider" :key="`d-${item.event}`"/>
         </template>
       </Menu>
     </template>

kicc-ui/src/components/Excel/src/ImportExcel.vue

@@ -1,14 +1,14 @@
 <template>
   <div>
     <input
+      v-show="false"
       ref="inputRef"
       type="file"
-      v-show="false"
       accept=".xlsx, .xls"
       @change="handleInputClick"
-    />
+    >
     <div @click="handleUpload">
-      <slot></slot>
+      <slot/>
     </div>
   </div>
 </template>

kicc-ui/src/components/Form/src/BasicForm.vue

@@ -1,13 +1,13 @@
 <template>
   <Form
     v-bind="getBindValue"
-    :class="getFormClass"
     ref="formElRef"
+    :class="getFormClass"
     :model="formModel"
     @keypress.enter="handleEnterPress"
   >
     <Row v-bind="getRow">
-      <slot name="formHeader"></slot>
+      <slot name="formHeader"/>
       <template v-for="schema in getSchema" :key="schema.field">
         <FormItem
           :tableAction="tableAction"
@@ -18,21 +18,21 @@
           :formModel="formModel"
           :setFormModel="setFormModel"
         >
-          <template #[item]="data" v-for="item in Object.keys($slots)">
+          <template v-for="item in Object.keys($slots)" #[item]="data">
-            <slot :name="item" v-bind="data || {}"></slot>
+            <slot :name="item" v-bind="data || {}"/>
           </template>
         </FormItem>
       </template>
 
       <FormAction v-bind="{ ...getProps, ...advanceState }" @toggle-advanced="handleToggleAdvanced">
         <template
-          #[item]="data"
           v-for="item in ['resetBefore', 'submitBefore', 'advanceBefore', 'advanceAfter']"
+          #[item]="data"
         >
-          <slot :name="item" v-bind="data"></slot>
+          <slot :name="item" v-bind="data"/>
         </template>
       </FormAction>
-      <slot name="formFooter"></slot>
+      <slot name="formFooter"/>
     </Row>
   </Form>
 </template>

kicc-ui/src/components/Form/src/components/ApiSelect.vue

@@ -1,20 +1,20 @@
 <template>
   <Select
-    @dropdownVisibleChange="handleFetch"
+    v-model:value="state"
     v-bind="attrs"
-    @change="handleChange"
     :options="getOptions"
-    v-model:value="state"
+    @dropdownVisibleChange="handleFetch"
+    @change="handleChange"
   >
-    <template #[item]="data" v-for="item in Object.keys($slots)">
+    <template v-for="item in Object.keys($slots)" #[item]="data">
-      <slot :name="item" v-bind="data || {}"></slot>
+      <slot :name="item" v-bind="data || {}"/>
     </template>
-    <template #suffixIcon v-if="loading">
+    <template v-if="loading" #suffixIcon>
-      <LoadingOutlined spin />
+      <LoadingOutlined spin/>
     </template>
-    <template #notFoundContent v-if="loading">
+    <template v-if="loading" #notFoundContent>
       <span>
-        <LoadingOutlined spin class="mr-1" />
+        <LoadingOutlined spin class="mr-1"/>
         {{ t('component.form.apiSelectNotFound') }}
       </span>
     </template>

kicc-ui/src/components/Form/src/components/ApiTreeSelect.vue

@@ -1,10 +1,10 @@
 <template>
   <a-tree-select v-bind="getAttrs" @change="handleChange">
-    <template #[item]="data" v-for="item in Object.keys($slots)">
+    <template v-for="item in Object.keys($slots)" #[item]="data">
-      <slot :name="item" v-bind="data || {}"></slot>
+      <slot :name="item" v-bind="data || {}"/>
     </template>
-    <template #suffixIcon v-if="loading">
+    <template v-if="loading" #suffixIcon>
-      <LoadingOutlined spin />
+      <LoadingOutlined spin/>
     </template>
   </a-tree-select>
 </template>

kicc-ui/src/components/Form/src/components/FormAction.vue

@@ -1,40 +1,40 @@
 <template>
-  <a-col v-bind="actionColOpt" v-if="showActionButtonGroup">
+  <a-col v-if="showActionButtonGroup" v-bind="actionColOpt">
     <div style="width: 100%" :style="{ textAlign: actionColOpt.style.textAlign }">
       <FormItem>
-        <slot name="resetBefore"></slot>
+        <slot name="resetBefore"/>
         <Button
+          v-if="showResetButton"
           type="default"
           class="mr-2"
           v-bind="getResetBtnOptions"
           @click="resetAction"
-          v-if="showResetButton"
         >
           {{ getResetBtnOptions.text }}
         </Button>
-        <slot name="submitBefore"></slot>
+        <slot name="submitBefore"/>
 
         <Button
+          v-if="showSubmitButton"
           type="primary"
           class="mr-2"
           v-bind="getSubmitBtnOptions"
           @click="submitAction"
-          v-if="showSubmitButton"
         >
           {{ getSubmitBtnOptions.text }}
         </Button>
 
-        <slot name="advanceBefore"></slot>
+        <slot name="advanceBefore"/>
         <Button
+          v-if="showAdvancedButton && !hideAdvanceBtn"
           type="link"
           size="small"
           @click="toggleAdvanced"
-          v-if="showAdvancedButton && !hideAdvanceBtn"
         >
           {{ isAdvanced ? t('component.form.putAway') : t('component.form.unfold') }}
-          <BasicArrow class="ml-1" :expand="!isAdvanced" up />
+          <BasicArrow class="ml-1" :expand="!isAdvanced" up/>
         </Button>
-        <slot name="advanceAfter"></slot>
+        <slot name="advanceAfter"/>
       </FormItem>
     </div>
   </a-col>

kicc-ui/src/components/Form/src/components/RadioButtonGroup.vue

@@ -2,7 +2,7 @@
  * @Description:It is troublesome to implement radio button group in the form. So it is extracted independently as a separate component
 -->
 <template>
-  <RadioGroup v-bind="attrs" v-model:value="state" button-style="solid">
+  <RadioGroup v-model:value="state" v-bind="attrs" button-style="solid">
     <template v-for="item in getOptions" :key="`${item.value}`">
       <RadioButton :value="item.value" :disabled="item.disabled">
         {{ item.label }}

kicc-ui/src/components/Icon/src/Icon.vue

@@ -1,8 +1,8 @@
 <template>
   <SvgIcon
+    v-if="isSvgIcon"
     :size="size"
     :name="getSvgIcon"
-    v-if="isSvgIcon"
     :class="[$attrs.class, 'anticon']"
     :spin="spin"
   />
@@ -11,7 +11,7 @@
     ref="elRef"
     :class="[$attrs.class, 'app-iconify anticon', spin && 'app-iconify-spin']"
     :style="getWrapStyle"
-  ></span>
+  />
 </template>
 <script lang="ts">
   import type { PropType } from 'vue';

kicc-ui/src/components/Icon/src/IconPicker.vue

@@ -1,24 +1,24 @@
 <template>
   <a-input
+    v-model:value="currentSelect"
     disabled
     :style="{ width }"
     :placeholder="t('component.icon.placeholder')"
     :class="prefixCls"
-    v-model:value="currentSelect"
   >
     <template #addonAfter>
       <Popover
+        v-model="visible"
         placement="bottomLeft"
         trigger="click"
-        v-model="visible"
         :overlayClassName="`${prefixCls}-popover`"
       >
         <template #title>
           <div class="flex justify-between">
             <a-input
               :placeholder="t('component.icon.search')"
-              @change="handleSearchChange"
               allowClear
+              @change="handleSearchChange"
             />
           </div>
         </template>
@@ -43,16 +43,16 @@
                     border border-solid
                     hover:border-primary
                   "
-                  @click="handleClick(icon)"
                   :title="icon"
+                  @click="handleClick(icon)"
                 >
                   <!-- <Icon :icon="icon" :prefix="prefix" /> -->
-                  <SvgIcon v-if="isSvgMode" :name="icon" />
+                  <SvgIcon v-if="isSvgMode" :name="icon"/>
-                  <Icon :icon="icon" v-else />
+                  <Icon v-else :icon="icon"/>
                 </li>
               </ul>
             </ScrollContainer>
-            <div class="flex py-2 items-center justify-center" v-if="getTotal >= pageSize">
+            <div v-if="getTotal >= pageSize" class="flex py-2 items-center justify-center">
               <Pagination
                 showLessItems
                 size="small"
@@ -62,15 +62,14 @@
               />
             </div>
           </div>
-          <template v-else
+          <template v-else><div class="p-5"> <Empty/></div>
-            ><div class="p-5"> <Empty /></div>
           </template>
         </template>
 
-        <span class="cursor-pointer px-2 py-1 flex items-center" v-if="isSvgMode && currentSelect">
+        <span v-if="isSvgMode && currentSelect" class="cursor-pointer px-2 py-1 flex items-center">
-          <SvgIcon :name="currentSelect" />
+          <SvgIcon :name="currentSelect"/>
         </span>
-        <Icon :icon="currentSelect || 'ion:apps-outline'" class="cursor-pointer px-2 py-1" v-else />
+        <Icon v-else :icon="currentSelect || 'ion:apps-outline'" class="cursor-pointer px-2 py-1"/>
       </Popover>
     </template>
   </a-input>

kicc-ui/src/components/Icon/src/SvgIcon.vue

@@ -4,7 +4,7 @@
     :style="getStyle"
     aria-hidden="true"
   >
-    <use :xlink:href="symbolId" />
+    <use :xlink:href="symbolId"/>
   </svg>
 </template>
 <script lang="ts">

kicc-ui/src/components/Loading/src/Loading.vue

@@ -1,6 +1,10 @@
 <template>
-  <section class="full-loading" :class="{ absolute }" v-show="loading">
+  <section v-show="loading" class="full-loading" :class="{ absolute }">
-    <Spin v-bind="$attrs" :tip="tip" :size="size" :spinning="loading" />
+    <Spin v-bind="$attrs"
+          :tip="tip"
+          :size="size"
+          :spinning="loading"
+    />
   </section>
 </template>
 <script lang="ts">

kicc-ui/src/components/Markdown/src/Markdown.vue

@@ -1,5 +1,5 @@
 <template>
-  <div ref="wrapRef"></div>
+  <div ref="wrapRef"/>
 </template>
 <script lang="ts">
   import {

kicc-ui/src/components/Menu/src/BasicMenu.vue

@@ -6,14 +6,14 @@
     :openKeys="getOpenKeys"
     :inlineIndent="inlineIndent"
     :theme="theme"
-    @openChange="handleOpenChange"
     :class="getMenuClass"
-    @click="handleMenuClick"
     :subMenuOpenDelay="0.2"
     v-bind="getInlineCollapseOptions"
+    @openChange="handleOpenChange"
+    @click="handleMenuClick"
   >
     <template v-for="item in items" :key="item.path">
-      <BasicSubMenuItem :item="item" :theme="theme" :isHorizontal="isHorizontal" />
+      <BasicSubMenuItem :item="item" :theme="theme" :isHorizontal="isHorizontal"/>
     </template>
   </Menu>
 </template>

kicc-ui/src/components/Menu/src/components/BasicMenuItem.vue

@@ -1,6 +1,6 @@
 <template>
   <MenuItem :key="item.path">
-    <MenuItemContent v-bind="$props" :item="item" />
+    <MenuItemContent v-bind="$props" :item="item"/>
   </MenuItem>
 </template>
 <script lang="ts">

kicc-ui/src/components/Menu/src/components/BasicSubMenuItem.vue

@@ -2,8 +2,8 @@
   <BasicMenuItem v-if="!menuHasChildren(item) && getShowMenu" v-bind="$props" />
   <SubMenu
     v-if="menuHasChildren(item) && getShowMenu"
-    :class="[theme]"
     :key="`submenu-${item.path}`"
+    :class="[theme]"
     popupClassName="app-top-menu-popup"
   >
     <template #title>

kicc-ui/src/components/Menu/src/components/MenuItemContent.vue

@@ -1,6 +1,10 @@
 <template>
   <span :class="`${prefixCls}- flex items-center `">
-    <Icon v-if="getIcon" :icon="getIcon" :size="18" :class="`${prefixCls}-wrapper__icon mr-2`" />
+    <Icon v-if="getIcon"
+          :icon="getIcon"
+          :size="18"
+          :class="`${prefixCls}-wrapper__icon mr-2`"
+    />
     {{ getI18nName }}
   </span>
 </template>

kicc-ui/src/components/Modal/src/BasicModal.vue

@@ -1,6 +1,6 @@
 <template>
   <Modal v-bind="getBindValue" @cancel="handleCancel">
-    <template #closeIcon v-if="!$slots.closeIcon">
+    <template v-if="!$slots.closeIcon" #closeIcon>
       <ModalClose
         :canFullscreen="getProps.canFullscreen"
         :fullScreen="fullScreenRef"
@@ -9,7 +9,7 @@
       />
     </template>
 
-    <template #title v-if="!$slots.title">
+    <template v-if="!$slots.title" #title>
       <ModalHeader
         :helpMessage="getProps.helpMessage"
         :title="getMergeProps.title"
@@ -17,19 +17,19 @@
       />
     </template>
 
-    <template #footer v-if="!$slots.footer">
+    <template v-if="!$slots.footer" #footer>
       <ModalFooter v-bind="getBindValue" @ok="handleOk" @cancel="handleCancel">
-        <template #[item]="data" v-for="item in Object.keys($slots)">
+        <template v-for="item in Object.keys($slots)" #[item]="data">
-          <slot :name="item" v-bind="data || {}"></slot>
+          <slot :name="item" v-bind="data || {}"/>
         </template>
       </ModalFooter>
     </template>
 
     <ModalWrapper
+      ref="modalWrapperRef"
       :useWrapper="getProps.useWrapper"
       :footerOffset="wrapperFooterOffset"
       :fullScreen="fullScreenRef"
-      ref="modalWrapperRef"
       :loading="getProps.loading"
       :loading-tip="getProps.loadingTip"
       :minHeight="getProps.minHeight"
@@ -40,11 +40,11 @@
       @ext-height="handleExtHeight"
       @height-change="handleHeightChange"
     >
-      <slot></slot>
+      <slot/>
     </ModalWrapper>
 
-    <template #[item]="data" v-for="item in Object.keys(omit($slots, 'default'))">
+    <template v-for="item in Object.keys(omit($slots, 'default'))" #[item]="data">
-      <slot :name="item" v-bind="data"></slot>
+      <slot :name="item" v-bind="data"/>
     </template>
   </Modal>
 </template>

kicc-ui/src/components/Modal/src/components/ModalClose.vue

@@ -1,15 +1,15 @@
 <template>
   <div :class="getClass">
     <template v-if="canFullscreen">
-      <Tooltip :title="t('component.modal.restore')" placement="bottom" v-if="fullScreen">
+      <Tooltip v-if="fullScreen" :title="t('component.modal.restore')" placement="bottom">
-        <FullscreenExitOutlined role="full" @click="handleFullScreen" />
+        <FullscreenExitOutlined role="full" @click="handleFullScreen"/>
       </Tooltip>
-      <Tooltip :title="t('component.modal.maximize')" placement="bottom" v-else>
+      <Tooltip v-else :title="t('component.modal.maximize')" placement="bottom">
-        <FullscreenOutlined role="close" @click="handleFullScreen" />
+        <FullscreenOutlined role="close" @click="handleFullScreen"/>
       </Tooltip>
     </template>
     <Tooltip :title="t('component.modal.close')" placement="bottom">
-      <CloseOutlined @click="handleCancel" />
+      <CloseOutlined @click="handleCancel"/>
     </Tooltip>
   </div>
 </template>

kicc-ui/src/components/Modal/src/components/ModalFooter.vue

@@ -1,20 +1,20 @@
 <template>
   <div>
-    <slot name="insertFooter"></slot>
+    <slot name="insertFooter"/>
-    <a-button v-bind="cancelButtonProps" @click="handleCancel" v-if="showCancelBtn">
+    <a-button v-if="showCancelBtn" v-bind="cancelButtonProps" @click="handleCancel">
       {{ cancelText }}
     </a-button>
-    <slot name="centerFooter"></slot>
+    <slot name="centerFooter"/>
     <a-button
+      v-if="showOkBtn"
       :type="okType"
-      @click="handleOk"
       :loading="confirmLoading"
       v-bind="okButtonProps"
-      v-if="showOkBtn"
+      @click="handleOk"
     >
       {{ okText }}
     </a-button>
-    <slot name="appendFooter"></slot>
+    <slot name="appendFooter"/>
   </div>
 </template>
 <script lang="ts">

kicc-ui/src/components/Modal/src/components/ModalWrapper.vue

@@ -1,7 +1,11 @@
 <template>
   <ScrollContainer ref="wrapperRef">
-    <div ref="spinRef" :style="spinStyle" v-loading="loading" :loading-tip="loadingTip">
+    <div ref="spinRef"
-      <slot></slot>
+         v-loading="loading"
+         :style="spinStyle"
+         :loading-tip="loadingTip"
+    >
+      <slot/>
     </div>
   </ScrollContainer>
 </template>

kicc-ui/src/components/Page/src/PageFooter.vue

@@ -1,11 +1,11 @@
 <template>
   <div :class="prefixCls" :style="{ width: getCalcContentWidth }">
     <div :class="`${prefixCls}__left`">
-      <slot name="left"></slot>
+      <slot name="left"/>
     </div>
-    <slot></slot>
+    <slot/>
     <div :class="`${prefixCls}__right`">
-      <slot name="right"></slot>
+      <slot name="right"/>
     </div>
   </div>
 </template>

kicc-ui/src/components/Page/src/PageWrapper.vue

@@ -1,33 +1,37 @@
 <template>
-  <div :class="getClass" ref="wrapperRef">
+  <div ref="wrapperRef" :class="getClass">
     <PageHeader
-      :ghost="ghost"
+      v-if="content || $slots.headerContent || title || getHeaderSlots.length"
-      :title="title"
       v-bind="omit($attrs, 'class')"
       ref="headerRef"
-      v-if="content || $slots.headerContent || title || getHeaderSlots.length"
+      :ghost="ghost"
+      :title="title"
     >
       <template #default>
         <template v-if="content">
           {{ content }}
         </template>
-        <slot name="headerContent" v-else></slot>
+        <slot v-else name="headerContent"/>
       </template>
-      <template #[item]="data" v-for="item in getHeaderSlots">
+      <template v-for="item in getHeaderSlots" #[item]="data">
-        <slot :name="item" v-bind="data || {}"></slot>
+        <slot :name="item" v-bind="data || {}"/>
       </template>
     </PageHeader>
 
-    <div class="overflow-hidden" :class="getContentClass" :style="getContentStyle" ref="contentRef">
+    <div ref="contentRef"
-      <slot></slot>
+         class="overflow-hidden"
+         :class="getContentClass"
+         :style="getContentStyle"
+    >
+      <slot/>
     </div>
 
     <PageFooter v-if="getShowFooter" ref="footerRef">
       <template #left>
-        <slot name="leftFooter"></slot>
+        <slot name="leftFooter"/>
       </template>
       <template #right>
-        <slot name="rightFooter"></slot>
+        <slot name="rightFooter"/>
       </template>
     </PageFooter>
   </div>

kicc-ui/src/components/Qrcode/src/Qrcode.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <component :is="tag" ref="wrapRef" />
+    <component :is="tag" ref="wrapRef"/>
   </div>
 </template>
 <script lang="ts">

kicc-ui/src/components/Scrollbar/src/Scrollbar.vue

@@ -6,13 +6,17 @@
       :style="style"
       @scroll="handleScroll"
     >
-      <component :is="tag" ref="resize" :class="['scrollbar__view', viewClass]" :style="viewStyle">
+      <component :is="tag"
-        <slot></slot>
+                 ref="resize"
+                 :class="['scrollbar__view', viewClass]"
+                 :style="viewStyle"
+      >
+        <slot/>
       </component>
     </div>
     <template v-if="!native">
-      <bar :move="moveX" :size="sizeWidth" />
+      <bar :move="moveX" :size="sizeWidth"/>
-      <bar vertical :move="moveY" :size="sizeHeight" />
+      <bar vertical :move="moveY" :size="sizeHeight"/>
     </template>
   </div>
 </template>

kicc-ui/src/components/SimpleMenu/src/SimpleMenuTag.vue

@@ -1,5 +1,5 @@
 <template>
-  <span :class="getTagClass" v-if="getShowTag">{{ getContent }}</span>
+  <span v-if="getShowTag" :class="getTagClass">{{ getContent }}</span>
 </template>
 <script lang="ts">
   import type { Menu } from '/@/router/types';

kicc-ui/src/components/SimpleMenu/src/SimpleSubMenu.vue

@@ -1,11 +1,11 @@
 <template>
   <MenuItem
-    :name="item.path"
     v-if="!menuHasChildren(item) && getShowMenu"
+    :name="item.path"
     v-bind="$props"
     :class="getLevelClass"
   >
-    <Icon v-if="getIcon" :icon="getIcon" :size="16" />
+    <Icon v-if="getIcon" :icon="getIcon" :size="16"/>
     <div v-if="collapsedShowTitle && getIsCollapseParent" class="mt-1 collapse-title">
       {{ getI18nName }}
     </div>
@@ -13,17 +13,17 @@
       <span :class="['ml-2', `${prefixCls}-sub-title`]">
         {{ getI18nName }}
       </span>
-      <SimpleMenuTag :item="item" :collapseParent="getIsCollapseParent" />
+      <SimpleMenuTag :item="item" :collapseParent="getIsCollapseParent"/>
     </template>
   </MenuItem>
   <SubMenu
-    :name="item.path"
     v-if="menuHasChildren(item) && getShowMenu"
+    :name="item.path"
     :class="[getLevelClass, theme]"
     :collapsedShowTitle="collapsedShowTitle"
   >
     <template #title>
-      <Icon v-if="getIcon" :icon="getIcon" :size="16" />
+      <Icon v-if="getIcon" :icon="getIcon" :size="16"/>
 
       <div v-if="collapsedShowTitle && getIsCollapseParent" class="mt-2 collapse-title">
         {{ getI18nName }}
@@ -32,10 +32,10 @@
       <span v-show="getShowSubTitle" :class="['ml-2', `${prefixCls}-sub-title`]">
         {{ getI18nName }}
       </span>
-      <SimpleMenuTag :item="item" :collapseParent="!!collapse && !!parent" />
+      <SimpleMenuTag :item="item" :collapseParent="!!collapse && !!parent"/>
     </template>
     <template v-for="childrenItem in item.children || []" :key="childrenItem.path">
-      <SimpleSubMenu v-bind="$props" :item="childrenItem" :parent="false" />
+      <SimpleSubMenu v-bind="$props" :item="childrenItem" :parent="false"/>
     </template>
   </SubMenu>
 </template>

kicc-ui/src/components/SimpleMenu/src/components/Menu.vue

@@ -1,6 +1,6 @@
 <template>
   <ul :class="getClass">
-    <slot></slot>
+    <slot/>
   </ul>
 </template>
 

kicc-ui/src/components/SimpleMenu/src/components/MenuCollapseTransition.vue

@@ -1,6 +1,6 @@
 <template>
   <transition mode="out-in" v-on="on">
-    <slot></slot>
+    <slot/>
   </transition>
 </template>
 <script lang="ts">

kicc-ui/src/components/SimpleMenu/src/components/MenuItem.vue

@@ -1,17 +1,17 @@
 <template>
-  <li :class="getClass" @click.stop="handleClickItem" :style="getCollapse ? {} : getItemStyle">
+  <li :class="getClass" :style="getCollapse ? {} : getItemStyle" @click.stop="handleClickItem">
-    <Tooltip placement="right" v-if="showTooptip">
+    <Tooltip v-if="showTooptip" placement="right">
       <template #title>
-        <slot name="title"></slot>
+        <slot name="title"/>
       </template>
       <div :class="`${prefixCls}-tooltip`">
-        <slot></slot>
+        <slot/>
       </div>
     </Tooltip>
 
     <template v-else>
-      <slot></slot>
+      <slot/>
-      <slot name="title"></slot>
+      <slot name="title"/>
     </template>
   </li>
 </template>

kicc-ui/src/components/SimpleMenu/src/components/SubMenuItem.vue

@@ -1,8 +1,8 @@
 <template>
   <li :class="getClass">
     <template v-if="!getCollapse">
-      <div :class="`${prefixCls}-submenu-title`" @click.stop="handleClick" :style="getItemStyle">
+      <div :class="`${prefixCls}-submenu-title`" :style="getItemStyle" @click.stop="handleClick">
-        <slot name="title"></slot>
+        <slot name="title"/>
         <Icon
           icon="eva:arrow-ios-downward-outline"
           :size="14"
@@ -10,20 +10,20 @@
         />
       </div>
       <CollapseTransition>
-        <ul :class="prefixCls" v-show="opened">
+        <ul v-show="opened" :class="prefixCls">
-          <slot></slot>
+          <slot/>
         </ul>
       </CollapseTransition>
     </template>
 
     <Popover
+      v-else
       placement="right"
       :overlayClassName="`${prefixCls}-menu-popover`"
-      v-else
       :visible="getIsOpend"
-      @visibleChange="handleVisibleChange"
       :overlayStyle="getOverlayStyle"
       :align="{ offset: [0, 0] }"
+      @visibleChange="handleVisibleChange"
     >
       <div :class="getSubClass" v-bind="getEvents(false)">
         <div
@@ -34,7 +34,7 @@
             },
           ]"
         >
-          <slot name="title"></slot>
+          <slot name="title"/>
         </div>
         <Icon
           v-if="getParentSubMenu"
@@ -47,7 +47,7 @@
       <template #content v-show="opened">
         <div v-bind="getEvents(true)">
           <ul :class="[prefixCls, `${prefixCls}-${getTheme}`, `${prefixCls}-popup`]">
-            <slot></slot>
+            <slot/>
           </ul>
         </div>
       </template>

kicc-ui/src/components/StrengthMeter/src/StrengthMeter.vue

@@ -5,15 +5,15 @@
       v-bind="$attrs"
       allowClear
       :value="innerValueRef"
-      @change="handleChange"
       :disabled="disabled"
+      @change="handleChange"
     >
-      <template #[item]="data" v-for="item in Object.keys($slots)">
+      <template v-for="item in Object.keys($slots)" #[item]="data">
-        <slot :name="item" v-bind="data || {}"></slot>
+        <slot :name="item" v-bind="data || {}"/>
       </template>
     </InputPassword>
     <div :class="`${prefixCls}-bar`">
-      <div :class="`${prefixCls}-bar--fill`" :data-score="getPasswordStrength"></div>
+      <div :class="`${prefixCls}-bar--fill`" :data-score="getPasswordStrength"/>
     </div>
   </div>
 </template>

kicc-ui/src/components/Table/src/BasicTable.vue

@@ -1,32 +1,32 @@
 <template>
   <div ref="wrapRef" :class="getWrapperClass">
     <BasicForm
+      v-if="getBindValues.useSearchForm"
       submitOnReset
       v-bind="getFormProps"
-      v-if="getBindValues.useSearchForm"
       :tableAction="tableAction"
       @register="registerForm"
       @submit="handleSearchInfoChange"
       @advanced-change="redoHeight"
     >
-      <template #[replaceFormSlotKey(item)]="data" v-for="item in getFormSlotKeys">
+      <template v-for="item in getFormSlotKeys" #[replaceFormSlotKey(item)]="data">
-        <slot :name="item" v-bind="data"></slot>
+        <slot :name="item" v-bind="data"/>
       </template>
     </BasicForm>
 
     <Table
+      v-show="getEmptyDataIsShowTable"
       ref="tableElRef"
       v-bind="getBindValues"
       :rowClassName="getRowClassName"
-      v-show="getEmptyDataIsShowTable"
       @change="handleTableChange"
     >
-      <template #[item]="data" v-for="item in Object.keys($slots)" :key="item">
+      <template v-for="item in Object.keys($slots)" #[item]="data" :key="item">
-        <slot :name="item" v-bind="data || {}"></slot>
+        <slot :name="item" v-bind="data || {}"/>
       </template>
 
-      <template #[`header-${column.dataIndex}`] v-for="column in columns" :key="column.dataIndex">
+      <template v-for="column in columns" #[`header-${column.dataIndex}`] :key="column.dataIndex">
-        <HeaderCell :column="column" />
+        <HeaderCell :column="column"/>
       </template>
     </Table>
   </div>

kicc-ui/src/components/Table/src/components/EditTableHeaderIcon.vue

@@ -1,8 +1,8 @@
 <template>
   <span>
-    <slot></slot>
+    <slot/>
     {{ title }}
-    <FormOutlined />
+    <FormOutlined/>
   </span>
 </template>
 <script lang="ts">

kicc-ui/src/components/Table/src/components/HeaderCell.vue

@@ -3,7 +3,7 @@
     {{ getTitle }}
   </EditTableHeaderCell>
   <span v-else>{{ getTitle }}</span>
-  <BasicHelp v-if="getHelpMessage" :text="getHelpMessage" :class="`${prefixCls}__help`" />
+  <BasicHelp v-if="getHelpMessage" :text="getHelpMessage" :class="`${prefixCls}__help`"/>
 </template>
 <script lang="ts">
   import type { PropType } from 'vue';

kicc-ui/src/components/Table/src/components/TableAction.vue

@@ -3,29 +3,29 @@
     <template v-for="(action, index) in getActions" :key="`${index}-${action.label}`">
       <Tooltip v-if="action.tooltip" v-bind="getTooltip(action.tooltip)">
         <PopConfirmButton v-bind="action">
-          <Icon :icon="action.icon" :class="{ 'mr-1': !!action.label }" v-if="action.icon" />
+          <Icon v-if="action.icon" :icon="action.icon" :class="{ 'mr-1': !!action.label }"/>
           <template v-if="action.label">{{ action.label }}</template>
         </PopConfirmButton>
       </Tooltip>
       <PopConfirmButton v-else v-bind="action">
-        <Icon :icon="action.icon" :class="{ 'mr-1': !!action.label }" v-if="action.icon" />
+        <Icon v-if="action.icon" :icon="action.icon" :class="{ 'mr-1': !!action.label }"/>
         <template v-if="action.label">{{ action.label }}</template>
       </PopConfirmButton>
       <Divider
+        v-if="divider && index < getActions.length - 1"
         type="vertical"
         class="action-divider"
-        v-if="divider && index < getActions.length - 1"
       />
     </template>
     <Dropdown
+      v-if="dropDownActions && getDropdownList.length > 0"
       :trigger="['hover']"
       :dropMenuList="getDropdownList"
       popconfirm
-      v-if="dropDownActions && getDropdownList.length > 0"
     >
-      <slot name="more"></slot>
+      <slot name="more"/>
-      <a-button type="link" size="small" v-if="!$slots.more">
+      <a-button v-if="!$slots.more" type="link" size="small">
-        <MoreOutlined class="icon-more" />
+        <MoreOutlined class="icon-more"/>
       </a-button>
     </Dropdown>
   </div>

kicc-ui/src/components/Table/src/components/TableHeader.vue

@@ -1,21 +1,21 @@
 <template>
   <div style="width: 100%">
     <div v-if="$slots.headerTop" style="margin: 5px">
-      <slot name="headerTop"></slot>
+      <slot name="headerTop"/>
     </div>
     <div class="flex items-center">
-      <slot name="tableTitle" v-if="$slots.tableTitle"></slot>
+      <slot v-if="$slots.tableTitle" name="tableTitle"/>
       <TableTitle
+        v-if="!$slots.tableTitle && title"
         :helpMessage="titleHelpMessage"
         :title="title"
-        v-if="!$slots.tableTitle && title"
       />
       <div :class="`${prefixCls}__toolbar`">
-        <slot name="toolbar"></slot>
+        <slot name="toolbar"/>
-        <Divider type="vertical" v-if="$slots.toolbar && showTableSetting" />
+        <Divider v-if="$slots.toolbar && showTableSetting" type="vertical"/>
         <TableSetting
-          :setting="tableSetting"
           v-if="showTableSetting"
+          :setting="tableSetting"
           @columns-change="handleColumnChange"
         />
       </div>
@@ -35,7 +35,7 @@
               <span>已选中 {{ selectRowKeys.length }} 条记录(可跨页)</span>
               <Divider type="vertical"/>
               <a @click="setSelectedRowKeys([])">清空</a>
-              <slot name="alertAfter"></slot>
+              <slot name="alertAfter"/>
             </template>
             <template v-else>
               <span>未选中任何数据</span>

kicc-ui/src/components/Table/src/components/TableImg.vue

@@ -1,11 +1,11 @@
 <template>
   <div
+    v-if="imgList && imgList.length"
     :class="prefixCls"
     class="flex items-center mx-auto"
-    v-if="imgList && imgList.length"
     :style="getWrapStyle"
   >
-    <Badge :count="!showBadge || imgList.length == 1 ? 0 : imgList.length" v-if="simpleShow">
+    <Badge v-if="simpleShow" :count="!showBadge || imgList.length == 1 ? 0 : imgList.length">
       <div class="img-div">
         <PreviewGroup>
           <template v-for="(img, index) in imgList" :key="img">

kicc-ui/src/components/Table/src/components/TableTitle.vue

@@ -1,5 +1,5 @@
 <template>
-  <BasicTitle :class="prefixCls" v-if="getTitle" :helpMessage="helpMessage">
+  <BasicTitle v-if="getTitle" :class="prefixCls" :helpMessage="helpMessage">
     {{ getTitle }}
   </BasicTitle>
 </template>

kicc-ui/src/components/Table/src/components/editable/EditableCell.vue

@@ -8,12 +8,13 @@
       <div class="cell-content" :title="column.ellipsis ? getValues ?? '' : ''">{{
         getValues ?? '&nbsp;'
       }}</div>
-      <FormOutlined :class="`${prefixCls}__normal-icon`" v-if="!column.editRow" />
+      <FormOutlined v-if="!column.editRow" :class="`${prefixCls}__normal-icon`"/>
     </div>
 
-    <div v-if="isEdit" :class="`${prefixCls}__wrapper`" v-click-outside="onClickOutside">
+    <div v-if="isEdit" v-click-outside="onClickOutside" :class="`${prefixCls}__wrapper`">
       <CellComponent
         v-bind="getComponentProps"
+        ref="elRef"
         :component="getComponent"
         :style="getWrapperStyle"
         :popoverVisible="getRuleVisible"
@@ -21,14 +22,13 @@
         :ruleMessage="ruleMessage"
         :class="getWrapperClass"
         size="small"
-        ref="elRef"
         @change="handleChange"
         @options-change="handleOptionsChange"
         @pressEnter="handleEnter"
       />
-      <div :class="`${prefixCls}__action`" v-if="!getRowEditable">
+      <div v-if="!getRowEditable" :class="`${prefixCls}__action`">
-        <CheckOutlined :class="[`${prefixCls}__icon`, 'mx-2']" @click="handleSubmit" />
+        <CheckOutlined :class="[`${prefixCls}__icon`, 'mx-2']" @click="handleSubmit"/>
-        <CloseOutlined :class="`${prefixCls}__icon `" @click="handleCancel" />
+        <CloseOutlined :class="`${prefixCls}__icon `" @click="handleCancel"/>
       </div>
     </div>
   </div>

kicc-ui/src/components/Table/src/components/settings/ColumnSetting.vue

@@ -6,15 +6,15 @@
     <Popover
       placement="bottomLeft"
       trigger="click"
-      @visibleChange="handleVisibleChange"
       :overlayClassName="`${prefixCls}__cloumn-list`"
       :getPopupContainer="getPopupContainer"
+      @visibleChange="handleVisibleChange"
     >
       <template #title>
         <div :class="`${prefixCls}__popover-title`">
           <Checkbox
-            :indeterminate="indeterminate"
             v-model:checked="checkAll"
+            :indeterminate="indeterminate"
             @change="onCheckAllChange"
           >
             {{ t('component.table.settingColumnShow') }}
@@ -26,8 +26,8 @@
 
           <Checkbox
             v-model:checked="checkSelect"
-            @change="handleSelectCheckChange"
             :disabled="!defaultRowSelection"
+            @change="handleSelectCheckChange"
           >
             {{ t('component.table.settingSelectColumnShow') }}
           </Checkbox>
@@ -40,10 +40,10 @@
 
       <template #content>
         <ScrollContainer>
-          <CheckboxGroup v-model:value="checkedList" @change="onChange" ref="columnListRef">
+          <CheckboxGroup ref="columnListRef" v-model:value="checkedList" @change="onChange">
             <template v-for="item in plainOptions" :key="item.value">
-              <div :class="`${prefixCls}__check-item`" v-if="!('ifShow' in item && !item.ifShow)">
+              <div v-if="!('ifShow' in item && !item.ifShow)" :class="`${prefixCls}__check-item`">
-                <DragOutlined class="table-coulmn-drag-icon" />
+                <DragOutlined class="table-coulmn-drag-icon"/>
                 <Checkbox :value="item.value">
                   {{ item.label }}
                 </Checkbox>
@@ -68,7 +68,7 @@
                     @click="handleColumnFixed(item, 'left')"
                   />
                 </Tooltip>
-                <Divider type="vertical" />
+                <Divider type="vertical"/>
                 <Tooltip
                   placement="bottomLeft"
                   :mouseLeaveDelay="0.4"
@@ -94,7 +94,7 @@
           </CheckboxGroup>
         </ScrollContainer>
       </template>
-      <SettingOutlined />
+      <SettingOutlined/>
     </Popover>
   </Tooltip>
 </template>

kicc-ui/src/components/Table/src/components/settings/FullScreenSetting.vue

@@ -3,8 +3,8 @@
     <template #title>
       <span>{{ t('component.table.settingFullScreen') }}</span>
     </template>
-    <FullscreenOutlined @click="toggle" v-if="!isFullscreen" />
+    <FullscreenOutlined v-if="!isFullscreen" @click="toggle"/>
-    <FullscreenExitOutlined @click="toggle" v-else />
+    <FullscreenExitOutlined v-else @click="toggle"/>
   </Tooltip>
 </template>
 <script lang="ts">

kicc-ui/src/components/Table/src/components/settings/RedoSetting.vue

@@ -3,7 +3,7 @@
     <template #title>
       <span>{{ t('common.redo') }}</span>
     </template>
-    <RedoOutlined @click="redo" />
+    <RedoOutlined @click="redo"/>
   </Tooltip>
 </template>
 <script lang="ts">

kicc-ui/src/components/Table/src/components/settings/SizeSetting.vue

@@ -5,9 +5,9 @@
     </template>
 
     <Dropdown placement="bottomCenter" :trigger="['click']" :getPopupContainer="getPopupContainer">
-      <ColumnHeightOutlined />
+      <ColumnHeightOutlined/>
       <template #overlay>
-        <Menu @click="handleTitleClick" selectable v-model:selectedKeys="selectedKeysRef">
+        <Menu v-model:selectedKeys="selectedKeysRef" selectable @click="handleTitleClick">
           <MenuItem key="default">
             <span>{{ t('component.table.settingDensDefault') }}</span>
           </MenuItem>

kicc-ui/src/components/Table/src/components/settings/index.vue

@@ -1,13 +1,13 @@
 <template>
   <div class="table-settings">
-    <RedoSetting v-if="getSetting.redo" :getPopupContainer="getTableContainer" />
+    <RedoSetting v-if="getSetting.redo" :getPopupContainer="getTableContainer"/>
-    <SizeSetting v-if="getSetting.size" :getPopupContainer="getTableContainer" />
+    <SizeSetting v-if="getSetting.size" :getPopupContainer="getTableContainer"/>
     <ColumnSetting
       v-if="getSetting.setting"
-      @columns-change="handleColumnChange"
       :getPopupContainer="getTableContainer"
+      @columns-change="handleColumnChange"
     />
-    <FullScreenSetting v-if="getSetting.fullScreen" :getPopupContainer="getTableContainer" />
+    <FullScreenSetting v-if="getSetting.fullScreen" :getPopupContainer="getTableContainer"/>
   </div>
 </template>
 <script lang="ts">

kicc-ui/src/components/Tinymce/src/Editor.vue

@@ -1,14 +1,14 @@
 <template>
   <div :class="prefixCls" :style="{ width: containerWidth }">
     <ImgUpload
-      :fullscreen="fullscreen"
-      @uploading="handleImageUploading"
-      @done="handleDone"
       v-if="showImageUpload"
       v-show="editorRef"
+      :fullscreen="fullscreen"
       :disabled="disabled"
+      @uploading="handleImageUploading"
+      @done="handleDone"
     />
-    <textarea :id="tinymceId" ref="elRef" :style="{ visibility: 'hidden' }"></textarea>
+    <textarea :id="tinymceId" ref="elRef" :style="{ visibility: 'hidden' }"/>
   </div>
 </template>
 

kicc-ui/src/components/Tinymce/src/ImgUpload.vue

@@ -3,10 +3,10 @@
     <Upload
       name="file"
       multiple
-      @change="handleChange"
       :action="uploadUrl"
       :showUploadList="false"
       accept=".jpg,.jpeg,.gif,.png,.webp"
+      @change="handleChange"
     >
       <a-button type="primary" v-bind="{ ...getButtonProps }">
         {{ t('component.upload.imgUpload') }}

kicc-ui/src/components/Transition/src/CollapseTransition.vue

@@ -1,6 +1,6 @@
 <template>
   <transition mode="out-in" v-on="on">
-    <slot></slot>
+    <slot/>
   </transition>
 </template>
 <script lang="ts">

kicc-ui/src/components/Tree/src/TreeHeader.vue

@@ -1,28 +1,28 @@
 <template>
   <div class="flex px-2 py-1.5 items-center basic-tree-header">
-    <slot name="headerTitle" v-if="$slots.headerTitle"></slot>
+    <slot v-if="$slots.headerTitle" name="headerTitle"/>
-    <BasicTitle :helpMessage="helpMessage" v-if="!$slots.headerTitle && title">
+    <BasicTitle v-if="!$slots.headerTitle && title" :helpMessage="helpMessage">
       {{ title }}
     </BasicTitle>
 
-    <div class="flex flex-1 justify-end items-center cursor-pointer" v-if="search || toolbar">
+    <div v-if="search || toolbar" class="flex flex-1 justify-end items-center cursor-pointer">
-      <div class="mr-1 w-2/3" v-if="search">
+      <div v-if="search" class="mr-1 w-2/3">
         <InputSearch
+          v-model:value="searchValue"
           :placeholder="t('common.searchText')"
           size="small"
           allowClear
-          v-model:value="searchValue"
         />
       </div>
-      <Dropdown @click.prevent v-if="toolbar">
+      <Dropdown v-if="toolbar" @click.prevent>
-        <Icon icon="ion:ellipsis-vertical" />
+        <Icon icon="ion:ellipsis-vertical"/>
         <template #overlay>
           <Menu @click="handleMenuClick">
             <template v-for="item in toolbarList" :key="item.value">
               <MenuItem v-bind="{ key: item.value }">
                 {{ item.label }}
               </MenuItem>
-              <MenuDivider v-if="item.divider" />
+              <MenuDivider v-if="item.divider"/>
             </template>
           </Menu>
         </template>

kicc-ui/src/components/Upload/src/BasicUpload.vue

@@ -1,10 +1,10 @@
 <template>
   <div>
     <a-button-group>
-      <a-button type="primary" @click="openUploadModal" preIcon="carbon:cloud-upload">
+      <a-button type="primary" preIcon="carbon:cloud-upload" @click="openUploadModal">
         {{ t('component.upload.upload') }}
       </a-button>
-      <Tooltip placement="bottom" v-if="showPreview">
+      <Tooltip v-if="showPreview" placement="bottom">
         <template #title>
           {{ t('component.upload.uploaded') }}
           <template v-if="fileList.length">
@@ -12,7 +12,7 @@
           </template>
         </template>
         <a-button @click="openPreviewModal">
-          <Icon icon="bi:eye" />
+          <Icon icon="bi:eye"/>
           <template v-if="fileList.length && showPreviewNumber">
             {{ fileList.length }}
           </template>

kicc-ui/src/components/Upload/src/ThumbUrl.vue

@@ -1,6 +1,6 @@
 <template>
   <span class="thumb">
-    <Image v-if="fileUrl" :src="fileUrl" :width="104" />
+    <Image v-if="fileUrl" :src="fileUrl" :width="104"/>
   </span>
 </template>
 <script lang="ts">

kicc-ui/src/components/Upload/src/UploadModal.vue

@@ -4,28 +4,32 @@
     :title="t('component.upload.upload')"
     :okText="t('component.upload.save')"
     v-bind="$attrs"
-    @register="register"
-    @ok="handleOk"
     :closeFunc="handleCloseFunc"
     :maskClosable="false"
     :keyboard="false"
     wrapClassName="upload-modal"
     :okButtonProps="getOkButtonProps"
     :cancelButtonProps="{ disabled: isUploadingRef }"
+    @register="register"
+    @ok="handleOk"
   >
     <template #centerFooter>
       <a-button
-        @click="handleStartUpload"
         color="success"
         :disabled="!getIsSelectFile"
         :loading="isUploadingRef"
+        @click="handleStartUpload"
       >
         {{ getUploadBtnText }}
       </a-button>
     </template>
 
     <div class="upload-modal-toolbar">
-      <Alert :message="getHelpText" type="info" banner class="upload-modal-toolbar__text" />
+      <Alert :message="getHelpText"
+             type="info"
+             banner
+             class="upload-modal-toolbar__text"
+      />
 
       <Upload
         :accept="getStringAccept"
@@ -38,7 +42,7 @@
         </a-button>
       </Upload>
     </div>
-    <FileList :dataSource="fileListRef" :columns="columns" :actionColumn="actionColumn" />
+    <FileList :dataSource="fileListRef" :columns="columns" :actionColumn="actionColumn"/>
   </BasicModal>
 </template>
 <script lang="ts">

kicc-ui/src/components/Upload/src/UploadPreviewModal.vue

@@ -4,10 +4,10 @@
     :title="t('component.upload.preview')"
     wrapClassName="upload-preview-modal"
     v-bind="$attrs"
-    @register="register"
     :showOkBtn="false"
+    @register="register"
   >
-    <FileList :dataSource="fileListRef" :columns="columns" :actionColumn="actionColumn" />
+    <FileList :dataSource="fileListRef" :columns="columns" :actionColumn="actionColumn"/>
   </BasicModal>
 </template>
 <script lang="ts">