style：btn组件完成

 import dialogBox from '@/components/DialogBox/dialogBox.vue'
 import LbTable from '@/components/LbTable/lb-table.vue'
 import Theme from '@/components/Theme/theme.vue'
+// 引入按钮
+import btn from '@/components/Button/src/button'
 import Popup from '@/components/Popup/index'
 import MessageBox from '@/components/MessageBox/index.js'
 export default {
   install: (Vue) => {
     Vue.component('dialogBox', dialogBox);
+    Vue.component('btn', btn);
     Vue.component('lbTable', LbTable);
     Vue.component('Theme', Theme);
     Vue.prototype.$popup = Popup.install;

 <template>
-  <button class="el-button" :class="nativeType" @click="handleClick" :type="nativeType">
+  <button class="button" :class="nativeType" @click="handleClick" :type="nativeType">
     <slot></slot>
   </button>
 </template>
@@ -20,5 +20,22 @@ export default {
 };
 </script>
 <style scoped lang="scss">
+.button {
+  width: 77px;
+  height: 32px;
+  color: #ffffff;
+  margin: 0 5px;
+}
 
+.cx {
+  background: url('../../../image/btn.png') no-repeat -4px -40px;
+}
+
+.cz {
+  background: url('../../../image/btn.png') no-repeat -4px -4px;
+}
+
+.sb {
+  background: url('../../../image/btn.png') no-repeat -4px -112px;
+}
 </style>

@@ -5,7 +5,7 @@
         <Breadcrumb />
       </div>
       <div class="right-menu">
-        <div class="dataView pointer" @click="handleDataView">大屏展示</div>
+        <div class="dataView d-center pointer" @click="handleDataView">大屏展示</div>
         <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="hover" @command="handleCommand">
           <div class="avatar-wrapper">
             <span style="padding-right:10px">{{ name }}</span>
@@ -66,6 +66,11 @@ export default {
 
 .dataView {
   color: #fff;
+  width: 120px;
+  height: 32px;
+  background: url('../../image/dp.png');
+  background-size: cover;
+  margin-right: 20px;
 }
 
 .NoticeBar {

@@ -159,7 +159,11 @@ div:focus {
   display: flex;
   align-items: center;
 }
-
+.d-center {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
 .bg-color-blue {
   background-color: #1a5cd7;
 }

@@ -27,8 +27,8 @@
           </el-col>
           <!-- 操作按钮 -->
           <el-col :span="6" class="btnColRight">
-            <el-button @click="resetForm('ruleForm')">重置</el-button>
-            <el-button type="primary" @click="handleSubmit">查询结果</el-button>
+            <btn nativeType="cz" @click="resetForm('ruleForm')">重置</btn>
+            <btn nativeType="cx" @click="handleSubmit">查询</btn>
           </el-col>
         </el-row>
       </el-form>

@@ -59,9 +59,9 @@
           <!-- 按钮操作 -->
           <el-col :span="6" class="btnColRight">
             <el-form-item>
-              <el-button @click="resetForm('ruleForm')">重置</el-button>
-              <el-button type="primary" @click="handleSubmit">查询</el-button>
-              <el-button type="primary">入库</el-button>
+              <btn nativeType="cz" @click="resetForm('ruleForm')">重置</btn>
+              <btn nativeType="cx" click="handleSubmit">查询</btn>
+              <btn nativeType="sb">入库</btn>
             </el-form-item>
           </el-col>
         </el-row>

@@ -50,9 +50,9 @@
           </el-col>
           <!-- 操作按钮 -->
           <el-col :span="12" class="btnColRight">
-            <el-button @click="resetForm('ruleForm')">重置</el-button>
-            <el-button type="primary" @click="featchData">查询结果</el-button>
-            <el-button type="primary" @click="handleEscalation">上报</el-button>
+            <btn nativeType="cz" @click="resetForm('ruleForm')">重置</btn>
+            <btn nativeType="cx" @click="featchData">查询</btn>
+            <btn nativeType="sb" @click="handleEscalation">上报</btn>
           </el-col>
         </el-row>
       </el-form>