sortable

前言 Pytest框架可以使用两种测试报告，其中一种就是使用pytest-html插件生成的测试报告，但是报告中有一些信息没有什么用途或者显示的不太好看，还有一些我们想要在报告中展示的信息却没有，最近又有人问我pytest-html生成的报告，能不能汉化？答案是肯定的，那么今天就教大家如何优化和汉化pytest-html测试报告解决上述问题 生成报告 我们先编写一个简单的测试代码，生成一份原始的测试报告，来看看哪些需要修改 测试代码 test_pytest_html.py """ ------------------------------------ @Time : 2019/8/28 19:45 @Auth : linux超 @File : test_pytest_html.py @IDE : PyCharm @Motto: Real warriors,dare to face the bleak warning,dare to face the incisive error! @QQ : 28174043@qq.com @GROUP: 878565760 ------------------------------------ """ import pytest def login(username, password): """ 模拟登录 """ user = "

Sortable.js是一款轻量级的拖放排序列表的js插件 安装 Sortable.js npm install sortablejs --save 引入表格拖拽依赖 import Sortable from 'sortablejs' 给el-table添加属性 row-key="id" 添加行拖拽方法 //行拖拽 rowDrop() { //获取当前表格 const tbody = document.querySelector('.el-table__body-wrapper tbody') const that = this //newIndex -- 新下标 oldIndex -- 旧下标 Sortable.create(tbody, { onEnd({ newIndex, oldIndex }) { //移除原来的数据 const currRow = that.tableData.splice(oldIndex, 1)[0] //移除原来的数据并插入新的数据 that.tableData.splice(newIndex, 0, currRow) } }) } 添加mounted mounted() { this.rowDrop() } 来源： oschina 链接： https://my.oschina.net/u/173975/blog/4929298

一、拆分页面： 将一个页面拆分成几个部分，如：父子包裹、左右或上下布局 <!-- 上下布局 --> <template> <el- card style ="background: #fff;min-height: 800px" shadow ="never"> < div slot ="header" style ="height: 28px"> <!-- 标题 --> <span>xxxx列表<span/> </div> <!--内容--> <div> <featureTable :parameters="parameters"/> </div> </el-card> </template> 二、表格操作部分，属于 中间件 ——处理复杂逻辑、数据转换 1.纯展示的表格 <template> <el-card id="activityManage"> <div slot="header"> <el- button type ="primary" @click ="addRowDialog" >新建</el-button> </div> <el-row > <el-col> < CommonTable :table -data="tableData" :table -column="tableColumn" height ="680" :loading ="listLoading"

表格代码 < div class ="m-table" > < el-table :data ="logs" style ="width: 100%" stripe height ="calc(100% - 60px)" @sort-change ="sortChange" :header-cell-style ="{ 'background-color': '#fafafa', 'color': 'rgb(103, 194, 58)', 'border-bottom': '1px rgba(103, 194, 58, 0.43) solid' }" :default-sort = "{prop: 'operatetime', order: 'descending'}" > < el-table-column type ="expand" > < template slot-scope ="props" > < el-form label-position ="left" inline class ="demo-table-expand2" > < el-form-item label ="账号(md5)" > < span > {{ props.row.account }} </ span > </ el-form-item >< br /> < el-form-item

本文以jquery-ui sortable排序功能插件为例分析jquery-ui源代码重点难点。 jquery-ui-sortable插件非常复杂深奥，本来是针对鼠标操作设计的，在手机运行无效，因为手机没有mouse事件，更没有drag事件。 但增加一个jquery-ui-touch-punch.js文件之后在手机运行也有效，touch有效，原理在于sortable源代码不是针对鼠标drag and drop设计的，而是针对mouse事件中的位置数据设计的，底层有复杂的算法，touch事件数据也包含位置数据，因此sortable能兼容touch，很强大。 sortable插件的调用方式是$().sortable(opts)，那么sortable()函数就是入口初始化函数，我们从这个入口初始化函数源代码开始分析。 $.widget.bridge = function( name, object ) { 　　var fullName = object.prototype.widgetFullName || name; 　　$.fn[ name ] = function( options ) { // 此即为sortable()函数代码 　　　　this.each(function() { // this是$()元素集合，一般只有一个节点，$().each()就是循环一次

Vue之element table 后端排序实现 1、如果需要后端排序，需将sortable设置为custom，同时在 Table 上监听sort-change事件，在事件回调中可以获取当前排序的字段名和排序顺序，从而向接口请求排序后的表格数据。 < el-table @ sort-change= 'tableSortChange'> < el-table-column sortable= 'custom' prop= "createTime" label= "创建时间"> </ el-table-column> </ el-table> 2、定义methods监听sort-change事件 tableSortChange(column) { this.listQuery.pageNo = 1 if (column.order === 'descending') { this.listQuery.sortby = column.prop this.listQuery.order = 'desc' } else { this.listQuery.sortby = column.prop this.listQuery.order = 'asc' } this.getList() } 3、通过axios提交请求数据到后端 getList() { this.listLoading =

Kendo UI for jQuery R2 2020 SP1试用版下载 Kendo UI 目前最新提供 Kendo UI for jQuery 、 Kendo UI for Angular 、 Kendo UI Support for React 和 Kendo UI Support for Vue 四个控件。Kendo UI for jQuery是创建现代Web应用程序的最完整UI库。 Grid小部件提供内置的PDF导出功能。 入门 要启用PDF导出： 1. 包括相应的工具栏命令并设置导出设置。 工具栏配置 PDF导出配置 2. 在页面中包含Pako Deflate库来启用压缩。 要通过代码启动PDF导出，请调用saveAsPdf方法。 注意 ： 默认情况下，Kendo UI Grid导出数据的当前页面并应用排序、过滤、分组和聚合。 Grid使用当前的列顺序、可见性和尺寸来生成PDF文件。 下面的示例演示如何启用Grid的PDF导出功能。 <!-- Load Pako Deflate library to enable PDF compression --> <script src="https://kendo.cdn.telerik.com/2020.2.617/js/pako_deflate.min.js"></script> <div id="grid"></div>

Vue+Element 踩坑 1. 获取后台返回的数据，是个数组，循环后展示出来 <el-table-column :label="$t('common.cardModel.guz')" sortable="custom" prop="assetNo"> <template slot-scope="scope"> <div v- for ="(item,index) in scope.row.cEqpFinx" :key="index"> {{item.assetNo}} </div> </template> </el-table-column> 2. @click.once 只允许点击一次，然后让按钮隐藏 在data申明 在方法里面加入isShow 来源： oschina 链接： https://my.oschina.net/u/4393623/blog/4300173

今天要处理sortable方法处理的对象，拖拽的时候，位置偏移的问题。 按理应该是鼠标在哪，对象就跟着在哪的 百度了一下问题， http://blog.csdn.net/samed/article/details/50703704 ，在这个博文里面提到了this.scrollParent.scrollTop()，那么对这个位置进行断点调试。（当然最开始也尝试了一下注释了这个地方，并没什么用） 在这个处理过程中，我发现我得拖拽对象的scrollParent并不是想象中的直接上级，而是不知上了多少级的父级（ 代码中使用的是parents().filter(...) ），但是又搞不太清楚为什么，因为代码有一万五左右行数，看是看不完的，都想放弃了，因为坑爹的是调试的时候，会一直跳到jquery.js中，大概是调试方法还没有很好掌握，没办法定住调控。 （在这之中，也尝试了把一些样式去除掉看看，结果比较坑，去除掉一些样式的对象是可以正常使用的，那么结论肯定是和样式有关。） 不过因为在错误页面上，能看到，拖拽对象是top值少了一截，肯定是和parent.top有关，既然如此，那么就先仔细看看scrollParent到底是如何得到的。 jQuery UI API： http://www.runoob.com/jqueryui/api-scrollparent.html API中介绍最近的可滚动祖先

<p align="center"><img width="140" src="https://oscimg.oschina.net/oscnet/logo.svg"></p> <h1 align="center">Vue.Draggable</h1> Vue component (Vue.js 2.0) or directive (Vue.js 1.0) allowing drag-and-drop and synchronization with view model array. Based on and offering all features of Sortable.js [译]Vue组件（Vue.js 2.0）或directive（Vue.js 1.0）允许拖放以及与视图模型数组同步。 基于并提供 Sortable.js 的所有功能 Demo Live Demos https://sortablejs.github.io/Vue.Draggable/ https://david-desmaisons.github.io/draggable-example/ Features Full support of Sortable.js features: Supports touch devices Supports drag handles and selectable