删除任务

src/api/all/assignment-management.ts

@@ -1,6 +1,24 @@
 import Http from '@/api';
 
-// 获取用户自定义列
+// 任务管理-分页
 export const getTaskSchedules = (params = {}) => {
   return Http.get('/v1/media-accounts/task-schedules', params);
 };
+
+// 任务管理-删除
+export const delTaskSchedules = (id: string) => {
+  console.log('id', id);
+  return Http.delete(`/v1/task-schedules/${id}`);
+};
+
+// 任务管理-修改
+export const editTaskSchedules = (id: string) => {
+  console.log('id', id);
+  return Http.put(`/v1/task-schedules/${id}`);
+};
+
+// 任务管理-详情
+export const getTaskSchedulesDetail = (id: string) => {
+  console.log('id', id);
+  return Http.get(`/v1/task-schedules/${id}`);
+};

src/views/property-marketing/assignment-management/components/TaskDetail.vue

@@ -0,0 +1,82 @@
+<template>
+  <div class="flex flex-col items-start cell-detail">
+    <div class="flex items-center">
+      <img
+        :src="getPlatformIcon(record.platform)"
+        style="border-radius: 8px; width: 16px; height: 16px; margin-right: 8px; font-size: 14px"
+      />
+      {{ record.name || '-' }}
+    </div>
+    <div class="size-12px color-#939499 mt-2px">
+      {{ timestampToTime1(task.execution_time) }}
+    </div>
+    <div class="size-14px color-#211F24 mt-12px">{{ task.name || '未命名' }}</div>
+    <div class="flex items-center mt-12px">
+      <div class="opt-btn" @click.stop="handleEditTime">修改发布时间</div>
+      <div class="opt-btn" @click.stop="handleDelete" style="margin-right: 0px">删除</div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { defineProps, defineEmits } from 'vue';
+
+const props = defineProps({
+  task: {
+    type: Object,
+    required: true
+  },
+  record: {
+    type: Object,
+    required: true
+  },
+  getPlatformIcon: {
+    type: Function,
+    required: true
+  }
+});
+
+const emit = defineEmits(['editTime', 'delete']);
+
+// 时间戳转时间格式 (MM月DD HH:MM)
+const timestampToTime1 = (timestamp: number): string => {
+  const date = new Date(timestamp * 1000); // 假设时间戳是秒级
+  // 获取月份和日期（注意：月份从0开始，需要+1）
+  const month = (date.getMonth() + 1).toString().padStart(2, '0');
+  const day = date.getDate().toString().padStart(2, '0');
+  const hours = date.getHours().toString().padStart(2, '0');
+  const minutes = date.getMinutes().toString().padStart(2, '0');
+
+  return `${month}月${day} ${hours}:${minutes}`;
+};
+
+const handleEditTime = () => {
+  emit('editTime', props.task);
+};
+
+const handleDelete = () => {
+  emit('delete', props.task);
+};
+</script>
+
+<style scoped>
+.cell-detail {
+  background-color: #fff;
+  border: 1px solid #d9d9d9;
+  border-radius: 4px;
+  box-shadow: #00000010 0px 2px 8px;
+  padding: 8px 16px;
+  margin-top: 8px;
+}
+
+.opt-btn {
+  font-size: 12px;
+  width: 138px;
+  height: 28px;
+  background-color: #f2f3f5;
+  text-align: center;
+  line-height: 28px;
+  border-radius: 4px;
+  margin-right: 12px;
+}
+</style>

src/views/property-marketing/assignment-management/index.vue

@@ -135,12 +135,7 @@
               </div>
               <div class="flex items-center">
                 <div class="w-70px">账号名称</div>
-                <a-input
+                <a-input v-model="query.name" class="!w-200px" placeholder="输入账号名称" @change="handleSearch" />
-                  v-model="query.name"
-                  class="!w-200px"
-                  placeholder="输入账号名称"
-                  @change="handleSearch"
-                />
               </div>
             </div>
           </template>
@@ -187,25 +182,14 @@
                     </div>
                   </div>
                   <template #content>
-                    <div class="flex flex-col items-start cell-detail">
+                    <TaskDetail
-                      <div class="flex items-center">
+                      :task="record[column.dataIndex][0]"
-                        <img
+                      :record="record"
-                          :src="getPlatformIcon(record.platform)"
+                      :get-platform-icon="getPlatformIcon"
-                          style="border-radius: 8px; width: 16px; height: 16px; margin-right: 8px; font-size: 14px"
+                      @edit-time="handleModifyTime"
-                        />
+                      @delete="handleDelete"
-                        {{ record.name || '-' }}
+                      @delete-task="handleDelete"
-                      </div>
+                    />
-                      <div class="size-12px color-#939499 mt-2px">
-                        {{ timestampToTime1(record[column.dataIndex][0].execution_time) }}
-                      </div>
-                      <div class="size-14px color-#211F24 mt-12px">
-                        {{ record[column.dataIndex][0].name || '未命名' }}
-                      </div>
-                      <div class="flex items-center mt-12px">
-                        <div class="opt-btn">修改发布时间</div>
-                        <div class="opt-btn" style="margin-right: 0px">删除</div>
-                      </div>
-                    </div>
                   </template>
                 </a-trigger>
               </div>
@@ -229,29 +213,14 @@
                           </div>
                         </div>
                         <template #content>
-                          <div class="flex flex-col items-start cell-detail">
+                          <TaskDetail
-                            <div class="flex items-center">
+                            :task="task"
-                              <img
+                            :record="record"
-                                :src="getPlatformIcon(record.platform)"
+                            :get-platform-icon="getPlatformIcon"
-                                style="
+                            @edit-time="handleModifyTime"
-                                  border-radius: 8px;
+                            @delete="handleDelete"
-                                  width: 16px;
+                            @delete-task="handleDelete"
-                                  height: 16px;
+                          />
-                                  margin-right: 8px;
-                                  font-size: 14px;
-                                "
-                              />
-                              {{ record.name || '-' }}
-                            </div>
-                            <div class="size-12px color-#939499 mt-2px">
-                              {{ timestampToTime1(task.execution_time) }}
-                            </div>
-                            <div class="size-14px color-#211F24 mt-12px">{{ task.name || '未命名' }}</div>
-                            <div class="flex items-center mt-12px">
-                              <div class="opt-btn">修改发布时间</div>
-                              <div class="opt-btn" style="margin-right: 0px">删除</div>
-                            </div>
-                          </div>
                         </template>
                       </a-trigger>
                     </div>
@@ -273,23 +242,13 @@
                   </div>
                 </div>
                 <template #content>
-                  <div class="flex flex-col items-start cell-detail">
+                  <TaskDetail
-                    <div class="flex items-center">
+                    :task="task"
-                      <img
+                    :record="record"
-                        :src="getPlatformIcon(record.platform)"
+                    :get-platform-icon="getPlatformIcon"
-                        style="border-radius: 8px; width: 16px; height: 16px; margin-right: 8px; font-size: 14px"
+                    @edit-time="handleModifyTime"
-                      />
+                    @delete="handleDelete"
-                      {{ record.name || '-' }}
+                  />
-                    </div>
-                    <div class="size-12px color-#939499 mt-2px">
-                      {{ timestampToTime1(task.execution_time) }}
-                    </div>
-                    <div class="size-14px color-#211F24 mt-12px">{{ task.name || '未命名' }}</div>
-                    <div class="flex items-center mt-12px">
-                      <div class="opt-btn">修改发布时间</div>
-                      <div class="opt-btn" style="margin-right: 0px">删除</div>
-                    </div>
-                  </div>
                 </template>
               </a-trigger>
             </div>
@@ -299,12 +258,18 @@
       </a-table>
     </div>
   </div>
+  <a-modal v-model:visible="showModal" @ok="handleOk" @cancel="handleCancel" ok-text="确认删除">
+    <template #title> {{ deleteTitle }} </template>
+    <div>
+      {{ deleteContent }}
+    </div>
+  </a-modal>
 </template>
 
 <script lang="ts" setup>
 import { ref, reactive, onMounted, watch, computed, nextTick } from 'vue';
 import type { TableColumnData } from '@arco-design/web-vue';
-import { getTaskSchedules } from '@/api/all/assignment-management';
+import { getTaskSchedules, delTaskSchedules } from '@/api/all/assignment-management';
 import { fetchAccountOperators } from '@/api/all/propertyMarketing';
 
 import icon1 from '@/assets/img/platform/icon-dy.png';
@@ -316,8 +281,12 @@ import icon6 from '@/assets/img/platform/icon-gzh.png';
 import icon7 from '@/assets/img/platform/icon-ks.png';
 import icon8 from '@/assets/img/platform/icon-bilibili.png';
 import DateUtils from '@/utils/DateUtils';
-
+import TaskDetail from './components/TaskDetail.vue';
+const currentTask = ref();
 const visible = ref(false);
+const deleteTitle = ref('');
+const deleteContent = ref('');
+const showModal = ref(false);
 const modalVisible = ref(false);
 const selectedTask = ref<any>(null);
 
@@ -357,21 +326,36 @@ const query = reactive({
   execution_time: [] as string[],
 });
 
-// 显示所有的
+// 处理删除操作
-const handleMore = (record: any, column: any) => {
+const handleDelete = (task: any) => {
-  console.log('record', record);
+  currentTask.value = task;
-  console.log('column', column);
+  if (task.type == 1) {
-  console.log('data', record[column.dataIndex]);
+    deleteTitle.value = '删除内容稿件排期';
+  } else {
+    deleteTitle.value = '删除选题排期';
+  }
+  deleteContent.value = '确认删除“' + task.name + '”吗？';
+  showModal.value = true;
 };
 
-const handleCell = (record: any, column: any, task: any) => {
+const handleOk = () => {
-  selectedTask.value = {
+  showModal.value = false;
-    ...task,
+  delTaskSchedules(currentTask.value.id).then(() => {
-    platform: record.platform,
+    handleSearch();
-    accountName: record.name,
+  });
-  };
+};
-  modalVisible.value = true;
+
-  console.log('data', record[column.dataIndex]);
+const handleCancel = () => {
+  showModal.value = false;
+};
+
+const handleModifyTime = (task: any) => {
+  console.log('修改时间', task);
+  // modalVisible.value = false;
+  // // 重新获取数据
+  // getTaskSchedules(query).then((res) => {
+  //   data.value = res.data;
+  // });
 };
 
 // 计算当前日期范围内的所有日期，统一返回 number 数组
@@ -413,7 +397,6 @@ const getTaskColor = (taskType: number, executionTime: number) => {
   if (isExpired) {
     return taskType === 0 ? '#A794FE' : '#FFCF66';
   }
-
   // 未过期，根据API文档，type: 0=选题，1=内容稿件
   return taskType === 0 ? '#6d4cfe' : '#ffae00';
 };
@@ -438,14 +421,12 @@ const timestampToTime1 = (timestamp: number): string => {
   const day = date.getDate().toString().padStart(2, '0');
   const hours = date.getHours().toString().padStart(2, '0');
   const minutes = date.getMinutes().toString().padStart(2, '0');
-
   return `${month}月${day} ${hours}:${minutes}`;
 };
 
 // 时间戳转时间格式 (HH:MM)
 const timestampToTime = (timestamp: number): string => {
   const date = new Date(timestamp * 1000); // 假设时间戳是秒级
-
   // 获取小时和分钟
   const hours = date.getHours().toString().padStart(2, '0');
   const minutes = date.getMinutes().toString().padStart(2, '0');
@@ -456,7 +437,6 @@ const timestampToTime = (timestamp: number): string => {
 // 处理表格数据，使其与动态表头匹配
 const processTableData = (apiData: any[]) => {
   const processedData: any[] = [];
-
   // 处理每条账号数据
   apiData.forEach((account) => {
     const rowData: any = {