mirror of
https://github.com/freqtrade/frequi.git
synced 2024-09-20 17:41:08 +00:00
script setup - more components
This commit is contained in:
parent
bfef0ab83d
commit
8782b37be1
|
@ -79,23 +79,11 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script setup lang="ts">
|
||||||
import { formatPercent, formatPriceCurrency } from '@/shared/formatters';
|
import { formatPercent, formatPriceCurrency } from '@/shared/formatters';
|
||||||
import DateTimeTZ from '@/components/general/DateTimeTZ.vue';
|
import DateTimeTZ from '@/components/general/DateTimeTZ.vue';
|
||||||
|
|
||||||
import { defineComponent } from 'vue';
|
|
||||||
import { useBotStore } from '@/stores/ftbotwrapper';
|
import { useBotStore } from '@/stores/ftbotwrapper';
|
||||||
|
|
||||||
export default defineComponent({
|
const botStore = useBotStore();
|
||||||
name: 'BotStatus',
|
|
||||||
components: { DateTimeTZ },
|
|
||||||
setup() {
|
|
||||||
const botStore = useBotStore();
|
|
||||||
return {
|
|
||||||
formatPercent,
|
|
||||||
formatPriceCurrency,
|
|
||||||
botStore,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
});
|
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -5,33 +5,23 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script setup lang="ts">
|
||||||
import { useBotStore } from '@/stores/ftbotwrapper';
|
import { useBotStore } from '@/stores/ftbotwrapper';
|
||||||
import { defineComponent, onMounted, computed } from 'vue';
|
import { onMounted, computed } from 'vue';
|
||||||
|
|
||||||
export default defineComponent({
|
const botStore = useBotStore();
|
||||||
name: 'LogViewer',
|
|
||||||
setup() {
|
|
||||||
const botStore = useBotStore();
|
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
botStore.activeBot.getLogs();
|
botStore.activeBot.getLogs();
|
||||||
});
|
});
|
||||||
|
|
||||||
const formattedLogs = computed(() => {
|
const formattedLogs = computed(() => {
|
||||||
let result = '';
|
let result = '';
|
||||||
for (let i = 0, len = botStore.activeBot.lastLogs.length; i < len; i += 1) {
|
for (let i = 0, len = botStore.activeBot.lastLogs.length; i < len; i += 1) {
|
||||||
const log = botStore.activeBot.lastLogs[i];
|
const log = botStore.activeBot.lastLogs[i];
|
||||||
result += `${log[0]} - ${log[2]} - ${log[3]} - ${log[4]}\n`;
|
result += `${log[0]} - ${log[2]} - ${log[3]} - ${log[4]}\n`;
|
||||||
}
|
}
|
||||||
return result;
|
return result;
|
||||||
});
|
|
||||||
|
|
||||||
return {
|
|
||||||
botStore,
|
|
||||||
formattedLogs,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -17,27 +17,17 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script setup lang="ts">
|
||||||
import { defineComponent, computed } from 'vue';
|
import { computed } from 'vue';
|
||||||
import { useBotStore } from '@/stores/ftbotwrapper';
|
import { useBotStore } from '@/stores/ftbotwrapper';
|
||||||
|
|
||||||
export default defineComponent({
|
const botStore = useBotStore();
|
||||||
name: 'ReloadControl',
|
const autoRefreshLoc = computed({
|
||||||
setup() {
|
get() {
|
||||||
const botStore = useBotStore();
|
return botStore.globalAutoRefresh;
|
||||||
const autoRefreshLoc = computed({
|
},
|
||||||
get() {
|
set(newValue: boolean) {
|
||||||
return botStore.globalAutoRefresh;
|
botStore.setGlobalAutoRefresh(newValue);
|
||||||
},
|
|
||||||
set(newValue: boolean) {
|
|
||||||
botStore.setGlobalAutoRefresh(newValue);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
return {
|
|
||||||
botStore,
|
|
||||||
autoRefreshLoc,
|
|
||||||
};
|
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -128,25 +128,16 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script setup lang="ts">
|
||||||
import { formatPercent, formatPriceCurrency, formatPrice, timestampms } from '@/shared/formatters';
|
import { formatPercent, formatPriceCurrency, formatPrice, timestampms } from '@/shared/formatters';
|
||||||
import ValuePair from '@/components/general/ValuePair.vue';
|
import ValuePair from '@/components/general/ValuePair.vue';
|
||||||
import TradeProfit from '@/components/ftbot/TradeProfit.vue';
|
import TradeProfit from '@/components/ftbot/TradeProfit.vue';
|
||||||
import DateTimeTZ from '@/components/general/DateTimeTZ.vue';
|
import DateTimeTZ from '@/components/general/DateTimeTZ.vue';
|
||||||
import { Trade } from '@/types';
|
import { Trade } from '@/types';
|
||||||
|
|
||||||
import { defineComponent } from 'vue';
|
defineProps({
|
||||||
|
trade: { required: true, type: Object as () => Trade },
|
||||||
export default defineComponent({
|
stakeCurrency: { required: true, type: String },
|
||||||
name: 'TradeDetail',
|
|
||||||
components: { ValuePair, TradeProfit, DateTimeTZ },
|
|
||||||
props: {
|
|
||||||
trade: { required: true, type: Object as () => Trade },
|
|
||||||
stakeCurrency: { required: true, type: String },
|
|
||||||
},
|
|
||||||
setup() {
|
|
||||||
return { timestampms, formatPercent, formatPrice, formatPriceCurrency };
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
|
|
@ -2,40 +2,34 @@
|
||||||
<span :title="timezoneTooltip">{{ formattedDate }}</span>
|
<span :title="timezoneTooltip">{{ formattedDate }}</span>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script setup lang="ts">
|
||||||
import { timestampms, timestampmsWithTimezone, timestampToDateString } from '@/shared/formatters';
|
import { timestampms, timestampmsWithTimezone, timestampToDateString } from '@/shared/formatters';
|
||||||
|
|
||||||
import { defineComponent, computed } from 'vue';
|
import { computed } from 'vue';
|
||||||
|
|
||||||
export default defineComponent({
|
const props = defineProps({
|
||||||
name: 'DateTimeTZ',
|
date: { required: true, type: Number },
|
||||||
props: {
|
showTimezone: { required: false, type: Boolean, default: false },
|
||||||
date: { required: true, type: Number },
|
dateOnly: { required: false, type: Boolean, default: false },
|
||||||
showTimezone: { required: false, type: Boolean, default: false },
|
});
|
||||||
dateOnly: { required: false, type: Boolean, default: false },
|
const formattedDate = computed((): string => {
|
||||||
},
|
if (props.dateOnly) {
|
||||||
setup(props) {
|
return timestampToDateString(props.date);
|
||||||
const formattedDate = computed((): string => {
|
}
|
||||||
if (props.dateOnly) {
|
if (props.showTimezone) {
|
||||||
return timestampToDateString(props.date);
|
return timestampmsWithTimezone(props.date);
|
||||||
}
|
}
|
||||||
if (props.showTimezone) {
|
return timestampms(props.date);
|
||||||
return timestampmsWithTimezone(props.date);
|
});
|
||||||
}
|
|
||||||
return timestampms(props.date);
|
|
||||||
});
|
|
||||||
|
|
||||||
const timezoneTooltip = computed((): string => {
|
const timezoneTooltip = computed((): string => {
|
||||||
const time1 = timestampmsWithTimezone(props.date);
|
const time1 = timestampmsWithTimezone(props.date);
|
||||||
const timeUTC = timestampmsWithTimezone(props.date, 'UTC');
|
const timeUTC = timestampmsWithTimezone(props.date, 'UTC');
|
||||||
if (time1 === timeUTC) {
|
if (time1 === timeUTC) {
|
||||||
return timeUTC;
|
return timeUTC;
|
||||||
}
|
}
|
||||||
|
|
||||||
return `${time1}\n${timeUTC}`;
|
return `${time1}\n${timeUTC}`;
|
||||||
});
|
|
||||||
return { formattedDate, timezoneTooltip };
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -10,20 +10,14 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script setup lang="ts">
|
||||||
import InfoBox from '@/components/general/InfoBox.vue';
|
import InfoBox from '@/components/general/InfoBox.vue';
|
||||||
|
|
||||||
import { defineComponent } from 'vue';
|
defineProps({
|
||||||
|
description: { type: String, required: true },
|
||||||
export default defineComponent({
|
help: { type: String, default: '', required: false },
|
||||||
name: 'ValuePair',
|
classLabel: { type: String, default: 'col-4 fw-bold mb-0' },
|
||||||
components: { InfoBox },
|
classValue: { type: String, default: 'col-8' },
|
||||||
props: {
|
|
||||||
description: { type: String, required: true },
|
|
||||||
help: { type: String, default: '', required: false },
|
|
||||||
classLabel: { type: String, default: 'col-4 fw-bold mb-0' },
|
|
||||||
classValue: { type: String, default: 'col-8' },
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
@ -4,14 +4,8 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script setup lang="ts">
|
||||||
import { defineComponent } from 'vue';
|
|
||||||
import LogViewer from '@/components/ftbot/LogViewer.vue';
|
import LogViewer from '@/components/ftbot/LogViewer.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
|
||||||
name: 'LogView',
|
|
||||||
components: { LogViewer },
|
|
||||||
});
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped></style>
|
<style scoped></style>
|
||||||
|
|
|
@ -40,29 +40,15 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script setup lang="ts">
|
||||||
import CustomTradeList from '@/components/ftbot/CustomTradeList.vue';
|
import CustomTradeList from '@/components/ftbot/CustomTradeList.vue';
|
||||||
import TradeDetail from '@/components/ftbot/TradeDetail.vue';
|
import TradeDetail from '@/components/ftbot/TradeDetail.vue';
|
||||||
import { useBotStore } from '@/stores/ftbotwrapper';
|
import { useBotStore } from '@/stores/ftbotwrapper';
|
||||||
import { defineComponent } from 'vue';
|
|
||||||
|
|
||||||
export default defineComponent({
|
defineProps({
|
||||||
name: 'TradesList',
|
history: { default: false, type: Boolean },
|
||||||
components: {
|
|
||||||
CustomTradeList,
|
|
||||||
TradeDetail,
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
history: { default: false, type: Boolean },
|
|
||||||
},
|
|
||||||
setup() {
|
|
||||||
const botStore = useBotStore();
|
|
||||||
|
|
||||||
return {
|
|
||||||
botStore,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
|
const botStore = useBotStore();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped></style>
|
<style scoped></style>
|
||||||
|
|
Loading…
Reference in New Issue
Block a user