github/PPTist
1
0
Fork 0
mirror of https://github.com/pipipi-pikachu/PPTist.git synced 2025-04-15 02:20:00 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix: 取色器 Hue 初始化异常，应用预置颜色 Hue 不更新

Browse Source
This commit is contained in:
pipipi-pikachu 2021-05-27 22:54:03 +08:00
parent 7a0e01d40a
commit 243e605f10
3 changed files with 13 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/ColorPicker/Hue.vue
View File

@ -37,7 +37,7 @@ export default defineComponent({
const color = computed(() => { const color = computed(() => {
const hsla = tinycolor(props.value).toHsl() const hsla = tinycolor(props.value).toHsl()
if (props.hue) hsla.h = props.hue if (props.hue !== -1) hsla.h = props.hue
return hsla return hsla
}) })
@ -70,7 +70,7 @@ export default defineComponent({
percent = left * 100 / containerWidth percent = left * 100 / containerWidth
h = 360 * percent / 100 h = 360 * percent / 100
} }
if (color.value.h !== h) { if (props.hue === -1 || color.value.h !== h) {
emit('colorChange', { emit('colorChange', {
h, h,
l: color.value.l, l: color.value.l,

2
src/components/ColorPicker/Saturation.vue
View File

@ -39,7 +39,7 @@ export default defineComponent({
setup(props, { emit }) { setup(props, { emit }) {
const color = computed(() => { const color = computed(() => {
const hsva = tinycolor(props.value).toHsv() const hsva = tinycolor(props.value).toHsv()
if (props.hue) hsva.h = props.hue if (props.hue !== -1) hsva.h = props.hue
return hsva return hsva
}) })

14
src/components/ColorPicker/index.vue
View File

@ -140,7 +140,7 @@ export default defineComponent({
}, },
}, },
setup(props, { emit }) { setup(props, { emit }) {
const hue = ref(0) const hue = ref(-1)
const recentColors = ref<string[]>([]) const recentColors = ref<string[]>([])
const color = computed({ const color = computed({
@ -162,6 +162,7 @@ export default defineComponent({
}) })
const selectPresetColor = (colorString: string) => { const selectPresetColor = (colorString: string) => {
hue.value = tinycolor(colorString).toHsl().h
emit('update:modelValue', colorString) emit('update:modelValue', colorString)
} }
@ -189,9 +190,14 @@ export default defineComponent({
}) })
const changeColor = (value: ColorFormats.RGBA | ColorFormats.HSLA | ColorFormats.HSVA) => { const changeColor = (value: ColorFormats.RGBA | ColorFormats.HSLA | ColorFormats.HSVA) => {
if ('h' in value && 'l' in value) hue.value = value.h if ('h' in value) {
if ('h' in value) color.value = tinycolor(value).toRgb() hue.value = value.h
else color.value = value color.value = tinycolor(value).toRgb()
}
else {
hue.value = tinycolor(value).toHsl().h
color.value = value
}
updateRecentColorsCache() updateRecentColorsCache()
} }