Files
raven-client/ayanova/src/components/report-selector-control.vue
2020-04-09 22:58:18 +00:00

102 lines
2.4 KiB
Vue

<template>
<v-row justify="center">
<!-- :max-width="options.width" -->
<v-dialog
scrollable
max-width="600px"
v-model="isVisible"
@keydown.esc="cancel"
:data-cy="!!$ay.dev ? 'reportselector' : false"
>
<v-card elevation="24">
<v-card-title class="headline lighten-2" primary-title>
<span> {{ $ay.t("Report") }} </span>
</v-card-title>
<v-card-text style="height: 500px;">
<v-radio-group v-model="selectedReport" column>
<template v-for="item in reportList">
<v-radio
:label="item.name"
:value="item"
:key="item.id"
color="accent"
class="mt-1"
></v-radio>
</template>
</v-radio-group>
</v-card-text>
<!-- <v-divider></v-divider> v-bind:class="options.type" -->
<v-card-actions>
<v-spacer></v-spacer>
<v-btn
color="primary darken-1"
text
@click.native="cancel"
:data-cy="!!$ay.dev ? 'reportselector:cancel' : false"
>{{ $ay.t("Cancel") }}</v-btn
>
<v-btn
color="primary darken-1"
text
@click.native="ok"
:data-cy="!!$ay.dev ? 'reportselector:ok' : false"
>{{ $ay.t("OK") }}</v-btn
>
</v-card-actions>
</v-card>
</v-dialog>
</v-row>
</template>
<script>
export default {
data: () => ({
isVisible: false,
resolve: null,
reject: null,
options: {
width: 290,
zIndex: 200
},
reportList: [],
selectedReport: null
}),
props: {
ayaType: {
type: Number,
default: 0
}
},
methods: {
open() {
//get report list from server
//for now we'll fake it
let fakeReportList = [];
for (let i = 0; i < 25; i++) {
fakeReportList.push({
name: "Fake report with the number " + i,
id: i
});
}
this.reportList = fakeReportList;
this.isVisible = true;
return new Promise((resolve, reject) => {
this.resolve = resolve;
this.reject = reject;
});
},
ok() {
this.isVisible = false;
this.resolve(this.selectedReport);
},
cancel() {
this.isVisible = false;
this.resolve(null);
}
}
};
</script>