script部分
export default {
name: 'Tag',
data () {
return {
depName: '',
desc: '',
location: '',
isResourceShow: 1,
addView: false, //弹出框
sonStatus: false,
editView: false,
casArr: [],
childArr: [],
form: {},
data: {},
idx: '',
childkey: [],
formLabelWidth: '80px',
rules: {
label: [
{
required: true,
message: '请输入名称',
trigger: 'blur'
},
],
depName : {
required: true,
message: '请输入负责人',
trigger: 'blur'
}
},
locationData: [
{
id: 1,
name: '添加同级部门'
},
{
id: 2,
name: '添加子级部门'
}
],
tableData: []
}
},
methods: {
// 监听关闭窗口
closeView () {
this.$refs['form'].resetFields() // 关闭窗口,清空填写的内容
},
// 打开编辑
handleClick (item, index) {
item.value.length !== 1
? (this.sonStatus = true)
: (this.sonStatus = false)
this.editView = true
const obj = Object.assign({}, item)
this.childkey = item.childkey
this.casArr = item.childArr
this.idx = index
this.data = obj
},
// 递归表格数据(编辑)
findSd (arr, i, casArr) {
if (i === casArr.length - 1) {
let index = casArr[i].substr(casArr[i].length - 1, 1)
return arr.splice(index, 1, this.data)
} else {
return this.findSd(
arr[casArr[i].substr(casArr[i].length - 1, 1)].children,
(i += 1),
casArr
)
}
},
// 确定编辑
okEdit (data) {
this.$refs[data].validate(valid => {
if (valid) {
if (this.data.value.length === 1) {
this.tableData.splice(this.idx, 1, this.data)
this.$message({
type: 'success',
message: '编辑成功'
})
this.editView = false
} else {
this.findSd(this.tableData, 0, this.childkey)
this.$message({
type: 'success',
message: '编辑成功'
})
this.editView = false
}
} else {
return false
}
})
},
// 递归表格数据(删除)
findDel (arr, i, item) {
let casArr = item.childkey
if (i === casArr.length - 1) {
let index = casArr[i].substr(casArr[i].length - 1, 1)
return arr.splice(index, 1)
} else {
return this.findDel(
arr[casArr[i].substr(casArr[i].length - 1, 1)].children,
(i += 1),
item
)
}
},
// 删除
deleteClick (item) {
this.$confirm(`此操作将删除该项, 是否继续?`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
if (item.children.length !== 0) {
this.$message.warning({
message: '请删除子节点',
duration: 1000
})
} else {
this.casArr = item.childArr
++this.isResourceShow // 给级联控件绑定一个key,防止报错。
if (item.value.length === 1) { // 删除的是顶节点
console.log(1)
this.tableData.splice(item.value, 1)
this.$message({
type: 'success',
message: '删除成功'
})
} else { // 删除的是子节点
console.log(2)
this.findDel(this.tableData, 0, item)
this.$message({
type: 'success',
message: '删除成功'
})
}
}
})
.catch(err => {
console.log(err)
this.$message({
type: 'info',
message: '已取消删除'
})
})
},
// 是否显示次位置
locationChange (v) {
this.sonStatus = v === 2
},
// 获取次位置
getCasVal (v) {
this.casArr = v
this.form.childArr = v
},
// 递归表格数据(添加)
find (arr, i) {
if (i === this.casArr.length - 1) {
return arr[this.casArr[i].substr(this.casArr[i].length - 1, 1)]
.children
} else {
return this.find(
arr[this.casArr[i].substr(this.casArr[i].length - 1, 1)]
.children,
(i += 1)
)
}
},
// 确定添加
okAdd (form) {
this.$refs[form].validate(valid => {
if (valid) {
if (this.sonStatus === false) {
console.log(this.form);
console.log(this.tableData);
this.form.value = String(this.tableData.length)
const obj = Object.assign({}, this.form)
obj.children = []
obj.childArr = []
this.tableData.push(obj)
this.$message({
type: 'success',
message: '添加成功'
})
this.addView = false
} else {
let arr = this.find(this.tableData, 0)
this.childArr = [...this.casArr, String(arr.length)]
this.form.value =
String(this.casArr[this.casArr.length - 1]) +
String(arr.length)
delete this.form.children
const obj = Object.assign({}, this.form)
obj.children = []
obj.childkey = [...this.casArr, String(arr.length)]
arr.push(obj)
this.$message({
type: 'success',
message: '添加成功'
})
this.addView = false
}
} else {
return false
}
})
}
}
}