zy-wcs-master.git

			@@ -1,425 +1,421 @@
			<!DOCTYPE html>
			<html lang="en">
			<html lang="zh-CN">
			<head>
			<meta charset="UTF-8">
			<title>任务管理</title>
			<meta name="renderer" content="webkit">
			<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
			<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
			<link rel="stylesheet" href="../../static/vue/element/element.css">
			<link rel="stylesheet" href="../../static/css/cool.css">
			<style>
			:root {
			--card-bg: rgba(255, 255, 255, 0.94);
			--card-border: rgba(216, 226, 238, 0.95);
			--text-main: #243447;
			}

			<head>
			<meta charset="UTF-8">
			<title>任务管理</title>
			<link rel="stylesheet" href="../../static/vue/element/element.css">
			<script type="text/javascript" src="../../static/js/jquery/jquery-3.3.1.min.js"></script>
			<script type="text/javascript" src="../../static/js/common.js?v=20260309_i18n_fix1"></script>
			<script type="text/javascript" src="../../static/vue/js/vue.min.js"></script>
			<script type="text/javascript" src="../../static/vue/element/element.js"></script>
			<style>
			[v-cloak] {
			display: none;
			}
			.el-table .success-row {
			background: #b6ff8e;
			}
			</style>
			</head>
			[v-cloak] {
			display: none;
			}

			<body>
			<div id="app" v-cloak 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.wrk_no" placeholder="工作号"></el-input>
			</el-form-item>
			<el-form-item label="">
			<el-input v-model="tableSearchParam.wms_wrk_no" placeholder="WMS工作号"></el-input>
			</el-form-item>
			<el-form-item label="">
			<el-input v-model="tableSearchParam.source_loc_no" placeholder="源库位"></el-input>
			</el-form-item>
			<el-form-item label="">
			<el-input v-model="tableSearchParam.loc_no" placeholder="目标库位"></el-input>
			</el-form-item>
			<el-form-item label="">
			<el-input v-model="tableSearchParam.crn_no" placeholder="堆垛机"></el-input>
			</el-form-item>
			<el-form-item label="">
			<el-input v-model="tableSearchParam.dual_crn_no" placeholder="双工位堆垛机"></el-input>
			</el-form-item>
			<el-form-item>
			<el-button type="primary" @click="getTableData">查询</el-button>
			<el-button type="primary" @click="resetParam">重置</el-button>
			</el-form-item>
			</el-form>
			<el-table ref="singleTable" :data="tableData" style="width: 100%;">
			<el-table-column property="wrkNo" label="工作号">
			</el-table-column>
			<el-table-column property="wmsWrkNo" label="WMS任务号">
			</el-table-column>
			<el-table-column property="wrkSts$" label="工作状态">
			</el-table-column>
			<el-table-column property="ioType$" label="任务类型">
			</el-table-column>
			<el-table-column property="ioPri" label="优先级">
			</el-table-column>
			<el-table-column property="sourceStaNo" label="源站">
			</el-table-column>
			<el-table-column property="staNo" label="目标站">
			</el-table-column>
			<el-table-column property="sourceLocNo" label="源库位">
			</el-table-column>
			<el-table-column property="locNo" label="目标库位">
			</el-table-column>
			<el-table-column property="modiTime$" label="时间">
			</el-table-column>
			<el-table-column property="barcode" label="托盘码">
			</el-table-column>
			<el-table-column property="crnNo" label="堆垛机">
			</el-table-column>
			<el-table-column property="dualCrnNo" label="双工位堆垛机">
			</el-table-column>
			<el-table-column property="batch" label="批次">
			</el-table-column>
			<el-table-column property="batchSeq" label="批次序列">
			</el-table-column>
			<el-table-column property="systemMsg" label="系统消息">
			</el-table-column>
			<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="change">修改</el-dropdown-item>-->
			<el-dropdown-item command="complete">完成</el-dropdown-item>
			<el-dropdown-item command="cancel">取消</el-dropdown-item>
			<!-- <el-dropdown-item command="shuttleCommand">穿梭车指令</el-dropdown-item>-->
			</el-dropdown-menu>
			</el-dropdown>
			</template>
			</el-table-column>
			</el-table>
			html,
			body {
			margin: 0;
			min-height: 100%;
			color: var(--text-main);
			font-family: "Avenir Next", "PingFang SC", "Microsoft YaHei", sans-serif;
			background:
			radial-gradient(1000px 420px at 0% -10%, rgba(44, 107, 193, 0.12), transparent 56%),
			radial-gradient(900px 400px at 100% 0%, rgba(28, 150, 126, 0.10), transparent 58%),
			linear-gradient(180deg, #f2f6fb 0%, #f8fafc 100%);
			}

			<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>
			.page-shell {
			max-width: 1800px;
			margin: 0 auto;
			padding: 14px;
			box-sizing: border-box;
			}

			<el-dialog :title="shuttleCommandTitle" :visible.sync="shuttleCommandVisible">
			<el-table ref="singleTable" :data="shuttleCommandData.commands" style="width: 100%;" :row-class-name="tableRowClassName">
			<el-table-column property="mode$" label="命令类型">
			</el-table-column>
			<el-table-column property="start" label="起点">
			<template slot-scope="scope">
			<div v-if="scope.row.nodes">
			x:{{ scope.row.nodes[0].x }}
			y:{{ scope.row.nodes[0].y }}
			z:{{ scope.row.nodes[0].z }}
			</div>
			</template>
			</el-table-column>
			<el-table-column property="target" label="终点">
			<template slot-scope="scope">
			<div v-if="scope.row.nodes">
			x:{{ scope.row.nodes[scope.row.nodes.length-1].x }}
			y:{{ scope.row.nodes[scope.row.nodes.length-1].y }}
			z:{{ scope.row.nodes[scope.row.nodes.length-1].z }}
			</div>
			</template>
			</el-table-column>
			<el-table-column property="taskNo" label="任务号">
			</el-table-column>
			<el-table-column property="shuttleNo" label="穿梭车">
			</el-table-column>
			<el-table-column property="complete" label="是否完成">
			<template slot-scope="scope">
			<el-switch
			v-model="scope.row.complete"
			active-color="#13ce66"
			@change="changeComplete(scope)">
			</el-switch>
			</template>
			</el-table-column>
			<el-table-column label="操作" width="100">
			<template slot-scope="scope">
			<el-button @click="shuttleCommandRollback(scope)" size="mini">回退指令</el-button>
			</template>
			</el-table-column>
			</el-table>
			<div slot="footer" class="dialog-footer">
			<el-button @click="shuttleCommandVisible = false">关闭</el-button>
			</div>
			</el-dialog>
			.card-shell {
			position: relative;
			border-radius: 24px;
			border: 1px solid var(--card-border);
			background:
			radial-gradient(760px 220px at -8% 0%, rgba(43, 117, 196, 0.05), transparent 55%),
			radial-gradient(680px 200px at 108% 10%, rgba(24, 150, 129, 0.05), transparent 58%),
			var(--card-bg);
			box-shadow: 0 16px 32px rgba(44, 67, 96, 0.08);
			overflow: hidden;
			}

			</div>
			<script>
			var app = new Vue({
			el: '#app',
			data: {
			tableData: [],
			currentPage: 1,
			pageSizes: [16, 30, 50, 100, 150, 200],
			pageSize: 30,
			pageTotal: 0,
			tableSearchParam: {
			wrk_no: null,
			wms_wrk_no: null,
			},
			shuttleCommandVisible: false,
			shuttleCommandData: {
			assignCommand: {
			commands: []
			},
			commandStep: 0
			},
			shuttleCommandWrkNo: null,
			shuttleCommandLabelWidth: '80px',
			shuttleCommandTitle: ''
			},
			created() {
			this.init()
			},
			methods: {
			init() {
			this.getTableData()
			},
			getTableData() {
			let that = this;
			let data = JSON.parse(JSON.stringify(this.tableSearchParam))
			data.curr = this.currentPage
			data.limit = this.pageSize
			if (this.tableSearchParam.datetime != null) {
			data.datetime = null
			data.create_time = this.tableSearchParam.datetime[0] + " - " + this.tableSearchParam.datetime[1]
			}
			$.ajax({
			url: baseUrl + "/wrkMast/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'
			});
			}
			}
			});
			},
			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()
			},
			handleCommand(command, row) {
			switch (command) {
			case "complete":
			this.completeTask(row)
			break;
			case "cancel":
			this.cancelTask(row)
			break;
			case "shuttleCommand":
			this.showShuttleCommand(row.wrkNo)
			break;
			}
			},
			showShuttleCommand(wrkNo){
			let that = this;
			$.ajax({
			url: baseUrl + "/shuttle/command/query",
			headers: {
			'token': localStorage.getItem('token')
			},
			data: {
			wrkNo: wrkNo
			},
			method: 'GET',
			success: function(res) {
			if (res.code == 200) {
			console.log(res)
			that.shuttleCommandVisible = true;
			that.shuttleCommandData = res.data;
			that.shuttleCommandWrkNo = wrkNo;
			} else if (res.code === 403) {
			top.location.href = baseUrl + "/";
			} else {
			that.$message({
			message: res.msg,
			type: 'error'
			});
			}
			}
			});
			},
			completeTask(row) {
			let that = this
			this.$confirm('确定完成该任务吗？', '提示', {
			confirmButtonText: '确定',
			cancelButtonText: '取消',
			type: 'warning'
			}).then(() => {
			$.ajax({
			url: baseUrl + "/openapi/completeTask",
			contentType: 'application/json',
			headers: {
			'token': localStorage.getItem('token')
			},
			data: JSON.stringify({
			wrkNo: row.wrkNo,
			}),
			method: 'POST',
			success: function(res) {
			if (res.code == 200) {
			that.$message({
			message: "完成成功",
			type: 'success'
			});
			that.getTableData()
			} else if (res.code === 403) {
			top.location.href = baseUrl + "/";
			} else {
			that.$message({
			message: res.msg,
			type: 'error'
			});
			}
			}
			});
			}).catch(() => {
			// this.$message({
			// type: 'info',
			// message: '已取消删除'
			// });
			});
			},
			cancelTask(row) {
			let that = this
			this.$confirm('确定取消该任务吗？', '提示', {
			confirmButtonText: '确定',
			cancelButtonText: '取消',
			type: 'warning'
			}).then(() => {
			$.ajax({
			url: baseUrl + "/openapi/cancelTask",
			contentType: 'application/json',
			headers: {
			'token': localStorage.getItem('token')
			},
			data: JSON.stringify({
			wrkNo: row.wrkNo,
			}),
			method: 'POST',
			success: function(res) {
			if (res.code == 200) {
			that.$message({
			message: "取消成功",
			type: 'success'
			});
			that.getTableData()
			} else if (res.code === 403) {
			top.location.href = baseUrl + "/";
			} else {
			that.$message({
			message: res.msg,
			type: 'error'
			});
			}
			}
			});
			}).catch(() => {
			// this.$message({
			// type: 'info',
			// message: '已取消删除'
			// });
			});
			},
			tableRowClassName({row, rowIndex}) {
			if (rowIndex === this.shuttleCommandData.commandStep) {
			return 'success-row';
			}
			return '';
			},
			shuttleCommandRollback(scope) {
			let that = this;
			let idx = scope.$index;
			$.ajax({
			url: baseUrl + "/shuttle/command/rollback",
			headers: {
			'token': localStorage.getItem('token')
			},
			data: {
			wrkNo: that.shuttleCommandWrkNo,
			commandStep: idx
			},
			method: 'GET',
			success: function(res) {
			if (res.code == 200) {
			that.showShuttleCommand(that.shuttleCommandWrkNo)
			} else if (res.code === 403) {
			top.location.href = baseUrl + "/";
			} else {
			that.$message({
			message: res.msg,
			type: 'error'
			});
			}
			}
			});
			},
			changeComplete(scope) {
			let that = this;
			let idx = scope.$index;
			$.ajax({
			url: baseUrl + "/shuttle/command/completeSwitch",
			headers: {
			'token': localStorage.getItem('token')
			},
			data: {
			wrkNo: that.shuttleCommandWrkNo,
			commandStep: idx,
			complete: scope.row.complete ? 1 : 0
			},
			method: 'GET',
			success: function(res) {
			if (res.code == 200) {
			that.showShuttleCommand(that.shuttleCommandWrkNo)
			} else if (res.code === 403) {
			top.location.href = baseUrl + "/";
			} else {
			that.$message({
			message: res.msg,
			type: 'error'
			});
			}
			}
			});
			}
			},
			})
			</script>
			</body>
			.list-toolbar {
			padding: 12px 16px 10px;
			border-bottom: 1px solid rgba(222, 230, 239, 0.92);
			}

			.toolbar-main {
			display: flex;
			align-items: flex-start;
			justify-content: space-between;
			gap: 8px;
			flex-wrap: wrap;
			}

			.toolbar-left {
			flex: 1 1 980px;
			display: flex;
			align-items: center;
			gap: 8px;
			flex-wrap: wrap;
			}

			.toolbar-search {
			flex: 1 1 auto;
			display: flex;
			align-items: center;
			gap: 8px;
			flex-wrap: wrap;
			}

			.toolbar-search-item {
			flex: 0 0 148px;
			min-width: 148px;
			}

			.toolbar-search-item.keyword {
			flex: 0 0 220px;
			min-width: 220px;
			}

			.toolbar-query-actions,
			.toolbar-ops {
			display: flex;
			gap: 8px;
			flex-wrap: wrap;
			}

			.toolbar-ops {
			justify-content: flex-end;
			}

			.list-toolbar .el-input__inner,
			.advanced-panel .el-input__inner {
			height: 32px;
			line-height: 32px;
			}

			.list-toolbar .el-input__icon,
			.advanced-panel .el-input__icon {
			line-height: 32px;
			}

			.list-toolbar .el-button,
			.advanced-panel .el-button {
			padding: 8px 12px;
			border-radius: 8px;
			}

			.advanced-panel {
			padding: 10px 16px 12px;
			border-bottom: 1px solid rgba(222, 230, 239, 0.92);
			background: rgba(248, 251, 254, 0.78);
			}

			.advanced-grid {
			display: grid;
			grid-template-columns: repeat(4, minmax(0, 1fr));
			gap: 8px;
			}

			.advanced-item {
			min-width: 0;
			}

			.table-wrap {
			padding: 10px 16px;
			}

			.table-shell {
			border-radius: 20px;
			overflow: hidden;
			border: 1px solid rgba(217, 227, 238, 0.98);
			background: rgba(255, 255, 255, 0.95);
			}

			.table-shell .el-table {
			border-radius: 20px;
			overflow: hidden;
			}

			.table-shell .el-table th {
			background: #f7fafc;
			color: #53677d;
			font-weight: 700;
			}

			.table-shell .el-table .success-row > td {
			background: rgba(101, 198, 141, 0.14);
			}

			.payload-cell {
			display: inline-block;
			max-width: 280px;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			}

			.pager-bar {
			padding: 0 16px 16px;
			display: flex;
			align-items: center;
			justify-content: flex-end;
			}

			.column-popover {
			max-width: 320px;
			}

			.column-popover-head {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 12px;
			margin-bottom: 10px;
			font-size: 13px;
			font-weight: 700;
			color: var(--text-main);
			}

			.column-list {
			display: grid;
			grid-template-columns: repeat(2, minmax(0, 1fr));
			gap: 8px 10px;
			max-height: 280px;
			overflow: auto;
			padding-right: 4px;
			}

			.row-action-trigger {
			min-width: 72px;
			display: inline-flex;
			align-items: center;
			justify-content: center;
			}

			@media (max-width: 1600px) {
			.advanced-grid {
			grid-template-columns: repeat(3, minmax(0, 1fr));
			}
			}

			@media (max-width: 1280px) {
			.advanced-grid {
			grid-template-columns: repeat(2, minmax(0, 1fr));
			}
			}

			@media (max-width: 900px) {
			.page-shell {
			padding: 10px;
			}

			.list-toolbar,
			.advanced-panel,
			.table-wrap,
			.pager-bar {
			padding-left: 12px;
			padding-right: 12px;
			}

			.toolbar-search-item,
			.toolbar-search-item.keyword {
			flex: 1 1 100%;
			min-width: 100%;
			}

			.advanced-grid {
			grid-template-columns: 1fr;
			}
			}
			</style>
			</head>
			<body>
			<div id="app" class="page-shell" v-cloak>
			<section class="card-shell">
			<div class="list-toolbar">
			<div class="toolbar-main">
			<div class="toolbar-left">
			<div class="toolbar-search">
			<div class="toolbar-search-item keyword">
			<el-input
			v-model.trim="searchForm.condition"
			clearable
			size="small"
			placeholder="请输入关键字"
			@keyup.enter.native="handleSearch">
			</el-input>
			</div>
			<div class="toolbar-search-item">
			<el-input
			v-model.trim="searchForm.wrk_no"
			clearable
			size="small"
			placeholder="工作号"
			@keyup.enter.native="handleSearch">
			</el-input>
			</div>
			<div class="toolbar-search-item">
			<el-input
			v-model.trim="searchForm.wms_wrk_no"
			clearable
			size="small"
			placeholder="WMS任务号"
			@keyup.enter.native="handleSearch">
			</el-input>
			</div>
			<div class="toolbar-search-item">
			<el-input
			v-model.trim="searchForm.loc_no"
			clearable
			size="small"
			placeholder="目标库位"
			@keyup.enter.native="handleSearch">
			</el-input>
			</div>
			<div class="toolbar-query-actions">
			<el-button size="small" type="primary" icon="el-icon-search" @click="handleSearch">搜索</el-button>
			<el-button size="small" plain icon="el-icon-refresh-left" @click="handleReset">重置</el-button>
			<el-button size="small" plain :icon="advancedVisible ? 'el-icon-arrow-up' : 'el-icon-arrow-down'" @click="toggleAdvanced">
			{{ advancedVisible ? '收起' : '筛选' }}
			</el-button>
			</div>
			</div>
			</div>
			<div class="toolbar-ops">
			<el-popover
			v-model="columnPopoverVisible"
			placement="bottom-end"
			width="320"
			trigger="click"
			popper-class="column-popover">
			<div class="column-popover-head">
			<span>列设置</span>
			<div>
			<el-button type="text" size="mini" @click="showAllColumns">全选</el-button>
			<el-button type="text" size="mini" @click="resetColumns">重置</el-button>
			</div>
			</div>
			<div class="column-list">
			<el-checkbox
			v-for="column in columnDefs"
			:key="'column-' + column.key"
			:value="isColumnVisible(column.key)"
			@change="toggleColumn(column.key, $event)">
			{{ column.label }}
			</el-checkbox>
			</div>
			<el-button slot="reference" size="small" plain icon="el-icon-setting">列设置</el-button>
			</el-popover>
			<el-button size="small" plain icon="el-icon-refresh" :loading="loading" @click="loadList">刷新</el-button>
			</div>
			</div>
			</div>

			<div v-show="advancedVisible" class="advanced-panel">
			<div class="advanced-grid">
			<div class="advanced-item">
			<el-input
			v-model.trim="searchForm.source_loc_no"
			clearable
			size="small"
			placeholder="源库位"
			@keyup.enter.native="handleSearch">
			</el-input>
			</div>
			<div class="advanced-item">
			<el-input
			v-model.trim="searchForm.crn_no"
			clearable
			size="small"
			placeholder="堆垛机"
			@keyup.enter.native="handleSearch">
			</el-input>
			</div>
			<div class="advanced-item">
			<el-input
			v-model.trim="searchForm.dual_crn_no"
			clearable
			size="small"
			placeholder="双工位堆垛机"
			@keyup.enter.native="handleSearch">
			</el-input>
			</div>
			</div>
			</div>

			<div class="table-wrap">
			<div class="table-shell">
			<el-table
			ref="dataTable"
			:key="tableRenderKey"
			v-loading="loading"
			:data="tableData"
			border
			stripe
			:height="tableHeight"
			@sort-change="handleSortChange">
			<el-table-column
			v-for="column in visibleColumns"
			:key="column.key"
			:prop="column.prop"
			:label="column.label"
			:width="column.width"
			:min-width="column.minWidth"
			:sortable="column.sortable ? 'custom' : false"
			:show-overflow-tooltip="column.showOverflow !== false"
			:align="column.align \|\| 'left'">
			<template v-if="column.key === 'systemMsg'" slot-scope="scope">
			<span class="payload-cell">{{ scope.row.systemMsg \|\| '--' }}</span>
			</template>
			</el-table-column>
			<el-table-column label="操作" fixed="right" width="100" align="center">
			<template slot-scope="scope">
			<el-dropdown trigger="click" @command="handleRowCommand($event, scope.row)">
			<el-button size="mini" plain class="row-action-trigger">
			操作<i class="el-icon-arrow-down el-icon--right"></i>
			</el-button>
			<el-dropdown-menu slot="dropdown">
			<el-dropdown-item command="complete">完成任务</el-dropdown-item>
			<el-dropdown-item command="cancel" divided>取消任务</el-dropdown-item>
			</el-dropdown-menu>
			</el-dropdown>
			</template>
			</el-table-column>
			</el-table>
			</div>
			</div>

			<div class="pager-bar">
			<el-pagination
			background
			:current-page="currentPage"
			:page-size="pageSize"
			:page-sizes="pageSizes"
			layout="total, sizes, prev, pager, next, jumper"
			:total="pageTotal"
			@size-change="handleSizeChange"
			@current-change="handleCurrentChange">
			</el-pagination>
			</div>
			</section>
			</div>
			</body>
			<script type="text/javascript" src="../../static/js/jquery/jquery-3.3.1.min.js"></script>
			<script type="text/javascript" src="../../static/js/common.js?v=20260309_i18n_fix1"></script>
			<script type="text/javascript" src="../../static/vue/js/vue.min.js"></script>
			<script type="text/javascript" src="../../static/vue/element/element.js"></script>
			<script type="text/javascript" src="../../static/js/wrkMast/wrkMast.js?v=20260311_wrk_mast_vue"></script>
			</html>