Skip to content

Commit c638b6f

Browse files
tzfuntzfun
committed
publish 2.1.2
1 parent b929d1e commit c638b6f

File tree

3 files changed

+114
-109
lines changed

3 files changed

+114
-109
lines changed

‎README.md‎

Lines changed: 55 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ A web-side command line plugin built by `Vue`, supports multiple message formats
2020
* Support ↑ ↓ key history command toggle
2121
* Support full-screen display
2222
* Support window drag
23+
* Support for multi-line text editing
2324
* Support custom command library and search for help tips, use the `Tab` key to quickly fill
2425
* Support User inputting filter
2526
* Support API interface: execute command, push message, simulate drag and drop, get position, full screen, modify context, etc.
@@ -141,14 +142,15 @@ Terminal tag supports attribute parameter table.
141142

142143
Terminal tag support event table
143144

144-
| Event name | Description | Callback arguments |
145-
|---------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|--------------------------------------------|
146-
| execCmd | Fired when a custom command is executed. `success` and `failed` are callback functions, **must call one of the two callbacks before echoing!**, the meaning of the `success` callback parameter is described below, and the `failed` callback parameter is a string. | `(cmdKey, command, success, failed, name)` |
147-
| beforeExecCmd | Triggered before the user presses Enter to execute the command. | `(cmdKey, command, name)` |
148-
| onKeydown | When the cursor focus is obtained, press any keyboard to trigger. | `(event, name)` |
149-
| onClick | Triggered when the user clicks the button, the parameter `key` is the unique identification of the button, there are buttons: `close`, `minScreen`, `fullScreen`, `title`. | `(key, name)` |
150-
| initBefore | Lifecycle function, triggered before plugin initialization. | `(name)` |
151-
| initComplete | Lifecycle function, triggered after plugin initialization is complete. | `(name)` |
145+
| Event name | Description | Callback arguments |
146+
|-----------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|--------------------------------------------|
147+
| execCmd | Fired when a custom command is executed. `success` and `failed` are callback functions, **must call one of the two callbacks before echoing!**, the meaning of the `success` callback parameter is described below, and the `failed` callback parameter is a string. | `(cmdKey, command, success, failed, name)` |
148+
| beforeExecCmd | Triggered before the user presses Enter to execute the command. | `(cmdKey, command, name)` |
149+
| onKeydown | When the cursor focus is obtained, press any keyboard to trigger. | `(event, name)` |
150+
| onClick | Triggered when the user clicks the button, the parameter `key` is the unique identification of the button, there are buttons: `close`, `minScreen`, `fullScreen`, `title`. | `(key, name)` |
151+
| initBefore | Lifecycle function, triggered before plugin initialization. | `(name)` |
152+
| initComplete | Lifecycle function, triggered after plugin initialization is complete. | `(name)` |
153+
| tabKeyHandler | The logic processing method when the user types the Tab key can be used in conjunction with the `helpCmd` slot. | `(event)` |
152154

153155
**Special note**: The `success` callback parameter of `execCmd` supports multiple data types, and the execution logic of different data types will be different:
154156

@@ -172,22 +174,23 @@ Terminal supports the following custom slots, this feature is supported in `2.0.
172174
| code | { message } | Custom `code` type message. |
173175
| html | { message } | Custom `html` type message. |
174176
| flash | { content } | Custom flash style |
177+
| helpCmd | { item } | Custom command search prompt style |
175178

176179
example:
177180

178181
```vue
179182
<terminal :name="name" @execCmd="onExecCmd">
180-
<template #header>
181-
This is my custom header
182-
</template>
183+
<template #header>
184+
This is my custom header
185+
</template>
183186
184-
<template #json="data">
185-
{{ data.message }}
186-
</template>
187+
<template #json="data">
188+
{{ data.message }}
189+
</template>
187190
188-
<template #helpBox="{showHeader, item}">
189-
{{ item }}
190-
</template>
191+
<template #helpBox="{showHeader, item}">
192+
{{ item }}
193+
</template>
191194
</terminal>
192195
```
193196

@@ -220,8 +223,8 @@ let name = 'my-terminal'
220223

221224
// push a message
222225
let message = {
223-
class: 'warning',
224-
content: 'This is a wanning message.'
226+
class: 'warning',
227+
content: 'This is a wanning message.'
225228
}
226229

227230
Terminal.$api.pushMessage(name, message)
@@ -288,8 +291,8 @@ When [Feature Drag](#Drag) is enabled, you can use the following method to simul
288291

289292
```js
290293
Terminal.$api.dragging('my-terminal', {
291-
x: 100,
292-
y: 200
294+
x: 100,
295+
y: 200
293296
})
294297
```
295298

@@ -348,10 +351,10 @@ A text editor will open after this API call
348351

349352
```js
350353
Terminal.$api.textEditorOpen('my-terminal', {
351-
content: 'This is the preset content',
352-
onClose: value => {
353-
console.log('Final content: ', value)
354-
}
354+
content: 'This is the preset content',
355+
onClose: value => {
356+
console.log('Final content: ', value)
357+
}
355358
})
356359
```
357360

@@ -460,14 +463,14 @@ import 'codemirror/addon/edit/closebrackets.js'
460463

461464
Vue.use(VueCodemirror)
462465
Vue.use(Terminal, {
463-
codemirror: {
464-
tabSize: 4,
465-
mode: 'text/x-java',
466-
theme: "darcula",
467-
lineNumbers: true,
468-
line: true,
469-
smartIndent: true
470-
}
466+
codemirror: {
467+
tabSize: 4,
468+
mode: 'text/x-java',
469+
theme: "darcula",
470+
lineNumbers: true,
471+
line: true,
472+
smartIndent: true
473+
}
471474
})
472475
```
473476

@@ -513,10 +516,10 @@ When type is `html`, the content format can be customized, and content is compos
513516

514517
```js
515518
function execCmd(key, command, success) {
516-
// ...
517-
success({
518-
type: 'html',
519-
content: `
519+
// ...
520+
success({
521+
type: 'html',
522+
content: `
520523
<ul class="custom-content">
521524
<li class="t-dir">dir 1</li>
522525
<li class="t-dir">dir 2</li>
@@ -526,8 +529,8 @@ function execCmd(key, command, success) {
526529
<li class="t-file">file 3</li>
527530
</ul>
528531
`
529-
})
530-
// ...
532+
})
533+
// ...
531534
}
532535
```
533536

@@ -674,8 +677,8 @@ In addition to mouse control, you can also [call API to simulate dragging](#drag
674677

675678
[Online Demo](https://tzfun.github.io/vue-web-terminal/?cmd=flash)
676679

677-
The default messages of Terminal are displayed in the append mode. When you only need to display the execution process,
678-
and when the content does not want to exist in the record after the execution, real-time echo is a good choice.
680+
The default messages of Terminal are displayed in the append mode. When you only need to display the execution process,
681+
and when the content does not want to exist in the record after the execution, real-time echo is a good choice.
679682
For example, when `gradle` or `npm` download dependencies, the process of downloading the progress bar animation.
680683

681684
In the `execCmd` event callback of [Events](#Events), the `success` callback function supports the incoming Flash processing object.
@@ -691,31 +694,31 @@ success(flash)
691694

692695
let count = 0
693696
let flashInterval = setInterval(() => {
694-
flash.flush(`This is flash content: ${count}`)
697+
flash.flush(`This is flash content: ${count}`)
695698

696-
if (++count >= 20) {
697-
clearInterval(flashInterval)
698-
flash.finish()
699-
}
699+
if (++count >= 20) {
700+
clearInterval(flashInterval)
701+
flash.finish()
702+
}
700703
}, 200)
701704
```
702705

703706
### User-input
704707

705708
[Online Demo](https://tzfun.github.io/vue-web-terminal/?cmd=ask)
706709

707-
When you need to ask the user, you can use this function to get the content entered by the user,
710+
When you need to ask the user, you can use this function to get the content entered by the user,
708711
such as the scenario where the user needs to enter the username and password when logging in.
709712

710713
In the `execCmd` event callback of [Events](#Events), the `success` callback function supports incoming user input processing objects.
711714

712715
Create a new ask object through `new Terminal.$Ask()` and pass it into the success callback. The ask object provides two methods:
713716

714717
* `ask(options)`: Initiate a user to ask for input, options is an object, and its properties are explained as follows (* indicates required):
715-
* *`question`: string, The question to ask, or a prefix string that can be understood as user input
716-
* *`callback`: function, The callback when the user types an enter key, the parameter value is the content entered by the user
717-
* `autoReview`: bool, Whether to automatically append the current display content when the user types an enter key
718-
* `isPassword`: bool, Whether it is a password input
718+
* *`question`: string, The question to ask, or a prefix string that can be understood as user input
719+
* *`callback`: function, The callback when the user types an enter key, the parameter value is the content entered by the user
720+
* `autoReview`: bool, Whether to automatically append the current display content when the user types an enter key
721+
* `isPassword`: bool, Whether it is a password input
719722
* `finish()`: End execution
720723

721724
```js
@@ -732,7 +735,7 @@ asker.ask({
732735
autoReview: true,
733736
isPassword: true,
734737
callback:() => {
735-
// do something
738+
// do something
736739
asker.finish()
737740
}
738741
})

0 commit comments

Comments
 (0)