From 31695268fe5caa9f9881ae3452f01047910d8d07 Mon Sep 17 00:00:00 2001
From: wangjiahao <1522128093@qq.com>
Date: Thu, 20 Jun 2024 13:27:05 +0800
Subject: [PATCH] =?UTF-8?q?fix(=E4=BB=AA=E8=A1=A8=E6=9D=BF=E3=80=81?=
 =?UTF-8?q?=E6=95=B0=E6=8D=AE=E5=A4=A7=E5=B1=8F):=20=E5=AF=8C=E6=96=87?=
 =?UTF-8?q?=E6=9C=AC=E6=94=AF=E6=8C=81=E9=98=88=E5=80=BC=E8=AE=BE=E7=BD=AE?=
 =?UTF-8?q?=20#9371=20#9627?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../rich-text/DeRichTextView.vue              | 52 ++++++++++++++++---
 .../js/panel/charts/others/rich-text.ts       |  5 +-
 .../js/panel/common/common_table.ts           |  2 +-
 3 files changed, 50 insertions(+), 9 deletions(-)

diff --git a/core/core-frontend/src/custom-component/rich-text/DeRichTextView.vue b/core/core-frontend/src/custom-component/rich-text/DeRichTextView.vue
index 6c418c4c40..daca1536e7 100644
--- a/core/core-frontend/src/custom-component/rich-text/DeRichTextView.vue
+++ b/core/core-frontend/src/custom-component/rich-text/DeRichTextView.vue
@@ -59,6 +59,8 @@ import { dvMainStoreWithOut } from '@/store/modules/data-visualization/dvMain'
 import ChartError from '@/views/chart/components/views/components/ChartError.vue'
 import { useEmitt } from '@/hooks/web/useEmitt'
 import { valueFormatter } from '@/views/chart/components/js/formatter'
+import { parseJson } from '@/views/chart/components/js/util'
+import { mappingColor } from '@/views/chart/components/js/panel/common/common_table'
 const snapshotStore = snapshotStoreWithOut()
 const errMsg = ref('')
 const dvMainStore = dvMainStoreWithOut()
@@ -103,6 +105,7 @@ const { element, editMode, active, disabled, showPosition } = toRefs(props)
 
 const state = reactive({
   data: null,
+  viewDataInfo: null,
   totalItems: 0
 })
 const dataRowSelect = ref({})
@@ -216,16 +219,18 @@ const initCurFieldsChange = () => {
 const assignment = content => {
   const on = content.match(/\[(.+?)\]/g)
   if (on) {
+    const thresholdStyleInfo = conditionAdaptor(state.viewDataInfo)
     on.forEach(itm => {
       if (dataRowFiledName.value.includes(itm)) {
         const ele = itm.slice(1, -1)
         if (initReady.value) {
-          content = content.replace(
-            itm,
-            dataRowNameSelect.value[ele] !== undefined
-              ? dataRowNameSelect.value[ele]
-              : '[未获取字段值]'
-          )
+          const thresholdStyle = thresholdStyleInfo[ele]
+          let value =
+            dataRowNameSelect.value[ele] !== undefined ? dataRowNameSelect.value[ele] : null
+          if (value && thresholdStyle) {
+            value = `<span style="color:${thresholdStyle.color};background-color: ${thresholdStyle.backgroundColor}">${value}</span>`
+          }
+          content = content.replace(itm, !!value ? value : '[未获取字段值]')
         } else {
           content = content.replace(
             itm,
@@ -359,6 +364,7 @@ const calcData = (view: Chart, callback) => {
           errMsg.value = res.msg
         } else {
           state.data = res?.data
+          state.viewDataInfo = res
           state.totalItems = res?.totalItems
           const curViewInfo = canvasViewInfo.value[element.value.id]
           curViewInfo['curFields'] = res.data.fields
@@ -449,6 +455,40 @@ const renderChart = () => {
   initCurFieldsChange()
 }
 
+const conditionAdaptor = (chart: Chart) => {
+  if (!chart) {
+    return
+  }
+  const { threshold } = parseJson(chart.senior)
+  if (!threshold.enable) {
+    return
+  }
+  const res = {}
+  const conditions = threshold.tableThreshold ?? []
+  if (conditions?.length > 0) {
+    for (let i = 0; i < conditions.length; i++) {
+      const field = conditions[i]
+      let defaultValueColor = 'none'
+      let defaultBgColor = 'none'
+      res[field.field.name] = {
+        color: mappingColor(
+          dataRowNameSelect.value[field.field.name],
+          defaultValueColor,
+          field,
+          'color'
+        ),
+        backgroundColor: mappingColor(
+          dataRowNameSelect.value[field.field.name],
+          defaultBgColor,
+          field,
+          'backgroundColor'
+        )
+      }
+    }
+  }
+  return res
+}
+
 onMounted(() => {
   viewInit()
 })
diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/others/rich-text.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/others/rich-text.ts
index 60bf5e236c..3b54e11a33 100644
--- a/core/core-frontend/src/views/chart/components/js/panel/charts/others/rich-text.ts
+++ b/core/core-frontend/src/views/chart/components/js/panel/charts/others/rich-text.ts
@@ -6,9 +6,10 @@ const { t } = useI18n()
  * 富文本图表
  */
 export class RichTextChartView extends AbstractChartView {
-  properties: EditorProperty[] = ['background-overall-component']
+  properties: EditorProperty[] = ['background-overall-component', 'threshold']
   propertyInner: EditorPropertyInner = {
-    'background-overall-component': ['all']
+    'background-overall-component': ['all'],
+    threshold: ['tableThreshold']
   }
   axis: AxisType[] = ['xAxis', 'yAxis', 'filter']
   axisConfig: AxisConfig = {
diff --git a/core/core-frontend/src/views/chart/components/js/panel/common/common_table.ts b/core/core-frontend/src/views/chart/components/js/panel/common/common_table.ts
index 205e7095a5..f2abee3199 100644
--- a/core/core-frontend/src/views/chart/components/js/panel/common/common_table.ts
+++ b/core/core-frontend/src/views/chart/components/js/panel/common/common_table.ts
@@ -458,7 +458,7 @@ export function getConditions(chart: Chart) {
   return res
 }
 
-function mappingColor(value, defaultColor, field, type) {
+export function mappingColor(value, defaultColor, field, type) {
   let color
   for (let i = 0; i < field.conditions.length; i++) {
     let flag = false