Vue.component("action-editor-menu", {
template: '<template>     <div style="display: flex;">         <div style="display: flex; justify-content: flex-start;">             <q-btn-dropdown style="width: 180px;" flat dropdown-icon="icon-eo-down-open" color="primary" label="add new action">                 <q-list>                     <q-item clickable v-close-popup @click="emit(\'new\')">                         <q-item-section>                             <q-item-label>empty</q-item-label>                         </q-item-section>                     </q-item>                      <q-item clickable v-close-popup @click="emit(\'new\', \'template\')">                         <q-item-section>                             <q-item-label>with sections</q-item-label>                         </q-item-section>                     </q-item>                      <q-item clickable v-close-popup @click="emit(\'new\', \'template_note\')">                         <q-item-section>                             <q-item-label>with sections and notes</q-item-label>                         </q-item-section>                     </q-item>                 </q-list>             </q-btn-dropdown>             <q-btn style="margin: 0px 0px 0px 10px; width: 80px;" flat color="primary" label="save" @click="emit(\'save\')"></q-btn>             <q-btn style="margin: 0px 0px 0px 10px; width: 80px;" flat color="primary" label="check" @click="emit(\'check\')"></q-btn>             <q-btn style="margin: 0px 0px 0px 10px; width: 80px;" flat color="primary" label="test" @click="emit(\'test\')"></q-btn>         </div>         <div style="display: flex; justify-content: flex-end; width: 100%;">             <q-btn style="margin: 0px 0px 0px 10px; width: 100px;" flat color="info" label="sign out" @click="emit(\'sign_out\')"></q-btn>         </div>     </div> </template>',
data :function () {
    return {};
},
methods :{
    emit(command, mode) {
        this.$emit('event', {
            command: command,
            mode: mode
        });
    }
}
})