merge test
This commit is contained in:
		@@ -3,7 +3,7 @@ import request from '@/utils/request'
 | 
			
		||||
// 创建设备
 | 
			
		||||
export function createEquipment(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/equipment/create',
 | 
			
		||||
    url: '/base/core-equipment/create',
 | 
			
		||||
    method: 'post',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
@@ -12,7 +12,7 @@ export function createEquipment(data) {
 | 
			
		||||
// 更新设备
 | 
			
		||||
export function updateEquipment(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/equipment/update',
 | 
			
		||||
    url: '/base/core-equipment/update',
 | 
			
		||||
    method: 'put',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
@@ -21,7 +21,7 @@ export function updateEquipment(data) {
 | 
			
		||||
// 删除设备
 | 
			
		||||
export function deleteEquipment(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/equipment/delete?id=' + id,
 | 
			
		||||
    url: '/base/core-equipment/delete?id=' + id,
 | 
			
		||||
    method: 'delete'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
@@ -29,7 +29,7 @@ export function deleteEquipment(id) {
 | 
			
		||||
// 获得设备
 | 
			
		||||
export function getEquipment(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/equipment/get?id=' + id,
 | 
			
		||||
    url: '/base/core-equipment/get?id=' + id,
 | 
			
		||||
    method: 'get'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
@@ -37,7 +37,7 @@ export function getEquipment(id) {
 | 
			
		||||
// 获得设备分页
 | 
			
		||||
export function getEquipmentPage(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/equipment/page',
 | 
			
		||||
    url: '/base/core-equipment/page',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
@@ -46,7 +46,7 @@ export function getEquipmentPage(query) {
 | 
			
		||||
// 导出设备 Excel
 | 
			
		||||
export function exportEquipmentExcel(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/equipment/export-excel',
 | 
			
		||||
    url: '/base/core-equipment/export-excel',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query,
 | 
			
		||||
    responseType: 'blob'
 | 
			
		||||
 
 | 
			
		||||
@@ -3,7 +3,7 @@ import request from '@/utils/request'
 | 
			
		||||
// 创建设备类型
 | 
			
		||||
export function createEquipmentType(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/equipment-type/create',
 | 
			
		||||
    url: '/base/core-equipment-type/create',
 | 
			
		||||
    method: 'post',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
@@ -12,7 +12,7 @@ export function createEquipmentType(data) {
 | 
			
		||||
// 更新设备类型
 | 
			
		||||
export function updateEquipmentType(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/equipment-type/update',
 | 
			
		||||
    url: '/base/core-equipment-type/update',
 | 
			
		||||
    method: 'put',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
@@ -21,7 +21,7 @@ export function updateEquipmentType(data) {
 | 
			
		||||
// 删除设备类型
 | 
			
		||||
export function deleteEquipmentType(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/equipment-type/delete?id=' + id,
 | 
			
		||||
    url: '/base/core-equipment-type/delete?id=' + id,
 | 
			
		||||
    method: 'delete'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
@@ -29,7 +29,7 @@ export function deleteEquipmentType(id) {
 | 
			
		||||
// 获得设备类型
 | 
			
		||||
export function getEquipmentType(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/equipment-type/get?id=' + id,
 | 
			
		||||
    url: '/base/core-equipment-type/get?id=' + id,
 | 
			
		||||
    method: 'get'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
@@ -37,7 +37,7 @@ export function getEquipmentType(id) {
 | 
			
		||||
// 获得设备类型分页
 | 
			
		||||
export function getEquipmentTypePage(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/equipment-type/page',
 | 
			
		||||
    url: '/base/core-equipment-type/page',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
@@ -46,7 +46,7 @@ export function getEquipmentTypePage(query) {
 | 
			
		||||
// 导出设备类型 Excel
 | 
			
		||||
export function exportEquipmentTypeExcel(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/equipment-type/export-excel',
 | 
			
		||||
    url: '/base/core-equipment-type/export-excel',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query,
 | 
			
		||||
    responseType: 'blob'
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										121
									
								
								src/api/base/material.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										121
									
								
								src/api/base/material.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,121 @@
 | 
			
		||||
/*
 | 
			
		||||
 * @Author: Do not edit
 | 
			
		||||
 * @Date: 2023-10-21 11:50:46
 | 
			
		||||
 * @LastEditTime: 2023-10-24 11:22:28
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @Description: 
 | 
			
		||||
 */
 | 
			
		||||
import request from '@/utils/request'
 | 
			
		||||
 | 
			
		||||
// 创建物料
 | 
			
		||||
export function createMaterial(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material/create',
 | 
			
		||||
    method: 'post',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 更新物料
 | 
			
		||||
export function updateMaterial(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material/update',
 | 
			
		||||
    method: 'put',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 删除物料
 | 
			
		||||
export function deleteMaterial(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material/delete?id=' + id,
 | 
			
		||||
    method: 'delete'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得物料
 | 
			
		||||
export function getMaterial(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material/get?id=' + id,
 | 
			
		||||
    method: 'get'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得物料code
 | 
			
		||||
export function getCode() {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material/getMaterialCode',
 | 
			
		||||
    method: 'get'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得物料分页
 | 
			
		||||
export function getMaterialPage(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material/page',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得物料列表
 | 
			
		||||
export function getMaterialList(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material/listbyfilter',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得供应商所有列表
 | 
			
		||||
export function getSupplierList(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/core-supplier/listAll',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得物料属性列表
 | 
			
		||||
export function getMaterialAttrList(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-attr/page',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 创建物料属性
 | 
			
		||||
export function createMaterialAttr(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-attr/create',
 | 
			
		||||
    method: 'post',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 更新物料属性
 | 
			
		||||
export function updateMaterialAttr(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-attr/update',
 | 
			
		||||
    method: 'put',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 删除物料属性
 | 
			
		||||
export function deleteMaterialAttr(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-attr/delete?id=' + id,
 | 
			
		||||
    method: 'delete'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得物料属性
 | 
			
		||||
export function getMaterialAttr(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-attr/get',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										68
									
								
								src/api/base/materialDate.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										68
									
								
								src/api/base/materialDate.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,68 @@
 | 
			
		||||
/*
 | 
			
		||||
 * @Author: Do not edit
 | 
			
		||||
 * @Date: 2023-10-21 11:50:46
 | 
			
		||||
 * @LastEditTime: 2023-10-24 17:09:59
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @Description: 
 | 
			
		||||
 */
 | 
			
		||||
import request from '@/utils/request'
 | 
			
		||||
 | 
			
		||||
// 创建物料批次
 | 
			
		||||
export function createMaterialDate(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-date/create',
 | 
			
		||||
    method: 'post',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 更新物料批次
 | 
			
		||||
export function updateMaterialDate(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-date/update',
 | 
			
		||||
    method: 'put',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 删除物料批次
 | 
			
		||||
export function deleteMaterialDate(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-date/delete?id=' + id,
 | 
			
		||||
    method: 'delete'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得物料批次
 | 
			
		||||
export function getMaterialDate(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-date/getDetail?id=' + id,
 | 
			
		||||
    method: 'get'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得物料批次code
 | 
			
		||||
export function getCode() {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-date/getMaterialDateCode',
 | 
			
		||||
    method: 'get'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得物料批次分页
 | 
			
		||||
export function getMaterDatePage(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-date/page',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得物料批次列表
 | 
			
		||||
export function getMaterDateList(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-date/listbyfilter',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										112
									
								
								src/api/base/materialProductBom.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										112
									
								
								src/api/base/materialProductBom.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,112 @@
 | 
			
		||||
/*
 | 
			
		||||
 * @Author: Do not edit
 | 
			
		||||
 * @Date: 2023-10-21 11:50:46
 | 
			
		||||
 * @LastEditTime: 2023-10-26 20:06:29
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @Description: 
 | 
			
		||||
 */
 | 
			
		||||
import request from '@/utils/request'
 | 
			
		||||
 | 
			
		||||
// 创建产品Bom
 | 
			
		||||
export function createMaterialPB(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-product-bom/create',
 | 
			
		||||
    method: 'post',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 更新产品Bom
 | 
			
		||||
export function updateMaterialPB(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-product-bom/update',
 | 
			
		||||
    method: 'put',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 删除产品Bom
 | 
			
		||||
export function deleteMaterialPB(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-product-bom/delete?id=' + id,
 | 
			
		||||
    method: 'delete'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得产品Bom
 | 
			
		||||
export function getMaterialPB(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-product-bom/get?id=' + id,
 | 
			
		||||
    method: 'get'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得产品Bomcode
 | 
			
		||||
export function getCode() {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-product-bom/getMaterialProductBomCode',
 | 
			
		||||
    method: 'get'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得产品Bom分页
 | 
			
		||||
export function getMaterialPBPage(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-product-bom/page',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得产品Bom列表
 | 
			
		||||
export function getMaterialPBList(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-product-bom/listbyfilter',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得产品列表
 | 
			
		||||
export function getProList(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/core-product/listAll',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得产品Bom详细分页
 | 
			
		||||
export function getProBomList(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-product-bom-det/page',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 创建产品Bom详细
 | 
			
		||||
export function createMaterialPBDet(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-product-bom-det/create',
 | 
			
		||||
    method: 'post',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 更新产品Bom详细
 | 
			
		||||
export function updateMaterialPBDet(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-product-bom-det/update',
 | 
			
		||||
    method: 'put',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 删除产品Bom详细
 | 
			
		||||
export function deleteMaterialPBDet(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-product-bom-det/delete?id=' + id,
 | 
			
		||||
    method: 'delete'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										69
									
								
								src/api/base/materialUseLog.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										69
									
								
								src/api/base/materialUseLog.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,69 @@
 | 
			
		||||
/*
 | 
			
		||||
 * @Author: Do not edit
 | 
			
		||||
 * @Date: 2023-10-21 11:50:46
 | 
			
		||||
 * @LastEditTime: 2023-10-26 09:32:21
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @Description: 
 | 
			
		||||
 */
 | 
			
		||||
import request from '@/utils/request'
 | 
			
		||||
 | 
			
		||||
// 创建物料使用记录
 | 
			
		||||
export function createMaterialLog(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-use-log/create',
 | 
			
		||||
    method: 'post',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 更新物料使用记录
 | 
			
		||||
export function updateMaterialLog(data) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-use-log/update',
 | 
			
		||||
    method: 'put',
 | 
			
		||||
    data: data
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得物料使用记录
 | 
			
		||||
export function getMaterialLog(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-use-log/getDetail?id=' + id,
 | 
			
		||||
    method: 'get'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得物料使用记录分页
 | 
			
		||||
export function getMaterialLogPage(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-use-log/page',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得所有设备列表
 | 
			
		||||
export function getEqListAll(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/core-equipment/listAll',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 获得所有员工列表
 | 
			
		||||
export function getworkerAll(query) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/core-worker/listAll',
 | 
			
		||||
    method: 'get',
 | 
			
		||||
    params: query
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 删除物料使用记录
 | 
			
		||||
export function deleteMaterialLog(id) {
 | 
			
		||||
  return request({
 | 
			
		||||
    url: '/base/material-use-log/delete?id=' + id,
 | 
			
		||||
    method: 'delete'
 | 
			
		||||
  })
 | 
			
		||||
}
 | 
			
		||||
							
								
								
									
										14
									
								
								src/assets/icons/svg/icon-upload.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										14
									
								
								src/assets/icons/svg/icon-upload.svg
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,14 @@
 | 
			
		||||
<?xml version="1.0" encoding="UTF-8"?>
 | 
			
		||||
<svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
 | 
			
		||||
    <title>上传</title>
 | 
			
		||||
    <g id="组件" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.65">
 | 
			
		||||
        <g id="上传_Resources/Button" transform="translate(-12.000000, -9.000000)">
 | 
			
		||||
            <g id="上传" transform="translate(12.000000, 9.000000)">
 | 
			
		||||
                <g id="upload" transform="translate(0.875000, 0.875000)" fill="currentColor" fill-rule="nonzero">
 | 
			
		||||
                    <path d="M5.80371094,0.138085937 C5.8953125,0.046484375 6.01699219,0 6.13867188,0 C6.26035156,0 6.38066406,0.046484375 6.47363281,0.138085937 L8.60371094,2.26953125 C8.78828125,2.45410156 8.78828125,2.75351562 8.60371094,2.93808594 C8.51484375,3.02695312 8.39589844,3.07617188 8.27011719,3.07617188 C8.14433594,3.07617188 8.02539062,3.02695312 7.93652344,2.93808594 L6.61171875,1.61328125 L6.61171875,9.51289062 C6.61171875,9.77402344 6.39980469,9.9859375 6.13867188,9.9859375 C5.87753906,9.9859375 5.665625,9.77402344 5.665625,9.51289062 L5.665625,1.61328125 L4.34082031,2.93808594 C4.15625,3.12265625 3.85683594,3.12265625 3.67363281,2.93808594 C3.4890625,2.75351562 3.4890625,2.45410156 3.67226563,2.26953125 L5.80371094,0.138085937 Z M11.7769531,7.88046875 C11.5158203,7.88046875 11.3039063,8.09238281 11.3039063,8.35351563 L11.3039063,11.025 C11.3039063,11.1794922 11.178125,11.3066406 11.0222656,11.3066406 L1.22636719,11.3066406 C1.071875,11.3066406 0.944726562,11.1808594 0.944726562,11.025 L0.944726562,8.35214844 C0.944726562,8.09101563 0.7328125,7.87910156 0.471679688,7.87910156 C0.210546875,7.87910156 0,8.09238281 0,8.35214844 L0,11.3996094 C0,11.8685547 0.381445313,12.2486328 0.849023437,12.2486328 L11.4009766,12.2486328 C11.8699219,12.2486328 12.25,11.8671875 12.25,11.3996094 L12.25,8.35214844 C12.25,8.09238281 12.0380859,7.88046875 11.7769531,7.88046875 Z" id="Shape"></path>
 | 
			
		||||
                </g>
 | 
			
		||||
                <rect id="Rectangle-49" x="0" y="0" width="14" height="14"></rect>
 | 
			
		||||
            </g>
 | 
			
		||||
        </g>
 | 
			
		||||
    </g>
 | 
			
		||||
</svg>
 | 
			
		||||
| 
		 After Width: | Height: | Size: 2.1 KiB  | 
							
								
								
									
										15
									
								
								src/assets/icons/svg/table_delete.svg
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										15
									
								
								src/assets/icons/svg/table_delete.svg
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,15 @@
 | 
			
		||||
<?xml version="1.0" encoding="UTF-8"?>
 | 
			
		||||
<svg width="14px" height="14px" viewBox="0 0 14 14" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
 | 
			
		||||
    <!-- Generator: Sketch 60 (88103) - https://sketch.com -->
 | 
			
		||||
    <desc>Created with Sketch.</desc>
 | 
			
		||||
    <g id="11_系统管理" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
 | 
			
		||||
        <g id="11-1用户管理" transform="translate(-1822.000000, -159.000000)" fill="#FF5454" fill-rule="nonzero">
 | 
			
		||||
            <g id="编组-10" transform="translate(1821.000000, 158.000000)">
 | 
			
		||||
                <g id="删除">
 | 
			
		||||
                    <rect id="矩形" opacity="0" x="0" y="0" width="16" height="16"></rect>
 | 
			
		||||
                    <path d="M9.39137788,11.7149165 C9.13431614,11.7149165 8.92716929,11.5077697 8.92716929,11.2507079 L8.92716929,6.14191781 C8.92716929,5.88485607 9.13431613,5.67770922 9.39137788,5.67770922 C9.64843963,5.67770922 9.85558647,5.88485606 9.85558647,6.14191781 L9.85558647,11.2482122 C9.85558647,11.5052739 9.64843961,11.7149165 9.39137788,11.7149165 Z M6.60612639,11.7149165 C6.34906466,11.7149165 6.1419178,11.5077697 6.1419178,11.2507079 L6.1419178,6.14191781 C6.1419178,5.88485607 6.34906466,5.67770922 6.60612641,5.67770922 C6.86318814,5.67770922 7.07033499,5.88485606 7.07033499,6.14191781 L7.07033499,11.2482122 C7.07033499,11.5052739 6.86318814,11.7149165 6.60612639,11.7149165 Z M14.0359594,3.82087491 L11.7149165,3.82087491 L11.7149165,2.89245775 C11.7149165,2.12376827 11.0959718,1.499832 10.3322738,1.499832 L5.67770923,1.499832 C4.90901976,1.499832 4.28508349,2.12376827 4.28508349,2.89245775 L4.28508349,3.82087491 L1.96404059,3.82087491 C1.70697885,3.82087491 1.499832,4.02802174 1.499832,4.28508349 C1.499832,4.54214524 1.70697884,4.74929208 1.96404059,4.74929208 L14.0359594,4.74929208 C14.2930211,4.74929208 14.500168,4.54214524 14.500168,4.28508349 C14.500168,4.02802174 14.2930212,3.82087491 14.0359594,3.82087491 Z M5.21350066,2.89245775 C5.21350066,2.63789175 5.42314324,2.42824916 5.67770925,2.42824916 L10.3322738,2.42824916 C10.5868398,2.42824916 10.7864994,2.63290025 10.7864994,2.89245775 L10.7864994,3.82087491 L5.21350066,3.82087491 L5.21350066,2.89245775 L5.21350066,2.89245775 Z M11.2507079,14.500168 L4.75178782,14.500168 C3.98309834,14.500168 3.35916207,13.8762317 3.35916207,13.1075423 L3.35916207,6.13692631 C3.35916207,5.87986457 3.56630891,5.67271772 3.82337066,5.67271772 C4.08043241,5.67271772 4.28757925,5.87986456 4.28757925,6.13692631 L4.28757925,13.1075423 C4.28757925,13.364604 4.49722183,13.5717508 4.75178783,13.5717508 L11.2532037,13.5717508 C11.5102654,13.5717508 11.7174123,13.364604 11.7174123,13.1075423 L11.7174123,6.15439653 C11.7174123,5.89733479 11.9245591,5.69018794 12.1816209,5.69018794 C12.4386826,5.69018794 12.6458294,5.89733478 12.6458294,6.15439653 L12.6458294,13.1075423 C12.6433337,13.873736 12.0193974,14.500168 11.2507079,14.500168 Z" id="形状"></path>
 | 
			
		||||
                </g>
 | 
			
		||||
            </g>
 | 
			
		||||
        </g>
 | 
			
		||||
    </g>
 | 
			
		||||
</svg>
 | 
			
		||||
| 
		 After Width: | Height: | Size: 2.9 KiB  | 
@@ -83,6 +83,9 @@
 | 
			
		||||
							:on-success="handleUploadSuccess"
 | 
			
		||||
							v-bind="col.bind">
 | 
			
		||||
							<el-button size="mini" :disabled="col.bind?.disabled || false">
 | 
			
		||||
								<svg-icon
 | 
			
		||||
									icon-class="icon-upload"
 | 
			
		||||
									style="color: inherit"></svg-icon>
 | 
			
		||||
								上传文件
 | 
			
		||||
							</el-button>
 | 
			
		||||
							<div class="el-upload__tip" slot="tip" v-if="col.uploadTips">
 | 
			
		||||
@@ -94,6 +97,7 @@
 | 
			
		||||
							class="file"
 | 
			
		||||
							v-for="file in form[col.prop] || []"
 | 
			
		||||
							:file="file"
 | 
			
		||||
							:key="file.fileUrl"
 | 
			
		||||
							@delete="handleDeleteFile(file)" />
 | 
			
		||||
					</div>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
@@ -105,6 +109,7 @@
 | 
			
		||||
<script>
 | 
			
		||||
import { getAccessToken } from '@/utils/auth';
 | 
			
		||||
import tupleImg from '@/assets/images/tuple.png';
 | 
			
		||||
import cache from '@/utils/cache';
 | 
			
		||||
 | 
			
		||||
/**
 | 
			
		||||
 * 找到最长的label
 | 
			
		||||
@@ -132,7 +137,6 @@ const uploadedFile = {
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		handleDelete() {
 | 
			
		||||
			console.log('emit delete event')
 | 
			
		||||
			this.$emit('delete', this.file);
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
@@ -187,6 +191,10 @@ export default {
 | 
			
		||||
			type: Boolean,
 | 
			
		||||
			default: false,
 | 
			
		||||
		},
 | 
			
		||||
		hasFiles: {
 | 
			
		||||
			type: Boolean,
 | 
			
		||||
			default: false,
 | 
			
		||||
		},
 | 
			
		||||
		labelPosition: {
 | 
			
		||||
			type: String,
 | 
			
		||||
			default: 'right',
 | 
			
		||||
@@ -219,7 +227,6 @@ export default {
 | 
			
		||||
	watch: {
 | 
			
		||||
		rows: {
 | 
			
		||||
			handler() {
 | 
			
		||||
				console.log('watch triggered!');
 | 
			
		||||
				this.$nextTick(() => {
 | 
			
		||||
					this.handleOptions('watch');
 | 
			
		||||
				});
 | 
			
		||||
@@ -230,6 +237,9 @@ export default {
 | 
			
		||||
		dataForm: {
 | 
			
		||||
			handler(val) {
 | 
			
		||||
				this.form = JSON.parse(JSON.stringify(val));
 | 
			
		||||
				if (this.hasFiles) {
 | 
			
		||||
					this.form.files = this.form.files ?? [];
 | 
			
		||||
				}
 | 
			
		||||
			},
 | 
			
		||||
			deep: true,
 | 
			
		||||
			immediate: true,
 | 
			
		||||
@@ -308,6 +318,11 @@ export default {
 | 
			
		||||
										'list' in response.data
 | 
			
		||||
											? response.data.list
 | 
			
		||||
											: response.data;
 | 
			
		||||
 | 
			
		||||
									if (opt.cache) {
 | 
			
		||||
										cache.store(opt.cache, list);
 | 
			
		||||
									}
 | 
			
		||||
 | 
			
		||||
									this.$set(
 | 
			
		||||
										this.optionListOf,
 | 
			
		||||
										opt.prop,
 | 
			
		||||
@@ -367,7 +382,9 @@ export default {
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		handleDeleteFile(file) {
 | 
			
		||||
			this.form.files = this.form.files.filter(item => item.fileUrl != file.fileUrl);
 | 
			
		||||
			this.form.files = this.form.files.filter(
 | 
			
		||||
				(item) => item.fileUrl != file.fileUrl
 | 
			
		||||
			);
 | 
			
		||||
			this.$emit('update', this.form);
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
 
 | 
			
		||||
@@ -28,10 +28,37 @@ export default {
 | 
			
		||||
			// tableBtn: [], // 占位
 | 
			
		||||
			// searchBarFormConfig: [], // 占位
 | 
			
		||||
			// // 弹窗表单配置
 | 
			
		||||
			// dialogFormConfig: [], // 占位
 | 
			
		||||
			// dialogFormConfig: [], // 
 | 
			
		||||
			updateUrl: '',
 | 
			
		||||
			addUrl: '',
 | 
			
		||||
			pageUrl: '',
 | 
			
		||||
			form: {}
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		// utils
 | 
			
		||||
		http(url, method, payload) {
 | 
			
		||||
			return this.$axios({
 | 
			
		||||
				url,
 | 
			
		||||
				method,
 | 
			
		||||
				params: method === 'get' ? payload : null,
 | 
			
		||||
				data: method !== 'get' ? payload : null,
 | 
			
		||||
			})
 | 
			
		||||
		},
 | 
			
		||||
		put(payload) {
 | 
			
		||||
			return this.http(this.updateUrl, 'put', payload);
 | 
			
		||||
		},
 | 
			
		||||
		post(payload) {
 | 
			
		||||
			return this.http(this.addUrl, 'post', payload);
 | 
			
		||||
		},
 | 
			
		||||
		recv(payload) {
 | 
			
		||||
			return this.http(this.pageUrl, 'get', payload);
 | 
			
		||||
		},
 | 
			
		||||
		info(payload) {
 | 
			
		||||
			return this.http(this.infoUrl, 'get', payload);
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
		// 过滤后端传回的详情数据
 | 
			
		||||
		filterData(data, keys) {
 | 
			
		||||
			const obj = {};
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										53
									
								
								src/utils/cache.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										53
									
								
								src/utils/cache.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,53 @@
 | 
			
		||||
let timers = [];
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
 | 
			
		||||
    exists(key) {
 | 
			
		||||
        const _ = localStorage.getItem('stored_keys');
 | 
			
		||||
        return _ ? _.split(',')?.indexOf(key) != -1 : false;
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    store(key, value, duration = null) {
 | 
			
		||||
        if (!localStorage.getItem('stored_keys')) localStorage.setItem('stored_keys', key);
 | 
			
		||||
        else localStorage.setItem('stored_keys', localStorage.getItem('stored_keys') + ',' + key);
 | 
			
		||||
 | 
			
		||||
        localStorage.setItem(key, JSON.stringify(value));
 | 
			
		||||
        console.log('store duration', duration)
 | 
			
		||||
        if (duration) {
 | 
			
		||||
            if (timers[key]) clearTimeout(timers[key]);
 | 
			
		||||
            timers[key] = setTimeout(() => {
 | 
			
		||||
                console.log("clear cache", key)
 | 
			
		||||
                this.clear([key]);
 | 
			
		||||
            }, duration * 1000);
 | 
			
		||||
        }
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    /**
 | 
			
		||||
     * 
 | 
			
		||||
     * @param {*} key 
 | 
			
		||||
     * @param {*} cb 
 | 
			
		||||
     * @param {*} param2 force 强制更新,调用cb
 | 
			
		||||
     * @returns 
 | 
			
		||||
     */
 | 
			
		||||
    async getList(key, cb = null, { force = false, duration = null } = {}) {
 | 
			
		||||
        if (this.exists(key) && !force) {
 | 
			
		||||
            return JSON.parse(localStorage.getItem(key))
 | 
			
		||||
        } else {
 | 
			
		||||
            const list = await cb();
 | 
			
		||||
            this.store(key, list, duration);
 | 
			
		||||
            return list;
 | 
			
		||||
        }
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    clear(keys) {
 | 
			
		||||
        if (keys && keys.length) {
 | 
			
		||||
            let stored_keys = localStorage.getItem('stored_keys').split(',');
 | 
			
		||||
            keys.forEach((key) => {
 | 
			
		||||
                stored_keys = stored_keys.filter((item) => item != key);
 | 
			
		||||
            });
 | 
			
		||||
            localStorage.setItem('stored_keys', stored_keys);
 | 
			
		||||
            return;
 | 
			
		||||
        }
 | 
			
		||||
        localStorage.removeItem('stored_keys');
 | 
			
		||||
    },
 | 
			
		||||
}
 | 
			
		||||
@@ -217,7 +217,7 @@ export function getTime(type) {
 | 
			
		||||
export function debounce(func, wait, immediate) {
 | 
			
		||||
  let timeout, args, context, timestamp, result
 | 
			
		||||
 | 
			
		||||
  const later = function() {
 | 
			
		||||
  const later = function () {
 | 
			
		||||
    // 据上一次触发时间间隔
 | 
			
		||||
    const last = +new Date() - timestamp
 | 
			
		||||
 | 
			
		||||
@@ -234,7 +234,7 @@ export function debounce(func, wait, immediate) {
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  return function(...args) {
 | 
			
		||||
  return function (...args) {
 | 
			
		||||
    context = this
 | 
			
		||||
    timestamp = +new Date()
 | 
			
		||||
    const callNow = immediate && !timeout
 | 
			
		||||
@@ -438,3 +438,7 @@ export function toCamelCase(str, upperCaseFirst) {
 | 
			
		||||
 | 
			
		||||
  return str;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export function IdToName(targetId, source, prop = 'name') {
 | 
			
		||||
  return source.find(item => item.id === targetId)?.[prop]
 | 
			
		||||
}
 | 
			
		||||
@@ -219,7 +219,7 @@ export default {
 | 
			
		||||
					{
 | 
			
		||||
						select: true,
 | 
			
		||||
						label: '设备',
 | 
			
		||||
						url: '/base/equipment/page?pageNo=1&pageSize=100',
 | 
			
		||||
						url: '/base/core-equipment/page?pageNo=1&pageSize=100',
 | 
			
		||||
						prop: 'equipmentId',
 | 
			
		||||
						bind: {
 | 
			
		||||
							filterable: true,
 | 
			
		||||
@@ -278,7 +278,7 @@ export default {
 | 
			
		||||
						input: true,
 | 
			
		||||
						label: '设备分组编码',
 | 
			
		||||
						prop: 'code',
 | 
			
		||||
						// url: '/base/equipment/getCode',
 | 
			
		||||
						// url: '/base/core-equipment/getCode',
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
			],
 | 
			
		||||
 
 | 
			
		||||
@@ -191,7 +191,7 @@ export default {
 | 
			
		||||
		// 获取设备列表
 | 
			
		||||
		async getEquipmentList() {
 | 
			
		||||
			const response = await this.$axios(
 | 
			
		||||
				'/base/equipment/page?pageNo=1&pageSize=100'
 | 
			
		||||
				'/base/core-equipment/page?pageNo=1&pageSize=100'
 | 
			
		||||
			);
 | 
			
		||||
			this.equipmentList = response.data.list.map((item) => ({
 | 
			
		||||
				label: item.name,
 | 
			
		||||
 
 | 
			
		||||
@@ -192,7 +192,7 @@ export default {
 | 
			
		||||
					{
 | 
			
		||||
						select: true,
 | 
			
		||||
						label: '设备',
 | 
			
		||||
						url: '/base/equipment/page?pageNo=1&pageSize=100',
 | 
			
		||||
						url: '/base/core-equipment/page?pageNo=1&pageSize=100',
 | 
			
		||||
						prop: 'equipmentId',
 | 
			
		||||
						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
					},
 | 
			
		||||
 
 | 
			
		||||
@@ -192,7 +192,7 @@ export default {
 | 
			
		||||
						input: true,
 | 
			
		||||
						label: '设备分组编码',
 | 
			
		||||
						prop: 'code',
 | 
			
		||||
						// url: '/base/equipment/getCode',
 | 
			
		||||
						// url: '/base/core-equipment/getCode',
 | 
			
		||||
					}
 | 
			
		||||
				]
 | 
			
		||||
			],
 | 
			
		||||
 
 | 
			
		||||
@@ -247,7 +247,7 @@ export default {
 | 
			
		||||
						select: true,
 | 
			
		||||
						label: '设备',
 | 
			
		||||
						prop: 'equipmentId',
 | 
			
		||||
						url: '/base/equipment/page?pageNo=1&pageSize=99',
 | 
			
		||||
						url: '/base/core-equipment/page?pageNo=1&pageSize=99',
 | 
			
		||||
						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
						bind: {
 | 
			
		||||
							filterable: true,
 | 
			
		||||
@@ -283,7 +283,7 @@ export default {
 | 
			
		||||
						input: true,
 | 
			
		||||
						label: '关联表名',
 | 
			
		||||
						prop: 'plcTableName',
 | 
			
		||||
						// url: '/base/equipment/getCode',
 | 
			
		||||
						// url: '/base/core-equipment/getCode',
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
			],
 | 
			
		||||
@@ -320,7 +320,7 @@ export default {
 | 
			
		||||
	methods: {
 | 
			
		||||
		async getEquipmentOptions() {
 | 
			
		||||
			const res = await this.$axios({
 | 
			
		||||
				url: '/base/equipment/listAll',
 | 
			
		||||
				url: '/base/core-equipment/listAll',
 | 
			
		||||
				method: 'get',
 | 
			
		||||
			});
 | 
			
		||||
			return res.data;
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										65
									
								
								src/views/base/material/SmallTitle.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										65
									
								
								src/views/base/material/SmallTitle.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,65 @@
 | 
			
		||||
<!--
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2023-08-01 15:27:31
 | 
			
		||||
 * @LastEditors: zwq
 | 
			
		||||
 * @LastEditTime: 2023-08-01 16:25:54
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
	<div :class="[className, { 'p-0': noPadding }]">
 | 
			
		||||
		<slot />
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
export default {
 | 
			
		||||
	props: {
 | 
			
		||||
		size: {
 | 
			
		||||
			// 取值范围:  xl lg md sm
 | 
			
		||||
			type: String,
 | 
			
		||||
			default: 'de',
 | 
			
		||||
			validator: function (val) {
 | 
			
		||||
				return ['xl', 'lg', 'de', 'md', 'sm'].indexOf(val) !== -1;
 | 
			
		||||
			},
 | 
			
		||||
		},
 | 
			
		||||
		noPadding: {
 | 
			
		||||
			type: Boolean,
 | 
			
		||||
			default: false,
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	computed: {
 | 
			
		||||
		className: function () {
 | 
			
		||||
			return `${this.size}-title`;
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style lang="scss" scoped>
 | 
			
		||||
$pxls: (xl, 28px) (lg, 24px) (de, 20px) (md, 18px) (sm, 16px);
 | 
			
		||||
$mgr: 8px;
 | 
			
		||||
@each $size, $height in $pxls {
 | 
			
		||||
	.#{$size}-title {
 | 
			
		||||
		font-size: 18px;
 | 
			
		||||
		line-height: $height;
 | 
			
		||||
		color: #000;
 | 
			
		||||
		font-weight: 500;
 | 
			
		||||
		font-family: '微软雅黑', 'Microsoft YaHei', Arial, Helvetica, sans-serif;
 | 
			
		||||
 | 
			
		||||
		&::before {
 | 
			
		||||
			content: '';
 | 
			
		||||
			display: inline-block;
 | 
			
		||||
			vertical-align: top;
 | 
			
		||||
			width: 4px;
 | 
			
		||||
			height: $height + 2px;
 | 
			
		||||
			border-radius: 1px;
 | 
			
		||||
			margin-right: $mgr;
 | 
			
		||||
			background-color: #0b58ff;
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.p-0 {
 | 
			
		||||
	padding: 0;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
							
								
								
									
										421
									
								
								src/views/base/material/add-or-updata.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										421
									
								
								src/views/base/material/add-or-updata.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,421 @@
 | 
			
		||||
<!--
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2021-11-18 14:16:25
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @LastEditTime: 2023-10-27 15:11:02
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
	<el-drawer
 | 
			
		||||
		:visible.sync="visible"
 | 
			
		||||
		:show-close="false"
 | 
			
		||||
		:wrapper-closable="false"
 | 
			
		||||
		class="drawer"
 | 
			
		||||
		size="60%">
 | 
			
		||||
		<small-title slot="title" :no-padding="true">
 | 
			
		||||
			{{ isdetail ? '详情' : !dataForm.id ? '新增' : '编辑' }}
 | 
			
		||||
		</small-title>
 | 
			
		||||
		<div class="content">
 | 
			
		||||
			<div class="visual-part">
 | 
			
		||||
				<el-form
 | 
			
		||||
					:model="dataForm"
 | 
			
		||||
					:rules="dataRule"
 | 
			
		||||
					ref="dataForm"
 | 
			
		||||
					@keyup.enter.native="dataFormSubmit()"
 | 
			
		||||
					label-width="100px"
 | 
			
		||||
					label-position="top">
 | 
			
		||||
					<el-row :gutter="20">
 | 
			
		||||
						<el-col :span="12">
 | 
			
		||||
							<el-form-item label="物料编码" prop="code">
 | 
			
		||||
								<el-input
 | 
			
		||||
									v-model="dataForm.code"
 | 
			
		||||
									clearable
 | 
			
		||||
									:disabled="isdetail"
 | 
			
		||||
									placeholder="请输入物料编码" />
 | 
			
		||||
							</el-form-item>
 | 
			
		||||
						</el-col>
 | 
			
		||||
						<el-col :span="12">
 | 
			
		||||
							<el-form-item label="物料名称" prop="name">
 | 
			
		||||
								<el-input v-model="dataForm.name" :disabled="isdetail" clearable placeholder="请输入物料名称" />
 | 
			
		||||
							</el-form-item>
 | 
			
		||||
						</el-col>
 | 
			
		||||
					</el-row>
 | 
			
		||||
					<el-row :gutter="20">
 | 
			
		||||
						<el-col :span="12">
 | 
			
		||||
							<el-form-item label="英文名称" prop="engName">
 | 
			
		||||
								<el-input
 | 
			
		||||
									v-model="dataForm.engName"
 | 
			
		||||
									clearable
 | 
			
		||||
									:disabled="isdetail"
 | 
			
		||||
									placeholder="请输入英文名称" />
 | 
			
		||||
							</el-form-item>
 | 
			
		||||
						</el-col>
 | 
			
		||||
						<el-col :span="12">
 | 
			
		||||
							<el-form-item label="物料类型" prop="type">
 | 
			
		||||
								<el-select
 | 
			
		||||
									v-model="dataForm.type"
 | 
			
		||||
									filterable
 | 
			
		||||
									:disabled="isdetail"
 | 
			
		||||
									placeholder="请选择物料类型">
 | 
			
		||||
									<el-option
 | 
			
		||||
										v-for="dict in materialList"
 | 
			
		||||
										:key="dict.value"
 | 
			
		||||
										:label="dict.label"
 | 
			
		||||
										:value="dict.value" />
 | 
			
		||||
								</el-select>
 | 
			
		||||
							</el-form-item>
 | 
			
		||||
						</el-col>
 | 
			
		||||
					</el-row>
 | 
			
		||||
					<el-row :gutter="20">
 | 
			
		||||
						<el-col :span="12">
 | 
			
		||||
							<el-form-item label="规格" prop="spec">
 | 
			
		||||
								<el-input
 | 
			
		||||
									v-model="dataForm.spec"
 | 
			
		||||
									clearable
 | 
			
		||||
									:disabled="isdetail"
 | 
			
		||||
									placeholder="请输入规格" />
 | 
			
		||||
							</el-form-item>
 | 
			
		||||
						</el-col>
 | 
			
		||||
						<el-col :span="12">
 | 
			
		||||
							<el-form-item label="供应商" prop="supplierId">
 | 
			
		||||
								<el-select
 | 
			
		||||
									v-model="dataForm.supplierId"
 | 
			
		||||
									filterable
 | 
			
		||||
									clearable
 | 
			
		||||
									:disabled="isdetail"
 | 
			
		||||
									placeholder="请选择供应商">
 | 
			
		||||
									<el-option
 | 
			
		||||
										v-for="dict in supplierList"
 | 
			
		||||
										:key="dict.id"
 | 
			
		||||
										:label="dict.name"
 | 
			
		||||
										:value="dict.id" />
 | 
			
		||||
								</el-select>
 | 
			
		||||
							</el-form-item>
 | 
			
		||||
						</el-col>
 | 
			
		||||
					</el-row>
 | 
			
		||||
					<el-row :gutter="20">
 | 
			
		||||
						<el-col :span="12">
 | 
			
		||||
							<el-form-item label="单位" prop="unit">
 | 
			
		||||
								<el-select
 | 
			
		||||
									v-model="dataForm.unit"
 | 
			
		||||
									filterable
 | 
			
		||||
									:disabled="isdetail"
 | 
			
		||||
									placeholder="请选择物料单位">
 | 
			
		||||
									<el-option
 | 
			
		||||
										v-for="dict in unitList"
 | 
			
		||||
										:key="dict.value"
 | 
			
		||||
										:label="dict.label"
 | 
			
		||||
										:value="dict.value" />
 | 
			
		||||
								</el-select>
 | 
			
		||||
							</el-form-item>
 | 
			
		||||
						</el-col>
 | 
			
		||||
						<el-col :span="12">
 | 
			
		||||
							<el-form-item label="备注" prop="remark">
 | 
			
		||||
								<el-input v-model="dataForm.remark" :disabled="isdetail" clearable placeholder="请输入备注" />
 | 
			
		||||
							</el-form-item>
 | 
			
		||||
						</el-col>
 | 
			
		||||
					</el-row>
 | 
			
		||||
				</el-form>
 | 
			
		||||
			</div>
 | 
			
		||||
			<div class="attr-list" v-if="idAttrShow">
 | 
			
		||||
				<small-title
 | 
			
		||||
					style="margin: 16px 0; padding-left: 8px"
 | 
			
		||||
					:no-padding="true">
 | 
			
		||||
					物料属性
 | 
			
		||||
				</small-title>
 | 
			
		||||
 | 
			
		||||
				<base-table
 | 
			
		||||
					:table-props="tableProps"
 | 
			
		||||
					:page="listQuery.pageNo"
 | 
			
		||||
					:limit="listQuery.pageSize"
 | 
			
		||||
					:add-button-show="isdetail ? null : '添加属性'"
 | 
			
		||||
					@emitButtonClick="addNew()"
 | 
			
		||||
					:table-data="materialAttrList">
 | 
			
		||||
					<method-btn
 | 
			
		||||
						v-if="!isdetail"
 | 
			
		||||
						slot="handleBtn"
 | 
			
		||||
						:width="120"
 | 
			
		||||
						label="操作"
 | 
			
		||||
						:method-list="tableBtn"
 | 
			
		||||
						@clickBtn="handleClick" />
 | 
			
		||||
				</base-table>
 | 
			
		||||
				<pagination
 | 
			
		||||
					v-show="listQuery.total > 0"
 | 
			
		||||
					:total="listQuery.total"
 | 
			
		||||
					:page.sync="listQuery.pageNo"
 | 
			
		||||
					:limit.sync="listQuery.pageSize"
 | 
			
		||||
					:page-sizes="[5, 10, 15]"
 | 
			
		||||
					@pagination="getList" />
 | 
			
		||||
			</div>
 | 
			
		||||
 | 
			
		||||
			<div class="drawer-body__footer">
 | 
			
		||||
				<el-button style="" @click="goback()">取消</el-button>
 | 
			
		||||
				<el-button v-if="isdetail" type="primary" @click="goEdit()">
 | 
			
		||||
					编辑
 | 
			
		||||
				</el-button>
 | 
			
		||||
				<el-button v-else type="primary" @click="dataFormSubmit()">确定</el-button>
 | 
			
		||||
			</div>
 | 
			
		||||
		</div>
 | 
			
		||||
 | 
			
		||||
		<attr-add
 | 
			
		||||
			v-if="addOrUpdateVisible"
 | 
			
		||||
			ref="addOrUpdate"
 | 
			
		||||
			:material-id="dataForm.id"
 | 
			
		||||
			@refreshDataList="getList" />
 | 
			
		||||
	</el-drawer>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import basicAdd from '../../core/mixins/basic-add';
 | 
			
		||||
import { createMaterial, updateMaterial, getMaterial, getCode, getSupplierList, getMaterialAttrList, deleteMaterialAttr } from "@/api/base/material";
 | 
			
		||||
import { listData } from "@/api/system/dict/data";
 | 
			
		||||
import SmallTitle from './SmallTitle';
 | 
			
		||||
import { parseTime } from '../../core/mixins/code-filter';
 | 
			
		||||
import attrAdd from './attr-add';
 | 
			
		||||
 | 
			
		||||
const tableBtn = [
 | 
			
		||||
	{
 | 
			
		||||
		type: 'edit',
 | 
			
		||||
		btnName: '编辑',
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		type: 'delete',
 | 
			
		||||
		btnName: '删除',
 | 
			
		||||
	},
 | 
			
		||||
];
 | 
			
		||||
const tableProps = [
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'createTime',
 | 
			
		||||
		label: '添加时间',
 | 
			
		||||
		filter: parseTime,
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'attrName',
 | 
			
		||||
		label: '属性名',
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'attrValue',
 | 
			
		||||
		label: '属性值',
 | 
			
		||||
	},
 | 
			
		||||
];
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	mixins: [basicAdd],
 | 
			
		||||
	components: { SmallTitle, attrAdd },
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			tableBtn,
 | 
			
		||||
			tableProps,
 | 
			
		||||
			addOrUpdateVisible: false,
 | 
			
		||||
			urlOptions: {
 | 
			
		||||
			  isGetCode: true,
 | 
			
		||||
        codeURL: getCode,
 | 
			
		||||
				createURL: createMaterial,
 | 
			
		||||
				updateURL: updateMaterial,
 | 
			
		||||
				infoURL: getMaterial,
 | 
			
		||||
			},
 | 
			
		||||
			listQuery: {
 | 
			
		||||
				pageSize: 10,
 | 
			
		||||
				pageNo: 1,
 | 
			
		||||
				total: 0,
 | 
			
		||||
			},
 | 
			
		||||
			dataForm: {
 | 
			
		||||
        id: undefined,
 | 
			
		||||
        code: undefined,
 | 
			
		||||
        name: '',
 | 
			
		||||
				engName: '',
 | 
			
		||||
				type: '',
 | 
			
		||||
        spec: undefined,
 | 
			
		||||
				supplierId: undefined,
 | 
			
		||||
        remark: undefined,
 | 
			
		||||
				unit: ''
 | 
			
		||||
			},
 | 
			
		||||
			materialList: [],
 | 
			
		||||
			supplierList: [],
 | 
			
		||||
			materialAttrList: [],
 | 
			
		||||
			unitList: [],
 | 
			
		||||
			visible: false,
 | 
			
		||||
			isdetail: false,
 | 
			
		||||
			idAttrShow: false,
 | 
			
		||||
			dataRule: {
 | 
			
		||||
        code: [{ required: true, message: "物料编码不能为空", trigger: "blur" }],
 | 
			
		||||
        name: [{ required: true, message: "物料名称不能为空", trigger: "blur" }],
 | 
			
		||||
				type: [{ required: true, message: "物料类型不能为空", trigger: "blur" }]
 | 
			
		||||
      }
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	mounted() {
 | 
			
		||||
		this.getDict()
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		async getDict() {
 | 
			
		||||
			// 物料类型列表
 | 
			
		||||
			const res = await listData({
 | 
			
		||||
				pageNo: 1,
 | 
			
		||||
        pageSize: 99,
 | 
			
		||||
        dictType: 'material_type',
 | 
			
		||||
			});
 | 
			
		||||
			this.materialList = res.data.list.map(item => {
 | 
			
		||||
				return {
 | 
			
		||||
					label: item.label,
 | 
			
		||||
					value: Number(item.value)
 | 
			
		||||
				}
 | 
			
		||||
			});
 | 
			
		||||
			// 供应商列表
 | 
			
		||||
			const supplierRes = await getSupplierList();
 | 
			
		||||
			this.supplierList = supplierRes.data;
 | 
			
		||||
			// 物料单位列表
 | 
			
		||||
			const unitRes = await listData({
 | 
			
		||||
				pageNo: 1,
 | 
			
		||||
        pageSize: 99,
 | 
			
		||||
        dictType: 'goods_unit',
 | 
			
		||||
			});
 | 
			
		||||
			this.unitList = unitRes.data.list.map(item => {
 | 
			
		||||
				return {
 | 
			
		||||
					label: item.label,
 | 
			
		||||
					value: Number(item.value)
 | 
			
		||||
				}
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
		initData() {
 | 
			
		||||
			this.materialAttrList.splice(0);
 | 
			
		||||
			this.listQuery.total = 0;
 | 
			
		||||
		},
 | 
			
		||||
		handleClick(raw) {
 | 
			
		||||
			if (raw.type === 'delete') {
 | 
			
		||||
				this.$confirm(
 | 
			
		||||
					`确定对${
 | 
			
		||||
						raw.data.attrName
 | 
			
		||||
							? '[名称=' + raw.data.attrName + ']'
 | 
			
		||||
							: '[序号=' + raw.data._pageIndex + ']'
 | 
			
		||||
					}进行删除操作?`,
 | 
			
		||||
					'提示',
 | 
			
		||||
					{
 | 
			
		||||
						confirmButtonText: '确定',
 | 
			
		||||
						cancelButtonText: '取消',
 | 
			
		||||
						type: 'warning',
 | 
			
		||||
					}
 | 
			
		||||
				)
 | 
			
		||||
					.then(() => {
 | 
			
		||||
						deleteMaterialAttr(raw.data.id).then(({ data }) => {
 | 
			
		||||
							this.$message({
 | 
			
		||||
								message: '操作成功',
 | 
			
		||||
								type: 'success',
 | 
			
		||||
								duration: 1500,
 | 
			
		||||
								onClose: () => {
 | 
			
		||||
									this.getList();
 | 
			
		||||
								},
 | 
			
		||||
							});
 | 
			
		||||
						});
 | 
			
		||||
					})
 | 
			
		||||
					.catch(() => {});
 | 
			
		||||
			} else {
 | 
			
		||||
				this.addNew(raw.data.id);
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
		getList() {
 | 
			
		||||
			// 获取物料的属性列表
 | 
			
		||||
			getMaterialAttrList({
 | 
			
		||||
				...this.listQuery,
 | 
			
		||||
				materialId: this.dataForm.id,
 | 
			
		||||
			}).then((response) => {
 | 
			
		||||
				this.materialAttrList = response.data.list;
 | 
			
		||||
				this.listQuery.total = response.data.total;
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
		init(id, isdetail) {
 | 
			
		||||
			this.initData();
 | 
			
		||||
			this.isdetail = isdetail || false;
 | 
			
		||||
			this.dataForm.id = id || undefined;
 | 
			
		||||
			this.visible = true;
 | 
			
		||||
			if (id) {
 | 
			
		||||
				this.idAttrShow = true
 | 
			
		||||
			} else {
 | 
			
		||||
				this.idAttrShow = false
 | 
			
		||||
			}
 | 
			
		||||
 | 
			
		||||
			this.$nextTick(() => {
 | 
			
		||||
				this.$refs['dataForm'].resetFields();
 | 
			
		||||
 | 
			
		||||
				if (this.dataForm.id) {
 | 
			
		||||
					// 获取物料详情
 | 
			
		||||
					this.urlOptions.infoURL(id).then(response => {
 | 
			
		||||
            this.dataForm = response.data;
 | 
			
		||||
          });
 | 
			
		||||
					// 获取物料的属性列表
 | 
			
		||||
					this.getList();
 | 
			
		||||
				} else {
 | 
			
		||||
					if (this.urlOptions.isGetCode) {
 | 
			
		||||
            this.getCode()
 | 
			
		||||
          }
 | 
			
		||||
				}
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
		goback() {
 | 
			
		||||
			this.$emit('refreshDataList');
 | 
			
		||||
			this.visible = false;
 | 
			
		||||
			// this.initData();
 | 
			
		||||
		},
 | 
			
		||||
		goEdit() {
 | 
			
		||||
			this.isdetail = false;
 | 
			
		||||
		},
 | 
			
		||||
		// 新增 / 修改
 | 
			
		||||
		addNew(id) {
 | 
			
		||||
			this.addOrUpdateVisible = true;
 | 
			
		||||
			this.$nextTick(() => {
 | 
			
		||||
				this.$refs.addOrUpdate.init(id);
 | 
			
		||||
			});
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
<style scoped>
 | 
			
		||||
.drawer >>> .el-drawer {
 | 
			
		||||
	border-radius: 8px 0 0 8px;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	flex-direction: column;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .el-form-item__label {
 | 
			
		||||
	padding: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .el-drawer__header {
 | 
			
		||||
	margin: 0;
 | 
			
		||||
	padding: 32px 32px 24px;
 | 
			
		||||
	border-bottom: 1px solid #dcdfe6;
 | 
			
		||||
}
 | 
			
		||||
.drawer >>> .el-drawer__body {
 | 
			
		||||
	flex: 1;
 | 
			
		||||
	height: 1px;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	flex-direction: column;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .content {
 | 
			
		||||
	padding: 30px 24px;
 | 
			
		||||
	flex: 1;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	flex-direction: column;
 | 
			
		||||
	/* height: 100%; */
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .visual-part {
 | 
			
		||||
	flex: 1 auto;
 | 
			
		||||
	max-height: 76vh;
 | 
			
		||||
	overflow: hidden;
 | 
			
		||||
	overflow-y: scroll;
 | 
			
		||||
	padding-right: 10px; /* 调整滚动条样式 */
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .el-form,
 | 
			
		||||
.drawer >>> .attr-list {
 | 
			
		||||
	padding: 0 16px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer-body__footer {
 | 
			
		||||
	display: flex;
 | 
			
		||||
	justify-content: flex-end;
 | 
			
		||||
	padding: 18px;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
							
								
								
									
										141
									
								
								src/views/base/material/attr-add.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										141
									
								
								src/views/base/material/attr-add.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,141 @@
 | 
			
		||||
<template>
 | 
			
		||||
	<el-dialog
 | 
			
		||||
		:visible.sync="visible"
 | 
			
		||||
		:width="'35%'"
 | 
			
		||||
		:append-to-body="true"
 | 
			
		||||
		:close-on-click-modal="false"
 | 
			
		||||
		class="dialog">
 | 
			
		||||
		<template #title>
 | 
			
		||||
			<slot name="title">
 | 
			
		||||
				<div class="titleStyle">
 | 
			
		||||
					{{ !dataForm.id ? '新增' : '编辑' }}
 | 
			
		||||
				</div>
 | 
			
		||||
			</slot>
 | 
			
		||||
		</template>
 | 
			
		||||
 | 
			
		||||
		<el-form
 | 
			
		||||
			ref="dataForm"
 | 
			
		||||
			:model="dataForm"
 | 
			
		||||
			:rules="dataRule"
 | 
			
		||||
			label-width="100px"
 | 
			
		||||
			@keyup.enter.native="dataFormSubmit()">
 | 
			
		||||
			<el-form-item label="属性名" prop="attrName">
 | 
			
		||||
				<el-input
 | 
			
		||||
					v-model="dataForm.attrName"
 | 
			
		||||
					placeholder="请输入属性名"
 | 
			
		||||
					clearable />
 | 
			
		||||
			</el-form-item>
 | 
			
		||||
			<el-form-item label="属性值" prop="attrValue">
 | 
			
		||||
				<el-input
 | 
			
		||||
					v-model="dataForm.attrValue"
 | 
			
		||||
					placeholder="请输入属性值"
 | 
			
		||||
					clearable />
 | 
			
		||||
			</el-form-item>
 | 
			
		||||
		</el-form>
 | 
			
		||||
 | 
			
		||||
		<el-row style="text-align: right">
 | 
			
		||||
			<el-button @click="visible = false">取消</el-button>
 | 
			
		||||
			<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
 | 
			
		||||
		</el-row>
 | 
			
		||||
	</el-dialog>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import {
 | 
			
		||||
	createMaterialAttr,
 | 
			
		||||
	updateMaterialAttr,
 | 
			
		||||
	getMaterialAttr
 | 
			
		||||
} from '@/api/base/material';
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	props: {
 | 
			
		||||
		materialId: {
 | 
			
		||||
			type: String,
 | 
			
		||||
			default: '',
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			visible: false,
 | 
			
		||||
			dataForm: {
 | 
			
		||||
				id: undefined,
 | 
			
		||||
				attrName: '',
 | 
			
		||||
				attrValue: '',
 | 
			
		||||
			},
 | 
			
		||||
			dataRule: {
 | 
			
		||||
				attrName: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
 | 
			
		||||
			},
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		init(id) {
 | 
			
		||||
			this.dataForm.id = id || '';
 | 
			
		||||
			this.visible = true;
 | 
			
		||||
			this.$nextTick(() => {
 | 
			
		||||
				this.$refs['dataForm'].resetFields();
 | 
			
		||||
				if (this.dataForm.id) {
 | 
			
		||||
					getMaterialAttr({
 | 
			
		||||
						id: this.dataForm.id
 | 
			
		||||
					}).then((res) => {
 | 
			
		||||
						const { attrName, attrValue } = res.data;
 | 
			
		||||
						this.dataForm.attrName = attrName;
 | 
			
		||||
						this.dataForm.attrValue = attrValue;
 | 
			
		||||
					});
 | 
			
		||||
				}
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
		// 表单提交
 | 
			
		||||
		dataFormSubmit() {
 | 
			
		||||
			this.$refs['dataForm'].validate((valid) => {
 | 
			
		||||
				if (valid) {
 | 
			
		||||
					// 修改的提交
 | 
			
		||||
					if (this.dataForm.id) {
 | 
			
		||||
						updateMaterialAttr({
 | 
			
		||||
							...this.dataForm,
 | 
			
		||||
							materialId: this.materialId,
 | 
			
		||||
						}).then((response) => {
 | 
			
		||||
							this.$modal.msgSuccess('修改成功');
 | 
			
		||||
							this.visible = false;
 | 
			
		||||
							this.$emit('refreshDataList');
 | 
			
		||||
						});
 | 
			
		||||
						return;
 | 
			
		||||
					}
 | 
			
		||||
					// 添加的提交
 | 
			
		||||
					createMaterialAttr({
 | 
			
		||||
						...this.dataForm,
 | 
			
		||||
						materialId: this.materialId,
 | 
			
		||||
					}).then((response) => {
 | 
			
		||||
						this.$modal.msgSuccess('新增成功');
 | 
			
		||||
						this.visible = false;
 | 
			
		||||
						this.$emit('refreshDataList');
 | 
			
		||||
					});
 | 
			
		||||
				}
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped>
 | 
			
		||||
.dialog >>> .el-dialog__body {
 | 
			
		||||
	padding: 30px 24px;
 | 
			
		||||
}
 | 
			
		||||
.dialog >>> .el-dialog__header {
 | 
			
		||||
	font-size: 16px;
 | 
			
		||||
	color: rgba(0, 0, 0, 0.85);
 | 
			
		||||
	font-weight: 500;
 | 
			
		||||
	padding: 13px 24px;
 | 
			
		||||
	border-bottom: 1px solid #e9e9e9;
 | 
			
		||||
}
 | 
			
		||||
.dialog >>> .el-dialog__header .titleStyle::before {
 | 
			
		||||
	content: '';
 | 
			
		||||
	display: inline-block;
 | 
			
		||||
	width: 4px;
 | 
			
		||||
	height: 16px;
 | 
			
		||||
	background-color: #0b58ff;
 | 
			
		||||
	border-radius: 1px;
 | 
			
		||||
	margin-right: 8px;
 | 
			
		||||
	position: relative;
 | 
			
		||||
	top: 2px;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
							
								
								
									
										233
									
								
								src/views/base/material/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										233
									
								
								src/views/base/material/index.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,233 @@
 | 
			
		||||
<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">
 | 
			
		||||
			<method-btn
 | 
			
		||||
				v-if="tableBtn.length"
 | 
			
		||||
				slot="handleBtn"
 | 
			
		||||
				:width="220"
 | 
			
		||||
				label="操作"
 | 
			
		||||
				:method-list="tableBtn"
 | 
			
		||||
				@clickBtn="handleClick" />
 | 
			
		||||
		</base-table>
 | 
			
		||||
		<pagination
 | 
			
		||||
			:limit.sync="listQuery.pageSize"
 | 
			
		||||
			:page.sync="listQuery.pageNo"
 | 
			
		||||
			:total="listQuery.total"
 | 
			
		||||
			@pagination="getDataList" />
 | 
			
		||||
		<add-or-update
 | 
			
		||||
			v-if="addOrUpdateVisible"
 | 
			
		||||
			ref="addOrUpdate"
 | 
			
		||||
			@refreshDataList="getDataList" />
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import AddOrUpdate from './add-or-updata';
 | 
			
		||||
import basicPage from '../../core/mixins/basic-page';
 | 
			
		||||
import { parseTime } from '../../core/mixins/code-filter';
 | 
			
		||||
import {
 | 
			
		||||
	getMaterialPage,
 | 
			
		||||
	deleteMaterial
 | 
			
		||||
} from '@/api/base/material';
 | 
			
		||||
import { listData } from "@/api/system/dict/data";
 | 
			
		||||
 | 
			
		||||
const tableProps = [
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'createTime',
 | 
			
		||||
		label: '添加时间',
 | 
			
		||||
		filter: parseTime
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'code',
 | 
			
		||||
		label: '物料编码'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'name',
 | 
			
		||||
		label: '物料名称'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'engName',
 | 
			
		||||
		label: '英文名称'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'abbr',
 | 
			
		||||
		label: '缩写'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'materialType',
 | 
			
		||||
		label: '物料类型'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'supplierName',
 | 
			
		||||
		label: '供应商'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'remark',
 | 
			
		||||
		label: '备注'
 | 
			
		||||
	}
 | 
			
		||||
];
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	mixins: [basicPage],
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			urlOptions: {
 | 
			
		||||
				getDataListURL: getMaterialPage,
 | 
			
		||||
				deleteURL: deleteMaterial
 | 
			
		||||
				// exportURL: exportFactoryExcel,
 | 
			
		||||
			},
 | 
			
		||||
			tableProps,
 | 
			
		||||
			tableBtn: [
 | 
			
		||||
				this.$auth.hasPermi(`base:material:update`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'edit',
 | 
			
		||||
							btnName: '编辑',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
					this.$auth.hasPermi(`base:material:queryAttr`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'search',
 | 
			
		||||
							btnName: '查看属性',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
					this.$auth.hasPermi(`base:material:editAttr`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'editAttr',
 | 
			
		||||
							btnName: '编辑属性',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
          this.$auth.hasPermi(`base:material:delete`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'delete',
 | 
			
		||||
							btnName: '删除',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
			].filter((v)=>v),
 | 
			
		||||
			tableData: [],
 | 
			
		||||
			typeList: [],
 | 
			
		||||
			formConfig: [
 | 
			
		||||
				{
 | 
			
		||||
					type: 'input',
 | 
			
		||||
					label: '关键字',
 | 
			
		||||
					placeholder: '物料名称',
 | 
			
		||||
					param: 'name',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'input',
 | 
			
		||||
					label: '关键字',
 | 
			
		||||
					placeholder: '物料编码',
 | 
			
		||||
					param: 'code',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'button',
 | 
			
		||||
					btnName: '查询',
 | 
			
		||||
					name: 'search',
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'separate',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: this.$auth.hasPermi('base:material:create') ? 'button' : '',
 | 
			
		||||
					btnName: '新增物料',
 | 
			
		||||
					name: 'add',
 | 
			
		||||
					color: 'success',
 | 
			
		||||
					plain: true
 | 
			
		||||
				},
 | 
			
		||||
			],
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	components: {
 | 
			
		||||
		AddOrUpdate,
 | 
			
		||||
	},
 | 
			
		||||
	created() {
 | 
			
		||||
		this.getDict()
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		async getDict() {
 | 
			
		||||
			// 物料类型列表
 | 
			
		||||
			const res = await listData({
 | 
			
		||||
				pageNo: 1,
 | 
			
		||||
        pageSize: 99,
 | 
			
		||||
        dictType: 'material_type',
 | 
			
		||||
			});
 | 
			
		||||
			this.typeList = res.data.list.map(item => {
 | 
			
		||||
				return {
 | 
			
		||||
					label: item.label,
 | 
			
		||||
					value: Number(item.value)
 | 
			
		||||
				}
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
		otherMethods(val) {
 | 
			
		||||
			if (val.type === 'search') {
 | 
			
		||||
				this.addOrUpdateVisible = true;
 | 
			
		||||
				this.addOrEditTitle = '详情';
 | 
			
		||||
				this.$nextTick(() => {
 | 
			
		||||
					this.$refs.addOrUpdate.init(val.data.id, true);
 | 
			
		||||
				});
 | 
			
		||||
			} else {
 | 
			
		||||
				this.addOrEditTitle = '编辑';
 | 
			
		||||
				this.addOrUpdateVisible = true;
 | 
			
		||||
				this.$nextTick(() => {
 | 
			
		||||
					this.$refs.addOrUpdate.init(val.data.id);
 | 
			
		||||
				});
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
		// 获取数据列表
 | 
			
		||||
    getDataList() {
 | 
			
		||||
      this.dataListLoading = true;
 | 
			
		||||
      this.urlOptions.getDataListURL(this.listQuery).then(response => {
 | 
			
		||||
        this.tableData = response.data.records.map(item => {
 | 
			
		||||
					this.typeList.filter(t => {
 | 
			
		||||
						if (item.type === t.value) {
 | 
			
		||||
							item.materialType = t.label
 | 
			
		||||
						}
 | 
			
		||||
					})
 | 
			
		||||
					return item
 | 
			
		||||
				});
 | 
			
		||||
        this.listQuery.total = response.data.total;
 | 
			
		||||
        this.dataListLoading = false;
 | 
			
		||||
      });
 | 
			
		||||
    },
 | 
			
		||||
		buttonClick(val) {
 | 
			
		||||
			switch (val.btnName) {
 | 
			
		||||
				case 'search':
 | 
			
		||||
					this.listQuery.pageNo = 1;
 | 
			
		||||
					this.listQuery.pageSize = 10;
 | 
			
		||||
					this.listQuery.name = val.name ? val.name : undefined;
 | 
			
		||||
					this.listQuery.code = val.code ? val.code : undefined;
 | 
			
		||||
					this.getDataList();
 | 
			
		||||
					break;
 | 
			
		||||
				case 'reset':
 | 
			
		||||
					this.$refs.searchBarForm.resetForm();
 | 
			
		||||
					this.listQuery = {
 | 
			
		||||
						pageSize: 10,
 | 
			
		||||
						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>
 | 
			
		||||
							
								
								
									
										107
									
								
								src/views/base/materialDate/add-or-updata.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										107
									
								
								src/views/base/materialDate/add-or-updata.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,107 @@
 | 
			
		||||
<!--
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2021-11-18 14:16:25
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @LastEditTime: 2023-10-24 18:34:07
 | 
			
		||||
 * @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="materialId">
 | 
			
		||||
					<el-select
 | 
			
		||||
						v-model="dataForm.materialId"
 | 
			
		||||
						placeholder="请选择物料"
 | 
			
		||||
						@change="setMaterialCode">
 | 
			
		||||
						<el-option
 | 
			
		||||
							v-for="dict in materialList"
 | 
			
		||||
							:key="dict.id"
 | 
			
		||||
							:label="dict.name"
 | 
			
		||||
							:value="dict.id" />
 | 
			
		||||
					</el-select>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="物料编码" prop="materialCode">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="dataForm.materialCode"
 | 
			
		||||
						disabled
 | 
			
		||||
						placeholder="请输入物料编码" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="批次号" prop="code">
 | 
			
		||||
					<el-input v-model="dataForm.code" clearable placeholder="请输入批次号" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="批次名称" prop="name">
 | 
			
		||||
					<el-input v-model="dataForm.name" clearable placeholder="请输入批次名称" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-form-item label="备注" prop="remark">
 | 
			
		||||
			<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" />
 | 
			
		||||
		</el-form-item>
 | 
			
		||||
	</el-form>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import basicAdd from '../../core/mixins/basic-add';
 | 
			
		||||
import { createMaterialDate, updateMaterialDate, getMaterialDate, getCode } from "@/api/base/materialDate";
 | 
			
		||||
import { getMaterialList } from "@/api/base/material";
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	mixins: [basicAdd],
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			urlOptions: {
 | 
			
		||||
			  isGetCode: true,
 | 
			
		||||
        codeURL: getCode,
 | 
			
		||||
				createURL: createMaterialDate,
 | 
			
		||||
				updateURL: updateMaterialDate,
 | 
			
		||||
				infoURL: getMaterialDate,
 | 
			
		||||
			},
 | 
			
		||||
			dataForm: {
 | 
			
		||||
        id: undefined,
 | 
			
		||||
        code: undefined,
 | 
			
		||||
        name: undefined,
 | 
			
		||||
        materialId: undefined,
 | 
			
		||||
				materialCode: undefined,
 | 
			
		||||
        remark: undefined,
 | 
			
		||||
			},
 | 
			
		||||
			materialList: [],
 | 
			
		||||
			dataRule: {
 | 
			
		||||
				materialId: [{ required: true, message: "物料不能为空", trigger: "blur" }],
 | 
			
		||||
        code: [{ required: true, message: "工厂编码不能为空", trigger: "blur" }],
 | 
			
		||||
        name: [{ required: true, message: "工厂名称不能为空", trigger: "blur" }],
 | 
			
		||||
      }
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	mounted() {
 | 
			
		||||
		this.getDict()
 | 
			
		||||
		console.log('我看看', this.dataForm)
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		async getDict() {
 | 
			
		||||
			// 物料列表
 | 
			
		||||
			const res = await getMaterialList();
 | 
			
		||||
			this.materialList = res.data;
 | 
			
		||||
		},
 | 
			
		||||
		setMaterialCode() {
 | 
			
		||||
			const chooseM = this.materialList.filter(item => {
 | 
			
		||||
				return item.id === this.dataForm.materialId
 | 
			
		||||
			})
 | 
			
		||||
			this.dataForm.materialCode = chooseM[0].code
 | 
			
		||||
		}
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
							
								
								
									
										169
									
								
								src/views/base/materialDate/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										169
									
								
								src/views/base/materialDate/index.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,169 @@
 | 
			
		||||
<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">
 | 
			
		||||
			<method-btn
 | 
			
		||||
				v-if="tableBtn.length"
 | 
			
		||||
				slot="handleBtn"
 | 
			
		||||
				:width="120"
 | 
			
		||||
				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"
 | 
			
		||||
			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 '../../core/mixins/basic-page';
 | 
			
		||||
import { parseTime } from '../../core/mixins/code-filter';
 | 
			
		||||
import {
 | 
			
		||||
	getMaterDatePage,
 | 
			
		||||
	deleteMaterialDate
 | 
			
		||||
} from '@/api/base/materialDate';
 | 
			
		||||
 | 
			
		||||
const tableProps = [
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'createTime',
 | 
			
		||||
		label: '添加时间',
 | 
			
		||||
		filter: parseTime
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'code',
 | 
			
		||||
		label: '批次号'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'name',
 | 
			
		||||
		label: '批次名称'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'materialCode',
 | 
			
		||||
		label: '物料编码'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'materialName',
 | 
			
		||||
		label: '物料名称'
 | 
			
		||||
	},
 | 
			
		||||
];
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	mixins: [basicPage],
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			urlOptions: {
 | 
			
		||||
				getDataListURL: getMaterDatePage,
 | 
			
		||||
				deleteURL: deleteMaterialDate,
 | 
			
		||||
				// exportURL: exportFactoryExcel,
 | 
			
		||||
			},
 | 
			
		||||
			tableProps,
 | 
			
		||||
			tableBtn: [
 | 
			
		||||
				this.$auth.hasPermi(`base:material-date:update`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'edit',
 | 
			
		||||
							btnName: '编辑',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
          this.$auth.hasPermi(`base:material-date:delete`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'delete',
 | 
			
		||||
							btnName: '删除',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
			].filter((v)=>v),
 | 
			
		||||
			tableData: [],
 | 
			
		||||
			formConfig: [
 | 
			
		||||
				{
 | 
			
		||||
					type: 'input',
 | 
			
		||||
					label: '批次名',
 | 
			
		||||
					placeholder: '批次名',
 | 
			
		||||
					param: 'name',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'button',
 | 
			
		||||
					btnName: '查询',
 | 
			
		||||
					name: 'search',
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'separate',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: this.$auth.hasPermi('base:material-date:create') ? 'button' : '',
 | 
			
		||||
					btnName: '新增',
 | 
			
		||||
					name: 'add',
 | 
			
		||||
					color: 'success',
 | 
			
		||||
					plain: true
 | 
			
		||||
				},
 | 
			
		||||
			],
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	components: {
 | 
			
		||||
		AddOrUpdate,
 | 
			
		||||
	},
 | 
			
		||||
	created() {},
 | 
			
		||||
	methods: {
 | 
			
		||||
		// 获取数据列表
 | 
			
		||||
    getDataList() {
 | 
			
		||||
      this.dataListLoading = true;
 | 
			
		||||
      this.urlOptions.getDataListURL(this.listQuery).then(response => {
 | 
			
		||||
        this.tableData = response.data.records;
 | 
			
		||||
        this.listQuery.total = response.data.total;
 | 
			
		||||
        this.dataListLoading = false;
 | 
			
		||||
      });
 | 
			
		||||
    },
 | 
			
		||||
		buttonClick(val) {
 | 
			
		||||
			switch (val.btnName) {
 | 
			
		||||
				case 'search':
 | 
			
		||||
					this.listQuery.pageNo = 1;
 | 
			
		||||
					this.listQuery.pageSize = 10;
 | 
			
		||||
					this.listQuery.name = val.name ? val.name : undefined;
 | 
			
		||||
					this.getDataList();
 | 
			
		||||
					break;
 | 
			
		||||
				case 'reset':
 | 
			
		||||
					this.$refs.searchBarForm.resetForm();
 | 
			
		||||
					this.listQuery = {
 | 
			
		||||
						pageSize: 10,
 | 
			
		||||
						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>
 | 
			
		||||
							
								
								
									
										469
									
								
								src/views/base/materialProductBom/add-or-updata.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										469
									
								
								src/views/base/materialProductBom/add-or-updata.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,469 @@
 | 
			
		||||
<!--
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2021-11-18 14:16:25
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @LastEditTime: 2023-10-27 16:06:44
 | 
			
		||||
 * @Description:
 | 
			
		||||
-->
 | 
			
		||||
<template>
 | 
			
		||||
	<el-drawer
 | 
			
		||||
		:visible.sync="visible"
 | 
			
		||||
		:show-close="false"
 | 
			
		||||
		:wrapper-closable="false"
 | 
			
		||||
		class="drawer"
 | 
			
		||||
		size="70%">
 | 
			
		||||
		<small-title slot="title" :no-padding="true">
 | 
			
		||||
			{{ isdetail ? '详情' : !dataForm.id ? '新增' : '编辑' }}
 | 
			
		||||
		</small-title>
 | 
			
		||||
		<div class="content">
 | 
			
		||||
			<div class="visual-part">
 | 
			
		||||
				<el-form
 | 
			
		||||
					:model="dataForm"
 | 
			
		||||
					:rules="dataRule"
 | 
			
		||||
					ref="dataForm"
 | 
			
		||||
					@keyup.enter.native="dataFormSubmit()"
 | 
			
		||||
					label-width="100px"
 | 
			
		||||
					label-position="top">
 | 
			
		||||
					<el-row :gutter="20">
 | 
			
		||||
						<el-col :span="12">
 | 
			
		||||
							<el-form-item label="产品名称" prop="productId">
 | 
			
		||||
								<el-select
 | 
			
		||||
									v-model="dataForm.productId"
 | 
			
		||||
									filterable
 | 
			
		||||
									:disabled="isdetail"
 | 
			
		||||
									placeholder="请选择产品">
 | 
			
		||||
									<el-option
 | 
			
		||||
										v-for="dict in productList"
 | 
			
		||||
										:key="dict.id"
 | 
			
		||||
										:label="dict.name"
 | 
			
		||||
										:value="dict.id" />
 | 
			
		||||
								</el-select>
 | 
			
		||||
							</el-form-item>
 | 
			
		||||
						</el-col>
 | 
			
		||||
						<el-col :span="12">
 | 
			
		||||
							<el-form-item label="产品BOM编码" prop="code">
 | 
			
		||||
								<el-input v-model="dataForm.code" disabled placeholder="请输入产品Bom编码" />
 | 
			
		||||
							</el-form-item>
 | 
			
		||||
						</el-col>
 | 
			
		||||
					</el-row>
 | 
			
		||||
					<el-form-item label="备注" prop="remark">
 | 
			
		||||
						<el-input v-model="dataForm.remark" :disabled="isdetail" clearable placeholder="请输入备注" />
 | 
			
		||||
					</el-form-item>
 | 
			
		||||
				</el-form>
 | 
			
		||||
			</div>
 | 
			
		||||
			<div class="attr-list" v-if="idAttrShow">
 | 
			
		||||
				<small-title
 | 
			
		||||
					style="margin: 16px 0; padding-left: 8px"
 | 
			
		||||
					:no-padding="true">
 | 
			
		||||
					BOM明细
 | 
			
		||||
				</small-title>
 | 
			
		||||
 | 
			
		||||
				<!-- <base-table
 | 
			
		||||
					:table-props="tableProps"
 | 
			
		||||
					:page="listQuery.pageNo"
 | 
			
		||||
					:limit="listQuery.pageSize"
 | 
			
		||||
					:add-button-show="isdetail ? null : '添加属性'"
 | 
			
		||||
					@emitButtonClick="addNew()"
 | 
			
		||||
					:table-data="materialAttrList">
 | 
			
		||||
					<method-btn
 | 
			
		||||
						v-if="!isdetail"
 | 
			
		||||
						slot="handleBtn"
 | 
			
		||||
						:width="120"
 | 
			
		||||
						label="操作"
 | 
			
		||||
						:method-list="tableBtn"
 | 
			
		||||
						@clickBtn="handleClick" />
 | 
			
		||||
				</base-table> -->
 | 
			
		||||
				<el-button v-show="!isdetail" type="success" size="small" style="float: right" @click="addRow()">添加一行</el-button>
 | 
			
		||||
				<el-table
 | 
			
		||||
					:data="tableData"
 | 
			
		||||
      		style="width: 100%">
 | 
			
		||||
					<el-table-column type="index" label="序号" />
 | 
			
		||||
					<el-table-column prop="createTime" label="添加时间">
 | 
			
		||||
						<template slot-scope="scope">
 | 
			
		||||
							<span>{{ parseTime(scope.row.createTime) }}</span>
 | 
			
		||||
						</template>
 | 
			
		||||
					</el-table-column>
 | 
			
		||||
					<el-table-column prop="materialId" label="物料名称">
 | 
			
		||||
						<template slot-scope="scope">
 | 
			
		||||
							<el-select
 | 
			
		||||
									v-model="scope.row.materialId"
 | 
			
		||||
									filterable
 | 
			
		||||
									:disabled="!scope.row.isEdit"
 | 
			
		||||
									placeholder="请选择物料"
 | 
			
		||||
									@change="setCode(scope.row)">
 | 
			
		||||
									<el-option
 | 
			
		||||
										v-for="dict in materialList"
 | 
			
		||||
										:key="dict.id"
 | 
			
		||||
										:label="dict.name"
 | 
			
		||||
										:value="dict.id" />
 | 
			
		||||
								</el-select>
 | 
			
		||||
						</template>
 | 
			
		||||
					</el-table-column>
 | 
			
		||||
					<el-table-column prop="materialCode" label="物料编码" />
 | 
			
		||||
					<el-table-column prop="mUnit" label="单位" />
 | 
			
		||||
					<el-table-column prop="num" label="数量">
 | 
			
		||||
						<template slot-scope="scope">
 | 
			
		||||
							<el-input v-model="scope.row.num" :disabled="!scope.row.isEdit"></el-input>
 | 
			
		||||
						</template>
 | 
			
		||||
					</el-table-column>
 | 
			
		||||
					<el-table-column prop="remark" label="备注">
 | 
			
		||||
						<template slot-scope="scope">
 | 
			
		||||
							<el-input v-model="scope.row.remark" :disabled="!scope.row.isEdit"></el-input>
 | 
			
		||||
						</template>
 | 
			
		||||
					</el-table-column>
 | 
			
		||||
					<el-table-column v-if="!isdetail" label="操作">
 | 
			
		||||
						<template slot-scope="scope">
 | 
			
		||||
							<el-tooltip v-if="!scope.row.isEdit" placement="top" content="编辑">
 | 
			
		||||
								<el-button
 | 
			
		||||
									type="text"
 | 
			
		||||
									:style="{color:'#0B58FF'}"
 | 
			
		||||
									size="mini"
 | 
			
		||||
									@click="edit(scope.row)"
 | 
			
		||||
								>
 | 
			
		||||
									<!-- 此处的icon的名字命名为'table_'加上按钮的type -->
 | 
			
		||||
									<svg-icon style="width: 18px; height: 18px" class="item-icon" icon-class="edit" />
 | 
			
		||||
									<!-- <span>{{ item.btnName | i18nFilter }}</span> -->
 | 
			
		||||
								</el-button>
 | 
			
		||||
							</el-tooltip>
 | 
			
		||||
							<el-button v-else type="primary" size="small" @click="saveData(scope.row)">保存</el-button>
 | 
			
		||||
							<el-tooltip placement="top" content="删除">
 | 
			
		||||
								<el-button
 | 
			
		||||
									type="text"
 | 
			
		||||
									:style="{color:'#FF5454'}"
 | 
			
		||||
									size="mini"
 | 
			
		||||
									@click="deleteDetail(scope.row)"
 | 
			
		||||
								>
 | 
			
		||||
									<!-- 此处的icon的名字命名为'table_'加上按钮的type -->
 | 
			
		||||
									<svg-icon style="width: 18px; height: 18px" class="item-icon" icon-class="table_delete" />
 | 
			
		||||
									<!-- <span>{{ item.btnName | i18nFilter }}</span> -->
 | 
			
		||||
								</el-button>
 | 
			
		||||
							</el-tooltip>
 | 
			
		||||
						</template>
 | 
			
		||||
					</el-table-column>
 | 
			
		||||
				</el-table>
 | 
			
		||||
				<pagination
 | 
			
		||||
					v-show="listQuery.total > 0"
 | 
			
		||||
					:total="listQuery.total"
 | 
			
		||||
					:page.sync="listQuery.pageNo"
 | 
			
		||||
					:limit.sync="listQuery.pageSize"
 | 
			
		||||
					:page-sizes="[5, 10, 15]"
 | 
			
		||||
					@pagination="getList" />
 | 
			
		||||
			</div>
 | 
			
		||||
 | 
			
		||||
			<div class="drawer-body__footer">
 | 
			
		||||
				<el-button style="" @click="goback()">取消</el-button>
 | 
			
		||||
				<el-button v-if="isdetail" type="primary" @click="goEdit()">
 | 
			
		||||
					编辑
 | 
			
		||||
				</el-button>
 | 
			
		||||
				<el-button v-else type="primary" @click="dataFormSubmit()">确定</el-button>
 | 
			
		||||
			</div>
 | 
			
		||||
		</div>
 | 
			
		||||
 | 
			
		||||
		<!-- <attr-add
 | 
			
		||||
			v-if="addOrUpdateVisible"
 | 
			
		||||
			ref="addOrUpdate"
 | 
			
		||||
			:material-id="dataForm.id"
 | 
			
		||||
			@refreshDataList="getList" /> -->
 | 
			
		||||
	</el-drawer>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import basicAdd from '../../core/mixins/basic-add';
 | 
			
		||||
import { createMaterialPB, updateMaterialPB, getMaterialPB, getCode, getProList, getProBomList, createMaterialPBDet, updateMaterialPBDet, deleteMaterialPBDet } from "@/api/base/materialProductBom";
 | 
			
		||||
import { getMaterialList } from "@/api/base/material";
 | 
			
		||||
import { listData } from "@/api/system/dict/data";
 | 
			
		||||
import SmallTitle from '../material/SmallTitle';
 | 
			
		||||
import { parseTime } from '../../core/mixins/code-filter';
 | 
			
		||||
// import attrAdd from './attr-add';
 | 
			
		||||
 | 
			
		||||
const tableBtn = [
 | 
			
		||||
	{
 | 
			
		||||
		type: 'edit',
 | 
			
		||||
		btnName: '编辑',
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		type: 'delete',
 | 
			
		||||
		btnName: '删除',
 | 
			
		||||
	},
 | 
			
		||||
];
 | 
			
		||||
const tableProps = [
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'createTime',
 | 
			
		||||
		label: '添加时间',
 | 
			
		||||
		filter: parseTime,
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'attrName',
 | 
			
		||||
		label: '属性名',
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'attrValue',
 | 
			
		||||
		label: '属性值',
 | 
			
		||||
	},
 | 
			
		||||
];
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	mixins: [basicAdd],
 | 
			
		||||
	components: { SmallTitle },
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			tableBtn,
 | 
			
		||||
			tableProps,
 | 
			
		||||
			addOrUpdateVisible: false,
 | 
			
		||||
			urlOptions: {
 | 
			
		||||
			  isGetCode: true,
 | 
			
		||||
        codeURL: getCode,
 | 
			
		||||
				createURL: createMaterialPB,
 | 
			
		||||
				updateURL: updateMaterialPB,
 | 
			
		||||
				infoURL: getMaterialPB,
 | 
			
		||||
			},
 | 
			
		||||
			listQuery: {
 | 
			
		||||
				pageSize: 10,
 | 
			
		||||
				pageNo: 1,
 | 
			
		||||
				total: 0,
 | 
			
		||||
			},
 | 
			
		||||
			dataForm: {
 | 
			
		||||
        id: undefined,
 | 
			
		||||
        code: undefined,
 | 
			
		||||
        productId: '',
 | 
			
		||||
        remark: undefined,
 | 
			
		||||
			},
 | 
			
		||||
			productList: [],
 | 
			
		||||
			materialAttrList: [],
 | 
			
		||||
			materialList: [],
 | 
			
		||||
			tableData: [],
 | 
			
		||||
			unitList: [],
 | 
			
		||||
			visible: false,
 | 
			
		||||
			isdetail: false,
 | 
			
		||||
			idAttrShow: false,
 | 
			
		||||
			dataRule: {
 | 
			
		||||
        productId: [{ required: true, message: "产品不能为空", trigger: "blur" }]
 | 
			
		||||
      }
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	mounted() {
 | 
			
		||||
		this.getDict()
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		async getDict() {
 | 
			
		||||
			// 产品列表
 | 
			
		||||
			const proRes = await getProList();
 | 
			
		||||
			this.productList = proRes.data;
 | 
			
		||||
			// 物料列表
 | 
			
		||||
			const res = await getMaterialList();
 | 
			
		||||
			this.materialList = res.data;
 | 
			
		||||
			// 物料单位列表
 | 
			
		||||
			const unitRes = await listData({
 | 
			
		||||
				pageNo: 1,
 | 
			
		||||
        pageSize: 99,
 | 
			
		||||
        dictType: 'goods_unit',
 | 
			
		||||
			});
 | 
			
		||||
			this.unitList = unitRes.data.list.map(item => {
 | 
			
		||||
				return {
 | 
			
		||||
					label: item.label,
 | 
			
		||||
					value: Number(item.value)
 | 
			
		||||
				}
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
		initData() {
 | 
			
		||||
			// this.materialAttrList.splice(0);
 | 
			
		||||
			this.listQuery.total = 0;
 | 
			
		||||
		},
 | 
			
		||||
		deleteDetail(raw) {
 | 
			
		||||
			this.$confirm(
 | 
			
		||||
				`确定删除关于物料编码为${
 | 
			
		||||
					raw.materialCode}的数据?`,
 | 
			
		||||
				'提示',
 | 
			
		||||
				{
 | 
			
		||||
					confirmButtonText: '确定',
 | 
			
		||||
					cancelButtonText: '取消',
 | 
			
		||||
					type: 'warning',
 | 
			
		||||
				}
 | 
			
		||||
			)
 | 
			
		||||
				.then(() => {
 | 
			
		||||
					deleteMaterialPBDet(raw.id).then(({ data }) => {
 | 
			
		||||
						this.$message({
 | 
			
		||||
							message: '操作成功',
 | 
			
		||||
							type: 'success',
 | 
			
		||||
							duration: 1500,
 | 
			
		||||
							onClose: () => {
 | 
			
		||||
								this.getList();
 | 
			
		||||
							},
 | 
			
		||||
						});
 | 
			
		||||
					});
 | 
			
		||||
				})
 | 
			
		||||
				.catch(() => {});
 | 
			
		||||
		},
 | 
			
		||||
		setCode(row) {
 | 
			
		||||
			this.materialList.filter(item => {
 | 
			
		||||
				if (row.materialId === item.id) {
 | 
			
		||||
					row.materialCode = item.code
 | 
			
		||||
				}
 | 
			
		||||
				this.unitList.filter(u => {
 | 
			
		||||
					if (item.unit === u.value) {
 | 
			
		||||
						row.unit = u.value
 | 
			
		||||
						row.mUnit = u.label
 | 
			
		||||
					}
 | 
			
		||||
				})
 | 
			
		||||
				// return row.materialId === item.id
 | 
			
		||||
			})
 | 
			
		||||
			// row.materialCode = tempList[0].code
 | 
			
		||||
			// row.unit = tempList[0].unit
 | 
			
		||||
			console.log('row', row)
 | 
			
		||||
		},
 | 
			
		||||
		edit(row) {
 | 
			
		||||
			row.isEdit = true
 | 
			
		||||
		},
 | 
			
		||||
		saveData(row) {
 | 
			
		||||
			// this.$refs['dataForm'].validate((valid) => {
 | 
			
		||||
				// if (valid) {
 | 
			
		||||
				// 	修改的提交
 | 
			
		||||
				if (row.id) {
 | 
			
		||||
					updateMaterialPBDet({
 | 
			
		||||
						...row
 | 
			
		||||
					}).then((response) => {
 | 
			
		||||
						this.$modal.msgSuccess('修改成功');
 | 
			
		||||
						// this.visible = false;
 | 
			
		||||
						this.getList();
 | 
			
		||||
					});
 | 
			
		||||
					return;
 | 
			
		||||
				}
 | 
			
		||||
					// 添加的提交
 | 
			
		||||
			createMaterialPBDet({
 | 
			
		||||
				...row
 | 
			
		||||
			}).then((response) => {
 | 
			
		||||
				this.$modal.msgSuccess('新增成功');
 | 
			
		||||
				// this.visible = false;
 | 
			
		||||
				this.getList();
 | 
			
		||||
			});
 | 
			
		||||
				// }
 | 
			
		||||
			// });
 | 
			
		||||
		},
 | 
			
		||||
		getList() {
 | 
			
		||||
			// 获取产品Bom详细列表
 | 
			
		||||
			getProBomList({
 | 
			
		||||
				...this.listQuery,
 | 
			
		||||
				bomId: this.dataForm.id,
 | 
			
		||||
				createTime: ['2023-10-26 00:00:00', '2023-10-27 12:00:00']
 | 
			
		||||
			}).then((response) => {
 | 
			
		||||
				this.tableData = response.data.records.map(item => {
 | 
			
		||||
					this.unitList.filter(u => {
 | 
			
		||||
						if (item.unit === u.value) {
 | 
			
		||||
							item.mUnit = u.label
 | 
			
		||||
						}
 | 
			
		||||
					})
 | 
			
		||||
					item.isEdit = false
 | 
			
		||||
					return item
 | 
			
		||||
				});
 | 
			
		||||
				this.listQuery.total = response.data.total;
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
		// 构造一行
 | 
			
		||||
		addRow() {
 | 
			
		||||
			const row = {
 | 
			
		||||
				bomId: this.dataForm.id,
 | 
			
		||||
				materialId: '',
 | 
			
		||||
				num: 0,
 | 
			
		||||
				materialCode: undefined,
 | 
			
		||||
				unit: undefined,
 | 
			
		||||
				remark: '',
 | 
			
		||||
				isEdit: true
 | 
			
		||||
			}
 | 
			
		||||
			this.tableData.push(row)
 | 
			
		||||
		},
 | 
			
		||||
		init(id, isdetail) {
 | 
			
		||||
			this.initData();
 | 
			
		||||
			this.isdetail = isdetail || false;
 | 
			
		||||
			this.dataForm.id = id || undefined;
 | 
			
		||||
			this.visible = true;
 | 
			
		||||
			if (id) {
 | 
			
		||||
				this.idAttrShow = true
 | 
			
		||||
			} else {
 | 
			
		||||
				this.idAttrShow = false
 | 
			
		||||
			}
 | 
			
		||||
 | 
			
		||||
			this.$nextTick(() => {
 | 
			
		||||
				this.$refs['dataForm'].resetFields();
 | 
			
		||||
 | 
			
		||||
				if (this.dataForm.id) {
 | 
			
		||||
					// 获取物料详情
 | 
			
		||||
					this.urlOptions.infoURL(id).then(response => {
 | 
			
		||||
            this.dataForm = response.data;
 | 
			
		||||
          });
 | 
			
		||||
					// 获取Bom明细
 | 
			
		||||
					this.getList();
 | 
			
		||||
				} else {
 | 
			
		||||
					if (this.urlOptions.isGetCode) {
 | 
			
		||||
            this.getCode()
 | 
			
		||||
          }
 | 
			
		||||
				}
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
		goback() {
 | 
			
		||||
			this.$emit('refreshDataList');
 | 
			
		||||
			this.visible = false;
 | 
			
		||||
			// this.initData();
 | 
			
		||||
		},
 | 
			
		||||
		goEdit() {
 | 
			
		||||
			this.isdetail = false;
 | 
			
		||||
		},
 | 
			
		||||
		// 新增 / 修改
 | 
			
		||||
		addNew(id) {
 | 
			
		||||
			this.addOrUpdateVisible = true;
 | 
			
		||||
			this.$nextTick(() => {
 | 
			
		||||
				this.$refs.addOrUpdate.init(id);
 | 
			
		||||
			});
 | 
			
		||||
		}
 | 
			
		||||
	}
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
<style scoped>
 | 
			
		||||
.drawer >>> .el-drawer {
 | 
			
		||||
	border-radius: 8px 0 0 8px;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	flex-direction: column;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .el-form-item__label {
 | 
			
		||||
	padding: 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .el-drawer__header {
 | 
			
		||||
	margin: 0;
 | 
			
		||||
	padding: 32px 32px 24px;
 | 
			
		||||
	border-bottom: 1px solid #dcdfe6;
 | 
			
		||||
}
 | 
			
		||||
.drawer >>> .el-drawer__body {
 | 
			
		||||
	flex: 1;
 | 
			
		||||
	height: 1px;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	flex-direction: column;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .content {
 | 
			
		||||
	padding: 30px 24px;
 | 
			
		||||
	flex: 1;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	flex-direction: column;
 | 
			
		||||
	/* height: 100%; */
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .visual-part {
 | 
			
		||||
	flex: 1 auto;
 | 
			
		||||
	max-height: 76vh;
 | 
			
		||||
	overflow: hidden;
 | 
			
		||||
	overflow-y: scroll;
 | 
			
		||||
	padding-right: 10px; /* 调整滚动条样式 */
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer >>> .el-form,
 | 
			
		||||
.drawer >>> .attr-list {
 | 
			
		||||
	padding: 0 16px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.drawer-body__footer {
 | 
			
		||||
	display: flex;
 | 
			
		||||
	justify-content: flex-end;
 | 
			
		||||
	padding: 18px;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
							
								
								
									
										187
									
								
								src/views/base/materialProductBom/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										187
									
								
								src/views/base/materialProductBom/index.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,187 @@
 | 
			
		||||
<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">
 | 
			
		||||
			<method-btn
 | 
			
		||||
				v-if="tableBtn.length"
 | 
			
		||||
				slot="handleBtn"
 | 
			
		||||
				:width="220"
 | 
			
		||||
				label="操作"
 | 
			
		||||
				:method-list="tableBtn"
 | 
			
		||||
				@clickBtn="handleClick" />
 | 
			
		||||
		</base-table>
 | 
			
		||||
		<pagination
 | 
			
		||||
			:limit.sync="listQuery.pageSize"
 | 
			
		||||
			:page.sync="listQuery.pageNo"
 | 
			
		||||
			:total="listQuery.total"
 | 
			
		||||
			@pagination="getDataList" />
 | 
			
		||||
		<add-or-update
 | 
			
		||||
			v-if="addOrUpdateVisible"
 | 
			
		||||
			ref="addOrUpdate"
 | 
			
		||||
			@refreshDataList="getDataList" />
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import AddOrUpdate from './add-or-updata';
 | 
			
		||||
import basicPage from '../../core/mixins/basic-page';
 | 
			
		||||
// import { parseTime } from '../../core/mixins/code-filter';
 | 
			
		||||
import {
 | 
			
		||||
	getMaterialPBPage,
 | 
			
		||||
	deleteMaterialPB
 | 
			
		||||
} from '@/api/base/materialProductBom';
 | 
			
		||||
 | 
			
		||||
const tableProps = [
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'productName',
 | 
			
		||||
		label: '产品名称'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'code',
 | 
			
		||||
		label: '产品BOM编码'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'remark',
 | 
			
		||||
		label: '备注'
 | 
			
		||||
	}
 | 
			
		||||
];
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	mixins: [basicPage],
 | 
			
		||||
	components: {
 | 
			
		||||
		AddOrUpdate,
 | 
			
		||||
	},
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			urlOptions: {
 | 
			
		||||
				getDataListURL: getMaterialPBPage,
 | 
			
		||||
				deleteURL: deleteMaterialPB
 | 
			
		||||
				// exportURL: exportFactoryExcel,
 | 
			
		||||
			},
 | 
			
		||||
			tableProps,
 | 
			
		||||
			tableBtn: [
 | 
			
		||||
				this.$auth.hasPermi(`base:material-product-bom:update`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'edit',
 | 
			
		||||
							btnName: '编辑',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
					this.$auth.hasPermi(`base:material-product-bom:queryMaterial`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'search',
 | 
			
		||||
							btnName: '查看物料',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
					this.$auth.hasPermi(`base:material-product-bom:editMaterial`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'editMaterial',
 | 
			
		||||
							btnName: '编辑物料',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
          this.$auth.hasPermi(`base:material-product-bom:delete`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'delete',
 | 
			
		||||
							btnName: '删除',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
			].filter((v)=>v),
 | 
			
		||||
			tableData: [],
 | 
			
		||||
			formConfig: [
 | 
			
		||||
				{
 | 
			
		||||
					type: 'input',
 | 
			
		||||
					label: '关键字',
 | 
			
		||||
					placeholder: '物料名称',
 | 
			
		||||
					param: 'name',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'input',
 | 
			
		||||
					label: '关键字',
 | 
			
		||||
					placeholder: '物料编码',
 | 
			
		||||
					param: 'code',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'button',
 | 
			
		||||
					btnName: '查询',
 | 
			
		||||
					name: 'search',
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'separate',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: this.$auth.hasPermi('base:material:create') ? 'button' : '',
 | 
			
		||||
					btnName: '新增',
 | 
			
		||||
					name: 'add',
 | 
			
		||||
					color: 'success',
 | 
			
		||||
					plain: true
 | 
			
		||||
				},
 | 
			
		||||
			],
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	created() {},
 | 
			
		||||
	methods: {
 | 
			
		||||
		otherMethods(val) {
 | 
			
		||||
			if (val.type === 'search') {
 | 
			
		||||
				this.addOrUpdateVisible = true;
 | 
			
		||||
				this.addOrEditTitle = '详情';
 | 
			
		||||
				this.$nextTick(() => {
 | 
			
		||||
					this.$refs.addOrUpdate.init(val.data.id, true);
 | 
			
		||||
				});
 | 
			
		||||
			} else {
 | 
			
		||||
				this.addOrEditTitle = '编辑';
 | 
			
		||||
				this.addOrUpdateVisible = true;
 | 
			
		||||
				this.$nextTick(() => {
 | 
			
		||||
					this.$refs.addOrUpdate.init(val.data.id);
 | 
			
		||||
				});
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
		// 获取数据列表
 | 
			
		||||
    getDataList() {
 | 
			
		||||
      this.dataListLoading = true;
 | 
			
		||||
      this.urlOptions.getDataListURL(this.listQuery).then(response => {
 | 
			
		||||
        this.tableData = response.data.records;
 | 
			
		||||
        this.listQuery.total = response.data.total;
 | 
			
		||||
        this.dataListLoading = false;
 | 
			
		||||
      });
 | 
			
		||||
    },
 | 
			
		||||
		buttonClick(val) {
 | 
			
		||||
			switch (val.btnName) {
 | 
			
		||||
				case 'search':
 | 
			
		||||
					this.listQuery.pageNo = 1;
 | 
			
		||||
					this.listQuery.pageSize = 10;
 | 
			
		||||
					this.listQuery.name = val.name ? val.name : undefined;
 | 
			
		||||
					this.listQuery.code = val.code ? val.code : undefined;
 | 
			
		||||
					this.getDataList();
 | 
			
		||||
					break;
 | 
			
		||||
				case 'reset':
 | 
			
		||||
					this.$refs.searchBarForm.resetForm();
 | 
			
		||||
					this.listQuery = {
 | 
			
		||||
						pageSize: 10,
 | 
			
		||||
						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>
 | 
			
		||||
							
								
								
									
										258
									
								
								src/views/base/materialUseLog/add-or-updata.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										258
									
								
								src/views/base/materialUseLog/add-or-updata.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,258 @@
 | 
			
		||||
<!--
 | 
			
		||||
 * @Author: zwq
 | 
			
		||||
 * @Date: 2021-11-18 14:16:25
 | 
			
		||||
 * @LastEditors: DY
 | 
			
		||||
 * @LastEditTime: 2023-10-26 09:43:51
 | 
			
		||||
 * @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="materialId">
 | 
			
		||||
					<el-select
 | 
			
		||||
						v-model="dataForm.materialId"
 | 
			
		||||
						placeholder="请选择物料"
 | 
			
		||||
						clearable
 | 
			
		||||
						filterable
 | 
			
		||||
						@change="setCode"
 | 
			
		||||
					>
 | 
			
		||||
						<el-option
 | 
			
		||||
							v-for="dict in materialList"
 | 
			
		||||
							:key="dict.id"
 | 
			
		||||
							:label="dict.name"
 | 
			
		||||
							:value="dict.id" />
 | 
			
		||||
					</el-select>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="物料编码" prop="materialCode">
 | 
			
		||||
					<el-input
 | 
			
		||||
						v-model="dataForm.materialCode"
 | 
			
		||||
						clearable
 | 
			
		||||
						disabled
 | 
			
		||||
						placeholder="请输入物料编码" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="批次号" prop="materialDateId">
 | 
			
		||||
					<el-select
 | 
			
		||||
						v-model="dataForm.materialDateId"
 | 
			
		||||
						clearable
 | 
			
		||||
						filterable
 | 
			
		||||
						placeholder="请选择物料批次"
 | 
			
		||||
					>
 | 
			
		||||
						<el-option
 | 
			
		||||
							v-for="dict in materialDateList"
 | 
			
		||||
							:key="dict.id"
 | 
			
		||||
							:label="dict.code"
 | 
			
		||||
							:value="dict.id" />
 | 
			
		||||
					</el-select>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="使用设备" prop="equipmentId">
 | 
			
		||||
					<el-select
 | 
			
		||||
						v-model="dataForm.equipmentId"
 | 
			
		||||
						clearable
 | 
			
		||||
						filterable
 | 
			
		||||
						placeholder="请选择使用设备">
 | 
			
		||||
						<el-option
 | 
			
		||||
							v-for="dict in eqList"
 | 
			
		||||
							:key="dict.id"
 | 
			
		||||
							:label="dict.name"
 | 
			
		||||
							:value="dict.id" />
 | 
			
		||||
					</el-select>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="使用时间" prop="useTime">
 | 
			
		||||
					<el-date-picker
 | 
			
		||||
						v-model="dataForm.useTime"
 | 
			
		||||
						type="datetime"
 | 
			
		||||
						format='yyyy-MM-dd HH:mm:ss'
 | 
			
		||||
         		value-format='timestamp'
 | 
			
		||||
						placeholder="选择日期时间" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="操作员" prop="userNames">
 | 
			
		||||
					<el-select
 | 
			
		||||
						v-model="dataForm.userNames"
 | 
			
		||||
						clearable
 | 
			
		||||
						filterable
 | 
			
		||||
						multiple
 | 
			
		||||
						placeholder="请选择操作员">
 | 
			
		||||
						<el-option
 | 
			
		||||
							v-for="dict in workersList"
 | 
			
		||||
							:key="dict.id"
 | 
			
		||||
							:label="dict.name"
 | 
			
		||||
							:value="dict.name" />
 | 
			
		||||
					</el-select>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="使用数量" prop="num">
 | 
			
		||||
					<el-input-number v-model="dataForm.num" clearable placeholder="请输入使用数量" />
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<el-form-item label="数据来源" prop="source">
 | 
			
		||||
					<el-select
 | 
			
		||||
						v-model="dataForm.source"
 | 
			
		||||
						clearable
 | 
			
		||||
						placeholder="请选择数据来源">
 | 
			
		||||
						<el-option
 | 
			
		||||
							v-for="dict in this.dataSourceList"
 | 
			
		||||
							:key="dict.id"
 | 
			
		||||
							:label="dict.name"
 | 
			
		||||
							:value="dict.id" />
 | 
			
		||||
					</el-select>
 | 
			
		||||
				</el-form-item>
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
		<el-form-item label="备注" prop="remark">
 | 
			
		||||
			<el-input v-model="dataForm.remark" clearable placeholder="请输入备注" />
 | 
			
		||||
		</el-form-item>
 | 
			
		||||
	</el-form>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import basicAdd from '../../core/mixins/basic-add';
 | 
			
		||||
import { createMaterialLog, updateMaterialLog, getMaterialLog, getEqListAll, getworkerAll } from "@/api/base/materialUseLog";
 | 
			
		||||
import { getMaterialList } from "@/api/base/material"
 | 
			
		||||
import { getMaterDateList } from "@/api/base/materialDate"
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	mixins: [basicAdd],
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			urlOptions: {
 | 
			
		||||
				createURL: createMaterialLog,
 | 
			
		||||
				updateURL: updateMaterialLog,
 | 
			
		||||
				infoURL: getMaterialLog
 | 
			
		||||
			},
 | 
			
		||||
			dataForm: {
 | 
			
		||||
        id: undefined,
 | 
			
		||||
				materialId: undefined,
 | 
			
		||||
        materialCode: undefined,
 | 
			
		||||
				materialDateId: undefined,
 | 
			
		||||
				equipmentId: undefined,
 | 
			
		||||
        userName: undefined,
 | 
			
		||||
				userNames: [],
 | 
			
		||||
				useTime: undefined,
 | 
			
		||||
        address: undefined,
 | 
			
		||||
				num: 0,
 | 
			
		||||
				source: undefined,
 | 
			
		||||
        remark: undefined
 | 
			
		||||
			},
 | 
			
		||||
			dataSourceList: [
 | 
			
		||||
				{
 | 
			
		||||
					id: 1,
 | 
			
		||||
					name: '手动'
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					id: 2,
 | 
			
		||||
					name: '自动'
 | 
			
		||||
				}
 | 
			
		||||
			],
 | 
			
		||||
			materialList: [],
 | 
			
		||||
			materialDateList: [],
 | 
			
		||||
			eqList: [],
 | 
			
		||||
			workersList: [],
 | 
			
		||||
			dataRule: {
 | 
			
		||||
        materialId: [{ required: true, message: "物料不能为空", trigger: "blur" }],
 | 
			
		||||
        materialDateId: [{ required: true, message: "批次号不能为空", trigger: "blur" }],
 | 
			
		||||
				useTime: [{ required: true, message: "使用时间不能为空", trigger: "blur" }],
 | 
			
		||||
				userNames: [{ required: true, message: "操作员不能为空", trigger: "blur" }],
 | 
			
		||||
				num: [{ required: true, message: "使用数量不能为空", trigger: "blur" }]
 | 
			
		||||
      }
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	mounted() {
 | 
			
		||||
		this.getDictData()
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		async getDictData() {
 | 
			
		||||
			const materRes = await getMaterialList()
 | 
			
		||||
			this.materialList = materRes.data
 | 
			
		||||
			console.log('你好', this.materialList)
 | 
			
		||||
			const dateRes = await getMaterDateList()
 | 
			
		||||
			this.materialDateList = dateRes.data
 | 
			
		||||
			const eqRes = await getEqListAll()
 | 
			
		||||
			this.eqList = eqRes.data
 | 
			
		||||
			const workerRes = await getworkerAll()
 | 
			
		||||
			this.workersList = workerRes.data
 | 
			
		||||
		},
 | 
			
		||||
		// 表单提交
 | 
			
		||||
    dataFormSubmit() {
 | 
			
		||||
			this.dataForm.userName = this.dataForm.userNames.join(',')
 | 
			
		||||
      this.$refs["dataForm"].validate((valid) => {
 | 
			
		||||
        if (!valid) {
 | 
			
		||||
          return false;
 | 
			
		||||
        }
 | 
			
		||||
        // 修改的提交
 | 
			
		||||
        if (this.dataForm.id) {
 | 
			
		||||
          this.urlOptions.updateURL(this.dataForm).then(response => {
 | 
			
		||||
            this.$modal.msgSuccess("修改成功");
 | 
			
		||||
            this.visible = false;
 | 
			
		||||
            this.$emit("refreshDataList");
 | 
			
		||||
          });
 | 
			
		||||
          return;
 | 
			
		||||
        }
 | 
			
		||||
        // 添加的提交
 | 
			
		||||
        this.urlOptions.createURL(this.dataForm).then(response => {
 | 
			
		||||
          this.$modal.msgSuccess("新增成功");
 | 
			
		||||
          this.visible = false;
 | 
			
		||||
          this.$emit("refreshDataList");
 | 
			
		||||
        });
 | 
			
		||||
      });
 | 
			
		||||
    },
 | 
			
		||||
		init(id) {
 | 
			
		||||
      this.dataForm.id = id || undefined;
 | 
			
		||||
      this.visible = true;
 | 
			
		||||
 | 
			
		||||
      this.$nextTick(() => {
 | 
			
		||||
        this.$refs["dataForm"].resetFields();
 | 
			
		||||
        if (this.dataForm.id) {
 | 
			
		||||
          this.urlOptions.infoURL(id).then(response => {
 | 
			
		||||
            this.dataForm.id = response.data.id
 | 
			
		||||
						this.dataForm.materialCode = response.data.materialCode
 | 
			
		||||
						this.dataForm.materialId = response.data.materialId
 | 
			
		||||
						this.dataForm.materialDateId = response.data.materialDateId
 | 
			
		||||
						this.dataForm.equipmentId = response.data.equipmentId
 | 
			
		||||
						this.dataForm.useTime = response.data.useTime
 | 
			
		||||
						// this.dataForm.userName = response.data.userName
 | 
			
		||||
						this.dataForm.num = response.data.num
 | 
			
		||||
						this.dataForm.source = response.data.source
 | 
			
		||||
						this.dataForm.remark = response.data.remark
 | 
			
		||||
						this.dataForm.userNames = response.data.userName.split(',')
 | 
			
		||||
						console.log('打印', this.dataForm)
 | 
			
		||||
          });
 | 
			
		||||
        } else {
 | 
			
		||||
          if (this.urlOptions.isGetCode) {
 | 
			
		||||
            this.getCode()
 | 
			
		||||
          }
 | 
			
		||||
				}
 | 
			
		||||
      });
 | 
			
		||||
    },
 | 
			
		||||
		setCode() {
 | 
			
		||||
			const tempMaterial = this.materialList.filter(item =>{
 | 
			
		||||
				return item.id === this.dataForm.materialId
 | 
			
		||||
			})
 | 
			
		||||
			this.dataForm.materialCode = tempMaterial[0].code
 | 
			
		||||
		}
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
							
								
								
									
										212
									
								
								src/views/base/materialUseLog/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										212
									
								
								src/views/base/materialUseLog/index.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,212 @@
 | 
			
		||||
<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">
 | 
			
		||||
			<method-btn
 | 
			
		||||
				v-if="tableBtn.length"
 | 
			
		||||
				slot="handleBtn"
 | 
			
		||||
				:width="120"
 | 
			
		||||
				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"
 | 
			
		||||
			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 '../../core/mixins/basic-page';
 | 
			
		||||
import { parseTime } from '../../core/mixins/code-filter';
 | 
			
		||||
import {
 | 
			
		||||
	getMaterialLogPage,
 | 
			
		||||
	deleteMaterialLog
 | 
			
		||||
} from '@/api/base/materialUseLog';
 | 
			
		||||
 | 
			
		||||
const tableProps = [
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'materialName',
 | 
			
		||||
		label: '物料名称'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'materialCode',
 | 
			
		||||
		label: '物料编码'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'materialDateId',
 | 
			
		||||
		label: '物料批次'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'equipName',
 | 
			
		||||
		label: '使用设备'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'num',
 | 
			
		||||
		label: '使用数量'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'useTime',
 | 
			
		||||
		label: '使用时间',
 | 
			
		||||
		filter: parseTime
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'userName',
 | 
			
		||||
		label: '操作人'
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'source',
 | 
			
		||||
		label: '数据来源',
 | 
			
		||||
		filter: (val) => ['未知', '手动', '自动'][val]
 | 
			
		||||
	},
 | 
			
		||||
	{
 | 
			
		||||
		prop: 'remark',
 | 
			
		||||
		label: '备注'
 | 
			
		||||
	}
 | 
			
		||||
];
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	mixins: [basicPage],
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			urlOptions: {
 | 
			
		||||
				getDataListURL: getMaterialLogPage,
 | 
			
		||||
				deleteURL: deleteMaterialLog,
 | 
			
		||||
				// exportURL: exportFactoryExcel,
 | 
			
		||||
			},
 | 
			
		||||
			tableProps,
 | 
			
		||||
			tableBtn: [
 | 
			
		||||
				this.$auth.hasPermi(`base:material-use-log:update`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'edit',
 | 
			
		||||
							btnName: '编辑',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
          this.$auth.hasPermi(`base:material-use-log:delete`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'delete',
 | 
			
		||||
							btnName: '删除',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
			].filter((v)=>v),
 | 
			
		||||
			tableData: [],
 | 
			
		||||
			listQuery: {
 | 
			
		||||
        pageSize: 10,
 | 
			
		||||
        pageNo: 1,
 | 
			
		||||
        total: 1,
 | 
			
		||||
				materialName: undefined,
 | 
			
		||||
				useTime: []
 | 
			
		||||
      },
 | 
			
		||||
			formConfig: [
 | 
			
		||||
				{
 | 
			
		||||
					type: 'input',
 | 
			
		||||
					label: '物料名称',
 | 
			
		||||
					placeholder: '物料名称',
 | 
			
		||||
					param: 'name',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
          type: 'datePicker',
 | 
			
		||||
          label: '使用时间段',
 | 
			
		||||
          dateType: 'datetimerange',
 | 
			
		||||
          format: 'yyyy-MM-dd',
 | 
			
		||||
          valueFormat: 'yyyy-MM-dd HH:mm:ss',
 | 
			
		||||
          rangeSeparator: '-',
 | 
			
		||||
          startPlaceholder: '开始时间',
 | 
			
		||||
          endPlaceholder: '结束时间',
 | 
			
		||||
          width: 350,
 | 
			
		||||
          param: 'time',
 | 
			
		||||
        },
 | 
			
		||||
				{
 | 
			
		||||
					type: 'button',
 | 
			
		||||
					btnName: '查询',
 | 
			
		||||
					name: 'search',
 | 
			
		||||
					color: 'primary'
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: 'separate',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: this.$auth.hasPermi('base:material-use-log:create') ? 'button' : '',
 | 
			
		||||
					btnName: '新增',
 | 
			
		||||
					name: 'add',
 | 
			
		||||
					color: 'success',
 | 
			
		||||
					plain: true
 | 
			
		||||
				},
 | 
			
		||||
			],
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	components: {
 | 
			
		||||
		AddOrUpdate,
 | 
			
		||||
	},
 | 
			
		||||
	created() {},
 | 
			
		||||
	methods: {
 | 
			
		||||
		// 获取数据列表
 | 
			
		||||
    getDataList() {
 | 
			
		||||
      this.dataListLoading = true;
 | 
			
		||||
      this.urlOptions.getDataListURL(this.listQuery).then(response => {
 | 
			
		||||
        this.tableData = response.data.records;
 | 
			
		||||
        this.listQuery.total = response.data.total;
 | 
			
		||||
        this.dataListLoading = false;
 | 
			
		||||
      });
 | 
			
		||||
    },
 | 
			
		||||
		buttonClick(val) {
 | 
			
		||||
			switch (val.btnName) {
 | 
			
		||||
				case 'search':
 | 
			
		||||
					this.listQuery.pageNo = 1;
 | 
			
		||||
					this.listQuery.pageSize = 10;
 | 
			
		||||
					this.listQuery.materialName = val.name ? val.name : undefined;
 | 
			
		||||
					if (val.time) {
 | 
			
		||||
						this.listQuery.useTime[0] = val.time[0]
 | 
			
		||||
						this.listQuery.useTime[1] = val.time[1]
 | 
			
		||||
					} else {
 | 
			
		||||
						this.listQuery.useTime = []
 | 
			
		||||
					}
 | 
			
		||||
					console.log('222', this.listQuery, val.time)
 | 
			
		||||
					this.getDataList();
 | 
			
		||||
					break;
 | 
			
		||||
				case 'reset':
 | 
			
		||||
					this.$refs.searchBarForm.resetForm();
 | 
			
		||||
					this.listQuery = {
 | 
			
		||||
						pageSize: 10,
 | 
			
		||||
						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>
 | 
			
		||||
@@ -18,7 +18,13 @@
 | 
			
		||||
				预览
 | 
			
		||||
			</div> -->
 | 
			
		||||
		</section>
 | 
			
		||||
		<section class="file-area">
 | 
			
		||||
		<section
 | 
			
		||||
			class="file-area"
 | 
			
		||||
			:style="{
 | 
			
		||||
				height: expand ? 'auto' : isPicMode ? '180px' : '152px',
 | 
			
		||||
				gap: isPicMode ? '0 24px' : '24px',
 | 
			
		||||
				gridAutoRows: isPicMode ? '180px' : '152px',
 | 
			
		||||
			}">
 | 
			
		||||
			<el-upload
 | 
			
		||||
				class="equipment-upload"
 | 
			
		||||
				:disabled="disabled"
 | 
			
		||||
@@ -56,7 +62,6 @@
 | 
			
		||||
				v-for="(file, index) in files"
 | 
			
		||||
				:key="file.fileName"
 | 
			
		||||
				:style="{
 | 
			
		||||
					display: index > 3 && !expand ? 'none' : 'block',
 | 
			
		||||
					background: isPicMode
 | 
			
		||||
						? `url(${file.fileUrl}) no-repeat`
 | 
			
		||||
						: `url(${defaultBg}) no-repeat`,
 | 
			
		||||
@@ -226,7 +231,7 @@ export default {
 | 
			
		||||
				clearTimeout(this.updateTimer);
 | 
			
		||||
			}
 | 
			
		||||
			this.updateTimer = setTimeout(() => {
 | 
			
		||||
				console.log('[AssetsUpload] 更新上传列表');
 | 
			
		||||
				// console.log('[AssetsUpload] 更新上传列表');
 | 
			
		||||
				this.emitFilelist();
 | 
			
		||||
				clearTimeout(this.updateTimer);
 | 
			
		||||
				this.updateTimer = null;
 | 
			
		||||
@@ -314,7 +319,6 @@ export default {
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
:deep(.equipment-upload) {
 | 
			
		||||
	background: #ccc4;
 | 
			
		||||
	.el-upload-dragger {
 | 
			
		||||
		width: 188px;
 | 
			
		||||
		height: 128px;
 | 
			
		||||
@@ -346,6 +350,10 @@ export default {
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-upload {
 | 
			
		||||
	margin-bottom: 24px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.file-list {
 | 
			
		||||
	padding: 12px;
 | 
			
		||||
	border: 1px solid #ccc;
 | 
			
		||||
@@ -354,13 +362,14 @@ export default {
 | 
			
		||||
// custom
 | 
			
		||||
.file-area {
 | 
			
		||||
	display: grid;
 | 
			
		||||
	grid-template-columns: repeat(5, 188px);
 | 
			
		||||
	grid-auto-rows: 128px;
 | 
			
		||||
	gap: 24px 18px;
 | 
			
		||||
	place-content: center;
 | 
			
		||||
	grid-template-columns: repeat(auto-fill, 188px);
 | 
			
		||||
	grid-auto-rows: 152px;
 | 
			
		||||
	gap: 48px 24px;
 | 
			
		||||
	overflow: hidden;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.file-list__item {
 | 
			
		||||
	height: 128px;
 | 
			
		||||
	background-color: #fff;
 | 
			
		||||
	border: 1px dashed #d9d9d9;
 | 
			
		||||
	border-radius: 6px;
 | 
			
		||||
 
 | 
			
		||||
@@ -1,32 +0,0 @@
 | 
			
		||||
<!-- 
 | 
			
		||||
    filename: EquipmentAssets.vue
 | 
			
		||||
    author: liubin
 | 
			
		||||
    date: 2023-08-22 11:11:18
 | 
			
		||||
    description: 设备资产
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
    <div class="equipment-assets"></div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
export default {
 | 
			
		||||
    name: "EquipmentAssets",
 | 
			
		||||
    components: {},
 | 
			
		||||
    props: {},
 | 
			
		||||
    data() {
 | 
			
		||||
        return {}
 | 
			
		||||
    },
 | 
			
		||||
    computed: {},
 | 
			
		||||
    methods: {},
 | 
			
		||||
}
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
.equipment-assets {
 | 
			
		||||
    background: #f1f1f1;
 | 
			
		||||
    padding: 12px;
 | 
			
		||||
    min-height: 128px;
 | 
			
		||||
    margin-top: 8px;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
@@ -283,7 +283,7 @@ export default {
 | 
			
		||||
		async getEqTypeList() {
 | 
			
		||||
			this.formLoading = true;
 | 
			
		||||
			const { code, data } = await this.$axios(
 | 
			
		||||
				'/base/equipment-type/page?pageNo=1&pageSize=100'
 | 
			
		||||
				'/base/core-equipment-type/page?pageNo=1&pageSize=100'
 | 
			
		||||
			);
 | 
			
		||||
			// debugger;
 | 
			
		||||
			if (code == 0) {
 | 
			
		||||
 
 | 
			
		||||
@@ -1,111 +0,0 @@
 | 
			
		||||
<!-- 
 | 
			
		||||
    filename: EquipmentPics.vue
 | 
			
		||||
    author: liubin
 | 
			
		||||
    date: 2023-08-18 16:29:39
 | 
			
		||||
    description: 
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
	<div class="equipment-pics">
 | 
			
		||||
		<div v-for="(url, idx) in images" :key="url">
 | 
			
		||||
			<img :src="url" :alt="url" />
 | 
			
		||||
			<figure class="big-img" :style="inlineStyle">
 | 
			
		||||
				<img :src="url" :alt="url" />
 | 
			
		||||
				<figcaption>{{ desc[idx] }}</figcaption>
 | 
			
		||||
			</figure>
 | 
			
		||||
		</div>
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'EquipmentPics',
 | 
			
		||||
	components: {},
 | 
			
		||||
	props: {
 | 
			
		||||
		inlineStyle: {
 | 
			
		||||
			type: Object,
 | 
			
		||||
			default: () => ({}),
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			desc: [
 | 
			
		||||
				'车间设备 - 1',
 | 
			
		||||
				'车间设备 - 2',
 | 
			
		||||
				'车间设备 - 3',
 | 
			
		||||
				'车间设备 - 4',
 | 
			
		||||
				'车间设备 - 5',
 | 
			
		||||
				'车间设备 - 6',
 | 
			
		||||
				'车间设备 - 7',
 | 
			
		||||
				'车间设备 - 8',
 | 
			
		||||
				'车间设备 - 9',
 | 
			
		||||
				'车间设备 - 10',
 | 
			
		||||
				'车间设备 - 11',
 | 
			
		||||
				'车间设备 - 12',
 | 
			
		||||
			],
 | 
			
		||||
			images: Array(10)
 | 
			
		||||
				.fill(1)
 | 
			
		||||
				.map((_, index) => require(`../assets/eq${index + 1}.jpg`)),
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	methods: {},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
.equipment-pics {
 | 
			
		||||
	// background: #cfcfcf;
 | 
			
		||||
	padding: 12px;
 | 
			
		||||
	// margin: 8px;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	overflow-x: auto;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-pics > div {
 | 
			
		||||
	height: 100px;
 | 
			
		||||
	position: relative;
 | 
			
		||||
	cursor: pointer;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-pics > div:not(:last-child) {
 | 
			
		||||
	margin-right: 12px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-pics > div > img {
 | 
			
		||||
	height: 95%;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-pics > div > figure {
 | 
			
		||||
	display: none;
 | 
			
		||||
	position: fixed;
 | 
			
		||||
	// inset: 0;
 | 
			
		||||
	// margin: auto;
 | 
			
		||||
	top: 0;
 | 
			
		||||
	right: 0;
 | 
			
		||||
	// width: 640px;
 | 
			
		||||
	// height: 480px;
 | 
			
		||||
	background: #000;
 | 
			
		||||
	overflow: hidden;
 | 
			
		||||
	padding: 8px 8px 0;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-pics > div:hover > figure {
 | 
			
		||||
	margin: 0;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	flex-direction: column;
 | 
			
		||||
	align-items: center;
 | 
			
		||||
	justify-content: center;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-pics > div > figure > img {
 | 
			
		||||
	flex: 1;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.equipment-pics > div > figure > figcaption {
 | 
			
		||||
	height: 24px;
 | 
			
		||||
	margin-top: 8px;
 | 
			
		||||
	font-size: 18px;
 | 
			
		||||
	line-height: 1;
 | 
			
		||||
	color: #fff;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
@@ -60,9 +60,9 @@
 | 
			
		||||
					name: '基本信息',
 | 
			
		||||
					key: 'base',
 | 
			
		||||
					rows: computedRows,
 | 
			
		||||
					url: '/base/equipment/get',
 | 
			
		||||
					urlUpdate: '/base/equipment/update',
 | 
			
		||||
					urlCreate: '/base/equipment/create',
 | 
			
		||||
					url: '/base/core-equipment/get',
 | 
			
		||||
					urlUpdate: '/base/core-equipment/update',
 | 
			
		||||
					urlCreate: '/base/core-equipment/create',
 | 
			
		||||
					queryParams: { id: form.id },
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
@@ -105,9 +105,6 @@
 | 
			
		||||
<script>
 | 
			
		||||
import moment from 'moment';
 | 
			
		||||
import basicPageMixin from '@/mixins/lb/basicPageMixin';
 | 
			
		||||
import { getAccessToken } from '@/utils/auth';
 | 
			
		||||
import EquipmentPics from './components/EquipmentPics';
 | 
			
		||||
import EquipmentAssets from './components/EquipmentAssets';
 | 
			
		||||
import EquipmentDrawer from './components/EquipmentDrawer';
 | 
			
		||||
 | 
			
		||||
import {
 | 
			
		||||
@@ -132,6 +129,12 @@ export default {
 | 
			
		||||
		return {
 | 
			
		||||
			searchBarKeys: ['name', 'code'],
 | 
			
		||||
			tableBtn: [
 | 
			
		||||
				this.$auth.hasPermi(`base:equipment:update`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'detail',
 | 
			
		||||
							btnName: '详情',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
				this.$auth.hasPermi('base:equipment:update')
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'edit',
 | 
			
		||||
@@ -144,12 +147,6 @@ export default {
 | 
			
		||||
							btnName: '删除',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
				this.$auth.hasPermi(`base:equipment:update`)
 | 
			
		||||
					? {
 | 
			
		||||
							type: 'detail',
 | 
			
		||||
							btnName: '详情',
 | 
			
		||||
					  }
 | 
			
		||||
					: undefined,
 | 
			
		||||
			].filter((v) => v),
 | 
			
		||||
			tableProps: [
 | 
			
		||||
				{
 | 
			
		||||
@@ -213,6 +210,13 @@ export default {
 | 
			
		||||
				{
 | 
			
		||||
					type: 'separate',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: this.$auth.hasPermi('base:equipment:export') ? 'button' : '',
 | 
			
		||||
					btnName: '导出',
 | 
			
		||||
					name: 'export',
 | 
			
		||||
					plain: true,
 | 
			
		||||
					color: 'primary',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: this.$auth.hasPermi('base:equipment:create') ? 'button' : '',
 | 
			
		||||
					btnName: '新增',
 | 
			
		||||
@@ -220,12 +224,6 @@ export default {
 | 
			
		||||
					plain: true,
 | 
			
		||||
					color: 'success',
 | 
			
		||||
				},
 | 
			
		||||
				{
 | 
			
		||||
					type: this.$auth.hasPermi('base:equipment:export') ? 'button' : '',
 | 
			
		||||
					btnName: '导出',
 | 
			
		||||
					name: 'export',
 | 
			
		||||
					color: 'warning',
 | 
			
		||||
				},
 | 
			
		||||
			],
 | 
			
		||||
			rows: [
 | 
			
		||||
				[
 | 
			
		||||
@@ -242,7 +240,7 @@ export default {
 | 
			
		||||
						input: true,
 | 
			
		||||
						label: '设备编码',
 | 
			
		||||
						prop: 'code',
 | 
			
		||||
						url: '/base/equipment/getCode',
 | 
			
		||||
						url: '/base/core-equipment/getCode',
 | 
			
		||||
					},
 | 
			
		||||
					{
 | 
			
		||||
						input: true,
 | 
			
		||||
@@ -269,7 +267,7 @@ export default {
 | 
			
		||||
						select: true,
 | 
			
		||||
						label: '设备类型',
 | 
			
		||||
						prop: 'equipmentTypeId',
 | 
			
		||||
						url: '/base/equipment-type/page?pageNo=1&pageSize=100',
 | 
			
		||||
						url: '/base/core-equipment-type/page?pageNo=1&pageSize=100',
 | 
			
		||||
						bind: {
 | 
			
		||||
							filterable: true,
 | 
			
		||||
						},
 | 
			
		||||
 
 | 
			
		||||
@@ -37,7 +37,12 @@
 | 
			
		||||
			@close="cancel"
 | 
			
		||||
			@cancel="cancel"
 | 
			
		||||
			@confirm="submitForm">
 | 
			
		||||
			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows" />
 | 
			
		||||
			<DialogForm
 | 
			
		||||
				v-if="open"
 | 
			
		||||
				ref="form"
 | 
			
		||||
				v-model="form"
 | 
			
		||||
				:has-files="true"
 | 
			
		||||
				:rows="rows" />
 | 
			
		||||
		</base-dialog>
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
@@ -139,7 +144,7 @@ export default {
 | 
			
		||||
						input: true,
 | 
			
		||||
						label: '设备类型编码',
 | 
			
		||||
						prop: 'code',
 | 
			
		||||
						url: '/base/equipment-type/getCode',
 | 
			
		||||
						url: '/base/core-equipment-type/getCode',
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
@@ -147,7 +152,7 @@ export default {
 | 
			
		||||
						select: true,
 | 
			
		||||
						label: '父类',
 | 
			
		||||
						prop: 'parentId',
 | 
			
		||||
						url: '/base/equipment-type/page?pageNo=1&pageSize=100',
 | 
			
		||||
						url: '/base/core-equipment-type/page?pageNo=1&pageSize=100',
 | 
			
		||||
					},
 | 
			
		||||
					{},
 | 
			
		||||
				],
 | 
			
		||||
@@ -207,8 +212,6 @@ export default {
 | 
			
		||||
				name: undefined,
 | 
			
		||||
				parentId: undefined,
 | 
			
		||||
				remark: undefined,
 | 
			
		||||
				fileNames: [],
 | 
			
		||||
				fileUrls: [],
 | 
			
		||||
			};
 | 
			
		||||
			this.resetForm('form');
 | 
			
		||||
		},
 | 
			
		||||
 
 | 
			
		||||
@@ -416,7 +416,7 @@ export default {
 | 
			
		||||
		/** 准备设备数据 */
 | 
			
		||||
		async initEquipment() {
 | 
			
		||||
			const { code, data } = await this.$axios({
 | 
			
		||||
				url: '/base/equipment/listAll',
 | 
			
		||||
				url: '/base/core-equipment/listAll',
 | 
			
		||||
				method: 'get',
 | 
			
		||||
			});
 | 
			
		||||
			if (code == 0) {
 | 
			
		||||
 
 | 
			
		||||
@@ -223,7 +223,7 @@ export default {
 | 
			
		||||
		/** 准备设备数据 */
 | 
			
		||||
		async initEquipment() {
 | 
			
		||||
			const { code, data } = await this.$axios({
 | 
			
		||||
				url: '/base/equipment/listAll',
 | 
			
		||||
				url: '/base/core-equipment/listAll',
 | 
			
		||||
				method: 'get',
 | 
			
		||||
			});
 | 
			
		||||
			if (code == 0) {
 | 
			
		||||
 
 | 
			
		||||
							
								
								
									
										367
									
								
								src/views/extend/processFlow/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										367
									
								
								src/views/extend/processFlow/index.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,367 @@
 | 
			
		||||
<!-- 
 | 
			
		||||
    filename: index.vue
 | 
			
		||||
    author: liubin
 | 
			
		||||
    date: 2023-10-19 10:03:42
 | 
			
		||||
    description: 
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
	<div class="app-container">
 | 
			
		||||
		<!-- 搜索工作栏 -->
 | 
			
		||||
		<SearchBar :formConfigs="searchBarFormConfig" ref="search-bar" />
 | 
			
		||||
 | 
			
		||||
		<section class="process-flow">
 | 
			
		||||
			<el-button class="process-item__add-btn" @click="handleAdd">
 | 
			
		||||
				+ 新增工艺
 | 
			
		||||
			</el-button>
 | 
			
		||||
			<ProcessItem
 | 
			
		||||
				v-for="item in list"
 | 
			
		||||
				:key="item.id"
 | 
			
		||||
				:id="item.id"
 | 
			
		||||
				:name="item.name"
 | 
			
		||||
				:line="item.lineName"
 | 
			
		||||
				:desc="item.remark"
 | 
			
		||||
				:isActive="item.enabled"
 | 
			
		||||
				@edit="handleUpdate" />
 | 
			
		||||
		</section>
 | 
			
		||||
 | 
			
		||||
		<base-dialog
 | 
			
		||||
			:dialogTitle="title"
 | 
			
		||||
			:dialogVisible="open"
 | 
			
		||||
			@close="cancel"
 | 
			
		||||
			@cancel="cancel"
 | 
			
		||||
			width="45%"
 | 
			
		||||
			@confirm="submitForm">
 | 
			
		||||
			<DialogForm
 | 
			
		||||
				v-if="open"
 | 
			
		||||
				key="index-dialog-form"
 | 
			
		||||
				ref="form"
 | 
			
		||||
				v-model="form"
 | 
			
		||||
				:rows="rows" />
 | 
			
		||||
		</base-dialog>
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import basicPageMixin from '@/mixins/lb/basicPageMixin';
 | 
			
		||||
// import cache from '@/utils/cache';
 | 
			
		||||
 | 
			
		||||
const ProcessItem = {
 | 
			
		||||
	name: 'ProcessItem',
 | 
			
		||||
	components: {},
 | 
			
		||||
	props: ['id', 'name', 'line', 'desc', 'isActive'],
 | 
			
		||||
	data() {
 | 
			
		||||
		return {};
 | 
			
		||||
	},
 | 
			
		||||
	computed: {},
 | 
			
		||||
	methods: {
 | 
			
		||||
		handleEdit() {
 | 
			
		||||
			this.$emit('edit', this.id);
 | 
			
		||||
		},
 | 
			
		||||
		handleViewDetail(e) {
 | 
			
		||||
			this.$router.push({
 | 
			
		||||
				name: 'ProcessFlowView',
 | 
			
		||||
				params: {
 | 
			
		||||
					id: this.id,
 | 
			
		||||
				},
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
	render: function (h) {
 | 
			
		||||
		return (
 | 
			
		||||
			<div
 | 
			
		||||
				class={'process-item' + (this.isActive ? ' active' : '')}
 | 
			
		||||
				style="display: flex; flex-direction: column; position: relative;">
 | 
			
		||||
				<div
 | 
			
		||||
					class="process-item__content"
 | 
			
		||||
					style="flex: 1; display: flex; align-items: center; cursor: pointer;"
 | 
			
		||||
					title="点击查看详细工序列表"
 | 
			
		||||
					onClick={this.handleViewDetail}>
 | 
			
		||||
					{this.isActive ? (
 | 
			
		||||
						<span style="display: inline-block; width: 10px; height: 10px; border-radius: 100%; background: #0ebe3a; position: absolute; top: 20px; right: 20px;" />
 | 
			
		||||
					) : (
 | 
			
		||||
						''
 | 
			
		||||
					)}
 | 
			
		||||
					<svg-icon
 | 
			
		||||
						icon-class="tree-table"
 | 
			
		||||
						style="margin-left: 12px; width: 48px; height: 48px; color: #0858ff33"
 | 
			
		||||
					/>
 | 
			
		||||
					<div
 | 
			
		||||
						class="info"
 | 
			
		||||
						style="margin-left: 12px; display: flex; flex-direction: column;">
 | 
			
		||||
						<h2 style="margin: 20px 0 0; font-weight: 600; font-size: 18px; ">
 | 
			
		||||
							{this.name}
 | 
			
		||||
						</h2>
 | 
			
		||||
						<h3 style="margin: 0;  font-weight: 400; font-size: 14px; line-height: 2; color: #888;">
 | 
			
		||||
							{this.line || '/'}
 | 
			
		||||
						</h3>
 | 
			
		||||
						<p style="margin: 0; text-overflow: ellipse; white-space: nowrap; font-weight: 400; font-size: 14px; line-height: 1.25; color: #888;">
 | 
			
		||||
							{this.desc}
 | 
			
		||||
						</p>
 | 
			
		||||
					</div>
 | 
			
		||||
				</div>
 | 
			
		||||
				<div
 | 
			
		||||
					class="process-item__footer"
 | 
			
		||||
					style="background: #f7f9fa; border-top: 1px solid #0001;">
 | 
			
		||||
					<el-row gutter={20}>
 | 
			
		||||
						<el-col
 | 
			
		||||
							span={8}
 | 
			
		||||
							style="text-align: center; border-right: 1px solid #0001">
 | 
			
		||||
							<el-button
 | 
			
		||||
								type="text"
 | 
			
		||||
								style="color: #0007; line-height: 1.75"
 | 
			
		||||
								onClick={this.handleEdit}>
 | 
			
		||||
								编辑
 | 
			
		||||
							</el-button>
 | 
			
		||||
						</el-col>
 | 
			
		||||
						<el-col
 | 
			
		||||
							span={8}
 | 
			
		||||
							style="text-align: center; border-right: 1px solid #0001">
 | 
			
		||||
							<el-button type="text" style="color: #0007; line-height: 1.75">
 | 
			
		||||
								复制
 | 
			
		||||
							</el-button>
 | 
			
		||||
						</el-col>
 | 
			
		||||
						<el-col span={8} style="text-align: center;">
 | 
			
		||||
							<el-button type="text" style="color: #0007; line-height: 1.75">
 | 
			
		||||
								删除
 | 
			
		||||
							</el-button>
 | 
			
		||||
						</el-col>
 | 
			
		||||
					</el-row>
 | 
			
		||||
				</div>
 | 
			
		||||
			</div>
 | 
			
		||||
		);
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'ProcessFlow',
 | 
			
		||||
	components: { ProcessItem },
 | 
			
		||||
	mixins: [basicPageMixin],
 | 
			
		||||
	props: {},
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			updateUrl: '/extend/process-flow/update',
 | 
			
		||||
			addUrl: '/extend/process-flow/create',
 | 
			
		||||
			pageUrl: '/extend/process-flow/page',
 | 
			
		||||
			infoUrl: '/extend/process-flow/get',
 | 
			
		||||
			searchBarKeys: ['name', 'code', 'lineId', 'productId'],
 | 
			
		||||
			searchBarFormConfig: [
 | 
			
		||||
				{
 | 
			
		||||
					label: '工艺流程列表',
 | 
			
		||||
				},
 | 
			
		||||
			],
 | 
			
		||||
			queryParams: {
 | 
			
		||||
				pageNo: 1,
 | 
			
		||||
				pageSize: 10,
 | 
			
		||||
				code: null,
 | 
			
		||||
				name: null,
 | 
			
		||||
				productId: null,
 | 
			
		||||
				lineId: null,
 | 
			
		||||
			},
 | 
			
		||||
			lineList: null,
 | 
			
		||||
			list: [],
 | 
			
		||||
			rows: [
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						input: true,
 | 
			
		||||
						label: '工艺名称',
 | 
			
		||||
						prop: 'name',
 | 
			
		||||
						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
						// bind: {
 | 
			
		||||
						// 	disabled: this.editMode == 'detail', // some condition, like detail mode...
 | 
			
		||||
						// }
 | 
			
		||||
					},
 | 
			
		||||
					{
 | 
			
		||||
						input: true,
 | 
			
		||||
						label: '工艺编码',
 | 
			
		||||
						prop: 'code',
 | 
			
		||||
						// url: '/base/core-equipment/getCode',
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						select: true,
 | 
			
		||||
						label: '产线',
 | 
			
		||||
						prop: 'lineId',
 | 
			
		||||
						// cache: 'processFlow::lineList',
 | 
			
		||||
						url: '/base/core-production-line/listAll',
 | 
			
		||||
						bind: {
 | 
			
		||||
							filterable: true,
 | 
			
		||||
						},
 | 
			
		||||
					},
 | 
			
		||||
 | 
			
		||||
					{
 | 
			
		||||
						switch: true,
 | 
			
		||||
						label: '是否启用',
 | 
			
		||||
						prop: 'enabled',
 | 
			
		||||
						bind: {
 | 
			
		||||
							'active-value': 1,
 | 
			
		||||
							'inactive-value': 0,
 | 
			
		||||
						},
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						textarea: true,
 | 
			
		||||
						label: '功能描述',
 | 
			
		||||
						prop: 'remark',
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
			],
 | 
			
		||||
			form: {
 | 
			
		||||
				id: null,
 | 
			
		||||
				code: null,
 | 
			
		||||
				name: null,
 | 
			
		||||
				productId: null,
 | 
			
		||||
				lineId: null,
 | 
			
		||||
				enabled: 1,
 | 
			
		||||
				remark: null,
 | 
			
		||||
				externalCode: null,
 | 
			
		||||
			},
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	computed: {},
 | 
			
		||||
	mounted() {
 | 
			
		||||
		this.getList();
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		cancel() {
 | 
			
		||||
			this.open = false;
 | 
			
		||||
			this.reset();
 | 
			
		||||
		},
 | 
			
		||||
		reset() {
 | 
			
		||||
			this.form = {
 | 
			
		||||
				id: null,
 | 
			
		||||
				code: null,
 | 
			
		||||
				name: null,
 | 
			
		||||
				productId: null,
 | 
			
		||||
				lineId: null,
 | 
			
		||||
				enabled: 1,
 | 
			
		||||
				remark: null,
 | 
			
		||||
				externalCode: null,
 | 
			
		||||
			};
 | 
			
		||||
			this.resetForm('form');
 | 
			
		||||
		},
 | 
			
		||||
		handleAdd() {
 | 
			
		||||
			this.reset();
 | 
			
		||||
			this.open = true;
 | 
			
		||||
			this.showUploadComponents = false;
 | 
			
		||||
			this.title = '添加工艺';
 | 
			
		||||
		},
 | 
			
		||||
		async handleUpdate(id) {
 | 
			
		||||
			this.reset();
 | 
			
		||||
			const { data } = await this.info({ id });
 | 
			
		||||
			this.form = data;
 | 
			
		||||
			this.open = true;
 | 
			
		||||
			this.title = '修改工艺';
 | 
			
		||||
		},
 | 
			
		||||
		submitForm() {
 | 
			
		||||
			this.$refs['form'].validate((valid) => {
 | 
			
		||||
				if (!valid) {
 | 
			
		||||
					return;
 | 
			
		||||
				}
 | 
			
		||||
				// 修改的提交
 | 
			
		||||
				if (this.form.id != null) {
 | 
			
		||||
					this.put(this.form).then((response) => {
 | 
			
		||||
						this.$modal.msgSuccess('修改成功');
 | 
			
		||||
						this.open = false;
 | 
			
		||||
						this.getList();
 | 
			
		||||
					});
 | 
			
		||||
					return;
 | 
			
		||||
				}
 | 
			
		||||
				// 添加的提交
 | 
			
		||||
				this.post(this.form).then((response) => {
 | 
			
		||||
					this.$modal.msgSuccess('新增成功');
 | 
			
		||||
					this.open = false;
 | 
			
		||||
					this.getList();
 | 
			
		||||
				});
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		async getList() {
 | 
			
		||||
			this.loading = true;
 | 
			
		||||
			const { code, data } = await this.recv(this.queryParams);
 | 
			
		||||
			if (code == 0) {
 | 
			
		||||
				this.list = data.list;
 | 
			
		||||
				this.total = data.total;
 | 
			
		||||
				this.loading = false;
 | 
			
		||||
				return;
 | 
			
		||||
			}
 | 
			
		||||
			this.loading = false;
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		// async getList() {
 | 
			
		||||
		// 	this.loading = true;
 | 
			
		||||
		// 	const { code, data } = await this.recv(this.queryParams);
 | 
			
		||||
		// 	if (code == 0) {
 | 
			
		||||
		// 		const list = [];
 | 
			
		||||
		// 		for (const item of data.list) {
 | 
			
		||||
		// 			const newItem = await this.itemAttachName(item);
 | 
			
		||||
		// 			list.push(newItem);
 | 
			
		||||
		// 		}
 | 
			
		||||
		// 		this.list = list;
 | 
			
		||||
		// 		this.total = data.total;
 | 
			
		||||
		// 		this.loading = false;
 | 
			
		||||
		// 		return;
 | 
			
		||||
		// 	}
 | 
			
		||||
		// 	this.loading = false;
 | 
			
		||||
		// },
 | 
			
		||||
 | 
			
		||||
		// async itemAttachName(item) {
 | 
			
		||||
		// 	if (!this.lineList) {
 | 
			
		||||
		// 		this.lineList = await cache.getList(
 | 
			
		||||
		// 			'processFlow::lineList',
 | 
			
		||||
		// 			async () => {
 | 
			
		||||
		// 				const { code, data } = await this.$axios(
 | 
			
		||||
		// 					'/base/core-production-line/listAll'
 | 
			
		||||
		// 				);
 | 
			
		||||
		// 				if (code == 0) {
 | 
			
		||||
		// 					return data;
 | 
			
		||||
		// 				}
 | 
			
		||||
		// 			}
 | 
			
		||||
		// 		);
 | 
			
		||||
		// 	}
 | 
			
		||||
		// 	return {
 | 
			
		||||
		// 		...item,
 | 
			
		||||
		// 		lineName: this.lineList.find((line) => line.id == item.lineId)?.name,
 | 
			
		||||
		// 	};
 | 
			
		||||
		// },
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
.process-flow {
 | 
			
		||||
	display: grid;
 | 
			
		||||
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
 | 
			
		||||
	grid-auto-rows: 200px;
 | 
			
		||||
	gap: 24px;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.process-item__add-btn {
 | 
			
		||||
	display: grid;
 | 
			
		||||
	border: 1px solid #ccc;
 | 
			
		||||
	font-size: 20px;
 | 
			
		||||
	color: #ccc;
 | 
			
		||||
	border-style: dashed;
 | 
			
		||||
	border-radius: 6px;
 | 
			
		||||
	place-items: center;
 | 
			
		||||
	cursor: pointer;
 | 
			
		||||
	transition: all 0.2s ease-in;
 | 
			
		||||
 | 
			
		||||
	&:hover {
 | 
			
		||||
		color: #555;
 | 
			
		||||
		border-color: #555;
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.process-item {
 | 
			
		||||
	border-radius: 4px;
 | 
			
		||||
	box-shadow: 0 0 6px 1px #ccc;
 | 
			
		||||
	overflow: hidden;
 | 
			
		||||
 | 
			
		||||
	// &.active {
 | 
			
		||||
	// 	box-shadow: 0 0 6px 1px #18c8bf66;
 | 
			
		||||
	// }
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
							
								
								
									
										138
									
								
								src/views/extend/processFlowView/components/ProcessBomList.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										138
									
								
								src/views/extend/processFlowView/components/ProcessBomList.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,138 @@
 | 
			
		||||
<!-- 
 | 
			
		||||
    filename: ProcessBomList.vue
 | 
			
		||||
    author: liubin
 | 
			
		||||
    date: 2023-10-20 15:00:58
 | 
			
		||||
    description: 
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
	<section class="process-bom">
 | 
			
		||||
		<SearchBar :formConfigs="searchBarFormConfig" ref="search-bar" />
 | 
			
		||||
 | 
			
		||||
		<div class="btns" style="
 | 
			
		||||
				text-align: right;
 | 
			
		||||
				position: absolute;
 | 
			
		||||
				top: 20px;
 | 
			
		||||
				right: 20px;
 | 
			
		||||
				display: flex;
 | 
			
		||||
			">
 | 
			
		||||
			<el-button type="primary" plain :disabled="currentDet == null" class="btn-create" icon="el-icon-plus">
 | 
			
		||||
				分配设备
 | 
			
		||||
			</el-button>
 | 
			
		||||
			<el-input icon="el-icon-search" placeholder="搜索" v-model="searchText"  style="margin-left: 20px">
 | 
			
		||||
				<i slot="prefix" class="el-input__icon el-icon-search"></i>
 | 
			
		||||
			</el-input>
 | 
			
		||||
		</div>
 | 
			
		||||
 | 
			
		||||
		<!-- 列表 -->
 | 
			
		||||
		<base-table :table-props="tableProps" :page="queryParams.pageNo" :limit="queryParams.pageSize" :table-data="list"
 | 
			
		||||
			@emitFun="handleEmitFun">
 | 
			
		||||
			<method-btn v-if="tableBtn.length" slot="handleBtn" label="操作" :width="120" :method-list="tableBtn"
 | 
			
		||||
				@clickBtn="handleTableBtnClick" />
 | 
			
		||||
		</base-table>
 | 
			
		||||
 | 
			
		||||
		<!-- 分页组件 -->
 | 
			
		||||
		<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
 | 
			
		||||
			@pagination="getList" />
 | 
			
		||||
	</section>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'ProcessBom',
 | 
			
		||||
	components: {},
 | 
			
		||||
	props: {
 | 
			
		||||
		currentDet: {
 | 
			
		||||
			type: Object,
 | 
			
		||||
			default: null
 | 
			
		||||
		}
 | 
			
		||||
	},
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			searchBarFormConfig: [{ label: '工序下设备' }],
 | 
			
		||||
			tableProps: [
 | 
			
		||||
				// {
 | 
			
		||||
				// 	prop: 'createTime',
 | 
			
		||||
				// 	label: '添加时间',
 | 
			
		||||
				// 	fixed: true,
 | 
			
		||||
				// 	width: 180,
 | 
			
		||||
				// 	filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'),
 | 
			
		||||
				// },
 | 
			
		||||
				{ prop: 'name', label: '设备名称' },
 | 
			
		||||
				{ prop: 'code', label: '物料BOM' },
 | 
			
		||||
				{ prop: 'remark', label: '参数BOM' },
 | 
			
		||||
			],
 | 
			
		||||
			list: [],
 | 
			
		||||
			total: 0,
 | 
			
		||||
			tableBtn: [],
 | 
			
		||||
			queryParams: {
 | 
			
		||||
				pageNo: 1,
 | 
			
		||||
				pageSize: 10,
 | 
			
		||||
			},
 | 
			
		||||
			searchText: ''
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	watch: {
 | 
			
		||||
		currentDet: {
 | 
			
		||||
			handler(val) {
 | 
			
		||||
				if (val != null) {
 | 
			
		||||
					this.getList(val);
 | 
			
		||||
				} else {
 | 
			
		||||
					this.clearList();
 | 
			
		||||
				}
 | 
			
		||||
			},
 | 
			
		||||
			immediate: true,
 | 
			
		||||
			deep: true
 | 
			
		||||
		}
 | 
			
		||||
	},
 | 
			
		||||
	methods: {
 | 
			
		||||
		handleEmitFun() { },
 | 
			
		||||
		handleTableBtnClick() { },
 | 
			
		||||
		put(payload) {
 | 
			
		||||
			return this.http(this.updateUrl, 'put', payload);
 | 
			
		||||
		},
 | 
			
		||||
		post(payload) {
 | 
			
		||||
			return this.http(this.addUrl, 'post', payload);
 | 
			
		||||
		},
 | 
			
		||||
		recv(payload) {
 | 
			
		||||
			return this.http(this.pageUrl, 'get', payload);
 | 
			
		||||
		},
 | 
			
		||||
		info(payload) {
 | 
			
		||||
			return this.http(this.infoUrl, 'get', payload);
 | 
			
		||||
		},
 | 
			
		||||
		http(url, method, payload) {
 | 
			
		||||
			return this.$axios({
 | 
			
		||||
				url,
 | 
			
		||||
				method,
 | 
			
		||||
				params: method === 'get' ? payload : null,
 | 
			
		||||
				data: method !== 'get' ? payload : null,
 | 
			
		||||
			})
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		getList({ detId, detName, detDesc, flowId, sectionName } = {}) {
 | 
			
		||||
			console.log('get list')
 | 
			
		||||
 | 
			
		||||
		},
 | 
			
		||||
		getList() {
 | 
			
		||||
			this.list = [
 | 
			
		||||
				{ name: '1', code: 'bomg-1', remark: 'Tochter' },
 | 
			
		||||
				{ name: '2', code: 'bomg-2', remark: 'Bruder' },
 | 
			
		||||
				{ name: '3', code: 'bomg-3', remark: 'Kalt' },
 | 
			
		||||
			]
 | 
			
		||||
		},
 | 
			
		||||
		clearList() {
 | 
			
		||||
			this.list = [];
 | 
			
		||||
		}
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
.process-bom {
 | 
			
		||||
	position: relative;
 | 
			
		||||
	flex: 1;
 | 
			
		||||
	padding: 12px 20px;
 | 
			
		||||
	background: #fff;
 | 
			
		||||
	border-radius: 8px;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
							
								
								
									
										474
									
								
								src/views/extend/processFlowView/components/ProcessDetail.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										474
									
								
								src/views/extend/processFlowView/components/ProcessDetail.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,474 @@
 | 
			
		||||
<!-- 
 | 
			
		||||
    filename: ProcessGraph.vue
 | 
			
		||||
    author: liubin
 | 
			
		||||
    date: 2023-10-20 15:00:58
 | 
			
		||||
    description: 
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
	<section class="process-graph">
 | 
			
		||||
		<SearchBar :formConfigs="searchBarFormConfig" ref="search-bar" />
 | 
			
		||||
 | 
			
		||||
		<div class="btns" style="text-align: right; position: absolute; top: 20px; right: 20px">
 | 
			
		||||
			<el-button type="warning" @click="undo" plain v-if="allowUndo" :disabled="!allowUndo" icon="el-icon-back">
 | 
			
		||||
				撤销
 | 
			
		||||
			</el-button>
 | 
			
		||||
			<el-button type="warning" @click="redo" plain v-if="allowRedo" :disabled="!allowRedo">
 | 
			
		||||
				下一步
 | 
			
		||||
				<i class="el-icon-right el-icon--right"></i>
 | 
			
		||||
			</el-button>
 | 
			
		||||
			<el-button class="btn-refresh" @click="handleUpdateLayout" icon="el-icon-refresh">
 | 
			
		||||
				刷新布局</el-button>
 | 
			
		||||
			<el-button type="primary" plain class="btn-create" icon="el-icon-plus" @click="handleAdd">
 | 
			
		||||
				新建工序
 | 
			
		||||
			</el-button>
 | 
			
		||||
			<el-button class="btn-edit" :disabled="currentDet == null" @click="handleEdit">编辑</el-button>
 | 
			
		||||
		</div>
 | 
			
		||||
 | 
			
		||||
		<div class="process-graph__panel" ref="panel"></div>
 | 
			
		||||
 | 
			
		||||
		<base-dialog :dialogTitle="title" :dialogVisible="open" width="35%" @close="cancel" @cancel="cancel"
 | 
			
		||||
			@confirm="submitForm">
 | 
			
		||||
			<DialogForm v-if="open" ref="form" v-model="form" :rows="rows" />
 | 
			
		||||
		</base-dialog>
 | 
			
		||||
	</section>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import { Graph } from '@antv/x6';
 | 
			
		||||
import ProcessNode, { createProcessNode, CACHE_NAME, getSectionFrom } from './ProcessNode';
 | 
			
		||||
import DialogForm from '@/components/DialogForm';
 | 
			
		||||
// import { IdToName } from '@/utils'
 | 
			
		||||
 | 
			
		||||
Graph.registerNode('process-node', ProcessNode);
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'ProcessGraph',
 | 
			
		||||
	components: { DialogForm },
 | 
			
		||||
	props: {},
 | 
			
		||||
	inject: ['getFlowId'],
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			allowRedo: false,
 | 
			
		||||
			allowUndo: false,
 | 
			
		||||
			graph: null,
 | 
			
		||||
			searchBarFormConfig: [{ label: '工序列表' }],
 | 
			
		||||
			title: '',
 | 
			
		||||
			open: false,
 | 
			
		||||
			form: {
 | 
			
		||||
				name: '', // 工序名称
 | 
			
		||||
				sectionId: '', // 工段id
 | 
			
		||||
				remark: '', // 描述
 | 
			
		||||
			},
 | 
			
		||||
			rows: [
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						input: true,
 | 
			
		||||
						label: '工序名称',
 | 
			
		||||
						prop: 'name',
 | 
			
		||||
						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						select: true,
 | 
			
		||||
						label: '工段',
 | 
			
		||||
						prop: 'sectionId',
 | 
			
		||||
						url: '/base/core-workshop-section/listAll',
 | 
			
		||||
						rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
 | 
			
		||||
						bind: {
 | 
			
		||||
							filterable: true,
 | 
			
		||||
						},
 | 
			
		||||
						cache: CACHE_NAME
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
				[
 | 
			
		||||
					{
 | 
			
		||||
						textarea: true,
 | 
			
		||||
						label: '工序说明',
 | 
			
		||||
						prop: 'remark',
 | 
			
		||||
					},
 | 
			
		||||
				],
 | 
			
		||||
			],
 | 
			
		||||
			updateUrl: '/extend/process-flow-det/update',
 | 
			
		||||
			deleteUrl: '/extend/process-flow-det/delete',
 | 
			
		||||
			addUrl: '/extend/process-flow-det/create',
 | 
			
		||||
			// pageUrl: '/extend/process-flow-det/get',
 | 
			
		||||
			infoUrl: '/extend/process-flow-view/getByFlowId',
 | 
			
		||||
			layout: {
 | 
			
		||||
				id: null,
 | 
			
		||||
				flowId: null,
 | 
			
		||||
				content: '',
 | 
			
		||||
				createTime: null
 | 
			
		||||
			},
 | 
			
		||||
			currentDet: null,
 | 
			
		||||
			currentNode: null
 | 
			
		||||
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	watch: {
 | 
			
		||||
		'form.sectionId': {
 | 
			
		||||
			handler(id) {
 | 
			
		||||
			},
 | 
			
		||||
			immediate: false,
 | 
			
		||||
		},
 | 
			
		||||
		currentDet: {
 | 
			
		||||
			handler(val) {
 | 
			
		||||
				this.$emit('det-selected', val)
 | 
			
		||||
			},
 | 
			
		||||
			deep: true,
 | 
			
		||||
			immediate: true
 | 
			
		||||
		}
 | 
			
		||||
	},
 | 
			
		||||
	activated() {
 | 
			
		||||
		this.loadLayout().then(json => {
 | 
			
		||||
			this.initGraph(json)
 | 
			
		||||
		})
 | 
			
		||||
	},
 | 
			
		||||
	deactivated() {
 | 
			
		||||
		this.graph.dispose();
 | 
			
		||||
		this.$nextTick(() => {
 | 
			
		||||
			this.resetLayout();
 | 
			
		||||
			this.graph = null;
 | 
			
		||||
		})
 | 
			
		||||
	},
 | 
			
		||||
	computed: {},
 | 
			
		||||
	methods: {
 | 
			
		||||
 | 
			
		||||
		initGraph(json) {
 | 
			
		||||
			const graph = new Graph({
 | 
			
		||||
				container: this.$refs.panel,
 | 
			
		||||
				grid: {
 | 
			
		||||
					size: 10,
 | 
			
		||||
					visible: true,
 | 
			
		||||
				},
 | 
			
		||||
				history: true,
 | 
			
		||||
				selecting: {
 | 
			
		||||
					className: 'my-select'
 | 
			
		||||
				},
 | 
			
		||||
				connecting: {
 | 
			
		||||
					snap: true,
 | 
			
		||||
					allowBlank: false,
 | 
			
		||||
					allowLoop: false,
 | 
			
		||||
					allowNode: false,
 | 
			
		||||
					allowPort: true,
 | 
			
		||||
					allowEdge: false,
 | 
			
		||||
				},
 | 
			
		||||
				panning: true,
 | 
			
		||||
				// scroller: {
 | 
			
		||||
				// 	enabled: true,
 | 
			
		||||
				// 	pannable: true,
 | 
			
		||||
				// 	cursor: '',
 | 
			
		||||
				// 	width: 800,
 | 
			
		||||
				// 	height: 200
 | 
			
		||||
				// },
 | 
			
		||||
				mousewheel: {
 | 
			
		||||
					enabled: true,
 | 
			
		||||
					modifiers: ['ctrl', 'meta']
 | 
			
		||||
				}
 | 
			
		||||
			});
 | 
			
		||||
 | 
			
		||||
			graph.fromJSON(json)
 | 
			
		||||
			this.graph = graph;
 | 
			
		||||
			this.$nextTick(() => {
 | 
			
		||||
				this.registerGraphEvents();
 | 
			
		||||
			})
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		registerGraphEvents() {
 | 
			
		||||
			const reset = () => {
 | 
			
		||||
				const nodes = this.graph.getNodes();
 | 
			
		||||
				const edges = this.graph.getEdges();
 | 
			
		||||
				this.currentDet = null;
 | 
			
		||||
				this.currentNode = null;
 | 
			
		||||
 | 
			
		||||
				nodes.forEach(node => {
 | 
			
		||||
					node.attr('container/stroke', '#ccc');
 | 
			
		||||
				});
 | 
			
		||||
				edges.forEach(edge => {
 | 
			
		||||
					edge.attr('line/stroke', '#ccc')
 | 
			
		||||
				})
 | 
			
		||||
			}
 | 
			
		||||
 | 
			
		||||
			this.graph.on('node:click', ({ e, x, y, node, view }) => {
 | 
			
		||||
				reset();
 | 
			
		||||
				node.attr('container/stroke', '#0b58ff');
 | 
			
		||||
				const { detId, detName, detDesc, processId, sectionId, sectionName } = node.attrs;
 | 
			
		||||
				this.currentDet = {}
 | 
			
		||||
				this.$set(this.currentDet, 'detId', detId.text)
 | 
			
		||||
				this.$set(this.currentDet, 'sectionId', sectionId.text)
 | 
			
		||||
				this.$set(this.currentDet, 'detName', detName.text)
 | 
			
		||||
				this.$set(this.currentDet, 'detDesc', detDesc.text)
 | 
			
		||||
				this.$set(this.currentDet, 'flowId', processId.text)
 | 
			
		||||
				this.$set(this.currentDet, 'sectionName', sectionName.text)
 | 
			
		||||
				this.currentNode = node
 | 
			
		||||
			});
 | 
			
		||||
			this.graph.on('edge:click', ({ e, x, y, edge, view }) => {
 | 
			
		||||
				// console.log('edge clicked!', edge)
 | 
			
		||||
				reset();
 | 
			
		||||
				edge.attr('line/stroke', '#0b58ff')
 | 
			
		||||
			});
 | 
			
		||||
			this.graph.on('blank:click', ({ e, x, y }) => {
 | 
			
		||||
				reset();
 | 
			
		||||
			});
 | 
			
		||||
			this.graph.on('node:mouseenter', ({ node }) => {
 | 
			
		||||
				node.addTools({
 | 
			
		||||
					name: 'button-remove',
 | 
			
		||||
					args: {
 | 
			
		||||
						x: '100%',
 | 
			
		||||
						y: 0,
 | 
			
		||||
						offset: { x: 0, y: 0 },
 | 
			
		||||
						onClick: ({ e, cell, view }) => {
 | 
			
		||||
							this.$confirm(
 | 
			
		||||
								'确定删除这个工序吗?',
 | 
			
		||||
								'提示',
 | 
			
		||||
								{
 | 
			
		||||
									confirmButtonText: '确定',
 | 
			
		||||
									cancelButtonText: '取消',
 | 
			
		||||
									type: 'warning'
 | 
			
		||||
								}
 | 
			
		||||
							).then(() => {
 | 
			
		||||
								view.cell.remove()
 | 
			
		||||
							}).catch(err => {
 | 
			
		||||
								return;
 | 
			
		||||
							})
 | 
			
		||||
						}
 | 
			
		||||
					}
 | 
			
		||||
				})
 | 
			
		||||
			});
 | 
			
		||||
			this.graph.on('node:mouseleave', ({ node }) => {
 | 
			
		||||
				node.removeTools();
 | 
			
		||||
			})
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		resetLayout() {
 | 
			
		||||
			this.layout = {
 | 
			
		||||
				id: null,
 | 
			
		||||
				flowId: null,
 | 
			
		||||
				content: '',
 | 
			
		||||
				createTime: null
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		async loadLayout() {
 | 
			
		||||
			const flowId = this.$route.params.id;
 | 
			
		||||
			if (!flowId) return { cells: [] }
 | 
			
		||||
			const { code, data } = await this.info({ id: flowId });
 | 
			
		||||
			if (code == 0) {
 | 
			
		||||
				if (data) {
 | 
			
		||||
					this.layout = data;
 | 
			
		||||
					return JSON.parse(data?.content) || { cells: [] };
 | 
			
		||||
				}
 | 
			
		||||
				return { cells: [] };
 | 
			
		||||
			}
 | 
			
		||||
			this.resetLayout();
 | 
			
		||||
			return Promise.reject(this.infoUrl + ' 接口出错!');
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		handleToJson() { },
 | 
			
		||||
 | 
			
		||||
		handleLoadJson() { },
 | 
			
		||||
 | 
			
		||||
		handleDumpJson() {
 | 
			
		||||
			if (this.graph) {
 | 
			
		||||
				console.log(JSON.stringify(this.graph.toJSON(), null, 2));
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		async handleUpdateLayout() {
 | 
			
		||||
			this.layout.content = JSON.stringify(this.graph.toJSON());
 | 
			
		||||
			let code, data;
 | 
			
		||||
			console.table([this.layout, this.$route.params.id])
 | 
			
		||||
			// 手动刷新布局
 | 
			
		||||
			if (this.layout.id) {
 | 
			
		||||
				({ code, data } = await this.http('/extend/process-flow-view/update', 'put', this.layout));
 | 
			
		||||
			} else {
 | 
			
		||||
				this.layout.flowId = this.$route.params.id;
 | 
			
		||||
				({ code, data } = await this.http('/extend/process-flow-view/create', 'post', this.layout));
 | 
			
		||||
			}
 | 
			
		||||
 | 
			
		||||
			if (code == 0) {
 | 
			
		||||
				this.$modal.msgSuccess('布局已刷新!')
 | 
			
		||||
			}
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		reset() {
 | 
			
		||||
			this.form = {
 | 
			
		||||
				name: '', // 工序名称
 | 
			
		||||
				sectionId: '', // 工段id
 | 
			
		||||
				remark: '', // 描述
 | 
			
		||||
			};
 | 
			
		||||
			this.resetForm('form');
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		/** 取消按钮 */
 | 
			
		||||
		cancel() {
 | 
			
		||||
			this.open = false;
 | 
			
		||||
			this.reset();
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		handleAdd() {
 | 
			
		||||
			this.reset();
 | 
			
		||||
			this.open = true;
 | 
			
		||||
			this.title = '添加工序';
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		handleEdit() {
 | 
			
		||||
			this.form.name = this.currentDet.detName;
 | 
			
		||||
			this.form.sectionId = this.currentDet.sectionId;
 | 
			
		||||
			this.form.remark = this.currentDet.detDesc;
 | 
			
		||||
			this.form.id = this.currentDet.detId;
 | 
			
		||||
			this.title = '编辑工序';
 | 
			
		||||
			this.$nextTick(() => {
 | 
			
		||||
				this.open = true;
 | 
			
		||||
			})
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		async handleDelete(id) {
 | 
			
		||||
			const { code, data } = await this.delete({ id });
 | 
			
		||||
			if (code == 0) {
 | 
			
		||||
				this.$msgSuccess('成功删除一个工序!');
 | 
			
		||||
				return true;
 | 
			
		||||
			}
 | 
			
		||||
			return false;
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		/** 提交按钮 */
 | 
			
		||||
		submitForm() {
 | 
			
		||||
			this.$refs['form'].validate((valid) => {
 | 
			
		||||
				if (!valid) {
 | 
			
		||||
					return;
 | 
			
		||||
				}
 | 
			
		||||
				// 修改的提交
 | 
			
		||||
				if (this.form.id != null) {
 | 
			
		||||
					this.updateProcess()
 | 
			
		||||
						.then((form) => {
 | 
			
		||||
							const { name, sectionId, remark } = form;
 | 
			
		||||
							getSectionFrom(sectionId).then(sectionName => {
 | 
			
		||||
								// 修改当前node的信息 
 | 
			
		||||
								this.currentNode.setAttrs({
 | 
			
		||||
									detName: { text: name },
 | 
			
		||||
									sectionId: { text: sectionId },
 | 
			
		||||
									sectionName: { text: sectionName },
 | 
			
		||||
									detDesc: { text: remark }
 | 
			
		||||
								})
 | 
			
		||||
							})
 | 
			
		||||
						})
 | 
			
		||||
						.catch(err => { });
 | 
			
		||||
					return;
 | 
			
		||||
				}
 | 
			
		||||
 | 
			
		||||
				this.createProcess()
 | 
			
		||||
					.then(({ id, name, sectionId, remark, flowId }) => {
 | 
			
		||||
						if (!id) return null;
 | 
			
		||||
						return createProcessNode({
 | 
			
		||||
							flowId: flowId,
 | 
			
		||||
							name, sectionId, remark,
 | 
			
		||||
							id,
 | 
			
		||||
						})
 | 
			
		||||
					}).then(node => {
 | 
			
		||||
						if (!node) {
 | 
			
		||||
							this.$modal.msgError('创建节点失败');
 | 
			
		||||
							return;
 | 
			
		||||
						};
 | 
			
		||||
						this.graph.addNode(node);
 | 
			
		||||
					}).catch(err => {
 | 
			
		||||
						return;
 | 
			
		||||
					});
 | 
			
		||||
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		updateProcess() {
 | 
			
		||||
			const flowId = this.getFlowId();
 | 
			
		||||
			if (!flowId) {
 | 
			
		||||
				this.$modal.msgError('工艺ID不能为空');
 | 
			
		||||
				return Promise.reject('工艺ID不能为空');
 | 
			
		||||
			}
 | 
			
		||||
			return this.put({ flowId, ...this.form })
 | 
			
		||||
				.then(({ code, data }) => {
 | 
			
		||||
					if (code == 0) {
 | 
			
		||||
						this.$modal.msgSuccess('修改成功');
 | 
			
		||||
					} else {
 | 
			
		||||
						this.$modal.msgError('修改失败');
 | 
			
		||||
					}
 | 
			
		||||
					const formCopy = { ...this.form }
 | 
			
		||||
					this.open = false;
 | 
			
		||||
					return formCopy;
 | 
			
		||||
				});
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		createProcess() {
 | 
			
		||||
			// const flowId = this.$route.params.id;
 | 
			
		||||
			const flowId = this.getFlowId(); // it also works
 | 
			
		||||
			if (!flowId) {
 | 
			
		||||
				this.$modal.msgError('工艺ID不能为空');
 | 
			
		||||
				return Promise.reject('工艺ID不能为空');
 | 
			
		||||
			}
 | 
			
		||||
			console.log('create process', this.form)
 | 
			
		||||
			// 添加的提交
 | 
			
		||||
			return this.post({ flowId, ...this.form }).then(
 | 
			
		||||
				({ code, data }) => {
 | 
			
		||||
					this.$modal.msgSuccess('新增成功');
 | 
			
		||||
					this.open = false;
 | 
			
		||||
					// this.getList();
 | 
			
		||||
					return {
 | 
			
		||||
						id: data, // 服务器返回的新建的工段id
 | 
			
		||||
						...this.form,  // 保存一份 this.form 副本,当 open->false 时 this.form 里的信息就清空了
 | 
			
		||||
						flowId
 | 
			
		||||
					};
 | 
			
		||||
				}
 | 
			
		||||
			).catch(err => {
 | 
			
		||||
				this.$msgError(err)
 | 
			
		||||
			});
 | 
			
		||||
		},
 | 
			
		||||
 | 
			
		||||
		put(payload) {
 | 
			
		||||
			return this.http(this.updateUrl, 'put', payload);
 | 
			
		||||
		},
 | 
			
		||||
		post(payload) {
 | 
			
		||||
			return this.http(this.addUrl, 'post', payload);
 | 
			
		||||
		},
 | 
			
		||||
		recv(payload) {
 | 
			
		||||
			return this.http(this.pageUrl, 'get', payload);
 | 
			
		||||
		},
 | 
			
		||||
		info(payload) {
 | 
			
		||||
			return this.http(this.infoUrl, 'get', payload);
 | 
			
		||||
		},
 | 
			
		||||
		delete(payload) {
 | 
			
		||||
			return this.http(this.deleteUrl, 'delete', payload);
 | 
			
		||||
		},
 | 
			
		||||
		http(url, method, payload) {
 | 
			
		||||
			return this.$axios({
 | 
			
		||||
				url,
 | 
			
		||||
				method,
 | 
			
		||||
				params: method === 'get' ? payload : null,
 | 
			
		||||
				data: method !== 'get' ? payload : null,
 | 
			
		||||
			})
 | 
			
		||||
		},
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
.process-graph {
 | 
			
		||||
	padding: 12px 20px 20px;
 | 
			
		||||
	background: #fff;
 | 
			
		||||
	border-radius: 8px;
 | 
			
		||||
	position: relative;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.process-graph__panel {
 | 
			
		||||
	height: 300px;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
 | 
			
		||||
<style>
 | 
			
		||||
.x6-widget-selection-selected {
 | 
			
		||||
	border: 1px solid red;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.my-select {
 | 
			
		||||
	border: 1px solid red;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
							
								
								
									
										133
									
								
								src/views/extend/processFlowView/components/ProcessInfo.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										133
									
								
								src/views/extend/processFlowView/components/ProcessInfo.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,133 @@
 | 
			
		||||
<!-- 
 | 
			
		||||
    filename: ProcessInfo.vue
 | 
			
		||||
    author: liubin
 | 
			
		||||
    date: 2023-10-20 15:00:58
 | 
			
		||||
    description: 
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
	<section class="process-info">
 | 
			
		||||
		<SearchBar :formConfigs="searchBarFormConfig" ref="search-bar" />
 | 
			
		||||
 | 
			
		||||
		<el-row :gutter="20">
 | 
			
		||||
			<el-col :span="6">
 | 
			
		||||
				<InfoItem label="工艺名称" :value="form.name" />
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="6">
 | 
			
		||||
				<InfoItem label="产线" :value="form.lineName" />
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="12">
 | 
			
		||||
				<InfoItem label="工艺描述" :value="form.remark" />
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
 | 
			
		||||
		<el-row :gutter="20" style="margin-top: 12px;">
 | 
			
		||||
			<el-col :span="6">
 | 
			
		||||
				<!-- <InfoItem label="创建人" value="xxse" /> -->
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="6">
 | 
			
		||||
				<InfoItem label="创建时间" :value="form.createTime" />
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="6">
 | 
			
		||||
				<!-- <InfoItem label="更新人" value="xxse" /> -->
 | 
			
		||||
			</el-col>
 | 
			
		||||
			<el-col :span="6">
 | 
			
		||||
				<!-- <InfoItem label="更新时间" value="2023-10-22 10:11:00" /> -->
 | 
			
		||||
			</el-col>
 | 
			
		||||
		</el-row>
 | 
			
		||||
	</section>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
 | 
			
		||||
const InfoItem = {
 | 
			
		||||
	name: 'InfoItem',
 | 
			
		||||
	components: {},
 | 
			
		||||
	props: ['label', 'value'],
 | 
			
		||||
	data() {
 | 
			
		||||
		return {};
 | 
			
		||||
	},
 | 
			
		||||
	computed: {},
 | 
			
		||||
	methods: {},
 | 
			
		||||
	render: function (h) {
 | 
			
		||||
		return (
 | 
			
		||||
			<div style="display: flex; align-items: center; font-size: 14px; line-height: 1.5">
 | 
			
		||||
				<span style="width: 100px; text-align: left; font-weight: 700">{this.label}:</span>
 | 
			
		||||
				<span style="width: 200px; text-align: left; text-overflow: ellipse; white-space: nowrap">
 | 
			
		||||
					{this.value}
 | 
			
		||||
				</span>
 | 
			
		||||
			</div>
 | 
			
		||||
		);
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'ProcessInfo',
 | 
			
		||||
	components: { InfoItem },
 | 
			
		||||
	props: {},
 | 
			
		||||
	inject: ['getFlowId'],
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			infoUrl: '/extend/process-flow/get',
 | 
			
		||||
			searchBarFormConfig: [{ label: '工艺详情' }],
 | 
			
		||||
			form: {
 | 
			
		||||
				id: null,
 | 
			
		||||
				name: null,
 | 
			
		||||
				lineName: null,
 | 
			
		||||
				createTime: null,
 | 
			
		||||
				remark: null,
 | 
			
		||||
				enable: null,
 | 
			
		||||
				code: null
 | 
			
		||||
			},
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	activated() {
 | 
			
		||||
		this.getInfo()
 | 
			
		||||
	},
 | 
			
		||||
	computed: {},
 | 
			
		||||
	methods: {
 | 
			
		||||
		// utils
 | 
			
		||||
		http(url, method, payload) {
 | 
			
		||||
			return this.$axios({
 | 
			
		||||
				url,
 | 
			
		||||
				method,
 | 
			
		||||
				params: method === 'get' ? payload : null,
 | 
			
		||||
				data: method !== 'get' ? payload : null,
 | 
			
		||||
			})
 | 
			
		||||
		},
 | 
			
		||||
		put(payload) {
 | 
			
		||||
			return this.http(this.updateUrl, 'put', payload);
 | 
			
		||||
		},
 | 
			
		||||
		post(payload) {
 | 
			
		||||
			return this.http(this.addUrl, 'post', payload);
 | 
			
		||||
		},
 | 
			
		||||
		recv(payload) {
 | 
			
		||||
			return this.http(this.pageUrl, 'get', payload);
 | 
			
		||||
		},
 | 
			
		||||
		info(payload) {
 | 
			
		||||
			return this.http(this.infoUrl, 'get', payload);
 | 
			
		||||
		},
 | 
			
		||||
		async getInfo() {
 | 
			
		||||
			const flowId = this.$route.params.id;
 | 
			
		||||
			if (!flowId) this.$router.go(-1);
 | 
			
		||||
			const { code, data } = await this.info({ id: flowId });
 | 
			
		||||
			// debugger;
 | 
			
		||||
			if (code == 0) {
 | 
			
		||||
				this.form = {
 | 
			
		||||
					...data
 | 
			
		||||
				};
 | 
			
		||||
			} else {
 | 
			
		||||
				this.$modal.msgError('工艺信息获取失败')
 | 
			
		||||
			}
 | 
			
		||||
		}
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
.process-info {
 | 
			
		||||
	padding: 12px 20px 20px;
 | 
			
		||||
	background: #fff;
 | 
			
		||||
	border-radius: 8px;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
							
								
								
									
										170
									
								
								src/views/extend/processFlowView/components/ProcessNode.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										170
									
								
								src/views/extend/processFlowView/components/ProcessNode.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,170 @@
 | 
			
		||||
import { Node, ObjectExt, Shape } from '@antv/x6';
 | 
			
		||||
import { IdToName } from '@/utils'
 | 
			
		||||
import cache from '@/utils/cache'
 | 
			
		||||
import axios from '@/utils/request'
 | 
			
		||||
import { v4 } from 'uuid'
 | 
			
		||||
 | 
			
		||||
Shape.Edge.config({
 | 
			
		||||
    attrs: {
 | 
			
		||||
        line: {
 | 
			
		||||
            stroke: '#ccc',
 | 
			
		||||
            strokeWidth: 1,
 | 
			
		||||
            targetMarker: {
 | 
			
		||||
                name: 'block',
 | 
			
		||||
                width: 1,
 | 
			
		||||
                height: 1
 | 
			
		||||
            },
 | 
			
		||||
        },
 | 
			
		||||
    }
 | 
			
		||||
})
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
export default class ProcessNode extends Node { }
 | 
			
		||||
ProcessNode.config({
 | 
			
		||||
    width: 200,
 | 
			
		||||
    height: 100,
 | 
			
		||||
    markup: [
 | 
			
		||||
        {
 | 
			
		||||
            tagName: 'rect',
 | 
			
		||||
            selector: 'container',
 | 
			
		||||
            attrs: {
 | 
			
		||||
                x: 0,
 | 
			
		||||
                y: 0,
 | 
			
		||||
                width: 200,
 | 
			
		||||
                height: 100,
 | 
			
		||||
                fill: 'transparent',
 | 
			
		||||
                stroke: '#ccc'
 | 
			
		||||
            },
 | 
			
		||||
        },
 | 
			
		||||
        {
 | 
			
		||||
            tagName: 'rect',
 | 
			
		||||
            attrs: {
 | 
			
		||||
                x: 0,
 | 
			
		||||
                y: 0,
 | 
			
		||||
                width: 200,
 | 
			
		||||
                height: 50,
 | 
			
		||||
                fill: '#ffffff',
 | 
			
		||||
            },
 | 
			
		||||
        },
 | 
			
		||||
        {
 | 
			
		||||
            tagName: 'rect',
 | 
			
		||||
            attrs: {
 | 
			
		||||
                x: 0,
 | 
			
		||||
                y: 50,
 | 
			
		||||
                width: 200,
 | 
			
		||||
                height: 50,
 | 
			
		||||
                fill: '#f8f8f8',
 | 
			
		||||
            },
 | 
			
		||||
        },
 | 
			
		||||
        {
 | 
			
		||||
            tagName: 'text',
 | 
			
		||||
            selector: 'detName',
 | 
			
		||||
            attrs: {
 | 
			
		||||
                x: 20,
 | 
			
		||||
                y: 30,
 | 
			
		||||
            },
 | 
			
		||||
        },
 | 
			
		||||
        {
 | 
			
		||||
            tagName: 'text',
 | 
			
		||||
            selector: 'sectionName',
 | 
			
		||||
            attrs: {
 | 
			
		||||
                x: 115,
 | 
			
		||||
                y: 30,
 | 
			
		||||
            },
 | 
			
		||||
        },
 | 
			
		||||
        {
 | 
			
		||||
            tagName: 'text',
 | 
			
		||||
            selector: 'detDesc',
 | 
			
		||||
            attrs: {
 | 
			
		||||
                x: 26,
 | 
			
		||||
                y: 80,
 | 
			
		||||
                fill: '#777',
 | 
			
		||||
                fontSize: 14,
 | 
			
		||||
                fill: '#1a90fc',
 | 
			
		||||
            },
 | 
			
		||||
        },
 | 
			
		||||
    ],
 | 
			
		||||
    attrs: {
 | 
			
		||||
        line: {
 | 
			
		||||
            fill: 'red'
 | 
			
		||||
        }
 | 
			
		||||
    },
 | 
			
		||||
    ports: {
 | 
			
		||||
        groups: {
 | 
			
		||||
            in: {
 | 
			
		||||
                position: 'left',
 | 
			
		||||
                attrs: {
 | 
			
		||||
                    circle: {
 | 
			
		||||
                        r: 2,
 | 
			
		||||
                        magnet: true,
 | 
			
		||||
                        stroke: '#0b58ff',
 | 
			
		||||
                        strokeWidth: 1,
 | 
			
		||||
                        fill: '#0b58ff'
 | 
			
		||||
                    }
 | 
			
		||||
                }
 | 
			
		||||
            },
 | 
			
		||||
            out: {
 | 
			
		||||
                position: 'right',
 | 
			
		||||
                attrs: {
 | 
			
		||||
                    circle: {
 | 
			
		||||
                        r: 2,
 | 
			
		||||
                        magnet: true,
 | 
			
		||||
                        stroke: '#0b58ff',
 | 
			
		||||
                        strokeWidth: 1,
 | 
			
		||||
                        fill: '#0b58ff'
 | 
			
		||||
                    }
 | 
			
		||||
                }
 | 
			
		||||
            }
 | 
			
		||||
        }
 | 
			
		||||
    },
 | 
			
		||||
    propHooks(metadata) {
 | 
			
		||||
        const { detId, detName, detDesc, sectionName, processId, sectionId, ...others } = metadata;
 | 
			
		||||
        // debugger;
 | 
			
		||||
        if (detName) ObjectExt.setByPath(others, 'attrs/detName/text', detName);
 | 
			
		||||
        if (detDesc) ObjectExt.setByPath(others, 'attrs/detDesc/text', detDesc);
 | 
			
		||||
        if (sectionName) ObjectExt.setByPath(others, 'attrs/sectionName/text', sectionName);
 | 
			
		||||
        if (detId) ObjectExt.setByPath(others, 'attrs/detId/text', detId);
 | 
			
		||||
        if (processId) ObjectExt.setByPath(others, 'attrs/processId/text', processId);
 | 
			
		||||
        if (sectionId) ObjectExt.setByPath(others, 'attrs/sectionId/text', sectionId);
 | 
			
		||||
        return others;
 | 
			
		||||
    }
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
export const CACHE_NAME = 'ProcessDetail::section';
 | 
			
		||||
 | 
			
		||||
export async function getSectionFrom(sectionId) {
 | 
			
		||||
    const sectionList = await cache.getList(
 | 
			
		||||
        CACHE_NAME,
 | 
			
		||||
        async () => {
 | 
			
		||||
            const { code, data } = await axios(
 | 
			
		||||
                '/base/core-production-line/listAll'
 | 
			
		||||
            );
 | 
			
		||||
            if (code == 0) {
 | 
			
		||||
                return data;
 | 
			
		||||
            }
 | 
			
		||||
        }
 | 
			
		||||
    );
 | 
			
		||||
    return IdToName(sectionId, sectionList);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export async function createProcessNode({ flowId, id, name, sectionId, remark }) {
 | 
			
		||||
    const sectionName = await getSectionFrom(sectionId);
 | 
			
		||||
    return {
 | 
			
		||||
        shape: 'process-node',
 | 
			
		||||
        x: 0,
 | 
			
		||||
        y: 0,
 | 
			
		||||
        detName: name, // 工序名称
 | 
			
		||||
        sectionName, // 工段
 | 
			
		||||
        sectionId,
 | 
			
		||||
        detDesc: remark, // 工序说明
 | 
			
		||||
        processId: flowId, // 工艺ID
 | 
			
		||||
        detId: id, // 工序ID
 | 
			
		||||
        tools: [],
 | 
			
		||||
        ports: [
 | 
			
		||||
            { id: v4(), group: 'in' },
 | 
			
		||||
            { id: v4(), group: 'out' },
 | 
			
		||||
        ]
 | 
			
		||||
    };
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export async function createEdge(src, dest) { }
 | 
			
		||||
							
								
								
									
										63
									
								
								src/views/extend/processFlowView/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										63
									
								
								src/views/extend/processFlowView/index.vue
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,63 @@
 | 
			
		||||
<!-- 
 | 
			
		||||
    filename: index.vue
 | 
			
		||||
    author: liubin
 | 
			
		||||
    date: 2023-10-18 12:25:46
 | 
			
		||||
    description: 
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<template>
 | 
			
		||||
	<div class="app-container process-flow-view">
 | 
			
		||||
		<ProcessInfo />
 | 
			
		||||
		<ProcessDetail style="margin-top: 16px" @det-selected="handleDetSelected" />
 | 
			
		||||
		<ProcessBomList style="margin-top: 16px" :current-det="currentDet" />
 | 
			
		||||
	</div>
 | 
			
		||||
</template>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
import ProcessInfo from './components/ProcessInfo.vue';
 | 
			
		||||
import ProcessBomList from './components/ProcessBomList.vue';
 | 
			
		||||
import ProcessDetail from './components/ProcessDetail.vue';
 | 
			
		||||
 | 
			
		||||
export default {
 | 
			
		||||
	name: 'ProcessFlowView',
 | 
			
		||||
	components: { ProcessInfo, ProcessDetail, ProcessBomList },
 | 
			
		||||
	props: {},
 | 
			
		||||
	data() {
 | 
			
		||||
		return {
 | 
			
		||||
			flowId: null,
 | 
			
		||||
			currentDet: null
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	provide() {
 | 
			
		||||
		const that = this;
 | 
			
		||||
		return {
 | 
			
		||||
			getFlowId() {
 | 
			
		||||
				return that.flowId;
 | 
			
		||||
			},
 | 
			
		||||
		};
 | 
			
		||||
	},
 | 
			
		||||
	activated() {
 | 
			
		||||
		console.log('activated...', this.$route.params);
 | 
			
		||||
		this.flowId = this.$route.params.id;
 | 
			
		||||
	},
 | 
			
		||||
	computed: {},
 | 
			
		||||
	methods: {
 | 
			
		||||
		handleDetSelected(det) {
 | 
			
		||||
			if (det != null) {
 | 
			
		||||
				this.currentDet = { ...det }
 | 
			
		||||
			}
 | 
			
		||||
			else this.currentDet = null;
 | 
			
		||||
		}
 | 
			
		||||
	},
 | 
			
		||||
};
 | 
			
		||||
</script>
 | 
			
		||||
 | 
			
		||||
<style scoped lang="scss">
 | 
			
		||||
.process-flow-view {
 | 
			
		||||
	padding: 8px;
 | 
			
		||||
	flex: 1;
 | 
			
		||||
	background: #f2f4f9;
 | 
			
		||||
	display: flex;
 | 
			
		||||
	flex-direction: column;
 | 
			
		||||
}
 | 
			
		||||
</style>
 | 
			
		||||
@@ -117,6 +117,7 @@ export default {
 | 
			
		||||
				{
 | 
			
		||||
					_action: 'params-monitor',
 | 
			
		||||
					label: '操作',
 | 
			
		||||
					width: 56,
 | 
			
		||||
					subcomponent: {
 | 
			
		||||
						props: ['injectData'],
 | 
			
		||||
						render: function (h) {
 | 
			
		||||
@@ -124,10 +125,10 @@ export default {
 | 
			
		||||
							return h(
 | 
			
		||||
								'el-button',
 | 
			
		||||
								{
 | 
			
		||||
									class: 'iconfont icon-detail',
 | 
			
		||||
									props: { type: 'text' },
 | 
			
		||||
									on: {
 | 
			
		||||
										click: function () {
 | 
			
		||||
											console.log('inejctdata', _this.injectData);
 | 
			
		||||
											_this.$emit('emitData', {
 | 
			
		||||
												action: _this.injectData._action,
 | 
			
		||||
												// value: _this.injectData.id,
 | 
			
		||||
@@ -135,8 +136,8 @@ export default {
 | 
			
		||||
											});
 | 
			
		||||
										},
 | 
			
		||||
									},
 | 
			
		||||
								},
 | 
			
		||||
								'查看详情'
 | 
			
		||||
								}
 | 
			
		||||
								// '查看详情'
 | 
			
		||||
							);
 | 
			
		||||
						},
 | 
			
		||||
					},
 | 
			
		||||
@@ -215,7 +216,7 @@ export default {
 | 
			
		||||
		/** 根据产线获取设备 */
 | 
			
		||||
		async getEquipmentList(id) {
 | 
			
		||||
			const { data } = await this.$axios({
 | 
			
		||||
				url: '/base/equipment/listByLine',
 | 
			
		||||
				url: '/base/core-equipment/listByLine',
 | 
			
		||||
				method: 'get',
 | 
			
		||||
				params: { id },
 | 
			
		||||
			});
 | 
			
		||||
 
 | 
			
		||||
@@ -64,6 +64,7 @@ export default {
 | 
			
		||||
				name: item.inspectionContent,
 | 
			
		||||
				type: 'bar',
 | 
			
		||||
				barCategoryGap: 12,
 | 
			
		||||
				barWidth: 20,
 | 
			
		||||
				data: [],
 | 
			
		||||
			};
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user