163 lines
4.9 KiB
Vue
163 lines
4.9 KiB
Vue
<template>
|
|
<!-- 往来单位 新增、编辑 表单组件 -->
|
|
<div>
|
|
<el-form
|
|
label-width="100px"
|
|
size="medium"
|
|
ref="contactUnitsParamsRef"
|
|
:model="storageConfigParams"
|
|
:rules="storageConfigParamsRules"
|
|
>
|
|
<el-form-item label="仓库名称" prop="houseId">
|
|
<el-select v-model="storageConfigParams.houseId">
|
|
<el-option
|
|
v-for="item in storageConfigRange"
|
|
:key="item.value"
|
|
:label="item.label"
|
|
:value="item.value"
|
|
></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="物资名称" prop="typeId">
|
|
<treeselect
|
|
v-model="storageConfigParams.typeId"
|
|
:options="typeRange"
|
|
noChildrenText="没有数据了"
|
|
noOptionsText="没有数据"
|
|
noResultsText="没有搜索结果"
|
|
placeholder="请选择所属上级"
|
|
/>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="success" @click="onSubmit">确定</el-button>
|
|
<el-button
|
|
@click="
|
|
() => {
|
|
this.$emit('closeDialog')
|
|
}
|
|
"
|
|
>取消</el-button
|
|
>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
addStorageConfigListApi,
|
|
updateStorageConfigListApi
|
|
} from '@/api/material/storageConfig'
|
|
import {
|
|
queryStorageListApi
|
|
} from '@/api/material/storage'
|
|
import {
|
|
queryMaTypeTreeListApi
|
|
} from '@/api/material/type'
|
|
import Treeselect from '@riophae/vue-treeselect'
|
|
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
|
|
export default {
|
|
name: 'FormStorage',
|
|
props: {
|
|
editParams: {
|
|
type: Object,
|
|
default: () => null,
|
|
},
|
|
},
|
|
components: { Treeselect },
|
|
created() {
|
|
this.getHouseRange()
|
|
this.getTypeRange()
|
|
},
|
|
mounted() {
|
|
if (this.editParams) {
|
|
Object.assign(this.storageConfigParams, this.editParams)
|
|
this.subSort = 2
|
|
} else {
|
|
this.subSort = 1
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
subSort: '', // 提交类型：新增 1 / 修改 2
|
|
storageConfigParams: {
|
|
houseId: undefined, // 仓库名称
|
|
typeId: undefined, // 物资名称
|
|
},
|
|
// 仓库下拉选项
|
|
storageConfigRange: [],
|
|
// 类型下拉选项
|
|
typeRange: [],
|
|
// 校验规则
|
|
storageConfigParamsRules: {
|
|
houseId: [
|
|
{
|
|
required: true,
|
|
message: '请输入仓库名称',
|
|
trigger: 'blur',
|
|
},
|
|
],
|
|
typeId: [
|
|
{
|
|
required: true,
|
|
message: '请选择物资名称',
|
|
trigger: 'blur',
|
|
},
|
|
],
|
|
},
|
|
}
|
|
},
|
|
methods: {
|
|
/** 初始化获取仓库下拉 */
|
|
getHouseRange() {
|
|
queryStorageListApi().then(res => {
|
|
console.log(res)
|
|
this.storageConfigRange = res.rows.map(item => {
|
|
return {
|
|
value: item.id,
|
|
label: item.name,
|
|
}
|
|
})
|
|
}).catch(err => {})
|
|
},
|
|
/** 初始化获取类型下拉 */
|
|
getTypeRange() {
|
|
queryMaTypeTreeListApi().then(res => {
|
|
this.typeRange = res.data
|
|
}).catch(err => {})
|
|
},
|
|
/** 确认按钮 */
|
|
onSubmit() {
|
|
this.$refs.contactUnitsParamsRef.validate((valid) => {
|
|
if (valid) {
|
|
console.log('校验通过', this.storageConfigParams, this.subSort)
|
|
// 1. 表单校验通过后调后台 Api
|
|
if(this.subSort === 1) {
|
|
addStorageConfigListApi(this.storageConfigParams).then(res => {
|
|
console.log(res)
|
|
this.$modal.msgSuccess('新增成功')
|
|
}).catch(err => {})
|
|
} else if(this.subSort === 2) {
|
|
updateStorageConfigListApi(this.storageConfigParams).then(res => {
|
|
console.log(res)
|
|
this.$modal.msgSuccess('修改成功')
|
|
}).catch(err => {})
|
|
}
|
|
// 2. 成功之后通知父组件关闭弹框
|
|
this.$emit('closeDialog', true)
|
|
}
|
|
})
|
|
},
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
::v-deep .el-select {
|
|
width: 100%;
|
|
}
|
|
::v-deep .el-form-item__label{
|
|
font-weight: normal;
|
|
}
|
|
</style>
|