| New file |
| | |
| | | <template> |
| | | <div id="getCatalog" > |
| | | |
| | | <el-dialog title="选择要添加到的节点" v-if="showDialog" width="50%" :append-to-body="true" :close-on-click-modal="false" :visible.sync="showDialog" :destroy-on-close="true" @close="close()" center> |
| | | <div> |
| | | <el-tree class="el-scrollbar" |
| | | ref="tree" |
| | | id="catalogTree" |
| | | empty-text="未知节点" |
| | | node-key="id" |
| | | default-expand-all |
| | | :highlight-current="false" |
| | | :expand-on-click-node="false" |
| | | :props="props" |
| | | :load="loadNode" |
| | | @node-click="nodeClickHandler" |
| | | lazy> |
| | | <span class="custom-tree-node" slot-scope="{ node, data }" style="width: 100%"> |
| | | <el-radio v-if="node.data.type === 0 || node.data.type === -1" style="margin-right: 0" v-model="chooseId" :label="node.data.id">{{''}}</el-radio> |
| | | <span v-if="node.data.type === -1 && node.level === 1" style="font-size: 12px" class="iconfont icon-ziyuan"></span> |
| | | <span v-if="node.data.type === 0 && node.level === 1" class="el-icon-s-home"></span> |
| | | <span v-if="node.data.type === 0 && node.level > 1" class="el-icon-folder-opened"></span> |
| | | <span v-if="node.data.type === 1" class="iconfont icon-shexiangtou"></span> |
| | | <span v-if="node.data.type === 2" class="iconfont icon-zhibo"></span> |
| | | <span style=" padding-left: 1px">{{ node.label }}</span> |
| | | <span> |
| | | <i style="margin-left: 5rem; color: #9d9d9d; padding-right: 20px" v-if="node.data.id === defaultCatalogIdSign">默认</i> |
| | | </span> |
| | | </span> |
| | | </el-tree> |
| | | </div> |
| | | <div style="float: right; height: 13rem"> |
| | | <el-button type="primary" size="mini" @click="submit()" >确认</el-button> |
| | | <el-button @click="close()" size="mini">取消</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | |
| | | </div> |
| | | </template> |
| | | |
| | | |
| | | <script> |
| | | |
| | | export default { |
| | | name: 'getCatalog', |
| | | beforeCreate(){ |
| | | |
| | | }, |
| | | created() { |
| | | this.chooseId = this.defaultCatalogId; |
| | | this.defaultCatalogIdSign = this.defaultCatalogId; |
| | | this.initData(); |
| | | setTimeout(()=>{ |
| | | if (this.catalogIdChange)this.catalogIdChange(this.defaultCatalogId); |
| | | }, 100) |
| | | |
| | | }, |
| | | props: ['platformId'], |
| | | data() { |
| | | return { |
| | | props: { |
| | | label: 'name', |
| | | children: 'children', |
| | | isLeaf: 'leaf' |
| | | }, |
| | | platformName: null, |
| | | defaultCatalogId: null, |
| | | catalogIdResult: null, |
| | | showDialog: false, |
| | | defaultCatalogIdSign: null, |
| | | chooseNode: null, |
| | | chooseId: "", |
| | | catalogTree: null, |
| | | contextmenuShow: false, |
| | | |
| | | }; |
| | | }, |
| | | methods: { |
| | | openDialog(catalogIdResult) { |
| | | console.log(this.chooseId) |
| | | this.showDialog = true |
| | | this.catalogIdResult = catalogIdResult |
| | | }, |
| | | initData: function () { |
| | | this.getCatalog(); |
| | | }, |
| | | |
| | | getCatalog: function(parentId, callback) { |
| | | let that = this; |
| | | this.$axios({ |
| | | method:"get", |
| | | url:`/api/platform/catalog`, |
| | | params: { |
| | | platformId: that.platformId, |
| | | parentId: parentId |
| | | } |
| | | }) |
| | | .then((res)=> { |
| | | if (res.data.code === 0) { |
| | | if (typeof(callback) === 'function') { |
| | | callback(res.data.data) |
| | | } |
| | | } |
| | | }) |
| | | .catch(function (error) { |
| | | console.log(error); |
| | | }); |
| | | |
| | | }, |
| | | loadNode: function(node, resolve){ |
| | | if (node.level === 0) { |
| | | this.$axios({ |
| | | method:"get", |
| | | url:`/api/platform/info/` + this.platformId, |
| | | }) |
| | | .then((res)=> { |
| | | if (res.data.code === 0) { |
| | | this.platformName = res.data.data.name; |
| | | this.defaultCatalogId = res.data.data.catalogId; |
| | | this.defaultCatalogIdSign = res.data.data.catalogId; |
| | | this.chooseId = res.data.data.catalogId; |
| | | resolve([ |
| | | { |
| | | name: this.platformName, |
| | | id: res.data.data.deviceGBId, |
| | | type: 0 |
| | | } |
| | | ]); |
| | | } |
| | | }) |
| | | .catch(function (error) { |
| | | console.log(error); |
| | | }); |
| | | } |
| | | if (node.level >= 1){ |
| | | this.getCatalog(node.data.id, resolve) |
| | | } |
| | | }, |
| | | nodeClickHandler: function (data, node, tree){ |
| | | this.chooseId = data.id; |
| | | }, |
| | | close: function() { |
| | | this.chooseId = null; |
| | | this.showDialog = false; |
| | | }, |
| | | submit: function() { |
| | | console.log(this.chooseId) |
| | | if (this.chooseId === null) { |
| | | this.$message({ |
| | | showClose: true, |
| | | message: '未选择任何节点,', |
| | | type: 'warning' |
| | | }); |
| | | return; |
| | | } |
| | | if (this.catalogIdResult)this.catalogIdResult(this.chooseId) |
| | | this.showDialog = false; |
| | | }, |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style> |
| | | #catalogTree{ |
| | | display: inline-block; |
| | | } |
| | | </style> |