<template>
  <div>
    <el-card>

      <el-form :model="query" v-if="showSearch" label-width="auto">
        <el-row :gutter="20">
          <el-col :span="6">
            <el-form-item label="项目编码">
              <el-input v-model="query.code" clearable/>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="项目名称">
              <el-input v-model="query.name" clearable/>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div class="top-right-btn">
        <el-button-group>
          <el-button icon="el-icon-view" type="primary" @click="showSearch = !showSearch">显示/隐藏搜索栏</el-button>
          <el-button
            type="primary"
            icon="el-icon-refresh"
            @click="onReset"
          >重置
          </el-button>
          <el-button type="primary" icon="el-icon-search" @click="search"
          >查询
          </el-button>
          <el-button type="primary" icon="el-icon-plus" @click="combine"
          >选入
          </el-button>
        </el-button-group>
      </div>
      <el-divider style="margin: 15px"></el-divider>

      <el-table :data="list"
                v-loading="loading" ref="table"
                click-row-light>
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column label="序号" width="50" type="index"/>
        <el-table-column label="项目编码" width="150" prop="code"/>
        <el-table-column label="项目名称" width="200" prop="name"/>
        <el-table-column label="项目内容" width="250" prop="content"/>
        <el-table-column label="创建人" width="120" prop="createUserName"/>
        <el-table-column label="创建时间" width="140" prop="createTime"/>
      </el-table>
      <pagination
        v-show="total>0"
        :total="total"
        :page.sync="query.page"
        :limit.sync="query.limit"
        @pagination="getList"
      />
    </el-card>

  </div>
</template>

<script>
import {
  deviceCheckItemDictPage,
} from "@/api/dev/deviceCheckItemDictApi";
import {devicePlanDetailItemAdd, devicePlanDetailItemBatchAdd} from "@/api/dev/devicePlanDetailItemApi";
import {getLoading} from "@/utils";
import {devicePlanDetailDelByDeviceCode} from "@/api/dev/devicePlanDetailApi";
import { isBlank } from '@/utils/strUtil'

let query = {
  page: 1,
  limit: 10,
  name: null,
  code: null,
}

let saveData = {
  code: null,
  name: null,
  content: null,
}

export default {
  name: "deviceCheckItemDict",
  props: {
    projectItem: {
      type: Object,
      required: true
    },
    planId: {
      type: Object,
      required: true
    },
    type: {
      type: Object,
      required: true
    },
    isChoose: {required: false, default: false, type: Boolean},
    closeAddDevice: {required: false, type: Function},
    pullData: {
      type: Object,
      required: true
    },
  },
  data() {
    return {
      showSearch: true,
      loading: false,
      total: .0,
      list: [],
      query: {...query},
      createFlag: false,
      saveData: {...saveData},
      formRule: {
        code: [{required: true, message: "项目编码不能为空", trigger: "change"}],
        name: [{required: true, message: "项目名称不能为空", trigger: "change"}],
        content: [{required: true, message: "项目内容不能为空", trigger: "change"}]
      },
      chooseItemList: [],
    }
  },
  created() {
    this.getList()
    // console.log("dayin shjv  shi什么",this.pullData)
  },
  methods: {
    search() {
      this.query.page = 1
      this.getList()
    },
    onReset() {
      this.query = {...query}
      this.getList()
    },
    getList() {
      this.loading = true
      this.query.type = this.pullData.type
        deviceCheckItemDictPage(this.query).then(res => {
          this.loading = false
          if (res.code != 20000) {
            this.$message.error(res.message)
            return
          }
          this.list = res.data.list || []
          this.total = res.data.total || 0

        }).catch(e => {
          this.loading = false
        })
    },

    combine() {
      let selectList = this.$refs.table.selection
      if (selectList.length == 0) {
        this.$message.error("请选择巡检项目")
        return
      }
      if (this.type == 2) {
        this.$confirm("此操作将会批量添加或覆盖该计划下所有设备巡检项目，是否继续", "提示", {
          confirmButtonText: "继续",
          cancelButtonText: "取消"
        }).then(() => {
            this.addProject()
        })
      } else {
        this.addProject()
      }
    },


    addProject() {
      let selectList = this.$refs.table.selection
      if (selectList.length == 0) {
        this.$message.error("请选择巡检项目")
        return
      }
      this.chooseItemList = selectList.map(item => item.code)


      if (this.type == 2) {
        let param = {
          planId: this.planId,
          itemCodes: this.chooseItemList
        }
        devicePlanDetailItemBatchAdd(param).then(res => {
          if (res.code != 20000) {
            this.$message.error(res.message)
            return
          }
          this.$message.success(res.message)
          this.closeAddDevice()
        }).catch(e => {
        })
      } else {

        let param = {
          planId: this.projectItem.planId,
          productId: this.projectItem.productId,
          deviceCode: this.projectItem.deviceCode,
          itemCodes: this.chooseItemList,
          type : this.pullData.type
        }
        devicePlanDetailItemAdd(param).then(res => {
          if (res.code != 20000) {
            this.$message.error(res.message)
            return
          }
          this.$message.success(res.message)
          this.closeAddDevice()
        }).catch(e => {
        })
      }
    },
  }
}


</script>


<style scoped>

/deep/ .el-dialog__body {
  padding: 0 0 20px 0;
}

</style>
