草庐IT

el-date-picker自定义选择时间&&el-time-select自定义选择时间实现避免时间冲突

需求:开始日期不能小于结束日期,两个选择框之间的互相限制月份:固定十二个月,当月开始时间默认选择月第一天,结束时间默认选择月最后一天;月份选择只允许选择当前月份天:将当月对应的每天按照时间段划分,段数不做限制。时间段支持任意位置插入(新增)、删除。每个时间段具有包含属性,同一时刻不允许在两个时间段中出现包含。所有时间段之和必须满足24小时全覆盖且不允许交叉复制:点击同上,将上个月份的配置参数拷贝至当前月份代码实现开发环境:Vue需引入插件:ElementUI,moment.jstemplate——同上峰尖平谷{{itemy}}(含)(含)删除新增jsexportdefault{//import

设置<el-input type=“textarea“/>高度

一、设置高度.el-textarea{   height:88px;   :deep(.el-textarea__inner){      height:88px;   }}二、设置el-input高度:deep(.el-input__wrapper){   font-size:14px;   width:100%;   height:32px;}三、修改el-form前面红色星号的颜色:deep(.el-form-item.is-required:not(.is-no-asterisk).asterisk-left>.el-form-item__label:before){  content

el-table默认选中

最近开发,记录下el-table组件默认选中数据的方式,后台返回的数据不尽相同,代码里面有注释,可以自己根据不同的值换成自己需要的对应的key场景1:根据用户选择的不同的id去请求渲染的数据,在渲染出来的数据里面进行数据的默认勾选场景2:每次渲染的表格不同,所以根据不同id进行一个切换的监听,来调用需要渲染的值和需要勾选的值大家注意下格式,我自己手敲上来的,可能大括号有一个不对的,自己在工具里面格式化一下看看,面向过程开发。哈哈,还没封装,有更好的可以随时交流data(){return{currentId:"",//下拉框选择的数据loading:false,msgList:[//需要在页面循

vue + el-tree 实现插入节点自定义名称数据

效果:代码:data(){return{currentLivingId:"",treeData:[{createTime:null,flag:"1",id:"49d117e56c5d4df0be61451dbccb27d8",isGrade:null,level:"0",month:null,name:"父节点",parentId:"-1",partId:null,sort:3,subList:[{createTime:null,flag:"1",id:"b19747602f9b47d7b0f4a90528d3674c",isGrade:null,level:"1",month:null,na

mysql-community-libs-5.7.44-1.el7.x86_64.rpm 的公钥尚未安装或源 “MySQL 5.7 Community Server“ 的 GPG 密钥已安装,但是不适

用于此软件包。请检查源的公钥URL是否配置正确。(标题写不下了-_-!)解决方法:输入:rpm--importhttps://repo.mysql.com/RPM-GPG-KEY-mysql-2022(我是2023年做的,但是输入2023会报错,但输入2022却直接成功)再次启动mysql.server后查看状态启动:systemctlstartmysqld.service查看运行情况:systemctlstatusmysqld.service这样就已经成功了

表格el-tooltip和show-overflow-tooltip衝突

表格el-tooltip和show-overflow-tooltip衝突:二、产品需要实现的效果如下三、解决文案1、HTML代码供应商名称:{{scope.row.supplier}}合同ID:{{scope.row.contractId}}{{scope.row.supplier}}{{scope.row.contractId}}2、下图是上面HTML代码的相关解释3、使用CSS实现文本过长时单元格中显示部分文本及省略号.one-line{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}经过上述设置后,即可实现产品要求的效

el-table el-table-column两个字段值拼接展示

用法一:table数据拿到以后,将该行数据中的payStatus支付状态/shipmentStatus发货状态,两个字段拼接展示在订单状态这一列,效果如下图所示 : 代码展示:                          {{scope.row.payStatus}}              /              {{scope.row.shipmentStatus}}                       代码解析:prop=""中传入要拼接的字段,用逗号,隔开。span标签里的是我写的判断,意思大概是,如果两个字段拿到的都是null的时候,可以理解为空值,就不展示/,

element-ui 表格底部留白/el-table__body-wrapper is-scrolling-none 高度错误

element-ui表格底部留白/el-table__body-wrapperis-scrolling-none高度错误问题描述解决方法方法一①样式修改法一②样式修改法二方法二(暴力版)问题描述el-table__body-wrapperis-scrolling-none的高度在没有完全展开的时候会造成表格体溢出,表格显示不完全,底部留白。解决方法方法一这是网上搜罗到的方法,但对我没用,还是放出来给大家做个参考动态计算table的高度。①样式修改法一.assets-table/deep/.el-table__body-wrapper{height:calc(100%-40px)!importa

三分钟教你如何实现el-date-picker动态限制选中日期

首先在页面上插入一个el-date-picker组件并绑定一个响应值这里我们需要day.js这个库来帮助我们处理Date对象,便于日期的计算scriptsetuplang="ts">import{ref}from'vue'importdayjsfrom'dayjs';//时间处理constdateRange=ref([])/script>template>divclass="date-picker">el-date-pickerv-model="dateRange"type="daterange"/>/div>/template>stylescoped>.date-picker{width:1

element ui el-date-picker日期时间选择器 设置只能选择不大于30天时间范围

需求:要求日期时间选择器只能选择最多32天,其他日期为不可点击状态。日期组件type为daterange或者datetimerange都生效实现(vue2.x):通过属性picker-optionshtmlel-date-pickerv-model="dateTime"type="datetimerange"align="right"range-separator="-"start-placeholder="开始日期"end-placeholder="结束日期":picker-options="pickerOptions"@blur="isRestart=true":default-time=