73 lines
1.7 KiB
Vue
73 lines
1.7 KiB
Vue
|
<template>
|
||
|
<q-dialog v-model="show_dialog">
|
||
|
<q-card
|
||
|
class="overflow-hidden"
|
||
|
style="overflow-y: scroll; max-width: 60vw; max-height: 40vh"
|
||
|
>
|
||
|
<q-card-section style="width: 30vw; height: 10vh">
|
||
|
<q-item>
|
||
|
<q-item-section avatar>{{ $t("volume") }} :</q-item-section>
|
||
|
<q-item-section>
|
||
|
<q-slider
|
||
|
v-model="volume"
|
||
|
:min="0"
|
||
|
:max="100"
|
||
|
label
|
||
|
label-always
|
||
|
@change="volume_changed"
|
||
|
/>
|
||
|
</q-item-section>
|
||
|
</q-item>
|
||
|
</q-card-section>
|
||
|
</q-card>
|
||
|
</q-dialog>
|
||
|
</template>
|
||
|
|
||
|
<style scoped></style>
|
||
|
|
||
|
<script lang="ts">
|
||
|
import { defineComponent, ref, watch, computed } from "vue";
|
||
|
import { useStore } from "src/store";
|
||
|
import { useQuasar, date, copyToClipboard } from "quasar";
|
||
|
import { useI18n } from "vue-i18n";
|
||
|
import GlobalData from "src/common/GlobalData";
|
||
|
|
||
|
export default defineComponent({
|
||
|
name: "EditVolumeDialog",
|
||
|
|
||
|
setup() {
|
||
|
let $store = useStore();
|
||
|
let $q = useQuasar();
|
||
|
let $t = useI18n();
|
||
|
|
||
|
let show_dialog = ref(false);
|
||
|
let loading = ref(false);
|
||
|
let volume = ref(0);
|
||
|
|
||
|
let window_id = 0;
|
||
|
return {
|
||
|
loading,
|
||
|
show_dialog,
|
||
|
volume,
|
||
|
|
||
|
showDialog(_window_id: number, _volume: number) {
|
||
|
if (_volume < 0) {
|
||
|
_volume = 0;
|
||
|
}
|
||
|
if (_volume > 100) {
|
||
|
_volume = 100;
|
||
|
}
|
||
|
window_id = _window_id;
|
||
|
volume.value = _volume;
|
||
|
show_dialog.value = true;
|
||
|
},
|
||
|
volume_changed(val: number) {
|
||
|
GlobalData.getInstance()
|
||
|
.getCurrentClient()
|
||
|
?.setWindowVolume(window_id, volume.value);
|
||
|
},
|
||
|
};
|
||
|
},
|
||
|
});
|
||
|
</script>
|