add contextmenu

store/README.md

@@ -1,10 +0,0 @@
-# STORE
-
-**This directory is not required, you can delete it if you don't want to use it.**
-
-This directory contains your Vuex Store files.
-Vuex Store option is implemented in the Nuxt.js framework.
-
-Creating a file in this directory automatically activates the option in the framework.
-
-More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/vuex-store).

store/index.ts

@@ -0,0 +1,129 @@
+import { actionTree, getAccessorType, mutationTree } from 'typed-vuex'
+import { api } from '~/assets/api'
+
+interface ISettings {
+  level: number | null
+  levelMin: number | null
+  sentenceMin: number | null
+  sentenceMax: number | null
+}
+
+export const state = () => ({
+  settings: {
+    level: null,
+    levelMin: null,
+    sentenceMin: null,
+    sentenceMax: null,
+  } as ISettings,
+  isApp: false,
+  tabs: [] as {
+    title: string
+    component: string
+    permanent?: boolean
+    query: Record<string, string>
+  }[],
+  activeTab: 0,
+  identifier: '',
+})
+
+export const mutations = mutationTree(state, {
+  SET_SETTINGS(state, settings: ISettings) {
+    state.settings = settings
+  },
+  SET_IS_APP(state, isApp: boolean) {
+    state.isApp = isApp
+  },
+  SET_TAB_TITLE(state, { i, title }: { i: number; title: string }) {
+    state.tabs[i].title = title
+    state.tabs = JSON.parse(JSON.stringify(state.tabs))
+  },
+  ADD_TAB(
+    state,
+    {
+      component,
+      query = {},
+      first,
+    }: {
+      component: string
+      query?: Record<string, string>
+      first?: boolean
+    }
+  ) {
+    if (first) {
+      state.tabs = [
+        {
+          title: component,
+          component,
+          permanent: true,
+          query,
+        },
+      ]
+    } else {
+      state.tabs = [
+        ...state.tabs,
+        {
+          title: component,
+          component,
+          query,
+        },
+      ]
+    }
+
+    state.activeTab = state.tabs.length - 1
+  },
+  DELETE_TAB(state, { i }: { i: number }) {
+    state.tabs.splice(i, 1)
+
+    if (state.activeTab >= state.tabs.length) {
+      state.activeTab = state.tabs.length - 1
+    }
+
+    state.tabs = JSON.parse(JSON.stringify(state.tabs))
+  },
+  SET_TAB_COMPONENT(state, { i, component }: { i: number; component: string }) {
+    state.tabs[i].component = component
+
+    state.tabs = JSON.parse(JSON.stringify(state.tabs))
+    state.activeTab = i
+  },
+  SET_TAB_CURRENT(state, { i }: { i: number }) {
+    state.activeTab = i
+  },
+  SET_IDENTIFIER(state, name: string) {
+    state.identifier = name
+  },
+})
+
+export const actions = actionTree(
+  { state, mutations },
+  {
+    async updateSettings({ commit }) {
+      const r = await api.user_getSettings()
+      commit('SET_IS_APP', !!r)
+      commit('SET_IDENTIFIER', r?.identifier || '')
+
+      if (r) {
+        if (!r.levelMin) {
+          r.levelMin = 1
+
+          await api.user_updateSettings({
+            levelMin: r.levelMin,
+          })
+        }
+      }
+
+      commit('SET_SETTINGS', {
+        level: r?.level || null,
+        levelMin: r?.levelMin || null,
+        sentenceMin: null,
+        sentenceMax: null,
+      })
+    },
+  }
+)
+
+export const accessorType = getAccessorType({
+  state,
+  mutations,
+  actions,
+})