@hsdata/warrenq-ck-note
v0.0.9
Published
* 支持功能
Downloads
1
Keywords
Readme
使用 @hsdata/warrenq-ck-note
支持功能
- 拖拽添加文本,图片
- 粘贴word,excel,图片
- 手动添加文本,标记,图片,html
- 文本自动保存
引入组件
import {
setRules, //function(ruleName) 配置图表功能
setConfig, //function(config) 组件配置函数
setViewOrigin, //funtion(fn) 配置查看原文方法
appendElementToNote, //function(params) 添加图片,文本,html,到笔记
multiTab, //vue组件 ,笔记完整功能
bus //通信组件
} from '@hsdata/warrenq-ck-note'
- 完整功能
<template>
<div style="height: 100vh; width: 100vw">
<multi-tab @close='close' @hide='hide' @fullarea='fullarea' ref='mode'/>
</div>
</template>
<script>
import { multiTab, bus } from '@hsdata/warrenq-ck-note'
export default {
components: {multiTab},
create(){
//沉浸模式
bus.$on('module-fullscreen-change', this.fullscreen)
}
beforeDestroy(){
bus.$off('module-fullscreen-change', this.fullscreen)
},
methods:{
close(){
//关闭笔记
},
hide(){
//最小化笔记
},
fullarea(v){
//全屏,取消全屏
},
//主动改变全屏图标样式
initFullarea(){
this.$refs.mode.changeFullArea(Boolean)
},
fullscreen(v,key){
if(key == 'note'){
console.log(v)
}
}
}
}
</script>
事件 | 事件名称 | 返回值 | 功能 | | --- | --- | --- | | close | null | 点击关闭 | | hide | null | 点击最小化| | fullarea | boolean | 点击全屏/取消全屏 |
组件配置
//配置单
const PROJECT_CONFIG = {
showAddIndexText: false, //显示添加指标,待集成
showAddChart: false, //显示添加图表,待集成
showShare: false, //显示分享, 未集成
showFullscreen: false, //显示全屏, 待集成
showMenu: true, //显示菜单列表
showAddNewNote: true, //新建笔记
showDownloadWord: true, //显示导出word
saveAs: {
//另存为模块
show: false,
component: 'div'
}
};
//更改配置
import {
setConfig,
} from "@hsdata/warrenq-ck-note";
//禁用菜单和下载excel
setConfig({
showMenu: false,
showDownloadWord: false
})
查看原文功能
- 插入查看原文文本
import {
appendElementToNote, //function(params) 添加图片,文本,html,到笔记
} from '@hsdata/warrenq-ck-note'
//新增一个查看原文标记
appendElementToNote({
key: 'appendNote',
content: {
color: 'red' //左侧颜色色条,必传
colorLetter: 'a' //a,b,c,d 标记,必传
content: '原文文本……' //需要插入的文本,必传
...params //自定义参数,后续查看原文时使用
}
})
- 配置查看原文方法,该方法为全局方法,多次配置会覆盖
import {
setViewOrigin, //funtion(fn) 配置查看原文方法
} from '@hsdata/warrenq-ck-note'
/*** 这块可以配置打开阅读器方法 ***/
setViewOrigin((params)=>{
//当点击查看原文时,会调用该函数,传入参数为添加标记时的自定义参数
//示例
window.open(params.pdfPath)
})
在当前页签下插入图片、文本、html
import {
appendElementToNote, //function(params) 添加图片,文本,html,到笔记
} from '@hsdata/warrenq-ck-note'
//在焦点处添加文本
appendElementToNote({
key: 'copyNote',
content: '123123'
})
//在焦点处添加html
appendElementToNote({
key: 'addInnerHtml',
content: '123123'
})
//在文本结尾添加html
appendElementToNote({
key: 'appendInnerHtml',
content: '123123'
})
//添加图片
appendElementToNote({
key: 'addImage',
content: 'src……' //图片地址
})