|
|
|
|
@ -18,7 +18,7 @@
|
|
|
|
|
<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"
|
|
|
|
|
v-for="item in filteredCangkuList"
|
|
|
|
|
:key="item.id"
|
|
|
|
|
:label="item.cangkumingcheng"
|
|
|
|
|
:value="item.id"
|
|
|
|
|
@ -43,7 +43,17 @@
|
|
|
|
|
<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;" />
|
|
|
|
|
<el-cascader
|
|
|
|
|
v-model="yijifenleiValue"
|
|
|
|
|
ref="yijifenleiCascader"
|
|
|
|
|
clearable
|
|
|
|
|
popper-class="select_popper"
|
|
|
|
|
placeholder="请选择一级分类(必须选到最后一级)"
|
|
|
|
|
style="width: 300px;"
|
|
|
|
|
:options="fenleiList"
|
|
|
|
|
:props="{label:'name',value:'id'}"
|
|
|
|
|
@change="changeYijifenlei"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
@ -53,7 +63,17 @@
|
|
|
|
|
<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;" />
|
|
|
|
|
<el-cascader
|
|
|
|
|
v-model="erjifenleiValue"
|
|
|
|
|
ref="erjifenleiCascader"
|
|
|
|
|
clearable
|
|
|
|
|
popper-class="select_popper"
|
|
|
|
|
placeholder="请选择二级分类(必须选到最后一级)"
|
|
|
|
|
style="width: 300px;"
|
|
|
|
|
:options="fenleiList"
|
|
|
|
|
:props="{label:'name',value:'id'}"
|
|
|
|
|
@change="changeErjifenlei"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
@ -63,7 +83,17 @@
|
|
|
|
|
<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;" />
|
|
|
|
|
<el-cascader
|
|
|
|
|
v-model="fenleiValue"
|
|
|
|
|
ref="fenleiCascader"
|
|
|
|
|
clearable
|
|
|
|
|
popper-class="select_popper"
|
|
|
|
|
placeholder="请选择所属种类(必须选到最后一级)"
|
|
|
|
|
style="width: 300px;"
|
|
|
|
|
:options="fenleiList"
|
|
|
|
|
:props="{label:'name',value:'id'}"
|
|
|
|
|
@change="changeFenlei"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
@ -73,7 +103,27 @@
|
|
|
|
|
<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;" />
|
|
|
|
|
<el-input
|
|
|
|
|
v-if="area_id"
|
|
|
|
|
v-model="form.quyu"
|
|
|
|
|
placeholder="区域"
|
|
|
|
|
readonly
|
|
|
|
|
style="width: 300px;"
|
|
|
|
|
/>
|
|
|
|
|
<el-select
|
|
|
|
|
v-else
|
|
|
|
|
v-model="form.quyu"
|
|
|
|
|
placeholder="请选择区域"
|
|
|
|
|
clearable
|
|
|
|
|
style="width: 300px;"
|
|
|
|
|
>
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="item in areaList"
|
|
|
|
|
:key="item.id"
|
|
|
|
|
:label="item.value"
|
|
|
|
|
:value="item.value"
|
|
|
|
|
/>
|
|
|
|
|
</el-select>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
@ -282,6 +332,10 @@ import {
|
|
|
|
|
import {
|
|
|
|
|
index as getFenleilist
|
|
|
|
|
} from '@/api/fenlei.js'
|
|
|
|
|
import {
|
|
|
|
|
getparameteritem
|
|
|
|
|
} from '@/api/system/dictionary.js'
|
|
|
|
|
import { mapState } from 'vuex'
|
|
|
|
|
export default {
|
|
|
|
|
props: {
|
|
|
|
|
// 是否为本地模式(不提交到接口,只返回数据)
|
|
|
|
|
@ -290,6 +344,9 @@ export default {
|
|
|
|
|
default: false
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
computed: {
|
|
|
|
|
...mapState('user', ['area_id'])
|
|
|
|
|
},
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
isShow: false,
|
|
|
|
|
@ -298,8 +355,13 @@ export default {
|
|
|
|
|
titleName: '',
|
|
|
|
|
tableName: 'flood_materials',
|
|
|
|
|
cangkuList: [],
|
|
|
|
|
fenleiList: [],
|
|
|
|
|
filteredCangkuList: [],
|
|
|
|
|
areaList: [],
|
|
|
|
|
fenleiList: [],
|
|
|
|
|
fenleiName: '',
|
|
|
|
|
yijifenleiValue: [],
|
|
|
|
|
erjifenleiValue: [],
|
|
|
|
|
fenleiValue: [],
|
|
|
|
|
form: {
|
|
|
|
|
guanliancangku: '',
|
|
|
|
|
cangkumingcheng: '',
|
|
|
|
|
@ -331,6 +393,26 @@ export default {
|
|
|
|
|
guanliancangku: [{
|
|
|
|
|
required: true,
|
|
|
|
|
message: '请选择仓库'
|
|
|
|
|
}],
|
|
|
|
|
fenlei: [{
|
|
|
|
|
required: true,
|
|
|
|
|
message: '请选择所属种类(三级分类)',
|
|
|
|
|
trigger: 'change'
|
|
|
|
|
}],
|
|
|
|
|
quyu: [{
|
|
|
|
|
required: true,
|
|
|
|
|
message: '区域不能为空',
|
|
|
|
|
trigger: 'blur'
|
|
|
|
|
}],
|
|
|
|
|
xianwuzimingcheng: [{
|
|
|
|
|
required: true,
|
|
|
|
|
message: '请输入现物资名称',
|
|
|
|
|
trigger: 'blur'
|
|
|
|
|
}],
|
|
|
|
|
shuliang: [{
|
|
|
|
|
required: true,
|
|
|
|
|
message: '请输入数量',
|
|
|
|
|
trigger: 'blur'
|
|
|
|
|
}]
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
@ -339,53 +421,201 @@ export default {
|
|
|
|
|
isShow(newVal) {
|
|
|
|
|
if (newVal) {
|
|
|
|
|
this.titleName = this.type === 'add' ? `新增物资` : `编辑物资`
|
|
|
|
|
// 设置区域值
|
|
|
|
|
this.setUserArea()
|
|
|
|
|
// 过滤仓库列表
|
|
|
|
|
this.filterCangkuList()
|
|
|
|
|
// 重置级联选择器
|
|
|
|
|
this.yijifenleiValue = []
|
|
|
|
|
this.erjifenleiValue = []
|
|
|
|
|
this.fenleiValue = []
|
|
|
|
|
if (this.type === 'editor') {
|
|
|
|
|
this.getDetail()
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
this.id = ''
|
|
|
|
|
this.type = ''
|
|
|
|
|
this.yijifenleiValue = []
|
|
|
|
|
this.erjifenleiValue = []
|
|
|
|
|
this.fenleiValue = []
|
|
|
|
|
this.$refs['dialog'].reset()
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
created() {
|
|
|
|
|
this.getFenlei()
|
|
|
|
|
this.getAreaList()
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
// 移除 children=[]
|
|
|
|
|
// 说明:不要“过滤掉叶子节点”,而是把空 children 删掉(这样第三级叶子仍然显示且可选)
|
|
|
|
|
removeEmptyChildren(node) {
|
|
|
|
|
if (Array.isArray(node)) {
|
|
|
|
|
return node.map(child => {
|
|
|
|
|
if (child.children) {
|
|
|
|
|
child.children = this.removeEmptyChildren(child.children)
|
|
|
|
|
if (child.children.length === 0) {
|
|
|
|
|
delete child.children
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
return child
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
return []
|
|
|
|
|
},
|
|
|
|
|
async getFenlei() {
|
|
|
|
|
const res = await getFenleilist({
|
|
|
|
|
tree: 1,
|
|
|
|
|
sort_type: 'ASC',
|
|
|
|
|
sort_name: 'sort'
|
|
|
|
|
})
|
|
|
|
|
this.fenleiList = res
|
|
|
|
|
this.fenleiList = this.removeEmptyChildren(res)
|
|
|
|
|
},
|
|
|
|
|
async getAreaList() {
|
|
|
|
|
try {
|
|
|
|
|
const res = await getparameteritem('area')
|
|
|
|
|
this.areaList = res.detail || []
|
|
|
|
|
} catch (error) {
|
|
|
|
|
console.error('获取区域列表失败', error)
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
setUserArea() {
|
|
|
|
|
// 根据用户的 area_id 设置区域名称
|
|
|
|
|
if (this.area_id && this.areaList.length > 0) {
|
|
|
|
|
const area = this.areaList.find(item => item.id == this.area_id)
|
|
|
|
|
if (area) {
|
|
|
|
|
this.form.quyu = area.value
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
filterCangkuList() {
|
|
|
|
|
// 根据用户的 area_id 过滤仓库列表
|
|
|
|
|
// 如果用户没有 area_id(null、undefined 或空值),显示所有仓库
|
|
|
|
|
if (this.area_id != null && this.area_id !== '') {
|
|
|
|
|
this.filteredCangkuList = this.cangkuList.filter(item => item.quyu_id == this.area_id)
|
|
|
|
|
} else {
|
|
|
|
|
// 如果没有 area_id,显示所有仓库
|
|
|
|
|
this.filteredCangkuList = this.cangkuList
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
// 根据 cascader value(路径id数组)拿到每一级节点
|
|
|
|
|
getPathNodes(value) {
|
|
|
|
|
if (!Array.isArray(value) || value.length === 0) return null
|
|
|
|
|
const pathNodes = []
|
|
|
|
|
let currentList = this.fenleiList
|
|
|
|
|
for (const nodeId of value) {
|
|
|
|
|
const node = (currentList || []).find(item => item.id == nodeId)
|
|
|
|
|
if (!node) return null
|
|
|
|
|
pathNodes.push(node)
|
|
|
|
|
currentList = node.children
|
|
|
|
|
}
|
|
|
|
|
return pathNodes
|
|
|
|
|
},
|
|
|
|
|
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
|
|
|
|
|
// 任意一个分类选择后:同步三个分类字段 + 同步三个 cascader
|
|
|
|
|
handleFenleiSelected(value) {
|
|
|
|
|
if (!Array.isArray(value) || value.length === 0) {
|
|
|
|
|
this.form.yijifenlei = ''
|
|
|
|
|
this.form.erjifenlei = ''
|
|
|
|
|
this.form.fenlei = ''
|
|
|
|
|
this.yijifenleiValue = []
|
|
|
|
|
this.erjifenleiValue = []
|
|
|
|
|
this.fenleiValue = []
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const pathNodes = this.getPathNodes(value)
|
|
|
|
|
if (!pathNodes || pathNodes.length === 0) {
|
|
|
|
|
Message({ type: 'error', message: '分类数据异常,请重新选择' })
|
|
|
|
|
this.yijifenleiValue = []
|
|
|
|
|
this.erjifenleiValue = []
|
|
|
|
|
this.fenleiValue = []
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
const lastNode = pathNodes[pathNodes.length - 1]
|
|
|
|
|
// 仅允许选择叶子节点(removeEmptyChildren 后,叶子节点一般没有 children)
|
|
|
|
|
if (lastNode && lastNode.children && lastNode.children.length > 0) {
|
|
|
|
|
Message({ type: 'warning', message: '必须选择到最后一级' })
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
console.log(this.form.fenlei)
|
|
|
|
|
|
|
|
|
|
this.form.yijifenlei = pathNodes[0]?.name || ''
|
|
|
|
|
this.form.erjifenlei = pathNodes[1]?.name || ''
|
|
|
|
|
this.form.fenlei = lastNode?.name || ''
|
|
|
|
|
|
|
|
|
|
// 三个 cascader 同步成同一路径
|
|
|
|
|
this.yijifenleiValue = value
|
|
|
|
|
this.erjifenleiValue = value
|
|
|
|
|
this.fenleiValue = value
|
|
|
|
|
},
|
|
|
|
|
changeYijifenlei(value) {
|
|
|
|
|
this.handleFenleiSelected(value)
|
|
|
|
|
},
|
|
|
|
|
changeErjifenlei(value) {
|
|
|
|
|
this.handleFenleiSelected(value)
|
|
|
|
|
},
|
|
|
|
|
changeFenlei(value) {
|
|
|
|
|
this.handleFenleiSelected(value)
|
|
|
|
|
},
|
|
|
|
|
setCkList(e) {
|
|
|
|
|
if (e) {
|
|
|
|
|
this.cangkuList = e
|
|
|
|
|
// 设置仓库列表后,立即过滤
|
|
|
|
|
this.filterCangkuList()
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
changeCk(e) {
|
|
|
|
|
if (e) {
|
|
|
|
|
const selectedWarehouse = this.cangkuList.find(item => e === item.id)
|
|
|
|
|
const selectedWarehouse = this.filteredCangkuList.find(item => e === item.id)
|
|
|
|
|
if (selectedWarehouse) {
|
|
|
|
|
this.form.guanliancangku = selectedWarehouse.id
|
|
|
|
|
this.form.cangkumingcheng = selectedWarehouse.cangkumingcheng
|
|
|
|
|
|
|
|
|
|
// 如果用户没有 area_id,根据仓库的 quyu_id 自动填充区域名
|
|
|
|
|
if ((this.area_id == null || this.area_id === '') && selectedWarehouse.quyu_id && this.areaList.length > 0) {
|
|
|
|
|
const area = this.areaList.find(item => item.id == selectedWarehouse.quyu_id)
|
|
|
|
|
if (area) {
|
|
|
|
|
this.form.quyu = area.value
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
console.log(this.form.guanliancangku)
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
// 根据分类名称查找对应的 ID 路径
|
|
|
|
|
findFenleiPath(list, targetName, path = []) {
|
|
|
|
|
for (let i = 0; i < list.length; i++) {
|
|
|
|
|
const node = list[i]
|
|
|
|
|
const currentPath = [...path, node.id]
|
|
|
|
|
|
|
|
|
|
if (node.name === targetName) {
|
|
|
|
|
return currentPath
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
if (node.children && node.children.length > 0) {
|
|
|
|
|
const found = this.findFenleiPath(node.children, targetName, currentPath)
|
|
|
|
|
if (found) {
|
|
|
|
|
return found
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
return null
|
|
|
|
|
},
|
|
|
|
|
// 设置级联选择器的值(编辑时回显)
|
|
|
|
|
setCascaderValue() {
|
|
|
|
|
// 以“所属种类”优先回显(最稳定),找到路径后同步三套 cascader
|
|
|
|
|
if (!this.fenleiList || this.fenleiList.length === 0) return
|
|
|
|
|
|
|
|
|
|
const targetName = this.form.fenlei || this.form.erjifenlei || this.form.yijifenlei
|
|
|
|
|
if (!targetName) return
|
|
|
|
|
|
|
|
|
|
const path = this.findFenleiPath(this.fenleiList, targetName)
|
|
|
|
|
if (path && path.length > 0) {
|
|
|
|
|
this.yijifenleiValue = path
|
|
|
|
|
this.erjifenleiValue = path
|
|
|
|
|
this.fenleiValue = path
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
async getDetail() {
|
|
|
|
|
const res = await show({
|
|
|
|
|
id: this.id,
|
|
|
|
|
@ -417,8 +647,11 @@ export default {
|
|
|
|
|
chubeicengji: res?.chubeicengji,
|
|
|
|
|
shifouzhanshi: res?.shifouzhanshi,
|
|
|
|
|
is_chart: res?.is_chart
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
// 设置级联选择器的值(需要等待 fenleiList 加载完成)
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
this.setCascaderValue()
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
submit() {
|
|
|
|
|
console.log('this.form', this.form)
|
|
|
|
|
@ -433,6 +666,34 @@ export default {
|
|
|
|
|
})
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
if (!this.form.fenlei) {
|
|
|
|
|
Message({
|
|
|
|
|
type: 'warning',
|
|
|
|
|
message: '请选择所属种类(三级分类)'
|
|
|
|
|
})
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
if (!this.form.quyu) {
|
|
|
|
|
Message({
|
|
|
|
|
type: 'warning',
|
|
|
|
|
message: '区域不能为空'
|
|
|
|
|
})
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
if (!this.form.xianwuzimingcheng) {
|
|
|
|
|
Message({
|
|
|
|
|
type: 'warning',
|
|
|
|
|
message: '请输入现物资名称'
|
|
|
|
|
})
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
if (!this.form.shuliang) {
|
|
|
|
|
Message({
|
|
|
|
|
type: 'warning',
|
|
|
|
|
message: '请输入数量'
|
|
|
|
|
})
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 触发事件,返回物资数据
|
|
|
|
|
this.$emit('material-added', { ...this.form })
|
|
|
|
|
@ -442,8 +703,38 @@ export default {
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 正常模式,提交到接口
|
|
|
|
|
// 正常模式,提交到接口前验证必填字段
|
|
|
|
|
if (this.type === 'add') {
|
|
|
|
|
// 验证必填字段
|
|
|
|
|
if (!this.form.fenlei) {
|
|
|
|
|
Message({
|
|
|
|
|
type: 'warning',
|
|
|
|
|
message: '请选择所属种类(三级分类)'
|
|
|
|
|
})
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
if (!this.form.quyu) {
|
|
|
|
|
Message({
|
|
|
|
|
type: 'warning',
|
|
|
|
|
message: '区域不能为空'
|
|
|
|
|
})
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
if (!this.form.xianwuzimingcheng) {
|
|
|
|
|
Message({
|
|
|
|
|
type: 'warning',
|
|
|
|
|
message: '请输入现物资名称'
|
|
|
|
|
})
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
if (!this.form.shuliang) {
|
|
|
|
|
Message({
|
|
|
|
|
type: 'warning',
|
|
|
|
|
message: '请输入数量'
|
|
|
|
|
})
|
|
|
|
|
return
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
save({
|
|
|
|
|
table_name: this.tableName,
|
|
|
|
|
...this.form
|
|
|
|
|
|