import { computed, defineComponent, onMounted, ref } from 'vue'
|
import styles from './WorkSectionParams.module.scss'
|
import Tab from '@/components/Tab/Tab'
|
import TabPane from '@/components/Tab/TabPane'
|
import CommonTable from '@/components/CommonTable/CommonTable'
|
import { _t } from '@/libs/Language/Language'
|
import DyForm from '../DyForm/DyForm'
|
import BaseDialog from '../BaseDialog/BaseDialog'
|
import { getWorkSection } from './api'
|
import { useGlobalState } from '@/libs/Store/Store'
|
import IconButton from '../IconButton/IconButton'
|
import { ElMessage } from 'element-plus'
|
|
export default defineComponent({
|
name: 'WorkSectionParams',
|
props: {
|
onConfirm: {
|
type: Function,
|
},
|
selections: {
|
type: Array,
|
default: () => [],
|
},
|
},
|
emits: ['update:visible', 'confirm', 'cancel'],
|
setup(props, ctx) {
|
const { workSectionList } = useGlobalState()
|
const tabData = ref<any[]>()
|
const formRef = ref<any>(null)
|
const formData = ref<any>({})
|
const visible = ref(false)
|
const paramsData = ref<any[]>([])
|
const formulaData = ref<any[]>([])
|
const materielData = ref<any[]>([])
|
const paramRef = ref<any>(null)
|
const formulaRef = ref<any>(null)
|
const materielRef = ref<any>(null)
|
const selectedMap = ref<any>({})
|
const isEdit = ref(false)
|
|
const typeMap = computed(() => {
|
return {
|
process: {
|
type: 0,
|
name: _t('采集参数'),
|
},
|
formula: {
|
type: 1,
|
name: _t('配方参数'),
|
},
|
material: {
|
type: 2,
|
name: _t('物料参数'),
|
},
|
}
|
})
|
const currentTab = computed(() => {
|
const base = [
|
{
|
label: _t('采集参数'),
|
name: 'process',
|
hidden: false,
|
edition: 'G',
|
data: paramsData,
|
ref: paramRef,
|
},
|
{
|
label: _t('配方参数'),
|
name: 'formula',
|
hidden: false,
|
data: formulaData,
|
ref: formulaRef,
|
edition: 'H',
|
},
|
{
|
label: _t('物料参数'),
|
name: 'material',
|
hidden: false,
|
data: materielData,
|
ref: materielRef,
|
},
|
]
|
|
return base
|
})
|
|
const workSectionMap = computed(() => {
|
const map = {}
|
workSectionList.state.value.forEach((item: any) => {
|
map[item.value] = item
|
})
|
return map
|
})
|
|
const refMap = computed(() => ({
|
0: paramRef,
|
1: formulaRef,
|
2: materielRef,
|
}))
|
|
const onConfirm = () => {
|
const getItem = (item: any, key: string) => {
|
return {
|
...item,
|
workSectionId: formData.value.id,
|
sourceDisplayTxt: item.name,
|
source: item.key,
|
sourceType: typeMap.value[key].type,
|
sourceTypeDisplayTxt: typeMap.value[key].name,
|
workSectionName: workSectionMap.value[formData.value.id].label,
|
productionLineSegmentId:
|
workSectionMap.value[formData.value.id].source?.segment?.id,
|
productionLineSegmentName:
|
workSectionMap.value[formData.value.id].source?.segment?.name,
|
}
|
}
|
const { process = [], formula = [], material = [] } = selectedMap.value
|
const data = process
|
.map((item: any) => getItem(item, 'process'))
|
.concat(formula.map((item: any) => getItem(item, 'formula')))
|
.concat(material.map((item: any) => getItem(item, 'material')))
|
if (isEdit.value) {
|
if (data.length !== 1) {
|
ElMessage.warning(_t('请选择一个参数！'))
|
return
|
}
|
}
|
ctx.emit('confirm', isEdit.value ? data[0] : data)
|
visible.value = false
|
}
|
const onCancel = () => {
|
visible.value = false
|
}
|
|
const onEdit = async () => {
|
if (!props.selections.length) {
|
ElMessage.warning(_t('请选择一个配置！'))
|
return
|
}
|
if (props.selections.length > 1) {
|
ElMessage.warning(_t('请勿选择多个配置操作！'))
|
return
|
}
|
isEdit.value = true
|
visible.value = true
|
const data = props.selections[0] as any
|
formData.value.id = data.workSectionId
|
await getWorkSectionParams(data.workSectionId)
|
|
const ref = refMap.value[data.sourceType]
|
ref?.value?.setSelectRow([data.id])
|
}
|
|
const getWorkSectionParams = async (id: string) => {
|
if (!id) return
|
const res = await getWorkSection(id)
|
const { processParameters, formulaParameters, materialDetections } = res
|
paramsData.value = processParameters
|
formulaData.value = formulaParameters
|
materielData.value = materialDetections
|
}
|
|
onMounted(async () => {
|
if (workSectionList.state.value) {
|
const id = workSectionList.state.value[0]?.value
|
formData.value.id = id
|
await getWorkSectionParams(id)
|
}
|
})
|
return () => {
|
return (
|
<div class={styles.workSectionParams}>
|
<div class={styles.btnList}>
|
<IconButton
|
icon="add-p"
|
type="primary"
|
onClick={() => {
|
isEdit.value = false
|
visible.value = true
|
}}
|
>
|
{_t('新增')}
|
</IconButton>
|
{/* <IconButton icon="edit" onClick={onEdit}>
|
{_t('编辑')}
|
</IconButton> */}
|
</div>
|
<BaseDialog
|
title={_t('新增产品下发参数值配置')}
|
onConfirm={onConfirm}
|
onClose={onCancel}
|
v-model={visible.value}
|
width="954px"
|
height="536px"
|
>
|
<DyForm
|
ref={formRef}
|
formData={formData.value}
|
labelWidth="106px"
|
formItemProps={[
|
{
|
label: _t('工序'),
|
prop: 'id',
|
el: 'select',
|
options: workSectionList.state.value,
|
placeholder: _t('请选择工序'),
|
onChange: getWorkSectionParams,
|
},
|
]}
|
></DyForm>
|
<Tab active={currentTab.value[0].name} size="small" type="params">
|
{currentTab.value.map((item: any) => {
|
return (
|
<TabPane key={item.name} label={item.label} name={item.name}>
|
<div style={{ height: '300px' }}>
|
<CommonTable
|
ref={item.ref}
|
isContextMenu={false}
|
v-model:dataSource={item.data.value}
|
isFooter={false}
|
height="290px"
|
onCheck={(records: any[]) => {
|
selectedMap.value[item.name] = records
|
}}
|
columns={[
|
{
|
title: _t('参数名'),
|
field: 'name',
|
key: 'name',
|
},
|
{
|
title: _t('参数描述'),
|
field: 'description',
|
key: 'description',
|
},
|
]}
|
isStop={item.isStop}
|
/>
|
</div>
|
</TabPane>
|
)
|
})}
|
</Tab>
|
</BaseDialog>
|
</div>
|
)
|
}
|
},
|
})
|
