<template>
<!-- 确权资料管理-文件详情 -->
  <dialog-edit :visible.sync="dialogVisible" :editModel="editModel" :form="form" :title="$t('confirmationRightData.dialogHead')" width="1100px" :api="api">
    <search-form :formValue.sync="queryParas"
              searchPerms="search"
              class="searchquery"
              @handleFilter="handleFilter"
              @clearParam="clearParam"
              resetPerms="reset"
              :isShowFoldBtn="false"
              :componentList="componentList"></search-form>
    <!-- <data-table :api="api" :deleteApi="api"
            :showSelection="false"
            selectable="false"
            :handleFlag.sync="handleFlag"
            :menuFlag="false"
            :sourceData.sync="sourceData"
            :columns="columns"
            loadPage="getData"
            :otherHeight="'240'"
            operateBtnLayout=""
            :IsRight="false"
            :showPage="false"
            :operatWidth="'200'">
    </data-table> -->
    <tree-table
      ref="treetable"
      :sourceData.sync="sourceData"
      :columns="columns"
      childrenName="fileLogList"
      :singleClick="singleClick"
    ></tree-table>
  </dialog-edit>
</template>

<script>
import components from 'newepoch-components'
import BasePage from '@/pages/baseEditPage'
import confirmationRightDataApi from '@/api/confirmationRightDataApi'
import * as format from '@/filters/index'
import TreeTable from '@/components/element/shourang/TreeTable.vue'

export default {
  extends: new BasePage('confirmationRightData'),
  name: 'confirmationRightDataManageEdit',
  components: {
    DialogEdit: components.DialogEdit,
    searchForm: components.searchForm,
    DataTable: components.DataTable,
    TreeTable
  },
  computed: {
    api () {
      return confirmationRightDataApi.confirmationRightFileInfo
    }
  },
  data () {
    return {
      handleFlag: false,
      queryParas: {
        fileName: ''
      },
      componentList: [
        {
          // 文件名称
          label: this.$i18n.messages[this.$i18n.locale].confirmationRightData.fileName,
          value: 'fileName',
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseInput,
          labelWidth: '70px',
          componentName: 'el-input'
        }
      ],
      columns: [
        {
          // 文件名称
          prop: 'productFileName',
          align: 'left',
          width: '260px',
          label: this.$i18n.messages[this.$i18n.locale].confirmationRightData.fileName,
          format: (row) => { return row.parent ? '' : row.productFileName }
        },
        {
          // 是否生成
          prop: 'ifsGenerate',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].confirmationRightData.isGenerate,
          format: (row) => { return format.formatDict(row.ifsGenerate, 'ZD0003') }
        },
        {
          // 文件生成方式
          prop: 'generateWay',
          align: 'center',
          width: '160px',
          label: this.$i18n.messages[this.$i18n.locale].confirmationRightData.assetBussType,
          format: (row) => { return format.formatDict(row.generateWay, 'SCRS0131') }
        },
        {
          // 状态
          prop: 'fileStatus',
          align: 'center',
          label: this.$i18n.messages[this.$i18n.locale].confirmationRightData.assetStatus,
          format: (row) => {
            if (row.fileStatus === '0') return ''
            return format.formatDict(row.fileStatus, 'SCRS0121')
          }
        },
        {
          // 文件生成时间
          prop: 'handlerDate',
          align: 'center',
          width: '160px',
          label: this.$i18n.messages[this.$i18n.locale].confirmationRightData.assetAddTime,
          format: (row) => { return format.formatDate(row.handlerDate, 'yyyy-MM-dd hh:mm:ss') }
        },
        {
          // 处理人
          prop: 'handlerName',
          align: 'left',
          width: '160px',
          label: this.$i18n.messages[this.$i18n.locale].confirmationRightData.dealPeople
        }
      ],
      sourceData: []
    }
  },
  methods: {
    singleClick () {
    },
    selectChanged (data) {
    },
    clearParam () {
      this.$set(this.queryParas, 'fileName', '')
    },
    handleFilter () {
      let that = this
      if (that.$refs.treetable) {
        that.$refs.treetable.vLoading = true
      }
      this.queryParas.assetInfoId = this.form.assetInfoId
      confirmationRightDataApi.confirmationRightFileInfo.getList(this.queryParas).then(res => {
        if (res.data && res) {
          res.data.forEach(it => {
            if (it.fileLogList) {
              it.fileLogList.forEach(it1 => {
                it1.generateWayC = it1.generateWay
                delete it1.generateWay
              })
            }
          })
          that.sourceData = res.data
          // that.$set(that, 'sourceData', res.data)
        }
        if (this.$refs.treetable) {
          this.$refs.treetable.setInitFalg(false)
        }
      }).finally(() => {
        if (that.$refs.treetable) {
          that.$refs.treetable.vLoading = false
        }
      })
      // if (this.queryParas.fileName) {
      //   this.sourceData = this.form.assetMaterialDetailDtoList.filter(item => item.fileName.includes(this.queryParas.fileName))
      // } else {
      //   this.sourceData = this.form.assetMaterialDetailDtoList
      // }
    }
  },
  watch: {
    dialogVisible (val) {
      this.$set(this, 'sourceData', [])
      if (!val) {
        this.queryParas = {
          fileName: ''
        }
        // this.sourceData.length = 0
        if (this.$refs.treetable) {
          this.$refs.treetable.vLoading = false
          this.$refs.treetable.setInitFalg(false)
        }
      }
      // deep: true,
      // immediate: true,
      // handler (n, o) {
      //   if (n) {
      //     // this.form = this.form === undefined ? {} : this.form
      //     if (this.form.assetMaterialDetailDtoList.length !== 0) {
      //       this.sourceData = []
      //       this.$nextTick(() => {
      //         this.sourceData = this.form.assetMaterialDetailDtoList
      //         if (this.$refs.treetable) {
      //           this.$refs.treetable.setInitFalg(false)
      //         }
      //       })
      //     }
      //   }
      // }
    }
  }
}
</script>

<style scoped lang="scss">
  .searchquery{
    & >>> .el-form-item{
      margin-bottom: 0;
    }
    & >>> .searchForm{
      display: flex;
    }
    & >>> .searchArea {
      margin-bottom: 10px;
    }
  }
</style>
