diff --git a/nezha-fronted/src/assets/css/main.css b/nezha-fronted/src/assets/css/main.css
index e12fbfa45..bf1f3331f 100644
--- a/nezha-fronted/src/assets/css/main.css
+++ b/nezha-fronted/src/assets/css/main.css
@@ -119,7 +119,7 @@ html {
   float: right;
 }
 .top-tools .top-tool-search {
-  width: 220px;
+  width: 320px;
 }
 .top-tools .el-button-group {
   float: left;
@@ -361,7 +361,7 @@ html {
 /* end--endpoint->子弹框asset搜索框前缀和后缀*/
 /* begin--自定义可编辑的el-select下拉框样式*/
 .config-dropdown {
-  width: 550px;
+  width: 520px;
 }
 .config-dropdown-btn {
   display: inline-block;
diff --git a/nezha-fronted/src/components/common/header.vue b/nezha-fronted/src/components/common/header.vue
index 7876e0637..bb66572bb 100644
--- a/nezha-fronted/src/components/common/header.vue
+++ b/nezha-fronted/src/components/common/header.vue
@@ -1,12 +1,28 @@
 <template>
     <div class="header">
         <div class="submenu">
+
             <el-menu
                     class="el-menu-demo"
                     mode="horizontal"
                     background-color="#ffffff"
                     unique-opened
             >
+                <el-submenu index="0">
+                    <template slot="title">
+                        <div class="menu-create">
+                          &nbsp;&nbsp;<i class="el-icon-plus"></i>
+                          <div>{{$t('overall.create')}}</div>
+                        </div>
+                    </template>
+                    <template v-for="(item, index) in createMenu">
+                        <el-menu-item :index="'0-' + index.toString()">
+                            <div @click="createBox(item)">
+                                <span>{{item.label}}</span>
+                            </div>
+                        </el-menu-item>
+                    </template>
+                </el-submenu>
                 <el-menu-item index="1" @click="jumpTo('dashboard')">
                     <div>
                         {{$t('overall.dashboard')}}
@@ -17,7 +33,7 @@
                         <div @click="jumpToProject('project', projectData[0])">{{$t('overall.project')}}</div>
                     </template>
                     <template v-for="(item, index) in projectData">
-                        <el-menu-item :index="index.toString()">
+                        <el-menu-item :index="'2-' + index.toString()">
                             <div @click="jumpToProject('project', item)">
                               <span>{{item.name}}</span>
                               <div @click.stop="toEditProject(item)" class="menu-edit"><i class="el-icon-edit-outline"></i></div>
@@ -30,7 +46,7 @@
                         <div @click="jumpToAsset('asset')">{{$t('overall.asset')}}</div>
                     </template>
                     <template v-for="(item, index) in assetData">
-                        <el-menu-item :index="index.toString()">
+                        <el-menu-item :index="'3-' + index.toString()">
                             <div @click="jumpToAsset('asset',item.id)">{{item.name}}</div>
                         </el-menu-item>
                     </template>
@@ -39,10 +55,10 @@
                 <template slot="title">
                   <div @click="jumpTo('alertList')">{{$t('overall.alert')}}</div>
                 </template>
-                <el-menu-item index="1">
+                <el-menu-item index="4-0">
                   <div @click="jumpTo('alertList')">{{$t('alert.alertList')}}</div>
                 </el-menu-item>
-                <el-menu-item index="2">
+                <el-menu-item index="4-1">
                   <div @click="jumpTo('alertConfig')">{{$t('alert.alertConfig')}}</div>
                 </el-menu-item>
               </el-submenu>
@@ -50,10 +66,10 @@
                     <template slot="title">
                         <div @click="jumpTo('account')">{{$t('overall.config')}}</div>
                     </template>
-                    <el-menu-item index="1">
+                    <el-menu-item index="5-0">
                         <div @click="jumpTo('account')">{{$t('config.account.account')}}</div>
                     </el-menu-item>
-                    <el-menu-item index="2">
+                    <el-menu-item index="5-1">
                         <div @click="jumpTo('promServer')">{{$t('config.promServer.promServerList')}}</div>
                     </el-menu-item>
                 </el-submenu>
@@ -101,7 +117,34 @@ export default {
     return {
       language: localStorage.getItem("language"),
       assetData: [],
-      projectData: []
+      projectData: [],
+      createMenu: [
+        {
+          label: this.$t('project.project.createProject'),
+          url: 'project',
+          type: 1
+        },
+        {
+          label: this.$t('project.module.createModule'),
+          url: 'project',
+          type: 2
+        },
+        {
+          label: this.$t('project.endpoint.createEndpoint'),
+          url: 'project',
+          type: 3
+        },
+        {
+          label: this.$t('asset.createAsset'),
+          url: 'asset',
+          type: 4
+        },
+        {
+          label: this.$t('alert.config.createAlertConfig'),
+          url: 'alertConfig',
+          type: 5
+        }
+      ]
     }
   },
   methods: {
@@ -113,6 +156,31 @@ export default {
         }
       });
     },
+    createBox(item) {
+      this.jumpTo(item.url);
+      setTimeout(() =>{
+        if (item.type == 1) {
+          if (this.projectData.length > 0) {
+            this.$store.commit('setProject', this.projectData[0]);
+          }
+          this.$store.commit('toCreateProject', true);
+          this.$store.commit('projectRightBoxShow', true);
+        } else if (item.type == 2) {
+          if (this.projectData.length > 0) {
+            this.$store.commit('setProject', this.projectData[0]);
+          }
+          this.$store.commit('toCreateModule', true);
+        } else if (item.type == 3) {
+          if (this.projectData.length > 0) {
+            this.$store.commit('setProject', this.projectData[0]);
+          }
+          this.$store.commit('toCreateEndpoint', true);
+        } else if (item.type == 5) {
+          this.$store.commit('projectRightBoxShow', false);
+          this.$store.commit('toCreateAlertConfig', true);
+        }
+      }, 120);
+    },
     jumpToAsset(data, id) {
       this.$store.state.assetData.moduleData = data;
       this.$store.state.assetData.selectedData = id;
@@ -141,9 +209,12 @@ export default {
       })
     },
     toEditProject(p) {
-      this.$store.commit('setProject', p);
-      this.$store.commit('projectRightBoxShow', true);
       this.jumpTo('project');
+      setTimeout(() =>{
+        this.$store.commit('setProject', p);
+        this.$store.commit('projectRightBoxShow', true);
+      }, 50);
+
     }
   },
   mounted() {
@@ -151,7 +222,7 @@ export default {
     this.getProjectData();
   },
   computed: {
-    projectListReload() {
+    projectListReloadWatch() {
       return this.$store.state.projectListReload;
     }
   },
@@ -159,7 +230,7 @@ export default {
     projectListReloadWatch(n, o) {
       if (n) {
         this.getProjectData();
-        this.$store.commit('projectListReload', false);
+        this.$store.commit('projectListReloadChange', false);
       }
     }
   }
@@ -266,6 +337,20 @@ export default {
 .header-name-jiantou {
     position: static !important;
 }
+.el-menu-demo>li:first-of-type {
+  position: fixed;
+  left: 40%;
+  top: 0;
+}
+.menu-create {
+  line-height: 15px;
+  text-align: center;
+  padding-top: 15px;
+}
+.menu-create .el-icon-plus {
+  font-size: 12px;
+  line-height: 12px;
+}
 .menu-edit {
     line-height: 36px;
     float: right;
diff --git a/nezha-fronted/src/components/common/language/en.js b/nezha-fronted/src/components/common/language/en.js
index 67790d7c0..28c62df9b 100644
--- a/nezha-fronted/src/components/common/language/en.js
+++ b/nezha-fronted/src/components/common/language/en.js
@@ -15,9 +15,20 @@ const en = {
     search: 'Search',
     add: "Add",
     option: "Option",
-    clearAll: "Clear All"
+    clearAll: "Clear All",
+    name: 'Name',
+  },
+  search: {
+    searchTip: 'Press Enter or click to search'
+  },
+  tip: {
+    confirmDelete: "Confirm Delete?",
+    yes: "Yes",
+    no: "No",
+    deleteSuccess: "Successfully Deleted"
   },
   asset:{
+    createAsset: "Create Asset",
     tableTitle: {
       id: 'ID',
       assetType: '资产类型',
@@ -65,7 +76,8 @@ const en = {
       //侧滑框
       promId: "Prometheus Server ID",
       createProm: "Create Prometheus Server",
-      editProm: "Edit Prometheus Server"
+      editProm: "Edit Prometheus Server",
+      type: "Type"
     },
   },
   alert: {
@@ -86,9 +98,9 @@ const en = {
       charts: "Charts",
 
       //表内容
-      projectalert: "Project Alert",
-      modulealert: "Module Alert",
-      devicealert: "Device Alert",
+      projectAlert: "Project Alert",
+      moduleAlert: "Module Alert",
+      deviceAlert: "Device Alert",
       pending: "Pending",
       expired: "Expired"
     },
@@ -96,11 +108,20 @@ const en = {
       name: "Name",
       receiver: "Receiver",
       expr: "Expr",
-      for: "For",
+      for: "For (s)",
+      link: 'Link',
       option: "Option",
       alertConfig: "Alert Config",
-      createalertConfig: "Create Alert Config",
-      editalertConfig: "Edit Alert Config",
+      createAlertConfig: "Create Alert Config",
+      editAlertConfig: "Edit Alert Config",
+      medium: "Medium",
+      high: "High",
+      low: "Low",
+      typeOption: {
+        project: 'Project',
+        module: 'Module',
+        asset: 'Asset'
+      }
     }
   },
   project: {
@@ -108,13 +129,15 @@ const en = {
       project: "Project",
       projectName: "Project Name",
       editProject: "Edit Project",
-      description: "Description"
+      description: "Description",
+      createProject: "Create Project"
     },
     module: {
       module: "Module",
       moduleName: "Module Name",
       editModule: "Edit Module",
       description: "Description",
+      createModule: "Create Module",
       tip: {
         defaultEndpointSet: "Default Endpoint Set",
         relation: "Endpoints associated with Module will reference Port/Path/Param/Params by default"
@@ -132,7 +155,12 @@ const en = {
       asset: "Asset",
       lastUpdate: "Last Update",
     },
-    metrics: "Metrics"
+    metrics: {
+      metrics: "Metrics",
+      name: 'name',
+      type: 'Type',
+      description: 'Desc'
+    }
   },
   ...enLocale
 }
diff --git a/nezha-fronted/src/components/common/searchInput.vue b/nezha-fronted/src/components/common/searchInput.vue
new file mode 100644
index 000000000..5638832d1
--- /dev/null
+++ b/nezha-fronted/src/components/common/searchInput.vue
@@ -0,0 +1,1301 @@
+<template>
+    <div class="new-search" >
+        <div class="search-input-all input-position" @click="stop_click">
+<!--            历史记录-->
+            <div class="search-history">
+                <i class="el-icon-time" @click="look_history"></i>
+                <div :class="localStorage_display?'localStorage_list_box none':'localStorage_list_box'">
+                    <div class="list_box_title">
+                        <span>{{other.recentSearch}}</span>
+                        <i class="el-icon-close" @click="localStorage_display=!localStorage_display"></i>
+                    </div>
+                    <div class="list_box_content" v-if="history_once.length>0">
+                        <ul>
+                            <li v-for="(val,ind) in history_once" @click="select_history(ind,$event)" :key="ind">
+                                <span v-for="(item,key) in val" :key="key">
+                                    <span class="name">{{item.name}}: </span>
+                                    <span class="value">{{item.val+' '}}</span>
+                                </span>
+                            </li>
+                        </ul>
+                    </div>
+                    <div class="list_box_clear">
+                        <span v-if="history_once.length>0" @click="clear_history">{{other.clearReSearch}}</span>
+                        <span v-else class="no_historyList">{{other.noRecentSearch}}</span>
+                    </div>
+                </div>
+            </div>
+<!--            搜索框-->
+            <div class="input-center-box" id="input-center-box">
+                <ul class="sreach_fixe_left" id="search-ul">
+                    <li class="selectinfo_box" v-if="select_list.length>0" v-for="(val,ind) in select_list" :key="ind" @click="update_sreach(ind,$event)">
+                        <div class="select_condition">
+                            {{val.name}}
+                        </div>
+                        <div class="select_content" v-if="val.val && ind!=sreach_num">
+                            <span :style="val.id==7?'min-width:260px':''">{{val.valString ? val.valString : val.val}}</span>
+                            <i class="el-icon-close" @click="close_selcet_list(ind,$event)"></i>
+                        </div>
+                        <div v-else-if="!change_sreach_show && ind==sreach_num && val.id!==7 " class="select_input">
+                            <input type="text" id="sreach_input" v-model="input_sreach" @keyup="enter" @click="stop_click">
+                            <div class="select_info_list" v-if="val.type == 'select'">
+                                <ul>
+                                    <li v-for="(item,key) in selectInfoList[val.label]" :key="key" @click="tr_selectInfo(val.label,item.value,item.label,$event)" :class="search_select_style_num==key?'search-style-ind':''">{{item.label}}</li>
+                                </ul>
+                            </div>
+                            <div class="select_info_list" v-if="val.type == 'selectString'">
+                                <ul>
+                                    <li v-for="(item,key) in selectInfoList[val.label]" :key="key" @click="stringSelectInfo(val, item, $event)" :class="search_select_style_num==key?'search-style-ind':''">{{item.label}}</li>
+                                </ul>
+                            </div>
+                            <div class="select_info_list" v-if="val.type == 'dc'">
+                                <ul>
+                                    <li v-for="(item,key) in dcSelect" :key="key" @click="selectDc(val, item, $event)" :class="search_select_style_num==key?'search-style-ind':''">{{item.name}}</li>
+                                </ul>
+                            </div>
+                            <!-- 新增日志模块action下拉选择 -->
+                            <div class="select_info_list" v-if="val.type == 'selectAction'">
+                                <ul>
+                                    <li v-for="(item,key) in actionSelect" :key="key" @click="tr_selectInfo(val.label,item.id,item.value,$event)">{{item.value}}</li>
+                                </ul>
+                            </div>
+                            <!-- 新增protocol下拉选择 -->
+                             <div class="select_info_list" v-if="val.type == 'selectType'">
+                                <ul>
+                                    <li v-for="(item,key) in schemaTypeSelect" :key="key" @click="tr_selectTypeInfo(item)">{{item.value}}</li>
+                                </ul>
+                            </div>
+                            <!-- 新增protocol二层下拉 -->
+                            <div class="select_info_list" v-if="TypeSelect.length!=0&&val.type == 'selectType'&&secondShow">
+                                <ul>
+                                    <li v-for="(item,key) in TypeSelect" :key="key" @click="tr_selectProtocolInfo(item)">{{item.name}}</li>
+                                </ul>
+                            </div>
+<!--                           时间计划-->
+                            <div class="select_info_list" v-if="val.type == 'select'&&val.id==5">
+                                <ul>
+                                    <li v-for="item in schlist" @click="selectSul(item.name)">{{item.name}}</li>
+                                </ul>
+                            </div>
+                        </div>
+                        <el-date-picker
+                                v-model="timeFrame"
+                                type="datetimerange"
+                                range-separator="To"
+                                start-placeholder="Start Time"
+                                end-placeholder="End Time"
+                                @change="changeDate"
+                                :class="dataBackG?'':'dataBackG'"
+                                v-if="ind==sreach_num&&val.id==7"
+                        >
+                        </el-date-picker>
+                    </li>
+<!-- 最开始的input框-->
+                    <li class="select_input" v-if="change_sreach_show">
+                        <input type="text" @click="read_input" v-model="no_condition" @keyup="enter_one" id="one-input" @keydown="clear_search_list" >
+                    </li>
+                   
+                </ul>
+            </div>
+            <div class="clear-search" @click="clear_input">
+                <i class="el-icon-close"></i>
+            </div>
+            <div :class="input_list?'input_list none':'input_list'" @click="stop_click" id="input_list">
+                <ul>
+                    <li v-for="(val,ind) in searchLabelList"  v-if="val.name!='Protocol'" @click="select_name(val.name,ind,val.id,val.type,val.label,val.disabled)" :key="ind" :class="{'search-style-ind':searchStyleNum==ind,'is-disabled':val.disabled}">
+                        <span>{{val.name}}</span>
+                    </li>
+                    <!--<li v-for="(val,ind) in searchLabelList"  v-if="val.name=='Protocol'" @click="select_type(val.name,ind,val.id,val.type,val.label,val.disabled)" :key="ind" :class="{'search-style-ind':searchStyleNum==ind,'is-disabled':val.disabled}">
+                        <span>{{val.name}}</span>
+                    </li>-->
+                </ul>
+            </div>
+        </div>
+        <div class="new-search-btn" @click="select">
+            <i class="el-icon-search"></i>
+        </div>
+    </div>
+</template>
+
+<script>
+    import searchSelectInfo from "./searchSelectInfo"; //搜索框组件--下拉框内容
+    export default {
+        name: "index",
+        data() {
+            return {
+                select_conditionsName:'',
+                selectInfoList: searchSelectInfo,
+                select_title:this.$t('i18n.overall.searchList.select_title'),
+                other:this.$t('i18n.overall.other'),
+                localStorage_display: true,
+                input_list: true,
+                change_sreach_show: true,
+                select_list: [], //下拉列表
+                historyList: [],
+                actionSelect:[],
+                dcSelect: [], //数据中心
+                schemaTypeSelect:[], //日志检索Protocol下拉菜单
+                TypeSelect:[],//Protocol二层下拉菜单
+                secondShow:'',//二层显示控制
+                input_sreach: '',
+                sreach_num: 0,
+                searchLabelList: [
+                    {id: 0, name: this.$t('search.searchTip'), icon: 'el-icon-search'},
+                ],
+                bool: false,
+                no_condition: '',
+                //历史记录列表
+                history_once: [],
+                profileName:"",
+                profileId:"",
+                schedata:{
+                    name:'',
+                    isValid:1,
+                    pageSize:30,
+                    pageNo:1
+                },
+                schlist:[],
+                timeFrame: [new Date(new Date() - 1 * 60 * 60 * 1000), new Date()],
+                dataBackG:true,
+                delBool : false,
+                searchStyleNum:-1,
+                isSearchNum :-1,
+                search_select_style_num:-1,
+                keyBool : false,
+                delnum :0,
+                delcriteriaBool:false,
+                selectInfo:false,
+                disabaled:true,
+                downBool:false
+            }
+        },
+        watch: {
+            select_list: {
+              //监听下拉列表
+                handler(newDate, oldDate) {
+                    if (newDate.length == 0) {
+                        this.change_sreach_show = true
+                    }
+                }
+            },
+            no_condition: {
+                handler(newDate, oldDate) {
+                    if (newDate != '') {
+                        this.input_list = true
+                    }
+                }
+            }
+        },
+        props:['searchMsg','defaultItem','defaultValue'],
+        methods: {
+          // isValidIP(ip) {
+          //     var reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/
+          //     if(reg.test(ip)){
+
+          //     }else{
+          //       alert('ip格式不正确')
+          //     }
+          // } ,
+              //点击选择protocol类型  (日志新增)
+              /*select_type(val, ind, id, type,label,disabled){
+                        this.downBool = false;
+                        this.secondShow=false;
+                        this.searchLabelList.splice(ind, 1)
+                        this.select_list.push({
+                          name: val,
+                          id:id,
+                          type:type,
+                          label:label,
+                          disabled:disabled
+                        })
+                        this.change_sreach_show = false
+                        this.sreach_num = this.select_list.length-1
+                        this.input_list = !this.input_list
+                },*/
+              //dc
+              selectDc(column, selectItem, e) {
+                this.stop_click(e);
+                this.searchLabelList.forEach(val=>{
+                  if(val.type == 'dc'){
+                    val.val = selectItem.name;
+                    val.valnum = selectItem.id;
+                    val.valString = '';
+                  }
+                })
+                //this.select_list.push({type: 'dc', val: selectItem.name, valnum: selectItem.id});
+                this.input_sreach = '';
+                this.sreach_num = this.select_list.length;
+                this.change_sreach_show = true;
+                this.input_list = false;
+                var _this = this;
+                setTimeout("document.getElementById(\"one-input\").focus()", 500);
+                setTimeout(function () {
+                  _this.getHeight();
+                });
+              },
+               //一层下拉点击
+              tr_selectTypeInfo(val){
+                  this.TypeSelect=[];
+                  val.data.length!=0?this.TypeSelect.push(val.data[0]):'';
+                  val.data.length!=0?this.secondShow=true:''
+              },
+               //二层下拉点击
+              tr_selectProtocolInfo(val){
+                  this.select_list=[];
+                  this.select_list.push({
+                    name: val.name,
+                    // id:id,
+                    type:val.type,
+                    label:val.label,
+                    // disabled:disabled
+                  })
+                  this.change_sreach_show = false
+                  this.sreach_num = this.select_list.length-1
+                  this.input_list = !this.input_list
+                //   setTimeout("document.getElementById(\"sreach_input\").focus()", 500);
+                  var _this = this
+                  setTimeout(function () {
+                    _this.getHeight()
+                  },)
+            },
+            Iskeywords(ind){
+              if(this.select_list[ind].id==29){
+                this.searchLabelList.forEach(val=>{
+                  if(val.id==30||val.id==31||val.id==32||val.id==33){
+                    val.disabled = false
+                  }
+                })
+              }else if(this.select_list[ind].id==30||this.select_list[ind].id==31||this.select_list[ind].id==32||this.select_list[ind].id==33){
+                this.searchLabelList.forEach(val=>{
+                  if(val.id==29){
+                    val.disabled = false
+                  }
+                })
+              }
+            },
+            getDcData() {
+              this.$get('idc', {pageNo: 1, pageSize: 999}).then(response => {
+                if (response.code === 200) {
+                  this.dcSelect = response.data.list;
+                }
+              });
+            },
+            //点击确认选择下拉内容
+            tr_selectInfo(selectLabel,value,label,e){
+                this.stop_click(e);
+                this.select_list.forEach(val=>{
+                    if(val.label == selectLabel){
+                        val.val = label;
+                        val.valnum = value;
+                    }
+                });
+                this.input_sreach = '';
+                this.sreach_num = this.select_list.length;
+                this.change_sreach_show = true;
+                this.input_list = false;
+                 var _this = this;
+                setTimeout("document.getElementById(\"one-input\").focus()", 500);
+                setTimeout(function () {
+                  _this.getHeight();
+                });
+            },
+            //点击确认value是string类型的下拉内容, param: 字段对象，选中的选项
+            stringSelectInfo(column, selectItem, e){
+              this.stop_click(e);
+              this.select_list.forEach(val=>{
+                if(val.label == column.label){
+                  val.val = selectItem.value;
+                  val.valString = selectItem.label;
+                }
+              });
+              this.input_sreach = '';
+              this.sreach_num = this.select_list.length;
+              this.change_sreach_show = true;
+              this.input_list = false;
+              var _this = this;
+              setTimeout("document.getElementById(\"one-input\").focus()", 500);
+              setTimeout(function () {
+                _this.getHeight();
+              });
+            },
+            // 点击历史记录图标
+            look_history(e){
+                this.stop_click(e);
+                this.localStorage_display=!this.localStorage_display;
+            },
+            backtime(t){
+                let myDate=new Date(t);
+                let nt=myDate.getFullYear()+'-'+(myDate.getMonth()>8?'':0)
+                    +(myDate.getMonth()+1)+'-'+(myDate.getDate()>9?'':0)
+                    + myDate.getDate()+' '
+                    +(myDate.getHours()>9?'':'0')+myDate.getHours()+':'
+                    +(myDate.getMinutes()>9?'':0)+myDate.getMinutes()+':'
+                    +(myDate.getSeconds()>9?'':0)+myDate.getSeconds();
+                return nt;
+            },
+            changeDate(){
+                this.dataBackG = false
+                this.change_sreach_show = true
+                if(this.timeFrame!=[]){
+                    this.select_list[this.sreach_num].val = this.backtime(this.timeFrame[0])+' - '+this.backtime(this.timeFrame[1])
+                    this.input_sreach = ''
+                    this.sreach_num++
+                }
+            },
+            //选择时间计划
+            selectSul(name){
+                this.change_sreach_show = true;
+                this.select_list[this.sreach_num].val = name;
+                this.input_sreach = '';
+                this.sreach_num++;
+                this.getHeight();
+            },
+            //点击搜索
+            select() {
+                let objectInfo = {};
+                this.change_sreach_show = true;
+                this.profileName = '', this.profileId = '';
+                if (this.input_sreach != '') {
+                  this.select_list[this.sreach_num].val = this.input_sreach;
+                    this.input_sreach = '';
+                    this.sreach_num=this.select_list.length;
+                }
+                //input有值  默认添加到name中
+                if (this.no_condition != '') {
+                  let no_condition_bool = false,no_condition_str = '',route = this.$route.path
+                    if(this.select_list.length==0){
+                      //日志模块新增路由判断
+                      if(route == '/Log_SecurityEventLogs'||route == '/Log_ProxyEventLogs'||route=='/Log_SesssionRecords'||route=='/Log_RadiusLogs'){
+                        no_condition_str = 'logId';
+                      }else if(route == '/Device_DeviceList'){
+                        no_condition_str = 'sn';
+                      }else if(route=='/system_PolicyConfigurationLog' || route=='/system_LoginLog'){
+                        no_condition_str='modifyBy';
+                      }else {
+                        no_condition_str='profileName';
+                      }
+                      if(no_condition_str=='profileName'){
+                        this.select_list.push({name: this.select_title.name, id:2, type:'input',val:this.no_condition,label:'profileName'});
+                        this.searchLabelList.forEach((val,ind)=>{
+                          if(val.id == 2){
+                            this.searchLabelList.splice(ind,1);
+                          }
+                        })
+                      }else if(no_condition_str=='modifyBy'){
+                        this.select_list.push({name: this.select_title.Operator, id:6, type:'input',val:this.no_condition,label:'modifyBy'});
+                        this.searchLabelList.forEach((val,ind)=>{
+                          if(val.id == 6){
+                            this.searchLabelList.splice(ind,1);
+                          }
+                        })
+                      }else if(no_condition_str=='sn'){
+                        this.select_list.push({name: this.select_title.SN, id:8, type:'input',val:this.no_condition,label:'sn'});
+                        this.searchLabelList.forEach((val,ind)=>{
+                          if(val.id == 8){
+                            this.searchLabelList.splice(ind,1);
+                          }
+                        })
+                      }else if(no_condition_str=='profileId'){
+                        this.select_list.push({name: this.select_title.Policy_ID, id:1, type:'input',val:this.no_condition,label:'profileId'});
+                        this.searchLabelList.forEach((val,ind)=>{
+                          if(val.id == 1){
+                            this.searchLabelList.splice(ind,1);
+                          }
+                        })
+                      }else if(no_condition_str=='logId'){ //日志模块新增判断
+                        this.select_list.push({  name: 'Log ID',  type: 'input', label: 'Log Id', val:this.no_condition,});
+                        this.searchLabelList.forEach((val,ind)=>{
+                          if(val.id == 1){
+                            this.searchLabelList.splice(ind,1);
+                          }
+                        })
+                      }
+                        this.sreach_num++;
+                    }else {
+                      let no_condition_bool = false,no_condition_str = '',route = this.$route.path,bool = true;
+                      if(route == '/Log_SesssionRecords'||route == '/Log_EventLogs'){
+                        no_condition_str = 'profileId';
+                      }else if(route == '/Device_DeviceList'){
+                        no_condition_str = 'sn';
+                      }else if(route=='/system_PolicyConfigurationLog' || route=='/system_UserManagement' || route=='/system_LoginLog'){
+                        no_condition_str='modifyBy';
+                      }else {
+                        no_condition_str='profileName';
+                      }
+                        this.select_list.forEach(val => {
+                            if(val.label==no_condition_str){
+                                bool = false;
+                                val.val += ','+this.no_condition;
+                            }
+                        });
+                        if(bool){
+                            this.searchLabelList.forEach((val,ind)=>{
+                                if(val.label == no_condition_str){
+                                  val.val = this.no_condition;
+                                  this.select_list.push(val);
+                                  this.searchLabelList.splice(ind,1);
+                                }
+                            });
+                            this.sreach_num++;
+                        }
+                    }
+                    this.no_condition = '';
+                }
+                let labelBool = true;
+                this.select_list.forEach(val=>{
+                    if (typeof (val.val) !== 'undefined' && val.val) {
+                        if(val.type == 'select'){
+                            if (val.label == 'alertType' || val.label == 'promType') {
+                                objectInfo.type = val.valnum;
+                            } else if(typeof(val.valnum) == "undefined"||val.valnum == ''){
+                                this.selectInfoList[val.label].forEach(item=>{
+                                    if(item.label == val.val){
+                                        labelBool = false;
+                                        objectInfo[val.label] = item.value;
+                                    }
+                                })
+                                if(labelBool){
+                                    objectInfo[val.label] = val.val;
+                                }
+                            }else {
+                                objectInfo[val.label] = val.valnum;
+                            }
+                            console.info(val)
+                        } else if(val.type == 'selectSelf'){
+                          objectInfo[val.label] = val.valnum;
+                        } else if(val.type == 'selectAction'){ //新增日志判断
+                          objectInfo[val.label] = val.valnum;
+                        } else if (val.type == 'dc') {
+                          objectInfo.idcId = val.valnum;
+                        } else {
+                            objectInfo[val.label] = val.val;
+                        }
+                    }
+                });
+                this.getHeight()
+                //搜索完成后存储在本地历史记录中
+                if(this.select_list.length!=0){
+                    if (JSON.parse(localStorage.getItem('NZ_history_'+this.$route.path)) == undefined || JSON.parse(localStorage.getItem('NZ_history_'+this.$route.path)) == []) {
+                        this.historyList.unshift(this.select_list);
+                        localStorage.setItem('NZ_history_'+this.$route.path, JSON.stringify(this.historyList));
+                    } else {
+                        this.historyList = JSON.parse(localStorage.getItem('NZ_history_'+this.$route.path));
+                        this.historyList.unshift(this.select_list);
+                        if (this.historyList.length > 10) {
+                            this.historyList.length = 10;
+                        }
+                        localStorage.setItem('NZ_history_'+this.$route.path, JSON.stringify(this.historyList));
+                    }
+                }
+                this.input_list = true;
+                this.restructure_historyDate();
+                this.$emit("search", objectInfo);
+            },
+            //清空历史记录
+            clear_history() {
+                this.historyList = [];
+                this.history_once = [];
+                localStorage.setItem('NZ_history_'+this.$route.path, JSON.stringify(this.historyList));
+            },
+            //再次点击之前的历史记录
+            select_history(ind,e) {
+                this.stop_click(e);
+                this.input_list = true;
+                this.change_sreach_show = true;
+                this.localStorage_display = !this.localStorage_display;
+                this.select_list = [];
+                JSON.parse(localStorage.getItem('NZ_history_'+this.$route.path)).splice(ind,1);
+                this.select_list = JSON.parse(JSON.stringify(this.history_once[ind]));
+                this.sreach_num = this.select_list.length;
+                this.select_list.forEach(val => {
+                    this.searchLabelList.forEach((item, index) => {
+                        if (val.id == item.id) {
+                            this.searchLabelList.splice(index, 1);
+                        }
+                    })
+                });
+                this.select()
+            },
+            // 获取历史记录  数据进行处理以便循环展示
+            restructure_historyDate() {
+                if (localStorage.getItem('NZ_history_'+this.$route.path) !== undefined && localStorage.getItem('NZ_history_'+this.$route.path) !== null) {
+                    this.history_once = JSON.parse(localStorage.getItem('NZ_history_'+this.$route.path));
+                }
+            },
+            clear_search_list(e){
+                var keyCode = window.event ? e.keyCode : e.which;
+            },
+            //监听输入框鼠标抬起事件
+            enter_one(e){
+                var keyCode = window.event ? e.keyCode : e.which;
+                if(keyCode == 40){
+                    if(this.searchStyleNum<this.searchLabelList.length-1){
+                      var disabledNum = 0;
+                      this.searchLabelList.forEach(val=>{
+                        if(val.disabled){
+                          disabledNum++;
+                        }
+                      });
+                      this.isSearchNum=this.searchStyleNum;
+                      this.isSearchNum++;
+                      if(!(this.searchLabelList[this.isSearchNum].disabled)){
+                        this.searchStyleNum++;
+                      }else {
+                        this.searchStyleNum+=disabledNum+1;
+                      }
+                    }
+                    if(this.searchStyleNum>=7){
+                      document.getElementById('input_list').scrollTop+=28;
+                    }
+                }
+                if(keyCode == 38){
+                  if(this.searchStyleNum>=0){
+                    var disabledNum = 0;
+                    this.searchLabelList.forEach(val=>{
+                      if(val.disabled){
+                        disabledNum++;
+                      }
+                    })
+                    this.isSearchNum=this.searchStyleNum;
+                    if(this.isSearchNum>0){
+                      this.isSearchNum--
+                    }
+                    if(!(this.searchLabelList[this.isSearchNum].disabled)){
+                      this.searchStyleNum--
+                    }else {
+                      this.searchStyleNum-=disabledNum+1
+                    }
+                  }
+                  if(this.searchStyleNum<=this.searchLabelList.length-8){
+                    document.getElementById('input_list').scrollTop -= 28
+                  }
+                }
+                if(this.no_condition==''){
+                    if(!this.keyBool){
+                        if(keyCode==8){
+                            let arr = this.select_list
+                            if(!this.delBool){
+                                if(this.input_sreach==''){
+                                    for(var i = arr.length-1 ; i>=0 ; i--){
+                                        this.input_list = true
+                                        this.change_sreach_show = false
+                                        this.sreach_num = i
+                                        this.input_sreach = arr[i].val
+                                        setTimeout("document.getElementById(\"sreach_input\").focus()", 500);
+                                        this.delBool = true
+                                        break;
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+                if (keyCode == 13) {
+                    if(this.searchStyleNum<=0){
+                        this.select()
+                    }else {
+                        let val = this.searchLabelList[this.searchStyleNum].name,
+                            ind = this.searchStyleNum,
+                            id= this.searchLabelList[this.searchStyleNum].id,
+                            type= this.searchLabelList[this.searchStyleNum].type,
+                            label= this.searchLabelList[this.searchStyleNum].label,
+                          disabled= this.searchLabelList[this.searchStyleNum].disabled
+                        this.searchStyleNum = -1
+                        this.select_name(val, ind, id, type,label,disabled)
+                    }
+
+                }
+            },
+            // input框监听是按删除还是回车
+            enter(e) {
+              var keyCode = window.event ? e.keyCode : e.which;
+              if(keyCode!==8){
+                this.delBool = false
+                this.delcriteriaBool = false
+              }
+               if(this.delBool){
+                   if(keyCode==8){
+                       if(this.input_sreach==''){
+                           this.searchMsg.searchLabelList.forEach((val, k) => {
+                               if (this.select_list[this.sreach_num].id == val.id) {
+                                   this.searchLabelList.splice(k + 1, 0, val)
+                                 this.Iskeywords(this.sreach_num)
+                               }
+                           })
+                           this.select_list.splice(this.sreach_num, 1)
+                           this.change_sreach_show=true
+                           setTimeout("document.getElementById(\"one-input\").focus()", 500);
+                           this.input_list = false
+                           this.delBool = false
+                       }
+                   }
+               }else {
+                   if(keyCode==8){
+                       if(this.delcriteriaBool){
+                           this.searchMsg.searchLabelList.forEach((val, k) => {
+                               if (this.select_list[this.sreach_num].id == val.id) {
+                                   this.searchLabelList.splice(k + 1, 0, val)
+                                 this.Iskeywords(this.sreach_num)
+                               }
+                           })
+                           this.select_list.splice(this.sreach_num, 1)
+                           this.change_sreach_show=true
+                           setTimeout("document.getElementById(\"one-input\").focus()", 500);
+                           this.input_list = false
+                           this.delcriteriaBool = false
+                       }else {
+                           if(this.input_sreach==''){
+                               this.delcriteriaBool = true
+                           }
+                       }
+                   }
+
+               }
+
+               if(keyCode == 38||keyCode == 40){
+                   if(this.select_list[this.sreach_num].type !== 'select'){
+                     if(this.input_sreach!==''){
+                       this.zhezhao_click()
+                       setTimeout("document.getElementById(\"one-input\").focus()", 500);
+                       this.input_list = false
+                     }
+                   }else {
+                     if(keyCode == 40){
+                       this.selectInfo = true
+                       if(this.search_select_style_num<this.selectInfoList[this.select_list[this.sreach_num].label].length-1){
+                         this.search_select_style_num++
+                       }
+                     }
+                     if(keyCode == 38){
+                       this.selectInfo = true
+                       if(this.search_select_style_num>=0){
+                         this.search_select_style_num--
+                       }
+                     }
+                   }
+               }else if(keyCode == 13) {
+                 this.searchMsg.zheze_none = true
+                 //回车键
+                 if (!this.selectInfo) {
+                   this.select()
+                 }else {
+                   this.selectInfo  = false
+                   this.tr_selectInfo(this.select_list[this.sreach_num].label, this.selectInfoList[this.select_list[this.sreach_num].label][this.search_select_style_num].label, this.selectInfoList[this.select_list[this.sreach_num].label][this.search_select_style_num].value, e)
+                 }
+               }
+            },
+            // 清空已输入的搜索条件
+            clear_input(e) {
+                this.stop_click(e)
+              this.no_condition = ''
+              this.input_sreach = ''
+                this.select_list = []
+                this.searchLabelList = [{id: 0, name: 'Press Enter or click to search', icon: 'el-icon-search'},]
+                JSON.parse(JSON.stringify(this.searchMsg.searchLabelList)).forEach(val => {
+                    this.searchLabelList.push(val)
+                })
+            },
+            //修改已有参数
+            update_sreach(ind,e) {
+                //if(this.select_list[ind].id==6||this.select_list[ind].id==28){
+                if(false){
+                    this.sreach_num = ind
+                    this.downBool = false
+                    this.change_sreach_show = false
+                    this.input_list = true
+                }else {
+                    this.input_list = true
+                    this.change_sreach_show = false
+                    this.sreach_num = ind
+                    this.input_sreach = this.select_list[ind].val
+                    if(this.select_list[ind].type=='input'){
+                        this.downBool = true
+                    }else {
+                        this.downBool = false
+                    }
+                    setTimeout("document.getElementById(\"sreach_input\").focus()", 50);
+                    this.getHeight()
+                    this.searchMsg.zheze_none = false
+                }
+            },
+            //删除要搜索的条件
+            close_selcet_list(ind, e){
+                this.stop_click(e)
+                this.searchMsg.searchLabelList.forEach((val, key) => {
+                    if (this.select_list[ind].id == val.id) {
+                        this.searchLabelList.splice(key + 1, 0, val)
+                        this.Iskeywords(ind)
+                    }
+                })
+                this.select_list.splice(ind, 1)
+                this.sreach_num--
+            },
+            //阻止冒泡事件
+            stop_click(e) {
+                e.cancelBubble = true;
+                e.stopPropagation();
+            },
+            //点击遮罩层
+            zhezhao_click() {
+                if(this.input_sreach!=''){
+                  if(!this.searchMsg.zheze_none){
+                    if (this.input_sreach!='') {
+                      this.change_sreach_show = true
+                      let IDsplit,
+                        id = /^[0-9]*$/,
+                        bool = true
+                      if (this.select_list[this.sreach_num].id == 1) {
+                        //id==1  判断是不是搜索ID    如果是ID 会出现搜索多个ID  分割ID
+                        IDsplit = this.input_sreach.split(',')
+                        //循环分割出来的ID  判断输入的每个ID是否正确
+                        for (let i = IDsplit.length - 1; i >= 0; i--) {
+                          if (!id.test(IDsplit[i]) || IDsplit[i] > 2147483647) {
+                            //如果有不正确的值 进行删除
+                            IDsplit.splice(i, 1)
+                            this.$message.error(this.other.delErrorId)
+                          }
+                          if (IDsplit[i] == '') {
+                            IDsplit.splice(i, 1)
+                          }
+                        }
+                        this.input_sreach = ''
+                        //从新拼接ID内容
+                        IDsplit.forEach(val => {
+                          this.input_sreach += val + ','
+                        })
+                        this.input_sreach = this.input_sreach.substr(0, this.input_sreach.length - 1)
+                        if(this.input_sreach!=''){
+                          this.select_list[this.sreach_num].val = this.input_sreach
+                          this.input_sreach = ''
+                          this.sreach_num++
+                          this.sreach_num = this.select_list.length
+                        }else {
+                          this.sreach_num = 0
+                          this.change_sreach_show = false
+                        }
+                      }else {
+                        this.select_list[this.sreach_num].val = this.input_sreach
+                        this.input_sreach = ''
+                        this.sreach_num = this.select_list.length
+                      }
+                    }else {
+                      let Bool = false
+                      this.select_list.forEach(val=>{
+                        if(val.val==''||val.val==undefined){
+                          Bool = true
+                        }
+                      })
+                      if(Bool){
+                        this.sreach_num = this.select_list.length-1
+                      }else {
+                        this.sreach_num = this.select_list.length
+                      }
+
+                    }
+                    if (this.no_condition != '') {
+                      this.change_sreach_show = true
+                      if(this.select_list.length==0){
+                        this.select_list.push({name: 'Name', id:2, type:'input',val:this.no_condition,label:'profileName'})
+                        this.searchLabelList.forEach((val,ind)=>{
+                          if(val.id == 2){
+                            this.searchLabelList.splice(ind,1)
+                          }
+                        })
+                        this.sreach_num++
+                      }else {
+                        let bool = true
+                        this.select_list.forEach(val => {
+                          if(val.id==2){
+                            bool = false
+                            val.val += ','+this.no_condition
+                          }
+                        })
+                        if(bool){
+                          this.select_list.push({name: 'Name', id:2, type:'input',val:this.no_condition,label:'profileName'})
+                          this.searchLabelList.forEach((val,ind)=>{
+                            if(val.id == 2){
+                              this.searchLabelList.splice(ind,1)
+                            }
+                          })
+                          this.sreach_num++
+                        }
+                      }
+                      this.no_condition = ''
+                      this.sreach_num = this.select_list.length
+                    }
+                    setTimeout("document.getElementById(\"one-input\").focus()", 500);
+                    this.input_list = !this.input_list
+                    var _this = this
+                    setTimeout(function () {
+                      _this.getHeight()
+                    },)
+                    this.searchMsg.zheze_none = true
+                  }
+                }
+
+            },
+            //点击搜索框  显示搜索类型
+            read_input(e) {
+                e.cancelBubble = true;
+                e.stopPropagation();
+                this.getHeight()
+                this.input_list = !this.input_list
+            },
+            //点击选择 搜索类型
+            select_name(val, ind, id, type,label,disabled) {
+                // if(id==43||id==45||id==48){  //根据id判断是否开启ip验证
+                //     this.select_conditionsName=true
+                // }
+              if(type=='input'){
+                this.downBool = true;
+              }else {
+                this.downBool = false;
+              }
+              this.no_condition = '';
+              this.searchMsg.zheze_none = false;
+              if(!disabled){
+                if (ind == 0) {
+                  this.select()
+                }else if(id == 7){
+                  this.searchLabelList.splice(ind, 1)
+                  this.select_list.push({
+                    name: val,
+                    id:id,
+                    type:type,
+                    label:label,
+                    disabled:disabled
+                  })
+                  this.change_sreach_show = false
+                  this.input_list = !this.input_list
+                }else if(id==29){
+                  this.searchLabelList.splice(ind, 1)
+                  this.select_list.push({
+                    name: val,
+                    id:id,
+                    type:type,
+                    label:label,
+                    disabled:disabled
+                  })
+                  this.change_sreach_show = false
+                  this.sreach_num = this.select_list.length-1
+                  this.input_list = !this.input_list
+                  setTimeout("document.getElementById(\"sreach_input\").focus()", 500);
+                  this.searchLabelList.forEach(val=>{
+                    if(val.id==30||val.id==31||val.id==32||val.id==33){
+                      val.disabled = true
+                    }
+                  })
+
+                }else if(id==30||id==31||id==32||id==33){
+                  this.searchLabelList.splice(ind, 1)
+                  this.select_list.push({
+                    name: val,
+                    id:id,
+                    type:type,
+                    label:label,
+                    disabled:disabled
+                  })
+                  this.change_sreach_show = false
+                  this.sreach_num = this.select_list.length-1
+                  this.input_list = !this.input_list
+                  setTimeout("document.getElementById(\"sreach_input\").focus()", 500);
+                  this.searchLabelList.forEach(val=>{
+                    if(val.id==29){
+                      val.disabled = true
+                    }
+                  })
+                }else {
+                  this.searchLabelList.splice(ind, 1)
+                  this.select_list.push({
+                    name: val,
+                    id:id,
+                    type:type,
+                    label:label,
+                    disabled:disabled
+                  })
+                  this.change_sreach_show = false
+                  this.sreach_num = this.select_list.length-1
+                  this.input_list = !this.input_list
+                   if(id!==6&&id!==28){
+                       setTimeout("document.getElementById(\"sreach_input\").focus()", 500);
+                   }
+                }
+                var _this = this
+                setTimeout(function () {
+                  _this.getHeight()
+                },)
+
+              }
+            },
+            // 判断输入框的高度
+            getHeight(){
+                if(document.getElementById('search-ul').clientHeight<24||document.getElementById('input-center-box').clientHeight<24){
+                  document.getElementById('input-center-box').style.height = 30+'px'
+                  document.getElementById('search-ul').style.height = 24+"px"
+                }
+          },
+            chlick_sreach(e) {
+                this.stop_click(e)
+                this.searchMsg.zheze_none = false
+            },
+            // 时间计划
+            schelistget(){
+              this.schlist = []
+                this.$get("/schedule", this.schedata).then(data => {
+                    if (data.code == 200) {
+                        this.schlist = data.data.list
+                    }
+                })
+
+            },
+        },
+        mounted() {
+            this.defaultItem ? this.select_list.push({name:this.defaultItem,label:this.defaultItem}) : '';
+            this.defaultValue != '' ? this.no_condition=this.defaultValue:'';
+            this.restructure_historyDate()
+            if(this.$route.path=='/Objects_Objects'){
+              this.schelistget()
+            }
+            if (this.$route.path == '/promServer') {
+              this.getDcData();
+            }
+            JSON.parse(JSON.stringify(this.searchMsg.searchLabelList)).forEach(val => {
+              if(val.name=='Protocol'){
+                  this.schemaTypeSelect=val.doc.data
+              }
+              if(val.prop=='common_action'){
+                this.actionSelect=val.doc.data
+              }
+              this.actionSelect.forEach((item)=>{
+                  item.id=item.code;
+                  item.label=val.label;
+                  item.name=val.label;
+              });
+              this.searchLabelList.push(val);
+            });
+            var _this = this;
+            document.onkeydown=function(event) {
+                var e = event || window.event || arguments.callee.caller.arguments[0];
+                if(e.keyCode==27){
+                    _this.close_search(e)
+                }
+
+            }
+        }
+    }
+</script>
+
+<style scoped>
+
+    .new-search{
+        display: flex;
+        position: relative;
+        box-shadow: 0px 0px 20px 0px rgba(0,0,0,.08);
+        line-height: 28px;
+    }
+    .new-search .search-input-all{
+        width: 300px;
+        background: #fff;
+        color: rgba(0,0,0,.55);
+        height: 28px;
+        line-height: 28px;
+        border-bottom-left-radius: 5px;
+        border-top-left-radius: 5px;
+        display: flex;
+        position: relative;
+        box-shadow: 0px 0px 20px 0px rgba(0,0,0,.08);
+    }
+    .search-input-all .btn-retract{
+        padding: 0px 4px;
+        text-align: center;
+    }
+    .search-input-all .search-history{
+        padding: 0px 10px;
+        height: 20px;
+        line-height: 20px;
+        text-align: center;
+        border-right: 1px solid #e5e5e5;
+        margin-top: 4px;
+        position: relative;
+    }
+    .search-input-all .input-center-box{
+        flex: 1;
+        height: 100%;
+        overflow-x: auto;
+        overflow-y: hidden;
+    }
+    .input-center-box::-webkit-scrollbar {/*滚动条整体样式*/
+        width: 4px;     /*高宽分别对应横竖滚动条的尺寸*/
+        height: 6px;
+    }
+    .input-center-box::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
+        border-radius: 3px;
+        -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
+        background: rgba(0,0,0,0.2);
+    }
+    .input-center-box::-webkit-scrollbar-track {/*滚动条里面轨道*/
+        -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
+        border-radius: 0;
+        background: rgba(0,0,0,0.1);
+    }
+    .search-input-all .clear-search{
+        padding: 0 5px;
+        text-align: center;
+        font-size: 12px;
+    }
+    .dataBackG{
+        background: #f0f0f0;
+    }
+    .none{
+        display: none !important;
+    }
+    .new-search-btn {
+      padding: 0 4px;
+      cursor: pointer;
+    }
+    .search-text{
+        display: inline-block;
+        margin-right: 20px;
+    }
+    .sreach_box{
+        position: relative;
+        width: 80%;
+        height: 28px;
+        padding: 20px;
+        background: #fff;
+        margin: 200px auto;
+    }
+    .keyring_sreach_right_btn{
+        width: 18%;
+        height: 28px;
+        float: right;
+        line-height: 28px;
+        text-align: center;
+        border: 1px solid #dfdfdf;
+    }
+    .keyring_sreach_right_btn .right-btn-group{
+        float: left;
+        width: 80%;
+        border-right: 1px solid #dfdfdf;
+        box-sizing: border-box;
+    }
+    .keyring_sreach_right_btn .right-btn-icon{
+        float: left;
+        width: 19%;
+    }
+    .sreach_box .close_zhezhao{
+        position: absolute;
+        right: 0;
+        top: -50px;
+        width: 24px;
+        height: 28px;
+        border-radius: 50%;
+        background: #fff;
+        text-align: center;
+        line-height: 28px;
+        font-size: 12px;
+    }
+
+    .localStorage_list_box{
+        position: absolute;
+        left: 10px;
+        top: 36px;
+        width: auto;
+        min-width:250px;
+        max-width: 350px;
+        height: auto;
+        border: 1px solid #dfdfdf;
+        background: #fff;
+        color: #2e2e2e;
+        text-align: left;
+        border-radius: 3px;
+        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+        z-index: 9999;
+        font-size: 12px;
+    }
+    .localStorage_list_box .list_box_title{
+        width: 100%;
+        height: 40px;
+        line-height: 40px;
+        line-height: 40px;
+        text-align: center;
+        position: relative;
+        border-bottom: 1px solid #dfdfdf;
+        color: #2e2e2e;
+    }
+    .localStorage_list_box .list_box_title i{
+        position: absolute;
+        right: 10px;
+    }
+    .localStorage_list_box .list_box_content{
+        text-align: left;
+        padding: 5px 0;
+        box-sizing: border-box;
+        border-bottom: 1px solid #dfdfdf;
+    }
+    .localStorage_list_box ul li{
+        padding: 5px 10px;
+        line-height: 20px;
+    }
+    .localStorage_list_box ul li:hover{
+        background: #f0f0f0;
+        cursor:pointer;
+    }
+
+    .localStorage_list_box ul li span{
+        color: #2e2e2e;
+    }
+    .localStorage_list_box ul li .value{
+        font-weight: 600;
+    }
+    .localStorage_list_box .list_box_clear{
+        padding-left: 10px;
+        line-height: 40px;
+    }
+    .localStorage_list_box .list_box_clear:hover{
+        background: #f0f0f0;
+        cursor:pointer;
+    }
+    .input-center-box .sreach_fixe_left{
+        width: auto;
+        display: flex;
+        height: 100%;
+        min-width: 100%;
+    }
+    .sreach_list{
+        display: flex;
+        justify-content:flex-start;
+        height: 100%;
+        padding-left: 10px;
+    }
+    .sreach_fixe_left .selectinfo_box{
+        display: flex;
+        flex-shrink: 0;
+        width: auto;
+        height: auto;
+        margin: 3px 2px;
+        font-size: 12px;
+    }
+    .selectinfo_box .select_condition{
+        float:left;
+        height: 16px;
+        padding: 3px;
+        background:#f8f8f8;
+        line-height: 16px;
+        color: rgba(0,0,0,.55);
+    }
+    .selectinfo_box .select_content{
+        float: left;
+        line-height: 16px;
+        height: 16px;
+        padding: 3px;
+        background: #f0f0f0;
+        color: rgba(0,0,0,0.85);
+        display: flex;
+    }
+    .select_input{
+        height: 100%;
+        flex: 1;
+        float: left;
+        min-width: 100px;
+    }
+    .select_input input{
+        width: 100%;
+        height: 100%;
+        border: none;
+        float: left;
+        padding-left: 5px !important;
+        box-sizing: border-box;
+    }
+    .select_input input:focus {
+        border:none;
+        box-shadow:none;
+    }
+    .select_input .select_info_list{
+        position: absolute;
+        left: 100px;
+        top: 36px;
+        height: auto;
+        width: auto;
+        max-height: 240px;
+        padding: 5px 0;
+        background: #fff;
+        border: 1px solid #e5e5e5;
+        border-radius: 3px;
+        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+        overflow-y: auto;
+        z-index: 9999;
+    }
+    .select_info_list ul li{
+        padding: 5px 10px;
+        line-height: 20px;
+    }
+    .select_info_list ul li:hover{
+        background: #f0f0f0;
+        cursor: pointer;
+    }
+    .sreach_input .input{
+        flex: 1;
+        height: 100%;
+        padding-left: 10px !important;
+        box-sizing: border-box;
+        position: relative;
+    }
+    .sreach_input .input input{
+        width: 100%;
+        height: 100%;
+        border: none;
+        padding: 0 !important;
+        float: left;
+    }
+    .sreach_box input:focus {
+        outline: none;
+        border-color: transparent;
+        box-shadow: none;
+    }
+    .sreach_input input::placeholder{
+        color: rgba(0,0,0,0.55)
+    }
+    .input_list{
+        position: absolute;
+        left: 47px;
+        top: 36px;
+        width: auto;
+        max-width: 400px;
+        max-height: 240px;
+        min-width: 300px;
+        background: #fff;
+        border-radius: 3px;
+        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+        z-index: 9;
+        overflow-y: auto;
+        font-size: 12px;
+    }
+    .input_list ul{
+        padding: 4px 0;
+    }
+    .input_list ul li{
+        padding: 4px 10px;
+        line-height: 16px;
+        height: 20px;
+    }
+    .input_list ul li:hover{
+        background: #f0f0f0;
+        cursor:pointer;
+    }
+    .search-style-ind{
+        background: #f0f0f0;
+        cursor:pointer;
+    }
+    .sreach_fixe>i{
+        margin-right: 15px;
+    }
+    .is-disabled{
+        color: #C0C4CC;
+        cursor: not-allowed !important;
+        background: #fff !important;
+    }
+    li {
+        list-style: none;
+    }
+</style>
diff --git a/nezha-fronted/src/components/common/searchSelectInfo.vue b/nezha-fronted/src/components/common/searchSelectInfo.vue
new file mode 100644
index 000000000..cdc9e2d2e
--- /dev/null
+++ b/nezha-fronted/src/components/common/searchSelectInfo.vue
@@ -0,0 +1,44 @@
+<script>
+  import i18n from './i18n';
+  const searchSelectInfo = { // value: 传给后台的值；label：显示给用户看的值
+    severity: [ //告警级别
+      {
+        value: 'medium',
+        label: i18n.t("alert.config.medium")
+      },
+      {
+        value: 'high',
+        label: i18n.t("alert.config.high")
+      },
+      {
+        value: 'low',
+        label: i18n.t("alert.config.low")
+      }
+    ],
+    promType: [ //promServer类型
+      {
+        value: 1,
+        label: 'Global'
+      },
+      {
+        value: 2,
+        label: 'Per-Datacenter'
+      }
+    ],
+    alertType: [ //告警类型
+      {
+        value: 1,
+        label: i18n.t('alert.config.typeOption.project')
+      },
+      {
+        value: 2,
+        label: i18n.t('alert.config.typeOption.module')
+      },
+      {
+        value: 3,
+        label: i18n.t('alert.config.typeOption.asset')
+      }
+    ]
+  };
+  export default searchSelectInfo;
+</script>
diff --git a/nezha-fronted/src/components/page/alert/config.vue b/nezha-fronted/src/components/page/alert/config.vue
index c5f0c8f83..2032a0428 100644
--- a/nezha-fronted/src/components/page/alert/config.vue
+++ b/nezha-fronted/src/components/page/alert/config.vue
@@ -2,6 +2,23 @@
   .account {
     height: 100%;
   }
+  .right-box::-webkit-scrollbar-track {
+    -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
+    border-radius: 0;
+    background: rgba(0,0,0,0.1);
+  }
+  .right-box::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
+    background: rgba(0,0,0,0.2);
+  }
+  .right-box::-webkit-scrollbar {
+    width: 4px;
+    height: 4px;
+  }
+  .right-box {
+    overflow: auto;
+  }
   .account-list-option {
     cursor: pointer;
     display: inline-block;
@@ -31,16 +48,11 @@
         </div>
         <div class="content-right">
             <div class="top-tools">
-              <el-button @click="toAdd" class="top-tool-btn top-tool-btn-active top-tool top-tool-right margin-l-10" size="mini">
-                <span><i class="el-icon-plus"></i></span>
-                <span class="top-tool-btn-txt">{{$t('overall.add')}}</span>
-              </el-button>
-              <el-input
-                  class="top-tool-search top-tool top-tool-right"
-                  type="text"
-                  :placeholder="$t('overall.search')"
-                  size="mini"
-                ></el-input>
+                <el-button @click="toAdd" class="top-tool-btn top-tool-btn-active top-tool top-tool-right margin-l-10" size="mini">
+                    <span><i class="el-icon-plus"></i></span>
+                    <span class="top-tool-btn-txt">{{$t('overall.add')}}</span>
+                </el-button>
+                <div class="top-tool-search top-tool top-tool-right"><search-input :searchMsg="searchMsg" @search="search"></search-input></div>
             </div>
             <el-table
                   :data="tableData"
@@ -59,8 +71,17 @@
                         <div v-if="item.prop == 'option'" class="account-list-options">
                             <span @click="del(scope.row)" class="account-list-option"><i class="el-icon-delete"></i></span>
                             <span @click="detail(scope.row)" class="account-list-option"><i class="el-icon-view"></i></span>
-                            <span @click="edit(scope.row)" class="account-list-option"><i class="el-icon-edit-outline"></i></span>
+                            <span @click="toEdit(scope.row)" class="account-list-option"><i class="el-icon-edit-outline"></i></span>
                         </div>
+                        <span v-else-if="item.prop == 'severity'">
+                          <span v-if="scope.row[item.prop] == 'high'"><i class="el-icon-arrow-up"></i>&nbsp;{{severityData[1].value}}</span>
+                          <span style="padding-left: 18px;" v-if="scope.row[item.prop] == 'medium'">{{severityData[0].value}}</span>
+                          <span v-if="scope.row[item.prop] == 'low'"><i class="el-icon-arrow-down"></i>&nbsp;{{severityData[2].value}}</span>
+                        </span>
+                        <span v-else-if="item.prop == 'type'">
+                            <template v-for="type in typeData" v-if="type.key == scope.row[item.prop]">{{type.value}}</template>
+                        </span>
+                        <span v-else-if="item.prop == 'linkObject'">{{scope.row[item.prop].name}}</span>
                         <span v-else>{{scope.row[item.prop]}}</span>
                     </template>
                 </el-table-column>
@@ -85,7 +106,7 @@
                         <span v-if="rightBox.isEdit">{{$t('overall.save')}}</span>
                         <span v-else>{{$t('overall.edit')}}</span>
                     </div>
-                    <div class="right-box-top-btn" v-if="rightBox.isEdit && alertRule.id != ''">
+                    <div @click="del" class="right-box-top-btn" v-if="rightBox.isEdit && alertRule.id != ''">
                         <div class="right-box-btn-icon">
                             <i class="el-icon-delete"></i>
                         </div>
@@ -100,6 +121,7 @@
 
                 <!-- begin--表单-->
                 <div class="right-box-form">
+                    <!--name-->
                     <div class="right-box-form-row">
                         <div class="right-box-form-label">{{$t('alert.config.name')}}</div>
                         <div class="right-box-form-content">
@@ -115,6 +137,52 @@
                             <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.alertName}}</div>
                         </div>
                     </div>
+                    <!--type-->
+                    <div class="right-box-form-row">
+                        <div class="right-box-form-label">{{$t('alert.list.type')}}</div>
+                        <div class="right-box-form-content">
+                            <el-select popper-class="config-dropdown" v-model="alertRule.type" placeholder="" v-if="rightBox.isEdit" size="small">
+                                <el-option
+                                  v-for="item in typeData"
+                                  :key="item.key"
+                                  :label="item.value"
+                                  :value="item.key">
+                                </el-option>
+                            </el-select>
+                            <div v-for="item in typeData" v-if="!rightBox.isEdit && item.key == alertRule.type" class="right-box-form-content-txt">{{item.value}}</div>
+                        </div>
+                    </div>
+                    <!--linkedId-->
+                    <div class="right-box-form-row">
+                        <div class="right-box-form-label">{{$t('alert.config.link')}}</div>
+                        <div class="right-box-form-content">
+                            <el-input
+                              v-if="rightBox.isEdit"
+                              type="text"
+                              v-model="alertRule.linkId"
+                              size="mini"
+                            ></el-input>
+                            <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.linkObject.name}}</div>
+                            <!--<el-select popper-class="config-dropdown" v-model="alertRule.severity" placeholder="" v-if="rightBox.isEdit" size="small">
+                                <el-option
+                                  v-for="item in severityData"
+                                  :key="item.key"
+                                  :label="item.value"
+                                  :value="item.key">
+                                    <span class="config-dropdown-label-txt" v-if="!item.isEdit">{{item.value}}</span>
+                                    <span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop>
+                                        <el-input
+                                          type="text"
+                                          v-model="item.name"
+                                          size="mini"
+                                        ></el-input>
+                                    </span>
+                                </el-option>
+                              </el-select>
+                            <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.severity}}</div>-->
+                        </div>
+                    </div>
+                    <!--expr-->
                     <div class="right-box-form-row">
                         <div class="right-box-form-label">{{$t('alert.config.expr')}}</div>
                         <div class="right-box-form-content">
@@ -128,6 +196,7 @@
                           <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.expr}}</div>
                         </div>
                     </div>
+                    <!--for-->
                     <div class="right-box-form-row">
                         <div class="right-box-form-label">{{$t('alert.config.for')}}</div>
                         <div class="right-box-form-content">
@@ -137,23 +206,36 @@
                               placeholder=""
                               v-model="alertRule.last"
                               size="small"
-                            ></el-input>
+                            >
+                              <template slot="append">second</template>
+                            </el-input>
                           <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.last}}s</div>
                         </div>
                     </div>
+                    <!--severity-->
                     <div class="right-box-form-row">
                         <div class="right-box-form-label">{{$t('alert.severity')}}</div>
                         <div class="right-box-form-content">
-                            <el-input
-                              type="text"
-                              v-if="rightBox.isEdit"
-                              placeholder=""
-                              v-model="alertRule.severity"
-                              size="small"
-                            ></el-input>
-                          <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.severity}}</div>
+                            <el-select popper-class="config-dropdown" v-model="alertRule.severity" placeholder="" v-if="rightBox.isEdit" size="small">
+                                <el-option
+                                  v-for="item in severityData"
+                                  :key="item.key"
+                                  :label="item.value"
+                                  :value="item.key">
+                                    <span class="config-dropdown-label-txt" v-if="!item.isEdit">{{item.value}}</span>
+                                    <span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop>
+                                        <el-input
+                                          type="text"
+                                          v-model="item.name"
+                                          size="mini"
+                                        ></el-input>
+                                     </span>
+                                </el-option>
+                            </el-select>
+                            <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.severity}}</div>
                         </div>
                     </div>
+                    <!--summary-->
                     <div class="right-box-form-row">
                         <div class="right-box-form-label">{{$t('alert.summary')}}</div>
                         <div class="right-box-form-content">
@@ -167,6 +249,7 @@
                           <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.summary}}</div>
                         </div>
                     </div>
+                    <!--description-->
                     <div class="right-box-form-row">
                         <div class="right-box-form-label">{{$t('alert.description')}}</div>
                         <div class="right-box-form-content">
@@ -180,6 +263,7 @@
                             <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{alertRule.description}}</div>
                         </div>
                     </div>
+                    <!--receiver-->
                     <div class="right-box-form-row">
                         <div class="right-box-form-label">{{$t('config.account.receiver')}}</div>
                         <div class="right-box-form-content">
@@ -191,7 +275,7 @@
                                   :label="item.name"
                                   :value="item">
                                     <span class="config-dropdown-label-txt" v-if="!item.isEdit">{{item.name}}</span>
-                                    <span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop="stopFun">
+                                    <span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop>
                                         <el-input
                                           type="text"
                                           v-model="item.name"
@@ -217,7 +301,7 @@
 
                 <!-- begin--底部按钮-->
                 <div class="right-box-bottom-btns">
-                    <div @click="esc()" :class="{'right-box-bottom-btn-50': rightBox.isEdit}" class="right-box-bottom-btn right-box-bottom-btn-cancel">{{$t('overall.cancel')}}</div><div v-if="rightBox.isEdit" class="right-box-bottom-btn right-box-bottom-btn-50">{{alertRule.id == '' ? $t('overall.create') : $t('overall.save')}}</div>
+                    <div @click="esc()" :class="{'right-box-bottom-btn-50': rightBox.isEdit}" class="right-box-bottom-btn right-box-bottom-btn-cancel">{{$t('overall.cancel')}}</div><div @click="save" v-if="rightBox.isEdit" class="right-box-bottom-btn right-box-bottom-btn-50">{{alertRule.id == '' ? $t('overall.create') : $t('overall.save')}}</div>
                 </div>
                 <!-- end--底部按钮-->
 
@@ -228,9 +312,40 @@
 </template>
 <script>
 export default {
-  name: "account",
+  name: "alert-config",
   data() {
     return {
+      searchMsg: { //给搜索框子组件传递的信息
+        zheze_none: true,
+        searchLabelList: [{
+          id: 1,
+          name: 'ID',
+          type: 'input',
+          label: 'id',
+          disabled: false
+        },{
+          id: 2,
+          name: this.$t('alert.alertName'),
+          type: 'input',
+          label: 'alertName',
+          disabled: false
+        },{
+          id: 3,
+          name: this.$t('alert.list.type'),
+          type: 'select',
+          label: 'alertType',
+          disabled: false
+        },{
+          id: 4,
+          name: this.$t('alert.severity'),
+          type: 'selectString',
+          label: 'severity',
+          disabled: false
+        }],
+      },
+      searchLabel: { //搜索参数
+
+      },
       rightBox: { //弹出框相关
         show: false,
         isEdit: false, //false查看，true编辑
@@ -240,6 +355,7 @@ export default {
         id: '',
         alertName: '',
         type: '',
+        linkObject: {id: '', name: ''},
         linkId: '',
         expr: '',
         last: '',
@@ -253,6 +369,34 @@ export default {
         pageSize: 20,
         total:0
       },
+      severityData: [
+        {
+          key: 'medium',
+          value: this.$t("alert.config.medium")
+        },
+        {
+          key: 'high',
+          value: this.$t("alert.config.high")
+        },
+        {
+          key: 'low',
+          value: this.$t("alert.config.low")
+        }
+      ],
+      typeData: [
+        {
+          key: 1,
+          value: this.$t('alert.config.typeOption.project')
+        },
+        {
+          key: 2,
+          value: this.$t('alert.config.typeOption.module')
+        },
+        {
+          key: 3,
+          value: this.$t('alert.config.typeOption.asset')
+        }
+      ],
       tableTitle: [
         {
           label: 'ID',
@@ -267,6 +411,14 @@ export default {
           label: this.$t("alert.config.expr"),
           prop: 'expr',
           show: true,
+        }, {
+          label: this.$t("alert.list.type"),
+          prop: 'type',
+          show: true,
+        }, {
+          label: this.$t("alert.config.link"),
+          prop: 'linkObject',
+          show: true,
         }, {
           label: this.$t("alert.config.for"),
           prop: 'last',
@@ -318,18 +470,32 @@ export default {
     }
   },
   methods: {
-    edit: function(u) {
+    toEdit: function(u) {
       this.alertRule = Object.assign({}, u);
       this.rightBox.isEdit = true;
-      this.rightBox.title = this.$t("alert.config.editalertConfig") + "  ID：" + u.id;
+      this.rightBox.title = this.$t("alert.config.editAlertConfig") + "  ID：" + u.id;
       this.rightBox.show = true;
     },
     del: function(u) {
+      this.$confirm(this.$t("tip.confirmDelete"), {
+        confirmButtonText: this.$t("tip.yes"),
+        cancelButtonText: this.$t("tip.no"),
+        type: 'warning'
+      }).then(() => {
+        this.$delete("alert/rule?ids=" + u.id).then(response => {
+          if (response.code === 200) {
+            this.$message({type: 'success', message: this.$t("tip.deleteSuccess")});
+            this.getTableData();
+          } else {
+            this.$message.error(response.msg);
+          }
+        })
+      });
     },
     toAdd: function() {
       this.cleanAlertRule();
       this.rightBox.isEdit = true;
-      this.rightBox.title = this.$t("alert.config.createalertConfig");
+      this.rightBox.title = this.$t("alert.config.createAlertConfig");
       this.rightBox.show = true;
     },
     detail: function(u) {
@@ -338,10 +504,29 @@ export default {
       this.rightBox.title = this.$t("alert.config.alertConfig") + "  ID：" + u.id;
       this.rightBox.show = true;
     },
+    save: function() {
+      if (this.alertRule.id) {
+        this.$put('alert/rule', this.alertRule).then(response => {
+          if (response.code === 200) {
+            this.getTableData();
+            this.rightBox.isEdit = false;
+          }
+        });
+      } else {
+        this.$post('alert/rule', this.alertRule).then(response => {
+          if (response.code === 200) {
+            this.getTableData();
+            this.rightBox.isEdit = false;
+          }
+        });
+      }
+    },
     saveOrToEdit: function() {
       if (!this.rightBox.isEdit) {
         this.rightBox.isEdit = true;
-        this.rightBox.title = this.$t("alert.config.editalertConfig") + "  ID：" + this.alertRule.id;
+        this.rightBox.title = this.$t("alert.config.editAlertConfig") + "  ID：" + this.alertRule.id;
+      } else {
+        this.save();
       }
     },
     toEditReceiver: function(item) {
@@ -382,7 +567,9 @@ export default {
       }
     },
     getTableData: function() {
-      this.$get('alert/rule', this.pageObj).then(response => {
+      this.$set(this.searchLabel, "pageNo", this.pageObj.pageNo);
+      this.$set(this.searchLabel, "pageSize", this.pageObj.pageSize);
+      this.$get('alert/rule', this.searchLabel).then(response => {
         if (response.code == 200) {
           this.tableData = response.data.list;
           this.pageObj.total = response.data.total;
@@ -391,9 +578,6 @@ export default {
     },
     esc: function() {
       this.rightBox.show = false;
-    },
-    stopFun: function() {
-
     },
     updateReceiverName: function(item) {
       //TODO 请求接口改名
@@ -409,6 +593,7 @@ export default {
         alertName: '',
         type: '',
         linkId: '',
+        linkObject: {id: '', name: ''},
         expr: '',
         last: '',
         severity: '',
@@ -418,8 +603,8 @@ export default {
       }
     },
     jumpTo(data,id) {
-      this.$store.state.assetData.moduleData = data
-      this.$store.state.assetData.selectedData = id
+      this.$store.state.assetData.moduleData = data;
+      this.$store.state.assetData.selectedData = id;
       this.$router.push({
         path: "/" + data,
         query: {
@@ -429,16 +614,36 @@ export default {
     },
     pageNo(val) {
       this.pageObj.pageNo = val;
-      this.getTableData()
+      this.getTableData();
     },
     pageSize(val) {
       this.pageObj.pageSize = val;
-      this.getTableData()
+      this.getTableData();
+    },
+    search: function(searchObj) {
+      this.searchLabel = {};
+      for (let item in searchObj) {
+        if (searchObj[item]) {
+          this.$set(this.searchLabel, item, searchObj[item]);
+        }
+      }
+      this.getTableData();
     }
   },
   mounted() {
     this.getTableData();
     this.initReceiverData();
+  },
+  computed: {
+    sProject() {
+      return this.$store.state.createAlertConfig;
+    }
+  },
+  watch: {
+    sProject(n, o) {
+      this.$store.commit('toCreateAlertConfig', false);
+      this.toAdd();
+    }
   }
 }
 </script>
diff --git a/nezha-fronted/src/components/page/alert/list.vue b/nezha-fronted/src/components/page/alert/list.vue
index e90264a73..1403e8ef6 100644
--- a/nezha-fronted/src/components/page/alert/list.vue
+++ b/nezha-fronted/src/components/page/alert/list.vue
@@ -169,16 +169,7 @@
         </div>
         <div class="content-right">
             <div class="top-tools">
-              <el-button @click="toAdd" class="top-tool-btn top-tool-btn-active margin-l-10 top-tool top-tool-right" size="mini">
-                <span><i class="el-icon-plus"></i></span>
-                <span class="top-tool-btn-txt">{{$t('overall.add')}}</span>
-              </el-button>
-              <el-input
-                  class="top-tool-search top-tool top-tool-right"
-                  type="text"
-                  :placeholder="$t('overall.search')"
-                  size="mini"
-                ></el-input>
+                <div class="top-tool-search top-tool top-tool-right"><search-input :searchMsg="searchMsg" @search="search"></search-input></div>
             </div>
             <el-table
                   :data="tableData"
@@ -194,13 +185,18 @@
                 >
                     <template slot-scope="scope" :column="item">
                         <div v-if="item.prop == 'type'" class="account-list-options">
-                            <span v-if="scope.row[item.prop] == 1" class="account-list-option">Project alert</span>
-                            <span v-if="scope.row[item.prop] == 2" class="account-list-option">Module alert</span>
-                            <span v-if="scope.row[item.prop] == 3" class="account-list-option">Device alert</span>
+                            <span v-if="scope.row[item.prop] == 1" class="account-list-option">Project</span>
+                            <span v-if="scope.row[item.prop] == 2" class="account-list-option">Module</span>
+                            <span v-if="scope.row[item.prop] == 3" class="account-list-option">Device</span>
                         </div>
+                        <span v-else-if="item.prop == 'severity'">
+                            <span v-if="scope.row[item.prop] == 'high'"><i class="el-icon-arrow-up"></i>&nbsp;{{severityData[1].value}}</span>
+                            <span style="padding-left: 18px;" v-if="scope.row[item.prop] == 'medium'">{{severityData[0].value}}</span>
+                            <span v-if="scope.row[item.prop] == 'low'"><i class="el-icon-arrow-down"></i>&nbsp;{{severityData[2].value}}</span>
+                        </span>
                         <div v-else-if="item.prop == 'linkObject'">
-                            <span v-if="scope.row['type'] == 1 || scope.row['type'] == 2" class="account-list-option">{{scope.row[item.prop].name}}</span>
-                            <span v-if="scope.row['type'] == 3" class="account-list-option">{{scope.row[item.prop].host}}</span>
+                            <span v-if="(scope.row['type'] == 1 || scope.row['type'] == 2) && scope.row[item.prop]" class="account-list-option">{{scope.row[item.prop].name}}</span>
+                            <span v-if="scope.row['type'] == 3 && scope.row[item.prop]" class="account-list-option">{{scope.row[item.prop].host}}</span>
                         </div>
                         <div v-else-if="item.prop == 'state'">
                             <span class="account-list-option">
@@ -267,12 +263,53 @@ export default {
           show: true,
         }
       ],
+      searchMsg: { //给搜索框子组件传递的信息
+        zheze_none: true,
+        searchLabelList: [{
+          id: 2,
+          name: this.$t('alert.alertName'),
+          type: 'input',
+          label: 'alertName',
+          disabled: false
+        },{
+          id: 3,
+          name: this.$t('alert.list.type'),
+          type: 'select',
+          label: 'alertType',
+          disabled: false
+        },{
+          id: 4,
+          name: this.$t('alert.severity'),
+          type: 'selectString',
+          label: 'severity',
+          disabled: false
+        }],
+      },
+      searchLabel: { //搜索参数
+
+      },
+      severityData: [
+        {
+          key: 'medium',
+          value: this.$t("alert.config.medium")
+        },
+        {
+          key: 'high',
+          value: this.$t("alert.config.high")
+        },
+        {
+          key: 'low',
+          value: this.$t("alert.config.low")
+        }
+      ],
       tableData: []
     }
   },
   methods: {
     getAlertList: function() {
-      this.$get('alert/message', this.pageObj).then(response => {
+      this.$set(this.searchLabel, "pageNo", this.pageObj.pageNo);
+      this.$set(this.searchLabel, "pageSize", this.pageObj.pageSize);
+      this.$get('alert/message', this.searchLabel).then(response => {
         if (response.code == 200) {
           this.tableData = response.data.list
           this.pageObj.total = response.data.total
@@ -289,6 +326,23 @@ export default {
         }
       });
     },
+    pageNo(val) {
+      this.pageObj.pageNo = val;
+      this.getAlertList();
+    },
+    pageSize(val) {
+      this.pageObj.pageSize = val;
+      this.getAlertList();
+    },
+    search: function(searchObj) {
+      this.searchLabel = {};
+      for (let item in searchObj) {
+        if (searchObj[item]) {
+          this.$set(this.searchLabel, item, searchObj[item]);
+        }
+      }
+      this.getAlertList();
+    }
   },
   mounted() {
     this.getAlertList();
diff --git a/nezha-fronted/src/components/page/config/account.vue b/nezha-fronted/src/components/page/config/account.vue
index def7d4c21..fb489f8ae 100644
--- a/nezha-fronted/src/components/page/config/account.vue
+++ b/nezha-fronted/src/components/page/config/account.vue
@@ -176,7 +176,7 @@
                                   :label="item.name"
                                   :value="item">
                                     <span class="config-dropdown-label-txt" v-if="!item.isEdit">{{item.name}}</span>
-                                    <span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop="stopFun">
+                                    <span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop>
                                         <el-input
                                           type="text"
                                           v-model="item.name"
@@ -229,7 +229,7 @@
 
                 <!-- begin--底部按钮-->
                 <div class="right-box-bottom-btns">
-                    <div @click="esc()" :class="{'right-box-bottom-btn-50': rightBox.isEdit}" class="right-box-bottom-btn right-box-bottom-btn-cancel">{{$t('overall.cancel')}}</div><div v-if="rightBox.isEdit" class="right-box-bottom-btn right-box-bottom-btn-50">{{user.userId == '' ? $t('overall.create') : $t('overall.save')}}</div>
+                    <div @click="esc()" :class="{'right-box-bottom-btn-50': rightBox.isEdit}" class="right-box-bottom-btn right-box-bottom-btn-cancel">{{$t('overall.cancel')}}</div><div @click="save" v-if="rightBox.isEdit" class="right-box-bottom-btn right-box-bottom-btn-50">{{user.userId == '' ? $t('overall.create') : $t('overall.save')}}</div>
                 </div>
                 <!-- end--底部按钮-->
 
@@ -364,17 +364,24 @@ export default {
       this.rightBox.title = this.$t("config.account.createAccount");
       this.rightBox.show = true;
     },
+    save: function() {
+      this.$post('sys/user/update', this.user).then(response => {
+        if (response.code === 200) {
+          this.rightBox.isEdit = false;
+        }
+      });
+    },
     saveOrToEdit: function() {
       if (!this.rightBox.isEdit) {
         this.rightBox.isEdit = true;
         this.rightBox.title = this.$t("config.account.editAccount") + "  ID：" + this.user.userId;
       } else {
-
+        this.save();
       }
     },
     jumpTo(data,id) {
-      this.$store.state.assetData.moduleData = data
-      this.$store.state.assetData.selectedData = id
+      this.$store.state.assetData.moduleData = data;
+      this.$store.state.assetData.selectedData = id;
       this.$router.push({
         path: "/" + data,
         query: {
@@ -421,9 +428,6 @@ export default {
     },
     esc: function() {
       this.rightBox.show = false;
-    },
-    stopFun: function() {
-
     },
     updateReceiverName: function(item) {
       //TODO 请求接口改名
diff --git a/nezha-fronted/src/components/page/config/promServer.vue b/nezha-fronted/src/components/page/config/promServer.vue
index e60101b6f..3a86e4a61 100644
--- a/nezha-fronted/src/components/page/config/promServer.vue
+++ b/nezha-fronted/src/components/page/config/promServer.vue
@@ -39,12 +39,7 @@
                 <span><i class="el-icon-plus"></i></span>
                 <span class="top-tool-btn-txt">{{$t('overall.add')}}</span>
               </el-button>
-              <el-input
-                  class="top-tool-search top-tool top-tool-right"
-                  type="text"
-                  :placeholder="$t('overall.search')"
-                  size="mini"
-                ></el-input>
+              <div class="top-tool-search top-tool top-tool-right"><search-input :searchMsg="searchMsg" @search="search"></search-input></div>
             </div>
             <el-table
                   :data="tableData"
@@ -60,6 +55,10 @@
                 >
                     <template slot-scope="scope" :column="item">
                         <span v-if="item.prop == 'idc'">{{scope.row[item.prop].name}}</span>
+                        <span v-else-if="item.prop == 'type'">
+                            {{scope.row[item.prop] == '1' ? 'Global' : ''}}
+                            {{scope.row[item.prop] == '2' ? 'Per-Datacenter' : ''}}
+                        </span>
                         <span v-else>{{scope.row[item.prop]}}</span>
                     </template>
                 </el-table-column>
@@ -93,7 +92,7 @@
                         <span v-if="rightBox.isEdit">{{$t('overall.save')}}</span>
                         <span v-else>{{$t('overall.edit')}}</span>
                     </div>
-                    <div class="right-box-top-btn" v-if="rightBox.isEdit && promServer.id != ''">
+                    <div @click="del" class="right-box-top-btn" v-if="rightBox.isEdit && promServer.id != ''">
                         <div class="right-box-btn-icon">
                             <i class="el-icon-delete"></i>
                         </div>
@@ -109,7 +108,7 @@
                 <!-- begin--表单-->
                 <div class="right-box-form">
                     <div class="right-box-form-row">
-                        <div class="right-box-form-label">IDC</div>
+                        <div class="right-box-form-label">DC</div>
                         <div class="right-box-form-content">
                             <el-select class="right-box-row-with-btn" value-key="id" popper-class="config-dropdown" v-model="promServer.idc" placeholder="" v-if="rightBox.isEdit" size="small">
                                 <el-option
@@ -119,7 +118,7 @@
                                   :label="item.name"
                                   :value="item">
                                     <span class="config-dropdown-label-txt" v-if="!item.isEdit">{{item.name}}</span>
-                                    <span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop="stopFun">
+                                    <span class="config-dropdown-label-input" v-if="item.isEdit" @click.stop>
                                         <el-input
                                           type="text"
                                           v-model="item.name"
@@ -153,6 +152,33 @@
                             <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{promServer.host}}</div>
                         </div>
                     </div>
+                    <div class="right-box-form-row">
+                        <div class="right-box-form-label">Port</div>
+                        <div class="right-box-form-content">
+                            <el-input
+                              type="text"
+                              v-if="rightBox.isEdit"
+                              placeholder=""
+                              v-model="promServer.port"
+                              size="small"
+                            ></el-input>
+                            <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{promServer.port}}</div>
+                        </div>
+                    </div>
+                    <div class="right-box-form-row">
+                        <div class="right-box-form-label">{{$t('config.promServer.type')}}</div>
+                        <div class="right-box-form-content">
+                            <el-select popper-class="config-dropdown" v-model="promServer.type" placeholder="" v-if="rightBox.isEdit" size="small">
+                                <el-option
+                                  v-for="item in typeData"
+                                  :key="item.key"
+                                  :label="item.value"
+                                  :value="item.key">
+                                </el-option>
+                            </el-select>
+                            <div v-for="item in typeData" v-if="!rightBox.isEdit && item.key == promServer.type" class="right-box-form-content-txt">{{item.value}}</div>
+                        </div>
+                    </div>
                 </div>
                 <!-- end--表单-->
 
@@ -194,60 +220,71 @@ export default {
           show: true,
           width: 80
         }, {
-          label: 'IDC',
+          label: 'DC',
           prop: 'idc',
           show: true,
         }, {
           label: 'Host',
           prop: 'host',
           show: true,
+        }, {
+          label: 'Port',
+          prop: 'port',
+          show: true,
+        }, {
+          label: this.$t("config.promServer.type"),
+          prop: 'type',
+          show: true,
         }
       ],
       tableData: [],
-      /*tableData: [
+      idcData: [],
+      typeData: [
         {
-          id: '1',
-          host: '192.168.40.241',
-          idc: {id: '3', name: 'aerareqarew', location: 'zhaertaewr'}
-        },
-        {
-          id: '2',
-          host: '192.168.40.242',
-          idc: {id: '5', name: 'idc151654', location: 'bj'}
-        },
-        {
-          id: '3',
-          host: '192.168.40.243',
-          idc: {id: '6', name: 'idc151655', location: 'sh'}
-        },
-        {
-          id: '4',
-          host: '192.168.40.244',
-          idc: {id: '6', name: 'idc151655', location: 'sh'}
-        },
-        {
-          id: '5',
-          host: '192.168.40.245',
-          idc: {id: '7', name: 'idc151656', location: 'gd'}
-        },
-        {
-          id: '6',
-          host: '192.168.40.246',
-          idc: {id: '9', name: 'idc151657', location: 'fj'}
-        },
-      ],*/
-      idcData: []
-      /*idcData: [
-        {id: '1', name: 'idc151656', location: 'gd'},
-        {id: '2', name: 'idc151656', location: 'gd'},
-        {id: '3', name: 'aerareqarew', location: 'zhaertaewr'},
-        {id: '4', name: 'idc151656', location: 'gd'},
-        {id: '5', name: 'idc151654', location: 'bj'},
-        {id: '6', name: 'idc151655', location: 'sh'},
-        {id: '7', name: 'idc151656', location: 'gd'},
-        {id: '8', name: 'idc151656', location: 'gd'},
-        {id: '9', name: 'idc151657', location: 'fj'},
-      ]*/
+          key: 1,
+          value: 'Global'
+        }, {
+          key: 2,
+          value: 'Per-Datacenter'
+        }
+      ],
+      searchMsg: { //给搜索框子组件传递的信息
+        zheze_none: true,
+        searchLabelList: [{
+          id: 1,
+          name: 'ID',
+          type: 'input',
+          label: 'id',
+          disabled: false
+        },{
+          id: 5,
+          name: 'DC',
+          type: 'dc',
+          label: 'dc',
+          disabled: false
+        },{
+          id: 6,
+          name: this.$t('config.promServer.type'),
+          type: 'select',
+          label: 'promType',
+          disabled: false
+        },{
+          id: 8,
+          name: this.$t('project.endpoint.host'),
+          type: 'input',
+          label: 'host',
+          disabled: false
+        },{
+          id: 9,
+          name: this.$t('project.endpoint.port'),
+          type: 'input',
+          label: 'port',
+          disabled: false
+        }],
+      },
+      searchLabel: { //搜索参数
+
+      },
     }
   },
   methods: {
@@ -258,14 +295,20 @@ export default {
       this.rightBox.show = true;
     },
     del: function(u) {
-    },
-    getTableData: function() {
-      this.$get('promServer', this.pageObj).then(response => {
-        if (response.code === 200) {
-          this.tableData = response.data.list;
-          this.pageObj.total = response.data.total
-        }
-      })
+      this.$confirm(this.$t("tip.confirmDelete"), {
+        confirmButtonText: this.$t("tip.yes"),
+        cancelButtonText: this.$t("tip.no"),
+        type: 'warning'
+      }).then(() => {
+        this.$delete("promServer?ids=" + u.id).then(response => {
+          if (response.code === 200) {
+            this.$message({type: 'success', message: this.$t("tip.deleteSuccess")});
+            this.getTableData();
+          } else {
+            this.$message.error(response.msg);
+          }
+        })
+      });
     },
     detail: function(u) {
       this.promServer = Object.assign({}, u);
@@ -285,6 +328,7 @@ export default {
           if (response.code === 200) {
             this.getTableData();
             this.rightBox.isEdit = false;
+            this.esc();
           }
         });
       } else {
@@ -292,6 +336,7 @@ export default {
           if (response.code === 200) {
             this.getTableData();
             this.rightBox.isEdit = false;
+            this.esc();
           }
         });
       }
@@ -316,8 +361,8 @@ export default {
               item.errorMessage = '';
               item.oldName = item.name;
               item.isEdit = false;
+              this.getIdcData();
             } else {
-              console.info(response.msg)
               this.$set(item, 'errorMessage', response.msg);
             }
           })
@@ -341,24 +386,21 @@ export default {
       this.blurEditIdc();
       //TODO 请求后台，删除
     },
-    getIdcData: async function() {
-      console.info(1)
-      await this.$get('idc', this.pageObj).then(response => {
+    getIdcData: function() {
+      this.$get('idc', this.pageObj).then(response => {
         if (response.code === 200) {
           this.idcData = response.data.list;
+          for (var i = 0; i < this.idcData.length; i++) {
+            this.$set(this.idcData[i], 'oldName', this.idcData[i].name);
+            this.$set(this.idcData[i], 'isEdit', false);
+          }
           this.getTableData();
         }
       })
-      for (var i = 0; i < this.idcData.length; i++) {
-        this.$set(this.idcData[i], 'oldName', this.idcData[i].name);
-        this.$set(this.idcData[i], 'isEdit', false);
-      }
+
     },
     esc: function() {
       this.rightBox.show = false;
-    },
-    stopFun: function() {
-
     },
     jumpTo(data,id) {
       this.$store.state.assetData.moduleData = data
@@ -371,13 +413,14 @@ export default {
       });
     },
     getTableData: function() {
-      this.$get('promServer', this.pageObj).then(response => {
+      this.$set(this.searchLabel, "pageNo", this.pageObj.pageNo);
+      this.$set(this.searchLabel, "pageSize", this.pageObj.pageSize);
+      this.$get('promServer', this.searchLabel).then(response => {
         if (response.code === 200) {
           for (var i = 0; i < response.data.list.length; i++) {
-            console.info(this.idcData)
             for (var j = 0; j < this.idcData.length; j++) {
               if (response.data.list[i].idcId == this.idcData[j].id) {
-                response.data.list[i].idc = this.idcData[j];
+                response.data.list[i].idc = Object.assign({}, this.idcData[j]);
                 break;
               }
             }
@@ -402,6 +445,15 @@ export default {
     pageSize(val) {
       this.pageObj.pageSize = val;
       this.getTableData();
+    },
+    search: function(searchObj) {
+      this.searchLabel = {};
+      for (let item in searchObj) {
+        if (searchObj[item]) {
+          this.$set(this.searchLabel, item, searchObj[item]);
+        }
+      }
+      this.getTableData();
     }
   },
   mounted: function() {
diff --git a/nezha-fronted/src/components/page/project/project.vue b/nezha-fronted/src/components/page/project/project.vue
index 4d61bbf3a..960363e33 100644
--- a/nezha-fronted/src/components/page/project/project.vue
+++ b/nezha-fronted/src/components/page/project/project.vue
@@ -246,17 +246,57 @@
         </div>
       </div>
     </div>
-    <div class="content-right">
+    
+    <!--metrics-->
+    <div class="content-right" v-if="tableShow == 2">
+      <div class="top-tools">
+        <el-button-group>
+          <el-button @click="tableShow = 1" class="top-tool-btn top-tool" size="mini">
+            <span class="top-tool-btn-txt">{{$t('project.endpoint.endpoint')}}</span>
+          </el-button>
+          <el-button @click="" class="top-tool-btn top-tool top-tool-btn-active" size="mini">
+            <span class="top-tool-btn-txt">{{$t('project.metrics.metrics')}}</span>
+          </el-button>
+        </el-button-group>
+        <el-input
+          class="top-tool-search top-tool top-tool-right"
+          type="text"
+          :placeholder="$t('overall.search')"
+          size="mini"
+        ></el-input>
+      </div>
+      <el-table
+        :data="metricsTableData"
+        border
+        height="calc(100% - 65px)"
+        style="width: 100%;">
+        <el-table-column
+          v-for="(item, index) in metricsTableTitle"
+          v-if="item.show"
+          :width="item.width"
+          :key="`col-${index}`"
+          :label="item.label"
+        >
+          <template slot-scope="scope" :column="item">
+            <span>{{scope.row[item.prop]}}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+      <Pagination :pageObj="metricsPageObj" @pageNo='pageNo' @pageSize='pageSize' ref="Pagination"></Pagination>
+    </div>
+
+    <!--endpoint-->
+    <div class="content-right" v-if="tableShow == 1">
       <div class="top-tools">
         <el-button-group>
           <el-button @click="" class="top-tool-btn top-tool top-tool-btn-active" size="mini">
             <span class="top-tool-btn-txt">{{$t('project.endpoint.endpoint')}}</span>
           </el-button>
-          <el-button @click="" class="top-tool-btn top-tool" size="mini">
-            <span class="top-tool-btn-txt">{{$t('project.metrics')}}</span>
+          <el-button @click="tableShow = 2" class="top-tool-btn top-tool" size="mini">
+            <span class="top-tool-btn-txt">{{$t('project.metrics.metrics')}}</span>
           </el-button>
         </el-button-group>
-        <el-button @click="toAdd" class="top-tool-btn top-tool-btn-active top-tool margin-l-10 top-tool-right" size="mini">
+        <el-button @click.stop="toAdd" class="top-tool-btn top-tool-btn-active top-tool margin-l-10 top-tool-right" size="mini">
           <span><i class="el-icon-plus"></i></span>
           <span class="top-tool-btn-txt">{{$t('overall.add')}}</span>
         </el-button>
@@ -273,7 +313,7 @@
         height="calc(100% - 65px)"
         style="width: 100%;">
         <el-table-column
-          v-for="(item, index) in tableTitle"
+          v-for="(item, index) in endpointTableTitle"
           v-if="item.show"
           :width="item.width"
           :key="`col-${index}`"
@@ -287,8 +327,8 @@
         <el-table-column :label="$t('overall.option')" width="100">
           <template slot-scope="scope" :column="item">
             <div class="content-right-options">
-              <span @click="detail(scope.row)" class="content-right-option"><i class="el-icon-view"></i></span>
-              <span @click="toEdit(scope.row)" class="content-right-option"><i class="el-icon-edit-outline"></i></span>
+              <span @click.stop="detail(scope.row)" class="content-right-option"><i class="el-icon-view"></i></span>
+              <span @click.stop="toEdit(scope.row)" class="content-right-option"><i class="el-icon-edit-outline"></i></span>
             </div>
           </template>
         </el-table-column>
@@ -298,7 +338,7 @@
 
     <!-- begin--右弹框-->
     <transition name="right-box">
-      <div class="right-box right-box-endpoint" v-if="rightBox.show">
+      <div class="right-box right-box-endpoint" v-if="rightBox.show" @click.stop>
         <!-- begin--顶部按钮-->
         <div class="right-box-top-btns">
           <div class="right-box-top-btn right-box-top-btn-full" @click="esc(1)">
@@ -314,7 +354,7 @@
             <span v-if="rightBox.isEdit">{{$t('overall.save')}}</span>
             <span v-else>{{$t('overall.edit')}}</span>
           </div>
-          <div class="right-box-top-btn" v-if="rightBox.isEdit && endpoint.id != ''">
+          <div class="right-box-top-btn" v-if="rightBox.isEdit && endpoint.id != ''" @click="del()">
             <div class="right-box-btn-icon">
               <i class="el-icon-delete"></i>
             </div>
@@ -343,7 +383,7 @@
           <div class="right-box-form-row">
             <div class="right-box-form-label">{{$t("project.module.module")}}</div>
             <div class="right-box-form-content">
-              <el-select @change="((val) => {changeSelectedModule(val.id)})" value-key="id" popper-class="config-dropdown" v-model="selectedModule" placeholder="" v-if="rightBox.isEdit" size="small">
+              <el-select @change="((val) => {changeSelectedModule(val)})" value-key="id" popper-class="config-dropdown" v-model="selectedModule" placeholder="" v-if="rightBox.isEdit" size="small">
                 <el-option v-for="item in toSelectModuleData" :key="item.id" :label="item.name" :value="item"></el-option>
               </el-select>
               <div v-if="!rightBox.isEdit" class="right-box-form-content-txt">{{endpoint.module.name}}</div>
@@ -396,16 +436,16 @@
           <div class="right-box-form-row">
             <div class="right-box-form-label">
               {{$t("project.endpoint.param")}}
-              <el-button class="param-btn param-btn-active margin-l-10" size="mini" @click="addParam"><i class="el-icon-plus"></i>{{$t('overall.add')}}</el-button>
-              <el-button class="param-btn param-btn-clear" size="mini" @click="clearAllParam">{{$t('overall.clearAll')}}</el-button>
+              <el-button v-if="rightBox.isEdit" class="param-btn param-btn-active margin-l-10" size="mini" @click="addParam"><i class="el-icon-plus"></i>{{$t('overall.add')}}</el-button>
+              <el-button v-if="rightBox.isEdit" class="param-btn param-btn-clear" size="mini" @click="clearAllParam">{{$t('overall.clearAll')}}</el-button>
             </div>
             <div class="right-box-form-content">
               <div class="param-box param-box-endpoint">
                 <div class="param-box-row" v-for="(item, index) in paramObj">
-                  <el-input placeholder="key" class="param-box-row-key" size="mini" v-model="item.key"></el-input>
+                  <el-input :disabled="!rightBox.isEdit" placeholder="key" class="param-box-row-key" size="mini" v-model="item.key"></el-input>
                   <span class="param-box-row-eq">=</span>
-                  <el-input placeholder="value" class="param-box-row-value" size="mini" v-model="item.value"></el-input>
-                  <span class="param-box-row-symbol" @click="removeParam(index)"><i class="el-icon-minus"></i></span>
+                  <el-input :disabled="!rightBox.isEdit" placeholder="value" class="param-box-row-value" size="mini" v-model="item.value"></el-input>
+                  <span v-if="rightBox.isEdit" class="param-box-row-symbol" @click="removeParam(index)"><i class="el-icon-minus"></i></span>
                 </div>
               </div>
             </div>
@@ -423,7 +463,7 @@
 
     <!-- begin--子弹框-->
     <transition name="right-sub-box">
-      <div class="right-sub-box" v-if="rightSubBox.show">
+      <div class="right-sub-box" @click.stop v-if="rightSubBox.show">
         <!-- begin--标题-->
         <div class="right-box-title">{{rightSubBox.title}}</div>
         <!-- end--标题-->
@@ -484,7 +524,7 @@
 
     <!-- begin--project弹框-->
     <transition name="right-box">
-      <div class="right-box right-box-endpoint" v-if="projectRightBox.show">
+      <div class="right-box right-box-endpoint" v-if="projectRightBox.show" @click.stop>
         <!-- begin--顶部按钮-->
         <div class="right-box-top-btns">
           <div class="right-box-top-btn right-box-top-btn-full" @click="esc(2)">
@@ -499,7 +539,7 @@
             </div>
             <span>{{$t('overall.save')}}</span>
           </div>
-          <div class="right-box-top-btn" v-if="project.id != ''">
+          <div class="right-box-top-btn" v-if="project.id != ''" @click="projectDel">
             <div class="right-box-btn-icon">
               <i class="el-icon-delete"></i>
             </div>
@@ -518,27 +558,16 @@
           <div class="right-box-form-row">
             <div class="right-box-form-label">{{$t("project.project.projectName")}}</div>
             <div class="right-box-form-content">
-              <el-input
-                placeholder=""
-                maxlength="64"
-                show-word-limit
-                v-model="project.name"
-                size="small"
-              ></el-input>
+              <el-input v-if="!projectRightBox.isCreate" placeholder="" maxlength="64" show-word-limit v-model="project.name" size="small"></el-input>
+              <el-input v-if="projectRightBox.isCreate" placeholder="" maxlength="64" show-word-limit v-model="newProject.name" size="small"></el-input>
             </div>
           </div>
           <!--description-->
           <div class="right-box-form-row">
             <div class="right-box-form-label">{{$t("project.project.description")}}</div>
             <div class="right-box-form-content">
-              <el-input
-                type="textarea"
-                placeholder=""
-                maxlength="1024"
-                show-word-limit
-                v-model="project.remark"
-                size="small"
-              ></el-input>
+              <el-input v-if="!projectRightBox.isCreate" type="textarea" placeholder="" maxlength="1024" show-word-limit v-model="project.remark" size="small"></el-input>
+              <el-input v-if="projectRightBox.isCreate" type="textarea" placeholder="" maxlength="1024" show-word-limit v-model="newProject.remark" size="small"></el-input>
             </div>
           </div>
         </div>
@@ -554,7 +583,8 @@
 
     <!-- begin--module弹框-->
     <transition name="right-box">
-      <div class="right-box right-box-endpoint" v-if="moduleRightBox.show">
+      <div class="right-box right-box-endpoint" v-if="moduleRightBox.show" @click.stop>
+        <el-scrollbar style="height: 100%">
         <!-- begin--顶部按钮-->
         <div class="right-box-top-btns">
           <div class="right-box-top-btn right-box-top-btn-full" @click="esc(3)">
@@ -569,7 +599,7 @@
             </div>
             <span>{{$t('overall.save')}}</span>
           </div>
-          <div class="right-box-top-btn" v-if="currentModule.id != ''">
+          <div class="right-box-top-btn" v-if="currentModule.id != '' && !moduleRightBox.isCreate" @click="moduleDel">
             <div class="right-box-btn-icon">
               <i class="el-icon-delete"></i>
             </div>
@@ -588,36 +618,28 @@
           <div class="right-box-form-row">
             <div class="right-box-form-label">{{$t("project.project.project")}}</div>
             <div class="right-box-form-content">
-              <el-select value-key="id" popper-class="config-dropdown" v-model="currentModule.project" placeholder="" size="small">
+              <el-select v-if="!moduleRightBox.isCreate" value-key="id" popper-class="config-dropdown" v-model="currentModule.project" placeholder="" size="small">
                 <el-option v-for="item in projectData" :key="item.id" :label="item.name" :value="item"></el-option>
               </el-select>
+              <el-select v-if="moduleRightBox.isCreate" popper-class="config-dropdown" v-model="newModule.projectId" placeholder="" size="small">
+                <el-option v-for="item in projectData" :key="item.id" :label="item.name" :value="item.id"></el-option>
+              </el-select>
             </div>
           </div>
           <!--name-->
           <div class="right-box-form-row">
             <div class="right-box-form-label">{{$t("project.module.moduleName")}}</div>
             <div class="right-box-form-content">
-              <el-input
-                placeholder=""
-                maxlength="64"
-                show-word-limit
-                v-model="currentModule.name"
-                size="small"
-              ></el-input>
+              <el-input v-if="!moduleRightBox.isCreate" placeholder="" maxlength="64" show-word-limit v-model="currentModule.name" size="small"></el-input>
+              <el-input v-if="moduleRightBox.isCreate" placeholder="" maxlength="64" show-word-limit v-model="newModule.name" size="small"></el-input>
             </div>
           </div>
           <!--description-->
           <div class="right-box-form-row">
             <div class="right-box-form-label">{{$t("project.module.description")}}</div>
             <div class="right-box-form-content">
-              <el-input
-                type="textarea"
-                placeholder=""
-                maxlength="1024"
-                show-word-limit
-                v-model="currentModule.remark"
-                size="small"
-              ></el-input>
+              <el-input v-if="!moduleRightBox.isCreate" type="textarea" placeholder="" maxlength="1024" show-word-limit v-model="currentModule.remark" size="small"></el-input>
+              <el-input v-if="moduleRightBox.isCreate" type="textarea" placeholder="" maxlength="1024" show-word-limit v-model="newModule.remark" size="small"></el-input>
             </div>
           </div>
           <!--tip-->
@@ -634,22 +656,16 @@
           <div class="right-box-form-row">
             <div class="right-box-form-label">{{$t("project.endpoint.port")}}</div>
             <div class="right-box-form-content">
-              <el-input
-                placeholder=""
-                v-model="currentModule.port"
-                size="small"
-              ></el-input>
+              <el-input v-if="!moduleRightBox.isCreate" placeholder="" v-model="currentModule.port" size="small"></el-input>
+              <el-input v-if="moduleRightBox.isCreate" placeholder="" v-model="newModule.port" size="small"></el-input>
             </div>
           </div>
           <!--path-->
           <div class="right-box-form-row">
             <div class="right-box-form-label">{{$t("project.endpoint.path")}}</div>
             <div class="right-box-form-content">
-              <el-input
-                placeholder=""
-                v-model="currentModule.path"
-                size="small"
-              ></el-input>
+              <el-input v-if="!moduleRightBox.isCreate" placeholder="" v-model="currentModule.path" size="small"></el-input>
+              <el-input v-if="moduleRightBox.isCreate" placeholder="" v-model="newModule.path" size="small"></el-input>
             </div>
           </div>
           <!--param-->
@@ -674,9 +690,10 @@
 
         <!-- begin--底部按钮-->
         <div class="right-box-bottom-btns">
-          <div @click="esc(3)" class="right-box-bottom-btn right-box-bottom-btn-cancel right-box-bottom-btn-50">{{$t('overall.cancel')}}</div><div @click="moduleSave" class="right-box-bottom-btn right-box-bottom-btn-50">{{currentModule.id == '' ? $t('overall.create') : $t('overall.save')}}</div>
+          <div @click="esc(3)" class="right-box-bottom-btn right-box-bottom-btn-cancel right-box-bottom-btn-50">{{$t('overall.cancel')}}</div><div @click="moduleSave" class="right-box-bottom-btn right-box-bottom-btn-50">{{currentModule.id == '' && moduleRightBox.isCreate ? $t('overall.create') : $t('overall.save')}}</div>
         </div>
         <!-- end--底部按钮-->
+        </el-scrollbar>
       </div>
     </transition>
     <!-- end--module弹框-->
@@ -688,11 +705,15 @@ export default {
   name: "project",
   data() {
     return {
+      tableShow: 1, // 1.endpoint; 2.metrics
       projectRightBox: {
         show: false,
-        title: ''
+        title: '',
+        isCreate: false
       },
       project: {id: '', name: '', remark: ''},
+      newProject: {id: '', name: '', remark: ''},
+      newModule: {id: '', name: '', project: {}, port: '', path: '', param: '', paramObj: []},
       rightBox: { //弹出框相关
         show: false,
         isEdit: false, //false查看，true编辑
@@ -719,6 +740,11 @@ export default {
         pageSize: 11,
         total: 0
       },
+      metricsPageObj: {
+        pageNo: 1,
+        pageSize: 20,
+        total: 0
+      },
       endpoint: {
         id: '',
         host: '',
@@ -727,26 +753,31 @@ export default {
         path: '',
         asset: {id: '', name: '', host: ''},
         project: {id: '', name: ''},
-        module: {id: '', name: '', param: '', paramObj: {}}
+        module: {id: '', name: '', param: '', paramObj: {}, projectId: ''},
+        moduleId: '',
+        assetId: ''
       },
       moduleRightBox: {
         show: false,
-        title: ''
+        title: '',
+        isCreate: false
       },
       currentModule: { //左侧列表当前选中的module
         id: '',
-        name: ''
+        name: '',
+        projectId: ''
       },
-      selectedModule: { //侧滑框中选中的module
+      selectedModule: { //endpoint侧滑框中选中的module
         id: '',
-        name: ''
+        name: '',
+        projectId: ''
       },
-      selectedAsset: { //侧滑框中选中的asset
+      selectedAsset: { //endpoint侧滑框中选中的asset
         id: '',
         host: '',
         sn: ''
       },
-      tableTitle: [
+      endpointTableTitle: [
         {
           label: this.$t("project.endpoint.endpointId"),
           prop: 'id',
@@ -784,7 +815,31 @@ export default {
       moduleData: [], //左侧列表的module信息
       toSelectModuleData: [], //侧滑框中可选的module
       paramObj: [], //侧滑框中的param信息
-      assetData: [] //侧滑框中可选的asset
+      assetData: [],  //侧滑框中可选的asset
+      metricsTableData: [
+        {
+          name: 'Topic.msg',
+          type: 'Counter',
+          desc: '10000'
+        }
+      ],
+      metricsTableTitle: [
+        {
+          label: this.$t("project.metrics.name"),
+          prop: 'name',
+          show: true,
+        },
+        {
+          label: this.$t("project.metrics.type"),
+          prop: 'type',
+          show: true,
+        },
+        {
+          label: this.$t("project.metrics.description"),
+          prop: 'desc',
+          show: true,
+        },
+      ]
     }
   },
   methods: {
@@ -816,10 +871,21 @@ export default {
       });
     },
     // 获取module、endpoint弹框中project下拉框数据
-    getProjectData: function() {
+    getProjectData: function(name) {
       this.$get('project').then(response => {
         if (response.code === 200) {
           this.projectData = response.data.list;
+          if (name) {
+            for (let i = 0; i < this.projectData.length; i++) {
+              if (this.projectData[i].name == name) {
+                this.project = this.projectData[i];
+                this.$store.commit('setProject', this.project);
+                break;
+              }
+            }
+          } else {
+            this.project = this.projectData[0];
+          }
         }
       });
     },
@@ -840,6 +906,8 @@ export default {
     // endpoint弹框中的asset子弹框里asset选择事件
     selectAsset: function(obj) {
       this.selectedAsset = obj;
+      this.endpoint.host = obj.host;
+      this.endpoint.assetId = obj.id;
     },
     // endpoint弹框中的asset子弹框搜索
     searchAsset: function() {
@@ -858,7 +926,7 @@ export default {
       this.$get('module', {projectId: this.$store.state.projectData.id}).then(response => {
         if (response.code === 200) {
           this.moduleData = response.data.list;
-          for (var i = 0; i < response.data.list.length; i++) {
+          for (let i = 0; i < response.data.list.length; i++) {
             try {
               var tempObj = JSON.parse(response.data.list[i].param);
             } catch (err) {
@@ -877,7 +945,6 @@ export default {
             this.endPointTableData = [];
             this.pageObj.total = 0;
           }
-
         }
       });
     },
@@ -905,12 +972,12 @@ export default {
     // 左侧module列表点击事件
     changeListModule: function(module) {
       this.currentModule = Object.assign({}, module);
-      this.moduleRightBox.show = false;
+      this.esc(3);
       this.getEndPointTableData();
     },
     // endpoint弹框中module下拉框点击事件
-    changeSelectedModule: function(moduleId) {
-      if (moduleId == this.endpoint.moduleId) {
+    changeSelectedModule: function(module) {
+      if (module.id == this.endpoint.moduleId) {
         try {
           this.paramObj = JSON.parse(JSON.stringify(this.endpoint.paramObj));
         } catch(err) {
@@ -925,6 +992,8 @@ export default {
           console.info(err);
         }
       }
+      this.endpoint.port = module.port;
+      this.endpoint.path = module.path;
     },
     // 打开endpoint编辑页
     toEdit: function(endpoint) {
@@ -956,20 +1025,85 @@ export default {
       this.moduleRightBox.title = this.$t('project.module.editModule') + "  ID：" + module.id;
     },
     // 删除endpoint
-    del: function(u) {
+    del: function() {
+      this.$confirm(this.$t("tip.confirmDelete"), {
+        confirmButtonText: this.$t("tip.yes"),
+        cancelButtonText: this.$t("tip.no"),
+        type: 'warning'
+      }).then(() => {
+        this.$delete("endpoint?ids=" + this.endpoint.id).then(response => {
+          if (response.code === 200) {
+            this.$message({duration: 3000, type: 'success', message: this.$t("tip.deleteSuccess")});
+            this.getEndPointTableData();
+          } else {
+            this.$message.error(response.msg);
+          }
+        })
+      });
+    },
+    // 删除module
+    moduleDel: function() {
+      this.$confirm(this.$t("tip.confirmDelete"), {
+        confirmButtonText: this.$t("tip.yes"),
+        cancelButtonText: this.$t("tip.no"),
+        type: 'warning'
+      }).then(() => {
+        this.$delete("module?ids=" + this.currentModule.id).then(response => {
+          if (response.code === 200) {
+            this.$message({duration: 3000, type: 'success', message: this.$t("tip.deleteSuccess")});
+            this.esc(3);
+            this.getModuleData();
+          } else {
+            this.$message.error(response.msg);
+          }
+        })
+      });
+    },
+    projectDel: function() {
+      this.$confirm(this.$t("tip.confirmDelete"), {
+        confirmButtonText: this.$t("tip.yes"),
+        cancelButtonText: this.$t("tip.no"),
+        type: 'warning'
+      }).then(() => {
+        this.$delete("project?ids=" + this.project.id).then(response => {
+          if (response.code === 200) {
+            this.$message({duration: 3000, type: 'success', message: this.$t("tip.deleteSuccess")});
+            this.$store.commit('projectRightBoxShow', false);
+            this.getProjectData();
+            setTimeout(() => {
+              this.getModuleData();
+            }, 50);
+
+            if (this.projectData.length > 0) {
+              this.$store.commit('setProject', this.projectData[0]);
+            }
+            this.$store.commit('projectListReloadChange', true);
+          } else {
+            this.$message.error(response.msg);
+          }
+        })
+      });
     },
     // 打开endpoint新增页
     toAdd: function() {
       this.cleanEndpoint();
-      this.paramObj = [];
-      this.toSelectModuleData = [];
+      this.endpoint.project = Object.assign({}, this.project);
+      this.paramObj = Object.assign([], this.currentModule.paramObj);
+      this.getToSelectModuleData(this.project.id);
+      this.selectedModule = Object.assign({}, this.currentModule);
+      this.endpoint.port = this.selectedModule.port;
+      this.endpoint.path = this.selectedModule.path;
       this.rightBox.isEdit = true;
       this.rightBox.title = this.$t("project.endpoint.createEndpoint");
       this.rightBox.show = true;
+    },
+    toAddProject: function() {
+
     },
     // 打开endpoint详情页
     detail: function(u) {
       this.endpoint = Object.assign({}, u);
+      this.paramObj = Object.assign([], u.paramObj);
       this.rightBox.isEdit = false;
       this.rightBox.title = this.$t("project.endpoint.endpoint") + "  ID：" + u.id;
       this.rightBox.show = true;
@@ -978,25 +1112,91 @@ export default {
     saveOrToEdit: function() {
       if (!this.rightBox.isEdit) {
         this.rightBox.isEdit = true;
+        this.getToSelectModuleData(this.endpoint.project.id);
+        this.selectedModule = Object.assign({}, this.currentModule);
         this.rightBox.title = this.$t("project.endpoint.editEndpoint") + "  ID：" + this.endpoint.id;
+      } else {
+        this.save();
       }
     },
     // 保存project
     projectSave: function() {
-      this.$put('project', this.project).then(response => {
-        if (response.code === 200) {
-          this.$store.commit('projectListReload', true);
-          this.projectRightBox.show = false;
-        }
-      });
+      if (!this.projectRightBox.isCreate) {
+        this.$put('project', this.project).then(response => {
+          if (response.code === 200) {
+            this.$store.commit('setProject', this.project);
+            this.$store.commit('projectListReloadChange', true);
+            this.$store.commit('projectRightBoxShow', false);
+          }
+        });
+      } else {
+        this.$post('project', this.newProject).then(response => {
+          if (response.code === 200) {
+            this.projectRightBox.isCreate = false;
+            this.getProjectData(this.newProject.name);
+            this.$store.commit('projectListReloadChange', true);
+            this.$store.commit('projectRightBoxShow', false);
+            this.getModuleData();
+            this.newProject = {id:'', name:'', remark:''};
+          }
+        });
+      }
     },
     // 保存module
     moduleSave: function() {
-
+      if (!this.moduleRightBox.isCreate) {
+        this.currentModule.param = this.paramToJson();
+        this.currentModule.projectId = this.currentModule.project.id;
+        this.$put('module', this.currentModule).then(response => {
+          if (response.code === 200) {
+            this.esc(3);
+            this.getModuleData();
+          }
+        });
+      } else {
+        this.newModule.param = this.paramToJson();
+        this.$post('module', this.newModule).then(response => {
+          if (response.code === 200) {
+            this.esc(3);
+            this.getModuleData();
+            this.moduleRightBox.isCreate = false;
+          }
+        });
+      }
     },
     // 保存endpoint
     save: function() {
-
+      this.endpoint.param = this.paramToJson();
+      this.endpoint.moduleId = this.selectedModule.id;
+      if (this.endpoint.id) {
+        this.$put('endpoint', this.endpoint).then(response => {
+          if (response.code === 200) {
+            this.rightBox.isEdit = false;
+            this.esc(1);
+            this.getEndPointTableData();
+          }
+        });
+      } else {
+        this.$post('endpoint', this.endpoint).then(response => {
+          if (response.code === 200) {
+            this.rightBox.isEdit = false;
+            this.esc(1);
+            this.getEndPointTableData();
+          }
+        });
+      }
+    },
+    paramToJson: function() {
+      let tempParam = {};
+      for (let i = 0; i < this.paramObj.length; i++) {
+        eval('tempParam.' + this.paramObj[i].key + '="' + this.paramObj[i].value + '"');
+      }
+      let jsonString = JSON.stringify(tempParam);
+      if (jsonString == '{}') {
+        return "";
+      } else {
+        return jsonString;
+      }
     },
     // 清除module、endpoint弹框中的param
     clearAllParam: function() {
@@ -1042,13 +1242,18 @@ export default {
       this.pageObj.pageSize = val;
       this.getEndPointTableData();
     },
-    // endpoint弹框的子弹框顶部搜索条件选中事件
+    // endpoint弹框的asset子弹框顶部搜索条件选中事件
     dropdownSelect: function(label) {
       this.assetSearch.label = label;
       this.assetSearch.dropdownShow = false;
     }
   },
-  mounted: function() {
+  created: function() {
+    window.addEventListener('click', () => {
+      this.esc(1);
+      this.$store.commit('projectRightBoxShow', false);
+      this.esc(3);
+    });
     this.getModuleData();
     this.getProjectData();
     this.getAssetData();
@@ -1059,17 +1264,53 @@ export default {
     },
     projectBoxShow() {
       return this.$store.state.projectBoxShow;
-    }
+    },
+    toCreateProject() {
+      return this.$store.state.createProject;
+    },
+    toCreateModule() {
+      return this.$store.state.createModule;
+    },
+    toCreateEndpoint() {
+      return this.$store.state.createEndpoint;
+    },
   },
   watch: {
     sProject(n, o) {
       this.project = Object.assign({}, n);
+      this.esc(3);
+      this.esc(1);
       this.projectRightBox.title = this.$t("project.project.editProject") + "  ID：" + n.id;
       this.getModuleData();
     },
     projectBoxShow(n, o) {
-      console.info(n)
       this.projectRightBox.show = n;
+    },
+    toCreateProject(n ,o) {
+      if (n) {
+        this.$store.commit('toCreateProject', false);
+        this.projectRightBox.isCreate = true;
+        this.projectRightBox.title = this.$t('project.project.createProject');
+      }
+    },
+    toCreateModule(n ,o) {
+      if (n) {
+        this.$store.commit('toCreateModule', false);
+        this.moduleRightBox.show = true;
+        this.moduleRightBox.isCreate = true;
+        this.moduleRightBox.title = this.$t('project.module.createModule');
+        this.newModule = {id: '', name: '', projectId: this.project.id, project: this.project, port: '', path: '', param: '', paramObj: []};
+        this.paramObj = [];
+      }
+    },
+    toCreateEndpoint(n, o) {
+      if (n) {
+        this.$store.commit('toCreateEndpoint', false);
+        this.cleanEndpoint();
+        this.rightBox.show = true;
+        this.rightBox.isEdit = true;
+        this.rightBox.title = this.$t('project.endpoint.createEndpoint');
+      }
     }
   }
 }
diff --git a/nezha-fronted/src/http.js b/nezha-fronted/src/http.js
index 58dcef15e..418d84857 100644
--- a/nezha-fronted/src/http.js
+++ b/nezha-fronted/src/http.js
@@ -3,8 +3,8 @@ import router from './router'
 
 import qs from 'qs' //引入数据格式化
 //axios.defaults.baseURL = 'http://localhost:8088/nz-admin';
-axios.defaults.baseURL = 'http://192.168.41.69:8080/nz-admin';
-// axios.defaults.baseURL = 'http://192.168.40.247:8080/nz-admin';
+//axios.defaults.baseURL = 'http://192.168.41.69:8080/nz-admin';
+axios.defaults.baseURL = 'http://192.168.40.247:8080/nz-admin';
 
 axios.interceptors.request.use(config => {
       // config.headers = {
@@ -41,7 +41,7 @@ export function get(url, params) {
     }).then(response => {
       resolve(response.data)
     }).catch(err => {
-      resolve(err.response.data)
+      //resolve(err.response.data)
     })
   })
 }
@@ -51,8 +51,7 @@ export function post(url, params) {
     axios.post(url, params).then(response => {
       resolve(response.data)
     }).catch(err => {
-      console.info(err)
-      resolve('失败')
+      resolve(err.response.data);
     })
   })
 }
diff --git a/nezha-fronted/src/main.js b/nezha-fronted/src/main.js
index 5bb4de70e..af94aa536 100644
--- a/nezha-fronted/src/main.js
+++ b/nezha-fronted/src/main.js
@@ -15,17 +15,20 @@ import axios from 'axios';
 import {post, get, put, del} from './http.js'
 
 import Pagination from "./components/common/pagination"; //引入全局分页组件
-Vue.component("Pagination", Pagination);
+import searchInput from "./components/common/searchInput"; //搜索框组件
 
-Vue.prototype.$axios = axios
+Vue.component("Pagination", Pagination);
+Vue.component("searchInput", searchInput);
+
+Vue.prototype.$axios = axios;
 Vue.prototype.$post = post;
 Vue.prototype.$get = get;
 Vue.prototype.$put = put;
 Vue.prototype.$delete = del;
 
-Vue.config.productionTip = false
-Vue.use(ElementUI)
-Vue.use(Vuex)
+Vue.config.productionTip = false;
+Vue.use(ElementUI);
+Vue.use(Vuex);
 
 
 const clickoutside = {
diff --git a/nezha-fronted/src/store/index.js b/nezha-fronted/src/store/index.js
index 215bcc7f0..58c1d73ef 100644
--- a/nezha-fronted/src/store/index.js
+++ b/nezha-fronted/src/store/index.js
@@ -13,7 +13,11 @@ const store = new Vuex.Store({
       name: ''
     },
     projectBoxShow: false,
-    projectListReload: false
+    projectListReload: false,
+    createProject: false,
+    createModule: false,
+    createEndpoint: false,
+    createAlertConfig: false,
   },
   getters: {
   },
@@ -25,9 +29,21 @@ const store = new Vuex.Store({
     projectRightBoxShow(state, show) {
       state.projectBoxShow = show;
     },
-    projectListReload(state, reload) {
+    projectListReloadChange(state, reload) {
       state.projectListReload = reload;
-    }
+    },
+    toCreateProject(state, status) {
+      state.createProject = status;
+    },
+    toCreateModule(state, status) {
+      state.createModule = status;
+    },
+    toCreateEndpoint(state, status) {
+      state.createEndpoint = status;
+    },
+    toCreateAlertConfig(state, status) {
+      state.createAlertConfig = status;
+    },
   },
   actions: {
   }