<template>
  <div class="effekt-home">
    <el-card shadow="never">
      <div class="home-content">
        <p class="home-desc">这里汇总各项目常用环境地址和文档链接，方便快速进入。</p>
        <div
          v-for="project in projectLinks"
          :key="project.name"
          class="project-block">
          <div class="project-title">{{ project.name }}</div>
          <div class="project-links">
            <div v-for="item in project.links" :key="item.name" class="link-item">
              <span class="link-label">{{ item.name }}：</span>
              <el-link
                :href="item.url"
                target="_blank"
                type="primary"
                class="doc-link">
                {{ item.url }}
              </el-link>
            </div>
          </div>
        </div>
      </div>
    </el-card>
  </div>
</template>

<script>
export default {
  name: 'EffektHome',
  data() {
    return {
      projectLinks: [
        {
          name: '智慧运营',
          links: [
            { name: '测试环境地址', url: 'https://smart-management-web-st.best-envision.com/' },
            { name: 'pre环境地址', url: 'https://smart-management-web-pre.best-envision.com/' },
            { name: '需求文档', url: 'https://vcncbabzm4lv.feishu.cn/wiki/UsvzwMzV0i7Lrgk9VIhc2XgJn6e?fromScene=spaceOverview' },
            { name: '资源连接地址(包含数据库连接，jenkins配置，git仓库，日志查询，xxjob等)', url: 'https://vcncbabzm4lv.feishu.cn/wiki/ZKmown7QuiXtwTkONhUcagpQnWh' },
            { name: '领星地址', url: 'https://envision.lingxing.com/erp/home' },
            { name: '禅道地址', url: 'http://39.170.26.156:8888/my.html' },
          ]
        },
        {
          name: '独立站项目',
          links: [
            { name: '管理后台测试环境地址', url: 'https://joyhub-website-manager-web-test.best-envision.com/' },
            { name: 'web的C端测试环境地址', url: 'https://joyhub-website-frontend-test.best-envision.com/' },
            { name: '接口开发地址', url: 'https://joyhub-website-manager-api-test.best-envision.com/doc.html#/home' },
            { name: '资源连接地址', url: 'https://vcncbabzm4lv.feishu.cn/wiki/PXTmw6BBviMjNDkKCxCcewD7nMd' },
            { name: '禅道地址', url: 'http://192.168.16.4:8956/index.php?m=my&f=index' },
          ]
        }
      ]
    }
  }
}
</script>

<style scoped>
.effekt-home {
  padding: 20px;
}

.home-content {
  display: flex;
  flex-direction: column;
}

.home-desc {
  margin: 0 0 16px;
  color: #606266;
}

.project-block {
  padding: 16px 0;
  border-bottom: 1px solid #ebeef5;
}

.project-block:last-child {
  border-bottom: none;
}

.project-title {
  margin-bottom: 12px;
  font-size: 16px;
  font-weight: 600;
  color: #303133;
}

.link-item {
  display: flex;
  align-items: flex-start;
  margin-bottom: 10px;
  line-height: 22px;
}

.link-label {
  min-width: 140px;
  color: #606266;
}

.doc-link {
  word-break: break-all;
}
</style>
