| | |
| | | * @Author: 胡思旗 931347610@qq.com |
| | | * @Date: 2023-08-28 15:23:47 |
| | | * @LastEditors: husq 931347610@qq.com |
| | | * @LastEditTime: 2023-09-01 17:29:16 |
| | | * @LastEditTime: 2023-09-05 10:17:17 |
| | | * @FilePath: \Cloud-API-Demo-Web\src\pages\page-web\projects\project_list\list_page\components\ProjectList.vue |
| | | * @Description:项目列表组件 |
| | | * |
| | | * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved. |
| | | --> |
| | | <template> |
| | | <div class="project-box"> |
| | | <div class="project-box flex-common"> |
| | | <a-spin :spinning="model" style="width: 100%;"> |
| | | <div class="project-card" v-for="item in cardList" :key="item.id"> |
| | | <div class="project-left"> |
| | | <div class="head mb10 flex-display flex-align-center flex-justify-between"> |
| | |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </a-spin> |
| | | </div> |
| | | </template> |
| | | |
| | |
| | | import { del, edit } from '/@/api/project-page' |
| | | import { Modal, message } from 'ant-design-vue' |
| | | const router = useRouter() |
| | | const emit = defineEmits(['refreshList']) |
| | | const emit = defineEmits(['refreshList', 'update:modelValue']) |
| | | const props = defineProps({ |
| | | cardList: { |
| | | type: Array as () => projectCard[], |
| | | required: true, |
| | | }, |
| | | modelValue: [String, Number, Boolean] |
| | | }) |
| | | |
| | | const model = computed({ |
| | | get () { |
| | | return props.modelValue |
| | | }, |
| | | set (val) { |
| | | emit('update:modelValue', val) |
| | | } |
| | | }) |
| | | const spinning = ref<boolean>(true) |
| | | // 删除方法 |
| | | const deleteItem = (item:projectCard) => { |
| | | Modal.confirm({ |
| | |
| | | } |
| | | |
| | | const goEdit = (item:any) => { |
| | | console.log(item) |
| | | router.push({ |
| | | name: ERouterName.EDIT_PROJECT, |
| | | query: { id: item.id } |
| | |
| | | |
| | | <style scoped lang="scss"> |
| | | .project-box { |
| | | width: 100%; |
| | | height: 100%; |
| | | |
| | | :deep(.ant-spin-nested-loading) { |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | |
| | | .project-card { |
| | | cursor: pointer; |
| | | width: 100%; |