From 796d5dd9f7d634d24d671081ed08d4c70c0bac09 Mon Sep 17 00:00:00 2001
From: Pavel Gordienko <guzmo@yandex.ru>
Date: Wed, 25 Sep 2024 06:23:59 +0300
Subject: [PATCH] feat: add generate data for score

---
 app/src/components/AudioRow/AudioRow.css | 13 ------
 app/src/components/TableRow/TableRow.css | 50 ++++++++++++++++++++++++
 app/src/components/TableRow/TableRow.tsx | 21 +++++++++-
 app/src/utils/formatCalls.ts             | 11 +++++-
 4 files changed, 79 insertions(+), 16 deletions(-)

diff --git a/app/src/components/AudioRow/AudioRow.css b/app/src/components/AudioRow/AudioRow.css
index 8544873..a896aac 100644
--- a/app/src/components/AudioRow/AudioRow.css
+++ b/app/src/components/AudioRow/AudioRow.css
@@ -49,16 +49,3 @@
 .row-call-image {
   padding: 6px;
 }
-
-.row-score-element {
-  padding: 6px 8px;
-  border: 1px solid rgb(40, 168, 121);
-  border-radius: 4px;
-  background: rgb(219, 248, 239);
-  width: 70px;
-  color: rgb(0, 167, 117);
-  font-size: 14px;
-  font-weight: 400;
-  line-height: 100%;
-  text-align: left;
-}
diff --git a/app/src/components/TableRow/TableRow.css b/app/src/components/TableRow/TableRow.css
index a7ae4e0..1ed4451 100644
--- a/app/src/components/TableRow/TableRow.css
+++ b/app/src/components/TableRow/TableRow.css
@@ -54,3 +54,53 @@
   justify-content: flex-end;
   width: 28.9%;
 }
+
+.row-score-element-green {
+  padding: 6px 8px;
+  border: 1px solid rgb(40, 168, 121);
+  border-radius: 4px;
+  background: rgb(219, 248, 239);
+  width: 70px;
+  color: rgb(0, 167, 117);
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 100%;
+  text-align: left;
+}
+
+.row-score-element-yellow {
+  padding: 6px 8px;
+  border: 1px solid rgb(173, 191, 223);
+  border-radius: 4px;
+  background: rgb(216, 228, 251);
+  border-radius: 4px;
+  width: 66px;
+  color: rgb(18, 41, 69);
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 100%;
+  text-align: left;
+}
+
+.row-score-element-red {
+  padding: 6px 8px;
+  border: 1px solid rgb(234, 26, 79);
+  border-radius: 4px;
+  background: rgb(254, 233, 239);
+  width: 56px;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 100%;
+  text-align: left;
+  color: rgb(234, 26, 79);
+}
+
+.row-score-element {
+  padding: 6px 8px;
+  color: rgb(234, 26, 79);
+  width: 200px;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 100%;
+  text-align: left;
+}
diff --git a/app/src/components/TableRow/TableRow.tsx b/app/src/components/TableRow/TableRow.tsx
index eba9646..c3ee687 100644
--- a/app/src/components/TableRow/TableRow.tsx
+++ b/app/src/components/TableRow/TableRow.tsx
@@ -27,6 +27,25 @@ const TableRow: React.FC<TableRowProps> = ({
 }) => {
   const [isHovered, setIsHovered] = useState(false);
 
+  const getScoreDetails = () => {
+    switch (score) {
+      case 'Excellent':
+        return { className: 'row-score-element-green', text: 'Отлично' };
+      case 'Good':
+        return { className: 'row-score-element-yellow', text: 'Хорошо' };
+      case 'Bad':
+        return { className: 'row-score-element-red', text: 'Плохо' };
+      case 'Not Used':
+      default:
+        return {
+          className: 'row-score-element',
+          text: 'Скрипт не использован',
+        };
+    }
+  };
+
+  const { className, text } = getScoreDetails();
+
   return (
     <div
       className="row"
@@ -43,7 +62,7 @@ const TableRow: React.FC<TableRowProps> = ({
       <div className="row-phone">{phone}</div>
       <div className="row-source">{source}</div>
       <div className="row-score">
-        <div className="row-score-element">{score}</div>
+        <div className={className}>{text}</div>
       </div>
       <div className="row-length">
         <AudioRow
diff --git a/app/src/utils/formatCalls.ts b/app/src/utils/formatCalls.ts
index 2ea29a0..1117d52 100644
--- a/app/src/utils/formatCalls.ts
+++ b/app/src/utils/formatCalls.ts
@@ -1,5 +1,8 @@
 import { Call } from './api';
 
+const scores = ['Good', 'Excellent', 'Bad', 'Not Used'];
+const sources = ['', 'Rabota.ru', 'Санкт-Петербург', 'Google', 'Yandex'];
+
 export const formatCalls = (calls: Call[]) => {
   return calls.map((call) => {
     const time = call.date.split(' ')[1];
@@ -21,13 +24,17 @@ export const formatCalls = (calls: Call[]) => {
     const callLength =
       call.time > 0 ? `${formattedMinutes}:${formattedSeconds}` : '';
 
+    const score = scores[Math.floor(Math.random() * scores.length)];
+
+    const source = sources[Math.floor(Math.random() * sources.length)];
+
     return {
       typeImage,
       time: `${hours}:${minutes}`,
       avatar: call.person_avatar || 'https://lk.skilla.ru/img/noavatar.jpg',
       phone: call.from_number,
-      source: call.source || '',
-      score: 'Отлично',
+      source,
+      score,
       length: callLength,
       record: call.record,
       partnership_id: call.partnership_id,