组合图

wente

2024-04-30 225616b409fff50107ad7e9c790c96a65434e35d

 web/src/views/modules/taskReliability/ConfigNode/index.vue

@@ -3,31 +3,81 @@
  <el-card style="height: 100%">
    <el-tabs v-model="activeName" id="tabPane">
      <el-tab-pane label="属性"  name="first">
        <el-row :gutter="5" v-show="shape!=='custom-circle1'"  align="middle" style="margin-top:20px">
          <el-col :span=8 style="font-size: 16px;line-height: 32px">节点名称</el-col>
          <el-col :span=16 >
        <el-form :model="globalGridAttr">
          <el-form-item v-show="shape!=='custom-circle1'" label="节点名称" prop="nodeText" label-width="80px">
            <el-input  v-model="globalGridAttr.nodeText" style="width:100%" @change="onTextChange"></el-input>
          </el-col>
        </el-row>
        <el-row :gutter="5" v-show="nodeType=='node'" align="middle" style="margin-top:20px;">
          <el-col :span=8 style="font-size: 16px;line-height: 32px">连接关系</el-col>
          <el-col :span=16>
          </el-form-item>
          <el-form-item v-show="nodeType=='node'" label="连接关系" prop="nodeTypeExt" label-width="80px">
            <el-select style="width: 100%" v-model="globalGridAttr.nodeTypeExt" @change="onNodeTypeExtChange">
              <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value">
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-col>
        </el-row>
        <el-row :gutter="5" v-show="nodeType=='node' && showNumberInput" align="middle" style="margin-top:20px;">
          <el-col :span=8 style="font-size: 16px;line-height: 32px">数量</el-col>
          <el-col :span=16>
            <el-input type="number" v-model="globalGridAttr.numberInputValue" @change="onNumberInputValue"  placeholder="请输入数字"></el-input>
          </el-col>
        </el-row>
          </el-form-item>
          <el-form-item v-show="nodeType=='vote' || (nodeType=='node' && showNumberInput)" label="表决数量" prop="voteNum" label-width="80px">
            <el-input type="number" v-model="globalGridAttr.voteNum" @change="onNumberInputValue"  placeholder="请输入数字"></el-input>
          </el-form-item>
          <div v-show="globalGridAttr.productType!=='product_xdy'">
            <el-form-item v-show="nodeType=='node'" label="可靠性分布类型" prop="reliabDistribType" label-width="125px">
              <zt-dict style="width: 100%" v-model="globalGridAttr.reliabDistribType" @input="onReliabDistribType" dict="ReliabDistribType" placeholder="可靠性分布类型" clearable/>
            </el-form-item>
            <el-form-item v-show="nodeType=='node'" label="MTBCF" prop="taskMtbcf" label-width="80px">
              <el-input  v-model="globalGridAttr.taskMtbcf" @change="onTaskMtbcfChange"></el-input>
            </el-form-item>
            <el-form-item v-show="nodeType=='node'" label="参数2" prop="taskMtbcfOther" label-width="80px">
              <el-input  v-model="globalGridAttr.taskMtbcfOther" @change="onTaskMtbcfOtherChange"></el-input>
            </el-form-item>
            <el-form-item v-show="nodeType=='node'" label="是否可维修" prop="isRepair" label-width="100px">
              <el-select style="width: 100%" v-model="globalGridAttr.isRepair" @change="onIsRepairChange">
                <el-option
                    v-for="item in isRepair"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
            <div v-show="nodeType=='node' && showRepairInput">
              <el-form-item label="可维修性分布类型" prop="repairDistribType" label-width="140px">
                <zt-dict v-model="globalGridAttr.repairDistribType" dict="RepairDistribType" @input="onRepairDistribTypeChange" placeholder="维修性分布类型" clearable/>
              </el-form-item>
              <el-form-item label="MTTCR" prop="repairMttcr" label-width="80px">
                <el-input  v-model="globalGridAttr.repairMttcr" @change="onRepairMttcrChange"></el-input>
              </el-form-item>
              <el-form-item label="参数2" prop="repairMttcrOther" label-width="80px">
                <el-input  v-model="globalGridAttr.repairMttcrOther" @change="onRepairMttcrOtherChange"></el-input>
              </el-form-item>
            </div>
          </div>
        </el-form>
<!--        <el-row :gutter="5" v-show="shape!=='custom-circle1'"  align="middle" style="margin-top:20px">-->
<!--          <el-col :span=8 style="font-size: 16px;line-height: 32px">节点名称</el-col>-->
<!--          <el-col :span=16 >-->
<!--            <el-input  v-model="globalGridAttr.nodeText" style="width:100%" @change="onTextChange"></el-input>-->
<!--          </el-col>-->
<!--        </el-row>-->
<!--        <el-row :gutter="5" v-show="nodeType=='node'" align="middle" style="margin-top:20px;">-->
<!--          <el-col :span=8 style="font-size: 16px;line-height: 32px">连接关系</el-col>-->
<!--          <el-col :span=16>-->
<!--            <el-select style="width: 100%" v-model="globalGridAttr.nodeTypeExt" @change="onNodeTypeExtChange">-->
<!--              <el-option-->
<!--                v-for="item in options"-->
<!--                :key="item.value"-->
<!--                :label="item.label"-->
<!--                :value="item.value">-->
<!--              </el-option>-->
<!--            </el-select>-->
<!--          </el-col>-->
<!--        </el-row>-->
<!--        <el-row :gutter="5" v-show="nodeType=='node' && showNumberInput" align="middle" style="margin-top:20px;">-->
<!--          <el-col :span=8 style="font-size: 16px;line-height: 32px">表决数量</el-col>-->
<!--          <el-col :span=16>-->
<!--            <el-input type="number" v-model="globalGridAttr.voteNum" @change="onNumberInputValue"  placeholder="请输入数字"></el-input>-->
<!--          </el-col>-->
<!--        </el-row>-->
<!--        <el-row :gutter="5" v-show="nodeType=='node'" align="middle" style="margin-top:20px;">-->
<!--          <el-col :span=8 style="font-size: 16px;line-height: 32px">状态</el-col>-->
<!--          <el-col :span=16>-->
@@ -41,55 +91,57 @@
<!--            </el-select>-->
<!--          </el-col>-->
<!--        </el-row>-->
        <el-row :gutter="5" v-show="nodeType=='node'" align="middle" style="margin-top:20px;">
          <el-col :span=8 style="font-size: 16px;line-height: 32px">可靠性分布类型</el-col>
          <el-col :span=16>
            <zt-dict v-model="globalGridAttr.reliabDistribType" @input="onReliabDistribType" dict="ReliabDistribType" placeholder="可靠性分布类型" clearable/>
          </el-col>
        </el-row>
        <el-row :gutter="5" v-show="nodeType=='node'" align="middle" style="margin-top:20px;">
          <el-col :span=24>
            <el-input  type="number" v-model="globalGridAttr.taskMtbcf" @change="onTaskMtbcfChange"></el-input>
          </el-col>
        </el-row>
        <el-row :gutter="5" v-show="nodeType=='node'" align="middle" style="margin-top:20px;">
          <el-col :span=8 style="font-size: 16px;line-height: 32px">参数2</el-col>
          <el-col :span=16>
            <el-input  v-model="globalGridAttr.taskMtbcfOther" @change="onTaskMtbcfOtherChange"></el-input>
          </el-col>
        </el-row>
        <el-row :gutter="5" v-show="nodeType=='node'" align="middle" style="margin-top:20px;">
          <el-col :span=8 style="font-size: 16px;line-height: 32px">是否可维修</el-col>
          <el-col :span=16>
            <el-select style="width: 100%" v-model="globalGridAttr.isRepair" @change="onIsRepairChange">
              <el-option
                  v-for="item in isRepair"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
              </el-option>
            </el-select>
          </el-col>
        </el-row>
        <div v-show="nodeType=='node' && showRepairInput">
          <el-row :gutter="5"  align="middle" style="margin-top:20px;">
            <el-col :span=8 style="font-size: 16px;line-height: 32px">可维修性分布类型</el-col>
            <el-col :span=16>
              <zt-dict v-model="globalGridAttr.repairDistribType" dict="RepairDistribType" @input="onRepairDistribTypeChange" placeholder="维修性分布类型" clearable/>
            </el-col>
          </el-row>
          <el-row :gutter="5"  align="middle" style="margin-top:20px;">
            <el-col :span=24>
              <el-input  type="number" v-model="globalGridAttr.repairMttcr" @change="onRepairMttcrChange"></el-input>
            </el-col>
          </el-row>
          <el-row :gutter="5"  align="middle" style="margin-top:20px;">
            <el-col :span=8 style="font-size: 16px;line-height: 32px">参数2</el-col>
            <el-col :span=16>
              <el-input  v-model="globalGridAttr.repairMttcrOther" @change="onRepairMttcrOtherChange"></el-input>
            </el-col>
          </el-row>
        </div>
<!--        <el-row :gutter="5" v-show="nodeType=='node'" align="middle" style="margin-top:20px;">-->
<!--          <el-col :span=8 style="font-size: 16px;line-height: 32px">可靠性分布类型</el-col>-->
<!--          <el-col :span=16>-->
<!--            <zt-dict v-model="globalGridAttr.reliabDistribType" @input="onReliabDistribType" dict="ReliabDistribType" placeholder="可靠性分布类型" clearable/>-->
<!--          </el-col>-->
<!--        </el-row>-->
<!--        <el-row :gutter="5" v-show="nodeType=='node'" align="middle" style="margin-top:20px;">-->
<!--          <el-col :span=8 style="font-size: 16px;line-height: 32px">MTBCF</el-col>-->
<!--          <el-col :span=16>-->
<!--            <el-input  v-model="globalGridAttr.taskMtbcf" @change="onTaskMtbcfChange"></el-input>-->
<!--          </el-col>-->
<!--        </el-row>-->
<!--        <el-row :gutter="5" v-show="nodeType=='node'" align="middle" style="margin-top:20px;">-->
<!--          <el-col :span=8 style="font-size: 16px;line-height: 32px">参数2</el-col>-->
<!--          <el-col :span=16>-->
<!--            <el-input  v-model="globalGridAttr.taskMtbcfOther" @change="onTaskMtbcfOtherChange"></el-input>-->
<!--          </el-col>-->
<!--        </el-row>-->
<!--        <el-row :gutter="5" v-show="nodeType=='node'" align="middle" style="margin-top:20px;">-->
<!--          <el-col :span=8 style="font-size: 16px;line-height: 32px">是否可维修</el-col>-->
<!--          <el-col :span=16>-->
<!--            <el-select style="width: 100%" v-model="globalGridAttr.isRepair" @change="onIsRepairChange">-->
<!--              <el-option-->
<!--                  v-for="item in isRepair"-->
<!--                  :key="item.value"-->
<!--                  :label="item.label"-->
<!--                  :value="item.value">-->
<!--              </el-option>-->
<!--            </el-select>-->
<!--          </el-col>-->
<!--        </el-row>-->
<!--        <div v-show="nodeType=='node' && showRepairInput">-->
<!--          <el-row :gutter="5"  align="middle" style="margin-top:20px;">-->
<!--            <el-col :span=8 style="font-size: 16px;line-height: 32px">可维修性分布类型</el-col>-->
<!--            <el-col :span=16>-->
<!--              <zt-dict v-model="globalGridAttr.repairDistribType" dict="RepairDistribType" @input="onRepairDistribTypeChange" placeholder="维修性分布类型" clearable/>-->
<!--            </el-col>-->
<!--          </el-row>-->
<!--          <el-row :gutter="5"  align="middle" style="margin-top:20px;">-->
<!--            <el-col :span=8 style="font-size: 16px;line-height: 32px">MTTCR</el-col>-->
<!--            <el-col :span=16>-->
<!--              <el-input  v-model="globalGridAttr.repairMttcr" @change="onRepairMttcrChange"></el-input>-->
<!--            </el-col>-->
<!--          </el-row>-->
<!--          <el-row :gutter="5"  align="middle" style="margin-top:20px;">-->
<!--            <el-col :span=8 style="font-size: 16px;line-height: 32px">参数2</el-col>-->
<!--            <el-col :span=16>-->
<!--              <el-input  v-model="globalGridAttr.repairMttcrOther" @change="onRepairMttcrOtherChange"></el-input>-->
<!--            </el-col>-->
<!--          </el-row>-->
<!--        </div>-->
      </el-tab-pane>
      <el-tab-pane label="样式"  name="second">
        <el-row :gutter="5" align="middle" style="margin-top:20px">
@@ -247,11 +299,11 @@
    },
    // 表决数量
    onNumberInputValue(e){
      this.globalGridAttr.voteSum = e
      let voteSum={
        voteSum:this.globalGridAttr.voteSum
      this.globalGridAttr.voteNum = e
      let voteNum={
        voteNum:this.globalGridAttr.voteNum
      }
      this.curCel.setData(voteSum)
      this.curCel.setData(voteNum)
      this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
    },
    // 可靠性分布类型
@@ -265,21 +317,34 @@
    },
    // mtbf
    onTaskMtbcfChange(e){
      this.globalGridAttr.taskMtbcf =e
      let taskMtbcf={
        taskMtbcf:this.globalGridAttr.taskMtbcf
      const numberRegex = /^-?\d+(\.\d+)?$/
      if(numberRegex.test(e)){
          this.globalGridAttr.taskMtbcf =e
          let taskMtbcf={
              taskMtbcf:this.globalGridAttr.taskMtbcf
          }
          this.curCel.setData(taskMtbcf)
          this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
      }else {
        this.$message.error('输入格式有误，请输入实数')
      }
      this.curCel.setData(taskMtbcf)
      this.curCel = this.nodeOpt(this.id,this.globalGridAttr)

    },
    // 参数2
    onTaskMtbcfOtherChange(e){
      this.globalGridAttr.taskMtbcfOther = e
      let taskMtbcfOther={
        taskMtbcfOther:this.globalGridAttr.taskMtbcfOther
      const numberRegex = /^-?\d+(\.\d+)?$/
      console.log(e,'eeeee')
      if(numberRegex.test(e)){
        this.globalGridAttr.taskMtbcfOther = e
        let taskMtbcfOther={
          taskMtbcfOther:this.globalGridAttr.taskMtbcfOther
        }
        this.curCel.setData(taskMtbcfOther)
        this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
      }else {
        this.$message.error('输入格式有误，请输入实数')
      }
      this.curCel.setData(taskMtbcfOther)
      this.curCel = this.nodeOpt(this.id,this.globalGridAttr)

    },
    // 是否可维修
    onIsRepairChange(e){
@@ -302,21 +367,32 @@
    },
    // Mttcr
    onRepairMttcrChange(e){
      this.globalGridAttr.repairMttcr = e
      let repairMttcr={
        repairMttcr:this.globalGridAttr.repairMttcr
      const numberRegex = /^-?\d+(\.\d+)?$/
      if(numberRegex.test(e)){
        this.globalGridAttr.repairMttcr = e
        let repairMttcr={
          repairMttcr:this.globalGridAttr.repairMttcr
        }
        this.curCel.setData(repairMttcr)
        this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
      }else {
        this.$message.error('输入格式有误，请输入实数')
      }
      this.curCel.setData(repairMttcr)
      this.curCel = this.nodeOpt(this.id,this.globalGridAttr)

    },
    // 可维修性分布类型 参数2
    onRepairMttcrOtherChange(e){
      this.globalGridAttr.repairMttcrOther = e
      let repairMttcrOther={
        repairMttcrOther:this.globalGridAttr.repairMttcrOther
      const numberRegex = /^-?\d+(\.\d+)?$/
      if(numberRegex.test(e)) {
        this.globalGridAttr.repairMttcrOther = e
        let repairMttcrOther = {
          repairMttcrOther: this.globalGridAttr.repairMttcrOther
        }
        this.curCel.setData(repairMttcrOther)
        this.curCel = this.nodeOpt(this.id, this.globalGridAttr)
      }else {
        this.$message.error('输入格式有误，请输入实数')
      }
      this.curCel.setData(repairMttcrOther)
      this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
    },
    onStatusImgChange(e){
      this.globalGridAttr.statusImg = e
@@ -359,6 +435,7 @@
        if (!cell || !cell.isNode()) {
          return
        }
        this.showNumberInput = false
        this.curCel = cell
        globalGridAttr.nodeStroke = cell.attr('body/stroke')
        globalGridAttr.nodeStrokeWidth = cell.attr('body/strokeWidth')
@@ -385,6 +462,14 @@
        globalGridAttr.taskMtbcf = cell.getData().taskMtbcf
        globalGridAttr.taskMtbcfOther = cell.getData().taskMtbcfOther
        globalGridAttr.isRepair = cell.getData().isRepair
        globalGridAttr.voteNum = cell.getData().voteNum
        globalGridAttr.productType= cell.getData().productType
        // console.log(cell.getData().voteNum,'cell.getData().voteNum')
        if(this.nodeType==='vote' || this.globalGridAttr.nodeTypeExt === 'vote' || (cell.getData().voteNum!==undefined && cell.getData().voteNum!=='')){
          console.log(cell.getData().voteNum,'cell.getData().voteNum')
          this.showNumberInput = true
        }
        // console.log(this.showNumberInput,'this.showNumberInput')
        this.showRepairInput = cell.getData().isRepair
        cell.removeTools()
        cell.addTools([