<template>
  <d2-container>
    <template slot="header"
              style="padding: 5px;">
      <el-form size="mini"
               ref="form"
               :inline="true"
               class="sbutton_padding"
               style="margin-top: -7px;text-align:right;">

        <el-form-item label="设备名称"
                      class="sbutton_margin">
          <el-input style="width: 140px;"
                    v-model="search.InstrumenName"
                    placeholder="请输入设备名称"></el-input>
        </el-form-item>
        <el-form-item label="操作类型"
                      class="sbutton_margin">
          <el-select v-model="search.OperaTpye"
                     placeholder="请输入操作类型"
                     clearable
                     style="width:140px;">
            <el-option v-for="item in classificationlist"
                       :label="item.Value"
                       :value="item.Value"
                       :key="item.Value"></el-option>
          </el-select>
        </el-form-item>
        <!-- <el-form-item label="操作人">
          <el-input v-model="search.OperaUser"
                    style="width: 165px;"
                     
                    placeholder="输入操作人"></el-input>
        </el-form-item> -->
        <el-col :span="6"></el-col>
        <!-- <el-form-item label="操作日期"
                      class="sbutton_margin">
          <el-date-picker style="width:220px"
                          v-model="OperaOn"
                          type="daterange"
                          range-separator="至"
                          start-placeholder="开始日期"
                          end-placeholder="结束日期"></el-date-picker>
        </el-form-item> -->
        <el-button size="mini"
                   type="primary"
                   style="margin-left:10px;"
                   @click="searchdata()"
                   class="sbutton_margin">查询</el-button>
        <el-button size="mini"
                   type="primary"
                   @click="clearSearch"
                   class="sbutton_margin">重置</el-button>
        <el-button size="mini"
                   type="primary"
                   style="margin-right:6px;"
                   @click="maintainlogadd()"
                   class="sbutton_margin">添加</el-button>
      </el-form>
    </template>
    <el-table ref="multipleTable"
              :data="activities"
              border
              stripe
              tooltip-effect="dark"
              style="width: 100%"
              @sort-change="orderby"
              height="100%">
      <el-table-column label="操作"
                       align="center"
                       width="100px"
                       fixed='right'>
        <template slot-scope="scope">
          <el-button size="mini"
                     type="primary"
                     title="编辑"
                     @click="editmaintain(scope.row.Id)"
                     icon="el-icon-edit"
                     circle></el-button>
          <el-button size="mini"
                     @click="deleteinstrument(scope.row)"
                     type="danger"
                     title="删除"
                     style="margin-left:5px"
                     icon="el-icon-delete"
                     circle></el-button>
        </template>
      </el-table-column>

      <el-table-column prop="InstrumenCode"
                       align="center"
                       label="设备编号"
                       min-width="160"
                       show-overflow-tooltip></el-table-column>
      <el-table-column prop="InstrumenName"
                       align="center"
                       label="设备名称"
                       min-width="120"
                       show-overflow-tooltip></el-table-column>
      <el-table-column prop="OperaTpye"
                       align="center"
                       label="操作类型"
                       min-width="120"
                       show-overflow-tooltip></el-table-column>
      <el-table-column prop="OperaUser"
                       align="center"
                       label="操作人"
                       show-overflow-tooltip></el-table-column>
      <el-table-column prop="OperaRemark"
                       align="center"
                       label="操作说明"
                       show-overflow-tooltip
                       min-width="160px"></el-table-column>
      <el-table-column prop="OperaOn"
                       sortable
                       label="操作日期"
                       align="center"
                       show-overflow-tooltip
                       min-width="120">
        <template slot-scope="scope">{{ jstimehandle(scope.row.OperaOn +'') }}</template>
      </el-table-column>
    </el-table>
    <!-- </el-card> -->
    <addmaintainlog ref="addmaintain"
                    @closeAddDialog="handleCloseAdd"></addmaintainlog>
    <editmiantainlog ref="editmaintainlog"
                     @closeAddDialog="handleCloseEdit"
                     :maintainlogId="selectedMaintainLogId"></editmiantainlog>
    <!-- </div> -->
    <template slot="footer">
      <el-pagination style="margin: -10px;"
                     @size-change="handleSizeChange"
                     @current-change="handleCurrentChange"
                     :current-page="currpage"
                     :page-sizes="[10, 15, 20]"
                     :page-size="size"
                     layout="total, sizes, prev, pager, next, jumper"
                     :total="totalsize">
      </el-pagination>
    </template>
  </d2-container>
</template>

<script>
import {
  searchdatazl,
  OperaTpyelist,
  deleteinstrumentzl
} from '@/api/instrumentroom'
import addmaintainlog from './_opera/add'
import editmiantainlog from './_opera/edit'
export default {
  components: {
    addmaintainlog,
    editmiantainlog
  },
  name: 'instrument',
  data () {
    return {
      selectedMaintainLogId: 0,
      dialogvisible: false,
      name: '',
      totalsize: 0,
      currpage: 1,
      size: 10,
      OperaOn: [], // 录入时期
      activities: [],
      search: {
        OperaTpye: '',
        InstrumenName: '',
        InstrumenCode: '',
        OperaUser: ''
      },
      classificationlist: [],
      InstrumenName: '',
      InstrumenCode: '',
      addparam: '',
      paramid: '',
      OperaUser: '',
      // 列表排序
      Column: {
        Order: '',
        Prop: ''
      }
    }
  },
  mounted () {
    // searchdatazl()

    if (this.$route.query.id) {
      this.addparam = '?pid=' + this.$route.query.id
      this.paramid = this.$route.query.id
      this.search.InstrumenCode = ''
      this.search.InstrumenName = ''
    }
    this.searchdata()
    this.getOperaTpyelist()
  },
  methods: {
    maintainlogadd () {
      this.$refs.addmaintain.dialogvisible = true
    },
    editmaintain (maintainlogId) {
      this.$refs.editmaintainlog.getDonorsInfoAttachment(maintainlogId)
      this.$refs.editmaintainlog.dialogvisible = true
      this.$refs.editmaintainlog.initData(maintainlogId)
      this.selectedMaintainLogId = maintainlogId
    },
    // 添加  返回当前页面
    handleCloseAdd () {
      this.$refs.addmaintain.dialogvisible = false
      this.searchdata()
    },
    // 编辑  返回当前页面
    handleCloseEdit () {
      this.$refs.editmaintainlog.dialogvisible = false
      this.searchdata()
    },
    // 初始化列表数据
    searchdata () {
      let _this = this
      let OperaOn = []
      // let paramid
      if (!_this.OperaOn) {
        _this.OperaOn = []
      }
      // 解析时间
      if (_this.OperaOn.length === 2) {
        _this.OperaOn[1].setHours(23)
        _this.OperaOn[1].setMinutes(59)
        _this.OperaOn[1].setSeconds(59)
        OperaOn.push(_this.formatDateTime(_this.OperaOn[0]))
        OperaOn.push(_this.formatDateTime(_this.OperaOn[1]))
      }
      let params = {
        _currentPage: this.currpage,
        _size: this.size,
        InstrumenCode: this.search.InstrumenCode,
        InstrumenName: this.search.InstrumenName,
        OperaTpye: this.search.OperaTpye,
        OperaUser: this.search.OperaUser,
        paramid: this.paramid,
        Order: this.Column.Order,
        Prop: this.Column.Prop,
        TypeCode: 1
      }
      searchdatazl(params)

        .then(function (response) {
          _this.activities = response.info.items
          _this.totalsize = response.info.currentItemCount
        })
        .catch(function (error) {
          console.log(error)
        })
    },
    // 清除查询条件

    handleSizeChange (val) {
      this.size = val
      this.currpage = 1
      this.searchdata()
    },
    handleCurrentChange (val) {
      this.currpage = val
      this.searchdata()
    },
    jstimehandle (val) {
      if (val === '') {
        return '----'
      } else if (val === '0001-01-01T08:00:00+08:00') {
        return '----'
      } else if (val === '5000-01-01T23:59:59+08:00') {
        return '永久'
      } else {
        if (val === '0001-01-01T00:00:00Z') {
          return '----'
        } else val = val.replace('T', ' ')
        return val.substring(0, 19)
      }
    },
    // 删除设备信息
    deleteinstrument (val) {
      let _this = this
      _this
        .$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '关闭',
          type: 'warning'
        })
        .then(() => {
          deleteinstrumentzl(val.Id)
            .then(function (response) {
              // response
              if (response.info.code === 0) {
                _this.$message({
                  type: 'success',
                  message: response.info.message
                })
                // 更新界面
                _this.searchdata()
              } else {
                _this.$message({
                  type: 'warning',
                  message: response.info.message
                })
              }
            })
            .catch(function (error) {
              console.log(error)
            })
        })
        .catch(() => { })
    },
    getOperaTpyelist () {
      // 获取样本单位
      let _this = this
      let params = {

        code: 'OperaTpye'
      }
      OperaTpyelist(params)
        .then(res => {
          _this.classificationlist = res.info
        })
    },
    // 列表排序功能
    orderby (column) {
      if (column.order === 'ascending') {
        this.Column.Order = 'asc'
      } else if (column.order === 'descending') {
        this.Column.Order = 'desc'
      }
      this.Column.Prop = column.prop
      this.searchdata()
    },
    formatDateTime (date) {
      var y = date.getFullYear()
      var m = date.getMonth() + 1
      m = m < 10 ? '0' + m : m
      var d = date.getDate()
      d = d < 10 ? '0' + d : d
      // var h = date.getHours();
      // var minute = date.getMinutes();
      // minute = minute < 10 ? ('0' + minute) : minute;
      return y + '-' + m + '-' + d // + ' ' + h + ':' + minute;
    },
    clearSearch () {
      this.search.InstrumenCode = ''
      this.search.InstrumenName = ''
      this.search.OperaTpye = ''
      this.search.OperaUser = ''
      this.OperaOn = []
      this.searchdata()
    }
  }
}
</script>

<style lang="scss">
.el-pagination {
  margin: 1rem 0 2rem;
  text-align: right;
}

.plab {
  font-size: 13px;
  color: #999;
}
</style>
