| | |
| | | <template> |
| | | <List :class="prefixCls"> |
| | | <a-row :gutter="16"> |
| | | <template v-for="item in list" :key="item.title"> |
| | | <a-col :span="6"> |
| | | <Row :gutter="16"> |
| | | <template v-for="item in projectList" :key="item.title"> |
| | | <Col :span="6"> |
| | | <ListItem> |
| | | <Card :hoverable="true" :class="`${prefixCls}__card`"> |
| | | <img :src="demoImg" /> |
| | |
| | | </div> |
| | | </Card> |
| | | </ListItem> |
| | | </a-col> |
| | | </Col> |
| | | </template> |
| | | </a-row> |
| | | </Row> |
| | | </List> |
| | | </template> |
| | | <script lang="ts"> |
| | | import { defineComponent } from 'vue'; |
| | | <script lang="ts" setup> |
| | | import { List, Card, Row, Col } from 'ant-design-vue'; |
| | | import demoImg from '/@/assets/images/demo.png'; |
| | | import demoImg from '@/assets/images/demo.png'; |
| | | import { projectList } from './data'; |
| | | |
| | | export default defineComponent({ |
| | | components: { |
| | | List, |
| | | ListItem: List.Item, |
| | | Card, |
| | | [Row.name]: Row, |
| | | [Col.name]: Col, |
| | | }, |
| | | setup() { |
| | | return { |
| | | prefixCls: 'account-center-project', |
| | | list: projectList, |
| | | demoImg, |
| | | }; |
| | | }, |
| | | }); |
| | | const ListItem = List.Item; |
| | | |
| | | const prefixCls = 'account-center-project'; |
| | | </script> |
| | | <style lang="less"> |
| | | .account-center-project { |