fix: 请求地址，localStorage(key)优化

2022-04-14 15:52:07 +08:00
parent 58e2d233d6
commit 2cc23bf1a9
24 changed files with 147 additions and 92 deletions
--- a/src/App.vue
+++ b/src/App.vue
@@ -4,11 +4,12 @@
  </div>
 </template>
 <script>
+import { storageKey } from '@/utils/constants'
 export default {
  name: 'App',
  setup () {
    // 处理刷新后  $dayJs的时区变为默认的问题
-    const timezone = localStorage.getItem('cn-sys-timezone') || ''
+    const timezone = localStorage.getItem(storageKey.sysTimezone) || ''
    if (timezone) {
      window.$dayJs.tz.setDefault(timezone)
    } else {
--- a/src/Login.vue
+++ b/src/Login.vue
@@ -41,6 +41,9 @@
 import { mapActions } from 'vuex'
 import { post, get } from '@/utils/http'
 import { useRouter } from 'vue-router'
+import { storageKey } from '@/utils/constants'
+import { api } from '@/utils/api'
+
 export default {

  name: 'Login',
@@ -63,18 +66,18 @@ export default {
        return
      }
      this.loading = true
-      post('sys/login', { username: this.username, pin: this.pin }).then(
+      post(api.operationLog, { username: this.username, pin: this.pin }).then(
        res => {
          if (res.code === 200) {
            if (!this.$_.isEmpty(res.data.lang)) {
-              localStorage.setItem('cn-language', res.data.lang)
+              localStorage.setItem(storageKey.language, res.data.lang)
            }
            if (!this.$_.isEmpty(res.data.theme)) {
-              localStorage.setItem('cn-theme', res.data.theme)
+              localStorage.setItem(storageKey.theme, res.data.theme)
            }
            res.loginSuccessPath = this.loginSuccessPath
            this.loginSuccess(res)
-            localStorage.setItem('cn-username', this.username)
+            localStorage.setItem(storageKey.username, this.username)
          } else if (res.code === 518005) {
            this.$message.error(this.$t('Incorrect username or password'))
            this.loading = false
@@ -92,24 +95,24 @@ export default {
      })
    },
    appearance () {
-      get('/sys/appearance').then(res => {
+      get(api.appearance).then(res => {
        if (res.code === 200) {
          this.appearanceOut(res.data)
        }
      })
    },
    appearanceOut (data) {
-      if (this.$_.isEmpty(localStorage.getItem('cn-language'))) {
-        localStorage.setItem('cn-language', data.lang)
+      if (this.$_.isEmpty(localStorage.getItem(storageKey.language))) {
+        localStorage.setItem(storageKey.language, data.lang)
      }
-      if (this.$_.isEmpty(localStorage.getItem('cn-sys-timezone'))) {
-        localStorage.setItem('cn-sys-timezone', data.timezone)
+      if (this.$_.isEmpty(localStorage.getItem(storageKey.sysTimezone))) {
+        localStorage.setItem(storageKey.sysTimezone, data.timezone)
      }
-      if (this.$_.isEmpty(localStorage.getItem('cn-theme'))) {
-        localStorage.setItem('cn-theme', data.theme)
+      if (this.$_.isEmpty(localStorage.getItem(storageKey.theme))) {
+        localStorage.setItem(storageKey.theme, data.theme)
      }
-      if (this.$_.isEmpty(localStorage.getItem('cn-date-format'))) {
-        localStorage.setItem('cn-date-format', data.dateFormat)
+      if (this.$_.isEmpty(localStorage.getItem(storageKey.dateFormat))) {
+        localStorage.setItem(storageKey.dateFormat, data.dateFormat)
      }
    }
  },
--- a/src/components/common/Pagination.vue
+++ b/src/components/common/Pagination.vue
@@ -22,6 +22,7 @@

 <script>
 import { defaultPageSize } from '@/utils/constants'
+import { storageKey } from '@/utils/constants'

 export default {
  name: 'pagination',
@@ -132,7 +133,7 @@ export default {
      this.pageSize = this.postPageSizes[0]
      this.resetPageSizes()
    } else {
-      const pageSize = localStorage.getItem('cn-pageSize-' + localStorage.getItem('cn-username') + '-' + this.tableId)
+      const pageSize = localStorage.getItem(storageKey.pageSize + '-' + localStorage.getItem(storageKey.username) + '-' + this.tableId)
      if (pageSize != 'undefined' && pageSize != null) {
        this.pageSize = parseInt(pageSize)
      }
--- a/src/components/common/TimeRange/DateTimeRange.vue
+++ b/src/components/common/TimeRange/DateTimeRange.vue
@@ -80,6 +80,7 @@
 <script>
 import { ref, computed } from 'vue'
 import MyDatePicker from '../MyDatePicker'
+import { storageKey } from '@/utils/constants'

 export default {
  name: 'DateTimeRange',
@@ -113,9 +114,9 @@ export default {
    const myStartTime = ref(props.startTime)
    const myEndTime = ref(props.endTime)
    const timeArr = ref([myStartTime.value, myEndTime.value])
-    const address = localStorage.getItem('cn-sys-timezone')
-    const utc = localStorage.getItem('cn-timezone-offset')
-    const rangeHistory = ref(localStorage.getItem('date-range-history') ? JSON.parse(localStorage.getItem('date-range-history')) : [])
+    const address = localStorage.getItem(storageKey.sysTimezone)
+    const utc = localStorage.getItem(storageKey.timezoneOffset)
+    const rangeHistory = ref(localStorage.getItem(storageKey.dataRangeHistory) ? JSON.parse(localStorage.getItem(storageKey.dataRangeHistory)) : [])
    const dateRangeValue = props.dateRange ? ref(props.dateRange) : ref(60)
    const isCustom = ref(false)
    const dateRangeArr = [
@@ -235,7 +236,7 @@ export default {
        start: myStartTime.value,
        end: myEndTime.value
      })
-      localStorage.setItem('date-range-history', JSON.stringify(rangeHistory.value))
+      localStorage.setItem(storageKey.dataRangeHistory, JSON.stringify(rangeHistory.value))
      ctx.emit('change', myStartTime.value, myEndTime.value, dateRangeValue)
      dropdownFlag.value = false
    }
--- a/src/components/common/popBox/TopToolMoreOptions.vue
+++ b/src/components/common/popBox/TopToolMoreOptions.vue
@@ -59,6 +59,8 @@
 <script>
 import axios from 'axios'
 import { post } from '@/utils/http'
+import { storageKey } from '@/utils/constants'
+
 export default {
  name: 'TopToolMoreOptions',
  props: {
@@ -107,7 +109,7 @@ export default {
        if (this.paramsType) {
          form.append('type', this.paramsType)
        }
-        form.append('language', localStorage.getItem('cn-language') ? localStorage.getItem('cn-language') : 'en')
+        form.append('language', localStorage.getItem(storageKey.language) ? localStorage.getItem(storageKey.language) : 'en')
        post(this.importUrl, form, { 'Content-Type': 'multipart/form-data' }).then(response => {
          if (response.code == 200 && response.msg == 'success') {
            this.$message({ duration: 2000, type: 'success', message: this.$t('tip.importSuccess') })
@@ -127,7 +129,7 @@ export default {
      this.importFile = null
    },
    downloadTemplate () {
-      const language = localStorage.getItem('cn-language') || 'en' // 初始未选择默认 en 英文
+      const language = localStorage.getItem(storageKey.language) || 'en' // 初始未选择默认 en 英文
      const fileName = this.exportFileName + '-' + this.$t('overall.template') + '-' + this.getTimeString() + '.json'

      let url = null
@@ -158,7 +160,7 @@ export default {
        })
      }
      params.pageSize = -1
-      params.language = localStorage.getItem('cn-language') || 'en'
+      params.language = localStorage.getItem(storageKey.language) || 'en'

      this.export(this.exportUrl, params, this.exportFileName + '-' + this.getTimeString() + '.json')
      this.closeDialog()
--- a/src/components/layout/Header.vue
+++ b/src/components/layout/Header.vue
@@ -91,6 +91,7 @@
 import { useRoute } from 'vue-router'
 import { get, put } from '@/utils/http'
 import { entityType, storageKey } from '@/utils/constants'
+import { api } from '@/utils/api'

 export default {
  name: 'Header',
@@ -104,7 +105,7 @@ export default {
    }
    return {
      username: 'admin', // sessionStorage.getItem('cn-username'),
-      language: localStorage.getItem('cn-language') ? localStorage.getItem('cn-language') : 'en',
+      language: localStorage.getItem(storageKey.language) ? localStorage.getItem(storageKey.language) : 'en',
      showChangePin: false,
      from: '', // entity类型
      changePassForm: {
@@ -171,8 +172,8 @@ export default {
      this.showChangePin = false
    },
    changeLocal (lang) {
-      if (lang !== localStorage.getItem('cn-language')) {
-        localStorage.setItem('cn-language', lang)
+      if (lang !== localStorage.getItem(storageKey.language)) {
+        localStorage.setItem(storageKey.language, lang)
        window.location.reload()
      }
    },
@@ -181,10 +182,10 @@ export default {
    },
    logout () {
      localStorage.removeItem(storageKey.token)
-      get('/logout')
+      get(api.logout)
    },
    refreshLang () {
-      this.language = localStorage.getItem('cn-language')
+      this.language = localStorage.getItem(storageKey.language)
      this.$i18n.locale = this.language
      this.$nextTick(() => {
        window.location.reload()
@@ -196,7 +197,7 @@ export default {
    submit () {
      this.$refs.changePassForm.validate((valid) => {
        if (valid) {
-          put('sys/user/pin', { oldPin: this.changePassForm.oldPwd, newPin: this.changePassForm.newPwd }).then(res => {
+          put(api.pin, { oldPin: this.changePassForm.oldPwd, newPin: this.changePassForm.newPwd }).then(res => {
            if (res.code === 200) {
              this.$message.success('Success')
              this.showChangePin = false
--- a/src/components/layout/LeftMenu.vue
+++ b/src/components/layout/LeftMenu.vue
@@ -70,11 +70,13 @@
 </template>

 <script>
+import { storageKey } from '@/utils/constants'
+
 export default {
  name: 'LeftMenu',
  data () {
    return {
-      systemName: localStorage.getItem('cn-sys-name'),
+      systemName: localStorage.getItem(storageKey.sysName),
      logo: ''
    }
  },
--- a/src/components/rightBox/settings/ChartBox.vue
+++ b/src/components/rightBox/settings/ChartBox.vue
@@ -133,7 +133,7 @@
 <script>
 import rightBoxMixin from '@/mixins/right-box'
 import { get, post, put } from '@/utils/http'
-import { panelTypeAndRouteMapping } from '@/utils/constants'
+import { panelTypeAndRouteMapping, storageKey } from '@/utils/constants'
 import { api } from '@/utils/api'
 import { VAceEditor } from 'vue3-ace-editor'
 import 'ace-builds/src-noconflict/mode-javascript'
@@ -149,7 +149,7 @@ export default {
  data () {
    return {
      url: api.chart,
-      loginName: localStorage.getItem('cn-username'),
+      loginName: localStorage.getItem(storageKey.username),
      panelTypeAndRouteMapping: panelTypeAndRouteMapping,
      rules: { // 表单校验规则
        name: [
@@ -355,7 +355,7 @@ export default {
  },
  methods: {
    isCurrentUser (username) {
-      return localStorage.getItem('cn-username') === username
+      return localStorage.getItem(storageKey.username) === username
    },
    /* 密码失去焦点 检验确认密码 */
    pinBlur () {
@@ -397,7 +397,7 @@ export default {
      })
    },
    async getChartData (value) {
-      await get('/visual/chart?panelId=' + value).then(response => {
+      await get(api.chart, { panelId: value }).then(response => {
        if (response.code === 200) {
          this.chartData = response.data.list
        }
--- a/src/components/rightBox/settings/I18nBox.vue
+++ b/src/components/rightBox/settings/I18nBox.vue
@@ -57,13 +57,16 @@
 <script>
 import rightBoxMixin from '@/mixins/right-box'
 import { get, post, put } from '@/utils/http'
+import { storageKey } from '@/utils/constants'
+import { api } from '@/utils/api'
+
 export default {
  name: 'I18nBox',
  mixins: [rightBoxMixin],
  data () {
    return {
-      url: 'sys/i18n',
-      loginName: localStorage.getItem('cn-username'),
+      url: api.i18nBox,
+      loginName: localStorage.getItem(storageKey.username),
      rules: { // 表单校验规则
        name: [
          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
@@ -88,7 +91,7 @@ export default {
  },
  methods: {
    isCurrentUser (username) {
-      return localStorage.getItem('cn-username') === username
+      return localStorage.getItem(storageKey.username) === username
    },
    /* 密码失去焦点 检验确认密码 */
    pinBlur () {
@@ -130,7 +133,7 @@ export default {
      })
    },
    getLangData () {
-      get('sys/dict?type=lang&pageSize=-1').then(response => {
+      get(api.dict, { type: 'lang', pageSize: -1 }).then(response => {
        if (response.code === 200) {
          this.langData = response.data.list
        }
--- a/src/components/rightBox/settings/RoleBox.vue
+++ b/src/components/rightBox/settings/RoleBox.vue
@@ -50,6 +50,8 @@
 <script>
 import rightBoxMixin from '@/mixins/right-box'
 import { get, post, put } from '@/utils/http'
+import { api } from '@/utils/api'
+
 export default {
  name: 'userBox',
  mixins: [rightBoxMixin],
@@ -64,7 +66,7 @@ export default {
  data () {
    return {
      editRole: {},
-      url: 'sys/role',
+      url: api.role,
      rightBox: { model: { show: false } },
      rules: { // 表单校验规则
        name: [
@@ -110,7 +112,7 @@ export default {
      return new Promise(resolve => {
        self.menus = []
        if (self.editRole.id) {
-          get('/sys/role/menu/' + self.editRole.id).then(response => {
+          get(api.menu + self.editRole.id).then(response => {
            if (response.code == 200) {
              self.menus = response.data.menus
              self.selectedIds = response.data.selectedIds
@@ -120,7 +122,7 @@ export default {
            resolve()
          })
        } else {
-          get('/sys/menu').then(response => {
+          get(api.sysMenu).then(response => {
            if (response.code == 200) {
              self.menus = response.data.list
            } else {
--- a/src/components/rightBox/settings/UserBox.vue
+++ b/src/components/rightBox/settings/UserBox.vue
@@ -116,7 +116,9 @@
 <script>
 import rightBoxMixin from '@/mixins/right-box'
 import { get, post, put } from '@/utils/http'
-import { themeData, langData } from '@/utils/constants'
+import { themeData, langData, storageKey } from '@/utils/constants'
+import { api } from '@/utils/api'
+
 export default {
  name: 'UserBox',
  mixins: [rightBoxMixin],
@@ -131,8 +133,8 @@ export default {
      }
    }
    return {
-      url: 'sys/user',
-      loginName: localStorage.getItem('cn-username'),
+      url: api.user,
+      loginName: localStorage.getItem(storageKey.username),
      rules: { // 表单校验规则
        name: [
          { required: true, message: this.$t('validate.required'), trigger: 'blur' }
@@ -180,7 +182,7 @@ export default {
  },
  methods: {
    isCurrentUser (username) {
-      return localStorage.getItem('cn-username') === username
+      return localStorage.getItem(storageKey.username) === username
    },
    /* 密码失去焦点 检验确认密码 */
    pinBlur () {
@@ -222,7 +224,7 @@ export default {
      })
    },
    getRoleData () {
-      get('sys/role?pageSize=-1').then(response => {
+      get(api.role, { pageSize: -1 }).then(response => {
        if (response.code === 200) {
          this.roleData = response.data.list
        }
--- a/src/components/table/ColumnCustomize.vue
+++ b/src/components/table/ColumnCustomize.vue
@@ -38,6 +38,7 @@
 </template>

 <script>
+import { storageKey } from '@/utils/constants'
 export default {
  props: {
    customTableTitle: Array, // 自定义的title
@@ -51,9 +52,9 @@ export default {
    }
  },
  created () {
-    const localStorageTitle = JSON.parse(localStorage.getItem('cn-tableTitle-' + localStorage.getItem('cn-username') + '-' + this.tableId))
+    const localStorageTitle = JSON.parse(localStorage.getItem(storageKey.tableTitle + '-' + localStorage.getItem(storageKey.username) + '-' + this.tableId))
    if (localStorageTitle) {
-      localStorage.setItem('cn-tableTitle-' + localStorage.getItem('cn-username') + '-' + this.tableId, JSON.stringify(localStorageTitle))
+      localStorage.setItem(storageKey.tableTitle + '-' + localStorage.getItem(storageKey.username) + '-' + this.tableId, JSON.stringify(localStorageTitle))
    }
  },
  watch: {
@@ -92,10 +93,8 @@ export default {
    // 点击第二个cancel
    save () {
      this.$emit('update', this.custom)
-      localStorage.setItem(
-        'cn-tableTitle-' + localStorage.getItem('cn-username') + '-' + this.tableId,
-        JSON.stringify(this.custom)
-      )
+      localStorage.setItem(storageKey.tableTitle + '-' + localStorage.getItem(storageKey.username) + '-' + this.tableId,
+        JSON.stringify(this.custom))
      this.esc()
    }
  },
--- a/src/components/table/report/builtinReportTable.vue
+++ b/src/components/table/report/builtinReportTable.vue
@@ -8,7 +8,6 @@
      @header-dragend="dragend"
      @sort-change="tableDataSort"
      @selection-change="selectionChange"
-      @select="select"
  >
    <el-table-column
        :resizable="false"
@@ -69,7 +68,7 @@
    </el-table-column>
  </el-table>
  <div class="table-operation-all">
-    <el-checkbox v-model="checkboxAll" @change="builtinReportCheckbox(tableData)"></el-checkbox>
+    <el-checkbox v-model="checkboxAll" @change="selectAll(tableData)"></el-checkbox>
    <div class="table-operation-all-span">
      <span>{{ $t('overall.all') }}</span>
      <div class="table-operation-back-down" :class="{'table-operation-all-checkbox': batchDow, 'table-operation-all-loading': loading}" @click="tableOperation(['download', this.checkboxIds, 'builtin'])">
@@ -128,7 +127,7 @@ export default {
      this.checkboxAll = objs.length > 0 || objs.length === this.tableData.length
      this.batchDow = objs.length > 0
    },
-    builtinReportCheckbox (objs) {
+    selectAll (objs) {
      if (objs) {
        objs.forEach(item => {
          this.$refs.dataTable.toggleAllSelection(item)
--- a/src/components/table/settings/UserTable.vue
+++ b/src/components/table/settings/UserTable.vue
@@ -82,13 +82,14 @@
 <script>
 import table from '@/mixins/table'
 import { put } from '@/utils/http'
+import { storageKey } from '@/utils/constants'

 export default {
  name: 'userTable',
  mixins: [table],
  data () {
    return {
-      loginName: localStorage.getItem('cn-username'),
+      loginName: localStorage.getItem(storageKey.username),
      tableTitle: [ // 原始table列
        {
          label: 'ID',
--- a/src/mixins/common.js
+++ b/src/mixins/common.js
@@ -1,5 +1,6 @@
 import { hasButton } from '@/permission'
 import { getMillisecond } from '@/utils/date-util'
+import { storageKey } from '@/utils/constants'
 export default {
  data () {
    return {
@@ -42,7 +43,7 @@ export default {
    utcTimeToSysTime (str) { // utc 0 到系统设置的时区
      let date = ''
      if (isNaN(str)) {
-        date = window.$dayJs(str).valueOf() + localStorage.getItem('cn-timezone-local-offset') * 60 * 60 * 1000
+        date = window.$dayJs(str).valueOf() + localStorage.getItem(storageKey.timezoneLocalOffset) * 60 * 60 * 1000
      } else {
        date = str
      }
--- a/src/mixins/data-list.js
+++ b/src/mixins/data-list.js
@@ -4,6 +4,9 @@ import { get, del } from '@/utils/http'
 import { ref } from 'vue'
 import pagination from '@/components/common/Pagination'
 import axios from 'axios'
+import { api } from '@/utils/api'
+import { storageKey } from '@/utils/constants'
+
 export default {
  components: {
    pagination
@@ -120,7 +123,7 @@ export default {
    },
    pageSize (val) {
      this.pageObj.pageSize = val
-      localStorage.setItem('cn-pageSize-' + localStorage.getItem('cn-username') + '-' + this.tableId, val)
+      localStorage.setItem(storageKey.pageSize + '-' + localStorage.getItem(storageKey.username) + '-' + this.tableId, val)
      this.getTableData()
    },
    add () {
@@ -153,13 +156,13 @@ export default {
      let params = {}
      if (n === 'builtin') {
        fileName = 'builtinReport' + '-' + this.getTimeString() + '.zip' // 文件名称
-        url = '/report/job/batchDownloadPdf' // 批量 zip 下载
+        url = api.reportBatchDownloadPdf // 批量 zip 下载
        params = {
          ids: u
        }
      } else {
        fileName = u.name + '.pdf' // 文件名称
-        url = '/report/job/downloadPdf' // 单个 pdf 下载
+        url = api.reportDownloadPdf // 单个 pdf 下载
        params = {
          id: u.id
        }
@@ -202,7 +205,7 @@ export default {
      const params = {
        id: u.id
      }
-      axios.get('/report/job/view', { params: params }).then(res => {
+      axios.get(api.reportView, { params: params }).then(res => {
        const prevWindow = window.open('', '')
        prevWindow.document.write(res.data)
        prevWindow.focus()
@@ -257,11 +260,11 @@ export default {
    }
  },
  mounted () {
-    const pageSize = localStorage.getItem('cn-pageSize-' + localStorage.getItem('cn-username') + '-' + this.tableId)
+    const pageSize = localStorage.getItem(storageKey.pageSize + '-' + localStorage.getItem(storageKey.username) + '-' + this.tableId)
    if (pageSize && pageSize !== 'undefined') {
      this.pageObj.pageSize = pageSize
    }
-    let localStorageTableTitle = localStorage.getItem('cn-tableTitle-' + localStorage.getItem('cn-username') + '-' + this.tableId)
+    let localStorageTableTitle = localStorage.getItem(storageKey.tableTitle + '-' + localStorage.getItem(storageKey.username) + '-' + this.tableId)
    localStorageTableTitle = localStorageTableTitle ? JSON.parse(localStorageTableTitle) : this.$refs.dataTable.tableTitle
    this.tools.customTableTitle = this.$refs.dataTable.tableTitle.map((item, index) => { // 修复切换中英文的问题
      if (localStorageTableTitle[index]) {
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -1,6 +1,7 @@
 import { createStore } from 'vuex'
 import user from './modules/user'
 import panel from './modules/panel'
+import { storageKey } from '@/utils/constants'

 const store = createStore({
  modules: {
@@ -9,7 +10,7 @@ const store = createStore({
  },
  state () {
    return {
-      isShrink: localStorage.getItem('cn-left-menu-shrink') === 'true',
+      isShrink: localStorage.getItem(storageKey.leftMenuShrink) === 'true',
      i18n: false,

      showEntityTypeSelector: false, // 在entity explore页面时，控制header显示实体类型选择框
@@ -33,7 +34,7 @@ const store = createStore({
  mutations: {
    isShrink (state) {
      state.isShrink = !state.isShrink
-      localStorage.setItem('cn-left-menu-shrink', state.isShrink)
+      localStorage.setItem(storageKey.leftMenuShrink, state.isShrink)
    },
    loadI18n (state) {
      state.i18n = true
--- a/src/store/modules/user.js
+++ b/src/store/modules/user.js
@@ -4,6 +4,9 @@ import { sortByOrderNum, getWelcomeMenu } from '@/permission'
 import dayjs from 'dayjs'
 import utc from 'dayjs/plugin/utc'
 import { ElMessage } from 'element-plus' // dependent on utc plugin
+import { storageKey } from '@/utils/constants'
+import { api } from '@/utils/api'
+
 dayjs.extend(utc)

 const user = {
@@ -45,15 +48,15 @@ const user = {
    loginSuccess (store, res) {
      console.info(res)
      window.$dayJs.tz.setDefault(res.data.timezone)
-      localStorage.setItem('cn-token', res.data.token)
-      localStorage.setItem('cn-sys-name', res.data.systemName)
+      localStorage.setItem(storageKey.token, res.data.token)
+      localStorage.setItem(storageKey.sysName, res.data.systemName)
      if (res.systemLogo) {
-        localStorage.setItem('cn-sys-logo', res.data.systemLogo)
+        localStorage.setItem(storageKey.sysLogo, res.data.systemLogo)
      }
-      localStorage.setItem('cn-sys-timezone', res.data.timezone)
-      localStorage.setItem('cn-timezone-offset', dayjs.tz().utcOffset() / 60)
-      localStorage.setItem('cn-timezone-local-offset', dayjs().utcOffset() / 60)
-      post('/sys/user/permissions', { token: res.data.token }).then(res2 => {
+      localStorage.setItem(storageKey.sysTimezone, res.data.timezone)
+      localStorage.setItem(storageKey.timezoneOffset, dayjs.tz().utcOffset() / 60)
+      localStorage.setItem(storageKey.timezoneLocalOffset, dayjs().utcOffset() / 60)
+      post(api.permissions, { token: res.data.token }).then(res2 => {
        const menuList = sortByOrderNum(res2.data.menus)
        store.commit('setMenuList', menuList)
        store.commit('setButtonList', res2.data.buttons)
@@ -90,9 +93,9 @@ const user = {
      })
    },
    logoutSuccess (store, res) {
-      localStorage.removeItem('cn-username')
-      localStorage.removeItem('cn-username')
-      localStorage.removeItem('cn-token')
+      localStorage.removeItem(storageKey.username)
+      localStorage.removeItem(storageKey.username)
+      localStorage.removeItem(storageKey.token)
    }
  }
 }
--- a/src/utils/api.js
+++ b/src/utils/api.js
@@ -11,15 +11,33 @@ import { storageKey } from '@/utils/constants'
 export const api = {
  // 系统相关
  permission: '/sys/user/permissions',
-  i18n: '/sys/i18n/lang',
  dict: '/sys/dict',
-  user: '/sys/user',
-  role: '/sys/role',
-  galaxyProxy: '/galaxy/setting',
+  logout: '/logout',
+  pin: 'sys/user/pin',
+  appearance: '/sys/appearance',
+  permissions: '/sys/user/permissions',
  operationLog: '/sys/log',
+  // user
+  user: '/sys/user',
+  // role
+  role: '/sys/role',
+  menu: '/sys/role/menu/',
+  sysMenu: '/sys/menu/',
+
+  // i18n
+  i18n: '/sys/i18n/lang',
+  i18nBox: '/sys/i18n',
+  // chart
  chartList: '/visual/chart/list',
+  // galaxyProxy
+  galaxyProxy: '/galaxy/setting',
+
  // 报告相关
-  builtinReport: '/report/job',
+  reportJob: '/report/job',
+  reportTemp: '/report/temp',
+  reportBatchDownloadPdf: '/report/job/batchDownloadPdf',
+  reportDownloadPdf: '/report/job/downloadPdf',
+  reportView: '/report/job/view',
  // 业务
  panel: '/visual/panel',
  chart: '/visual/chart',
@@ -100,6 +118,12 @@ export const api = {
      overviewBasic: '/interface/detection/performance/detail/overview/basic',
      metric: '/interface/detection/performance/detail/overview/metric'
    }
+  },
+  // Dashboard
+  dashboard: {
+    DnsServiceInsights: {
+      alarmInfoCount: '/interface/dns/alarmInfoCount'
+    }
  }
 }

@@ -172,7 +196,7 @@ export async function getConfigJson () {

 export async function getPermission () {
  const request = new Promise(resolve => {
-    post(api.permission, { token: localStorage.getItem('cn-token') }).then(response => {
+    post(api.permission, { token: localStorage.getItem(storageKey.token) }).then(response => {
      resolve({
        menuList: sortByOrderNum(response.data.menus),
        buttonList: response.data.buttons,
--- a/src/utils/constants.js
+++ b/src/utils/constants.js
@@ -15,6 +15,10 @@ export const storageKey = {
  username: 'cn-username',
  sysName: 'cn-sys-name',
  sysLogo: 'cn-sys-logo',
+  pageSize: 'cn-pageSize',
+  sysTimezone: 'cn-sys-timezone',
+  tableTitle: 'cn-tableTitle',
+  dataRangeHistory: 'date-range-history',
  tableTitlePrefix: 'cn-table-title',
  tablePageSizePrefix: 'cn-page-size',
  leftMenuShrink: 'cn-left-menu-shrink',
--- a/src/utils/http.js
+++ b/src/utils/http.js
@@ -2,7 +2,7 @@ import axios from 'axios'
 import { storageKey } from '@/utils/constants'

 axios.interceptors.request.use(config => {
-  const token = localStorage.getItem('cn-token')
+  const token = localStorage.getItem(storageKey.token)
  if (token) {
    config.headers.Authorization = token // 请求头token
  }
--- a/src/views/charts/charts/ChartAlarmInfo.vue
+++ b/src/views/charts/charts/ChartAlarmInfo.vue
@@ -112,6 +112,7 @@ import unitConvert from '@/utils/unit-convert'
 import ChartTablePagination from '@/views/charts/charts/ChartTablePagination'
 import { get } from '@/utils/http'
 import { getMillisecond } from '@/utils/date-util'
+import { api } from '@/utils/api'

 export default {
  name: 'isAlarmInfo',
@@ -189,7 +190,7 @@ export default {
          this.tabHandleClickType === 'All' ? '' : this.tabHandleClickType
      }
      this.$nextTick(() => {
-        get('/interface/dns/alarmInfoCount', {
+        get(api.dashboard.DnsServiceInsights.alarmInfoCount, {
          ...countQuery
        }).then((response) => {
          if (response.code === 200) {
@@ -221,7 +222,7 @@ export default {
        startTime: query.startTime,
        endTime: query.endTime
      })
-      get('/interface/dns/alarmInfoCount', {
+      get(api.dashboard.DnsServiceInsights.alarmInfoCount, {
        ...query
      }).then((response) => {
        if (response.code === 200) {
--- a/src/views/report/builtinReport.vue
+++ b/src/views/report/builtinReport.vue
@@ -7,7 +7,7 @@
      <div class="cn-builtin-left-menu" :class="{'cn-active': builtinId === ''}" @click="builtinTabs('', '')">
        {{$t('dns.all')}}
      </div>
-      <div class="cn-builtin-left-menu" :class="{'cn-active': builtinId === item.id}" v-for="item in builtinReportLeftMenu" :key="item.id" @click="builtinTabs(item, item.id)">
+      <div class="cn-builtin-left-menu" :class="{'cn-active': builtinId === item.id}" v-for="item in builtinReportLeftMenu" :key="item.id" @click="builtinTabs(item.id)">
        {{item.name}}
      </div>
    </div>
@@ -56,10 +56,10 @@ export default {
  name: 'Report',
  data () {
    return {
-      builtinReportLeftMenu: [],
+      builtinReportLeftMenu: [], // 左侧列表菜单数据
      builtinColor: false,
      builtinId: '',
-      url: api.builtinReport,
+      url: api.reportJob,
      blankObject: { // 空白对象
        id: '',
        name: '',
@@ -78,20 +78,20 @@ export default {
    builtinReportTable
  },
  methods: {
-    builtinReportData () {
-      get('/report/temp').then(res => {
+    queryGetTempData () {
+      get(api.reportTemp).then(res => {
        if (res.code === 200) {
          this.builtinReportLeftMenu = res.data.list
        }
      })
    },
-    builtinTabs (data, id) {
+    builtinTabs (id) {
      this.builtinId = id
-      this.getTableData({ name: data.name, tempId: data.id })
+      this.getTableData({ tempId: id })
    }
  },
  mounted () {
-    this.builtinReportData()
+    this.queryGetTempData()
  }
 }
 </script>
--- a/src/views/settings/I18n.vue
+++ b/src/views/settings/I18n.vue
@@ -58,6 +58,7 @@ import cnDataList from '@/components/table/CnDataList'
 import dataListMixin from '@/mixins/data-list'
 import i18nTable from '@/components/table/settings/I18nTable'
 import i18nBox from '@/components/rightBox/settings/I18nBox'
+import  { api } from '@/utils/api'
 import { put } from '@/utils/http'

 export default {
@@ -70,7 +71,7 @@ export default {
  },
  data () {
    return {
-      url: 'sys/i18n',
+      url: api.i18n,
      blankObject: { // 空白对象
        id: '',
        name: '',