add more comments

lib/ui/grid/column.js

@@ -9,7 +9,11 @@ import { createDateInput, formatDate, setDateValue, getDateValue } from "../date
 
 /**
  * 列定义基类
+ * 
+ * _函数调用流程图示_<br/>
+ * <img src="./assets/column-refresh.jpg" alt="Column Refresh"/>
  * @class
+ * @static
  */
 export class GridColumn {
     /**
@@ -26,6 +30,8 @@ export class GridColumn {
     /**
      * 创建显示单元格时调用的方法
      * @param {GridColumnDefinition} col - 列定义对象
+     * @param {number} index - 行元素索引（需要配合 [startIndex]{@linkcode Grid#startIndex} 相加得到真实数据索引）
+     * @param {Grid} grid - Grid 实例
      * @returns {HTMLElement} 返回创建的单元格元素
      * @virtual
      */
@@ -93,6 +99,16 @@ export class GridColumn {
         element.style.cssText = convertCssStyle(style);
     }
 
+    /**
+     * 设置单元格类名时调用的方法
+     * @param {HTMLElement} element - 单元格元素
+     * @param {string} name - 要设置的类名
+     * @virtual
+     */
+    static setClass(element, name) {
+        element.className = name ?? '';
+    }
+
     /**
      * 设置单元格可用性时调用的方法
      * @param {HTMLElement} element - 单元格元素
@@ -297,6 +313,14 @@ export class GridDropdownColumn extends GridColumn {
         return e[col.dropOptions?.valueKey ?? 'value'];
     }
 
+    static setClass(element, name) {
+        if (element.tagName === 'DIV') {
+            element.className = `ui-drop-wrapper ${name ?? ''}`;
+        } else {
+            super.setClass(element, name);
+        }
+    }
+
     static setEnabled(element, enabled) {
         super.setEnabled(element, enabled);
         const drop = this._getDrop(element);
@@ -336,6 +360,14 @@ export class GridCheckboxColumn extends GridColumn {
 
     static getValue(e) { return e.target.checked }
 
+    static setClass(element, name) {
+        if (element.tagName === 'LABEL') {
+            element.className = `ui-check-wrapper ${name ?? ''}`;
+        } else {
+            super.setClass(element, name);
+        }
+    }
+
     static setEnabled(element, enabled) {
         super.setEnabled(element, enabled);
         element.querySelector('input').disabled = enabled === false;
@@ -346,15 +378,15 @@ export class GridIconColumn extends GridColumn {
     static create() { return createElement('span', 'col-icon') }
 
     static setValue(element, val, item, col) {
-        let className = col.iconClassName;
-        if (typeof className === 'function') {
-            className = className.call(col, item.values);
-        }
-        if (className == null) {
-            element.className = 'col-icon';
-        } else {
-            element.className = `col-icon ${className}`;
-        }
+        // let className = col.iconClassName;
+        // if (typeof className === 'function') {
+        //     className = className.call(col, item.values);
+        // }
+        // if (className == null) {
+        //     element.className = 'col-icon';
+        // } else {
+        //     element.className = `col-icon ${className}`;
+        // }
         let type = col.iconType;
         if (typeof type === 'function') {
             type = type.call(col, item.values);
@@ -370,6 +402,10 @@ export class GridIconColumn extends GridColumn {
         }
     }
 
+    static setClass(element, name) {
+        element.className = `col-icon ${name ?? ''}`;
+    }
+
     static setEnabled(element, enabled) {
         super.setEnabled(element, enabled);
         if (enabled === false) {
@@ -405,6 +441,14 @@ export class GridDateColumn extends GridColumn {
         return getDateValue(e.target, col.dateValueFormatter);
     }
 
+    static setClass(element, name) {
+        if (element.tagName === 'INPUT') {
+            element.className = `ui-date-cell ${name ?? ''}`;
+        } else {
+            super.setClass(element, name);
+        }
+    }
+
     static setEnabled(element, enabled) {
         element.disabled = enabled === false;
     }