<!DOCTYPE html> 
 | 
<html lang="en"> 
 | 
  
 | 
<head> 
 | 
    <meta charset="UTF-8"> 
 | 
    <title>任务管理</title> 
 | 
    <link rel="stylesheet" href="../../static/wcs/css/element.css"> 
 | 
    <script type="text/javascript" src="../../static/wcs/js/jquery/jquery-3.3.1.min.js"></script> 
 | 
    <script type="text/javascript" src="../../static/wms/layui/layui.js"></script> 
 | 
    <script type="text/javascript" src="../../static/wcs/js/common.js"></script> 
 | 
    <script type="text/javascript" src="../../static/wcs/js/vue.min.js"></script> 
 | 
    <script type="text/javascript" src="../../static/wcs/js/element.js"></script> 
 | 
    <script type="text/javascript" src="../../static/wcs/js/xlsx.full.min.js"></script> 
 | 
    <script type="text/javascript" src="../../static/wcs/js/FileSaver.min.js"></script> 
 | 
</head> 
 | 
  
 | 
<body> 
 | 
<div id="app" style="display: flex;justify-content: center;flex-wrap: wrap;"> 
 | 
    <div style="width: 100%;"> 
 | 
        <el-card class="box-card"> 
 | 
            <el-form :inline="true" :model="tableSearchParam" class="demo-form-inline"> 
 | 
                <el-form-item label=""> 
 | 
                    <el-input v-model="tableSearchParam.task_no" placeholder="任务号"></el-input> 
 | 
                </el-form-item> 
 | 
                <el-form-item label=""> 
 | 
                    <el-input v-model="tableSearchParam.wrk_no" placeholder="工作号"></el-input> 
 | 
                </el-form-item> 
 | 
                <el-form-item label=""> 
 | 
                    <el-select v-model="tableSearchParam.status" placeholder="任务状态"> 
 | 
                        <el-option label="接收" value="1"></el-option> 
 | 
                        <el-option label="派发" value="2"></el-option> 
 | 
                        <el-option label="完结" value="5"></el-option> 
 | 
                        <el-option label="取消" value="4"></el-option> 
 | 
                        <el-option label="手动完结" value="7"></el-option> 
 | 
                        <el-option label="出库到输送线" value="9"></el-option> 
 | 
                    </el-select> 
 | 
                </el-form-item> 
 | 
                <el-form-item> 
 | 
                    <el-button type="primary" @click="getTableData">查询</el-button> 
 | 
                    <el-button type="primary" @click="resetParam">重置</el-button> 
 | 
                    <el-button type="primary" @click="exportTable">导出当前页面数据</el-button> 
 | 
                    <el-button type="primary" @click="exportTableAll">导出所有(点击后等待2分钟以上,不要重复点击)</el-button> 
 | 
                </el-form-item> 
 | 
            </el-form> 
 | 
            <el-table ref="singleTable" :data="tableData" style="width: 100%;"> 
 | 
<!--                <el-table-column label="操作" width="100">--> 
 | 
<!--                    <template slot-scope="scope">--> 
 | 
<!--                        <el-dropdown @command="(command)=>{handleCommand(command, scope.row)}">--> 
 | 
<!--                            <el-button icon="el-icon-more" size="mini" type="primary"></el-button>--> 
 | 
<!--                            <el-dropdown-menu slot="dropdown">--> 
 | 
<!--                                <el-dropdown-item command="showCommand">查看指令</el-dropdown-item>--> 
 | 
<!--                            </el-dropdown-menu>--> 
 | 
<!--                        </el-dropdown>--> 
 | 
<!--                    </template>--> 
 | 
<!--                </el-table-column>--> 
 | 
                <el-table-column property="taskNo" label="任务号"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="status$" label="任务状态"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="wrkNo" label="工作号"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="createTime$" label="生成时间"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="modiTime$" label="更新时间"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="assignTime$" label="派发时间"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="executeTime$" label="执行时间"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="completeTime$" label="完结时间"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="cancelTime$" label="取消时间"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="durationTime" label="持续时长"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="ioType$" label="任务类型"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="startPoint" label="起点位置"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="targetPoint" label="终点位置"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="wrkSts$" label="工作状态"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="crnNo" label="巷道号"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="barcode" label="条码"> 
 | 
                </el-table-column> 
 | 
                <el-table-column property="memo" label="备注"> 
 | 
                </el-table-column> 
 | 
            </el-table> 
 | 
  
 | 
            <div style="margin-top: 10px;"> 
 | 
                <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" 
 | 
                               :current-page="currentPage" :page-sizes="pageSizes" :page-size="pageSize" 
 | 
                               layout="total, sizes, prev, pager, next, jumper" :total="pageTotal"> 
 | 
                </el-pagination> 
 | 
            </div> 
 | 
        </el-card> 
 | 
    </div> 
 | 
</div> 
 | 
<script> 
 | 
    var $layui = layui.config({ 
 | 
        base: baseUrl + "/static/wms/layui/lay/modules/" 
 | 
    }).use(['layer', 'form'], function() {}) 
 | 
  
 | 
    var app = new Vue({ 
 | 
        el: '#app', 
 | 
        data: { 
 | 
            tableData: [], 
 | 
            tableDataAll: [], 
 | 
            currentPage: 1, 
 | 
            pageSizes: [16, 30, 50, 100, 150, 200], 
 | 
            pageSize: 16, 
 | 
            pageTotal: 0, 
 | 
            tableSearchParam: { 
 | 
                task_no: null, 
 | 
                status: null, 
 | 
                wrk_no: null 
 | 
            } 
 | 
        }, 
 | 
        created() { 
 | 
            this.init() 
 | 
        }, 
 | 
        methods: { 
 | 
            init() { 
 | 
                let taskNo = getQueryVariable('taskNo') 
 | 
                let wrkNo = getQueryVariable('wrkNo') 
 | 
                if (taskNo != false) { 
 | 
                    this.tableSearchParam.task_no = taskNo 
 | 
                } 
 | 
                if (wrkNo != false) { 
 | 
                    this.tableSearchParam.wrk_no = wrkNo 
 | 
                } 
 | 
  
 | 
                this.getTableData() 
 | 
            }, 
 | 
            getTableData() { 
 | 
                let that = this; 
 | 
                let data = this.tableSearchParam 
 | 
                data.curr = this.currentPage 
 | 
                data.limit = this.pageSize 
 | 
                $.ajax({ 
 | 
                    url: baseUrl + "/taskWrkLog/list/auth", 
 | 
                    headers: { 
 | 
                        'token': localStorage.getItem('token') 
 | 
                    }, 
 | 
                    data: data, 
 | 
                    dataType: 'json', 
 | 
                    contentType: 'application/json;charset=UTF-8', 
 | 
                    method: 'GET', 
 | 
                    success: function(res) { 
 | 
                        if (res.code == 200) { 
 | 
                            that.tableData = res.data.records 
 | 
                            that.pageTotal = res.data.total 
 | 
                        } else if (res.code === 403) { 
 | 
                            top.location.href = baseUrl + "/"; 
 | 
                        } else { 
 | 
                            that.$message({ 
 | 
                                message: res.msg, 
 | 
                                type: 'error' 
 | 
                            }); 
 | 
                        } 
 | 
                    } 
 | 
                }); 
 | 
            }, 
 | 
            executeExportTable() { 
 | 
                // 1. 过滤操作列 
 | 
                const exportData = this.tableData.map(item => { 
 | 
                    const cloned = { ...item } 
 | 
                    delete cloned.operation // 移除操作列关联字段 
 | 
                    return cloned 
 | 
                }) 
 | 
  
 | 
                // 2. 完整字段映射 
 | 
                const headerMap = { 
 | 
                    taskNo: '任务号', 
 | 
                    status: 'status', 
 | 
                    wrkNo: '工作号', 
 | 
                    createTime: 'createTime', 
 | 
                    ioType: 'ioType', 
 | 
                    ioPri: '优先级', 
 | 
                    startPoint: '起点位置', 
 | 
                    targetPoint: '终点位置', 
 | 
                    modiUser: 'modiUser', 
 | 
                    modiTime: 'modiTime', 
 | 
                    memo: '备注', 
 | 
                    barcode: '条码', 
 | 
                    assignTime: 'assignTime', 
 | 
                    executeTime: 'executeTime', 
 | 
                    completeTime: 'completeTime', 
 | 
                    cancelTime: 'cancelTime', 
 | 
                    wrkSts: 'wrkSts', 
 | 
                    crnNo: '堆垛机号', 
 | 
                    commandStep: 'step', 
 | 
                    transferMark: 'mark', 
 | 
                    wrkSts$: '工作状态', 
 | 
                    ioType$: '任务类型', 
 | 
                    status$: '任务状态', 
 | 
                    createTime$: '生成时间', 
 | 
                    modiTime$: '更新时间', 
 | 
                    modiUser$: '更新人员', 
 | 
                    completeTime$: '完结时间', 
 | 
                    executeTime$: '执行时间', 
 | 
                    assignTime$: '派发时间', 
 | 
                    cancelTime$: '取消时间' 
 | 
                    // taskNo: '任务号', 
 | 
                    // status$: '任务状态', 
 | 
                    // wrkNo: '工作号', 
 | 
                    // createTime$: '生成时间', 
 | 
                    // modiTime$: '更新时间', 
 | 
                    // assignTime$: '派发时间', 
 | 
                    // executeTime$: '执行时间', 
 | 
                    // completeTime$: '完结时间', 
 | 
                    // cancelTime$: '取消时间', 
 | 
                    // durationTime: '持续时长', 
 | 
                    // ioType$: '任务类型', 
 | 
                    // startPoint: '起点位置', 
 | 
                    // targetPoint: '终点位置', 
 | 
                    // wrkSts$: '工作状态', 
 | 
                    // crnNo: '堆垛机号', 
 | 
                    // barcode: '条码', 
 | 
                    // memo: '备注' 
 | 
                } 
 | 
  
 | 
                // 3. 创建工作表 
 | 
                const worksheet = XLSX.utils.json_to_sheet(exportData) 
 | 
  
 | 
                // 4. 替换表头为中文 
 | 
                XLSX.utils.sheet_add_aoa(worksheet, [Object.values(headerMap)], { origin: 'A1' }) 
 | 
  
 | 
                // 5. 生成文件名(带日期) 
 | 
                const fileName = `任务列表_${new Date().toLocaleDateString().replace(/\//g, '-')}.xlsx` 
 | 
  
 | 
                // 6. 导出文件 
 | 
                const workbook = XLSX.utils.book_new() 
 | 
                XLSX.utils.book_append_sheet(workbook, worksheet, '任务数据') 
 | 
                XLSX.writeFile(workbook, fileName) 
 | 
            }, 
 | 
            executeExportTableAll() { 
 | 
                let that = this; 
 | 
  
 | 
                $.ajax({ 
 | 
                    url: baseUrl + "/taskWrkLog/export/all/auth", 
 | 
                    headers: { 
 | 
                        'token': localStorage.getItem('token') 
 | 
                    }, 
 | 
                    dataType: 'json', 
 | 
                    contentType: 'application/json;charset=UTF-8', 
 | 
                    method: 'GET', 
 | 
                    success: function(res) { 
 | 
                        if (res.code == 200) { 
 | 
                            that.tableDataAll = res.data.records 
 | 
                            // 1. 过滤操作列 
 | 
                            const exportData = that.tableDataAll.map(item => { 
 | 
                                const cloned = { ...item } 
 | 
                                delete cloned.operation // 移除操作列关联字段 
 | 
                                return cloned 
 | 
                            }) 
 | 
  
 | 
                            // 2. 完整字段映射 
 | 
                            const headerMap = { 
 | 
                                taskNo: '任务号', 
 | 
                                status: '任务状态', 
 | 
                                wrkNo: '工作号', 
 | 
                                createTime: 'createTime', 
 | 
                                ioType: 'ioType', 
 | 
                                ioPri: '优先级', 
 | 
                                startPoint: '起点位置', 
 | 
                                targetPoint: '终点位置', 
 | 
                                modiUser: 'modiUser', 
 | 
                                modiTime: 'modiTime', 
 | 
                                memo: '备注', 
 | 
                                barcode: '条码', 
 | 
                                assignTime: 'assignTime', 
 | 
                                executeTime: 'executeTime', 
 | 
                                completeTime: 'completeTime', 
 | 
                                cancelTime: 'cancelTime', 
 | 
                                wrkSts: 'wrkSts', 
 | 
                                crnNo: '堆垛机号', 
 | 
                                commandStep: 'step', 
 | 
                                transferMark: 'mark', 
 | 
                                wrkSts$: '工作状态', 
 | 
                                ioType$: '任务类型', 
 | 
                                status$: '任务状态', 
 | 
                                createTime$: '生成时间', 
 | 
                                modiTime$: '更新时间', 
 | 
                                modiUser$: '更新人员', 
 | 
                                completeTime$: '完结时间', 
 | 
                                executeTime$: '执行时间', 
 | 
                                assignTime$: '派发时间', 
 | 
                                cancelTime$: '取消时间' 
 | 
                            } 
 | 
  
 | 
                            // 3. 创建工作表 
 | 
                            const worksheet = XLSX.utils.json_to_sheet(exportData) 
 | 
  
 | 
                            // 4. 替换表头为中文 
 | 
                            XLSX.utils.sheet_add_aoa(worksheet, [Object.values(headerMap)], { origin: 'A1' }) 
 | 
  
 | 
                            // 5. 生成文件名(带日期) 
 | 
                            const fileName = `任务列表_${new Date().toLocaleDateString().replace(/\//g, '-')}.xlsx` 
 | 
  
 | 
                            // 6. 导出文件 
 | 
                            const workbook = XLSX.utils.book_new() 
 | 
                            XLSX.utils.book_append_sheet(workbook, worksheet, '任务数据') 
 | 
                            XLSX.writeFile(workbook, fileName) 
 | 
                        } else if (res.code === 403) { 
 | 
                            top.location.href = baseUrl + "/"; 
 | 
                        } else { 
 | 
                            that.$message({ 
 | 
                                message: res.msg, 
 | 
                                type: 'error' 
 | 
                            }); 
 | 
                        } 
 | 
                    } 
 | 
                }); 
 | 
            }, 
 | 
            handleSizeChange(val) { 
 | 
                console.log(`每页 ${val} 条`); 
 | 
                this.pageSize = val 
 | 
                this.getTableData() 
 | 
            }, 
 | 
            handleCurrentChange(val) { 
 | 
                console.log(`当前页: ${val}`); 
 | 
                this.currentPage = val 
 | 
                this.getTableData() 
 | 
            }, 
 | 
            resetParam() { 
 | 
                this.tableSearchParam = { 
 | 
                    task_no: null, 
 | 
                    status: null, 
 | 
                    wrk_no: null 
 | 
                } 
 | 
                this.getTableData() 
 | 
            }, 
 | 
            exportTable() { 
 | 
                this.executeExportTable() 
 | 
            }, 
 | 
            exportTableAll() { 
 | 
                this.executeExportTableAll() 
 | 
            }, 
 | 
            handleCommand(command, row) { 
 | 
                switch (command) { 
 | 
                    case "showCommand": 
 | 
                        //查看指令 
 | 
                        this.showCommand(row) 
 | 
                        break; 
 | 
                } 
 | 
            }, 
 | 
            showCommand(row) { 
 | 
                let wrkNo = row.wrkNo == null ? "" : row.wrkNo 
 | 
                //查看指令 
 | 
                $layui.layer.open({ 
 | 
                    type: 2, 
 | 
                    title: '指令管理', 
 | 
                    maxmin: true, 
 | 
                    area: [top.detailWidth, top.detailHeight], 
 | 
                    shadeClose: true, 
 | 
                    content: 'commandManageLog.html?taskNo=' + row.taskNo + "&wrkNo=" + wrkNo, 
 | 
                    success: function(layero, index) {} 
 | 
                }); 
 | 
            }, 
 | 
        } 
 | 
    }) 
 | 
</script> 
 | 
</body> 
 | 
  
 | 
</html> 
 |