Spire.Cloud 自定义控制工具栏按钮权限功能

Spire.Cloud 提供了 Toolbar 模块控制工具栏按钮功能，您成功将 Spire.Cloud 在线编辑集成到您的应用或网站后，可以在配置文件 default.js 中通过配置参数来对按钮实行权限控制，并通过添加的参数移除对应工具栏按钮。按钮功能被移除后，按钮不会在页面中显示，也不会存在于页面的 html 结构中。如果按钮有快捷键，快捷键也一并取消。

在介绍如何自定义控制鼠标右键按钮表功能时，我们以 Example 示例为例。该文我们将以 Sample.zip 实例为例，演示如何设置在线编辑处理 word 文档时移除工具栏“插入”功能。

工具栏 (Toolbar) 参数列表

模块 分栏 分组 按钮英文名称 按钮中文名称 权限控制配置参数
Toolbar
工具栏		 Undo tempUndo Undo 撤销 btnUndo
Redo 重做 btnRedo
Home
开始		 tempCutpanel Paste 粘贴 btnPaste
Cut 剪切 btnCut
Copy 复制 btnCopy
Format Painter 格式刷 btnCopyStyle
tempFont Font Name 选择字体 cmbFontName
Font Size 字号 cmbFontSize
Increase Font Size 增加字号 btnIncFontSize
Decrement Font Size 减小字号 btnDecFontSize
Blod 字体加粗 btnBold
Italic 斜体 btnItalic
Underline 下滑线 btnUnderline
Strikethrough 删除线 btnStrikeout
Superscript 上标 btnSuperscript
Subscript 下标 btnSubscript
Text Highlight Color 高亮 btnHighlightColor
Font Color 字体颜色 btnFontColor
Paragraph Background Color 段落背景颜色 btnParagraphColor
Open Font Setting 打开字体设置 btnOpenFontSetting
tempParagraph Bullets 项目符号 btnMarkers
Numbering 编号 btnNumbers
Multilevel List 多级列表 btnMultilevels
Decrease Indent 减少缩进 btnDecLeftOffset
Increase Indent 增加缩进 btnIncLeftOffset
Line Spacing 行和段落间距 btnLineSpace
Align Left 左对齐 btnAlignLeft
Align Center 居中对齐 btnAlignCenter
Align Right 右对齐 btnAlignRight
Justify 两端对齐 btnAlignJust
Nonprinting Characters 显示所有格式标记 btnShowHidenChars
Horizontal Align 水平对齐方式 btnHorizontalAlign
Open Paragraph Setting 打开段落设置 btnOpenParagraphSetting
tempStyle Font Styles 字体样式 listStyles
tempEdit Search 查找 btnFind
Advanced Search 高级查找 btnAdvFind
Replace 替换 btnReplace
Insert
插入		 tempInsertBlankPage Blank Page 空白页 btnBlankPage
Page Break 分隔符 btnInsertPageBreak
tempInsertTable Table 表格 btnInsertTable
tempInsertHeaderAndFooter Header&Footer 页眉页脚 btnEditHeader
Page Number 页码 btnInsertPageNum
tempInsertChart Picture 图片 btnInsertImage
Chart 图表 btnInsertChart
Shape 图形 btnInsertShape
tempInsertWatermark Watermark 水印 btnWatermark
tempInsertWordArt Text 文本框 btnInsertText
Word Art 艺术字 btnInsertWordArt
Sink 首字下沉 btnDropCap
tempInsertLink Link 链接 btnInsertHyperlink
tempInsertEquation Equation 公式 btnInsertEquation
Symbol 符号 btnInsertSymbol
tempInsertAnnotation Comment 批注 btnInsertComments
tempInsertContentControl Content Control 内容控件 btnContentControls
PageLayout
页面布局		 tempPageSetting Margins 页边距 btnPageMargins
Orientation 方向 btnPageOrient
Size 纸张大小 btnPageSize
Columns 分栏 btnColumns
tempParagraphSetting paragraphIndent 缩进 paragraphIndent
paragraphSpacing 间距 paragraphSpacing
Open Paragraph Setting 打开段落设置 btnOpenParagraphSetting
References
引用		 tempContents Catalog 目录 SlotContent
Refresh 刷新 SlotContentsUpdate
Navigation 导航 btnNavigation
tempFootnote Footnote 脚注 SlotNote
tempCaptionAndLink Bookmark 书签 btnSlotBookmarks
Link 链接 btnSlotHyperlink（由于 Insert 下也存在插入超链接按钮，如果设置参数 btnInsertHyperlink 移除插入超链接按钮，这个按钮也会被同样的移除。）
Caption 题注 btnSlotCaption
Review
审阅		 tempCoordination Editing Mode 协同编辑模式 btnCoAuthMode
tempComments Comments 批注 CommentAll（这个按钮由于 Insert 下也存在插入批注按钮，如果配置参数 btnInsertComments 移除插入批注按钮，这个按钮也会被同样的移除。）
Remove 删除批注 CommentRemove
tempTrack Reviewing Pane 审阅窗格 btnReviewPanel
Track Changes 跟踪变化 btnTurnOn
Display Mode 显示模式 btnReviewView
tempChanges Previous 上一条 btnPrev
Next 下一条 btnNext
Accept 接受 Accept
Reject 拒绝 Reject
tempChat Chat 聊天 btnChat
tempHistory History Version 历史版本 btnHistory
TableTools
表格工具		 tempTableCheckbox Header Row 标题行 chHeaderToolbar
Total Row 汇总行 chTotalToolbar
Banded Rows 镶边行 chBandedToolbar
First Column 第一列 chFirstToolbar
Last Column 最后一列 chLastToolbar
Banded Columns 镶边列 chColBandedToolbar
tempTableCombo Table Styles 表格样式 cmbTableTemplateToolb ar
tempTableTextWrap None Wrapping 无文字环绕 btnWrapNoneToolbar
Wrapping 有文字环绕 btnWrapParallelToolbar
tempTableCell Cell Height 单元格高 numHeightToolbar
Cell--Width 单元格宽 numWidthToolbar
tempTableformula Add Formula 添加公式 btnAddFormulaToolbar
DrawingTools
绘图工具		 tempShape Rotate 旋转 btnRotate
tempChart Chart Styles 图表样式 cmbChartStyleToolbar
tempChartEditData Edit data 编辑数据 btnEditDataShort
tempTextArt Word Art Styles 艺术字样式 cmbTextArtToolbar
Direction 文字方向 btnTextDirection
Alignment 垂直对齐 btnVertAlignText
Transform Styles 旋转样式 cmbTransformToolbar
tempHeaderFooterPosition Header from Top 页眉距顶端距离 numPositionToolbar
tempHeaderFooterOptions Different first page 首页不同 chDiffFirstToolbar
Different odd and even pages 奇偶页不同 chDiffOddToolbar
Link to Previous 链接到上一个 chSameAsToolbar

参数配置步骤

1、下载 HTML 示例：解压缩后，您会看到三个文件：Index.html、jquery-3.6.0.js、SpireAPI.js，如下图所示。

Spire.Cloud 自定义控制工具栏按钮权限功能

2、Index.html 下按您的部署服务器 IP 更改 IP 地址：

<script type="text/javascript" src="http://192.168.0.79:8000/web/editors/spireapi/SpireCloudEditor.js"></script>

3、Spire.API.js 指定需要编辑的文档地址，本示例地址为：

"sourceUrl": "http://192.168.0.79:3000/files/__ffff_192.168.0.111/sample.docx"。

4、Spire.API.js 参数配置，在 "customization" 模板下，自定义 "btnPermissions" 参数，设置如下：（*添加不需要显示的按钮参数） 

   "btnPermissions": {//按钮权限控制
         "docBtnPermissions": [ //word按钮权限控制
		{"modular": "Toolbar", "subModule": ["Insert"]},
                { "modular": "TabMenu", "subModule": ["btnFile"] },
                { "modular": "FileMenu", "subModule": ["print"] },
                { "modular": "ViewTool", "subModule": ["btnHideToolbar" },
                { "modular": "RightMouseButtonMenu", "subModule": ["prePaginationSegment"] }
	]
	},

Spire.Cloud 自定义控制工具栏按钮权限功能

保存后，打开 index.html 示例，您会发现 “插入” 按钮被移除：

Spire.Cloud 自定义控制工具栏按钮权限功能

back to top