<template>
  <div>
    <el-dialog
      :title="title"
      :visible.sync="dialogVisible"
      width="1000px"
      :before-close="handleClose"
      :open="open"
      v-if="dialogVisible"
      :close-on-click-modal="false"
      append-to-body
      :close-on-press-escape="false"
    >
      <ht-table
        @load="loadData"
        :data="data"
        :pageResult="pageResult"
        :selection="true"
        quick-search-props="checkDate,rummager,noteTaker"
        :show-export="false"
        :show-custom-column="false"
        ref="htTable"
        @row-dblclick="handleEdit"
      >
        <template v-slot:search>
          <ht-table-search-panel :divide="2">
            <ht-table-search-field label="检查人" prop="rummager" />
            <ht-table-search-field label="记录人" prop="noteTaker" />
            <ht-table-search-field label="总体评价" prop="evaluateValue" />
            <ht-table-search-field label="检查日期" prop="checkDate" />
          </ht-table-search-panel>
        </template>

        <ht-table-column
          prop="checkDate"
          label="检查日期"
          width="180"
          :sortable="true"
        >
        </ht-table-column>
        <ht-table-column prop="rummager" label="检查人" width="180">
        </ht-table-column>
        <ht-table-column prop="noteTaker" label="记录人"> </ht-table-column>
        <ht-table-column prop="weather" label="天气"> </ht-table-column>
        <ht-table-column prop="evaluateValue" label="总体评价">
        </ht-table-column>
        <!-- <ht-table-column prop="defectType" label="缺损类型"> </ht-table-column>
        <ht-table-column prop="defectScope" label="缺损范围"> </ht-table-column>
        <ht-table-column prop="processMode" label="处理措施"> </ht-table-column> -->
      </ht-table>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      title: '边坡经常检查列表',
      pageResult: {
        page: 1,
        pageSize: 20,
        total: 0,
      },
      dialogVisible: false,
      data: [],
      sideSlopeId: '',
    }
  },
  methods: {
    handleClose(done) {
      done()
    },
    open(data) {
      this.dialogVisible = true
      //   this.$http.post('${form}')
      this.sideSlopeId = data.id
    },
    loadData(param, cb) {
      param.querys = [
        {
          group: 'main',
          operation: 'EQUAL',
          parentGroup: '',
          property: 'sideSlopeId',
          relation: 'AND',
          value: this.sideSlopeId,
        },
      ]
      this.$http
        .post('${form}/sideSlopeOftenCheck/v1/getJson', param)
        .then(
          (resp) => {
            let response = resp.data
            this.data = response.rows
            // for (let i in this.data) {
            //   let lastM = new Date(
            //     new Date().setMonth(new Date().getMonth() + 1)
            //   )
            //   lastM = this.formTime(lastM)
            //   lastM = new Date(lastM.replace(/-/g, '/'))
            //   let dayM = new Date(this.data[i].checkDate)
            //   let days = lastM.getTime() - dayM.getTime()
            //   days = parseInt(days / (1000 * 60 * 60 * 24))
            //   this.data[i].InspectionDays = days
            // }
            this.pageResult = {
              page: response.page,
              pageSize: response.pageSize,
              total: response.total,
            }
          },
          (error) => {
            reject(error)
          }
        )
        .finally(() => {
          if (cb) {
            cb()
          }
        })
    },
    handleEdit(data) {
      // this.title = '桥梁经常检查列表'
      // this.dialogVisible = true
      //   this.$refs.fredialog.open(data)
    },
  },
}
</script>

<style lang="scss" scoped>
/deep/.el-dialog::-webkit-scrollbar {
  display: none;
}
</style>
