web_decimal_style/README.md

53 lines
2.6 KiB
Markdown

# Web Decimal Style
This module enhances the display of decimal numbers in Odoo by styling the decimal part differently from the integer part.
## Features
- **Visual Enhancement**: Decimal parts are styled to be smaller (80% font size) and slightly transparent (0.7 opacity), making large numbers easier to read.
- **Universal Application**: Works across **all** views (List, Form, Kanban, Pivot, etc.) and all fields (Float, Monetary, Quantity).
- **Non-Invasive Architecture**: Uses a safe DOM Observer approach instead of patching Odoo's internal JS formatters. This ensures maximum compatibility with other modules and Odoo updates.
- **Localization Aware**: Correctly handles decimal separators (dot or comma) based on the user's language settings.
## Technical Details
### Architecture
The module has been refactored to use a **MutationObserver** approach:
1. **Global Observer**: A `MutationObserver` watches the document body for changes.
2. **Safe Text Scanning**: It scans text nodes using a `TreeWalker` to find numbers.
3. **Regex Matching**: It uses a strict Regular Expression to identify decimal parts.
- It dynamically builds the regex using Odoo's `localization.decimalPoint` setting.
- Example (English): Matches `123.45` (.45 is styled).
- Example (Indonesian): Matches `123,45` (,45 is styled).
- **Smart Exclusion**: It intelligently ignores thousands separators (e.g., `1,200` is **not** matched in English/US locale).
4. **DOM Wrapping**: Matches are wrapped in a `<span class="o_decimal">` element for styling.
### Advantages
- **No Conflicts**: Does not override `formatFloat` or `formatMonetary` functions, avoiding conflicts with other modules that modify formatting.
- **Robust**: Works even on custom widgets or non-standard views, as long as the number is rendered as text.
## Usage
The module automatically applies decimal styling to all numeric fields. No configuration is required.
## Debugging
### Console
You can verify the module is running by checking the browser console:
- Look for: `"Web Decimal Style: Loading DOM Decorator observer..."`
### Troubleshooting
If styling is not applied:
1. **Check Localization**: Ensure your user's language setting has the correct "Decimal Separator" configured.
2. **Browser Cache**: Clear your browser cache or force refresh (Ctrl+Shift+R) to ensure the new JS is loaded.
3. **Inspect Element**: Right-click a number. You should see the decimal part wrapped in:
```html
<span class="o_decimal">.00</span>
```
## Installation
1. Install the module.
2. Restart Odoo.
3. Upgrade the module `web_decimal_style`.
4. Refresh your browser.