Browse Source

[ui] Vue 3 - Migrated HumanByteSize component

sreenaths 4 years ago
parent
commit
ae4c9ab48b
1 changed files with 14 additions and 11 deletions
  1. 14 11
      desktop/core/src/desktop/js/components/HumanByteSize.vue

+ 14 - 11
desktop/core/src/desktop/js/components/HumanByteSize.vue

@@ -21,9 +21,7 @@
 </template>
 
 <script lang="ts">
-  import Vue from 'vue';
-  import Component from 'vue-class-component';
-  import { Prop } from 'vue-property-decorator';
+  import { defineComponent } from 'vue';
 
   const UNITS = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB'];
 
@@ -42,15 +40,20 @@
     return `${unitValue} ${UNITS[unitIndex]}`;
   };
 
-  @Component
-  export default class HumanByteSize extends Vue {
-    @Prop({ required: false })
-    value?: number;
-
-    get humanSize(): string {
-      return humanSize(this.value);
+  export default defineComponent({
+    props: {
+      value: {
+        type: Number,
+        default: 0
+      }
+    },
+
+    computed: {
+      humanSize(): string {
+        return humanSize(this.value);
+      }
     }
-  }
+  });
 </script>
 
 <style lang="scss" scoped></style>