<template>
  <div>
    <!-- <el-descriptions class="view-carrierListExecutionRegistrationCompile-basicInformation" title="基本信息" :column="3" border>
      <el-descriptions-item>
        <template slot="label"> 任务名称 </template>
        {{ form.taskName }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label"> 任务时间 </template>
        {{ form.taskTime }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label"> 任务时长 </template>
        {{ form.taskLength }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label"> 环境 </template>
        {{ form.taskEnvironment }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label"> 任务类型 </template>
        {{ form.taskType }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label"> 状态 </template>
        {{ form.state }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label"> 装备完存率 </template>
        {{ form.completionRate }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label"> 任务携行航材利用率(项) </template>
        {{ form.term }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label"> 非任务携行航材利用率(项) </template>
        {{ form.nonmissionTerm }}
      </el-descriptions-item>

      <el-descriptions-item>
        <template slot="label"> 任务携行航材利用率(件) </template>
        {{ form.piece }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label"> 非任务携行航材利用率(件) </template>
        {{ form.nonmissionPiece }}
      </el-descriptions-item>

      <el-descriptions-item>
        <template slot="label"> 任务携行航材利用率(金额) </template>
        {{ form.amount }}
      </el-descriptions-item>
      <el-descriptions-item>
        <template slot="label"> 非任务携行航材利用率(金额) </template>
        {{ form.nonmissionAmount }}
      </el-descriptions-item>
    </el-descriptions> -->

    <el-form ref="form" :model="form" label-position="right" label-width="200px" class="view-carrierListExecutionRegistrationCompile-basicInformation">
      <p>基本信息</p>
      <el-form-item label="任务名称">
        <el-input v-model="form.taskName" disabled></el-input>
      </el-form-item>
      <el-row>
        <el-col :span="12">
          <el-form-item label="任务时间">
            <el-date-picker disabled type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd" format="yyyy-M-d" v-model="form.taskTime" placeholder="选择日期"> </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="任务时长">
            <el-input v-model="form.taskLength" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="环境">
            <el-input v-model="form.taskEnvironment" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="任务类型">
            <el-input v-model="form.taskType" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="状态">
            <el-input v-model="form.state" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="装备完存率">
            <el-input v-model="form.completionRate" disabled></el-input>
          </el-form-item>
        </el-col>
        <!-- 
        <el-col :span="12">
          <el-form-item label="任务携行航材利用率(项/件/金额)">
            <input v-model="lyv" />
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="非任务携行航材利用率(项/件/金额)">
            <input v-model="flyv" />
          </el-form-item>
        </el-col> -->

        <el-col :span="12">
          <el-form-item label="任务携行航材利用率(项)">
            <el-input v-model="form.term" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="任务携行航材利用率(件)">
            <el-input v-model="form.piece" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="任务携行航材利用率(金额)">
            <el-input v-model="form.amount" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="非任务携行航材利用率(项)">
            <el-input v-model="form.nonmissionTerm" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="非任务携行航材利用率(件)">
            <el-input v-model="form.nonmissionPiece" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="非任务携行航材利用率(金额)">
            <el-input v-model="form.nonmissionAmount" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>

<script>
export default {
  name: 'BasicInformation',
  components: {},
  data() {
    // 这里存放数据
    return {
      form: {
        taskName: 'xxx训练',
        taskTime: '2023-05-04',
        taskLength: '30',
        taskEnvironment: '沙漠',
        taskType: '越野5公里',
        state: '已修订',
        completionRate: '30%',
        term: '80%',
        piece: '60%',
        amount: '70%',
        nonmissionTerm: '60%',
        nonmissionPiece: '60%',
        nonmissionAmount: '90%'
      },
      lyv: null,
      flyv: null
    }
  },
  mounted() {
    this.lyv = `${this.form.term} ${this.form.piece} ${this.form.amount}`
    this.flyv = `${this.form.nonmissionTerm} ${this.form.nonmissionPiece} ${this.form.nonmissionAmount}`
  },
  methods: {}
}
</script>

<style lang="scss">
@import './index.scss';
</style>
