script setup: TimeframeSelect

This commit is contained in:
Matthias 2023-05-09 19:55:12 +02:00
parent 50df3c2ea5
commit bfef0ab83d

View File

@ -7,62 +7,50 @@
></b-form-select>
</template>
<script lang="ts">
import { defineComponent, computed, ref } from 'vue';
<script setup lang="ts">
import { computed, ref } from 'vue';
export default defineComponent({
name: 'TimefameSelect',
props: {
value: { default: '', type: String },
belowTimeframe: { required: false, default: '', type: String },
},
emits: ['input'],
setup(props, { emit }) {
const selectedTimeframe = ref('');
// The below list must always remain sorted correctly!
const availableTimeframesBase = [
// Placeholder value
{ value: '', text: 'Use strategy default' },
'1m',
'3m',
'5m',
'15m',
'30m',
'1h',
'2h',
'4h',
'6h',
'8h',
'12h',
'1d',
'3d',
'1w',
'2w',
'1M',
'1y',
];
const availableTimeframes = computed(() => {
if (!props.belowTimeframe) {
return availableTimeframesBase;
}
const idx = availableTimeframesBase.findIndex((v) => v === props.belowTimeframe);
return [...availableTimeframesBase].splice(0, idx);
});
const emitSelectedTimeframe = () => {
emit('input', selectedTimeframe.value);
};
return {
availableTimeframesBase,
availableTimeframes,
emitSelectedTimeframe,
selectedTimeframe,
};
},
const props = defineProps({
value: { default: '', type: String },
belowTimeframe: { required: false, default: '', type: String },
});
const emit = defineEmits(['input']);
const selectedTimeframe = ref('');
// The below list must always remain sorted correctly!
const availableTimeframesBase = [
// Placeholder value
{ value: '', text: 'Use strategy default' },
'1m',
'3m',
'5m',
'15m',
'30m',
'1h',
'2h',
'4h',
'6h',
'8h',
'12h',
'1d',
'3d',
'1w',
'2w',
'1M',
'1y',
];
const availableTimeframes = computed(() => {
if (!props.belowTimeframe) {
return availableTimeframesBase;
}
const idx = availableTimeframesBase.findIndex((v) => v === props.belowTimeframe);
return [...availableTimeframesBase].splice(0, idx);
});
const emitSelectedTimeframe = () => {
emit('input', selectedTimeframe.value);
};
</script>
<style scoped></style>