Add vue3-star-ratings package

src/components/Pages/Gangguan/Rekap/RGangguan_RatingPerPosko.vue

@@ -439,6 +439,19 @@
               {{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
             </p>
           </template>
+
+          <template #formatRating="{ data }">
+            <p class="cursor-pointer">
+              <vue3starRatings
+                v-model="data.text"
+                :starSize="20"
+                starColor="#CCCC00"
+                inactiveColor="#D1D5DB"
+                :numberOfStars="5"
+                :disableClick="true"
+              />
+            </p>
+          </template>
         </DxDataGrid>
       </div>
     </div>
@@ -600,6 +613,7 @@ import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
 import { formatWaktu } from '@/components/Form/FiltersType/reference'
 import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
 import InputText from '@/components/InputText.vue'
+import vue3starRatings from 'vue3-star-ratings'
 import { apolloClient } from '@/utils/api/api.graphql'
 import { provideApolloClient } from '@vue/apollo-composable'
 

src/components/Pages/Gangguan/Rekap/RGangguan_RatingPerRegu.vue

@@ -431,6 +431,19 @@
               {{ parseInt(data.text) ? formatWaktu(data.text) : '-' }}
             </p>
           </template>
+
+          <template #formatRating="{ data }">
+            <p class="cursor-pointer">
+              <vue3starRatings
+                v-model="data.text"
+                :starSize="20"
+                starColor="#CCCC00"
+                inactiveColor="#D1D5DB"
+                :numberOfStars="5"
+                :disableClick="true"
+              />
+            </p>
+          </template>
         </DxDataGrid>
       </div>
     </div>
@@ -590,6 +603,7 @@ import { useQuery } from '@vue/apollo-composable'
 import { queries } from '@/utils/api/api.graphql'
 import { formatNumber, formatPercentage, isNumber } from '@/utils/numbers'
 import { formatWaktu } from '@/components/Form/FiltersType/reference'
+import vue3starRatings from 'vue3-star-ratings'
 import DetailDialog from '@/components/Dialogs/DetailDialog.vue'
 import InputText from '@/components/InputText.vue'
 import { apolloClient } from '@/utils/api/api.graphql'