refactor(web-antd): 移除vue3-colorpicker依赖并使用antdv-next的ColorPicker
替换vue3-colorpicker为antdv-next内置的ColorPicker组件,简化依赖并统一组件库
This commit is contained in:
parent
0ab5c46812
commit
2d68ff0d61
@ -53,8 +53,7 @@
|
||||
"tinymce": "7.9.1",
|
||||
"unplugin-vue-components": "^0.27.3",
|
||||
"vue": "catalog:",
|
||||
"vue-router": "catalog:",
|
||||
"vue3-colorpicker": "^2.3.0"
|
||||
"vue-router": "catalog:"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/lodash-es": "^4.17.12"
|
||||
|
||||
@ -3,15 +3,10 @@ import type { RadioChangeEvent } from 'antdv-next';
|
||||
|
||||
import { computed } from 'vue';
|
||||
|
||||
import { usePreferences } from '@vben/preferences';
|
||||
|
||||
import { RadioGroup, Select } from 'antdv-next';
|
||||
import { ColorPicker } from 'vue3-colorpicker';
|
||||
import { ColorPicker, RadioGroup, Select } from 'antdv-next';
|
||||
|
||||
import { tagSelectOptions } from '#/components/dict';
|
||||
|
||||
import 'vue3-colorpicker/style.css';
|
||||
|
||||
/**
|
||||
* 需要禁止透传
|
||||
* 不禁止会有奇怪的bug 会绑定到selectType上
|
||||
@ -50,11 +45,6 @@ function handleSelectTypeChange(e: RadioChangeEvent) {
|
||||
// 必须给默认hex颜色 不能为空字符串
|
||||
color.value = e.target.value === 'custom' ? '#1677ff' : undefined;
|
||||
}
|
||||
|
||||
const { isDark } = usePreferences();
|
||||
const theme = computed(() => {
|
||||
return isDark.value ? 'black' : 'white';
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -75,12 +65,11 @@ const theme = computed(() => {
|
||||
placeholder="请选择标签样式"
|
||||
@deselect="$emit('deselect')"
|
||||
/>
|
||||
|
||||
<ColorPicker
|
||||
v-if="selectType === 'custom'"
|
||||
disable-alpha
|
||||
format="hex"
|
||||
v-model:pure-color="color"
|
||||
:theme="theme"
|
||||
v-model:value="color"
|
||||
show-text
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user