| | |
| | | <template> |
| | | <el-container> |
| | | <el-aside> |
| | | <basic-container style="height: 85vh; max-height: 155vh; overflow-y: scroll;"> |
| | | <avue-tree ref="tree" v-model="CloneTreeAvueform" v-loading="loading" :data="CloneTreedata" :defaultExpandAll="false" |
| | | :option="Treeoption" |
| | | style="height: 80.5vh;padding-top: 5px;padding-bottom: 30px" |
| | | @node-click=" nodeClick" |
| | | @check-change="checkChange" |
| | | ></avue-tree> |
| | | </basic-container> |
| | | </el-aside> |
| | | <el-main> |
| | | <TableCrud></TableCrud> |
| | | </el-main> |
| | | </el-container> |
| | | <el-container> |
| | | <el-aside> |
| | | <basic-container style="overflow: hidden;"> |
| | | <!-- 树组件--> |
| | | <master-tree |
| | | :currentPage="this.currentPage" |
| | | :pageSize="this.pageSize" |
| | | @TreeValue="TreeValueEmit" |
| | | @Treedata="TreedataList" |
| | | @codeClassifyOid="codeClassifyOidList" |
| | | @coderuleoid="coderuleoidList" |
| | | @nodeClick="nodeClick" |
| | | @tableDataArray="tableDataArrays" |
| | | @tableHeadBttoms="tableHeadBttoms" |
| | | @tableHeadDataFateher="tableHeadDatas" |
| | | @tableHeadFindData="tableHeadFindDatas" |
| | | @total="totals" |
| | | > |
| | | </master-tree> |
| | | </basic-container> |
| | | </el-aside> |
| | | <el-main> |
| | | <!-- 表格组件--> |
| | | <VciMasterCrud |
| | | :TreeValue="TreeValue" |
| | | :Treedata="Treedata" |
| | | :codeClassifyOid="this.codeClassifyOid" |
| | | :coderuleoid="this.coderuleoid" |
| | | :isLoading="isLoading" |
| | | :page="this.page" |
| | | :tableDataArray="tableDataArray" |
| | | :tableHeadBtnData="masterVrBtnList" |
| | | :tableHeadDataFateher="this.tableHeadDataFateher" |
| | | :tableHeadFindData="tableHeadFindData" |
| | | :templateOid="templateOid" |
| | | :total="this.total" |
| | | @currentPage="currentPages" |
| | | @pageSize="pageSizes" |
| | | > |
| | | </VciMasterCrud> |
| | | </el-main> |
| | | </el-container> |
| | | </template> |
| | | |
| | | <script> |
| | | import {getAtrrList, TreeCheckDel, TreeDel, TreeSave} from "@/api/template/templateAttr"; |
| | | |
| | | export default { |
| | | name: "items.vue", |
| | | data(){ |
| | | return{ |
| | | CloneTreeAvueform:{}, |
| | | loading:false, |
| | | CloneTreedata:[], |
| | | Treeoption: { |
| | | addBtn: false, |
| | | editBtn: false, |
| | | delBtn: false, |
| | | defaultExpandAll: false, |
| | | menu: false, |
| | | // //这个是多选 |
| | | // multiple: true, |
| | | data() { |
| | | return { |
| | | // 分页 |
| | | page: { |
| | | total: 0, |
| | | currentPage: 1, |
| | | pageSize: 100, |
| | | pageSizes: [10, 30, 50, 100, 200], |
| | | }, |
| | | nodeClickList: "", |
| | | pageSize: "100", |
| | | currentPage: "1", |
| | | codeClassifyOid: "", |
| | | coderuleoid: "", |
| | | Treedata: [], |
| | | templateOid: "", |
| | | tableDataArray: [], |
| | | masterVrBtnList: [], |
| | | tableHeadDataFateher: [], |
| | | total: "", |
| | | isLoading: false, |
| | | tableHeadFindData: {}, |
| | | TreeValue: '' |
| | | } |
| | | }, |
| | | created() { |
| | | this.getAttr() |
| | | }, |
| | | methods:{ |
| | | getAttr() { |
| | | getAtrrList().then(res => { |
| | | this.Treedata = res.data; |
| | | this.CloneTreedata = res.data; |
| | | this.Treedata.forEach((item) => { |
| | | for (let i = 0; i < this.Treedata.length; i++) { |
| | | this.Treedata[i].value = i; |
| | | } |
| | | }) |
| | | //调用修改属性名方法 |
| | | this.ModifyProperties(this.CloneTreedata, 'name', 'label'); |
| | | }).catch(res => { |
| | | this.$message.error(res) |
| | | }) |
| | | methods: { |
| | | TreeValueEmit(val) { |
| | | this.TreeValue = val |
| | | }, |
| | | //定义一个修改数据属性名的方法 |
| | | ModifyProperties(obj, oldName, newName) { |
| | | for (let key in obj) { |
| | | if (key === oldName) { |
| | | obj[newName] = obj[key]; |
| | | delete obj[key]; |
| | | } |
| | | if (typeof obj[key] === 'object') { |
| | | this.ModifyProperties(obj[key], oldName, newName); |
| | | } |
| | | } |
| | | codeClassifyOidList(val) { |
| | | this.codeClassifyOid = val; |
| | | }, |
| | | //树节点添加按钮 |
| | | TreeAdd() { |
| | | this.TreeAddFormVisible = true; |
| | | // 判断当前是否有点击子项 |
| | | if (this.nodeClickList !== "") { |
| | | this.TreeFlag = true |
| | | } |
| | | coderuleoidList(val) { |
| | | this.coderuleoid = val; |
| | | }, |
| | | //树节点添加事件 |
| | | TreeAddHandler() { |
| | | const data = this.TreeAddform |
| | | this.$set(data, "parentCodeClassifyOid", this.nodeClickList.oid) |
| | | TreeSave(data).then(() => { |
| | | this.$message({ |
| | | type: 'success', |
| | | message: '添加成功!' |
| | | }); |
| | | this.getAttr(); |
| | | this.TreeAddFormVisible = false |
| | | this.TreeAddform = "" |
| | | }).catch(res => { |
| | | this.$message({ |
| | | type: 'warning', |
| | | message: res |
| | | }); |
| | | }) |
| | | TreedataList(val) { |
| | | this.Treedata = val |
| | | }, |
| | | //树节点删除按钮 |
| | | TreeDel() { |
| | | this.$confirm('是否删除当前选择的分类,将会把子分类一并删除,如果存在编码数据将不能被删除,是否继续?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | customClass: 'my-messagebox', |
| | | }).then(() => { |
| | | TreeCheckDel(this.nodeClickList).then(res => { |
| | | if (res.data.data) { |
| | | TreeDel(this.nodeClickList).then(() => { |
| | | this.$message({ |
| | | type: 'success', |
| | | message: '删除成功!' |
| | | }); |
| | | this.getAttr(); |
| | | }).catch(res => { |
| | | this.$message({ |
| | | type: 'warning', |
| | | message: res |
| | | }); |
| | | }) |
| | | } else { |
| | | this.$confirm('当前数据包含有下级数据,要删除的话会和下级数据一起删除,你确认继续?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | customClass: 'my-messageboxs', |
| | | }).then(() => { |
| | | TreeDel(this.nodeClickList).then(() => { |
| | | this.$message({ |
| | | type: 'success', |
| | | message: '删除成功!' |
| | | }); |
| | | this.getAttr(); |
| | | }).catch(res => { |
| | | this.$message({ |
| | | type: 'warning', |
| | | message: res |
| | | }); |
| | | }) |
| | | }).catch(() => { |
| | | this.$message({ |
| | | type: 'info', |
| | | message: '已取消删除' |
| | | }); |
| | | }); |
| | | } |
| | | }) |
| | | }).catch(() => { |
| | | this.$message({ |
| | | type: 'info', |
| | | message: '已取消删除' |
| | | }); |
| | | }); |
| | | pageSizes(val) { |
| | | this.pageSize = val |
| | | }, |
| | | nodeClick(data){ |
| | | this.nodeClickList = data |
| | | console.log(data) |
| | | } |
| | | currentPages(val) { |
| | | this.currentPage = val |
| | | }, |
| | | tableDataArrays(val) { |
| | | this.tableDataArray = val |
| | | }, |
| | | totals(val) { |
| | | this.total = val |
| | | }, |
| | | tableHeadDatas(val) { |
| | | this.tableHeadDataFateher = val |
| | | }, |
| | | tableHeadFindDatas(val) { |
| | | this.tableHeadFindData = val |
| | | }, |
| | | nodeClick(val) { |
| | | this.templateOid = val; |
| | | this.isLoading = true; |
| | | setTimeout(() => { |
| | | this.isLoading = false; |
| | | }, 2000); |
| | | }, |
| | | tableHeadBttoms(val) { |
| | | this.masterVrBtnList = val |
| | | }, |
| | | } |
| | | } |
| | | </script> |