| | |
| | | <title>报表管理</title> |
| | | |
| | | <script type="text/javascript"> |
| | | var pageVue = null; |
| | | function loadJsCss(callback) { |
| | | var jscss_urls = [ |
| | | {id: "css_m1", type: "css", url: "root/css/tree.css"}, |
| | |
| | | new TreeVue({ |
| | | el: "#vbody", |
| | | data: { |
| | | dataname: "md_product_category", |
| | | title: "报表管理", |
| | | dataname: "sys_report_echarts", |
| | | title: "分析报表", |
| | | tree_title: "报表分类", |
| | | treeTxtFormatter: "{name}", |
| | | isTreeReadonly: false, |
| | | selectnodedata: {}, |
| | | dataRequest: [ |
| | | { |
| | | name: "sys_report", |
| | | //url: "root/front/getOneDictionary", |
| | | //paramsobj: { code: "OrgType", }, |
| | | //filter: " type='agreement'", |
| | | isnotoption: true, //true:不是选项 |
| | | }, |
| | | { |
| | | name: "jimu_report", |
| | | //url: "root/front/getOneDictionary", |
| | | //paramsobj: { code: "OrgType", }, |
| | | isnotoption: true, //true:不是选项 |
| | | filter: "type in ('datainfo', 'chartinfo', 'printinfo')",//:"id",//是下拉选项时设置 |
| | | orderby: "update_time desc" |
| | | }, |
| | | // { |
| | | // name: "sys_report_echarts", |
| | | // //url: "root/front/getOneDictionary", |
| | | // //paramsobj: { code: "OrgType", }, |
| | | // //filter: " type='agreement'", |
| | | // isnotoption: true, //true:不是选项 |
| | | // }, |
| | | // { |
| | | // name: "jimu_report", |
| | | // //url: "root/front/getOneDictionary", |
| | | // //paramsobj: { code: "OrgType", }, |
| | | // isnotoption: true, //true:不是选项 |
| | | // filter: "type in ('datainfo', 'chartinfo', 'printinfo')",//:"id",//是下拉选项时设置 |
| | | // orderby: "update_time desc" |
| | | // }, |
| | | ], |
| | | dataRequestObj: {}, |
| | | report_url: "", |
| | |
| | | me.dataRequestObj = data; |
| | | //预加载数据后给哪些字段设置options或formatterjson |
| | | |
| | | me.dataRequestObj.sys_report.map(r=>{ |
| | | me.dataRequestObj.sys_report_echarts.map(r=>{ |
| | | r.disabled = true; |
| | | r.parent_id = "z1"; |
| | | }) |
| | | me.dataRequestObj.jimu_report.map(r=>{ |
| | | r.parent_id = "z2"; |
| | | }) |
| | | // me.dataRequestObj.jimu_report.map(r=>{ |
| | | // r.parent_id = "z2"; |
| | | // }) |
| | | |
| | | var treeData_ = [ |
| | | {id: "z1", name: "综合报表", disabled: true, children: []}, |
| | | {id: "z2", name: "自定义报表", edit_disabled: true, children: []}, |
| | | // {id: "z2", name: "自定义报表", edit_disabled: true, children: []}, |
| | | ] |
| | | |
| | | me.selectnodedata = me.dataRequestObj.sys_report[0]; |
| | | treeData_[0].children = me.dataRequestObj.sys_report; |
| | | treeData_[1].children = me.dataRequestObj.jimu_report; |
| | | me.selectnodedata = me.dataRequestObj.sys_report_echarts[0]; |
| | | treeData_[0].children = me.dataRequestObj.sys_report_echarts; |
| | | // treeData_[1].children = me.dataRequestObj.jimu_report; |
| | | me.treeData = treeData_; |
| | | me.initData(); |
| | | }); |
| | |
| | | }, |
| | | |
| | | methods:{ |
| | | onQuery() { |
| | | var me = this; |
| | | let param_ = { |
| | | dataname: "jimu_report", |
| | | filter: "type in ('datainfo', 'chartinfo', 'printinfo')", |
| | | orderby: "update_time desc" |
| | | } |
| | | Server.call("root/data/getEntitySet", param_, function(result) { |
| | | console.log(result.data.entityset) |
| | | if (result && result.data.entityset && result.data.entityset.length) { |
| | | result.data.entityset.map(r=>{ |
| | | r.parent_id = "z2"; |
| | | }) |
| | | |
| | | var treeData_ = clone(me.treeData); |
| | | treeData_[1].children = result.data.entityset; |
| | | me.treeData = treeData_; |
| | | me.initData(); |
| | | } |
| | | }); |
| | | }, |
| | | |
| | | initData() { |
| | | var me = this; |
| | | // this.onQuery(function(result, callback) {//查询后的回调,用于获取字段的 |
| | | // me.treeData = me.initTreeData; |
| | | // if (callback) { |
| | | // callback(); |
| | | // } |
| | | this.onQuery(function(result, callback) {//查询后的回调,用于获取字段的 |
| | | var treeData_ = [] |
| | | var buobj_ = {}; |
| | | var initTreeData = clone(me.initTreeData); |
| | | initTreeData.map(r=>{ |
| | | r.disabled = true; |
| | | r.parent_id = "z1"; |
| | | }) |
| | | var data_p_ = {id: "z1", name: "综合报表", disabled: true, children: []} |
| | | initTreeData.unshift(data_p_) |
| | | me.initTreeData = clone(initTreeData) |
| | | |
| | | // me.getTableMeta(); |
| | | // }); |
| | | this.tableDataAfter(); |
| | | this.defaultexpandedkeys = [this.selectnodedata.id]; |
| | | this.currentnodekey = this.selectnodedata.id; |
| | | var data = this.selectnodedata; |
| | | if (data.url) { |
| | | url_ = data.url; |
| | | this.report_url = window.top.config.url_page + url_; |
| | | } |
| | | else if (data.id) {// design |
| | | url_ = "root/report/showReport?token=" + Root.getToken() + "&type=design&id=" + data.id |
| | | this.report_url = window.top.config.url_root + url_; |
| | | } |
| | | }, |
| | | |
| | | onAddNode(obj) { |
| | | var data = obj.data, node = obj.node; |
| | | this.addData() |
| | | }, |
| | | |
| | | onEditNode(obj) { |
| | | var me = this; |
| | | // Root.showPopup({ |
| | | // url: "module/md/page/product/page/product_type_edit.html", |
| | | // width: 800, |
| | | // height: 230, |
| | | // data: data, |
| | | // sceneCode: "edit", |
| | | // callback: function(options_obj, callback) { |
| | | // me.type_treedata = options_obj.options |
| | | // if (callback) { |
| | | // callback(); |
| | | // } |
| | | // } |
| | | // }); |
| | | |
| | | var data = obj.data, node = obj.node, el = obj.el; |
| | | var val = data.name; |
| | | var url_ = ""; |
| | | if (data.url) { |
| | | url_ = data.url; |
| | | this.report_url = window.top.config.url_page + url_; |
| | | } |
| | | else if (data.id) {// design |
| | | url_ = "root/report/showReport?token=" + Root.getToken() + "&type=design&id=" + data.id |
| | | this.report_url = window.top.config.url_root + url_; |
| | | } |
| | | |
| | | }, |
| | | |
| | | onDelNode(obj) { |
| | | var data = obj.data, node = obj.node; |
| | | let me = this; |
| | | Root.confirm('确定删除-' + data.name + '-吗?', '删除提示', { |
| | | confirmButtonText: '删除', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | me.dodeldata(data, node, "agm_category"); |
| | | }).catch(() => { |
| | | Root.message({ |
| | | type: 'info', |
| | | message: '已取消删除' |
| | | }); |
| | | let initTreeData_ = ArrayToTree(clone(me.initTreeData), "name", "parent_id", null, null, null, null); |
| | | me.treeData = initTreeData_; |
| | | |
| | | if (callback) { |
| | | callback(); |
| | | } |
| | | if(me.treeData[0]) { |
| | | const leafNode = me.findLeafNode(me.treeData[0]); |
| | | let objInit = { |
| | | data: leafNode, |
| | | node: {}, |
| | | el: {}, |
| | | }; |
| | | me.currentnodekey = leafNode.id; |
| | | me.onNodeClick(objInit); |
| | | } |
| | | }); |
| | | }, |
| | | |
| | | dodeldata(row, node, tablename) { |
| | | if (row.id) { |
| | | let param = { |
| | | |
| | | dataname: tablename, |
| | | id: row.id |
| | | findLeafNode(node) { |
| | | if (!node.children || node.children.length === 0) { |
| | | return node; |
| | | } |
| | | for (let i = 0; i < node.children.length; i++) { |
| | | const child = node.children[i]; |
| | | const leafNode = this.findLeafNode(child); |
| | | if (leafNode) { |
| | | return leafNode; |
| | | } |
| | | |
| | | Server.call("root/data/deleteEntity", param, function(result) { |
| | | console.log(result); |
| | | if (result && result.data) { |
| | | const parent = node.parent; |
| | | const children = parent.data.children || parent.data; |
| | | const index = children.findIndex(d => d.id === row.id); |
| | | children.splice(index, 1); |
| | | |
| | | Root.message({ |
| | | type: 'success', |
| | | message: '删除成功!' |
| | | }); |
| | | } |
| | | }); |
| | | } |
| | | }, |
| | | |
| | | node_isShow(data, isShow) { |
| | | if (this.$refs[data.id]) { |
| | | this.$refs[data.id].style.display = isShow ? '' : 'none'; |
| | | } |
| | | return null; |
| | | }, |
| | | |
| | | onNodeClick(obj) { |
| | | console.log(obj); |
| | | var data = obj.data, node = obj.node, el = obj.el; |
| | | var val = data.name; |
| | | var filter_node_val = ""; |
| | | this.selectedrow = data; |
| | | var url_ = ""; |
| | | if (data.url) { |
| | | url_ = data.url; |
| | |
| | | url_ = "root/report/showReport?token=" + Root.getToken() + "&type=view&id=" + data.id |
| | | this.report_url = window.top.config.url_root + url_; |
| | | } |
| | | // this.getDataByNode(); |
| | | }, |
| | | |
| | | // onNodeClick(data, node, el) { |
| | | // var val = data.name; |
| | | // if (data.children && data.children.length) { |
| | | // val = ""; |
| | | // data.children.map(r=>{ |
| | | // if (val == "") { |
| | | // val = r.name; |
| | | // } |
| | | // else { |
| | | // val += "','" + r.name; |
| | | // } |
| | | // }) |
| | | // } |
| | | |
| | | // // this.filterObjBydefault.category_name = val |
| | | // this.selectedrow = data; |
| | | // this.pagenum_p = 1; |
| | | // this.getDataByNode(); |
| | | // }, |
| | | |
| | | |
| | | getTableMeta() { |
| | | var me = this; |
| | | var param_ = { |
| | | dataname: this.dataname_p, |
| | | attachMeta: true, |
| | | } |
| | | |
| | | Server.call("root/data/getEntitySet", param_, function(result) { |
| | | if (result.meta && result.meta[me.dataname_p] && result.meta[me.dataname_p].fields) { |
| | | var metas = clone(result.meta[me.dataname_p].fields); |
| | | var filterFields_ = []; |
| | | var tableFields_ = []; |
| | | |
| | | metas.map(f=>{ |
| | | f.isshow = "T"; |
| | | tableFields_.push(clone(f)); |
| | | }) |
| | | if (!me.tableFields_p || (me.tableFields_p && me.tableFields_p.length == 0)) { |
| | | me.tableFields_p = clone(tableFields_); |
| | | } |
| | | } |
| | | |
| | | me.tableDataAfter_p(); |
| | | }) |
| | | }, |
| | | |
| | | tableDataAfter_p() { |
| | | var me = this; |
| | | if (this.tableFields_p.length > 0){ |
| | | this.isRefresh_p = false; |
| | | this.$nextTick(function(){ |
| | | this.isRefresh_p = true; |
| | | this.$nextTick(function(){ |
| | | var el_list = []; |
| | | me.tableHeight_p = me.treeHeight; |
| | | }) |
| | | }) |
| | | } |
| | | }, |
| | | |
| | | onQueryAfter() { |
| | | this.pagenum_p = 1; |
| | | this.tableData_p = []; |
| | | this.total_p = 0; |
| | | }, |
| | | |
| | | getData_p(page) { |
| | | this.pagesize_p = page.pagesize; |
| | | this.pagenum_p = page.pagenum; |
| | | |
| | | this.getDataByNode(); |
| | | }, |
| | | |
| | | addData() { |
| | | let me = this; |
| | | var config = { |
| | | totab: false, //true: 以Tab导航的方式打开 |
| | | width: "98vw", |
| | | height: "600px", |
| | | icon: "icon-product", |
| | | text: "报表设计", |
| | | id: "page_form_add",//totab: true时需设置,用于判断是否已打开此页面 |
| | | url: "module/report/page/report_add.html", |
| | | data: {}, |
| | | delta: {}, |
| | | sceneCode: "add",//"refuseedit",//"approval", //"add"//"browse", |
| | | closecallback: function(obj, callback) { |
| | | me.onQuery(); |
| | | if (callback) { |
| | | callback(); |
| | | } |
| | | }, |
| | | callback: function(obj, callback) { |
| | | me.onQuery(); |
| | | if (callback) { |
| | | callback(); |
| | | } |
| | | } |
| | | }; |
| | | me.doPopupByPublic(config); |
| | | }, |
| | | |
| | | } |
| | |
| | | <div id="page_root"> |
| | | <div class="topbar"> |
| | | <span>{{title}}</span> |
| | | |
| | | <!-- 工具栏 --> |
| | | <div style="float: right; margin-right: 18px"> |
| | | <el-button @click="addData">创建自定义报表</el-button><!-- v-show="cbuttons_r.Add" --> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="h_dialog__body"> |
| | | <div :style="{position: 'absolute', left: '10px', width: '300px', height: treeHeight + 'px', border: '1px solid #ccc'}"> |
| | | <!-- <div style="height: 32px;line-height: 32px;border-bottom: 1px solid #ccc ;"> |
| | | <span style="font-size: 14px;margin-left: 20px;">{{tree_title}}</span> |
| | | </div> --> |
| | | <div :style="{position: 'absolute', left: '10px', width: '205px', height: treeHeight + 'px', border: '1px solid #ccc'}"> |
| | | <div :style="{padding: '10px 0', height: treeHeight - 30 + 'px', overflow: 'auto'}"> |
| | | <h-tree ref="tree" |
| | | v-if="isRefresh" |
| | |
| | | :edit-tree-button="editTreeButton" |
| | | :default-expanded-keys="defaultexpandedkeys" |
| | | :currentnodekey="currentnodekey" |
| | | :default-expand-all="false" |
| | | |
| | | |
| | | @node-click="onNodeClick" |
| | | @add-node="onAddNode" |
| | | @edit-node="onEditNode" |
| | | @del-node="onDelNode" |
| | | > |
| | | </h-tree> |
| | | |
| | | <!-- <el-tree ref="hierTree" class="filter-tree" node-key="id" :indent="24" |
| | | default-expand-all |
| | | highlight-current |
| | | :data="treeData" |
| | | show-checkbox |
| | | :expand-on-click-node="true" |
| | | @node-click="onNodeClick" |
| | | > |
| | | <span class="custom-tree-node z_menu_tree" slot-scope="{ node, data, itm }" |
| | | @mouseenter="node_isShow(data, true)" |
| | | @mouseleave="node_isShow(data, false)" |
| | | > |
| | | <span> |
| | | <div class="nodeLabel nodeLabel_l" style="height: 32px; line-height: 32px;"> |
| | | </div> |
| | | <div class="nodeLabel z_left_menu_tree_txt"> |
| | | <i v-if="!node.isLeaf" :class="!node.expanded ? 'el-icon-plus':'el-icon-minus'" style="font-size: 10px; margin-right: 10px; border: 1px solid #a7a9a9; color: #a7a9a9;"></i> |
| | | </div> |
| | | <div class="nodeLabel z_left_menu_tree_txt"> |
| | | <span>{{ data.name }}</span> |
| | | <el-badge :ref="'dadgeid_' + data.id" v-show="data.isBadge ? true : false" is-dot class="item"> |
| | | </el-badge> |
| | | </div> |
| | | </span> |
| | | <span> |
| | | <div :ref="data.id" v-show="false" class="nodeLabel" style="width: 128px;max-width: 128px;"> |
| | | <el-button v-if="!data.parent_id" type="text" |
| | | @click.stop="addNode(data,node)" class="z_node_button" icon="el-icon-circle-plus-outline"> |
| | | </el-button> |
| | | <el-button type="text" |
| | | @click.stop="editNode(data,node)" class="z_node_button" icon="el-icon-edit"> |
| | | </el-button> |
| | | <el-button v-if="!(data.children && data.children.length)" type="text" |
| | | @click.stop="delNode(data,node)" class="z_node_button" icon="el-icon-delete"> |
| | | </el-button> |
| | | </div> |
| | | |
| | | <div class="nodeLabel" style="margin-right: 30px;"> |
| | | <span v-if="!node.isLeaf">{{data.children.length}}</span> |
| | | </div> |
| | | </span> |
| | | </span> |
| | | </el-tree> --> |
| | | </div> |
| | | </div> |
| | | <div :style="{position: 'absolute', left: '320px', right: '10px', height: treeHeight + 'px', border: '1px solid #ccc'}"> |
| | | <div :style="{position: 'absolute', left: '220px', right: '10px', height: treeHeight + 'px', border: '1px solid #ccc'}"> |
| | | <div> |
| | | <!-- <div style="height: 32px; border-bottom: 1px solid #aaa;"> |
| | | <div class="table_title" style="float: left;"> |
| | | <span>报表预览</span> |
| | | </div> |
| | | </div> --> |
| | | <div v-if="report_url" :style="{height: treeHeight + 'px'}" align="center"> |
| | | <!-- <div v-if="report_url" class="tools-news" ref="msgtop" align="center"> --> |
| | | <iframe style="width: 100%; height: 100%;" frameborder="0" :src="report_url"></iframe> |
| | | <!-- </div> --> |
| | | <iframe style="width: 100%; height: 100%;" frameborder="0" :src="report_url"></iframe> |
| | | </div> |
| | | <div></div> |
| | | |
| | | </div> |
| | | </div> |
| | | |