朱兆平 / vue_cli · 提交

转到一个项目

作者 朱兆平
提交 463bab1f7c2c9ca7053aac41b9573970c2ab6557 2 个父辈 ffa7f4a6 dc0f7ed3 master ... ExportOrder flightplan2.0 master_dev_markdown master_dev_permission master_ffmTemp zhidan

Merge remote-tracking branch 'origin/master'

内嵌 并排对比
正在显示 9 个修改的文件 包含 1556 行增加 和 596 行删除
... ... @@ -3,4 +3,23 @@ import http from "../http";
let baseServiceURL = 'wms-server-warehouse'
//车辆定位
export const selectVehicle = params => { return axios.get(`${baseServiceURL}/map/location/lastlocation`, { params: params }); };
//出任务
export const insertSelective = params => { return http.post(`${baseServiceURL}/map/location/insertSelective`, params); };
//车辆轨迹
export const historyTrack = params => { return axios.get(`${baseServiceURL}/map/location/historyTrack`, { params: params }); };
//出勤历史
export const selectHistroy = params => { return axios.get(`${baseServiceURL}/map/location/selectHistroy`, { params: params }); };
//出勤车辆
export const selectList = params => { return axios.get(`${baseServiceURL}/map/location/selectList`, { params: params }); };
export const DoneTask = params => { return http.post(`${baseServiceURL}/map/location/DoneTask`, params); };
//根据用户查询所属出勤车辆
export const selectNameList = params => { return axios.get(`${baseServiceURL}/map/location/selectNameList`, { params: params }); };
... ...
import axios from 'axios'
import http from "../http";
let base = 'byonet-import/verecord';
export const list = params => {return http.get(`${base}/list`, params);};
export const remove = params => {return axios.post(`${base}/remove`, params);};
export const save = params => {return http.post(`${base}/save`, params);};
export const edit = params => {return http.put(`${base}/edit`, params);};
... ...
... ... @@ -53,3 +53,15 @@ export const loginedUserInfo = () => {
}
}
};
export const isAdmin = () => {
let session_user_info = sessionStorage.getItem('user');
if (session_user_info && jsutil.checkNull(session_user_info)){
let isAdmin = JSON.parse(sessionStorage.getItem('user')).companyName;
if (isAdmin === "ROLE_admin" || isAdmin=== "ROLE_kako"){
return true;
}
}else {
return false;
}
};
... ...
... ... @@ -112,6 +112,9 @@ import definition from './views/technological/definition.vue'
//仓库场站管理
import vehicle from './views/deploy/vehicle.vue'
import trajectory from './views/deploy/trajectory.vue'
import attendance from './views/deploy/attendance.vue'
import conveyance from './views/deploy/conveyance.vue'
import station from './views/deploy/station.vue'
import house from './views/deploy/house.vue'
import inventroyrecord from './views/deploy/inventroyrecord.vue'
... ... @@ -566,6 +569,9 @@ let routes = [
iconCls:'el-icon-goods',
children:[
{path:'/vehicle',component:vehicle,name:'车辆定位'},
{path:'/trajectory',component:trajectory,name:'车辆轨迹'},
{path:'/attendance',component:attendance,name:'出勤历史'},
{path:'/conveyance',component:conveyance,name:'出勤车辆'},
{path:'/station',component:station,name:'场站管理'},
{path:'/house',component:house,name:'仓库管理'},
{path:'/inventroyrecord',component:inventroyrecord,name:'库存变更记录'},
... ... @@ -657,7 +663,7 @@ let routes = [
name: '车辆调度管理',
iconCls: 'el-icon-truck',
children: [
{path: '/dispatch', component: Dispatch, name: '车辆调度'},
{path: '/dispatch', component: Dispatch, name: '车辆管理'},
{path: '/dispatchNode', component: DispatchNode, name: '调度记录'},
{path: '/vehicleInfo', component: VehicleInfo, name: '车辆信息'},
{path: '/driverInfo', component: DriverInfo, name: '驾驶员信息'},
... ...
<template>
<el-row>
<el-card style="background-color: #F5F7FA">
<!-- 搜索区域-->
<el-row class="toolbar">
<el-form :model="queryInfo" :rules="rules" ref="ruleForm">
<el-col :span="6">
<el-form-item label="" prop="lisenceNo">
<el-input v-model="queryInfo.lisenceNo" size="small" style="width: 170px"
placeholder="车牌号" clearable required>
<template slot="prepend">车牌号</template>
</el-input>
</el-form-item>
</el-col>
<el-col :span="2">
<el-button type="primary" icon="el-icon-search" size="small" @click="getList()">
查询
</el-button>
<!-- <el-button type="success" icon="el-icon-edit" size="small" @click="applyAdd()">新增</el-button>-->
</el-col>
</el-form>
</el-row>
<!-- 列表区域-->
<el-row>
<template>
<el-table
:data="tableData"
border
:cell-style="{textAlign:'center'}"
style="border-radius: 10px 10px 0px 0px;line-height: 25px"
:header-cell-style="{background:'#6F8294',color:'#FFFFFF'}" size="small"
>
<el-table-column
fixed
prop="lisenceNo"
label="车牌号"
width="150">
</el-table-column>
<el-table-column
prop="username"
label="用户名"
width="150">
</el-table-column>
<el-table-column
prop="starttime"
label="开始时间"
width="200">
</el-table-column>
<el-table-column
prop="endtime"
label="结束时间"
width="200">
</el-table-column>
</el-table>
</template>
</el-row>
<el-row style="margin-top: 10px" class="toolbar">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="queryInfo.pageSize"
:page-size="queryInfo.pageNum"
:page-sizes="[10, 50, 100, 500]"
layout="total, sizes, prev, pager, next, jumper"
:total="total">
</el-pagination>
</el-row>
<el-row>
<el-dialog :title="dialogMap[dialogApply]" :visible.sync="apply_dialog" width="70%" >
<el-form :model="addForm" :rules="rules" ref="addForm" style="margin-top: 40px">
<el-row>
<el-col :span="11">
<el-form-item label=" " :label-width="formLabelWidth" prop="orderAuthorName">
<el-input v-model="addForm.orderAuthorName" autocomplete="off" size="small" style="width: 350px">
<template slot="prepend">结算人名称</template>
</el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label=" " :label-width="formLabelWidth" prop="orderAuthorid">
<el-input v-model="addForm.orderAuthorid" autocomplete="off" size="small" style="width: 350px">
<template slot="prepend">结算人ID</template>
</el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label=" " :label-width="formLabelWidth" prop="orderOperatorId">
<el-input v-model="addForm.orderOperatorId" autocomplete="off" size="small" style="width: 350px">
<template slot="prepend">经办人</template>
</el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label=" " :label-width="formLabelWidth" prop="orderTotalAmount">
<el-input v-model="addForm.orderTotalAmount" autocomplete="off" size="small" style="width: 350px">
<template slot="prepend">订单总额度</template>
</el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label=" " :label-width="formLabelWidth" prop="orderType">
<div class="my-text-area">
<div class="el-input-group__prepend prepand">支付方式</div>
<el-select v-model="addForm.orderType" placeholder="请选择生效状态" size="small" style="width: 260px">
<el-option label="现金" value="现金"></el-option>
<el-option label="微信" value="微信"></el-option>
<el-option label="支付宝" value="支付宝"></el-option>
<el-option label="银行转账" value="银行转账"></el-option>
</el-select>
</div>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label=" " :label-width="formLabelWidth" prop="orderState">
<div class="my-text-area">
<div class="el-input-group__prepend prepand">支付状态</div>
<el-select v-model="addForm.orderState" placeholder="请选择生效状态" size="small" style="width: 260px">
<el-option label="未支付" value="000"></el-option>
<el-option label="已支付" value="001"></el-option>
<el-option label="作废" value="111"></el-option>
</el-select>
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="11">
<el-form-item label=" " :label-width="formLabelWidth" prop="orderRemark">
<el-input v-model="addForm.orderRemark" autocomplete="off" size="small" style="width: 350px">
<template slot="prepend">备注</template>
</el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="apply_dialog = false" size="small">取 消</el-button>
<el-button type="primary" @click="dialogApply==='create'?add():edit()" size="small">提 交</el-button>
</div>
</el-dialog>
</el-row>
</el-card>
</el-row>
</template>
<script>
import {selectHistroy} from '../../api/consigner/vehicle';
export default {
name: "attendance",
data() {
return {
queryInfo: {
lisenceNo:'',
// busnessType:'',
// state:'',
// 当前页数
pageNum: 1,
// 每页几条数据
pageSize: 10,
},
total: 0,
tableData:[],
dialogMap: {
update: '编辑',
create: '新增'
},
dis: undefined,
dialogApply: 'create',
apply_dialog: false,
addForm: {
orderAuthorName: '',
orderAuthorid: '',
orderCreatTime: '',
orderOperatorId: '',
orderRemark: '',
orderState: '',
orderTotalAmount:'',
orderUpdateTime:'',
orderType:''
},
formLabelWidth: '120px',
rules: {
companyId: [
{ required: true, message: '必填', trigger: 'change' }
],
// needCount: [
// { required: true, message: '请输入需要车辆数量', trigger: 'blur' },
// ],
// orginStation: [
// { required: true, message: '请输入起始场站', trigger: 'blur' },
// ],
// endStation: [
// { required: true, message: '请输入目的场站', trigger: 'blur' },
// ],
},
}
},
methods: {
handleSizeChange(val) {
this.queryInfo.pageSize = val
this.getList()
},
handleCurrentChange(val) {
this.queryInfo.pageNum = val
this.getList()
},
getList() {
const _this = this
selectHistroy(this.queryInfo).then((response) => {
const res = response.data
console.log(response.data)
if (res.code !== '200') {
return _this.$message.error('获取消息收发记录，失败！')
}
// 获取列表数据
_this.tableData = res.data.list
// 获取列表的总记录数
_this.total = res.data.total
_this.$message.success('获取消息收发记录，成功！')
}).catch(error => {
// 关闭加载
_this.$message.error(error.toString())
})
},
// 添加对话框，打开事件
applyAdd() {
this.addForm = {
orderAuthorName: '',
orderAuthorid: '',
orderCreatTime: '',
orderOperatorId: '',
orderRemark: '',
orderState: '',
orderTotalAmount:'',
orderUpdateTime:'',
orderType:''
};
this.dialogApply= 'create';
this.dis= 'create';
this.apply_dialog = true;
},
// 添加功能
add() {
this.$refs.addForm.validate(valid => {
// 未通过，表单预校验
if (!valid) return;
save(this.addForm).then((response) => {
let res = response.data;
// 添加失败
if (res.code !== '200') {
return this.$message.error(res.msg);
}
// 添加，成功
this.$message.success(res.msg);
// 隐藏对话框
this.apply_dialog = false;
// 刷新列表
this.getList();
}).catch(error => {
this.$message.error(error.toString());
});
})
},
// 打开编辑
applyEdit(row) {
this.apply_dialog = true;
this.dialogApply = 'update';
this.dis= 'update';
this.addForm=row;
},
// 编辑功能
edit() {
// 进行表单的预验证
this.$refs.addForm.validate(valid => {
// 未通过，表单预校验
if (!valid) return
edit(this.addForm).then((response) => {
// console.log(row)
const res = response.data
if (res.code != '200') {
return this.$message.error(res.msg)
}
this.$message.success(res.msg)
// 隐藏对话框
this.apply_dialog = false
// 刷新列表
this.getList()
}).catch(error => {
this.$message.error(error.toString())
})
})
},
// 删除
applyDel(row) {
// 弹框询问是否删除？
this.$confirm('此操作永久删除该消息收发记录, 是否继续?', '警告', {
confirmButtonText: '确定删除',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
// console.log(row);
remove(row).then((response) => {
// console.log(row)
const res = response.data
this.$message.success(res.msg)
this.getList()
}).catch(error => {
this.$message.error(error)
})
}).catch(() => {
})
},
},
mounted() {
this.getList();
// this.getYardList();
}
}
</script>
<style scoped>
.toolbar{
height: 60px;
background-color: white;
/*line-height: 60px;*/
vertical-align: middle;
border-radius: 5px 5px 5px 5px;
padding: 15px 0 0 20px;
box-shadow: 0px 5px 5px #e5e8eb;
}
.my-text-area .prepand{
float: left;
width:89px;
height: 28px;
font-size: 12px;
line-height: 28px;
}
</style>
<style>
.my-text-area .el-textarea__inner{
min-height: 28px;
height: 28px;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
}
</style>
... ...
<template>
<el-row>
<el-card style="background-color: #F5F7FA">
<!-- 搜索区域-->
<el-row class="toolbar">
<el-form :model="queryInfo">
<el-col :span="6">
<el-form-item label="" prop="lisenceNo">
<el-input v-model="queryInfo.lisenceNo" size="small" style="width: 170px"
placeholder="车牌号" clearable required>
<template slot="prepend">车牌号</template>
</el-input>
</el-form-item>
</el-col>
<el-col :span="2">
<el-button type="primary" icon="el-icon-search" size="small" @click="getList()">
查询
</el-button>
<!-- <el-button type="success" icon="el-icon-edit" size="small" @click="applyAdd()">新增</el-button>-->
</el-col>
</el-form>
</el-row>
<!-- 列表区域-->
<el-row>
<el-table
:data="tableData"
border
:cell-style="{textAlign:'center'}"
style="border-radius: 10px 10px 0px 0px;line-height: 25px"
:header-cell-style="{background:'#6F8294',color:'#FFFFFF'}" size="small"
>
<el-table-column
fixed
prop="lisenceNo"
label="车牌号"
width="120">
</el-table-column>
<el-table-column
prop="username"
label="用户名"
width="120">
</el-table-column>
<el-table-column
prop="starttime"
label="开始时间">
</el-table-column>
<el-table-column
fixed="right"
label="操作"
width="120">
<template slot-scope="scope">
<el-button type="danger" size="mini" @click="applyEnd(scope.row)">结束出勤</el-button>
</template>
</el-table-column>
</el-table>
</el-row>
<el-row style="margin-top: 10px" class="toolbar">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="queryInfo.pageSize"
:page-size="queryInfo.pageNum"
:page-sizes="[10, 50, 100, 500]"
layout="total, sizes, prev, pager, next, jumper"
:total="total">
</el-pagination>
</el-row>
</el-card>
</el-row>
</template>
<script>
import {selectList,DoneTask} from '../../api/consigner/vehicle';
export default {
data() {
return {
queryInfo: {
lisenceNo:'',
// 当前页数
pageNum: 1,
// 每页几条数据
pageSize: 10,
},
total: 0,
tableData:[],
}
},
methods: {
handleSizeChange(val) {
this.queryInfo.pageSize = val
this.getList()
},
handleCurrentChange(val) {
this.queryInfo.pageNum = val
this.getList()
},
getList() {
const _this = this
selectList(this.queryInfo).then((response) => {
const res = response.data
console.log(response.data)
if (res.code !== '200') {
return _this.$message.error('获取消息收发记录，失败！')
}
// 获取列表数据
_this.tableData = res.data.list;
// 获取列表的总记录数
_this.total = res.data.total
_this.$message.success('获取消息收发记录，成功！')
}).catch(error => {
// 关闭加载
_this.$message.error(error.toString())
})
},
// 结束出勤
applyEnd(row) {
// 弹框询问是否结束？
this.$confirm('是否继续?', '警告', {
confirmButtonText: '确定结束',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
DoneTask(row).then((response) => {
const res = response.data
this.$message.success(res.msg)
this.getList()
}).catch(error => {
this.$message.error(error)
})
}).catch(() => {
})
},
},
mounted() {
this.getList();
}
}
</script>
... ...
<template>
<div>
<el-row>
<el-card style="background-color: #F5F7FA">
<el-row>
<el-form :model="queryInfo" :rules="rules" ref="ruleForm">
<el-col :span="4.5">
<el-form-item label="" prop="vclN">
<el-input v-model="queryInfo.vclN" size="small" style="width: 170px"
placeholder="车牌号" clearable required>
<template slot="prepend">车牌号</template>
</el-input>
</el-form-item>
</el-col>
<el-col :span="4.5">
<el-form-item label="" prop="vco">
<div class="my-text-area">
<div class="el-input-group__prepend prepand">车牌类型</div>
<el-select v-model="queryInfo.vco" placeholder="车牌类型" style="width: 70px">
<el-option label="蓝牌" value="1"></el-option>
<el-option label="黄牌" value="2"></el-option>
<el-option label="绿牌" value="3"></el-option>
</el-select>
</div>
</el-form-item>
</el-col>
<el-col :span="6.5">
<el-form-item label="" prop="qryEtm">
<div class="my-text-area">
<div class="el-input-group__prepend prepand">开始时间</div>
<!-- <span class="demonstration">带快捷选项</span>-->
<el-date-picker
v-model="queryInfo.qryEtm"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd HH:mm:ss"
placeholder="选择日期时间"
align="right" style="width: 170px"
:picker-options="pickerOptions">
</el-date-picker>
</div>
</el-form-item>
</el-col>
<el-col :span="6.5">
<el-form-item label="" prop="qryBtm">
<div class="my-text-area">
<div class="el-input-group__prepend prepand">结束时间</div>
<!-- <span class="demonstration">带快捷选项</span>-->
<el-date-picker
v-model="queryInfo.qryBtm"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
format="yyyy-MM-dd HH:mm:ss"
placeholder="选择日期时间"
align="right" style="width: 170px"
:picker-options="pickerOptions">
</el-date-picker>
</div>
</el-form-item>
</el-col>
</el-form>
<el-col :span="1">
<el-button type="primary" size="mini" @click="getList()">
查询
</el-button>
</el-col>
</el-row>
</el-card>
</el-row>
<div id="mapContainer" ref="mapContainer" style="width: 100%; height: 500px;"></div>
</div>
</template>
<script>
import AMapLoader from '@amap/amap-jsapi-loader';
import { historyTrack } from '../../api/consigner/vehicle';
export default {
data() {
return {
mapInstance: null,
queryInfo: {
vclN: '',
vco: '2',
//开始时间
qryEtm: '',
//结束时间
qryBtm: '',
},
pickerOptions: {
shortcuts: [{
text: '最近一周',
onClick(picker) {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
picker.$emit('pick', [start, end]);
}
}, {
text: '最近一个月',
onClick(picker) {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
picker.$emit('pick', [start, end]);
}
}, {
text: '最近三个月',
onClick(picker) {
const end = new Date();
const start = new Date();
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
picker.$emit('pick', [start, end]);
}
}]
},
tableData:[],
myArray: [{
"mlg": "24284.1",
"agl": "268",
"gtm": "20211110/000025",
"hgt": "302",
"lat": "17783673",
"lon": "63774741",
"spd": "0.0"
},
{
"mlg": "24284.1",
"agl": "268",
"gtm": "20211110/000055",
"hgt": "302",
"lat": "17783673",
"lon": "63774741",
"spd": "0.0"
}],
convertedCoords: [],
rules: {
vclN: [
{ required: true, message: '请输入车牌号', trigger: 'blur' },
// { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
],
vco: [
{ required: true, message: '请选择车牌类型', trigger: 'change' }
],
qryEtm: [
{ required: true, message: '请选择开始日期', trigger: 'change' }
],
qryBtm: [
{ required: true, message: '请选择结束日期', trigger: 'change' }
],
}
};
},
computed:{
},
methods: {
getList() {
this.$refs.ruleForm.validate(valid => {
if (!valid) return;
const _this = this;
historyTrack(this.queryInfo).then((response) => {
const res = response.data;
if (res.code !== '200') {
return _this.$message.error('获取车辆轨迹失败！');
}
// 调用initMap方法，并将轨迹数据传递过去
_this.initMap(res.data.data.trackArray);
_this.$message.success('获取车辆轨迹成功！');
}).catch(error => {
_this.$message.error('获取车辆轨迹失败：' + error.toString());
});
})
},
initMap(trackArray) {
const _this = this;
AMapLoader.load({
key: 'fdb27c13681d084e85ff8457b5cbe540',
version: '2.0',
plugins: [], // 可以加载地图插件，比如定位、地图工具等
}).then((AMap) => {
// 创建地图对象并存储在 _this.mapInstance 中
_this.map = new AMap.Map('mapContainer', {
zoom: 10, // 设置地图缩放级别
center: [116.397428, 39.90923], // 设置地图中心点坐标
});
// 将轨迹数据添加到地图上
//var lineArr = trackArray.map((item) => [item.longitude / 600000.0, item.latitude / 600000.0]);
this.convertedCoords = this.convertBDToAMap(trackArray);
console.log(this.convertedCoords)
_this.poly = new AMap.Polyline({
path: this.convertedCoords, // 设置折线路径
strokeColor: "#3366ff", // 线颜色
strokeOpacity: 1, // 线透明度
strokeWeight: 3, // 线宽
strokeStyle: "solid", // 线样式
});
_this.poly.setMap(_this.map);
_this.map.setCenter(this.convertedCoords[0])
//_this.map.setFitView();
}).catch((err) => {
console.error('初始化地图失败：', err);
});
},
convertBDToAMap(bdCoordData) {
const aMapCoordData = [];
bdCoordData.forEach(coord => {
const lon = parseFloat(coord.lon) / 600000.0; // 将经度从北斗格式转换为高德地图格式
const lat = parseFloat(coord.lat) / 600000.0; // 将纬度从北斗格式转换为高德地图格式
aMapCoordData.push([lon, lat]); // 添加到结果数组
});
return aMapCoordData;
},
},
mounted() {
this.initMap(this.myArray);
},
};
</script>
<style scoped>
.my-text-area .prepand{
float: left;
width:89px;
height: 28px;
font-size: 12px;
line-height: 28px;
}
</style>
<style>
.my-text-area .el-textarea__inner{
min-height: 28px;
height: 28px;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
}
.rounded-corner {
border-radius: 10px; /* 设置圆角的半径为10像素 */
background-color: #f0f0f0; /* 背景颜色 */
padding: 10px; /* 内边距 */
margin: 10px; /* 外边距 */
box-shadow: 0 0 5px #ddd; /* 盒子阴影效果 */
}
</style>
... ...
... ... @@ -3,29 +3,51 @@
<el-row>
<el-card style="background-color: #F5F7FA">
<el-row>
<el-col :span="5">
<el-input v-model="queryInfo.vno" prefix-icon="el-icon-search" size="small" style="width: 200px"
placeholder="车牌号" clearable>
<template slot="prepend">车牌号</template>
</el-input>
<el-form :model="queryInfo" :rules="rules" ref="ruleForm">
<el-col :span="6">
<el-form-item label="" prop="vno">
<div class="my-text-area">
<div class="el-input-group__prepend prepand">车牌号</div>
<el-select v-model="queryInfo.vno"
@click.native="getCreden"
default-first-option
:loading="loading" clearable placeholder="请选择" style="width: 100px">
<el-option
v-for="item in vnos"
:key="item.lisenceNo"
:label="item.lisenceNo"
:value="item.lisenceNo"
:disabled="item.disabled">
</el-option>
</el-select>
</div>
<!-- <el-input v-model="queryInfo.vno" size="small" style="width: 200px"-->
<!-- placeholder="车牌号" clearable required>-->
<!-- <template slot="prepend">车牌号</template>-->
<!-- </el-input>-->
</el-form-item>
</el-col>
<el-col :offset="1" :span="12">
<el-col :span="6">
<el-form-item label="" prop="vnocolor">
<div class="my-text-area">
<div class="el-input-group__prepend prepand">车牌类型</div>
<el-select v-model="queryInfo.vnocolor" placeholder="车牌类型" style="width: 200px" clearable>
<el-option label="蓝色" value="1"></el-option>
<el-option label="黄色" value="2"></el-option>
<el-option label="绿色" value="3"></el-option>
<el-select required v-model="queryInfo.vnocolor" placeholder="车牌类型" style="width: 100px">
<el-option label="蓝牌" value="1"></el-option>
<el-option label="黄牌" value="2"></el-option>
<el-option label="绿牌" value="3"></el-option>
</el-select>
</div>
</el-form-item>
</el-col>
<el-col :span="3">
<el-button type="primary" icon="el-icon-search" size="small" @click="getList()">
<el-button type="primary" icon="el-icon-search" size="mini" @click="getList()">
查询
</el-button>
</el-col>
</el-form>
</el-row>
</el-card>
</el-row>
<div id="mapContainer" style="width: 100%; height: 500px;"></div>
... ... @@ -33,7 +55,8 @@
</template>
<script>
import AMapLoader from '@amap/amap-jsapi-loader';
import { selectVehicle } from '../../api/consigner/vehicle';
import { selectVehicle,selectNameList } from '../../api/consigner/vehicle';
import {loginedUserInfo} from "../../api/user";
export default {
name: 'MapComponent',
... ... @@ -42,12 +65,44 @@
mapInstance: null,
queryInfo: {
vno: '',
vnocolor: ''
vnocolor: '2'
},
vnos:[],
loading:false,
rules: {
vno: [
{ required: true, message: '请输入车牌号', trigger: 'blur' },
// { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
],
vnocolor: [
{ required: true, message: '请选择车牌类型', trigger: 'change' }
],
}
};
},
methods: {
//获取车牌号
getCreden(){
this.vnos=[];
//let params={};
this.loading = true;
console.log(loginedUserInfo().username)
selectNameList({'username':loginedUserInfo().username}).then(res =>{
console.log(res)
if (res!=null) {
console.log(res.data.data)
setTimeout(() => {
this.loading = false;
this.vnos=res.data.data;
}, 200);
} else {
this.vnos = [];
}
});
},
getList() {
this.$refs.ruleForm.validate(valid => {
if (!valid) return;
const _this = this;
selectVehicle(this.queryInfo).then((response) => {
const res = response.data;
... ... @@ -92,6 +147,7 @@
}).catch(error => {
_this.$message.error('获取车辆位置失败：' + error.toString());
});
})
},
initMap() {
AMapLoader.load({
... ...
... ... @@ -2,724 +2,834 @@
<el-container>
<el-main>
<el-card style="background-color: #F5F7FA">
<!-- 搜素区域 -->
<div>
<el-form :model="queryInfo" :rules="queryFormRules" ref="queryFormRef" status-icon>
<el-form-item>
<el-col :span="4">
<el-form-item prop="gmtCreate">
<el-date-picker v-model="queryInfo.gmtCreate" type="date" value-format="yyyy-MM-dd"
placeholder="选择创建调度时间"
style="width: 200px"></el-date-picker>
<!--工具条-->
<el-row>
<el-form :model="filters" :rules="rules" ref="ruleForm">
<el-col :span="5">
<el-form-item label="" prop="trailerFrameNo">
<el-input v-model="filters.trailerFrameNo" placeholder="车牌号查询" style="width: 170px">
<template slot="prepend">车牌号</template>
</el-input>
</el-form-item>
</el-col>
<el-col :span="4" style="margin-left: 50px">
<el-form-item prop="dispatchType">
<el-select v-model="queryInfo.dispatchType" placeholder="请选择业务类型"
style="width: 200px"
clearable>
<el-col :span="6">
<el-form-item label="" prop="veState">
<div class="my-text-area">
<div class="el-input-group__prepend prepand">备案状态</div>
<el-select v-model="filters.veState" placeholder="请选择" style="width: 100px">
<el-option
v-for="item in dispatchTypeList"
v-for="item in veStateOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</el-form-item>
</el-col>
<el-col :span="4" style="margin-left: 50px">
<el-form-item prop="status">
<el-select v-model="queryInfo.status" placeholder="记录状态" clearable
style="width:200px;margin-left: 6px">
<el-col :span="6">
<el-form-item label="" prop="veClassFlag">
<div class="my-text-area">
<div class="el-input-group__prepend prepand">业务类型</div>
<el-select v-model="filters.veClassFlag" placeholder="请选择" style="width:100px">
<el-option
v-for="item in statusList"
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</el-form-item>
</el-col>
<el-button type="primary" style="margin-left: 60px"
@click="getDispatchNodeList">查询调度记录
</el-button>
<el-button type="success" style="margin-left: 15px" @click="dispatchFormVisible = true">
我要调度车辆
</el-button>
<el-col :span="6">
<el-form-item>
<el-button type="primary" v-on:click="getReCord(1)">查询</el-button>
<el-button type="success" @click="companyAdd">新增</el-button>
</el-form-item>
</el-col>
</el-form>
<el-row style="margin-top: 20px;">
</el-row>
</div>
<!--调度记录列表区域-->
<div style="margin-top: 20px;">
<el-table :data="DispatchNoteList" border highlight-current-row v-loading="listLoading"
:row-class-name="rowStatus"
element-loading-text="拼命加载中">
<el-table-column type="index" align="center"></el-table-column>
<el-table-column label="用户名称" prop="userName" align="center" width="100"></el-table-column>
<el-table-column label="联系方式" prop="userMobile" align="center" width="120"></el-table-column>
<el-table-column label="状态" prop="status" align="center" width="120">
<template slot-scope="scope">
<span v-if="scope.row.status ==='1'">完成状态</span>
<span v-if="scope.row.status ==='2'">执行状态</span>
<span v-if="scope.row.status ==='3'">取消状态</span>
<span v-if="scope.row.status ==='4'">待执行状态</span>
</template>
<!--列表-->
<el-table :data="recordList" highlight-current-row v-loading="listLoading" style="border-radius: 10px 10px 0px 0px;line-height: 25px"
:header-cell-style="{background:'#6F8294',color:'#FFFFFF'}" size="small">
<el-table-column type="selection" width="55" fixed="left">
</el-table-column>
<el-table-column label="业务类型" prop="dispatchType" align="center" width="120">
<template slot-scope="scope">
<span v-if="scope.row.dispatchType ==='1'">进站送货</span>
<span v-if="scope.row.dispatchType ==='2'">出站提货</span>
<span v-if="scope.row.dispatchType ==='3'">货物调拨</span>
<span v-if="scope.row.dispatchType ==='4'">货物流转</span>
</template>
<el-table-column prop="coCode" label="运输公司名称" width="120px" >
</el-table-column>
<el-table-column label="车牌号码" prop="licensePlateNumber" align="center"
width="120"></el-table-column>
<el-table-column label="车辆类型" prop="vehicleType" align="center" width="120">
<template slot-scope="scope">
<span v-if="scope.row.vehicleType ==='1'">重型货车</span>
<span v-if="scope.row.vehicleType ==='2'">中型货车</span>
<span v-if="scope.row.vehicleType ==='3'">轻型货车</span>
<span v-if="scope.row.vehicleType ==='4'">微型货车</span>
<span v-if="scope.row.vehicleType ==='5'">拖车</span>
<span v-if="scope.row.vehicleType ==='6'">叉车</span>
</template>
<el-table-column prop="proposer" label="挂靠单位" width="120px" >
</el-table-column>
<el-table-column label="场站位置" prop="station" align="center" width="120">
<template slot-scope="scope">
<span v-if="scope.row.station ==='1'">西货站</span>
<span v-if="scope.row.station ==='2'">综保区</span>
<span v-if="scope.row.station ==='3'">军投</span>
<span v-if="scope.row.station ==='4'">快邮</span>
</template>
<el-table-column prop="veClassFlag" label="业务类型" :formatter="veClassFlag" width="130px" >
</el-table-column>
<el-table-column prop="domesticLisenceNo" label="国内车牌" width="100px">
</el-table-column>
<el-table-column prop="veOwnerName" label="车主姓名" width="100px" >
</el-table-column>
<el-table-column label="创建时间" prop="gmtCreate" align="center" width="160"></el-table-column>
<el-table-column label="开始时间" prop="beginTime" align="center" width="160"></el-table-column>
<el-table-column label="完成时间" prop="endTime" align="center" width="160"></el-table-column>
<el-table-column label="操作" width="220px" fixed="right" align="center">
<el-table-column prop="ownerInsideTel" label="车主联系方式" width="110px" >
</el-table-column>
<el-table-column prop="mainPort" label="关区代码" width="100px" >
</el-table-column>
<el-table-column prop="selfWt" label="自重" width="90px">
</el-table-column>
<el-table-column prop="veTon" label="载重" width="90px">
</el-table-column>
<el-table-column prop="returnmessage" label="备案结果" width="100px">
</el-table-column>
<el-table-column prop="createDate" label="创建时间" width="160px">
</el-table-column>
<el-table-column prop="updateDate" label="更新时间" width="160px">
</el-table-column>
<el-table-column label="操作" align="center" width="240" fixed="right">
<!-- v-if="isAdmin"-->
<template slot-scope="scope">
<!--查看按钮-->
<el-tooltip effect="dark" content="查看" placement="top-start" :enterable="false">
<el-button type="primary" icon="el-icon-edit" size="mini"
@click="showDialogVisible(scope.row)">查看
</el-button>
</el-tooltip>
<!--取消调度按钮-->
<el-tooltip effect="dark" content="取消调度" placement="top-start" :enterable="false">
<el-button type="danger" icon="el-icon-delete" size="mini"
:disabled="scope.row.endTime!==null && scope.row.endTime!==''"
@click="cancelDispatch(scope.row)" :loading="cancelLoading">取消调度
</el-button>
</el-tooltip>
<el-button type="warning" size="mini" @click="handlOut(scope.$index, scope.row)">出任务</el-button>
<el-button type="success" size="mini" @click="handlEdit(scope.$index, scope.row)">编辑</el-button>
<el-button type="danger" size="mini" @click="handleDel(scope.$index, scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<!--分页区域-->
<div style="margin-top: 10px">
<!-- 分页-->
<div style="margin-top: 10px" class="toolbar">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="this.queryInfo.pageNum"
:page-sizes="[10,20,30,50]"
:page-size="this.queryInfo.pageSize"
:current-page="pageSize"
:page-sizes="[10, 100, 200, 300]"
:page-size="10"
layout="total, sizes, prev, pager, next, jumper"
:total="total">
:total="this.total">
</el-pagination>
</div>
</div>
</el-card>
<!-- 我要调度车辆，对话框 -->
<div>
<el-dialog
title="我要调度车辆"
:visible.sync="dispatchFormVisible"
width="50%" @close="dispatchDialogClosed">
<!-- :rules="dispatchFormRules" ref="dispatchFormRef"-->
<el-form :model="dispatchForm" label-width="100px" status-icon
:rules="dispatchFormRules" ref="dispatchFormRef"
style="margin-left:10%;margin-right:10%;background-color: #F5F7FA">
<br>
<el-form-item label="车辆类型：" prop="vehicleType">
<el-select v-model="dispatchForm.vehicleType" style="width: 300px" clearable
placeholder="请选择车辆类型">
<el-option
v-for="item in vehicleTypeList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<el-dialog :title=dialogMap[dialogStatus] :visible.sync="addFormVisible" :close-on-click-modal="false" width="80%" v-dialog-drag>
<el-form :model="addForm" label-width="20px" :rules="addFormRules" ref="addForm" label-position="left">
<el-row>
<el-col :span="7">
<el-row>
<el-form-item label=" " prop="domesticLisenceNo">
<el-input v-model="addForm.domesticLisenceNo" onkeyup="this.value=this.value.replace(/(^\s*)|(\s*$)/g,'')"
@change="findTrailerFrameNo(addForm.domesticLisenceNo)"
auto-complete="on" placeholder="国内车牌">
<template slot="prepend">国内车牌</template>
</el-input>
</el-form-item>
<el-form-item label="车辆数量：" prop="vehicleNumber">
<el-input-number style="width: 200px" v-model="dispatchForm.vehicleNumber"
:min="1" :max="100" controls-position="right">
</el-input-number>
<span style="margin-left:5px;font-size: 18px">辆</span>
</el-row>
<el-row>
<el-form-item label=" " prop="veOwnerName">
<el-input v-model="addForm.veOwnerName" auto-complete="on" placeholder="车主姓名">
<template slot="prepend">车主姓名</template>
</el-input>
</el-form-item>
<el-form-item label="场站位置：" prop="station">
<el-select v-model="dispatchForm.station" style="width: 300px" clearable
placeholder="请选择场站位置">
<el-option
v-for="item in stationList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-row>
<el-row>
<el-form-item label=" " prop="proposer">
<el-input v-model="addForm.proposer" auto-complete="on" placeholder="挂靠单位">
<template slot="prepend">挂靠单位</template>
</el-input>
</el-form-item>
<el-form-item label="业务类型：" prop="dispatchType">
<el-select v-model="dispatchForm.dispatchType" style="width: 300px;" clearable
placeholder="请选择业务类型">
</el-row>
<el-row>
<el-form-item label=" " prop="coCode">
<el-input v-model="addForm.coCode" auto-complete="on" placeholder="运输公司名称">
<template slot="prepend">运输公司名称</template>
</el-input>
</el-form-item>
</el-row>
<el-row>
<el-form-item label=" " prop="veClassFlag">
<div class="my-text-area">
<div class="el-input-group__prepend prepand">业务类型</div>
<el-select v-model="addForm.veClassFlag" placeholder="请选择" style="width: 165px">
<el-option
v-for="item in dispatchTypeList"
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
<br>
</el-form>
<!--底部按钮区域-->
<span slot="footer" class="dialog-footer">
<el-button @click="dispatchFormVisible = false">取 消</el-button>
<el-button type="primary" @click="dispatchVehicle" :loading="dispatchLoading">确定调度车辆</el-button>
</span>
</el-dialog>
</div>
<!-- 查看调度记录，对话框 -->
<div>
<el-dialog
style="margin-top: -50px"
title="查看调度记录明细"
:visible.sync="viewDialogVisible"
text-align="center"
width="60%" @close="showDialogClosed">
<!-- 表单显示区域 :rules="dispatchFormRules" -->
<el-form :model="showForm" ref="showFormRef"
:inline="true" align="center"
style="background-color: #F5F7FA;margin-left: 5%;margin-right: 5%">
<div style="margin-top: -15px">
<br>
<el-form-item label="用户名称：" prop="userName">
<el-input v-model="showForm.userName" style="width: 200px;" size="small"
readonly></el-input>
</el-form-item>
<el-form-item label="联系方式：" prop="userMobile">
<el-input v-model="showForm.userMobile" style="width: 200px;" size="small"
readonly></el-input>
</el-row>
<el-row>
<el-form-item label="" prop="icCode">
<el-input v-model="addForm.icCode" auto-complete="on" placeholder="IC卡编号">
<template slot="prepend">IC卡编号</template>
</el-input>
</el-form-item>
<el-form-item label="车辆类型：" prop="vehicleType">
<el-select v-model="showForm.vehicleType" style="width:200px" size="small" readonly
placeholder="请选择车辆类型">
</el-row>
</el-col>
<el-col :offset="1" :span="7">
<el-row>
<el-form-item label=" " prop="mainPort">
<div class="my-text-area">
<div class="el-input-group__prepend prepand">海关代码</div>
<el-select v-model="addForm.mainPort" placeholder="请选择" style="width: 165px">
<el-option
v-for="item in vehicleTypeList"
v-for="item in mainPortOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</el-form-item>
<el-form-item label="车牌号码：" prop="licensePlateNumber">
<el-input v-model="showForm.licensePlateNumber" style="width: 200px;" size="small"
readonly></el-input>
</el-row>
<el-row>
<el-form-item label=" " prop="ownerInsideTel">
<el-input v-model="addForm.ownerInsideTel" auto-complete="on" placeholder="车主联系电话">
<template slot="prepend">车主联系电话</template>
</el-input>
</el-form-item>
<el-form-item label="场站位置：" prop="station">
<el-select v-model="showForm.station" style="width:200px" readonly size="small"
placeholder="请选择场站位置">
<el-option
v-for="item in stationList"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-row>
<el-row>
<el-form-item label=" " prop="veFactoryDate">
<div class="my-text-area">
<div class="el-input-group__prepend prepand">行驶证有效期</div>
<el-date-picker
style="width: 165px"
v-model="addForm.veFactoryDate"
type="date"
placeholder="选择日期">
</el-date-picker>
</div>
</el-form-item>
<el-form-item label="业务类型：" prop="dispatchType">
<el-select v-model="showForm.dispatchType" style="width:200px" readonly size="small"
placeholder="请选择业务类型">
</el-row>
<el-row>
<el-form-item label=" " prop="veState">
<div class="my-text-area">
<div class="el-input-group__prepend prepand">备案状态</div>
<el-select v-model="addForm.veState" placeholder="请选择" style="width: 165px">
<el-option
v-for="item in dispatchTypeList"
v-for="item in veStateOptions"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
</el-form-item>
</el-row>
<el-row>
<el-form-item label=" " prop="selfWt">
<el-input v-model="addForm.selfWt" auto-complete="on" oninput="value=value.replace(/[^\d.+]/g,'')" placeholder="单位为KG">
<template slot="prepend">自重/空车重量</template>
</el-input>
</el-form-item>
</el-row>
<el-row>
<el-form-item label=" " prop="lockNum">
<div class="my-text-area">
<div class="el-input-group__prepend prepand">关锁号</div>
<el-autocomplete
class="inline-input"
v-model="addForm.lockNum"
:fetch-suggestions="querySearch"
value-key="lockNum"
highlight-first-item
clearable
placeholder="请输入内容"
style="width: 165px"
></el-autocomplete>
</div>
</el-form-item>
</el-row>
</el-col>
<el-col :offset="1" :span="7">
<el-row>
<el-form-item label=" " prop="veTon">
<el-input v-model="addForm.veTon" auto-complete="on" placeholder="核定载货重量">
<template slot="prepend">载货重量</template>
</el-input>
</el-form-item>
</el-row>
<el-row>
<el-form-item label=" " prop="trailerLicenseNo">
<el-input v-model="addForm.trailerLicenseNo" auto-complete="on" placeholder="挂车牌号">
<template slot="prepend">挂车牌号</template>
</el-input>
</el-form-item>
</el-row>
<el-row>
<el-form-item label=" " prop="trailerFrameNo">
<el-input v-model="addForm.trailerFrameNo" auto-complete="on" placeholder="挂车车架号">
<template slot="prepend">挂车架号</template>
</el-input>
</el-form-item>
<el-form-item label="创建时间：" prop="gmtCreate">
<el-input v-model="showForm.gmtCreate" style="width: 200px;" size="small"
readonly></el-input>
</el-row>
<el-row>
<el-form-item label=" " prop="apprNo">
<el-input v-model="addForm.apprNo" auto-complete="on" placeholder="车辆备案编号">
<template slot="prepend">车辆备案编号</template>
</el-input>
</el-form-item>
<el-form-item label="开始时间：" prop="beginTime">
<el-input v-model="showForm.beginTime" style="width: 200px;" size="small"
readonly></el-input>
</el-row>
<el-row>
<el-form-item label=" " prop="veCustomsNo">
<el-input v-model="addForm.veCustomsNo" auto-complete="on" placeholder="电子车牌编号">
<template slot="prepend">电子车牌编号</template>
</el-input>
</el-form-item>
<el-form-item label="结束时间：" prop="endTime">
<el-input v-model="showForm.endTime" style="width: 200px;" size="small"
readonly></el-input>
</el-row>
<el-row>
<el-form-item label=" " prop="memo">
<el-input v-model="addForm.memo" auto-complete="on" placeholder="备注">
<template slot="prepend">备注</template>
</el-input>
</el-form-item>
<el-form-item label="记录状态：" prop="status">
<el-select v-model="showForm.status" placeholder="记录状态" style="width:200px" size="small"
readonly>
</el-row>
</el-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="addFormVisible = false" type="danger"
style="width: 100px">取消</el-button>
<el-button type="primary" style="width: 100px"
@click="dialogStatus ==='save'? addSubmit():editSubmit()" v-loading="addloading">保存</el-button>
</div>
</el-dialog>
<!-- //出任务-->
<el-dialog title="出任务" :visible.sync="dialogVisible">
<el-form :model="form">
<el-form-item label="" :label-width="formLabelWidth">
<el-col :span="15">
<el-input v-model="form.lisenceNo" autocomplete="off" disabled>
<template slot="prepend">车牌号</template>
</el-input>
</el-col>
</el-form-item>
<el-form-item label="" :label-width="formLabelWidth">
<div class="my-text-area">
<div class="el-input-group__prepend prepand">用户名</div>
<el-col :span="14">
<el-select v-model="form.username"
@click.native="getUsers"
default-first-option
:loading="loading" clearable placeholder="请选择">
<el-option
v-for="item in statusList"
:key="item.value"
:label="item.label"
:value="item.value">
v-for="item in usernames"
:key="item.username"
:label="item.username"
:value="item.username"
:disabled="item.disabled">
</el-option>
</el-select>
</el-form-item>
<br>
</el-col>
</div>
</el-form-item>
<el-form-item label="" :label-width="formLabelWidth">
<el-col :span="14">
<el-tag v-if="lisenceNoSatus=false" type="success">在线</el-tag>
<el-tag v-else type="info">离线</el-tag>
</el-col>
</el-form-item>
</el-form>
<!--底部按钮区域-->
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="viewDialogVisible = false">结束查看</el-button>
</span>
</el-dialog>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button @click="saveOut()">确 定</el-button>
</div>
</el-dialog>
</el-card>
</el-main>
</el-container>
</template>
<script>
import {selectDispatchNoteList, dispatch, cancel, getUser} from '../../api/dispatch_api'
// import {selectDispatchNoteList, dispatch, cancel, getUser} from '../../api/dispatch_api'
import { list, save, remove, edit} from '../../api/road_verecord/verecord';
import {isAdmin, loginedUserInfo} from "../../api/user";
//获取关锁列表
// import {list as lockList} from "../../api/lock_info/lock_info";
import { getUserList } from '../../api/user';
import {selectVehicle, insertSelective, selectHistroy} from '../../api/consigner/vehicle';
export default {
name: 'dispatch_api',
created() {
},
data() {
/**
* 验证手机号的自定义规则
*/
var userMobileValid = (rule, value, callback) => {
//验证手机号的正则表达式
const regMobile = /^(0|86|17951)?(13[0-9]|15[0123456789]|17[678]|18[0-9]|14[57])[0-9]{8}$/;
if (regMobile.test(value)) {
//合法的手机号
return callback();
}
callback(new Error('请输入合法的手机号'));
};
return {
/**
* 查询列表
*/
queryInfo: {
//用户姓名
userName: '',
//用户联系方式
userMobile: '',
//记录状态
status: '',
//调度时间
gmtCreate: new Date(),
//业务类型
dispatchType: '',
//当前的页数
pageNum: 1,
//当前每页显示多少条数据
pageSize: 10
filters: {
trailerFrameNo: '',
veState: '',
veClassFlag: '',
},
/**
* 记录列表，总条数
*/
total: 0,
/**
* 所有,调度记录列表
*/
DispatchNoteList: [],
/**
* 我要调度车辆，表单
*/
dispatchForm: {
userName: '',
userMobile: '',
//车辆数量
vehicleNumber: 1,
//车辆类型
vehicleType: '2',
//场站位置
station: '1',
//调度业务类型
dispatchType: '1'
rules: {
// trailerFrameNo: [
// { required: true, message: '请输入车牌号', trigger: 'blur' },
// // { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
// ],
// veState: [
// { required: true, message: '请选择备案状态', trigger: 'change' }
// ],
// veClassFlag: [
// { required: true, message: '请选择业务类型', trigger: 'change' }
// ],
},
/**
* 查看记录明细,表单
*/
showForm: {},
/**
* 控制添加用户对话框的显示与隐藏
*/
dispatchFormVisible: false,
/**
* 控制查看调度记录明细，对话框的显示与隐藏
*/
viewDialogVisible: false,
/**
* loading加载
*/
/* 获取列表时的加载 */
recordList: [],
lockInfoList: [],
total: 0,
pageSize: 1,
limitSize: 10,
listLoading: false,
/* 调度车辆时的加载 */
dispatchLoading: false,
/* 取消调度时的加载 */
cancelLoading: false,
/**
* 业务类型,选项列表
*/
dispatchTypeList: [
{
value: '1',
label: '进站送货'
},
{
value: '2',
label: '出站提货'
isAdmin: false,
addFormVisible: false,
disabledOne: true,
dialogMap: {
edit: '编辑',
save: '新增'
},
{
value: '3',
label: '货物流转'
dialogStatus: undefined,
addloading: false,
addForm: {
mainPort: '4604',
proposer: '',
coCode: '',
domesticLisenceNo: '',
veOwnerName: '',
ownerInsideTel: '',
veFactoryDate: '',
selfWt: '',
veTon: '',
trailerLicenseNo: '',
apprNo: '',
veClassFlag: '',
memo: '',
createBy: '',
veState: 'N',
icCode: '',
lockNum: ''
},
{
value: '4',
label: '货物调拨'
}
],
/**
* 车辆类型，选项列表
*/
vehicleTypeList: [
{
options: [{
value: '0',
label: '普通车辆'
}, {
value: '1',
label: '重型货车'
},
{
label: '调拨车辆'
},{
value: '2',
label: '中型货车'
},
{
value: '3',
label: '经济货车'
},
{
value: '4',
label: '微型货车'
},
{
value: '5',
label: '拖车'
},
{
value: '6',
label: '叉车'
}
],
/**
* 记录状态，列表
*/
statusList: [
{
value: '1',
label: '完成状态'
},
{
value: '2',
label: '执行状态'
},
{
value: '3',
label: '取消状态'
},
{
value: '4',
label: '待执行状态'
}
],
label: '分拨车辆'
}],
mainPortOptions: [{
value: '4604',
label: '4604'
}, {
value: '4620',
label: '4620'
}],
/**
* 场站位置，选项列表
*/
stationList: [
{
value: '1',
label: '西货站'
},
{
value: '2',
label: '综保区'
},
{
value: '3',
label: '军投'
},
{
value: '4',
label: '快邮'
}
veStateOptions: [{
value: 'Y',
label: '黑名单'
}, {
value: 'N',
label: '白名单'
}],
addFormRules: {
mainPort: [
{ required: true, message: '请输入海关关区', trigger: 'blur' }
],
queryFormRules: {
userName: [
{required: true, message: '请输入姓名', trigger: ['blur', 'change']},
proposer: [
{ required: true, message: '请输入挂靠单位', trigger: 'blur' }
],
userMobile: [
{required: true, message: '请输入联系方式', trigger: ['blur', 'change']},
{validator: userMobileValid, trigger: 'blur'}
coCode: [
{ required: true, message: '请输入运输公司名称', trigger: 'blur' }
],
},
/**
* 调度车辆表单的验证规则对象
*/
dispatchFormRules: {
status: [
{required: true, message: '请选择记录状态', trigger: ['blur', 'change']},
],
gmtCreate: [
{required: true, message: '请选择创建时间', trigger: ['blur', 'change']},
],
endTime: [
{required: true, message: '请选择结束时间', trigger: ['blur', 'change']},
],
licensePlateNumber: [
{required: true, message: '请输入车牌号', trigger: ['blur', 'change']},
domesticLisenceNo: [
{ required: true, message: '请输入国内车牌', trigger: 'blur' }
],
userName: [
{required: true, message: '请输入姓名', trigger: ['blur', 'change']},
veOwnerName: [
{ required: true, message: '请输入车主姓名', trigger: 'blur' }
],
userMobile: [
{required: true, message: '请输入联系方式', trigger: ['blur', 'change']},
{validator: userMobileValid, trigger: 'blur'}
veClassFlag: [
{ required: true, message: '请选择车辆属性', trigger: 'blur' }
],
vehicleType: [
{required: true, message: '请选择车辆类型', trigger: ['blur', 'change']},
],
vehicleNumber: [
{required: true, message: '请选择车辆数量', trigger: ['blur', 'change']},
ownerInsideTel: [
{ required: true, message: '手机号不能为空', trigger: 'blur' },
{ type: 'number', message: '手机号格式不正确', trigger: 'blur',
transform(value){
var phone = 11 && /^((13|14|15|16|17|18|19)[0-9]{1}\d{8})$/
if (!phone.test(value)){
return false;
}else {
return Number(value);
}
}}
],
station: [
{required: true, message: '请选择场站位置', trigger: ['blur', 'change']},
veFactoryDate: [
{ required: true, message: '请选择驾驶证有效期', trigger: 'blur' }
],
dispatchType: [
{required: true, message: '请选择调度业务类型', trigger: ['blur', 'change']},
selfWt: [
{ required: true, message: '请输入车辆自重', trigger: 'blur' }
],
veState: [
{ required: true, message: '请选择备案状态', trigger: 'blur' }
]
},
}
},
methods: {
/**
* 监听，调度车辆对话框的关闭事件
*/
dispatchDialogClosed() {
//重置对话框
this.$refs.dispatchFormRef.resetFields();
dialogVisible:false,
form: {
lisenceNo: '',
username: '',
id:'',
starttime:''
},
/**
* 监听，查看调度记录对话框的关闭事件
*/
showDialogClosed() {
//重置对话框
this.$refs.showFormRef.resetFields();
usernames:[],
queryInfo: {
vno: '',
vnocolor: '2'
},
/**
* 监听pageSize改变的事件
*/
handleSizeChange(newSize) {
this.queryInfo.pageSize = newSize;
//刷新调度记录列表
this.getDispatchNodeList();
lisenceNoSatus:'',
formLabelWidth: '120px',
loading:false,
}
},
/**
* 监听当前页码值改变的事件
*/
handleCurrentChange(newPage) {
this.queryInfo.pageNum = newPage;
//刷新调度记录列表
this.getDispatchNodeList();
mounted() {
this.isAdmin = isAdmin();
this.getReCord();
},
/**
* 打开,查看调度记录明细,对话框
* @param row
*/
showDialogVisible(row) {
this.showForm = row;
this.viewDialogVisible = true;
methods: {
//出任务
handlOut(index,row){
this.dialogVisible=true;
this.form.lisenceNo=row.domesticLisenceNo;
this.getUsers();
this.getLisenceNoStatus(row.domesticLisenceNo)
},
/**
* 用户端，获取车辆调度记录
*/
getDispatchNodeList() {
this.listLoading = true;
selectDispatchNoteList(this.queryInfo).then((response) => {
let res = response.data;
//确定出任务
saveOut() {
const _this = this
insertSelective(this.form).then((response) => {
const res = response.data
if (res.code !== '200') {
this.listLoading = false;
return this.$message.error('获取车辆调度列表失败');
return _this.$message.error('出任务，失败！')
}
// 获取车辆调度列表数据
this.DispatchNoteList = res.data.list;
// 获取列表的总记录数
this.total = res.data.total;
this.listLoading = false;
this.$message.success('获取车辆调度列表,成功！');
_this.$message.success('出任务，成功！')
this.dialogVisible=false;
this.$router.push(
{
path:'conveyance'
}
)
}).catch(error => {
this.listLoading = false;
// 关闭加载
_this.$message.warning('车辆已出任务')
})
},
//获取用户名
getUsers:function() {
let para = {};
this.listLoading = true;
getUserList(para).then((res) => {
let response = res.data.data;
console.log(response)
this.usernames=res.data.data.list;
}).catch((error) => {
this.$message.error(error.toString());
});
},
/**
* 用户端，我要调度车辆，方法
*/
dispatchVehicle() {
this.dispatchLoading = true;
dispatch(this.dispatchForm).then((response) => {
let res = response.data;
if (res.code !== '200') {
this.dispatchLoading = false;
return this.$message.error('车辆繁忙，请稍后重试');
}
//关闭加载
this.dispatchLoading = false;
this.$message.success('调度车辆成功！');
//调度成功，隐藏对话框
this.dispatchFormVisible = false;
/* 将调度车辆信息=>查询列表 */
// 用户名称
this.queryInfo.userName = this.dispatchForm.userName;
// 联系方式
this.queryInfo.userMobile = this.dispatchForm.userMobile;
// 调度业务类型
this.queryInfo.dispatchType = this.dispatchForm.dispatchType;
// 创建时间为当前时间（需留意）
this.queryInfo.gmtCreate = new Date();
//刷新车辆调度列表
this.getDispatchNodeList();
//车辆状态
getLisenceNoStatus(lisenceNo){
this.queryInfo.vno=lisenceNo;
selectVehicle(this.queryInfo).then((response) => {
const res = response.data;
this.lisenceNoSatus=res.data.data.firstVcl.offlineState;
}).catch(error => {
this.dispatchLoading = false;
this.$message.error(error.toString());
this.$message.error('获取车辆状态失败：' + error.toString());
});
},
/**
* 用户端，取消调度车辆，方法
*/
cancelDispatch(row) {
//弹框询问是否取消车辆调度
this.$confirm('此操作将取消该车辆的调度, 是否继续?', '警告', {
confirmButtonText: '确定取消调度',
cancelButtonText: '取消',
type: 'warning'
//获取备案列表
getReCord(val) {
let pageSize = this.pageSize;
if (val != undefined){
pageSize = val;
}
).then(() => {
//开启加载
this.cancelLoading = true;
cancel(row).then((response) => {
let res = response.data;
if (res.code !== '200') {
this.cancelLoading = false;
return this.$message.error('取消车辆调度，失败！请人工介入');
let para = {
pageSize: pageSize,
limitSize: this.limitSize,
trailerFrameNo: this.filters.trailerFrameNo,
veState: this.filters.veState,
veClassFlag: this.filters.veClassFlag,
userId: loginedUserInfo().userId
};
if (isAdmin()){
para.userId = '';
}
this.listLoading = true;
list(para).then((res) => {
this.total = res.data.data.total;
this.recordList = res.data.data.list;
this.listLoading = false;
}).catch((error) => {
this.listLoading = false;
if(null!= error.response && error.response!==undefined){
let status= error.response.status;
let msg = error.response.statusText;
alert(status+msg);
}else {
alert(error);
}
//关闭加载
this.cancelLoading = false;
this.$message.success('取消调度车辆，成功！');
//刷新车辆调度列表
this.getDispatchNodeList();
}).catch(error => {
//关闭加载
this.cancelLoading = false;
this.$message.error(error.toString());
});
}).catch(() => {
},
// 分页
handleSizeChange(val) {
this.limitSize = val;
this.getReCord();
},
handleCurrentChange(val) {
this.pageSize = val;
this.getReCord();
},
findTrailerFrameNo(value){
let para = {
trailerFrameNo: value
};
list(para).then((res) => {
if (res.data.data.total > 0){
this.addForm.mainPort = res.data.data.list[0].mainPort;
this.addForm.proposer = res.data.data.list[0].proposer;
this.addForm.coCode = res.data.data.list[0].coCode;
this.addForm.domesticLisenceNo = res.data.data.list[0].domesticLisenceNo;
this.addForm.veOwnerName = res.data.data.list[0].veOwnerName;
this.addForm.ownerInsideTel = res.data.data.list[0].ownerInsideTel;
this.addForm.veFactoryDate = res.data.data.list[0].veFactoryDate;
this.addForm.selfWt = res.data.data.list[0].selfWt;
this.addForm.veTon = res.data.data.list[0].veTon;
this.addForm.trailerLicenseNo = res.data.data.list[0].trailerLicenseNo;
this.addForm.apprNo = res.data.data.list[0].apprNo;
this.addForm.veClassFlag = res.data.data.list[0].veClassFlag;
this.addForm.memo = res.data.data.list[0].memo;
this.addForm.veState = res.data.data.list[0].veState;
this.$message({
message: '该车辆已有备案',
type: 'error'
});
}else {
this.$message({
message: '该车辆没有备案',
type: 'success'
});
this.addForm.mainPort = '4604';
this.addForm.proposer = '';
this.addForm.coCode = '';
this.addForm.veOwnerName = '';
this.addForm.ownerInsideTel = '';
this.addForm.veFactoryDate = '';
this.addForm.selfWt = '';
this.addForm.veTon = '';
this.addForm.trailerLicenseNo = '';
this.addForm.apprNo = '';
this.addForm.veClassFlag = '';
this.addForm.memo = '';
this.addForm.veState = 'N';
}
}).catch((error) => {
if(null!= error.response && error.response!==undefined){
let status= error.response.status;
let msg = error.response.statusText;
alert(status+msg);
}else {
alert(error);
}
});
},
/**
* 获取用户信息
*/
getUserInfo(param) {
getUser(param).then((response) => {
let res = response.data;
if (res.code !== '200') {
return this.$message.error('网络异常，请刷新界面！');
veClassFlag: function(row, column){
if (row.veClassFlag == '0'){
return "普通车辆"
}else if(row.veClassFlag == '1'){
return "调拨车辆"
}else if (row.veClassFlag == '2'){
return "分拨车辆"
}
if (res.data.list.length === 0) {
return this.$message.error('网络异常，请刷新界面！');
},
handleDel(index, row){
this.$confirm('确认删除吗？', '提示', {}).then(() => {
let param = {
id: row.id,
domesticLisenceNo: row.domesticLisenceNo,
mainPort: row.mainPort
}
if (res.data.list[0].mobilephone === null || res.data.list[0].mobilephone === '') {
return this.$message.error('请填写您的手机号码');
remove(param).then((res) => {
if (res.data.code == 200){
this.$message({
message: '删除成功',
type: 'success'
});
}else {
this.$message({
message: '删除失败',
type: 'error'
});
}
this.queryInfo.userMobile = res.data.list[0].mobilephone;
this.dispatchForm.userMobile = res.data.list[0].mobilephone;
this.$message.success('欢迎使用，车辆调度系统！');
this.getReCord();
}).catch((error) => {
this.$message.error(error.toString());
});
}).catch(() =>{
});
},
/**
* 根据状态的不同区分颜色
*
* @param row
* @param rowIndex
*/
rowStatus({row, rowIndex}) {
if (row.status === '1') {
return 'success-row';
companyAdd:function(){
this.dialogStatus= "save";
this.addFormVisible = true;
this.$refs.addForm.resetFields();
if (this.$refs.addForm !==undefined) {
this.$refs.addForm.resetFields();
}
},
handlEdit:function(index, row){
this.dialogStatus = "edit";
this.addFormVisible = true;
this.addForm = Object.assign({}, row);
},
addSubmit:function(){
this.$refs.addForm.validate((valid) => {
if (valid) {
this.$confirm('确认提交吗？', '提示', {}).then(() => {
this.addloading = true;
this.addForm.createBy = JSON.parse(sessionStorage.getItem('user')).id;
let para = Object.assign({}, this.addForm);
save(para).then((res) => {
if (res.data.code == 200){
this.$message({
message: '提交成功',
type: 'success'
});
this.addFormVisible = false;
this.addloading = false;
this.getReCord();
}else {
this.addloading = false;
this.$message({
message: res.data.msg,
type: 'error'
});
}
if (row.status === '2') {
return 'run-row';
}).catch((error) => {
alert(error);
this.addloading = false;
});
})
} else {
console.log('error submit!!');
this.addloading = false;
return false;
}
if (row.status === '3') {
return 'cancel-row';
});
},
editSubmit:function(){
this.$refs.addForm.validate((valid) => {
if (valid) {
this.$confirm('确认提交吗？', '提示', {}).then(() => {
this.addloading = true;
let para = Object.assign({}, this.addForm);
edit(para).then((res) => {
if (res.data.code == 200){
this.$message({
message: '修改成功',
type: 'success'
});
this.addFormVisible = false
this.addloading = false;
this.getReCord();
}else {
this.addloading = false;
this.$message({
message: res.data.msg,
type: 'error'
});
}
if (row.status === '4') {
return 'await-row';
}).catch((error) => {
alert(error);
this.addloading = false;
});
})
} else {
this.addloading = false;
console.log('error submit!!');
return false;
}
});
},
operationType:function (row, column) {
if (row.operationType == '1'){
return '审批通过'
}else if (row.operationType == '0'){
return '需手动审批通过'
}
},
mounted() {
var user = sessionStorage.getItem('user');
if (user) {
user = JSON.parse(user);
console.log(user);
this.queryInfo.userName = user.username;
this.dispatchForm.userName = user.username;
let param = {
userName: this.queryInfo.userName
querySearch(queryString, cb) {
var restaurants = this.lockInfoList;
var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
// 调用 callback 返回建议列表的数据
cb(results);
},
createFilter(queryString) {
return (restaurant) => {
let rs = (restaurant.lockNum.indexOf(queryString) >= 0)
return rs;
};
this.getUserInfo(param);
}
/**
* 渲染完成之后，在获取调度记录列表
*/
// this.getDispatchNodeList();
}
},
// 获取关锁列表
// getLockInfoList(val) {
// let pageSize = this.pageSize;
// if (val != undefined){
// pageSize = val;
// }
// let para = {
// pageSize: pageSize,
// limitSize: this.limitSize
// };
// this.listLoading = true;
// lockList(para).then((res) => {
// this.lockInfoList = res.data.data.list;
// }).catch((error) => {
// this.listLoading = false;
// if(null!= error.response && error.response!==undefined){
// let status= error.response.status;
// let msg = error.response.statusText;
// alert(status+msg);
// }else {
// alert(error);
// }
// });
// },
},
}
</script>
<style>
/* 完成状态 */
.el-table .success-row {
background: rgba(64, 158, 255, 0.2);
}
/* 执行状态 */
.el-table .run-row {
background: rgba(103, 194, 58, 0.2);
<style scoped>
.my-text-area .prepand{
float: left;
width:89px;
height: 28px;
font-size: 12px;
line-height: 28px;
}
/* 取消状态 */
.el-table .cancel-row {
background: rgba(144, 147, 153, 0.2);
</style>
<style>
.my-text-area .el-textarea__inner{
min-height: 28px;
height: 28px;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
}
/* 待执行状态 */
.el-table .await-row {
background: rgba(230, 162, 60, 0.2);
.rounded-corner {
border-radius: 10px; /* 设置圆角的半径为10像素 */
background-color: #f0f0f0; /* 背景颜色 */
padding: 10px; /* 内边距 */
margin: 10px; /* 外边距 */
box-shadow: 0 0 5px #ddd; /* 盒子阴影效果 */
}
</style>
... ...