to add pinia modules

Jenkinsfile

@@ -45,9 +45,6 @@ spec:
   - name: "volume-m2"
     hostPath:
       path: "/root/.m2/repository"
-  - name: "maven-config"
-    configMap:
-      name: maven-config
   - name: "volume-docker"
     hostPath:
       path: "/var/run/docker.sock"

README.md

@@ -1,17 +1,17 @@
 ## Vue 3 + Typescript + Vite + pinia + vue-router
 
-## Create project document how to bulid a project
+## about creating project document how to bulid a project
   before create project, you should install node to promit npm and node command is standy.
   npm -v
   node -v<br />
 
     // 在想要创建的工程路径下执行以下命令，3到6秒就可以结束
     npm init vite@latest
-    // 1.填写 g-home
+    // 1.填写 violin-home
     // 2.选择vue
     // 3.vue.ts
     
-    cd g-home
+    cd violin-home
     npm install
 
 ## vue-router
@@ -33,19 +33,19 @@
     // to enter the home page:
     localhost:3000/home?tenantId=XXX&account=YYY&token=ABCDEFG
 
-## 环境配置
+## profiles
   添加了.env.development ebv.test .env.production  文件
   development: 
     开发环境，使用mock，不需要后台联动
   test:
     测试环境需要 后台java程序支持，同时需要百度第三方认证。
   prod:
-    生产环境通过 jenkins cicd进行发布配置。
+    生产环境通过 jenkins 做ci 持续集成 argocd 做cd 持续发布。
 
-# 云服务器
+# prod server
-  nginx as a veb server, i use the official image to build this app image.
+  nginx as a web server, i use the official image to build this app image.
 
-## 发布
+## publish
  - npm run build 生成dist 文件夹
 
 ## 百度网盘开放平台

nginx.conf

@@ -1,56 +0,0 @@
-server {
-    listen       8080;
-    server_name  localhost;
-
-    #access_log  /var/log/nginx/host.access.log  main;
-
-    location / {
-        root   /usr/share/nginx/html;
-        index  index.html index.htm;
-    }
-
-    location /write {
-	      alias  /usr/share/nginx/html;
-        index  index.html index.htm;
-    }
-
-    location /home {
-        alias /usr/share/nginx/html;
-        index index.html index.htm;
-    }
-
-    location ~ /view {
-        alias /usr/share/nginx/html;
-        index index.html index.htm;
-    }
-
-    #error_page  404              /404.html;
-
-    # redirect server error pages to the static page /50x.html
-    #
-    error_page   500 502 503 504  /50x.html;
-    
-
-    # proxy the PHP scripts to Apache listening on 127.0.0.1:80
-    #
-    #location ~ \.php$ {
-    #    proxy_pass   http://127.0.0.1;
-    #}
-
-    # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
-    #
-    #location ~ \.php$ {
-    #    root           html;
-    #    fastcgi_pass   127.0.0.1:9000;
-    #    fastcgi_index  index.php;
-    #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
-    #    include        fastcgi_params;
-    #}
-
-    # deny access to .htaccess files, if Apache's document root
-    # concurs with nginx's one
-    #
-    #location ~ /\.ht {
-    #    deny  all;
-    #}
-}

src/components/layout/NavBar.vue

@@ -17,7 +17,7 @@
         </el-icon>&nbsp 21:00-23:00
       </div>
     </div>
-    <el-dropdown trigger="click" v-show="tenant.account">
+    <el-dropdown trigger="click" v-show="useTenantStore.tenant.account">
       <el-avatar src="https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png" />
       <template #dropdown>
         <el-dropdown-menu>
@@ -36,18 +36,18 @@
       </span>
     </template>
   </el-dialog>
-  <span @click="doLogin" v-show="!tenant.account">登录</span>
+  <span @click="doLogin" v-show="!useTenantStore.tenant.account">登录</span>
 </template>
 
 <script setup lang='ts'>
 import $moment from "moment";
 import { reactive, ref } from "vue";
 import router from '../../router'
-import { tenantStore } from '../../store/tenant'
+import { tenantStore } from '../../store/modules/tenant'
 import { logout } from '../../api/user'
 // obtain user infomation 
-const tenant = tenantStore()
+const useTenantStore = tenantStore()
-tenant.reflush()
+useTenantStore.reflush()
 const dialogVisible = ref(false)
 
 // show time 
@@ -64,8 +64,8 @@ const doLogin = () => {
 }
 const doLogout = () => {
   dialogVisible.value = false
-  logout(tenant.id).catch(() => { console.log(1) }).finally(() => {
+  logout(useTenantStore.tenant.id).catch(() => { console.log(1) }).finally(() => {
-    tenant.logout()
+    useTenantStore.logout()
     router.push({
       path: '/login'
     })

src/components/login/login.vue

@@ -26,7 +26,7 @@
 <script lang="ts" setup>
 import { reactive, ref } from 'vue'
 import type { FormInstance } from 'element-plus'
-import { tenantStore } from '../../store/tenant'
+import { tenantStore } from '../../store/modules/tenant'
 import router from '../../router'
 import baiduCloudImage from "../../assets/baiducloud.png"
 import { config, scan } from '../../const/config'
@@ -34,7 +34,7 @@ import { config, scan } from '../../const/config'
 
 let qrcode = config.BAIDU_CLOUD_URL + config.RESPONSE_TYPE + config.CLIENT_ID + config.REDIRECT_URI + config.SCOPE + config.DEVICE_ID + config.QR_CODE + config.DISPLAY
 
-const tenant = tenantStore()
+const useTenantStore = tenantStore()
 
 const ruleFormRef = ref<FormInstance>()
 const loginForm = reactive({
@@ -66,19 +66,19 @@ const dologin = (form: any) => {
 
   if (!form)
     return
-  form.validate((valid: any) => {
+  // form.validate((valid: any) => {
-    if (valid) {
+  //   if (valid) {
-      tenant.login(loginForm.user_id, loginForm.password).then(res => {
+  //     useTenantStore.login(loginForm.user_id, loginForm.password).then(res => {
-        console.log(1)
+  //       console.log(1)
-        router.push({
+  //       router.push({
-          path: '/home'
+  //         path: '/home'
-        })
+  //       })
-      })
+  //     })
 
-    } else {
+  //   } else {
-      return false
+  //     return false
-    }
+  //   }
-  })
+  // })
 }
 
 const style = reactive({} as any)

src/entity/index.ts

@@ -1,5 +1,5 @@
 type Tenant = {
-  id: string,
+  tenant_id: string,
   account: string
 }
 

src/main.ts

@@ -3,8 +3,7 @@ import App from './App.vue'
 import ElementPlus from "element-plus";
 import 'element-plus/dist/index.css'
 import router from './router'
-import { createPinia } from 'pinia'
+import { store } from './store'
-const store = createPinia()
 
 import * as ElementPlusIconsVue from '@element-plus/icons-vue'
 
@@ -31,7 +30,7 @@ app.use(store)
 import { getToken, getTenant, setToken, setTenant } from './utils/auth'
 import { Tenant } from './entity/index'
 import Cookies from 'js-cookie'
-import { tenantStore } from './store/tenant'
+import { tenantStore } from './store/modules/tenant'
 const whiteList = ['/login', '/register', '/sorryPage']
 let url = window.location.href
 

src/store/index.ts

@@ -1,69 +1,5 @@
-import { defineStore, acceptHMRUpdate } from 'pinia'
+import { createPinia } from "pinia"
-import { authorize } from '../api/user'
-import { getToken, setToken, resetToken, setTenant, getTenant } from '../utils/auth'
-import { Tenant } from '../entity/index'
 
+const store = createPinia()
 
-interface Record {
+export { store }
-  isFolder: boolean
-  path: string
-  records: Set<Record>
-}
-
-/**
- * skeleton 
- * 
- * 
- */
-export const tenantStore = defineStore({
-  id: 'cloud',
-  state: () => ({
-    cloud: new Set<Record>(),
-  }),
-
-  getters: {
-
-  },
-  actions: {
-    logout() {
-      this.$patch({
-      })
-      resetToken()
-      // we could do other stuff like redirecting the user
-    },
-
-    /**
-     * Attempt to login a user
-     * @param {string} user_id
-     * @param {string} user_password
-     */
-    async login(tenant: any, token: string) {
-
-      try {
-        await authorize({
-          tenant_id: tenant.tenant_id, token: token
-        })
-        setToken(token)
-        setTenant(tenant)
-      } catch {
-        Promise.resolve("authorize error")
-      }
-
-    },
-
-
-    async reflush() {
-      if (getToken()) {
-        const tenant = <Tenant>(JSON.parse(getTenant() as string))
-        const token = <string>getToken()
-        this.$patch({
-
-        })
-      }
-    }
-  },
-})
-
-if (import.meta.hot) {
-  import.meta.hot.accept(acceptHMRUpdate(tenantStore, import.meta.hot))
-}

src/store/modules/settings.ts

@@ -0,0 +1,23 @@
+import { acceptHMRUpdate, defineStore } from "pinia"
+import { computed, ref } from "vue"
+
+export const settingsStore = defineStore('settings', () => {
+
+  const settings = ref({
+    sideMode: '#191a23',
+    isMobile: false,
+  })
+
+  const sideMode = computed(() => settings.value.sideMode)
+  const isMobile = computed(() => settings.value.isMobile)
+
+  return {
+    settings,
+    sideMode,
+    isMobile,
+  }
+})
+
+if (import.meta.hot) {
+  import.meta.hot.accept(acceptHMRUpdate(settingsStore, import.meta.hot))
+}

src/store/modules/strategy.ts

@@ -0,0 +1,51 @@
+import { acceptHMRUpdate, defineStore } from "pinia"
+import { reactive } from "vue"
+import { get_vt_symbols, get_exchanges, get_subscribe_vt_symbols } from '../../api/capital'
+
+export const strategyStore = defineStore('strategy', () => {
+
+  const strategy = reactive({
+    class_names: [],
+    vt_symbols: new Map(),
+    subscribe_vt_symbols: [],
+    exchanges: []
+  })
+
+  const select_exchanges = async () => {
+    if (strategy.exchanges.length == 0) {
+      get_exchanges().then(res => {
+        strategy.exchanges = res.data.exchanges
+      })
+    }
+  }
+
+  const select_vt_symbols = async () => {
+    if (strategy.vt_symbols.size == 0) {
+      get_vt_symbols().then(res => {
+        let keys = Object.keys(res.data.vt_symbols)
+        keys.forEach(key => {
+          strategy.vt_symbols.set(key, res.data.vt_symbols[key])
+        })
+      })
+    }
+  }
+
+  const select_subscribe_vt_symbols = async () => {
+    if (strategy.subscribe_vt_symbols.length == 0) {
+      get_subscribe_vt_symbols().then(res => {
+        strategy.subscribe_vt_symbols = res.data.subscribe_vt_symbols
+      })
+    }
+  }
+
+  return {
+    strategy,
+    select_exchanges,
+    select_vt_symbols,
+    select_subscribe_vt_symbols
+  }
+})
+
+if (import.meta.hot) {
+  import.meta.hot.accept(acceptHMRUpdate(strategyStore, import.meta.hot))
+}

src/store/modules/tenant.ts

@@ -0,0 +1,55 @@
+import { defineStore, acceptHMRUpdate } from 'pinia'
+import { authorize } from '../../api/user'
+import { getToken, setToken, resetToken, setTenant, getTenant } from '../../utils/auth'
+import { Tenant } from '../../entity/index'
+import { ref } from 'vue'
+
+export const tenantStore = defineStore('tenant', () => {
+  const tenant = ref({
+    account: '',
+    token: '',
+    id: '',
+    headerImg: '',
+  })
+
+  const login = async (tenant: Tenant, token: string) => {
+    try {
+      await authorize({
+        tenant_id: tenant.tenant_id, token: token
+      })
+      setToken(token)
+      setTenant(tenant)
+    } catch {
+      Promise.resolve("authorize error")
+    }
+  }
+
+  const logout = async () => {
+    tenant.value.account = ''
+    tenant.value.token = ''
+    tenant.value.id = ''
+    resetToken()
+  }
+
+  const reflush = async () => {
+    if (getToken()) {
+      const tenantStorage = <Tenant>(JSON.parse(getTenant() as string))
+      const token = <string>getToken()
+      tenant.value.account = tenantStorage.account
+      tenant.value.token = token
+      tenant.value.id = tenantStorage.tenant_id
+    }
+  }
+
+  return {
+    tenant,
+    login,
+    logout,
+    reflush
+  }
+
+})
+
+if (import.meta.hot) {
+  import.meta.hot.accept(acceptHMRUpdate(tenantStore, import.meta.hot))
+}

src/store/strategy.ts

@@ -1,43 +0,0 @@
-import { acceptHMRUpdate, defineStore } from "pinia"
-import { get_vt_symbols, get_exchanges, get_subscribe_vt_symbols } from '../api/capital'
-
-export const strategyStore = defineStore({
-  id: 'strategy',
-  state: () => ({
-    class_names: [],
-    vt_symbols: new Map(),
-    subscribe_vt_symbols: [],
-    exchanges: []
-  }),
-
-  actions: {
-    async select_exchanges() {
-      if (this.exchanges.length == 0) {
-        get_exchanges().then(res => {
-          this.$patch({ exchanges: res.data.exchanges })
-        })
-      }
-    },
-    async select_vt_symbols() {
-      if (this.vt_symbols.size == 0) {
-        get_vt_symbols().then(res => {
-          let keys = Object.keys(res.data.vt_symbols)
-          keys.forEach(key => {
-            this.vt_symbols.set(key, res.data.vt_symbols[key])
-          })
-        })
-      }
-    },
-    async select_subscribe_vt_symbols() {
-      if (this.subscribe_vt_symbols.length == 0) {
-        get_subscribe_vt_symbols().then(res => {
-          this.$patch({ subscribe_vt_symbols: res.data.vt_symbols })
-        })
-      }
-    }
-  }
-})
-
-if (import.meta.hot) {
-  import.meta.hot.accept(acceptHMRUpdate(strategyStore, import.meta.hot))
-}

src/store/tenant.ts

@@ -1,75 +0,0 @@
-import { defineStore, acceptHMRUpdate } from 'pinia'
-import { authorize } from '../api/user'
-import { getToken, setToken, resetToken, setTenant, getTenant } from '../utils/auth'
-import { Tenant } from '../entity/index'
-
-/**
- * Simulate a login
- * @param {string} a
- * @param {string} p
- */
-// function apiLogin(a, p) {
-//   if (a === 'ed' && p === 'ed') return Promise.resolve({ isAdmin: true })
-//   if (p === 'ed') return Promise.resolve({ isAdmin: false })
-//   return Promise.reject(new Error('invalid credentials'))
-// }
-
-export const tenantStore = defineStore({
-  id: 'tenant',
-  state: () => ({
-    account: '',
-    token: '',
-    id: ''
-  }),
-
-  getters: {
-
-  },
-  actions: {
-    logout() {
-      this.$patch({
-        account: '',
-        token: '',
-        id: ''
-      })
-      resetToken()
-      // we could do other stuff like redirecting the user
-    },
-
-    /**
-     * Attempt to login a tenant
-     * @param {object} tenant
-     * @param {string} token
-     */
-    async login(tenant: any, token: string) {
-
-      try {
-        await authorize({
-          tenant_id: tenant.tenant_id, token: token
-        })
-        setToken(token)
-        setTenant(tenant)
-      } catch {
-        Promise.resolve("authorize error")
-      }
-
-    },
-
-
-    async reflush() {
-      if (getToken()) {
-        const tenant = <Tenant>(JSON.parse(getTenant() as string))
-        const token = <string>getToken()
-        this.$patch({
-          account: tenant.account,
-          token: token,
-          id: tenant.id
-        })
-      }
-    }
-  },
-})
-
-if (import.meta.hot) {
-  import.meta.hot.accept(acceptHMRUpdate(tenantStore, import.meta.hot))
-}

src/view/bookmark/createTypedialog.vue

@@ -10,7 +10,7 @@
 </template>
 
 <script setup lang="ts">
-import { ref } from 'vue';
+import { ref } from 'vue'
 import { put_bookmark_type } from '../../api/bookmark_type'
 
 const bookmark_type_name = ref<String>('')

src/view/bookmark/dialog.vue

@@ -3,12 +3,8 @@
     <el-form :model="dialog_form">
       <el-form-item label="分类" :label-width="formLabelWidth">
         <el-select v-model="dialog_form.bk_type_id" placeholder>
-          <el-option
+          <el-option v-for="(item) in types" :key="item.bk_type_id" :value="item.bk_type_id"
-            v-for="(item) in types"
+            :label="item.bk_type_name" />
-            :key="item.bk_type_id"
-            :value="item.bk_type_id"
-            :label="item.bk_type_name"
-          />
         </el-select>
         <el-form-item label="备注" :label-width="formLabelWidth">
           <el-input v-model="dialog_form.comment" autocomplete="off" />
@@ -28,7 +24,7 @@
 </template>
 
 <script setup lang="ts">
-import { reactive } from 'vue';
+import { reactive } from 'vue'
 import { update_bookmark, put_bookmark } from '../../api/bookmark'
 import type { FormInstance } from 'element-plus'
 const formLabelWidth = '140px'
@@ -69,15 +65,19 @@ const submit = () => {
 
 
 </script>
-<style scoped>.el-button--text {
+<style scoped>
+.el-button--text {
   margin-right: 15px;
 }
+
 .el-select {
   width: 300px;
 }
+
 .el-input {
   width: 300px;
 }
+
 .dialog-footer button:first-child {
   margin-right: 10px;
 }

src/view/bookmark/index.vue

@@ -14,12 +14,12 @@
       <div class="tag_list">
         <el-tag class="ml-2 click-icon" :type="item.clicked ? 'danger' : 'info'" v-for="(item) in bookmark_types"
           @click="handleTags(item)">{{ item.bk_type_name }}</el-tag>
-        <el-button type="primary" @click="handleAddType" v-show="Tenant.account">增加</el-button>
+        <el-button type="primary" @click="handleAddType" v-show="useTenantStore.tenant.account">增加</el-button>
-        <el-button type="primary" @click="handleManageType" v-show="Tenant.account">自定义</el-button>
+        <el-button type="primary" @click="handleManageType" v-show="useTenantStore.tenant.account">自定义</el-button>
       </div>
     </el-form>
     <div class="create_dialog">
-      <el-button type="primary" @click="handleInsert" v-show="Tenant.account">新建</el-button>
+      <el-button type="primary" @click="handleInsert" v-show="useTenantStore.tenant.account">新建</el-button>
     </div>
 
     <el-table ref="multipleTableRef" :data="tableData" @selection-change="handleSelectionChange" style="width: 100%">
@@ -39,9 +39,10 @@
             <CopyDocument />
           </el-icon>
           <el-button class="click-icon" size="small" @click="handleEdit(scope.$index, scope.row)"
-            v-show="Tenant.account">编辑
+            v-show="useTenantStore.tenant.account">编辑
           </el-button>
-          <el-button size="small" type="danger" @click="handleDelete(scope.$index, scope.row)" v-show="Tenant.account">
+          <el-button size="small" type="danger" @click="handleDelete(scope.$index, scope.row)"
+            v-show="useTenantStore.tenant.account">
             删除
           </el-button>
         </template>
@@ -72,34 +73,33 @@
 </template>
 
 <script setup lang="ts">
-import { reactive, ref } from 'vue'
+import { reactive, ref, h } from 'vue'
-import { search_bookmark, delete_bookmark } from '../../api/bookmark'
+import type { ElTable } from 'element-plus'
-import { get_bookmark_type } from '../../api/bookmark_type'
+import { CopyDocument } from "@element-plus/icons-vue"
+import { ElNotification } from 'element-plus'
+import copy from 'copy-to-clipboard'
 import bookmark_dialog from './dialog.vue'
 import bookmarkType_dialog from './Typedialog.vue'
 import createType_dialog from './createTypedialog.vue'
 import delete_dialog from '../../components/operate/deleteDialog.vue'
-import type { ElTable } from 'element-plus'
+import { tenantStore } from '../../store/modules/tenant'
-import { CopyDocument } from "@element-plus/icons-vue";
+import { search_bookmark, delete_bookmark } from '../../api/bookmark'
-import { ElNotification } from 'element-plus'
+import { get_bookmark_type } from '../../api/bookmark_type'
-import copy from 'copy-to-clipboard';
-import { h } from 'vue'
-import { tenantStore } from '../../store/tenant'
 // obtain user infomation 
-const Tenant = tenantStore()
+const useTenantStore = tenantStore()
 
 // 定义书签格式
 type Bookmark = {
   bk_id: string,
   bk_type_id: number,
-  bk_type_name: String,
+  bk_type_name: string,
-  comment: String,
+  comment: string,
-  url: String
+  url: string
 }
 // 定义 表单格式
 type Searchform = {
   bk_type_ids: number[],
-  comment: String
+  comment: string
 }
 
 // 操作code

src/view/capital/index.vue

@@ -48,7 +48,7 @@
       <el-collapse-item title="手动下单" name="2">
 
         <el-select v-model="vt_symbol" placeholder="select a vt_symbol" @change="select_contract">
-          <el-option v-for="symbol in store.subscribe_vt_symbols" :value="symbol" />
+          <el-option v-for="symbol in useStrategyStore.strategy.subscribe_vt_symbols" :value="symbol" />
         </el-select>
         <div style="height: 10px;"></div>
         <el-row>
@@ -134,14 +134,13 @@
 </template>
 
 <script setup lang="ts">
-
 import { ElMessage, TabsPaneContext } from 'element-plus'
 import { reactive, ref, h, onMounted, onUnmounted } from 'vue'
 import { get_accounts, send_order, get_tick } from '../../api/capital'
-import { strategyStore } from '../../store/strategy'
+import { strategyStore } from '../../store/modules/strategy'
 
 // -- IMPORT --
-const store = strategyStore()
+const useStrategyStore = strategyStore()
 
 // -- INTERFACE OR TYPE DEFINITION --
 interface AccountData {
@@ -272,7 +271,7 @@ const on_order = () => {
  */
 (() => {
 
-  store.select_subscribe_vt_symbols()
+  useStrategyStore.select_subscribe_vt_symbols()
   onMounted(() => {
     clearInterval(timer.value)
     timer.value = window.setInterval(on_query_accounts(), 3000);

src/view/recommend/index.vue

@@ -5,14 +5,14 @@
         <el-row>
           <el-col :span="4">
             <el-select v-model="exchange" placeholder="select a exchange">
-              <el-option v-for="ex in store.exchanges" :value="ex" />
+              <el-option v-for="ex in useStrategyStore.strategy.exchanges" :value="ex" />
             </el-select>
           </el-col>
           <el-col :span="1">
           </el-col>
           <el-col :span="4">
             <el-select v-model="vt_symbol" placeholder="select a vt_symbol">
-              <el-option v-for="symbol in store.vt_symbols.get(exchange)" :value="symbol" />
+              <el-option v-for="symbol in useStrategyStore.strategy.vt_symbols.get(exchange)" :value="symbol" />
             </el-select>
           </el-col>
           <el-col :span="1">
@@ -56,15 +56,16 @@
 <script setup lang="ts">
 import { ref, h, onMounted, onUnmounted, reactive, getCurrentInstance } from 'vue'
 import { ElMessage } from 'element-plus'
-import { get_ticks, subscribe, concel_subscribe } from '../../api/capital'
+import * as echarts from 'echarts'
-import { strategyStore } from '../../store/strategy'
 import { Contextmenu, ContextmenuItem } from "v-contextmenu"
+import { get_ticks, subscribe, concel_subscribe } from '../../api/capital'
+import { strategyStore } from '../../store/modules/strategy'
 import { toPercent } from '../../utils/number'
 
-import * as echarts from 'echarts'
+
 // -- IMPORT --
 const currentInstance = getCurrentInstance()
-const store = strategyStore()
+const useStrategyStore = strategyStore()
 
 // -- INTERFACE OR TYPE DEFINITION --
 interface TickData {
@@ -104,7 +105,7 @@ const on_subscribe = () => {
         h('i', { style: 'color: green' }, "行情订阅成功"),
       ]),
     })
-    store.select_subscribe_vt_symbols()
+    useStrategyStore.select_subscribe_vt_symbols()
     on_ticks()
   }).catch(error => {
     ElMessage({
@@ -189,7 +190,7 @@ const on_ticks = () => {
     window.clearInterval(timer.value)
   })
 
-  store.select_subscribe_vt_symbols()
+  useStrategyStore.select_subscribe_vt_symbols()
     .catch(error => {
       ElMessage({
         message: h('p', null, [
@@ -198,7 +199,7 @@ const on_ticks = () => {
       })
     })
 
-  store.select_vt_symbols()
+  useStrategyStore.select_vt_symbols()
     .catch((error) => {
       ElMessage({
         message: h('p', null, [
@@ -207,7 +208,7 @@ const on_ticks = () => {
       })
     })
 
-  store.select_exchanges()
+  useStrategyStore.select_exchanges()
     .catch((error) => {
       ElMessage({
         message: h('p', null, [

src/view/trader/cta_strategy.vue

@@ -61,8 +61,10 @@
 </template>
 
 <script setup lang="ts">
-import { onMounted, reactive, ref } from 'vue'
+import { onMounted, reactive, ref, h } from 'vue'
+import { ElMessage } from 'element-plus'
 import create_strategy_dialog from './dialog.vue'
+import { strategyStore } from '../../store/modules/strategy'
 import {
   get_strategies,
   init_strategy,
@@ -72,9 +74,6 @@ import {
   get_strategy_status,
   get_strategy_load_files,
 } from '../../api/cta_strategy'
-import { h } from 'vue'
-import { ElMessage } from 'element-plus'
-import { strategyStore } from '../../store/strategy'
 
 type Strategy = {
   strategy_name: string,
@@ -84,7 +83,7 @@ type Strategy = {
   status: number,
 }
 
-const store = strategyStore()
+const useStrategyStore = strategyStore()
 let createStrategyDialogVisible = ref(false)
 const strategy_list = reactive<Strategy[]>([])
 const dialogRef = ref()
@@ -133,7 +132,7 @@ const on_status = (row: any) => {
 onMounted(() => {
   on_list()
   get_strategy_load_files().then(res => {
-    store.$patch({ class_names: res.data.class_names })
+    useStrategyStore.strategy.class_names = res.data.class_names
   }).catch(error => {
     ElMessage({
       message: h('p', null, [

src/view/trader/cta_strategy_file.vue

@@ -66,17 +66,14 @@
 </template>
 
 <script setup lang="ts">
-import { reactive, ref } from 'vue';
+import { reactive, ref, h } from 'vue'
+import { UploadInstance, UploadProps, UploadRawFile, genFileId, ElMessage, ElButton, ElIcon, ElTable, ElTableColumn, ElUpload } from 'element-plus'
 import {
   get_strategy_files,
   load_strategy_file,
   unload_strategy_file,
   remove_strategy_file
 } from '../../api/cta_strategy'
-import { genFileId } from 'element-plus'
-import type { UploadInstance, UploadProps, UploadRawFile } from 'element-plus'
-import { h } from 'vue'
-import { ElMessage } from 'element-plus'
 
 // -- INTERFACE OR TYPE DEFINITION --
 interface StrategyFile {

src/view/trader/dialog.vue

@@ -7,12 +7,12 @@
       </el-form-item>
       <el-form-item label="vt_symbol" prop="vt_symbol">
         <el-select v-model="ruleForm.vt_symbol" placeholder="select a vt_symbol">
-          <el-option v-for="vt_symbol in store.subscribe_vt_symbols" :value="vt_symbol" />
+          <el-option v-for="vt_symbol in useStrategyStore.strategy.subscribe_vt_symbols" :value="vt_symbol" />
         </el-select>
       </el-form-item>
       <el-form-item label="class_name" prop="class_name">
         <el-select v-model="ruleForm.class_name" placeholder="select a class_name">
-          <el-option v-for="name in store.class_names" :value="name" />
+          <el-option v-for="name in useStrategyStore.strategy.class_names" :value="name" />
         </el-select>
       </el-form-item>
       <el-form-item label="setting:">
@@ -47,9 +47,9 @@ import type { FormInstance, FormRules } from 'element-plus'
 import { create_strategy } from '../../api/cta_strategy'
 import { h } from 'vue'
 import { ElMessage } from 'element-plus'
-import { strategyStore } from '../../store/strategy'
+import { strategyStore } from '../../store/modules/strategy'
 
-const store = strategyStore()
+const useStrategyStore = strategyStore()
 
 const formSize = ref('default')
 const ruleFormRef = ref<FormInstance>()

src/view/trader/index.vue

@@ -6,10 +6,9 @@
 </template>
 
 <script setup lang="ts">
-import { reactive } from 'vue';
+import { onMounted, ref, reactive } from 'vue'
 import * as echarts from 'echarts'
-import { EChartsOption } from 'echarts';
+import { EChartsOption } from 'echarts'
-import { onMounted, ref } from 'vue'
 import { generateOHLC, option } from '../../service/trader'
 import { get_stock_data } from '../../api/trader'