🎨 修改首页细节显示问题

src/assets/scss/fix.scss

@@ -46,6 +46,11 @@
     }
   }
 }
+.ant-descriptions.light {
+  .ant-descriptions-view {
+    background-color: #fff;
+  }
+}
 
 @media screen and (max-width: 768px) {
   .dynamic-form-group {

src/components/display/SimpleRichHtml.vue

@@ -13,6 +13,10 @@
           v-html="content"
         />
       </template>
+      <div v-if="!contents || contents.length === 0 || (contents.length === 1 && !contents[0])" class="w-100 text-center">
+        <ExclamationCircleOutlined />
+        <div>暂无数据</div>
+      </div>
       <slot name="append" />
     </div>
     <div class="rich-html-catalog" v-if="catalog && catalogItems.length > 0">
@@ -28,6 +32,7 @@
 import { RandomUtils } from '@imengyu/imengyu-utils';
 import CommonCatalog, { type CatalogItem } from '../content/CommonCatalog.vue';
 import { onBeforeUnmount, onMounted, ref, watch, type PropType } from 'vue';
+import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
 
 const props = defineProps({	
   contents: {
@@ -98,16 +103,12 @@ function generateCatalog() {
 }
 
 watch(() => props.contents, () => {
-  if (import.meta.server)
-    return;
   setTimeout(() => {
     generateCatalog();
   }, 200);
 }, { immediate: true })
 
 onBeforeUnmount(() => {
-  if (import.meta.server)
-    return;
   if (lastStyleTag) {
     lastStyleTag.parentElement?.removeChild(lastStyleTag);
     lastStyleTag = null;

src/components/parts/EmptyToRecord.vue

@@ -50,6 +50,7 @@ defineProps({
         :message="`点击这里可以修改 ${title} 信息`"
         type="info"
         show-icon
+        @click="emit('edit')"
       >
         <template #action>
           <a-space>

src/pages/forms/inheritor.vue

@@ -75,7 +75,7 @@ const formOptions = ref<IDynamicFormOptions>({
         { label: '保护单位', name: 'unit', type: 'text', additionalProps: { placeholder: '请输入单位' } },
         { label: '传承人简介', name: 'intro', type: 'richtext', additionalProps: { placeholder: '请输入简介' } },
         //{ label: '详情', name: 'content', type: 'richtext', additionalProps: { placeholder: '请输入详情' } },
-        { label: '奖项-成就', name: 'prize', type: 'richtext', additionalProps: { placeholder: '请输入奖项-成就' } },
+        { label: '奖项/成就', name: 'prize', type: 'richtext', additionalProps: { placeholder: '请输入奖项-成就' } },
         { label: '传承人谱系', name: 'pedigree', type: 'richtext', additionalProps: { placeholder: '请输入传承谱系' } },
         { 
           label: '传承人照片', name: 'images', type: 'mulit-image',

src/pages/inheritor.vue

@@ -20,24 +20,25 @@
                   <a-button size="small" type="primary" @click="router.push({ name: 'FormIch' })">去修改</a-button>
                 </template>
               </a-alert>
-              <a-descriptions class="mt-3" title="非遗项目信息" v-if="ichData.content.value" bordered :column="{ xs: 1, sm: 1, md: 1, lg: 2 }">
-                <a-descriptions-item label="标题"><ShowValueOrNull :value="ichData.content.value.title" /></a-descriptions-item>
-                <a-descriptions-item label="简介" :span="3"><SimpleRichHtml :contents="[ ichData.content.value.intro ]" /></a-descriptions-item>
-                <a-descriptions-item label="类别"><ShowValueOrNull :value="ichData.content.value.ichTypeText" /></a-descriptions-item>
+              <a-descriptions class="mt-3 light" title="非遗项目信息" v-if="ichData.content.value" bordered :column="{ xs: 1, sm: 1, md: 1, lg: 2 }">
+                <a-descriptions-item label="非遗项目名称"><ShowValueOrNull :value="ichData.content.value.title" /></a-descriptions-item>
+                <a-descriptions-item label="非遗分类"><ShowValueOrNull :value="ichData.content.value.ichTypeText" /></a-descriptions-item>
+                <a-descriptions-item label="申报区域"><ShowValueOrNull :value="ichData.content.value.regionText" /></a-descriptions-item>
                 <a-descriptions-item label="级别"><ShowValueOrNull :value="ichData.content.value.levelText" /></a-descriptions-item>
                 <a-descriptions-item label="批次"><ShowValueOrNull :value="ichData.content.value.batchText" /></a-descriptions-item>
-                <a-descriptions-item label="区域"><ShowValueOrNull :value="ichData.content.value.regionText" /></a-descriptions-item>
+                <a-descriptions-item label="非遗项目简介" :span="3"><SimpleRichHtml :contents="[ ichData.content.value.intro ]" /></a-descriptions-item>
+                <a-descriptions-item label="传承谱系" :span="3"><SimpleRichHtml :contents="[ ichData.content.value.pedigree as string ]" /></a-descriptions-item>
                 <a-descriptions-item label="保护单位"><ShowValueOrNull :value="ichData.content.value.unit" /></a-descriptions-item>
                 <a-descriptions-item label="非遗项目相关图片">
                   <ImageGrid :data="ichData.content.value.images" />
                 </a-descriptions-item>
-                <a-descriptions-item v-if="ichData.content.value.video" label="视频">
+                <a-descriptions-item v-if="ichData.content.value.video" label="相关视频">
                   <video controls :src="ichData.content.value.video" style="max-width:300px;" />
                 </a-descriptions-item>
-                <a-descriptions-item v-if="ichData.content.value.audio" label="音频">
+                <a-descriptions-item v-if="ichData.content.value.audio" label="相关音频">
                   <audio controls :src="ichData.content.value.audio" style="max-width:300px;" />
                 </a-descriptions-item>
-                <a-descriptions-item v-if="ichData.content.value.latitude && ichData.content.value.longitude" label="地图">
+                <a-descriptions-item v-if="ichData.content.value.latitude && ichData.content.value.longitude" label="地图坐标">
                   <SimplePointedMap :longitude="ichData.content.value.longitude" :latitude="ichData.content.value.latitude" :zoom="15" height="300px"  />
                 </a-descriptions-item>
               </a-descriptions>
@@ -50,7 +51,7 @@
                   <a-button size="small" type="primary" @click="router.push({ name: 'FormInheritor' })">去修改</a-button>
                 </template>
               </a-alert>
-              <a-descriptions class="mt-3" title="传承人信息" v-if="inheritorData.content.value" bordered :column="{ xs: 1, sm: 1, md: 1, lg: 2 }">
+              <a-descriptions class="mt-3 light" title="传承人信息" v-if="inheritorData.content.value" bordered :column="{ xs: 1, sm: 1, md: 1, lg: 2 }">
                 <a-descriptions-item label="名字"><ShowValueOrNull :value="inheritorData.content.value.title" /></a-descriptions-item>
                 <a-descriptions-item label="传承人照片">
                   <ImageGrid :data="inheritorData.content.value.images" />
@@ -58,21 +59,19 @@
                 <a-descriptions-item v-if="inheritorData.content.value.video" label="传承人相关视频">
                   <video controls :src="inheritorData.content.value.video" style="max-width:300px;" />
                 </a-descriptions-item>
+
                 <a-descriptions-item label="传承人等级"><ShowValueOrNull :value="inheritorData.content.value.levelText" /></a-descriptions-item>
                 <a-descriptions-item label="传承人批次"><ShowValueOrNull :value="inheritorData.content.value.batchText" /></a-descriptions-item>
-                <a-descriptions-item label="时代"><ShowValueOrNull :value="inheritorData.content.value.age" /></a-descriptions-item>
                 <a-descriptions-item label="民族"><ShowValueOrNull :value="inheritorData.content.value.nation" /></a-descriptions-item>
                 <a-descriptions-item label="籍贯"><ShowValueOrNull :value="inheritorData.content.value.birthplace" /></a-descriptions-item>
                 <a-descriptions-item label="出生日期"><ShowValueOrNull :value="inheritorData.content.value.dateBirth" /></a-descriptions-item>
                 <a-descriptions-item label="单位"><ShowValueOrNull :value="inheritorData.content.value.unit" /></a-descriptions-item>
                 <a-descriptions-item label="区域"><ShowValueOrNull :value="inheritorData.content.value.regionText" /></a-descriptions-item>
 
-                <a-descriptions-item label="简介" :span="3"><SimpleRichHtml :contents="[ inheritorData.content.value.intro ]" /></a-descriptions-item>
+                <a-descriptions-item label="传承人简介" :span="3"><SimpleRichHtml :contents="[ inheritorData.content.value.intro ]" /></a-descriptions-item>
                 <a-descriptions-item label="奖项/成就" :span="3"><SimpleRichHtml :contents="[ inheritorData.content.value.prize ]" /></a-descriptions-item>
-                      
-                <a-descriptions-item v-if="inheritorData.content.value.images" label="代表性图片">
-                  <ImageGrid :data="inheritorData.content.value.images" />
-                </a-descriptions-item>
+                <a-descriptions-item label="传承人谱系" :span="3"><SimpleRichHtml :contents="[ inheritorData.content.value.pedigree as string ]" /></a-descriptions-item>
+               
                 <a-descriptions-item v-if="inheritorData.content.value.video" label="视频">
                   <video controls :src="inheritorData.content.value.video" style="max-width:300px;" />
                 </a-descriptions-item>
@@ -85,35 +84,26 @@
           <a-tab-pane key="3" tab="传习所">
             <EmptyToRecord title="传习所" :loader="seminarData" @edit="router.push({ name: 'FormSeminar' })">
               <a-alert v-if="seminarData.content.value?.progress == -1" message="提交的信息被退回，您可以去修改" type="warning" showIcon></a-alert>
-              <a-descriptions class="mt-3" title="传习所信息" v-if="seminarData.content.value" bordered :column="{ xs: 1, sm: 1, md: 1, lg: 2 }">
-                <a-descriptions-item label="标题"><ShowValueOrNull :value="seminarData.content.value.title" /></a-descriptions-item>
-                <a-descriptions-item label="简介" :span="3"><SimpleRichHtml :contents="[ seminarData.content.value.intro as string ]" /></a-descriptions-item>
-                <a-descriptions-item v-if="seminarData.content.value.latitude && seminarData.content.value.longitude" label="地图">
+              <a-descriptions class="mt-3 light" title="传习所信息" v-if="seminarData.content.value" bordered :column="{ xs: 1, sm: 1, md: 1, lg: 2 }">
+                <a-descriptions-item label="传习所名称"><ShowValueOrNull :value="seminarData.content.value.title" /></a-descriptions-item>
+                <a-descriptions-item label="传习所级别"><ShowValueOrNull :value="seminarData.content.value.levelText" /></a-descriptions-item>
+                <a-descriptions-item label="批次"><ShowValueOrNull :value="seminarData.content.value.batchText" /></a-descriptions-item>
+                <a-descriptions-item label="传习所介绍" :span="3"><SimpleRichHtml :contents="[ seminarData.content.value.intro as string ]" /></a-descriptions-item>
+                <a-descriptions-item label="传习所地址"><ShowValueOrNull :value="seminarData.content.value.address" /></a-descriptions-item>
+                <a-descriptions-item v-if="seminarData.content.value.latitude && seminarData.content.value.longitude" label="地图坐标">
                   <SimplePointedMap :longitude="seminarData.content.value.longitude" :latitude="seminarData.content.value.latitude" :zoom="15" height="300px"  />
                 </a-descriptions-item>
+                <a-descriptions-item label="传习所/保护单位类型"><ShowValueOrNull :value="seminarData.content.value.ichSiteTypeText" /></a-descriptions-item>
+                <a-descriptions-item label="是否对游客开放">{{seminarData.content.value.visit ? '是' : '否'}}</a-descriptions-item>
 
                 <a-descriptions-item v-if="seminarData.content.value.image" label="图片">
                   <a-image :src="seminarData.content.value.image" style="max-width:300px;" />
                 </a-descriptions-item>
-                <a-descriptions-item v-if="seminarData.content.value.video" label="视频">
-                  <video controls :src="seminarData.content.value.video" style="max-width:300px;" />
-                </a-descriptions-item>
-                <a-descriptions-item v-if="seminarData.content.value.audio" label="音频">
-                  <audio controls :src="seminarData.content.value.audio" style="max-width:300px;" />
-                </a-descriptions-item>
-                <a-descriptions-item label="地址"><ShowValueOrNull :value="seminarData.content.value.address" /></a-descriptions-item>
-                <a-descriptions-item label="批次"><ShowValueOrNull :value="seminarData.content.value.batchText" /></a-descriptions-item>
-                <a-descriptions-item label="级别"><ShowValueOrNull :value="seminarData.content.value.levelText" /></a-descriptions-item>
-                
+                    
                 <a-descriptions-item label="联系人"><ShowValueOrNull :value="seminarData.content.value.contact" /></a-descriptions-item>
                 <a-descriptions-item label="联系电话"><ShowValueOrNull :value="seminarData.content.value.mobile" /></a-descriptions-item>
                 
-                <a-descriptions-item label="单位类型"><ShowValueOrNull :value="seminarData.content.value.ichSiteTypeText" /></a-descriptions-item>
-                <a-descriptions-item label="单位"><ShowValueOrNull :value="seminarData.content.value.unit" /></a-descriptions-item>
-                
-                <a-descriptions-item v-if="seminarData.content.value.latitude && seminarData.content.value.longitude" label="地图">
-                  <SimplePointedMap :longitude="seminarData.content.value.longitude" :latitude="seminarData.content.value.latitude" :zoom="15" height="300px"  />
-                </a-descriptions-item>
+
               </a-descriptions>
             </EmptyToRecord>
           </a-tab-pane>