Merge branch 'master' of http://101.126.133.7:9001/Rmengdi/LQBZ_web into dev-rmd2

src/components/CardEcharts/index.scss

@@ -0,0 +1,69 @@
+.c-card {
+  margin: 0 10px;
+}
+.c-card-title {
+  height: 40px;
+  width: 100%;
+  position: relative;
+}
+.c-card-title-left {
+  height: 40px;
+  width: 250px;
+  position: absolute;
+  line-height: 40px;
+  color: #fff;
+  text-indent: 42px;
+  left: 0;
+  top: 0;
+  background: url('../../assets/images/title_left_02.png') no-repeat;
+  background-position: 0 0;
+  background-size: 100% 100%;
+}
+
+.c-card-title-right {
+  height: 40px;
+  width: 26px;
+  position: absolute;
+  right: 0;
+  top: 0;
+  background: url('../../assets/images/title_right_04.png') no-repeat;
+  background-position: 0 0;
+  background-size: 100% 100%;
+}
+
+.c-card-title-center {
+  height: 40px;
+  position: absolute;
+  left: 250px;
+  right: 26px;
+  top: 0;
+  background: url('../../assets/images/center_03.png') no-repeat;
+  background-position: 0 0;
+  background-size: 100% 100%;
+}
+.c-card-content {
+  width: 100%;
+  background: url('../../assets/images/card_bg_03.png') no-repeat;
+  background-position: 0 -5px;
+  background-size: 100% 100%;
+  &-echars {
+    height: calc((100vh - 142px - 90px) / 2);
+    position: relative;
+    .position-box {
+      color: #fff;
+      position: absolute;
+      top: 70%;
+      left: 65%;
+      font-size: 26px;
+    }
+  }
+  .ecEl {
+    canvas {
+      width: 100% !important;
+      height: 100% !important;
+    }
+  }
+  .el-col-8 {
+    height: 100%;
+  }
+}

src/components/CardEcharts/index.vue

@@ -0,0 +1,43 @@
+<template>
+  <div class="c-card">
+    <div class="c-card-title">
+      <el-tooltip class="item" effect="light" :content="tip" placement="top" v-if="tip">
+        <div class="c-card-title-left">{{ title || '' }}</div>
+      </el-tooltip>
+      <div class="c-card-title-left" v-else>{{ title || '' }}</div>
+      <div class="c-card-title-center"></div>
+      <div class="c-card-title-right"></div>
+    </div>
+    <div class="c-card-content">
+      <div class="c-card-content-echars-1 echart-box">
+        <slot name="content"></slot>
+        <!-- <template v-slot:content></template> -->
+        <!-- <div ref="ecEL2" class="ecEl"></div> -->
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'CardEcharts',
+  components: {},
+  props: {
+    title: {},
+    tip: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    // 这里存放数据
+    return {}
+  },
+  mounted() {},
+  methods: {}
+}
+</script>
+
+<style lang="scss">
+@import './index.scss';
+</style>

src/views/als/faultStatistics/echarts.vue

@@ -8,31 +8,31 @@
         </div>
         <div class="input-with-select">
           <span>地区</span>
-          <el-select v-model="select.groups" placeholder="请选择">
+          <el-select v-model="select.groups" placeholder="请选择" filterable clearable>
             <el-option v-for="item in groupsList" :key="item.groups" :label="item.groups" :value="item.groups"> </el-option>
           </el-select>
         </div>
         <div class="input-with-select">
           <span>专业</span>
-          <el-select v-model="select.major" placeholder="请选择">
+          <el-select v-model="select.major" placeholder="请选择" filterable clearable>
             <el-option v-for="item in majorList" :key="item.major" :label="item.major" :value="item.major"> </el-option>
           </el-select>
         </div>
         <div class="input-with-select">
           <span>机型</span>
-          <el-select v-model="select.aircraftModel" placeholder="请选择" @change="getFaultStatisticsListAll({ distinctField: 'aircraft_num' })">
+          <el-select v-model="select.aircraftModel" placeholder="请选择" @change="getFaultStatisticsListAll({ distinctField: 'aircraft_num' })" filterable clearable>
             <el-option v-for="item in aircraftModelList" :key="item.aircraftModel" :label="item.aircraftModel" :value="item.aircraftModel"> </el-option>
           </el-select>
         </div>
         <div class="input-with-select">
           <span>机号</span>
-          <el-select v-model="select.aircraftNum" placeholder="请选择">
+          <el-select v-model="select.aircraftNum" placeholder="请选择" filterable clearable>
             <el-option v-for="item in aircraftNumList" :key="item.aircraftNum" :label="item.aircraftNum" :value="item.aircraftNum"> </el-option>
           </el-select>
         </div>
         <div class="input-with-select">
           <span>部件</span>
-          <el-select v-model="select.faultyPartsName" placeholder="请选择">
+          <el-select v-model="select.faultyPartsName" placeholder="请选择" filterable clearable>
             <el-option v-for="item in faultyPartsNameList" :key="item.faultyPartsName" :label="item.faultyPartsName" :value="item.faultyPartsName"> </el-option>
           </el-select>
         </div>
@@ -42,18 +42,18 @@
     <div class="view-dataType-table">
       <el-row>
         <el-col :span="12">
-          <Card title="故障件数量统计图">
+          <CardEcharts title="故障件数量统计图">
             <template slot="content">
-              <div class="baseBar-box" ref="echartLeft"></div>
+              <div class="baseBar-box-1" ref="echartLeft"></div>
             </template>
-          </Card>
+          </CardEcharts>
         </el-col>
         <el-col :span="12">
-          <Card title="故障件数量统计图">
+          <CardEcharts title="故障件数量统计图">
             <template slot="content">
-              <div class="baseBar-box" ref="echartRight"></div>
+              <div class="baseBar-box-1" ref="echartRight"></div>
             </template>
-          </Card>
+          </CardEcharts>
         </el-col>
       </el-row>
     </div>
@@ -64,7 +64,10 @@
 import { getFaultStatisticsListAll, getAircaftTypeAndModelTree, removeFaultStatistics, getFaultStatisticsEcharts } from '@/api/als/faultStatistics'
 import { debounce } from '@/utils/index'
 import * as echarts from 'echarts'
+import CardEcharts from '@/components/CardEcharts/index.vue'
 export default {
+  name: 'FaultStatistics',
+  components: { CardEcharts },
   name: 'FaultStatisticsEcharts',
   data() {
     // 这里存放数据
@@ -92,8 +95,8 @@ export default {
       select: {
         startStatisticsDate: '',
         endStatisticsDate: '',
-        major: '特设',
-        aircraftModel: 'J-11'
+        major: '',
+        aircraftModel: ''
       },
       typeTree: {
         children: 'children',

src/views/als/faultStatistics/index.vue

@@ -23,31 +23,31 @@
             </div>
             <div class="input-with-select">
               <span>地区</span>
-              <el-select v-model="select.groups" placeholder="请选择">
+              <el-select v-model="select.groups" placeholder="请选择" filterable clearable>
                 <el-option v-for="item in groupsList" :key="item.groups" :label="item.groups" :value="item.groups"> </el-option>
               </el-select>
             </div>
             <div class="input-with-select">
               <span>专业</span>
-              <el-select v-model="select.major" placeholder="请选择">
+              <el-select v-model="select.major" placeholder="请选择" filterable clearable>
                 <el-option v-for="item in majorList" :key="item.major" :label="item.major" :value="item.major"> </el-option>
               </el-select>
             </div>
             <div class="input-with-select">
               <span>机型</span>
-              <el-select v-model="select.aircraftModel" placeholder="请选择" @change="getFaultStatisticsListAll({ distinctField: 'aircraft_num' })">
+              <el-select v-model="select.aircraftModel" placeholder="请选择" @change="getFaultStatisticsListAll({ distinctField: 'aircraft_num' })" filterable clearable>
                 <el-option v-for="item in aircraftModelList" :key="item.aircraftModel" :label="item.aircraftModel" :value="item.aircraftModel"> </el-option>
               </el-select>
             </div>
             <div class="input-with-select">
               <span>机号</span>
-              <el-select v-model="select.aircraftNum" placeholder="请选择">
+              <el-select v-model="select.aircraftNum" placeholder="请选择" filterable clearable>
                 <el-option v-for="item in aircraftNumList" :key="item.aircraftNum" :label="item.aircraftNum" :value="item.aircraftNum"> </el-option>
               </el-select>
             </div>
             <div class="input-with-select">
               <span>部件</span>
-              <el-select v-model="select.faultyPartsName" placeholder="请选择">
+              <el-select v-model="select.faultyPartsName" placeholder="请选择" filterable clearable>
                 <el-option v-for="item in faultyPartsNameList" :key="item.faultyPartsName" :label="item.faultyPartsName" :value="item.faultyPartsName"> </el-option>
               </el-select>
             </div>
@@ -409,8 +409,8 @@ export default {
       select: {
         startStatisticsDate: '',
         endStatisticsDate: '',
-        major: '特设',
-        aircraftModel: 'J-11'
+        major: '',
+        aircraftModel: ''
       },
       typeTree: {
         children: 'children',

src/views/als/index.scss

@@ -28,9 +28,9 @@
 .view-dataType-table {
   margin-top: 30px;
 }
-::-webkit-scrollbar{
-  display: none;
-}
+// ::-webkit-scrollbar{
+//   display: none;
+// }
 .view-carrierFlightMission-FlightMission-btn {
   display: flex;
   justify-content: space-between;
@@ -50,10 +50,11 @@
   }
 }
 
-.c-card-content-echars {
+.c-card-content-echars-1 {
   height: calc(100vh - 142px - 90px - 20px);
-  .baseBar-box {
+  .baseBar-box-1 {
     width: 100%;
     height: 100%;
   }
 }
+