From 250c01b0add15522cf56d90629565834978b8ce8 Mon Sep 17 00:00:00 2001
From: pipipi-pikachu <pipipi_pikachu@163.com>
Date: Thu, 27 May 2021 22:01:33 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E5=8F=96=E8=89=B2=E5=99=A8=20Hue=20?=
 =?UTF-8?q?=E5=80=BC=E5=BC=82=E5=B8=B8=EF=BC=88#32=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ColorPicker/Hue.vue        | 4 ++--
 src/components/ColorPicker/Saturation.vue | 2 +-
 src/components/ColorPicker/index.vue      | 6 ++----
 3 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/src/components/ColorPicker/Hue.vue b/src/components/ColorPicker/Hue.vue
index 5f443158..7b42da01 100644
--- a/src/components/ColorPicker/Hue.vue
+++ b/src/components/ColorPicker/Hue.vue
@@ -37,7 +37,7 @@ export default defineComponent({
     
     const color = computed(() => {
       const hsla = tinycolor(props.value).toHsl()
-      if (hsla.s === 0) hsla.h = props.hue
+      hsla.h = props.hue
       return hsla
     })
 
@@ -68,7 +68,7 @@ export default defineComponent({
       else if (left > containerWidth) h = 360
       else {
         percent = left * 100 / containerWidth
-        h = (360 * percent / 100)
+        h = 360 * percent / 100
       }
       if (color.value.h !== h) {
         emit('colorChange', {
diff --git a/src/components/ColorPicker/Saturation.vue b/src/components/ColorPicker/Saturation.vue
index 8ae26e9b..82e1c979 100644
--- a/src/components/ColorPicker/Saturation.vue
+++ b/src/components/ColorPicker/Saturation.vue
@@ -39,7 +39,7 @@ export default defineComponent({
   setup(props, { emit }) {
     const color = computed(() => {
       const hsva = tinycolor(props.value).toHsv()
-      if (hsva.s === 0) hsva.h = props.hue
+      hsva.h = props.hue
       return hsva
     })
 
diff --git a/src/components/ColorPicker/index.vue b/src/components/ColorPicker/index.vue
index d37dd8b4..df1603c5 100644
--- a/src/components/ColorPicker/index.vue
+++ b/src/components/ColorPicker/index.vue
@@ -189,10 +189,8 @@ export default defineComponent({
     })
 
     const changeColor = (value: ColorFormats.RGBA | ColorFormats.HSLA | ColorFormats.HSVA) => {
-      if ('h' in value) {
-        hue.value = value.h
-        color.value = tinycolor(value).toRgb()
-      }
+      if ('h' in value && 'l' in value) hue.value = value.h
+      if ('h' in value) color.value = tinycolor(value).toRgb()
       else color.value = value
 
       updateRecentColorsCache()