From 72f8190d33b5e6f1b64b848048f315cf530bc6ef Mon Sep 17 00:00:00 2001
From: 闫增涛 <1829501689@qq.com>
Date: 星期五, 31 五月 2024 17:18:05 +0800
Subject: [PATCH] 艺术分页

---
 src/books/English/view/components/header.vue |  305 +++++++++++++++++++++++++++++++++-----------------
 1 files changed, 199 insertions(+), 106 deletions(-)

diff --git a/src/books/English/view/components/header.vue b/src/books/English/view/components/header.vue
index ea2dca7..76f5e03 100644
--- a/src/books/English/view/components/header.vue
+++ b/src/books/English/view/components/header.vue
@@ -1,117 +1,186 @@
 <template>
-  <div class="chapter" num="0">
+  <div class="chapter" num="1">
+    <!--  -->
+    <div class="page-box mt-20" page="1">
+      <div v-if="showPageList.indexOf(1) > -1">
+          <img class="img-0" alt="" src="../../assets/images/Cover.jpg" />
+      </div>
+    </div>
     <!-- 1 -->
-    <div class="page-box" page="1">
-      <p class="center"><img class="img-0" alt="" src="image/SMY.jpg" /></p>
+    <div class="page-box" page="2">
+      <div v-if="showPageList.indexOf(2) > -1">
+          <img class="img-0" alt="" src="../../assets/images/SMY.jpg" />
+      </div>
     </div>
     <!-- 2 -->
-    <div class="page-box" page="2">
-      <div class="bodystyle">
-        <p><b>鍥句功鍦ㄧ増缂栫洰锛圕IP锛夋暟鎹�</b></p>
-        <p>
+    <div class="page-box text-center" style="padding: 136px 0" page="3">
+      <div class="box" v-if="showPageList.indexOf(3) > -1">
+        <hr class="line" />
+        <p class="tl fz-14"><b>鍥句功鍦ㄧ増缂栫洰锛圕IP锛夋暟鎹�</b></p>
+        <p class="tl fz-14 m0">
           鏂版爣鍑嗛�氱敤鑱屽満鑻辫锛氬熀纭�妯″潡涓�/鍒樺ぇ鍒╋紝缃楀繝鏄庯紝閭撳啲鑷充富缂�.鈥斿寳浜細鍖椾含甯堣寖澶у鍑虹増绀撅紝2023.9
         </p>
-        <p>鏂版爣鍑嗛�氱敤鑱屽満鑻辫/鐜嬫湞鏅栨�讳富缂�</p>
-        <p>ISBN 978-7-303-29145-8</p>
-        <p>鈪�.鈶犳柊鈥� 鈪�.鈶犲垬鈥︹憽缃椻�︹憿閭撯�� 鈪�.鈶犺嫳璇�-楂樼瓑鑱屼笟鏁欒偛-鏁欐潗 鈪�.鈶燞319.39</p>
-        <p>涓浗鐗堟湰鍥句功棣咰IP鏁版嵁鏍稿瓧锛�2023锛夌092550鍙�</p>
-        <p><br /></p>
-        <p><br /></p>
-        <p><b>鍥句功鎰忚鍙嶉 gaozhifk@bnupg.com 010-58805079</b></p>
-        <p>钀ラ攢涓績鐢佃瘽 010-58802755 58800035</p>
-        <p><br /></p>
-        <p>鍑虹増鍙戣锛氬寳浜笀鑼冨ぇ瀛﹀嚭鐗堢ぞ www.bnup.com</p>
-        <p>銆�銆�銆�銆�銆�鍖椾含甯傝タ鍩庡尯鏂拌鍙e澶ц12-3鍙�</p>
-        <p>銆�銆�銆�銆�銆�閭斂缂栫爜锛�100088</p>
-        <p>鍗般��銆�鍒凤細鍖椾含鐩涢�氬嵃鍒疯偂浠芥湁闄愬叕鍙�</p>
-        <p>缁忋��銆�閿�锛氬叏鍥芥柊鍗庝功搴�</p>
-        <p>寮�銆�銆�鏈細889mm脳1194mm 1/16</p>
-        <p>鍗般��銆�寮狅細10.25</p>
-        <p>瀛椼��銆�鏁帮細246鍗冨瓧</p>
-        <p>鐗堛��銆�娆★細2023骞�9鏈堢1鐗�</p>
-        <p>鍗般��銆�娆★細2023骞�9鏈堢1娆″嵃鍒�</p>
-        <p>瀹氥��銆�浠凤細48.80鍏�</p>
-        <p>绛栧垝缂栬緫锛氭槗鏂�</p>
-        <p>璐d换缂栬緫锛氶檲鍊�</p>
-        <p>缇庢湳缂栬緫锛氶檲娑� 鐒︿附</p>
-        <p>瑁呭抚璁捐锛氶檲娑� 鐒︿附</p>
-        <p>璐d换鏍″锛氶檲鑽�</p>
-        <p>璐d换鍗板埗锛氶┈娲�</p>
-        <p class="center"><b>鐗堟潈鎵�鏈� 渚垫潈蹇呯┒</b></p>
-        <p class="center"><b>鍙嶇洍鐗堛�佷镜鏉冧妇鎶ョ數璇濓細</b>010-58800697</p>
-        <p class="block2">鍖椾含璇昏�呮湇鍔¢儴鐢佃瘽锛�010-58808104</p>
-        <p class="block2">澶栧煚閭喘鐢佃瘽锛�010-58808083</p>
-        <p class="block2">鏈功濡傛湁鍗拌璐ㄩ噺闂锛岃涓庡嵃鍒剁鐞嗛儴鑱旂郴璋冩崲銆�</p>
-        <p class="block2">鍗板埗绠$悊閮ㄧ數璇濓細010-58808284</p>
+        <p class="fz-14 m0">鏂版爣鍑嗛�氱敤鑱屽満鑻辫/鐜嬫湞鏅栨�讳富缂�</p>
+        <p class="tl m0 fz-14" style="margin-bottom: 10px">
+          ISBN 978-7-303-29145-8
+        </p>
+        <p class="tl fz-14 m0" style="margin-bottom: 10px">
+          鈪�.鈶犳柊鈥� 鈪�.鈶犲垬鈥︹憽缃椻�︹憿閭撯�� 鈪�.鈶犺嫳璇�-楂樼瓑鑱屼笟鏁欒偛-鏁欐潗 鈪�.鈶燞319.39
+        </p>
+        <p class="tl fz-14">涓浗鐗堟湰鍥句功棣咰IP鏁版嵁鏍稿瓧锛�2023锛夌092550鍙�</p>
+        <hr class="line" style="height: 1px" />
+        <p class="tl fz-14 mb-0" style="margin-top: 136px">
+          <b>鍥句功鎰忚鍙嶉 gaozhifk@bnupg.com 010-58805079</b>
+        </p>
+        <p class="tl fz-14 mt-100">钀ラ攢涓績鐢佃瘽 010-58802755 58800035</p>
+        <hr class="line" style="height: 1px" />
+        <p class="tl fz-14 m0">鍑虹増鍙戣锛氬寳浜笀鑼冨ぇ瀛﹀嚭鐗堢ぞ www.bnupg.com</p>
+        <p class="tl fz-14 m0">銆�銆�銆�銆�銆�鍖椾含甯傝タ鍩庡尯鏂拌鍙e澶ц12-3鍙�</p>
+        <p class="tl fz-14 m0">銆�銆�銆�銆�銆�閭斂缂栫爜锛�100088</p>
+        <p class="tl fz-14 m0">鍗般��銆�鍒凤細鍖椾含鐩涢�氬嵃鍒疯偂浠芥湁闄愬叕鍙�</p>
+        <p class="tl fz-14 m0">缁忋��銆�閿�锛氬叏鍥芥柊鍗庝功搴�</p>
+        <p class="tl fz-14 m0">寮�銆�銆�鏈細889mm脳1194mm 1/16</p>
+        <p class="tl fz-14 m0">鍗般��銆�寮狅細10.25</p>
+        <p class="tl fz-14 m0">瀛椼��銆�鏁帮細246鍗冨瓧</p>
+        <p class="tl fz-14 m0">鍗般��銆�娆★細2023骞�9鏈堢1娆″嵃鍒�</p>
+        <p class="tl fz-14 m0">鍗般��銆�娆★細2024骞�2鏈堢23娆″嵃鍒�</p>
+        <p class="tl fz-14 m0">瀹氥��銆�浠凤細48.80鍏�</p>
+        <hr class="line" />
+        <ul class="fl ju-bt m0" style="padding: 0">
+          <li>
+            <p class="tl fz-14 m0">绛栧垝缂栬緫锛氭槗鏂�</p>
+            <p class="tl fz-14 m0">缇庢湳缂栬緫锛氶檲娑� 鐒︿附</p>
+            <p class="tl fz-14 m0">璐d换鏍″锛氶檲鑽�</p>
+          </li>
+          <li>
+            <p class="tl fz-14 m0">璐d换缂栬緫锛氶檲鍊�</p>
+            <p class="tl fz-14 m0">瑁呭抚璁捐锛氶檲娑� 鐒︿附</p>
+            <p class="tl fz-14 m0">璐d换鍗板埗锛氶┈娲�</p>
+          </li>
+        </ul>
+        <p class="center mb-0" style="margin-top: 20px; font-size: 20px">
+          <b>鐗堟潈鎵�鏈�&nbsp;&nbsp;渚垫潈蹇呯┒</b>
+        </p>
+        <p class="center m0"><b>鍙嶇洍鐗堛�� 渚垫潈涓炬姤鐢佃瘽锛�</b>010-58800697</p>
+        <p class="block2 m0">鍖椾含璇昏�呮湇鍔¢儴鐢佃瘽锛�010-58808104</p>
+        <p class="block2 m0">澶栧煚閭喘鐢佃瘽锛�010-58808083</p>
+        <p class="block2 m0 wh-nr">
+          鏈功濡傛湁鍗拌璐ㄩ噺闂锛� 璇蜂笌鍗板埗绠$悊閮ㄨ仈绯昏皟鎹€��
+        </p>
+        <p class="block2 m0">鍗板埗绠$悊閮ㄧ數璇濓細010-58805079</p>
       </div>
     </div>
     <!-- 3 -->
-    <div class="page-box" page="3">
-      <div class="bodystyle">
-        <h1 id="a003" class="front">鍓嶈█</h1>
-        <p>
-          銆婃柊鏍囧噯閫氱敤鑱屽満鑻辫銆嬬殑缂栧啓鍥㈤槦浠ュ厷鐨勬暀鑲叉柟閽堜负瀹楁棬锛岃疮褰诲厷鐨勪簩鍗佸ぇ鎶ュ憡绮剧锛屽鏍囥�婇珮绛夎亴涓氭暀鑲蹭笓绉戣嫳璇绋嬫爣鍑嗭紙2021骞寸増锛夈�嬶紝閬靛惊銆婇珮绛夊鏍¤绋嬫�濇斂寤鸿鎸囧绾茶銆嬬殑瑕佹眰锛屽弬鐓с�婁腑鍥借嫳璇兘鍔涚瓑绾ч噺琛ㄣ�嬪洓绾у拰浜旂骇鑳藉姏瑕佹眰锛岀珛瓒抽珮鑱岃嫳璇暀瀛﹀疄闄咃紝杩涜璁捐鍜岀紪鍐欙紝鏃㈡敞閲嶆彁鍗囧鐢熺殑鏍稿績绱犲吇銆佷績杩涙櫘鑱岃瀺閫氾紝鍙堝叏鏂逛綅铻嶅叆璇剧▼鎬濇斂锛岃惤瀹炵珛寰锋爲浜烘牴鏈换鍔°��
-        </p>
-        <p class="center"><b>涓�銆佹暀鏉愮紪鍐欑悊蹇�</b></p>
-        <p><span class="kaiti">1.鍏ㄩ潰璐交钀藉疄鏂拌绋嬫爣鍑嗚姹�</span></p>
-        <p>
-          銆婃柊鏍囧噯閫氱敤鑱屽満鑻辫銆嬬郴鍒楁暀鏉愬叏闈㈠鏍囥�婇珮绛夎亴涓氭暀鑲蹭笓绉戣嫳璇绋嬫爣鍑嗭紙2021骞寸増锛夈�嬶紝鍏呭垎绐佸嚭楂樿亴鑻辫璇剧▼鐨勬�濇兂鎬с�佺瀛︽�с�佽亴涓氭�с�佹椂浠f�э紝鍏虫敞鍚勫娈电殑琛旀帴鎬э紝瀹炵幇浠峰�煎紩棰嗭紝鍩瑰吇瀛︾敓鐨勫繀澶囪兘鍔涘拰鍏抽敭鑳藉姏銆�
-        </p>
-        <p>
-          <span class="kaiti">2.鍏ㄧ▼铻嶅叆璇剧▼鎬濇斂锛屽桨鏄捐瑷�璇剧▼鐨勮偛浜哄姛鑳�</span>
-        </p>
-        <p>
-          鏁欐潗浠庡崟鍏冧富棰樸�佺礌鏉愰�夊彇銆佺粌涔犺缃瓑鍚勬柟闈㈢患鍚堣璁★紝绱у瘑鑱旂郴涓浗绀句細鍜屾枃鍖栵紝寮樻壃姝h兘閲忋�傚湪鎻愬崌瀛︾敓鏍稿績绱犲吇鐨勫悓鏃讹紝寮曞瀛︾敓鍏虫敞绀句細锛屽叧娉ㄤ粬浜猴紝娼滅Щ榛樺寲鍦板煿鍏诲鐢熺殑瀹跺浗鎯呮��鍜屼汉鏂囩礌鍏伙紝澧炲己瀛︾敓鍦ㄥ鍏冩枃鍖栦氦娴佺幆澧冧腑璁茶堪涓浗鏁呬簨鍜屾帹浠嬩腑鍥芥枃鍖栫殑鑳藉姏銆傛暀鏉愪互鈥滅珛寰锋爲浜衡�濅负鏍规湰浠诲姟锛岀珛瓒虫柊鏃朵唬涓浗鑱屼笟鏁欒偛澶ц儗鏅紝浠ヨ亴涓氫负鍏抽敭璇嶏紝閫夊彇鑱屼笟涓庝釜浜恒�佽亴涓氫笌绀句細銆佽亴涓氫笌鐜涓婚鐨勮瑷�鏉愭枡锛屽湪鍔╁姏璇█鏁欏鐨勫悓鏃讹紝寮曞瀛︾敓璐$尞绀句細銆佸叧蹇冪ぞ浼氥�佺埍宀楁暚涓氾紝瀹炵幇鍏叡鑻辫璇剧▼鍩规牴閾搁瓊銆佸惎鏅哄鎱х殑鍔熻兘锛屼績杩涘鐢熷叏闈㈠彂灞曘��
-        </p>
-        <p><span class="kaiti">3.鍩轰簬浜у嚭瀵煎悜鐞嗗康锛屽疄鏂介」鐩寲鏁欏</span></p>
-        <p>
-          鏁欐潗鍩轰簬浜у嚭瀵煎悜鐨勭悊蹇碉紝鎵撶牬浼犵粺鍚�佽銆佽銆佸啓鍒嗘澘鍧楃紪鍐欑殑浣撲緥锛岃繘琛屼竴鍗曞厓涓�椤圭洰鐨勯」鐩寲鏁欏璁捐锛岀患鍚堣繍鐢ㄥ惉銆佽銆佽銆佸啓銆佺湅绛夊绉嶈瑷�鎶�鑳藉拰铻嶅獟浣撴墜娈碉紝鎼缓璇█鏀灦锛屽眰灞傞�掕繘锛岀幆鐜浉鎵o紝鍔╁姏瀛︾敓鏈�缁堝畬鎴愬崟鍏冮」鐩换鍔°��
-        </p>
-        <p><span class="kaiti">4.婊¤冻鏁欎笌瀛︾殑澶氬厓闇�姹�</span></p>
-        <p>
-          楂樿亴鎵╂嫑涔嬪悗锛屽鐢熷憟澶氬厓鍖栧眰绾х粨鏋勶紝瀵瑰涔犵殑闇�姹備篃鍙樺緱澶氬厓鍖栥�傛湰濂楁暀鏉愶紝鍩轰簬楂樿亴瀛︾敓鍏叡鑻辫璇剧▼鐨勭幇鐘惰皟鐮旓紝鑱氱劍鏁欏鍐呭銆佹暀瀛︽椿鍔ㄣ�佹暀瀛︽ā寮忕瓑鏂归潰锛岀潃鍔涘紑鍙戞柊褰㈡�佹暀鏉愬拰鐩稿叧璧勬簮锛屾弧瓒抽珮鑱岄櫌鏍″鐢熺殑澶氱瀛︿範闇�姹傘��
-        </p>
-        <p class="center"><b>浜屻�佹暀鏉愪綋绯昏璁�</b></p>
-        <p><span class="kaiti">1.椤圭洰涓哄鍚戠殑鍗曞厓璁捐</span></p>
-        <p>
-          姣忎釜鍗曞厓鍖呭惈涓変釜瀛愰」鐩�傝緭鍏ユ潗鏂欑敱娴呭叆娣憋紝浠庤瑷�銆佸唴瀹广�佺粨鏋勪笂閫愭笎鎼缓鏀灦锛屽紩棰嗗鐢熸湁閽堝鎬у湴鎺㈢储銆佸涔狅紝鏈�缁堝畬鎴愬崟鍏冮」鐩��
-        </p>
-        <p><span class="kaiti">2.鑱屽満涓哄鍚戠殑鎯呭璁剧疆</span></p>
-        <p>
-          灏嗗崟鍏冮」鐩瀺鍏ヨ亴鍦烘儏澧冿紝缁撳悎琛屼笟鍜屼紒涓氬楂樿亴瀛︾敓璇█鎶�鑳界殑瑕佹眰锛屼粠姹傝亴搴旇仒銆佺敓浜ф湇鍔°�佽惀閿�鍞悗绛夊吀鍨嬭亴涓氬満鏅鍒掕瑷�瀛︿範鍐呭锛屽垱璁惧涔犳儏澧冨拰鍏蜂綋瀛︿範浠诲姟锛屽煿鍏诲鐢熷湪鑱屽満鐜涓敤鑻辫杩涜娌熼�氱殑鑳藉姏鍙婅В鍐宠亴鍦洪棶棰樼殑鑳藉姏銆�
-        </p>
-        <p><span class="kaiti">3.娣峰悎寮忓涔犱负瀵煎悜鐨勬暀瀛︽ā寮�</span></p>
-        <p>
-          渚濇墭鍖楀笀澶р�滀含甯堜箰瀛︹�濆拰鈥滀含甯圗璇锯�濆钩鍙帮紝寮�鍙戜笌鏁欐潗娣卞害铻嶅悎鐨勭Щ鍔ㄦ暟瀛楃骇鍒涙柊鎱曡骞冲彴銆傛暟瀛楄绋嬪寘鍚棰戝井璇俱�佸湪绾跨粌涔犮�佷簰鍔ㄨ璁虹瓑锛屼笌鏁欐潗鏈夋満缁撳悎锛岀浉浜掍緷鎵樸�傜嚎涓婄嚎涓嬫繁搴﹁瀺鍚堬紝璧嬭兘鏁欏銆�
-        </p>
-        <p class="center"><b>涓夈�佹暀鏉愮壒鑹�</b></p>
-        <p>1.绱ф墸鏂拌鏍囪姹傦紝绐佸嚭瀛︾敓鏍稿績绱犲吇鍩瑰吇锛岃惤瀹炵珛寰锋爲浜烘牴鏈换鍔�</p>
-        <p>
-          鍩轰簬瀛︾敓鐜版湁鐨勮嫳璇按骞冲拰鏈潵鐨勫伐浣滈渶姹傦紝閽堝鍩虹妯″潡璇剧▼锛岀粨鍚堣亴鍦烘儏澧冭璁′换鍔★紝閫氳繃澶氭ā鎬佽绡囧拰涓嶅悓绫诲瀷浣撹鐨勫涔犵礌鏉愶紝澶疄瀛︾敓鐨勫惉銆佽銆佽銆佸啓銆佽瘧銆佺湅绛夋妧鑳斤紝鎻愰珮瀛︾敓鐨勮亴鍦烘秹澶栨矡閫氳兘鍔涳紝寮�鎷撳鐢熺殑鍥介檯瑙嗛噹銆傚崟鍏冮」鐩缃仛鐒︽�濊鲸鍜屽垱鏂版�濈淮璁粌锛屾棬鍦ㄦ彁鍗囧鐢熺殑璇█鎬濈淮鑳藉姏锛屼娇鍏跺吇鎴愬杽浜庢帰绌剁殑鎬濈淮鍝佹牸銆傝嚜鎴戣瘎浼扮幆鑺傛棬鍦ㄦ娴嬪鐢熺殑瀛︿範鏁堟灉锛屼娇鍏堕�傛椂璋冩暣瀛︿範绛栫暐锛屼績杩涜嚜涓诲鑳界殑鎻愬崌銆�
-        </p>
-        <p>
-          <span class="kaiti">2.杩愮敤淇℃伅鎶�鏈紝寤鸿铻嶅獟浣撹祫婧愶紝璧嬭兘鏁欏</span>
-        </p>
-        <p>
-          鍦ㄩ伒寰瑷�涔犲緱瑙勫緥鐨勫熀纭�涓婏紝鎺㈢┒灏嗕紶缁熺焊璐ㄦ暀鏉愯瀺鍏ヤ赴瀵岀殑铻嶅獟浣撴暀瀛﹁祫婧愮殑璺緞涓庢柟娉曪紝鍏呭垎鍒╃敤鐜颁唬鍖栫殑鏁欏鎵嬫鍜屽嚭鐗堢ぞ鐨勪俊鎭寲骞冲彴锛屽厠鏈嶄紶缁熸暀鏉愮煡璇嗗閲忔湁闄愩�佸唴瀹规洿鏂板懆鏈熸參銆佸浘鏂囧舰寮忓崟涓�銆佺己涔忎笌瀛︾敓鐨勪簰鍔ㄥ拰鍙嶉绛夌殑灞�闄愭�э紝閽堝褰撲唬瀛︾敓渚濊禆浜掕仈缃戙�佹敞閲嶉槄璇讳綋楠屻�佹劅鐭ュ拰鎺ュ彈鏂颁簨鐗╄兘鍔涘己鐨勭壒鐐癸紝鏇存柊鏁欐潗鍐呭鍜屽憟鐜板舰寮忥紝搴旂敤淇℃伅鎶�鏈拰璧勬簮锛屽舰鎴愨�滅焊璐ㄦ暀鏉�+寰鍫�+浜戣祫婧愨��
-          绛夎瀺濯掍綋鏁欏璧勬簮鐨勭嚎涓婄嚎涓嬫暀瀛︽柊褰㈡�侊紝婊¤冻瀛︾敓纰庣墖鍖栧涔犮�佽嚜涓诲涔犮�佷釜鎬у寲瀛︿範鐨勯渶姹傦紝澧炲姞瀛︾敓鐨勫弬涓庡害锛屼粠鑰屾彁楂樺鐢熺殑瀛︿範鏁堢巼銆�
-        </p>
-        <p class="center"><b>鍥涖�佹暀鏉愬垱鏂�</b></p>
-        <p><span class="kaiti">1.椤圭洰瀵煎悜锛屼换鍔″垱璁炬儏澧冨寲</span></p>
-        <p>
-          鏁欐潗缂栧啓鍥㈤槦绱ф墸鏂拌鏍囦富棰樼被鍒瘽棰樿姹傦紝浠ュ眰灞傞�掕繘鐨勯」鐩寲浠诲姟涓哄紩棰嗭紝閫氳繃寮曞瀛︾敓瀹屾垚绮惧績璁捐鐨勬儏澧冭瑷�浠诲姟锛屽府鍔╁鐢熷叏闈㈠涔犲苟鎺屾彙涓庝富棰樺拰鎯呭鐩稿叧鐨勮瑷�鏂囧寲鐭ヨ瘑锛屾彁楂樺鐢熺殑璇█娌熼�氫氦娴佽兘鍔涖��
-        </p>
-        <p><span class="kaiti">2.瀛︾敤缁撳悎锛岃兘鍔涘煿鍏荤郴缁熷寲</span></p>
-        <p>
-          鏁欐潗閲囩敤绯荤粺鍖栫殑鏁欏璁捐锛屼互鍙戝睍瀛︾敓鐨勬牳蹇冪礌鍏讳负鏍稿績锛屽皢瀛︾敤缁撳悎鐨勫師鍒欒疮绌挎暀瀛︽椿鍔ㄥ叏杩囩▼锛岃瀛︾敓涔犲緱鐨勬妧鑳芥湁鐢ㄦ涔嬪湴銆�
-        </p>
-        <p class="center"><b>浜斻�佺紪鍐欓槦浼�</b></p>
-        <p>
-          銆婃柊鏍囧噯閫氱敤鑱屽満鑻辫銆嬬郴鍒楁暀鏉愮敱鎴愰兘绾虹粐楂樼瓑涓撶瀛︽牎鐨勭帇鏈濇櫀鎷呬换鎬讳富缂栵紝鐢卞洓宸濇枃杞╄亴涓氬闄㈢殑鍒樺ぇ鍒┿�佸洓宸濆缓绛戣亴涓氭妧鏈闄㈢殑缃楀繝鏄庡拰閭撳啲鑷虫媴浠讳富缂栵紝鏈唽鐢辨垚閮界汉缁囬珮绛変笓绉戝鏍$殑璐句附钀嶃�佹垚閮借亴涓氭妧鏈闄㈢殑鍒樻捣鐕曘�佸洓宸濆紑鏀惧ぇ瀛︾殑渚功鍗庢媴浠诲壇涓荤紪銆傚叿浣撶紪鍐欎汉鍛樺潎涓哄骞翠粠浜嬮珮鑱屽叕鍏辫嫳璇暀瀛︿笌鐮旂┒鐨勯鍐涗汉鐗┿�侀骞叉暀甯堛�佸弻甯堝瀷绱犺川鏁欏笀銆傜紪鍐欏洟闃熸暀瀛︺�佺鐞嗙粡楠屼赴瀵岋紝鐔熸倝璇█鏁欏瑙勫緥锛屼簡瑙h亴涓氭暀鑲茬悊蹇碉紝鍏虫敞鑱屼笟鏁欒偛鏁欏鐨勬斂绛栧拰鍔ㄦ�侊紝纭繚浜嗘湰濂楁暀鏉愮殑缂栧啓璐ㄩ噺銆�
-        </p>
-        <p>
-          鍥夸簬姘村钩锛屾暀鏉愮枏婕忎箣澶勯毦鍏嶃�傛垜浠湡璇氭杩庝笓瀹躲�佸笀鐢熷鏁欐潗鎻愬嚭瀹濊吹鎰忚鍜屽缓璁紝浠ヤ究鎴戜滑鍔ㄦ�佸畬鍠勬暀鏉愶紝鏇村ソ鍦版湇鍔¢珮鑱屽璇暀鑲叉暀瀛︼紝鏈嶅姟骞垮ぇ甯堢敓銆�
-        </p>
+    <div class="page-box " page="4">
+      <div v-if="showPageList.indexOf(4) > -1">
+        <div class="pd-20 ">
+          <div class="preface w100 fl al-end ju-cn">
+            <h1 id="a003" class="front preface-text">鍓嶈█</h1>
+          </div>  
+        </div>
+        <div class="bodystyle padding-93 pb-104 ">
+          <p>
+            銆婃柊鏍囧噯閫氱敤鑱屽満鑻辫銆嬬殑缂栧啓鍥㈤槦浠ュ厷鐨勬暀鑲叉柟閽堜负瀹楁棬锛岃疮褰诲厷鐨勪簩鍗佸ぇ鎶ュ憡绮剧锛屽鏍囥�婇珮绛夎亴涓氭暀鑲蹭笓绉戣嫳璇绋嬫爣鍑嗭紙2021骞寸増锛夈�嬶紝閬靛惊銆婇珮绛夊鏍¤绋嬫�濇斂寤鸿鎸囧绾茶銆嬬殑瑕佹眰锛屽弬鐓с�婁腑鍥借嫳璇兘鍔涚瓑绾ч噺琛ㄣ�嬪洓绾у拰浜旂骇鑳藉姏瑕佹眰锛岀珛瓒抽珮鑱岃嫳璇暀瀛﹀疄闄咃紝杩涜璁捐鍜岀紪鍐欙紝鏃㈡敞閲嶆彁鍗囧鐢熺殑鏍稿績绱犲吇銆佷績杩涙櫘鑱岃瀺閫氾紝鍙堝叏鏂逛綅铻嶅叆璇剧▼鎬濇斂锛岃惤瀹炵珛寰锋爲浜烘牴鏈换鍔°��
+          </p>
+          <p class="center primary-title-color "><b>涓�銆佹暀鏉愮紪鍐欑悊蹇�</b></p>
+          <p><span class="kaiti">1.鍏ㄩ潰璐交钀藉疄鏂拌绋嬫爣鍑嗚姹�</span></p>
+          <p>
+            銆婃柊鏍囧噯閫氱敤鑱屽満鑻辫銆嬬郴鍒楁暀鏉愬叏闈㈠鏍囥�婇珮绛夎亴涓氭暀鑲蹭笓绉戣嫳璇绋嬫爣鍑嗭紙2021骞寸増锛夈�嬶紝鍏呭垎绐佸嚭楂樿亴鑻辫璇剧▼鐨勬�濇兂鎬с�佺瀛︽�с�佽亴涓氭�с�佹椂浠f�э紝鍏虫敞鍚勫娈电殑琛旀帴鎬э紝瀹炵幇浠峰�煎紩棰嗭紝鍩瑰吇瀛︾敓鐨勫繀澶囪兘鍔涘拰鍏抽敭鑳藉姏銆�
+          </p>
+          <p>
+            <span class="kaiti ">2.鍏ㄧ▼铻嶅叆璇剧▼鎬濇斂锛屽桨鏄捐瑷�璇剧▼鐨勮偛浜哄姛鑳�</span>
+          </p>
+          <p>
+            鏁欐潗浠庡崟鍏冧富棰樸�佺礌鏉愰�夊彇銆佺粌涔犺缃瓑鍚勬柟闈㈢患鍚堣璁★紝绱у瘑鑱旂郴涓浗绀句細鍜屾枃鍖栵紝寮樻壃姝h兘閲忋�傚湪鎻愬崌瀛︾敓鏍稿績绱犲吇鐨勫悓鏃讹紝寮曞瀛︾敓鍏虫敞绀句細锛屽叧娉ㄤ粬浜猴紝娼滅Щ榛樺寲鍦板煿鍏诲鐢熺殑瀹跺浗鎯呮��鍜屼汉鏂囩礌鍏伙紝澧炲己瀛︾敓鍦ㄥ鍏冩枃鍖栦氦娴佺幆澧冧腑璁茶堪涓浗鏁呬簨鍜屾帹浠嬩腑鍥芥枃鍖栫殑鑳藉姏銆傛暀鏉愪互鈥滅珛寰锋爲浜衡�濅负鏍规湰浠诲姟锛岀珛瓒虫柊鏃朵唬涓浗鑱屼笟鏁欒偛澶ц儗鏅紝浠ヨ亴涓氫负鍏抽敭璇嶏紝閫夊彇鑱屼笟涓庝釜浜恒�佽亴涓氫笌绀句細銆佽亴涓氫笌鐜涓婚鐨勮瑷�鏉愭枡锛屽湪鍔╁姏璇█鏁欏鐨勫悓鏃讹紝寮曞瀛︾敓璐$尞绀句細銆佸叧蹇冪ぞ浼氥�佺埍宀楁暚涓氾紝瀹炵幇鍏叡鑻辫璇剧▼鍩规牴閾搁瓊銆佸惎鏅哄鎱х殑鍔熻兘锛屼績杩涘鐢熷叏闈㈠彂灞曘��
+          </p>
+          <p><span class="kaiti">3.鍩轰簬浜у嚭瀵煎悜鐞嗗康锛屽疄鏂介」鐩寲鏁欏</span></p>
+          <p>
+            鏁欐潗鍩轰簬浜у嚭瀵煎悜鐨勭悊蹇碉紝鎵撶牬浼犵粺鍚�佽銆佽銆佸啓鍒嗘澘鍧楃紪鍐欑殑浣撲緥锛岃繘琛屼竴鍗曞厓涓�椤圭洰鐨勯」鐩寲鏁欏璁捐锛岀患鍚堣繍鐢ㄥ惉銆佽銆佽銆佸啓銆佺湅绛夊绉嶈瑷�鎶�鑳藉拰铻嶅獟浣撴墜娈碉紝鎼缓璇█鏀灦锛屽眰灞傞�掕繘锛岀幆鐜浉鎵o紝鍔╁姏瀛︾敓鏈�缁堝畬鎴愬崟鍏冮」鐩换鍔°��
+          </p>
+        </div>
+      </div>
+    </div>
+    <!-- 4 -->
+    <div class="page-box" page="5">
+      <div v-if="showPageList.indexOf(5) > -1">
+        <div class="mb-20" style="padding-right: 20px;">
+          <div class="primary-bc fl al-end" style="height: 100px;padding-left: 40px;">
+            <div class="preface-header-box y-bc">
+              <span class="l-text">鏂版爣鍑嗛�氱敤鑱屽満鑻辫</span>
+              <span class="g-text g-color">鍩虹妯″潡涓�</span>
+            </div>
+          </div>
+        </div>
+        <div class="padding-93">
+          <p><span class="kaiti">4.婊¤冻鏁欎笌瀛︾殑澶氬厓闇�姹�</span></p>
+          <p>
+            楂樿亴鎵╂嫑涔嬪悗锛屽鐢熷憟澶氬厓鍖栧眰绾х粨鏋勶紝瀵瑰涔犵殑闇�姹備篃鍙樺緱澶氬厓鍖栥�傛湰濂楁暀鏉愶紝鍩轰簬楂樿亴瀛︾敓鍏叡鑻辫璇剧▼鐨勭幇鐘惰皟鐮旓紝鑱氱劍鏁欏鍐呭銆佹暀瀛︽椿鍔ㄣ�佹暀瀛︽ā寮忕瓑鏂归潰锛岀潃鍔涘紑鍙戞柊褰㈡�佹暀鏉愬拰鐩稿叧璧勬簮锛屾弧瓒抽珮鑱岄櫌鏍″鐢熺殑澶氱瀛︿範闇�姹傘��
+          </p>
+          <p class="center primary-title-color"><b>浜屻�佹暀鏉愪綋绯昏璁�</b></p>
+          <p><span class="kaiti">1.椤圭洰涓哄鍚戠殑鍗曞厓璁捐</span></p>
+          <p>
+            姣忎釜鍗曞厓鍖呭惈涓変釜瀛愰」鐩�傝緭鍏ユ潗鏂欑敱娴呭叆娣憋紝浠庤瑷�銆佸唴瀹广�佺粨鏋勪笂閫愭笎鎼缓鏀灦锛屽紩棰嗗鐢熸湁閽堝鎬у湴鎺㈢储銆佸涔狅紝鏈�缁堝畬鎴愬崟鍏冮」鐩��
+          </p>
+          <p><span class="kaiti">2.鑱屽満涓哄鍚戠殑鎯呭璁剧疆</span></p>
+          <p>
+            灏嗗崟鍏冮」鐩瀺鍏ヨ亴鍦烘儏澧冿紝缁撳悎琛屼笟鍜屼紒涓氬楂樿亴瀛︾敓璇█鎶�鑳界殑瑕佹眰锛屼粠姹傝亴搴旇仒銆佺敓浜ф湇鍔°�佽惀閿�鍞悗绛夊吀鍨嬭亴涓氬満鏅鍒掕瑷�瀛︿範鍐呭锛屽垱璁惧涔犳儏澧冨拰鍏蜂綋瀛︿範浠诲姟锛屽煿鍏诲鐢熷湪鑱屽満鐜涓敤鑻辫杩涜娌熼�氱殑鑳藉姏鍙婅В鍐宠亴鍦洪棶棰樼殑鑳藉姏銆�
+          </p>
+          <p><span class="kaiti">3.娣峰悎寮忓涔犱负瀵煎悜鐨勬暀瀛︽ā寮�</span></p>
+          <p>
+            渚濇墭鍖楀笀澶р�滀含甯堜箰瀛︹�濆拰鈥滀含甯圗璇锯�濆钩鍙帮紝寮�鍙戜笌鏁欐潗娣卞害铻嶅悎鐨勭Щ鍔ㄦ暟瀛楃骇鍒涙柊鎱曡骞冲彴銆傛暟瀛楄绋嬪寘鍚棰戝井璇俱�佸湪绾跨粌涔犮�佷簰鍔ㄨ璁虹瓑锛屼笌鏁欐潗鏈夋満缁撳悎锛岀浉浜掍緷鎵樸�傜嚎涓婄嚎涓嬫繁搴﹁瀺鍚堬紝璧嬭兘鏁欏銆�
+          </p>
+          <p class="center primary-title-color"><b>涓夈�佹暀鏉愮壒鑹�</b></p>
+          <p>1.绱ф墸鏂拌鏍囪姹傦紝绐佸嚭瀛︾敓鏍稿績绱犲吇鍩瑰吇锛岃惤瀹炵珛寰锋爲浜烘牴鏈换鍔�</p>
+          <p>
+            鍩轰簬瀛︾敓鐜版湁鐨勮嫳璇按骞冲拰鏈潵鐨勫伐浣滈渶姹傦紝閽堝鍩虹妯″潡璇剧▼锛岀粨鍚堣亴鍦烘儏澧冭璁′换鍔★紝閫氳繃澶氭ā鎬佽绡囧拰涓嶅悓绫诲瀷浣撹鐨勫涔犵礌鏉愶紝澶疄瀛︾敓鐨勫惉銆佽銆佽銆佸啓銆佽瘧銆佺湅绛夋妧鑳斤紝鎻愰珮瀛︾敓鐨勮亴鍦烘秹澶栨矡閫氳兘鍔涳紝寮�鎷撳鐢熺殑鍥介檯瑙嗛噹銆傚崟鍏冮」鐩缃仛鐒︽�濊鲸鍜屽垱鏂版�濈淮璁粌锛屾棬鍦ㄦ彁鍗囧鐢熺殑璇█鎬濈淮鑳藉姏锛屼娇鍏跺吇鎴愬杽浜庢帰绌剁殑鎬濈淮鍝佹牸銆傝嚜鎴戣瘎浼扮幆鑺傛棬鍦ㄦ娴嬪鐢熺殑瀛︿範鏁堟灉锛屼娇鍏堕�傛椂璋冩暣瀛︿範绛栫暐锛屼績杩涜嚜涓诲鑳界殑鎻愬崌銆�
+          </p>
+          <p>
+            <span class="kaiti">2.杩愮敤淇℃伅鎶�鏈紝寤鸿铻嶅獟浣撹祫婧愶紝璧嬭兘鏁欏</span>
+          </p>
+          <p>
+            鍦ㄩ伒寰瑷�涔犲緱瑙勫緥鐨勫熀纭�涓婏紝鎺㈢┒灏嗕紶缁熺焊璐ㄦ暀鏉愯瀺鍏ヤ赴瀵岀殑铻嶅獟浣撴暀瀛﹁祫婧愮殑璺緞涓庢柟娉曪紝鍏呭垎鍒╃敤鐜颁唬鍖栫殑鏁欏鎵嬫鍜屽嚭鐗堢ぞ鐨勪俊鎭寲骞冲彴锛屽厠鏈嶄紶缁熸暀鏉愮煡璇嗗閲忔湁闄愩�佸唴瀹规洿鏂板懆鏈熸參銆佸浘鏂囧舰寮忓崟涓�銆佺己涔忎笌瀛︾敓鐨勪簰鍔ㄥ拰鍙嶉绛夌殑灞�闄愭�э紝閽堝褰撲唬瀛︾敓渚濊禆浜掕仈缃戙�佹敞閲嶉槄璇讳綋楠屻�佹劅鐭ュ拰鎺ュ彈鏂颁簨鐗�
+          </p>
+        </div>
+        <div class="preface-bottom">
+          <span class="num-box">2</span>
+        </div>
+      </div>
+    </div>
+    <!-- 5 -->
+    <div class="page-box" page="6">
+      <div v-if="showPageList.indexOf(6) > -1">        
+        <ul class="preface-odd-header w100 fl ju-bt">
+          <li class="left primary-bc "></li>
+          <li>
+            <span class="primary-bc">鍓�&nbsp;瑷�</span>
+            <span class="y-bc"></span>
+          </li>
+        </ul>
+        <div class="padding-93">
+          <p class="t0">
+            鑳藉姏寮虹殑鐗圭偣锛屾洿鏂版暀鏉愬唴瀹瑰拰鍛堢幇褰㈠紡锛屽簲鐢ㄤ俊鎭妧鏈拰璧勬簮锛屽舰鎴愨�滅焊璐ㄦ暀鏉�+寰鍫�+浜戣祫婧愨��
+            绛夎瀺濯掍綋鏁欏璧勬簮鐨勭嚎涓婄嚎涓嬫暀瀛︽柊褰㈡�侊紝婊¤冻瀛︾敓纰庣墖鍖栧涔犮�佽嚜涓诲涔犮�佷釜鎬у寲瀛︿範鐨勯渶姹傦紝澧炲姞瀛︾敓鐨勫弬涓庡害锛屼粠鑰屾彁楂樺鐢熺殑瀛︿範鏁堢巼銆�
+          </p>
+          <p class="center"><b>鍥涖�佹暀鏉愬垱鏂�</b></p>
+          <p><span class="kaiti">1.椤圭洰瀵煎悜锛屼换鍔″垱璁炬儏澧冨寲</span></p>
+          <p>
+            鏁欐潗缂栧啓鍥㈤槦绱ф墸鏂拌鏍囦富棰樼被鍒瘽棰樿姹傦紝浠ュ眰灞傞�掕繘鐨勯」鐩寲浠诲姟涓哄紩棰嗭紝閫氳繃寮曞瀛︾敓瀹屾垚绮惧績璁捐鐨勬儏澧冭瑷�浠诲姟锛屽府鍔╁鐢熷叏闈㈠涔犲苟鎺屾彙涓庝富棰樺拰鎯呭鐩稿叧鐨勮瑷�鏂囧寲鐭ヨ瘑锛屾彁楂樺鐢熺殑璇█娌熼�氫氦娴佽兘鍔涖��
+          </p>
+          <p><span class="kaiti">2.瀛︾敤缁撳悎锛岃兘鍔涘煿鍏荤郴缁熷寲</span></p>
+          <p>
+            鏁欐潗閲囩敤绯荤粺鍖栫殑鏁欏璁捐锛屼互鍙戝睍瀛︾敓鐨勬牳蹇冪礌鍏讳负鏍稿績锛屽皢瀛︾敤缁撳悎鐨勫師鍒欒疮绌挎暀瀛︽椿鍔ㄥ叏杩囩▼锛岃瀛︾敓涔犲緱鐨勬妧鑳芥湁鐢ㄦ涔嬪湴銆�
+          </p>
+          <p class="center"><b>浜斻�佺紪鍐欓槦浼�</b></p>
+          <p>
+            銆婃柊鏍囧噯閫氱敤鑱屽満鑻辫銆嬬郴鍒楁暀鏉愮敱鎴愰兘绾虹粐楂樼瓑涓撶瀛︽牎鐨勭帇鏈濇櫀鎷呬换鎬讳富缂栵紝鐢卞洓宸濇枃杞╄亴涓氬闄㈢殑鍒樺ぇ鍒┿�佸洓宸濆缓绛戣亴涓氭妧鏈闄㈢殑缃楀繝鏄庡拰閭撳啲鑷虫媴浠讳富缂栵紝鏈唽鐢辨垚閮界汉缁囬珮绛変笓绉戝鏍$殑璐句附钀嶃�佹垚閮借亴涓氭妧鏈闄㈢殑鍒樻捣鐕曘�佸洓宸濆紑鏀惧ぇ瀛︾殑渚功鍗庢媴浠诲壇涓荤紪銆傚叿浣撶紪鍐欎汉鍛樺潎涓哄骞翠粠浜嬮珮鑱屽叕鍏辫嫳璇暀瀛︿笌鐮旂┒鐨勯鍐涗汉鐗┿�侀骞叉暀甯堛�佸弻甯堝瀷绱犺川鏁欏笀銆傜紪鍐欏洟闃熸暀瀛︺�佺鐞嗙粡楠屼赴瀵岋紝鐔熸倝璇█鏁欏瑙勫緥锛屼簡瑙h亴涓氭暀鑲茬悊蹇碉紝鍏虫敞鑱屼笟鏁欒偛鏁欏鐨勬斂绛栧拰鍔ㄦ�侊紝纭繚浜嗘湰濂楁暀鏉愮殑缂栧啓璐ㄩ噺銆�
+          </p>
+          <p>
+            鍥夸簬姘村钩锛屾暀鏉愮枏婕忎箣澶勯毦鍏嶃�傛垜浠湡璇氭杩庝笓瀹躲�佸笀鐢熷鏁欐潗鎻愬嚭瀹濊吹鎰忚鍜屽缓璁紝浠ヤ究鎴戜滑鍔ㄦ�佸畬鍠勬暀鏉愶紝鏇村ソ鍦版湇鍔¢珮鑱屽璇暀鑲叉暀瀛︼紝鏈嶅姟骞垮ぇ甯堢敓銆�
+          </p>
+        </div>
+        <div class="preface-bottom" style="margin-top: 236px">
+          <span class="num-box">3</span>
+        </div>
       </div>
     </div>
   </div>
@@ -120,7 +189,31 @@
 <script>
 export default {
   name: "page-header",
+  props:{
+    showPageList:{
+      type:Array
+    }
+  }
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+p {
+  margin: 0 !important;
+}
+.box {
+  max-width: 400px;
+  margin: 0 auto;
+}
+.preface {
+  height: 224px;
+  background: linear-gradient(to right, #8fc58c, #fff);
+}
+.preface-text {
+  font-size: 26px !important;
+  color: #000 !important;
+}
+.mt-100 {
+  margin-top: 100px !important;
+}
+</style>

--
Gitblit v1.9.1