feat: rename bot

This commit is contained in:
Lemuel 2022-03-10 15:57:06 +08:00
parent 0acf5889e0
commit fe6f78fdb0
7 changed files with 136 additions and 13 deletions

View File

@ -16,9 +16,10 @@
R
</b-form-checkbox>
<div v-if="!noButtons" class="d-flex flex-align-cent">
<!-- <b-button class="ml-1" size="sm" title="Edit bot">
<EditIcon :size="16" title="Edit Button" />
</b-button> -->
<b-button class="ml-1" size="sm" title="Delete bot" @click="$emit('edit')">
<EditIcon :size="16" />
</b-button>
<b-button class="ml-1" size="sm" title="Delete bot" @click.prevent="clickRemoveBot(bot)">
<DeleteIcon :size="16" title="Delete Bot" />
</b-button>
@ -31,15 +32,19 @@
import { Component, Prop, Vue } from 'vue-property-decorator';
import { namespace } from 'vuex-class';
import { MultiBotStoreGetters } from '@/store/modules/botStoreWrapper';
import LoginModal from '@/views/LoginModal.vue';
import EditIcon from 'vue-material-design-icons/Cog.vue';
import EditIcon from 'vue-material-design-icons/Pencil.vue';
import DeleteIcon from 'vue-material-design-icons/Delete.vue';
import { BotDescriptor, BotDescriptors } from '@/types';
import StoreModules from '@/store/storeSubModules';
const ftbot = namespace(StoreModules.ftbot);
@Component({ components: { LoginModal, DeleteIcon, EditIcon } })
@Component({
components: {
DeleteIcon,
EditIcon,
},
})
export default class BotList extends Vue {
@Prop({ default: false, type: Object }) bot!: BotDescriptor;
@ -79,5 +84,3 @@ export default class BotList extends Vue {
}
}
</script>
<style scoped></style>

View File

@ -10,7 +10,14 @@
:title="`${bot.botId} - ${bot.botName} - ${bot.botUrl}`"
@click="selectBot(bot.botId)"
>
<bot-entry :bot="bot" :no-buttons="small" />
<bot-rename
v-if="editingBots.includes(bot.botId)"
:bot="bot"
@saved="stopEditBot(bot.botId)"
@cancelled="stopEditBot(bot.botId)"
/>
<bot-entry v-else :bot="bot" :no-buttons="small" @edit="editBot(bot.botId)" />
</b-list-group-item>
</b-list-group>
<LoginModal v-if="!small" class="mt-2" login-text="Add new bot" />
@ -23,12 +30,19 @@ import { namespace } from 'vuex-class';
import { MultiBotStoreGetters } from '@/store/modules/botStoreWrapper';
import LoginModal from '@/views/LoginModal.vue';
import BotEntry from '@/components/BotEntry.vue';
import BotRename from '@/components/BotRename.vue';
import { BotDescriptors } from '@/types';
import StoreModules from '@/store/storeSubModules';
const ftbot = namespace(StoreModules.ftbot);
@Component({ components: { LoginModal, BotEntry } })
@Component({
components: {
LoginModal,
BotEntry,
BotRename,
},
})
export default class BotList extends Vue {
@Prop({ default: false, type: Boolean }) small!: boolean;
@ -41,7 +55,21 @@ export default class BotList extends Vue {
@ftbot.Getter [MultiBotStoreGetters.allAvailableBots]: BotDescriptors;
@ftbot.Action selectBot;
editingBots: string[] = [];
editBot(botId: string) {
if (!this.editingBots.includes(botId)) {
this.editingBots.push(botId);
}
}
stopEditBot(botId: string) {
if (!this.editingBots.includes(botId)) {
return;
}
this.editingBots.splice(this.editingBots.indexOf(botId), 1);
}
}
</script>
<style scoped></style>

View File

@ -0,0 +1,57 @@
<template>
<form class="d-flex" @submit.prevent="save">
<b-form-input
v-model="newName"
size="sm"
class="w-100"
placeholder="Bot name"
style="border-style: solid; border-width: 1px"
autofocus
/>
<div class="d-flex ml-2">
<b-button type="submit" size="sm" title="Save">
<CheckIcon :size="16" />
</b-button>
<b-button class="ml-1" size="sm" title="Cancel" @click="$emit('cancelled')">
<CloseIcon :size="16" />
</b-button>
</div>
</form>
</template>
<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator';
import { namespace } from 'vuex-class';
import CheckIcon from 'vue-material-design-icons/Check.vue';
import CloseIcon from 'vue-material-design-icons/Close.vue';
import { BotDescriptor, RenameBotPayload } from '@/types';
import StoreModules from '@/store/storeSubModules';
const ftbot = namespace(StoreModules.ftbot);
@Component({
components: {
CheckIcon,
CloseIcon,
},
})
export default class BotList extends Vue {
@Prop({ required: true, type: Object }) bot!: BotDescriptor;
// eslint-disable-next-line @typescript-eslint/no-unused-vars
@ftbot.Action renameBot!: (payload: RenameBotPayload) => Promise<void>;
newName: string = this.bot.botName;
save() {
this.renameBot({
botId: this.bot.botId,
botName: this.newName,
});
this.$emit('saved');
}
}
</script>

View File

@ -13,6 +13,12 @@ export class UserService {
this.botId = botId;
}
public renameBot(newName: string): void {
const newInfo = this.getLoginInfo();
newInfo.botName = newName;
this.storeLoginInfo(newInfo);
}
/**
* Stores info for current botId in the object of all bots.
*/

View File

@ -6,6 +6,7 @@ import {
DailyReturnValue,
MultiDeletePayload,
MultiForcesellPayload,
RenameBotPayload,
Trade,
} from '@/types';
import { AxiosInstance } from 'axios';
@ -182,7 +183,15 @@ export default function createBotStore(store) {
state.refreshing = refreshing;
},
addBot(state: FTMultiBotState, bot: BotDescriptor) {
state.availableBots[bot.botId] = bot;
// When Vue gets initialized, only existing objects will be added with reactivity.
// To add reactivity to new property, we need to mutate the already reactive object.
state.availableBots = {
...state.availableBots,
[bot.botId]: bot,
};
},
renameBot(state: FTMultiBotState, bot: RenameBotPayload) {
state.availableBots[bot.botId].botName = bot.botName;
},
removeBot(state: FTMultiBotState, botId: string) {
if (botId in state.availableBots) {
@ -214,6 +223,17 @@ export default function createBotStore(store) {
dispatch(`${bot.botId}/botAdded`);
commit('addBot', bot);
},
renameBot({ dispatch, getters, commit }, bot: RenameBotPayload) {
if (!Object.keys(getters.allAvailableBots).includes(bot.botId)) {
// TODO: handle error!
console.error('Bot not found');
return;
}
dispatch(`${bot.botId}/rename`, bot.botName).then(() => {
commit('renameBot', bot);
});
},
removeBot({ commit, getters, dispatch }, botId: string) {
if (Object.keys(getters.allAvailableBots).includes(botId)) {
dispatch(`${botId}/logout`);

View File

@ -155,6 +155,7 @@ export enum BotStoreActions {
setBacktestResultKey = 'setBacktestResultKey',
sysInfo = 'sysInfo',
logout = 'logout',
rename = 'rename',
}
export function createBotSubStore(botId: string, botName: string) {
@ -488,6 +489,9 @@ export function createBotSubStore(botId: string, botName: string) {
[BotStoreActions.logout]() {
userService.logout();
},
[BotStoreActions.rename](ctx, name) {
userService.renameBot(name);
},
[BotStoreActions.setRefreshRequired]({ commit }, refreshRequired: boolean) {
commit('updateRefreshRequired', refreshRequired);
},

View File

@ -31,3 +31,8 @@ export interface BotDescriptor {
export interface BotDescriptors {
[key: string]: BotDescriptor;
}
export interface RenameBotPayload {
botId: string;
botName: string;
}