feat(业务): 我负责的页面完善2

2024-04-22 23:12:26 +08:00 · 2024-04-22 23:12:26 +08:00 · 6f1215215e
commit 6f1215215e
parent 380f10d13b
5 changed files with 208 additions and 142 deletions
--- a/components.d.ts
+++ b/components.d.ts
@ -13,7 +13,7 @@ declare module '@vue/runtime-core' {
    DropdownMenu: typeof import('./src/components/Share/DropdownMenu.vue')['default']
    Dropzone: typeof import('./src/components/Dropzone/index.vue')['default']
    EditorImage: typeof import('./src/components/Tinymce/components/EditorImage.vue')['default']
-    ElAutocomplete: typeof import('element-plus/es')['ElAutocomplete']
+    ElAlert: typeof import('element-plus/es')['ElAlert']
    ElBadge: typeof import('element-plus/es')['ElBadge']
    ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
    ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
@ -24,7 +24,6 @@ declare module '@vue/runtime-core' {
    ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
    ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
    ElDialog: typeof import('element-plus/es')['ElDialog']
-    ElDivider: typeof import('element-plus/es')['ElDivider']
    ElDropdown: typeof import('element-plus/es')['ElDropdown']
    ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
    ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
@ -36,6 +35,7 @@ declare module '@vue/runtime-core' {
    ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
    ElOption: typeof import('element-plus/es')['ElOption']
    ElPagination: typeof import('element-plus/es')['ElPagination']
+    ElPopover: typeof import('element-plus/es')['ElPopover']
    ElProgress: typeof import('element-plus/es')['ElProgress']
    ElRow: typeof import('element-plus/es')['ElRow']
    ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
--- a/src/api/project.js
+++ b/src/api/project.js
@ -160,9 +160,6 @@ export function GetChildModById(sysId, token) {
  });
 }

-//查询子模块
-
-
 //新增子模块
 export function AddChildModule(data, token) {
  return request({
--- a/src/views/personal/project/charge.vue
+++ b/src/views/personal/project/charge.vue
@ -421,7 +421,6 @@ const AddDialogVisible = ref(false);
 const DeleteDialogVisible = ref(false);
 const DeleteMulDialogVisible = ref(false);
 const EditDialogVisible = ref(false);
-const AppointDialogVisible = ref(false);
 const tableData = ref([]);
 const listLoading = ref(false);
 const token = getToken();
@ -433,10 +432,6 @@ const editId = reactive({ id:'', })
 const searchData = reactive({ name:'', });
 const deleteDatas = reactive({ ids: '' });
 const deleteData = reactive({ id: '' });
-const currentRowData = ref([]);
-let appointOptions = reactive({option:''});
-const selectedPrincipal = ref('');
-
 const AddFormData = reactive({
  name: '',
  description: '',
@ -623,6 +618,28 @@ function CancelDelete() {


 //编辑项目
+function toggleEditDialog(row) {
+  console.log("Editing row:", row);  // 打印行数据，用于调试
+  // 假设 EditFormData 是用于存储编辑表单数据的响应式对象
+  EditFormData.name = row.name;
+  EditFormData.description = row.description;
+  EditFormData.tags = row.tags.toString();
+  EditFormData.files = row.files;
+  EditFormData.cycle = row.cycle;
+  EditFormData.workLoad = row.workLoad;
+  EditFormData.status = row.status;
+  editId.id = row.id
+  EditFormData.principalId = row.principalId;
+  EditFormData.projectId = row.id;
+  EditDialogVisible.value = true;  // 显示编辑对话框
+}
+
+
+function CancelEdit() {
+  EditDialogVisible.value = false;
+}
+
+
 async function editProject() {
  console.log("edit token:", token);
  try {
@ -653,27 +670,6 @@ async function SearchProjectByName() {
  }
 }

-
-function toggleEditDialog(row) {
-  console.log("Editing row:", row);  // 打印行数据，用于调试
-  // 假设 EditFormData 是用于存储编辑表单数据的响应式对象
-  EditFormData.name = row.name;
-  EditFormData.description = row.description;
-  EditFormData.tags = row.tags.toString();
-  EditFormData.files = row.files;
-  EditFormData.cycle = row.cycle;
-  EditFormData.workLoad = row.workLoad;
-  EditFormData.status = row.status;
-  editId.id = row.id
-  EditFormData.principalId = row.principalId;
-  EditDialogVisible.value = true;  // 显示编辑对话框
-}
-
-
-function CancelEdit() {
-  EditDialogVisible.value = false;
-}
-
 function reset() {
  searchData.name = '';
  getList();
--- a/src/views/personal/project/childSystem/charge.vue
+++ b/src/views/personal/project/childSystem/charge.vue
@ -287,49 +287,36 @@
        >
          <el-input v-model="EditFormData.name"/>
        </el-form-item>
-        <el-form-item
-            label="截止时间"
-            :rules="{
-            required: true,
-            message: 'domain can not be null',
-            trigger: 'blur',
-          }"
-        >
-          <el-input v-model="EditFormData.deadLine"/>
-        </el-form-item>
-        <el-form-item
-            label="描述"
-            :rules="{
-            message: 'domain can not be null',
-            trigger: 'blur',
-          }"
-        >
-          <el-input v-model="EditFormData.description"/>
-        </el-form-item>
        <el-row>
-          <el-col :span="12">
+          <el-col :span="15">
+            <el-form-item
+                label="截止时间"
+                :rules="{
+                required: true,
+                message: 'domain can not be null',
+                trigger: 'blur',
+          }"
+            >
+              <div class="block">
+                <el-date-picker
+                    type="date"
+                    placeholder="选择"
+                    v-model="EditFormData.deadLine"
+                />
+              </div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="9">
            <el-form-item
                label="周期"
                :rules="{
-             required: true,
-            trigger: 'blur',
-          }"
+         required: true,
+        trigger: 'blur',
+      }"
            >
              <el-input v-model="EditFormData.cycle"/>
            </el-form-item>
          </el-col>
-          <el-col :span="12">
-            <el-form-item
-                label="项目负责人id"
-                :rules="{
-            required: true,
-            message: 'domain can not be null',
-            trigger: 'blur',
-          }"
-            >
-              <el-input v-model="EditFormData.principalId"/>
-            </el-form-item>
-          </el-col>
        </el-row>
        <el-form-item>
          <el-row>
@ -363,6 +350,15 @@
            </el-col>
          </el-row>
        </el-form-item>
+        <el-form-item
+            label="描述"
+            :rules="{
+            message: 'domain can not be null',
+            trigger: 'blur',
+          }"
+        >
+          <el-input type="textarea" v-model="EditFormData.description"/>
+        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
@ -590,26 +586,7 @@ function CancelDelete() {


 //编辑子系统
-async function editChildSystem() {
-  console.log("edit token:", token);
-  try {
-    const response = await EditChildSystem(editId, EditFormData, token);
-    if (response.data) {
-      tableData.value = response.data;
-    } else {
-      console.error("未获取到预期数据，响应内容:", response);
-    }
-  } finally {
-    listLoading.value = false;
-    AddDialogVisible.value = false;
-  }
-}
-
-
-
-
 function toggleEditDialog(row) {
-  console.log("Editing row:", row);  // 打印行数据，用于调试
  EditFormData.name = row.name;
  EditFormData.description = row.description;
  EditFormData.status = row.status;
@ -624,6 +601,26 @@ function CancelEdit() {
  EditDialogVisible.value = false;
 }

+async function editChildSystem() {
+  try {
+    const response = await EditChildSystem(editId, EditFormData, token);
+    if (response.code === 200) {
+      EditDialogVisible.value = false;
+      listLoading.value = true;
+      getChildSysById();
+      ElMessage({
+        message: '编辑成功',
+        type: 'success',
+      });
+    } else {
+      console.error("编辑失败，响应内容:", response);
+    }
+  } finally {
+    listLoading.value = false;
+    AddDialogVisible.value = false;
+  }
+}
+
 function reset() {
  searchData.name = '';
  getChildSysById();
@ -646,17 +643,18 @@ async function getAppointOptions() {
 function toggleAppointDialog(row) {
  currentRowData.value = row;
  AppointDialogVisible.value = true;
+  editId.id = row.id
 }

 //TODO 指定负责人id，我写死了，你替换为选择的负责人就行了
 const principalUser = reactive({
-  principalId: '6'
+  principalId: selectedPrincipal.value
 })

 async function confirmAppointment() {
  console.log("指定新负责人:", selectedPrincipal.value);
  //TODO 项目id，我也写死了。你自行修改
-  editId.id = '27'
+  //editId.id = '27'
  const response = await EditChildSystem(editId, principalUser, token);
  console.log("指定负责人Result:", response);

@ -682,8 +680,6 @@ function CancelAppoint() {
  AppointDialogVisible.value = false;
 }

-
-
 onMounted(async () => {
  await  getChildSysById();
  await getAppointOptions();
--- a/src/views/personal/project/childmodel/charge.vue
+++ b/src/views/personal/project/childmodel/charge.vue
@ -47,7 +47,7 @@
              <el-icon><Plus /></el-icon>
              新增
            </el-button>
-            <el-button type="danger">
+            <el-button type="danger" @click="toggleMulDeleteDialog()">
              <el-icon><DeleteFilled /></el-icon>
              删除
            </el-button>
@ -57,7 +57,7 @@


      <!--表格内容-->
-      <el-table :data="tableData" ref="multipleTableRef" style="width: 100%">
+      <el-table :data="tableData" ref="multipleTableRef" style="width: 100%" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55" />
        <el-table-column prop="id" label="序号">
          <template v-slot="{row}">
@ -114,7 +114,7 @@
          </template>
        </el-table-column>

-      </el-table>
+      </el-table >

      <!--表格分页-->
      <div style="display: flex; justify-content: center;margin-top: 2vh">
@ -247,7 +247,23 @@
      </template>
    </el-dialog>

-    <!--删除子模块对话框-->
+    <!--删除多个子模块对话框-->
+    <el-dialog
+        title="删除子系统"
+        width="450"
+        align-center
+        v-model="DeleteMulDialogVisible"
+    >
+      <span>确认删除该项目吗?</span>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button type="danger" @click="deleteMulChildModule()">删除</el-button>
+          <el-button @click="CancelMulDelete()">取消</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <!--删除单个子模块对话框-->
    <el-dialog
        title="删除子模块"
        width="450"
@ -257,7 +273,7 @@
      <span>确认删除该子模块吗?</span>
      <template #footer>
        <div class="dialog-footer">
-          <el-button type="danger" >删除</el-button>
+          <el-button type="danger" @click="deleteChildModule()">删除</el-button>
          <el-button @click="CancelDelete()">取消</el-button>
        </div>
      </template>
@ -279,17 +295,23 @@
        <el-form-item
            label="截止时间"
            :rules="{
-            required: true,
-            message: 'domain can not be null',
-            trigger: 'blur',
+                required: true,
+                message: 'domain can not be null',
+                trigger: 'blur',
          }"
        >
-          <el-input v-model="EditFormData.deadLine"/>
+          <div class="block">
+            <el-date-picker
+                type="date"
+                placeholder="选择"
+                v-model="EditFormData.deadLine"
+            />
+          </div>
        </el-form-item>
        <el-row>
          <el-col :span="12">
            <el-form-item
-                label="项目负责人id"
+                label="负责人id"
                :rules="{
            required: true,
            message: 'domain can not be null',
@ -299,17 +321,6 @@
              <el-input v-model="EditFormData.principalId"/>
            </el-form-item>
          </el-col>
-          <el-col :span="12">
-            <el-form-item
-                label="系统id"
-                :rules="{
-            message: 'domain can not be null',
-            trigger: 'blur',
-          }"
-            >
-              <el-input />
-            </el-form-item>
-          </el-col>
        </el-row>
        <el-form-item
            label="周期"
@ -394,7 +405,7 @@
 import { ref, onMounted, reactive } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
 import {
-  AddChildModule,
+  AddChildModule, DeleteChildModule,
  EditChildModule, GetAppointOptions,
  GetChildModById, GetProjectByName
 } from '@/api/project';
@ -405,12 +416,15 @@ import { ElButton, ElTableColumn } from 'element-plus'; // 确保导入你的 AP
 const listLoading = ref(false);
 const AddDialogVisible = ref(false);
 const DeleteDialogVisible = ref(false);
+const DeleteMulDialogVisible = ref(false);
 const EditDialogVisible = ref(false);
 const AppointDialogVisible = ref(false);
 const tableData = ref([]);
 const token = getToken();
 const editId = reactive({ id:'', })
 const searchData = reactive({ name:'', });
+const deleteDatas = reactive({ ids: '' });
+const deleteData = reactive({ id: '' });
 const currentRowData = ref([]);
 let appointOptions = reactive({option:''});
 const selectedPrincipal = ref('');
@ -475,6 +489,11 @@ async function SearchModuleByName() {
 }

 //新增子模块
+function toggleAddDialog() {
+  AddFormData.projectChildId = systemId;
+  AddDialogVisible.value = !AddDialogVisible.value;
+}
+
 async function addChildModule() {
  console.log("add token:", token);
  try {
@ -495,48 +514,85 @@ async function addChildModule() {
  }
 }

-
-//编辑子模块
-async function editChildModule() {
-  console.log("edit token:", token);
-  try {
-    const response = await EditChildModule(editId, EditFormData, token);
-    if (response.code === 200) {
-      listLoading.value = true;
-      ElMessage({
-        message: '修改成功',
-        type: 'success',
-      })
-      getChildModuleById();
-    } else {
-      console.error("未获取到预期数据，响应内容:", response);
-    }
-  } finally {
-    listLoading.value = false;
-    AddDialogVisible.value = false;
-  }
-}
-
-function toggleAddDialog() {
-  AddFormData.projectChildId = systemId;
-  AddDialogVisible.value = !AddDialogVisible.value;
-}
-
+//取消新增
 function CancelAdd() {
  AddDialogVisible.value = false;
 }

-function toggleDeleteDialog(row) {
-  console.log("Delete row:", row);  // 打印行数据，用于调试
-  DeleteDialogVisible.value = !DeleteDialogVisible.value;
+
+//删除多个子模块
+function handleSelectionChange(selection) {
+  deleteDatas.ids = selection.map(item => item.id);
 }

+function toggleMulDeleteDialog() {
+  if (deleteDatas.ids.length === 0) {
+    ElMessage({
+      message: '请选择要删除的子模块',
+      type: 'warning',
+      duration: 2500
+    });
+  } else {
+    DeleteMulDialogVisible.value = true;
+  }
+}
+
+async function deleteMulChildModule() {
+  try {
+    const res = await DeleteChildModule(deleteDatas.ids, token);
+    if (res.code === 200) {
+      ElMessage({
+        message: '删除成功',
+        type: 'success',
+      });
+      console.log("多个子模块删除成功");
+      DeleteMulDialogVisible.value = false;
+      getChildModuleById();
+    } else {
+      console.error("'多个子模块删除失败:", res);
+    }
+  } finally {
+    listLoading.value = false;
+  }
+}
+
+//取消多个删除
+function CancelMulDelete() {
+  DeleteMulDialogVisible.value = false;
+}
+
+//删除单个子模块
+function toggleDeleteDialog(row) {
+  deleteData.id = row.id;
+  DeleteDialogVisible.value = true;
+}
+
+async function deleteChildModule() {
+  try {
+    const res = await DeleteChildModule(deleteData.id, token);
+    if (res.code === 200) {
+      ElMessage({
+        message: '删除成功',
+        type: 'success',
+      });
+      console.log("单个子模块删除成功");
+      DeleteDialogVisible.value = false;
+      getChildModuleById();
+    } else {
+      console.error("单个子模块删除失败:", res);
+    }
+  } finally {
+    listLoading.value = false;
+  }
+}
+
+//取消单个删除
 function CancelDelete() {
  DeleteDialogVisible.value = false;
 }

+//编辑子模块
 function toggleEditDialog(row) {
-  console.log("Editing row:", row);  // 打印行数据，用于调试
  EditFormData.name = row.name;
  EditFormData.description = row.description;
  EditFormData.status = row.status;
@ -547,10 +603,31 @@ function toggleEditDialog(row) {
  EditDialogVisible.value = true;  // 显示编辑对话框
 }

+async function editChildModule() {
+  try {
+    const response = await EditChildModule(editId, EditFormData, token);
+    if (response.code === 200) {
+      listLoading.value = true;
+      ElMessage({
+        message: '修改成功',
+        type: 'success',
+      })
+      getChildModuleById();
+    } else {
+      console.error("修改失败，响应内容:", response);
+    }
+  } finally {
+    listLoading.value = false;
+    AddDialogVisible.value = false;
+  }
+}
+
+//取消编辑
 function CancelEdit() {
  EditDialogVisible.value = false;
 }

+
 function reset() {
  searchData.name = '';
  getChildModuleById();