zhaoyiran
8 months ago
4 changed files with 652 additions and 22 deletions
@ -0,0 +1,8 @@ |
|||
import request from '@/config/axios' |
|||
|
|||
|
|||
|
|||
// 查询采样过程列表
|
|||
export const getInspectionProcessPage = async (params) => { |
|||
return await request.get({ url: `/qms/inspection-process/page`}) |
|||
} |
|||
@ -0,0 +1,304 @@ |
|||
<template> |
|||
<Dialog |
|||
:title="dialogTitle" |
|||
v-model="dialogVisible" |
|||
:width="dialogWidth" |
|||
:close-on-click-modal="false" |
|||
:vLoading="formLoading" |
|||
> |
|||
<div style="max-height: 60vh; overflow-y: auto; padding: 0px 20px"> |
|||
<Form ref="formRefMain" :schema="formAllSchemasMain" :is-col="true" /> |
|||
<div class="tab-pane"> |
|||
<div class="left"> |
|||
<div class="plus"> |
|||
<Icon icon="ep:plus" size="14" color="black" @click="addProcess" |
|||
/></div> |
|||
|
|||
<div class="left-list" v-for="(item, index) in data.list" :key="index"> |
|||
<div class="left-item" :class="chooseIndex == index ? 'active' : ''"> |
|||
<el-input |
|||
v-model="item.description" |
|||
style="width: 120px; margin: 0px 10px" |
|||
v-if="item.isEdit" |
|||
placeholder="请输入工序名称" |
|||
/> |
|||
<div class="name" v-else @click="chooseItem(item, index)">{{ item.description }}</div> |
|||
<Icon |
|||
icon="ep:select" |
|||
class="mr-5px ml-5px" |
|||
v-if="item.isEdit" |
|||
@click="editName(item)" |
|||
/> |
|||
<Icon icon="ep:edit" class="mr-5px ml-5px" v-else @click="editName(item)" /> |
|||
<Icon icon="ep:close" class="mr-5px" @click="delProcess(index)" /> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
<div class="right"> |
|||
<div class="small-title">检验工序</div> |
|||
<Form |
|||
ref="formRefProcess" |
|||
:schema="formAllSchemasProcess" |
|||
:is-col="true" |
|||
labelWidth="150px" |
|||
/> |
|||
<div class="small-title">检验特性</div> |
|||
<Form |
|||
ref="formRefFeatures" |
|||
:schema="formAllSchemasFeatures" |
|||
:is-col="true" |
|||
labelWidth="150px" |
|||
/> |
|||
</div> |
|||
</div> |
|||
<!-- <el-tabs |
|||
v-model="editableTabsValue" |
|||
editable |
|||
class="demo-tabs" |
|||
@edit="handleTabsEdit" |
|||
type="border-card" |
|||
tab-position="left" |
|||
> |
|||
<el-tab-pane |
|||
v-for="item in editableTabs" |
|||
:key="item.name" |
|||
:label="item.title" |
|||
:name="item.name" |
|||
> |
|||
<template #label> |
|||
<span class="custom-tabs-label"> |
|||
<el-icon><calendar /></el-icon> |
|||
<span>Route</span> |
|||
</span> |
|||
</template> |
|||
<div class="small-title">检验工序</div> |
|||
<Form |
|||
ref="formRefProcess" |
|||
:schema="formAllSchemasProcess" |
|||
:is-col="true" |
|||
labelWidth="150px" |
|||
/> |
|||
<div class="small-title">检验特性</div> |
|||
<Form |
|||
ref="formRefFeatures" |
|||
:schema="formAllSchemasFeatures" |
|||
:is-col="true" |
|||
labelWidth="150px" |
|||
/> |
|||
</el-tab-pane> |
|||
</el-tabs> --> |
|||
</div> |
|||
<template #footer> |
|||
<ButtonBase :Butttondata="Butttondata" @button-base-click="buttonBaseClick" /> |
|||
</template> |
|||
</Dialog> |
|||
</template> |
|||
|
|||
<script setup lang="ts"> |
|||
import * as defaultButtons from '@/utils/disposition/defaultButtons' |
|||
import { json } from 'stream/consumers' |
|||
const props = defineProps({ |
|||
// 显示窗口宽度设置 |
|||
basicFormWidth: { |
|||
type: String, |
|||
default: '' |
|||
}, |
|||
// 检验特性表单，列表 相关信息 |
|||
formAllSchemasFeatures: { |
|||
type: Object, |
|||
required: true, |
|||
default: null |
|||
}, |
|||
// 检验工序表单，列表 相关信息 |
|||
formAllSchemasProcess: { |
|||
type: Object, |
|||
required: true, |
|||
default: null |
|||
}, |
|||
// 检验模板表单，列表 相关信息 |
|||
formAllSchemasMain: { |
|||
type: Object, |
|||
required: true, |
|||
default: null |
|||
}, |
|||
// 底部按钮集合 |
|||
footButttondata: { |
|||
type: Array, |
|||
required: false, |
|||
default: null |
|||
} |
|||
}) |
|||
const { t } = useI18n() // 国际化 |
|||
|
|||
const dialogVisible = ref(true) // 弹窗的是否展示 |
|||
const dialogTitle = ref('') // 弹窗的标题 |
|||
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用 |
|||
const formType = ref('') // 表单的类型：create - 新增；update - 修改 |
|||
const dialogWidth = ref() |
|||
const form = reactive({ |
|||
name: '', |
|||
region: '', |
|||
date1: '', |
|||
date2: '', |
|||
delivery: false, |
|||
type: [], |
|||
resource: '', |
|||
desc: '' |
|||
}) |
|||
const chooseIndex = ref(0) |
|||
const formAllSchemasFeatures = ref(props.formAllSchemasFeatures?.formSchema) |
|||
const formAllSchemasProcess = ref(props.formAllSchemasProcess?.formSchema) |
|||
const formAllSchemasMain = ref(props.formAllSchemasMain?.formSchema) |
|||
|
|||
const formRefMain = ref('') |
|||
const formRefProcess = ref('') |
|||
const formRefFeatures = ref('') |
|||
|
|||
const onSubmit = () => { |
|||
console.log('submit!') |
|||
} |
|||
if (props.basicFormWidth) { |
|||
dialogWidth.value = props.basicFormWidth + '%' |
|||
} else { |
|||
dialogWidth.value = props.isBusiness ? '60%' : '40%' |
|||
} |
|||
/** 打开弹窗 */ |
|||
const open = async (type: string, row?: any, masterParmas?: any, titleName?: any) => { |
|||
dialogVisible.value = true |
|||
if (titleName) { |
|||
dialogTitle.value = t('action.' + titleName) |
|||
} else { |
|||
dialogTitle.value = t('action.' + type) |
|||
} |
|||
try { |
|||
nextTick(() => { |
|||
formRefMain.value.setValues(data.value) |
|||
formRefProcess.value.setValues(data.value.list[0]) |
|||
}) |
|||
} finally { |
|||
formLoading.value = false |
|||
} |
|||
} |
|||
defineExpose({ open, dialogVisible, formLoading }) // 提供 open 方法，用于打开弹窗 |
|||
|
|||
const data = ref({ |
|||
code: '', |
|||
description: '', |
|||
version: '', |
|||
list: [ |
|||
{ |
|||
description: '哈哈哈', |
|||
code: '', |
|||
sequenceCode: '' |
|||
}, |
|||
{ |
|||
description: '呵呵呵', |
|||
isEdit: false, |
|||
code: '555', |
|||
sequenceCode: '6666' |
|||
}, |
|||
{ |
|||
description: '哈呵呵', |
|||
isEdit: false |
|||
} |
|||
] |
|||
}) |
|||
|
|||
/** 弹窗按钮 */ |
|||
let Butttondata: any = [] |
|||
if (props.footButttondata) { |
|||
Butttondata = props.footButttondata |
|||
} else { |
|||
Butttondata = [ |
|||
defaultButtons.formSaveBtn(null), // 保存 |
|||
defaultButtons.formCloseBtn(null) // 关闭 |
|||
] |
|||
} |
|||
// 编辑名字 |
|||
const editName = (item) => { |
|||
if(!item.description){ |
|||
p |
|||
return; |
|||
} |
|||
item.isEdit = !item.isEdit |
|||
} |
|||
// 添加工序 |
|||
const addProcess = () => { |
|||
data.value.list.push({ |
|||
name: '哈哈哈', |
|||
isEdit: true |
|||
}) |
|||
} |
|||
// 删除工序 |
|||
const delProcess = (index) => { |
|||
data.value.list.splice(index, 1) |
|||
} |
|||
|
|||
const chooseItem = (item, index) => { |
|||
const data1 = JSON.parse(JSON.stringify(unref(formRefProcess)?.formModel)) |
|||
data.value.list.forEach((element,index) => { |
|||
if (element.code == data1.code) { |
|||
data.value.list[index] =JSON.parse(JSON.stringify( data1)) |
|||
} |
|||
}) |
|||
chooseIndex.value = index |
|||
formRefProcess.value.setValues(item) |
|||
} |
|||
</script> |
|||
<style lang="scss" scoped> |
|||
.small-title { |
|||
font-weight: bold; |
|||
padding: 0px 10px 10px; |
|||
color: #1a8bfc; |
|||
font-size: 16px; |
|||
} |
|||
.el-tabs--left .el-tabs__header.is-left { |
|||
min-height: 700px !important; |
|||
} |
|||
.tab-pane { |
|||
border: 1px solid #dcdfe6; |
|||
display: flex; |
|||
.left { |
|||
background: #f5f7fa; |
|||
width: 200px; |
|||
border-right: 1px solid #dcdfe6; |
|||
position: relative; |
|||
.plus { |
|||
position: absolute; |
|||
right: 0px; |
|||
border: 1px solid #dcdfe6; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: center; |
|||
padding: 2px; |
|||
top: 8px; |
|||
border-radius: 4px; |
|||
cursor: pointer; |
|||
} |
|||
.left-item { |
|||
display: flex; |
|||
align-items: center; |
|||
height: 36px; |
|||
margin-bottom: 10px; |
|||
cursor: pointer; |
|||
|
|||
.name { |
|||
width: 120px; |
|||
overflow: hidden; |
|||
padding: 0px 10px; |
|||
height: 36px; |
|||
text-overflow: ellipsis; |
|||
white-space: nowrap; |
|||
line-height: 36px; |
|||
} |
|||
} |
|||
.active { |
|||
background: white; |
|||
} |
|||
} |
|||
.right { |
|||
flex: 1; |
|||
padding: 20px; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,330 @@ |
|||
import type { CrudSchema } from '@/hooks/web/useCrudSchemas' |
|||
import { dateFormatter } from '@/utils/formatTime' |
|||
import * as AreaApi from '@/api/wms/areabasic' |
|||
import { Area } from '@/views/wms/basicDataManage/factoryModeling/areabasic/areabasic.data' |
|||
import * as LocationApi from '@/api/wms/location' |
|||
import { Location } from '@/views/wms/basicDataManage/factoryModeling/location/location.data' |
|||
import * as InspectionProcessPageApi from '@/api/qms/inspectionTemplate' |
|||
// const inspectionProcessPage = await InspectionProcessPageApi.getInspectionProcessPage()
|
|||
|
|||
// 表单校验
|
|||
export const AgvLocationrelationRules = reactive({ |
|||
positionCode: [ |
|||
{ required: true, message: '请填写AGV点位', trigger: 'change' } |
|||
], |
|||
positionArea: [ |
|||
{ required: true, message: '请填写AGV库区', trigger: 'change' } |
|||
], |
|||
wmsArea: [ |
|||
{ required: true, message: '请填写WMS库区', trigger: 'change' } |
|||
], |
|||
wmsPosition: [ |
|||
{ required: true, message: '请填写WMS库位', trigger: 'change' } |
|||
] |
|||
}) |
|||
|
|||
export const AgvLocationrelation = useCrudSchemas(reactive<CrudSchema[]>([ |
|||
{ |
|||
label: '单据号', |
|||
field: 'reqCode', |
|||
sort: 'custom', |
|||
isSearch: true, |
|||
isForm: false, |
|||
}, |
|||
{ |
|||
label: 'AGV点位', |
|||
field: 'positionCode', |
|||
sort: 'custom', |
|||
isSearch: false, |
|||
}, |
|||
{ |
|||
label: 'AGV库区', |
|||
field: 'positionArea', |
|||
sort: 'custom', |
|||
isSearch: false, |
|||
}, |
|||
{ |
|||
label: 'WMS库区', |
|||
field: 'wmsArea', |
|||
sort: 'custom', |
|||
isSearch: false, |
|||
form: { |
|||
// labelMessage: '信息提示说明！！！',
|
|||
componentProps: { |
|||
isSearchList: true, // 开启查询弹窗
|
|||
searchListPlaceholder: '请选择库区代码', // 输入框占位文本
|
|||
searchField: 'code', // 查询弹窗赋值字段
|
|||
searchTitle: '库区信息', // 查询弹窗标题
|
|||
searchAllSchemas: Area.allSchemas, // 查询弹窗所需类
|
|||
searchPage: AreaApi.getAreaPage, // 查询弹窗所需分页方法
|
|||
searchCondition: [{ |
|||
key: 'available', |
|||
value: 'TRUE', |
|||
isMainValue: false |
|||
}] |
|||
} |
|||
} |
|||
}, |
|||
{ |
|||
label: 'WMS库位', |
|||
field: 'wmsPosition', |
|||
sort: 'custom', |
|||
table: { |
|||
width: 150 |
|||
}, |
|||
form: { |
|||
// labelMessage: '信息提示说明！！！',
|
|||
componentProps: { |
|||
isSearchList: true, // 开启查询弹窗
|
|||
searchListPlaceholder: '请选择库位代码', // 输入框占位文本
|
|||
searchField: 'code', // 查询弹窗赋值字段
|
|||
searchTitle: '库位信息', // 查询弹窗标题
|
|||
searchAllSchemas: Location.allSchemas, // 查询弹窗所需类
|
|||
searchPage: LocationApi.getLocationPage, // 查询弹窗所需分页方法
|
|||
searchCondition: [{ |
|||
key: 'available', |
|||
value: 'TRUE', |
|||
isMainValue: false |
|||
}, |
|||
{ |
|||
key: 'areaCode', |
|||
value: "wmsArea", |
|||
message: '请选择库区代码！', |
|||
isMainValue: true |
|||
}] |
|||
} |
|||
} |
|||
}, |
|||
{ |
|||
label: '是否可用', |
|||
field: 'available', |
|||
dictType: DICT_TYPE.TRUE_FALSE, |
|||
dictClass: 'string', |
|||
isTable: true, |
|||
isSearch: false, |
|||
sort: 'custom', |
|||
table: { |
|||
width: 150 |
|||
}, |
|||
form: { |
|||
component: 'Switch', |
|||
value: 'TRUE', |
|||
componentProps: { |
|||
inactiveValue: 'FALSE', |
|||
activeValue: 'TRUE' |
|||
} |
|||
} |
|||
}, |
|||
{ |
|||
label: '创建时间', |
|||
field: 'createTime', |
|||
sort: 'custom', |
|||
formatter: dateFormatter, |
|||
isSearch: true, |
|||
search: { |
|||
component: 'DatePicker', |
|||
componentProps: { |
|||
valueFormat: 'YYYY-MM-DD HH:mm:ss', |
|||
type: 'daterange', |
|||
defaultTime: [new Date('1 00:00:00'), new Date('1 23:59:59')] |
|||
} |
|||
}, |
|||
detail: { |
|||
dateFormat: 'YYYY-MM-DD HH:mm:ss' |
|||
}, |
|||
isForm: false, |
|||
}, |
|||
{ |
|||
label: '备注', |
|||
field: 'remark', |
|||
sort: 'custom', |
|||
isSearch: false, |
|||
}, |
|||
{ |
|||
label: '操作', |
|||
field: 'action', |
|||
isForm: false, |
|||
isDetail: false, |
|||
table: { |
|||
width: 150, |
|||
fixed: 'right' |
|||
} |
|||
} |
|||
])) |
|||
|
|||
export const InspectionTemplateMain = useCrudSchemas(reactive<CrudSchema[]>([ |
|||
{ |
|||
label: '编码', |
|||
field: 'code', |
|||
sort: 'custom', |
|||
form:{ |
|||
componentProps:{ |
|||
disabled:true, |
|||
placeholder:'系统自动获取' |
|||
} |
|||
} |
|||
}, |
|||
{ |
|||
label: '描述', |
|||
field: 'description', |
|||
sort: 'custom', |
|||
},{ |
|||
label: '版本', |
|||
field: 'version', |
|||
sort: 'custom', |
|||
} |
|||
])) |
|||
export const InspectionTemplateProcess = useCrudSchemas(reactive<CrudSchema[]>([ |
|||
{ |
|||
label: '编码', |
|||
field: 'code', |
|||
sort: 'custom', |
|||
form:{ |
|||
componentProps:{ |
|||
disabled:true, |
|||
placeholder:'系统自动获取' |
|||
} |
|||
} |
|||
}, |
|||
{ |
|||
label: '描述', |
|||
field: 'description', |
|||
sort: 'custom', |
|||
isForm:false |
|||
},{ |
|||
label: '检验方案模板编码', |
|||
field: 'inspectionCode', |
|||
sort: 'custom', |
|||
},{ |
|||
label: '顺序号', |
|||
field: 'sequenceCode', |
|||
},{ |
|||
label: '检验特性编码', |
|||
field: 'inspectionCharCode', |
|||
sort: 'custom', |
|||
form:{ |
|||
component:'Select', |
|||
// api: () => inspectionProcessPage,
|
|||
// componentProps:{
|
|||
// optionsAlias: {
|
|||
// labelField: 'name',
|
|||
// valueField: 'id'
|
|||
// }
|
|||
// }
|
|||
} |
|||
// form: {
|
|||
// value: userDept.id,
|
|||
// component: 'Select',
|
|||
// api: () => userDeptArray,
|
|||
// componentProps: {
|
|||
// disabled: true,
|
|||
// optionsAlias: {
|
|||
// labelField: 'name',
|
|||
// valueField: 'id'
|
|||
// }
|
|||
// }
|
|||
// }
|
|||
} |
|||
])) |
|||
export const InspectionTemplateFeatures= useCrudSchemas(reactive<CrudSchema[]>([ |
|||
{ |
|||
label: '编码', |
|||
field: 'code', |
|||
sort: 'custom', |
|||
form:{ |
|||
componentProps:{ |
|||
disabled:true, |
|||
placeholder:'系统自动获取' |
|||
} |
|||
} |
|||
}, |
|||
{ |
|||
label: '描述', |
|||
field: 'describe', |
|||
sort: 'custom', |
|||
},{ |
|||
label: '检验方法编码', |
|||
field: 'inspectionMethodCode', |
|||
sort: 'custom', |
|||
form:{ |
|||
component:'Select' |
|||
} |
|||
},{ |
|||
label: '采样过程编码', |
|||
field: 'dynamicUpdateCode', |
|||
sort: 'custom', |
|||
form:{ |
|||
component:'Select' |
|||
} |
|||
},{ |
|||
label: '动态修改规则编码', |
|||
field: 'inspectionMethod', |
|||
sort: 'custom', |
|||
form:{ |
|||
component:'Select' |
|||
} |
|||
},{ |
|||
label: '是否允许修改特征值', |
|||
field: 'isCanUpdate', |
|||
sort: 'custom', |
|||
form:{ |
|||
component:'Select' |
|||
} |
|||
},{ |
|||
label: '是否破坏性检验', |
|||
field: 'isDestructionInspection', |
|||
sort: 'custom', |
|||
form:{ |
|||
component:'Select' |
|||
} |
|||
},{ |
|||
label: '结果录入方式', |
|||
field: 'resultEntryMethod', |
|||
sort: 'custom', |
|||
form:{ |
|||
component:'Select' |
|||
} |
|||
},{ |
|||
label: '特征类型', |
|||
field: 'featureType', |
|||
sort: 'custom', |
|||
form:{ |
|||
component:'Select' |
|||
} |
|||
},{ |
|||
label: '是否设定上限', |
|||
field: 'quantifyIsCapping', |
|||
sort: 'custom', |
|||
},{ |
|||
label: '是否设定下限', |
|||
field: 'quantifyIsLowlimit', |
|||
sort: 'custom', |
|||
},{ |
|||
label: '目标值', |
|||
field: 'quantifyTarget', |
|||
sort: 'custom', |
|||
},{ |
|||
label: '上限值', |
|||
field: 'quantifyCapping', |
|||
sort: 'custom', |
|||
},{ |
|||
label: '下限值', |
|||
field: 'quantifyLowlimit', |
|||
sort: 'custom', |
|||
},{ |
|||
label: '计量单位', |
|||
field: 'quantifyUom', |
|||
sort: 'custom', |
|||
},{ |
|||
label: '小数位', |
|||
field: 'quantifyDecimal', |
|||
sort: 'custom', |
|||
},{ |
|||
label: '选择集编码', |
|||
field: 'quantifyQuantifyCode', |
|||
sort: 'custom', |
|||
form:{ |
|||
component:'Select' |
|||
} |
|||
} |
|||
])) |
|||
Loading…
Reference in new issue