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

feat: 稿件详情

Browse Source
This commit is contained in:
rd
2025-07-31 16:22:37 +08:00
parent 9668f2a56d
commit ed1050313c
8 changed files with 163 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
src/views/creative-generation-workshop/manuscript/upload/index.vue
View File

@ -6,6 +6,7 @@ import CancelUploadModal from './cancel-upload-modal.vue';
import UploadSuccessModal from './upload-success-modal.vue';
import { EnumManuscriptType } from '@/views/creative-generation-workshop/manuscript/list/constants';
import { postWorksBatch } from '@/api/all/generationWorkshop.ts';
import icon1 from '@/assets/img/creative-generation-workshop/icon-photo.png';
import icon2 from '@/assets/img/creative-generation-workshop/icon-video.png';
@ -27,20 +28,22 @@ export default {
},
setup(props, { emit, expose }) {
const formRef = ref(null);
const route = useRoute();
const cancelUploadModal = ref(null);
const uploadSuccessModal = ref(null);
const dataSource = ref([]);
const works = ref([]);
const selectCardInfo = ref({});
const errorDataCards = ref([]);
const uploadLoading = ref(false);
const workId = route.params.id;
const onCancel = () => {
cancelUploadModal.value?.open(dataSource.value.length);
cancelUploadModal.value?.open(works.value.length);
};
const validateDataSource = () => {
return new Promise((resolve) => {
dataSource.value.forEach((item) => {
works.value.forEach((item) => {
if (!item.title?.trim()) {
errorDataCards.value.push(item);
}
@ -50,8 +53,8 @@ export default {
}
if (errorDataCards.value.length > 0) {
AMessage.error(`有 ${errorDataCards.value.length} 个必填信息未填写，请检查`);
AMessage.warning(`有 ${errorDataCards.value.length} 个必填信息未填写，请检查`);
setTimeout(() => {
const el = document.getElementById(`card-${errorDataCards.value[0]?.id}`);
if (el) el.scrollIntoView({ behavior: 'smooth', block: 'center' });
@ -61,13 +64,21 @@ export default {
});
};
const onSubmit = async () => {
const onUpload = async (e, check = false) => {
console.log('onUpload', works.value);
formRef.value
?.validate()
.then(() => {
validateDataSource().then((res) => {
console.log('success');
uploadSuccessModal.value?.open(dataSource.value);
validateDataSource().then(async (res) => {
const { code, data } = await postWorksBatch({ works: works.value });
if (code === 200) {
uploadLoading.value = false;
if (check) {
uploadSuccessModal.value?.open(workId);
} else {
router.push({ name: 'ManuscriptList' });
}
}
});
})
.catch((err) => {
@ -75,8 +86,8 @@ export default {
});
};
const onSubmitAndCheck = () => {
console.log('onSubmitAndCheck');
const onUploadAndCheck = (e) => {
onUpload(e, true);
};
const handleReValidate = () => {
@ -95,12 +106,12 @@ export default {
const onDelete = (e, item, index) => {
e.stopPropagation();
dataSource.value.splice(index, 1);
works.value.splice(index, 1);
deleteErrorCard(item);
if (item.id === selectCardInfo.value.id) {
if (dataSource.value.length) {
const _target = dataSource.value[0] ?? {};
if (works.value.length) {
const _target = works.value[0] ?? {};
selectCardInfo.value = _target;
} else {
selectCardInfo.value = {};
@ -109,13 +120,13 @@ export default {
};
const renderFooterRow = () => {
if (dataSource.value.length > 1) {
if (works.value.length > 1) {
return (
<>
<Button size="medium" type="outline" onClick={onCancel} class="mr-12px">
取消上传
</Button>
<Button type="primary" size="medium" onClick={onSubmit} loading={uploadLoading.value}>
<Button type="primary" size="medium" onClick={onUpload} loading={uploadLoading.value}>
{uploadLoading.value ? '批量上传' : '批量上传'}
</Button>
</>
@ -126,10 +137,10 @@ export default {
<Button size="medium" type="outline" onClick={onCancel} class="mr-12px">
取消上传
</Button>
<Button size="medium" type="outline" onClick={onSubmit} class="mr-12px">
<Button size="medium" type="outline" onClick={onUpload} class="mr-12px" loading={uploadLoading.value}>
上传
</Button>
<Button type="primary" size="medium" onClick={onSubmitAndCheck} loading={uploadLoading.value}>
<Button type="primary" size="medium" onClick={onUploadAndCheck} loading={uploadLoading.value}>
上传并审核
</Button>
</>
@ -137,8 +148,8 @@ export default {
}
};
const getData = () => {
dataSource.value = generateMockData();
selectCardInfo.value = dataSource.value[0] ?? {};
works.value = generateMockData();
selectCardInfo.value = works.value[0] ?? {};
};
const getCardClass = (item) => {
if (selectCardInfo.value.id === item.id) {
@ -159,15 +170,15 @@ export default {
<div class="left flex-1 overflow-y-auto p-24px">
<EditForm ref={formRef} v-model={selectCardInfo.value} onReValidate={handleReValidate} />
</div>
{dataSource.value.length > 1 && (
{works.value.length > 1 && (
<div class="right pt-24px pb-12px flex flex-col">
<div class="title flex items-center px-24px">
<div class="w-3px h-16px bg-#6D4CFE rounded-2px mr-8px"></div>
<p class="cts bold !color-#211F24 !text-16px !lh-24px mr-8px">上传内容稿件列表</p>
<p class="cts">{`共${dataSource.value.length}个`}</p>
<p class="cts">{`共${works.value.length}个`}</p>
</div>
<div class="flex-1 px-24px overflow-y-auto pt-24px">
{dataSource.value.map((item, index) => (
{works.value.map((item, index) => (
<div
key={item.id}
id={`card-${item.id}`}

14
src/views/creative-generation-workshop/manuscript/upload/upload-success-modal.vue
View File

@ -19,10 +19,10 @@ import icon1 from '@/assets/img/media-account/icon-feedback-success.png';
const router = useRouter();
const visible = ref(false);
const data = ref([]);
const workId = ref('');
const onClose = () => {
data.value = [];
workId.value = '';
visible.value = false;
};
@ -31,13 +31,13 @@ const onBack = () => {
router.push({ name: 'ManuscriptList' });
};
const onConfirm = () => {
onClose();
console.log('跳转至「内容稿件审核」菜单tab，进入批量审核稿件页面');
router.push({ name: 'ManuscriptCheck' });
visible.value = false;
router.push({ name: 'ManuscriptCheck', params: { id: workId.value } });
};
const open = (dataSource) => {
data.value = dataSource;
const open = (id) => {
console.log({ id });
workId.value = id;
visible.value = true;
};