原料库和成品库

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

@@ -62,14 +62,18 @@
             </div>
             <!-- 素材添加区域 -->
             <div class="form-section material-section">
-              <div v-if="hasChoseMaterial" class="flex items-center"></div>
+              <div class="flex items-center"></div>
-              <div v-else class="flex flex-col items-center">
+
               <Button class="add-material-btn" @click="handleAddMaterial">
                 <template #icon>
                   <icon-plus size="16" class="mr-8px" />
                 </template>
                 从原料库添加
               </Button>
+              <div v-if="hasChoseMaterial" class="flex flex-col items-center">
+                 
+              </div>
+              <div v-else class="flex flex-col items-center">
                 <p class="material-hint">AI会参考添加的文本、图片、视频等素材，完成符合需求的创作</p>
               </div>
             </div>
@@ -134,7 +138,7 @@
     <!-- 原料库子组件：使用:visible和@update:visible替代v-model -->
     <RawMaterialDrawer
       :visible="showDrawer2"
-      @update:visible="val => showDrawer2 = val"
+      @update:visible="(val) => (showDrawer2 = val)"
       :query="materialQuery"
       @after-visible-change="handleMaterialDrawerVisibleChange"
       @confirm="handleMaterialConfirm"
@@ -144,7 +148,7 @@
     <!-- 成品库子组件：使用:visible和@update:visible替代v-model -->
     <FinishedProductDrawer
       :visible="showDrawer3"
-      @update:visible="val => showDrawer3 = val"
+      @update:visible="(val) => (showDrawer3 = val)"
       :query="productQuery"
       @after-visible-change="handleProductDrawerVisibleChange"
       @confirm="handleProductConfirm"
@@ -229,14 +233,15 @@ const selectedMaterials = ref({
   keys: [],
   data: [],
   text: '',
-  images: []
+  images: [],
+  texts: []
 });
 
 const selectedProducts = ref({
   keys: [],
   data: [],
   text: '',
-  images: []
+  images: [],
 });
 
 // 处理AI/成品库选择切换
@@ -265,11 +270,13 @@ const handleAddContent = () => {
 
 // 处理原料库选择确认
 const handleMaterialConfirm = (result) => {
+  console.log('handleMaterialConfirm', result);
   selectedMaterials.value = {
     keys: result.selectedKeys,
     data: result.selectedData,
     text: result.choseText,
-    images: result.choseImgArray
+    images: result.choseImgArray,
+    texts: result.selectedTexts || []
   };
   hasChoseMaterial.value = result.selectedKeys.length > 0;
 };
@@ -285,7 +292,7 @@ const handleProductConfirm = (result) => {
     keys: result.selectedKeys,
     data: result.selectedData,
     text: result.choseText,
-    images: result.choseImgArray
+    images: result.choseImgArray,
   };
 };
 

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

@@ -74,13 +74,6 @@
         <div class="flex items-center">
           <div class="color-#737478 font-size-14px">已选择：</div>
           <div class="color-#737478 font-size-14px">{{ choseText }}</div>
-          <div v-for="item in choseImgArray" :key="item.id" class="ml-16px">
-            <img
-              :src="item.cover ? item.cover : icon4"
-              alt="选中的内容"
-              class="w-44px h-44px border-rounded-8px bg-#F0EDFF"
-            />
-          </div>
         </div>
         <div class="flex justify-end">
           <Button @click="handleCancel">取消</Button>
@@ -182,22 +175,22 @@ 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;
+  // }, {});
 
-  // 统计各类型数量
+  // // 生成选中文本
-  const typeCount = filteredData.reduce((acc, item) => {
+  // choseText.value = [];
-    const typeKey = item.type === EnumManuscriptType.Image ? 'image' : 'video';
+  // if (typeCount.image) choseText.value.push(`图文: ${typeCount.image}个`);
-    acc[typeKey] = (acc[typeKey] || 0) + 1;
+  // if (typeCount.video) choseText.value.push(`视频: ${typeCount.video}个`);
-    return acc;
+  // choseText.value = choseText.value.join(' ');
-  }, {});
 
-  // 生成选中文本
+  // // 筛选选中的内容用于预览
-  choseText.value = [];
+  // choseImgArray.value = filteredData;
-  if (typeCount.image) choseText.value.push(`图文: ${typeCount.image}个`);
-  if (typeCount.video) choseText.value.push(`视频: ${typeCount.video}个`);
-  choseText.value = choseText.value.join(' ');
-
-  // 筛选选中的内容用于预览
-  choseImgArray.value = filteredData;
 });
 
 // 格式化审核状态显示

src/views/property-marketing/assignment-management/components/raw-material-drawer.vue

@@ -22,7 +22,11 @@
     >
       <template #name="{ record }">
         <div class="name-cell flex items-center">
-          <img :src="record.cover" alt="类型图标" class="w-44px h-44px border-rounded-8px bg-#F0EDFF" />
+          <img
+            :src="record.type == 2 ? icon5 : record.cover"
+            alt="类型图标"
+            class="w-44px h-44px border-rounded-8px bg-#F0EDFF"
+          />
           <div class="flex flex-col ml-8px">
             <span class="material-name">{{ record.name }}</span>
             <span class="material-type">{{ record.uid }}</span>
@@ -72,6 +76,15 @@
               class="w-44px h-44px border-rounded-8px bg-#F0EDFF"
             />
           </div>
+          <div
+            v-for="item in choseTextArray"
+            :key="item.id"
+            class="ml-16px bg-#F7F8FA h-44px overflow-hidden w-75px border-rounded-8px flex items-center"
+          >
+            <div class="whitespace-nowrap overflow-hidden text-ellipsis w-full px-2" :title="item.name">
+              {{ item.name }}
+            </div>
+          </div>
         </div>
         <div class="flex justify-end">
           <Button @click="handleCancel">取消</Button>
@@ -94,6 +107,7 @@ import icon2 from '@/assets/img/creative-generation-workshop/icon-photo.png';
 import icon3 from '@/assets/img/creative-generation-workshop/icon-video.png';
 import icon4 from '@/assets/img/error-img.png';
 import { RawMaterialType } from '@/views/material-center/components/raw-material/constants';
+import icon5 from '../../../../views/material-center/components/raw-material/img/icon-no-text.png';
 // 定义Props
 const props = defineProps({
   visible: {
@@ -133,14 +147,27 @@ const getOrigin = (origin: number): string => {
   };
   return fromMap[origin] || '未知';
 };
-// 定义Emits
+// 定义Emits类型
-const emit = defineEmits(['update:visible', 'after-visible-change', 'confirm', 'cancel']);
+const emit = defineEmits<{
-
+  (e: 'update:visible', value: boolean): void;
+  (e: 'after-visible-change', visible: boolean): void;
+  (
+    e: 'confirm',
+    data: {
+      selectedKeys: string[];
+      selectedData: any[];
+      choseText: string;
+      choseImgArray: any[];
+      selectedTexts: string[];
+    },
+  ): void;
+  (e: 'cancel'): void;
+}>();
 // 内部状态管理
 const materialData = ref([]);
 const choseText = ref('');
 const choseImgArray = ref([]);
-
+const choseTextArray = ref([]);
 // 表格列配置
 const columns = ref([
   { title: '文件名称', dataIndex: 'name', width: 200, slots: { customRender: 'name' } },
@@ -188,21 +215,20 @@ watchEffect(() => {
 watch(selectedRowKeys, (newKeys) => {
   const filteredData = materialData.value.filter((item) => newKeys.includes(item.id));
 
-  // 统计各类型数量
+  const typeCount: Record<string, number> = {};
-  const typeCount = filteredData.reduce((acc, item) => {
+  filteredData.forEach((item) => {
-    const typeKey = item.type === EnumManuscriptType.Image ? 'image' : 'video';
+    typeCount[item.type] = (typeCount[item.type] || 0) + 1;
-    acc[typeKey] = (acc[typeKey] || 0) + 1;
+  });
-    return acc;
-  }, {});
 
-  // 生成选中文本
+  choseText.value = Object.entries(typeCount)
-  choseText.value = [];
+    .map(([type, count]) => {
-  if (typeCount.image) choseText.value.push(`图文: ${typeCount.image}个`);
+      const typeName = getType(Number(type));
-  if (typeCount.video) choseText.value.push(`视频: ${typeCount.video}个`);
+      return `${typeName}: ${count}个`;
-  choseText.value = choseText.value.join(' ');
+    })
+    .join(' ');
 
-  // 筛选选中的内容用于预览
+  choseImgArray.value = filteredData.filter((item) => [0, 1].includes(item.type));
-  choseImgArray.value = filteredData;
+  choseTextArray.value = filteredData.filter((item) => [2].includes(item.type));
 });
 
 // 格式化审核状态显示
@@ -250,11 +276,15 @@ const handleCancel = () => {
 // 确定按钮处理
 const handleOk = () => {
   const selectedData = materialData.value.filter((item) => selectedRowKeys.value.includes(item.id));
+  const selectedTexts = selectedData
+    .filter((item) => item.type === RawMaterialType.Text)
+    .map((item) => item.content || item.name);
   emit('confirm', {
     selectedKeys: selectedRowKeys.value,
     selectedData,
     choseText: choseText.value,
     choseImgArray: choseImgArray.value,
+    selectedTexts: selectedTexts,
   });
   emit('update:visible', false);
 };