您的位置:首页 > 科技 > 能源 > 今日头条自媒体平台注册_河南关键词seo_百度资源搜索引擎_bt磁力天堂torrentkitty

今日头条自媒体平台注册_河南关键词seo_百度资源搜索引擎_bt磁力天堂torrentkitty

2024/10/5 17:53:25 来源:https://blog.csdn.net/zyg1515330502/article/details/142378107  浏览:    关键词:今日头条自媒体平台注册_河南关键词seo_百度资源搜索引擎_bt磁力天堂torrentkitty
今日头条自媒体平台注册_河南关键词seo_百度资源搜索引擎_bt磁力天堂torrentkitty

需要把指定列的相同数据合并起来(项目中用的是updateTime)

后端返回的数据格式:

html: 

<el-tab-pane label="执行记录概览" name="fourth" v-loading="loading"><el-timeline v-if="recordList.length > 0"><el-timeline-itemv-for="(item, index) in recordList":key="index":timestamp="item.createTime"placement="top"><el-card><el-tabsv-model="activeName2[index]"@tab-click="handleClick2($event, index)"><el-tab-pane label="阻断列表" name="first"><el-table:data="item.disposesList":span-method="(params) => objectSpanMethod(params, item)"border><!-- <el-table-columnalign="center"type="index"label="序号"/> --><el-table-columnprop="updateTime"label="时间"width="160"></el-table-column><el-table-column prop="hostnameIp" label="域名/IP"></el-table-column><!-- <el-table-column prop="type" label="阻断状态" width="100"><template slot-scope="scope"><span>{{ getBlockState(scope.row.blockState) }}</span></template></el-table-column> --><el-table-column prop="type" label="类型" width="100"><template slot-scope="scope"><span>{{ getTypelVal(scope.row.type) }}</span></template></el-table-column><el-table-column prop="label" label="标签" width="120"><template slot-scope="scope"><span>{{ getLabelVal(scope.row.label) }}</span></template></el-table-column></el-table></el-tab-pane><el-tab-pane label="快照截图" name="second"><Snapshot :snapshotList="item.snapshotList"></Snapshot></el-tab-pane><el-tab-pane label="通信流量" name="third"><Traffic :networkList="item.networkList"></Traffic></el-tab-pane></el-tabs></el-card></el-timeline-item></el-timeline><div v-if="!recordList.length" class="nodata"><img class="empty-pic" src="@/assets/images/nodata.png" alt="" /></div></el-tab-pane>

js:

 data() {return {recordList: [],activeName2: {}, // 用一个对象来存储每个tab的激活状态}}methods: {
handleClick2(tab, index) {this.$set(this.activeName2, index, tab.name);},
getAllList() {this.loading = true;getAllList({taskId: this.taskId,}).then((response) => {this.recordList = response.rows;this.loading = false;// 初始化activeTab对象this.recordList.forEach((item, index) => {this.$set(this.activeName2, index, "first"); // 假设默认第一个面板是激活的});});},
objectSpanMethod({ row, column, rowIndex, columnIndex }, item) {// console.log(row, column, rowIndex, columnIndex);if (columnIndex === 0) {// name列// 获取当前行的name值let currentName = row.updateTime;let previousName =rowIndex > 0 ? item.disposesList[rowIndex - 1].updateTime : null;let nextName =rowIndex < item.disposesList.length - 1? item.disposesList[rowIndex + 1].updateTime: null;// 如果当前行的name与上一行相同,隐藏该单元格if (currentName === previousName) {return { rowspan: 0, colspan: 0 };}// 如果当前行的name与下一行相同,合并行let rowspan = 1;while (nextName === currentName) {rowspan++;rowIndex++;nextName =rowIndex < item.disposesList.length - 1? item.disposesList[rowIndex + 1].updateTime: null;}return { rowspan, colspan: 1 };}},
},

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com