Files
lanzhouhailiang_one/lms/nladmin-ui/src/views/wms/sch/task/index.vue

480 lines
16 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<div class="app-container">
<!--工具栏-->
<div class="head-container">
<div v-if="crud.props.searchToggle">
<el-form
:inline="true"
class="demo-form-inline"
label-position="right"
label-width="80px"
label-suffix=":"
>
<el-row>
<el-col :span="8">
<el-form-item label="任务号">
<label slot="label">&nbsp;&nbsp;&nbsp;:</label>
<el-input
v-model="query.task_code"
clearable
style="width: 180px"
placeholder="任务号"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="载具号">
<label slot="label">&nbsp;&nbsp;&nbsp;:</label>
<el-input
v-model="query.vehicle_code"
clearable
style="width: 180px"
placeholder="载具号1"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="点位编码">
<el-input
v-model="query.point_code1"
clearable
style="width: 180px"
placeholder="起点"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="6">
<el-form-item label="任务类型">
<treeselect
v-model="query.task_type"
:load-options="loadChildNodes"
:options="classes1"
style="width: 180px"
placeholder="请选择"
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-row>
<el-form-item label="是否删除">
<el-select
v-model="query.is_delete"
class="filter-item"
clearable
@change="handTaskStatus"
>
<el-option
v-for="item in deleteList"
:key="item.code"
:label="item.name"
:value="item.code"
/>
</el-select>
</el-form-item>
</el-row>
</el-col>
<el-col :span="12">
<el-form-item label="创建时间">
<el-date-picker
v-model="query.createTime"
type="datetimerange"
value-format="yyyy-MM-dd HH:mm:ss"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="['00:00:00', '23:59:59']"
@input="onInput()"
@change="mytoQuery"
/>
</el-form-item>
</el-col>
<el-col :span="9" />
</el-row>
<el-row>
<el-form-item label="任务状态">
<el-select
v-model="query.task_status"
multiple
style="width: 400px"
placeholder="任务状态"
class="filter-item"
clearable
@change="handTaskStatus"
>
<el-option
v-for="item in taskStatusList"
:key="item.code"
:label="item.name"
:value="item.code"
/>
</el-select>
</el-form-item>
</el-row>
<rrOperation />
</el-form>
</div>
<!--如果想在工具栏加入更多按钮可以使用插槽方式 slot = 'left' or 'right'-->
<crudOperation :permission="permission" />
<!--表格渲染-->
<el-table
ref="table"
v-loading="crud.loading"
:data="crud.data"
size="mini"
style="width: 100%;"
@selection-change="crud.selectionChangeHandler"
>
<el-table-column prop="task_id" label="任务标识" min-width="150" show-overflow-tooltip />
<el-table-column prop="task_code" label="任务编码" min-width="150" show-overflow-tooltip />
<el-table-column prop="task_type_name" label="任务类型" min-width="150" show-overflow-tooltip />
<el-table-column prop="task_status_name" label="任务状态" width="95px" :formatter="formatTaskStatusName" />
<el-table-column prop="point_code1" label="取货点1" width="100" show-overflow-tooltip />
<el-table-column prop="point_code2" label="放货点1" width="100" show-overflow-tooltip />
<el-table-column prop="point_code3" label="取货点2" width="100" show-overflow-tooltip />
<el-table-column prop="point_code4" label="放货点2" width="100" show-overflow-tooltip />
<el-table-column prop="car_no" label="车号" width="100" show-overflow-tooltip />
<el-table-column prop="material_code" label="物料编码" width="100" show-overflow-tooltip />
<el-table-column prop="task_group_id" label="关联任务" width="100" show-overflow-tooltip />
<el-table-column prop="vehicle_code" label="载具编码1" width="130" show-overflow-tooltip />
<el-table-column prop="vehicle_code2" label="载具编码2" width="100" show-overflow-tooltip />
<el-table-column prop="request_param" label="请求参数" min-width="120" :formatter="formatSignal" show-overflow-tooltip />
<el-table-column prop="response_param" label="响应参数" min-width="120" :formatter="formatSignal" show-overflow-tooltip />
<el-table-column prop="task_name" label="任务描述" min-width="120" show-overflow-tooltip />
<el-table-column prop="create_name" label="创建人" width="135" show-overflow-tooltip />
<el-table-column prop="create_time" label="创建时间" sortable width="135" show-overflow-tooltip />
<el-table-column prop="update_optname" label="修改人" width="135" show-overflow-tooltip />
<el-table-column prop="update_time" label="修改时间" width="135" show-overflow-tooltip />
<el-table-column prop="remark" label="备注" width="135" show-overflow-tooltip />
<el-table-column
v-permission="['admin','instruction:edit','instruction:del']"
fixed="right"
label="操作"
width="240px"
align="center"
>
<template slot-scope="scope">
<el-button
type="text"
icon="el-icon-upload"
@click="doOperate(scope.row, 'c')"
>下发</el-button>
<el-button
type="text"
icon="el-icon-success"
@click="doOperate(scope.row, 'a')"
>完成</el-button>
<el-button
v-permission="['instruction:del']"
type="text"
icon="el-icon-error"
@click="doOperate(scope.row, 'b')"
>取消</el-button>
<el-button
type="text"
icon="el-icon-warning-outline"
@click="doOperate(scope.row, 's')"
>强制完成</el-button>
</template>
</el-table-column>
</el-table>
<!--分页组件-->
<pagination />
</div>
<el-dialog
title="任务详情"
:fullscreen="fullscreen"
:visible.sync="viewDialogVisible"
width="30%"
>
<!-- 组件-->
<!--<component
:is="currentComponent"
:task-uuid="task_id"
:dialog-visible="viewDialogVisible"
/>-->
<span slot="footer" class="dialog-footer">
<el-button @click="viewDialogVisible = false"> </el-button>
<el-button type="primary" @click="viewDialogVisible = false"> </el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import crudTask from '@/views/wms/sch/task/task'
import CRUD, { crud, header, presenter } from '@crud/crud'
import rrOperation from '@crud/RR.operation'
import crudOperation from '@crud/CRUD.operation'
import pagination from '@crud/Pagination'
import DateRangePicker from '@/components/DateRangePicker/index'
import Treeselect, { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import crudClassstandard from '@/views/wms/basedata/master/class/classstandard'
export default {
name: 'Task',
dicts: ['acs_task_type', 'vehicle_type'],
components: {
pagination, crudOperation, rrOperation, Treeselect, DateRangePicker
},
mixins: [presenter(), header(), crud()],
cruds() {
return CRUD({
title: '任务',
url: 'api/task',
idField: 'task_id',
sort: 'create_time,desc',
crudMethod: { ...crudTask },
query: {
task_code: '', is_delete: '0', vehicle_code: '', start_point_code: '', next_point_code: '', task_type: '', finished_type: '', task_status: ['-1']
},
optShow: {
add: false,
edit: false,
del: false,
download: false,
reset: true
}
})
},
data() {
return {
viewDialogVisible: false,
fullscreen: false,
currentComponent: '',
openParam: {},
create_time: [],
taskStatusList: [],
deleteList: [{ 'code': '0', 'name': '否' }, { 'code': '1', 'name': '是' }],
taskTypeList: [],
finishTypeList: [],
permission: {
},
query_flag: true,
rules: {},
classes1: []
}
},
created() {
this.initClass1()
crudTask.getTaskStatus().then(data => {
this.taskStatusList = data
})
crudTask.getFinishType().then(data => {
this.finishTypeList = data
})
const today = new Date()
const threeDaysAgo = new Date(today)
threeDaysAgo.setDate(today.getDate() - 3)
// 从 threeDaysAgo 提取完整日期信息
const beforeYear = threeDaysAgo.getFullYear();
const beforeMonth = String(threeDaysAgo.getMonth() + 1).padStart(2, '0');
const beforeDay = String(threeDaysAgo.getDate()).padStart(2, '0');
// 从 today 提取完整日期信息
const currentYear = today.getFullYear();
const currentMonth = String(today.getMonth() + 1).padStart(2, '0');
const currentDay = String(today.getDate()).padStart(2, '0');
// 构造正确的时间范围
const startTime = `${beforeYear}-${beforeMonth}-${beforeDay} 00:00:00`;
const endTime = `${currentYear}-${currentMonth}-${currentDay} 23:59:59`;
this.crud.query.createTime = [startTime, endTime]
},
methods: {
// 钩子在获取表格数据之前执行false 则代表不获取数据
[CRUD.HOOK.beforeRefresh]() {
if (this.query_flag) {
const today = new Date()
const threeDaysAgo = new Date(today)
threeDaysAgo.setDate(today.getDate() - 3)
// 从 threeDaysAgo 提取完整日期信息
const beforeYear = threeDaysAgo.getFullYear();
const beforeMonth = String(threeDaysAgo.getMonth() + 1).padStart(2, '0');
const beforeDay = String(threeDaysAgo.getDate()).padStart(2, '0');
// 从 today 提取完整日期信息
const currentYear = today.getFullYear();
const currentMonth = String(today.getMonth() + 1).padStart(2, '0');
const currentDay = String(today.getDate()).padStart(2, '0');
// 构造正确的时间范围
const startTime = `${beforeYear}-${beforeMonth}-${beforeDay} 00:00:00`;
const endTime = `${currentYear}-${currentMonth}-${currentDay} 23:59:59`;
this.crud.query.createTime = [startTime, endTime]
this.crud.query.begin_time = startTime
this.crud.query.end_time = endTime
this.query_flag = false
}
},
initClass1() {
const param = {
parent_class_code: 'task_type'
}
crudClassstandard.getClassType(param).then(res => {
const data = res.content
this.buildTree(data)
this.classes1 = data
})
},
onInput() {
this.$forceUpdate()
},
mytoQuery(array1) {
if (array1 === null) {
this.crud.query.begin_time = ''
this.crud.query.end_time = ''
} else {
this.crud.query.begin_time = array1[0]
this.crud.query.end_time = array1[1]
}
this.crud.toQuery()
},
buildTree(classes) {
classes.forEach(data => {
if (data.children) {
this.buildTree(data.children)
}
if (data.hasChildren && !data.children) {
data.children = null // 重点代码
}
})
},
formatSignal(row, column) {
if (row.task_type === '010911') {
if (column.property === 'response_param') {
return row.car_no === '4' ? '放满轴信号已发送' : '放满轴信号未发送'
}
if (column.property === 'request_param') {
return row.request_param === '3' ? '取空载具信号已发送' : '取空载具信号未发送'
}
} else if (row.task_type === '010904') {
if (column.property === 'request_param') {
return row.request_param === '3' ? '取空载具信号已发送' : '取空载具信号未发送'
}
} else if (row.task_type === '010901') {
if (column.property === 'response_param') {
return row.car_no === '4' ? '放满轴信号已发送' : '放满轴信号未发送'
}
} else if (row.task_type === '010905' || row.task_type === '010913') {
if (column.property === 'response_param') {
return row.response_param === '1' ? '二次分配已分配' : '二次分配未分配'
}
}
return row[column.property]
},
// 获取子节点数据
loadChildNodes({ action, parentNode, callback }) {
if (action === LOAD_CHILDREN_OPTIONS) {
debugger
crudClassstandard.getClass({ pid: parentNode.id }).then(res => {
parentNode.children = res.content.map(function(obj) {
if (obj.hasChildren) {
obj.children = null
}
return obj
})
setTimeout(() => {
callback()
}, 100)
})
}
},
hand(value) {
debugger
this.crud.toQuery()
},
handTaskStatus(value) {
debugger
if (value) {
this.query.task_status = this.task_status.toString()
}
this.crud.toQuery()
},
formatTaskStatusName(row, column) {
for (const item of this.taskStatusList) {
if (item.code === row.task_status) {
return item.name
}
}
return ''
},
doOperate(row, command) {
let method_name = ''
switch (command) {
case 'a':// 完成
method_name = 'forceFinish'
break
case 'b':// 取消
method_name = 'cancel'
break
case 'c':// 下发
method_name = 'immediateNotifyAcs'
break
case 's':// 强制完成
method_name = 'finish'
break
case 'd':// 详情
method_name = 'view'
break
}
if (method_name === 'view') {
this.view(row)
return
}
const data = {
task_id: row.task_id,
method_name: method_name
}
crudTask.operation(data).then(res => {
this.crud.toQuery()
this.crud.notify('操作成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
}).catch(err => {
console.log(err.response.data.message)
})
},
view(row) {
this.task_id = row.task_id
switch (row.task_type) {
case '01':// 入库
this.fullscreen = true
this.currentComponent = 'IOStore'
break
case '02':// 出库
this.fullscreen = true
this.currentComponent = 'IOStore'
break
case '03':// 入空载具
this.crud.notify('入空载具无详情', CRUD.NOTIFICATION_TYPE.INFO)
return
case '04':// 出空载具
this.crud.notify('出空载具无详情', CRUD.NOTIFICATION_TYPE.INFO)
return
case '05':// 转储
this.fullscreen = true
this.currentComponent = 'DumpInv'
break
case '06':// 质检
this.fullscreen = true
this.currentComponent = 'Quality'
break
}
this.viewDialogVisible = true
}
}
}
</script>
<style scoped>
</style>