|
|
@ -9,7 +9,7 @@ |
|
|
|
<template v-if="!sorting"> |
|
|
|
<template v-if="!sorting"> |
|
|
|
<el-button v-auth="'栏目管理:更改排序'" class="action-btn" type="primary" round @click="openSort">更改排序 |
|
|
|
<el-button v-auth="'栏目管理:更改排序'" class="action-btn" type="primary" round @click="openSort">更改排序 |
|
|
|
</el-button> |
|
|
|
</el-button> |
|
|
|
<el-button v-auth="'栏目管理:添加栏目'" class="action-btn" type="primary" round @click="addColumn">添加栏目 |
|
|
|
<el-button v-auth="'栏目管理:添加栏目'" class="action-btn" type="primary" round @click="handleColumn(false, 0, 0)">添加栏目 |
|
|
|
</el-button> |
|
|
|
</el-button> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</div> |
|
|
|
</div> |
|
|
@ -24,12 +24,12 @@ |
|
|
|
<el-tree :data="listData" node-key="id" default-expand-all @node-drop="handleDrop" |
|
|
|
<el-tree :data="listData" node-key="id" default-expand-all @node-drop="handleDrop" |
|
|
|
:draggable="sorting" :allow-drop="allowDrop" :allow-drag="allowDrag"> |
|
|
|
:draggable="sorting" :allow-drop="allowDrop" :allow-drag="allowDrag"> |
|
|
|
<span class="custom-tree-node" slot-scope="{ node, data }"> |
|
|
|
<span class="custom-tree-node" slot-scope="{ node, data }"> |
|
|
|
<span class="name">{{ node.label }}</span> |
|
|
|
<span class="name">{{ data.name }}</span> |
|
|
|
<span class="action" v-show="!sorting"> |
|
|
|
<span class="action" v-show="!sorting"> |
|
|
|
<el-button v-auth="'栏目管理:编辑'" type="text" @click.stop="editType(data)">编辑</el-button> |
|
|
|
<el-button v-auth="'栏目管理:编辑'" type="text" @click.stop="handleColumn(data)">编辑</el-button> |
|
|
|
<el-divider v-auth="'栏目管理:编辑'" direction="vertical"></el-divider> |
|
|
|
<el-divider v-auth="'栏目管理:编辑'" direction="vertical"></el-divider> |
|
|
|
<template v-if="node.level < 6"> |
|
|
|
<template v-if="node.level < 4"> |
|
|
|
<el-button v-auth="'栏目管理:新增'" type="text" @click.stop="addType(data)">新增</el-button> |
|
|
|
<el-button v-auth="'栏目管理:新增'" type="text" @click.stop="handleColumn(data, data.id, data.level + 1)">新增</el-button> |
|
|
|
<el-divider v-auth="'栏目管理:新增'" direction="vertical"></el-divider> |
|
|
|
<el-divider v-auth="'栏目管理:新增'" direction="vertical"></el-divider> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
<el-button v-auth="'栏目管理:删除'" type="text" @click.stop="delData(data)">删除</el-button> |
|
|
|
<el-button v-auth="'栏目管理:删除'" type="text" @click.stop="delData(data)">删除</el-button> |
|
|
@ -40,11 +40,11 @@ |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
|
|
<el-dialog :title="isAddColumn ? '添加栏目' : '编辑栏目'" :visible.sync="columnVisible" width="400px" |
|
|
|
<el-dialog :title="!curRow.id ? '添加栏目' : '编辑栏目'" :visible.sync="columnVisible" width="400px" |
|
|
|
:close-on-click-modal="false" @close="closeColumn"> |
|
|
|
:close-on-click-modal="false" @close="closeColumn"> |
|
|
|
<el-form> |
|
|
|
<el-form> |
|
|
|
<el-form-item> |
|
|
|
<el-form-item> |
|
|
|
<el-input placeholder="栏目名称" v-model="columnName"></el-input> |
|
|
|
<el-input placeholder="栏目名称" v-model="curRow.name"></el-input> |
|
|
|
</el-form-item> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
</el-form> |
|
|
|
<span slot="footer" class="dialog-footer"> |
|
|
|
<span slot="footer" class="dialog-footer"> |
|
|
@ -52,19 +52,6 @@ |
|
|
|
<el-button type="primary" @click="columnSubmit">确 定</el-button> |
|
|
|
<el-button type="primary" @click="columnSubmit">确 定</el-button> |
|
|
|
</span> |
|
|
|
</span> |
|
|
|
</el-dialog> |
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
|
|
|
|
<el-dialog :title="isAddType ? '添加分类' : '编辑分类'" :visible.sync="typeVisible" width="400px" |
|
|
|
|
|
|
|
:close-on-click-modal="false" @close="closeType"> |
|
|
|
|
|
|
|
<el-form> |
|
|
|
|
|
|
|
<el-form-item> |
|
|
|
|
|
|
|
<el-input placeholder="分类名称" v-model="typeName"></el-input> |
|
|
|
|
|
|
|
</el-form-item> |
|
|
|
|
|
|
|
</el-form> |
|
|
|
|
|
|
|
<span slot="footer" class="dialog-footer"> |
|
|
|
|
|
|
|
<el-button @click="typeVisible = false">取 消</el-button> |
|
|
|
|
|
|
|
<el-button type="primary" @click="typeSubmit">确 定</el-button> |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
@ -85,20 +72,15 @@ export default { |
|
|
|
multipleSelection: [], |
|
|
|
multipleSelection: [], |
|
|
|
pageNo: 1, |
|
|
|
pageNo: 1, |
|
|
|
pageSize: 10, |
|
|
|
pageSize: 10, |
|
|
|
totals: 0, |
|
|
|
total: 0, |
|
|
|
columnVisible: false, |
|
|
|
columnVisible: false, |
|
|
|
columnName: "", |
|
|
|
|
|
|
|
typeVisible: false, |
|
|
|
|
|
|
|
typeName: "", |
|
|
|
|
|
|
|
curRow: {}, |
|
|
|
curRow: {}, |
|
|
|
sortObj: null, |
|
|
|
sortObj: null, |
|
|
|
sorting: false, |
|
|
|
sorting: false, |
|
|
|
curParentId: "", |
|
|
|
parentId: '', |
|
|
|
isAddColumn: false, |
|
|
|
|
|
|
|
isAddType: false, |
|
|
|
isAddType: false, |
|
|
|
defaultProps: { |
|
|
|
defaultProps: { |
|
|
|
children: "children", |
|
|
|
label: "name" |
|
|
|
label: "label" |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
}; |
|
|
|
}; |
|
|
|
}, |
|
|
|
}, |
|
|
@ -121,42 +103,14 @@ export default { |
|
|
|
}, |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
methods: { |
|
|
|
getData() { |
|
|
|
getData() { |
|
|
|
let data = { |
|
|
|
this.$get(this.api.queryAllColumns, { |
|
|
|
platformId: Setting.platformId, |
|
|
|
platformId: Setting.platformId, |
|
|
|
page: this.pageNo, |
|
|
|
page: this.pageNo, |
|
|
|
size: this.pageSize |
|
|
|
size: this.pageSize |
|
|
|
}; |
|
|
|
}).then(({ columnTree }) => { |
|
|
|
this.$get(this.api.queryAllColumns, data).then(res => { |
|
|
|
this.listData = columnTree |
|
|
|
let columnTree = res.columnTree; |
|
|
|
|
|
|
|
let total = columnTree.length; |
|
|
|
|
|
|
|
let list = []; |
|
|
|
|
|
|
|
columnTree.forEach((n, k) => { |
|
|
|
|
|
|
|
list.push({ |
|
|
|
|
|
|
|
id: n.id, |
|
|
|
|
|
|
|
label: n.name, |
|
|
|
|
|
|
|
level: n.level, |
|
|
|
|
|
|
|
parentId: n.parentId, |
|
|
|
|
|
|
|
sort: n.sort, |
|
|
|
|
|
|
|
children: [] |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
n.secondColumn.forEach((j, i) => { |
|
|
|
|
|
|
|
list[k].children.push({ |
|
|
|
|
|
|
|
id: j.id, |
|
|
|
|
|
|
|
label: j.name, |
|
|
|
|
|
|
|
level: j.level, |
|
|
|
|
|
|
|
parentId: j.parentId, |
|
|
|
|
|
|
|
sort: j.sort |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
total += n.secondColumn.length; |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
this.listData = list; |
|
|
|
|
|
|
|
this.originalList = JSON.parse(JSON.stringify(this.listData)); |
|
|
|
this.originalList = JSON.parse(JSON.stringify(this.listData)); |
|
|
|
this.totals = total; |
|
|
|
this.total = columnTree.length |
|
|
|
if (!this.listData.length && this.totals) { |
|
|
|
|
|
|
|
this.pageNo--; |
|
|
|
|
|
|
|
this.getData(); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}).catch(res => { |
|
|
|
}).catch(res => { |
|
|
|
}); |
|
|
|
}); |
|
|
|
}, |
|
|
|
}, |
|
|
@ -174,9 +128,19 @@ export default { |
|
|
|
.catch(() => { |
|
|
|
.catch(() => { |
|
|
|
}); |
|
|
|
}); |
|
|
|
}, |
|
|
|
}, |
|
|
|
addColumn() { |
|
|
|
handleColumn(row, parentId, level) { |
|
|
|
this.isAddColumn = true; |
|
|
|
this.columnVisible = true |
|
|
|
this.columnVisible = true; |
|
|
|
if (row) { |
|
|
|
|
|
|
|
this.curRow = JSON.parse(JSON.stringify(row)) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
if (typeof parentId === 'number') { |
|
|
|
|
|
|
|
this.curRow = { |
|
|
|
|
|
|
|
parentId, |
|
|
|
|
|
|
|
level, |
|
|
|
|
|
|
|
name: '', |
|
|
|
|
|
|
|
platformId: Setting.platformId |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
}, |
|
|
|
sortSubmit() { |
|
|
|
sortSubmit() { |
|
|
|
let list = JSON.parse(JSON.stringify(this.listData)); |
|
|
|
let list = JSON.parse(JSON.stringify(this.listData)); |
|
|
@ -206,70 +170,23 @@ export default { |
|
|
|
}); |
|
|
|
}); |
|
|
|
}, |
|
|
|
}, |
|
|
|
columnSubmit() { |
|
|
|
columnSubmit() { |
|
|
|
if (!this.columnName) return util.warningMsg("请填写栏目名称"); |
|
|
|
const row = this.curRow |
|
|
|
let data = { |
|
|
|
if (!row.name) return util.warningMsg("请填写栏目名称"); |
|
|
|
level: 1, |
|
|
|
if (this.curRow.id) { |
|
|
|
parentId: 1, |
|
|
|
this.$put(this.api.editColumn, row).then(res => { |
|
|
|
name: this.columnName |
|
|
|
util.successMsg("修改成功"); |
|
|
|
}; |
|
|
|
this.columnVisible = false; |
|
|
|
if (this.curRow.id) { |
|
|
|
this.getData(); |
|
|
|
data.id = this.curRow.id; |
|
|
|
}).catch(res => { |
|
|
|
this.$put(this.api.editColumn, data).then(res => { |
|
|
|
}); |
|
|
|
util.warningMsg("修改成功"); |
|
|
|
} else { |
|
|
|
this.columnVisible = false; |
|
|
|
this.$post(this.api.addColumn, row).then(res => { |
|
|
|
this.getData(); |
|
|
|
util.successMsg("添加成功"); |
|
|
|
}).catch(res => { |
|
|
|
this.columnVisible = false; |
|
|
|
}); |
|
|
|
this.getData(); |
|
|
|
} else { |
|
|
|
}).catch(res => { |
|
|
|
this.$post(this.api.addColumn, data).then(res => { |
|
|
|
}); |
|
|
|
util.successMsg("添加成功"); |
|
|
|
} |
|
|
|
this.columnVisible = false; |
|
|
|
|
|
|
|
this.getData(); |
|
|
|
|
|
|
|
}).catch(res => { |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
addType(row) { |
|
|
|
|
|
|
|
this.isAddType = true; |
|
|
|
|
|
|
|
this.curRow = row; |
|
|
|
|
|
|
|
this.typeVisible = true; |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
editType(row) { |
|
|
|
|
|
|
|
this.curRow = row; |
|
|
|
|
|
|
|
if (row.level == 1) { |
|
|
|
|
|
|
|
this.isAddColumn = false; |
|
|
|
|
|
|
|
this.columnVisible = true; |
|
|
|
|
|
|
|
this.columnName = row.label; |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
this.isAddType = false; |
|
|
|
|
|
|
|
this.typeVisible = true; |
|
|
|
|
|
|
|
this.typeName = row.label; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
typeSubmit(row) { |
|
|
|
|
|
|
|
if (!this.typeName) return util.warningMsg("请填写分类名称"); |
|
|
|
|
|
|
|
let data = { |
|
|
|
|
|
|
|
level: 2, |
|
|
|
|
|
|
|
name: this.typeName |
|
|
|
|
|
|
|
}; |
|
|
|
|
|
|
|
if (this.curRow.level == 2) { |
|
|
|
|
|
|
|
data.id = this.curRow.id; |
|
|
|
|
|
|
|
data.parentId = this.curRow.parentId; |
|
|
|
|
|
|
|
this.$put(this.api.editColumn, data).then(res => { |
|
|
|
|
|
|
|
util.successMsg("修改成功"); |
|
|
|
|
|
|
|
this.typeVisible = false; |
|
|
|
|
|
|
|
this.getData(); |
|
|
|
|
|
|
|
}).catch(res => { |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} else { |
|
|
|
|
|
|
|
data.parentId = this.curRow.id; |
|
|
|
|
|
|
|
this.$post(this.api.addColumn, data).then(res => { |
|
|
|
|
|
|
|
util.successMsg("新增成功"); |
|
|
|
|
|
|
|
this.typeVisible = false; |
|
|
|
|
|
|
|
this.getData(); |
|
|
|
|
|
|
|
}).catch(res => { |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}, |
|
|
|
}, |
|
|
|
cancelSort() { |
|
|
|
cancelSort() { |
|
|
|
this.sorting = false; |
|
|
|
this.sorting = false; |
|
|
@ -291,12 +208,7 @@ export default { |
|
|
|
this.getData(); |
|
|
|
this.getData(); |
|
|
|
}, |
|
|
|
}, |
|
|
|
closeColumn() { |
|
|
|
closeColumn() { |
|
|
|
this.columnName = ""; |
|
|
|
this.curRow = {} |
|
|
|
this.curRow = {}; |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
closeType() { |
|
|
|
|
|
|
|
this.typeName = ""; |
|
|
|
|
|
|
|
this.curRow = {}; |
|
|
|
|
|
|
|
}, |
|
|
|
}, |
|
|
|
handleDrop(draggingNode, dropNode, dropType, ev) { |
|
|
|
handleDrop(draggingNode, dropNode, dropType, ev) { |
|
|
|
// console.log('tree drop: ', dropNode, dropType); |
|
|
|
// console.log('tree drop: ', dropNode, dropType); |
|
|
|