index.vue 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. <script setup lang="ts">
  2. import basic from "./basic.vue";
  3. import menuGroup from "./menuGroup.vue";
  4. import menuDynamic from "./menuDynamic.vue";
  5. import "v-contextmenu/dist/themes/default.css";
  6. defineOptions({
  7. name: "ContextMenu"
  8. });
  9. </script>
  10. <template>
  11. <el-card shadow="never">
  12. <template #header>
  13. <div class="card-header">
  14. <p class="font-medium">右键菜单</p>
  15. <el-link
  16. class="mt-2"
  17. href="https://github.com/pure-admin/vue-pure-admin/blob/main/src/views/components/contextmenu"
  18. target="_blank"
  19. >
  20. 代码位置 src/views/components/contextmenu
  21. </el-link>
  22. </div>
  23. </template>
  24. <el-row :gutter="24">
  25. <el-col :xs="24" :sm="10" :md="10" :lg="8" :xl="10">
  26. <!-- 基础用法 -->
  27. <basic />
  28. </el-col>
  29. <el-col :xs="24" :sm="10" :md="10" :lg="8" :xl="10">
  30. <!-- 按钮组 -->
  31. <menuGroup />
  32. </el-col>
  33. <el-col :xs="24" :sm="10" :md="10" :lg="8" :xl="10">
  34. <!-- 动态菜单 -->
  35. <menuDynamic />
  36. </el-col>
  37. </el-row>
  38. </el-card>
  39. </template>