----------------------------样式规范---------------------------- 1输入框: 查询输入框: placeholder='请输入' 录入输入框: placeholder='请输入XXXX' 2下拉框 下拉查询框: placeholder='不限' 第一个option不限 value值 为查询所有的值, filterable//常用状态无须添加 , 录入输入框: placeholder='请选择' 非必录的数据添加 clearable 3按钮 按钮组使用:当按钮大于三个或包含三个时使用 新增:表格中不处理 修改:type="primary" el-icon-edit 删除:type="danger" el-icon-delete 查看:type="info" el-icon-document 主要按钮:type="primary" 酌情使用 4.弹窗验证; element UI表单验证 5.所有操作 操作成功弹窗取消,改用element Message 消息提示组件 地址 :http://element.eleme.io/#/zh-CN/component/message 6.是否确定删除 delete(){ this.$confirm('是否删除?', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', type: 'warning' }).then(() => { this.$message({ type: 'success', message: '删除成功!' }); /* 执行删除方法 */ }).catch(() => { this.$message({ type: 'info', message: '已取消删除' }); }); } ------------------------------------ZK 新增md插件开始------------------------------- 新增 封装了公用请求数据文件 plug/index.js提供公用请求数据方法 ------------------------------------ZK 新增md插件开始------------------------------- --------------------------------- DJ引用组件 ----------------------------------------- quill-editor 安装命令 npm install vue-quill-editor --save 高德地图 npm install vue-amap --save 获取文件md5签名 npm install browser-md5-file --save 阿里云 npm install ali-oss --save pdf cnpm install jspdf --save ---------------------------------DJ引用组件结束----------------------------------------- --------------------------------- huaguohao 引用组件 ----------------------------------------- yarn可直接更新缺失模块 echarts 百度图表 安装命令 npm install --save echarts vue-echarts-v3 websocket 安装命令 npm install vue-websocket 生成二维码 安装命令 npm install --save qrcode 汉字转拼音插件 npm install pinyin https://github.com/hotoo/pinyin 下拉树形组件 npm install --save @riophae/vue-treeselect github: https://vue-treeselect.js.org/#customize-key-names 图片压缩 组件 cnpm i lrz -S https://github.com/think2011/localResizeIMG ---------------------------------echarts引用组件结束----------------------------------------- ---------------------------------huaguohao 创建全局变量库 Global--------------------------------- 类似于上传图片的服务器地址,考虑到测试环境和正式环境地址切换,组件以挂载 ---------------------------------创建全局变量库 Global 结束--------------------------------- ---------------------------------luochao 引用html2canvas----------------------------------- https://html2canvas.hertzen.com/ npm install -g cnpm --registry=https://registry.npm.taobao.org 请先安装淘宝镜像 cnpm install html2canvas ---------------------------------引用html2canvas 结束 ----------------------------------- ---------------------------------luochao 引用vue-waterfall-easy ----------------------------------- https://github.com/lfyfly/vue-waterfall-easy/blob/master/README-CN.md npm install -g cnpm --registry=https://registry.npm.taobao.org 请先安装淘宝镜像 cnpm install vue-waterfall-easy ---------------------------------引用vue-waterfall-easy 结束 ----------------------------------- cnpm install --save vue-easytable xlsx file-saver xlsx-style ------------------------------------------------_vue-easytable 修改记录------------------------------------------------ 华国豪: 修改文件 v-table => table 问题描述:当有底部滚动条时,滚动滚动条后,鼠标移入td 坐标轴位置不正确问题。 解决方案:新增paperScroll 方法 ~ @scroll="paperScroll",监听当前元素滚动条滚动距离得到 footerScrollLeft 参数进行计算 ~ 修改前:<div class="vertical" v-if="currentNode" :style="{width:currentNode.target.offsetWidth+'px',left:(currentNode.target.offsetLeft+leftDrift)+'px'}"></div> ~ 修改后: <div class="vertical" v-if="currentNode" :style="{width:currentNode.target.offsetWidth+'px',left:(currentNode.target.offsetLeft+leftDrift-footerScrollLeft)+'px'}"></div> 问题描述:当有footer时,滚动条显示问题。 解决方案:修改 v-table-views 高度, ~ noFrozenFooterCols.length > 0 判断 当前表格有footer时添加一个滚动条高度6 否则不加 ~ 修改前 'height': getTableHeight+'px', ~ 修改前 'height': getTableHeight+(noFrozenFooterCols.length>0?6:0)+'px', ------------------------------------------------------------------------------------------------------------------------------------------------ ---------------------------------luochao 引用----------------------------------- npm install v-viewer --save --------------------------------- 结束 -----------------------------------