| 
									
										
										
										
											2017-07-01 20:23:46 +08:00
										 |  |  | <div id="code-editor"> | 
					
						
							| 
									
										
										
										
											2017-08-07 04:08:03 +08:00
										 |  |  |     <div overlay ref="overlay" v-cloak @click="hide()"> | 
					
						
							| 
									
										
										
										
											2019-08-25 01:26:28 +08:00
										 |  |  |         <div class="popup-body" tabindex="-1" @click.stop> | 
					
						
							| 
									
										
										
										
											2017-07-01 20:23:46 +08:00
										 |  |  | 
 | 
					
						
							|  |  |  |             <div class="popup-header primary-background"> | 
					
						
							|  |  |  |                 <div class="popup-title">{{ trans('components.code_editor') }}</div> | 
					
						
							| 
									
										
										
										
											2019-04-07 18:34:40 +08:00
										 |  |  |                 <button class="popup-header-close" @click="hide()">x</button> | 
					
						
							| 
									
										
										
										
											2017-07-01 20:23:46 +08:00
										 |  |  |             </div> | 
					
						
							|  |  |  | 
 | 
					
						
							| 
									
										
										
										
											2019-04-07 16:57:48 +08:00
										 |  |  |             <div class="p-l popup-content"> | 
					
						
							| 
									
										
										
										
											2017-07-01 20:23:46 +08:00
										 |  |  |                 <div class="form-group"> | 
					
						
							|  |  |  |                     <label for="code-editor-language">{{ trans('components.code_language') }}</label> | 
					
						
							| 
									
										
										
										
											2017-07-01 22:50:28 +08:00
										 |  |  |                     <div class="lang-options"> | 
					
						
							|  |  |  |                         <small> | 
					
						
							|  |  |  |                             <a @click="updateLanguage('CSS')">CSS</a> | 
					
						
							|  |  |  |                             <a @click="updateLanguage('C')">C</a> | 
					
						
							|  |  |  |                             <a @click="updateLanguage('C++')">C++</a> | 
					
						
							|  |  |  |                             <a @click="updateLanguage('C#')">C#</a>
 | 
					
						
							|  |  |  |                             <a @click="updateLanguage('Go')">Go</a> | 
					
						
							|  |  |  |                             <a @click="updateLanguage('HTML')">HTML</a> | 
					
						
							|  |  |  |                             <a @click="updateLanguage('Java')">Java</a> | 
					
						
							|  |  |  |                             <a @click="updateLanguage('JavaScript')">JavaScript</a> | 
					
						
							|  |  |  |                             <a @click="updateLanguage('JSON')">JSON</a> | 
					
						
							| 
									
										
										
										
											2019-03-02 16:52:14 +08:00
										 |  |  |                             <a @click="updateLanguage('Lua')">Lua</a> | 
					
						
							| 
									
										
										
										
											2017-07-01 22:50:28 +08:00
										 |  |  |                             <a @click="updateLanguage('PHP')">PHP</a> | 
					
						
							| 
									
										
										
										
											2019-02-06 14:06:59 +08:00
										 |  |  |                             <a @click="updateLanguage('Powershell')">Powershell</a> | 
					
						
							| 
									
										
										
										
											2017-07-01 22:50:28 +08:00
										 |  |  |                             <a @click="updateLanguage('MarkDown')">MarkDown</a> | 
					
						
							|  |  |  |                             <a @click="updateLanguage('Nginx')">Nginx</a> | 
					
						
							|  |  |  |                             <a @click="updateLanguage('Python')">Python</a> | 
					
						
							|  |  |  |                             <a @click="updateLanguage('Ruby')">Ruby</a> | 
					
						
							|  |  |  |                             <a @click="updateLanguage('shell')">Shell/Bash</a> | 
					
						
							|  |  |  |                             <a @click="updateLanguage('SQL')">SQL</a> | 
					
						
							|  |  |  |                             <a @click="updateLanguage('XML')">XML</a> | 
					
						
							|  |  |  |                             <a @click="updateLanguage('YAML')">YAML</a> | 
					
						
							|  |  |  |                         </small> | 
					
						
							|  |  |  |                     </div> | 
					
						
							| 
									
										
										
										
											2017-07-01 20:23:46 +08:00
										 |  |  |                     <input @keypress.enter="save()" id="code-editor-language" type="text" @input="updateEditorMode(language)" v-model="language"> | 
					
						
							|  |  |  |                 </div> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |                 <div class="form-group"> | 
					
						
							|  |  |  |                     <label for="code-editor-content">{{ trans('components.code_content') }}</label> | 
					
						
							|  |  |  |                     <textarea ref="editor" v-model="code"></textarea> | 
					
						
							|  |  |  |                 </div> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |                 <div class="form-group"> | 
					
						
							| 
									
										
										
										
											2019-08-25 19:40:04 +08:00
										 |  |  |                     <button type="button" class="button" @click="save()">{{ trans('components.code_save') }}</button> | 
					
						
							| 
									
										
										
										
											2017-07-01 20:23:46 +08:00
										 |  |  |                 </div> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |             </div> | 
					
						
							|  |  |  | 
 | 
					
						
							|  |  |  |         </div> | 
					
						
							|  |  |  |     </div> | 
					
						
							| 
									
										
										
										
											2019-02-06 14:06:59 +08:00
										 |  |  | </div> |