<template>
    <div class="page-container row-container">
        <!-- 左侧区域 -->
        <section class="list-part-container" style="flex: 3">
            <!-- 搜索区 -->
            <el-form class="list-search-container" :model="queryParams" ref="queryRef" :inline="true"
                style="margin-right: 0px">
                <el-form-item class="section-title" label="报工日报" />
                <el-form-item label="产品描述：">
                    <el-input placeholder="请输入产品描述" v-model.trim="queryParams.productDescription" @keydown.enter.prevent @blur="handleTrimQuarms"
                        clearable style="width: 130px" />
                </el-form-item>
                <el-form-item label="批次号：">
                    <el-input placeholder="请输入批次号" v-model.trim="queryParams.lotCode" @keydown.enter.prevent clearable @blur="handleTrimQuarms"
                        style="width: 130px" />
                </el-form-item>
                <el-form-item label="员工姓名：">
                    <el-input placeholder="请输入姓名" v-model.trim="queryParams.nickName" @keydown.enter.prevent clearable @blur="handleTrimQuarms"
                        style="width: 96px" />
                </el-form-item>
                <el-form-item label="箱号：">
                    <el-input placeholder="请输入箱号" v-model.trim="queryParams.originalCarrier" @keydown.enter.prevent @blur="handleTrimQuarms"
                        clearable style="width: 96px" />
                </el-form-item>
                <el-form-item class="section-title" label="请选择当前工段：">
                    <el-select-v2 v-model="queryParams.deptId" :options="deptList" placeholder="请选择工段"
                        style="width: 120px" @change="handleDeptChange" />
                </el-form-item>
                <el-form-item label="时间：">
                    <el-date-picker v-model="queryParams.startTime" type="date" value-format="YYYY-MM-DD"
                        :editable="false" clearable placeholder="请选择" style="width: 136px" @change="handleDateChange" />
                    <span>到</span>
                    <el-date-picker v-model="queryParams.endTime" type="date" value-format="YYYY-MM-DD"
                        :editable="false" clearable placeholder="请选择" style="width: 136px" @change="handleDateChange" />
                </el-form-item>
                <el-form-item style="margin-left: 0">
                    <el-button type="info" icon="Search" @click="handleQuery">搜索
                    </el-button>
                    <el-button type="success" icon="Download" @click="handleExport">导出</el-button>
                </el-form-item>
            </el-form>
            <div class="el-table-container">
                <div class="el-table-inner-container">
                    <el-table ref="dayworkTable" :data="dayworkItemList" v-loading="dayworkLoading"
                        highlight-current-row height="100%">
                        <el-table-column label="批次号" prop="lotCode" width="140" align="center" />
                        <el-table-column label="产品描述" prop="productDescription" align="center" />
                        <el-table-column label="图纸版本" prop="technologyVersion" width="60" align="center" />
                        <el-table-column label="工序名称" prop="processAlias" width="150" align="center" />
                        <el-table-column label="机床号" prop="equipmentDetailCode" width="100" align="center" />
                        <el-table-column label="投产量" prop="prodNum" width="60" align="center" />
                        <el-table-column label="合格数" prop="qualifiedNum" width="60" align="center" />
                        <el-table-column label="废品数" prop="rejectNum" width="60" align="center" />
                        <el-table-column label="开始时间" prop="startTime" width="160" align="center" />
                        <el-table-column label="结束时间" prop="endTime" width="160" align="center" />
                        <el-table-column label="总工时" prop="workingHours" width="160" align="center" />
                        <el-table-column label="生产状态" prop="status" width="100" align="center">
                            <template #default="scope">
                                <dict-tag :options="daywork_status" :value="scope.row.status" />
                            </template>
                        </el-table-column>
                        <el-table-column label="箱号" prop="originalCarrier" align="center">
                            <template v-slot:header>
                                箱号
                                <el-popover placement="top-start" effect="dark" trigger="hover"
                                    content="显示批次最新箱号，会根据实际情况变动">
                                    <template #reference>
                                        <el-icon>
                                            <QuestionFilled />
                                        </el-icon>
                                    </template>
                                </el-popover>
                            </template>
                        </el-table-column>
                        <el-table-column label="操作者" prop="nickName" width="100" align="center" />
                    </el-table>
                </div>
            </div>
            <!-- 分页 -->
            <pagination v-show="itemTotal > 0" :total="itemTotal" v-model:page="queryParams.pageNum"
                v-model:limit="queryParams.pageSize" @pagination="getDayworkItems" />
        </section>
        <!-- 右侧区域 -->


    </div>
</template>

<script setup name="Report">
import {
    listReportItem,
    delDayworkItem
} from "@/api/business/daywork.js";
import { listDeptProcess } from "@/api/business/deptProcess";
import { getDeptList } from "@/api/business/planDetailSubDetail.js";
import queryStore from "@/store/modules/query";
import router from "@/router";

const { proxy } = getCurrentInstance();

/** 字典 */
const { daywork_status } = proxy.useDict("daywork_status");

/** 生产批次 */
const dayworkTable = ref(null);
const currentDaywork = ref({});
const dayworkLoading = ref(false);
const total = ref(0);
/**工段 */
const deptList = ref([]);
const loading = ref(false);
/** 报工信息 */
const dayworkItemList = ref([]);
const dayworkItemLoading = ref(false);
const itemTotal = ref(0);
const lastStatus = ref(null)
const latestProcessId = ref(null);
const latestDeptId = ref(null)
const isDispatch = ref(false);
const deptProcessList = ref([]);
/**工序 */
const processList = ref([]);

const queryParams = ref({
    dayworkId: "0",
    isAmend: 0,
    isWasteRecycling: 0,
    pageNum: 1,
    pageSize: 10,
    technologicalProcessDetailId: null,
});

/***********************  工段相关事件  ****************************/
function getList() {
    getNowDate();
    loading.value = true;
    getDeptList().then((response) => {
        deptList.value = response.data.rows;
        isDispatch.value = response.data.others.isDispatch;
        loading.value = false;
        if (isDispatch.value) {
            deptList.value.unshift({ label: "全部", value: "0" });
        }
        queryParams.value.deptId = deptList.value[0].value;
        getDayworkItems();
    });
}
function getNowDate() {
    //   var nowDate = new Date();
    //   var date = {
    //     year: nowDate.getFullYear(),
    //     month: nowDate.getMonth() + 1,
    //     day: nowDate.getDate(),
    //   };
    //   const dayDate =
    //     date.year +
    //     "-" +
    //     (date.month >= 10 ? date.month : "0" + date.month) +
    //     "-" +
    //     (date.day >= 10 ? date.day : "0" + date.day);
    //   console.log(dayDate);
    //   queryParams.value.startTime = dayDate;
    //   queryParams.value.endTime = dayDate;
    queryParams.value.startTime = proxy.moment().format("YYYY-MM-DD")
    queryParams.value.endTime = proxy.moment().format("YYYY-MM-DD")
}


//切换工段
function handleDeptChange() {
    getDayworkItems();
}






/***********************  报工信息相关事件  ****************************/

function handleDateChange() {
    console.log(queryParams.value.startTime);
    console.log(queryParams.value.endTime);
}
function handleTrimQuarms(){
  queryParams.value.lotCode = queryParams.value.lotCode !=null&&queryParams.value.lotCode !=""?queryParams.value.lotCode.trim():null;
  queryParams.value.productDescription = queryParams.value.productDescription !=null&&queryParams.value.productDescription !=""?queryParams.value.productDescription.trim():null;
  queryParams.value.nickName = queryParams.value.nickName !=null&&queryParams.value.nickName !=""?queryParams.value.nickName.trim():null;
  queryParams.value.originalCarrier = queryParams.value.originalCarrier !=null&&queryParams.value.originalCarrier !=""?queryParams.value.originalCarrier.trim():null;
}

/**切换工序 */
function handleProcessChange() {
    getDayworkItems();
}

/** 报工详情列表 */
function getDayworkItems() {

    const listQueryParams = queryStore().reportParams;
    if (listQueryParams != null) {
        queryParams.value = listQueryParams;
    }
    if (queryParams.value.startTime != null) {
        // queryParams.value.startTime = queryParams.value.startTime + " 00:00:00";
        queryParams.value.startTime = proxy.moment(queryParams.value.startTime).format('YYYY-MM-DD 00:00:00')
    }
    if (queryParams.value.endTime != null) {
        // queryParams.value.endTime = queryParams.value.endTime + " 23:59:59";
        queryParams.value.endTime = proxy.moment(queryParams.value.endTime).format('YYYY-MM-DD 23:59:59')
    }
    dayworkItemLoading.value = true;
    console.log(queryParams.value);
    //查询该工段在工段资源分配时绑定的工序，传一个flag，如果flag有值则后端查询不分页
    listDeptProcess({ deptId: queryParams.value.deptId, flag: 1 }).then(
        (res) => {
            deptProcessList.value = res.rows;
        }
    );
    listReportItem(queryParams.value).then((res) => {
        console.log(res)
        for (let i = 0; i < res.rows.length; i++) {
            //如果时首序，投产数是单批数
            if (res.rows[i].prodNum == 0) {
                if (currentDaywork.value.isLast == 1) {
                    res.rows[i].prodNum = currentDaywork.value.lastLotQuantity;
                } else {
                    res.rows[i].prodNum = currentDaywork.value.oneLotQuantity;
                }
            }
            //拿到最新一条报工信息的工序id，只能编辑当前序
            // if (res.rows[i] == res.rows[res.rows.length - 1]) {
            //   latestProcessId.value = res.rows[i].processId;
            // }
        }
        if (res.others != null && res.others.latestProcessId != null) {
            latestProcessId.value = res.others.latestProcessId
        }
        if (res.others != null && res.others.lastItem != null) {
            latestDeptId.value = res.others.lastItem.deptId
            lastStatus.value = res.others.lastItem.status
        }
        for (var i = 0; i < res.rows.length; i++) {
            let timeStamp = res.rows[i].workingHours;
            let seconds = Math.floor((timeStamp / 1000) % 60);
            let minutes = Math.floor((timeStamp / (1000 * 60)) % 60);
            let hours = Math.floor(timeStamp / (1000 * 60 * 60));
            let time = `${hours}小时${minutes}分钟${seconds}秒`;
            res.rows[i].workingHours = time;
            res.rows[i].deptProcessStatus = false;

        }
        dayworkItemList.value = res.rows;
        itemTotal.value = res.total;
        dayworkItemLoading.value = false;
    });
}
/** 导出按钮操作 */
function handleExport() {
    proxy.download('/ezhizao-dms-production/business/productionDaywork/download', {
        ...queryParams.value
    }, `报工日报${new Date().getTime()}.xlsx`)
}
/** 搜索按钮操作 */
function handleQuery() {
    const listQueryParams = JSON.parse(JSON.stringify(queryParams.value));
    queryStore().setReportParams(listQueryParams);
    getDayworkItems();
}

onMounted(() => {
    getList();
});
</script>
<style scoped>
.el-form--inline .el-form-item {
    margin-right: 20px;
}
</style>