feat: 新增城市图片

src/pages/index/index.config.js

@@ -1,3 +1,3 @@
 export default definePageConfig({
-  navigationBarTitleText: '数字游民'
+  navigationBarTitleText: '数字游民的星球'
 })

src/pages/index/index.jsx

@@ -4,7 +4,11 @@ import Taro from "@tarojs/taro";
 import { AtAvatar, AtTag, AtIcon, AtTabBar } from "taro-ui";
 import "./index.scss";
 import beijing from "@/images/city/beijing.jpg";
-import { VIEW } from "@tarojs/runtime";
+import guangzhou from "@/images/city/guangzhou.jpg";
+import shanghai from "@/images/city/shanghai.jpg";
+import shenzhen from "@/images/city/shenzhen.jpg";
+import touxiang from "@/images/index/touxiang.jpg";
+
 import { useEffect } from "react";
 // import beijing from "../../images/city/beijing.jpg";
 
@@ -14,13 +18,13 @@ export default function Index() {
   });
 
   useEffect(() => {
-    // 更新分享
+    // 更新分享-minipro
     Taro.updateShareMenu({
       withShareTicket: true,
       success() {},
     });
 
-    // 显示分享按钮
+    // 显示分享按钮-minipro
     Taro.showShareMenu({
       withShareTicket: true,
       // showShareItems:true,
@@ -38,13 +42,17 @@ export default function Index() {
   }, []);
 
   const HomeCardItem = () => {
-    return [1, 2, 3].map((item, index) => {
+    return [
+      { cityName: "北京", imagePath: beijing },
+      { cityName: "上海", imagePath: shanghai },
+      { cityName: "广州", imagePath: guangzhou },
+      { cityName: "深圳", imagePath: shenzhen },
+    ].map((item, index) => {
       return (
         <View className="homeCardItem">
           <View className="homeCard">
             {/* 城市封面图片 */}
             <Image
-              // style="width: 100%;height: 100%;background: #fff;"
               style={{
                 width: "100%",
                 height: "100%",
@@ -52,10 +60,21 @@ export default function Index() {
                 borderRadius: "10px",
               }}
               mode="scaleToFill"
-              src={beijing}
+              src={item.imagePath}
             />
           </View>
-          <View className="homeCard">right</View>
+          <View className="homeCard">
+            {/* <Image
+              style={{
+                width: "100%",
+                height: "100%",
+                background: " #fff",
+                borderRadius: "10px",
+              }}
+              mode="scaleToFill"
+              src={item.imagePath}
+            /> */}
+          </View>
         </View>
       );
     });
@@ -78,7 +97,7 @@ export default function Index() {
       {/* 顶部 */}
       <View className="indexHeader">
         {/* 头像 */}
-        <AtAvatar circle image=""></AtAvatar>
+        <AtAvatar circle image={touxiang}></AtAvatar>
         {/* color="#F00" */}
         <AtIcon value="chevron-down" size="30"></AtIcon>
       </View>
@@ -93,13 +112,15 @@ export default function Index() {
         <HomeCardItem />
       </View>
 
+      <View className="tabbbarDiv"></View>
+
       {/* 底部tabbar */}
       <View className="tabbbar">
         <AtTabBar
           tabList={[
-            { title: "首页", iconType: "bullet-list" }, //, text: "new"
+            { title: "首页", iconType: "home" }, //, text: "new"
-            { title: "活动", iconType: "camera" },
+            // { title: "活动", iconType: "camera" },
-            { title: "我的", iconType: "folder" }, //, text: "100", max: 99
+            { title: "我的", iconType: "user" }, //, text: "100", max: 99
           ]}
           // onClick={this.handleClick.bind(this)}
           // current={this.state.current}

src/pages/index/index.scss

@@ -3,6 +3,7 @@
   padding-right: 20px;
 
   .indexHeader {
+    margin-top: 10px;
     display: flex;
     flex-direction: row;
     // justify-content: space-between;
@@ -24,9 +25,10 @@
 
     .homeCardItem {
       margin-top: 10px;
+
       display: flex;
       flex-direction: row;
-      // background-color:aqua;
+      // background-color: aqua;
       justify-content: space-between;
       align-items: center;
       .homeCard {
@@ -38,7 +40,13 @@
     }
   }
 
-  .tabbbar{
+  .tabbbarDiv {
+    width: 100%;
+    height: 140px;
+    // background-color: red;
+  }
+
+  .tabbbar {
     position: fixed;
     bottom: 0px;
     width: 100%;