View c-close.js
Vue.component("close-ticket-count", { | |
props: ["hdCloseCount"], | |
template: ` | |
<v-card max-width="344" class="mx-auto" color="info"> | |
<v-card-title><span class="white--text">Closed</span></v-card-title> | |
<v-card-text><span class="white--text">{{hdCloseCount}}</span></v-card-text> | |
</v-card> | |
` | |
}); |
View barChart.js
Vue.component('my-bar-chart', { | |
extends: VueChartJs.Bar, | |
props: ['barData', 'chartOptions'], | |
mounted: function () { | |
this.renderChart(this.barData, this.chartOptions); | |
} | |
}) |
View toolbar.html
<!-- updated code to reflect YouTube Video to add gridsystem layout ---> | |
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" /> | |
<link rel="stylesheet" type="text/css" | |
href="https://cdn.jsdelivr.net/npm/@mdi/font@3.x/css/materialdesignicons.min.css" /> | |
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Material+Icons" /> | |
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/vuetify@2.0.10/dist/vuetify.min.css" /> | |
<link rel="stylesheet" type="text/css" | |
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css" /> | |
<script src="https://cdn.jsdelivr.net/npm/babel-regenerator-runtime@6.5.0/runtime.js"></script> |
View toolbar.html
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900" /> | |
<link rel="stylesheet" type="text/css" | |
href="https://cdn.jsdelivr.net/npm/@mdi/font@3.x/css/materialdesignicons.min.css" /> | |
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Material+Icons" /> | |
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/vuetify@2.0.10/dist/vuetify.min.css" /> | |
<link rel="stylesheet" type="text/css" | |
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.9.0/css/all.min.css" /> | |
<script src="https://cdn.jsdelivr.net/npm/babel-regenerator-runtime@6.5.0/runtime.js"></script> | |
<script src="https://cdn.jsdelivr.net/npm/babel-polyfill/dist/polyfill.min.js"></script> |
View simpleform.html
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.10/vue.min.js"></script> | |
<!-- BEGIN jquery-ui library --> | |
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> | |
<link rel="stylesheet" href="/resources/demos/style.css"> | |
<script src="https://code.jquery.com/jquery-1.12.4.js"></script> | |
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> | |
<!-- END jquery-ui library --> |
View helpdesk.html
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> | |
<!-- Special version of Bootstrap that only affects content wrapped in .bootstrap-iso --> | |
<link rel="stylesheet" href="https://formden.com/static/cdn/bootstrap-iso.css" /> | |
<!-- Inline CSS based on choices in "Settings" tab --> | |
<style>.bootstrap-iso .formden_header h2, .bootstrap-iso .formden_header p, .bootstrap-iso form{font-family: Arial, Helvetica, sans-serif; color: #54787c}.bootstrap-iso form button, .bootstrap-iso form button:hover{color: #ffffff !important;}.bootstrap-iso .form-control:focus { border-color: #e9666c; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(233, 102, 108, 0.6); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(233, 102, 108, 0.6);} .asteriskField{color: red;}.bootstrap-iso form .input-group-addon {color:#555555; background-color: #f7efef; border-radius: 4px; pad |
View datatable.html
<head> | |
<script src="https://cdn.jsdelivr.net/npm/es6-promise@4/dist/es6-promise.auto.js"></script> | |
<script src="https://cdn.jsdelivr.net/npm/babel-polyfill/dist/polyfill.min.js"></script> | |
<script src="https://unpkg.com/axios/dist/axios.min.js"></script> | |
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> | |
<script src="https://cdn.jsdelivr.net/npm/vuetify@1.5.14/dist/vuetify.min.js"></script> | |
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900|Material+Icons" /> | |
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vuetify@1.5.14/dist/vuetify.min.css" /> |
View expansion.html
<head> | |
<script src="https://cdn.jsdelivr.net/npm/es6-promise@4/dist/es6-promise.auto.js"></script> | |
<script src="https://unpkg.com/axios/dist/axios.min.js"></script> | |
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> | |
<script src="https://cdn.jsdelivr.net/npm/vuetify@1.5.14/dist/vuetify.min.js"></script> | |
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900|Material+Icons" /> | |
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vuetify@1.5.14/dist/vuetify.min.css" /> | |
</head> |
View .block
license: mit |
View .block
license: mit |
NewerOlder