From f2e82acd4a280ec3232f7d5f07321465d24dd1db Mon Sep 17 00:00:00 2001
From: Yuri Kuznetsov <yurikuzn@users.noreply.github.com>
Date: Fri, 22 Jul 2022 14:33:38 +0300
Subject: [PATCH] enum options style

---
 client/res/templates/fields/enum/edit.tpl |  9 ++++++++-
 client/src/view-helper.js                 | 20 +++++++++++++-------
 2 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/client/res/templates/fields/enum/edit.tpl b/client/res/templates/fields/enum/edit.tpl
index 2852ca9727..091fc201f2 100644
--- a/client/res/templates/fields/enum/edit.tpl
+++ b/client/res/templates/fields/enum/edit.tpl
@@ -1,3 +1,10 @@
 <select data-name="{{name}}" class="form-control main-element">
-    {{options params.options value scope=scope field=name translatedOptions=translatedOptions includeMissingOption=true}}
+    {{options
+        params.options value
+        scope=scope
+        field=name
+        translatedOptions=translatedOptions
+        includeMissingOption=true
+        styleMap=params.style
+    }}
 </select>
diff --git a/client/src/view-helper.js b/client/src/view-helper.js
index f367beea3e..e9abb73c82 100644
--- a/client/src/view-helper.js
+++ b/client/src/view-helper.js
@@ -420,9 +420,9 @@ function (marked, DOMPurify, /** typeof Handlebars */Handlebars) {
                 let scope = options.hash.scope || false;
                 let category = options.hash.category || false;
                 let field = options.hash.field || false;
+                let styleMap = options.hash.styleMap || {};
 
                 if (!multiple && options.hash.includeMissingOption && (value || value === '')) {
-
                     if (!~list.indexOf(value)) {
                         list = Espo.Utils.clone(list);
 
@@ -456,14 +456,20 @@ function (marked, DOMPurify, /** typeof Handlebars */Handlebars) {
                 };
 
                 for (let key in list) {
-                    let keyVal = list[key];
-                    let label = translate(list[key]);
+                    let value = list[key];
+                    let label = translate(value);
 
-                    keyVal = this.escapeString(keyVal);
-                    label = this.escapeString(label);
+                    let $option =
+                        $('<option>')
+                            .attr('value', value)
+                            .addClass(styleMap[value] ? 'text-' + styleMap[value]: '')
+                            .text(label);
 
-                    html += "<option value=\"" + keyVal + "\" " +
-                        (checkOption(list[key]) ? 'selected' : '') + ">" + label + "</option>"
+                    if (checkOption(list[key])) {
+                        $option.attr('selected', 'selected')
+                    }
+
+                    html += $option.get(0).outerHTML;
                 }
 
                 return new Handlebars.SafeString(html);