<template>
  <Dialog
    :is-dialog-exist="isDelete"
    :title="checkDialogTitle"
    :dialog-style="checkDialogStyle"
    @close-dialog="handleClose"
  >
    <el-container>
      <el-main>
        <div style="text-align: center">是否删除所选列表内容？删除后不可恢复</div>
      </el-main>
      <el-footer>
        <el-button type="primary" size="mini" @click="onSubmit">确认</el-button>
        <el-button type="info" plain size="mini" @click="closeDialog">取消</el-button>
      </el-footer>
    </el-container>
  </Dialog>
</template>

<script>
/**
 * 客户经理管理-删除
 */
import Dialog from '@/components/Dialog/index'
import { postDeleteClient } from '/src/api/master-info-manage/account-manager-management'
export default {
  components: { Dialog },
  props: {
    // 每行选中的数据
    itemChoseData: {
      type: Object,
      require: true,
      default: () => {}
    },
    isDelete: {
      type: Boolean,
      default: () => {}
    }
  },
  data() {
    return {
      // 弹窗
      checkDialogTitle: '删除',
      checkDialogStyle: {
        '--dialog-width': '450px',
        '--dialog-height': '260px',
        '--title-height': '51px'
      }
    }
  },
  watch: {
    isDelete(val) {
      if (val) {
        console.log(JSON.stringify(this.itemChoseData), '选中的数据(删除)')
      }
    }
  },
  methods: {
    // 加入保存操作请求
    _postRequest() {
      console.log(this.itemChoseData.id)
      const params = {
        ids: [this.itemChoseData.id]
      }
      postDeleteClient(params).then(resp => {
        if (parseInt(resp.code) === 0) {
          this.$message.success('成功！')
          this.handleClose()
          this.handleSuccess()
        }
      })
    },
    onSubmit() {
      this._postRequest()
    },
    closeDialog() {
      this.handleClose()
    },
    handleSuccess() {
      this.$emit('handle-success')
    },
    handleClose() {
      this.$emit('handle-close')
    }
  }
}
</script>

<style lang="scss" scoped>
  .el-container {
    width: 100%;
    height: 100%;
  .el-main {
    height: 90%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .el-footer {
    height: 10%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 10px;
  }
}
</style>
