OneAuth/oaweb/pages/docs.vue

<!--
 * docs.vue
 * Copyright (C) 2024 veypi <i@veypi.com>
 * 2024-06-06 17:29
 * Distributed under terms of the MIT license.
 -->
<template>
  <div>
    <h1 class="page-h1">文档中心</h1>
    <div class="mx-8 mt-10">
      <template v-for="(doc, i) in Docs" :key="i">
        <div class="mb-10">
          <div class="text-xl flex items-center mb-4">
            <OneIcon class="mx-2" :name="doc.icon"></OneIcon>
            <span>{{ doc.name }}</span>
          </div>
          <div class="flex gap-8 ml-10">
            <template v-for="item in doc.items" :key="item.name">
              <div class="doc-item border-2 rounded-md px-4 py-2" clickable outline
                @click="$router.push('/doc_pub/' + item.url)" icon="bookmark">
                <span>{{ item.name }}</span>
              </div>
            </template>
          </div>
          <UDivider class="mt-6" label="OR" size="sm" />

        </div>
      </template>
    </div>
  </div>
</template>

<script lang="ts" setup>
import type { models } from '#imports';
const Docs = ref<models.DocGroup[]>([
  {
    name: '用户',
    icon: 'team',
    items: [
      { name: '用户注册授权过程', url: '' },
      { name: '用户角色与权限', url: '' },
      { name: 'api文档', url: '' }
    ]
  },
  {
    name: "应用",
    icon: 'apps',
    items: [
      { name: '应用创建及基本设置', url: '' },
      { name: '应用权限设置', url: '' },
      { name: '应用对接oa流程', url: '' },
    ],
  },
  {
    name: "系统使用",
    icon: "setting",
    items: [
      { name: "编辑器使用及语法", url: 'markdown.md' }
    ]
  }
])
</script>

<style scoped>
.doc-item {}
</style>