|
|
<template>
|
|
|
<div>
|
|
|
<xy-dialog
|
|
|
ref="dialog"
|
|
|
:width="70"
|
|
|
:is-show.sync="isShow"
|
|
|
type="form"
|
|
|
:title="titleName"
|
|
|
:form="form"
|
|
|
:rules="rules"
|
|
|
@submit="submit"
|
|
|
>
|
|
|
<template v-slot:cangkumingcheng>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;"></span>仓库名称：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-select v-model="form.guanliancangku" style="width: 300px;" placeholder="请选择仓库" @change="changeCk">
|
|
|
<el-option
|
|
|
v-for="item in cangkuList"
|
|
|
:key="item.id"
|
|
|
:label="item.cangkumingcheng"
|
|
|
:value="item.id"
|
|
|
/>
|
|
|
</el-select>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:daichudanwei>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />代储单位
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.daichudanwei" placeholder="请填写代储单位" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:yijifenlei>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />一级分类
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.yijifenlei" placeholder="请填写一级分类" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:erjifenlei>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />二级分类
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.erjifenlei" placeholder="请填写二级分类" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:fenlei>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />所属种类
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.fenlei" placeholder="请填写所属种类" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:quyu>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />区域：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.quyu" placeholder="请填写区域" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:xianwuzimingcheng>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />现物资名称：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.xianwuzimingcheng" placeholder="请填写现物资名称" clearable style="width: 300px;" />
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:yuanwuzimingcheng>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />原物资名称：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.yuanwuzimingcheng" placeholder="请填写原物资名称" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:guigexinghao>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />物资型号：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.guigexinghao" placeholder="请填写物资型号" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:shuliang>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />数量：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.shuliang" placeholder="请填写数量" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:danwei>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />单位：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.danwei" placeholder="请填写单位" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:jiazhiyuan>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />价值(元)：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.jiazhiyuan" placeholder="请填写价值(元)" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:shengchanriqi>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />生产日期：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.shengchanriqi" placeholder="请填写生产日期" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:rukuriqi>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />入库日期：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.rukuriqi" placeholder="请填写入库日期" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:chubeinianxian>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />储备年限：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.chubeinianxian" placeholder="请填写储备年限" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:zhuangtai>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />状态：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.zhuangtai" placeholder="请填写状态" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:zijinlaiyuan>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />资金来源：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.zijinlaiyuan" placeholder="请填写资金来源" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:chubeifangshi>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />储备方式：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.chubeifangshi" placeholder="请填写储备方式" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:chubeididian>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />储备地点：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input v-model="form.chubeididian" placeholder="请填写储备地点" clearable style="width: 300px;" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:beizhu>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />备注：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input
|
|
|
v-model="form.beizhu"
|
|
|
placeholder="请输入储备层级"
|
|
|
clearable
|
|
|
style="width: 300px;"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:chubeicengji>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />储备层级：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input
|
|
|
v-model="form.chubeicengji"
|
|
|
placeholder="请输入储备层级"
|
|
|
clearable
|
|
|
style="width: 300px;"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:shifouzhanshi>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />是否展示：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-input
|
|
|
v-model="form.shifouzhanshi"
|
|
|
placeholder="请输入是否展示"
|
|
|
clearable
|
|
|
style="width: 300px;"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot:is_chart>
|
|
|
<div class="xy-table-item">
|
|
|
<div class="xy-table-item-label">
|
|
|
<span style="color: red;font-weight: 600;padding-right: 4px;" />是否统计：
|
|
|
</div>
|
|
|
<div class="xy-table-item-content">
|
|
|
<el-select v-model="form.is_chart" placeholder="请选择" clearable style="width: 300px;">
|
|
|
<el-option v-for="item in [{id:1,name:'是'},{id:0,name:'否'}]" :key="item.id" :label="item.name" :value="item.name" />
|
|
|
</el-select>
|
|
|
</div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
</xy-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import {
|
|
|
save,
|
|
|
index,
|
|
|
show
|
|
|
} from '@/api/system/baseForm.js'
|
|
|
import {
|
|
|
Message
|
|
|
} from 'element-ui'
|
|
|
import {
|
|
|
index as getFenleilist
|
|
|
} from '@/api/fenlei.js'
|
|
|
export default {
|
|
|
props: {
|
|
|
// 是否为本地模式（不提交到接口，只返回数据）
|
|
|
isLocalMode: {
|
|
|
type: Boolean,
|
|
|
default: false
|
|
|
}
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
isShow: false,
|
|
|
type: 'add',
|
|
|
id: '',
|
|
|
titleName: '',
|
|
|
tableName: 'flood_materials',
|
|
|
cangkuList: [],
|
|
|
fenleiList: [],
|
|
|
fenleiName: '',
|
|
|
form: {
|
|
|
guanliancangku: '',
|
|
|
cangkumingcheng: '',
|
|
|
daichudanwei: '',
|
|
|
yijifenlei: '',
|
|
|
erjifenlei: '',
|
|
|
fenlei: '',
|
|
|
quyu: '',
|
|
|
wuzidaima: '',
|
|
|
xianwuzimingcheng: '',
|
|
|
yuanwuzimingcheng: '',
|
|
|
guigexinghao: '',
|
|
|
shuliang: '',
|
|
|
danwei: '',
|
|
|
jiazhiyuan: '',
|
|
|
shengchanriqi: '',
|
|
|
rukuriqi: '',
|
|
|
chubeinianxian: '',
|
|
|
zhuangtai: '',
|
|
|
zijinlaiyuan: '',
|
|
|
chubeifangshi: '',
|
|
|
chubeididian: '',
|
|
|
beizhu: '',
|
|
|
chubeicengji: '',
|
|
|
shifouzhanshi: '',
|
|
|
is_chart: ''
|
|
|
},
|
|
|
rules: {
|
|
|
guanliancangku: [{
|
|
|
required: true,
|
|
|
message: '请选择仓库'
|
|
|
}]
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
isShow(newVal) {
|
|
|
if (newVal) {
|
|
|
this.titleName = this.type === 'add' ? `新增物资` : `编辑物资`
|
|
|
if (this.type === 'editor') {
|
|
|
this.getDetail()
|
|
|
}
|
|
|
} else {
|
|
|
this.id = ''
|
|
|
this.type = ''
|
|
|
this.$refs['dialog'].reset()
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
created() {
|
|
|
this.getFenlei()
|
|
|
},
|
|
|
methods: {
|
|
|
async getFenlei() {
|
|
|
const res = await getFenleilist({
|
|
|
tree: 1,
|
|
|
sort_type: 'ASC',
|
|
|
sort_name: 'sort'
|
|
|
})
|
|
|
this.fenleiList = res
|
|
|
},
|
|
|
changeFenlei(e) {
|
|
|
console.log('e', e)
|
|
|
this.form.fenlei = e[e.length - 1]
|
|
|
console.log(this.$refs.cascaders.getCheckedNodes())
|
|
|
let data = this.$refs.cascaders.getCheckedNodes() ? this.$refs.cascaders.getCheckedNodes()[0].data : null
|
|
|
if (data) {
|
|
|
this.fenleiName = data.name
|
|
|
}
|
|
|
console.log(this.form.fenlei)
|
|
|
},
|
|
|
setCkList(e) {
|
|
|
if (e) {
|
|
|
this.cangkuList = e
|
|
|
}
|
|
|
},
|
|
|
changeCk(e) {
|
|
|
if (e) {
|
|
|
const selectedWarehouse = this.cangkuList.find(item => e === item.id)
|
|
|
if (selectedWarehouse) {
|
|
|
this.form.guanliancangku = selectedWarehouse.id
|
|
|
this.form.cangkumingcheng = selectedWarehouse.cangkumingcheng
|
|
|
}
|
|
|
console.log(this.form.guanliancangku)
|
|
|
}
|
|
|
},
|
|
|
async getDetail() {
|
|
|
const res = await show({
|
|
|
id: this.id,
|
|
|
table_name: this.tableName
|
|
|
})
|
|
|
this.form = {
|
|
|
guanliancangku: res.guanliancangku ? parseInt(res.guanliancangku) : '',
|
|
|
cangkumingcheng: res?.cangkumingcheng,
|
|
|
daichudanwei: res?.daichudanwei,
|
|
|
yijifenlei: res?.yijifenlei,
|
|
|
erjifenlei: res?.erjifenlei,
|
|
|
fenlei: res?.fenlei,
|
|
|
quyu: res?.quyu,
|
|
|
wuzidaima: res?.wuzidaima,
|
|
|
xianwuzimingcheng: res?.xianwuzimingcheng,
|
|
|
yuanwuzimingcheng: res?.yuanwuzimingcheng,
|
|
|
guigexinghao: res?.guigexinghao,
|
|
|
shuliang: res?.shuliang,
|
|
|
danwei: res?.danwei,
|
|
|
jiazhiyuan: res?.jiazhiyuan,
|
|
|
shengchanriqi: res?.shengchanriqi,
|
|
|
rukuriqi: res?.rukuriqi,
|
|
|
chubeinianxian: res?.chubeinianxian,
|
|
|
zhuangtai: res?.zhuangtai,
|
|
|
zijinlaiyuan: res?.zijinlaiyuan,
|
|
|
chubeifangshi: res?.chubeifangshi,
|
|
|
chubeididian: res?.chubeididian,
|
|
|
beizhu: res?.beizhu,
|
|
|
chubeicengji: res?.chubeicengji,
|
|
|
shifouzhanshi: res?.shifouzhanshi,
|
|
|
is_chart: res?.is_chart
|
|
|
|
|
|
}
|
|
|
},
|
|
|
submit() {
|
|
|
console.log('this.form', this.form)
|
|
|
|
|
|
// 如果是本地模式，不提交到接口，直接返回数据
|
|
|
if (this.isLocalMode) {
|
|
|
// 验证必填字段
|
|
|
if (!this.form.guanliancangku) {
|
|
|
Message({
|
|
|
type: 'warning',
|
|
|
message: '请选择仓库'
|
|
|
})
|
|
|
return
|
|
|
}
|
|
|
|
|
|
// 触发事件，返回物资数据
|
|
|
this.$emit('material-added', { ...this.form })
|
|
|
this.isShow = false
|
|
|
// 重置表单
|
|
|
this.$refs['dialog'].reset()
|
|
|
return
|
|
|
}
|
|
|
|
|
|
// 正常模式，提交到接口
|
|
|
if (this.type === 'add') {
|
|
|
save({
|
|
|
table_name: this.tableName,
|
|
|
...this.form
|
|
|
}).then(res => {
|
|
|
Message({
|
|
|
type: 'success',
|
|
|
message: '新增成功'
|
|
|
})
|
|
|
this.isShow = false
|
|
|
this.$emit('refresh')
|
|
|
})
|
|
|
return
|
|
|
}
|
|
|
if (this.type === 'editor') {
|
|
|
save({
|
|
|
id: this.id,
|
|
|
table_name: this.tableName,
|
|
|
...this.form
|
|
|
}).then(res => {
|
|
|
Message({
|
|
|
type: 'success',
|
|
|
message: '编辑成功'
|
|
|
})
|
|
|
this.isShow = false
|
|
|
this.$emit('refresh')
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
.mingxiwrap {
|
|
|
display: flex;
|
|
|
flex-wrap: wrap;
|
|
|
}
|
|
|
|
|
|
.mingxiwrap .xy-table-item {
|
|
|
margin-bottom: 10px
|
|
|
}
|
|
|
|
|
|
.searchCompanys {
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
margin-bottom: 15px;
|
|
|
}
|
|
|
|
|
|
::v-deep .searchCompanys .el-input {
|
|
|
width: 82%
|
|
|
}
|
|
|
|
|
|
.xy-table-item-label {
|
|
|
width: 160px;
|
|
|
}
|
|
|
|
|
|
.img__delete {
|
|
|
transform: scale(0.8, 0.8);
|
|
|
|
|
|
position: absolute;
|
|
|
top: 4px;
|
|
|
right: 4px;
|
|
|
}
|
|
|
|
|
|
::v-deep .avatar-uploader .el-upload {
|
|
|
border: 1px dashed #d9d9d9;
|
|
|
border-radius: 6px;
|
|
|
cursor: pointer;
|
|
|
position: relative;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
|
|
|
::v-deep .avatar-uploader .el-upload:hover {
|
|
|
border-color: #409EFF;
|
|
|
}
|
|
|
|
|
|
::v-deep .el-upload--picture-card {
|
|
|
font-size: 28px;
|
|
|
color: #8c939d;
|
|
|
width: 80px !important;
|
|
|
height: 80px !important;
|
|
|
line-height: 80px !important;
|
|
|
text-align: center;
|
|
|
}
|
|
|
|
|
|
::v-deep .avatar-uploader-icon {
|
|
|
font-size: 28px;
|
|
|
color: #8c939d;
|
|
|
width: 80px !important;
|
|
|
height: 80px !important;
|
|
|
line-height: 80px !important;
|
|
|
text-align: center;
|
|
|
}
|
|
|
|
|
|
::v-deep .avatar {
|
|
|
width: 80px !important;
|
|
|
display: block;
|
|
|
border-radius: 6px;
|
|
|
}
|
|
|
|
|
|
::v-deep .xy-table-item-label {
|
|
|
width: 160px !important;
|
|
|
}
|
|
|
|
|
|
::v-deep .el-date-editor .el-range-separator {
|
|
|
width: auto !important;
|
|
|
}
|
|
|
|
|
|
::v-deep .el-input-number .el-input__inner {
|
|
|
text-align: left !important;
|
|
|
}
|
|
|
</style>
|
