opentiny · hexqi · Jan 7, 2025 · Dec 3, 2024 · Dec 3, 2024 · Dec 3, 2024
diff --git a/packages/common/component/BlockDeployDialog.vue b/packages/common/component/BlockDeployDialog.vue
@@ -14,6 +14,7 @@
       label-align
       :model="formState"
       :rules="formRules"
+      validate-type="text"
     >
       <tiny-form-item label="版本号" prop="version">
         <tiny-input v-model="formState.version" placeholder="请输入X.Y.Z格式版本号，如1.0.0"></tiny-input>

diff --git a/packages/common/component/I18nInput.vue b/packages/common/component/I18nInput.vue
@@ -26,7 +26,7 @@
           </div>
 
           <template #reference>
-            <icon-language :class="['icon-language', { isBind }]"></icon-language>
+            <svg-icon name="internationalization" :class="['icon-language', { isBind }]"></svg-icon>
           </template>
         </tiny-popover>
       </template>
@@ -38,7 +38,7 @@
 import { computed, ref, watchEffect } from 'vue'
 import { useTranslate } from '@opentiny/tiny-engine-meta-register'
 import { Input, Popover } from '@opentiny/vue'
-import { IconClose, IconLanguage } from '@opentiny/vue-icon'
+import { IconClose } from '@opentiny/vue-icon'
 import BindI18n from './BindI18n.vue'
 
 export default {
@@ -47,8 +47,7 @@ export default {
     TinyInput: Input,
     BindI18n,
     TinyPopover: Popover,
-    IconClose: IconClose(),
-    IconLanguage: IconLanguage()
+    IconClose: IconClose()
   },
   inheritAttrs: false,
   props: {
@@ -139,6 +138,9 @@ export default {
     right: 0;
   }
 }
+.icon-language {
+  color: var(--te-common-icon-secondary);
+}
 </style>
 
 <style>

diff --git a/packages/common/component/LifeCycles.vue b/packages/common/component/LifeCycles.vue
@@ -21,13 +21,13 @@
   <div class="life-cycle-tips">{{ lifeCycleTips }}</div>
   <meta-list-items :optionsList="Object.keys(state.bindLifeCycles)" :draggable="false">
     <template #content="{ data }">
-      <div>
+      <div class="life-cycle-content-item">
         {{ data }}
       </div>
     </template>
     <template #operate="{ data }">
-      <svg-button name="setting-outline" tips="编辑" placement="top" @click="openLifeCyclesPanel(data)"></svg-button>
-      <svg-button name="delete" tips="删除" placement="top" @click="deleteLifeCycle(data)"></svg-button>
+      <svg-button class="opt-button" name="text-source-setting" @click="openLifeCyclesPanel(data)"></svg-button>
+      <svg-button class="opt-button" name="delete" @click="deleteLifeCycle(data)"></svg-button>
     </template>
   </meta-list-items>
   <tiny-dialog-box v-model:visible="state.showLifeCyclesDialog" fullscreen :title="state.title" :append-to-body="true">
@@ -269,12 +269,25 @@ export default {
   margin-left: 20px;
   margin-right: 20px;
 }
+.life-cycle-content-item {
+  color: var(--te-common-text-primary);
+}
+.opt-button {
+  color: var(--te-common-icon-secondary);
+  width: auto;
+  &:hover {
+    background-color: transparent;
+    color: var(--te-common-icon-secondary);
+  }
+  &:last-child {
+    margin-right: var(--te-base-space-3x);
+  }
+}
 
 .popover-list {
-  margin: 8px 0;
   li {
     padding: 0 12px;
-    margin: 0 -8px;
+    margin: 0 -16px;
     line-height: 24px;
     cursor: pointer;
     &:hover {

diff --git a/packages/common/component/PluginSetting.vue b/packages/common/component/PluginSetting.vue
@@ -9,15 +9,14 @@
       </slot>
       <div class="button-group-wrap">
         <slot name="header">
-          <div v-if="showIfFullScreen" class="cursor" @click="fullScreen">
-            <icon-fullscreen v-if="!state.isFullScreen" class="icon-fullscreen"></icon-fullscreen>
-            <icon-minscreen v-if="state.isFullScreen" class="icon-minscreen"></icon-minscreen>
-            <span class="full-screen-label">{{ getFullScreenLabel(state.isFullScreen) }}</span>
-          </div>
           <tiny-button v-if="!isIconButton" type="info" @click="$emit('save')" class="plugin-save">保存</tiny-button>
           <tiny-button v-if="isIconButton" :icon="icon" type="info" @click="$emit('add')">
             {{ iconButtonText }}
           </tiny-button>
+          <div v-if="showIfFullScreen" class="cursor" @click="fullScreen">
+            <svg-icon v-if="!state.isFullScreen" name="full-screen"></svg-icon>
+            <svg-icon v-if="state.isFullScreen" name="cancel-full-screen"></svg-icon>
+          </div>
           <icon-close class="icon-close close" @click="$emit('cancel')"></icon-close>
         </slot>
       </div>
@@ -32,7 +31,7 @@
 <script>
 import { reactive, watchEffect } from 'vue'
 import { Button } from '@opentiny/vue'
-import { iconPlus, iconFullscreen, iconMinscreen, iconClose } from '@opentiny/vue-icon'
+import { iconPlus, iconClose } from '@opentiny/vue-icon'
 
 const EVENTS = {
   FULL_SCREEN_CHANGE: 'fullScreenChange',
@@ -45,8 +44,6 @@ const EVENTS = {
 export default {
   components: {
     TinyButton: Button,
-    IconFullscreen: iconFullscreen(),
-    IconMinscreen: iconMinscreen(),
     IconClose: iconClose()
   },
   props: {
@@ -114,8 +111,6 @@ export default {
       state,
       fullScreen,
       getFullScreenLabel,
-      IconFullscreen: iconFullscreen(),
-      IconMinscreen: iconMinscreen(),
       IconClose: iconClose()
     }
   }
@@ -125,7 +120,7 @@ export default {
 <style lang="less" scoped>
 .plugin-setting {
   position: absolute;
-  left: calc(var(--base-left-panel-width) - 6px);
+  left: var(--base-left-panel-width);
   top: 0;
   width: var(--base-collection-panel-width);
   height: 100%;
@@ -136,6 +131,7 @@ export default {
   &:not(.second-panel) {
     box-shadow: 6px 0px 3px 0px rgba(0, 0, 0, 0.05);
     border-right: none;
+    border-left: none;
   }
   &.full-screen {
     width: var(--base-collection-panel-full-screen-width);
@@ -154,11 +150,12 @@ export default {
   }
 
   .cursor {
+    margin-left: 12px;
     cursor: pointer;
   }
 
   .close {
-    margin-left: 16px;
+    margin-left: 12px;
     cursor: pointer;
   }
 

diff --git a/packages/common/component/toolbar-built-in/ToolbarBaseButton.vue b/packages/common/component/toolbar-built-in/ToolbarBaseButton.vue
@@ -52,6 +52,8 @@ export default {
 
 .svg-wrap {
   position: relative;
+  display: flex;
+  align-items: center;
   .dots {
     width: 6px;
     height: 6px;
@@ -63,9 +65,8 @@ export default {
     right: -2px;
     z-index: 100;
   }
-}
-
-.save-title {
-  margin: 0 6px;
+  .svg-icon.svg-icon.svg-icon {
+    color: var(--te-common-icon-primary);
+  }
 }
 </style>
diff --git a/packages/layout/src/ToolbarCollapse.vue b/packages/layout/src/ToolbarCollapse.vue
@@ -1,5 +1,5 @@
 <template>
-  <tiny-popover :visible-arrow="false" width="140" trigger="hover">
+  <tiny-popover :visible-arrow="false" width="140" trigger="click" :open-delay="500">
     <template #reference>
       <span class="toolbar-ellipsis">
         <svg-icon name="ellipsis"></svg-icon>
@@ -60,13 +60,14 @@ export default {
 }
 
 .collapse-content {
-  margin: 8px 4px;
   .empty-bar {
     font-size: 12px;
 
     .toolbar-list-button {
       height: 24px;
       line-height: 24px;
+      margin: 0 -16px;
+      padding: 0 16px;
 
       &:hover {
         background-color: var(--ti-lowcode-toolbar-ellipsis-hover-bg);
@@ -81,13 +82,12 @@ export default {
 
     .icon-hides {
       margin-right: 8px;
-      color: var(--te-common-icon-secondary);
+      color: var(--te-common-icon-primary);
     }
   }
 }
 
 .collapse-content .empty-bar:last-child {
-  margin-bottom: 4px;
   .empty-line {
     display: none;
   }

diff --git a/packages/plugins/block/src/BlockEventList.vue b/packages/plugins/block/src/BlockEventList.vue
@@ -9,8 +9,8 @@
       </div>
     </template>
     <template #operate="{ data }">
-      <svg-button name="to-edit" tips="编辑" placement="top" @click="setEdit(data)"></svg-button>
-      <svg-button name="delete" tips="删除" placement="top" @click="delBlockEvent(data.name)"></svg-button>
+      <svg-button class="opt-button" name="to-edit" @click="setEdit(data)"></svg-button>
+      <svg-button class="opt-button" name="delete" @click="delBlockEvent(data.name)"></svg-button>
     </template>
   </meta-list-items>
 </template>
@@ -68,6 +68,7 @@ export default {
 
 .item-text {
   flex: 1;
+  color: var(--te-common-text-primary);
 }
 .item-text.active {
   font-weight: 700;
@@ -86,4 +87,15 @@ export default {
     stroke: var(--te-common-text-weaken);
   }
 }
+.opt-button {
+  color: var(--te-common-icon-secondary);
+  width: auto;
+  &:hover {
+    background-color: transparent;
+    color: var(--te-common-icon-secondary);
+  }
+  &:last-child {
+    margin-right: var(--te-base-space-3x);
+  }
+}
 </style>
diff --git a/packages/plugins/block/src/Main.vue b/packages/plugins/block/src/Main.vue
@@ -37,7 +37,12 @@
             <div class="block-item">
               <span>{{ item.name }}</span>
               <div class="item-btns">
-                <svg-button class="item-icon" name="to-edit" title="编辑" @click.stop="editCategory(item)"></svg-button>
+                <svg-button
+                  class="item-icon"
+                  name="to-edit"
+                  :hoverBgColor="false"
+                  @click.stop="editCategory(item)"
+                ></svg-button>
                 <tiny-popover
                   :modelValue="state.currentDeleteGroupId === item.id"
                   placement="right"
@@ -64,7 +69,7 @@
                       v-if="!item.blocks.length"
                       class="item-icon"
                       name="delete"
-                      title="删除"
+                      :hoverBgColor="false"
                       @click.stop="handleShowDeleteModal(item.id)"
                     ></svg-button>
                   </template>
@@ -487,9 +492,9 @@ export default {
   bottom: 0;
   left: -6px;
   right: 0;
-  padding: 10px 16px;
+  padding: 8px 16px;
   background-color: var(--ti-lowcode-component-search-bg);
-  box-shadow: 0 -2px 12px 0 var(--te-base-box-shadow-rgba-2);
+  border-top: 1px solid var(--te-common-border-divider);
   color: var(--ti-lowcode-component-block-list-item-color);
   display: flex;
   justify-content: space-between;

diff --git a/packages/plugins/datasource/src/DataSourceFieldCheckRanger.vue b/packages/plugins/datasource/src/DataSourceFieldCheckRanger.vue
@@ -1,43 +1,35 @@
 <!--录入数据的字符范围-->
 <template>
   <div class="collection-field-num">
-    <tiny-row gutter="0">
-      <tiny-col :span="6">
-        <div class="collection-field-item">
-          <tiny-form-item
-            prop="format.min"
-            :label="type === 'string' ? '最少输入字符数（包含空格）' : '最小值'"
-            label-width="300px"
-          >
-            <tiny-numeric v-model="formData.format.min" controls-position="right"></tiny-numeric>
-          </tiny-form-item>
-        </div>
-      </tiny-col>
-      <tiny-col :span="6">
-        <div class="collection-field-item">
-          <tiny-form-item
-            prop="format.max"
-            :label="type === 'string' ? '最多输入字符数（包含空格）' : '最大值'"
-            label-width="300px"
-          >
-            <tiny-numeric v-model="formData.format.max" controls-position="right"></tiny-numeric>
-          </tiny-form-item>
-        </div>
-      </tiny-col>
-    </tiny-row>
+    <div class="collection-field-item">
+      <tiny-form-item
+        prop="format.min"
+        :label="type === 'string' ? '最少输入字符数（包含空格）' : '最小值'"
+        label-width="300px"
+      >
+        <tiny-numeric v-model="formData.format.min" controls-position="right"></tiny-numeric>
+      </tiny-form-item>
+    </div>
+    <div class="collection-field-item">
+      <tiny-form-item
+        prop="format.max"
+        :label="type === 'string' ? '最多输入字符数（包含空格）' : '最大值'"
+        label-width="300px"
+      >
+        <tiny-numeric v-model="formData.format.max" controls-position="right"></tiny-numeric>
+      </tiny-form-item>
+    </div>
   </div>
 </template>
 
 <script>
 import { inject } from 'vue'
-import { Numeric, FormItem, Row, Col } from '@opentiny/vue'
+import { Numeric, FormItem } from '@opentiny/vue'
 import { formDataInjectionSymbols } from './DataSourceFieldForm.vue'
 export default {
   components: {
     TinyNumeric: Numeric,
-    TinyFormItem: FormItem,
-    TinyRow: Row,
-    TinyCol: Col
+    TinyFormItem: FormItem
   },
   props: {
     type: {
@@ -57,6 +49,7 @@ export default {
 
 <style lang="less" scoped>
 .collection-field-item {
+  width: 50%;
   .field-item-tip {
     padding-left: 5px;
     color: var(--ti-lowcode-datasource-description-error-color);
@@ -72,6 +65,7 @@ export default {
   color: var(--ti-lowcode-datasource-dialog-font-color);
 }
 .collection-field-num {
+  display: flex;
   align-items: center;
   justify-content: space-between;
 }

diff --git a/packages/plugins/datasource/src/DataSourceFieldForm.vue b/packages/plugins/datasource/src/DataSourceFieldForm.vue
@@ -209,7 +209,7 @@ export default {
     .field-cell-name {
       margin-left: 5px;
       font-weight: bold;
-      font-size: 15px;
+      font-size: var(--te-base-font-size-base);
       .description {
         color: var(--ti-lowcode-datasource-input-icon-color);
         margin-left: 5px;