<script setup>
import Overview from './index.vue'
</script>

# 概况 {#Overview}

## 示例

<Overview />

这里是完整代码

<div class="options-api" style="font-size:14px;">

```vue
<script setup>
import { KsOverview } from '@ksconsole/components'
import { ref } from 'vue'
import IconApp from './svg/IconApp.svg';
import IconCloudEnv from './svg/IconCloudEnv.svg';
import IconProject from './svg/IconProject.svg';
import IconUser from './svg/IconUser.svg';
import IconError from './svg/IconError.svg';

const overviewRes = ref([
    	{
		icon: IconCloudEnv,
		title: '云环境',
		count: 3
	},
	{
		icon: IconProject,
		title: '项目',
		count: 24
	},
	{
		icon: IconApp,
		title: '应用',
		count: 2
	},
	{
		icon: IconUser,
		title: '用户',
		count: 16,
		errorCount: 2,
		errorIcon: IconError
	}
])

</script>

<template>
  <div>
     <KsOverview :data="overviewRes" />
  </div>
</template>

```

</div>
