feat: 没有数据时panel、module、project、asset处理

nezha-fronted/src/assets/stylus/main.scss

@@ -469,6 +469,9 @@ li{
   margin: 0 0 12px;
   display: block;
 }
+.content-left .sidebar-info-item-add {
+  padding-left: calc(50% - 14px);
+}
 .content-left .sidebar-info-item.el-checkbox {
   padding: 0;
 }

nezha-fronted/src/components/common/header.vue

@@ -49,30 +49,36 @@
 
       <el-submenu index="2" popper-class="nz-submenu">
         <template slot="title">
-          <div @click="jumpToProject(projectData[0], 0)" :class ="activeIndex == 'project' ? 'menu-active' :''" >{{$t('overall.project')}}</div>
+          <div v-if="projectData.length == 0">{{$t('overall.project')}}</div>
+          <div v-else @click="jumpToProject(projectData[0], 0)" :class ="activeIndex == 'project' ? 'menu-active' :''" >{{$t('overall.project')}}</div>
         </template>
-        <template v-for="(item, index) in projectData">
+        <template>
-          <el-menu-item :index="'2-' + index">
+          <el-menu-item v-if="projectData.length == 0" index="2-0"><span @click="createBox({type: 1})" class="header-dropdown-add"><i class="nz-icon nz-icon-create-square"></i></span></el-menu-item>
-<!--            <div @mouseenter="hoverItemIndex = '2-' + index" @mouseleave="hoverItemIndex = ''" @click="jumpToProject(item)" :class="{'menu-item-active' :(activeIndex == 'project' && activeItemIndex == item.id)}">-->
+          <template v-else>
+            <el-menu-item :index="'2-' + index" v-for="(item, index) in projectData">
               <div @mouseenter="hoverItemIndex = '2-' + index" @mouseleave="hoverItemIndex = ''" @click="jumpToProject(item)" >
                 <span class="too-long-split" style="width: 135px;">{{item.name}}</span>
                 <div v-show="hoverItemIndex == '2-' + index && item.buildIn != 1" @click.stop="toEditProject(item)" class="menu-edit"><i style="color: inherit" class="nz-icon nz-icon-edit"></i></div>
               </div>
             </el-menu-item>
           </template>
+        </template>
       </el-submenu>
       <el-submenu index="3" popper-class="nz-submenu">
         <template slot="title">
-          <div @click="jumpTo('asset')" :class="{'menu-active' : activeIndex == 'asset'}">{{$t('overall.asset')}}</div>
+          <div v-if="projectData.length == 0">{{$t('overall.asset')}}</div>
+          <div v-else @click="jumpTo('asset')" :class="{'menu-active' : activeIndex == 'asset'}">{{$t('overall.asset')}}</div>
         </template>
-        <template v-for="(item, index) in assetData">
+        <template>
-          <el-menu-item :index="'3-' + index">
+          <el-menu-item v-if="assetData.length == 0" index="3-0"><span @click="createBox({type: 4})" class="header-dropdown-add"><i class="nz-icon nz-icon-create-square"></i></span></el-menu-item>
-<!--            <div @mouseenter="hoverItemIndex = '3-' + index" @mouseleave="hoverItemIndex = ''" @click="jumpToAsset(item.id)" :class="{'menu-item-active' : (activeIndex == 'asset' && indOf(activeItemIndexes, item.id) > -1) }">-->
+          <template v-else>
+            <el-menu-item :index="'3-' + index" v-for="(item, index) in assetData">
               <div @mouseenter="hoverItemIndex = '3-' + index" @mouseleave="hoverItemIndex = ''" @click="jumpToAsset(item.id)" >
                 <span class="too-long-split" style="width: 130px;">{{item.name}}</span>
               </div>
             </el-menu-item>
           </template>
+        </template>
       </el-submenu>
       <el-submenu index="4-0" popper-class="nz-submenu">
         <template slot="title">
@@ -599,6 +605,10 @@
     min-width: 50px !important;
     /*margin-right:20px;*/
   }
+  .header-dropdown-add {
+    display: block;
+    text-align: center;
+  }
   .header .vertical-line{
     display:inline-block;
     border-left:solid 1px white;

nezha-fronted/src/components/page/dashboard/panel.vue

@@ -11,6 +11,10 @@
     </div>
     <div slot="content-right" class="slot-content">
       <div class="top-tools">
+        <div class="top-tool-main-left" v-if="panelData.length == 0" style="margin-left: 10px;">
+          <button @click="toAdd" class="nz-btn nz-btn-style-light nz-btn-size-small">{{$t("dashboard.panel.createPanelTitleSec")}}</button>
+        </div>
+        <template v-else>
           <div class="top-tool-main-left">
             <el-dropdown @command="panelChange" class="panel-dropdown-title" trigger="click" placement="bottom-start" v-scrollBar:el-dropdown>
               <el-row @click.native="scrollbarHeightHandler" :gutter="10" class="el-dropdown-link" style="">
@@ -42,14 +46,6 @@
             <div class="panel-calendar margin-r-20">
               <div class="block">
                 <time-picker ref="calendarPanel" class="nz-dashboard-picker" @change="dateChange"></time-picker>
-              <!--
-<el-date-picker prefix-icon=" " class="nz-dashboard-picker" size="mini" ref="calendar"
-                              format="yyyy/MM/dd HH:mm" @change="dateChange" v-model="searchTime" type="datetimerange"
-                              :picker-options="pickerOptions" :range-separator="$t('dashboard.panel.to')"
-                              :start-placeholder="$t('dashboard.panel.startTime')"
-                              :end-placeholder="$t('dashboard.panel.endTime')" align="right">
-              </el-date-picker>
-              -->
               </div>
             </div>
 
@@ -71,16 +67,12 @@
               </button>
             </el-popover>
             </div>
-          <!-- 2020-02-14 使用普通搜索框-->
-          <!--          <div class="top-tool-search">-->
-          <!--            <search-input ref="searchInput" :searchMsg="searchMsg" @search="search"></search-input>-->
-          <!--          </div>-->
-
             <button @click="toAddChart" :title="$t('overall.createChart')"
                     class="nz-btn nz-btn-size-normal nz-btn-style-light ">
               <i class="nz-icon-create-square nz-icon"></i>
             </button>
           </div>
+        </template>
       </div>
       <div class="table-list" id="tableList">
         <el-scrollbar class="el-scrollbar-large" style="height: 100%" ref="dashboardScrollbar">

nezha-fronted/src/components/page/project/project.vue

@@ -58,6 +58,10 @@
               </div>
             </template>
             <div class="sidebar-info sub-sidebar-info" >
+              <div v-if="getProjectModule(item.id).length == 0" class="sidebar-info-item sidebar-info-item-add" @click="toAddModule">
+                <i class="nz-icon nz-icon-create-square"></i>
+              </div>
+              <template v-else>
                 <div v-for="module in getProjectModule(item.id)" class="sidebar-info-item" :class="{'sidebar-info-item-active': module.id == currentModule.id}" @click="changeModule(module)" :id="'project-module-'+module.id">
                   <div class="sidebar-info-item-txt">
                     <el-popover v-if="module.name.length > 16" trigger="hover" placement="top-start" :content="module.name" >
@@ -67,6 +71,7 @@
                   </div>
                   <div v-show="module.buildIn != 1" class="hid-div side-bar-menu-edit sub-side-bar-menu-edit" @click.stop="toEditModule(module)" :id="'project-module-edit-'+module.id" ><i class="nz-icon nz-icon-edit"></i></div>
                 </div>
+              </template>
             </div>
           </el-collapse-item>
         </el-collapse>
@@ -446,6 +451,7 @@
         })
       },
       getProjectModule:function(projectId){
+        //return [];
         let moduleList=Object.assign([],this.moduleList);
         return moduleList.filter((item,index)=>{
           return item.project.id==projectId;
@@ -570,6 +576,13 @@
           this.$refs.moduleBox.initWalk();
         });
       },
+      toAddModule() {
+        this.editModule = {id: '', type: '', name: '', project: this.currentProject, port: '', path: '', param: '', paramObj: [], snmpParam: ''};
+        this.rightBoxHandler(2);
+        this.$nextTick(() => {
+          this.$refs.moduleBox.initWalk();
+        });
+      },
 
       //asset弹框控制
       /*tabControl(data) {
@@ -1042,7 +1055,8 @@
   /* end--子弹框*/
   .sub-sidebar-info{
     padding-top: 0px !important;
-    margin-left: 10px;
+    padding-left: 10px;
+    box-sizing: border-box;
   }
   .sub-side-bar-menu-edit{
     margin-right: 18px;