index_20240521133647.vue 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859
  1. <template>
  2. <div class="image-container">
  3. <div class="image-wrapper">
  4. <img src="@/assets/images/yc.png" alt="Image 1" />
  5. <button class="btn" @click="shipHandler">游船系统</button>
  6. </div>
  7. <div class="image-wrapper">
  8. <img src="@/assets/images/pw.png" alt="Image 2" />
  9. <button class="btn" @click="ticketHandler">票务系统</button>
  10. </div>
  11. </div>
  12. </template>
  13. <script>
  14. export default {
  15. name: "Index",
  16. data() {
  17. return {};
  18. },
  19. methods: {
  20. shipHandler() {
  21. window.open("http://localhost/songhuaIndex1");
  22. },
  23. ticketHandler(){
  24. window.open("http://dsj.1230t.com/");
  25. },
  26. }
  27. };
  28. </script>
  29. <style scoped lang="scss">
  30. .image-container {
  31. display: flex;
  32. justify-content: space-between;
  33. background: url('../assets/images/bg.jpg') 0 0 no-repeat;
  34. background-size:100% 100% ;
  35. align-items: center;
  36. height: 700px;
  37. }
  38. .image-wrapper {
  39. display: flex;
  40. flex-direction: column;
  41. align-items: center;
  42. margin: 0 150px;
  43. }
  44. .scroll-container {
  45. display: none;
  46. }
  47. .image-wrapper img {
  48. width: 500px;
  49. height: auto;
  50. }
  51. .btn {
  52. margin-top: 10px;
  53. }
  54. </style>