Finish

Puzzlepart · Oct 18, 2024 · 395811a · 395811a
1 parent ae3c69f
commit 395811a
Show file tree

Hide file tree

Showing 5 changed files with 17 additions and 30 deletions.
diff --git a/.github/workflows/ci-channel-test.yml b/.github/workflows/ci-channel-test.yml
@@ -4,6 +4,7 @@ on:
   push:
     branches:
       - releases/1.10
+      - feat/instrument
     paths:
       - 'SharePointFramework/**'
       - 'Install/**'

diff --git a/...olioWebParts/src/components/List/ItemColumn/InstrumentColumn/InstrumentColumn.module.scss b/...olioWebParts/src/components/List/ItemColumn/InstrumentColumn/InstrumentColumn.module.scss
@@ -2,15 +2,12 @@
   display: flex;
   flex-direction: column;
   align-items: center;
-  width: 260px;
-}
-
-.title {
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-}
+  max-width: 280px;
+  padding: 12px;
 
-.infoText {
-  margin: 20px 0;
+  .description {
+    font-size: 16px;
+    text-align: center;
+    margin: 8px;
+  }
 }
diff --git a/...ointFramework/PortfolioWebParts/src/components/List/ItemColumn/InstrumentColumn/index.tsx b/...ointFramework/PortfolioWebParts/src/components/List/ItemColumn/InstrumentColumn/index.tsx
@@ -5,14 +5,7 @@ import styles from './InstrumentColumn.module.scss'
 import { format } from '@fluentui/react'
 import { IInstrumentColumnProps } from './types'
 import { useInstrumentColumn } from './useInstrumentColumn'
-import {
-  Link,
-  Popover,
-  PopoverSurface,
-  PopoverTrigger,
-  Text,
-  Title3
-} from '@fluentui/react-components'
+import { Link, Popover, PopoverSurface, PopoverTrigger, Text } from '@fluentui/react-components'
 import GaugeComponent from 'react-gauge-component'
 
 /**
@@ -55,8 +48,8 @@ export const InstrumentColumn: ColumnRenderComponent<IInstrumentColumnProps> = (
               labels={{
                 valueLabel: {
                   style: {
-                    fill: '#000',
-                    color: '#000',
+                    fill: '#222',
+                    color: '#222',
                     textShadow: 'none',
                     fontWeight: 'bold',
                     fontSize: '32px'
@@ -66,8 +59,10 @@ export const InstrumentColumn: ColumnRenderComponent<IInstrumentColumnProps> = (
               pointer={{ type: 'blob', animationDelay: 0.5 }}
               value={currentValue}
             />
-            <Text>{unit}</Text>
-            <Title3>{description}</Title3>
+            <Text>
+              Enhet: <strong>{unit}</strong>
+            </Text>
+            <div className={styles.description}>{description}</div>
           </div>
         </div>
       </PopoverSurface>

diff --git a/...PointFramework/PortfolioWebParts/src/components/List/ItemColumn/InstrumentColumn/types.ts b/...PointFramework/PortfolioWebParts/src/components/List/ItemColumn/InstrumentColumn/types.ts
@@ -8,5 +8,5 @@ export interface IInstrumentColumnProps
   endValueField?: string
   currentValueField?: string
   unitField?: string
-  description?: string
+  descriptionField?: string
 }
diff --git a/.../PortfolioWebParts/src/components/List/ItemColumn/InstrumentColumn/useInstrumentColumn.ts b/.../PortfolioWebParts/src/components/List/ItemColumn/InstrumentColumn/useInstrumentColumn.ts
@@ -13,13 +13,7 @@ export function useInstrumentColumn(props: IInstrumentColumnProps) {
   const endValue = props.item[props.endValueField] || props.item['GtDesiredValueOWSNMBR']
   const currentValue = props.item[props.currentValueField] || props.item['LastMeasurementValue']
   const unit = props.item[props.unitField] || props.item['GtMeasurementUnitOWSCHCS']
-  const description = props.description
-
-  // based on the end value and startvalue, create subArcs. where each subArc is a range of the gauge. Start and end should be 10% of the values, higher or lower. There should always be 4 subArs.
-  // first arc should be from startValue - 10% to startValue
-  // second arc should be from 30% of endValue
-  // third arc should be from 70% of endValue
-  // fourth arc should be from endValue to endValue + 10%
+  const description = props.item[props.descriptionField] || props.item['MeasurementIndicator']
 
   const subArcs: SubArc[] = [
     { limit: startValue - endValue * 0.1, showTick: true, color: '#FF2121' },