<template>
    <AvatarList :list="list" />
</template>
<script>
import {AvatarList, Card, Space} from "view-ui-plus";

export default {
    components: {Space, Card, AvatarList},
    data () {
        return {
            list: [
                {
                    src: 'https://dev-file.iviewui.com/BbnuuEiM0QXNPHVCvb3E2AFrawIjCkqW/avatar',
                    tip: '史蒂夫·乔布斯'
                },
                {
                    src: 'https://dev-file.iviewui.com/zhj85zgAfEjChCNIKT1LQENUIOyOYCaX/avatar',
                    tip: '斯蒂夫·沃兹尼亚克'
                },
                {
                    src: 'https://dev-file.iviewui.com/TkH54UozsINlex15TAMI00GElsfsKSiC/avatar',
                    tip: '乔纳森·伊夫'
                }
            ]
        }
    }
}
</script>

<Col span="11" offset="2">
<Card :bordered="false" style="width: 300px;position: relative;left:-100px;top:15px; background-color: #edf4ff;">
    <template #title>小程序设计</template>
    <p>进度</p>
    <Space direction="vertical" type="flex">
        <Progress :percent="60" status="active" stroke-color="orange"/>
    </Space>
    <AvatarList :list="list" />
</Card>
</Col>