383 lines
12 KiB
Vue
383 lines
12 KiB
Vue
<template>
|
|
<main class="m-16">
|
|
<div class="wrap bg_white">
|
|
<div class="p-16">
|
|
<el-row class="top-box">
|
|
<el-col :span="4">
|
|
<el-button type="primary" plain class="m-r-16" size="small" @click="addHoppercar">
|
|
<i class="el-icon-circle-plus" style="margin-right:5px; font-size:14px;"></i>新增</el-button>
|
|
<el-button type="primary" size="small" plain @click="exportHandle"><i class="Files"></i>导出</el-button>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="24">
|
|
<el-form ref="form" :model="filter" label-width="80px" label-position="left" class="m-t-20">
|
|
<el-row :gutter="10">
|
|
<el-col :span="4">
|
|
<el-form-item label="料车类型" prop="">
|
|
<el-select v-model="filter.type" placeholder="请选择料车类型" @change="changeType">
|
|
<el-option label="全部" value="-1">全部</el-option>
|
|
<el-option v-for="(item, index) in types" :key="index" :label="item.name" :value="item.id"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="4">
|
|
<el-form-item label="料车状态" prop="">
|
|
<el-select v-model="filter.cart_status" placeholder="请选择料车状态" @change="changeLcStatus">
|
|
<el-option label="全部" value="-1">全部</el-option>
|
|
<el-option v-for="(item, index) in statusData" :key="index" :label="item.name" :value="item.id"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="4">
|
|
<el-form-item label="料车编码" prop="">
|
|
<el-input v-model="filter.cart_code" v-on:keyup.enter="changeCode" clearable @clear="clearInput('cart_code')" placeholder="请输入料车编码"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="4">
|
|
<el-form-item label="料车名称" prop="">
|
|
<el-input v-model="filter.cart_title" v-on:keyup.enter="changeName" clearable @clear="clearInput('cart_title')" placeholder="请输入料车名称"></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="4">
|
|
<el-checkbox v-model="is_status" @change="changeCheckbox" label="仅显示启用的料车"></el-checkbox>
|
|
</el-col>
|
|
<el-col :span="4">
|
|
<el-button type="primary" size="small" class="m-r-16" plain @click="resetData">重置</el-button>
|
|
<el-button type="primary" size="small" @click="searchClick">搜索</el-button>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row>
|
|
<el-col :span="24">
|
|
<el-table :data="tableData" style="width: auto;" border :header-cell-style="header_style">
|
|
<el-table-column prop="cart_title" label="料车名称" width="200" align="center" />
|
|
<el-table-column prop="cart_code" label="料车编码" width="120" align="center" />
|
|
<el-table-column prop="type_name" label="料车类型" width="310" align="center" />
|
|
<el-table-column prop="order_by" label="优先级" width="80" align="center" />
|
|
<el-table-column prop="cart_status" label="料车状态" width="120" align="center">
|
|
<template #default="scope">
|
|
<span class="isGreen" v-if="scope.row.cart_status == '0'">空闲</span>
|
|
<span class="isYellow" v-else-if="scope.row.cart_status == '1'">任务中</span>
|
|
<span class="isCyan" v-else>已装载</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="address_title" label="当前所在位置" width="200" align="center" />
|
|
<el-table-column prop="agv_name" label="当前使用AGV" width="240" align="center" />
|
|
<el-table-column prop="is_status" label="是否启用" width="120" align="center">
|
|
<template #default="scope">
|
|
<el-switch v-model="scope.row.is_status" @change="changeStatus($event, scope.row.id)" :active-value="0" :inactive-value="1" active-color="#13ce66" inactive-color="#EDEFF4" />
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column prop="" label="操作" align="center">
|
|
<template #default="scope">
|
|
<span class="isBlue Cursor m-r-16" @click="editClick(scope.row.id)">编辑</span>
|
|
<span class="Cursor" @click="deleteClick(scope.row)">删除</span>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
<el-pagination
|
|
class="pagination m-t-16"
|
|
:current-page="filter.page"
|
|
:page-sizes="[10, 20, 30, 40]"
|
|
:page-size="filter.size"
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
:total="total"
|
|
@size-change="changePageSize"
|
|
@current-change="changePage"
|
|
>
|
|
</el-pagination>
|
|
</el-col>
|
|
</el-row>
|
|
</div>
|
|
</div>
|
|
<!--新增弹窗-->
|
|
<el-dialog
|
|
class="addDialog"
|
|
v-model="dialogAdd"
|
|
:title="dialogTitle"
|
|
width="348px"
|
|
:before-close="handleClose"
|
|
>
|
|
<el-form :model="addForm" label-width="80px" label-position="left">
|
|
<el-form-item label="料车编码">
|
|
<el-input v-model="addForm.cart_code" placeholder="新增后自动生成" :disabled="isDisable"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="料车名称">
|
|
<el-input v-model="addForm.cart_title" placeholder="请输入料车名称"></el-input>
|
|
</el-form-item>
|
|
<el-form-item label="料车类型">
|
|
<el-select v-model="addForm.type" placeholder="请选择料车状态">
|
|
<el-option v-for="(item, index) in types" :key="index" :label="item.name" :value="item.id"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="优先顺序">
|
|
<el-input-number
|
|
v-model="addForm.order_by"
|
|
:min="1"
|
|
:max="10"
|
|
controls-position="right"
|
|
@change="handleChange"
|
|
/>
|
|
</el-form-item>
|
|
</el-form>
|
|
<template #footer>
|
|
<span class="dialog-footer">
|
|
<el-button class="m-r-16" size="small" @click="handleClose">取消</el-button>
|
|
<el-button type="primary" size="small" @click="comfirm">确认</el-button>
|
|
</span>
|
|
</template>
|
|
</el-dialog>
|
|
</main>
|
|
</template>
|
|
|
|
<script>
|
|
import { exportExcel } from '/src/utils/exportExcel.js'
|
|
import { ElMessageBox } from 'element-plus'
|
|
import axios from 'axios'
|
|
export default {
|
|
name: '',
|
|
data() {
|
|
return {
|
|
isDisable: false,
|
|
dialogAdd: false,
|
|
dialogTitle: '添加料车',
|
|
header_style: {
|
|
'background-color': '#F5F7FA',
|
|
'color': '#606266',
|
|
'fontSize': '14px',
|
|
'fontWeight': '600',
|
|
'textAlign':'center',
|
|
},
|
|
is_status: true,
|
|
filter: {
|
|
type: '-1',
|
|
cart_status: '-1',
|
|
cart_code: '',
|
|
cart_title: '',
|
|
is_status: '0',
|
|
size: 10,
|
|
page: 1,
|
|
export: 0
|
|
},
|
|
total: 0,
|
|
currentPage: 1,
|
|
types: [
|
|
{
|
|
id: '0',
|
|
name: '双层料车1.0x1.0米'
|
|
},
|
|
{
|
|
id: '1',
|
|
name: '单层料车1.0x1.0米'
|
|
}
|
|
],
|
|
statusData: [
|
|
{
|
|
id: '0',
|
|
name: '空闲'
|
|
},
|
|
{
|
|
id: '1',
|
|
name: '任务中'
|
|
},
|
|
{
|
|
id: '2',
|
|
name: '已装载'
|
|
}
|
|
],
|
|
tableData: [],
|
|
addForm: {
|
|
type: '',
|
|
order_by: '1',
|
|
cart_code: '',
|
|
cart_title: '',
|
|
dotype: ''
|
|
}
|
|
}
|
|
},
|
|
created() {
|
|
this.filter.is_status = this.is_status == true ? '0' : '-1'
|
|
},
|
|
activated() {
|
|
this.getDataList()
|
|
},
|
|
methods: {
|
|
// 列表数据
|
|
getDataList() {
|
|
this.$http.post('Agv/cartList', this.filter).then(res => {
|
|
if (res.status == 200) {
|
|
this.tableData = res.data.results
|
|
this.total = res.data.count_limit
|
|
}
|
|
})
|
|
},
|
|
clearInput(key) { //清空输入框
|
|
this.filter[`${key}`] = ''
|
|
this.getDataList()
|
|
},
|
|
// 搜索
|
|
searchClick() {
|
|
this.getDataList()
|
|
},
|
|
// 重置搜索条件
|
|
resetData() {
|
|
this.filter = {
|
|
type: '-1',
|
|
cart_status: '-1',
|
|
cart_code: '',
|
|
cart_title: '',
|
|
is_status: '0',
|
|
size: 10,
|
|
page: 1
|
|
}
|
|
this.getDataList()
|
|
},
|
|
clearData() {
|
|
this.addForm = {
|
|
type: '',
|
|
order_by: '1',
|
|
cart_code: '',
|
|
cart_title: '',
|
|
dotype: ''
|
|
}
|
|
},
|
|
// 选择料车类型
|
|
changeType(val) {
|
|
this.filter.type = val
|
|
this.getDataList()
|
|
},
|
|
// 选择料车状态
|
|
changeLcStatus(val) {
|
|
this.filter.cart_status = val
|
|
this.getDataList()
|
|
},
|
|
// 搜索编码
|
|
changeCode() {
|
|
this.getDataList()
|
|
},
|
|
// 搜索名称
|
|
changeName() {
|
|
this.getDataList()
|
|
},
|
|
// 显示启用料车
|
|
changeCheckbox(val) {
|
|
this.filter.is_status = val == true ? '0' : '-1'
|
|
this.getDataList()
|
|
},
|
|
// 新增
|
|
addHoppercar(){
|
|
this.dialogAdd = true
|
|
this.dialogTitle = '添加料车'
|
|
this.addForm.dotype = 'add'
|
|
this.isDisable = false
|
|
},
|
|
// 确认
|
|
comfirm() {
|
|
this.$http.post('Agv/editCart', this.addForm).then(res => {
|
|
if (res.status == 200) {
|
|
this.$message({
|
|
type: 'success',
|
|
message: res.message
|
|
})
|
|
this.dialogAdd = false
|
|
this.clearData()
|
|
this.getDataList()
|
|
} else {
|
|
this.$message({
|
|
type: 'error',
|
|
message: res.message
|
|
})
|
|
}
|
|
})
|
|
},
|
|
// 修改禁用/启用状态
|
|
changeStatus(status, id) {
|
|
console.log(status, id)
|
|
this.$http.post('Agv/editStatus', {type: 2, id: id, is_status: status}).then(res => {
|
|
if (res.status == 200) {
|
|
this.getDataList()
|
|
this.$message({
|
|
type: 'success',
|
|
message: res.message
|
|
})
|
|
} else {
|
|
this.$message({
|
|
type: 'error',
|
|
message: res.message
|
|
})
|
|
}
|
|
})
|
|
},
|
|
//编辑
|
|
editClick(id) {
|
|
this.dialogAdd = true
|
|
this.dialogTitle = '编辑料车'
|
|
this.isDisable = true
|
|
this.$http.post('Agv/detailInfo', {type: 2, id: id}).then(res => {
|
|
if (res.status == 200) {
|
|
let data = res.data.result
|
|
this.addForm = data
|
|
this.addForm = {
|
|
dotype : 'edit',
|
|
id: data.id,
|
|
order_by: data.order_by,
|
|
cart_code: data.cart_code,
|
|
cart_title: data.cart_title,
|
|
type: data.type + '' //转为字符类型
|
|
}
|
|
}
|
|
})
|
|
},
|
|
handleClose() {
|
|
this.dialogAdd = false
|
|
this.clearData()
|
|
},
|
|
// 每页条数
|
|
changePageSize(val) {
|
|
this.filter.size = val
|
|
this.getDataList()
|
|
},
|
|
// 翻页
|
|
changePage(val) {
|
|
this.filter.page = val
|
|
this.getDataList()
|
|
},
|
|
//删除
|
|
deleteClick(row) {
|
|
ElMessageBox.confirm('您确定要直接删除所选料车吗？该操作不可恢复，请谨慎操作！', '提示', {
|
|
type: 'warning',
|
|
confirmButtonText: '确定删除',
|
|
cancelButtonText: '我点错了',
|
|
beforeClose: (action, instance, done) => {
|
|
if (action === 'confirm') {
|
|
this.$http.post('Agv/doDel', {id: row.id, type: 2} ).then(res => {
|
|
if (res.status == 200) {
|
|
this.getDataList()
|
|
} else {
|
|
this.$message({
|
|
type: 'error',
|
|
message: res.message
|
|
})
|
|
}
|
|
})
|
|
}
|
|
done()
|
|
}
|
|
})
|
|
},
|
|
//导出
|
|
exportHandle() {
|
|
this.filter.export = 1
|
|
let url = '/Agv/cartList'
|
|
exportExcel(url, this.filter)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import '@/views/agv/agv.scss';
|
|
</style> |