<template>
  <el-config-provider :locale="localLanguage">
      <div  style="width: calc(100vw - 300px)">
          <div style="border-radius: 5px; border: #2c3e5033 solid 1px; padding: 10px; calc(100vw - 300px)">
              <el-row>
                  <el-button type="primary" @click="queryGoodsOrderCheck">查询盘点单</el-button>
                  <el-button type="success" @click="downInventoryTask">下发盘点任务</el-button>
                </el-row>
          </div>
      <div>
          <el-row style="width: calc(100vw - 300px)">
              <h5>盘点单</h5>
              <el-table :data="goodsInventoryList" border stripe max-height="calc(100vh - 550px)">
                  <el-table-column fixed prop="recordId" label="记录号" width="210px" align="center" show-overflow-tooltip/>
                  <el-table-column fixed prop="checkId" label="盘点单号" width="210px" align="center" show-overflow-tooltip/>
                  <el-table-column fixed prop="warehouse" label="盘点库别" width="210px" align="center" show-overflow-tooltip/>
                  <el-table-column prop="status" label="盘点单状态" width="210px" align="center" show-overflow-tooltip/>
                  <el-table-column prop="createTime" label="创建时间" width="210px" align="center" show-overflow-tooltip/>
                  <el-table-column prop="completeTime" label="完成时间" width="210px" align="center" show-overflow-tooltip/>
                  <el-table-column prop="remark" label="备注" show-overflow-tooltip min-width="120px" fixed="right"/>
                  <el-table-column fixed="right" label="操作" align="center" width="180">
                      <template #default="scope">
                          <el-button-group class="ml-4">
                              <el-tooltip content="执行盘点" placement="top" effect="light">
                                  <el-button type="success" size="small" @click="executeCheck(scope.row)">
                                      <el-icon><Check /></el-icon>
                                  </el-button>
                              </el-tooltip>
                              <el-tooltip content="删除" placement="top" effect="light">
                                <el-button type="danger" size="small" @click="deleteCheck(scope.row)">
                                  <el-icon><Delete/></el-icon>
                                </el-button>
                              </el-tooltip>
                          </el-button-group>
                      </template>
                  </el-table-column>
              </el-table>
          </el-row>
      </div>
      </div>
  </el-config-provider>
</template>

<script setup>
import store from '@/store'
import { sendInventoryTask, finishPicking, getTasks, getTaskByTask, sendBoxArrive } from '@/api/task'
import { queryPartNo } from '@/api/goods'
import { taskStatusFormatter, dueFormatter } from '@/utils/formatter.js'
import { reactive, ref } from 'vue'
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
import OrderCheck from '@/api/order.in'
import {ElMessage, ElMessageBox} from 'element-plus'


</script>

<script>
export default {
    name: 'inventory',
    data() {
        return {
            searchParams: {
            searchStr: '',
            orderStatus: [0]
          },
          // 下发盘点任务
            remarkR:{
              remarkReturn: "盘点回库"
          },
            goodsInventoryList: []
        }
    },
    methods: {
      queryGoodsOrderCheck(){
            OrderCheck.getOrderCheckList(this.searchParams).then(res => {
                const responseData = res.data;
                if (responseData.code === 0) {
                    // 正确请求
                    ElMessage({
                      message: '查询成功',
                      type: 'success',
                    });
                    this.goodsInventoryList = responseData['returnData'];
                } else {
                    // 服务报错
                    ElMessageBox.alert(`服务器返回失败：${responseData.message}`, '查询失败', {
                      type: 'warning',
                      confirmButtonText: '确定',
                      showClose: false
                    }).catch(err => {
                        ElMessageBox.alert(`请求服务器失败：：${err}`, '任务添加失败', {
                          type: 'warning',
                          confirmButtonText: '确定'
                        })
                    })
                }
            })
        },
        downInventoryTask(){
          ElMessageBox.confirm(`是否下发一个盘点任务?`, '提示')
          .then(() => {
            OrderCheck.downInventoryTask().then(res => {
              const responseData = res.data;
              if (responseData.code === 1) {
                // 正确请求
                ElMessage({
                  message: '执行成功',
                  type: 'success',
                });
                this.queryGoodsOrderCheck();
              } else {
                // 服务报错
                ElMessageBox.alert(`服务器返回失败：${responseData.message}`, '执行失败', {
                  type: 'warning',
                  confirmButtonText: '确定',
                  showClose: false
                })
              }
            }).catch(err => {
              // 通讯报错
              ElMessageBox.alert(`请求服务器失败：：${err}`, '任务添加失败', {
                type: 'warning',
                confirmButtonText: '确定'
              })
            })
          })
          .catch(() => {
          })
        },
        executeCheck(row){
          ElMessageBox.confirm(`是否执行 ${row.recordId} 的盘点?`, '提示')
          .then(() => {
            OrderCheck.executeCheck(row.recordId).then(res => {
              const responseData = res.data;
              if (responseData.code === 1) {
                // 正确请求
                ElMessage({
                  message: '执行成功',
                  type: 'success',
                });
                this.queryGoodsOrderCheck();
              } else {
                // 服务报错
                ElMessageBox.alert(`服务器返回失败：${responseData.message}`, '执行失败', {
                  type: 'warning',
                  confirmButtonText: '确定',
                  showClose: false
                })
              }
            }).catch(err => {
              // 通讯报错
              ElMessageBox.alert(`请求服务器失败：：${err}`, '任务添加失败', {
                type: 'warning',
                confirmButtonText: '确定'
              })
            })
          })
          .catch(() => {
          })
        },
        deleteCheck(row) {
        ElMessageBox.confirm('是否删除该出库单？','提示')
        .then(() => {
          OrderCheck.deleteCheckList(row.recordId).then(res => {
            const responseData = res.data;
            if (responseData.code === 0) {
              // 正确请求
              ElMessage({
                message: '删除成功',
                type: 'success',
              });
              this.queryGoodsOrderCheck();
            } else {
              // 服务报错
              ElMessageBox.alert(`服务器返回失败：${responseData.message}`, '删除失败', {
                type: 'warning',
                confirmButtonText: '确定',
                showClose: false
              })
            }
          }).catch(err => {
            // 通讯报错
            ElMessageBox.alert(`请求服务器失败：：${err}`, '任务删除失败', {
              type: 'warning',
              confirmButtonText: '确定'
            })
          })
        })
        .catch(() => {
        })
      }
    }
}
</script>

<style scoped>
.content {
    display: flex;
    width: 100%;
}

.el-row .el-form-item {
    width: 30% inherit;
    justify-content: center;
}

.btn-area .el-form-item {
    width: 30% inherit;
    padding-left: 15px;
}

.el-row .el-form-item .el-select-v2 {
    width: 100% !important;
}

.el-row .el-form-item .el-select {
    width: 100% !important;
}

.el-row .el-form-item .el-input-number {
    width: 100% !important;
}

.el-row .el-form-item .el-button {
    margin: auto;
}

.right {
    width: 40%;
    padding: 5px;
}

.left {
    width: 60%;
    padding: 5px;
}

.input-area {
    margin: auto;
    max-width: inherit;
    height: 300px;
    border: solid 1px;
    border-radius: 10px;
    box-shadow: 0px 15px 10px -15px #000;
}

.display-area {
    margin: auto;
    min-width: inherit;
    height: 632px;
    border: solid 1px;
    border-radius: 10px;
    box-shadow: 0px 15px 10px -15px #000;
}

.table-class {
    width: 100%;
}
</style>