131 lines
3.8 KiB
Vue
131 lines
3.8 KiB
Vue
|
<template>
|
||
|
|
<Dialog title="添加产品" v-model="show" width="800px">
|
||
|
|
<el-form :model="form" ref="formRef" :rules="rules" label-width="80px">
|
||
|
|
<el-row :gutter="20">
|
||
|
|
<el-col :span="12" :offset="0">
|
||
|
|
<el-form-item label="成交产品" prop="productId">
|
||
|
|
<el-select
|
||
|
|
v-model="form.productId"
|
||
|
|
placeholder="选择成交产品"
|
||
|
|
filterable
|
||
|
|
@change="form.specsId = undefined"
|
||
|
|
>
|
||
|
|
<el-option
|
||
|
|
v-for="item in prodOptions"
|
||
|
|
:key="item.productId"
|
||
|
|
:label="item.productName"
|
||
|
|
:value="item.productId"
|
||
|
|
/>
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="12" :offset="0">
|
||
|
|
<el-form-item label="产品规格" prop="specsId">
|
||
|
|
<el-select
|
||
|
|
v-model="form.specsId"
|
||
|
|
placeholder="选择规格"
|
||
|
|
filterable
|
||
|
|
:disabled="!form.productId"
|
||
|
|
>
|
||
|
|
<el-option
|
||
|
|
v-for="item in specsOptions(form.productId)"
|
||
|
|
:key="item.specsId"
|
||
|
|
:label="item.specsName"
|
||
|
|
:value="item.specsId"
|
||
|
|
/>
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="12" :offset="0">
|
||
|
|
<el-form-item label="成交数量" prop="signNum">
|
||
|
|
<el-input-number v-model="form.signNum" :min="1" :controls="false" />
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="12" :offset="0">
|
||
|
|
<el-form-item label="生产状态" prop="isProduced">
|
||
|
|
<el-radio-group v-model="form.isProduced">
|
||
|
|
<el-radio :label="0">待生产</el-radio>
|
||
|
|
<el-radio :label="1">已生产</el-radio>
|
||
|
|
</el-radio-group>
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="24" :offset="0">
|
||
|
|
<el-form-item label="备注" prop="remark">
|
||
|
|
<el-input
|
||
|
|
type="textarea"
|
||
|
|
:autoSize="{ minRows: 3 }"
|
||
|
|
v-model="form.remark"
|
||
|
|
placeholder="请输入备注"
|
||
|
|
/>
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
</el-form>
|
||
|
|
<template #footer>
|
||
|
|
<span>
|
||
|
|
<el-button @click="show = false">取 消</el-button>
|
||
|
|
<el-button :disabled="formLoading" type="primary" @click="handleSave">保 存</el-button>
|
||
|
|
</span>
|
||
|
|
</template>
|
||
|
|
</Dialog>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup name="DialogProduct">
|
||
|
|
import { addOrderProduct } from '@/api/clue/sign'
|
||
|
|
|
||
|
|
const message = useMessage() // 消息弹窗
|
||
|
|
|
||
|
|
const specsOptions = computed({
|
||
|
|
get() {
|
||
|
|
return (prodId) => {
|
||
|
|
if (prodId) {
|
||
|
|
return prodOptions.value.find((it) => it.productId == prodId).productSpecList
|
||
|
|
}
|
||
|
|
return []
|
||
|
|
}
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
const show = ref(false)
|
||
|
|
const form = ref({})
|
||
|
|
const rules = {
|
||
|
|
productId: { required: true, message: '成交产品不可为空', trigger: 'change' },
|
||
|
|
specsId: { required: true, message: '产品规格不可为空', trigger: 'change' },
|
||
|
|
signNum: { required: true, message: '成交数量不可为空', trigger: 'blur' }
|
||
|
|
}
|
||
|
|
|
||
|
|
const prodOptions = ref([])
|
||
|
|
|
||
|
|
function open(signId, arr) {
|
||
|
|
prodOptions.value = arr
|
||
|
|
form.value.signId = signId
|
||
|
|
form.value.isProduced = 0
|
||
|
|
show.value = true
|
||
|
|
}
|
||
|
|
defineExpose({ open })
|
||
|
|
|
||
|
|
const emit = defineEmits(['success'])
|
||
|
|
const formRef = ref()
|
||
|
|
const formLoading = ref(false)
|
||
|
|
async function handleSave() {
|
||
|
|
// 校验表单
|
||
|
|
if (!formRef.value) return
|
||
|
|
const valid = await formRef.value.validate()
|
||
|
|
if (!valid) return
|
||
|
|
|
||
|
|
// 提交请求
|
||
|
|
formLoading.value = true
|
||
|
|
try {
|
||
|
|
await addOrderProduct(form.value)
|
||
|
|
message.success('新增成功！')
|
||
|
|
show.value = false
|
||
|
|
// 发送操作成功的事件
|
||
|
|
emit('success')
|
||
|
|
} finally {
|
||
|
|
formLoading.value = false
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped></style>
|