Add Calendar to Dashboard (#227)
Hi!, The calendar was supported using element-ui and vue.jspull/3759/head
							parent
							
								
									8425f1c965
								
							
						
					
					
						commit
						3af4d67678
					
				|  | @ -55,7 +55,7 @@ | |||
|     "driver.js": "0.9.5", | ||||
|     "dropzone": "5.5.1", | ||||
|     "echarts": "4.2.1", | ||||
|     "element-ui": "2.7.0", | ||||
|     "element-ui": "2.13.0", | ||||
|     "file-saver": "2.0.1", | ||||
|     "fuse.js": "3.4.4", | ||||
|     "js-cookie": "2.2.0", | ||||
|  |  | |||
|  | @ -0,0 +1,39 @@ | |||
| <template> | ||||
|   <el-collapse v-model="activeCalendar" accordion> | ||||
|     <el-collapse-item name="calendar"> | ||||
|       <template slot="title"> | ||||
|         <i class="el-icon-date" style="margin-right: 4px;margin-left: 10px;" /> | ||||
|         {{ $t('route.calendar') }} | ||||
|       </template> | ||||
|       <el-calendar> | ||||
|         <!-- Use 2.5 slot syntax. If you use Vue 2.6, please use new slot syntax--> | ||||
|         <template | ||||
|           slot="dateCell" | ||||
|           slot-scope="{date, data}" | ||||
|         > | ||||
|           <p :class="data.isSelected ? 'is-selected' : ''"> | ||||
|             {{ data.day.split('-').slice(2).join('-') }} {{ data.isSelected ? '✔️' : '' }} | ||||
|           </p> | ||||
|         </template> | ||||
|       </el-calendar> | ||||
|     </el-collapse-item> | ||||
|   </el-collapse> | ||||
| </template> | ||||
| 
 | ||||
| <script> | ||||
| export default { | ||||
|   name: 'Calendar', | ||||
|   data() { | ||||
|     return { | ||||
|       activeCalendar: 'calendar', | ||||
|       value: new Date() | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </script> | ||||
| 
 | ||||
| <style> | ||||
|   .is-selected { | ||||
|     color: #1989FA; | ||||
|   } | ||||
| </style> | ||||
|  | @ -25,7 +25,7 @@ export default { | |||
|     // load the component that is indicated in the attributes of received property | ||||
|     renderDashboard() { | ||||
|       // TODO: Add support to this list of currently unsupported dashboards | ||||
|       const unsupportedDashboards = ['activities', 'views', 'calendar', 'performance'] | ||||
|       const unsupportedDashboards = ['activities', 'views', 'performance'] | ||||
|       if (unsupportedDashboards.includes(this.metadata.fileName)) { | ||||
|         return | ||||
|       } | ||||
|  |  | |||
|  | @ -1,6 +1,7 @@ | |||
| export default { | ||||
|   route: { | ||||
|     dashboard: 'Dashboard', | ||||
|     calendar: 'Calendar', | ||||
|     documentation: 'Documentation', | ||||
|     guide: 'Guide', | ||||
|     forgotPassword: 'Forgot Password?', | ||||
|  |  | |||
|  | @ -2,6 +2,7 @@ export default { | |||
|   route: { | ||||
|     dashboard: 'Panel de control', | ||||
|     documentation: 'Documentación', | ||||
|     calendar: 'Calendario', | ||||
|     forgotPassword: '¿Olvidó su Contraseña?', | ||||
|     userEnrollment: 'Registrarse', | ||||
|     guide: 'Guía', | ||||
|  |  | |||
		Loading…
	
		Reference in New Issue
	
	 elsiosanchez
						elsiosanchez