修改

jinlin

2025-02-18 6250f74b2a02770a37f2f0144c762f7952a12bd6

 web/src/views/modules/taskReliability/SchemeCompar.vue

@@ -1,78 +1,121 @@
<template>
  <div class="fa-card-a">
    <el-row :gutter="5">
      <div class="mod-taskReliability-simulatAssess">
        <el-form :inline="true" :model="dataForm" ref="dataForm" :disabled="dataForm.disabled">
          <zt-form-item label="产品节点" prop="productId" width="100px">
            <zt-select v-model="dataForm.productId" :datas="productList" @change="onProductSelected"/>
          </zt-form-item>
          <zt-form-item label="可靠性方案" prop="taskModelId" width="500px">
            <zt-select style="width: 400px" v-model="dataForm.taskModelId" :datas="schemeList"
                       @change="onTaskSelected" :multiple="true"/>
          </zt-form-item>
          <zt-form-item>
            <zt-button @click="compair()">方案对比</zt-button>
          </zt-form-item>
        </el-form>
        <div>
          <el-col :span="4">
            <div style="margin-right: 5px;height: calc(88vh - 100px)" v-if="isSelect">
              <product-model-tree @on-selected="onTreeSelected" showXdy="false"
                                  ref="ProductModelTree" :isShow="false" basic="4" :productId="dataForm.productId"/>
            </div>
          </el-col>
          <el-col :span="20">
            <div style="margin-top: 20px;position: relative;height: 600px">
              <div v-if="isShow">
                <el-button v-if="isZk" type="info" size="small" icon="el-icon-caret-bottom"
                           style="position: absolute;right: 10%;top: 10%;z-index: 1" @click="zk()"></el-button>
                <el-button v-if="!isZk" type="info" size="small" icon="el-icon-caret-right"
                           style="position: absolute;right: 10%;top: 10%;z-index: 1" @click="zk()"></el-button>
                <div v-if="isZk" style="position: absolute;right: 10%;top: 15%">
                  <el-table :data="tableData" border style="width: 500px">
                    <el-table-column
                      prop="name"
                      label="方案名称"
                    >
                    </el-table-column>
                    <el-table-column
                      prop="mtbf"
                      label="MTBF"
                      width="100px"
                      align="right">
                      <template slot-scope="scope">
                        <span>{{  keepNumber(scope.row.mtbf) }}</span>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="mttr"
                      label="MTTR"
                      width="100px"
                      align="right">
                      <template slot-scope="scope">
                        <span>{{  keepNumber(scope.row.mttr) }}</span>
                      </template>
                    </el-table-column>
                    <el-table-column
                      prop="msr"
                      label="MSR"
                      width="100px"
                      align="right">
                      <template slot-scope="scope">
                        <span>{{  keepNumber(scope.row.mttr) }}</span>
                      </template>
                    </el-table-column>
                  </el-table>
                </div>
              </div>
              <div :disabled="isShow">
                <div class="echart" id="myChart" :style="myChartStyle"></div>
              </div>
            </div>
          </el-col>
      <el-form :inline="true" :model="dataForm" ref="dataForm" :disabled="dataForm.disabled">
        <zt-form-item label="产品节点" prop="productId" width="100px">
          <zt-select v-model="dataForm.productId" :datas="productList" @change="onProductSelected"/>
        </zt-form-item>
        <zt-form-item label="可靠性方案" prop="taskModelId" width="500px">
          <zt-select style="width: 400px" v-model="dataForm.taskModelId" :datas="schemeList"
                     @change="onTaskSelected" :multiple="true"/>
        </zt-form-item>
        <zt-form-item label="时间分片" prop="samplPeriod">
          <el-input type="number" :min="1" v-model="dataForm.samplPeriod" style="width: 150px;vertical-align: baseline;">
            <template slot="append">分钟</template>
          </el-input>
        </zt-form-item>
        <zt-form-item label="仿真次数" prop="simulatFrequency">
          <el-input type="number" :min="1" v-model="dataForm.simulatFrequency" style="width: 150px;vertical-align: baseline;">
            <template slot="append">次数</template>
          </el-input>
        </zt-form-item>
        <zt-form-item>
          <zt-button @click="compair()">方案对比</zt-button>
        </zt-form-item>
      </el-form>
      <el-progress v-if="isShow" :percentage="percentage"></el-progress>
      <el-col :span="4">
        <div style="margin-right: 5px;height: calc(100vh - 230px)" v-if="isSelect">
          <product-model-tree @on-selected="onTreeSelected" showXdy="false"
                              ref="ProductModelTree" :isShow="false" basic="4" :productId="dataForm.productId"/>
        </div>
      </div>
      </el-col>
      <el-col :span="20">
        <div class="fa-card-a" style="position: relative;height: calc(100vh - 230px)">
          <div v-if="Show">
            <el-button v-if="isZk" type="info" size="small" icon="el-icon-caret-bottom"
                       style="position: absolute;right: 0;top: 0;z-index: 1" @click="zk()"></el-button>
            <el-button v-if="!isZk" type="info" size="small" icon="el-icon-caret-right"
                       style="position: absolute;right: 0;top: 0;z-index: 1" @click="zk()"></el-button>
            <div v-if="isZk" style="position: absolute;right: 0;top: 5%">
              <el-table :data="tableData" border style="width: 500px">
                <el-table-column
                  prop="name"
                  label="方案名称"
                >
                </el-table-column>
                <el-table-column
                  prop="mtbf"
                  label="MTTF"
                  width="100px"
                  align="right">
                  <template slot-scope="scope">
                    <span>{{  keepNumberBy2(scope.row.mtbf) }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="mttr"
                  label="MTTR"
                  width="100px"
                  align="right">
                  <template slot-scope="scope">
                    <span>{{  keepNumberBy2(scope.row.mttr) }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="msr"
                  label="MSR"
                  width="100px"
                  align="right">
                  <template slot-scope="scope">
                    <span>{{  keepNumberBy4(scope.row.msr) }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="mttfMle"
                  label="节点寿命"
                  width="100px"
                  align="right">
                  <template slot-scope="scope">
                    <span>{{  keepNumberBy4(scope.row.mttfMle) }}</span>
                  </template>
                </el-table-column>
                <el-table-column
                  prop="mttrMle"
                  label="平均维修时间"
                  width="100px"
                  align="right">
                  <template slot-scope="scope">
                    <span>{{  keepNumberBy4(scope.row.mttrMle) }}</span>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </div>
          <div :disabled="isShow">
            <div class="echart" id="SchemeCompar" :style="myChartStyle"></div>
          </div>
        </div>
      </el-col>
    </el-row>
    <el-dialog v-dialogDrag :close-on-click-modal="false" top="8vh" :visible.sync="dialogVisible" title="模型检查"
               width="60%" @close="dialogVisible = false">
      <el-tag type="danger" style="margin-bottom: 10px">模型定义/参数配置里存在以下问题：</el-tag>
      <el-table :data="modelCheckResult" height="350"
                :header-cell-style="{'text-align':'center'}">
        <el-table-column prop="category" label="检查结果" align="center" width="150"/>
        <el-table-column prop="taskName" label="任务名称" align="center"/>
        <el-table-column prop="taskPhaseName" label="任务阶段名称" align="center"/>
        <el-table-column prop="gkName" label="工况名称" align="center"/>
        <el-table-column prop="nodeName" label="节点名称" align="center"/>
        <el-table-column prop="modelName" label="模型名称" align="center"/>
        <el-table-column prop="deviceName" label="设备名称" align="center"/>
        <el-table-column prop="paramName" label="参数名称" align="center"/>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="dialogVisible = false">关 闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>

@@ -87,6 +130,7 @@
        myChartStyle: {float: "left", width: "100%", height: "600px"}, //图表样式
        isSelect: false,
        isShow: false,
        Show: false,
        isZk: true,
        productList: [],
        schemeList: [],
@@ -96,20 +140,32 @@
          productId: '',
          showProductId: '',
          dataType: 'fz',
          samplPeriod: '10',
          simulatFrequency: 500,
        },
        percentage: 2,
        xDataList: [],
        seriesList: [],
        tableData: [],
        taskList: [],
        fzIdList: [],
        dialogVisible: false,
        modelCheckResult: [],
      }
    },
    mounted() {
      this.getProductList()
    },
    computed: {
      keepNumber() { //过滤器保留4为小数
      keepNumberBy4() { //过滤器保留4为小数
        return function (val) {      // 对计算属性进行传参
          const numM = Number(val).toFixed(5);
          return numM.substring(0, numM.length - 1);
        }
      },
      keepNumberBy2() { //过滤器保留4为小数
        return function (val) {      // 对计算属性进行传参
          const numM = Number(val).toFixed(3);
          return numM.substring(0, numM.length - 1);
        }
      },
@@ -117,23 +173,22 @@
    components: {
      ProductModelTree,
    },

    watch: {
      // percentage() {
      //   if (this.percentage === 100) {
      //     this.getEcharts();
      //   }
      // }
    },
    methods: {
      async onTreeSelected(data) {
        if (this.dataForm.taskModelId) {
      onTreeSelected(data) {
        if (this.dataForm.taskModelId.length > 0) {
          console.log(this.dataForm.taskModelId)
          console.log(data, 'onProductSelected')
          this.dataForm.showProductId = data.id
          let params = {
            taskList: this.dataForm.taskModelId,
            showProductId: this.dataForm.showProductId
          }
          console.log(this.dataForm.taskModelId, 'this.dataForm.taskModelId')
          let res = await this.$http.get('/taskReliability/SimulatAssess/SchemeCompar', {params: params})
          console.log(res.data, "res")
          this.xDataList = res.data.xdataList
          this.seriesList = res.data.curveList
          this.tableData = res.data.dataList

          this.$nextTick(() => {
            this.getEcharts()
          })
        }
      },
      // 获取信息
@@ -168,24 +223,73 @@
        console.log(res.data)
        this.schemeList = res.data
      },
      async getStroke() {
        let param = {
          taskList: this.fzIdList
        }
        let res = await this.$http.get(`/taskReliability/SimulatAssess/getCalcProgress`, {params: param})
        if (res.success) {
          if (res.data) {
            this.percentage = parseFloat(res.data)
            if (this.percentage >= 100) {
              clearInterval(this.timers)
              this.percentage = 0
              await this.getEcharts();
            }
          }
        } else {
          clearInterval(this.timers)
          this.percentage = 0
        }
      },
      async compair() {
        this.isShow = true
        this.dialogVisible = false
        this.modelCheckResult = []
        let params = {
          taskList: this.dataForm.taskModelId,
          showProductId: null
          showProductId: this.dataForm.productId,
          samplPeriod: this.dataForm.samplPeriod,
          simulatFrequency: this.dataForm.simulatFrequency
        }
        console.log(this.dataForm.taskModelId, 'this.dataForm.taskModelId')
        this.percentage = 0
        let res = await this.$http.get('/taskReliability/SimulatAssess/SchemeCompar', {params: params})
        console.log(res.data, "res")
        if (res.success) {
          if (res.data.type=="errorList") {
            this.modelCheckResult = res.data.errList
            this.dialogVisible = true
            this.isShow = false
          } else {
            this.fzIdList = res.data.idList
            this.timers = window.setInterval(this.getStroke, 1000)
          }
        }
      },
      async getEcharts() {
        let params = {
          taskList: this.dataForm.taskModelId,
          showProductId: this.dataForm.showProductId
        }
        let res = await this.$http.get('/taskReliability/SimulatAssess/getEcharts', {params: params})
        console.log(res.data, "res")
        this.xDataList = res.data.xdataList
        this.seriesList = res.data.curveList
        this.tableData = res.data.dataList


        this.isShow = true
        this.Show = true
        this.option = {
          xAxis: {
            data: this.xDataList,
            name: '仿真总时长'
            name: '仿真总时长',
            type: 'category',
            axisLabel: {
              formatter: function (value) {
                // 将 X 轴刻度值格式化为保留两位小数的字符串
                return parseFloat(value).toFixed(2);
              }
            }
          },
          yAxis: {
            type: 'value',
@@ -196,7 +300,7 @@
          },
          series: this.seriesList
        };
        this.myChart = echart.init(document.getElementById("myChart"));
        this.myChart = echart.init(document.getElementById("SchemeCompar"));
        console.log(this.option, ' this.option ')
        this.myChart.setOption(this.option);
        //随着屏幕大小调节图表