Merge branch 'dev-2.0' of https://git.mesalab.cn/nezha/nezha-fronted into dev-2.0

2021-05-12 14:46:14 +08:00
parent 37694b1739 501321d588
commit 21d3580707
17 changed files with 168 additions and 160 deletions
--- a/nezha-fronted/src/assets/stylus/main.scss
+++ b/nezha-fronted/src/assets/stylus/main.scss
@@ -362,7 +362,7 @@ li{
 .nz-btn-disabled {
  background-image: none;
  opacity: .6;
-  cursor: default;
+  cursor: default !important;
 }
 .nz-btn-group {
  border-radius: 2px;
--- a/nezha-fronted/src/components/common/language/cn.js
+++ b/nezha-fronted/src/components/common/language/cn.js
@@ -1121,7 +1121,7 @@ const cn = {
      create: '创建告警静默',
      edit: '修改告警静默',
      time: '时间',
-      matchers: 'matchers',
+      matchers: '规则',
      remark: '描述',
      selectTime: '请选择时间',
      selectMather: '必填项',
@@ -1148,7 +1148,7 @@ const cn = {
      endpointInfo: 'Endpoint信息'
    },
    project: {
-      project: '系统',
+      project: '名称',
      projectName: '系统名称',
      editProject: '编辑系统',
      description: '描述',
@@ -1175,7 +1175,7 @@ const cn = {
      authProtocol: '认证协议',
      privProtocol: '隐私协议',
      contextName: '内容名称',
-      alerts: 'Alerts',
+      alerts: '告警',
      privpin: '隐私密码',
      asset: 'Asset',
      editEndpoint: '编辑 Endpoint',
--- a/nezha-fronted/src/components/common/language/en.js
+++ b/nezha-fronted/src/components/common/language/en.js
@@ -1143,7 +1143,7 @@ const en = {
      create: 'New alert silence',
      edit: 'Edit alert silence',
      time: 'Time',
-      matchers: 'matchers',
+      matchers: 'Matchers',
      remark: 'Description',
      selectTime: 'Please select time',
      selectMather: 'Required',
@@ -1194,7 +1194,7 @@ const en = {
      privProtocol: 'Priv protocol',
      contextName: 'Context name',
      privpin: 'Priv password',
-      alerts: 'Alerts',
+      alerts: 'Alert',
      asset: 'Asset',
      editEndpoint: 'Edit endpoint',
      createEndpoint: 'New endpoint',
--- a/nezha-fronted/src/components/common/login.vue
+++ b/nezha-fronted/src/components/common/login.vue
@@ -1,7 +1,7 @@
 <template>
  <div class="login" @click="langListShow = false">
    <div class="model"></div>
-    <div class="logo"><img height="155" src="../../assets/img/logo-big.png"></div>
+    <div class="logo"><img src="../../assets/img/logo-big.png"></div>
    <div class='login-box'>
      <div class="login-label"></div>
      <div class="login-input">
@@ -14,7 +14,7 @@
        <input v-model="loginData.pin" type="password" name="password" autocomplete="on" :placeholder="$t('login.pin')"></input>
      </div>
      <div class="login-foot">
-        <button @click="login" class="login-btn" id="login" v-loading="loading" :class="{'nz-btn-disabled btn-disabled-cursor-not-allowed':!license.valid}">{{$t("login.login")}}</button>
+        <button id="login" v-loading="loading" :class="{'nz-btn-disabled': !license.valid}" class="login-btn" @click="login">{{$t("login.login")}}</button>
        <div class="login-foot-lang" @click.stop="langListShow = !langListShow">
          <i v-if="lang == 'en'" class="nz-icon nz-icon-lang-en"></i>
          <i v-else-if="lang == 'cn'" class="nz-icon nz-icon-lang-zh"></i>
@@ -27,7 +27,7 @@
      </div>
      <div class="login-license">
        <div class="license-warn" v-if="license.warnInfo">{{license.warnInfo}}</div>
-        <div class="license-info" v-if="!license.valid">INSTALLATION ID:{{license.token}}</div>
+        <div v-if="!license.valid" class="license-info">INSTALLATION ID:&nbsp;{{license.token}}</div>
        <div class="license-upload" v-if="!license.valid">
          <el-upload
            ref="upload"
@@ -50,7 +50,6 @@

 <script>
 import { mapActions } from 'vuex'
-import moment from 'moment-timezone'
 export default {
  name: 'login',
  data () {
@@ -75,7 +74,7 @@ export default {
  methods: {
    ...mapActions(['loginSuccess']),
    login () {
-      if (this.loading) {
+      if (this.loading || !this.license.valid) {
        return
      }
      // if (this.license.valid && this.validateLogin() && (this.$route.path == '/' || this.$route.path == '/login')) {
@@ -112,9 +111,12 @@ export default {
        return true
      }
    },
-    licenseStat: function () {
+    licenseStat () {
+      /*this.license.valid = false
+      this.license.warnInfo = 'hehehe'
+      this.license.token = 'dRqrWja/PzI8FrWVJeGqLw=='*/
      this.$get('/sys/license/state').then(response => {
-        if (response.code === 200) {
+        if (response.code && response.code === 200) {
          this.license.warnInfo = ''
          this.license.valid = true
        } else {
@@ -124,7 +126,7 @@ export default {
        this.license.token = response.token
      })
    },
-    handleChange: function (file, fileList) {
+    handleChange (file, fileList) {
      if (fileList.length > 0) {
        this.uploadFileList = [fileList[fileList.length - 1]]
      }
@@ -144,7 +146,7 @@ export default {
    }
  },
  watch: {
-    /* 'loginData.username': function(n, o) {
+    /* 'loginData.username'(n, o) {
      let lang = localStorage.getItem('nz-language-' + n);
      if (lang) {
        this.lang = lang;
@@ -168,9 +170,13 @@ export default {

 <style scoped lang="scss">
 .login {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  position: relative;
  background-image: url("../../assets/img/login-background.png");
  background-size: cover;
-  position: relative;
 }
 .model {
  height: 100%;
@@ -183,24 +189,20 @@ export default {
 }

 .logo {
-  position: absolute;
-  top: 25%;
-  left: 50%;
-  transform: translateX(-50%);
  z-index: 2;
+  width: 460px;
+  img{
+    width: 100%;
+  }
 }

 .login-box {
-  width: 460px;
-  position: absolute;
-  left: 50%;
-  transform: translateX(-50%);
-  top: 50%;
  z-index: 2;
+  width: 460px;
 }

 .login-box .login-input {
-  padding: 20px 0;
+  padding: 12px 0;
  height: 60px;
  position: relative;
 }
@@ -233,15 +235,18 @@ export default {

 .login-btn {
  color: white;
-  border-radius: 3px;
-  background-image: $btn-normal-background-color;
+  border-radius: $--button-border-radius;
+  background-color: var(--theme-color-light-20);
  border: none;
  outline: none;
  height: 44px;
  width: 320px;
  cursor: pointer;
  font-size: 14px;
-  box-shadow: 0 2px 3px 2px rgba(0, 0, 0, 0.30);
+  transition: all linear .2s;
+}
+.login-btn:not(.nz-btn-disabled):hover {
+  background-color: var(--theme-color-light-30);
 }

 .login-foot-lang {
@@ -288,7 +293,8 @@ export default {
  position: absolute;
  bottom: 20px;
  z-index: 100;
-  left: calc(50% - 90px);
+  left: 50%;
+  transform: translateX(-50%);
  a{
    font-size: 14px;
    color: #eee;
@@ -309,23 +315,21 @@ export default {
  text-align: center;
  line-height: 30px;
  .license-warn{
-    color: #EF7458;
+    color: #d92926;
+    text-shadow: 1px 1px 3px #ddd;
  }
  .license-info {
+    margin-bottom: 10px;
+    color: white;
+    text-shadow: 1px 1px 3px #333;
    white-space: nowrap;
  }
  .login-btn{
-    height: 30px;
-    width: 120px;
+    height: 40px;
+    width: auto;
+    padding: 0 20px;
  }
 }
-.login-btn.nz-btn-disabled{
-  background-image: none;
-  color: #e5e5e5;
-  background-color: #ffffff;
-  border-color: #e5e5e5 ;
-  cursor: default;
-}
 </style>
 <style>
  .license-upload .el-upload-list{
--- a/nezha-fronted/src/components/common/mixin/dataList.js
+++ b/nezha-fronted/src/components/common/mixin/dataList.js
@@ -234,9 +234,12 @@ export default {
    if (pageSize && pageSize !== 'undefined') {
      this.pageObj.pageSize = pageSize
    }
-    this.tools.customTableTitle = localStorage.getItem('nz-tableTitle-' + localStorage.getItem('nz-username') + '-' + this.tableId)
-      ? JSON.parse(localStorage.getItem('nz-tableTitle-' + localStorage.getItem('nz-username') + '-' + this.tableId))
-      : this.$refs.dataTable.tableTitle
+    let localStorageTableTitle = localStorage.getItem('nz-tableTitle-' + localStorage.getItem('nz-username') + '-' + this.tableId)
+    localStorageTableTitle = localStorageTableTitle ? JSON.parse(localStorageTableTitle) : this.$refs.dataTable.tableTitle
+    this.tools.customTableTitle = localStorageTableTitle.map((item, index) => { // 修复切换中英文的问题
+      item.label = this.$refs.dataTable.tableTitle[index].label
+      return item
+    })
    if (!this.fromBottom) {
      this.getTableData()
    }
--- a/nezha-fronted/src/components/common/popBox/guide.vue
+++ b/nezha-fronted/src/components/common/popBox/guide.vue
@@ -1,12 +1,9 @@
 <template>
-  <div>
  <el-dialog
    :title="$t('guide.title')"
    :visible.sync="visible"
    custom-class="guild-pop"
    width="1000px"
-      @closed="dialogClosed"
-      @open="dialogOpened"
  >
    <div class="guide-list">
      <div ref="guideShadow" class="guide-shadow"></div>
@@ -64,7 +61,6 @@
      </template>
    </div>
  </el-dialog>
-  </div>
 </template>

 <script>
@@ -122,14 +118,6 @@ export default {
    }
  },
  methods: {
-    dialogOpened () {
-      if (this.$refs.changePinForm) {
-        this.$refs.changePinForm.resetFields()
-      }
-    },
-    dialogClosed () {
-      this.$emit('dialogClosed')
-    },
    close () {
      this.visible = false
    },
@@ -142,10 +130,10 @@ export default {
      this.interval && clearInterval(this.interval)
    },
    downloadAgent () {
-
+      // TODO
    },
    openTerminal () {
-
+      // TODO
    },
    jump (route) {
      this.visible = false
--- a/nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue
+++ b/nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue
@@ -160,7 +160,7 @@ export default {
      } else if (this.importUrl.indexOf('rule') > -1) {
        url = '/alert/rule/cancelImport'
      } else if (this.importUrl.indexOf('panel') > -1) {
-        url = '/panel/cancelImport'
+        url = 'visual/panel/cancelImport'
      } else if (this.importUrl.indexOf('tmpl') > -1) {
        url = '/expression/tmpl/cancelImport'
      }
@@ -227,7 +227,7 @@ export default {
      } else if (this.importUrl.indexOf('rule') > -1) {
        url = '/alert/rule/template'
      } else if (this.importUrl.indexOf('panel') > -1) {
-        url = '/panel/template'
+        url = 'visual/panel/template'
      } else if (this.importUrl.indexOf('endpoint') > -1) {
        url = '/monitor/endpoint/template'
      } else if (this.importUrl.indexOf('tmpl') > -1) {
--- a/nezha-fronted/src/components/common/table/alert/alertSilenceTable.vue
+++ b/nezha-fronted/src/components/common/table/alert/alertSilenceTable.vue
@@ -127,12 +127,12 @@ export default {
          sortable: 'custom'
        },
        {
-          label: 'Name',
+          label: this.$t('alert.silence.name'),
          prop: 'name',
          show: true,
          width: 150
        }, {
-          label: 'Matchers',
+          label: this.$t('alert.silence.matchers'),
          prop: 'matchers',
          show: true,
          sortable: 'custom'
--- a/nezha-fronted/src/components/page/alert/alertRule.vue
+++ b/nezha-fronted/src/components/page/alert/alertRule.vue
@@ -12,15 +12,16 @@
      <template v-slot:top-tool-right>
        <export-excel
          id="alert-rule"
+          :permissions="{import: 'alertRule_add'}"
          :params="searchLabel"
-          :permissions="{import: 'rule_import', export: 'rule_export'}"
+          class="top-tool-export margin-r-10"
          export-file-name="AlertRule"
          export-url="/alert/rule/export"
          import-url="/alert/rule/import"
          @afterImport="getTableData"
        >
          <template slot="optionZone">
-            <button id="alert-add" v-has="'alertRule_add'" :title="$t('overall.createAlertRule')" class="top-tool-btn margin-r-10"
+            <button id="alert-add" v-has="'alertRule_add'" :title="$t('overall.createAlertRule')" class="top-tool-btn"
                    @click="add">
              <i class="nz-icon-create-square nz-icon"></i>
            </button>
--- a/nezha-fronted/src/components/page/config/menus.vue
+++ b/nezha-fronted/src/components/page/config/menus.vue
@@ -125,6 +125,12 @@ export default {
        }]
      }
    }
+  },
+  methods: {
+    edit (u) {
+      this.object ={...u}
+      this.rightBox.show = true
+    },
  }
 }
 </script>
--- a/nezha-fronted/src/components/page/config/template/chartTemp.vue
+++ b/nezha-fronted/src/components/page/config/template/chartTemp.vue
@@ -1,6 +1,6 @@
 <template>
  <div>
-    <nz-data-list
+    <nzDataList
      ref="dataList"
      :api="url"
      :layout="['searchInput', 'elementSet']"
@@ -58,7 +58,7 @@
      <template v-slot:pagination>
        <Pagination ref="Pagination" :pageObj="pageObj" :tableId="tableId" @pageNo='pageNo' @pageSize='pageSize'></Pagination>
      </template>
-    </nz-data-list>
+    </nzDataList>
    <transition name="right-box">
      <chart-box :chart="object" :show-panel="showPanel" :from="'temp'"  @close="closeChartBox" @delete-chart="delChart" @on-create-success="createSuccess" @on-delete-success="delChartOk" @reload="panelReload" @reloadOnlyPanel="panelReloadOnlyPanel" ref="addChartModal" v-if="rightBox.show"></chart-box>
    </transition>
@@ -70,7 +70,6 @@ import bus from '@/libs/bus'
 import exportXLSX from '@/components/common/exportXLSX'
 import chartBox from '@/components/page/dashboard/chartBox'
 import deleteButton from '@/components/common/deleteButton'
-import nzDataList from '@/components/common/table/nzDataList'
 import dataListMixin from '@/components/common/mixin/dataList'
 import chartTmplTable from '@/components/common/table/settings/chartTmplTable'

@@ -79,7 +78,6 @@ export default {
  components: {
    chartBox,
    deleteButton,
-    nzDataList,
    chartTmplTable,
    'export-excel': exportXLSX
  },
--- a/nezha-fronted/src/components/page/config/template/exprTemp.vue
+++ b/nezha-fronted/src/components/page/config/template/exprTemp.vue
@@ -1,6 +1,6 @@
 <template>
  <div>
-    <nz-data-list
+    <nzDataList
      ref="dataList"
      :api="url"
      :layout="['searchInput', 'elementSet']"
@@ -37,7 +37,8 @@
        </export-excel>

        <delete-button :delete-objs="batchDeleteObjs" @after="getTableData"
-                       id="alert-msg-batch-delete" v-has="'expressionTemplate_delete'" :api="url"></delete-button></template>
+                       id="alert-msg-batch-delete" v-has="'expressionTemplate_delete'" :api="url"></delete-button>
+      </template>
      <template v-slot:default="slotProps">
        <expr-tmpl-table
          ref="dataTable"
@@ -58,7 +59,7 @@
      <template v-slot:pagination>
        <Pagination ref="Pagination" :pageObj="pageObj" :tableId="tableId" @pageNo='pageNo' @pageSize='pageSize'></Pagination>
      </template>
-    </nz-data-list>
+    </nzDataList>
    <transition name="right-box">
      <expr-tmpl-box v-if="rightBox.show" :exprTemp="object" @close="closeRightBox"></expr-tmpl-box>
    </transition>
@@ -84,7 +85,6 @@ import bus from '@/libs/bus'
 import exportXLSX from '@/components/common/exportXLSX'
 import exprTmplBox from '@/components/common/rightBox/exprTmplBox'
 import deleteButton from '@/components/common/deleteButton'
-import nzDataList from '@/components/common/table/nzDataList'
 import dataListMixin from '@/components/common/mixin/dataList'
 import exprTmplTable from '@/components/common/table/settings/exprTmplTable'

@@ -93,7 +93,6 @@ export default {
  components: {
    deleteButton,
    exprTmplBox,
-    nzDataList,
    exprTmplTable,
    'export-excel': exportXLSX
  },
--- a/nezha-fronted/src/components/page/config/template/index.vue
+++ b/nezha-fronted/src/components/page/config/template/index.vue
@@ -1,7 +1,7 @@
 <template>
-  <div>
-    <exprTemp class="template-tab" :show-tab="showTab" v-show="showTab == 'exprTemp'" @changeShowTab="changeShowTab" @toCredentialTab="changeTab(['mib','credentials'],'credentials')" @toBrowserTab="changeTab(['mib','browser'],'browser')"></exprTemp>
-    <chartTemp class="template-tab" :show-tab="showTab" v-if="showTab == 'chartTemp'" @changeShowTab="changeShowTab" @toCredentialTab="changeTab(['mib','credentials'],'credentials')" @toBrowserTab="changeTab(['mib','browser'],'browser')"></chartTemp>
+  <div class="temp">
+    <exprTemp class="template-tab" :show-tab="showTab" v-if="showTab == 'exprTemp'" @changeShowTab="changeShowTab"></exprTemp>
+    <chartTemp class="template-tab" :show-tab="showTab" v-if="showTab == 'chartTemp'" @changeShowTab="changeShowTab"></chartTemp>
  </div>
 </template>

@@ -9,14 +9,14 @@
 import exprTemp from './exprTemp'
 import chartTemp from './chartTemp'
 export default {
-  name: 'template',
+  name: 'v-template',
  components: {
    exprTemp,
    chartTemp
  },
  data () {
    return {
-      showTab: 'exprTemp'
+      showTab: ''
    }
  },
  methods: {
@@ -45,16 +45,10 @@ export default {
      this.showTab = showTab
    }
  },
-  watch: {
-    $routePath: {
-
-      immediate: true,
-      handler (n, o) {
-        if (n.indexOf('mib') != -1 && this.$route.params.tab) {
-          this.$set(this, 'showTab', this.$route.params.tab)
-        }
-      }
-    }
+  mounted () {
+    this.$nextTick(()=>{
+      this.showTab = 'exprTemp'
+    })
  }
 }
 </script>
--- a/nezha-fronted/src/components/page/dashboard/panel.vue
+++ b/nezha-fronted/src/components/page/dashboard/panel.vue
@@ -57,7 +57,7 @@
                </template>
                <template v-slot:after>
                  <el-dropdown-item v-has="'panel_chart_add'">
-                    <div id="chart-temp-add" @click="addChartByTemp"><i class="nz-icon nz-icon-download1"></i>Add by template</div>
+                    <div id="chart-temp-add" @click="addChartByTemp"><i class="nz-icon nz-icon-add"></i>Add by template</div>
                  </el-dropdown-item>
                </template>
              </top-tool-more-options>
--- a/nezha-fronted/src/main.js
+++ b/nezha-fronted/src/main.js
@@ -33,6 +33,7 @@ import bus from '@/libs/bus'
 import theme from '@/assets/css/theme.scss'
 import myDatePicker from '@/components/common/myDatePicker'
 import vSelectPage from 'v-selectpage'
+import nzDataList from '@/components/common/table/nzDataList'
 Vue.use(vSelectPage, {
  dataLoad: function (vue, url, params) {
    if (params.pageNumber) {
@@ -52,6 +53,7 @@ Vue.component('element-set', elementSet)
 Vue.component('loading', loading)
 Vue.component('pick-time', pickTime)
 Vue.component('myDatePicker', myDatePicker)
+Vue.component('nzDataList', nzDataList)

 Vue.prototype.$axios = axios
 Vue.prototype.$post = post
--- a/nezha-fronted/src/permission.js
+++ b/nezha-fronted/src/permission.js
@@ -1,6 +1,6 @@
 import router from './router'
 import store from './store'
-import { post } from './http'
+import { get, post } from './http'
 import ElementUI from 'element-ui'
 import Vue from 'vue'
 import i18n from './components/common/i18n'
@@ -8,19 +8,32 @@ import VueResource from 'vue-resource'

 Vue.use(VueResource)

-const loginWhiteList = ['/login', '/setup', '/sys/license/upload', '/sys/license/state'] // 免登陆白名单
+const loginWhiteList = ['/setup', '/sys/license/upload', '/sys/license/state'] // 免登陆白名单
 const permissionWhiteList = ['/menu', ...loginWhiteList] // 权限白名单

 router.beforeEach((to, from, next) => {
-  if (sessionStorage.getItem('nz-token')) {
+  if (to.path === '/login') { // 拦截登录页面，系统初始化检查
+    const configUrl = 'static/config.json?Timestamp=' + new Date().getTime()
+    Vue.http.get(configUrl).then(config => {
+      get(config.body.baseUrl + 'setup/inited').then(res => {
+        if (res.code === 200) {
+          if (res.inited === 0) {
+            next({ path: '/setup' })
+          } else {
+            next()
+          }
+        }
+      })
+    })
+  } else if (sessionStorage.getItem('nz-token')) {
    if (permissionWhiteList.indexOf(to.path) !== -1) {
      next()
    } else {
      new Promise(resolve => {
        if (store.getters.menuList.length === 0) {
          const configUrl = 'static/config.json?Timestamp=' + new Date().getTime()
-          Vue.http.get(configUrl).then(res => {
-            post(res.body.baseUrl + 'sys/user/permissions', { token: sessionStorage.getItem('nz-token') }).then(res => {
+          Vue.http.get(configUrl).then(config => {
+            post(config.body.baseUrl + 'sys/user/permissions', { token: sessionStorage.getItem('nz-token') }).then(res => {
              store.commit('setMenuList', sortByOrderNum(res.data.menus))
              store.commit('setButtonList', res.data.buttons)
              store.commit('setRoleList', res.data.roles)