From 08cce3334a2dc81d690b518136b0aaea64e48b0b Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期三, 14 六月 2023 09:55:50 +0800
Subject: [PATCH] 2023-06-14

---
 src/mob/colorsketch/index.jsx |   66 +++++++++++++++++++++++++++++---
 1 files changed, 59 insertions(+), 7 deletions(-)

diff --git a/src/mob/colorsketch/index.jsx b/src/mob/colorsketch/index.jsx
index 6f1ba7a..63abecf 100644
--- a/src/mob/colorsketch/index.jsx
+++ b/src/mob/colorsketch/index.jsx
@@ -9,8 +9,9 @@
 const presetColors = [
   '#1890ff', '#f5222d', '#fa541c', '#fa8c16', '#faad14', '#fadb14', '#a0d911', '#52c41a', '#13c2c2', '#2f54eb', '#722ed1',
   '#eb2f96', '#aeb303', '#c32539', '#1d3661', '#ffd591', '#ffe58f', '#fffb8f', '#eaff8f', '#b7eb8f', '#87e8de', '#91d5ff',
-  '#adc6ff', '#d3adf7', '#EBE9E9', '#d9d9d9', '#434343', '#000000', '#ffffff', 'transparent'
+  '#adc6ff', '#EBE9E9', '#d9d9d9', 'rgba(0, 0, 0, 0.65)', 'rgba(0, 0, 0, 0.85)', '#000000', '#ffffff', 'transparent'
 ]
+const _href = window.location.href.split('#')[0]
 
 class ColorSketch extends Component {
   static propTpyes = {
@@ -20,6 +21,7 @@
   }
   state = {
     color: '',
+    initVal: '',
     colors: [],
     allowClear: false
   }
@@ -38,6 +40,21 @@
 
     let _colors = sessionStorage.getItem('app_colors')
     let colors = JSON.parse(JSON.stringify(presetColors))
+    let normal_colors = localStorage.getItem(_href + 'normal_colors')
+
+    if (normal_colors) {
+      try {
+        normal_colors = JSON.parse(normal_colors)
+      } catch (e) {
+        normal_colors = []
+      }
+      
+      normal_colors.forEach(item => {
+        colors.push({color: item, title: '甯哥敤鑹诧細' + item})
+      })
+    } else {
+      normal_colors = []
+    }
 
     if (_colors) {
       try {
@@ -47,13 +64,19 @@
       }
       
       _colors.forEach(item => {
-        if (!colors.includes(item.linkurl)) {
-          colors.push(item.linkurl)
-        }
+        if (normal_colors.includes(item.linkurl)) return
+        
+        colors.push({color: item.linkurl, title: '绯荤粺鑹诧細' + item.linkurl})
       })
     }
 
-    this.setState({color: initVal, allowClear: allowClear === true, colors})
+    if (colors.length < 40) {
+      for (let i = colors.length; i < 40; i++) {
+        colors.push({color: 'transparent', title: '' + i})
+      }
+    }
+
+    this.setState({color: initVal, initVal, allowClear: allowClear === true, colors})
   }
 
   handleChange = (color) => {
@@ -77,18 +100,47 @@
     }
   }
 
+  onVisibleChange = (status) => {
+    const { initVal, color } = this.state
+    
+    if (!status && color && color !== initVal && color !== 'rgba(0, 0, 0, 0)' && color !== 'transparent' && !/rgba\(\d+,\s*\d+,\s*\d+,\s*0\)/.test(color)) {
+      let normal_colors = localStorage.getItem(_href + 'normal_colors')
+
+      if (normal_colors) {
+        try {
+          normal_colors = JSON.parse(normal_colors)
+        } catch (e) {
+          normal_colors = []
+        }
+      } else {
+        normal_colors = []
+      }
+
+      normal_colors.unshift(color)
+      normal_colors = Array.from(new Set(normal_colors))
+
+      if (normal_colors.length > 10) {
+        normal_colors.length = 10
+      }
+
+      localStorage.setItem(_href + 'normal_colors', JSON.stringify(normal_colors))
+    }
+  }
+
+  
+
   render() {
     const { color, allowClear, colors } = this.state
     return (
       <div className="color-sketch-block">
         <Popover content={
           <SketchPicker color={ color } presetColors={colors} onChange={ this.handleChange } />
-        } overlayClassName="color-sketch-popover" placement="bottomRight" title="" trigger="click">
+        } overlayClassName="color-sketch-popover" placement="bottomRight" title="" trigger="click" onVisibleChange={this.onVisibleChange}>
           <div className="color-sketch-block-box">
             <div className="color-sketch-block-inner" style={ {background: color} }></div>
           </div>
         </Popover>
-        <div className="color-sketch-value">{color}{allowClear && color ? <CloseCircleFilled onClick={this.clear}/> : null}</div>
+        <div className="color-sketch-value">{color || <span style={{color: '#ff4d4f'}}>鏃�</span>}{allowClear && color ? <CloseCircleFilled onClick={this.clear}/> : null}</div>
       </div>
     )
   }

--
Gitblit v1.8.0