新增弹出对话框代码:

    <!-- 添加或修改线路起讫里程对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">

        <el-form-item label="线名" prop="line">
              <!--线路下拉选择框-->
              <el-select  v-model="form.line" placeholder="请选择线名" style="width:100%">
              <el-option
                v-for="em in dict.type.sys_line_no"
                :key="em.value"
                :label="em.label"
                :value="em.value"
              />
              </el-select>
            </el-form-item>

        <el-form-item label="行别" prop="xb">
                <!--行别下拉选择框-->
                <el-select v-model="form.xb" placeholder="请选择行别" style="width:100%" clearable>
                  <el-option
                    v-for="em in dict.type.sys_line_xb"
                    :key="em.value"
                    :label="em.label"
                    :value="em.value"
                  />
                </el-select>
              </el-form-item>



        <el-form-item label="起点站名" prop="startStation">
          <el-input v-model="form.startStation" placeholder="请输入起点站名" />
        </el-form-item>
        <el-form-item label="起点位置" prop="startAddr">
          <el-input v-model="form.startAddr" placeholder="请输入起点位置" />
        </el-form-item>

        <el-form-item label="起点公里" prop="startMileageKm">
          <el-input v-model="form.startMileageKm" placeholder="请输入起点公里" />
        </el-form-item>
        <el-form-item label="起点米" prop="startMileageM">
          <el-input v-model="form.startMileageM" placeholder="请输入起点米" />
        </el-form-item>
        <el-form-item label="起点里程">
          <el-input v-model="startMileage" disabled="" placeholder="起点里程" />
        </el-form-item>

        <el-form-item label="终点站名" prop="endStation">
          <el-input v-model="form.endStation" placeholder="请输入终点站名" />
        </el-form-item>
        <el-form-item label="终点位置" prop="endAddr">
          <el-input v-model="form.endAddr" placeholder="请输入终点位置" />
        </el-form-item>
        <el-form-item label="终点公里" prop="endMileageKm">
          <el-input v-model="form.endMileageKm" placeholder="请输入终点公里" />
        </el-form-item>
        <el-form-item label="终点米" prop="endMileageM">
          <el-input v-model="form.endMileageM" placeholder="请输入终点米" />
        </el-form-item>
        <el-form-item label="终点里程" prop="endMileage">
          <el-input v-model="endMileage" disabled="" placeholder="终点里程" />
        </el-form-item>

        <el-form-item label="计算长度（km）" prop="computeLen">
          <el-input v-model="computeLen" disabled="" placeholder="系统自动计算得长度" />
        </el-form-item>
        <el-form-item label="实际长度（km）" prop="realLen">
          <el-input v-model="form.realLen" placeholder="请输入实际长度" />
        </el-form-item>
        <el-form-item label="附注" prop="note">
          <el-input v-model="form.note" placeholder="请输入附注" />
        </el-form-item>
        <el-form-item label="修改附注" prop="modifyNote">
          <el-input v-model="form.modifyNote" placeholder="请输入修改附注" />
        </el-form-item>
        
        <!-- <el-form-item label="显示排序" prop="orderNum">
          <el-input-number v-model="form.orderNum" controls-position="right" :min="1" />
        </el-form-item> -->
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

js代码

  // 求和操作
    computed:{
    startMileage(){
     return parseFloat(this.form.startMileageKm) + parseFloat(this.form.startMileageM)/1000 || ''
    },
    endMileage(){
     return parseFloat(this.form.endMileageKm) + parseFloat(this.form.endMileageM)/1000 || ''
    },
    computeLen(){
     return ((parseFloat(this.form.endMileageKm) + parseFloat(this.form.endMileageM)/1000)-(parseFloat(this.form.startMileageKm) + parseFloat(this.form.startMileageM)/1000)).toFixed(6) || ''
    }
  },