<template>
  <div class="view-carrierListExecutionRegistration">
    <!-- 通用代码 左侧按钮 右侧输入框 下拉框 -->
    <div class="view-common-header">
      <div class="view-common-header-left"></div>
      <div class="view-common-header-right">
        <!-- width-137 在style/excel.js 定义宽度 -->
        <div class="input-with-select width-137">
          <span>状态</span>
          <el-select v-model="statusValue" placeholder="请选择" @change="fetchTableData('search')">
            <el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value"> </el-option>
          </el-select>
        </div>
        <el-input @keyup.enter.native="fetchTableData('search')" placeholder="请输入内容" v-model="searchValue" class="input-select">
          <el-button @click="fetchTableData('search')" slot="append" icon="el-icon-search"></el-button>
        </el-input>
      </div>
    </div>
    <!-- <LTable ref="table" :columns="columns" :dataSource="tableData" :options="options" :fetch="fetchTableData"></LTable> -->
    <el-table class="view-carrierListExecutionRegistration-table" :data="tableData" height="calc(100vh - 240px)" row-key="taskId" :default-expand-all="isExpandAll" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
      <el-table-column prop="taskName" label="任务名称" align="left" width="210px"> </el-table-column>
      <el-table-column prop="taskCode" label="任务代号" align="center"> </el-table-column>
      <el-table-column prop="taskTime" label="任务时间" align="center" show-overflow-tooltip> </el-table-column>
      <el-table-column prop="taskDuration" label="任务时长" align="center"> </el-table-column>
      <el-table-column prop="env" label="飞行环境" align="center"> </el-table-column>
      <el-table-column prop="taskType" label="任务类型" align="center"> </el-table-column>
      <el-table-column prop="status" label="状态" align="center" width="150px">
        <template slot-scope="scope">
          <span :class="dictionaries[scope.row.status].class">{{ dictionaries[scope.row.status].text }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="equipmentIntact" label="装备完好率" align="center"> </el-table-column>
      <el-table-column label="任务携行航材利用率" align="center" class-name="box-border-left">
        <el-table-column prop="assignmentUseRatio" label="项" align="center">
          <template slot-scope="scope">{{ scope.row.assignmentUseRatio ? scope.row.assignmentUseRatio.item : null }}</template>
        </el-table-column>
        <el-table-column prop="assignmentUseRatio.piece" label="件" align="center">
          <template slot-scope="scope">{{ scope.row.assignmentUseRatio ? scope.row.assignmentUseRatio.piece : null }}</template>
        </el-table-column>
        <el-table-column prop="assignmentUseRatio.money" label="金额" align="center">
          <template slot-scope="scope">{{ scope.row.assignmentUseRatio ? scope.row.assignmentUseRatio.money : null }}</template>
        </el-table-column>
      </el-table-column>
      <el-table-column label="非任务携行航材利用率" align="center" class-name="box-border">
        <el-table-column prop="noAssignmentUseRatio.item" label="项" align="center">
          <template slot-scope="scope">{{ scope.row.noAssignmentUseRatio ? scope.row.noAssignmentUseRatio.item : null }}</template>
        </el-table-column>
        <el-table-column prop="noAssignmentUseRatio.piece" label="件" align="center">
          <template slot-scope="scope">{{ scope.row.noAssignmentUseRatio ? scope.row.noAssignmentUseRatio.piece : null }}</template>
        </el-table-column>
        <el-table-column prop="noAssignmentUseRatio.money" label="金额" align="center">
          <template slot-scope="scope">{{ scope.row.noAssignmentUseRatio ? scope.row.noAssignmentUseRatio.money : null }}</template>
        </el-table-column>
      </el-table-column>
      <el-table-column prop="operation" label="操作" align="center" width="120px">
        <template slot-scope="scope">
          <el-button size="mini" type="text" @click="look(scope.$index, scope.row)">查看</el-button>
          <el-button size="mini" type="text" :disabled="scope.row.status != 9" @click="toSailingMaterial(scope.$index, scope.row)">登记</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { dictionaries, options } from './index'
import { basicdataQueryFlyTask } from '@/api/task/carrierFlightMission'
import { statusList } from '@/utils/status'
export default {
  name: 'CarrierUseRegistration',
  data() {
    // 这里存放数据
    return {
      options,
      tableData: [],
      statusList: statusList,
      statusValue: null,
      searchValue: '',
      isExpandAll: true,
      dictionaries
    }
  },
  mounted() {
    this.fetchTableData()
  },
  methods: {
    async fetchTableData(search) {
      let postData = {
        status: this.statusValue,
        queryParam: this.searchValue
      }
      const { code, data } = await basicdataQueryFlyTask(postData)
      if (code == 200) {
        this.tableData = data
      }
    },
    look(index, row) {
      this.$router.push(`/carrierStandard/carrierUseRegistration/look/${row.taskId}`)
    },
    toSailingMaterial(index, row) {
      this.$router.push(`/carrierStandard/carrierSailingMaterial/${row.taskId}`)
    },
    handleIndexChange(val) {
      this.pagination.pageIndex = val
      this.fetchTableData()
    },
    handleSizeChange(val) {
      this.pagination.pageSize = val
      this.fetchTableData()
    }
  }
}
</script>

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