nrwms_web/src/views/business-data/businessTask/agvTask.vue

380 lines
14 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="app-container">
<!--工具栏-->
<div class="head-container">
<div v-if="crud.props.searchToggle" type="flex">
<!-- 搜索 -->
<div>
<label class="el-form-item-label">创建日期</label>
<date-range-picker v-model="query.createTime" style="width: 365px;" class="filter-item"/>
<el-input
v-model="query.stockCode"
clearable
placeholder="请输入容器编码"
style="width: 170px;"
class="filter-item"
@keyup.enter.native="crud.toQuery"/>
<el-input v-model="query.startSlotCode" clearable placeholder="起点位置" style="width: 170px;"
class="filter-item" @keyup.enter.native="crud.toQuery"/>
<el-input v-model="query.endSlotCode" clearable placeholder="终点位置" style="width: 140px;"
class="filter-item" @keyup.enter.native="crud.toQuery"/>
</div>
<div>
<el-input
v-model="query.id"
clearable
placeholder="请输入任务序号"
style="width: 140px;"
class="filter-item"
@keyup.enter.native="crud.toQuery"/>
<el-input
v-model="query.jobForce"
clearable
placeholder="请输入任务组号"
style="width: 140px;"
class="filter-item"
@keyup.enter.native="crud.toQuery"/>
<el-select v-model="query.status" clearable multiple placeholder="请选择" style="width: 170px;"
class="filter-item"
@keyup.enter.native="crud.toQuery">
<el-option
v-for="taskStatus in dict.task_status"
:key="taskStatus.id"
:label="taskStatus.label"
:value="taskStatus.value"
/>
</el-select>
<el-select v-model="query.type" clearable placeholder="请选择" style="width: 170px;" class="filter-item"
@keyup.enter.native="crud.toQuery">
<el-option
v-for="taskType in dict.task_type"
:key="taskType.id"
:label="taskType.label"
:value="taskType.value"
/>
</el-select>
<rrOperation :crud="crud"/>
<!-- 重置-->
<el-button class="filter-item" size="mini" type="warning" icon="el-icon-refresh-left" @click="resetQuery">重置
</el-button>
</div>
</div>
<div class="statusButton" style="border-bottom: solid lightgray 1px;">
<el-radio-group v-model="radio3" @change="clickChange" size="small">
<el-radio-button label="全部"> 全部</el-radio-button>
<el-radio-button label="货架">货架</el-radio-button>
<el-radio-button label="料箱">料箱</el-radio-button>
<el-radio-button label="滚筒">滚筒</el-radio-button>
</el-radio-group>
</div>
<!--如果想在工具栏加入更多按钮,可以使用插槽方式, slot = 'left' or 'right'-->
<crudOperation :permission="permission" :tableKey="this.$options.name"/>
<!-- 顶升 -->
<el-dialog title="顶升" :visible.sync="agvTaskCallbackStatus" width="400px">
<el-form ref="form1" :model="form1" :rules="rules" size="small" label-width="80px">
<el-form-item label="容器号" prop="boxCode">
<el-input v-model="form1.boxCode" style="width: 200px;"/>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="agvTaskCallbackStatus = false">取 消</el-button>
<el-button type="primary" @click="agvTaskCallbackMethod()">确 定</el-button>
</span>
</el-dialog>
<!--表单组件-->
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0"
:title="crud.status.title" width="500px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="容器编码" prop="stockCode">
<el-input v-model="form.stockCode" style="width: 370px;"/>
</el-form-item>
<el-form-item label="容器类型" prop="stockTypeCode">
<el-input v-model="form.stockTypeCode" style="width: 370px;"/>
</el-form-item>
<el-form-item label="起点位置" prop="startSlotCode">
<el-input v-model="form.startSlotCode" style="width: 370px;"/>
</el-form-item>
<el-form-item label="终点位置" prop="endSlotCode">
<el-input v-model="form.endSlotCode" style="width: 370px;"/>
</el-form-item>
<el-form-item label="容器当前位置" prop="slotCode">
<el-input v-model="form.slotCode" style="width: 370px;"/>
</el-form-item>
<el-form-item label="任务状态" prop="status">
<el-select v-model="form.status" filterable placeholder="请选择">
<el-option
v-for="item in dict.task_status"
:key="item.id"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="任务类型">
<el-input v-model="form.type" style="width: 370px;"/>
</el-form-item>
<el-form-item label="工作类型" prop="jobType">
<el-input v-model="form.jobType" style="width: 370px;"/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="text" @click="crud.cancelCU">取消</el-button>
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
</div>
</el-dialog>
<!--表格渲染-->
<el-table
ref="table"
v-loading="crud.loading"
:data="crud.data"
size="small"
height="58vh"
style="width: 100%;"
:default-sort="{prop: 'id', order: 'descending'}"
@selection-change="crud.selectionChangeHandler">
<el-table-column type="selection" width="55"/>
<el-table-column prop="id" label="任务序号" v-if="this.radio3=='货架' || this.radio3=='全部'"/>
<!-- <el-table-column prop="jobForce" width="160" label="任务组号" v-if="this.radio3!='货架' "/>-->
<el-table-column prop="stockTypeCode" width="170" label="容器类型"/>
<el-table-column prop="startSlotCode" label="起点位置" width="130"/>
<el-table-column prop="endSlotCode" label="终点位置" width="130" sortable :formatter="formatter"/>
<el-table-column prop="status" label="任务状态">
<template slot-scope="scope">
{{ dict.label.task_status[scope.row.status] }}
</template>
</el-table-column>
<el-table-column prop="type" label="任务类型">
<template slot-scope="scope">
<span v-if="dict.label.task_type[scope.row.type] ==null">{{ scope.row.type }}</span>
<span v-if="scope.row.type !=null">{{ dict.label.task_type[scope.row.type] }}</span>
</template>
</el-table-column>
<el-table-column prop="jobType" label="工作类型">
<template slot-scope="scope">
{{ scope.row.jobType }}
</template>
</el-table-column>
<el-table-column prop="jobPriority" label="优先级" width="60"/>
<el-table-column prop="jobMessage" label="返回报文" :show-overflow-tooltip="true" width="150"/>
<el-table-column prop="createTime" label="创建时间" width="140"/>
<el-table-column prop="startTime" label="开始时间" width="140"/>
<el-table-column prop="endTime" label="完成时间" width="140"/>
<el-table-column
fixed="right"
label="操作"
width="140">
<template slot-scope="scope">
<el-button type="primary" :disabled="scope.row.status!='ATCALL' && scope.row.status!='OPEN' "
align="center" size="mini"
style="float: right" @click="popUpBox(scope.row.id)">
顶升
</el-button>
<el-button type="primary"
:disabled="scope.row.status!='ATCALL' && scope.row.status!='UP_CONTAINER' && scope.row.status!='OPEN' "
align="center"
size="mini"
style="float: left" @click="toAgvTaskFinish(scope.row)">
完成
</el-button>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<div style="float: right;">
<pagination/>
</div>
</div>
</div>
</template>
<script>
import crudAgvTask, {missionStateCallback} from '@/api/agvTask'
import CRUD, {presenter, header, form, crud} from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import udOperation from '@crud/UD.operation'
import pagination from '@crud/Pagination'
import DateRangePicker from "@/components/DateRangePicker/index.vue";
import DonMessage from "@/utils/message";
const defaultForm = {
id: null,
stockCode: null,
stockTypeCode: null,
startSlotCode: null,
endSlotCode: null,
slotCode: null,
status: null,
type: null,
jobId: null,
jobType: null,
jobPriority: null,
jobPriorityType: null,
jobForce: null,
jobForceAsc: null,
jobMessage: null,
jobMessageTime: null,
createTime: null,
startTime: null,
endTime: null
}
export default {
name: 'AgvTask',
components: {DateRangePicker, pagination, crudOperation, rrOperation, udOperation},
mixins: [presenter(), header(), form(defaultForm), crud()],
dicts: ['base_staus', 'task_status', 'task_type'],
cruds() {
return CRUD({
title: 'agvTask',
url: 'api/agvTask',
idField: 'id',
sort: 'id,desc',
crudMethod: {...crudAgvTask},
optShow: {
add: false,
edit: false,
del: false,
reset: false,
download: true
}
})
},
data() {
return {
radio3: '全部',
permission: {
add: ['admin', 'agvTask:add'],
edit: ['admin', 'agvTask:edit'],
del: ['admin', 'agvTask:del']
},
MissionStateCallback: {
missionCode: '',
containerCode: '',
missionStatus: ''
},
rules: {
stockCode: [
{required: true, message: '容器码不能为空', trigger: 'blur'}
],
stockTypeCode: [
{required: true, message: '容器类型不能为空', trigger: 'blur'}
],
startSlotCode: [
{required: true, message: '起点位置不能为空', trigger: 'blur'}
],
endSlotCode: [
{required: true, message: '终点位置不能为空', trigger: 'blur'}
],
slotCode: [
{required: true, message: '容器当前位置不能为空', trigger: 'blur'}
],
status: [
{required: true, message: '任务状态不能为空', trigger: 'blur'}
],
jobType: [
{required: true, message: '工作类型不能为空', trigger: 'blur'}
],
boxCode: [
{required: true, message: '容器号不能为空', trigger: 'blur'}
]
},
queryTypeOptions: [
{key: 'dstStockCode', display_name: '终点位置'},
{key: 'srcLocCode', display_name: '起点位置'},
{key: 'stockCode', display_name: '容器码'},
{key: 'stockTypeCode', display_name: '容器类型'},
{key: 'startSlotCode', display_name: '起点位置'},
{key: 'endSlotCode', display_name: '终点位置'},
{key: 'slotCode', display_name: '容器当前位置'},
{key: 'status', display_name: '任务状态'},
{key: 'type', display_name: '任务类型'},
{key: 'jobId', display_name: '下游任务号'},
{key: 'jobMessage', display_name: '返回报文'}
],
// boxCode
agvTaskCallbackStatus: false,
form1: {boxCode: null, missionCode: null}
}
},
methods: {
// 钩子在获取表格数据之前执行false 则代表不获取数据
[CRUD.HOOK.beforeRefresh]() {
return true
},
formatter(row, column) {
return row.endSlotCode;
},
toAgvTaskFinish(data) {
this.MissionStateCallback.missionCode = data.id
this.MissionStateCallback.containerCode = data.stockCode
this.MissionStateCallback.missionStatus = 'COMPLETED'
crudAgvTask.missionStateCallback(this.MissionStateCallback).then(res => {
if (res.status == 200) {
this.crud.notify(res.message, CRUD.NOTIFICATION_TYPE.SUCCESS);
this.crud.toQuery()
} else {
this.crud.notify(res.message, CRUD.NOTIFICATION_TYPE.ERROR);
}
}).catch(() => {
})
},
agvTaskCallbackMethod() {//顶升
this.$refs['form1'].validate((valid) => {
if (valid) {
//UP_CONTAINER
let date_ = {missionCode: null, containerCode: null, missionStatus: null};
date_.missionCode = this.form1.missionCode;
date_.containerCode = this.form1.boxCode;
date_.missionStatus = "UP_CONTAINER";
missionStateCallback(date_).then(res => {
this.agvTaskCallbackStatus = false;
this.crud.notify("顶升成功!", CRUD.NOTIFICATION_TYPE.SUCCESS);
this.crud.toQuery()
this.form1 = {boxCode: null, missionCode: null};
}).catch(e => {
this.crud.notify("顶升失败!", CRUD.NOTIFICATION_TYPE.ERROR);
})
} else {
return false;
}
});
},
popUpBox(id) {//弹出顶升盒子
this.form1.missionCode = id;
this.agvTaskCallbackStatus = true;
},
resetQuery() {
this.radio3 = '全部';
this.crud.resetQuery()
},
clickChange(lab) {
if (lab === "全部") {
this.crud.resetQuery();
this.crud.toQuery();
} else if (lab === "货架") {
this.query.jobType = 'RACK'
this.crud.toQuery();
} else if (lab === "料箱") {
this.query.jobType = 'PICKER'
this.crud.toQuery();
} else if (lab === "滚筒") {
this.query.jobType = 'ROLLER'
this.crud.toQuery();
}
}
}
}
</script>
<style scoped>
</style>