<!doctype html> <html> <head> <meta charset="utf-8"><meta http-equiv="Expires" content="0"><meta http-equiv="Pragma" content="no-cache"><meta http-equiv="Cache-control" content="no-cache"><meta http-equiv="Cache" content="no-cache"> <title>版本时间轴</title> <script type="text/javascript"> var pageVue = null; function loadJsCss(callback) { var jscss_urls = []; window.top.initJsCss(document, jscss_urls, callback); }; function initVue() { new BasicsVue({ el: "#vbody", data: { dataname: "agm_record", filterTxt: " state_code = 'Draft'", orderby: "update_time desc", dataRequest: [], title: "版本时间线", tableData: [ {id: "111", code: "BA202207170001", versionno: "V4", type_name: "区域备案", state_name: "生效", update_time: "2022-07-14 11:25:04", remark: "测试4"}, {id: "111", code: "BA202207170001", versionno: "V3", type_name: "区域备案", state_name: "失效", update_time: "2022-07-13 13:20:52", remark: "测试3"}, {id: "111", code: "BA202207170001", versionno: "V2", type_name: "区域备案", state_name: "失效", update_time: "2022-07-10 10:35:64", remark: "测试2"}, {id: "111", code: "BA202207170001", versionno: "V1", type_name: "区域备案", state_name: "失效", update_time: "2022-07-07 16:05:22", remark: "测试1"}, ], }, created() { this.popupParames = clone(Root.popupParames); if (this.popupParames.data) { this.formData = clone(this.popupParames.data); } }, mounted() { var me = this; //é¢„åŠ è½½æ•°æ® if (this.dataRequest.length) { var result = {}; this.loadRequestData(this.dataRequest, result, function(data) { me.dataRequestObj = data; //é¢„åŠ è½½æ•°æ®åŽç»™å“ªäº›å—段设置options或formatterjson me.initData(); }); } else { this.initData(); } this.$nextTick(() => { // 以æœåŠ¡çš„æ–¹å¼è°ƒç”¨çš„ Loading 需è¦å¼‚æ¥å…³é— hideLoading(); //釿–°è®¾ç½®å¼¹çª—宽高 this.$nextTick(function(){ //let w_ = this.$refs.popup_body.offsetWidth + "px"; let w_ = "900px"; let h_ = this.$refs.popup_body.offsetHeight + "px"; Root.setPopupWH(w_, h_); }) }); }, methods:{ closeDialog() { var me = this; if (me.popupParames.totab){ Root.tab.removeItem(Root.tab.selected); Root.tab.open(me.popupParames.parentOption, false); } else { Root.hidePopup(); } }, saveAfter() {//è°ƒå›žè°ƒçš„å…³é— var me = this; if(this.popupParames.callback) { let obj = { //row: this.formData } this.popupParames.callback(obj, function() { me.closeDialog(); }); } else { me.closeDialog(); } }, initData() { let me = this //tableData // if (this.formData.id) { // filter_table = "parentid = '" + this.formData.id + "'"; // } // let param_table = { // isClientMode: false, // dataname: this.table_dataname, // filter: filter_table, // } // Server.call("root/data/getEntitySet", param_table, function(result) { // if (result && result.data) { // me.tableData2= result.data.entityset; // } // }); }, showVersion(operation, row) { let me = this; let url_ = ""; if (operation == "browse") {//查看 url_ = "module/agreement/page/recordById.html" } else if (operation == "contrast") {//对比 url_ = "module/agreement/page/recordContrastById.html" } Root.showPopup({ url: url_, width: 800, height: 550, data: row, sceneCode: "browse", callback: function(obj, callback) { if (callback) { callback(); } } }); }, } }); }; loadJsCss(function () { initVue(); }); </script> <style> /* 在vue.jsä¸ v-cloak 这个指令是防æ¢é¡µé¢åŠ è½½æ—¶å‡ºçŽ° vuejs çš„å˜é‡å而设计的 */ [v-cloak] { display: none !important; } html { overflow: hidden; } .popup_mainbody { height: 90vh; overflow: auto; } .el-descriptions :not(.is-bordered) .el-descriptions-item__cell { padding-bottom: 2px; } </style> </head> <body style="margin: 0px;"> <div v-cloak id="vbody"> <div id="page_root"> <div ref="popup_body" style="padding: 0px 20px;"> <div class="el-dialog__header"> <div class="dialog-title"> <i class="iconfont icon-customermanagement"></i> <span> {{title}} </span> </div> </div> <div style="height: 550px; "> <div style="height: 530px; overflow-y: auto; margin: 10px 0px;"> <el-timeline> <el-timeline-item v-for="(row, k) in tableData" :key="k" :timestamp="row.update_time" placement="top"> <el-card> <el-button-group style="float: right;"> <el-button size="mini" type="primary" @click="showVersion('browse', row)">详情</el-button> <el-button size="mini" type="primary" @click="showVersion('contrast', row)">对比</el-button> </el-button-group> <el-descriptions :title="row.type_name" :column="2" size="mini"> <el-descriptions-item label="备案编å·">{{row.code}}</el-descriptions-item> <el-descriptions-item label="版本">{{row.versionno}}</el-descriptions-item> <el-descriptions-item label="状æ€"> <el-tag :type="row.state_name == '生效' ? 'success' : 'danger'" size="mini">{{row.state_name}}</el-tag> </el-descriptions-item> <el-descriptions-item label="æ›´æ–°æ—¶é—´">{{row.update_time}}</el-descriptions-item> <el-descriptions-item label="备注">{{row.remark}}</el-descriptions-item> </el-descriptions> </el-card> </el-timeline-item> </el-timeline> </div> </div> <div class="el-dialog__footer"> <el-button size="small" type="default" @click="closeDialog">å…³ é—</el-button> </div> </div> </div> <div id="page_loading" style="position: absolute; top:0px; width: 100vw; height: 50vh;"> <div class="spinner"> <div class="cube1"></div> <div class="cube2"></div> </div> </div> </div> </body> </html>