|
@@ -0,0 +1,449 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-container>
|
|
|
+ <el-header>
|
|
|
+ <el-steps :active="parseInt(aircraft.state)" simple direction finish-status="wait" process-status="finish">
|
|
|
+ <el-step title="飞参数据"></el-step>
|
|
|
+ <el-step title="预处理"></el-step>
|
|
|
+ <el-step title="健康参数表征"></el-step>
|
|
|
+ <el-step title="综合健康状态"></el-step>
|
|
|
+ </el-steps>
|
|
|
+ </el-header>
|
|
|
+ <el-main>
|
|
|
+ <el-table v-loading="loading" :data="groupedData">
|
|
|
+ <el-table-column prop="label" label="数据" align="center">
|
|
|
+ <template slot-scope="scope">{{ scope.row.label }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="state" label="状态" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <dict-tag :options="getDictType(scope.row.label)" :value="scope.row.state"/>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="starttime" label="开始时间" align="center" width="180">
|
|
|
+ <template slot-scope="scope">{{ scope.row.starttime }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="endtime" label="结束时间" align="center" width="180">
|
|
|
+ <template slot-scope="scope">{{ scope.row.endtime }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="time" label="花费时间(s)" align="center" width="180">
|
|
|
+ <template slot-scope="scope">{{ scope.row.time }}</template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <!-- 可视化按钮 -->
|
|
|
+ <!-- <el-button v-if="scope.row.label === '飞参数据' && scope.row.state === '2'" type="primary" size="mini">可视化</el-button> -->
|
|
|
+ <el-button
|
|
|
+ v-show="scope.row.label === '飞参数据' && scope.row.state === '2'"
|
|
|
+ size="medium"
|
|
|
+ type="text"
|
|
|
+ icon="el-icon-monitor"
|
|
|
+ @click="viewResult(aircraftdetail.airparaPath)"
|
|
|
+ >可视化</el-button>
|
|
|
+ <el-button
|
|
|
+ v-show="scope.$index > 0 && scope.row.state != '2' && scope.row.state != '1'&& scope.row.label === '预处理数据' && groupedData[scope.$index - 1].state === '2' && groupedData[scope.$index - 1].label === '飞参数据'"
|
|
|
+ size="medium"
|
|
|
+ type="text"
|
|
|
+ icon="el-icon-video-play"
|
|
|
+ @click="handlerun"
|
|
|
+ >开始运行</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+</el-table>
|
|
|
+ </el-main>
|
|
|
+ </el-container>
|
|
|
+<el-dialog :title="DatavisTitle" :visible.sync="openDatavis" width="1200px">
|
|
|
+ <template #title>
|
|
|
+ <div class="dialog-title">
|
|
|
+ <div class="title-text">{{ DatavisTitle }}</div>
|
|
|
+ <div class="button-container">
|
|
|
+ <el-button
|
|
|
+ size="medium"
|
|
|
+ type="text"
|
|
|
+ icon="el-icon-view"
|
|
|
+ @click="selectcolumn"
|
|
|
+ >数据可视化选择</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <Datavis :filepath="filepath" :dataOption="dataOption" v-if="openDatavis"></Datavis>
|
|
|
+</el-dialog>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+<el-dialog :title="datacolumntitle" :visible.sync="opendatacolumn" width="600px" @open="onOpen" @close="onClose">
|
|
|
+ <el-row :gutter="15">
|
|
|
+ <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-row type="flex" justify="start" align="top">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="数据项" prop="">
|
|
|
+ <el-checkbox-group v-model="noOptions" size="medium">
|
|
|
+ <el-checkbox v-for="item in filterOption" :key="item.id" :label="item.id" :checked="item.checked" @change="checkedBoxChange">{{item.label}}</el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-row type="flex" justify="start" align="top">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="展示数据项" prop="">
|
|
|
+ <div>
|
|
|
+ <el-checkbox-group v-model="checkedOptions" size="medium">
|
|
|
+ <el-checkbox v-for="item in dataOption" :key="item.id" :label="item.id" :checked="item.checked" @change="checkedBoxChange">{{item.label}}</el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </div>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ </el-form>
|
|
|
+ </el-row>
|
|
|
+ <div slot="footer">
|
|
|
+ <el-button @click="close">取消</el-button>
|
|
|
+ <el-button type="primary" @click="handleConfirm">确定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+</div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { listManagement, getManagement, delManagement, addManagement, updateManagement,runairtopre } from "@/api/aircraft/management";
|
|
|
+
|
|
|
+import Datavis from "@/views/maintenance/offLineDataAnalysis/Datavis"
|
|
|
+import axios from "axios";
|
|
|
+export default {
|
|
|
+ name: "aircraftdetail",
|
|
|
+ dicts: ['preprocessdata', 'system_health_data', 'health_factors', 'aircraftparameter_upload'],
|
|
|
+ components: { Datavis },
|
|
|
+ props: {
|
|
|
+ aircraft: {
|
|
|
+ type: Object,
|
|
|
+ },
|
|
|
+ aircraftdetailOpen: {
|
|
|
+ type: Boolean,
|
|
|
+ },
|
|
|
+ },
|
|
|
+
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ data: [], // 初始化为空数组
|
|
|
+ // 遮罩层
|
|
|
+ loading: true,
|
|
|
+ // 选中数组
|
|
|
+ ids: [],
|
|
|
+ // 非单个禁用
|
|
|
+ single: true,
|
|
|
+ // 非多个禁用
|
|
|
+ multiple: true,
|
|
|
+ // 显示搜索条件
|
|
|
+ showSearch: true,
|
|
|
+ // 总条数
|
|
|
+ total: 0,
|
|
|
+ // 知识抽取子任务表格数据
|
|
|
+ aircraftdetailList: [],
|
|
|
+ // 弹出层标题
|
|
|
+ title: "",
|
|
|
+ // 是否显示弹出层
|
|
|
+ open: false,
|
|
|
+ // 步骤
|
|
|
+ setp: 1,
|
|
|
+ // 查询参数
|
|
|
+ queryParams: {
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ aircraftId: this.aircraft.id,
|
|
|
+ },
|
|
|
+ // 表单参数
|
|
|
+ form: {},
|
|
|
+ // 表单校验
|
|
|
+ rules: {
|
|
|
+ },
|
|
|
+ checked:true,
|
|
|
+ aircraftdetail: {},
|
|
|
+ openDatavis: false,
|
|
|
+ DatavisTitle: "",
|
|
|
+ aircraftdataview:{},
|
|
|
+ filepath:null,
|
|
|
+ opendatacolumn:false,
|
|
|
+ datacolumntitle:"",
|
|
|
+ chartData:[],
|
|
|
+ dataOption: [],
|
|
|
+ allOption:[],
|
|
|
+ filteroption:[],
|
|
|
+ selectedItems: [],
|
|
|
+ isViewResultClicked: false,
|
|
|
+ checkedOptions: [],
|
|
|
+ noOptions:[],
|
|
|
+ noOption:[],
|
|
|
+ flag:1,
|
|
|
+ checkOption:[]
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.getListByaircraftId();
|
|
|
+
|
|
|
+ },
|
|
|
+
|
|
|
+ computed: {
|
|
|
+ groupedData() {
|
|
|
+ const data1 = {
|
|
|
+ label: "飞参数据",
|
|
|
+ state: this.aircraftdetail.airparaState,
|
|
|
+ starttime: this.aircraftdetail.airparaStarttime,
|
|
|
+ endtime: this.aircraftdetail.airparaEndtime,
|
|
|
+ time: this.aircraftdetail.airparaTime,
|
|
|
+ };
|
|
|
+
|
|
|
+ const data2 = {
|
|
|
+ label: "预处理数据",
|
|
|
+ state: this.aircraftdetail.pretreatmentState,
|
|
|
+ starttime: this.aircraftdetail.pretreatmentStarttime,
|
|
|
+ endtime: this.aircraftdetail.pretreatmentEndtime,
|
|
|
+ time: this.aircraftdetail.pretreatmentTime,
|
|
|
+ };
|
|
|
+
|
|
|
+ const data3 = {
|
|
|
+ label: "健康因子",
|
|
|
+ state: this.aircraftdetail.healthfactorsState,
|
|
|
+ starttime: this.aircraftdetail.healthfactorsStarttime,
|
|
|
+ endtime: this.aircraftdetail.healthfactorsEndtime,
|
|
|
+ time: this.aircraftdetail.healthfactorsTime,
|
|
|
+ };
|
|
|
+
|
|
|
+ const data4 = {
|
|
|
+ label: "系统级健康数据",
|
|
|
+ state: this.aircraftdetail.systemhealthState,
|
|
|
+ starttime: this.aircraftdetail.systemhealthStarttime,
|
|
|
+ endtime: this.aircraftdetail.systemhealthEndtime,
|
|
|
+ time: this.aircraftdetail.systemhealthTime,
|
|
|
+ };
|
|
|
+
|
|
|
+ return [data1, data2, data3, data4];
|
|
|
+ },
|
|
|
+
|
|
|
+},
|
|
|
+ methods: {
|
|
|
+ getDictType(label) {
|
|
|
+ if (label === '飞参数据') {
|
|
|
+ return this.dict.type.aircraftparameter_upload;
|
|
|
+ } else if (label === '预处理数据') {
|
|
|
+ return this.dict.type.preprocessdata;
|
|
|
+ } else if(label =='健康因子'){
|
|
|
+ return this.dict.type.health_factors;
|
|
|
+ }else if(label =='系统级健康数据'){
|
|
|
+ return this.dict.type.system_health_data;
|
|
|
+ }else{
|
|
|
+ return [];
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+
|
|
|
+ /** 查询指定id的飞机参数 */
|
|
|
+ getListByaircraftId() {
|
|
|
+ this.loading = true;
|
|
|
+ getManagement(this.queryParams.aircraftId).then(response => {
|
|
|
+ this.aircraftdetail = response.data;
|
|
|
+ this.loading = false;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 取消按钮
|
|
|
+ cancel() {
|
|
|
+ this.open = false;
|
|
|
+ this.reset();
|
|
|
+ },
|
|
|
+ handlerun(){
|
|
|
+ const startTime = this.formatDate(new Date());
|
|
|
+ this.aircraftdetail.pretreatmentStarttime = startTime;
|
|
|
+ this.aircraftdetail.state ='1';
|
|
|
+ this.aircraftdetail.pretreatmentState = '1';
|
|
|
+ runairtopre(this.aircraftdetail).then(response => {
|
|
|
+ this.getListByaircraftId()
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 表单重置
|
|
|
+ reset() {
|
|
|
+ this.form = {
|
|
|
+ id: null,
|
|
|
+ taskId: null,
|
|
|
+ type: null,
|
|
|
+ status: "0",
|
|
|
+ log: null,
|
|
|
+ completedDate: null,
|
|
|
+ costTime: null,
|
|
|
+ };
|
|
|
+ this.resetForm("form");
|
|
|
+ },
|
|
|
+ /** 搜索按钮操作 */
|
|
|
+ handleQuery() {
|
|
|
+ this.queryParams.pageNum = 1;
|
|
|
+ this.getList();
|
|
|
+ },
|
|
|
+ /** 重置按钮操作 */
|
|
|
+ resetQuery() {
|
|
|
+ this.resetForm("queryForm");
|
|
|
+ this.handleQuery();
|
|
|
+ },
|
|
|
+ // 多选框选中数据
|
|
|
+ // handleSelectionChange(selection) {
|
|
|
+ // this.ids = selection.map(item => item.id)
|
|
|
+ // this.single = selection.length!==1
|
|
|
+ // this.multiple = !selection.length
|
|
|
+ // },
|
|
|
+ /** 新增按钮操作 */
|
|
|
+ handleAdd() {
|
|
|
+ this.reset();
|
|
|
+ this.open = true;
|
|
|
+ this.title = "添加知识抽取子任务";
|
|
|
+ },
|
|
|
+ /** 修改按钮操作 */
|
|
|
+ handleUpdate(row) {
|
|
|
+ this.reset();
|
|
|
+ const id = row.id || this.ids
|
|
|
+ getSubTask(id).then(response => {
|
|
|
+ this.form = response.data;
|
|
|
+ this.open = true;
|
|
|
+ this.title = "修改知识抽取子任务";
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 提交按钮 */
|
|
|
+ submitForm() {
|
|
|
+ this.$refs["form"].validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ if (this.form.id != null) {
|
|
|
+ updateSubTask(this.form).then(response => {
|
|
|
+ this.$modal.msgSuccess("修改成功");
|
|
|
+ this.open = false;
|
|
|
+ this.getList();
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ addSubTask(this.form).then(response => {
|
|
|
+ this.$modal.msgSuccess("新增成功");
|
|
|
+ this.open = false;
|
|
|
+ this.getList();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ closeaircraftdetail() {
|
|
|
+ this.aircraftdetailOpen = false;
|
|
|
+ },
|
|
|
+ async getresponse(filepath){
|
|
|
+ const response = await axios.get(process.env.VUE_APP_BASE_API + filepath, { responseType: 'text' });
|
|
|
+ const csvData = response.data;
|
|
|
+ const rows = csvData.split('\n');
|
|
|
+ this.chartData = rows.map(row => row.split(','));
|
|
|
+ const firstRow = this.chartData[0]; // 获取第一行数据
|
|
|
+ this.allOption = firstRow.map((label, id) => ({ id, label })); // 将第一行数据转换为allOption格式
|
|
|
+ this.dataOption = this.allOption
|
|
|
+ // 设置默认选中状态
|
|
|
+ this.filterOption = this.allOption.filter(option => option.id === this.dataOption.id);
|
|
|
+ this.dataOption = this.allOption.map(option => ({ ...option, checked: true }));
|
|
|
+ this.filterOption = this.filteroption.map(option => ({ ...option, checked: false }));
|
|
|
+
|
|
|
+ },
|
|
|
+ viewResult(filepath){
|
|
|
+ this.DatavisTitle = this.aircraftdetail.id + "---飞参数据可视化"
|
|
|
+ this.filepath = filepath
|
|
|
+ this.getresponse(filepath)
|
|
|
+
|
|
|
+ this.openDatavis = true
|
|
|
+ },
|
|
|
+ selectcolumn(){
|
|
|
+ this.datacolumntitle = "数据可视化选择"
|
|
|
+ this.opendatacolumn = true;
|
|
|
+ },
|
|
|
+ cancel() {
|
|
|
+ this.opendatacolumn = false;
|
|
|
+ },
|
|
|
+ formatDate(date) {
|
|
|
+ const year = date.getFullYear();
|
|
|
+ const month = String(date.getMonth() + 1).padStart(2, '0');
|
|
|
+ const day = String(date.getDate()).padStart(2, '0');
|
|
|
+ const hours = String(date.getHours()).padStart(2, '0');
|
|
|
+ const minutes = String(date.getMinutes()).padStart(2, '0');
|
|
|
+ const seconds = String(date.getSeconds()).padStart(2, '0');
|
|
|
+ return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
|
|
|
+ },
|
|
|
+
|
|
|
+ onOpen() {
|
|
|
+ this.opendatacolumn = true;
|
|
|
+ },
|
|
|
+ onClose() {
|
|
|
+ this.opendatacolumn = false;
|
|
|
+ },
|
|
|
+ close() {
|
|
|
+ this.opendatacolumn = false;
|
|
|
+ },
|
|
|
+ handleConfirm() {
|
|
|
+ this.checkOption=[]
|
|
|
+ this.noOption = []
|
|
|
+ this.allOption = this.allOption.map(option => ({ ...option, checked: true }));
|
|
|
+ this.checkOption = this.allOption.map(option => ({ ...option, checked: true }));
|
|
|
+ this.noOption = this.allOption.map(option => ({ ...option, checked: true }));
|
|
|
+
|
|
|
+ this.checkOption = this.allOption.filter(option => this.checkedOptions.includes(option.id));
|
|
|
+ this.noOption = this.allOption.filter(option => this.noOptions.includes(option.id))
|
|
|
+ this.dataOption=[]
|
|
|
+ // 将checkOption数组中的元素合并到dataOption数组中
|
|
|
+ this.dataOption.push(...this.checkOption);
|
|
|
+
|
|
|
+ // 将noOption数组中的元素合并到dataOption数组中
|
|
|
+ this.dataOption.push(...this.noOption);
|
|
|
+ // console.log(this.checkOption)
|
|
|
+ // console.log(this.noOption)
|
|
|
+ // console.log(this.dataOption)
|
|
|
+ this.filterOption = [];
|
|
|
+ this.filterOption = [...this.allOption];
|
|
|
+ this.filterOption = this.filterOption.filter(option => !this.dataOption.includes(option));
|
|
|
+ this.filterOption = this.filterOption.map(option => ({ ...option, checked: false }));
|
|
|
+ this.opendatacolumn = false;
|
|
|
+
|
|
|
+ },
|
|
|
+ checkedBoxChange(){
|
|
|
+ this.$forceUpdate(); //强制渲染多选框样式,否则值变了样式没有选中
|
|
|
+},
|
|
|
+
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style scoped>
|
|
|
+.el-dialog__body {
|
|
|
+ padding: 0px
|
|
|
+}
|
|
|
+.custom-icon-button ::v-deep .el-icon-caret-left {
|
|
|
+ font-size: 2em; /* 将图标字体大小增加一倍 */
|
|
|
+}
|
|
|
+.dialog-title {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+}
|
|
|
+
|
|
|
+.title-text {
|
|
|
+ flex: 1;
|
|
|
+}
|
|
|
+
|
|
|
+.button-container {
|
|
|
+ margin-right: 28px; /* 调整按钮与标题之间的间距 */
|
|
|
+}
|
|
|
+
|
|
|
+.dialog-content {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
+
|
|
|
+.top-block {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 10px;
|
|
|
+}
|
|
|
+
|
|
|
+.border-block {
|
|
|
+ border: 1px solid #ccc;
|
|
|
+ flex-grow: 1;
|
|
|
+
|
|
|
+ margin: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+</style>
|