mirror of https://gitee.com/xiaonuobase/snowy
增加iconSelector图标选择器在打开时定位到已经选择图标位置,光标移动到图标显示图标名称
parent
3bb09dafe4
commit
0b05df4f93
|
@ -5,7 +5,6 @@
|
|||
:mask-closable="false"
|
||||
:width="800"
|
||||
:destroy-on-close="true"
|
||||
:footer="null"
|
||||
@cancel="onCancel"
|
||||
>
|
||||
<a-tabs v-model:activeKey="activeKey" tab-position="left" size="small" @change="paneChange">
|
||||
|
@ -16,6 +15,7 @@
|
|||
iconItem.name
|
||||
}}</a-radio-button>
|
||||
</a-radio-group>
|
||||
<span style="margin-left: 10px">{{ iconInfo }}</span>
|
||||
</div>
|
||||
|
||||
<div :key="iconItemIns" v-for="iconItemIns in item.iconItem">
|
||||
|
@ -27,7 +27,9 @@
|
|||
:class="icon === modelValue ? 'active' : ''"
|
||||
@click="selectIcon(icon)"
|
||||
>
|
||||
<div :id="icon" @mouseover="iconInfo = icon">
|
||||
<component :is="icon" class="xn-icons" />
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
@ -43,6 +45,7 @@
|
|||
const modelValue = ref('')
|
||||
const activeKey = ref('default')
|
||||
const iconItemDefault = ref('default')
|
||||
const iconInfo = ref()
|
||||
|
||||
onMounted(() => {
|
||||
iconData.value.push(...config.icons)
|
||||
|
@ -52,6 +55,7 @@
|
|||
const showIconModal = (value) => {
|
||||
visible.value = true
|
||||
defaultSetting(value)
|
||||
autoSwitchTab(value)
|
||||
}
|
||||
|
||||
// 暴露子组件的方法
|
||||
|
@ -87,6 +91,19 @@
|
|||
?.iconItem.some((groupItem) => groupItem.key === iconItemDefault.value) || (iconItemDefault.value = 'default')
|
||||
}
|
||||
|
||||
function autoSwitchTab(val) {
|
||||
if (val) {
|
||||
iconData.value.some(
|
||||
(tabItem) =>
|
||||
tabItem.iconItem.some(
|
||||
(groupItem) => groupItem.item.some((icon) => icon === val) && (iconItemDefault.value = groupItem.key)
|
||||
) && (activeKey.value = tabItem.key)
|
||||
)
|
||||
nextTick(() => {
|
||||
document.getElementById(val)?.scrollIntoView({ block: 'center' })
|
||||
})
|
||||
}
|
||||
}
|
||||
// 切换icon风格
|
||||
const radioGroupChange = (e) => {
|
||||
iconItemDefault.value = e.target.value
|
||||
|
|
Loading…
Reference in New Issue