jvs-ppt-ui 0.0.19 → 0.0.21

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jvs-ppt-ui",
   "private": false,
-  "version": "0.0.19",
+  "version": "0.0.21",
   "type": "module",
   "main": "./dist/lib/jvs-ppt-ui.umd.js",
   "module": "./dist/lib/jvs-ppt-ui.es.js",
@@ -41,7 +41,7 @@
     "jszip": "^3.10.1",
     "jvs-picker-color-v3": "^0.0.11",
     "jvs-pptxgenjs": "^0.0.8",
-    "jvs-pptxtojson": "^0.0.26",
+    "jvs-pptxtojson": "^0.0.27",
     "svg-pathdata": "^7.2.0",
     "vue": "^3.5.34",
     "vuedraggable": "^4.1.0",

package/src/components/Header.vue

@@ -3923,7 +3923,12 @@ const parsePPTXJSONData = (json: any, zipMeta?: any) => {
             const metrics = getParagraphMetrics(el.content, fontScale, defaultFontSize)
             const shapeEl: any = {
               type: 'shape',
-              id: generateAndRegisterId(el.id),
+              id: generateAndRegisterId(el.id),
+              name: el.name,
+              phType: el.phType,
+              isPlaceholder: el.isPlaceholder,
+              placeholderType: el.placeholderType,
+              placeholder: el.placeholder,
               order: el.order !== undefined ? el.order : undefined,
               width: el.width,
               height: el.height,
@@ -4058,7 +4063,12 @@ const parsePPTXJSONData = (json: any, zipMeta?: any) => {
             const metrics = getParagraphMetrics(el.content, ratio, defaultFontSize)
             const textEl: any = {
               type: 'text',
-              id: generateAndRegisterId(el.id),
+              id: generateAndRegisterId(el.id),
+              name: el.name,
+              phType: el.phType,
+              isPlaceholder: el.isPlaceholder,
+              placeholderType: el.placeholderType,
+              placeholder: el.placeholder,
               order: el.order !== undefined ? el.order : undefined,
               width: el.width,
               height: el.height,
@@ -4425,7 +4435,12 @@ const parsePPTXJSONData = (json: any, zipMeta?: any) => {
 
             const element: any = {
               type: 'shape',
-              id: generateAndRegisterId(el.id),
+              id: generateAndRegisterId(el.id),
+              name: el.name,
+              phType: el.phType,
+              isPlaceholder: el.isPlaceholder,
+              placeholderType: el.placeholderType,
+              placeholder: el.placeholder,
               order: el.order !== undefined ? el.order : undefined,
               width: el.width,
               height: el.height,
@@ -4471,7 +4486,8 @@ const parsePPTXJSONData = (json: any, zipMeta?: any) => {
             }
             element.style.borderColor = el.borderColor || (el.outline?.color || 'transparent')
             element.style.borderWidth = el.borderWidth !== undefined ? `${+(el.borderWidth * ratio).toFixed(2)}px` : (el.outline?.width !== undefined ? `${el.outline.width}px` : '0px')
-            element.style.borderStyle = el.borderType || (el.outline?.style || 'solid')
+            element.style.borderStyle = el.borderType || (el.outline?.style || 'solid')
+            if (el.placeholderType === 'pic' && el.borderWidth > 0) element.style.enableBorder = true
             if (lineCap) {
               element.style.borderLineCap = lineCap
               element.style.strokeLinecap = lineCap === 'round' ? 'round' : (lineCap === 'square' ? 'square' : 'butt')

package/src/components/TemplateGallery.vue

@@ -106,7 +106,7 @@ const subTypeNameMap: Record<StockSubType, string> = {
   Videos: '高清视频'
 }
 
-// 顶层 3-Tab 状态（检索 / 我的素材 / 创建素材）与 jvs_session_v3 鉴权
+// 顶层 3-Tab 状态（联网搜索 / AI生成 / 我的空间）与 jvs_session_v3 鉴权
 export type MaterialMainTab = 'search' | 'mine' | 'create'
 const {
   isDamLoggedIn,
@@ -124,9 +124,9 @@ const guestToastText = ref('请先登录后使用该功能')
 let guestToastTimer: ReturnType<typeof setTimeout> | null = null
 
 function showGuestAuthToast(tabName: string) {
-  guestToastText.value = tabName === '我的素材'
-    ? '请先登录后查看「我的素材」'
-    : '请先登录后使用「创建素材」'
+  guestToastText.value = tabName === '我的空间'
+    ? '请先登录后查看「我的空间」'
+    : '请先登录后使用「AI生成」'
   guestToastVisible.value = true
   if (guestToastTimer) clearTimeout(guestToastTimer)
   guestToastTimer = setTimeout(() => {
@@ -139,7 +139,7 @@ async function handleSwitchMainTab(tab: MaterialMainTab) {
   if (tab !== 'search' && !isDamLoggedIn.value) {
     const verified = await probeRemoteSessionV3(true)
     if (!verified && !isDamLoggedIn.value) {
-      showGuestAuthToast(tab === 'mine' ? '我的素材' : '创建素材')
+      showGuestAuthToast(tab === 'mine' ? '我的空间' : 'AI生成')
       return
     }
   }
@@ -358,7 +358,7 @@ function openCustomListPreview(item: MaterialItem, list: MaterialItem[], e?: Eve
   previewVisible.value = true
 }
 
-// 将「检索」或「我的素材」中的图片一键送入「创建素材」作为参考图
+// 将「联网搜索」或「我的空间」中的图片一键送入「AI生成」作为参考图
 async function handleSendToCreateRef(item: MaterialItem, e?: Event) {
   if (e) {
     e.stopPropagation()
@@ -368,7 +368,7 @@ async function handleSendToCreateRef(item: MaterialItem, e?: Event) {
   if (!isDamLoggedIn.value) {
     const verified = await probeRemoteSessionV3(true)
     if (!verified && !isDamLoggedIn.value) {
-      showGuestAuthToast('创建素材')
+      showGuestAuthToast('AI生成')
       return
     }
   }
@@ -947,7 +947,7 @@ watch([() => materialApiUrl?.value, () => materialPageApiUrl?.value, () => mater
       </button>
     </div>
 
-    <!-- 顶层 3-Tab 分段切换器（检索 | 我的素材 | 创建素材） -->
+    <!-- 顶层 3-Tab 分段切换器（联网搜索 | AI生成 | 我的空间） -->
     <div v-if="activeMainTab !== 'search' || viewMode === 'overview'" class="material-top-tabs-wrap">
       <div class="material-top-segmented">
         <button
@@ -956,22 +956,23 @@ watch([() => materialApiUrl?.value, () => materialPageApiUrl?.value, () => mater
           :class="{ active: activeMainTab === 'search' }"
           @click="handleSwitchMainTab('search')"
         >
-          <span>检索</span>
+          <span>联网搜索</span>
         </button>
 
         <button
           type="button"
           class="material-main-tab-btn"
           :class="{
-            active: activeMainTab === 'mine',
+            active: activeMainTab === 'create',
             'is-disabled': !isDamLoggedIn
           }"
-          :title="!isDamLoggedIn ? '请先登录后查看我的素材' : '查看我的项目与个人素材'"
-          @click="handleSwitchMainTab('mine')"
+          :title="!isDamLoggedIn ? '请先登录后使用AI生成' : 'AI 生成图片或视频素材'"
+          @click="handleSwitchMainTab('create')"
         >
-          <span>我的素材</span>
+          <span>AI生成</span>
+          <span v-if="isDamLoggedIn" class="tab-ai-spark">✦</span>
           <svg
-            v-if="!isDamLoggedIn"
+            v-else
             class="tab-lock-svg"
             viewBox="0 0 24 24"
             width="11"
@@ -989,16 +990,15 @@ watch([() => materialApiUrl?.value, () => materialPageApiUrl?.value, () => mater
           type="button"
           class="material-main-tab-btn"
           :class="{
-            active: activeMainTab === 'create',
+            active: activeMainTab === 'mine',
             'is-disabled': !isDamLoggedIn
           }"
-          :title="!isDamLoggedIn ? '请先登录后使用创建素材' : 'AI 生成图片或视频素材'"
-          @click="handleSwitchMainTab('create')"
+          :title="!isDamLoggedIn ? '请先登录后查看我的空间' : '查看我的项目与个人素材'"
+          @click="handleSwitchMainTab('mine')"
         >
-          <span>创建素材</span>
-          <span v-if="isDamLoggedIn" class="tab-ai-spark">✦</span>
+          <span>我的空间</span>
           <svg
-            v-else
+            v-if="!isDamLoggedIn"
             class="tab-lock-svg"
             viewBox="0 0 24 24"
             width="11"
@@ -1100,7 +1100,7 @@ watch([() => materialApiUrl?.value, () => materialPageApiUrl?.value, () => mater
                     v-if="isDamLoggedIn && cat.subType !== 'Videos' && !isVideoMaterial(item) && getMaterialThumb(item)"
                     type="button"
                     class="overview-card-ref-btn"
-                    title="作为参考图发送到「创建素材」"
+                    title="作为参考图发送到「AI生成」"
                     @click.stop.prevent="handleSendToCreateRef(item, $event)"
                   >
                     @参考
@@ -1251,7 +1251,7 @@ watch([() => materialApiUrl?.value, () => materialPageApiUrl?.value, () => mater
                   v-if="isDamLoggedIn && filterParams.activeSubType !== 'Videos' && !isVideoMaterial(item) && getMaterialThumb(item)"
                   type="button"
                   class="detail-card-ref-btn"
-                  title="作为参考图发送到「创建素材」"
+                  title="作为参考图发送到「AI生成」"
                   @click.stop.prevent="handleSendToCreateRef(item, $event)"
                 >
                   @参考

package/src/components/canvas/elements/CanvasShapeElement.vue

@@ -331,7 +331,7 @@ function getRawText(el: any): string {
 
 function getImagePlaceholderFill(el: any): string {
   const fill = getElementFill(el)
-  if (!fill || fill === '#f1f5f9' || fill === '#f8fafc') {
+  if (!fill || fill === 'none' || fill === 'transparent' || fill === '#f1f5f9' || fill === '#f8fafc') {
     return '#d9dde3'
   }
   return fill
@@ -668,7 +668,7 @@ function formatShapeHtml(el: any): string {
             :rx="getRectRadiusInVb(element).rx"
             :ry="getRectRadiusInVb(element).ry"
             vector-effect="non-scaling-stroke"
-            :fill="hasElementFill(element) ? (getElementPattern(element) ? `url(#shape-pattern-${svgIdKey})` : (getElementGradientConfig(element) ? `url(#shape-gradient-${svgIdKey})` : (getElementFill(element) !== undefined ? getElementFill(element) : '#3b82f6'))) : 'none'"
+            :fill="hasElementFill(element) ? (getElementPattern(element) ? `url(#shape-pattern-${svgIdKey})` : (getElementGradientConfig(element) ? `url(#shape-gradient-${svgIdKey})` : (getElementFill(element) !== undefined ? getElementFill(element) : '#3b82f6'))) : ((isImagePlaceholder && isImagePlaceholder(element)) ? getImagePlaceholderFill(element) : 'none')"
             :stroke="(isImagePlaceholder && isImagePlaceholder(element) && element.style?.enableBorder !== true) ? 'none' : (element.style?.enableBorder === false ? 'none' : getEffectiveBorderColor(element, 'none'))"
             :stroke-width="(isImagePlaceholder && isImagePlaceholder(element) && element.style?.enableBorder !== true) ? 0 : (element.style?.enableBorder === false ? 0 : getElementBorderWidth(element))"
             :stroke-linecap="element.style?.strokeLinecap || element.borderLineCap || element.lineCap || (element.shapType === 'arc' ? 'round' : (isOpenLineShape(element) ? 'butt' : undefined))"
@@ -678,7 +678,7 @@ function formatShapeHtml(el: any): string {
             v-else
             vector-effect="non-scaling-stroke"
             :d="element.path || element.content"
-            :fill="hasElementFill(element) ? (getElementPattern(element) ? `url(#shape-pattern-${svgIdKey})` : (getElementGradientConfig(element) ? `url(#shape-gradient-${svgIdKey})` : (getElementFill(element) !== undefined ? getElementFill(element) : '#3b82f6'))) : 'none'"
+            :fill="hasElementFill(element) ? (getElementPattern(element) ? `url(#shape-pattern-${svgIdKey})` : (getElementGradientConfig(element) ? `url(#shape-gradient-${svgIdKey})` : (getElementFill(element) !== undefined ? getElementFill(element) : '#3b82f6'))) : ((isImagePlaceholder && isImagePlaceholder(element)) ? getImagePlaceholderFill(element) : 'none')"
             :stroke="(isImagePlaceholder && isImagePlaceholder(element) && element.style?.enableBorder !== true) ? 'none' : (element.style?.enableBorder === false ? 'none' : getEffectiveBorderColor(element, 'none'))"
             :stroke-width="(isImagePlaceholder && isImagePlaceholder(element) && element.style?.enableBorder !== true) ? 0 : (element.style?.enableBorder === false ? 0 : getElementBorderWidth(element))"
             :stroke-linecap="element.style?.strokeLinecap || element.borderLineCap || element.lineCap || (element.shapType === 'arc' ? 'round' : (isOpenLineShape(element) ? 'butt' : undefined))"

package/src/utils/canvas/elementStyles.ts

@@ -804,7 +804,7 @@ export function isImagePlaceholder(el: any): boolean {
 
   if (el.id && typeof el.id === 'string' && (el.id.includes('ph-image') || el.id.includes('image-ph') || el.id.includes('placeholder-image'))) return true
   if (el.name && typeof el.name === 'string' && (el.name.includes('图片占位符') || el.name.includes('图片框'))) return true
-  if (el.role === 'image' || el.placeholderType === 'image' || el.placeholderType === 'pic' || el.placeholder?.type === 'pic' || el.placeholder?.type === 'image') return true
+  if (el.phType === 'pic' || el.phType === 'picture' || el.phType === 'clipArt' || el.role === 'image' || el.placeholderType === 'image' || el.placeholderType === 'pic' || el.placeholder?.type === 'pic' || el.placeholder?.type === 'image') return true
 
   const rawText = typeof el.text === 'string' ? el.text : (typeof el.content === 'string' ? el.content : '')
   const textHtml = rawText.toLowerCase()