<template>
  <div>
    <el-dialog title="添加产品" :visible.sync="dialogVisible" :before-close="onClose" width="75%">
      <template-page
        ref="pageRef"
        style="width: 100%; height: 100%"
        :get-list="getList"
        :table-attributes="tableAttributes"
        :table-events="tableEvents"
      />
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="$parent.dialogVisible = false">取 消</el-button>
        <el-button type="primary" size="mini" @click="confirm">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import TemplatePage from '@/components/template/template-page-1.vue'
import import_mixin from '@/components/template/import_mixin.js'
import { boolean } from 'yargs'

export default {
  components: { TemplatePage },
  mixins: [import_mixin],
  props: {
    dialogVisible: {
      type: Boolean,
      default: false
    },
    func: {
      type: Function,
      default: () => {}
    },
    customerNumber: {
      type: String,
      default: null
    },
    returnId: {
      type: String,
      default: null
    },
    itemId: {
      type: String,
      default: null
    },
    dataList: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      pageType: 0,
      // 事件组合
      optionsEvensGroup: [
        [
          // [
          //   {
          //     name: '批量删除',
          //     click: this.dels,
          //     // isRole: this.$checkBtnRole('del', this.$route.meta.roles)
          //   }
          // ],
          [
            {
              name: '审核',
              click: this.examineWarehouse
            }
          ]
        ],
        [
          [
            {
              name: '库存调整',
              click: this.addWarehouse
              // isRole: this.$checkBtnRole('add', this.$route.meta.roles)
            }
          ]
        ]
      ],
      // 表格属性
      tableAttributes: {
        // 启用勾选列
        selectColumn: true,
        selectable: this.selectable
      },
      // 表格事件
      tableEvents: {
        'selection-change': this.selectionChange
      },
      recordSelected: []
    }
  },
  methods: {
    // 列表请求函数
    getList(...p) {
      this.recordSelected = []
      return this.func(p)
    },
    // 列表导出函数
    // exportList: exportCustomerStockOrderBean,
    // 表格列解析渲染数据更改
    columnParsing(item, defaultData) {
      return defaultData
    },
    // 监听勾选变化
    selectionChange(data) {
      this.recordSelected = data
    },
    addWarehouse() {
      this.pageType = 1
    },
    examineWarehouse() {
      this.pageType = 2
    },
    detailsWarehouse() {
      this.pageType = 3
    },
    onClose() {
      this.$parent.dialogVisible = false
    },
    operation() {
      return (h, { row, index, column }) => {
        return (
          <div class='operation-btns'>
            (
            <el-button size='mini' type='primary' onClick={() => {}}>
              查看
            </el-button>
            ) } (
            <el-button size='mini' type='primary' onClick={() => {}}>
              审批
            </el-button>
            ) }
            {
              <el-popconfirm title='是否确定操作？' onConfirm={() => {}}>
                <el-button size='mini' type='primary' slot='reference'>
                  确认返还
                </el-button>
              </el-popconfirm>
            }
          </div>
        )
      }
    },
    confirm() {
      if (this.recordSelected.length) {
        this.$emit('confirm', this.recordSelected)
      } else {
        this.$errorMsg('请选择产品')
      }
      // this.$parent.dialogVisible = false
    },
    selectable(row, index) {
      if (this.dataList.length) {
        if (this.returnId !== null) {
          for (let j = 0; j < this.dataList.length; j++) {
            if (
              row.id == this.dataList[j].id ||
            row.disabled === false
            ) {
              if (
                row.itemId == this.dataList[j].itemId ||
              row.disabled === false
              ) {
                this.$set(row, 'disabled', false)
              } else {
                this.$set(row, 'disabled', true)
              }
            } else {
              this.$set(row, 'disabled', true)
            }
          }
        } else {
          for (let j = 0; j < this.dataList.length; j++) {
            if (
              row.id == this.dataList[j].id ||
            row.disabled === false
            ) {
              this.$set(row, 'disabled', false)
            } else {
              this.$set(row, 'disabled', true)
            }
          }
        }
      }

      if (this.customerNumber) {
        if (row.customerNumber == this.customerNumber && row.disabled) {
          return true
        } else {
          return false
        }
      } else if (this.returnId) {
        if (row.id == this.returnId && row.disabled) {
          return true
        } else {
          return false
        }
      } else {
        return true
      }
    }
    // 批量删除
    // dels() {
    //   if (this.recordSelected.length) {
    //     this.$confirm('此操作将删除数据, 是否继续?', '提示', {
    //       confirmButtonText: '确定',
    //       cancelButtonText: '取消',
    //       type: 'warning'
    //     })
    //       .then(() => {
    //         partsOldOutDel({
    //           ids: this.recordSelected.map(item => item.id).join(',')
    //         })
    //           .then(res => {
    //             this.$refs.pageRef.refreshList()
    //             this.$message({
    //               type: 'success',
    //               message: '删除成功!'
    //             })
    //           })
    //           .catch(() => {
    //             this.$message({
    //               type: 'error',
    //               message: '删除失败'
    //             })
    //           })
    //       })
    //       .catch(() => {
    //         this.$message({
    //           type: 'info',
    //           message: '已取消删除'
    //         })
    //       })
    //   } else {
    //     this.$message({
    //       type: 'info',
    //       message: '请先勾选需要删除的数据!'
    //     })
    //   }
    // }
  }
}
</script>

<style lang="scss" scoped>
::v-deep .el-table__body-wrapper {
  height: 600px !important;
}

::v-deep .page-button-collection {
  display: none;
}
</style>
<!--<template>-->
<!--  <div>-->
<!--    <el-dialog-->
<!--      title="添加产品"-->
<!--      :visible.sync="dialogVisible"-->
<!--      width="75%"-->
<!--      :before-close="handleClose"-->
<!--    >-->
<!--      <div>-->
<!--        <el-form label-position="left" label-width="80px" :model="screenForm">-->
<!--          <el-form-item label="名称">-->
<!--            <el-input v-model="screenForm.name"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="活动区域">-->
<!--            <el-input v-model="screenForm.region"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="活动形式">-->
<!--            <el-input v-model="screenForm.type"></el-input>-->
<!--          </el-form-item>-->
<!--        </el-form>-->
<!--      </div>-->
<!--      <div>-->
<!--        <el-table-->
<!--          :data="dataList"-->
<!--          style="width: 100%"-->
<!--          v-bind="tableAttributes"-->
<!--        >-->
<!--          <el-table-column-->
<!--            v-if="isSelection"-->
<!--            type="selection"-->
<!--            width="55"-->
<!--          >-->
<!--          </el-table-column>-->
<!--          <el-table-column-->
<!--            v-if="isIndex"-->
<!--            type="index"-->
<!--            width="50"-->
<!--          >-->
<!--          </el-table-column>-->
<!--          <el-table-column-->
<!--            v-for="(item,index) in column"-->
<!--            :key="index"-->
<!--            v-bind="{...item,...columnAttributes}"-->
<!--          >-->
<!--            <template v-slot="{row}">-->
<!--              <template v-if="item.isInput">-->
<!--                {{ row.prop }}-->
<!--              </template>-->
<!--              <template v-else>-->
<!--                <el-input-->
<!--                  v-model.number="row.prop"-->
<!--                  class="yinput"-->
<!--                  :type="item.type?item.type:'number'"-->
<!--                  :placeholder="item.placeholder"-->
<!--                  size="mini"-->
<!--                  @mousewheel.native.prevent-->
<!--                />-->
<!--              </template>-->
<!--            </template>-->
<!--          </el-table-column>-->
<!--          <el-table-column v-if="isOperation" fixed="left" label="操作" min-width="250" align="center">-->
<!--            <slot>-->
<!--              <template v-slot="{row}">-->
<!--                <el-popconfirm-->
<!--                  style="margin-left: 10px"-->
<!--                  title="删除？"-->
<!--                  @onConfirm="handleDel(row)"-->
<!--                >-->
<!--                  <el-button slot="reference" type="text" size="mini">提审</el-button>-->
<!--                </el-popconfirm>-->
<!--              </template>-->
<!--            </slot>-->
<!--          </el-table-column>-->
<!--        </el-table>-->

<!--      </div>-->
<!--      <div class="pagination clearfix">-->
<!--        <div class="fr">-->
<!--          <el-pagination-->
<!--            @size-change="handleSizeChange"-->
<!--            @current-change="handleCurrentChange"-->
<!--            :current-page="currentPage"-->
<!--            :page-sizes="[10, 20, 30, 50]"-->
<!--            :page-size="10"-->
<!--            layout="total, sizes, prev, pager, next, jumper"-->
<!--            :total="listTotal"-->
<!--          >-->
<!--          </el-pagination>-->
<!--        </div>-->
<!--      </div>-->

<!--    </el-dialog>-->
<!--  </div>-->
<!--</template>-->

<!--<script>-->
<!--export default {-->
<!--  name: 'SalesDialog',-->
<!--  props: {-->
<!--    isShow: {-->
<!--      type: Boolean,-->
<!--      default: false-->
<!--    },-->
<!--    screenForm: {-->
<!--      type: Object,-->
<!--      default: () => {-->
<!--        return {}-->
<!--      }-->
<!--    },-->
<!--    isSelection: {-->
<!--      type: Boolean,-->
<!--      default: false-->
<!--    },-->
<!--    isIndex: {-->
<!--      type: Boolean,-->
<!--      default: false-->
<!--    },-->
<!--    isOperation: {-->
<!--      type: Boolean,-->
<!--      default: false-->
<!--    },-->
<!--    tableAttributes: {-->
<!--      type: Object,-->
<!--      default: () => {-->
<!--        return {}-->
<!--      }-->
<!--    },-->
<!--    columnAttributes: {-->
<!--      type: Object,-->
<!--      default: () => {-->
<!--        return {}-->
<!--      }-->
<!--    },-->
<!--    dataList: {-->
<!--      type: Array,-->
<!--      default: () => {-->
<!--        return []-->
<!--      }-->
<!--    }-->
<!--  },-->
<!--  data() {-->
<!--    return {-->
<!--      dialogVisible: false,-->
<!--      column: [-->
<!--        {-->
<!--          prop: 'date',-->
<!--          label: '日期'-->
<!--        },-->
<!--        {-->
<!--          prop: 'date',-->
<!--          label: '日期'-->

<!--        },-->
<!--        {-->
<!--          prop: 'date',-->
<!--          label: '日期'-->

<!--        }-->
<!--      ],-->
<!--      currentPage: 1,-->
<!--      listTotal: 0-->
<!--    }-->
<!--  },-->
<!--  created() {-->
<!--    this.dialogVisible = this.isShow-->
<!--  },-->
<!--  methods: {-->
<!--    handleClose(done) {-->
<!--      this.$confirm('确认关闭？')-->
<!--        .then(_ => {-->
<!--          done()-->
<!--        })-->
<!--        .catch(_ => {-->
<!--        })-->
<!--    },-->
<!--    handleDel(row) {-->
<!--      console.log(row)-->
<!--    },-->
<!--    handleSizeChange() {-->

<!--    },-->
<!--    handleCurrentChange() {-->

<!--    }-->
<!--  }-->
<!--}-->
<!--</script>-->

<!--<style scoped>-->

<!--</style>-->
