renxiaodong/lingji-work-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

发布任务

Browse Source
This commit is contained in:
lq
2025-09-23 18:16:10 +08:00
parent 288d4ffddf
commit dac4d7a20b
4 changed files with 105 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/hooks/useTableSelectionWithPagination.ts
View File

@ -4,6 +4,7 @@ import { cloneDeep } from 'lodash-es';
interface UseTableSelectionWithPaginationOptions {
rowKey?: string; // 主键字段名，默认 'id'
type?: 'checkbox' | 'radio'; // 选择类型，默认 'checkbox'
pageInfo?: {
page?: number;
page_size?: number;
@ -22,6 +23,7 @@ const DEFAULT_PAGE_INFO = {
export function useTableSelectionWithPagination(options: UseTableSelectionWithPaginationOptions = {}) {
const rowKey = options.rowKey || 'id';
const type = options.type || 'checkbox'; // 默认为复选框
const selectedRowKeys = ref<Array<string | number>>([]);
const selectedRows = ref<Array<any>>([]);
@ -33,6 +35,17 @@ export function useTableSelectionWithPagination(options: UseTableSelectionWithPa
// 单行选择
const handleSelect = (record: any, select: boolean) => {
const _targetKey = record[rowKey];
if (type === 'radio') {
// 单选模式
if (select) {
selectedRows.value = [record];
selectedRowKeys.value = [_targetKey];
} else {
selectedRows.value = [];
selectedRowKeys.value = [];
}
} else {
// 多选模式（默认）
if (select) {
selectedRows.value.push(record);
selectedRowKeys.value.push(_targetKey);
@ -40,12 +53,16 @@ export function useTableSelectionWithPagination(options: UseTableSelectionWithPa
selectedRows.value = selectedRows.value.filter((v) => v[rowKey] !== _targetKey);
selectedRowKeys.value = selectedRowKeys.value.filter((key) => key !== _targetKey);
}
}
options.onSelectChange?.();
};
// 全选/取消全选
const handleSelectAll = (checked: boolean) => {
// 单选模式下不支持全选
if (type === 'radio') return;
const currentPageRows = dataSource.value;
const currentPageKeys = currentPageRows.map((v) => v[rowKey]);
@ -64,8 +81,15 @@ export function useTableSelectionWithPagination(options: UseTableSelectionWithPa
// 选择变更处理
const handleSelectChange = (keys: Array<string | number>, rows: Array<any>) => {
if (type === 'radio') {
// 单选模式下只保留最后一个选择
selectedRowKeys.value = keys.length > 0 ? [keys[keys.length - 1]] : [];
selectedRows.value = rows.length > 0 ? [rows[rows.length - 1]] : [];
} else {
// 多选模式
selectedRowKeys.value = keys;
selectedRows.value = rows;
}
options.onSelectChange?.();
};
@ -88,8 +112,8 @@ export function useTableSelectionWithPagination(options: UseTableSelectionWithPa
};
const rowSelection = computed(() => ({
type: 'checkbox',
showCheckedAll: true,
type: type,
showCheckedAll: type === 'checkbox', // 只有复选框模式才显示全选
width: 48,
selectedRowKeys: selectedRowKeys.value,
onChange: handleSelectChange

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

@ -100,7 +100,7 @@
<div class="section-title">发布内容</div>
<div class="font-size-12px text-[#999999]">（必填）</div>
</div>
<div class="form-section material-section">
<div class="form-section material-section" v-if="hasChoseFinishedProducts == false">
<Button @click="handleAddContent" class="add-material-btn">
<template #icon>
<icon-plus size="16" class="mr-8px" />
@ -110,6 +110,12 @@
<p class="material-hint">前往成品库，选择要发布的内容</p>
</div>
<div v-else class="flex flex-col items-start w-full">
<div class="mb-12px">{{ selectedProducts.data[0].title }}</div>
<div v-for="item in selectedProducts.images" :key="item.id">
<img v-if="item.cover" :src="item.cover" class="w-88 h-88 mr-8px border-rounded-8px mb-12px" />
</div>
</div>
</div>
</div>
</div>
@ -188,11 +194,12 @@ import icon4 from '@/assets/img/error-img.png';
// 引入子组件
import RawMaterialDrawer from './raw-material-drawer.vue';
import FinishedProductDrawer from './finished-product-drawer.vue';
import { message } from 'ant-design-vue';
// 状态管理
const choseText = ref('');
const taskDescription = ref('');
const hasChoseMaterial = ref(false);
const hasChoseFinishedProducts = ref(false);
const isActive = ref('ai');
const showDriwer = ref(false);
const showDrawer2 = ref(false);
@ -310,6 +317,19 @@ const handleProductConfirm = (result) => {
text: result.choseText,
images: result.choseImgArray,
};
// 如果是单选模式，确保只选择一个项目
if (result.selectedRows && result.selectedRows.length > 0) {
hasChoseFinishedProducts.value = true;
// 取第一个选中的项目
const selectedProduct = result.selectedRows[0];
selectedProducts.value = {
keys: [selectedProduct.id],
data: [selectedProduct],
text: '1个稿件',
images: [selectedProduct],
};
}
};
// 处理成品库取消
@ -360,12 +380,24 @@ watch(showDriwer, (newVal) => {
// 点击创建任务按钮时触发
const handleCreateTask = () => {
// 验证表单
if (isActive.value === 'chose' && selectedProducts.value.keys.length === 0) {
if (localQuery.value.ids.length == 0) {
// 可以添加错误提示：请选择发布内容
console.log('请选择发布内容');
message.error('请选择发布账号');
return;
}
console.log('selectedMaterials', selectedMaterials.value);
console.log('selectedProducts', selectedProducts.value);
console.log('isActive', isActive.value);
if (isActive.value === 'chose' && selectedProducts.value.keys.length === 0) {
// 可以添加错误提示：请选择发布内容
message.error('请选择发布内容');
return;
}
if (isActive.value === 'ai' && selectedMaterials.value.keys.length === 0) {
// 可以添加错误提示：请选择发布内容
message.error('请选择发布内容');
return;
}
console.log(localQuery.value);
// 准备提交的数据
const taskData = {
media_account_id: localQuery.value.ids[0],
@ -376,6 +408,7 @@ const handleCreateTask = () => {
publish_type: publishType.value == 'immediate' ? 0 : 1,
execution_time:
publishType.value === 'timing' ? `${dayjs(currentDate.value).format('YYYY-MM-DD')} ${strValue.value}` : null,
work_id: selectedProducts.value.keys[0],
};
// 发射创建任务事件
emit('create-task', taskData);
@ -445,6 +478,7 @@ defineExpose({
align-items: center;
width: 400px;
border-radius: 8px;
padding: 8px;
}
.publish-section {

50
src/views/property-marketing/assignment-management/components/finished-product-drawer.vue
View File

@ -158,8 +158,10 @@ const fetchProductData = async () => {
};
// 2. 初始化表格选择逻辑
const { pageInfo, onPageChange, onPageSizeChange, rowSelection, selectedRowKeys } = useTableSelectionWithPagination({
const { pageInfo, onPageChange, onPageSizeChange, rowSelection, selectedRowKeys, selectedRows } =
useTableSelectionWithPagination({
rowKey: 'id',
type: 'radio', // 改为单选模式
onPageChange: fetchProductData,
onPageSizeChange: fetchProductData,
});
@ -173,37 +175,33 @@ watchEffect(() => {
});
// 监听选中项变化
watch(selectedRowKeys, (newKeys) => {
const filteredData = materialData.value.filter((item) => newKeys.includes(item.id));
choseText.value = filteredData.length + '个稿件';
// // 统计各类型数量
// const typeCount = filteredData.reduce((acc, item) => {
// const typeKey = item.type === EnumManuscriptType.Image ? 'image' : 'video';
// acc[typeKey] = (acc[typeKey] || 0) + 1;
// return acc;
// }, {});
// // 生成选中文本
// choseText.value = [];
// if (typeCount.image) choseText.value.push(`图文: ${typeCount.image}个`);
// if (typeCount.video) choseText.value.push(`视频: ${typeCount.video}个`);
// choseText.value = choseText.value.join(' ');
// // 筛选选中的内容用于预览
// choseImgArray.value = filteredData;
watch(selectedRows, (newRows) => {
if (rowSelection.value.type === 'radio') {
// 单选模式
choseText.value = newRows.length > 0 ? '1个稿件' : '0个稿件';
// 如果类型是文本，则choseImgArray为空数组
if (newRows.length > 0 && newRows[0].type !== 'text') {
choseImgArray.value = [newRows[0]];
} else {
choseImgArray.value = [];
}
} else {
// 多选模式
choseText.value = newRows.length + '个稿件';
// 过滤掉文本类型，只保留非文本类型的项目
choseImgArray.value = newRows.filter(item => item.type !== 'text');
}
});
// 格式化审核状态显示
const getStatus = (status: number) => {
switch (status) {
case 0:
return '待审核';
case 1:
return '审核中';
return '待审核';
case 2:
return '已通过';
return '审核中';
case 3:
return '已拒绝';
return '已通过';
default:
return '未知';
}
@ -238,10 +236,10 @@ const handleCancel = () => {
// 确定按钮处理
const handleOk = () => {
const selectedData = materialData.value.filter((item) => selectedRowKeys.value.includes(item.id));
emit('confirm', {
selectedKeys: selectedRowKeys.value,
selectedData,
selectedData: selectedRows.value,
selectedRows: selectedRows.value,
choseText: choseText.value,
choseImgArray: choseImgArray.value,
});

6
src/views/property-marketing/assignment-management/index.vue
View File

@ -144,6 +144,7 @@ import iconWb from '@/assets/img/platform/icon-wb.png';
import iconGzh from '@/assets/img/platform/icon-gzh.png';
import iconWarn from '@/assets/img/media-account/icon-warn.png';
import { Checkbox, Button, Space, Pagination, notification } from 'ant-design-vue';
import { message } from 'ant-design-vue';
// 表格分页逻辑
const { pageInfo, onPageChange, onPageSizeChange } = useTableSelectionWithPagination({
onPageChange: () => handleSearch(),
@ -249,7 +250,10 @@ const handleAddTask = () => {
const handleCreateTask = async (value) => {
console.log('handleCreateTask', value);
const res = await createTask(value);
console.log('res', res);
if (res && res.code === 200) {
message.success('创建成功');
handleSearch();
}
};
// 添加对DrowPopup组件的引用