fix: resolve warnings (#957)

chilingling · web-flow · commit 7f050293fdc6 · 2024-12-25T20:56:44.000+08:00
* fix: resolve warnings

* fix: add access guard avoid runtime errors

* fix: change placeholder prop type

* fix: resolve type check

* fix: toolbarbaseicon props default value
diff --git a/packages/common/component/MetaCodeEditor.vue b/packages/common/component/MetaCodeEditor.vue
@@ -255,7 +255,8 @@ export default {
         minimap: {
           enabled: false
         }
-      }
+      },
+      locale
     }
   }
 }
diff --git a/packages/common/component/MetaListItems.vue b/packages/common/component/MetaListItems.vue
@@ -30,31 +30,33 @@
     </vue-draggable-next>
   </template>
   <template v-else>
-    <div v-for="(item, index) in optionsList" :key="index" class="option-item not-draggable">
-      <meta-list-item
-        :item="item"
-        :index="index"
-        :itemClick="itemClick"
-        :dataScource="listItemOption"
-        @changeItem="changeItem"
-        @deleteItem="deleteItem"
-        @editItem="editItem"
-      >
-        <template #content>
-          <slot name="content" :data="item">
-            <span>{{ item[textField] || formatName(item) }}</span>
-          </slot>
-        </template>
-        <template #operate>
-          <slot name="operate" :data="item"></slot>
-        </template>
-        <template #metaForm>
-          <slot name="form" :data="item"></slot>
-        </template>
-        <template #footer>
-          <slot name="footer" :data="item"></slot>
-        </template>
-      </meta-list-item>
+    <div>
+      <div v-for="(item, index) in optionsList" :key="index" class="option-item not-draggable">
+        <meta-list-item
+          :item="item"
+          :index="index"
+          :itemClick="itemClick"
+          :dataScource="listItemOption"
+          @changeItem="changeItem"
+          @deleteItem="deleteItem"
+          @editItem="editItem"
+        >
+          <template #content>
+            <slot name="content" :data="item">
+              <span>{{ item[textField] || formatName(item) }}</span>
+            </slot>
+          </template>
+          <template #operate>
+            <slot name="operate" :data="item"></slot>
+          </template>
+          <template #metaForm>
+            <slot name="form" :data="item"></slot>
+          </template>
+          <template #footer>
+            <slot name="footer" :data="item"></slot>
+          </template>
+        </meta-list-item>
+      </div>
     </div>
   </template>
 </template>
diff --git a/packages/common/component/PluginBlockList.vue b/packages/common/component/PluginBlockList.vue
@@ -205,7 +205,7 @@ export default {
   emits: ['click', 'iconClick', 'add', 'deleteBlock', 'openVersionPanel', 'editBlock', 'checkAll', 'cancelCheckAll'],
   setup(props, { emit }) {
     const panelState = inject('panelState', {})
-    const blockUsers = inject('blockUsers')
+    const blockUsers = inject('blockUsers', [])
     const state = reactive({
       activeIndex: -1,
       data: computed(() => props.data),
diff --git a/packages/common/component/toolbar-built-in/ToolbarBaseButton.vue b/packages/common/component/toolbar-built-in/ToolbarBaseButton.vue
@@ -1,5 +1,5 @@
 <template>
-  <tiny-button v-bind="extendAttrs" class="toolbar-button">
+  <tiny-button class="toolbar-button">
     <span class="svg-wrap">
       <svg-icon v-if="icon" :name="icon"></svg-icon>
       <span v-if="options?.showDots" class="dots"></span>
@@ -9,7 +9,6 @@
   </tiny-button>
 </template>
 <script>
-import { inject } from 'vue'
 import { Button } from '@opentiny/vue'
 
 export default {
@@ -29,12 +28,6 @@ export default {
       type: Object,
       default: () => ({})
     }
-  },
-  setup() {
-    const extendAttrs = inject('extend-attributes') || {}
-    return {
-      extendAttrs
-    }
   }
 }
 </script>
diff --git a/packages/common/component/toolbar-built-in/ToolbarBaseIcon.vue b/packages/common/component/toolbar-built-in/ToolbarBaseIcon.vue
@@ -8,7 +8,7 @@
   >
     <template #reference>
       <span class="icon">
-        <span class="icon-hides" v-bind="extendAttrs">
+        <span class="icon-hides" v-bind="$attrs">
           <svg-icon :name="icon"></svg-icon>
           <span v-if="options?.showDots" class="dots"></span>
         </span>
@@ -17,7 +17,6 @@
   </tiny-popover>
 </template>
 <script>
-import { inject } from 'vue'
 import { Popover } from '@opentiny/vue'
 
 export default {
@@ -35,13 +34,7 @@ export default {
     },
     options: {
       type: Object,
-      default: () => {}
-    }
-  },
-  setup() {
-    const extendAttrs = inject('extend-attributes') || {}
-    return {
-      extendAttrs
+      default: () => ({})
     }
   }
 }
diff --git a/packages/configurator/src/tabs-group-configurator/TabsGroupConfigurator.vue b/packages/configurator/src/tabs-group-configurator/TabsGroupConfigurator.vue
@@ -78,8 +78,8 @@ const props = defineProps({
   },
   // tabItem宽度
   labelWidth: {
-    type: Number,
-    default: 63
+    type: [Number, String],
+    default: '63'
   },
   // tab的选项，如果选项中包含collapsed，则会折叠为下拉
   options: {
diff --git a/packages/layout/src/DesignSettings.vue b/packages/layout/src/DesignSettings.vue
@@ -2,7 +2,7 @@
   <div id="tiny-right-panel">
     <tiny-tabs v-model="layoutState.settings.render">
       <tiny-tab-item v-for="(setting, index) in settings" :key="index" :title="setting.title" :name="setting.name">
-        <component :is="setting.entry" :is-collapsed="isCollapsed"></component>
+        <component :is="setting.entry"></component>
         <div v-show="activating" class="active"></div>
       </tiny-tab-item>
     </tiny-tabs>
@@ -15,14 +15,15 @@
 </template>
 
 <script>
-import { computed, ref } from 'vue'
-import { Tabs, TabItem } from '@opentiny/vue'
+import { computed, provide, ref } from 'vue'
+import { Tabs, TabItem, Tooltip } from '@opentiny/vue'
 import { useLayout } from '@opentiny/tiny-engine-meta-register'
 
 export default {
   components: {
     TinyTabs: Tabs,
-    TinyTabItem: TabItem
+    TinyTabItem: TabItem,
+    TinyTooltip: Tooltip
   },
   props: {
     settings: {
@@ -37,6 +38,8 @@ export default {
     const isCollapsed = ref(false)
     const settingIcon = computed(() => (isCollapsed.value ? 'style-panel-collapsed' : 'style-panel-expand'))
 
+    provide('isCollapsed', isCollapsed)
+
     return {
       showMask,
       isCollapsed,
diff --git a/packages/plugins/i18n/src/Main.vue b/packages/plugins/i18n/src/Main.vue
@@ -114,7 +114,7 @@
           </tiny-grid-column>
           <template #empty>
             <div v-if="isLoading" id="empty-loading-box" class="i18n-loading"></div>
-            <search-empty isShow="!isLoading" />
+            <search-empty v-else />
           </template>
         </tiny-grid>
       </div>
diff --git a/packages/plugins/materials/src/meta/block/src/BlockGroup.vue b/packages/plugins/materials/src/meta/block/src/BlockGroup.vue
@@ -168,6 +168,7 @@ export default {
       default: () => []
     }
   },
+  emits: ['changeGroup'],
   setup(props) {
     const validateIcon = iconError()
     const panelState = inject('panelState', {})
diff --git a/packages/plugins/materials/src/meta/block/src/BlockList.vue b/packages/plugins/materials/src/meta/block/src/BlockList.vue
@@ -1,6 +1,5 @@
 <template>
   <plugin-block-list
-    class="block-list-wrap"
     ref="blockRef"
     :data="blockList"
     :show-add-button="state.showAddButton"
diff --git a/packages/plugins/materials/src/meta/layout/src/Main.vue b/packages/plugins/materials/src/meta/layout/src/Main.vue
@@ -2,7 +2,7 @@
   <plugin-panel :title="shortcut ? '' : title" @close="$emit('close')">
     <template #header>
       <component
-        :is="headerComponent"
+        :is="registryData?.components?.header"
         :fixedPanels="fixedPanels"
         @fix-panel="(id) => $emit('fix-panel', id)"
       ></component>
@@ -52,14 +52,11 @@ export default {
     })
     provide('panelState', panelState) // 使用provide传给子组件,后续可能会有调整，先暂定
 
-    const pluginRegistryData = ref(props.registryData)
     const rightPanelRef = ref(null)
-    const displayComponentIds = pluginRegistryData.value.options.displayComponentIds || []
-    const headerComponent = pluginRegistryData.value.components?.header
+    const displayComponentIds = props.registryData?.options?.displayComponentIds || []
     const onlyShowDefault = ref(displayComponentIds.length === 1)
     const activeTabId =
-      displayComponentIds.find((item) => item === pluginRegistryData.value.options?.defaultTabId) ||
-      displayComponentIds[0]
+      displayComponentIds.find((item) => item === props.registryData?.options?.defaultTabId) || displayComponentIds[0]
 
     const activeName = ref(activeTabId)
     const defaultComponent = getMergeMeta(activeName.value)?.entry
@@ -75,7 +72,6 @@ export default {
     const title = ref(props.registryData?.title)
 
     return {
-      headerComponent,
       title,
       activeName,
       defaultComponent,
diff --git a/packages/settings/styles/src/Main.vue b/packages/settings/styles/src/Main.vue
@@ -65,7 +65,7 @@
 </template>
 
 <script>
-import { computed, watch } from 'vue'
+import { watch, inject, ref } from 'vue'
 import { Collapse, CollapseItem, Input } from '@opentiny/vue'
 import { useHistory, useCanvas, useProperties } from '@opentiny/tiny-engine-meta-register'
 import { CodeConfigurator, VariableConfigurator } from '@opentiny/tiny-engine-configurator'
@@ -105,13 +105,8 @@ export default {
     TinyInput: Input,
     VariableConfigurator
   },
-  props: {
-    isCollapsed: {
-      type: Boolean,
-      default: false
-    }
-  },
-  setup(props) {
+  props: {},
+  setup() {
     const styleCategoryGroup = [
       'layout',
       'spacing',
@@ -122,15 +117,16 @@ export default {
       'borders',
       'effects'
     ]
-    const activeNames = computed(() => (props.isCollapsed ? [styleCategoryGroup[0]] : styleCategoryGroup))
+    const isCollapsed = inject('isCollapsed')
+    const activeNames = ref(styleCategoryGroup)
     const { getCurrentSchema } = useCanvas()
     // 获取当前节点 style 对象
     const { state, updateStyle } = useStyle() // updateStyle
     const { addHistory } = useHistory()
     const { getSchema, setProp } = useProperties()
 
     const handoverGroup = (actives) => {
-      if (props.isCollapsed) {
+      if (isCollapsed.value) {
         activeNames.value = actives.length > 1 ? actives.shift() : actives
       }
     }
@@ -200,6 +196,17 @@ export default {
       }
     )
 
+    watch(
+      () => isCollapsed.value,
+      () => {
+        if (isCollapsed.value) {
+          activeNames.value = [styleCategoryGroup[0]]
+        } else {
+          activeNames.value = styleCategoryGroup
+        }
+      }
+    )
+
     return {
       state,
       activeNames,
@@ -209,7 +216,8 @@ export default {
       save,
       close,
       updateStyle,
-      setConfig
+      setConfig,
+      isCollapsed
     }
   }
 }
diff --git a/packages/settings/styles/src/components/border/BorderGroup.vue b/packages/settings/styles/src/components/border/BorderGroup.vue
@@ -38,7 +38,7 @@
         <numeric-select
           :name="getProperty(BORDER_RADIUS_PROPERTY.BorderTopLeftRadius).name"
           :numericalText="borderRadius.BorderTopLeftRadius"
-          :placeholder="0"
+          placeholder="0"
           @update="updateStyle"
         />
       </div>
@@ -51,7 +51,7 @@
         <numeric-select
           :name="getProperty(BORDER_RADIUS_PROPERTY.BorderTopRightRadius).name"
           :numericalText="borderRadius.BorderTopRightRadius"
-          :placeholder="0"
+          placeholder="0"
           @update="updateStyle"
         />
       </div>
@@ -64,7 +64,7 @@
         <numeric-select
           :name="getProperty(BORDER_RADIUS_PROPERTY.BorderBottomLeftRadius).name"
           :numericalText="borderRadius.BorderBottomLeftRadius"
-          :placeholder="0"
+          placeholder="0"
           @update="updateStyle"
         />
       </div>
@@ -76,7 +76,7 @@
         </tiny-tooltip>
         <numeric-select
           :name="getProperty(BORDER_RADIUS_PROPERTY.BorderBottomRightRadius).name"
-          :placeholder="0"
+          placeholder="0"
           :numericalText="borderRadius.BorderBottomRightRadius"
           @update="updateStyle"
         />
diff --git a/packages/settings/styles/src/components/inputs/NumericSelect.vue b/packages/settings/styles/src/components/inputs/NumericSelect.vue
@@ -41,7 +41,7 @@ export default {
       default: false
     },
     placeholder: {
-      type: [String, Number],
+      type: String,
       default: ''
     },
     suffix: {

Original file line number	Diff line number	Diff line change
`@@ -255,7 +255,8 @@ export default {`
`255`	`255`	`minimap: {`
`256`	`256`	`enabled: false`
`257`	`257`	`}`
`258`		`- }`
	`258`	`+ },`
	`259`	`+ locale`
`259`	`260`	`}`
`260`	`261`	`}`
`261`	`262`	`}`
Original file line number	Diff line number	Diff line change
`@@ -168,6 +168,7 @@ export default {`
`168`	`168`	`default: () => []`
`169`	`169`	`}`
`170`	`170`	`},`
	`171`	`+ emits: ['changeGroup'],`
`171`	`172`	`setup(props) {`
`172`	`173`	`const validateIcon = iconError()`
`173`	`174`	`const panelState = inject('panelState', {})`