删除弹窗

src/js/request.js

@@ -673,6 +673,22 @@ const projectWorkAdd = (data, token) => {
     })
 }
 
+// data(id)
+const projectDelete = (id, token) => {
+    return axios({
+        url: api + "/project/delete" ,
+        method: "delete",
+        params: {
+            id: id
+        },
+        headers: {
+            'Authorization': 'Bearer ' + token,
+            'Content-Type': 'application/json;charset=utf-8',
+            'Timestamp': getCurrentTimestamp()
+        }
+    })
+}
+
 /**
  * 根据项目id获取子系统的所有信息
  * @param projectId
@@ -816,6 +832,8 @@ export default {
     projectWorkAdd,
     getTagsProjectList,
     projectWorkGet,
+    projectDelete,
+
 
     moduleGetByProjectId,
     moduleGetBySysId,

src/views/WorkLoadPage/I_Responsible.vue

@@ -37,7 +37,8 @@
     <a-float-button-group v-show="routePath === '/WorkLoad/I_Responsible'" trigger="hover" type="primary" :style="{ right: '94px' }">
 <!--        菜单-->
         <template #icon>
-            <CommentOutlined />
+<!--            <CommentOutlined />-->
+            <EditOutlined />
         </template>
 <!--        添加-->
         <a-float-button  @click="addModalOpen = true">
@@ -46,7 +47,7 @@
             </template>
         </a-float-button>
 <!--        删除-->
-        <a-float-button>
+        <a-float-button @click="editModalOpen = true">
             <template #icon>
                 <MinusOutlined />
             </template>
@@ -68,6 +69,41 @@
 
 <!--        </div>-->
 <!--        &lt;!&ndash; <a-button @click="setupProj">999</a-button> &ndash;&gt;-->
+
+
+    <a-modal v-model:open="editModalOpen" title="删除项目" @ok="DeleteProjects" okType="danger" cancelText="取消" ok-text="删除">
+        <a-table bordered :data-source="projList" :columns="columns"  :pagination="pagination"  :row-selection="rowSelection"  :rowKey="record => record.id" >
+            <template #bodyCell="{ column, text, record }">
+                <template v-if="column.dataIndex === 'name'">
+                    <div class="editable-cell">
+                        <div v-if="editableData[record.key]" class="editable-cell-input-wrapper">
+                        </div>
+<!--                        显示name列内容-->
+                        <div v-else class="editable-cell-text-wrapper">
+                            {{ text || ' ' }}
+                        </div>
+                    </div>
+                </template>
+                <template v-else-if="column.dataIndex === 'operation'">
+                    <a-popconfirm
+                            title="Sure to delete?"
+                            @confirm="DeleteProject(record.key)"
+                            class="text-red-500"
+                            okType="danger"
+                            cancelText="Cancel"
+                            ok-text="Delete"
+
+                    >
+                        <a>删除</a>
+                    </a-popconfirm>
+                </template>
+            </template>
+        </a-table>
+
+    </a-modal>
+
+
+<!--新增项目-->
         <a-modal v-model:open="addModalOpen" title="添加项目" @ok="">
           <a-form
             :label-col="labelCol"
@@ -125,14 +161,70 @@
 <!--    </a-tooltip>-->
 </template>
 <script setup>
-import {onMounted, reactive, ref, watch} from 'vue';
-import {CommentOutlined, MinusOutlined, PlusOutlined} from '@ant-design/icons-vue';
+import {computed, onMounted, reactive, ref, watch} from 'vue';
+import {EditOutlined, MinusOutlined, PlusOutlined} from '@ant-design/icons-vue';
 import {useRoute, useRouter} from "vue-router";
-
 import request from '@/js/request';
 import ProjectCard from "@/views/ProjectPage/MainMessage/ProjectCard.vue";
 import {message, Modal} from "ant-design-vue";
 
+
+// 编辑表格
+const columns = [
+    {
+        title: '项目名称',
+        dataIndex: 'name',
+
+    },
+    {
+        title: '操作',
+        dataIndex: 'operation',
+        width:80,
+    },
+];
+
+
+// // // 翻页
+const pagination = computed(() => ({
+    total: projList.value[0].length,
+    pageSize: 2,
+}));
+const editableData = reactive({});
+
+const Id = reactive({
+    id: -1
+})
+// 删除项目
+function DeleteProject ( record) {
+    console.log('单独删除成功9999999999999999999999999')
+    Id.id = record.key
+    console.log(Id.id)
+    request.projectDelete(Id,token).then((res) => {
+        console.log(res)
+        message.success("删除成功")
+    })
+    // projList.value = projList.value.filter(item => item.key !== key);
+}
+function DeleteProjects(){
+    console.log('全部删除成功')
+}
+// 复选
+const rowSelection = ref({
+    checkStrictly: false,
+    // onChange: (selectedRowKeys, selectedRows) => {
+    //     // console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
+    // }
+});
+
+
+
+
+
+
+
+
+
+
 const router=useRouter()
 const route = useRoute()
 
@@ -182,7 +274,7 @@ const checkboxOptions = [
   { label: '已结束', value:  1},
 ];
 
-
+const editModalOpen = ref(false)
 const addModalOpen=ref(false)
  // 得到用户信息
  const uinfo=JSON.parse(window.localStorage.getItem('uinfo'))