feat: 修改稿件审核id逻辑

src/layouts/Basic.vue

@@ -61,7 +61,7 @@ provide('toggleDrawerMenu', () => {
 </script>
 
 <template>
-  <a-layout :class="['layout', { mobile: appStore.hideMenu }]">
+  <a-layout :class="['layout', { mobile: appStore.hideMenu }]" class="h-100vh flex flex-col w-full">
     <JoinModal v-model:visible="joinEnterpriseVisible" ref="joinModalRef" />
     <div v-if="navbar" class="layout-navbar">
       <base-navbar />
@@ -111,8 +111,8 @@ provide('toggleDrawerMenu', () => {
 $layout-max-width: 1100px;
 
 .layout {
-  width: 100%;
+  // width: 100%;
-  height: 100%;
+  // height: 100%;
 }
 .layout-navbar {
   position: fixed;
@@ -167,7 +167,7 @@ $layout-max-width: 1100px;
 }
 .layout-content {
   min-width: 1366px;
-  min-height: 100vh;
+  height: 100%;
   overflow-y: hidden;
   background-color: var(--color-fill-2);
   transition: padding 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);

src/router/routes/modules/creativeGenerationWorkshop.ts

@@ -96,7 +96,7 @@ const COMPONENTS: AppRouteRecordRaw[] = [
         component: () => import('@/views/creative-generation-workshop/manuscript/detail/index.vue'),
       },
       {
-        path: 'check/:id',
+        path: 'check',
         name: 'ManuscriptCheck',
         meta: {
           locale: '稿件审核',

src/views/creative-generation-workshop/manuscript/check-list/components/manuscript-check-table/index.vue

@@ -127,6 +127,7 @@ import {
   CUSTOMER_OPINION,
   PLATFORMS,
 } from '@/views/creative-generation-workshop/manuscript/check-list/constants';
+import { slsWithCatch } from '@/utils/stroage.ts';
 
 import TextOverTips from '@/components/text-over-tips';
 import ShareModal from '@/views/creative-generation-workshop/manuscript/components/share-manuscript-modal/share-modal.vue';
@@ -175,10 +176,12 @@ const onShare = (item) => {
 };
 const onCheck = (item) => {
   patchWorkAuditsAudit(item.id);
-  router.push(`/manuscript/check/${item.id}`);
+  slsWithCatch('manuscriptCheckIds', [item.id]);
+  router.push({ name: 'ManuscriptCheck' });
 };
 const onScan = (item) => {
-  router.push(`/manuscript/check/${item.id}`);
+  slsWithCatch('manuscriptCheckIds', [item.id]);
+  router.push({ name: 'ManuscriptCheck' });
 };
 const onDetail = (item) => {
   router.push(`/manuscript/check-list/detail/${item.id}?source=check&audit_status=${props.audit_status}`);

src/views/creative-generation-workshop/manuscript/check-list/index.vue

@@ -81,6 +81,7 @@ import ShareManuscriptModal from '@/views/creative-generation-workshop/manuscrip
 
 import { getWorkAuditsPage, patchWorkAuditsBatchAudit } from '@/api/all/generationWorkshop.ts';
 import { useTableSelectionWithPagination } from '@/hooks/useTableSelectionWithPagination';
+import { slsWithCatch } from '@/utils/stroage.ts';
 // import { getProjects } from '@/api/all/propertyMarketing';
 import {
   AuditStatus,
@@ -156,8 +157,8 @@ const handleBatchCheck = () => {
 
   patchWorkAuditsBatchAudit({ ids: selectedRowKeys.value });
 
-  const ids = selectedRowKeys.value.join(',');
+  slsWithCatch('manuscriptCheckIds', selectedRowKeys.value);
-  router.push(`/manuscript/check/${ids}`);
+  router.push({ name: 'ManuscriptCheck' });
 };
 const handleBatchView = () => {
   if (!selectedRows.value.length) {
@@ -165,9 +166,10 @@ const handleBatchView = () => {
     return;
   }
 
-  const ids = selectedRowKeys.value.join(',');
+  slsWithCatch('manuscriptCheckIds', selectedRowKeys.value);
-  router.push(`/manuscript/check/${ids}`);
+  router.push({ name: 'ManuscriptCheck' });
 };
+
 const handleTabClick = (key) => {
   query.value = cloneDeep(INITIAL_QUERY);
   dataSource.value = [];

src/views/creative-generation-workshop/manuscript/check/check-success-modal.vue

@@ -1,14 +1,21 @@
 <template>
-  <a-modal v-model:visible="visible" title="提示" width="480px" @close="onClose" modal-class="upload-success11-modal">
+  <a-modal
+    v-model:visible="visible"
+    title="提示"
+    width="480px"
+    @close="onClose"
+    modal-class="upload-success11-modal"
+    :footer="null"
+  >
     <div class="flex items-center flex-col justify-center">
       <img :src="icon1" width="80" height="80" class="mb-16px" />
       <span class="text-18px lh-26px font-400 color-#211F24 md mb-8px">内容稿件已通过审核</span>
       <p class="text-14px lh-22px font-400 color-#737478 ld">想让内容更抓眼球、更吸流量吗？</p>
       <p class="text-14px lh-22px font-400 color-#737478 ld">试试「内容稿件分析」功能吧！</p>
     </div>
-    <template #footer>
+    <!-- <template #footer>
       <a-button type="primary" class="ml-8px" size="medium" @click="onConfirm">内容稿件分析</a-button>
-    </template>
+    </template> -->
   </a-modal>
 </template>
 
@@ -18,25 +25,18 @@ import icon1 from '@/assets/img/media-account/icon-feedback-success.png';
 
 const router = useRouter();
 const visible = ref(false);
-const workId = ref('');
+const workIds = ref([]);
 
 const onClose = () => {
-  workId.value = '';
+  if (workIds.value.length === 1) {
+    router.push({ name: 'ManuscriptCheckList' });
+  }
+  workIds.value = [];
   visible.value = false;
 };
 
-const onBack = () => {
+const open = (ids) => {
-  onClose();
+  workIds.value = cloneDeep(ids);
-  router.push({ name: 'ManuscriptList' });
-};
-const onConfirm = () => {
-  visible.value = false;
-  // router.push({ name: 'ManuscriptCheck', params: { id: workId.value } });
-};
-
-const open = (id) => {
-  workId.value = id;
-
   visible.value = true;
 };
 

src/views/creative-generation-workshop/manuscript/check/components/content-card/index.vue

@@ -10,6 +10,7 @@ import {
   Tabs,
   Upload,
   TabPane,
+  Spin,
   Message as AMessage,
 } from '@arco-design/web-vue';
 import TextOverTips from '@/components/text-over-tips';
@@ -18,6 +19,7 @@ import { FORM_RULES, enumTab, TAB_LIST, RESULT_LIST } from './constants';
 
 import icon1 from '@/assets/img/creative-generation-workshop/icon-magic.png';
 import icon2 from '@/assets/img/creative-generation-workshop/icon-line.png';
+import icon3 from '@/assets/img/creative-generation-workshop/icon-success.png';
 
 export default {
   props: {
@@ -29,6 +31,10 @@ export default {
       type: Object,
       default: {},
     },
+    checkLoading: {
+      type: Boolean,
+      default: false,
+    },
   },
   emits: ['update:modelValue', 'filesChange', 'againCheck'],
   setup(props, { emit, expose }) {
@@ -50,7 +56,6 @@ export default {
     const handleTabClick = (key) => {
       activeTab.value = key;
     };
-
     const validate = () => {
       return new Promise((resolve, reject) => {
         formRef.value?.validate((errors) => {
@@ -95,7 +100,7 @@ export default {
         </>
       );
     };
-    const renderContent = () => {
+    const renderLeftBoxContent = () => {
       if (activeTab.value === enumTab.TEXT) {
         return (
           <Form ref={formRef} model={props.modelValue} rules={FORM_RULES} layout="vertical" auto-label-width>
@@ -106,6 +111,7 @@ export default {
                 size="large"
                 maxLength={30}
                 show-word-limit
+                disabled={props.checkLoading}
               />
             </FormItem>
             <FormItem label="作品描述" field="content" class="flex-1 content-form-item">
@@ -116,6 +122,7 @@ export default {
                 show-word-limit
                 maxLength={1000}
                 show-word-limit
+                disabled={props.checkLoading}
               />
             </FormItem>
           </Form>
@@ -123,6 +130,87 @@ export default {
       }
     };
 
+    const renderRightBox = () => {
+      if (isEmpty(props.checkResult)) {
+        return (
+          <div class="right-box flex-1 h-372px rounded-8px border-1px border-#E6E6E8 border-solid p-16px flex flex-col overflow-y-auto">
+            <p class="cts bold !text-16px !lh-24px !color-#211F24 mb-16px">审核结果</p>
+            <div class="flex items-center mb-16px">
+              {RESULT_LIST.map((item, index) => (
+                <div class="flex flex-col justify-center items-center flex-1 result-item" key={index}>
+                  <span class={`s1 ${item.class}`}>30</span>
+                  <span class="cts mt-4px !lh-20px !text-12px !color-#737478">{item.label}</span>
+                </div>
+              ))}
+            </div>
+            <div class="mb-16px suggestion-box p-12px rounded-8px bg-#F7F8FA flex flex-col">
+              <div class=" mb-24px relative w-fit">
+                <span class="ai-text">AI 审核建议</span>
+                <img src={icon2} class="w-80px h-10.8px absolute bottom-1px left-1px" />
+              </div>
+              <div class="flex flex-col items-center h-138px justify-center">
+                <img src={icon3} width={72} height={72} class="mb-12px" />
+                <span class="cts !color-#25C883">
+                {
+                  activeTab.value === enumTab.TEXT ? '恭喜，您的文案中没有检测出违禁词' : '恭喜，您的图片中没有检测出违禁内容'
+                }
+                </span>
+              </div>
+            </div>
+          </div>
+        );
+      }
+
+      if (props.checkLoading) {
+        return (
+          <div class="right-box flex-1 h-210px rounded-8px border-1px border-#E6E6E8 border-solid p-16px flex flex-col overflow-y-auto">
+            <p class="cts bold !text-16px !lh-24px !color-#211F24 mb-16px">审核结果</p>
+            <Spin loading={true} tip="文本检测中" size={72} class="" />
+          </div>
+        );
+      } else {
+        return (
+          <div class="right-box flex-1 rounded-8px border-1px border-#E6E6E8 border-solid p-16px flex flex-col overflow-y-auto">
+            <p class="cts bold !text-16px !lh-24px !color-#211F24 mb-16px">审核结果</p>
+            <div class="flex items-center mb-16px">
+              {RESULT_LIST.map((item, index) => (
+                <div class="flex flex-col justify-center items-center flex-1 result-item" key={index}>
+                  <span class={`s1 ${item.class}`}>30</span>
+                  <span class="cts mt-4px !lh-20px !text-12px !color-#737478">{item.label}</span>
+                </div>
+              ))}
+            </div>
+            <div class="mb-16px suggestion-box p-12px rounded-8px bg-#F7F8FA flex flex-col">
+              <div class=" mb-8px relative w-fit">
+                <span class="ai-text">AI 审核建议</span>
+                <img src={icon2} class="w-80px h-10.8px absolute bottom-1px left-1px" />
+              </div>
+              {descs.map((item, index) => (
+                <p class="cts !color-#55585F !text-12px  !lh-20px" key={index}>{`${index + 1}. ${item}`}</p>
+              ))}
+            </div>
+
+            <div class="forbid-word-box flex-1 flex">
+              <div class="left mr-32px w-56px">
+                <p class="mb-12px cts !text-12px">违禁词</p>
+                {forbidWords.map((item, index) => (
+                  <p class={`mb-12px cts level${item.level}`} key={index}>
+                    {item.label}
+                  </p>
+                ))}
+              </div>
+              <div class="right flex-1">
+                <p class="mb-12px cts !text-12px">解释</p>
+                {forbidWords.map((item, index) => (
+                  <TextOverTips context={item.desc} class="mb-12px" key={index} />
+                ))}
+              </div>
+            </div>
+          </div>
+        );
+      }
+    };
+
     expose({
       validate,
       resetForm,
@@ -151,7 +239,13 @@ export default {
         desc: '涉嫌夸大词语',
         level: 3,
       },
+      {
+        label: '副作用',
+        desc: '涉嫌夸大词语',
+        level: 3,
+      },
     ];
+
     return () => {
       return (
         <div class="h-full w-full px-24px pt-16px pb-24px content-wrap flex">
@@ -162,47 +256,11 @@ export default {
                   <TabPane key={item.value} title={item.label}></TabPane>
                 ))}
               </Tabs>
-              <div class="flex-1 px-16px">{renderContent()}</div>
+              <div class="flex-1 px-16px">{renderLeftBoxContent()}</div>
             </div>
             <div class="flex items-center justify-end">{renderFooterRow()}</div>
           </div>
-          <div class="right-box flex-1 rounded-8px border-1px border-#E6E6E8 border-solid p-16px flex flex-col overflow-y-auto">
+          {renderRightBox()}
-            <p class="cts bold !text-16px !lh-24px !color-#211F24 mb-16px">审核结果</p>
-            <div class="flex items-center mb-16px">
-              {RESULT_LIST.map((item, index) => (
-                <div class="flex flex-col justify-center items-center flex-1 result-item" key={index}>
-                  <span class={`s1 ${item.class}`}>30</span>
-                  <span class="cts mt-4px !lh-20px !text-12px !color-#737478">{item.label}</span>
-                </div>
-              ))}
-            </div>
-            <div class="mb-16px suggestion-box p-12px rounded-8px bg-#F7F8FA flex flex-col max-h-220px overflow-y-auto">
-              <div class=" mb-8px relative w-fit">
-                <span class="ai-text">AI 审核建议</span>
-                <img src={icon2} class="w-80px h-10.8px absolute bottom-1px left-1px" />
-              </div>
-              {descs.map((item, index) => (
-                <p class="cts !color-#55585F !text-12px  !lh-20px" key={index}>{`${index + 1}. ${item}`}</p>
-              ))}
-            </div>
-
-            <div class="forbid-word-box flex">
-              <div class="left mr-32px w-56px">
-                <p class="mb-12px cts !text-12px">违禁词</p>
-                {forbidWords.map((item, index) => (
-                  <p class={`mb-12px cts level${item.level}`} key={index}>
-                    {item.label}
-                  </p>
-                ))}
-              </div>
-              <div class="right flex-1">
-                <p class="mb-12px cts !text-12px">解释</p>
-                {forbidWords.map((item, index) => (
-                  <TextOverTips context={item.desc} class="mb-12px" key={index} />
-                ))}
-              </div>
-            </div>
-          </div>
         </div>
       );
     };

src/views/creative-generation-workshop/manuscript/check/components/content-card/style.scss

@@ -21,7 +21,7 @@
       .arco-tabs-nav {
         .arco-tabs-tab {
           height: 40px;
-          padding: 0;
+        //   padding: 0 8px;
           margin: 0 16px;
         }
         &::before {

src/views/creative-generation-workshop/manuscript/check/index.vue

@@ -5,6 +5,7 @@ import CheckSuccessModal from './check-success-modal.vue';
 import HeaderCard from './components/header-card';
 import ContentCard from './components/content-card';
 
+import { slsWithCatch, rlsWithCatch, glsWithCatch } from '@/utils/stroage.ts';
 import {
   patchWorkAuditsAudit,
   patchWorkAuditsBatchAudit,
@@ -14,21 +15,12 @@ import {
   getWorkAuditsBatchDetail,
 } from '@/api/all/generationWorkshop.ts';
 
-// const generateMockData = (count = 20) =>
-//   Array.from({ length: count }, (_, i) => ({
-//     id: `${i + 1}`,
-//     title: `挖到宝了！这个平价好物让我素颜出门都自信✨挖到宝了！这个平价好物让我素颜出门都自信✨${i + 1}`,
-//     content: '挖到宝了！这个平价好物让我素颜出门都自信✨挖到宝了！这个平价好物让我素颜出门都自信✨',
-//     platform: 1,
-//     files: [],
-//   }));
-
 export default {
   setup(props, { emit, expose }) {
     const router = useRouter();
     const route = useRoute();
 
-    // const workIds = ref(route.params.id);
+    const workIds = ref([]);
     const selectCardInfo = ref({});
     const isSaved = ref(false);
     const dataSource = ref([]);
@@ -40,10 +32,6 @@ export default {
     const checkLoading = ref(false);
     const checkResult = ref({});
 
-    const workIds = computed(() => {
-      return route.params.id.split(',');
-    });
-
     const onBack = () => {
       router.push({ name: 'ManuscriptCheckList' });
     };
@@ -66,14 +54,12 @@ export default {
       }
     };
 
-    const getData = async () => {
+    const getWorkAudits = async () => {
       const { code, data } = await getWorkAuditsBatchDetail({ ids: workIds.value });
       if (code === 200) {
         dataSource.value = data ?? [];
         selectCardInfo.value = cloneDeep(data?.[0] ?? {});
       }
-      // dataSource.value = generateMockData();
-      // selectCardInfo.value = cloneDeep(dataSource.value[0] ?? {});
     };
 
     const isSelectCardModified = () => {
@@ -101,13 +87,30 @@ export default {
         }
       });
     };
+    const onCheckSuccess = () => {
+      checkSuccessModalRef.value?.open(workIds.value);
+
+      if (workIds.value.length > 1) {
+        const _id = selectCardInfo.value.id;
+        workIds.value = workIds.value.filter((v) => v != _id);
+        dataSource.value = dataSource.value.filter((v) => v.id != _id);
+
+        slsWithCatch('manuscriptCheckIds', workIds.value.join(','));
+        if (dataSource.value.length) {
+          const _target = dataSource.value[0] ?? {};
+          selectCardInfo.value = cloneDeep(_target);
+        } else {
+          selectCardInfo.value = {};
+        }
+      }
+    };
     const onSubmit = async () => {
       contentCardRef.value?.validate().then(async () => {
         try {
           submitLoading.value = true;
           const { code, data } = await putWorkAuditsAuditPass(selectCardInfo.value);
           if (code === 200) {
-            checkSuccessModalRef.value?.open(selectCardInfo.value.id);
+            onCheckSuccess();
           }
         } finally {
           submitLoading.value = false;
@@ -139,12 +142,17 @@ export default {
       );
     };
     onMounted(() => {
-      getData();
+      const manuscriptCheckIds = glsWithCatch('manuscriptCheckIds');
+      workIds.value = manuscriptCheckIds.split(',');
+      getWorkAudits();
+    });
+    onUnmounted(() => {
+      rlsWithCatch('manuscriptCheckIds');
     });
 
     return () => (
-      <Spin loading={checkLoading.value} tip="文本检测中" class="manuscript-check-wrap" size={100}>
+      <>
-        <div class="h-full w-full flex flex-col">
+        <div class="manuscript-check-wrap flex flex-col">
           <div class="flex items-center mb-8px">
             <span class="cts color-#4E5969 cursor-pointer" onClick={onExit}>
               内容稿件审核
@@ -154,7 +162,7 @@ export default {
           </div>
           <div class="flex-1 flex flex-col overflow-hidden bg-#fff rounded-8px border-1px border-#D7D7D9 border-solid">
             <HeaderCard dataSource={dataSource.value} selectCardInfo={selectCardInfo.value} onCardClick={onCardClick} />
-            <section class="flex-1">
+            <section class="flex-1 overflow-hidden">
               <ContentCard
                 ref={contentCardRef}
                 v-model={selectCardInfo.value}
@@ -162,6 +170,7 @@ export default {
                 checkResult={checkResult.value}
                 onFilesChange={onFilesChange}
                 onAgainCheck={onAgainCheck}
+                checkLoading={checkLoading.value}
               />
             </section>
           </div>
@@ -172,7 +181,7 @@ export default {
 
         <CancelCheckModal ref={cancelCheckModalRef} onSelectCard={onChangeCard} />
         <CheckSuccessModal ref={checkSuccessModalRef} />
-      </Spin>
+      </>
     );
   },
 };

src/views/creative-generation-workshop/manuscript/detail/index.vue

@@ -6,6 +6,7 @@ import { AuditStatus } from '@/views/creative-generation-workshop/manuscript/che
 import { getWorksDetail } from '@/api/all/generationWorkshop';
 import { EnumManuscriptType } from '@/views/creative-generation-workshop/manuscript/list/constants.ts';
 import { convertVideoUrlToCoverUrl, exactFormatTime } from '@/utils/tools.ts';
+import { slsWithCatch } from '@/utils/stroage.ts';
 
 const DEFAULT_SOURCE_INFO = {
   title: '内容稿件列表',
@@ -110,7 +111,8 @@ export default {
         if (isPassed) {
           console.log('审核详情');
         } else {
-          router.push(`/manuscript/check/${workId.value}`);
+          slsWithCatch('manuscriptCheckIds', [workId.value]);
+          router.push({ name: 'ManuscriptCheck' });
         }
       };
 

src/views/creative-generation-workshop/manuscript/edit/index.vue

@@ -5,6 +5,7 @@ import CancelEditModal from './cancel-edit-modal.vue';
 import { getWorksDetail, putWorksUpdate } from '@/api/all/generationWorkshop';
 import { EnumManuscriptType } from '@/views/creative-generation-workshop/manuscript/list/constants.ts';
 import { formatDuration, formatFileSize, convertVideoUrlToCoverUrl } from '@/utils/tools';
+import { slsWithCatch } from '@/utils/stroage.ts';
 
 export default {
   components: {
@@ -45,7 +46,8 @@ export default {
           isSaved.value = true;
 
           if (check) {
-            router.push({ name: 'ManuscriptCheck', params: { id: workId.value } });
+            slsWithCatch('manuscriptCheckIds', [workId.value]);
+            router.push({ name: 'ManuscriptCheck' });
           } else {
             onBack();
           }

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

@@ -15,6 +15,7 @@
 
 <script setup>
 import { ref } from 'vue';
+import { slsWithCatch } from '@/utils/stroage.ts';
 import icon1 from '@/assets/img/media-account/icon-feedback-success.png';
 
 const router = useRouter();
@@ -32,7 +33,8 @@ const onBack = () => {
 };
 const onConfirm = () => {
   visible.value = false;
-  router.push({ name: 'ManuscriptCheck', params: { id: workId.value } });
+  slsWithCatch('manuscriptCheckIds', [workId.value]);
+  router.push({ name: 'ManuscriptCheck' });
 };
 
 const open = (id) => {