Browse Source

创建morecity页面并添加city图片和内容

5230240 4 months ago
parent
commit
ff0cbb32e5
49 changed files with 704 additions and 1 deletions
  1. 4 0
      src/app/app-routing.module.ts
  2. 17 0
      src/app/morecity/morecity-routing.module.ts
  3. 20 0
      src/app/morecity/morecity.module.ts
  4. 630 0
      src/app/morecity/morecity.page.html
  5. 0 0
      src/app/morecity/morecity.page.scss
  6. 17 0
      src/app/morecity/morecity.page.spec.ts
  7. 15 0
      src/app/morecity/morecity.page.ts
  8. 1 1
      src/app/tab3/tab3.page.ts
  9. BIN
      src/assets/images/city/aidingbao.jpg
  10. BIN
      src/assets/images/city/aiji.jpg
  11. BIN
      src/assets/images/city/aomen.jpg
  12. BIN
      src/assets/images/city/bali.jpg
  13. BIN
      src/assets/images/city/basailuona.jpg
  14. BIN
      src/assets/images/city/beihaidao.jpg
  15. BIN
      src/assets/images/city/bendizhili.jpg
  16. BIN
      src/assets/images/city/bolin.jpg
  17. BIN
      src/assets/images/city/bulage.jpg
  18. BIN
      src/assets/images/city/buluri.jpg
  19. BIN
      src/assets/images/city/chongqing.jpg
  20. BIN
      src/assets/images/city/dali.jpg
  21. BIN
      src/assets/images/city/dalian.jpg
  22. BIN
      src/assets/images/city/gana.jpg
  23. BIN
      src/assets/images/city/gelasige.jpg
  24. BIN
      src/assets/images/city/haerbin.jpg
  25. BIN
      src/assets/images/city/honghe.jpg
  26. BIN
      src/assets/images/city/jingdu.jpg
  27. BIN
      src/assets/images/city/lundun.jpg
  28. BIN
      src/assets/images/city/luoma.jpg
  29. BIN
      src/assets/images/city/madeli.jpg
  30. BIN
      src/assets/images/city/moluoge.jpg
  31. BIN
      src/assets/images/city/nanjing.jpg
  32. BIN
      src/assets/images/city/ningxia.jpg
  33. BIN
      src/assets/images/city/qingmai.jpg
  34. BIN
      src/assets/images/city/saercibao.jpg
  35. BIN
      src/assets/images/city/shanghai.jpg
  36. BIN
      src/assets/images/city/shennaichuan.jpg
  37. BIN
      src/assets/images/city/shenzhen.jpg
  38. BIN
      src/assets/images/city/shouer.jpg
  39. BIN
      src/assets/images/city/taibei.jpg
  40. BIN
      src/assets/images/city/tianjin.jpg
  41. BIN
      src/assets/images/city/weiluona.jpg
  42. BIN
      src/assets/images/city/weiyena.jpg
  43. BIN
      src/assets/images/city/wuhan.jpg
  44. BIN
      src/assets/images/city/xiamen.jpg
  45. BIN
      src/assets/images/city/xianggang.jpg
  46. BIN
      src/assets/images/city/xinbei.jpg
  47. BIN
      src/assets/images/city/xindeli.jpg
  48. BIN
      src/assets/images/city/yibao.jpg
  49. BIN
      src/assets/images/city/zhaipuer.jpg

+ 4 - 0
src/app/app-routing.module.ts

@@ -27,6 +27,10 @@ const routes: Routes = [
     path: 'moreplace',
     loadChildren: () => import('./moreplace/moreplace.module').then( m => m.MoreplacePageModule)
   },
+  {
+    path: 'morecity',
+    loadChildren: () => import('./morecity/morecity.module').then( m => m.MorecityPageModule)
+  },
 
 
 ];

+ 17 - 0
src/app/morecity/morecity-routing.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+import { MorecityPage } from './morecity.page';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: MorecityPage
+  }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class MorecityPageRoutingModule {}

+ 20 - 0
src/app/morecity/morecity.module.ts

@@ -0,0 +1,20 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { FormsModule } from '@angular/forms';
+
+import { IonicModule } from '@ionic/angular';
+
+import { MorecityPageRoutingModule } from './morecity-routing.module';
+
+import { MorecityPage } from './morecity.page';
+
+@NgModule({
+  imports: [
+    CommonModule,
+    FormsModule,
+    IonicModule,
+    MorecityPageRoutingModule
+  ],
+  declarations: [MorecityPage]
+})
+export class MorecityPageModule {}

+ 630 - 0
src/app/morecity/morecity.page.html

@@ -0,0 +1,630 @@
+<ion-header [translucent]="true">
+  <ion-toolbar>
+    <ion-buttons slot="start">
+      <ion-back-button defaultHref="/previous-page"></ion-back-button>
+    </ion-buttons>
+    <ion-title>morecity</ion-title>
+  </ion-toolbar>
+</ion-header>
+
+<ion-content [fullscreen]="true">
+  <ion-card>
+    <ion-card-header>
+      中国内地
+    </ion-card-header>
+    <ion-card-content>
+      <ion-list>
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/honghe.jpg" alt="红河州">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>红河州</h2>
+            <p>中国 云南省</p>
+            <p>《芳华》剧照 取景于蒙自市芷村火车站</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/ningxia.jpg" alt="宁夏">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>宁夏</h2>
+            <p>中国</p>
+            <p>《大话西游之大圣娶亲》 取景于镇北堡西部影城</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/haerbin.jpg" alt="哈尔滨">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>哈尔滨</h2>
+            <p>中国 黑龙江</p>
+            <p>《白日烟火》剧照 取景于哈尔滨松花江滨洲铁路桥</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/dali.jpg" alt="大理">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>大理</h2>
+            <p>中国 云南省</p>
+            <p>《心花怒放》剧照 取景于大理古城南城门</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/dalian.jpg" alt="大连">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>大连</h2>
+            <p>中国 辽宁省</p>
+            <p>《夏洛特烦恼》 取景于海北路宿舍</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/tianjin.jpg" alt="天津">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>天津</h2>
+            <p>中国</p>
+            <p>《闪光少女》剧照 取景于天津北安桥</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/suzhou.jpg" alt="苏州">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>苏州</h2>
+            <p>中国 江苏省</p>
+            <p>1986年电视剧《西游记》剧照 取景于苏州天平山</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/wuhan.jpg" alt="武汉">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>武汉</h2>
+            <p>中国 湖北省</p>
+            <p>《万箭穿心》剧照 取景于武汉龙王庙游船码头</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/hangzhou.jpg" alt="杭州">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>杭州</h2>
+            <p>中国 浙江省</p>
+            <p>电视剧《新白娘子传奇》剧照 取景于杭州西湖断桥</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/shenzhen.jpg" alt="深圳">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>深圳</h2>
+            <p>中国 广东省</p>
+            <p>《美人鱼》 取景于深圳市鹿嘴山庄度假村</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/nanjing.jpg" alt="南京">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>南京</h2>
+            <p>中国 江苏省</p>
+            <p>《建国大业》剧照 取景于南京大学鼓楼校区</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/qingdao.jpg" alt="青岛">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>青岛</h2>
+            <p>中国</p>
+            <p>《少年往事》剧照 取景于江苏路基督堂</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/chongqing.jpg" alt="重庆">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>重庆</h2>
+            <p>中国</p>
+            <p>《从你的全世界路过》剧照 取景于重庆解放碑</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/beijing.jpg" alt="北京">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>北京</h2>
+            <p>中国</p>
+            <p>《末代皇帝》剧照 取景于北京故宫太和殿</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/shanghai.jpg" alt="上海">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>上海</h2>
+            <p>中国</p>
+            <p>《小时代4:灵魂尽头》剧照 取景于陈毅广场</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/xiamen.jpg" alt="厦门">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>厦门</h2>
+            <p>中国 福建省</p>
+            <p>《疯狂的赛车》剧照 取景于厦门市大同路</p>
+          </ion-label>
+        </ion-item>
+      </ion-list>
+    </ion-card-content>
+  </ion-card>
+
+  <ion-card>
+    <ion-card-header>
+      亚洲
+    </ion-card-header>
+    <ion-card-content>
+      <ion-list>
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/zhaipuer.jpg" alt="斋浦尔">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>斋浦尔</h2>
+            <p>印度</p>
+            <p>《坠入》剧照 取景于简塔曼塔天文台</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/xindeli.jpg" alt="新德里">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>新德里</h2>
+            <p>印度</p>
+            <p>《我的个神啊》剧照 取景于新德里胡马雍陵</p>
+          </ion-label>
+        </ion-item>
+        
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/bendizhili.jpg" alt="本地治理">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>本地治理</h2>
+            <p>印度</p>
+            <p>《少年派的奇幻漂流》剧照 取景于本地治理植物园</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/yibao.jpg" alt="怡保">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>怡保</h2>
+            <p>马来西亚</p>
+            <p>《初恋红豆冰》剧照 取景于怡保金山茶山室</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/qingmai.jpg" alt="清迈">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>清迈</h2>
+            <p>泰国</p>
+            <p>《人再囧途之泰囧》剧照 取景于清迈布帕兰氏</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/taibei.jpg" alt="台北">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>台北</h2>
+            <p>中国台湾</p>
+            <p>《第36个故事》剧照 取景于台北101</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/dibai.jpg" alt="迪拜">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>迪拜</h2>
+            <p>阿拉伯联合酋长国</p>
+            <p>《碟中谍4》剧照 取景于迪拜哈利法塔</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/aomen.jpg" alt="澳门">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>澳门</h2>
+            <p>中国</p>
+            <p>《伊莎贝拉》剧照 取景于澳门恋爱巷</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/jingdu.jpg" alt="京都">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>京都</h2>
+            <p>日本</p>
+            <p>《艺妓回忆录》剧照 取景于平安神宫</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/shouer.jpg" alt="首尔">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>首尔</h2>
+            <p>韩国</p>
+            <p>《阳光姐妹淘》剧照 取景于房间桥近邻公园</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/xianggang.jpg" alt="香港">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>香港</h2>
+            <p>中国</p>
+            <p>《志明与春娇》剧照 取景于太古广场侧巷</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/shennaichuan.jpg" alt="神奈川">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>神奈川</h2>
+            <p>日本</p>
+            <p>《海街日记》 取景于湘南海岸</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/mangu.jpg" alt="曼谷">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>曼谷</h2>
+            <p>泰国</p>
+            <p>《唐人街探案》剧照 取景于耀华力路</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/beihaidao.jpg" alt="北海道">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>北海道</h2>
+            <p>日本</p>
+            <p>《情书》剧照 取景于小樽市色内路口</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/dongjing.jpg" alt="东京">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>东京</h2>
+            <p>日本</p>
+            <p>《东京爱情故事》剧照 取景于东京铁塔</p>
+          </ion-label>
+        </ion-item>
+      </ion-list>
+    </ion-card-content>
+  </ion-card>
+
+  <ion-card>
+    <ion-card-header>
+      欧洲
+    </ion-card-header>
+    <ion-card-content>
+      <ion-list>
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/geerlici.jpg" alt="格尔利茨">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>格尔利茨</h2>
+            <p>德国</p>
+            <p>《布达佩斯大饭店》剧照 取景于格尔利茨鱼市街</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/weiluona.jpg" alt="维罗纳">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>维罗纳</h2>
+            <p>意大利</p>
+            <p>《给朱丽叶的信》剧照 取景于朱丽叶故居</p>
+          </ion-label>
+        </ion-item>
+        
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/buluri.jpg" alt="布鲁日">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>布鲁日</h2>
+            <p>比利时</p>
+            <p>《我的个神啊》剧照 取景于Rolweg街</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/gelasige.jpg" alt="格拉斯哥">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>格拉斯哥</h2>
+            <p>苏格兰</p>
+            <p>《云图》剧照 取景于格拉斯哥大学纪念礼拜堂</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/saercibao.jpg" alt="萨尔茨堡">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>萨尔茨堡</h2>
+            <p>奥地利</p>
+            <p>《音乐之声》剧照 取景于萨尔茨堡侬山修道院</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/madeli.jpg" alt="马德里">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>马德里</h2>
+            <p>西班牙</p>
+            <p>《睁开你的双眼》剧照 取景于马德里毕加索大厦</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/aidingbao.jpg" alt="爱丁堡">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>爱丁堡</h2>
+            <p>苏格兰</p>
+            <p>《云图》剧照 取景于爱丁堡斯科特纪念塔</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/bolin.jpg" alt="柏林">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>柏林</h2>
+            <p>德国</p>
+            <p>《柏林苍穹下》剧照 取景于威廉皇帝纪念教堂</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/luoma.jpg" alt="罗马">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>罗马</h2>
+            <p>意大利</p>
+            <p>《爱在罗马》剧照 取景于博尔盖塞别墅</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/gana.jpg" alt="戛纳">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>戛纳</h2>
+            <p>法国</p>
+            <p>《锈与骨》剧照 取景于海鸥海滩</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/weinisi.jpg" alt="威尼斯">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>威尼斯</h2>
+            <p>意大利</p>
+            <p>《年轻气盛》剧照 取景于威尼斯圣马可广场</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/basailuona.jpg" alt="巴塞罗那">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>巴塞罗那</h2>
+            <p>加泰罗尼亚</p>
+            <p>《午夜巴塞罗那》 取景于米拉之家</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/weiyena.jpg" alt="维也纳">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>维也纳</h2>
+            <p>奥地利</p>
+            <p>《爱在黎明破晓前》剧照 取景于阿尔贝蒂娜博物馆</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/bingdao.jpg" alt="冰岛">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>冰岛</h2>
+            <p>欧洲</p>
+            <p>《星际穿越》剧照 取景于冰岛斯维纳山冰川</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/bulage.jpg" alt="布拉格">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>布拉格</h2>
+            <p>捷克</p>
+            <p>《有一个地方只有我们知道》剧照 取景于哈纳夫斯基凉亭</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/bali.jpg" alt="巴黎">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>巴黎</h2>
+            <p>法国</p>
+            <p>《007雷霆杀机》剧照 取景于巴黎埃菲尔铁塔</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/lundun.jpg" alt="伦敦">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>伦敦</h2>
+            <p>英国</p>
+            <p>《惊变28天》剧照 取景于伦敦威斯敏斯特桥</p>
+          </ion-label>
+        </ion-item>
+      </ion-list>
+    </ion-card-content>
+  </ion-card>
+
+  <ion-card>
+    <ion-card-header>
+      其他
+    </ion-card-header>
+    <ion-card-content>
+      <ion-list>
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/namibiya.jpg" alt="纳米比亚">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>纳米比亚</h2>
+            <p>非洲</p>
+            <p>《坠入》剧照 取景于纳米比亚索苏斯盐沼</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/tunisi.jpg" alt="突尼斯">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>突尼斯</h2>
+            <p>非洲</p>
+            <p>《夺宝奇兵》剧照 取景于突尼斯Sidi Bouhlel峡谷</p>
+          </ion-label>
+        </ion-item>
+        
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/wusihuaiya.jpg" alt="乌斯怀亚">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>乌斯怀斯</h2>
+            <p>阿根廷</p>
+            <p>《春光乍泄》剧照 取景于乌斯怀斯亚灯塔</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/aiji.jpg" alt="埃及">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>埃及</h2>
+            <p>非洲</p>
+            <p>《遗愿清单》剧照 取景于吉萨金字塔</p>
+          </ion-label>
+        </ion-item>
+
+        <ion-item>
+          <ion-thumbnail slot="start">
+            <img src="assets/images/city/moluoge.jpg" alt="摩洛哥">           
+          </ion-thumbnail>
+          <ion-label>
+            <h2>摩洛哥</h2>
+            <p>非洲</p>
+            <p>《权力的游戏 第三季》剧照 取景于摩洛哥阿伊特·本·哈杜筑垒</p>
+          </ion-label>
+        </ion-item>
+      </ion-list>
+    </ion-card-content>
+  </ion-card>
+
+</ion-content>

+ 0 - 0
src/app/morecity/morecity.page.scss


+ 17 - 0
src/app/morecity/morecity.page.spec.ts

@@ -0,0 +1,17 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { MorecityPage } from './morecity.page';
+
+describe('MorecityPage', () => {
+  let component: MorecityPage;
+  let fixture: ComponentFixture<MorecityPage>;
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MorecityPage);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

+ 15 - 0
src/app/morecity/morecity.page.ts

@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-morecity',
+  templateUrl: './morecity.page.html',
+  styleUrls: ['./morecity.page.scss'],
+})
+export class MorecityPage implements OnInit {
+
+  constructor() { }
+
+  ngOnInit() {
+  }
+
+}

+ 1 - 1
src/app/tab3/tab3.page.ts

@@ -17,7 +17,7 @@ export class Tab3Page {
 
   goToBlankPage() {
     // 导航到空白页面
-    console.log('Navigating to Blank page');
+    this.router.navigate(['/morecity']); // 替换成你的 setting 页面路由路径
   }
 
 }

BIN
src/assets/images/city/aidingbao.jpg


BIN
src/assets/images/city/aiji.jpg


BIN
src/assets/images/city/aomen.jpg


BIN
src/assets/images/city/bali.jpg


BIN
src/assets/images/city/basailuona.jpg


BIN
src/assets/images/city/beihaidao.jpg


BIN
src/assets/images/city/bendizhili.jpg


BIN
src/assets/images/city/bolin.jpg


BIN
src/assets/images/city/bulage.jpg


BIN
src/assets/images/city/buluri.jpg


BIN
src/assets/images/city/chongqing.jpg


BIN
src/assets/images/city/dali.jpg


BIN
src/assets/images/city/dalian.jpg


BIN
src/assets/images/city/gana.jpg


BIN
src/assets/images/city/gelasige.jpg


BIN
src/assets/images/city/haerbin.jpg


BIN
src/assets/images/city/honghe.jpg


BIN
src/assets/images/city/jingdu.jpg


BIN
src/assets/images/city/lundun.jpg


BIN
src/assets/images/city/luoma.jpg


BIN
src/assets/images/city/madeli.jpg


BIN
src/assets/images/city/moluoge.jpg


BIN
src/assets/images/city/nanjing.jpg


BIN
src/assets/images/city/ningxia.jpg


BIN
src/assets/images/city/qingmai.jpg


BIN
src/assets/images/city/saercibao.jpg


BIN
src/assets/images/city/shanghai.jpg


BIN
src/assets/images/city/shennaichuan.jpg


BIN
src/assets/images/city/shenzhen.jpg


BIN
src/assets/images/city/shouer.jpg


BIN
src/assets/images/city/taibei.jpg


BIN
src/assets/images/city/tianjin.jpg


BIN
src/assets/images/city/weiluona.jpg


BIN
src/assets/images/city/weiyena.jpg


BIN
src/assets/images/city/wuhan.jpg


BIN
src/assets/images/city/xiamen.jpg


BIN
src/assets/images/city/xianggang.jpg


BIN
src/assets/images/city/xinbei.jpg


BIN
src/assets/images/city/xindeli.jpg


BIN
src/assets/images/city/yibao.jpg


BIN
src/assets/images/city/zhaipuer.jpg