seecoder-devcloud-frontend/src/components/ProjectCard.vue

<template>
  <ElCard class="project-card" shadow="hover">
    <template #header>
      <span>{{name}}</span>
    </template>
    <div>描述：{{description}}</div>
    <div>链接：{{gitRemoteUrl}}</div>
  </ElCard>
</template>

<script lang="ts">
import { defineComponent } from 'vue';

export default defineComponent({
  props: {
    id: Number,
    name: String,
    description: String,
    gitRemoteUrl: String,
    groupId: Number,
  },
});
</script>

<style lang="scss" scoped>
.project-card {
  width: calc(25% - 24px);
  margin: 12px;
}
</style>