Merge remote-tracking branch 'origin/master'

gaoluyang

2024-07-31 38e6f27a8082e1173e3c02a33da5da39b6c6872c

 src/components/do/a6-device/operation-overview.vue

@@ -1,13 +1,161 @@
<template>
  <div>运行总览</div>
  <div class="page">
    <echart-module :id="'page-left'" :config="chartConfig" :datas="chartData" class="page-left"></echart-module>
    <div class="page-right">
      <div class="form-item">
        <label>故障次数</label>
        <span>0</span>
      </div>
      <div class="form-item">
        <label>最近故障日期</label>
        <el-date-picker
          v-model="form.value1"
          type="date"
          size="small"
          placeholder="选择日期" style="width: calc(100% - 200px);" readonly>
        </el-date-picker>
      </div>
      <div class="form-item">
        <label>最近校准日期</label>
        <el-date-picker
          v-model="form.value1"
          type="date"
          size="small"
          placeholder="选择日期" style="width: calc(100% - 200px);" readonly>
        </el-date-picker>
      </div>
      <div class="form-item">
        <label>下次校准日期</label>
        <el-date-picker
          v-model="form.value1"
          type="date"
          size="small"
          placeholder="选择日期" style="width: calc(100% - 200px);" readonly>
        </el-date-picker>
      </div>
      <div class="form-item">
        <label>校准总结论</label>
        <el-radio-group v-model="form.value1" disabled>
          <el-radio :label="0">合格</el-radio>
          <el-radio :label="1">不合格</el-radio>
          <el-radio :label="2">其他</el-radio>
        </el-radio-group>
      </div>
      <div class="form-item">
        <label>最近核查日期</label>
        <el-date-picker
          v-model="form.value1"
          type="date"
          size="small"
          placeholder="选择日期" style="width: calc(100% - 200px);" readonly>
        </el-date-picker>
      </div>
      <div class="form-item">
        <label>下次核查日期</label>
        <el-date-picker
          v-model="form.value1"
          type="date"
          size="small"
          placeholder="选择日期" style="width: calc(100% - 200px);" readonly>
        </el-date-picker>
      </div>
      <div class="form-item">
        <label>核查总结论</label>
        <el-radio-group v-model="form.value1" disabled>
          <el-radio :label="0">合格</el-radio>
          <el-radio :label="1">不合格</el-radio>
          <el-radio :label="2">其他</el-radio>
        </el-radio-group>
      </div>
      <div class="form-item">
        <label>最近维护日期</label>
        <el-date-picker
          v-model="form.value1"
          type="date"
          size="small"
          placeholder="选择日期" style="width: calc(100% - 200px);" readonly>
        </el-date-picker>
      </div>
      <div class="form-item">
        <label>下次维护日期</label>
        <el-date-picker
          v-model="form.value1"
          type="date"
          size="small"
          placeholder="选择日期" style="width: calc(100% - 200px);" readonly>
        </el-date-picker>
      </div>
      <div class="form-item">
        <label>维护类型</label>
        <el-radio-group v-model="form.value1" disabled>
          <el-radio :label="0">使用前后维护</el-radio>
          <el-radio :label="1">计划中维护</el-radio>
        </el-radio-group>
      </div>
      <div class="form-item">
        <label>测量项目</label>
        <span>1111111</span>
      </div>
    </div>
  </div>
</template>

<script>
import EchartModule from '../../tool/echart.vue'
export default {

  components: {EchartModule},
  data(){
    return {
      chartConfig:{
        height: '',
        isLoading:true,
        type:'gauge'
      },
      chartData:{
        xData:[],
        yData:[
          {
            title:'任务接收量',
            data:[]
          }
        ]
      },
      form:{
        value1:''
      }
    }
  }
}
</script>

<style scoped>

.page{
  width: 100%;
  height: 100%;
  display: flex;
}
.page-left{
  width: 420px;
  height: 420px;
  margin-top: 40px;
  margin-right: 40px;
}
.page-right{
  flex: 1;
  /* background: red; */
}
.form-item{
  line-height: 42px;
  font-size: 14px;
}
.page-right label{
  color: #999;
  width: 110px;
  display: inline-block;
  text-align: right;
  margin-right: 20px;
}
>>>.el-radio__input.is-disabled+span.el-radio__label{
  color: #606266 !important;
}
</style>