|
@@ -1,103 +1,109 @@
|
|
<template>
|
|
<template>
|
|
<div class="view-home">
|
|
<div class="view-home">
|
|
- <el-row>
|
|
|
|
- <el-col :span="24" style="margin-bottom: 15px">
|
|
|
|
- <Card title="飞机状态" class="air">
|
|
|
|
- <template slot="content">
|
|
|
|
- <div class="airStatus">
|
|
|
|
- <div class="firstRow">
|
|
|
|
- <div v-for="item of airMap" :key="item.aircaftCatalogId" class="cell">
|
|
|
|
- <el-image style="width: 80px; height: 80px; margin-top: 10px" :src="imgUrl"></el-image>
|
|
|
|
- <el-popover popper-class="popper-class" placement="right-start" width="500" trigger="hover">
|
|
|
|
- <el-descriptions title="飞机信息">
|
|
|
|
- <el-descriptions-item label="故障日期">{{ item.statisticsDate }}</el-descriptions-item>
|
|
|
|
- <el-descriptions-item label="中队">{{ item.squadron }}</el-descriptions-item>
|
|
|
|
- <el-descriptions-item label="飞机号">{{ item.aircaftCatalogCode }}</el-descriptions-item>
|
|
|
|
- <el-descriptions-item label="故障件名称">{{ item.faultyPartsName }}</el-descriptions-item>
|
|
|
|
- <el-descriptions-item label="故障件型别">{{ item.faultyPartsModel }}</el-descriptions-item>
|
|
|
|
- <el-descriptions-item label="故障件号码">{{ item.faultyPartsNum }}</el-descriptions-item>
|
|
|
|
- </el-descriptions>
|
|
|
|
|
|
+ <el-tabs v-model="activeName" @tab-click="handleClickTab">
|
|
|
|
+ <el-tab-pane label="机务面板" name="1">
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col :span="24" style="margin-bottom: 15px">
|
|
|
|
+ <Card title="飞机状态" class="air">
|
|
|
|
+ <template slot="content">
|
|
|
|
+ <div class="airStatus">
|
|
|
|
+ <div class="firstRow">
|
|
|
|
+ <div v-for="item of airMap" :key="item.aircaftCatalogId" class="cell">
|
|
|
|
+ <el-image style="width: 80px; height: 80px; margin-top: 10px" :src="imgUrl"></el-image>
|
|
|
|
+ <div slot="reference" class="info">
|
|
|
|
+ <p>{{ item.aircaftCatalogCode }}</p>
|
|
|
|
+ <el-popover popper-class="popper-class" placement="right-start" width="500" trigger="hover">
|
|
|
|
+ <el-descriptions title="飞机信息">
|
|
|
|
+ <el-descriptions-item label="故障日期">{{ item.statisticsDate }}</el-descriptions-item>
|
|
|
|
+ <el-descriptions-item label="中队">{{ item.squadron }}</el-descriptions-item>
|
|
|
|
+ <el-descriptions-item label="飞机号">{{ item.aircaftCatalogCode }}</el-descriptions-item>
|
|
|
|
+ <el-descriptions-item label="故障件名称">{{ item.faultyPartsName }}</el-descriptions-item>
|
|
|
|
+ <el-descriptions-item label="故障件型别">{{ item.faultyPartsModel }}</el-descriptions-item>
|
|
|
|
+ <el-descriptions-item label="故障件号码">{{ item.faultyPartsNum }}</el-descriptions-item>
|
|
|
|
+ </el-descriptions>
|
|
|
|
|
|
- <div slot="reference" class="info">
|
|
|
|
- <p>{{ item.aircaftCatalogCode }}</p>
|
|
|
|
- <span :class="item.healthStatus == '故障' ? 'warning-state' : 'success-state'">{{ item.healthStatus }} </span>
|
|
|
|
|
|
+ <span slot="reference" :class="item.healthStatus == '故障' ? 'warning-state in_s' : 'success-state in_s'">{{ item.healthStatus }} </span>
|
|
|
|
+ </el-popover>
|
|
|
|
+ </div>
|
|
</div>
|
|
</div>
|
|
- </el-popover>
|
|
|
|
|
|
+ </div>
|
|
</div>
|
|
</div>
|
|
- </div>
|
|
|
|
- </div>
|
|
|
|
- </template>
|
|
|
|
- </Card>
|
|
|
|
- </el-col>
|
|
|
|
- </el-row>
|
|
|
|
- <el-row>
|
|
|
|
- <el-col :span="24" style="margin-bottom: 65px">
|
|
|
|
- <Card title="维修状态">
|
|
|
|
- <template slot="content">
|
|
|
|
- <LTable
|
|
|
|
- ref="maintainTable"
|
|
|
|
- :scroll="true"
|
|
|
|
- :defaultFetch="true"
|
|
|
|
- :columns="maintainColumns"
|
|
|
|
- :showColumnSetting="false"
|
|
|
|
- :dataSource="maintainTableData"
|
|
|
|
- :options="maintainOptions"
|
|
|
|
- :fetch="maintainFetchTableData"
|
|
|
|
- :pagination="tableRequset"
|
|
|
|
- class="tabl-box"
|
|
|
|
- />
|
|
|
|
- </template>
|
|
|
|
- </Card>
|
|
|
|
- </el-col>
|
|
|
|
- </el-row>
|
|
|
|
- <el-row>
|
|
|
|
- <el-col :span="12" style="margin-bottom: 15px">
|
|
|
|
- <Card title="历年任务">
|
|
|
|
- <template slot="content">
|
|
|
|
- <LTable ref="table" :defaultFetch="true" :showColumnSetting="false" :columns="columns" :dataSource="tableData" :options="options" :fetch="fetchTableData" class="tabl-box" />
|
|
|
|
- </template>
|
|
|
|
- </Card>
|
|
|
|
- </el-col>
|
|
|
|
- <el-col :span="12" style="margin-bottom: 15px">
|
|
|
|
- <Card title="指标分析">
|
|
|
|
- <template slot="content">
|
|
|
|
- <div class="baseBar-box" ref="echartTop"></div>
|
|
|
|
- </template>
|
|
|
|
- </Card>
|
|
|
|
- </el-col>
|
|
|
|
- </el-row>
|
|
|
|
- <el-row>
|
|
|
|
- <el-col :span="8">
|
|
|
|
- <Card title="经济指标分析-项">
|
|
|
|
- <template slot="content">
|
|
|
|
- <el-select v-model="model" style="margin: 10px" placeholder="请选择" @change="handleChange(1)">
|
|
|
|
- <el-option v-for="(item, index) in selectOptions" :key="index" :label="item.avmatCatalogName" :value="item.avmatCatalogCode"> </el-option>
|
|
|
|
- </el-select>
|
|
|
|
- <div class="baseBar-box" ref="echartBottomLeft"></div>
|
|
|
|
- </template>
|
|
|
|
- </Card>
|
|
|
|
- </el-col>
|
|
|
|
- <el-col :span="8">
|
|
|
|
- <Card title="经济指标分析-件">
|
|
|
|
- <template slot="content">
|
|
|
|
- <el-select v-model="model2" style="margin: 10px" placeholder="请选择" @change="handleChange(2)">
|
|
|
|
- <el-option v-for="(item, index) in selectOptions" :key="index" :label="item.avmatCatalogName" :value="item.avmatCatalogCode"> </el-option>
|
|
|
|
- </el-select>
|
|
|
|
- <div class="baseBar-box" ref="echartBottomCenter"></div>
|
|
|
|
- </template>
|
|
|
|
- </Card>
|
|
|
|
- </el-col>
|
|
|
|
- <el-col :span="8">
|
|
|
|
- <Card title="经济指标分析-金额">
|
|
|
|
- <template slot="content">
|
|
|
|
- <el-select v-model="model3" style="margin: 10px" placeholder="请选择" @change="handleChange(3)">
|
|
|
|
- <el-option v-for="(item, index) in selectOptions" :key="index" :label="item.avmatCatalogName" :value="item.avmatCatalogCode"> </el-option>
|
|
|
|
- </el-select>
|
|
|
|
- <div class="baseBar-box" ref="echartBottomRight"></div>
|
|
|
|
- </template>
|
|
|
|
- </Card>
|
|
|
|
- </el-col>
|
|
|
|
- </el-row>
|
|
|
|
|
|
+ </template>
|
|
|
|
+ </Card>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col :span="24" style="margin-bottom: 65px">
|
|
|
|
+ <Card title="维修状态">
|
|
|
|
+ <template slot="content">
|
|
|
|
+ <LTable
|
|
|
|
+ ref="maintainTable"
|
|
|
|
+ :scroll="true"
|
|
|
|
+ :defaultFetch="true"
|
|
|
|
+ :columns="maintainColumns"
|
|
|
|
+ :showColumnSetting="false"
|
|
|
|
+ :dataSource="maintainTableData"
|
|
|
|
+ :options="maintainOptions"
|
|
|
|
+ :fetch="maintainFetchTableData"
|
|
|
|
+ :pagination="tableRequset"
|
|
|
|
+ class="tabl-box"
|
|
|
|
+ />
|
|
|
|
+ </template>
|
|
|
|
+ </Card>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ </el-tab-pane>
|
|
|
|
+ <el-tab-pane label="航材面板" lazy="true" name="2">
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col :span="12" style="margin-bottom: 15px">
|
|
|
|
+ <Card title="历年任务">
|
|
|
|
+ <template slot="content">
|
|
|
|
+ <LTable ref="table" :defaultFetch="true" :showColumnSetting="false" :columns="columns" :dataSource="tableData" :options="options" :fetch="fetchTableData" class="tabl-box" />
|
|
|
|
+ </template>
|
|
|
|
+ </Card>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="12" style="margin-bottom: 15px">
|
|
|
|
+ <Card title="指标分析">
|
|
|
|
+ <template slot="content">
|
|
|
|
+ <div class="baseBar-box" ref="echartTop"></div>
|
|
|
|
+ </template>
|
|
|
|
+ </Card>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ <el-row>
|
|
|
|
+ <el-col :span="8">
|
|
|
|
+ <Card title="经济指标分析-项">
|
|
|
|
+ <template slot="content">
|
|
|
|
+ <el-select v-model="model" style="margin: 10px" placeholder="请选择" @change="handleChange(1)">
|
|
|
|
+ <el-option v-for="(item, index) in selectOptions" :key="index" :label="item.avmatCatalogName" :value="item.avmatCatalogCode"> </el-option>
|
|
|
|
+ </el-select>
|
|
|
|
+ <div class="baseBar-box" ref="echartBottomLeft"></div>
|
|
|
|
+ </template>
|
|
|
|
+ </Card>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="8">
|
|
|
|
+ <Card title="经济指标分析-件">
|
|
|
|
+ <template slot="content">
|
|
|
|
+ <el-select v-model="model2" style="margin: 10px" placeholder="请选择" @change="handleChange(2)">
|
|
|
|
+ <el-option v-for="(item, index) in selectOptions" :key="index" :label="item.avmatCatalogName" :value="item.avmatCatalogCode"> </el-option>
|
|
|
|
+ </el-select>
|
|
|
|
+ <div class="baseBar-box" ref="echartBottomCenter"></div>
|
|
|
|
+ </template>
|
|
|
|
+ </Card>
|
|
|
|
+ </el-col>
|
|
|
|
+ <el-col :span="8">
|
|
|
|
+ <Card title="经济指标分析-金额">
|
|
|
|
+ <template slot="content">
|
|
|
|
+ <el-select v-model="model3" style="margin: 10px" placeholder="请选择" @change="handleChange(3)">
|
|
|
|
+ <el-option v-for="(item, index) in selectOptions" :key="index" :label="item.avmatCatalogName" :value="item.avmatCatalogCode"> </el-option>
|
|
|
|
+ </el-select>
|
|
|
|
+ <div class="baseBar-box" ref="echartBottomRight"></div>
|
|
|
|
+ </template>
|
|
|
|
+ </Card>
|
|
|
|
+ </el-col>
|
|
|
|
+ </el-row>
|
|
|
|
+ </el-tab-pane>
|
|
|
|
+ </el-tabs>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
@@ -115,6 +121,7 @@ export default {
|
|
data() {
|
|
data() {
|
|
// 这里存放数据
|
|
// 这里存放数据
|
|
return {
|
|
return {
|
|
|
|
+ activeName: '1',
|
|
tableData: [],
|
|
tableData: [],
|
|
maintainTableData: [],
|
|
maintainTableData: [],
|
|
options,
|
|
options,
|
|
@@ -145,9 +152,12 @@ export default {
|
|
},
|
|
},
|
|
mounted() {
|
|
mounted() {
|
|
this.getTreeList()
|
|
this.getTreeList()
|
|
- this.initChart()
|
|
|
|
|
|
+ // this.initChart()
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
|
|
+ handleClickTab() {
|
|
|
|
+ // this.initChart()
|
|
|
|
+ },
|
|
initChart() {
|
|
initChart() {
|
|
this.fetchTermChart()
|
|
this.fetchTermChart()
|
|
this.fetchPieceChart()
|
|
this.fetchPieceChart()
|