[Fix][UI-Next][V1.0.0-Alpha] Fix ui and backend languages are not consistent bug (#8755)

dolphinscheduler-ui-next/package.json

@@ -15,6 +15,7 @@
     "axios": "^0.24.0",
     "date-fns": "^2.28.0",
     "echarts": "^5.3.0",
+    "js-cookie": "^3.0.1",
     "lodash": "^4.17.21",
     "monaco-editor": "^0.31.1",
     "naive-ui": "^2.26.0",
@@ -28,6 +29,7 @@
     "vue-router": "^4.0.12"
   },
   "devDependencies": {
+    "@types/js-cookie": "^3.0.1",
     "@types/node": "^16.11.25",
     "@types/nprogress": "^0.2.0",
     "@types/qs": "^6.9.7",

dolphinscheduler-ui-next/src/layouts/content/components/locales/use-dropdown.ts

@@ -17,6 +17,7 @@
 
 import { DropdownOption } from 'naive-ui'
 import { useI18n } from 'vue-i18n'
+import cookies from 'js-cookie'
 import { useLocalesStore } from '@/store/locales/locales'
 import type { Locales } from '@/store/locales/types'
 
@@ -29,6 +30,7 @@ export function useDropDown(chooseVal: any) {
     chooseVal.value = option.label
     locale.value = key as Locales
     localesStore.setLocales(locale.value as Locales)
+    cookies.set('language', locale.value, { path: '/' })
   }
   return {
     handleSelect

dolphinscheduler-ui-next/src/service/service.ts

@@ -19,6 +19,7 @@ import axios, { AxiosRequestConfig, AxiosResponse, AxiosError } from 'axios'
 import { useUserStore } from '@/store/user/user'
 import qs from 'qs'
 import _ from 'lodash'
+import cookies from 'js-cookie'
 import router from '@/router'
 
 const userStore = useUserStore()
@@ -56,6 +57,11 @@ const err = (err: AxiosError): Promise<AxiosError> => {
 service.interceptors.request.use((config: AxiosRequestConfig<any>) => {
   config.headers && (config.headers.sessionId = userStore.getSessionId)
 
+  const sIdCookie = cookies.get('sessionId')
+  const language = cookies.get('language')
+  config.headers = config.headers || {}
+  if (language) config.headers.language = language
+  if (sIdCookie) config.headers.sessionId = sIdCookie
   return config
 }, err)