Files
lucia-frontend/src/main.ts
2024-07-09 14:53:21 +08:00

112 lines
3.6 KiB
TypeScript

import { createApp, markRaw } from "vue";
import App from "./App.vue";
import router from "./router";
import pinia from '@/stores/main.js';
import axios from 'axios';
import VueAxios from 'vue-axios';
import moment from 'moment';
import mitt from 'mitt';
import ToastPlugin from 'vue-toast-notification';
import cytoscape from 'cytoscape';
import dagre from 'cytoscape-dagre';
import popper from 'cytoscape-popper';
import draggable from 'vuedraggable';
import VueSweetalert2 from 'vue-sweetalert2';
// import CSS
import "./assets/main.css";
import 'vue-toast-notification/dist/theme-sugar.css';
import 'sweetalert2/dist/sweetalert2.min.css';
// import PrimeVue
import PrimeVue from 'primevue/config';
import 'primevue/resources/themes/saga-blue/theme.css'; //theme
// import 'primevue/resources/primevue.min.css'; //core css 官網更新 3.40 後移除基礎樣式
import 'primeicons/primeicons.css'; //icons
import Sidebar from 'primevue/sidebar';
import Button from 'primevue/button';
import Dropdown from 'primevue/dropdown';
import Tag from 'primevue/tag';
import ProgressBar from 'primevue/progressbar';
import TabView from 'primevue/tabview';
import TabPanel from 'primevue/tabpanel';
import DataTable from 'primevue/datatable';
import Column from 'primevue/column';
import ColumnGroup from 'primevue/columngroup'; // optional
import Row from 'primevue/row'; // optional
import RadioButton from 'primevue/radiobutton';
import PickList from 'primevue/picklist';
import Timeline from 'primevue/timeline';
import InputSwitch from 'primevue/inputswitch';
import InputNumber from 'primevue/inputnumber';
import InputText from 'primevue/inputtext';
import Chart from 'primevue/chart';
import Slider from 'primevue/slider';
import Calendar from 'primevue/calendar';
import Tooltip from 'primevue/tooltip';
import Checkbox from 'primevue/checkbox';
import Dialog from 'primevue/dialog';
import ContextMenu from 'primevue/contextmenu';
const emitter = mitt();
const app = createApp(App);
// 將 Axios 實例添加到 Vue 的應用實例中
app.config.globalProperties.$http = axios;
app.$http = axios; // 將 $http 添加到 Vue 實例中
// Pinia Set
pinia.use(({ store }) => {
store.$router = markRaw(router);
store.$axios = markRaw(axios);
store.$toast = markRaw(ToastPlugin);
store.$http = app.$http;
});
// can use `this.$moment` in Vue.js
app.config.globalProperties.$moment = moment;
app.config.globalProperties.$emitter = emitter;
app.config.globalProperties.$cytoscape = cytoscape;
// Cytoscape.js's style
cytoscape.use( dagre );
cytoscape.use( popper );
app.use(pinia);
app.use(router);
app.use(VueAxios, axios);
app.use(VueSweetalert2);
app.use(ToastPlugin, { // use `this.$toast` in Vue.js
position: 'bottom',
duration: 5000,
});
app.use(PrimeVue);
app.component('Sidebar', Sidebar);
app.component('Button', Button);
app.component('Dropdown', Dropdown);
app.component('Tag', Tag);
app.component('ProgressBar', ProgressBar);
app.component('TabView', TabView);
app.component('TabPanel', TabPanel);
app.component('DataTable', DataTable);
app.component('Column', Column);
app.component('ColumnGroup', ColumnGroup);
app.component('Row', Row);
app.component('RadioButton', RadioButton);
app.component('PickList', PickList);
app.component('Timeline', Timeline);
app.component('InputSwitch', InputSwitch);
app.component('InputNumber', InputNumber);
app.component('InputText', InputText);
app.component('Chart', Chart);
app.component('Slider', Slider);
app.component('Calendar', Calendar);
app.component('Checkbox', Checkbox);
app.component('Dialog', Dialog);
app.component('ContextMenu', ContextMenu);
app.component('Draggable', draggable); // 拖曳
app.directive('tooltip', Tooltip);
app.mount("#app");