更新
This commit is contained in:
49
src/api/areavisual/lane.js
Normal file
49
src/api/areavisual/lane.js
Normal file
@@ -0,0 +1,49 @@
|
|||||||
|
/*
|
||||||
|
* @Author: zwq
|
||||||
|
* @Date: 2025-11-17 09:25:12
|
||||||
|
* @LastEditors: zwq
|
||||||
|
* @LastEditTime: 2026-01-14 13:53:22
|
||||||
|
* @Description:
|
||||||
|
*/
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
|
||||||
|
// 获得巷道分页
|
||||||
|
export function getLanePage(query) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/lane/page',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 获得巷道
|
||||||
|
export function getLane(id) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/lane/get?id=' + id,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 删除巷道
|
||||||
|
export function deleteLane(id) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/lane/delete?id=' + id,
|
||||||
|
method: 'delete'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 更新
|
||||||
|
export function updateLane(data) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/lane/update',
|
||||||
|
method: 'put',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 创建
|
||||||
|
export function createLane(data) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/lane/create',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
66
src/api/areavisual/lineEdgeLibrary.js
Normal file
66
src/api/areavisual/lineEdgeLibrary.js
Normal file
@@ -0,0 +1,66 @@
|
|||||||
|
/*
|
||||||
|
* @Author: zwq
|
||||||
|
* @Date: 2025-11-17 09:25:12
|
||||||
|
* @LastEditors: zwq
|
||||||
|
* @LastEditTime: 2026-01-14 14:26:15
|
||||||
|
* @Description:
|
||||||
|
*/
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
|
||||||
|
// 获得线边库分页
|
||||||
|
export function getLineEdgeLibraryPage(query) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/line-edge-library/page',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 获得线边库
|
||||||
|
export function getLineEdgeLibrary(id) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/line-edge-library/get?id=' + id,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 删除线边库
|
||||||
|
export function deleteLineEdgeLibrary(id) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/line-edge-library/delete?id=' + id,
|
||||||
|
method: 'delete'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 更新
|
||||||
|
export function updateLineEdgeLibrary(data) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/line-edge-library/update',
|
||||||
|
method: 'put',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 更新线边库实时pc --清空操作
|
||||||
|
export function QKLineEdgeLibrary(data) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/line-edge-library/update/pc',
|
||||||
|
method: 'put',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 创建
|
||||||
|
export function createLineEdgeLibrary(data) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/line-edge-library/create',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获得设备分页
|
||||||
|
export function getEquipmentPage(query) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/equipment/page',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
@@ -1,72 +1,79 @@
|
|||||||
import request from '@/utils/request'
|
/*
|
||||||
|
* @Author: zwq
|
||||||
// 获取区域列表
|
* @Date: 2026-01-06 15:18:38
|
||||||
export function getAreaList(params) {
|
* @LastEditors: zwq
|
||||||
return request({
|
* @LastEditTime: 2026-01-15 15:02:04
|
||||||
url: '/wms/region/page',
|
* @Description:
|
||||||
method: 'get',
|
*/
|
||||||
params
|
import request from '@/utils/request'
|
||||||
})
|
|
||||||
}
|
// 获取区域列表
|
||||||
|
export function getAreaList(params) {
|
||||||
// 获取区域空满数量
|
return request({
|
||||||
export function postAllAreaInfo(data) {
|
url: '/wms/region/page',
|
||||||
return request({
|
method: 'get',
|
||||||
url: '/wms/region/lsit/count',
|
params
|
||||||
method: 'post',
|
})
|
||||||
data
|
}
|
||||||
})
|
|
||||||
}
|
// 获取区域空满数量
|
||||||
|
export function postAllAreaInfo(data) {
|
||||||
// 获取指定库区库位信息
|
return request({
|
||||||
export function postAreaInfo(data) {
|
url: '/wms/region/lsit/count',
|
||||||
return request({
|
method: 'post',
|
||||||
url: '/wms/line-edge-library/list/region',
|
data
|
||||||
method: 'post',
|
})
|
||||||
data
|
}
|
||||||
})
|
|
||||||
}
|
// 获取指定库区库位信息
|
||||||
|
export function postAreaInfo(params) {
|
||||||
// 获取区域总览
|
return request({
|
||||||
export function postAllAreaOverview(data) {
|
url: '/wms/line-edge-library/list/region',
|
||||||
return request({
|
method: 'get',
|
||||||
url: '/wms/line-edge-library/line/count',
|
params
|
||||||
method: 'post',
|
})
|
||||||
data
|
}
|
||||||
})
|
|
||||||
}
|
// 获取区域总览
|
||||||
|
export function postAllAreaOverview(data) {
|
||||||
// 删除能源实时数据库plc相关
|
return request({
|
||||||
export function deleteEnergyPlc(id) {
|
url: '/wms/line-edge-library/line/count',
|
||||||
return request({
|
method: 'post',
|
||||||
url: '/base/energy-plc/delete?id=' + id,
|
data
|
||||||
method: 'delete'
|
})
|
||||||
})
|
}
|
||||||
}
|
|
||||||
|
// 删除能源实时数据库plc相关
|
||||||
// 获取关联表编码
|
export function deleteEnergyPlc(id) {
|
||||||
export function getCode() {
|
return request({
|
||||||
return request({
|
url: '/base/energy-plc/delete?id=' + id,
|
||||||
url: '/base/energy-plc/getCode',
|
method: 'delete'
|
||||||
method: 'get'
|
})
|
||||||
})
|
}
|
||||||
}
|
|
||||||
|
// 获取关联表编码
|
||||||
// 获得能源实时数据库plc相关分页
|
export function getCode() {
|
||||||
export function getEnergyPlcPage(data) {
|
return request({
|
||||||
return request({
|
url: '/base/energy-plc/getCode',
|
||||||
url: '/base/energy-plc/page',
|
method: 'get'
|
||||||
method: 'post',
|
})
|
||||||
data: data
|
}
|
||||||
})
|
|
||||||
}
|
// 获得能源实时数据库plc相关分页
|
||||||
|
export function getEnergyPlcPage(data) {
|
||||||
// 导出能源实时数据库plc相关 Excel
|
return request({
|
||||||
export function exportEnergyPlcExcel(query) {
|
url: '/base/energy-plc/page',
|
||||||
return request({
|
method: 'post',
|
||||||
url: '/base/energy-plc/export-excel',
|
data: data
|
||||||
method: 'get',
|
})
|
||||||
params: query,
|
}
|
||||||
responseType: 'blob'
|
|
||||||
})
|
// 导出能源实时数据库plc相关 Excel
|
||||||
}
|
export function exportEnergyPlcExcel(query) {
|
||||||
|
return request({
|
||||||
|
url: '/base/energy-plc/export-excel',
|
||||||
|
method: 'get',
|
||||||
|
params: query,
|
||||||
|
responseType: 'blob'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|||||||
49
src/api/areavisual/region.js
Normal file
49
src/api/areavisual/region.js
Normal file
@@ -0,0 +1,49 @@
|
|||||||
|
/*
|
||||||
|
* @Author: zwq
|
||||||
|
* @Date: 2025-11-17 09:25:12
|
||||||
|
* @LastEditors: zwq
|
||||||
|
* @LastEditTime: 2026-01-14 13:35:11
|
||||||
|
* @Description:
|
||||||
|
*/
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
|
||||||
|
// 获得区域分页
|
||||||
|
export function getRegionPage(query) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/region/page',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 获得区域
|
||||||
|
export function getRegion(id) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/region/get?id=' + id,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 删除区域
|
||||||
|
export function deleteRegion(id) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/region/delete?id=' + id,
|
||||||
|
method: 'delete'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 更新
|
||||||
|
export function updateRegion(data) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/region/update',
|
||||||
|
method: 'put',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 创建
|
||||||
|
export function createRegion(data) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/region/create',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
@@ -2,7 +2,7 @@
|
|||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2025-11-17 09:25:12
|
* @Date: 2025-11-17 09:25:12
|
||||||
* @LastEditors: zwq
|
* @LastEditors: zwq
|
||||||
* @LastEditTime: 2025-11-28 09:29:14
|
* @LastEditTime: 2026-01-13 16:13:53
|
||||||
* @Description:
|
* @Description:
|
||||||
*/
|
*/
|
||||||
import request from '@/utils/request'
|
import request from '@/utils/request'
|
||||||
@@ -16,6 +16,14 @@ export function getProductPage(query) {
|
|||||||
params: query
|
params: query
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
// 获得所有原料
|
||||||
|
export function getAllProductPage(query) {
|
||||||
|
return request({
|
||||||
|
url: '/wms/material/list/all/code',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
// 获得原料
|
// 获得原料
|
||||||
export function getProduct(id) {
|
export function getProduct(id) {
|
||||||
return request({
|
return request({
|
||||||
|
|||||||
@@ -14,7 +14,12 @@
|
|||||||
v-if="collapse"
|
v-if="collapse"
|
||||||
key="collapse"
|
key="collapse"
|
||||||
class="sidebar-logo-link"
|
class="sidebar-logo-link"
|
||||||
to="/">
|
:to="{
|
||||||
|
path: '/',
|
||||||
|
query: {
|
||||||
|
keyword: 'home',
|
||||||
|
},
|
||||||
|
}">
|
||||||
<img v-if="logo" :src="logo" class="sidebar-logo" />
|
<img v-if="logo" :src="logo" class="sidebar-logo" />
|
||||||
<h1
|
<h1
|
||||||
v-else
|
v-else
|
||||||
@@ -28,7 +33,16 @@
|
|||||||
{{ title }}
|
{{ title }}
|
||||||
</h1>
|
</h1>
|
||||||
</router-link>
|
</router-link>
|
||||||
<router-link v-else key="expand" class="sidebar-logo-link" to="/">
|
<router-link
|
||||||
|
v-else
|
||||||
|
key="expand"
|
||||||
|
class="sidebar-logo-link"
|
||||||
|
:to="{
|
||||||
|
path: '/',
|
||||||
|
query: {
|
||||||
|
keyword: 'home',
|
||||||
|
},
|
||||||
|
}">
|
||||||
<img v-if="logo" :src="logo" class="sidebar-logo" />
|
<img v-if="logo" :src="logo" class="sidebar-logo" />
|
||||||
<h1
|
<h1
|
||||||
class="sidebar-title"
|
class="sidebar-title"
|
||||||
|
|||||||
@@ -1,3 +1,10 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: zwq
|
||||||
|
* @Date: 2026-01-06 15:18:41
|
||||||
|
* @LastEditors: zwq
|
||||||
|
* @LastEditTime: 2026-01-15 09:52:23
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
<template>
|
<template>
|
||||||
<div v-if="!item.hidden">
|
<div v-if="!item.hidden">
|
||||||
<template v-if="hasOneShowingChild(item.children,item) && (!onlyOneChild.children||onlyOneChild.noShowingChildren)&&!item.alwaysShow">
|
<template v-if="hasOneShowingChild(item.children,item) && (!onlyOneChild.children||onlyOneChild.noShowingChildren)&&!item.alwaysShow">
|
||||||
|
|||||||
@@ -1,3 +1,10 @@
|
|||||||
|
/*
|
||||||
|
* @Author: zwq
|
||||||
|
* @Date: 2026-01-06 15:18:38
|
||||||
|
* @LastEditors: zwq
|
||||||
|
* @LastEditTime: 2026-01-15 09:54:44
|
||||||
|
* @Description:
|
||||||
|
*/
|
||||||
import router from './router'
|
import router from './router'
|
||||||
import store from './store'
|
import store from './store'
|
||||||
import { Message } from 'element-ui'
|
import { Message } from 'element-ui'
|
||||||
@@ -9,7 +16,7 @@ import { isRelogin } from '@/utils/request'
|
|||||||
NProgress.configure({ showSpinner: false })
|
NProgress.configure({ showSpinner: false })
|
||||||
|
|
||||||
// 增加三方登陆 update by 芋艿
|
// 增加三方登陆 update by 芋艿
|
||||||
const whiteList = ['/login', '/social-login','screenbg', '/auth-redirect', '/bind', '/register', '/oauthLogin/gitee']
|
const whiteList = ['/login', '/social-login', 'screenbg', '/auth-redirect', '/bind', '/register', '/oauthLogin/gitee']
|
||||||
|
|
||||||
router.beforeEach((to, from, next) => {
|
router.beforeEach((to, from, next) => {
|
||||||
NProgress.start()
|
NProgress.start()
|
||||||
@@ -17,7 +24,12 @@ router.beforeEach((to, from, next) => {
|
|||||||
to.meta.title && store.dispatch('settings/setTitle', to.meta.title)
|
to.meta.title && store.dispatch('settings/setTitle', to.meta.title)
|
||||||
/* has token*/
|
/* has token*/
|
||||||
if (to.path === '/login') {
|
if (to.path === '/login') {
|
||||||
next({ path: '/' })
|
next({
|
||||||
|
path: '/',
|
||||||
|
query: {
|
||||||
|
keyword: 'home',
|
||||||
|
},
|
||||||
|
})
|
||||||
NProgress.done()
|
NProgress.done()
|
||||||
} else {
|
} else {
|
||||||
if (store.getters.roles.length === 0) {
|
if (store.getters.roles.length === 0) {
|
||||||
@@ -35,7 +47,12 @@ router.beforeEach((to, from, next) => {
|
|||||||
}).catch(err => {
|
}).catch(err => {
|
||||||
store.dispatch('LogOut').then(() => {
|
store.dispatch('LogOut').then(() => {
|
||||||
Message.error(err)
|
Message.error(err)
|
||||||
next({ path: '/' })
|
next({
|
||||||
|
path: '/',
|
||||||
|
query: {
|
||||||
|
keyword: 'home',
|
||||||
|
},
|
||||||
|
})
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
|
|||||||
@@ -77,12 +77,15 @@ export const constantRoutes = [
|
|||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
path: 'index',
|
path: 'index',
|
||||||
component: (resolve) => require(['@/views/home/index'], resolve),
|
component: (resolve) => require(['@/views/productionVisualization/equipmentBoard'], resolve),
|
||||||
name: '首页',
|
name: '首页',
|
||||||
meta: { title: '首页', icon: 'dashboard', affix: true },
|
meta: { title: '首页', icon: 'dashboard', affix: true },
|
||||||
hidden: true,
|
hidden: true,
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
|
props: (route) => ({
|
||||||
|
keyword: 'home',
|
||||||
|
})
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/screenbg',
|
path: '/screenbg',
|
||||||
|
|||||||
81
src/views/areavisual/lane/add-or-updata.vue
Normal file
81
src/views/areavisual/lane/add-or-updata.vue
Normal file
@@ -0,0 +1,81 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: zwq
|
||||||
|
* @Date: 2021-11-18 14:16:25
|
||||||
|
* @LastEditors: zwq
|
||||||
|
* @LastEditTime: 2025-11-28 14:38:31
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<el-form
|
||||||
|
:model="dataForm"
|
||||||
|
:rules="dataRule"
|
||||||
|
ref="dataForm"
|
||||||
|
@keyup.enter.native="dataFormSubmit()"
|
||||||
|
label-width="80px">
|
||||||
|
<el-row :gutter="20">
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="物料编码" prop="materialCode">
|
||||||
|
<el-input
|
||||||
|
v-model="dataForm.materialCode"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入物料编码" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="物料型号" prop="materialName">
|
||||||
|
<el-input
|
||||||
|
v-model="dataForm.materialName"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入物料型号" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row :gutter="20">
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="物料规格" prop="material">
|
||||||
|
<el-input
|
||||||
|
v-model="dataForm.material"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入物料规格" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import basicAdd from '@/mixins/basic-add';
|
||||||
|
import { createProduct, updateProduct,getProduct } from '@/api/ssdl/product&recipe';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
mixins: [basicAdd],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
urlOptions: {
|
||||||
|
createURL: createProduct,
|
||||||
|
updateURL: updateProduct,
|
||||||
|
infoURL: getProduct,
|
||||||
|
},
|
||||||
|
dataForm: {
|
||||||
|
id: undefined,
|
||||||
|
material: undefined,
|
||||||
|
materialName: undefined,
|
||||||
|
materialCode: undefined,
|
||||||
|
},
|
||||||
|
typeArr: [],
|
||||||
|
dataRule: {
|
||||||
|
materialCode: [
|
||||||
|
{ required: true, message: '物料编码不能为空', trigger: 'blur' },
|
||||||
|
],
|
||||||
|
materialName: [
|
||||||
|
{ required: true, message: '物料型号不能为空', trigger: 'blur' },
|
||||||
|
],
|
||||||
|
material: [
|
||||||
|
{ required: true, message: '规格不能为空', trigger: 'blur' },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
62
src/views/areavisual/lane/changeStatus.vue
Normal file
62
src/views/areavisual/lane/changeStatus.vue
Normal file
@@ -0,0 +1,62 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: zwq
|
||||||
|
* @Date: 2025-10-11 14:41:12
|
||||||
|
* @LastEditors: zwq
|
||||||
|
* @LastEditTime: 2026-01-14 14:15:47
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<el-switch
|
||||||
|
@change="changeStatus"
|
||||||
|
size="small"
|
||||||
|
v-model="injectData.laneState"
|
||||||
|
:active-value="1"
|
||||||
|
:inactive-value="2"></el-switch>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { updateLane } from '@/api/areavisual/lane';
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
injectData: {
|
||||||
|
type: Object,
|
||||||
|
default: () => ({}),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
changeStatus(val) {
|
||||||
|
const pdata = { ...this.injectData, laneState: val };
|
||||||
|
this.$confirm(
|
||||||
|
`是否确认修改${'巷道 [ ' + this.injectData.laneName + ' ] '}的状态?`,
|
||||||
|
'更新状态',
|
||||||
|
{
|
||||||
|
confirmButtonText: '确认修改',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning',
|
||||||
|
}
|
||||||
|
)
|
||||||
|
.then(() => {
|
||||||
|
updateLane(pdata).then((res) => {
|
||||||
|
if (res.code === 0 || res.code === 200) {
|
||||||
|
this.$modal.msgSuccess('修改成功');
|
||||||
|
this.$emit('emitData');
|
||||||
|
} else {
|
||||||
|
this.$modal.msg(res.msg);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch((res) => {
|
||||||
|
this.$emit('emitData');
|
||||||
|
this.$message({
|
||||||
|
type: 'info',
|
||||||
|
message: '已取消',
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
191
src/views/areavisual/lane/index.vue
Normal file
191
src/views/areavisual/lane/index.vue
Normal file
@@ -0,0 +1,191 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<search-bar
|
||||||
|
:formConfigs="formConfig"
|
||||||
|
ref="searchBarForm"
|
||||||
|
@headBtnClick="buttonClick" />
|
||||||
|
<base-table
|
||||||
|
v-loading="dataListLoading"
|
||||||
|
:table-props="tableProps"
|
||||||
|
:page="listQuery.pageNo"
|
||||||
|
:limit="listQuery.pageSize"
|
||||||
|
:table-data="tableData"
|
||||||
|
@emitFun="getDataList">
|
||||||
|
</base-table>
|
||||||
|
<pagination
|
||||||
|
:limit.sync="listQuery.pageSize"
|
||||||
|
:page.sync="listQuery.pageNo"
|
||||||
|
:total="listQuery.total"
|
||||||
|
@pagination="getDataList" />
|
||||||
|
<base-dialog
|
||||||
|
:dialogTitle="addOrEditTitle"
|
||||||
|
:dialogVisible="addOrUpdateVisible"
|
||||||
|
@cancel="handleCancel"
|
||||||
|
@confirm="handleConfirm"
|
||||||
|
:before-close="handleCancel"
|
||||||
|
width="50%">
|
||||||
|
<add-or-update
|
||||||
|
ref="addOrUpdate"
|
||||||
|
@refreshDataList="successSubmit"></add-or-update>
|
||||||
|
</base-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import AddOrUpdate from './add-or-updata';
|
||||||
|
import basicPage from '@/mixins/basic-page';
|
||||||
|
import { parseTime } from '@/filter/code-filter';
|
||||||
|
import { deleteLane, getLanePage } from '@/api/areavisual/lane';
|
||||||
|
import changeStatus from './changeStatus.vue';
|
||||||
|
|
||||||
|
const lane = [
|
||||||
|
{
|
||||||
|
id: '1',
|
||||||
|
name: 'A巷道',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '2',
|
||||||
|
name: 'B巷道',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '3',
|
||||||
|
name: 'C巷道',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '4',
|
||||||
|
name: 'D巷道',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '5',
|
||||||
|
name: 'E巷道',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '6',
|
||||||
|
name: 'F巷道',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
const tableProps = [
|
||||||
|
{
|
||||||
|
prop: 'laneCode',
|
||||||
|
label: '巷道编码',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'laneName',
|
||||||
|
label: '巷道名称',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'lane',
|
||||||
|
label: '巷道',
|
||||||
|
filter: (val) => {
|
||||||
|
return lane.find((i) => i.id == val)
|
||||||
|
? lane.find((i) => i.id == val).name
|
||||||
|
: '-';
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'laneSort',
|
||||||
|
label: '巷道排序',
|
||||||
|
width:90,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'laneState',
|
||||||
|
label: '巷道状态',
|
||||||
|
width:90,
|
||||||
|
subcomponent: changeStatus,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'createTime',
|
||||||
|
label: '创建时间',
|
||||||
|
filter: parseTime,
|
||||||
|
width: 150,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export default {
|
||||||
|
mixins: [basicPage],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
urlOptions: {
|
||||||
|
getDataListURL: getLanePage,
|
||||||
|
deleteURL: deleteLane,
|
||||||
|
},
|
||||||
|
tableProps,
|
||||||
|
tableBtn: [
|
||||||
|
{
|
||||||
|
type: 'edit',
|
||||||
|
btnName: '编辑',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'delete',
|
||||||
|
btnName: '删除',
|
||||||
|
},
|
||||||
|
].filter((v) => v),
|
||||||
|
tableData: [],
|
||||||
|
formConfig: [
|
||||||
|
{
|
||||||
|
type: 'input',
|
||||||
|
label: '名称',
|
||||||
|
placeholder: '名称',
|
||||||
|
param: 'name',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'input',
|
||||||
|
label: '编码',
|
||||||
|
placeholder: '编码',
|
||||||
|
param: 'code',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'select',
|
||||||
|
label: '巷道',
|
||||||
|
selectOptions: lane,
|
||||||
|
placeholder: '请选择巷道',
|
||||||
|
param: 'lane',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'button',
|
||||||
|
btnName: '搜索',
|
||||||
|
name: 'search',
|
||||||
|
color: 'primary',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
AddOrUpdate,
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
buttonClick(val) {
|
||||||
|
switch (val.btnName) {
|
||||||
|
case 'search':
|
||||||
|
this.listQuery.pageNo = 1;
|
||||||
|
this.listQuery.pageSize = 20;
|
||||||
|
this.listQuery.laneName = val.name;
|
||||||
|
this.listQuery.laneCode = val.code;
|
||||||
|
this.listQuery.lane = val.lane;
|
||||||
|
this.getDataList();
|
||||||
|
break;
|
||||||
|
case 'reset':
|
||||||
|
this.$refs.searchBarForm.resetForm();
|
||||||
|
this.listQuery = {
|
||||||
|
pageSize: 20,
|
||||||
|
pageNo: 1,
|
||||||
|
total: 1,
|
||||||
|
};
|
||||||
|
this.getDataList();
|
||||||
|
break;
|
||||||
|
case 'add':
|
||||||
|
this.addOrEditTitle = '新增';
|
||||||
|
this.addOrUpdateVisible = true;
|
||||||
|
this.addOrUpdateHandle();
|
||||||
|
break;
|
||||||
|
case 'export':
|
||||||
|
this.handleExport();
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
console.log(val);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
324
src/views/areavisual/lineEdgeLibrary/add-or-updata.vue
Normal file
324
src/views/areavisual/lineEdgeLibrary/add-or-updata.vue
Normal file
@@ -0,0 +1,324 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: zwq
|
||||||
|
* @Date: 2021-11-18 14:16:25
|
||||||
|
* @LastEditors: zwq
|
||||||
|
* @LastEditTime: 2026-01-15 09:16:36
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<el-form
|
||||||
|
:model="dataForm"
|
||||||
|
:rules="dataRule"
|
||||||
|
ref="dataForm"
|
||||||
|
@keyup.enter.native="dataFormSubmit()"
|
||||||
|
label-width="80px">
|
||||||
|
<div class="stat-card">
|
||||||
|
<div class="stat-icon">
|
||||||
|
<i class="el-icon-s-grid" style="color: #fff"></i>
|
||||||
|
</div>
|
||||||
|
<div class="stat-title">库位信息</div>
|
||||||
|
<div class="stat-content">
|
||||||
|
<div class="stat-value">{{ lineInfo.lineEdgeLibraryCode }}</div>
|
||||||
|
<div class="stat-label">{{ lineInfo.lineEdgeLibraryName }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<el-row :gutter="20">
|
||||||
|
<el-col :span="24">
|
||||||
|
<el-form-item label="物料" prop="materialId">
|
||||||
|
<el-select
|
||||||
|
style="width: 100%"
|
||||||
|
v-model="dataForm.materialId"
|
||||||
|
filterable
|
||||||
|
@change="setMaterial"
|
||||||
|
placeholder="请选择物料">
|
||||||
|
<el-option
|
||||||
|
v-for="item in productArr"
|
||||||
|
:key="item.id"
|
||||||
|
:label="
|
||||||
|
item.materialCode +
|
||||||
|
'-' +
|
||||||
|
item.materialName +
|
||||||
|
'-' +
|
||||||
|
item.material
|
||||||
|
"
|
||||||
|
:value="item.id"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="本盘长度" prop="cableLength">
|
||||||
|
<el-input-number
|
||||||
|
v-model="dataForm.cableLength"
|
||||||
|
:min="0"
|
||||||
|
:precision="2"></el-input-number>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="设备" prop="equipmentId">
|
||||||
|
<el-select
|
||||||
|
v-model="dataForm.equipmentId"
|
||||||
|
@change="setEquipment"
|
||||||
|
placeholder="请选择绞体">
|
||||||
|
<el-option
|
||||||
|
v-for="item in options1"
|
||||||
|
:key="item.id"
|
||||||
|
:label="item.equipmentName"
|
||||||
|
:value="item.id"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="应用套号" prop="suite">
|
||||||
|
<el-select v-model="dataForm.suite" placeholder="请选择应用套号">
|
||||||
|
<el-option
|
||||||
|
v-for="item in options2"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<span v-if="dataForm.suite == 2">
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="选择套号" prop="time">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="dataForm.time"
|
||||||
|
value-format="yyyy-MM-dd"
|
||||||
|
type="date"></el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="" prop="productionLine">
|
||||||
|
<el-select v-model="dataForm.productionLine">
|
||||||
|
<el-option
|
||||||
|
v-for="item in options3"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="" prop="numb">
|
||||||
|
<el-select v-model="dataForm.numb">
|
||||||
|
<el-option
|
||||||
|
v-for="item in options4"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</span>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import basicAdd from '@/mixins/basic-add';
|
||||||
|
import { getAllProductPage } from '@/api/ssdl/product&recipe';
|
||||||
|
import {
|
||||||
|
QKLineEdgeLibrary,
|
||||||
|
getEquipmentPage,
|
||||||
|
} from '@/api/areavisual/lineEdgeLibrary';
|
||||||
|
import { parseTime } from '@/filter/code-filter';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
mixins: [basicAdd],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
urlOptions: {
|
||||||
|
createURL: QKLineEdgeLibrary,
|
||||||
|
},
|
||||||
|
dataForm: {
|
||||||
|
id: undefined,
|
||||||
|
materialId: undefined,
|
||||||
|
materialName: undefined,
|
||||||
|
materialCode: undefined,
|
||||||
|
material: undefined,
|
||||||
|
cableLength: undefined,
|
||||||
|
equipmentId: undefined,
|
||||||
|
equipmentName: undefined,
|
||||||
|
suite: undefined, //是否成套
|
||||||
|
suiteCode: undefined, //套号
|
||||||
|
time: this.parseTime(new Date(), '{y}-{m}-{d}'),
|
||||||
|
productionLine: undefined,
|
||||||
|
numb: undefined,
|
||||||
|
},
|
||||||
|
lineInfo: {},
|
||||||
|
productArr: [],
|
||||||
|
options1: [],
|
||||||
|
options2: [
|
||||||
|
{
|
||||||
|
value: 2,
|
||||||
|
label: '是',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 1,
|
||||||
|
label: '否',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
options3: [
|
||||||
|
{
|
||||||
|
value: '6#',
|
||||||
|
label: '6#',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '7#',
|
||||||
|
label: '7#',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '8#',
|
||||||
|
label: '8#',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
options4: [
|
||||||
|
{
|
||||||
|
value: 0,
|
||||||
|
label: '0',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 1,
|
||||||
|
label: '1',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 2,
|
||||||
|
label: '2',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 3,
|
||||||
|
label: '3',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 4,
|
||||||
|
label: '4',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 5,
|
||||||
|
label: '5',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 6,
|
||||||
|
label: '6',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
dataRule: {
|
||||||
|
materialId: [
|
||||||
|
{ required: true, message: '物料不能为空', trigger: 'change' },
|
||||||
|
],
|
||||||
|
time: [{ required: true, message: '不能为空', trigger: 'change' }],
|
||||||
|
productionLine: [
|
||||||
|
{ required: true, message: '不能为空', trigger: 'change' },
|
||||||
|
],
|
||||||
|
numb: [{ required: true, message: '不能为空', trigger: 'change' }],
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
showLine(val) {
|
||||||
|
getAllProductPage().then((res) => {
|
||||||
|
this.productArr = res.data;
|
||||||
|
});
|
||||||
|
getEquipmentPage({ pageNo: 1, pageSize: 100, equipmentType: 2 }).then(
|
||||||
|
(res) => {
|
||||||
|
this.options1 = res.data.list;
|
||||||
|
}
|
||||||
|
);
|
||||||
|
this.lineInfo = { ...val };
|
||||||
|
},
|
||||||
|
setMaterial() {
|
||||||
|
const data = this.productArr.find(
|
||||||
|
(i) => i.id === this.dataForm.materialId
|
||||||
|
);
|
||||||
|
this.dataForm.materialName = data.materialName;
|
||||||
|
this.dataForm.material = data.material;
|
||||||
|
this.dataForm.materialCode = data.materialCode;
|
||||||
|
},
|
||||||
|
setEquipment() {
|
||||||
|
const data = this.options1.find(
|
||||||
|
(i) => i.id === this.dataForm.equipmentId
|
||||||
|
);
|
||||||
|
this.dataForm.equipmentName = data.equipmentName;
|
||||||
|
},
|
||||||
|
// 表单提交
|
||||||
|
dataFormSubmit() {
|
||||||
|
this.$refs['dataForm'].validate((valid) => {
|
||||||
|
if (!valid) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
if (this.dataForm.suite == 2) {
|
||||||
|
this.dataForm.suiteCode =
|
||||||
|
this.dataForm.time +
|
||||||
|
'-' +
|
||||||
|
this.dataForm.productionLine +
|
||||||
|
'-' +
|
||||||
|
this.dataForm.numb;
|
||||||
|
}
|
||||||
|
QKLineEdgeLibrary({
|
||||||
|
...this.lineInfo,
|
||||||
|
...this.dataForm,
|
||||||
|
lineEdgeLibraryState: 1,
|
||||||
|
id: this.lineInfo.id,
|
||||||
|
}).then((response) => {
|
||||||
|
this.$modal.msgSuccess('操作成功');
|
||||||
|
this.visible = false;
|
||||||
|
this.$emit('refreshDataList');
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.stat-card {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 10px;
|
||||||
|
background: white;
|
||||||
|
border-radius: 12px;
|
||||||
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
border-left: 4px solid;
|
||||||
|
border-color: #1a56db;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* .stat-card:hover {
|
||||||
|
transform: translateY(-5px);
|
||||||
|
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
|
||||||
|
} */
|
||||||
|
.stat-title {
|
||||||
|
margin: 0 10px;
|
||||||
|
color: #0051ff;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
.stat-icon {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
border-radius: 12px;
|
||||||
|
margin-right: 15px;
|
||||||
|
background: linear-gradient(to right, #1a56db, #0d47a1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-value {
|
||||||
|
font-size: 28px;
|
||||||
|
font-weight: 700;
|
||||||
|
line-height: 1.2;
|
||||||
|
color: #1a56db;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-label {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #64748b;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
318
src/views/areavisual/lineEdgeLibrary/index.vue
Normal file
318
src/views/areavisual/lineEdgeLibrary/index.vue
Normal file
@@ -0,0 +1,318 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<search-bar
|
||||||
|
:formConfigs="formConfig"
|
||||||
|
ref="searchBarForm"
|
||||||
|
@headBtnClick="buttonClick" />
|
||||||
|
<base-table
|
||||||
|
v-loading="dataListLoading"
|
||||||
|
:table-props="tableProps"
|
||||||
|
:page="listQuery.pageNo"
|
||||||
|
:limit="listQuery.pageSize"
|
||||||
|
:table-data="tableData"
|
||||||
|
@emitFun="getDataList">
|
||||||
|
<method-btn
|
||||||
|
v-if="tableBtn.length"
|
||||||
|
slot="handleBtn"
|
||||||
|
:width="110"
|
||||||
|
label="操作"
|
||||||
|
:method-list="tableBtn"
|
||||||
|
@clickBtn="handleClick" />
|
||||||
|
</base-table>
|
||||||
|
<pagination
|
||||||
|
:limit.sync="listQuery.pageSize"
|
||||||
|
:page.sync="listQuery.pageNo"
|
||||||
|
:total="listQuery.total"
|
||||||
|
@pagination="getDataList" />
|
||||||
|
<base-dialog
|
||||||
|
:dialogTitle="addOrEditTitle"
|
||||||
|
:dialogVisible="addOrUpdateVisible"
|
||||||
|
@cancel="handleCancel"
|
||||||
|
@confirm="handleConfirm"
|
||||||
|
:before-close="handleCancel"
|
||||||
|
destroy-on-close
|
||||||
|
width="50%">
|
||||||
|
<add-or-update
|
||||||
|
ref="addOrUpdate"
|
||||||
|
@refreshDataList="successSubmit"></add-or-update>
|
||||||
|
</base-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import AddOrUpdate from './add-or-updata';
|
||||||
|
import basicPage from '@/mixins/basic-page';
|
||||||
|
import { parseTime } from '@/filter/code-filter';
|
||||||
|
import {
|
||||||
|
deleteLineEdgeLibrary,
|
||||||
|
getLineEdgeLibraryPage,
|
||||||
|
QKLineEdgeLibrary,
|
||||||
|
} from '@/api/areavisual/lineEdgeLibrary';
|
||||||
|
|
||||||
|
const laneRow = [
|
||||||
|
{
|
||||||
|
id: '1',
|
||||||
|
name: '第一排',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '2',
|
||||||
|
name: '第二排',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '3',
|
||||||
|
name: '第三排',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '4',
|
||||||
|
name: '第四排',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '5',
|
||||||
|
name: '第五排',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '6',
|
||||||
|
name: '第六排',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
const tableProps = [
|
||||||
|
{
|
||||||
|
prop: 'lineEdgeLibraryCode',
|
||||||
|
label: '线边库编码',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'lineEdgeLibraryName',
|
||||||
|
label: '线边库名称',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'agvGroundCode',
|
||||||
|
label: 'agv码',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'lineEdgeLibraryState',
|
||||||
|
label: '线边库状态',
|
||||||
|
width: 90,
|
||||||
|
filter: (val) => {
|
||||||
|
return val ? '满位' : '空闲';
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'usableState',
|
||||||
|
label: '是否可用',
|
||||||
|
width: 90,
|
||||||
|
filter: (val) => {
|
||||||
|
return ['', '可用', '不可用', '锁定'][val];
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'trayType',
|
||||||
|
label: '托盘类型',
|
||||||
|
width: 90,
|
||||||
|
filter: (val) => {
|
||||||
|
return val ? '笼式' : '盘式';
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'productionLine',
|
||||||
|
label: '产线',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'equipmentName',
|
||||||
|
label: '设备',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'suiteCode',
|
||||||
|
label: '套号',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'laneRow',
|
||||||
|
label: '巷道排',
|
||||||
|
filter: (val) => {
|
||||||
|
return laneRow.find((i) => i.id == val)
|
||||||
|
? laneRow.find((i) => i.id == val).name
|
||||||
|
: '-';
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'materialCode',
|
||||||
|
label: '物料',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'batch',
|
||||||
|
label: '批次',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'cableLength',
|
||||||
|
label: '线缆长度',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'createTime',
|
||||||
|
label: '创建时间',
|
||||||
|
filter: parseTime,
|
||||||
|
width: 150,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export default {
|
||||||
|
mixins: [basicPage],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
urlOptions: {
|
||||||
|
getDataListURL: getLineEdgeLibraryPage,
|
||||||
|
deleteURL: deleteLineEdgeLibrary,
|
||||||
|
},
|
||||||
|
tableProps,
|
||||||
|
tableData: [],
|
||||||
|
tableBtn: [
|
||||||
|
{
|
||||||
|
type: 'clear',
|
||||||
|
btnName: '清空',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'add',
|
||||||
|
btnName: '添加',
|
||||||
|
},
|
||||||
|
].filter((v) => v),
|
||||||
|
formConfig: [
|
||||||
|
{
|
||||||
|
type: 'input',
|
||||||
|
label: '线边库名称',
|
||||||
|
placeholder: '线边库名称',
|
||||||
|
param: 'name',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'input',
|
||||||
|
label: '线边库编码',
|
||||||
|
placeholder: '线边库编码',
|
||||||
|
param: 'code',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'select',
|
||||||
|
label: '巷道排',
|
||||||
|
selectOptions: laneRow,
|
||||||
|
placeholder: '请选择巷道排',
|
||||||
|
param: 'laneRow',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'button',
|
||||||
|
btnName: '搜索',
|
||||||
|
name: 'search',
|
||||||
|
color: 'primary',
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// type: 'separate',
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// type: 'button',
|
||||||
|
// btnName: '重置',
|
||||||
|
// name: 'reset',
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// type: 'separate',
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// type: 'button',
|
||||||
|
// btnName: '新增',
|
||||||
|
// name: 'add',
|
||||||
|
// color: 'success',
|
||||||
|
// plain: true,
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// type: this.$auth.hasPermi('base:factory:create') ? 'separate' : '',
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// type: this.$auth.hasPermi('base:factory:export') ? 'button' : '',
|
||||||
|
// btnName: '导出',
|
||||||
|
// name: 'export',
|
||||||
|
// color: 'warning',
|
||||||
|
// },
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
AddOrUpdate,
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
buttonClick(val) {
|
||||||
|
switch (val.btnName) {
|
||||||
|
case 'search':
|
||||||
|
this.listQuery.pageNo = 1;
|
||||||
|
this.listQuery.pageSize = 20;
|
||||||
|
this.listQuery.lineEdgeLibraryName = val.name;
|
||||||
|
this.listQuery.lineEdgeLibraryCode = val.code;
|
||||||
|
this.listQuery.laneRow = val.laneRow;
|
||||||
|
this.getDataList();
|
||||||
|
break;
|
||||||
|
case 'reset':
|
||||||
|
this.$refs.searchBarForm.resetForm();
|
||||||
|
this.listQuery = {
|
||||||
|
pageSize: 20,
|
||||||
|
pageNo: 1,
|
||||||
|
total: 1,
|
||||||
|
};
|
||||||
|
this.getDataList();
|
||||||
|
break;
|
||||||
|
case 'add':
|
||||||
|
this.addOrEditTitle = '新增';
|
||||||
|
this.addOrUpdateVisible = true;
|
||||||
|
this.addOrUpdateHandle();
|
||||||
|
break;
|
||||||
|
case 'export':
|
||||||
|
this.handleExport();
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
console.log(val);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
otherMethods(val) {
|
||||||
|
if (val.type == 'clear') {
|
||||||
|
if (val.data.usableState == 3) {
|
||||||
|
this.$confirm(
|
||||||
|
`当前库位为锁定状态，代表该库位有未完成的任务关联，是否确认清空${
|
||||||
|
'线边库名称为 ' + val.data.lineEdgeLibraryName + ' '
|
||||||
|
}的数据项?`,
|
||||||
|
'锁定库位清空提示',
|
||||||
|
{
|
||||||
|
confirmButtonText: '确定',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning',
|
||||||
|
}
|
||||||
|
)
|
||||||
|
.then(() => {
|
||||||
|
QKLineEdgeLibrary({...val.data,lineEdgeLibraryState:0,usableState:1 }).then(({ data }) => {
|
||||||
|
this.$message({
|
||||||
|
message: data,
|
||||||
|
type: 'success',
|
||||||
|
duration: 1500,
|
||||||
|
onClose: () => {
|
||||||
|
this.getDataList();
|
||||||
|
},
|
||||||
|
});
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(() => {});
|
||||||
|
} else {
|
||||||
|
QKLineEdgeLibrary({...val.data,lineEdgeLibraryState:0,usableState:1 }).then(({ data }) => {
|
||||||
|
this.$message({
|
||||||
|
message: data,
|
||||||
|
type: 'success',
|
||||||
|
duration: 1500,
|
||||||
|
onClose: () => {
|
||||||
|
this.getDataList();
|
||||||
|
},
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} else if (val.type === 'add') {
|
||||||
|
this.addOrEditTitle = '添加货物';
|
||||||
|
this.addOrUpdateVisible = true;
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.$refs.addOrUpdate.init();
|
||||||
|
this.$refs.addOrUpdate.showLine(val.data);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
324
src/views/areavisual/overview/components/add-or-updata.vue
Normal file
324
src/views/areavisual/overview/components/add-or-updata.vue
Normal file
@@ -0,0 +1,324 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: zwq
|
||||||
|
* @Date: 2021-11-18 14:16:25
|
||||||
|
* @LastEditors: zwq
|
||||||
|
* @LastEditTime: 2026-01-15 09:16:36
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<el-form
|
||||||
|
:model="dataForm"
|
||||||
|
:rules="dataRule"
|
||||||
|
ref="dataForm"
|
||||||
|
@keyup.enter.native="dataFormSubmit()"
|
||||||
|
label-width="80px">
|
||||||
|
<div class="stat-card">
|
||||||
|
<div class="stat-icon">
|
||||||
|
<i class="el-icon-s-grid" style="color: #fff"></i>
|
||||||
|
</div>
|
||||||
|
<div class="stat-title">库位信息</div>
|
||||||
|
<div class="stat-content">
|
||||||
|
<div class="stat-value">{{ lineInfo.lineEdgeLibraryCode }}</div>
|
||||||
|
<div class="stat-label">{{ lineInfo.lineEdgeLibraryName }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<el-row :gutter="20">
|
||||||
|
<el-col :span="24">
|
||||||
|
<el-form-item label="物料" prop="materialId">
|
||||||
|
<el-select
|
||||||
|
style="width: 100%"
|
||||||
|
v-model="dataForm.materialId"
|
||||||
|
filterable
|
||||||
|
@change="setMaterial"
|
||||||
|
placeholder="请选择物料">
|
||||||
|
<el-option
|
||||||
|
v-for="item in productArr"
|
||||||
|
:key="item.id"
|
||||||
|
:label="
|
||||||
|
item.materialCode +
|
||||||
|
'-' +
|
||||||
|
item.materialName +
|
||||||
|
'-' +
|
||||||
|
item.material
|
||||||
|
"
|
||||||
|
:value="item.id"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="本盘长度" prop="cableLength">
|
||||||
|
<el-input-number
|
||||||
|
v-model="dataForm.cableLength"
|
||||||
|
:min="0"
|
||||||
|
:precision="2"></el-input-number>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="设备" prop="equipmentId">
|
||||||
|
<el-select
|
||||||
|
v-model="dataForm.equipmentId"
|
||||||
|
@change="setEquipment"
|
||||||
|
placeholder="请选择绞体">
|
||||||
|
<el-option
|
||||||
|
v-for="item in options1"
|
||||||
|
:key="item.id"
|
||||||
|
:label="item.equipmentName"
|
||||||
|
:value="item.id"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="应用套号" prop="suite">
|
||||||
|
<el-select v-model="dataForm.suite" placeholder="请选择应用套号">
|
||||||
|
<el-option
|
||||||
|
v-for="item in options2"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<span v-if="dataForm.suite == 2">
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="选择套号" prop="time">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="dataForm.time"
|
||||||
|
value-format="yyyy-MM-dd"
|
||||||
|
type="date"></el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="" prop="productionLine">
|
||||||
|
<el-select v-model="dataForm.productionLine">
|
||||||
|
<el-option
|
||||||
|
v-for="item in options3"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-form-item label="" prop="numb">
|
||||||
|
<el-select v-model="dataForm.numb">
|
||||||
|
<el-option
|
||||||
|
v-for="item in options4"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</span>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import basicAdd from '@/mixins/basic-add';
|
||||||
|
import { getAllProductPage } from '@/api/ssdl/product&recipe';
|
||||||
|
import {
|
||||||
|
QKLineEdgeLibrary,
|
||||||
|
getEquipmentPage,
|
||||||
|
} from '@/api/areavisual/lineEdgeLibrary';
|
||||||
|
import { parseTime } from '@/filter/code-filter';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
mixins: [basicAdd],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
urlOptions: {
|
||||||
|
createURL: QKLineEdgeLibrary,
|
||||||
|
},
|
||||||
|
dataForm: {
|
||||||
|
id: undefined,
|
||||||
|
materialId: undefined,
|
||||||
|
materialName: undefined,
|
||||||
|
materialCode: undefined,
|
||||||
|
material: undefined,
|
||||||
|
cableLength: undefined,
|
||||||
|
equipmentId: undefined,
|
||||||
|
equipmentName: undefined,
|
||||||
|
suite: undefined, //是否成套
|
||||||
|
suiteCode: undefined, //套号
|
||||||
|
time: this.parseTime(new Date(), '{y}-{m}-{d}'),
|
||||||
|
productionLine: undefined,
|
||||||
|
numb: undefined,
|
||||||
|
},
|
||||||
|
lineInfo: {},
|
||||||
|
productArr: [],
|
||||||
|
options1: [],
|
||||||
|
options2: [
|
||||||
|
{
|
||||||
|
value: 2,
|
||||||
|
label: '是',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 1,
|
||||||
|
label: '否',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
options3: [
|
||||||
|
{
|
||||||
|
value: '6#',
|
||||||
|
label: '6#',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '7#',
|
||||||
|
label: '7#',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '8#',
|
||||||
|
label: '8#',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
options4: [
|
||||||
|
{
|
||||||
|
value: 0,
|
||||||
|
label: '0',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 1,
|
||||||
|
label: '1',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 2,
|
||||||
|
label: '2',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 3,
|
||||||
|
label: '3',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 4,
|
||||||
|
label: '4',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 5,
|
||||||
|
label: '5',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 6,
|
||||||
|
label: '6',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
dataRule: {
|
||||||
|
materialId: [
|
||||||
|
{ required: true, message: '物料不能为空', trigger: 'change' },
|
||||||
|
],
|
||||||
|
time: [{ required: true, message: '不能为空', trigger: 'change' }],
|
||||||
|
productionLine: [
|
||||||
|
{ required: true, message: '不能为空', trigger: 'change' },
|
||||||
|
],
|
||||||
|
numb: [{ required: true, message: '不能为空', trigger: 'change' }],
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
showLine(val) {
|
||||||
|
getAllProductPage().then((res) => {
|
||||||
|
this.productArr = res.data;
|
||||||
|
});
|
||||||
|
getEquipmentPage({ pageNo: 1, pageSize: 100, equipmentType: 2 }).then(
|
||||||
|
(res) => {
|
||||||
|
this.options1 = res.data.list;
|
||||||
|
}
|
||||||
|
);
|
||||||
|
this.lineInfo = { ...val };
|
||||||
|
},
|
||||||
|
setMaterial() {
|
||||||
|
const data = this.productArr.find(
|
||||||
|
(i) => i.id === this.dataForm.materialId
|
||||||
|
);
|
||||||
|
this.dataForm.materialName = data.materialName;
|
||||||
|
this.dataForm.material = data.material;
|
||||||
|
this.dataForm.materialCode = data.materialCode;
|
||||||
|
},
|
||||||
|
setEquipment() {
|
||||||
|
const data = this.options1.find(
|
||||||
|
(i) => i.id === this.dataForm.equipmentId
|
||||||
|
);
|
||||||
|
this.dataForm.equipmentName = data.equipmentName;
|
||||||
|
},
|
||||||
|
// 表单提交
|
||||||
|
dataFormSubmit() {
|
||||||
|
this.$refs['dataForm'].validate((valid) => {
|
||||||
|
if (!valid) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
if (this.dataForm.suite == 2) {
|
||||||
|
this.dataForm.suiteCode =
|
||||||
|
this.dataForm.time +
|
||||||
|
'-' +
|
||||||
|
this.dataForm.productionLine +
|
||||||
|
'-' +
|
||||||
|
this.dataForm.numb;
|
||||||
|
}
|
||||||
|
QKLineEdgeLibrary({
|
||||||
|
...this.lineInfo,
|
||||||
|
...this.dataForm,
|
||||||
|
lineEdgeLibraryState: 1,
|
||||||
|
id: this.lineInfo.id,
|
||||||
|
}).then((response) => {
|
||||||
|
this.$modal.msgSuccess('操作成功');
|
||||||
|
this.visible = false;
|
||||||
|
this.$emit('refreshDataList');
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.stat-card {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 10px;
|
||||||
|
background: white;
|
||||||
|
border-radius: 12px;
|
||||||
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
border-left: 4px solid;
|
||||||
|
border-color: #1a56db;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* .stat-card:hover {
|
||||||
|
transform: translateY(-5px);
|
||||||
|
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
|
||||||
|
} */
|
||||||
|
.stat-title {
|
||||||
|
margin: 0 10px;
|
||||||
|
color: #0051ff;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
.stat-icon {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
border-radius: 12px;
|
||||||
|
margin-right: 15px;
|
||||||
|
background: linear-gradient(to right, #1a56db, #0d47a1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-value {
|
||||||
|
font-size: 28px;
|
||||||
|
font-weight: 700;
|
||||||
|
line-height: 1.2;
|
||||||
|
color: #1a56db;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-label {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #64748b;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -1,262 +1,665 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<el-row class="overview-container">
|
<el-row class="overview-container">
|
||||||
<el-col :span="4" class="overview-container-left">
|
<el-col :span="4" class="overview-container-left">
|
||||||
<el-row style="font-size: 18px; font-weight: bold; line-height: 36px">库区选择</el-row>
|
<el-row style="font-size: 18px; font-weight: bold; line-height: 36px">
|
||||||
<el-input
|
库区选择
|
||||||
v-model="areaSearchForm.regionName"
|
</el-row>
|
||||||
placeholder="库区名称"
|
<el-input
|
||||||
@blur="getArea"
|
v-model="areaSearchForm.regionName"
|
||||||
clearable
|
placeholder="库区名称"
|
||||||
/>
|
@blur="getArea"
|
||||||
<el-tree
|
clearable />
|
||||||
:data="areaList"
|
<el-tree
|
||||||
:node-key="'id'"
|
:data="areaList"
|
||||||
:props="{label: 'regionName'}"
|
:node-key="'id'"
|
||||||
@node-click="nodeClick"
|
:props="{ label: 'regionName' }"
|
||||||
/>
|
@node-click="nodeClick" />
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="16" v-if="changeType === 0" class="overview-container-main">
|
<el-col
|
||||||
<el-row>
|
:span="16"
|
||||||
<el-col :span="8" class="allarea-box" v-for="item in allAreaList" :key="item.id">
|
v-if="changeType === 0"
|
||||||
<div class="areainfo-box">
|
class="overview-container-main">
|
||||||
<div class="areainfo-box-header">
|
<el-row>
|
||||||
{{ item.regionName }}
|
<el-col
|
||||||
</div>
|
:span="8"
|
||||||
<div class="areainfo-box-line">
|
class="allarea-box"
|
||||||
<div class="areainfo-box-line-item" :style="{width: `${(item.occupiedQuantity / (item.totalInventory + item.transitQuantity) * 100).toFixed(2)}%`, backgroundColor: '#33B36B'}"></div>
|
v-for="item in allAreaList"
|
||||||
<div class="areainfo-box-line-item" :style="{width: `${(item.idleQuantity / (item.totalInventory + item.transitQuantity) * 100).toFixed(2)}%`, backgroundColor: '#3A8DFF'}"></div>
|
:key="item.id">
|
||||||
<div class="areainfo-box-line-item" :style="{width: `${(item.transitQuantity / (item.totalInventory + item.transitQuantity) * 100).toFixed(2)}%`, backgroundColor: '#F59A23'}"></div>
|
<div class="areainfo-box">
|
||||||
</div>
|
<div class="areainfo-box-header">
|
||||||
<el-row class="areainfo-box-info">
|
{{ item.regionName }}
|
||||||
<el-col class="areainfo-box-info-item" :span="6">
|
</div>
|
||||||
<p class="areainfo-box-info-item-count">{{item.totalInventory}}</p>
|
<div class="areainfo-box-line">
|
||||||
<p class="areainfo-box-info-item-title">库位总数</p>
|
<div
|
||||||
</el-col>
|
class="areainfo-box-line-item"
|
||||||
<el-col class="areainfo-box-info-item" :span="6">
|
:style="{
|
||||||
<p class="areainfo-box-info-item-count" style="color: #33B36B">{{item.occupiedQuantity}}</p>
|
width: `${(
|
||||||
<p class="areainfo-box-info-item-title">占</p>
|
(item.occupiedQuantity /
|
||||||
</el-col>
|
(item.totalInventory + item.transitQuantity)) *
|
||||||
<el-col class="areainfo-box-info-item" :span="6">
|
100
|
||||||
<p class="areainfo-box-info-item-count" style="color: #3A8DFF">{{item.idleQuantity}}</p>
|
).toFixed(2)}%`,
|
||||||
<p class="areainfo-box-info-item-title">空</p>
|
backgroundColor: '#33B36B',
|
||||||
</el-col>
|
}"></div>
|
||||||
<el-col class="areainfo-box-info-item" :span="6">
|
<div
|
||||||
<p class="areainfo-box-info-item-count" style="color: #F59A23">{{item.transitQuantity}}</p>
|
class="areainfo-box-line-item"
|
||||||
<p class="areainfo-box-info-item-title">在途</p>
|
:style="{
|
||||||
</el-col>
|
width: `${(
|
||||||
</el-row>
|
(item.idleQuantity /
|
||||||
</div>
|
(item.totalInventory + item.transitQuantity)) *
|
||||||
</el-col>
|
100
|
||||||
</el-row>
|
).toFixed(2)}%`,
|
||||||
</el-col>
|
backgroundColor: '#3A8DFF',
|
||||||
<el-col :span="4" v-if="changeType === 0" class="overview-container-right">
|
}"></div>
|
||||||
<el-tabs v-model="activeName" @tab-click="handleClickRight">
|
<div
|
||||||
<el-tab-pane label="概览" name="first">
|
class="areainfo-box-line-item"
|
||||||
<el-row class="overview-container-right-alloverview">
|
:style="{
|
||||||
<el-col class="overview-container-right-alloverview-item" :span="8">
|
width: `${(
|
||||||
<p class="overview-container-right-alloverview-item-count">{{allAreaInfo.totalInventory}}</p>
|
(item.transitQuantity /
|
||||||
<p class="overview-container-right-alloverview-item-title">库位总数</p>
|
(item.totalInventory + item.transitQuantity)) *
|
||||||
</el-col>
|
100
|
||||||
<el-col class="overview-container-right-alloverview-item" :span="8">
|
).toFixed(2)}%`,
|
||||||
<p class="overview-container-right-alloverview-item-count">{{allAreaInfo.occupiedQuantity}}</p>
|
backgroundColor: '#F59A23',
|
||||||
<p class="overview-container-right-alloverview-item-title">当前满位</p>
|
}"></div>
|
||||||
</el-col>
|
</div>
|
||||||
<el-col class="overview-container-right-alloverview-item" :span="8">
|
<el-row class="areainfo-box-info">
|
||||||
<p class="overview-container-right-alloverview-item-count">{{allAreaInfo.idleQuantity}}</p>
|
<el-col class="areainfo-box-info-item" :span="6">
|
||||||
<p class="overview-container-right-alloverview-item-title">当前空位</p>
|
<p class="areainfo-box-info-item-count">
|
||||||
</el-col>
|
{{ item.totalInventory }}
|
||||||
<el-col class="overview-container-right-alloverview-item" :span="8">
|
</p>
|
||||||
<p class="overview-container-right-alloverview-item-count">{{allAreaInfo.transitQuantity}}</p>
|
<p class="areainfo-box-info-item-title">库位总数</p>
|
||||||
<p class="overview-container-right-alloverview-item-title">在途</p>
|
</el-col>
|
||||||
</el-col>
|
<el-col class="areainfo-box-info-item" :span="6">
|
||||||
</el-row>
|
<p
|
||||||
<ringChart :ring-data="allAreaInfo" ref="ringChart" />
|
class="areainfo-box-info-item-count"
|
||||||
</el-tab-pane>
|
style="color: #33b36b">
|
||||||
<el-tab-pane label="在途任务" name="second">在途任务</el-tab-pane>
|
{{ item.occupiedQuantity }}
|
||||||
</el-tabs>
|
</p>
|
||||||
</el-col>
|
<p class="areainfo-box-info-item-title">占</p>
|
||||||
<el-col :span="20" v-if="changeType === 1" class="overview-container-main"></el-col>
|
</el-col>
|
||||||
</el-row>
|
<el-col class="areainfo-box-info-item" :span="6">
|
||||||
</div>
|
<p
|
||||||
</template>
|
class="areainfo-box-info-item-count"
|
||||||
|
style="color: #3a8dff">
|
||||||
<script>
|
{{ item.idleQuantity }}
|
||||||
// import basicPage from '@/mixins/basic-page';
|
</p>
|
||||||
import ringChart from './components/ringChart.vue';
|
<p class="areainfo-box-info-item-title">空</p>
|
||||||
import { getAreaList, postAllAreaInfo, postAllAreaOverview, postAreaInfo } from '@/api/areavisual/overview';
|
</el-col>
|
||||||
|
<el-col class="areainfo-box-info-item" :span="6">
|
||||||
export default {
|
<p
|
||||||
name: 'overview',
|
class="areainfo-box-info-item-count"
|
||||||
// mixins: [basicPage],
|
style="color: #f59a23">
|
||||||
data() {
|
{{ item.transitQuantity }}
|
||||||
return {
|
</p>
|
||||||
areaList: [
|
<p class="areainfo-box-info-item-title">在途</p>
|
||||||
{
|
</el-col>
|
||||||
id: 0,
|
</el-row>
|
||||||
regionName: "全部库区"
|
</div>
|
||||||
}
|
</el-col>
|
||||||
],
|
</el-row>
|
||||||
areaSearchForm: {
|
</el-col>
|
||||||
pageNo: 1,
|
<el-col
|
||||||
pageSize: 100,
|
:span="4"
|
||||||
regionName: ''
|
v-if="changeType === 0"
|
||||||
},
|
class="overview-container-right">
|
||||||
changeType: 0,
|
<el-tabs v-model="activeName" @tab-click="handleClickRight">
|
||||||
allAreaList: [],
|
<el-tab-pane label="概览" name="first">
|
||||||
allAreaInfo: {
|
<el-row class="overview-container-right-alloverview">
|
||||||
totalInventory: 0,
|
<el-col
|
||||||
occupiedQuantity: 0,
|
class="overview-container-right-alloverview-item"
|
||||||
idleQuantity: 0,
|
:span="8">
|
||||||
transitQuantity: 0
|
<p class="overview-container-right-alloverview-item-count">
|
||||||
},
|
{{ allAreaInfo.totalInventory }}
|
||||||
areaInfo: [],
|
</p>
|
||||||
activeName: 'first'
|
<p class="overview-container-right-alloverview-item-title">
|
||||||
};
|
库位总数
|
||||||
},
|
</p>
|
||||||
components: {
|
</el-col>
|
||||||
ringChart
|
<el-col
|
||||||
},
|
class="overview-container-right-alloverview-item"
|
||||||
async created() {
|
:span="8">
|
||||||
this.getArea()
|
<p class="overview-container-right-alloverview-item-count">
|
||||||
this.getAllAreaInfo()
|
{{ allAreaInfo.occupiedQuantity }}
|
||||||
this.getAllAreaOverview()
|
</p>
|
||||||
},
|
<p class="overview-container-right-alloverview-item-title">
|
||||||
watch: {
|
当前满位
|
||||||
activeName: (val) => {
|
</p>
|
||||||
if (val === 'first') {
|
</el-col>
|
||||||
this.getAllAreaOverview()
|
<el-col
|
||||||
} else if (val === 'second') {
|
class="overview-container-right-alloverview-item"
|
||||||
this.getNowTaskList()
|
:span="8">
|
||||||
}
|
<p class="overview-container-right-alloverview-item-count">
|
||||||
}
|
{{ allAreaInfo.idleQuantity }}
|
||||||
},
|
</p>
|
||||||
methods: {
|
<p class="overview-container-right-alloverview-item-title">
|
||||||
// 获取库区列表
|
当前空位
|
||||||
async getArea() {
|
</p>
|
||||||
const res = await getAreaList(this.areaSearchForm)
|
</el-col>
|
||||||
if (res.code === 0 && res.data) {
|
<el-col
|
||||||
this.areaList = [
|
class="overview-container-right-alloverview-item"
|
||||||
{
|
:span="8">
|
||||||
id: 0,
|
<p class="overview-container-right-alloverview-item-count">
|
||||||
regionName: "全部库区"
|
{{ allAreaInfo.transitQuantity }}
|
||||||
}
|
</p>
|
||||||
],
|
<p class="overview-container-right-alloverview-item-title">
|
||||||
this.areaList.push(...(res.data.list))
|
在途
|
||||||
}
|
</p>
|
||||||
},
|
</el-col>
|
||||||
// 库区选择
|
</el-row>
|
||||||
nodeClick(data, node, components) {
|
<ringChart :ring-data="allAreaInfo" ref="ringChart" />
|
||||||
if (data.id === 0) {
|
</el-tab-pane>
|
||||||
this.changeType = 0
|
<el-tab-pane label="在途任务" name="second">在途任务</el-tab-pane>
|
||||||
this.activeName = 'first'
|
</el-tabs>
|
||||||
this.getAllAreaInfo()
|
</el-col>
|
||||||
} else {
|
<el-col
|
||||||
this.changeType = 1
|
:span="20"
|
||||||
this.getAreaInfo(data.id)
|
v-if="changeType === 1"
|
||||||
}
|
class="overview-container-main">
|
||||||
},
|
<div class="stat-card">
|
||||||
// 获取全部库区概览信息
|
<div class="stat-icon">
|
||||||
async getAllAreaInfo() {
|
<i class="el-icon-s-grid" style="color: #fff"></i>
|
||||||
const res = await postAllAreaInfo([])
|
</div>
|
||||||
console.log(res)
|
<div class="stat-title">库区信息</div>
|
||||||
if (res.code === 0 && res.data) {
|
<div class="stat-content">
|
||||||
this.allAreaList = res.data
|
<div class="stat-value">{{ getAreaInfoInfo.regionName }}</div>
|
||||||
}
|
<div class="stat-label">{{ getAreaInfoInfo.regionCode }}</div>
|
||||||
},
|
</div>
|
||||||
// 获取库区概览
|
</div>
|
||||||
async getAllAreaOverview() {
|
<div class="area-body">
|
||||||
const res = await postAllAreaOverview([])
|
<div v-for="item in Object.keys(areaInfo)" :key="item">
|
||||||
console.log(res)
|
<div class="potTitle">{{ item }}</div>
|
||||||
if (res.code === 0 && res.data) {
|
<div class="potList">
|
||||||
this.allAreaInfo = res.data
|
<div v-for="sitem in areaInfo[item]" :key="sitem.id">
|
||||||
this.$refs.ringChart.initChart();
|
<div v-if="sitem.empty" class="area-div-empty" />
|
||||||
}
|
<div v-else class="area-div" :title="sitem.lineEdgeLibraryName">
|
||||||
},
|
<el-popover
|
||||||
// 获取在途任务
|
placement="top-start"
|
||||||
async getNowTaskList() {},
|
:title="sitem.lineEdgeLibraryCode"
|
||||||
// 获取单库区信息
|
width="200"
|
||||||
async getAreaInfo (id) {
|
trigger="hover">
|
||||||
const res = await postAreaInfo({id})
|
<div class="point" />
|
||||||
console.log(res)
|
<span style="font-weight: 600">名称:</span>
|
||||||
if (res.code === 0 && res.data) {
|
{{ sitem.lineEdgeLibraryName }}
|
||||||
this.areaInfo = res.data
|
<br />
|
||||||
}
|
<div class="point" />
|
||||||
},
|
<span style="font-weight: 600">状态:</span>
|
||||||
// 全部库区右侧分页点击
|
{{
|
||||||
handleClickRight (tab, event) {
|
sitem.usableState == 3
|
||||||
console.log(tab, event)
|
? '锁定'
|
||||||
}
|
: sitem.usableState == 2
|
||||||
},
|
? '不可用'
|
||||||
};
|
: sitem.lineEdgeLibraryState == 1
|
||||||
</script>
|
? '满位'
|
||||||
|
: '空闲'
|
||||||
<style lang="scss" scoped>
|
}}
|
||||||
.overview-container {
|
<br />
|
||||||
max-height: calc(100vh - 120px - 8px);
|
<span
|
||||||
overflow: scroll;
|
v-if="
|
||||||
.overview-container-left {
|
sitem.usableState == 1 &&
|
||||||
padding-right: 12px;
|
sitem.lineEdgeLibraryState == 1
|
||||||
}
|
">
|
||||||
.overview-container-main {
|
<span style="font-weight: 600">物料:</span>
|
||||||
.allarea-box {
|
{{ sitem.materialCode || '' }}
|
||||||
padding: 10px;
|
<br />
|
||||||
.areainfo-box {
|
<span style="font-weight: 600">设备:</span>
|
||||||
border: 1px solid #bbb;
|
{{ sitem.equipmentName || '' }}
|
||||||
border-radius: 5px;
|
<br />
|
||||||
padding: 10px;
|
<span style="font-weight: 600">套号:</span>
|
||||||
.areainfo-box-header {
|
{{ sitem.suiteCode || '' }}
|
||||||
font-size: 16px;
|
<br />
|
||||||
font-weight: bold;
|
</span>
|
||||||
white-space: nowrap; /* 禁止换行 */
|
<el-button type="text" @click="clearLine(sitem)">
|
||||||
overflow: hidden; /* 隐藏溢出内容 */
|
清空
|
||||||
text-overflow: ellipsis; /* 溢出部分显示省略号 */
|
</el-button>
|
||||||
}
|
<el-button type="text" @click="addLine(sitem)">
|
||||||
.areainfo-box-line {
|
添加
|
||||||
width: 100%;
|
</el-button>
|
||||||
.areainfo-box-line-item {
|
<div
|
||||||
height: 5px;
|
class="area-icon"
|
||||||
display: inline-block;
|
:style="{
|
||||||
}
|
backgroundColor:
|
||||||
}
|
sitem.usableState == 3
|
||||||
.areainfo-box-info {
|
? '#E6A23C'
|
||||||
.areainfo-box-info-item {
|
: sitem.usableState == 2
|
||||||
text-align: center;
|
? 'gray'
|
||||||
font-size: 12px;
|
: sitem.lineEdgeLibraryState == 1
|
||||||
.areainfo-box-info-item-count {
|
? '#67C23A'
|
||||||
font-weight: bold;
|
: '',
|
||||||
font-size: 14px;
|
}"
|
||||||
}
|
slot="reference">
|
||||||
}
|
<i
|
||||||
}
|
:class="
|
||||||
}
|
sitem.usableState == 3
|
||||||
}
|
? 'el-icon-lock'
|
||||||
}
|
: 'el-icon-s-grid'
|
||||||
.overview-container-right {
|
"
|
||||||
.overview-container-right-alloverview {
|
style="color: #fff"></i>
|
||||||
.overview-container-right-alloverview-item {
|
</div>
|
||||||
text-align: center;
|
</el-popover>
|
||||||
.overview-container-right-alloverview-item-count {
|
</div>
|
||||||
font-size: 14px;
|
</div>
|
||||||
font-weight: bold;
|
</div>
|
||||||
}
|
</div>
|
||||||
}
|
</div>
|
||||||
}
|
</el-col>
|
||||||
}
|
</el-row>
|
||||||
}
|
<base-dialog
|
||||||
</style>
|
:dialogTitle="addOrEditTitle"
|
||||||
|
:dialogVisible="addOrUpdateVisible"
|
||||||
<style lang="scss">
|
@cancel="handleCancel"
|
||||||
.el-tree-node__content {
|
@confirm="handleConfirm"
|
||||||
height: 40px;
|
:before-close="handleCancel"
|
||||||
line-height: 40px;
|
destroy-on-close
|
||||||
}
|
width="50%">
|
||||||
.el-tree-node__label {
|
<add-or-update
|
||||||
display: block;
|
ref="addOrUpdate"
|
||||||
width: calc(100% - 24px);
|
@refreshDataList="successSubmit"></add-or-update>
|
||||||
text-align: center;
|
</base-dialog>
|
||||||
white-space: nowrap; /* 禁止换行 */
|
</div>
|
||||||
overflow: hidden; /* 隐藏溢出内容 */
|
</template>
|
||||||
text-overflow: ellipsis; /* 溢出部分显示省略号 */
|
|
||||||
}
|
<script>
|
||||||
</style>
|
// import basicPage from '@/mixins/basic-page';
|
||||||
|
import ringChart from './components/ringChart.vue';
|
||||||
|
import AddOrUpdate from './components/add-or-updata';
|
||||||
|
import basicPage from '@/mixins/basic-page';
|
||||||
|
import {
|
||||||
|
getAreaList,
|
||||||
|
postAllAreaInfo,
|
||||||
|
postAllAreaOverview,
|
||||||
|
postAreaInfo,
|
||||||
|
} from '@/api/areavisual/overview';
|
||||||
|
import { QKLineEdgeLibrary } from '@/api/areavisual/lineEdgeLibrary';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'overview',
|
||||||
|
mixins: [basicPage],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
areaList: [
|
||||||
|
{
|
||||||
|
id: 0,
|
||||||
|
regionName: '全部库区',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
areaSearchForm: {
|
||||||
|
pageNo: 1,
|
||||||
|
pageSize: 100,
|
||||||
|
regionName: '',
|
||||||
|
},
|
||||||
|
changeType: 0,
|
||||||
|
allAreaList: [],
|
||||||
|
allAreaInfo: {
|
||||||
|
totalInventory: 0,
|
||||||
|
occupiedQuantity: 0,
|
||||||
|
idleQuantity: 0,
|
||||||
|
transitQuantity: 0,
|
||||||
|
},
|
||||||
|
areaInfo: {},
|
||||||
|
activeName: 'first',
|
||||||
|
getAreaInfoInfo: {},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
ringChart,
|
||||||
|
AddOrUpdate,
|
||||||
|
},
|
||||||
|
async created() {
|
||||||
|
this.getArea();
|
||||||
|
this.getAllAreaInfo();
|
||||||
|
this.getAllAreaOverview();
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
activeName: (val) => {
|
||||||
|
if (val === 'first') {
|
||||||
|
this.getAllAreaOverview();
|
||||||
|
} else if (val === 'second') {
|
||||||
|
this.getNowTaskList();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 获取库区列表
|
||||||
|
async getArea() {
|
||||||
|
const res = await getAreaList(this.areaSearchForm);
|
||||||
|
if (res.code === 0 && res.data) {
|
||||||
|
(this.areaList = [
|
||||||
|
{
|
||||||
|
id: 0,
|
||||||
|
regionName: '全部库区',
|
||||||
|
},
|
||||||
|
]),
|
||||||
|
this.areaList.push(...res.data.list);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 库区选择
|
||||||
|
nodeClick(data, node, components) {
|
||||||
|
if (data.id === 0) {
|
||||||
|
this.changeType = 0;
|
||||||
|
this.activeName = 'first';
|
||||||
|
this.getAllAreaInfo();
|
||||||
|
} else {
|
||||||
|
this.getAreaInfoInfo = data; //把库区存下，方便刷新
|
||||||
|
this.changeType = 1;
|
||||||
|
this.getAreaInfo(data.id);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 获取全部库区概览信息
|
||||||
|
async getAllAreaInfo() {
|
||||||
|
const res = await postAllAreaInfo([]);
|
||||||
|
console.log(res);
|
||||||
|
if (res.code === 0 && res.data) {
|
||||||
|
this.allAreaList = res.data;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 获取库区概览
|
||||||
|
async getAllAreaOverview() {
|
||||||
|
const res = await postAllAreaOverview([]);
|
||||||
|
console.log(res);
|
||||||
|
if (res.code === 0 && res.data) {
|
||||||
|
this.allAreaInfo = res.data;
|
||||||
|
this.$refs.ringChart.initChart();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 获取在途任务
|
||||||
|
async getNowTaskList() {},
|
||||||
|
// 获取单库区信息
|
||||||
|
async getAreaInfo(id) {
|
||||||
|
const res = await postAreaInfo({ id });
|
||||||
|
if (res.code === 0 && res.data) {
|
||||||
|
// 按巷道号分组
|
||||||
|
this.areaInfo = res.data.reduce((result, item) => {
|
||||||
|
// 提取巷道号
|
||||||
|
const laneNumber = item.lineEdgeLibraryCode.substring(3, 5) + ' 巷道';
|
||||||
|
|
||||||
|
// 如果该巷道还没有分组，创建一个空数组
|
||||||
|
if (!result[laneNumber]) {
|
||||||
|
result[laneNumber] = [];
|
||||||
|
}
|
||||||
|
|
||||||
|
// 将当前项添加到对应巷道的数组中
|
||||||
|
result[laneNumber].push(item);
|
||||||
|
|
||||||
|
return result;
|
||||||
|
}, {});
|
||||||
|
Object.keys(this.areaInfo).forEach((key) => {
|
||||||
|
const arr = this.areaInfo[key];
|
||||||
|
let emptyNum = 0;
|
||||||
|
let insetEmpty = [];
|
||||||
|
arr.forEach((item, index) => {
|
||||||
|
if (
|
||||||
|
!item.empty &&
|
||||||
|
item.lineEdgeLibraryCode.substring(5, 7) !=
|
||||||
|
Math.floor(index / 2) + 1 + emptyNum &&
|
||||||
|
item.lineEdgeLibraryCode[item.lineEdgeLibraryCode.length - 1] ==
|
||||||
|
'L'
|
||||||
|
) {
|
||||||
|
let num =
|
||||||
|
Number(item.lineEdgeLibraryCode.substring(5, 7)) -
|
||||||
|
(Math.floor(index / 2) + 1 + emptyNum);
|
||||||
|
insetEmpty.push({
|
||||||
|
index,
|
||||||
|
num,
|
||||||
|
});
|
||||||
|
emptyNum += num;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
insetEmpty.forEach((item) => {
|
||||||
|
const arrEmpty = Array.from({ length: item.num * 2 }, () => ({
|
||||||
|
empty: true,
|
||||||
|
}));
|
||||||
|
arr.splice(item.index, 0, ...arrEmpty);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
getDataList() {},
|
||||||
|
// 全部库区右侧分页点击
|
||||||
|
handleClickRight(tab, event) {
|
||||||
|
console.log(tab, event);
|
||||||
|
},
|
||||||
|
clearLine(val) {
|
||||||
|
if (val.usableState == 3) {
|
||||||
|
this.$confirm(
|
||||||
|
`当前库位为锁定状态，代表该库位有未完成的任务关联，是否确认清空${
|
||||||
|
'线边库名称为 ' + val.lineEdgeLibraryName + ' '
|
||||||
|
}的数据项?`,
|
||||||
|
'锁定库位清空提示',
|
||||||
|
{
|
||||||
|
confirmButtonText: '确定',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning',
|
||||||
|
}
|
||||||
|
)
|
||||||
|
.then(() => {
|
||||||
|
QKLineEdgeLibrary({
|
||||||
|
...val,
|
||||||
|
lineEdgeLibraryState: 0,
|
||||||
|
usableState: 1,
|
||||||
|
}).then(({ data }) => {
|
||||||
|
this.$message({
|
||||||
|
message: data,
|
||||||
|
type: 'success',
|
||||||
|
duration: 1500,
|
||||||
|
onClose: () => {
|
||||||
|
this.getAreaInfo(this.getAreaInfoInfo.id);
|
||||||
|
},
|
||||||
|
});
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(() => {});
|
||||||
|
} else {
|
||||||
|
QKLineEdgeLibrary({
|
||||||
|
...val,
|
||||||
|
lineEdgeLibraryState: 0,
|
||||||
|
usableState: 1,
|
||||||
|
}).then(({ data }) => {
|
||||||
|
this.$message({
|
||||||
|
message: data,
|
||||||
|
type: 'success',
|
||||||
|
duration: 1500,
|
||||||
|
onClose: () => {
|
||||||
|
this.getAreaInfo(this.getAreaInfoInfo.id);
|
||||||
|
},
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
addLine(val) {
|
||||||
|
this.addOrEditTitle = '添加货物';
|
||||||
|
this.addOrUpdateVisible = true;
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.$refs.addOrUpdate.init();
|
||||||
|
this.$refs.addOrUpdate.showLine(val);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// dialog的父组件方法this.$emit("refreshDataList");
|
||||||
|
successSubmit() {
|
||||||
|
this.handleCancel();
|
||||||
|
this.getAreaInfo(this.getAreaInfoInfo.id);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.overview-container {
|
||||||
|
max-height: calc(100vh - 120px - 8px);
|
||||||
|
overflow: scroll;
|
||||||
|
.overview-container-left {
|
||||||
|
padding-right: 12px;
|
||||||
|
}
|
||||||
|
.overview-container-main {
|
||||||
|
.allarea-box {
|
||||||
|
padding: 10px;
|
||||||
|
.areainfo-box {
|
||||||
|
border: 1px solid #bbb;
|
||||||
|
border-radius: 5px;
|
||||||
|
padding: 10px;
|
||||||
|
.areainfo-box-header {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: bold;
|
||||||
|
white-space: nowrap; /* 禁止换行 */
|
||||||
|
overflow: hidden; /* 隐藏溢出内容 */
|
||||||
|
text-overflow: ellipsis; /* 溢出部分显示省略号 */
|
||||||
|
}
|
||||||
|
.areainfo-box-line {
|
||||||
|
width: 100%;
|
||||||
|
.areainfo-box-line-item {
|
||||||
|
height: 5px;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.areainfo-box-info {
|
||||||
|
.areainfo-box-info-item {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 12px;
|
||||||
|
.areainfo-box-info-item-count {
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.overview-container-right {
|
||||||
|
.overview-container-right-alloverview {
|
||||||
|
.overview-container-right-alloverview-item {
|
||||||
|
text-align: center;
|
||||||
|
.overview-container-right-alloverview-item-count {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.el-tree-node__content {
|
||||||
|
height: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
}
|
||||||
|
.el-tree-node__label {
|
||||||
|
display: block;
|
||||||
|
width: calc(100% - 24px);
|
||||||
|
text-align: center;
|
||||||
|
white-space: nowrap; /* 禁止换行 */
|
||||||
|
overflow: hidden; /* 隐藏溢出内容 */
|
||||||
|
text-overflow: ellipsis; /* 溢出部分显示省略号 */
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.area-body {
|
||||||
|
margin-top: 10px;
|
||||||
|
margin-left: 10px;
|
||||||
|
overflow-x: auto;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.potTitle {
|
||||||
|
width: 190px;
|
||||||
|
background-color: rgb(169, 235, 249);
|
||||||
|
border-radius: 3px;
|
||||||
|
margin-right: 5px;
|
||||||
|
text-align: center;
|
||||||
|
color: #000000;
|
||||||
|
letter-spacing: 1px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.potList {
|
||||||
|
width: 190px;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 90px 90px;
|
||||||
|
gap: 8px;
|
||||||
|
}
|
||||||
|
.area-div {
|
||||||
|
padding: 10px;
|
||||||
|
background: white;
|
||||||
|
border-radius: 12px;
|
||||||
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
border: 4px solid #1a56db;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
}
|
||||||
|
.area-div-empty {
|
||||||
|
background: white;
|
||||||
|
width: 90px;
|
||||||
|
height: 88px;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
}
|
||||||
|
.point {
|
||||||
|
width: 5px;
|
||||||
|
height: 5px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: #409eff;
|
||||||
|
float: left;
|
||||||
|
margin-top: 7px;
|
||||||
|
margin-right: 5px;
|
||||||
|
}
|
||||||
|
.area-icon {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin: auto;
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
border-radius: 12px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.stat-card {
|
||||||
|
margin-top: 10px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 10px;
|
||||||
|
background: white;
|
||||||
|
border-radius: 12px;
|
||||||
|
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
border-left: 4px solid;
|
||||||
|
border-color: #1a56db;
|
||||||
|
margin-bottom: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* .stat-card:hover {
|
||||||
|
transform: translateY(-5px);
|
||||||
|
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
|
||||||
|
} */
|
||||||
|
.stat-title {
|
||||||
|
margin: 0 10px;
|
||||||
|
color: #0051ff;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
.stat-icon {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
|
border-radius: 12px;
|
||||||
|
margin-right: 15px;
|
||||||
|
background: linear-gradient(to right, #1a56db, #0d47a1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-value {
|
||||||
|
font-size: 28px;
|
||||||
|
font-weight: 700;
|
||||||
|
line-height: 1.2;
|
||||||
|
color: #1a56db;
|
||||||
|
}
|
||||||
|
|
||||||
|
.stat-label {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #64748b;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
81
src/views/areavisual/region/add-or-updata.vue
Normal file
81
src/views/areavisual/region/add-or-updata.vue
Normal file
@@ -0,0 +1,81 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: zwq
|
||||||
|
* @Date: 2021-11-18 14:16:25
|
||||||
|
* @LastEditors: zwq
|
||||||
|
* @LastEditTime: 2025-11-28 14:38:31
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<el-form
|
||||||
|
:model="dataForm"
|
||||||
|
:rules="dataRule"
|
||||||
|
ref="dataForm"
|
||||||
|
@keyup.enter.native="dataFormSubmit()"
|
||||||
|
label-width="80px">
|
||||||
|
<el-row :gutter="20">
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="物料编码" prop="materialCode">
|
||||||
|
<el-input
|
||||||
|
v-model="dataForm.materialCode"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入物料编码" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="物料型号" prop="materialName">
|
||||||
|
<el-input
|
||||||
|
v-model="dataForm.materialName"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入物料型号" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row :gutter="20">
|
||||||
|
<el-col :span="12">
|
||||||
|
<el-form-item label="物料规格" prop="material">
|
||||||
|
<el-input
|
||||||
|
v-model="dataForm.material"
|
||||||
|
clearable
|
||||||
|
placeholder="请输入物料规格" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import basicAdd from '@/mixins/basic-add';
|
||||||
|
import { createProduct, updateProduct,getProduct } from '@/api/ssdl/product&recipe';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
mixins: [basicAdd],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
urlOptions: {
|
||||||
|
createURL: createProduct,
|
||||||
|
updateURL: updateProduct,
|
||||||
|
infoURL: getProduct,
|
||||||
|
},
|
||||||
|
dataForm: {
|
||||||
|
id: undefined,
|
||||||
|
material: undefined,
|
||||||
|
materialName: undefined,
|
||||||
|
materialCode: undefined,
|
||||||
|
},
|
||||||
|
typeArr: [],
|
||||||
|
dataRule: {
|
||||||
|
materialCode: [
|
||||||
|
{ required: true, message: '物料编码不能为空', trigger: 'blur' },
|
||||||
|
],
|
||||||
|
materialName: [
|
||||||
|
{ required: true, message: '物料型号不能为空', trigger: 'blur' },
|
||||||
|
],
|
||||||
|
material: [
|
||||||
|
{ required: true, message: '规格不能为空', trigger: 'blur' },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
62
src/views/areavisual/region/changeStatus.vue
Normal file
62
src/views/areavisual/region/changeStatus.vue
Normal file
@@ -0,0 +1,62 @@
|
|||||||
|
<!--
|
||||||
|
* @Author: zwq
|
||||||
|
* @Date: 2025-10-11 14:41:12
|
||||||
|
* @LastEditors: zwq
|
||||||
|
* @LastEditTime: 2026-01-14 14:13:14
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<el-switch
|
||||||
|
@change="changeStatus"
|
||||||
|
size="small"
|
||||||
|
v-model="injectData.regionState"
|
||||||
|
:active-value="1"
|
||||||
|
:inactive-value="2"></el-switch>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { updateRegion } from '@/api/areavisual/region';
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
injectData: {
|
||||||
|
type: Object,
|
||||||
|
default: () => ({}),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
changeStatus(val) {
|
||||||
|
const pdata = { ...this.injectData, regionState: val };
|
||||||
|
this.$confirm(
|
||||||
|
`是否确认修改${'区域 [ ' + this.injectData.regionName + ' ] '}的状态?`,
|
||||||
|
'更新状态',
|
||||||
|
{
|
||||||
|
confirmButtonText: '确认修改',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning',
|
||||||
|
}
|
||||||
|
)
|
||||||
|
.then(() => {
|
||||||
|
updateRegion(pdata).then((res) => {
|
||||||
|
if (res.code === 0 || res.code === 200) {
|
||||||
|
this.$modal.msgSuccess('修改成功');
|
||||||
|
this.$emit('emitData');
|
||||||
|
} else {
|
||||||
|
this.$modal.msg(res.msg);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch((res) => {
|
||||||
|
this.$emit('emitData');
|
||||||
|
this.$message({
|
||||||
|
type: 'info',
|
||||||
|
message: '已取消',
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
221
src/views/areavisual/region/index.vue
Normal file
221
src/views/areavisual/region/index.vue
Normal file
@@ -0,0 +1,221 @@
|
|||||||
|
<template>
|
||||||
|
<div class="app-container">
|
||||||
|
<search-bar
|
||||||
|
:formConfigs="formConfig"
|
||||||
|
ref="searchBarForm"
|
||||||
|
@headBtnClick="buttonClick" />
|
||||||
|
<base-table
|
||||||
|
v-loading="dataListLoading"
|
||||||
|
:table-props="tableProps"
|
||||||
|
:page="listQuery.pageNo"
|
||||||
|
:limit="listQuery.pageSize"
|
||||||
|
:table-data="tableData"
|
||||||
|
@emitFun="getDataList">
|
||||||
|
</base-table>
|
||||||
|
<pagination
|
||||||
|
:limit.sync="listQuery.pageSize"
|
||||||
|
:page.sync="listQuery.pageNo"
|
||||||
|
:total="listQuery.total"
|
||||||
|
@pagination="getDataList" />
|
||||||
|
<base-dialog
|
||||||
|
:dialogTitle="addOrEditTitle"
|
||||||
|
:dialogVisible="addOrUpdateVisible"
|
||||||
|
@cancel="handleCancel"
|
||||||
|
@confirm="handleConfirm"
|
||||||
|
:before-close="handleCancel"
|
||||||
|
width="50%">
|
||||||
|
<add-or-update
|
||||||
|
ref="addOrUpdate"
|
||||||
|
@refreshDataList="successSubmit"></add-or-update>
|
||||||
|
</base-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import AddOrUpdate from './add-or-updata';
|
||||||
|
import basicPage from '@/mixins/basic-page';
|
||||||
|
import { parseTime } from '@/filter/code-filter';
|
||||||
|
import { deleteRegion, getRegionPage } from '@/api/areavisual/region';
|
||||||
|
import changeStatus from './changeStatus.vue';
|
||||||
|
|
||||||
|
const region = [
|
||||||
|
{
|
||||||
|
id: '1',
|
||||||
|
name: 'A区域',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '2',
|
||||||
|
name: 'B区域',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '3',
|
||||||
|
name: 'C区域',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '4',
|
||||||
|
name: 'D区域',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '5',
|
||||||
|
name: 'E区域',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '6',
|
||||||
|
name: 'F区域',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '7',
|
||||||
|
name: 'G区域',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '8',
|
||||||
|
name: 'H区域',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
const regionType = [
|
||||||
|
{
|
||||||
|
id: '1',
|
||||||
|
name: '拉丝缓存区',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '2',
|
||||||
|
name: '满盘存储区',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '3',
|
||||||
|
name: '空盘存储区',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: '4',
|
||||||
|
name: '复绕区',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
const tableProps = [
|
||||||
|
{
|
||||||
|
prop: 'regionCode',
|
||||||
|
label: '区域编码',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'regionName',
|
||||||
|
label: '区域名称',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'region',
|
||||||
|
label: '区域',
|
||||||
|
filter: (val) => {
|
||||||
|
return region.find((i) => i.id == val)
|
||||||
|
? region.find((i) => i.id == val).name
|
||||||
|
: '-';
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'regionType',
|
||||||
|
label: '区域类型',
|
||||||
|
filter: (val) => {
|
||||||
|
return regionType.find((i) => i.id == val)
|
||||||
|
? regionType.find((i) => i.id == val).name
|
||||||
|
: '-';
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'rowNum',
|
||||||
|
label: '行数',
|
||||||
|
width:90,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'columnNum',
|
||||||
|
label: '列数',
|
||||||
|
width:90,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'regionState',
|
||||||
|
label: '区域状态',
|
||||||
|
width:90,
|
||||||
|
subcomponent: changeStatus,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
prop: 'createTime',
|
||||||
|
label: '创建时间',
|
||||||
|
filter: parseTime,
|
||||||
|
width: 150,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export default {
|
||||||
|
mixins: [basicPage],
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
urlOptions: {
|
||||||
|
getDataListURL: getRegionPage,
|
||||||
|
deleteURL: deleteRegion,
|
||||||
|
},
|
||||||
|
tableProps,
|
||||||
|
tableData: [],
|
||||||
|
formConfig: [
|
||||||
|
{
|
||||||
|
type: 'input',
|
||||||
|
label: '名称',
|
||||||
|
placeholder: '名称',
|
||||||
|
param: 'name',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'input',
|
||||||
|
label: '编码',
|
||||||
|
placeholder: '编码',
|
||||||
|
param: 'code',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'select',
|
||||||
|
label: '区域',
|
||||||
|
selectOptions: region,
|
||||||
|
placeholder: '请选择区域',
|
||||||
|
param: 'region',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'button',
|
||||||
|
btnName: '搜索',
|
||||||
|
name: 'search',
|
||||||
|
color: 'primary',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
AddOrUpdate,
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
buttonClick(val) {
|
||||||
|
switch (val.btnName) {
|
||||||
|
case 'search':
|
||||||
|
this.listQuery.pageNo = 1;
|
||||||
|
this.listQuery.pageSize = 20;
|
||||||
|
this.listQuery.regionName = val.name;
|
||||||
|
this.listQuery.regionCode = val.code;
|
||||||
|
this.listQuery.region = val.region;
|
||||||
|
this.getDataList();
|
||||||
|
break;
|
||||||
|
case 'reset':
|
||||||
|
this.$refs.searchBarForm.resetForm();
|
||||||
|
this.listQuery = {
|
||||||
|
pageSize: 20,
|
||||||
|
pageNo: 1,
|
||||||
|
total: 1,
|
||||||
|
};
|
||||||
|
this.getDataList();
|
||||||
|
break;
|
||||||
|
case 'add':
|
||||||
|
this.addOrEditTitle = '新增';
|
||||||
|
this.addOrUpdateVisible = true;
|
||||||
|
this.addOrUpdateHandle();
|
||||||
|
break;
|
||||||
|
case 'export':
|
||||||
|
this.handleExport();
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
console.log(val);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
@@ -1,88 +1,93 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="errPage-container">
|
<div class="errPage-container">
|
||||||
<el-button icon="arrow-left" class="pan-back-btn" @click="back">
|
<el-button icon="arrow-left" class="pan-back-btn" @click="back">
|
||||||
返回
|
返回
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-row>
|
<el-row>
|
||||||
<el-col :span="12">
|
<el-col :span="12">
|
||||||
<h1 class="text-jumbo text-ginormous">
|
<h1 class="text-jumbo text-ginormous">401错误!</h1>
|
||||||
401错误!
|
<h2>您没有访问权限！</h2>
|
||||||
</h1>
|
<h6>对不起，您没有访问权限，请不要进行非法操作！您可以返回主页面</h6>
|
||||||
<h2>您没有访问权限！</h2>
|
<ul class="list-unstyled">
|
||||||
<h6>对不起，您没有访问权限，请不要进行非法操作！您可以返回主页面</h6>
|
<li class="link-type">
|
||||||
<ul class="list-unstyled">
|
<router-link to="/">回首页</router-link>
|
||||||
<li class="link-type">
|
</li>
|
||||||
<router-link to="/">
|
</ul>
|
||||||
回首页
|
</el-col>
|
||||||
</router-link>
|
<el-col :span="12">
|
||||||
</li>
|
<img
|
||||||
</ul>
|
:src="errGif"
|
||||||
</el-col>
|
width="313"
|
||||||
<el-col :span="12">
|
height="428"
|
||||||
<img :src="errGif" width="313" height="428" alt="Girl has dropped her ice cream.">
|
alt="Girl has dropped her ice cream." />
|
||||||
</el-col>
|
</el-col>
|
||||||
</el-row>
|
</el-row>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import errGif from '@/assets/401_images/401.gif'
|
import errGif from '@/assets/401_images/401.gif';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Page401',
|
name: 'Page401',
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
errGif: errGif + '?' + +new Date()
|
errGif: errGif + '?' + +new Date(),
|
||||||
}
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
back() {
|
back() {
|
||||||
if (this.$route.query.noGoBack) {
|
if (this.$route.query.noGoBack) {
|
||||||
this.$router.push({ path: '/' })
|
this.$router.push({
|
||||||
} else {
|
path: '/',
|
||||||
this.$router.go(-1)
|
query: {
|
||||||
}
|
keyword: 'home',
|
||||||
}
|
},
|
||||||
}
|
});
|
||||||
}
|
} else {
|
||||||
|
this.$router.go(-1);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.errPage-container {
|
.errPage-container {
|
||||||
width: 800px;
|
width: 800px;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
margin: 100px auto;
|
margin: 100px auto;
|
||||||
.pan-back-btn {
|
.pan-back-btn {
|
||||||
background: #008489;
|
background: #008489;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
border: none!important;
|
border: none !important;
|
||||||
}
|
}
|
||||||
.pan-gif {
|
.pan-gif {
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
.pan-img {
|
.pan-img {
|
||||||
display: block;
|
display: block;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
.text-jumbo {
|
.text-jumbo {
|
||||||
font-size: 60px;
|
font-size: 60px;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
color: #484848;
|
color: #484848;
|
||||||
}
|
}
|
||||||
.list-unstyled {
|
.list-unstyled {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
li {
|
li {
|
||||||
padding-bottom: 5px;
|
padding-bottom: 5px;
|
||||||
}
|
}
|
||||||
a {
|
a {
|
||||||
color: #008489;
|
color: #008489;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
&:hover {
|
&:hover {
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -108,7 +108,7 @@
|
|||||||
</h2>
|
</h2>
|
||||||
|
|
||||||
<!-- 表单 -->
|
<!-- 表单 -->
|
||||||
<div class="form-cont" style="margin-top: 60px;">
|
<div class="form-cont" style="margin-top: 60px">
|
||||||
<div style="">
|
<div style="">
|
||||||
<el-form
|
<el-form
|
||||||
ref="loginForm"
|
ref="loginForm"
|
||||||
@@ -200,12 +200,14 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 下方的登录按钮 -->
|
<!-- 下方的登录按钮 -->
|
||||||
<el-form-item id="button-form-item" style="width: 100%; margin-top: 32px">
|
<el-form-item
|
||||||
|
id="button-form-item"
|
||||||
|
style="width: 100%; margin-top: 32px">
|
||||||
<el-button
|
<el-button
|
||||||
:loading="loading"
|
:loading="loading"
|
||||||
size="medium"
|
size="medium"
|
||||||
type="primary"
|
type="primary"
|
||||||
style="width: 100%; height: 66px; font-size: 18px;"
|
style="width: 100%; height: 66px; font-size: 18px"
|
||||||
@click.native.prevent="getCode">
|
@click.native.prevent="getCode">
|
||||||
<span v-if="!loading">登 录</span>
|
<span v-if="!loading">登 录</span>
|
||||||
<span v-else>登 录 中...</span>
|
<span v-else>登 录 中...</span>
|
||||||
@@ -409,7 +411,14 @@ export default {
|
|||||||
this.loginForm
|
this.loginForm
|
||||||
)
|
)
|
||||||
.then(() => {
|
.then(() => {
|
||||||
this.$router.push({ path: this.redirect || '/' }).catch(() => {});
|
this.$router
|
||||||
|
.push({
|
||||||
|
path: this.redirect || '/',
|
||||||
|
query: {
|
||||||
|
keyword: 'home',
|
||||||
|
},
|
||||||
|
})
|
||||||
|
.catch(() => {});
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch(() => {
|
||||||
this.loading = false;
|
this.loading = false;
|
||||||
|
|||||||
@@ -66,7 +66,7 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
import {
|
import {
|
||||||
getProductPage,
|
getAllProductPage,
|
||||||
createProcess,
|
createProcess,
|
||||||
getProcess,
|
getProcess,
|
||||||
updateProcess,
|
updateProcess,
|
||||||
@@ -107,8 +107,8 @@ export default {
|
|||||||
this.dataForm.processSize = data.processSize || '';
|
this.dataForm.processSize = data.processSize || '';
|
||||||
this.dataForm.processDesc = data.processDesc || '';
|
this.dataForm.processDesc = data.processDesc || '';
|
||||||
this.visible = true;
|
this.visible = true;
|
||||||
getProductPage({ pageNo: 1, pageSize: 100 }).then((res) => {
|
getAllProductPage().then((res) => {
|
||||||
this.productArr = res.data.list;
|
this.productArr = res.data;
|
||||||
});
|
});
|
||||||
// getEquipmentPage({ pageNo: 1, pageSize: 100 }).then((res) => {
|
// getEquipmentPage({ pageNo: 1, pageSize: 100 }).then((res) => {
|
||||||
// this.equipmentArr = res.data.list;
|
// this.equipmentArr = res.data.list;
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
* @Author: zwq
|
* @Author: zwq
|
||||||
* @Date: 2023-08-24 14:47:58
|
* @Date: 2023-08-24 14:47:58
|
||||||
* @LastEditors: zwq
|
* @LastEditors: zwq
|
||||||
* @LastEditTime: 2025-11-28 10:06:06
|
* @LastEditTime: 2026-01-13 15:56:45
|
||||||
* @Description:
|
* @Description:
|
||||||
-->
|
-->
|
||||||
<template>
|
<template>
|
||||||
@@ -24,6 +24,10 @@ import { parseTime } from '@/filter/code-filter';
|
|||||||
import { getProcessDetailPage } from '@/api/ssdl/product&recipe';
|
import { getProcessDetailPage } from '@/api/ssdl/product&recipe';
|
||||||
|
|
||||||
const tableProps = [
|
const tableProps = [
|
||||||
|
{
|
||||||
|
prop: 'materialCode',
|
||||||
|
label: '物料编号',
|
||||||
|
},
|
||||||
{
|
{
|
||||||
prop: 'materialName',
|
prop: 'materialName',
|
||||||
label: '物料型号',
|
label: '物料型号',
|
||||||
|
|||||||
@@ -4,7 +4,7 @@
|
|||||||
<div class="title">异常原因Top5</div>
|
<div class="title">异常原因Top5</div>
|
||||||
<div class="alarm-item" style="margin-top: 14px;">
|
<div class="alarm-item" style="margin-top: 14px;">
|
||||||
<div class="item top1">
|
<div class="item top1">
|
||||||
<dov class="item-data">
|
<div class="item-data">
|
||||||
<div class="data-unit">
|
<div class="data-unit">
|
||||||
单位/次
|
单位/次
|
||||||
</div>
|
</div>
|
||||||
@@ -16,10 +16,10 @@
|
|||||||
261,938,984
|
261,938,984
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</dov>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="item top2">
|
<div class="item top2">
|
||||||
<dov class="item-data">
|
<div class="item-data">
|
||||||
<div class="data-unit">
|
<div class="data-unit">
|
||||||
单位/次
|
单位/次
|
||||||
</div>
|
</div>
|
||||||
@@ -31,10 +31,10 @@
|
|||||||
261,938,984
|
261,938,984
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</dov>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="item top3">
|
<div class="item top3">
|
||||||
<dov class="item-data">
|
<div class="item-data">
|
||||||
<div class="data-unit">
|
<div class="data-unit">
|
||||||
单位/次
|
单位/次
|
||||||
</div>
|
</div>
|
||||||
@@ -46,10 +46,10 @@
|
|||||||
261,938,984
|
261,938,984
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</dov>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="item top4">
|
<div class="item top4">
|
||||||
<dov class="item-data">
|
<div class="item-data">
|
||||||
<div class="data-unit">
|
<div class="data-unit">
|
||||||
单位/次
|
单位/次
|
||||||
</div>
|
</div>
|
||||||
@@ -61,10 +61,10 @@
|
|||||||
261,938,984
|
261,938,984
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</dov>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="item top5">
|
<div class="item top5">
|
||||||
<dov class="item-data">
|
<div class="item-data">
|
||||||
<div class="data-unit">
|
<div class="data-unit">
|
||||||
单位/次
|
单位/次
|
||||||
</div>
|
</div>
|
||||||
@@ -76,7 +76,7 @@
|
|||||||
261,938,984
|
261,938,984
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</dov>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1999,7 +1999,7 @@ export default {
|
|||||||
|
|
||||||
// 根据位置编码（如FK10101L）获取单个位置的状态类名
|
// 根据位置编码（如FK10101L）获取单个位置的状态类名
|
||||||
getPositionClass(positionCode) {
|
getPositionClass(positionCode) {
|
||||||
console.log('positionCode'.positionCode);
|
// console.log('positionCode'.positionCode);
|
||||||
|
|
||||||
// 查找完全匹配的lineEdgeLibraryCode
|
// 查找完全匹配的lineEdgeLibraryCode
|
||||||
const targetData = this.dataList.find(item =>
|
const targetData = this.dataList.find(item =>
|
||||||
|
|||||||
@@ -1,61 +1,63 @@
|
|||||||
<template>
|
<template>
|
||||||
<div id="dayReport" class="dayReport" :style="styles">
|
<div id="dayReport" class="dayReport" :style="styles">
|
||||||
<ReportHeader top-title="车间生产看板" />
|
<ReportHeader top-title="车间生产看板" />
|
||||||
<div class="main-body" style=" flex: 1; display: flex;padding: 16px 20px 22px 24px;flex-direction: column;">
|
<div
|
||||||
<div class="top" style="display: flex;gap: 16px;">
|
class="main-body"
|
||||||
<div class="top-three" style="
|
style="
|
||||||
display: grid;
|
flex: 1;
|
||||||
gap: 12px;
|
display: flex;
|
||||||
grid-template-columns: 367px 1493px;
|
padding: 16px 20px 22px 24px;
|
||||||
">
|
flex-direction: column;
|
||||||
<agvStatus />
|
">
|
||||||
<threeDimensionalChart :dataList="dataList" />
|
<div class="top" style="display: flex; gap: 16px">
|
||||||
</div>
|
<div
|
||||||
</div>
|
class="top-three"
|
||||||
<div class="top" style="display: flex;gap: 16px;margin-top: 6px;">
|
style="display: grid; gap: 12px; grid-template-columns: 367px 1493px">
|
||||||
<div class="bottom-three" style="
|
<agvStatus />
|
||||||
display: grid;
|
<threeDimensionalChart :dataList="dataList" />
|
||||||
gap: 12px;
|
</div>
|
||||||
grid-template-columns: 512px 930px 402px;
|
</div>
|
||||||
">
|
<div class="top" style="display: flex; gap: 16px; margin-top: 6px">
|
||||||
<div class="left-three" style="
|
<div
|
||||||
display: grid;
|
class="bottom-three"
|
||||||
gap: 16px;
|
style="
|
||||||
grid-template-rows: 213px 213px;
|
display: grid;
|
||||||
">
|
gap: 12px;
|
||||||
<taskType />
|
grid-template-columns: 512px 930px 402px;
|
||||||
<taskStatus />
|
">
|
||||||
</div>
|
<div
|
||||||
<div class="center-three" style="
|
class="left-three"
|
||||||
display: grid;
|
style="display: grid; gap: 16px; grid-template-rows: 213px 213px">
|
||||||
gap: 16px;
|
<taskType />
|
||||||
grid-template-rows: 330px 92px;
|
<taskStatus />
|
||||||
">
|
</div>
|
||||||
<realTask />
|
<div
|
||||||
<alarm />
|
class="center-three"
|
||||||
|
style="display: grid; gap: 16px; grid-template-rows: 330px 92px">
|
||||||
|
<realTask />
|
||||||
|
<alarm />
|
||||||
|
|
||||||
<!-- <taskStatus /> -->
|
<!-- <taskStatus /> -->
|
||||||
</div>
|
</div>
|
||||||
<alarmTop />
|
<alarmTop />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import ReportHeader from './components/Header.vue'
|
import ReportHeader from './components/Header.vue';
|
||||||
// import screenfull from 'screenfull'
|
// import screenfull from 'screenfull'
|
||||||
import agvStatus from './components/agvStatus.vue'
|
import agvStatus from './components/agvStatus.vue';
|
||||||
import taskType from './components/taskType.vue'
|
import taskType from './components/taskType.vue';
|
||||||
import realTask from './components/realTask.vue'
|
import realTask from './components/realTask.vue';
|
||||||
import alarm from './components/alarm.vue'
|
import alarm from './components/alarm.vue';
|
||||||
import alarmTop from './components/alarmTop.vue'
|
import alarmTop from './components/alarmTop.vue';
|
||||||
|
|
||||||
import taskStatus from './components/taskStatus.vue'
|
import taskStatus from './components/taskStatus.vue';
|
||||||
|
|
||||||
import threeDimensionalChart from './components/threeDimensionalChart.vue'
|
|
||||||
import { getLineEdgeLibraryList } from '../../../api/visualization/visualization'
|
|
||||||
|
|
||||||
|
import threeDimensionalChart from './components/threeDimensionalChart.vue';
|
||||||
|
import { getLineEdgeLibraryList } from '../../../api/visualization/visualization';
|
||||||
|
|
||||||
// import financeCosts from './components/financeCosts.vue'
|
// import financeCosts from './components/financeCosts.vue'
|
||||||
// import keyProductionIndicators from './components/keyProductionIndicators.vue'
|
// import keyProductionIndicators from './components/keyProductionIndicators.vue'
|
||||||
@@ -64,151 +66,164 @@ import { getLineEdgeLibraryList } from '../../../api/visualization/visualization
|
|||||||
// import keyWork from './components/keyWork.vue'
|
// import keyWork from './components/keyWork.vue'
|
||||||
// import moment from 'moment'
|
// import moment from 'moment'
|
||||||
export default {
|
export default {
|
||||||
name: 'DayReport',
|
name: 'DayReport',
|
||||||
components: { ReportHeader, agvStatus, threeDimensionalChart, taskType, taskStatus, realTask, alarm, alarmTop },
|
components: {
|
||||||
data() {
|
ReportHeader,
|
||||||
return {
|
agvStatus,
|
||||||
// isFullScreen: false,
|
threeDimensionalChart,
|
||||||
timer: null,
|
taskType,
|
||||||
beilv: 1,
|
taskStatus,
|
||||||
value: 100,
|
realTask,
|
||||||
dataList:[]
|
alarm,
|
||||||
}
|
alarmTop,
|
||||||
},
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
// isFullScreen: false,
|
||||||
|
timer: null,
|
||||||
|
beilv: 1,
|
||||||
|
value: 100,
|
||||||
|
dataList: [],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
|
||||||
created() {
|
created() {
|
||||||
// this.init()
|
// this.init()
|
||||||
this.windowWidth(document.documentElement.clientWidth)
|
this.windowWidth(document.documentElement.clientWidth);
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
// ...mapGetters(['sidebar']),
|
// ...mapGetters(['sidebar']),
|
||||||
styles() {
|
styles() {
|
||||||
const v = Math.floor(this.value * this.beilv * 100) / 10000
|
const v = Math.floor(this.value * this.beilv * 100) / 10000;
|
||||||
return {
|
return {
|
||||||
transform: `scale(${v})`,
|
transform: `scale(${v})`,
|
||||||
transformOrigin: 'left top'
|
transformOrigin: 'left top',
|
||||||
// overflow: hidden;
|
// overflow: hidden;
|
||||||
}
|
};
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
clientWidth(val) {
|
clientWidth(val) {
|
||||||
if (!this.timer) {
|
if (!this.timer) {
|
||||||
this.clientWidth = val
|
this.clientWidth = val;
|
||||||
this.beilv2 = this.clientWidth / 1920
|
this.beilv2 = this.clientWidth / 1920;
|
||||||
this.timer = true
|
this.timer = true;
|
||||||
let _this = this
|
let _this = this;
|
||||||
setTimeout(function () {
|
setTimeout(function () {
|
||||||
_this.timer = false
|
_this.timer = false;
|
||||||
}, 500)
|
}, 500);
|
||||||
}
|
}
|
||||||
// 这里可以添加修改时的方法
|
// 这里可以添加修改时的方法
|
||||||
this.windowWidth(val);
|
this.windowWidth(val);
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
// beforeDestroy() {
|
// beforeDestroy() {
|
||||||
// clearInterval(this.timer)
|
// clearInterval(this.timer)
|
||||||
// this.destroy()
|
// this.destroy()
|
||||||
// },
|
// },
|
||||||
mounted() {
|
mounted() {
|
||||||
const _this = this;
|
const _this = this;
|
||||||
_this.beilv = document.documentElement.clientWidth / 1920
|
let baseWidth = 1920;
|
||||||
window.onresize = () => {
|
if (this.$route.query.keyword == 'home') {
|
||||||
return (() => {
|
baseWidth = 2180;
|
||||||
_this.clientWidth = `${document.documentElement.clientWidth}`
|
}
|
||||||
this.beilv = _this.clientWidth / 1920
|
_this.beilv = document.documentElement.clientWidth / baseWidth;
|
||||||
})()
|
window.onresize = () => {
|
||||||
}
|
return (() => {
|
||||||
this.getData()
|
_this.clientWidth = `${document.documentElement.clientWidth}`;
|
||||||
},
|
this.beilv = _this.clientWidth / baseWidth;
|
||||||
methods: {
|
})();
|
||||||
getData(data) {
|
};
|
||||||
console.log(data);
|
this.getData();
|
||||||
getLineEdgeLibraryList().then((res) => {
|
},
|
||||||
console.log('res', res);
|
methods: {
|
||||||
|
getData(data) {
|
||||||
|
console.log(data);
|
||||||
|
getLineEdgeLibraryList().then((res) => {
|
||||||
|
console.log('res', res);
|
||||||
|
|
||||||
this.dataList =res.data
|
this.dataList = res.data;
|
||||||
})
|
});
|
||||||
},
|
},
|
||||||
windowWidth(value) {
|
windowWidth(value) {
|
||||||
this.clientWidth = value
|
this.clientWidth = value;
|
||||||
this.beilv2 = this.clientWidth / 1920
|
this.beilv2 = this.clientWidth / 1920;
|
||||||
},
|
},
|
||||||
// change() {
|
// change() {
|
||||||
// this.isFullScreen = screenfull.isFullscreen
|
// this.isFullScreen = screenfull.isFullscreen
|
||||||
// },
|
// },
|
||||||
// init() {
|
// init() {
|
||||||
// if (!screenfull.isEnabled) {
|
// if (!screenfull.isEnabled) {
|
||||||
// this.$message({
|
// this.$message({
|
||||||
// message: 'you browser can not work',
|
// message: 'you browser can not work',
|
||||||
// type: 'warning'
|
// type: 'warning'
|
||||||
// })
|
// })
|
||||||
// return false
|
// return false
|
||||||
// }
|
// }
|
||||||
// screenfull.on('change', this.change)
|
// screenfull.on('change', this.change)
|
||||||
// },
|
// },
|
||||||
// destroy() {
|
// destroy() {
|
||||||
// if (!screenfull.isEnabled) {
|
// if (!screenfull.isEnabled) {
|
||||||
// this.$message({
|
// this.$message({
|
||||||
// message: 'you browser can not work',
|
// message: 'you browser can not work',
|
||||||
// type: 'warning'
|
// type: 'warning'
|
||||||
// })
|
// })
|
||||||
// return false
|
// return false
|
||||||
// }
|
// }
|
||||||
// screenfull.off('change', this.change)
|
// screenfull.off('change', this.change)
|
||||||
// },
|
// },
|
||||||
// // 全屏
|
// // 全屏
|
||||||
// screenfullChange() {
|
// screenfullChange() {
|
||||||
// console.log('screenfull.enabled', screenfull.isEnabled);
|
// console.log('screenfull.enabled', screenfull.isEnabled);
|
||||||
|
|
||||||
// if (!screenfull.isEnabled) {
|
// if (!screenfull.isEnabled) {
|
||||||
// this.$message({
|
// this.$message({
|
||||||
// message: 'you browser can not work',
|
// message: 'you browser can not work',
|
||||||
// type: 'warning'
|
// type: 'warning'
|
||||||
// })
|
// })
|
||||||
// return false
|
// return false
|
||||||
// }
|
// }
|
||||||
// screenfull.toggle(this.$refs.dayReportB)
|
// screenfull.toggle(this.$refs.dayReportB)
|
||||||
// },
|
// },
|
||||||
// changeDate(val) {
|
// changeDate(val) {
|
||||||
// this.date = val
|
// this.date = val
|
||||||
// // this.weekDay = this.weekArr[moment(this.date).format('e')]
|
// // this.weekDay = this.weekArr[moment(this.date).format('e')]
|
||||||
// // this.getData()
|
// // this.getData()
|
||||||
// if (this.date === moment().format('yyyy-MM-DD')) {
|
// if (this.date === moment().format('yyyy-MM-DD')) {
|
||||||
// this.loopTime()
|
// this.loopTime()
|
||||||
// } else {
|
// } else {
|
||||||
// clearInterval(this.timer)
|
// clearInterval(this.timer)
|
||||||
// }
|
// }
|
||||||
// },
|
// },
|
||||||
// 导出
|
// 导出
|
||||||
// exportPDF() {
|
// exportPDF() {
|
||||||
// this.$message.success('正在导出，请稍等！')
|
// this.$message.success('正在导出，请稍等！')
|
||||||
// const element = document.getElementById('dayRepDom')
|
// const element = document.getElementById('dayRepDom')
|
||||||
// element.style.display = 'block'
|
// element.style.display = 'block'
|
||||||
// const fileName = '株洲碲化镉生产日报' + moment().format('yyMMDD') + '.pdf'
|
// const fileName = '株洲碲化镉生产日报' + moment().format('yyMMDD') + '.pdf'
|
||||||
// html2canvas(element, {
|
// html2canvas(element, {
|
||||||
// dpi: 300, // Set to 300 DPI
|
// dpi: 300, // Set to 300 DPI
|
||||||
// scale: 3 // Adjusts your resolution
|
// scale: 3 // Adjusts your resolution
|
||||||
// }).then(function(canvas) {
|
// }).then(function(canvas) {
|
||||||
// const imgWidth = 595.28
|
// const imgWidth = 595.28
|
||||||
// const imgHeight = 841.89
|
// const imgHeight = 841.89
|
||||||
// const pageData = canvas.toDataURL('image/jpeg', 1.0)
|
// const pageData = canvas.toDataURL('image/jpeg', 1.0)
|
||||||
// const PDF = new JsPDF('', 'pt', [imgWidth, imgHeight])
|
// const PDF = new JsPDF('', 'pt', [imgWidth, imgHeight])
|
||||||
// PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
|
// PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
|
||||||
// setTimeout(() => {
|
// setTimeout(() => {
|
||||||
// PDF.save(fileName) // 导出文件名
|
// PDF.save(fileName) // 导出文件名
|
||||||
// }, 1000)
|
// }, 1000)
|
||||||
// })
|
// })
|
||||||
// element.style.display = 'none'
|
// element.style.display = 'none'
|
||||||
// }
|
// }
|
||||||
}
|
},
|
||||||
}
|
};
|
||||||
</script>
|
</script>
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.dayReport {
|
.dayReport {
|
||||||
width: 1920px;
|
width: 1920px;
|
||||||
height: 1080px;
|
height: 1080px;
|
||||||
background: #F2F4F9;
|
background: #f2f4f9;
|
||||||
// background-size: cover;
|
// background-size: cover;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user