tango-app-ui-analyse-trax 3.9.2 → 3.9.3

package/src/lib/components/activity-log-v2/log-view-popup/view-action/view-action.component.html

@@ -0,0 +1,724 @@
+<div>
+    <div class="card-header">
+        <div class="logheader d-flex justify-content-between W-100">
+            <span *ngIf="actionType === 'edited'" class="card-header logheadertext">Checklist Updates</span>
+            <span *ngIf="actionType === 'updated' || actionType === 'draft'" class="card-header logheadertext">Configuration Updates</span>
+            <div class="cursor-pointer" (click)="closePopup()"><span><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="none">
+                        <path d="M24 8L8 24M8 8L24 24" stroke="#008EDF" stroke-width="2" stroke-linecap="round"
+                            stroke-linejoin="round" />
+                    </svg></span></div>
+        </div>
+    </div>
+    <!-- edited -->
+    <div class="card-body checklistscroll p-8">
+    <div  *ngIf="actionType === 'edited'">
+       <!-- Checklist Name -->
+       <!-- *ngIf="updatedChecklistName" -->
+    <div class="checklistframe my-6" *ngIf="updatedChecklistName?.previous || updatedChecklistName?.new">
+        <div class="table-responsive">
+            <table>
+                <thead>
+                    <tr class="frametext">
+                        <th class="frametext1 col-2">Fields</th>
+                        <th class="frametext col-5">Previous</th>
+                        <th class="frametextprimary col-5">Updated</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr>
+                        <td class="questionfieldtext col-2">Checklist Name</td>
+                        <td class="Previousfieldtext col-5">{{ updatedChecklistName?.previous || '-' }}</td>
+                        <td class="changesfieldtext col-5">{{ updatedChecklistName?.new || '-' }}</td>
+                    </tr>
+                </tbody>
+            </table>
+        </div>
+    </div>
+        <!-- Checklist Name End -->
+         <!-- <div class="borderline"></div> -->
+           <!-- Checklist Description Start -->
+           <div class="checklistframe my-6" *ngIf="updatedChecklistDescription?.previous || updatedChecklistDescription?.new">
+            <!-- <h4 class="text-lg font-semibold">Checklist Description Updated</h4> -->
+            <div class="table-responsive">
+                <table>
+                    <thead>
+                        <tr class="frametext">
+                            <th class="frametext1 col-2">Fields</th>
+                            <th class="frametext col-5">Previous</th>
+                            <th class="frametextprimary col-5">Updated</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr>
+                            <td class="questionfieldtext col-2">Checklist Description</td>
+                            <td class="Previousfieldtext col-5">{{ updatedChecklistDescription?.previous || '-' }}</td>
+                            <td class="changesfieldtext col-5">{{ updatedChecklistDescription?.new || '-' }}</td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    
+        <!-- Checklist Description End -->
+
+             <!-- Section Name Start -->
+             <div class="checklistframe my-6" *ngIf="updatedSectionNames.length > 0">
+                <!-- <h4 class="text-lg font-semibold">Section Names Updated</h4> -->
+                <div class="table-responsive">
+                    <table *ngFor="let section of updatedSectionNames">
+                        <thead>
+                            <tr class="frametext">
+                                <th class="frametext1 col-2">Fields</th>
+                                <th class="frametext col-5">Previous</th>
+                                <th class="frametextprimary col-5">Updated</th>
+                            </tr>
+                        </thead>
+                        <tbody>
+                            <tr >
+                                <td class="questionfieldtext col-2">Section Name</td>
+                                <td class="Previousfieldtext col-5">{{ section?.previous || '-' }}</td>
+                                <td class="changesfieldtext col-5">{{ section?.new || '-' }}</td>
+                            </tr>
+                        </tbody>
+                    </table>
+                </div>
+            </div>
+            <!-- Section Name End -->
+
+        <!-- Question Added varient start -->
+        <div *ngIf="addedQuestions.length > 0">
+        <div *ngFor="let section of addedQuestions">
+            <div class="questext">Section Name: <span class="quessubtext">{{ section?.sectionName || '-' }}</span></div>
+            <div *ngFor="let question of section.questions; let i = index" >
+            <div class="questext mt-2">Question No : <span class="quessubtext">{{ question?.qno || '-' }}</span></div>
+            <div class="checklistframe my-6">
+                <div class="table-responsive">
+                    <table >
+                        <thead>
+                            <tr class="frametext">
+                                <th class="frametext1 col-2">Fields</th>
+                                <th class="frametext col-5">Previous</th>
+                                <th class="frametextprimary col-5">Updated</th>
+                            </tr>
+                        </thead>
+                        <tbody >
+                            <tr>
+                                <td class="questionfieldtext col-2">Question Added</td>
+                                <td class="Previousfieldtext col-5"> - </td>
+                                <td class="changesfieldtext col-5">{{ question?.qname || '-' }}</td>
+                            </tr>
+                        </tbody>
+                    </table>
+                </div>
+              </div>
+            </div>
+        </div>
+        </div>
+        <!-- Question Added varient end -->
+
+        <!-- Question Deleted varient start -->
+        <div *ngIf="deletedQuestions.length > 0">
+        <div *ngFor="let section of deletedQuestions">
+            <div class="questext">Section Name: <span class="quessubtext">{{ section.sectionName }}</span></div>
+            <div *ngFor="let question of section.questions; let i = index" >
+            <div class="questext mt-2">Question No : <span class="quessubtext">{{ question?.qno || '-' }}</span></div>
+            <div class="checklistframe my-6">
+                <div class="table-responsive">
+                    <table >
+                        <thead>
+                            <tr class="frametext">
+                                <th class="frametext1 col-2">Fields</th>
+                                <th class="frametext col-5">Previous</th>
+                                <th class="frametextprimary col-5">Updated</th>
+                            </tr>
+                        </thead>
+                        <tbody >
+                            <tr>
+                                <td class="questionfieldtext col-2">Question Deleted</td>
+                                <td class="Previousfieldtext col-5"> - </td>
+                                <td class="changesfieldtext col-5">{{ question?.qname || '-' }}</td>
+                            </tr>
+                        </tbody>
+                    </table>
+                </div>
+              </div>
+            </div>
+        </div>
+        </div>
+      
+        <!-- Question Deleted varient end -->
+
+        <!-- Question Edited varient start -->
+        <div *ngIf="editedQuestions.length > 0">
+        <div *ngFor="let section of editedQuestions">
+          <div class="questext">Section Name: <span class="quessubtext">{{ section.sectionName || '-' }}</span></div>
+      
+          <div *ngFor="let question of section.questions">
+              <div class="questext mt-2">Question No : <span class="quessubtext">{{ question?.previous?.qno || question?.new?.qno || '-' }}</span></div>
+              
+              <div class="checklistframe my-6">
+                  <div class="table-responsive">
+                      <table>
+                          <thead>
+                              <tr class="frametext">
+                                  <th class="frametext1 col-2">Fields</th>
+                                  <th class="frametext col-5 previous-field">Previous</th>
+                                  <th class="frametextprimary col-5 updated-field">Updated</th>
+                              </tr>
+                          </thead>
+                          <tbody>
+                              <!-- Question Name -->
+                              <tr>
+                                  <td class="questionfieldtext col-2">Question Edited</td>
+                                  <td class="Previousfieldtext col-5">{{ question.previous?.qname || '-' }}</td>
+                                  <td class="changesfieldtext col-5">{{ question.new?.qname || '-' }}</td>
+                              </tr>
+                              
+                              <!-- Answer Type -->
+                              <tr>
+                                  <td class="questionfieldtext col-2">Type</td>
+                                  <td class="Previousfieldtext col-5">{{ getAnswerTypeLabel(question.previous?.answerType) || '-' }}</td>
+                                  <td class="changesfieldtext col-5">{{ getAnswerTypeLabel(question.new?.answerType) || '-' }}
+                                  </td>
+                              </tr>
+      
+                              <!-- Reference Image -->
+                              <tr>
+                                  <td class="questionfieldtext col-2">Reference Image</td>
+                                  <td class="Previousfieldtext col-5">-</td>
+                                  
+                                  <td class="changesfieldtext col-5"> {{
+                                    question.previous?.questionReferenceImage && !question.new?.questionReferenceImage ? 'Deleted' :
+                                    !question.previous?.questionReferenceImage && question.new?.questionReferenceImage ? 'Added' :
+                                    question.previous?.questionReferenceImage !== question.new?.questionReferenceImage ? 'Updated' :
+                                    '-'
+                                }}</td>
+                              </tr>
+                          </tbody>
+                      </table>
+                  </div>
+              </div>
+          </div>
+      </div>
+      </div>
+        <!-- Question Edited varient end -->
+    </div>
+
+    <!-- updated -->
+         <!-- Configuration Updates start -->
+         <div  *ngIf="actionType === 'updated' || actionType === 'draft'" class="checklistframe my-6">
+            <div class="table-responsive">
+              <table>
+                <thead>
+                  <tr class="frametext">
+                    <th class="frametext1 col-2">Fields</th>
+                    <th class="frametext col-5 w-50">Previous</th>
+                    <th class="frametextprimary col-5 w-50">Updated</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr>
+                    <td class="questionfieldtext col-2">Store Added</td>
+                    <td class="configPreviousfieldtext col-5 w-50"> - </td>
+                    <td class="changesfieldtext col-5 w-50">
+                      <ng-container *ngIf="logDetails?.storeAdded?.length; else noData">
+                        <lib-store-user-dropdown [items]="logDetails.storeAdded" title="Stores"></lib-store-user-dropdown>
+                      </ng-container>
+                      <ng-template #noData>-</ng-template>
+                      </td>
+                  </tr>
+          
+                  <!-- Schedule Update -->
+                  <tr>
+                    <td class="questionfieldtext col-2">Schedule</td>
+                    <td class="configPreviousfieldtext col-5">
+                      <span *ngIf="receivedData === 'checklist' && logDetails?.schedule?.previous?.scheduleRepeatedType === 'onetime'">
+                      <span class="my-3">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                          <path d="M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                        </svg>
+                        <span class="ms-2 mt-2">
+                          <span *ngIf="logDetails?.schedule?.previous?.scheduleRepeatedType === 'onetime'">Once on</span>
+                        </span> 
+                        <span>
+                          <span class="ms-1">
+                            {{ logDetails?.schedule?.previous?.scheduleDateString ? formatDate(logDetails.schedule.previous.scheduleDateString) : '-' }}</span>
+                        </span>
+                      </span><br>
+                      <span class="previouslineheight">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                          <path d="M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                        </svg>
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.time || '-' }}</span>
+                      </span><br>
+                    </span>
+                    <span *ngIf="receivedData === 'task' && logDetails?.schedule?.previous?.scheduleDateString">
+                      <span class="my-3">
+                          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                              <path d="M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z"
+                                    stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                          </svg>
+                          <span class="ms-2 mt-2">Due Date</span> 
+                          <span class="ms-1">
+                              {{ logDetails?.schedule?.previous?.scheduleDateString ? formatDate(logDetails.schedule.previous.scheduleDateString) : '-' }}
+                          </span>
+                      </span><br>
+                  
+                      <span class="previouslineheight" *ngIf="logDetails?.schedule?.previous?.time">
+                          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                              <path d="M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z"
+                                    stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                          </svg>
+                          <span class="ms-2">{{ logDetails?.schedule?.previous?.time || '-' }}</span>
+                      </span>
+                  </span>
+                    <span *ngIf="logDetails?.schedule?.previous?.scheduleRepeatedType === 'weekday'">
+                      <span class="my-3">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                          <path d="M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                        </svg>
+                        <span class="ms-2">Every {{ logDetails?.schedule?.previous?.schedule || '-' }}</span> 
+                        <span *ngIf="logDetails?.schedule?.previous?.configStartDate">
+                          <span class="ms-2">Starts from {{ formatDate(logDetails?.schedule?.previous?.configStartDate) }} -</span>
+                        </span>
+                        <span *ngIf="logDetails?.schedule?.previous?.configStartDate && logDetails?.schedule?.previous?.configEndDate" class="ms-2">- Every -</span>
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.scheduleRepeatedDay || '-' }}</span> 
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.scheduleRepeatedType || '-' }}</span> -
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.scheduleWeekDays || '-' }}</span> 
+
+                        <span *ngIf="logDetails?.schedule?.previous?.configEndDate">
+                          <span class="ms-2">- Ends on  {{ formatDate(logDetails?.schedule?.previous?.configEndDate) }}</span>
+                        </span>
+                      </span><br>
+                      <span class="previouslineheight">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                          <path d="M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                        </svg>
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.time || '-' }}</span>
+                      </span><br>
+                    </span>
+                    <span *ngIf="logDetails?.schedule?.previous?.scheduleRepeatedType === 'daily'">
+                      <span class="my-3">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                          <path d="M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                        </svg>
+                        <span class="ms-2">Repeats {{ logDetails?.schedule?.previous?.schedule || '-' }} -</span>
+                        <span *ngIf="logDetails?.schedule?.previous?.configStartDate">
+                          <span class="ms-2">Starts from {{ formatDate(logDetails?.schedule?.previous?.configStartDate) }} -</span>
+                        </span>
+                        <span *ngIf="logDetails?.schedule?.previous?.configStartDate && logDetails?.schedule?.previous?.configEndDate" class="ms-2">- Every -</span>
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.scheduleRepeatedDay || '-' }}</span>
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.scheduleRepeatedType || '-' }}</span> 
+                        <span *ngIf="logDetails?.schedule?.previous?.configEndDate">
+                          <span class="ms-2">- Ends on  {{ formatDate(logDetails?.schedule?.previous?.configEndDate) }}</span>
+                        </span>
+                      </span><br>
+                      <span class="previouslineheight">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                          <path d="M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                        </svg>
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.time || '-' }}</span>
+                      </span><br>
+                    </span>
+                    <span *ngIf="logDetails?.schedule?.previous?.scheduleRepeatedType === 'weekly'">
+                      <span class="my-3">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                          <path d="M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                        </svg>
+                        <span class="ms-2">Repeats {{ logDetails?.schedule?.previous?.schedule || '-' }} -</span> 
+                        <span *ngIf="logDetails?.schedule?.previous?.configStartDate">
+                          <span class="ms-2">Starts from {{ formatDate(logDetails?.schedule?.previous?.configStartDate) }} -</span>
+                        </span>
+                        <span *ngIf="logDetails?.schedule?.previous?.configStartDate && logDetails?.schedule?.previous?.configEndDate" class="ms-2">- Every -</span>
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.scheduleRepeatedDay || '-' }}</span> 
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.scheduleRepeatedType || '-' }}</span> -
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.scheduleWeekDays || '-' }}</span> 
+
+                        <span *ngIf="logDetails?.schedule?.previous?.configEndDate">
+                          <span class="ms-2">- Ends on  {{ formatDate(logDetails?.schedule?.previous?.configEndDate) }}</span>
+                        </span>
+                      </span><br>
+                      <span class="previouslineheight">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                          <path d="M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                        </svg>
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.time || '-' }}</span>
+                      </span><br>
+                    </span>
+                    <span *ngIf="logDetails?.schedule?.previous?.scheduleRepeatedType === 'monthly'">
+                      <span class="my-3">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                          <path d="M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                        </svg>
+                        <span class="ms-2">Repeats {{ logDetails?.schedule?.previous?.schedule || '-' }} -</span>
+                        <span *ngIf="logDetails?.schedule?.previous?.configStartDate">
+                          <span class="ms-2">Starts from {{ formatDate(logDetails?.schedule?.previous?.configStartDate) }} -</span>
+                        </span>
+                        <span *ngIf="logDetails?.schedule?.previous?.configStartDate && logDetails?.schedule?.previous?.configEndDate" class="ms-2">- Every -</span>
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.scheduleRepeatedDay || '-' }}</span> 
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.scheduleRepeatedType || '-' }}</span> -
+                        <span *ngIf="!(logDetails?.schedule?.previous?.scheduleRepeatedMonthWeek?.length === 1)">On the</span>
+
+                        <span *ngIf="logDetails?.schedule?.previous?.scheduleRepeatedMonthWeek?.length === 1">On day</span>
+                        
+                        <span *ngIf="logDetails?.schedule?.previous?.scheduleRepeatedMonthWeek || logDetails?.schedule?.previous?.specificDate">
+                          <span *ngIf="scheduleWeeksArray().length; else showSpecificDate">
+                            <span *ngFor="let week of scheduleWeeksArray(); let i = index">
+                              {{ getWeekOrdinal(parseWeekNumber(week.split(' ')[0])) }} {{ week.split(' ')[1] }}
+                              <span *ngIf="i < scheduleWeeksArray().length - 1">, </span>
+                            </span>
+                          </span>
+                          <ng-template #showSpecificDate>
+                            <span *ngIf="logDetails?.schedule?.previous?.specificDate?.length > 0">
+                              {{ logDetails?.schedule?.previous?.specificDate.join(', ') }}
+                            </span>
+                          </ng-template>
+                        </span>
+
+                        <span *ngIf="logDetails?.schedule?.previous?.configEndDate">
+                          <span class="ms-2">- Ends on  {{ formatDate(logDetails?.schedule?.previous?.configEndDate) }}</span>
+                        </span>
+                      </span><br>
+                      <span class="previouslineheight">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                          <path d="M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                        </svg>
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.time || '-' }}</span>
+                      </span><br>
+                    </span>
+                    <span *ngIf="logDetails?.schedule?.previous?.scheduleRepeatedType === 'range'">
+                      <span class="my-3">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                          <path d="M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                        </svg>
+                        <span class="ms-2">Custom Range</span> -
+                        <span *ngIf="logDetails?.schedule?.previous?.configStartDate">
+                          <span class="ms-2">Starts from {{ formatDate(logDetails?.schedule?.previous?.configStartDate) }} -</span>
+                        </span>
+                        <span *ngIf="logDetails?.schedule?.new?.specificDate" class="ms-2">- On the Specific Dates - </span>
+                        <!-- <span class="ms-2">{{ logDetails?.schedule?.previous?.scheduleRepeatedDay || '-' }}</span>  -->
+                        <span class="ms-2">{{ formatDateString(logDetails?.schedule?.previous?.specificDate[0]) }}</span>
+                        <span *ngIf="logDetails?.schedule?.previous?.configEndDate">
+                          <span class="ms-2">- Ends on  {{ formatDate(logDetails?.schedule?.previous?.configEndDate) }}</span>
+                        </span>
+                      </span><br>
+                      <span class="previouslineheight">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                          <path d="M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                        </svg>
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.time || '-' }}</span>
+                      </span><br>
+                    </span>
+                    </td>
+
+                    <!-- <td class="configPreviousfieldtext col-5">
+                      <span class="my-3">
+                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                          <path d="M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                        </svg>
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.schedule || 'N/A' }} on</span> 
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.repeats || 'N/A' }}</span> 
+                        <span *ngIf="logDetails?.schedule?.previous?.scheduleStartTime_iso">
+                          <span class="ms-2">- Starts from:  {{ formatDate(logDetails?.schedule?.previous?.scheduleStartTime_iso) }}</span>
+                        </span>
+                        <span *ngIf="logDetails?.schedule?.previous?.occurs?.length > 0">
+                          <span class="ms-2">{{ logDetails?.schedule?.previous?.occurs?.join(', ') || 'N/A' }}</span>
+                        </span>
+                      </span><br>
+                      <span>
+                        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                          <path d="M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                        </svg>
+                        <span class="ms-2">{{ logDetails?.schedule?.previous?.time || 'N/A' }}</span>
+                      </span><br>
+                     
+                    </td> -->
+
+                    <td class="changesfieldtext col-5">
+                      <span *ngIf="logDetails?.schedule?.new?.scheduleRepeatedType === 'onetime'">
+                        <span class="my-3">
+                          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                            <path d="M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                          </svg>
+                          <span class="ms-2 mt-2">
+                            <span *ngIf="logDetails?.schedule?.new?.scheduleRepeatedType === 'onetime'">Once on</span>
+                          </span> 
+                          <span>
+                            <span class="ms-1"> {{ logDetails?.schedule?.new?.scheduleDateString ? formatDate(logDetails.schedule.new.scheduleDateString) : '-' }}</span>
+                          </span>
+                        </span><br>
+                        <span class="newlineheight">
+                          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                            <path d="M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                          </svg>
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.time || '-' }}</span>
+                        </span><br>
+                      </span>
+                      <span *ngIf="receivedData === 'task' && logDetails?.schedule?.new?.scheduleDateString">
+                        <span class="my-3">
+                            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                                <path d="M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z"
+                                      stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                            </svg>
+                            <span class="ms-2 mt-2">Due Date</span> 
+                            <span class="ms-1">
+                                {{ logDetails?.schedule?.new?.scheduleDateString ? formatDate(logDetails.schedule.new.scheduleDateString) : '-' }}
+                            </span>
+                        </span><br>
+                    
+                        <span class="previouslineheight" *ngIf="logDetails?.schedule?.new?.time">
+                            <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                                <path d="M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z"
+                                      stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                            </svg>
+                            <span class="ms-2">{{ logDetails?.schedule?.new?.time || '-' }}</span>
+                        </span>
+                    </span>
+                      <span *ngIf="logDetails?.schedule?.new?.scheduleRepeatedType === 'weekday'">
+                        <span class="my-3">
+                          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                            <path d="M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                          </svg>
+                          <span class="ms-2">Every {{ logDetails?.schedule?.new?.schedule || '-' }}</span> 
+                          <span *ngIf="logDetails?.schedule?.new?.configStartDate">
+                            <span class="ms-2">Starts from {{ formatDate(logDetails?.schedule?.new?.configStartDate) }} -</span>
+                          </span>
+                          <span *ngIf="logDetails?.schedule?.new?.configStartDate && logDetails?.schedule?.new?.configEndDate" class="ms-2"> Every -</span>
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.scheduleRepeatedDay || '-' }}</span> 
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.scheduleRepeatedType || '-' }}</span> -
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.scheduleWeekDays || '-' }}</span> 
+  
+                          <span *ngIf="logDetails?.schedule?.new?.configEndDate">
+                            <span class="ms-2">- Ends on  {{ formatDate(logDetails?.schedule?.new?.configEndDate) }}</span>
+                          </span>
+                        </span><br>
+                        <span class="newlineheight">
+                          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                            <path d="M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                          </svg>
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.time || '-' }}</span>
+                        </span><br>
+                      </span>
+                      <span *ngIf="logDetails?.schedule?.new?.scheduleRepeatedType === 'daily'">
+                        <span class="my-3">
+                          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                            <path d="M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                          </svg>
+                          <span class="ms-2">Repeats {{ logDetails?.schedule?.new?.schedule || '-' }} -</span> 
+                          <span *ngIf="logDetails?.schedule?.new?.configStartDate">
+                            <span class="ms-2">Starts from {{ formatDate(logDetails?.schedule?.new?.configStartDate) }} -</span>
+                          </span>
+                          <span *ngIf="logDetails?.schedule?.new?.configStartDate && logDetails?.schedule?.new?.configEndDate" class="ms-2">- Every -</span>
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.scheduleRepeatedDay || '-' }}</span>
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.scheduleRepeatedType || '-' }}</span> 
+                          <span *ngIf="logDetails?.schedule?.new?.configEndDate">
+                            <span class="ms-2">- Ends on  {{ formatDate(logDetails?.schedule?.new?.configEndDate) }}</span>
+                          </span>
+                        </span><br>
+                        <span class="newlineheight">
+                          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                            <path d="M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                          </svg>
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.time || '-' }}</span>
+                        </span><br>
+                      </span>
+                      <span *ngIf="logDetails?.schedule?.new?.scheduleRepeatedType === 'weekly'">
+                        <span class="my-3">
+                          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                            <path d="M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                          </svg>
+                          <span class="ms-2">Repeats {{ logDetails?.schedule?.new?.schedule || '-' }} -</span>
+                          <span *ngIf="logDetails?.schedule?.new?.configStartDate">
+                            <span class="ms-2">Starts from {{ formatDate(logDetails?.schedule?.new?.configStartDate) }} -</span>
+                          </span>
+                          <span *ngIf="logDetails?.schedule?.new?.configStartDate && logDetails?.schedule?.new?.configEndDate" class="ms-2">- Every -</span>
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.scheduleRepeatedDay || '-' }}</span> 
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.scheduleRepeatedType || '-' }}</span> -
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.scheduleWeekDays || '-' }}</span> 
+  
+                          <span *ngIf="logDetails?.schedule?.new?.configEndDate">
+                            <span class="ms-2">- Ends on  {{ formatDate(logDetails?.schedule?.new?.configEndDate) }}</span>
+                          </span>
+                        </span><br>
+                        <span class="newlineheight">
+                          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                            <path d="M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                          </svg>
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.time || '-' }}</span>
+                        </span><br>
+                      </span>
+                      <span *ngIf="logDetails?.schedule?.new?.scheduleRepeatedType === 'monthly'">
+                        <span class="my-3">
+                          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                            <path d="M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                          </svg>
+                          <span class="ms-2">Repeats {{ logDetails?.schedule?.new?.schedule || '-' }} -</span>
+                          <span *ngIf="logDetails?.schedule?.new?.configStartDate">
+                            <span class="ms-2">Starts from {{ formatDate(logDetails?.schedule?.new?.configStartDate) }} -</span>
+                          </span>
+                          <span *ngIf="logDetails?.schedule?.new?.configStartDate && logDetails?.schedule?.new?.configEndDate" class="ms-2">- Every -</span>
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.scheduleRepeatedDay || '-' }}</span> 
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.scheduleRepeatedType || '-' }}</span> -
+                          <span *ngIf="!(logDetails?.schedule?.new?.scheduleRepeatedMonthWeek?.length === 1)">On the </span>
+
+                          <span *ngIf="logDetails?.schedule?.new?.scheduleRepeatedMonthWeek?.length === 1">On day</span>
+                          
+                          <span *ngIf="logDetails?.schedule?.new?.scheduleRepeatedMonthWeek || logDetails?.schedule?.new?.specificDate">
+                            <span *ngIf="scheduleWeeksArray().length; else showSpecificDate">
+                              <span *ngFor="let week of scheduleWeeksArray(); let i = index">
+                                {{ getWeekOrdinal(parseWeekNumber(week.split(' ')[0])) }} {{ week.split(' ')[1] }}
+                                <span *ngIf="i < scheduleWeeksArray().length - 1">, </span>
+                              </span>
+                            </span>
+                            <ng-template #showSpecificDate>
+                              <span *ngIf="logDetails?.schedule?.new?.specificDate?.length > 0">
+                                {{ logDetails?.schedule?.new?.specificDate.join(', ') }}
+                              </span>
+                            </ng-template>
+                          </span>
+                          <span *ngIf="logDetails?.schedule?.new?.configEndDate">
+                            <span class="ms-2">- Ends on  {{ formatDate(logDetails?.schedule?.new?.configEndDate) }}</span>
+                          </span>
+                        </span><br>
+                        <span class="newlineheight">
+                          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                            <path d="M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                          </svg>
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.time || '-' }}</span>
+                        </span><br>
+                      </span>
+                      <span *ngIf="logDetails?.schedule?.new?.scheduleRepeatedType === 'range'">
+                        <span class="my-3">
+                          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                            <path d="M16 2V6M8 2V6M3 10H21M5 4H19C20.1046 4 21 4.89543 21 6V20C21 21.1046 20.1046 22 19 22H5C3.89543 22 3 21.1046 3 20V6C3 4.89543 3.89543 4 5 4Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                          </svg>
+                          <span class="ms-2">Custom Range</span> -
+                          <span *ngIf="logDetails?.schedule?.new?.configStartDate">
+                            <span class="ms-2">Starts from {{ formatDate(logDetails?.schedule?.new?.configStartDate) }} -</span>
+                          </span>
+                          <span *ngIf="logDetails?.schedule?.new?.specificDate" class="ms-2">- On the Specific Dates - </span>
+                          <!-- <span class="ms-2">{{ logDetails?.schedule?.new?.scheduleRepeatedDay || '-' }}</span>  -->
+                          <span class="ms-2">{{ formatDateString(logDetails?.schedule?.new?.specificDate[0]) }}</span>
+                          <span *ngIf="logDetails?.schedule?.new?.configEndDate">
+                            <span class="ms-2">- Ends on  {{ formatDate(logDetails?.schedule?.new?.configEndDate) }}</span>
+                          </span>
+                        </span><br>
+                        <span class="newlineheight">
+                          <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
+                            <path d="M12 6V12L16 14M22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12Z" stroke="#667085" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"/>
+                          </svg>
+                          <span class="ms-2">{{ logDetails?.schedule?.new?.time || '-' }}</span>
+                        </span><br>
+                      </span>
+                    </td>
+                  </tr>
+          
+                  <tr>
+                    <td class="questionfieldtext col-2">Response</td>
+                    <td class="configPreviousfieldtext col-5">
+                      <ng-container *ngIf="logDetails?.response?.previous?.length; else noPreviousData">
+                        <ul>
+                            <li *ngFor="let item of logDetails?.response?.previous">{{ item }}</li>
+                        </ul>
+                      </ng-container>
+                      <ng-template #noPreviousData>-</ng-template>
+                    </td>
+                    <td class="changesfieldtext col-5">
+                      <ng-container *ngIf="logDetails?.response?.new?.length; else noNewData">
+                        <ul>
+                            <li *ngFor="let item of logDetails?.response?.new">{{ item }}</li>
+                        </ul>
+                      </ng-container>
+                      <ng-template #noNewData>-</ng-template>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td class="questionfieldtext col-2">Owner</td>
+                    <td class="configPreviousfieldtext col-5">
+                      <ng-container *ngIf="logDetails?.owner?.previous; else noPreviousData">
+                        {{ logDetails?.owner?.previous || '-' }}
+                      </ng-container>
+                      <ng-template #noPreviousData>-</ng-template>
+                    </td>
+                    <td class="changesfieldtext col-5">
+                      <ng-container *ngIf="logDetails?.owner?.new; else noNewData">
+                        {{ logDetails?.owner?.new || '-' }}
+                      </ng-container>
+                      <ng-template #noNewData>-</ng-template>
+                    </td>
+                  </tr>
+                  
+                  <tr>
+                    <td class="questionfieldtext col-2">Approver</td>
+                    <td class="configPreviousfieldtext col-5">
+                      <ng-container *ngIf="logDetails?.approver?.previous; else noData">
+                        {{ logDetails?.approver?.previous || '-' }}
+                      </ng-container>
+                      <ng-template #noData>-</ng-template>
+                    </td>
+                    <td class="changesfieldtext col-5">
+                      <ng-container *ngIf="logDetails?.approver?.new; else noData">
+                        {{ logDetails?.approver?.new || '-' }}
+                      </ng-container>
+                      <ng-template #noData>-</ng-template>
+                    </td>
+                  </tr>
+
+                  <tr *ngIf="receivedData === 'task'">
+                    <td class="questionfieldtext col-2">Priority</td>
+                    <td class="configPreviousfieldtext col-5">
+                      <ng-container *ngIf="logDetails?.schedule?.previous.priority; else noData">
+                        {{ logDetails?.schedule?.previous.priority || '-' }}
+                      </ng-container>
+                      <ng-template #noData>-</ng-template>
+                    </td>
+                    <td class="changesfieldtext col-5">
+                      <ng-container *ngIf="logDetails?.schedule?.new?.priority; else noData">
+                        {{ logDetails?.schedule?.new?.priority || '-' }}
+                      </ng-container>
+                      <ng-template #noData>-</ng-template>
+                    </td>
+                  </tr>
+                  
+          
+                  <tr>
+                    <td class="questionfieldtext col-2">Store Removed</td>
+                    <td class="configPreviousfieldtext col-5"> - </td>
+                    <td class="changesfieldtext col-5">
+                      <ng-container *ngIf="logDetails?.storeRemoved?.length; else noData">
+                        <lib-store-user-dropdown [items]="logDetails?.storeRemoved" title="Stores"></lib-store-user-dropdown>
+                      </ng-container>
+                      <ng-template #noData>-</ng-template>
+                      </td>
+                  </tr>
+          
+                  <tr>
+                    <td class="questionfieldtext col-2">User Added</td>
+                    <td class="configPreviousfieldtext col-5"> - </td>
+                    <td class="changesfieldtext col-5">
+                      <ng-container *ngIf="logDetails?.userAdded?.length; else noData">
+                        <lib-store-user-dropdown [items]="logDetails?.userAdded" title="Users"></lib-store-user-dropdown>
+                      </ng-container>
+                      <ng-template #noData>-</ng-template>
+                    </td>
+                  </tr>
+          
+                  <tr>
+                    <td class="questionfieldtext col-2">User Removed</td>
+                    <td class="configPreviousfieldtext col-5"> - </td>
+                    <td class="changesfieldtext col-5">
+                      <ng-container *ngIf="logDetails?.userRemoved?.length; else noData">
+                        <lib-store-user-dropdown [items]="logDetails?.userRemoved" title="Users"></lib-store-user-dropdown>
+                      </ng-container>
+                      <ng-template #noData>-</ng-template>
+                      </td>
+                  </tr>
+          
+                </tbody>
+              </table>
+            </div>
+          </div>
+<!-- Configuration Updates end -->
+
+    </div>
+</div>