| commit | author | age | ||
| 9c695b | 1 | <template> |
| I | 2 | <div class="myModal"> |
| 0b0125 | 3 | <a-modal v-model="visible" title="编辑预览" width="60%" :footer="null" |
| e33959 | 4 | :bodyStyle="{'overflow':'overlay','width': '100%','height': '700px'}"> |
| 9c695b | 5 | <div style="display: flex;"> |
| 74344a | 6 | <a-textarea id="myInput" style="height: 750px;min-width: 50%" v-model="text" |
| 0b0125 | 7 | @keydown.9.native.prevent="tabFunc" /> |
| a71b64 | 8 | <div class="markdown-body article-detail" style="min-width: 50%;border: 1px solid #d9d9d9;"> |
| 0b0125 | 9 | <vue-markdown :source="text"></vue-markdown> |
| 9c695b | 10 | </div> |
| I | 11 | </div> |
| 12 | </a-modal> | |
| 13 | </div> | |
| 14 | ||
| 15 | </template> | |
| 16 | ||
| 17 | <script> | |
| 18 | import VueMarkdown from 'vue-markdown' | |
| 74344a | 19 | |
| 9c695b | 20 | |
| cb7779 | 21 | //import md5 from 'js-md5'; |
| 9c695b | 22 | export default { |
| I | 23 | components: { |
| 24 | VueMarkdown | |
| 25 | }, | |
| 26 | data() { | |
| 27 | return { | |
| 28 | visible: false, | |
| 0b0125 | 29 | text: "###   十里平湖 \r> ##### (卢照邻) \r> 化自《长安古意》 \r* 十里平湖霜满天 \r* 寸寸青丝愁华年 \r* 对月形单望相护 \r* 只羡鸳鸯不羡仙 \r", |
| 9c695b | 30 | } |
| I | 31 | }, |
| 32 | methods: { | |
| 0b0125 | 33 | tabFunc() { |
| I | 34 | this.insertInputTxt('myInput', '\t') |
| 35 | }, | |
| 36 | insertInputTxt(id, insertTxt) { | |
| 74344a | 37 | var elInput = document.getElementById(id); |
| 0b0125 | 38 | var startPos = elInput.selectionStart |
| I | 39 | var endPos = elInput.selectionEnd |
| 40 | if (startPos === undefined || endPos === undefined) return | |
| 41 | var txt = elInput.value | |
| 42 | var result = txt.substring(0, startPos) + insertTxt + txt.substring(endPos) | |
| 43 | elInput.value = result | |
| 44 | elInput.focus() | |
| 45 | elInput.selectionStart = startPos + insertTxt.length | |
| 46 | elInput.selectionEnd = startPos + insertTxt.length | |
| 47 | }, | |
| 48 | ||
| 9c695b | 49 | getCalendarContainer(trigger) { |
| I | 50 | return this.$refs.myModal; |
| 51 | }, | |
| 52 | showModal() { | |
| 53 | this.visible = true; | |
| 54 | }, | |
| 55 | handleCancel(e) { | |
| 56 | this.visible = false; | |
| 57 | }, | |
| 58 | ||
| 59 | }, | |
| 60 | } | |
| 61 | </script> | |
| 62 | ||
| 63 | <style> | |
| 64 | </style> | |
