修改样式

src/views/property-marketing/assignment-management/components/draw-popup.vue

@@ -1,11 +1,8 @@
 <template>
   <a-drawer
     title="创建任务"
-    cancel-text="取消"
-    ok-text="创建任务"
     placement="right"
     v-model:visible="showDriwer"
-    @after-visible-change="showDriwerChange"
     @ok="handleCreateTask"
     width="480px"
     class="task-drawer"
@@ -183,6 +180,16 @@
       @confirm="handleProductConfirm"
       @cancel="handleProductCancel"
     />
+    <!-- 底部操作栏 -->
+    <template #footer>
+      <div class="flex items-center justify-between">
+        <div class="flex items-center"></div>
+        <div class="flex justify-end">
+          <Button @click="handleCancel">取消</Button>
+          <Button class="ml-16px" type="primary" @click="handleCreateTask">创建任务</Button>
+        </div>
+      </div>
+    </template>
   </a-drawer>
 </template>
 
@@ -415,21 +422,6 @@ const handleDateChange = (date) => {
   // 日期处理逻辑
 };
 
-// 抽屉显示状态变化
-const showDriwerChange = (visible: boolean) => {
-  console.log('Main Drawer visible: ', visible);
-};
-
-// 原料库抽屉显示状态变化
-const handleMaterialDrawerVisibleChange = (visible: boolean) => {
-  console.log('Raw Material Drawer visible: ', visible);
-};
-
-// 成品库抽屉显示状态变化
-const handleProductDrawerVisibleChange = (visible: boolean) => {
-  console.log('Finished Product Drawer visible: ', visible);
-};
-
 // 处理筛选条件变化
 const handleChange = (field, value) => {
   localQuery.value[field] = value;
@@ -439,6 +431,10 @@ const handleChange = (field, value) => {
   });
 };
 
+const handleCancel = () => {
+  showDriwer.value = false;
+};
+
 // 点击创建任务按钮时触发
 const handleCreateTask = () => {
   // 验证表单
@@ -452,11 +448,6 @@ const handleCreateTask = () => {
     message.error('请选择发布内容');
     return;
   }
-  if (isActive.value === 'ai' && selectedMaterials.value.keys.length === 0) {
-    // 可以添加错误提示：请选择发布内容
-    message.error('请选择发布内容');
-    return;
-  }
   console.log('有问题已返回');
   // 准备提交的数据
   const taskData = {
@@ -472,7 +463,6 @@ const handleCreateTask = () => {
   };
   // 发射创建任务事件
   emit('create-task', taskData);
-
   // 关闭抽屉
   showDriwer.value = false;
 };

src/views/property-marketing/assignment-management/components/task-item.vue

@@ -1,5 +1,5 @@
 <template>
-  <a-trigger trigger="click" position="br" @click.stop @popup-visible-change="onPopupVisibleChange">
+  <a-trigger trigger="click" position="br" @click.stop @popup-visible-change="onPopupVisibleChange" v-model:popup-visible="popupVisible">
     <div class="task-item">
       <div class="color-indicator" :style="{ background: getTaskColor() }"></div>
       <div>{{ timestampToTime(task.execution_time) }}</div>
@@ -31,17 +31,15 @@
             {{ timestampToTime1(task.execution_time) }}
           </div>
         </div>
-
         <div class="font-size-14px color-#211F24 color-#211F24 task-description" :title="task.name || 'AI生成内容'">
           {{ task.name || 'AI生成内容' }}
         </div>
-        <div v-if="task.ai_generate_status == 0" class="AILoding">
+        <div v-if="task.ai_generate_status == 1" class="AILoding">
           <ASpin />
           <div style="color: #9a56ba">内容生成中...</div>
           <div style="color: #9a56ba">完成后将自动展示，您可先返回其他操作</div>
         </div>
-
-        <div v-else-if="task.ai_generate_status == 1 && taskDetail" class="w-full pl-16px">
+        <div v-else-if="taskDetail" class="w-full pl-16px">
           <div
             v-for="item in choseTextArray"
             :key="item.id"
@@ -66,30 +64,29 @@
             />
           </div>
         </div>
+        <div class="flex flex-col w-full" v-if="task.status != 2">
           <div class="flex items-center mt-12px w-full h-1px bg-#E6E6E8"></div>
           <div class="flex items-center mt-12px mb-16px action-buttons w-full px-16px">
-          <div class="flex items-center mr-12px" @click.stop="handleDelete" v-if="task.status != 1">
+            <div
+              class="flex items-center mr-12px"
+              @click.stop="handleDelete"
+              v-if="task.status == 0 || (taskDetail.status == 1 && taskDetail.ai_generate_status != 1)"
+            >
               <icon-delete style="font-size: 20px; margin-left: 0" />
             </div>
             <div class="flex w-full" :class="{ 'justify-between': task.ai_generate_status == 0 }">
-            <a-date-picker
-              v-model="datePickerValue"
-              placeholder="修改发布时间"
-              :show-time="{ format: 'HH:mm' }"
-              format="YYYY-MM-DD HH:mm"
-              value-format="YYYY-MM-DD HH:mm"
-              @change="onChange"
-              @ok="onOk"
-              @click.stop
-              @mousedown.stop
-              @focus.stop
-            />
-            <button v-if="task.ai_generate_status == 0" class="opt-btn ml-12px opt-right" @click.stop="handleAICreate">
+              <button class="opt-btn flex-1" @click.stop="handleEditTask">修改任务</button>
+              <button
+                v-if="task.ai_generate_status == 0 && task.status != 3"
+                class="opt-btn ml-12px opt-right"
+                @click.stop="handleAICreate"
+              >
                 AI立即生成
               </button>
             </div>
           </div>
         </div>
+      </div>
     </template>
   </a-trigger>
 </template>
@@ -120,10 +117,8 @@ const choseTextArray = ref([]);
 const choseVideoArray = ref([]);
 const getTaskDetail = async () => {
   if (!props.task || !props.task.id) return;
-
   try {
     const res = await getTaskSchedulesDetail(props.task.id);
-
     if (res && res.data) {
       datePickerValue.value = dayjs(res.data.execution_time * 1000);
       console.log('任务详情:', datePickerValue.value);
@@ -156,6 +151,7 @@ const onOk = (value) => {
 };
 
 const onPopupVisibleChange = (visible) => {
+  popupVisible.value = visible;
   if (visible) {
     getTaskDetail();
   }
@@ -168,21 +164,22 @@ const gotoDetail = () => {
   console.log('跳转详情');
   emit('handle-task', 'goto-detail', props.task, props.record);
 };
-const handleTimeChange = (time: string) => {
-  // if (time) {
-  //   emit('handle-task', 'edit-time', props.task, timestampToTime1() + ' ' + time + ':00');
-  // }
-};
+
 const handleAICreate = () => {
   emit('handle-task', 'ai-create', props.task, props.record);
 };
+
+const handleEditTask = () => {
+  // 关闭当前弹窗
+  popupVisible.value = false;
+  emit('handle-task', 'edit-task', props.task, props.record);
+};
+
 const timestampToTime = (timestamp: number): string => {
   // 如果没有传入时间戳，则返回空字符串
   if (!timestamp) return '';
-
   // 将时间戳转换为毫秒（如果时间戳是秒单位的话）
   const date = new Date(timestamp * 1000);
-
   // 格式化为 HH:mm 格式
   const hours = String(date.getHours()).padStart(2, '0');
   const minutes = String(date.getMinutes()).padStart(2, '0');
@@ -205,6 +202,9 @@ const timestampToTime1 = (timestamp: number): string => {
 
 const emit = defineEmits(['filter-change', 'handle-task']);
 
+// 添加控制弹窗显示的响应式变量
+const popupVisible = ref(false);
+
 // 日期选择器的值
 const datePickerValue = ref(null);
 

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

@@ -248,7 +248,6 @@ const processTableData = (apiData: any[]) => {
 
 // 创建任务
 const handleAddTask = () => {
-  console.log('handleAddTask');
   drawerPopupRef.value?.showDrawer();
 };
 
@@ -505,6 +504,17 @@ const handleTaskAction = async (action: string, task: any, ...args: any[]) => {
         message.success(res.message);
       }
       break;
+    case 'edit-task':
+      console.log('edit-task', args[0], typeof args[0]);
+      const accountInfo = {
+        id: args[0].id,
+        name: args[0].name,
+        platform: args[0].platform,
+      };
+      const selectedDate = task.execution_time;
+      const date = new Date(selectedDate);
+      drawerPopupRef.value.showDrawer(accountInfo, date);
+      break;
   }
 };