mirror of
https://github.com/freqtrade/frequi.git
synced 2024-11-26 21:15:15 +00:00
plotconfig -> script setup
This commit is contained in:
parent
2510b1f2d4
commit
bfb594800b
|
@ -119,219 +119,191 @@
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script setup lang="ts">
|
||||||
import { PlotConfig, EMPTY_PLOTCONFIG, IndicatorConfig } from '@/types';
|
import { PlotConfig, EMPTY_PLOTCONFIG, IndicatorConfig } from '@/types';
|
||||||
import { getCustomPlotConfig } from '@/shared/storage';
|
import { getCustomPlotConfig } from '@/shared/storage';
|
||||||
import PlotIndicator from '@/components/charts/PlotIndicator.vue';
|
import PlotIndicator from '@/components/charts/PlotIndicator.vue';
|
||||||
import { showAlert } from '@/stores/alerts';
|
import { showAlert } from '@/stores/alerts';
|
||||||
|
|
||||||
import { defineComponent, computed, ref, onMounted } from 'vue';
|
import { computed, ref, onMounted } from 'vue';
|
||||||
import { useBotStore } from '@/stores/ftbotwrapper';
|
import { useBotStore } from '@/stores/ftbotwrapper';
|
||||||
import { usePlotConfigStore } from '@/stores/plotConfig';
|
import { usePlotConfigStore } from '@/stores/plotConfig';
|
||||||
|
|
||||||
export default defineComponent({
|
defineProps({
|
||||||
name: 'PlotConfigurator',
|
columns: { required: true, type: Array as () => string[] },
|
||||||
components: { PlotIndicator },
|
asModal: { required: false, default: true, type: Boolean },
|
||||||
props: {
|
});
|
||||||
columns: { required: true, type: Array as () => string[] },
|
|
||||||
asModal: { required: false, default: true, type: Boolean },
|
|
||||||
},
|
|
||||||
setup() {
|
|
||||||
const plotStore = usePlotConfigStore();
|
|
||||||
|
|
||||||
const plotConfig = ref<PlotConfig>(EMPTY_PLOTCONFIG);
|
const plotStore = usePlotConfigStore();
|
||||||
|
|
||||||
const plotConfigNameLoc = ref('default');
|
const plotConfig = ref<PlotConfig>(EMPTY_PLOTCONFIG);
|
||||||
const newSubplotName = ref('');
|
|
||||||
const selIndicatorName = ref('');
|
|
||||||
const addNewIndicator = ref(false);
|
|
||||||
const showConfig = ref(false);
|
|
||||||
const selSubPlot = ref('main_plot');
|
|
||||||
const tempPlotConfig = ref<PlotConfig>();
|
|
||||||
const tempPlotConfigValid = ref(true);
|
|
||||||
|
|
||||||
const isMainPlot = computed(() => {
|
const plotConfigNameLoc = ref('default');
|
||||||
return selSubPlot.value === 'main_plot';
|
const newSubplotName = ref('');
|
||||||
});
|
const selIndicatorName = ref('');
|
||||||
|
const addNewIndicator = ref(false);
|
||||||
|
const showConfig = ref(false);
|
||||||
|
const selSubPlot = ref('main_plot');
|
||||||
|
const tempPlotConfig = ref<PlotConfig>();
|
||||||
|
const tempPlotConfigValid = ref(true);
|
||||||
|
|
||||||
const currentPlotConfig = computed(() => {
|
const isMainPlot = computed(() => {
|
||||||
if (isMainPlot.value) {
|
return selSubPlot.value === 'main_plot';
|
||||||
return plotConfig.value.main_plot;
|
});
|
||||||
}
|
|
||||||
|
|
||||||
return plotConfig.value.subplots[selSubPlot.value];
|
const currentPlotConfig = computed(() => {
|
||||||
});
|
if (isMainPlot.value) {
|
||||||
const subplots = computed((): string[] => {
|
return plotConfig.value.main_plot;
|
||||||
// Subplot keys (for selection window)
|
}
|
||||||
return ['main_plot', ...Object.keys(plotConfig.value.subplots)];
|
|
||||||
});
|
|
||||||
const usedColumns = computed((): string[] => {
|
|
||||||
if (isMainPlot.value) {
|
|
||||||
return Object.keys(plotConfig.value.main_plot);
|
|
||||||
}
|
|
||||||
if (selSubPlot.value in plotConfig.value.subplots) {
|
|
||||||
return Object.keys(plotConfig.value.subplots[selSubPlot.value]);
|
|
||||||
}
|
|
||||||
return [];
|
|
||||||
});
|
|
||||||
|
|
||||||
const addIndicator = (newIndicator: Record<string, IndicatorConfig>) => {
|
return plotConfig.value.subplots[selSubPlot.value];
|
||||||
console.log(plotConfig.value);
|
});
|
||||||
|
const subplots = computed((): string[] => {
|
||||||
|
// Subplot keys (for selection window)
|
||||||
|
return ['main_plot', ...Object.keys(plotConfig.value.subplots)];
|
||||||
|
});
|
||||||
|
const usedColumns = computed((): string[] => {
|
||||||
|
if (isMainPlot.value) {
|
||||||
|
return Object.keys(plotConfig.value.main_plot);
|
||||||
|
}
|
||||||
|
if (selSubPlot.value in plotConfig.value.subplots) {
|
||||||
|
return Object.keys(plotConfig.value.subplots[selSubPlot.value]);
|
||||||
|
}
|
||||||
|
return [];
|
||||||
|
});
|
||||||
|
|
||||||
// const { plotConfig.value } = this;
|
const addIndicator = (newIndicator: Record<string, IndicatorConfig>) => {
|
||||||
const name = Object.keys(newIndicator)[0];
|
console.log(plotConfig.value);
|
||||||
const indicator = newIndicator[name];
|
|
||||||
if (isMainPlot.value) {
|
|
||||||
console.log(`Adding ${name} to MainPlot`);
|
|
||||||
plotConfig.value.main_plot[name] = { ...indicator };
|
|
||||||
} else {
|
|
||||||
console.log(`Adding ${name} to ${selSubPlot.value}`);
|
|
||||||
plotConfig.value.subplots[selSubPlot.value][name] = { ...indicator };
|
|
||||||
}
|
|
||||||
|
|
||||||
plotConfig.value = { ...plotConfig.value };
|
// const { plotConfig.value } = this;
|
||||||
// Reset random color
|
const name = Object.keys(newIndicator)[0];
|
||||||
addNewIndicator.value = false;
|
const indicator = newIndicator[name];
|
||||||
plotStore.setPlotConfig(plotConfig.value);
|
if (isMainPlot.value) {
|
||||||
};
|
console.log(`Adding ${name} to MainPlot`);
|
||||||
|
plotConfig.value.main_plot[name] = { ...indicator };
|
||||||
|
} else {
|
||||||
|
console.log(`Adding ${name} to ${selSubPlot.value}`);
|
||||||
|
plotConfig.value.subplots[selSubPlot.value][name] = { ...indicator };
|
||||||
|
}
|
||||||
|
|
||||||
const selIndicator = computed({
|
plotConfig.value = { ...plotConfig.value };
|
||||||
get() {
|
// Reset random color
|
||||||
if (addNewIndicator.value) {
|
addNewIndicator.value = false;
|
||||||
return {};
|
plotStore.setPlotConfig(plotConfig.value);
|
||||||
}
|
};
|
||||||
if (selIndicatorName.value) {
|
|
||||||
return {
|
|
||||||
[selIndicatorName.value]: currentPlotConfig.value[selIndicatorName.value],
|
|
||||||
};
|
|
||||||
}
|
|
||||||
return {};
|
|
||||||
},
|
|
||||||
set(newValue: Record<string, IndicatorConfig>) {
|
|
||||||
// console.log('newValue', newValue);
|
|
||||||
const name = Object.keys(newValue)[0];
|
|
||||||
// this.currentPlotConfig[this.selIndicatorName] = { ...newValue[name] };
|
|
||||||
// this.emitPlotConfig();
|
|
||||||
if (name && newValue) {
|
|
||||||
addIndicator(newValue);
|
|
||||||
} else {
|
|
||||||
addNewIndicator.value = false;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const plotConfigJson = computed({
|
const selIndicator = computed({
|
||||||
get() {
|
get() {
|
||||||
return JSON.stringify(plotConfig.value, null, 2);
|
if (addNewIndicator.value) {
|
||||||
},
|
return {};
|
||||||
set(newValue: string) {
|
}
|
||||||
try {
|
if (selIndicatorName.value) {
|
||||||
tempPlotConfig.value = JSON.parse(newValue);
|
return {
|
||||||
// TODO: Should Validate schema validity (should be PlotConfig type...)
|
[selIndicatorName.value]: currentPlotConfig.value[selIndicatorName.value],
|
||||||
tempPlotConfigValid.value = true;
|
|
||||||
} catch (err) {
|
|
||||||
tempPlotConfigValid.value = false;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
const removeIndicator = () => {
|
|
||||||
console.log(plotConfig.value);
|
|
||||||
// const { plotConfig } = this;
|
|
||||||
if (isMainPlot.value) {
|
|
||||||
console.log(`Removing ${selIndicatorName.value} from MainPlot`);
|
|
||||||
delete plotConfig.value.main_plot[selIndicatorName.value];
|
|
||||||
} else {
|
|
||||||
console.log(`Removing ${selIndicatorName.value} from ${selSubPlot.value}`);
|
|
||||||
delete plotConfig.value.subplots[selSubPlot.value][selIndicatorName.value];
|
|
||||||
}
|
|
||||||
|
|
||||||
plotConfig.value = { ...plotConfig.value };
|
|
||||||
console.log(plotConfig.value);
|
|
||||||
selIndicatorName.value = '';
|
|
||||||
plotStore.setPlotConfig(plotConfig.value);
|
|
||||||
};
|
|
||||||
const addSubplot = () => {
|
|
||||||
plotConfig.value.subplots = {
|
|
||||||
...plotConfig.value.subplots,
|
|
||||||
[newSubplotName.value]: {},
|
|
||||||
};
|
};
|
||||||
selSubPlot.value = newSubplotName.value;
|
}
|
||||||
newSubplotName.value = '';
|
return {};
|
||||||
|
|
||||||
plotStore.setPlotConfig(plotConfig.value);
|
|
||||||
};
|
|
||||||
|
|
||||||
const delSubplot = () => {
|
|
||||||
delete plotConfig.value.subplots[selSubPlot.value];
|
|
||||||
plotConfig.value.subplots = { ...plotConfig.value.subplots };
|
|
||||||
selSubPlot.value = '';
|
|
||||||
plotStore.setPlotConfig(plotConfig.value);
|
|
||||||
};
|
|
||||||
const loadPlotConfig = () => {
|
|
||||||
plotConfig.value = getCustomPlotConfig(plotConfigNameLoc.value);
|
|
||||||
console.log(plotConfig.value);
|
|
||||||
console.log('loading config');
|
|
||||||
plotStore.setPlotConfig(plotConfig.value);
|
|
||||||
};
|
|
||||||
|
|
||||||
const loadConfigFromString = () => {
|
|
||||||
// this.plotConfig = JSON.parse();
|
|
||||||
if (tempPlotConfig.value !== undefined && tempPlotConfigValid.value) {
|
|
||||||
plotConfig.value = tempPlotConfig.value;
|
|
||||||
plotStore.setPlotConfig(plotConfig.value);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
const resetConfig = () => {
|
|
||||||
plotConfig.value = { ...EMPTY_PLOTCONFIG };
|
|
||||||
};
|
|
||||||
const loadPlotConfigFromStrategy = async () => {
|
|
||||||
try {
|
|
||||||
const botStore = useBotStore();
|
|
||||||
await botStore.activeBot.getStrategyPlotConfig();
|
|
||||||
if (botStore.activeBot.strategyPlotConfig) {
|
|
||||||
plotConfig.value = botStore.activeBot.strategyPlotConfig;
|
|
||||||
plotStore.setPlotConfig(plotConfig.value);
|
|
||||||
}
|
|
||||||
} catch (data) {
|
|
||||||
//
|
|
||||||
showAlert('Failed to load Plot configuration from Strategy.');
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
const savePlotConfig = () => {
|
|
||||||
plotStore.saveCustomPlotConfig({ [plotConfigNameLoc.value]: plotConfig.value });
|
|
||||||
};
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
// console.log('Config Mounted', props.value);
|
|
||||||
plotConfig.value = plotStore.plotConfig;
|
|
||||||
plotConfigNameLoc.value = plotStore.plotConfigName;
|
|
||||||
});
|
|
||||||
|
|
||||||
return {
|
|
||||||
plotStore,
|
|
||||||
removeIndicator,
|
|
||||||
addSubplot,
|
|
||||||
delSubplot,
|
|
||||||
loadPlotConfig,
|
|
||||||
loadConfigFromString,
|
|
||||||
resetConfig,
|
|
||||||
loadPlotConfigFromStrategy,
|
|
||||||
savePlotConfig,
|
|
||||||
showConfig,
|
|
||||||
addNewIndicator,
|
|
||||||
selIndicatorName,
|
|
||||||
usedColumns,
|
|
||||||
selSubPlot,
|
|
||||||
newSubplotName,
|
|
||||||
subplots,
|
|
||||||
plotConfigNameLoc,
|
|
||||||
selIndicator,
|
|
||||||
plotConfigJson,
|
|
||||||
tempPlotConfigValid,
|
|
||||||
};
|
|
||||||
},
|
},
|
||||||
|
set(newValue: Record<string, IndicatorConfig>) {
|
||||||
|
// console.log('newValue', newValue);
|
||||||
|
const name = Object.keys(newValue)[0];
|
||||||
|
// this.currentPlotConfig[this.selIndicatorName] = { ...newValue[name] };
|
||||||
|
// this.emitPlotConfig();
|
||||||
|
if (name && newValue) {
|
||||||
|
addIndicator(newValue);
|
||||||
|
} else {
|
||||||
|
addNewIndicator.value = false;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const plotConfigJson = computed({
|
||||||
|
get() {
|
||||||
|
return JSON.stringify(plotConfig.value, null, 2);
|
||||||
|
},
|
||||||
|
set(newValue: string) {
|
||||||
|
try {
|
||||||
|
tempPlotConfig.value = JSON.parse(newValue);
|
||||||
|
// TODO: Should Validate schema validity (should be PlotConfig type...)
|
||||||
|
tempPlotConfigValid.value = true;
|
||||||
|
} catch (err) {
|
||||||
|
tempPlotConfigValid.value = false;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const removeIndicator = () => {
|
||||||
|
console.log(plotConfig.value);
|
||||||
|
// const { plotConfig } = this;
|
||||||
|
if (isMainPlot.value) {
|
||||||
|
console.log(`Removing ${selIndicatorName.value} from MainPlot`);
|
||||||
|
delete plotConfig.value.main_plot[selIndicatorName.value];
|
||||||
|
} else {
|
||||||
|
console.log(`Removing ${selIndicatorName.value} from ${selSubPlot.value}`);
|
||||||
|
delete plotConfig.value.subplots[selSubPlot.value][selIndicatorName.value];
|
||||||
|
}
|
||||||
|
|
||||||
|
plotConfig.value = { ...plotConfig.value };
|
||||||
|
console.log(plotConfig.value);
|
||||||
|
selIndicatorName.value = '';
|
||||||
|
plotStore.setPlotConfig(plotConfig.value);
|
||||||
|
};
|
||||||
|
const addSubplot = () => {
|
||||||
|
plotConfig.value.subplots = {
|
||||||
|
...plotConfig.value.subplots,
|
||||||
|
[newSubplotName.value]: {},
|
||||||
|
};
|
||||||
|
selSubPlot.value = newSubplotName.value;
|
||||||
|
newSubplotName.value = '';
|
||||||
|
|
||||||
|
plotStore.setPlotConfig(plotConfig.value);
|
||||||
|
};
|
||||||
|
|
||||||
|
const delSubplot = () => {
|
||||||
|
delete plotConfig.value.subplots[selSubPlot.value];
|
||||||
|
plotConfig.value.subplots = { ...plotConfig.value.subplots };
|
||||||
|
selSubPlot.value = '';
|
||||||
|
plotStore.setPlotConfig(plotConfig.value);
|
||||||
|
};
|
||||||
|
const loadPlotConfig = () => {
|
||||||
|
plotConfig.value = getCustomPlotConfig(plotConfigNameLoc.value);
|
||||||
|
console.log(plotConfig.value);
|
||||||
|
console.log('loading config');
|
||||||
|
plotStore.setPlotConfig(plotConfig.value);
|
||||||
|
};
|
||||||
|
|
||||||
|
const loadConfigFromString = () => {
|
||||||
|
// this.plotConfig = JSON.parse();
|
||||||
|
if (tempPlotConfig.value !== undefined && tempPlotConfigValid.value) {
|
||||||
|
plotConfig.value = tempPlotConfig.value;
|
||||||
|
plotStore.setPlotConfig(plotConfig.value);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const resetConfig = () => {
|
||||||
|
plotConfig.value = { ...EMPTY_PLOTCONFIG };
|
||||||
|
};
|
||||||
|
const loadPlotConfigFromStrategy = async () => {
|
||||||
|
try {
|
||||||
|
const botStore = useBotStore();
|
||||||
|
await botStore.activeBot.getStrategyPlotConfig();
|
||||||
|
if (botStore.activeBot.strategyPlotConfig) {
|
||||||
|
plotConfig.value = botStore.activeBot.strategyPlotConfig;
|
||||||
|
plotStore.setPlotConfig(plotConfig.value);
|
||||||
|
}
|
||||||
|
} catch (data) {
|
||||||
|
//
|
||||||
|
showAlert('Failed to load Plot configuration from Strategy.');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const savePlotConfig = () => {
|
||||||
|
plotStore.saveCustomPlotConfig({ [plotConfigNameLoc.value]: plotConfig.value });
|
||||||
|
};
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
// console.log('Config Mounted', props.value);
|
||||||
|
plotConfig.value = plotStore.plotConfig;
|
||||||
|
plotConfigNameLoc.value = plotStore.plotConfigName;
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue
Block a user