lee576的专栏

.light { animation: flicker 4000ms ease infinite;}@keyframes flicker { 0%, 100% { box-shadow: 0 0 1rem #fefa01, inset -0.25rem 0 0 0.5rem rgba(14, 10, 10, 0.1); } 30%, 70% { box-shadow: -1rem 0 8rem 1rem #fefa01, inset -0.25rem 0 0 0.5re.

经过 2021年的一个春节，从年前到现在，大致撸出一个 甘特图，进度条是用SVG画的，使用了几个工具库 （interactjs 用来处理拖拽和修改尺寸，snap.svg 用来处理 svg 的dom 操作，moment.js用来处理时间的操作），其他没有依赖任何的UI组件，目前初见雏形，还比较粗糙，后面会不断更新源码地址点击期间也摸索了怎么把vs code的项目上传到 GitHub 上面进行源代码的管理，基本上是参考的这篇文章做的...

最近自己从零撸起的甘特图组件需要子组件的滚动条同步滚动这就涉及到子组件之间的互相通信，通过 消息总线可以达到我们的需求 ,首先建立一个标志位，拖动左边滚动条的时候，右边的滚动条事件不处理，反之拖动右边滚动条时，左边的滚动条事件不做处理，建立一个公共的变量用于两者的互斥store.jsimport Vue from 'vue'export let store = Vue.observable({ scrollFlag: true})export let mutations =..

最近自己从零撸了一个甘特图组件，如图当切换 "月/时/日" 的时候，我希望下面的甘特图重新渲染，页面结果是这个样子<template> <div v-if='tasks' class="content"> <template v-for='(item, index) in tasks'> <div :key="index + '_task'" style="border-top: 1px solid #cecece;margi.

静默打印是什么？简单来说就是不需要用户点击"打印"，自动去打印，但是使用浏览器web打印不可避免的要弹出以下画面面对这种问题也只能用"富客户端"技术来解决，在浏览器的沙盒安全模型中无法做到，那么只能使用插件的技术，这个我们就不自己花力气去做了，我找来了 lodop 这个免费的打印组件，功能还是挺强大的，下载下图的发行包解压后安装下图两个exe如果你的系统是64位的，可以安装install_lodop64.exe上图的LodopFuncs.js 是客户端要使用的核心库文件...

个人觉得大屏展示其实很简单，噱头多过技术含量，下面使用了 DataV (不是阿里的那个DataV哈，具体链接在这里)开发了一个大屏展示，使用了css flex弹性布局，使用了DataV的一些比较酷炫的边框(SVG写的)，基本上功能没有全部完成，但是模子已经刻出来了，只是后端推送的内容没有全部写出来前端<template> <dv-full-screen-container class="screen-container"> <div class="ti

参考上一篇知识开发的一个功能，制作一个打印模板的管理模块，如下(就是保存froala编辑后的html文本，其中包括Vue的Template，这样我们可以利用Vue的模板的优势来动态绑定一些数据源进行HTML的打印,基本上跟过去水晶报表做一个模板再绑定数据源的方法异曲同工)在 main.js 里引用 froala 组件// Import and use Vue Froala lib.import VueFroala from 'vue-froala-wysiwyg'// 引入 Fr..

从这篇文章得到启发先定义一个组件从外部接收Template，然后在组件里调用<template > <div ref="markedContent"></div></template><script>import Vue from 'vue/dist/vue.esm.js'export default { name: 'wf-marked-content', props: ['content'], mounte..

在使用 froala-editor 的时候发现要在main.js里面导入大量的插件文件(js和css)，比如下面要使用表格的功能，需要引用两个文件 （主要是不引用插件的话，工具栏上面连那个按钮都不会出现）require('froala-editor/css/plugins/table.css')require('froala-editor/js/plugins/table.min.js')如此一来用的插件多，导入的文件就要一个个手动引入，非常繁琐。于是google寻找能不能批量的导入一个文件夹下

如上图，下面贴代码<template> <div> <el-date-picker size="large" style ="width:120px" v-model="selectYear" format="yyyy 年" value-format="yyyy" type="year" :clearable = "false" placeholder="选择年">..

其实Element UI 只用了文字提示的 el-tooltip 组件，不喜欢可以去掉，不记得是从哪拿到的原始代码，我给加了高亮渐变显示，图标，和拖拽时只能拖拽图标的位置，效果如上图，可以水平方向拖动，也可以垂直方向拖动。样式是less写的，css写嵌套样式太繁琐了。拿来主义，改造有理!下面贴代码<template> <div ref="splitPane" class="split-pane" :class="direction" :style="{ fl...

实践出真知，这话一点不假，之前在微信公众号上看的一篇文章，说是用这个模板创建Vue 3.0 + WebApi的项目，结果自己照着创建一个就是各种坑和问题，可能是新东西出来还不成熟吧！使用 Vue 3.0的Setup语法糖居然编译错误使用查看当前的Vue版本npm list vue结果查到版本是 2.6.4 不是 3.0！使用 如下命令升级Vuenpm install vue@3.0安装完成，运行，结果遇到如下错误Error: Cannot find module '@vue/.

计划是这样,公司的项目一直在持续改动,安装包总是需要频繁生成新的,由此我想到了"持续集成"!有自动化工具不用,岂不可惜?这周的主要时间就用来学习CruiseControl.Net全面实现持续集成

VueRouter 默认是hash模式，但是url上会带上#字符，非常不好看，会影响一些场景下的url解析， history 模式下没有 #，但是history 模式下对打包就出现了路径不对的问题，通过修改 项目根目录下 \build\webpack.prod.conf.js 解决 output: { publicPath: '/', path: config.build.assetsRoot, filename: utils.assetsPath('js/[name].[.

运行vue create xxxx 使用Vue Cli 4.5 创建 Vue3.0 项目1.项目打包以后，查看打包后的/dist/index.html，页面显示不出来，引用路径出现错误在项目根目录创建vue.config.js 文件，配置如下module.exports = { publicPath:'./'}2.运行vue add element-plus 安装 Element Plus，出现如下错误Can't resolve './fonts/element-...

首先官网推荐的安装方法没有生成dist文件，导致样式表等这些文件并没有生成npm install element-plus --save以上方法是有问题的，如果不幸执行了上面的命令，那么先执行卸载npm uninstall element-plus删除 main.js文件对element ui的引用，输入以下命令vue add element-plus...

脑袋疼，折腾了个把小时，终于折腾清楚了，如下例所示，selectedIds是一个字符串数组 var that = this var selectedIds = this.selectedRows.map((o) => o.id) if (selectedIds.length === 0) { this.$message.error('请选择需要删除的行！') return } this.$confirm(.

WebSocket是HTML5最重要的特性,让网页真正支持双工通信

npm 调试命令 npm run dev很简单，我们都知道。那么怎么调用并调试.net Web Api接口呢.先看看 node.js环境下前端如何配置吧一.首先我们说说如何在 npm run dev命令下，也就是开发模式下去调用 .net Web Api后端接口去联调。 1. 打开 config文件夹下的 index.js，如下图所示其中有个很关键的地方，那就是配置节proxyTable ，这其中 target就是后端Web Api的地址，至于这个地址...

在网上找了很久,得到的答案是"Entity Framework 中不能同时更新多条记录",历经这么多版本,居然还没有这种基本功能,我真的很无语了在网上