yz-enamel-exhibition/packages/mobile/src/views/Chapter3/index.vue

<template>
  <ChapterLayout border-color="#C9AE8E">
    <div class="chapter3">
      <img class="chapter3-img" src="./images/1-min.png" />

      <p class="chapter3-content">
        明清时期，随着金石学的发展和文人士大夫对古器物的热衷，仿古礼器制作达到一个高峰。这一时期，模仿古代青铜器或其他古代器物的造型、纹样和风格，结合珐琅工艺制作而成的工艺品也受到帝王及贵族的追捧，用于祭祀、陈设或把玩。
      </p>

      <div class="chapter3-list">
        <Card2
          title="《雍正行乐图册》"
          author="清 佚名 （故宫博物院藏）"
          content="某冬日，雍正帝在书房内炭火旁悠然阅读。室内书架及桌面放有珐琅器。"
          @click="
            $router.push({
              name: 'detail',
              params: { chapter: 'chapter3', index: 5 },
            })
          "
        >
          <template #img>
            <img class="img1" draggable="false" src="./images/2-min.jpg" />
          </template>
        </Card2>

        <Card2
          title="《月曼清游图册》"
          author="清 陈枚 （故宫博物院藏）"
          content="画面内容为宫内的妃子们在赏玩收藏的画卷及青铜器。"
          @click="
            $router.push({
              name: 'detail',
              params: { chapter: 'chapter3', index: 7 },
            })
          "
        >
          <template #img>
            <img class="img2" draggable="false" src="./images/3-min.jpg" />
          </template>
        </Card2>
      </div>

      <div class="chapter3-card">
        <div class="chapter3-card-inner">
          <p class="chapter3-card-label">《弘历观画图轴》</p>
          <span> 郎世宁 （故宫博物院藏）</span>
          <p class="chapter3-card-content">
            画中乾隆皇帝命人打开画轴，进行品评，其旁边桌上放有珐琅瓷器、哥窑瓷壶、熏炉、青铜钟等，应均是乾隆收藏或仿制的器物。
          </p>
        </div>
        <img src="./images/4-min.jpg" />
      </div>

      <img class="chapter3-label" src="./images/label-min.png" />

      <p class="chapter3-content2">
        明清时期，依据商周时期青铜器造型、纹饰等，运用掐丝珐琅工艺制作的珐琅器，一般称为仿古珐琅器。清代乾隆年间，下令制作了许多仿古珐琅作品，有鬲（炉）、尊、壶、觥、觚、甗等，这些多源自商周青铜器，并在其基础上进行了创新和发展。
      </p>

      <div class="chapter3-list2">
        <div>
          <img src="./images/5-min.png" />
          <p>商周青铜器</p>
        </div>
        <div>
          <img src="./images/6-min.png" />
          <p>明清珐琅器</p>
        </div>
      </div>

      <div class="chapter3-list3">
        <Card
          v-for="index in LIST"
          :key="index"
          chapter="chapter3"
          :detail="data.chapter3[index + 1]"
          @click="
            $router.push({
              name: 'detail',
              params: { chapter: 'chapter3', index: index + 1 },
            })
          "
        />
      </div>
    </div>
  </ChapterLayout>
</template>

<script setup>
import { data } from "@enamel/base";
import Card from "@/components/Card.vue";
import Card2 from "@/components/Card2.vue";
import ChapterLayout from "@/components/ChapterLayout.vue";

const LIST = [0, 1, 2, 3];
</script>

<style lang="scss" scoped>
@use "./index.scss";
</style>