ak/zn-admin-vue3-wcs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改问题

Browse Source
This commit is contained in:
xhf 2025-04-01 14:37:06 +08:00
commit c2b41da61a
5 changed files with 3313 additions and 183 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.env.local
View File

@ -4,9 +4,9 @@ NODE_ENV=development
VITE_DEV=true VITE_DEV=true
# 请求路径 # 请求路径
VITE_BASE_URL='http://192.168.0.74:48080' # VITE_BASE_URL='http://192.168.0.74:48080'
# VITE_BASE_URL='http://192.168.0.153:48080' # VITE_BASE_URL='http://192.168.0.153:48080'
# VITE_BASE_URL='http://192.168.0.45:48080' VITE_BASE_URL='http://192.168.0.45:48080'
# 文件上传类型：server - 后端上传， client - 前端直连上传，仅支持 S3 服务 # 文件上传类型：server - 后端上传， client - 前端直连上传，仅支持 S3 服务
VITE_UPLOAD_TYPE=server VITE_UPLOAD_TYPE=server

7
src/api/map/map.ts
View File

@ -154,3 +154,10 @@ export const getListByMapId = async (mapId) => {
url: `/system/robot/information/getListByMapId?mapId=` + mapId url: `/system/robot/information/getListByMapId?mapId=` + mapId
}) })
} }
//批量更新库位
export const updateBatchHouseLocation = async (data) => {
return await request.put({
url: `/system/ware/house-location/updateBatch`,
data
})
}

244
src/views/board/device/index.vue
View File

@ -6,32 +6,35 @@
<div class="new-top-box-left-title"> 设备看板 </div> <div class="new-top-box-left-title"> 设备看板 </div>
</el-col> </el-col>
<el-col :span="16"> <el-col :span="16">
<div style="width: 100%;height: 100%;padding-top: 5px;"> <div style="width: 100%; height: 100%; padding-top: 5px">
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick"> <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane :label="item.label + ' ' + (item.number?item.number: 0)" :name="item.value" v-for="(item, index) in typeList" :key="index"/> <el-tab-pane
</el-tabs> :label="item.label + ' ' + (item.number ? item.number : 0)"
:name="item.value"
v-for="(item, index) in typeList"
:key="index"
/>
</el-tabs>
</div> </div>
</el-col> </el-col>
<el-col :span="6"> <el-col :span="6">
<div style="display: flex"> <div style="display: flex">
<el-input <el-input
style="height: 40px;margin-right: 16px;" style="height: 40px; margin-right: 16px"
v-model="queryParams.deviceNo" v-model="queryParams.deviceNo"
placeholder="请输入设备编号" placeholder="请输入设备编号"
@keyup.enter="getCarList" @keyup.enter="getCarList"
clearable clearable
> >
<template #append> <template #append>
<el-button :icon="'search'" @click="getCarList"/> <el-button :icon="'search'" @click="getCarList" />
</template> </template>
</el-input> </el-input>
<el-button style="height: 40px" @click="openForm('create')">新增设备</el-button> <el-button style="height: 40px" @click="openForm('create')">新增设备</el-button>
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
</ContentWrap> </ContentWrap>
<div class="new-list-box-all"> <div class="new-list-box-all">
<div class="new-list-box"> <div class="new-list-box">
@ -64,9 +67,14 @@
<div class="item-inner"> <div class="item-inner">
<div class="item-inner-left"> <div class="item-inner-left">
<div class="item-inner-left-img-box"> <div class="item-inner-left-img-box">
<el-image style="width: 100%; height: 100%" :src="item.url" :fit="'fill'" v-if="item.pictureConfig!=3"/> <el-image
style="width: 100%; height: 100%"
:src="item.url"
:fit="'fill'"
v-if="item.pictureConfig != 3"
/>
<div class="item-inner-left-img-box-no" v-else> <div class="item-inner-left-img-box-no" v-else>
<span >不显示图片</span> <span>不显示图片</span>
</div> </div>
</div> </div>
<div class="item-inner-left-bottom"> <div class="item-inner-left-bottom">
@ -76,8 +84,10 @@
</div> </div>
<div class="item-inner-right-msg"> <div class="item-inner-right-msg">
<div class="item-inner-right-msg-item m-b-10"> <div class="item-inner-right-msg-item m-b-10">
<div class="item-inner-right-msg-item-name ">编号</div> <div class="item-inner-right-msg-item-name ">编号</div>
<div class="item-inner-right-msg-item-value overhide">{{ item.deviceNo || ''}}</div> <div class="item-inner-right-msg-item-value overhide">{{ item.deviceNo || ''}}</div>
</div> </div>
<div class="item-inner-right-msg-item m-b-10"> <div class="item-inner-right-msg-item m-b-10">
<div class="item-inner-right-msg-item-name overhide">是否启用</div> <div class="item-inner-right-msg-item-name overhide">是否启用</div>
@ -103,111 +113,75 @@
</div> </div>
</div> </div>
</div> </div>
<createEditDialog ref="createEditDialogRef" @success="getCarList" /> <createEditDialog ref="createEditDialogRef" @success="initFun()" />
</template> </template>
<script setup> <script setup>
import { ref, reactive, onMounted, onBeforeUnmount } from 'vue' import { ref, reactive, onMounted, onBeforeUnmount } from 'vue'
defineOptions({ name: 'BoardDevice' })
import * as DeviceApi from '@/api/device/index'
// import { Swiper, SwiperSlide } from 'swiper/vue'
// 导入两个组件内的路由守卫API
import { onBeforeRouteLeave, onBeforeRouteUpdate } from 'vue-router' import { onBeforeRouteLeave, onBeforeRouteUpdate } from 'vue-router'
const message = useMessage() // 消息弹窗
// 引入swiper样式（按需导入）
// import 'swiper/css/pagination' // 轮播图底面的小圆点
// import 'swiper/css/navigation' // 轮播图两边的左右箭头
// import 'swiper/css/scrollbar' // 轮播图的滚动条， 轮播图里一般不怎么会使用到滚动条，如果有用到的话import导入就行
// 引入swiper核心和所需模块
// import { Autoplay, Pagination, Navigation, Scrollbar } from 'swiper'
import createEditDialog from './createEditDialog.vue'
// import 'swiper/css'
import { formatter } from 'element-plus' import { formatter } from 'element-plus'
import { DICT_TYPE, getDictOptions } from '@/utils/dict' import { DICT_TYPE, getDictOptions } from '@/utils/dict'
// DEVICE_TYPE
import * as DeviceApi from '@/api/device/index'
import createEditDialog from './createEditDialog.vue'
defineOptions({ name: 'BoardDevice' })
const message = useMessage() // 消息弹窗
const router = useRouter() // 路由对象 const router = useRouter() // 路由对象
const createEditDialogRef = ref(null) const createEditDialogRef = ref(null)
const list = ref([]) const list = ref([])
const queryParams = reactive({ const queryParams = reactive({
// pageNo: 1,
// pageSize: 100,
deviceNo: undefined, deviceNo: undefined,
deviceType: undefined deviceType: undefined
}) })
// const spaceBetween = ref(20)
// const navigation = ref({
// nextEl: '.swiper-button-next-custome',
// prevEl: '.swiper-button-prev-custome'
// })
const activeName = ref('-1') const activeName = ref('-1')
const handleClick = (tab, event) => { const handleClick = (tab, event) => {
console.log(tab, event) queryParams.deviceType = tab.props.name != -1 ? tab.props.name : undefined
queryParams.deviceType = tab.props.name !=-1?tab.props.name:undefined
getCarList() getCarList()
} }
const typeList = ref([])
const typeList = ref([])
const getTypeList = () => { const getTypeList = () => {
typeList.value = getDictOptions(DICT_TYPE.DEVICE_TYPE)&&getDictOptions(DICT_TYPE.DEVICE_TYPE).length?JSON.parse(JSON.stringify(getDictOptions(DICT_TYPE.DEVICE_TYPE))):[] typeList.value =
console.log(typeList.value) getDictOptions(DICT_TYPE.DEVICE_TYPE) && getDictOptions(DICT_TYPE.DEVICE_TYPE).length
? JSON.parse(JSON.stringify(getDictOptions(DICT_TYPE.DEVICE_TYPE)))
: []
typeList.value.unshift({ label: '全部', value: '-1' }) typeList.value.unshift({ label: '全部', value: '-1' })
getRobotInformationStatistics() getRobotInformationStatistics()
} }
// 在modules加入要使用的模块
// const modules = [Autoplay, Navigation, Scrollbar]
// Pagination
const prevEl = (item, index) => {
// console.log('上一张' + index + item)
}
const nextEl = () => {
// console.log('下一张')
}
// 更改当前活动swiper
const onSlideChange = (swiper) => {
// swiper是当前轮播的对象，里面可以获取到当前swiper的所有信息，当前索引是activeIndex
console.log(swiper.activeIndex)
}
//根据type和列表返回对应中文 //根据type和列表返回对应中文
const filterTypeFun = (type, list) => { const filterTypeFun = (type, list) => {
if (list.length) { if (list.length) {
let obj = list.find(item => { let obj = list.find((item) => {
return item.value == type return item.value == type
}) })
return obj == undefined ? type : obj.label return obj == undefined ? type : obj.label
} else { } else {
return type return type
} }
} }
//地图定位 //地图定位
const goMap = (item) => { const goMap = (item) => {
if(item.floor == null || item.positionMapId == null){ if (item.floor == null || item.positionMapId == null) {
message.warning('该设备未配置地图信息，请前往实时地图-编辑地图进行配置') message.warning('该设备未配置地图信息，请前往实时地图-编辑地图进行配置')
return return
} }
console.log(item.floor,item.positionMapId) router.push({
router.push({ path: '/mapPage/realTimeMap',
path: '/mapPage/realTimeMap', query: {
query: { floorArea: JSON.stringify([item.floor, item.positionMapId])
floorArea: JSON.stringify([item.floor,item.positionMapId]),
} }
}) })
} }
const timerRef = ref(null) const timerRef = ref(null)
//查询车辆列表 //查询车辆列表
const getCarList = async () => { const getCarList = async () => {
// if (timerRef.value) { list.value = await DeviceApi.deviceGetInformationList(queryParams)
// clearInterval(timerRef.value)
// timerRef.value = null
// }
// timerRef.value = setInterval(() => {
// getCarList()
// getRobotInformationStatistics()
// }, 5000)
let res = await DeviceApi.deviceGetInformationList(queryParams)
// console.log(res.list)
list.value = res
} }
const carStatistics = ref({ const carStatistics = ref({
standby: 0, standby: 0,
@ -218,16 +192,16 @@ const carStatistics = ref({
charge: 0, charge: 0,
total: 0 total: 0
}) })
//查询车辆统计 //查询车辆统计
const getRobotInformationStatistics = async () => { const getRobotInformationStatistics = async () => {
let res = await DeviceApi.deviceNumber({}) let res = await DeviceApi.deviceNumber({})
console.log('设备统计', res)
let total = 0 let total = 0
if (res) { if (res) {
if(typeList.value.length){ if (typeList.value.length) {
typeList.value.forEach(item => { typeList.value.forEach((item) => {
res.forEach(resItem => { res.forEach((resItem) => {
if(item.value == resItem.deviceType){ if (item.value == resItem.deviceType) {
item.number = resItem.number item.number = resItem.number
total += Number(resItem.number) total += Number(resItem.number)
} }
@ -236,7 +210,7 @@ const getRobotInformationStatistics = async () => {
} }
typeList.value[0].number = total typeList.value[0].number = total
} else { } else {
typeList.value.forEach(item => { typeList.value.forEach((item) => {
item.number = 0 item.number = 0
}) })
} }
@ -252,17 +226,11 @@ const clockDevice = (item) => {
}) })
.then(() => { .then(() => {
DeviceApi.deviceInformationUpdate(data).then((res) => { DeviceApi.deviceInformationUpdate(data).then((res) => {
getCarList() initFun()
getTypeList()
message.success(`${valueStr}成功`) message.success(`${valueStr}成功`)
}) })
}) })
.catch(() => { .catch(() => {})
// ElMessage({
// type: 'info',
// message: 'Delete canceled',
// })
})
} }
//新建编辑车辆 //新建编辑车辆
const openForm = (type, id) => { const openForm = (type, id) => {
@ -277,43 +245,33 @@ const deleteCar = (id) => {
}) })
.then(() => { .then(() => {
DeviceApi.deleteDeviceInformation(id).then((res) => { DeviceApi.deleteDeviceInformation(id).then((res) => {
getCarList() initFun()
message.success('删除成功') message.success('删除成功')
}) })
}) })
.catch(() => { .catch(() => {})
// ElMessage({
// type: 'info',
// message: 'Delete canceled',
// })
})
} }
const clockCar = (item) => { const clockCar = (item) => {
let valueStr = item.robotTaskModel == 1 ? '锁定' : '解锁' // let valueStr = item.robotTaskModel == 1 ? '锁定' : '解锁'
let data = JSON.parse(JSON.stringify(item)) // let data = JSON.parse(JSON.stringify(item))
data.robotTaskModel = item.robotTaskModel == 1 ? 0 : 1 // data.robotTaskModel = item.robotTaskModel == 1 ? 0 : 1
ElMessageBox.confirm(`您确定要${valueStr}此车辆吗?`, '提示', { // ElMessageBox.confirm(`您确定要${valueStr}此车辆吗?`, '提示', {
confirmButtonText: '确定', // confirmButtonText: '确定',
cancelButtonText: '取消', // cancelButtonText: '取消',
type: 'warning' // type: 'warning'
}) // })
.then(() => { // .then(() => {
DeviceApi.robotInformationUpdate(data).then((res) => { // DeviceApi.robotInformationUpdate(data).then((res) => {
getCarList() // getCarList()
message.success(`${valueStr}成功`) // message.success(`${valueStr}成功`)
}) // })
}) // })
.catch(() => { // .catch(() => {})
// ElMessage({
// type: 'info',
// message: 'Delete canceled',
// })
})
} }
//前往地图定位 //前往地图定位
const goToMap = (item) => { const goToMap = (item) => {
// console.log(item)
router.push({ router.push({
name: 'MapPageRealTimeMap', name: 'MapPageRealTimeMap',
query: { query: {
@ -321,28 +279,24 @@ const goToMap = (item) => {
} }
}) })
} }
onMounted(() => {
const initFun = () => {
getCarList() getCarList()
getTypeList() getTypeList()
// getRobotInformationStatistics() }
onMounted(() => {
initFun()
}) })
onBeforeUnmount(() => { onBeforeUnmount(() => {
if (timerRef.value) { if (timerRef.value) {
clearInterval(timerRef.value) clearInterval(timerRef.value)
timerRef.value = null timerRef.value = null
} }
}) })
// beforeRouteLeave((to, from, next) => {
// console.log('beforeRouteLeave',to, from, next)
// if(timerRef.value){
// clearInterval(timerRef.value)
// timerRef.value = null
// }
// })
onBeforeRouteLeave((to, from, next) => {
// console.log('beforeRouteLeave',to, from)
onBeforeRouteLeave((to, from, next) => {
if (timerRef.value) { if (timerRef.value) {
clearInterval(timerRef.value) clearInterval(timerRef.value)
timerRef.value = null timerRef.value = null
@ -359,15 +313,15 @@ onBeforeRouteLeave((to, from, next) => {
margin: 0px; margin: 0px;
} }
:deep(.is-active) { :deep(.is-active) {
background-color: #EBF1FF; background-color: #ebf1ff;
color: #0D162A; color: #0d162a;
} }
:deep(.el-tabs__item) { :deep(.el-tabs__item) {
padding-left: 8px !important; padding-left: 8px !important;
padding-right: 8px !important; padding-right: 8px !important;
height: auto !important; height: auto !important;
padding-top: 5px !important; padding-top: 5px !important;
padding-bottom: 5px !important; padding-bottom: 5px !important;
} }
:deep(.el-tabs__active-bar) { :deep(.el-tabs__active-bar) {
height: 0; height: 0;
@ -378,11 +332,11 @@ onBeforeRouteLeave((to, from, next) => {
:deep(.el-tabs__nav-prev) { :deep(.el-tabs__nav-prev) {
line-height: 34px !important; line-height: 34px !important;
} }
:deep(.el-input-group__append){ :deep(.el-input-group__append) {
background: none !important; background: none !important;
} }
:deep(.el-input__wrapper){ :deep(.el-input__wrapper) {
border: 1px solid var(--el-input-border-color,var(--el-border-color)); border: 1px solid var(--el-input-border-color, var(--el-border-color));
border-right: none; border-right: none;
box-shadow: none !important; box-shadow: none !important;
} }
@ -716,7 +670,7 @@ input::-webkit-input-placeholder {
.m-b-10 { .m-b-10 {
margin-bottom: 10px; margin-bottom: 10px;
} }
.item-inner-left-img-box-no{ .item-inner-left-img-box-no {
width: 100%; width: 100%;
height: 100%; height: 100%;
display: flex; display: flex;

55
src/views/mapPage/realTimeMap/components/storeDialog.vue
View File

@ -5,10 +5,10 @@
<div <div
class="store-dialog-left-item ellipsis" class="store-dialog-left-item ellipsis"
@click="changeStore(item, index)" @click="changeStore(item, index)"
v-for="(item, index) in storeData" v-for="(item, index) in floorList"
:key="index" :key="index"
:style="{ :style="{
background: item.locationUseStatus == 1 ? '#4DC606' : '#F1BE0B', background: item.locationUseStatus == 1 ? '#F1BE0B' : '#4DC606',
border: selectIndex == index ? '2px solid #00329F' : '2px solid rgba(0,0,0,0)' border: selectIndex == index ? '2px solid #00329F' : '2px solid rgba(0,0,0,0)'
}" }"
> >
@ -41,24 +41,27 @@
{{ item.locationNo || '--' }} {{ item.locationNo || '--' }}
</div> </div>
</div> </div>
<el-form :model="formData" label-width="auto" ref="formRef" :rules="formRules"> <el-form label-width="auto" ref="formRef">
<el-form-item label="库位编号"> <el-form-item label="库位编号">
<el-input v-model="formData.locationNo" :disabled="true" /> <el-input v-model="floorList[selectIndex].locationNo" :disabled="true" />
</el-form-item> </el-form-item>
<el-form-item label="区域"> <el-form-item label="区域">
<el-input v-model="formData.areaName" :disabled="true" /> <el-input v-model="floorList[selectIndex].areaName" :disabled="true" />
</el-form-item> </el-form-item>
<el-form-item label="物料信息"> <el-form-item label="物料信息">
<el-input v-model="formData.skuInfo" maxlength="30" show-word-limit /> <el-input v-model="floorList[selectIndex].skuInfo" maxlength="30" show-word-limit />
</el-form-item> </el-form-item>
<el-form-item label="状态"> <el-form-item label="状态">
<el-select v-model="formData.locationUseStatus" placeholder="请选择状态"> <el-select v-model="floorList[selectIndex].locationUseStatus" placeholder="请选择状态">
<el-option label="空闲" :value="0" /> <el-option label="空闲" :value="0" />
<el-option label="占用" :value="1" /> <el-option label="占用" :value="1" />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="禁用库位"> <el-form-item label="禁用库位">
<el-select v-model="formData.locationEnable" placeholder="剧情选择是否禁用库位"> <el-select
v-model="floorList[selectIndex].locationEnable"
placeholder="剧情选择是否禁用库位"
>
<el-option label="禁用" :value="0" /> <el-option label="禁用" :value="0" />
<el-option label="启用" :value="1" /> <el-option label="启用" :value="1" />
</el-select> </el-select>
@ -76,8 +79,10 @@
const { t } = useI18n() // 国际化 const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗 const message = useMessage() // 消息弹窗
import * as MapApi from '@/api/map/map' import * as MapApi from '@/api/map/map'
const dialogVisible = ref(false) // 弹窗的是否展示 const dialogVisible = ref(false) // 弹窗的是否展示
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用 const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formRef = ref() // 表单 Ref
const formData = ref({ const formData = ref({
locationNo: undefined, //库位编号 locationNo: undefined, //库位编号
@ -86,19 +91,14 @@ const formData = ref({
locationEnable: undefined, //是否禁用（0：禁用、1：启用） locationEnable: undefined, //是否禁用（0：禁用、1：启用）
skuInfo: undefined //物料信息 skuInfo: undefined //物料信息
}) })
const formRules = reactive({})
const selectIndex = ref(0) const selectIndex = ref(0)
const formRef = ref() // 表单 Ref const floorList = ref([])
const storeData = ref([])
/** 打开弹窗 */ /** 打开弹窗 */
const open = async (data) => { const open = async (data) => {
console.log(data) floorList.value = data.reverse()
resetForm() selectIndex.value = 0
if (data && data.length) {
storeData.value = data.reverse()
selectIndex.value = 0
formData.value = JSON.parse(JSON.stringify(data[0]))
}
dialogVisible.value = true dialogVisible.value = true
} }
defineExpose({ open }) // 提供 open 方法，用于打开弹窗 defineExpose({ open }) // 提供 open 方法，用于打开弹窗
@ -106,14 +106,10 @@ defineExpose({ open }) // 提供 open 方法，用于打开弹窗
/** 提交表单 */ /** 提交表单 */
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调 const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
const submitForm = async () => { const submitForm = async () => {
// 校验表单
if (!formRef) return
const valid = await formRef.value.validate()
if (!valid) return
// 提交请求 // 提交请求
formLoading.value = true formLoading.value = true
try { try {
await MapApi.updateHouseLocation(formData.value) await MapApi.updateBatchHouseLocation(floorList.value)
message.success('操作成功') message.success('操作成功')
emit('success') emit('success')
dialogVisible.value = false dialogVisible.value = false
@ -123,24 +119,11 @@ const submitForm = async () => {
} }
const changeStore = (item, index) => { const changeStore = (item, index) => {
formData.value = JSON.parse(JSON.stringify(item))
selectIndex.value = index selectIndex.value = index
} }
//前往任务管理页面 //前往任务管理页面
const { push } = useRouter() const { push } = useRouter()
/** 重置表单 */
const resetForm = () => {
formData.value = {
locationNo: undefined, //库位编号
areaName: undefined, //区域名称
locationUseStatus: undefined, //库位状态 （0：空闲、1：占用）
locationEnable: undefined, //是否禁用（0：禁用、1：启用）
skuInfo: undefined //物料信息
}
formRef.value?.resetFields()
}
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

3186
src/views/mapPage/realTimeMap/editMap copy.vue Normal file
View File

File diff suppressed because it is too large Load Diff