chore: install prettier

app/components/media/ImageCard.vue

@@ -1,5 +1,5 @@
 <script setup>
-import FileActions from '@/components/media/FileActions.vue';
+import FileActions from "@/components/media/FileActions.vue";
 
 const props = defineProps({
   image: Object,
@@ -8,15 +8,9 @@ const props = defineProps({
   loadImages: Function,
   deleteImage: Function,
   viewImage: Function,
-})
+});
 
-const {
-  $buildFileUrl,
-  $formatFileSize,
-  $getpath,
-  $patchapi,
-  $snackbar,
-} = useNuxtApp();
+const { $buildFileUrl, $formatFileSize, $getpath, $patchapi, $snackbar } = useNuxtApp();
 
 const url = $buildFileUrl(props.image.file__file);
 
@@ -51,7 +45,7 @@ async function saveEditImage() {
     console.error("Error updating image", error);
     $snackbar("Cập nhật ảnh thất bại", "Lỗi", "Error");
   }
-  
+
   resetEditRefs();
 }
 
@@ -77,20 +71,19 @@ async function openDeleteImageConfirm(image) {
   if (confirmed) {
     await props.deleteImage(image);
   }
-  
+
   pendingDeleteImage.value = null;
 }
 </script>
 <template>
-  <div v-if="layoutMode === 'grid'" class="column is-one-third is-one-quarter-widescreen p-2">
-    <div 
-      class="card image-card" 
-      style="
-        outline: 1px solid hsl(0 0% 0% / 0.2);
-        box-shadow: none;
-        height: 100%; 
-        overflow: hidden;
-      ">
+  <div
+    v-if="layoutMode === 'grid'"
+    class="column is-one-third is-one-quarter-widescreen p-2"
+  >
+    <div
+      class="card image-card"
+      style="outline: 1px solid hsl(0 0% 0% / 0.2); box-shadow: none; height: 100%; overflow: hidden"
+    >
       <!-- Edit mode -->
       <div
         v-if="editingImage?.id === image.id"
@@ -103,8 +96,7 @@ async function openDeleteImageConfirm(image) {
               class="input is-small"
               type="text"
               v-model="editingImageName"
-            >
-            </input>
+            />
           </div>
         </div>
         <div class="field">
@@ -120,12 +112,12 @@ async function openDeleteImageConfirm(image) {
         <div class="field">
           <label class="label fs-14">Hashtag</label>
           <div class="control">
-             <input
+            <input
               class="input is-small"
               type="text"
               v-model="editingImageHashtag"
-            >
-            </input>
+            />
+            />
           </div>
         </div>
         <div class="buttons is-small mt-2">
@@ -155,7 +147,7 @@ async function openDeleteImageConfirm(image) {
               :src="url"
               loading="lazy"
               :alt="image.file__caption || image.file__name || 'Hình ảnh'"
-              style="object-fit: contain;"
+              style="object-fit: contain"
             />
           </figure>
         </div>
@@ -172,13 +164,15 @@ async function openDeleteImageConfirm(image) {
               {{ image.file__caption }}
             </p>
           </div>
-          <FileActions v-bind="{
-            className: 'is-right mt-2',
-            image,
-            editImage,
-            downloadImage,
-            openDeleteImageConfirm
-          }" />
+          <FileActions
+            v-bind="{
+              className: 'is-right mt-2',
+              image,
+              editImage,
+              downloadImage,
+              openDeleteImageConfirm,
+            }"
+          />
         </div>
       </div>
     </div>
@@ -260,36 +254,28 @@ async function openDeleteImageConfirm(image) {
         </p>
       </td>
       <td>
-        <span class="is-size-7">{{
-          image.file__caption
-        }}</span>
+        <span class="is-size-7">{{ image.file__caption }}</span>
       </td>
       <td>
-        <span class="is-size-7">{{
-          image.file__hashtag
-        }}</span>
+        <span class="is-size-7">{{ image.file__hashtag }}</span>
       </td>
       <td>
         <p class="is-size-7 has-text-weight-semibold">
           {{ image.file__user__fullname }}
         </p>
         <p class="is-size-7 has-text-grey">
-          {{
-            image.create_time
-              ? new Date(image.create_time).toLocaleString(
-                  "vi-VN"
-                )
-              : "-"
-          }}
+          {{ image.create_time ? new Date(image.create_time).toLocaleString("vi-VN") : "-" }}
         </p>
       </td>
       <td>
-        <FileActions v-bind="{
-          image,
-          editImage,
-          downloadImage,
-          openDeleteImageConfirm
-        }" />
+        <FileActions
+          v-bind="{
+            image,
+            editImage,
+            downloadImage,
+            openDeleteImageConfirm,
+          }"
+        />
       </td>
     </tr>
   </template>