SideMenu.vue 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <template>
  2. <a-layout-sider
  3. :class="['sider', isDesktop() ? null : 'shadow', theme, fixSiderbar ? 'ant-fixed-sidemenu' : null ]"
  4. width="256px"
  5. :collapsible="collapsible"
  6. v-model="collapsed"
  7. :trigger="null">
  8. <logo />
  9. <s-menu
  10. :collapsed="collapsed"
  11. :menu="menus"
  12. :theme="theme"
  13. :mode="mode"
  14. @select="onSelect"
  15. style="padding: 16px 0px;"></s-menu>
  16. </a-layout-sider>
  17. </template>
  18. <script>
  19. import Logo from '@/components/tools/Logo'
  20. import SMenu from './index'
  21. import { mixin, mixinDevice } from '@/utils/mixin'
  22. export default {
  23. name: 'SideMenu',
  24. components: { Logo, SMenu },
  25. mixins: [mixin, mixinDevice],
  26. props: {
  27. mode: {
  28. type: String,
  29. required: false,
  30. default: 'inline'
  31. },
  32. theme: {
  33. type: String,
  34. required: false,
  35. default: 'dark'
  36. },
  37. collapsible: {
  38. type: Boolean,
  39. required: false,
  40. default: false
  41. },
  42. collapsed: {
  43. type: Boolean,
  44. required: false,
  45. default: false
  46. },
  47. menus: {
  48. type: Array,
  49. required: true
  50. }
  51. },
  52. methods: {
  53. onSelect (obj) {
  54. this.$emit('menuSelect', obj)
  55. }
  56. }
  57. }
  58. </script>