Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
夜猫逐梦
1024程序员开源挑战赛
提交
26f3694e
1
1024程序员开源挑战赛
项目概览
夜猫逐梦
/
1024程序员开源挑战赛
与 Fork 源项目一致
Fork自
GitCode / 1024程序员开源挑战赛(10.23-11.14)
通知
3
Star
1
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
1
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
1
1024程序员开源挑战赛
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
1
Issue
1
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
26f3694e
编写于
11月 28, 2021
作者:
B
baiy
提交者:
ninecents
10月 23, 2022
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
1.9.3 update
上级
434f7dc5
变更
8
展开全部
显示空白变更内容
内联
并排
Showing
8 changed file
with
1413 addition
and
378 deletion
+1413
-378
README.md
README.md
+8
-15
package-lock.json
package-lock.json
+1186
-224
package.json
package.json
+9
-8
src/i18n/locales/en/main.i18n.json5
src/i18n/locales/en/main.i18n.json5
+2
-1
src/i18n/locales/zh_CN/main.i18n.json5
src/i18n/locales/zh_CN/main.i18n.json5
+7
-6
src/tool/model.js
src/tool/model.js
+95
-27
src/views/tool/code.vue
src/views/tool/code.vue
+38
-27
src/views/tool/components/codeEditor.vue
src/views/tool/components/codeEditor.vue
+68
-70
未找到文件。
README.md
浏览文件 @
26f3694e
...
...
@@ -12,13 +12,7 @@
## chrome 安装
-
方法1: 在
[
Chrome 应用商店
](
https://chrome.google.com/webstore/detail/ipfcebkfhpkjeikaammlkcnalknjahmh
)
安装
-
方法2:
[
下载 .crx 安装包
](
https://github.com/baiy/Ctool/releases/latest
)
-
方法3:
[
百度网盘下载
](
https://pan.baidu.com/s/1mhWbqWC
)
安装方法和方法2一致
> 方法2 / 方法3 不定期维护 仅供网络环境特别恶劣的同学使用
>
> [猛戳这里查看手动安装`.crx`教程](http://www.cnplugins.com/tool/outline-install-crx-file.html)
-
在
[
Chrome 应用商店
](
https://chrome.google.com/webstore/detail/ipfcebkfhpkjeikaammlkcnalknjahmh
)
安装
## 微软 Edge 安装
...
...
@@ -30,9 +24,7 @@
## utools 安装
### 插件中心安装
> 插件中心搜索 `ctool`
-
[
utools
](
https://u.tools/
)
插件中心 搜索
`ctool`
## 开发
...
...
@@ -54,15 +46,15 @@ npm run build -adapter=[chrome|edge|utools|firefox|web]
|加密/解密|
`AES`
,
`DES`
,
`RC4`
,
`Rabbit`
,
`TripleDes`
,
`sm2`
|√|
|BASE64编码|
`加密`
,
`解密`
,
`支持文件`
|√|
|URL编码|
`编码`
,
`解码`
|√|
|时间戳|
双向转换
|√|
|时间戳|
`双向转换`
,
`毫秒`
|√|
|二维码|
`生成`
,
`解析`
|√|
|条形码|
`生成`
|√|
|汉字转拼音|
`声调`
,
`首字母`
,
`分隔符`
|√|
|IP地址查询|
`运营商`
,
`城市`
|×|
|代码格式化|
`js`
,
`ts`
,
`html`
,
`css`
,
`less`
,
`scss`
,
`graphql`
,
`vue`
,
`angular`
,
`markdown`
,
`json5`
,
`xml`
,
`yaml`
,
`sql`
,
`压缩`
|√|
|Unicode|
`双向转换`
,
`emoji`
,
`html 实体`
,
`css 实体`
|√|
|进制转换|
2-64进制互转
|√|
|正则表达式|
字符匹配
|√|
|进制转换|
`2-64进制`
|√|
|正则表达式|
`匹配`
,
`查找`
,
`替换`
|√|
|随机字符生成器|
`批量`
,
`特殊字符`
|√|
|序列化转换|
`json`
,
`xml`
,
`yaml`
,
`phpArray`
,
`phpSerialize`
,
`properties`
|√|
|文本差异化对比|
`行`
,
`单词`
,
`css`
|√|
...
...
@@ -78,8 +70,9 @@ npm run build -adapter=[chrome|edge|utools|firefox|web]
|jwt解码|
`header`
,
`payload`
|√|
|Hex/String转换|
`hex to string`
,
`string to hex`
,
`十六进制转字符串`
,
`字符串转十六进制`
|√|
|文本处理|
`大小写转换`
,
`中英文标点转换`
,
`简繁转换`
,
`替换`
,
`字符统计`
,
`行去重`
,
`添加行号`
,
`行排序`
,
`过滤行首尾不可见字符`
,
`过滤空行`
|√|
|html编码|
`html编码`
|√|
|签名/验签|
`签名`
,
`验签`
,
`RSA`
|√|
|html编码|-|√|
|原码/反码/补码|
`生成`
|√|
|ARM/HEX|
`互转`
|×|
## 第三方开源库
...
...
package-lock.json
浏览文件 @
26f3694e
此差异已折叠。
点击以展开。
package.json
浏览文件 @
26f3694e
{
"name"
:
"c-tool"
,
"version"
:
"1.9.
2
"
,
"version"
:
"1.9.
3
"
,
"private"
:
true
,
"scripts"
:
{
"serve"
:
"vue-cli-service serve --port 8081"
,
...
...
@@ -17,14 +17,15 @@
"
babel-runtime
"
:
"
^6.26.0
"
,
"
bignumber.js
"
:
"
^9.0.1
"
,
"
code-formatter
"
:
"
0.0.1
"
,
"
codemirror
"
:
"
^5.63.3
"
,
"
codemirror-graphql
"
:
"
^1.1.0
"
,
"
codemirror
"
:
"
^5.64.0
"
,
"
codemirror-graphql
"
:
"
^1.2.4
"
,
"
cosmiconfig
"
:
"
^7.0.1
"
,
"
cron-parser
"
:
"
^2.16.3
"
,
"
cronstrue
"
:
"
^1.122.0
"
,
"
crypto-js
"
:
"
^3.3.0
"
,
"
diff-match-patch
"
:
"
^1.0.5
"
,
"
file
"
:
"
^0.2.2
"
,
"
graphql
"
:
"
15.
5.0
"
,
"
graphql
"
:
"
15.
7.2
"
,
"
ipinyinjs
"
:
"
^1.0.0
"
,
"
jian_fan
"
:
"
^1.0.3
"
,
"
jimp
"
:
"
^0.16.1
"
,
...
...
@@ -35,7 +36,7 @@
"
json-to-properties
"
:
"
^1.1.3
"
,
"
json5
"
:
"
^2.2.0
"
,
"
jsonlint
"
:
"
^1.6.3
"
,
"
jsrsasign
"
:
"
^10.
4.1
"
,
"
jsrsasign
"
:
"
^10.
5.0
"
,
"
jsrsasign-util
"
:
"
^1.0.5
"
,
"
jwt-decode
"
:
"
^3.1.2
"
,
"
lodash
"
:
"
^4.17.21
"
,
...
...
@@ -43,13 +44,13 @@
"
moment
"
:
"
^2.29.1
"
,
"
php-array-reader
"
:
"
^1.3.2
"
,
"
phparr
"
:
"
^0.2.0
"
,
"
postcss
"
:
"
^8.
3.11
"
,
"
postcss
"
:
"
^8.
4.4
"
,
"
postcss-less
"
:
"
^5.0.0
"
,
"
postcss-scss
"
:
"
^4.0.2
"
,
"
prettier
"
:
"
^2.
4.1
"
,
"
prettier
"
:
"
^2.
5.0
"
,
"
prettier-plugin-sql
"
:
"
^0.3.0
"
,
"
properties-to-json
"
:
"
^0.1.7
"
,
"
qrcode
"
:
"
^1.
4.4
"
,
"
qrcode
"
:
"
^1.
5.0
"
,
"
qrcode-parser
"
:
"
^1.2.0
"
,
"
query-string
"
:
"
^6.14.1
"
,
"
serialize-php
"
:
"
^1.1.2
"
,
...
...
src/i18n/locales/en/main.i18n.json5
浏览文件 @
26f3694e
...
...
@@ -70,5 +70,6 @@
"tool_binary": "trueForm/inverse/complement",
"tool_armConverter": "ARM/HEX",
// other
"css_main_category_item_style": "padding: 0 10px"
"css_main_category_item_style": "padding: 0 10px",
"editor_line_wrapping": "Line Wrapping"
}
src/i18n/locales/zh_CN/main.i18n.json5
浏览文件 @
26f3694e
...
...
@@ -54,15 +54,15 @@
"tool_regex": "正则表达式",
"tool_randomString": "随机字符生成",
"tool_serializeConversion": "序列化转换",
"tool_diffs": "文本
差异化对比
",
"tool_crontab": "crontab
校验
",
"tool_websocket": "websocket
调试
",
"tool_diffs": "文本
比对
",
"tool_crontab": "crontab",
"tool_websocket": "websocket",
"tool_unit": "单位换算",
"tool_time": "时间计算器",
"tool_uuid": "UUID生成",
"tool_jsonToObject": "JSON转实体类",
"tool_ascii": "ASCII
转换
",
"tool_variableConversion": "变量名
转换
",
"tool_ascii": "ASCII",
"tool_variableConversion": "变量名",
"tool_jwt": "JWT解码",
"tool_hexString": "Hex/String",
"tool_text": "文本处理",
...
...
@@ -70,5 +70,6 @@
"tool_binary": "原码/反码/补码",
"tool_armConverter": "ARM/HEX",
// 其他
"css_main_category_item_style": "padding: 0 20px"
"css_main_category_item_style": "padding: 0 20px",
"editor_line_wrapping": "自动换行"
}
src/tool/model.js
浏览文件 @
26f3694e
...
...
@@ -3,6 +3,7 @@ import clipboard from './clipboard'
import
setting
from
'
./setting
'
import
cache
from
'
./cache
'
import
history
from
'
./history.js
'
import
_
from
"
lodash
"
;
let
fixeInputData
;
let
toolCurrentFeature
=
""
;
...
...
@@ -44,41 +45,108 @@ const model = {
}
}
// 保存历史记录防抖
let
debounceSaveToolData
=
{};
const
debounceSaveToolDataMethod
=
_
.
debounce
(
function
()
{
return
history
(
debounceSaveToolData
[
'
tool
'
]).
push
(
debounceSaveToolData
[
'
data
'
])
},
1000
)
const
appendData
=
async
function
(
check
=
""
)
{
const
result
=
(
data
=
""
)
=>
{
if
(
data
)
{
if
(
!
check
||
(
_
.
isFunction
(
check
)
&&
check
(
data
))
// 函数校验
)
{
return
data
}
}
return
""
}
return
new
Promise
(
async
(
resolve
)
=>
{
try
{
// 使用固定输入数据
if
(
fixeInputData
)
{
let
temp
=
fixeInputData
fixeInputData
=
""
return
resolve
(
result
(
temp
))
}
if
(
setting
.
autoReadCopy
())
{
let
paste
=
(
await
clipboard
.
paste
()).
trim
()
if
(
paste
)
{
resolve
(
result
(
paste
))
}
}
resolve
(
result
())
}
catch
{
resolve
(
result
())
}
});
}
export
const
plugin
=
{
install
:
function
(
Vue
)
{
Vue
.
prototype
.
$getToolData
=
function
(
clipboardField
=
''
)
{
let
data
=
history
(
model
.
getCurrentTool
()).
current
()
if
(
clipboardField
)
{
if
(
fixeInputData
)
{
// 使用固定输入数据
data
[
clipboardField
]
=
fixeInputData
fixeInputData
=
""
}
else
if
(
setting
.
autoReadCopy
())
{
let
paste
=
clipboard
.
paste
()
if
(
!
data
[
clipboardField
]
&&
paste
)
{
if
(
setting
.
autoReadCopyFilter
()){
paste
=
paste
.
trim
()
Vue
.
prototype
.
$initToolData
=
function
(
input
=
""
,
inputCheck
=
""
,
field
=
"
current
"
,
isLoadHistory
=
true
)
{
let
current
=
_
.
cloneDeep
(
this
[
field
])
let
inputHistory
=
""
let
inputDefault
=
""
let
inputAppend
=
""
// 默认数据
if
(
input
&&
(
input
in
current
)
&&
current
[
input
])
{
inputDefault
=
current
[
input
];
}
data
[
clipboardField
]
=
paste
// 历史数据
if
(
isLoadHistory
)
{
let
history
=
this
.
$getToolData
()
if
(
input
&&
(
input
in
history
))
{
inputHistory
=
history
[
input
]
delete
history
[
input
]
}
Object
.
assign
(
current
,
this
.
$getToolData
())
}
if
(
!
input
)
{
this
[
field
]
=
current
return
;
}
return
data
// 追加剪贴板等数据
appendData
(
inputCheck
).
then
((
append
)
=>
{
inputAppend
=
append
this
[
field
]
=
Object
.
assign
(
current
,
{
// 历史数据 > 追加数据 > 默认数据
[
input
]:
inputHistory
?
inputHistory
:
(
inputAppend
?
inputAppend
:
inputDefault
)
}
Vue
.
prototype
.
$saveToolData
=
function
(
data
)
{
return
history
(
model
.
getCurrentTool
()).
push
(
data
)
)
}
)
}
Vue
.
prototype
.
$clipboardCopy
=
function
(
data
)
{
if
(
!
setting
.
autoSaveCopy
()
||
!
data
)
return
clipboard
.
copy
(
data
,()
=>
{
this
.
$Message
.
success
(
'
结果已复制 ^o^
'
)
Vue
.
prototype
.
$getToolData
=
function
()
{
return
_
.
cloneDeep
(
history
(
model
.
getCurrentTool
()).
current
())
}
Vue
.
prototype
.
$saveToolData
=
function
(
data
,
ignoreDebounce
=
false
)
{
if
(
ignoreDebounce
)
{
return
history
(
model
.
getCurrentTool
()).
push
(
_
.
cloneDeep
(
data
))
}
debounceSaveToolData
=
{
tool
:
model
.
getCurrentTool
(),
data
:
_
.
cloneDeep
(
data
)}
debounceSaveToolDataMethod
()
}
Vue
.
prototype
.
$clipboardCopy
=
function
(
data
,
force
=
false
)
{
if
((
setting
.
autoSaveCopy
()
||
force
)
&&
data
)
{
clipboard
.
copy
(
data
,
()
=>
{
this
.
$Message
.
success
(
this
.
$t
(
'
main_ui_copy_text_ok
'
).
toString
())
})
}
Vue
.
prototype
.
$clipboardCopyImages
=
function
(
data
)
{
if
(
!
setting
.
autoSaveCopy
()
||
!
data
)
return
clipboard
.
copyImage
(
data
,()
=>
{
this
.
$Message
.
success
(
'
图片已复制 ^o^
'
)
}
Vue
.
prototype
.
$clipboardCopyImages
=
function
(
data
,
force
=
false
)
{
if
((
setting
.
autoSaveCopy
()
||
force
)
&&
data
)
{
clipboard
.
copyImage
(
data
,
()
=>
{
this
.
$Message
.
success
(
this
.
$t
(
'
main_ui_copy_image_ok
'
).
toString
())
})
}
}
},
}
...
...
src/views/tool/code.vue
浏览文件 @
26f3694e
<
template
>
<div>
<
div
style=
"border: 1px solid #dcdee2; border-radius: 4px
"
>
<code-editor
ref=
"editor"
v-model=
"current.content"
:auto-height=
"220
"
:language=
"this.current.lang"
></code-editor>
</
div
>
<option-block>
<
heightResize
:append=
"['.page-option-block']
"
>
<code-editor
ref=
"editor"
showLineWrappingSet=
"no"
v-model=
"current.content
"
:language=
"this.current.lang"
></code-editor>
</
heightResize
>
<option-block
class=
"page-option-block"
>
<FormItem>
<ButtonGroup>
<Button
...
...
@@ -16,53 +16,63 @@
</ButtonGroup>
</FormItem>
<FormItem>
<Select
placeholder=
"更多语言
"
@
on-change=
"(value)=>
{handle(value)}">
<Select
:placeholder=
"$t('code_more')
"
@
on-change=
"(value)=>
{handle(value)}">
<Option
v-for=
"item in lang"
:value=
"item"
:key=
"item"
>
{{
item
}}
</Option>
</Select>
</FormItem>
<FormItem>
<Select
placeholder=
"代码缩进
"
v-model=
"current.tab"
>
<Option
:value=
"2"
>
缩进 Tab 2
</Option>
<Option
:value=
"4"
>
缩进 Tab 4
</Option>
<Option
:value=
"6"
>
缩进 Tab 6
</Option>
<Option
:value=
"8"
>
缩进 Tab 8
</Option>
<Select
:placeholder=
"$t('code_indent')
"
v-model=
"current.tab"
>
<Option
:value=
"2"
>
{{
$t
(
'
code_indent_width
'
,[
2
])
}}
</Option>
<Option
:value=
"4"
>
{{
$t
(
'
code_indent_width
'
,[
4
])
}}
</Option>
<Option
:value=
"6"
>
{{
$t
(
'
code_indent_width
'
,[
6
])
}}
</Option>
<Option
:value=
"8"
>
{{
$t
(
'
code_indent_width
'
,[
8
])
}}
</Option>
</Select>
</FormItem>
<FormItem>
<Checkbox
v-model=
"current.isCompress"
>
{{
$t
(
'
code_compress
'
)
}}
</Checkbox>
</FormItem>
</option-block>
</div>
</
template
>
<
script
>
import
_
from
"
lodash
"
;
import
codeEditor
from
"
./components/codeEditor
"
;
import
heightResize
from
"
./components/heightResize
"
;
export
default
{
components
:
{
codeEditor
,
heightResize
},
computed
:{
buttonLang
(){
let
data
=
_
.
slice
(
this
.
lang
,
0
,
8
)
if
(
this
.
current
.
lang
&&
!
data
.
includes
(
this
.
current
.
lang
)){
computed
:
{
buttonLang
()
{
let
data
=
_
.
slice
(
this
.
lang
,
0
,
7
)
if
(
this
.
current
.
lang
&&
!
data
.
includes
(
this
.
current
.
lang
))
{
data
.
push
(
this
.
current
.
lang
)
}
return
data
}
},
created
()
{
this
.
current
=
Object
.
assign
(
this
.
current
,
this
.
$getToolData
(
"
content
"
)
)
this
.
$initToolData
(
'
content
'
)
},
methods
:
{
handle
(
language
)
{
if
(
this
.
current
.
content
)
{
try
{
this
.
current
.
lang
=
language
;
this
.
$refs
.
editor
.
format
(
language
,{
tab
:
this
.
current
.
tab
});
this
.
$saveToolData
(
this
.
current
);
return
this
.
$Message
.
success
(
'
格式化完成
'
);
if
(
!
this
.
current
.
isCompress
)
{
let
option
=
{
tab
:
this
.
current
.
tab
}
this
.
$refs
.
editor
.
format
(
language
,
option
);
}
else
{
this
.
$refs
.
editor
.
compress
(
language
);
}
catch
(
e
)
{
this
.
$saveToolData
(
this
.
current
);
return
this
.
$Message
.
success
(
this
.
$t
(
'
code_complete
'
).
toString
());
}
catch
(
e
)
{
console
.
log
(
e
)
return
this
.
$Modal
.
error
({
title
:
"
格式化错误
"
,
content
:
`
${
e
.
message
}
`
title
:
this
.
$t
(
'
code_error_prompt
'
).
toString
()
,
content
:
`
${
e
.
message
}
`
});
}
}
...
...
@@ -72,19 +82,20 @@ export default {
return
{
current
:
{
content
:
""
,
isCompress
:
false
,
lang
:
""
,
tab
:
4
,
tab
:
4
,
},
lang
:
[
"
html
"
,
"
js
"
,
"
css
"
,
"
xml
"
,
"
json
"
,
"
sql
"
,
"
yaml
"
,
"
php
"
,
"
xml
"
,
"
sql
"
,
"
javascript
"
,
"
css
"
,
"
typescript
"
,
"
ts
"
,
"
java
"
,
"
scss
"
,
"
less
"
,
...
...
src/views/tool/components/codeEditor.vue
浏览文件 @
26f3694e
<
template
>
<div
ref=
"container"
class=
"code-editor"
:style=
"`height:$
{containerHeight};width:${width}`">
</div>
<input-block
right=
"5px"
bottom=
"5px"
:style=
"style"
>
<div
ref=
"container"
class=
"code-editor"
:style=
"`height:100%;width:$
{width}`">
</div>
<template
slot=
"extra"
>
<Checkbox
v-if=
"showLineWrappingSet !== 'null'"
v-model=
"lineWrapping"
>
{{
$t
(
'
main_editor_line_wrapping
'
)
}}
</Checkbox>
</
template
>
</input-block>
</template>
<
script
>
import
formatter
from
"
../library/formatter
"
;
import
*
as
monaco
from
'
monaco-editor/esm/vs/editor/editor.api
'
;
const
allowFormatterLanguage
=
{
html
:
"
html
"
,
typescript
:
"
ts
"
,
javascript
:
"
js
"
,
json
:
"
json
"
,
graphql
:
"
graphql
"
,
java
:
"
java
"
,
markdown
:
"
markdown
"
,
php
:
"
php
"
,
css
:
"
css
"
,
scss
:
"
scss
"
,
less
:
"
less
"
,
sql
:
"
sql
"
,
xml
:
"
xml
"
,
yaml
:
"
yaml
"
,
vue
:
"
vue
"
,
angular
:
"
angular
"
,
}
import
{
format
}
from
"
../library/formatter
"
;
import
{
create
}
from
"
../library/editor
"
;
export
default
{
name
:
'
codeEditor
'
,
...
...
@@ -34,59 +20,56 @@ export default {
type
:
String
,
default
:
""
},
autoHeight
:
{
type
:
Number
,
default
:
0
enableBorder
:
{
type
:
Boolean
,
default
:
true
},
theme
:
{
placeholder
:
{
type
:
String
,
default
:
'
vs
'
default
:
""
},
roundedSelection
:
{
type
:
Boolean
,
default
:
true
showLineWrappingSet
:
{
type
:
String
,
default
:
"
null
"
},
height
:
{
type
:
String
,
default
:
"
350px
"
default
:
"
100%
"
},
hideLineNumbers
:
{
type
:
Boolean
,
default
:
false
},
width
:
{
type
:
String
,
default
:
"
100%
"
},
},
computed
:
{
style
()
{
let
css
=
[
`height:
${
this
.
height
}
`
];
if
(
this
.
enableBorder
)
{
css
.
push
(
"
border: 1px solid #dcdee2
"
)
css
.
push
(
"
border-radius: 4px
"
)
}
return
css
.
join
(
"
;
"
)
}
},
watch
:
{
value
(
newValue
)
{
if
(
this
.
editor
!==
null
&&
this
.
editor
.
getValue
()
!==
newValue
)
{
this
.
editor
.
pushUndoStop
();
this
.
editor
.
getModel
().
pushEditOperations
(
[],
[
{
range
:
this
.
editor
.
getModel
().
getFullModelRange
(),
text
:
newValue
,
},
]
);
this
.
editor
.
pushUndoStop
();
this
.
editor
.
setValue
(
newValue
)
}
},
language
(
newValue
)
{
if
(
this
.
editor
!==
null
)
{
monaco
.
editor
.
setModelLanguage
(
this
.
editor
.
getModel
(),
newValue
)
this
.
editor
.
customSetEditorLanguage
(
newValue
);
}
},
theme
(
newValue
)
{
lineWrapping
(
newValue
)
{
if
(
this
.
editor
!==
null
)
{
monaco
.
editor
.
setTheme
(
newValue
)
}
this
.
editor
.
setOption
(
"
lineWrapping
"
,
newValue
);
}
},
created
()
{
if
(
this
.
autoHeight
>
0
)
{
this
.
containerHeight
=
(
window
.
innerHeight
-
this
.
autoHeight
)
+
"
px
"
}
else
{
this
.
containerHeight
=
this
.
height
}
},
mounted
()
{
...
...
@@ -95,36 +78,51 @@ export default {
data
()
{
return
{
editor
:
null
,
containerHeight
:
""
lineWrapping
:
true
,
}
},
created
()
{
if
(
this
.
showLineWrappingSet
!==
'
null
'
)
{
this
.
lineWrapping
=
this
.
showLineWrappingSet
===
'
yes
'
}
},
methods
:
{
initEditor
()
{
this
.
$refs
.
container
.
innerHTML
=
''
this
.
editor
=
monaco
.
editor
.
create
(
this
.
$refs
.
container
,
{
value
:
this
.
value
,
language
:
this
.
language
,
theme
:
this
.
theme
,
roundedSelection
:
this
.
roundedSelection
,
automaticLayout
:
true
})
this
.
editor
.
onDidChangeModelContent
(()
=>
{
if
(
this
.
value
!==
this
.
editor
.
getValue
()){
this
.
$emit
(
'
input
'
,
this
.
editor
.
getValue
())
this
.
editor
=
create
(
this
.
$refs
.
container
,
this
.
language
,
{
lineNumbers
:
!
this
.
hideLineNumbers
,
lineWrapping
:
this
.
lineWrapping
,
placeholder
:
this
.
placeholder
}
);
this
.
editor
.
setValue
(
this
.
value
)
this
.
editor
.
on
(
'
change
'
,
editor
=>
{
if
(
this
.
value
!==
editor
.
getValue
())
{
this
.
$emit
(
'
input
'
,
editor
.
getValue
())
}
})
},
/** @return monaco.editor.IStandaloneCodeEditor*/
getEditor
()
{
return
this
.
editor
},
format
(
lang
,
option
=
{})
{
if
(
!
(
lang
in
allowFormatterLanguage
)){
throw
new
Error
(
"
当前代码无法格式化
"
);
}
this
.
$emit
(
'
input
'
,
format
ter
(
this
.
editor
.
getValue
(),
allowFormatterLanguage
[
lang
],
option
))
format
(
lang
,
option
=
{})
{
this
.
$emit
(
'
input
'
,
format
(
this
.
editor
.
getValue
(),
lang
,
false
,
option
))
},
compress
(
lang
)
{
this
.
$emit
(
'
input
'
,
format
(
this
.
editor
.
getValue
(),
lang
,
true
))
}
}
};
</
script
>
<
style
>
.CodeMirror
{
height
:
100%
;
}
.CodeMirror
pre
.CodeMirror-placeholder
{
color
:
#999
;
}
</
style
>
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录