更新editor组件, 支持视频插入
parent
9feab73d46
commit
36ced2378c
|
|
@ -31,7 +31,8 @@ const ACTTION = {
|
|||
color: 'foreColor',
|
||||
link: 'createLink',
|
||||
ordered: 'insertOrderedList',
|
||||
unordered: 'insertUnorderedList'
|
||||
unordered: 'insertUnorderedList',
|
||||
html: 'insertHTML'
|
||||
}
|
||||
|
||||
const TOOLBAR = [
|
||||
|
|
@ -49,6 +50,7 @@ const TOOLBAR = [
|
|||
'right',
|
||||
'link',
|
||||
'image',
|
||||
'video',
|
||||
'fullscreen',
|
||||
'copy'
|
||||
]
|
||||
|
|
@ -457,6 +459,28 @@ class Editor extends Component {
|
|||
})
|
||||
}
|
||||
|
||||
// 处理视频
|
||||
#handleVideo(ev, file) {
|
||||
if (ev && ev.type === 'change') {
|
||||
file = ev.target.files[0]
|
||||
ev.target.value = ''
|
||||
}
|
||||
this.$emit('upload', {
|
||||
detail: {
|
||||
file,
|
||||
send: link => {
|
||||
this.$refs.editor.focus()
|
||||
this.restoreSelection()
|
||||
this.exec(
|
||||
ACTTION.html,
|
||||
`<p> </p><div style="display:flex;justify-content:center;"><video src="${link}" controls style="max-width:100%;" /></div><p> </p>`
|
||||
)
|
||||
this.saveSelection()
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
#handlePaste(ev) {
|
||||
let html = ev.clipboardData.getData('text/html')
|
||||
let txt = ev.clipboardData.getData('text/plain')
|
||||
|
|
@ -536,6 +560,7 @@ class Editor extends Component {
|
|||
break
|
||||
|
||||
case 'image':
|
||||
case 'video':
|
||||
// 这里不作任何处理
|
||||
break
|
||||
|
||||
|
|
@ -683,6 +708,13 @@ class Editor extends Component {
|
|||
@change=${this.#handleImage}
|
||||
accept="image/*"
|
||||
/>`
|
||||
: it === 'video'
|
||||
? html`<input
|
||||
type="file"
|
||||
:disabled=${this.readOnly || this.disabled}
|
||||
@change=${this.#handleVideo}
|
||||
accept="video/*"
|
||||
/>`
|
||||
: ''}
|
||||
</span>
|
||||
`
|
||||
|
|
|
|||
|
|
@ -12,6 +12,8 @@ export default {
|
|||
bold: 'M584.81777778 724.57443555H414.91000889v-145.63555556H584.81777778c40.29212445 0 72.81777778 32.52565333 72.81777777 72.81777778 0 40.29326222-32.52565333 72.81777778-72.81777777 72.81777778m-169.90776889-436.90666667h145.63555556c40.29212445 0 72.81777778 32.52565333 72.81777777 72.81777778 0 40.29326222-32.52565333 72.81777778-72.81777777 72.81777778h-145.63555556m271.85265778 62.62328889C733.85187555 462.91626666 766.86222222 409.03111111 766.86222222 360.48554666c0-109.71136-84.95445333-194.17998222-194.18112-194.17998222H269.27445333V845.93777777H611.03217778c101.94488889 0 180.10225778-82.52643555 180.10225777-183.98663111 0-73.78830222-41.74848-136.89742222-104.37176888-166.02453333z',
|
||||
image:
|
||||
'M552.0003125 392h219.999375L552.0003125 171.9996875V392M272 111.9996875h319.9996875l240 240v480c0 44.000625-36 80.000625-79.9996875 80.000625H272c-44.4 0-79.9996875-36-79.9996875-80.000625V192.0003125A79.723125 79.723125 0 0 1 272 111.9996875m0 720h480V512L591.9996875 672.0003125 512 591.9996875l-240 240M351.9996875 392C308 392 272 428 272 471.9996875c0 44.000625 36 80.000625 79.9996875 80.000625 44.000625 0 80.000625-36 80.000625-80.000625 0-43.9996875-36-79.9996875-80.000625-79.9996875z',
|
||||
video:
|
||||
'M910.222 284.445H113.777V170.667c0-31.42 25.47-56.89 56.889-56.89h682.666c31.42 0 56.89 25.47 56.89 56.89v113.777zm0 56.888v512c0 31.42-25.47 56.89-56.889 56.89H170.667c-31.42 0-56.89-25.47-56.89-56.89v-512h796.446zM284.445 170.667l57.241 113.777h56.889l-57.242-113.777h-56.888zm170.666 0l57.241 113.777h56.89L512 170.668h-56.89zm170.667 0l57.241 113.777h56.889l-57.242-113.777h-56.888zm6.005 452.108a28.445 28.445 0 0012.722-12.72c7.024-14.052 1.33-31.138-12.722-38.163l-192.395-96.198a28.445 28.445 0 00-12.72-3.003c-15.71 0-28.445 12.735-28.445 28.444v192.397a28.45 28.45 0 003.003 12.72c7.025 14.051 24.112 19.747 38.162 12.72l192.396-96.197z',
|
||||
left: 'M128 128h768v85.333H128V128m0 170.667h512V384H128v-85.333m0 170.666h768v85.334H128v-85.334M128 640h512v85.333H128V640m0 170.667h768V896H128v-85.333z',
|
||||
link: 'M879.2 131.6c-103-95.5-264.1-88-361.4 11.2L474.7 184c-13.1 13.1-3.7 35.6 13.1 37.5 26.2 1.9 52.4 7.5 78.7 15 7.5 1.9 16.9 0 22.5-5.6l9.4-9.4c54.3-54.3 142.3-59.9 198.5-11.2 63.7 54.3 65.5 151.7 7.5 209.7L662 562.3c-18.7 18.7-41.2 30-63.7 37.5-30 7.5-61.8 5.6-89.9-5.6-16.9-7.5-33.7-16.9-48.7-31.8-7.5-7.5-13.1-15-18.7-24.3-7.5-13.1-24.3-15-33.7-3.7l-52.4 52.4c-7.5 7.5-7.5 18.7-1.9 28.1 7.5 11.2 16.9 20.6 26.2 30 13.1 13.1 30 26.2 44.9 35.6 26.2 16.9 56.2 28.1 86.1 33.7 58.1 11.2 121.7 1.9 174.2-26.2 20.6-11.2 41.2-26.2 58.1-43.1l142.3-142.3c104.9-103.2 101.2-271.8-5.6-371zM534.7 803.9l-39.3-5.6s-26.2-5.6-39.3-11.2c-7.5-1.9-16.9 0-22.5 5.6l-9.4 9.4c-54.3 54.3-142.3 59.9-198.5 11.2-63.7-54.3-65.5-151.7-7.5-209.7l142.3-142.3c18.7-18.7 41.2-30 63.7-37.5 30-7.5 61.8-5.6 89.9 5.6 16.9 7.5 33.7 16.9 48.7 31.8 7.5 7.5 13.1 15 18.7 24.3 7.5 13.1 24.3 15 33.7 3.7l52.4-52.4c7.5-7.5 7.5-18.7 1.9-28.1-7.5-11.2-16.9-20.6-26.2-30-13.1-13.1-28.1-26.2-44.9-35.6-26.2-16.9-56.2-28.1-88-33.7-58.1-11.2-121.7-1.9-174.2 26.2-20.6 11.2-41.2 26.2-58.1 43.1L141.4 515.5c-99.3 99.3-106.7 260.3-11.2 361.4C229.5 985.5 398 987.4 501 884.4l46.8-46.8c13.1-9.4 3.7-31.9-13.1-33.7z',
|
||||
ordered:
|
||||
|
|
|
|||
Loading…
Reference in New Issue