<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-form-item label="任务号">
<label slot="label">任 务 号:</label>
<el-input
v-model="query.task_code"
clearable
style="width: 180px"
placeholder="任务号"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
<el-form-item label="载具号">
<label slot="label">载 具 号:</label>
<el-input
v-model="query.vehicle_code"
clearable
style="width: 180px"
placeholder="载具号"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
<el-form-item label="点位编码">
<el-input
v-model="query.point_code"
clearable
style="width: 180px"
placeholder="起点"
@keyup.enter.native="crud.toQuery"
/>
</el-form-item>
<el-form-item label="任务类型">
<treeselect
v-model="query.task_type"
:load-options="loadChildNodes"
:options="classes1"
style="width: 180px"
placeholder="请选择"
/>
</el-form-item>
<el-form-item label="完成方式">
<el-select
v-model="query.finished_type"
style="width: 180px"
placeholder="完成方式"
class="filter-item"
clearable
@change="hand"
>
<el-option
v-for="item in finishTypeList"
:key="item.code"
clearable
:label="item.name"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item label="创建时间">
<el-date-picker
v-model="query.createTime"
type="daterange"
value-format="yyyy-MM-dd HH:mm:ss"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="['00:00:00', '23:59:59']"
@change="crud.toQuery"
/>
</el-form-item>
<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>
<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 type="selection" width="50" />
<el-table-column v-if="true" prop="task_id" label="任务标识" min-width="150" show-overflow-tooltip />
<el-table-column v-if="true" prop="material_id" label="物料标识" min-width="150" show-overflow-tooltip />
<el-table-column prop="task_code" label="任务编码" min-width="100" show-overflow-tooltip />
<el-table-column v-if="false" prop="task_type" label="任务类型" />
<el-table-column prop="acs_task_type" label="acs任务类型" min-width="120" show-overflow-tooltip >
<template slot-scope="scope">
{{ dict.label.acs_task_type[scope.row.acs_task_type] }}
</template>
</el-table-column>
<el-table-column prop="task_name" label="任务描述" min-width="120" show-overflow-tooltip />
<el-table-column v-if="false" prop="task_type_name" label="任务类型" min-width="120" show-overflow-tooltip />
<el-table-column v-if="false" prop="task_status" label="任务状态" />
<el-table-column prop="task_status_name" label="任务状态" width="95px" :formatter="formatTaskStatusName" />
<el-table-column prop="vehicle_type" label="载具类型" min-width="100" show-overflow-tooltip >
<template slot-scope="scope">
{{ dict.label.vehicle_type[scope.row.vehicle_type] }}
</template>
</el-table-column>
<el-table-column prop="vehicle_code" label="载具编码" min-width="100" show-overflow-tooltip />
<el-table-column prop="point_code1" label="点位1" width="120" />
<el-table-column prop="point1_region_name" label="区域1" width="120" />
<el-table-column prop="point_code2" label="点位2" min-width="120" show-overflow-tooltip />
<el-table-column prop="point2_region_name" label="区域2" min-width="120" show-overflow-tooltip />
<!--<el-table-column prop="point_code3" label="点位3" min-width="100" show-overflow-tooltip />
<el-table-column prop="point3_region_name" label="区域3" min-width="120" show-overflow-tooltip />-->
<!--<el-table-column prop="point_code3" label="点位3" width="85" />
<el-table-column prop="point_code4" label="点位4" width="85" />-->
<el-table-column prop="remark" label="备注" width="120" show-overflow-tooltip />
<el-table-column prop="create_time" label="创建时间" width="135" />
<el-table-column prop="update_time" label="修改时间" width="135" />
<el-table-column
v-permission="['admin','instruction:edit','instruction:del']"
fixed="right"
label="操作"
width="160px"
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
type="text"
icon="el-icon-error"
@click="doOperate(scope.row, 'b')"
>取消</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 '@/api/wms/sch/task'
import CRUD, { crud, header, presenter } 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 Treeselect, { LOAD_CHILDREN_OPTIONS } from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
import crudClassstandard from '@/api/wms/basedata/classstandard'
export default {
name: 'Task',
dicts: ['acs_task_type', 'vehicle_type'],
components: {
pagination, crudOperation, rrOperation, Treeselect, udOperation
},
mixins: [presenter(), header(), crud()],
cruds() {
return CRUD({
title: '任务',
url: 'api/task',
idField: 'task_id',
sort: 'task_id,desc',
crudMethod: { ...crudTask },
query: {
task_code: '', vehicle_code: '', start_point_code: '', next_point_code: '', task_type: '', finished_type: '', task_status: ''
},
optShow: {
add: false,
edit: false,
del: false,
download: false,
reset: true
}
})
},
data() {
return {
viewDialogVisible: false,
fullscreen: false,
currentComponent: '',
openParam: {},
create_time: [],
taskStatusList: [],
taskTypeList: [],
finishTypeList: [],
permission: {
},
rules: {},
classes1: []
}
},
created() {
this.initClass1()
crudTask.getTaskStatus().then(data => {
this.taskStatusList = data
})
crudTask.getFinishType().then(data => {
this.finishTypeList = data
})
this.crud.query.task_status = ['-1']
this.crud.toQuery()
},
methods: {
initClass1() {
const param = {
parent_class_code: 'task_type'
}
crudClassstandard.getClassType(param).then(res => {
const data = res.content
this.buildTree(data)
this.classes1 = data
})
},
buildTree(classes) {
classes.forEach(data => {
if (data.children) {
this.buildTree(data.children)
}
if (data.hasChildren && !data.children) {
data.children = null // 重点代码
}
})
},
// 获取子节点数据
loadChildNodes({ action, parentNode, callback }) {
if (action === LOAD_CHILDREN_OPTIONS) {
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) {
this.crud.toQuery()
},
handTaskStatus(value) {
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 '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>