<template>
|
<el-dialog
|
v-model="visible"
|
title="Tips"
|
width="500"
|
:before-close="visible = false"
|
>
|
<el-form
|
ref="form"
|
:model="dataValue"
|
label-width="80px"
|
>
|
<el-table :data="dataValue.dataList" style="width: 100%">
|
<el-table-column prop="productName" label="产品" width="180" />
|
<el-table-column prop="model" label="规格" width="180">
|
<template #default="{ row, index }">
|
<el-form-item
|
:prop="`dataList.${index}.model`"
|
:rules="[{ required: true, message: '请选择规格', trigger: ['blur','change'] }]"
|
style="margin: 0"
|
>
|
<el-input
|
v-model="dataValue.dataList[index].model"
|
placeholder="请选择产品"
|
readonly
|
@focus="() => {
|
dataValue.currentRowIndex = index
|
showModel = true
|
}"
|
/>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
|
<el-table-column prop="processName" label="消耗工序" width="180">
|
<template #default="{ row, index }">
|
<el-form-item
|
:prop="`dataList.${index}.processId`"
|
:rules="[{ required: true, message: '请选择消耗工序', trigger: 'change' }]"
|
style="margin: 0"
|
>
|
<el-select
|
v-model="dataValue.dataList[index].processId"
|
placeholder="请选择"
|
filterable
|
clearable
|
style="width: 100%"
|
>
|
<el-option
|
v-for="item in dataValue.processOptions"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id"
|
/>
|
</el-select>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
|
<el-table-column prop="unitQuantity" label="单位产出所需数量">
|
<template #default="{ row, index }">
|
<el-form-item
|
:prop="`dataList.${index}.unitQuantity`"
|
:rules="[{ required: true, message: '请输入单位产出所需数量', trigger: ['blur','change'] }]"
|
style="margin: 0"
|
>
|
<el-input-number
|
v-model="dataValue.dataList[index].unitQuantity"
|
:min="0"
|
:precision="2"
|
:step="1"
|
controls-position="right"
|
style="width: 100%"
|
/>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
|
<el-table-column prop="demandedQuantity" label="需求总量">
|
<template #default="{ row, index }">
|
<el-form-item
|
:prop="`dataList.${index}.demandedQuantity`"
|
:rules="[{ required: true, message: '请输入需求总量', trigger: ['blur','change'] }]"
|
style="margin: 0"
|
>
|
<el-input-number
|
v-model="dataValue.dataList[index].demandedQuantity"
|
:min="0"
|
:precision="2"
|
:step="1"
|
controls-position="right"
|
style="width: 100%"
|
/>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
|
<el-table-column prop="unit" label="单位">
|
<template #default="{ row, index }">
|
<el-form-item
|
:prop="`dataList.${index}.unit`"
|
:rules="[{ required: true, message: '请输入单位', trigger: ['blur','change'] }]"
|
style="margin: 0"
|
>
|
<el-input
|
v-model="dataValue.dataList[index].unit"
|
placeholder="请输入单位"
|
clearable
|
/>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
|
<el-table-column prop="address" label="盘数（盘）">
|
<template #default="{ row, index }">
|
<el-form-item
|
:prop="`dataList.${index}.address`"
|
:rules="[{ required: true, message: '请输入盘数', trigger: ['blur','change'] }]"
|
style="margin: 0"
|
>
|
<el-input-number
|
v-model="dataValue.dataList[index].address"
|
:min="0"
|
:precision="0"
|
:step="1"
|
controls-position="right"
|
style="width: 100%"
|
/>
|
</el-form-item>
|
</template>
|
</el-table-column>
|
|
<el-table-column label="操作">
|
<template #default="{ row, index }">
|
<el-button
|
type="danger"
|
icon="el-icon-delete"
|
circle
|
@click="dataValue.dataList.splice(index, 1)"
|
>删除
|
</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-form>
|
|
<product-select-dialog
|
v-if="dataValue.showProductDialog"
|
:model-value="dataValue.showProductDialog"
|
@confirm="handleProduct"/>
|
<template #footer>
|
<div class="dialog-footer">
|
<el-button @click="visible = false">取消</el-button>
|
<el-button type="primary" :loading="dataValue.loading" @click="submit">
|
确认
|
</el-button>
|
</div>
|
</template>
|
</el-dialog>
|
</template>
|
|
<script setup lang="ts">
|
import {computed, defineComponent, onMounted, reactive, ref} from "vue";
|
import {queryList, add} from '@/api/productionManagement/productStructure.js'
|
import {list} from '@/api/productionManagement/productionProcess'
|
import {ElMessage} from "element-plus";
|
|
|
defineComponent({
|
name: "StructureEdit",
|
})
|
|
const ProductSelectDialog = () => import('@/views/basicData/product/ProductSelectDialog.vue')
|
const from = ref()
|
|
|
const props = defineProps({
|
showModel: {
|
type: Boolean,
|
default: false
|
},
|
productModelId: {
|
type: Number,
|
required: true
|
}
|
})
|
|
const emits = defineEmits(['update:visible'])
|
const visible = computed({
|
get() {
|
return props.showModel
|
},
|
set(val) {
|
emits('update:visible', val)
|
}
|
})
|
|
const dataValue = reactive({
|
dataList: [],
|
productOptions: [],
|
processOptions: [],
|
showProductDialog: false,
|
currentRowIndex: null,
|
loading: false,
|
});
|
|
const fetchData = async () => {
|
const {data} = await queryList(props.productModelId)
|
dataValue.dataList = data
|
}
|
|
const fetchProcessOptions = async () => {
|
const {data} = await list(props.productModelId)
|
dataValue.processOptions = data
|
}
|
|
const handleProduct = (row) => {
|
dataValue.showProductDialog = false
|
dataValue.dataList[dataValue.currentRowIndex].speculativeTradingName = row.productName + '-' + row.model
|
dataValue.dataList[dataValue.currentRowIndex].productModelId = row.id
|
}
|
|
const submit = () => {
|
from.value.validate(valid => {
|
dataValue.loading = true
|
if (valid) {
|
add({
|
productModelId: props.productModelId,
|
dataList: dataValue.dataList
|
}).then(res => {
|
ElMessage.success('保存成功')
|
visible.value = false
|
dataValue.loading = false
|
})
|
}
|
}).finally(() => {
|
dataValue.loading = false
|
})
|
}
|
|
onMounted(() => {
|
fetchData()
|
fetchProcessOptions()
|
})
|
|
|
</script>
|
