mirror of
https://github.com/CorentinTh/it-tools.git
synced 2025-05-07 14:57:12 -04:00
fix: allow all units for bitrate
ie, in case of download speed in MB/s
This commit is contained in:
parent
7856df3918
commit
edfb3f575b
5 changed files with 59 additions and 37 deletions
|
@ -286,6 +286,9 @@
|
||||||
"watchTriggerable": true,
|
"watchTriggerable": true,
|
||||||
"watchWithFilter": true,
|
"watchWithFilter": true,
|
||||||
"whenever": true,
|
"whenever": true,
|
||||||
"toValue": true
|
"toValue": true,
|
||||||
|
"injectLocal": true,
|
||||||
|
"provideLocal": true,
|
||||||
|
"useClipboardItems": true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
9
auto-imports.d.ts
vendored
9
auto-imports.d.ts
vendored
|
@ -36,6 +36,7 @@ declare global {
|
||||||
const h: typeof import('vue')['h']
|
const h: typeof import('vue')['h']
|
||||||
const ignorableWatch: typeof import('@vueuse/core')['ignorableWatch']
|
const ignorableWatch: typeof import('@vueuse/core')['ignorableWatch']
|
||||||
const inject: typeof import('vue')['inject']
|
const inject: typeof import('vue')['inject']
|
||||||
|
const injectLocal: typeof import('@vueuse/core')['injectLocal']
|
||||||
const isDefined: typeof import('@vueuse/core')['isDefined']
|
const isDefined: typeof import('@vueuse/core')['isDefined']
|
||||||
const isProxy: typeof import('vue')['isProxy']
|
const isProxy: typeof import('vue')['isProxy']
|
||||||
const isReactive: typeof import('vue')['isReactive']
|
const isReactive: typeof import('vue')['isReactive']
|
||||||
|
@ -65,6 +66,7 @@ declare global {
|
||||||
const onUpdated: typeof import('vue')['onUpdated']
|
const onUpdated: typeof import('vue')['onUpdated']
|
||||||
const pausableWatch: typeof import('@vueuse/core')['pausableWatch']
|
const pausableWatch: typeof import('@vueuse/core')['pausableWatch']
|
||||||
const provide: typeof import('vue')['provide']
|
const provide: typeof import('vue')['provide']
|
||||||
|
const provideLocal: typeof import('@vueuse/core')['provideLocal']
|
||||||
const reactify: typeof import('@vueuse/core')['reactify']
|
const reactify: typeof import('@vueuse/core')['reactify']
|
||||||
const reactifyObject: typeof import('@vueuse/core')['reactifyObject']
|
const reactifyObject: typeof import('@vueuse/core')['reactifyObject']
|
||||||
const reactive: typeof import('vue')['reactive']
|
const reactive: typeof import('vue')['reactive']
|
||||||
|
@ -128,6 +130,7 @@ declare global {
|
||||||
const useBrowserLocation: typeof import('@vueuse/core')['useBrowserLocation']
|
const useBrowserLocation: typeof import('@vueuse/core')['useBrowserLocation']
|
||||||
const useCached: typeof import('@vueuse/core')['useCached']
|
const useCached: typeof import('@vueuse/core')['useCached']
|
||||||
const useClipboard: typeof import('@vueuse/core')['useClipboard']
|
const useClipboard: typeof import('@vueuse/core')['useClipboard']
|
||||||
|
const useClipboardItems: typeof import('@vueuse/core')['useClipboardItems']
|
||||||
const useCloned: typeof import('@vueuse/core')['useCloned']
|
const useCloned: typeof import('@vueuse/core')['useCloned']
|
||||||
const useColorMode: typeof import('@vueuse/core')['useColorMode']
|
const useColorMode: typeof import('@vueuse/core')['useColorMode']
|
||||||
const useConfirmDialog: typeof import('@vueuse/core')['useConfirmDialog']
|
const useConfirmDialog: typeof import('@vueuse/core')['useConfirmDialog']
|
||||||
|
@ -326,6 +329,7 @@ declare module 'vue' {
|
||||||
readonly h: UnwrapRef<typeof import('vue')['h']>
|
readonly h: UnwrapRef<typeof import('vue')['h']>
|
||||||
readonly ignorableWatch: UnwrapRef<typeof import('@vueuse/core')['ignorableWatch']>
|
readonly ignorableWatch: UnwrapRef<typeof import('@vueuse/core')['ignorableWatch']>
|
||||||
readonly inject: UnwrapRef<typeof import('vue')['inject']>
|
readonly inject: UnwrapRef<typeof import('vue')['inject']>
|
||||||
|
readonly injectLocal: UnwrapRef<typeof import('@vueuse/core')['injectLocal']>
|
||||||
readonly isDefined: UnwrapRef<typeof import('@vueuse/core')['isDefined']>
|
readonly isDefined: UnwrapRef<typeof import('@vueuse/core')['isDefined']>
|
||||||
readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
|
readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
|
||||||
readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>
|
readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>
|
||||||
|
@ -355,6 +359,7 @@ declare module 'vue' {
|
||||||
readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
|
readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
|
||||||
readonly pausableWatch: UnwrapRef<typeof import('@vueuse/core')['pausableWatch']>
|
readonly pausableWatch: UnwrapRef<typeof import('@vueuse/core')['pausableWatch']>
|
||||||
readonly provide: UnwrapRef<typeof import('vue')['provide']>
|
readonly provide: UnwrapRef<typeof import('vue')['provide']>
|
||||||
|
readonly provideLocal: UnwrapRef<typeof import('@vueuse/core')['provideLocal']>
|
||||||
readonly reactify: UnwrapRef<typeof import('@vueuse/core')['reactify']>
|
readonly reactify: UnwrapRef<typeof import('@vueuse/core')['reactify']>
|
||||||
readonly reactifyObject: UnwrapRef<typeof import('@vueuse/core')['reactifyObject']>
|
readonly reactifyObject: UnwrapRef<typeof import('@vueuse/core')['reactifyObject']>
|
||||||
readonly reactive: UnwrapRef<typeof import('vue')['reactive']>
|
readonly reactive: UnwrapRef<typeof import('vue')['reactive']>
|
||||||
|
@ -418,6 +423,7 @@ declare module 'vue' {
|
||||||
readonly useBrowserLocation: UnwrapRef<typeof import('@vueuse/core')['useBrowserLocation']>
|
readonly useBrowserLocation: UnwrapRef<typeof import('@vueuse/core')['useBrowserLocation']>
|
||||||
readonly useCached: UnwrapRef<typeof import('@vueuse/core')['useCached']>
|
readonly useCached: UnwrapRef<typeof import('@vueuse/core')['useCached']>
|
||||||
readonly useClipboard: UnwrapRef<typeof import('@vueuse/core')['useClipboard']>
|
readonly useClipboard: UnwrapRef<typeof import('@vueuse/core')['useClipboard']>
|
||||||
|
readonly useClipboardItems: UnwrapRef<typeof import('@vueuse/core')['useClipboardItems']>
|
||||||
readonly useCloned: UnwrapRef<typeof import('@vueuse/core')['useCloned']>
|
readonly useCloned: UnwrapRef<typeof import('@vueuse/core')['useCloned']>
|
||||||
readonly useColorMode: UnwrapRef<typeof import('@vueuse/core')['useColorMode']>
|
readonly useColorMode: UnwrapRef<typeof import('@vueuse/core')['useColorMode']>
|
||||||
readonly useConfirmDialog: UnwrapRef<typeof import('@vueuse/core')['useConfirmDialog']>
|
readonly useConfirmDialog: UnwrapRef<typeof import('@vueuse/core')['useConfirmDialog']>
|
||||||
|
@ -610,6 +616,7 @@ declare module '@vue/runtime-core' {
|
||||||
readonly h: UnwrapRef<typeof import('vue')['h']>
|
readonly h: UnwrapRef<typeof import('vue')['h']>
|
||||||
readonly ignorableWatch: UnwrapRef<typeof import('@vueuse/core')['ignorableWatch']>
|
readonly ignorableWatch: UnwrapRef<typeof import('@vueuse/core')['ignorableWatch']>
|
||||||
readonly inject: UnwrapRef<typeof import('vue')['inject']>
|
readonly inject: UnwrapRef<typeof import('vue')['inject']>
|
||||||
|
readonly injectLocal: UnwrapRef<typeof import('@vueuse/core')['injectLocal']>
|
||||||
readonly isDefined: UnwrapRef<typeof import('@vueuse/core')['isDefined']>
|
readonly isDefined: UnwrapRef<typeof import('@vueuse/core')['isDefined']>
|
||||||
readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
|
readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
|
||||||
readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>
|
readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>
|
||||||
|
@ -639,6 +646,7 @@ declare module '@vue/runtime-core' {
|
||||||
readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
|
readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
|
||||||
readonly pausableWatch: UnwrapRef<typeof import('@vueuse/core')['pausableWatch']>
|
readonly pausableWatch: UnwrapRef<typeof import('@vueuse/core')['pausableWatch']>
|
||||||
readonly provide: UnwrapRef<typeof import('vue')['provide']>
|
readonly provide: UnwrapRef<typeof import('vue')['provide']>
|
||||||
|
readonly provideLocal: UnwrapRef<typeof import('@vueuse/core')['provideLocal']>
|
||||||
readonly reactify: UnwrapRef<typeof import('@vueuse/core')['reactify']>
|
readonly reactify: UnwrapRef<typeof import('@vueuse/core')['reactify']>
|
||||||
readonly reactifyObject: UnwrapRef<typeof import('@vueuse/core')['reactifyObject']>
|
readonly reactifyObject: UnwrapRef<typeof import('@vueuse/core')['reactifyObject']>
|
||||||
readonly reactive: UnwrapRef<typeof import('vue')['reactive']>
|
readonly reactive: UnwrapRef<typeof import('vue')['reactive']>
|
||||||
|
@ -702,6 +710,7 @@ declare module '@vue/runtime-core' {
|
||||||
readonly useBrowserLocation: UnwrapRef<typeof import('@vueuse/core')['useBrowserLocation']>
|
readonly useBrowserLocation: UnwrapRef<typeof import('@vueuse/core')['useBrowserLocation']>
|
||||||
readonly useCached: UnwrapRef<typeof import('@vueuse/core')['useCached']>
|
readonly useCached: UnwrapRef<typeof import('@vueuse/core')['useCached']>
|
||||||
readonly useClipboard: UnwrapRef<typeof import('@vueuse/core')['useClipboard']>
|
readonly useClipboard: UnwrapRef<typeof import('@vueuse/core')['useClipboard']>
|
||||||
|
readonly useClipboardItems: UnwrapRef<typeof import('@vueuse/core')['useClipboardItems']>
|
||||||
readonly useCloned: UnwrapRef<typeof import('@vueuse/core')['useCloned']>
|
readonly useCloned: UnwrapRef<typeof import('@vueuse/core')['useCloned']>
|
||||||
readonly useColorMode: UnwrapRef<typeof import('@vueuse/core')['useColorMode']>
|
readonly useColorMode: UnwrapRef<typeof import('@vueuse/core')['useColorMode']>
|
||||||
readonly useConfirmDialog: UnwrapRef<typeof import('@vueuse/core')['useConfirmDialog']>
|
readonly useConfirmDialog: UnwrapRef<typeof import('@vueuse/core')['useConfirmDialog']>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { describe, expect, it } from 'vitest';
|
import { describe, expect, it } from 'vitest';
|
||||||
import { amountTransferable, neededRate, transferTimeSeconds } from './data-transfer-rate-converter.service';
|
import { amountTransferable, transferSpeedRate, transferTimeSeconds } from './data-transfer-rate-converter.service';
|
||||||
|
|
||||||
describe('data-transfer-converter', () => {
|
describe('data-transfer-converter', () => {
|
||||||
describe('transferTimeSeconds', () => {
|
describe('transferTimeSeconds', () => {
|
||||||
|
@ -12,9 +12,9 @@ describe('data-transfer-converter', () => {
|
||||||
})).toBe(80);
|
})).toBe(80);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
describe('neededRate', () => {
|
describe('transferSpeedRate', () => {
|
||||||
it('compute neededRate', () => {
|
it('compute transferSpeedRate', () => {
|
||||||
expect(neededRate({
|
expect(transferSpeedRate({
|
||||||
dataSize: 100,
|
dataSize: 100,
|
||||||
dataSizeUnit: 'MB',
|
dataSizeUnit: 'MB',
|
||||||
hours: 0,
|
hours: 0,
|
||||||
|
@ -22,6 +22,14 @@ describe('data-transfer-converter', () => {
|
||||||
seconds: 20,
|
seconds: 20,
|
||||||
bitRateUnit: 'Mb',
|
bitRateUnit: 'Mb',
|
||||||
})).toBe(10);
|
})).toBe(10);
|
||||||
|
expect(transferSpeedRate({
|
||||||
|
dataSize: 100,
|
||||||
|
dataSizeUnit: 'MB',
|
||||||
|
hours: 0,
|
||||||
|
minutes: 1,
|
||||||
|
seconds: 20,
|
||||||
|
bitRateUnit: 'MB',
|
||||||
|
})).toBe(1.25);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
describe('amountTransferable', () => {
|
describe('amountTransferable', () => {
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { type AllSupportedUnits, type BitsUnits, convertStorageAndRateUnits } from '../data-storage-unit-converter/data-storage-unit-converter.service';
|
import { type AllSupportedUnits, convertStorageAndRateUnits } from '../data-storage-unit-converter/data-storage-unit-converter.service';
|
||||||
|
|
||||||
export function transferTimeSeconds({
|
export function transferTimeSeconds({
|
||||||
dataSize,
|
dataSize,
|
||||||
|
@ -9,14 +9,14 @@ export function transferTimeSeconds({
|
||||||
dataSize: number
|
dataSize: number
|
||||||
dataSizeUnit: AllSupportedUnits
|
dataSizeUnit: AllSupportedUnits
|
||||||
bitRate: number
|
bitRate: number
|
||||||
bitRateUnit: BitsUnits
|
bitRateUnit: AllSupportedUnits
|
||||||
}): number {
|
}): number {
|
||||||
const dataSizeInBytes = convertStorageAndRateUnits({ value: dataSize, fromUnit: dataSizeUnit, toUnit: 'B' });
|
const dataSizeInBytes = convertStorageAndRateUnits({ value: dataSize, fromUnit: dataSizeUnit, toUnit: 'B' });
|
||||||
const bitRateInBytes = convertStorageAndRateUnits({ value: bitRate, fromUnit: bitRateUnit, toUnit: 'B' });
|
const bitRateInBytes = convertStorageAndRateUnits({ value: bitRate, fromUnit: bitRateUnit, toUnit: 'B' });
|
||||||
return bitRateInBytes > 0 ? dataSizeInBytes / bitRateInBytes : 0;
|
return bitRateInBytes > 0 ? dataSizeInBytes / bitRateInBytes : 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
export function neededRate({
|
export function transferSpeedRate({
|
||||||
dataSize,
|
dataSize,
|
||||||
dataSizeUnit,
|
dataSizeUnit,
|
||||||
hours,
|
hours,
|
||||||
|
@ -29,7 +29,7 @@ export function neededRate({
|
||||||
hours: number
|
hours: number
|
||||||
minutes: number
|
minutes: number
|
||||||
seconds: number
|
seconds: number
|
||||||
bitRateUnit: BitsUnits
|
bitRateUnit: AllSupportedUnits
|
||||||
}): number {
|
}): number {
|
||||||
const dataSizeInBits = convertStorageAndRateUnits({ value: dataSize, fromUnit: dataSizeUnit, toUnit: 'b' });
|
const dataSizeInBits = convertStorageAndRateUnits({ value: dataSize, fromUnit: dataSizeUnit, toUnit: 'b' });
|
||||||
const timeInSeconds = hours * 3600 + minutes * 60 + seconds;
|
const timeInSeconds = hours * 3600 + minutes * 60 + seconds;
|
||||||
|
@ -45,7 +45,7 @@ export function amountTransferable({
|
||||||
dataSizeUnit,
|
dataSizeUnit,
|
||||||
}: {
|
}: {
|
||||||
bitRate: number
|
bitRate: number
|
||||||
bitRateUnit: BitsUnits
|
bitRateUnit: AllSupportedUnits
|
||||||
hours: number
|
hours: number
|
||||||
minutes: number
|
minutes: number
|
||||||
seconds: number
|
seconds: number
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { formatDuration, intervalToDuration } from 'date-fns';
|
import { formatDuration, intervalToDuration } from 'date-fns';
|
||||||
import { type AllSupportedUnits, type BitsUnits, displayStorageAndRateUnits } from '../data-storage-unit-converter/data-storage-unit-converter.service';
|
import { type AllSupportedUnits, displayStorageAndRateUnits } from '../data-storage-unit-converter/data-storage-unit-converter.service';
|
||||||
import { amountTransferable, neededRate, transferTimeSeconds } from './data-transfer-rate-converter.service';
|
import { amountTransferable, transferSpeedRate, transferTimeSeconds } from './data-transfer-rate-converter.service';
|
||||||
|
|
||||||
const allStorateUnits = [
|
const allStorateUnits = [
|
||||||
{ value: 'B', label: 'Bytes (B)' },
|
{ value: 'B', label: 'Bytes (B)' },
|
||||||
|
@ -35,6 +35,8 @@ const allBitsUnits = [
|
||||||
{ value: 'Yb', label: 'Yottabits (Ybit)' },
|
{ value: 'Yb', label: 'Yottabits (Ybit)' },
|
||||||
];
|
];
|
||||||
|
|
||||||
|
const allRateUnits = [...allBitsUnits, ...allStorateUnits];
|
||||||
|
|
||||||
function convertToTimeDisplay(seconds: number) {
|
function convertToTimeDisplay(seconds: number) {
|
||||||
if (seconds === 0) {
|
if (seconds === 0) {
|
||||||
return '0';
|
return '0';
|
||||||
|
@ -59,7 +61,7 @@ const transferTimeOutput = computed(() => {
|
||||||
dataSize: Number(transferTimeInput.value.dataSize),
|
dataSize: Number(transferTimeInput.value.dataSize),
|
||||||
dataSizeUnit: transferTimeInput.value.dataSizeUnit as AllSupportedUnits,
|
dataSizeUnit: transferTimeInput.value.dataSizeUnit as AllSupportedUnits,
|
||||||
bitRate: Number(transferTimeInput.value.bitRate),
|
bitRate: Number(transferTimeInput.value.bitRate),
|
||||||
bitRateUnit: transferTimeInput.value.bitRateUnit as BitsUnits,
|
bitRateUnit: transferTimeInput.value.bitRateUnit as AllSupportedUnits,
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
catch (e: any) {
|
catch (e: any) {
|
||||||
|
@ -67,7 +69,7 @@ const transferTimeOutput = computed(() => {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const neededRateInput = ref<{
|
const transferSpeedRateInput = ref<{
|
||||||
dataSize: string
|
dataSize: string
|
||||||
dataSizeUnit: string
|
dataSizeUnit: string
|
||||||
hours: number
|
hours: number
|
||||||
|
@ -82,18 +84,18 @@ const neededRateInput = ref<{
|
||||||
seconds: 0,
|
seconds: 0,
|
||||||
bitRateUnit: 'Mb',
|
bitRateUnit: 'Mb',
|
||||||
});
|
});
|
||||||
const neededRateOutput = computed(() => {
|
const transferSpeedRateOutput = computed(() => {
|
||||||
try {
|
try {
|
||||||
return displayStorageAndRateUnits({
|
return displayStorageAndRateUnits({
|
||||||
unit: neededRateInput.value.bitRateUnit as BitsUnits,
|
unit: transferSpeedRateInput.value.bitRateUnit as AllSupportedUnits,
|
||||||
appendUnit: true,
|
appendUnit: true,
|
||||||
value: neededRate({
|
value: transferSpeedRate({
|
||||||
dataSize: Number(neededRateInput.value.dataSize),
|
dataSize: Number(transferSpeedRateInput.value.dataSize),
|
||||||
dataSizeUnit: neededRateInput.value.dataSizeUnit as AllSupportedUnits,
|
dataSizeUnit: transferSpeedRateInput.value.dataSizeUnit as AllSupportedUnits,
|
||||||
hours: neededRateInput.value.hours,
|
hours: transferSpeedRateInput.value.hours,
|
||||||
minutes: neededRateInput.value.minutes,
|
minutes: transferSpeedRateInput.value.minutes,
|
||||||
seconds: neededRateInput.value.seconds,
|
seconds: transferSpeedRateInput.value.seconds,
|
||||||
bitRateUnit: neededRateInput.value.bitRateUnit as BitsUnits,
|
bitRateUnit: transferSpeedRateInput.value.bitRateUnit as AllSupportedUnits,
|
||||||
}),
|
}),
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
@ -124,7 +126,7 @@ const amountTransferableOutput = computed(() => {
|
||||||
appendUnit: true,
|
appendUnit: true,
|
||||||
value: amountTransferable({
|
value: amountTransferable({
|
||||||
bitRate: Number(amountTransferableInput.value.bitRate),
|
bitRate: Number(amountTransferableInput.value.bitRate),
|
||||||
bitRateUnit: amountTransferableInput.value.bitRateUnit as BitsUnits,
|
bitRateUnit: amountTransferableInput.value.bitRateUnit as AllSupportedUnits,
|
||||||
hours: amountTransferableInput.value.hours,
|
hours: amountTransferableInput.value.hours,
|
||||||
minutes: amountTransferableInput.value.minutes,
|
minutes: amountTransferableInput.value.minutes,
|
||||||
seconds: amountTransferableInput.value.seconds,
|
seconds: amountTransferableInput.value.seconds,
|
||||||
|
@ -157,7 +159,7 @@ const amountTransferableOutput = computed(() => {
|
||||||
<c-select
|
<c-select
|
||||||
v-model:value="transferTimeInput.bitRateUnit"
|
v-model:value="transferTimeInput.bitRateUnit"
|
||||||
searchable
|
searchable
|
||||||
:options="allBitsUnits"
|
:options="allRateUnits"
|
||||||
placeholder="Select a bit rate unit"
|
placeholder="Select a bit rate unit"
|
||||||
ml-1
|
ml-1
|
||||||
/>
|
/>
|
||||||
|
@ -171,11 +173,11 @@ const amountTransferableOutput = computed(() => {
|
||||||
placeholder="Transfer time will be here..."
|
placeholder="Transfer time will be here..."
|
||||||
/>
|
/>
|
||||||
</c-card>
|
</c-card>
|
||||||
<c-card title="Needed Bit Rate" mb-2>
|
<c-card title="Transfer Bit Rate/Speed" mb-2>
|
||||||
<n-form-item label="Data Size:" label-placement="left">
|
<n-form-item label="Data Size:" label-placement="left">
|
||||||
<n-input v-model:value="neededRateInput.dataSize" placeholder="Data Size..." :min="0" w-full />
|
<n-input v-model:value="transferSpeedRateInput.dataSize" placeholder="Data Size..." :min="0" w-full />
|
||||||
<c-select
|
<c-select
|
||||||
v-model:value="neededRateInput.dataSizeUnit"
|
v-model:value="transferSpeedRateInput.dataSizeUnit"
|
||||||
:options="allStorateUnits"
|
:options="allStorateUnits"
|
||||||
placeholder="Select a storage unit"
|
placeholder="Select a storage unit"
|
||||||
ml-1
|
ml-1
|
||||||
|
@ -183,23 +185,23 @@ const amountTransferableOutput = computed(() => {
|
||||||
</n-form-item>
|
</n-form-item>
|
||||||
|
|
||||||
<n-form-item label="Duration (h/m/s):" label-placement="left">
|
<n-form-item label="Duration (h/m/s):" label-placement="left">
|
||||||
<n-input-number v-model:value="neededRateInput.hours" mr-1 placeholder="Hours" :min="0" w-full />
|
<n-input-number v-model:value="transferSpeedRateInput.hours" mr-1 placeholder="Hours" :min="0" w-full />
|
||||||
<n-input-number v-model:value="neededRateInput.minutes" mr-1 placeholder="Minutes" :min="0" w-full />
|
<n-input-number v-model:value="transferSpeedRateInput.minutes" mr-1 placeholder="Minutes" :min="0" w-full />
|
||||||
<n-input-number v-model:value="neededRateInput.seconds" mr-1 placeholder="Seconds" :min="0" w-full />
|
<n-input-number v-model:value="transferSpeedRateInput.seconds" mr-1 placeholder="Seconds" :min="0" w-full />
|
||||||
</n-form-item>
|
</n-form-item>
|
||||||
|
|
||||||
<n-divider />
|
<n-divider />
|
||||||
|
|
||||||
<div flex items-baseline gap-2>
|
<div flex items-baseline gap-2>
|
||||||
<InputCopyable
|
<InputCopyable
|
||||||
label="Needed Bit Rate:"
|
label="Transfer Bit Rate/Speed:"
|
||||||
label-position="left"
|
label-position="left"
|
||||||
:value="neededRateOutput"
|
:value="transferSpeedRateOutput"
|
||||||
placeholder="Needed Bit Rate will be here..."
|
placeholder="Bit Rate will be here..."
|
||||||
/>
|
/>
|
||||||
<c-select
|
<c-select
|
||||||
v-model:value="transferTimeInput.bitRateUnit"
|
v-model:value="transferSpeedRateInput.bitRateUnit"
|
||||||
:options="allBitsUnits"
|
:options="allRateUnits"
|
||||||
placeholder="Select a bit rate unit"
|
placeholder="Select a bit rate unit"
|
||||||
ml-1
|
ml-1
|
||||||
/>
|
/>
|
||||||
|
@ -210,7 +212,7 @@ const amountTransferableOutput = computed(() => {
|
||||||
<n-input v-model:value="amountTransferableInput.bitRate" placeholder="Bit Rate..." :min="0" w-full />
|
<n-input v-model:value="amountTransferableInput.bitRate" placeholder="Bit Rate..." :min="0" w-full />
|
||||||
<c-select
|
<c-select
|
||||||
v-model:value="amountTransferableInput.bitRateUnit"
|
v-model:value="amountTransferableInput.bitRateUnit"
|
||||||
:options="allBitsUnits"
|
:options="allRateUnits"
|
||||||
placeholder="Select a bit rate unit"
|
placeholder="Select a bit rate unit"
|
||||||
ml-1
|
ml-1
|
||||||
/>
|
/>
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue