husq
2023-09-05 be84102dc381d0c1925e477f15a431d6c327c0d6
src/pages/page-web/projects/project_list/list_page/components/ProjectList.vue
@@ -2,14 +2,15 @@
 * @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">
@@ -52,6 +53,7 @@
                </div>
            </div>
        </div>
    </a-spin>
    </div>
</template>
@@ -63,14 +65,23 @@
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({
@@ -112,7 +123,6 @@
}
const goEdit = (item:any) => {
  console.log(item)
  router.push({
    name: ERouterName.EDIT_PROJECT,
    query: { id: item.id }
@@ -123,6 +133,14 @@
<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%;