opt:增加操作管理界面
This commit is contained in:
@@ -7,4 +7,11 @@ export function queryAllStations() {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
export default { queryAllStations }
|
export function queryAllStationWithTaskStatus() {
|
||||||
|
return request({
|
||||||
|
url: '/optionManager/queryAllStationWithTaskStatus',
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export default { queryAllStations, queryAllStationWithTaskStatus }
|
||||||
|
|||||||
@@ -41,4 +41,12 @@ export function cancelTask(taskCode) {
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
export default { createTask, queryCurrentTaskInfo, queryTask, cancelTask }
|
export function oneClickOperation(params) {
|
||||||
|
return request({
|
||||||
|
url: '/managerTask/oneClickOperation',
|
||||||
|
method: 'post',
|
||||||
|
data: params
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export default { createTask, queryCurrentTaskInfo, queryTask, cancelTask, oneClickOperation }
|
||||||
|
|||||||
@@ -42,6 +42,7 @@ import dict from './dict/vi'
|
|||||||
import angle from './angle/in'
|
import angle from './angle/in'
|
||||||
import regional from './regional/in'
|
import regional from './regional/in'
|
||||||
import stage from './stage/in'
|
import stage from './stage/in'
|
||||||
|
import hotel from './hotel/vi'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
...viLocale,
|
...viLocale,
|
||||||
@@ -88,5 +89,6 @@ export default {
|
|||||||
...dict,
|
...dict,
|
||||||
...angle,
|
...angle,
|
||||||
...regional,
|
...regional,
|
||||||
...stage
|
...stage,
|
||||||
|
...hotel
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -46,6 +46,7 @@ import qrcode from './qrcode/zh'
|
|||||||
import error from './error/zh'
|
import error from './error/zh'
|
||||||
import log from './log/zh'
|
import log from './log/zh'
|
||||||
import frobot_vehicle from './vehicle/zh'
|
import frobot_vehicle from './vehicle/zh'
|
||||||
|
import hotel from './hotel/zh'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
...zhLocale,
|
...zhLocale,
|
||||||
@@ -95,6 +96,7 @@ export default {
|
|||||||
...qrcode,
|
...qrcode,
|
||||||
...error,
|
...error,
|
||||||
...log,
|
...log,
|
||||||
...frobot_vehicle
|
...frobot_vehicle,
|
||||||
|
...hotel
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -46,6 +46,7 @@ import qrcode from './qrcode/en'
|
|||||||
import error from './error/en'
|
import error from './error/en'
|
||||||
import log from './log/en'
|
import log from './log/en'
|
||||||
import frobot_vehicle from './vehicle/en'
|
import frobot_vehicle from './vehicle/en'
|
||||||
|
import hotel from './hotel/en'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
...enLocale,
|
...enLocale,
|
||||||
@@ -95,6 +96,7 @@ export default {
|
|||||||
...qrcode,
|
...qrcode,
|
||||||
...error,
|
...error,
|
||||||
...log,
|
...log,
|
||||||
...frobot_vehicle
|
...frobot_vehicle,
|
||||||
|
...hotel
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
58
src/i18n/langs/hotel/en.js
Normal file
58
src/i18n/langs/hotel/en.js
Normal file
@@ -0,0 +1,58 @@
|
|||||||
|
export default {
|
||||||
|
'hotel': {
|
||||||
|
'title': 'Operation Console',
|
||||||
|
'refresh': 'Refresh',
|
||||||
|
'last_update': 'Last Update',
|
||||||
|
'legend': {
|
||||||
|
'idle': 'Idle',
|
||||||
|
'busy': 'In Task'
|
||||||
|
},
|
||||||
|
'status': {
|
||||||
|
'idle': 'Idle',
|
||||||
|
'running': 'Running',
|
||||||
|
'arrived': 'Arrived',
|
||||||
|
'dispatchable': 'Dispatchable'
|
||||||
|
},
|
||||||
|
'create': {
|
||||||
|
'title': 'Dispatch Task',
|
||||||
|
'target_room': 'Target Room',
|
||||||
|
'task_type': 'Task Type',
|
||||||
|
'vehicle_number': 'Vehicle No.',
|
||||||
|
'vehicle_placeholder': 'Optional, specify vehicle',
|
||||||
|
'priority': 'Priority',
|
||||||
|
'priority_placeholder': 'Optional',
|
||||||
|
'cancel': 'Cancel',
|
||||||
|
'confirm': 'Confirm Dispatch',
|
||||||
|
'success': 'Task dispatched to room {room} successfully',
|
||||||
|
'failed': 'Task dispatch failed',
|
||||||
|
'failed_retry': 'Task dispatch failed, please try again',
|
||||||
|
'type_required': 'Please select task type',
|
||||||
|
'type_placeholder': 'Please select task type'
|
||||||
|
},
|
||||||
|
'cancel': {
|
||||||
|
'title': 'Cancel Task',
|
||||||
|
'room': 'Room',
|
||||||
|
'task_code': 'Task Code',
|
||||||
|
'task_type': 'Task Type',
|
||||||
|
'vehicle': 'Vehicle No.',
|
||||||
|
'status': 'Status',
|
||||||
|
'warning': 'Confirm cancellation? This action cannot be undone.',
|
||||||
|
'close': 'Close',
|
||||||
|
'confirm': 'Confirm Cancel',
|
||||||
|
'success': 'Task cancelled',
|
||||||
|
'failed': 'Cancel failed, please try again'
|
||||||
|
},
|
||||||
|
'go_home': {
|
||||||
|
'title': 'Go Home',
|
||||||
|
'vehicle_number': 'Vehicle No.',
|
||||||
|
'vehicle_placeholder': 'Please select vehicle',
|
||||||
|
'vehicle_required': 'Please select vehicle',
|
||||||
|
'cancel': 'Cancel',
|
||||||
|
'confirm': 'Confirm',
|
||||||
|
'success': 'Go Home command sent to vehicle {vehicle}',
|
||||||
|
'failed': 'Go Home command failed, please try again'
|
||||||
|
},
|
||||||
|
'empty': 'No room data available',
|
||||||
|
'query_failed': 'Failed to query room status, please check network'
|
||||||
|
}
|
||||||
|
}
|
||||||
58
src/i18n/langs/hotel/vi.js
Normal file
58
src/i18n/langs/hotel/vi.js
Normal file
@@ -0,0 +1,58 @@
|
|||||||
|
export default {
|
||||||
|
'hotel': {
|
||||||
|
'title': 'Bảng Điều Hành',
|
||||||
|
'refresh': 'Làm mới',
|
||||||
|
'last_update': 'Cập nhật lần cuối',
|
||||||
|
'legend': {
|
||||||
|
'idle': 'Rảnh',
|
||||||
|
'busy': 'Có nhiệm vụ'
|
||||||
|
},
|
||||||
|
'status': {
|
||||||
|
'idle': 'Rảnh',
|
||||||
|
'running': 'Đang chạy',
|
||||||
|
'arrived': 'Đã đến',
|
||||||
|
'dispatchable': 'Có thể giao'
|
||||||
|
},
|
||||||
|
'create': {
|
||||||
|
'title': 'Giao Nhiệm Vụ',
|
||||||
|
'target_room': 'Phòng đích',
|
||||||
|
'task_type': 'Loại nhiệm vụ',
|
||||||
|
'vehicle_number': 'Số xe',
|
||||||
|
'vehicle_placeholder': 'Tùy chọn, chỉ định xe',
|
||||||
|
'priority': 'Ưu tiên',
|
||||||
|
'priority_placeholder': 'Tùy chọn',
|
||||||
|
'cancel': 'Hủy',
|
||||||
|
'confirm': 'Xác nhận giao',
|
||||||
|
'success': 'Nhiệm vụ đã giao đến phòng {room} thành công',
|
||||||
|
'failed': 'Giao nhiệm vụ thất bại',
|
||||||
|
'failed_retry': 'Giao nhiệm vụ thất bại, vui lòng thử lại',
|
||||||
|
'type_required': 'Vui lòng chọn loại nhiệm vụ',
|
||||||
|
'type_placeholder': 'Vui lòng chọn loại nhiệm vụ'
|
||||||
|
},
|
||||||
|
'cancel': {
|
||||||
|
'title': 'Hủy Nhiệm Vụ',
|
||||||
|
'room': 'Phòng',
|
||||||
|
'task_code': 'Mã nhiệm vụ',
|
||||||
|
'task_type': 'Loại nhiệm vụ',
|
||||||
|
'vehicle': 'Số xe',
|
||||||
|
'status': 'Trạng thái',
|
||||||
|
'warning': 'Xác nhận hủy nhiệm vụ? Hành động này không thể hoàn tác.',
|
||||||
|
'close': 'Đóng',
|
||||||
|
'confirm': 'Xác nhận hủy',
|
||||||
|
'success': 'Nhiệm vụ đã hủy',
|
||||||
|
'failed': 'Hủy thất bại, vui lòng thử lại'
|
||||||
|
},
|
||||||
|
'go_home': {
|
||||||
|
'title': 'Go Home',
|
||||||
|
'vehicle_number': 'Số xe',
|
||||||
|
'vehicle_placeholder': 'Vui lòng chọn xe',
|
||||||
|
'vehicle_required': 'Vui lòng chọn xe',
|
||||||
|
'cancel': 'Hủy',
|
||||||
|
'confirm': 'Xác nhận',
|
||||||
|
'success': 'Lệnh Go Home đã gửi đến xe {vehicle}',
|
||||||
|
'failed': 'Lệnh Go Home thất bại, vui lòng thử lại'
|
||||||
|
},
|
||||||
|
'empty': 'Không có dữ liệu phòng',
|
||||||
|
'query_failed': 'Truy vấn trạng thái phòng thất bại, kiểm tra mạng'
|
||||||
|
}
|
||||||
|
}
|
||||||
58
src/i18n/langs/hotel/zh.js
Normal file
58
src/i18n/langs/hotel/zh.js
Normal file
@@ -0,0 +1,58 @@
|
|||||||
|
export default {
|
||||||
|
'hotel': {
|
||||||
|
'title': '操作台',
|
||||||
|
'refresh': '刷新',
|
||||||
|
'last_update': '最后更新',
|
||||||
|
'legend': {
|
||||||
|
'idle': '空闲',
|
||||||
|
'busy': '有任务'
|
||||||
|
},
|
||||||
|
'status': {
|
||||||
|
'idle': '空闲',
|
||||||
|
'running': '执行中',
|
||||||
|
'arrived': '已到达',
|
||||||
|
'dispatchable': '可下发'
|
||||||
|
},
|
||||||
|
'create': {
|
||||||
|
'title': '下发任务',
|
||||||
|
'target_room': '目标房间',
|
||||||
|
'task_type': '任务类型',
|
||||||
|
'vehicle_number': '车号',
|
||||||
|
'vehicle_placeholder': '可选，指定车号',
|
||||||
|
'priority': '优先级',
|
||||||
|
'priority_placeholder': '可选',
|
||||||
|
'cancel': '取 消',
|
||||||
|
'confirm': '确认下发',
|
||||||
|
'success': '任务已成功下发到 {room} 房间',
|
||||||
|
'failed': '任务下发失败',
|
||||||
|
'failed_retry': '任务下发失败，请重试',
|
||||||
|
'type_required': '请选择任务类型',
|
||||||
|
'type_placeholder': '请选择任务类型'
|
||||||
|
},
|
||||||
|
'cancel': {
|
||||||
|
'title': '取消任务',
|
||||||
|
'room': '房间',
|
||||||
|
'task_code': '任务编号',
|
||||||
|
'task_type': '任务类型',
|
||||||
|
'vehicle': '执行车号',
|
||||||
|
'status': '任务状态',
|
||||||
|
'warning': '确认取消该任务吗？此操作不可撤销。',
|
||||||
|
'close': '关 闭',
|
||||||
|
'confirm': '确认取消',
|
||||||
|
'success': '任务已取消',
|
||||||
|
'failed': '取消任务失败，请重试'
|
||||||
|
},
|
||||||
|
'go_home': {
|
||||||
|
'title': 'Go Home',
|
||||||
|
'vehicle_number': '车号',
|
||||||
|
'vehicle_placeholder': '请选择车号',
|
||||||
|
'vehicle_required': '请选择车号',
|
||||||
|
'cancel': '取 消',
|
||||||
|
'confirm': '确认执行',
|
||||||
|
'success': '车辆 {vehicle} Go Home 指令已下发',
|
||||||
|
'failed': 'Go Home 指令下发失败，请重试'
|
||||||
|
},
|
||||||
|
'empty': '暂无房间数据',
|
||||||
|
'query_failed': '查询房间状态失败，请检查网络'
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -319,6 +319,30 @@ export default {
|
|||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
openCreate() {
|
openCreate() {
|
||||||
|
this.isDisabled = false
|
||||||
|
this.saving = false
|
||||||
|
this.form = {
|
||||||
|
id: null,
|
||||||
|
task_code: null,
|
||||||
|
destinations: null,
|
||||||
|
type: '',
|
||||||
|
status: '',
|
||||||
|
vehicleReportStatus: null,
|
||||||
|
arrive_waiting_time: 1,
|
||||||
|
priority: null,
|
||||||
|
vehicle_number: null,
|
||||||
|
processingVehicle: null,
|
||||||
|
isPause: null,
|
||||||
|
remark: null,
|
||||||
|
source: null,
|
||||||
|
create_by: null,
|
||||||
|
create_time: null,
|
||||||
|
update_time: 'normal',
|
||||||
|
update_by: '21'
|
||||||
|
}
|
||||||
|
this.$nextTick(() => {
|
||||||
|
if (this.$refs.form) this.$refs.form.resetFields()
|
||||||
|
})
|
||||||
this.formDia = true
|
this.formDia = true
|
||||||
},
|
},
|
||||||
toQuery() {
|
toQuery() {
|
||||||
@@ -343,7 +367,6 @@ export default {
|
|||||||
this.saving = true
|
this.saving = true
|
||||||
frobot_task.createTask(this.form).then(() => {
|
frobot_task.createTask(this.form).then(() => {
|
||||||
this.formDia = false
|
this.formDia = false
|
||||||
this.isDisabled = true
|
|
||||||
this.$message.success(this.$t('auto.common.add_msg'))
|
this.$message.success(this.$t('auto.common.add_msg'))
|
||||||
this.fetchData()
|
this.fetchData()
|
||||||
}).catch((err) => {
|
}).catch((err) => {
|
||||||
|
|||||||
575
src/views/frobot/hotel/index.vue
Normal file
575
src/views/frobot/hotel/index.vue
Normal file
@@ -0,0 +1,575 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-container hotel-front-desk">
|
||||||
|
<!-- 顶部标题栏 -->
|
||||||
|
<div class="header">
|
||||||
|
<div class="header-left">
|
||||||
|
<i class="el-icon-office-building" />
|
||||||
|
<span class="title">{{ $t('hotel.title') }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="header-right">
|
||||||
|
<el-button size="small" type="warning" icon="el-icon-s-home" @click="openGoHome">Go Home</el-button>
|
||||||
|
<el-button size="small" icon="el-icon-refresh" :loading="loading" @click="fetchData(true)">{{ $t('hotel.refresh') }}</el-button>
|
||||||
|
<span class="update-time">{{ $t('hotel.last_update') }}: {{ lastUpdateTime }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 图例说明 -->
|
||||||
|
<div class="legend">
|
||||||
|
<span class="legend-item"><span class="dot dot-idle" />{{ $t('hotel.legend.idle') }}</span>
|
||||||
|
<span class="legend-item"><span class="dot dot-busy" />{{ $t('hotel.legend.busy') }}</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 房间网格 -->
|
||||||
|
<div v-loading="loading" class="room-grid">
|
||||||
|
<div
|
||||||
|
v-for="room in rooms"
|
||||||
|
:key="room.station_code"
|
||||||
|
class="room-card"
|
||||||
|
:class="room.hasTask ? 'room-busy' : 'room-idle'"
|
||||||
|
@click="handleRoomClick(room)"
|
||||||
|
>
|
||||||
|
<div class="room-no">{{ room.station_name }}</div>
|
||||||
|
<div class="room-status">
|
||||||
|
<el-tag
|
||||||
|
:type="getRoomTagType(room)"
|
||||||
|
size="mini"
|
||||||
|
effect="dark"
|
||||||
|
>{{ getRoomStatusText(room) }}</el-tag>
|
||||||
|
</div>
|
||||||
|
<div v-if="room.hasTask && room.taskInfo" class="room-task-code" :title="room.taskInfo.task_code">
|
||||||
|
<i class="el-icon-tickets" /> {{ room.taskInfo.task_code }}
|
||||||
|
</div>
|
||||||
|
<div v-if="room.hasTask && room.taskInfo && room.taskInfo.processingVehicle" class="room-vehicle-no">
|
||||||
|
<i class="el-icon-truck" /> {{ room.taskInfo.processingVehicle }}
|
||||||
|
</div>
|
||||||
|
<div v-else class="room-task-code room-task-none">
|
||||||
|
<i class="el-icon-circle-check" /> {{ $t('hotel.status.dispatchable') }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div v-if="rooms.length === 0 && !loading" class="empty-tip">
|
||||||
|
<i class="el-icon-box" />
|
||||||
|
<p>{{ $t('hotel.empty') }}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 下发任务对话框 -->
|
||||||
|
<el-dialog
|
||||||
|
:close-on-click-modal="false"
|
||||||
|
:visible.sync="createDiaVisible"
|
||||||
|
:title="$t('hotel.create.title')"
|
||||||
|
width="480px"
|
||||||
|
@close="resetCreateForm"
|
||||||
|
>
|
||||||
|
<div v-if="selectedRoom" class="dialog-room-info">
|
||||||
|
<i class="el-icon-office-building" />
|
||||||
|
<span>{{ $t('hotel.create.target_room') }}：<strong>{{ selectedRoom.station_name }}</strong></span>
|
||||||
|
</div>
|
||||||
|
<el-form ref="createForm" :model="createForm" :rules="createRules" size="small" label-width="120px" style="margin-top:16px;">
|
||||||
|
<el-form-item :label="$t('hotel.create.task_type')" prop="type">
|
||||||
|
<el-select
|
||||||
|
v-model="createForm.type"
|
||||||
|
style="width:100%;"
|
||||||
|
filterable
|
||||||
|
:placeholder="$t('hotel.create.type_placeholder')"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in dict.task_type"
|
||||||
|
:key="item.id"
|
||||||
|
:label="item[$langPre.computedProp('label')]"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item :label="$t('hotel.create.vehicle_number')" prop="vehicle_number">
|
||||||
|
<el-select
|
||||||
|
v-model="createForm.vehicle_number"
|
||||||
|
style="width:100%;"
|
||||||
|
filterable
|
||||||
|
clearable
|
||||||
|
:placeholder="$t('hotel.create.vehicle_placeholder')"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="v in vehicleList"
|
||||||
|
:key="v.vehicleNumber"
|
||||||
|
:label="v.vehicleNumber"
|
||||||
|
:value="v.vehicleNumber"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item :label="$t('hotel.create.priority')" prop="priority">
|
||||||
|
<el-input v-model="createForm.priority" :placeholder="$t('hotel.create.priority_placeholder')" style="width:100%;" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
|
<el-button @click="createDiaVisible = false">{{ $t('hotel.create.cancel') }}</el-button>
|
||||||
|
<el-button type="primary" :loading="submitting" @click="submitTask">{{ $t('hotel.create.confirm') }}</el-button>
|
||||||
|
</span>
|
||||||
|
</el-dialog>
|
||||||
|
|
||||||
|
<!-- 取消任务对话框 -->
|
||||||
|
<el-dialog
|
||||||
|
:close-on-click-modal="false"
|
||||||
|
:visible.sync="cancelDiaVisible"
|
||||||
|
:title="$t('hotel.cancel.title')"
|
||||||
|
width="420px"
|
||||||
|
@close="resetCancelForm"
|
||||||
|
>
|
||||||
|
<div v-if="selectedRoom && selectedRoom.taskInfo" class="cancel-info">
|
||||||
|
<div class="dialog-room-info">
|
||||||
|
<i class="el-icon-office-building" />
|
||||||
|
<span>{{ $t('hotel.cancel.room') }}：<strong>{{ selectedRoom.station_name }}</strong></span>
|
||||||
|
</div>
|
||||||
|
<el-descriptions :column="1" border size="small" style="margin-top:14px;">
|
||||||
|
<el-descriptions-item :label="$t('hotel.cancel.task_code')">{{ selectedRoom.taskInfo.task_code }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item :label="$t('hotel.cancel.task_type')">{{ selectedRoom.taskInfo.type }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item :label="$t('hotel.cancel.vehicle')">{{ selectedRoom.taskInfo.processingVehicle || '-' }}</el-descriptions-item>
|
||||||
|
<el-descriptions-item :label="$t('hotel.cancel.status')">
|
||||||
|
<el-tag size="mini" :type="getCancelDiaTagType(selectedRoom.taskInfo)" >{{ getCancelDiaStatusText(selectedRoom.taskInfo) }}</el-tag>
|
||||||
|
</el-descriptions-item>
|
||||||
|
</el-descriptions>
|
||||||
|
<div style="margin-top:14px;color:#F56C6C;font-size:13px;">
|
||||||
|
<i class="el-icon-warning" /> {{ $t('hotel.cancel.warning') }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
|
<el-button @click="cancelDiaVisible = false">{{ $t('hotel.cancel.close') }}</el-button>
|
||||||
|
<el-button type="danger" :loading="cancelling" @click="submitCancel">{{ $t('hotel.cancel.confirm') }}</el-button>
|
||||||
|
</span>
|
||||||
|
</el-dialog>
|
||||||
|
<!-- Go Home 对话框 -->
|
||||||
|
<el-dialog
|
||||||
|
:close-on-click-modal="false"
|
||||||
|
:visible.sync="goHomeDiaVisible"
|
||||||
|
:title="$t('hotel.go_home.title')"
|
||||||
|
width="400px"
|
||||||
|
@close="resetGoHomeForm"
|
||||||
|
>
|
||||||
|
<el-form ref="goHomeForm" :model="goHomeForm" :rules="goHomeRules" size="small" label-width="120px">
|
||||||
|
<el-form-item :label="$t('hotel.go_home.vehicle_number')" prop="vehicle_number">
|
||||||
|
<el-select
|
||||||
|
v-model="goHomeForm.vehicle_number"
|
||||||
|
style="width:100%;"
|
||||||
|
filterable
|
||||||
|
:placeholder="$t('hotel.go_home.vehicle_placeholder')"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="v in vehicleList"
|
||||||
|
:key="v.vehicleNumber"
|
||||||
|
:label="v.vehicleNumber"
|
||||||
|
:value="v.vehicleNumber"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<span slot="footer" class="dialog-footer">
|
||||||
|
<el-button @click="goHomeDiaVisible = false">{{ $t('hotel.go_home.cancel') }}</el-button>
|
||||||
|
<el-button type="warning" :loading="goingHome" @click="submitGoHome">{{ $t('hotel.go_home.confirm') }}</el-button>
|
||||||
|
</span>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { createTask, cancelTask, oneClickOperation } from '@/api/frobot/task/task'
|
||||||
|
import { queryAllStationWithTaskStatus } from '@/api/frobot/map/station/station'
|
||||||
|
import { getVehicleList } from '@/api/frobot/vehicle/vehicle'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'HotelFrontDesk',
|
||||||
|
dicts: ['task_type'],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
loading: false,
|
||||||
|
submitting: false,
|
||||||
|
cancelling: false,
|
||||||
|
createDiaVisible: false,
|
||||||
|
cancelDiaVisible: false,
|
||||||
|
selectedRoom: null,
|
||||||
|
lastUpdateTime: '--',
|
||||||
|
rooms: [],
|
||||||
|
createForm: {
|
||||||
|
type: '',
|
||||||
|
vehicle_number: '',
|
||||||
|
priority: ''
|
||||||
|
},
|
||||||
|
createRules: {
|
||||||
|
type: [{ required: true, message: this.$t('hotel.create.type_required'), trigger: 'change' }]
|
||||||
|
},
|
||||||
|
timer: null,
|
||||||
|
vehicleList: [],
|
||||||
|
goHomeDiaVisible: false,
|
||||||
|
goingHome: false,
|
||||||
|
goHomeForm: {
|
||||||
|
vehicle_number: ''
|
||||||
|
},
|
||||||
|
goHomeRules: {
|
||||||
|
vehicle_number: [{ required: true, message: this.$t('hotel.go_home.vehicle_required'), trigger: 'change' }]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.fetchData(true)
|
||||||
|
this.fetchVehicleList()
|
||||||
|
this.timer = setInterval(() => this.fetchData(false), 1000)
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
if (this.timer) clearInterval(this.timer)
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
fetchData(showLoading = false) {
|
||||||
|
if (showLoading) this.loading = true
|
||||||
|
queryAllStationWithTaskStatus().then(res => {
|
||||||
|
if (res.code === 200 && Array.isArray(res.data)) {
|
||||||
|
this.rooms = res.data
|
||||||
|
} else {
|
||||||
|
this.rooms = []
|
||||||
|
}
|
||||||
|
this.lastUpdateTime = new Date().toLocaleTimeString()
|
||||||
|
}).catch(err => {
|
||||||
|
console.error('查询房间状态失败:', err)
|
||||||
|
}).finally(() => {
|
||||||
|
this.loading = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
handleRoomClick(room) {
|
||||||
|
this.selectedRoom = room
|
||||||
|
if (room.hasTask) {
|
||||||
|
// 有任务 -> 弹出取消任务对话框
|
||||||
|
this.cancelDiaVisible = true
|
||||||
|
} else {
|
||||||
|
// 空闲 -> 弹出下发任务对话框
|
||||||
|
this.createDiaVisible = true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 提交下发任务
|
||||||
|
submitTask() {
|
||||||
|
this.$refs.createForm.validate(valid => {
|
||||||
|
if (!valid) return
|
||||||
|
this.submitting = true
|
||||||
|
const params = {
|
||||||
|
destinations: this.selectedRoom.station_code,
|
||||||
|
type: this.createForm.type,
|
||||||
|
vehicle_number: this.createForm.vehicle_number || null,
|
||||||
|
priority: this.createForm.priority || null
|
||||||
|
}
|
||||||
|
createTask(params).then(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message.success(this.$t('hotel.create.success').replace('{room}', this.selectedRoom.station_name))
|
||||||
|
this.createDiaVisible = false
|
||||||
|
setTimeout(() => this.fetchData(false), 800)
|
||||||
|
} else {
|
||||||
|
this.$message.error(res.message || this.$t('hotel.create.failed'))
|
||||||
|
}
|
||||||
|
}).catch(err => {
|
||||||
|
console.error('下发任务失败:', err)
|
||||||
|
this.$message.error(this.$t('hotel.create.failed_retry'))
|
||||||
|
}).finally(() => {
|
||||||
|
this.submitting = false
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
// 提交取消任务
|
||||||
|
submitCancel() {
|
||||||
|
if (!this.selectedRoom || !this.selectedRoom.taskInfo) return
|
||||||
|
this.cancelling = true
|
||||||
|
cancelTask(this.selectedRoom.taskInfo.task_code).then(res => {
|
||||||
|
this.$message.success(this.$t('hotel.cancel.success'))
|
||||||
|
this.cancelDiaVisible = false
|
||||||
|
setTimeout(() => this.fetchData(false), 800)
|
||||||
|
}).catch(err => {
|
||||||
|
console.error('取消任务失败:', err)
|
||||||
|
this.$message.error(this.$t('hotel.cancel.failed'))
|
||||||
|
}).finally(() => {
|
||||||
|
this.cancelling = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
resetCreateForm() {
|
||||||
|
this.submitting = false
|
||||||
|
this.selectedRoom = null
|
||||||
|
if (this.$refs.createForm) this.$refs.createForm.resetFields()
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.createForm = { type: '', vehicle_number: '', priority: '' }
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
resetCancelForm() {
|
||||||
|
this.cancelling = false
|
||||||
|
this.selectedRoom = null
|
||||||
|
},
|
||||||
|
|
||||||
|
// 加载车辆列表
|
||||||
|
fetchVehicleList() {
|
||||||
|
getVehicleList().then(res => {
|
||||||
|
if (res.code === 200 && res.data) {
|
||||||
|
this.vehicleList = Object.values(res.data)
|
||||||
|
}
|
||||||
|
}).catch(err => {
|
||||||
|
console.error('查询车辆列表失败:', err)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
// 打开 Go Home 对话框
|
||||||
|
openGoHome() {
|
||||||
|
this.fetchVehicleList()
|
||||||
|
this.goHomeDiaVisible = true
|
||||||
|
},
|
||||||
|
|
||||||
|
// 提交 Go Home
|
||||||
|
submitGoHome() {
|
||||||
|
this.$refs.goHomeForm.validate(valid => {
|
||||||
|
if (!valid) return
|
||||||
|
this.goingHome = true
|
||||||
|
oneClickOperation({
|
||||||
|
vehicle_number: this.goHomeForm.vehicle_number,
|
||||||
|
type: 'Charge'
|
||||||
|
}).then(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.$message.success(this.$t('hotel.go_home.success').replace('{vehicle}', this.goHomeForm.vehicle_number))
|
||||||
|
this.goHomeDiaVisible = false
|
||||||
|
} else {
|
||||||
|
this.$message.error(res.message || 'Go Home 指令下发失败')
|
||||||
|
}
|
||||||
|
}).catch(err => {
|
||||||
|
console.error('Go Home 失败:', err)
|
||||||
|
this.$message.error(this.$t('hotel.go_home.failed'))
|
||||||
|
}).finally(() => {
|
||||||
|
this.goingHome = false
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
// 重置 Go Home 表单
|
||||||
|
resetGoHomeForm() {
|
||||||
|
this.goingHome = false
|
||||||
|
if (this.$refs.goHomeForm) this.$refs.goHomeForm.resetFields()
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.goHomeForm = { vehicle_number: '' }
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
// 判断是否已到达（vehicleReportStatus 为 1 或 2）
|
||||||
|
isArrived(taskInfo) {
|
||||||
|
if (!taskInfo) return false
|
||||||
|
const s = taskInfo.vehicleReportStatus
|
||||||
|
return s === 1 || s === 2 || s === '1' || s === '2'
|
||||||
|
},
|
||||||
|
|
||||||
|
// 房间卡片标签类型
|
||||||
|
getRoomTagType(room) {
|
||||||
|
if (!room.hasTask) return 'success'
|
||||||
|
if (this.isArrived(room.taskInfo)) return 'primary'
|
||||||
|
return 'warning'
|
||||||
|
},
|
||||||
|
|
||||||
|
// 房间卡片标签文字
|
||||||
|
getRoomStatusText(room) {
|
||||||
|
if (!room.hasTask) return this.$t('hotel.status.idle')
|
||||||
|
if (this.isArrived(room.taskInfo)) return this.$t('hotel.status.arrived')
|
||||||
|
return this.$t('hotel.status.running')
|
||||||
|
},
|
||||||
|
|
||||||
|
// 取消对话框标签类型
|
||||||
|
getCancelDiaTagType(taskInfo) {
|
||||||
|
if (this.isArrived(taskInfo)) return 'primary'
|
||||||
|
return 'warning'
|
||||||
|
},
|
||||||
|
|
||||||
|
// 取消对话框标签文字
|
||||||
|
getCancelDiaStatusText(taskInfo) {
|
||||||
|
if (this.isArrived(taskInfo)) return this.$t('hotel.status.arrived')
|
||||||
|
return this.$t('hotel.status.running')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
/* ===== 整体布局 ===== */
|
||||||
|
.hotel-front-desk {
|
||||||
|
font-family: 'Noto Sans SC', 'Microsoft YaHei', sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===== 顶部标题 ===== */
|
||||||
|
.header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
padding-bottom: 12px;
|
||||||
|
border-bottom: 1px solid #ebeef5;
|
||||||
|
}
|
||||||
|
.header-left {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
.header-left .el-icon-office-building {
|
||||||
|
font-size: 22px;
|
||||||
|
color: #409eff;
|
||||||
|
}
|
||||||
|
.title {
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 700;
|
||||||
|
letter-spacing: 2px;
|
||||||
|
color: #303133;
|
||||||
|
}
|
||||||
|
.header-right {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
.update-time {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #909399;
|
||||||
|
margin-left: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===== 图例 ===== */
|
||||||
|
.legend {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 20px;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
padding: 8px 12px;
|
||||||
|
background: #f5f7fa;
|
||||||
|
border-radius: 6px;
|
||||||
|
border: 1px solid #ebeef5;
|
||||||
|
}
|
||||||
|
.legend-item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 6px;
|
||||||
|
font-size: 13px;
|
||||||
|
color: #606266;
|
||||||
|
}
|
||||||
|
.dot {
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
border-radius: 50%;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
.dot-idle { background: #67c23a; }
|
||||||
|
.dot-busy { background: #e6a23c; }
|
||||||
|
|
||||||
|
/* ===== 房间网格 ===== */
|
||||||
|
.room-grid {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 14px;
|
||||||
|
min-height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.room-card {
|
||||||
|
width: 130px;
|
||||||
|
height: 100px;
|
||||||
|
border-radius: 8px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all 0.2s ease;
|
||||||
|
border: 2px solid transparent;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 空闲状态 */
|
||||||
|
.room-idle {
|
||||||
|
background: #f0f9eb;
|
||||||
|
border-color: #b3e19d;
|
||||||
|
box-shadow: 0 2px 8px rgba(103,194,58,0.15);
|
||||||
|
}
|
||||||
|
.room-idle:hover {
|
||||||
|
transform: translateY(-3px);
|
||||||
|
border-color: #67c23a;
|
||||||
|
box-shadow: 0 6px 16px rgba(103,194,58,0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 有任务状态 */
|
||||||
|
.room-busy {
|
||||||
|
background: #fdf6ec;
|
||||||
|
border-color: #f5dab1;
|
||||||
|
box-shadow: 0 2px 8px rgba(230,162,60,0.15);
|
||||||
|
}
|
||||||
|
.room-busy:hover {
|
||||||
|
transform: translateY(-1px);
|
||||||
|
border-color: #e6a23c;
|
||||||
|
box-shadow: 0 4px 12px rgba(230,162,60,0.3);
|
||||||
|
}
|
||||||
|
|
||||||
|
.room-no {
|
||||||
|
font-size: 26px;
|
||||||
|
font-weight: 800;
|
||||||
|
letter-spacing: 1px;
|
||||||
|
color: #303133;
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.room-status {
|
||||||
|
margin-top: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.room-task-code {
|
||||||
|
margin-top: 4px;
|
||||||
|
font-size: 11px;
|
||||||
|
color: #909399;
|
||||||
|
max-width: 114px;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
.room-task-none {
|
||||||
|
color: #67c23a;
|
||||||
|
}
|
||||||
|
.room-vehicle-no {
|
||||||
|
margin-top: 2px;
|
||||||
|
font-size: 11px;
|
||||||
|
color: #409eff;
|
||||||
|
max-width: 114px;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===== 空数据提示 ===== */
|
||||||
|
.empty-tip {
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
padding: 60px 0;
|
||||||
|
color: #c0c4cc;
|
||||||
|
font-size: 15px;
|
||||||
|
}
|
||||||
|
.empty-tip i {
|
||||||
|
font-size: 48px;
|
||||||
|
display: block;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ===== 对话框 ===== */
|
||||||
|
.dialog-room-info {
|
||||||
|
background: #ecf5ff;
|
||||||
|
border-radius: 6px;
|
||||||
|
padding: 12px 16px;
|
||||||
|
font-size: 15px;
|
||||||
|
color: #303133;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 10px;
|
||||||
|
border: 1px solid #b3d8ff;
|
||||||
|
}
|
||||||
|
.dialog-room-info i {
|
||||||
|
font-size: 20px;
|
||||||
|
color: #409eff;
|
||||||
|
}
|
||||||
|
.dialog-room-info strong {
|
||||||
|
color: #409eff;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Reference in New Issue
Block a user