商店和任务等触发按钮修改

components/dialogs/ShopDialog.vue

@@ -119,7 +119,48 @@ export default {
             isNew: false
           }
         ],
-        1: [],
+        1: [
+          { 
+            icon: '/static/island/items/item_wood1.png', 
+            name: '杂木材', 
+            detail: '普通木材，用来造普通的东西',
+            price: 100,
+            owned: 3,
+            isNew: false
+          },
+          { 
+            icon: '/static/island/items/item_wood2.png', 
+            name: '松木材', 
+            detail: '松树木材，比一般木材硬一点，可以用来造强度更好的东西',
+            price: 100,
+            owned: 3,
+            isNew: false
+          },
+          { 
+            icon: '/static/island/items/item_mine1.png', 
+            name: '石材', 
+            detail: '匀称规整的石头，适合用来造房子和石器',
+            price: 100,
+            owned: 3,
+            isNew: false
+          },
+          { 
+            icon: '/static/island/items/item_mine2.png', 
+            name: '铁矿石', 
+            detail: '铁矿石，可以练出铁锭',
+            price: 100,
+            owned: 3,
+            isNew: false
+          },
+          { 
+            icon: '/static/island/items/item_blueprint1.png', 
+            name: '斧头图纸', 
+            detail: '制造斧头的图纸，购买学习后可以制作斧头',
+            price: 100,
+            owned: 3,
+            isNew: false
+          }
+        ],
         2: []
       }
     }
@@ -135,6 +176,16 @@ export default {
     },
     dialogVisible(val) {
       this.$emit('update:visible', val)
+    },
+    shopName: {
+      immediate: true,
+      handler(val) {
+        if (val === '材料商店') {
+          this.currentTab = 1
+        } else {
+          this.currentTab = 0
+        }
+      }
     }
   },
   methods: {

pages/isLand/homeLand.vue

@@ -19,7 +19,7 @@
       </view>
 
       <view style="position: absolute;width:200rpx;left:1000rpx; bottom:450rpx;align-items: center;">
-        <image class="taskBoard-image" src="/static/island/building/taskBoard.png" mode="widthFix" style="width:670rpx; position: static;" @click="onTaskClick" :animation="taskAnimationData">	</image>
+        <image class="taskBoard-image" src="/static/island/building/taskBoard.png" mode="widthFix" style="width:670rpx; position: static;" @click="showTask" :animation="taskAnimationData">	</image>
       </view>
 
       <!-- 主岛箭头 -->
@@ -44,10 +44,7 @@
           </view>
         </view>
         <view class="ui-buttons">
-          <button class="ui-button" @click="showInventory">背包</button>
-          <button class="ui-button" @click="showCharacter">角色</button>
-          <button class="ui-button" @click="showShop">商店</button>
-          <button class="ui-button" @click="showTask">任务</button>
+		  <image src="/static/island/icon_backpack.png" mode="widthFix" style="width:100rpx" @click="showInventory"></image>
         </view>
       </view>
     </view>

pages/isLand/mainLand.vue

@@ -36,7 +36,7 @@
 		</view>
 
 		<view style="position: absolute;width: 360rpx;left: 910rpx; bottom:108rpx;align-items: center;">
-			<image class="shop-image" src="/static/island/building/2.png" mode="widthFix" style="width:360rpx; position: static;">	</image>
+			<image class="shop-image" src="/static/island/building/2.png" mode="widthFix" style="width:360rpx; position: static;" @click="onShopClick" :animation="shopAnimationData">	</image>
 		</view>
 
 		<view style="position: absolute;width: 360rpx;left: 1498rpx; bottom:75rpx;align-items: center;">
@@ -44,7 +44,7 @@
 		</view>
 
 		<view style="position: absolute;width: 360rpx;left: 1400rpx; bottom:380rpx;align-items: center;">
-			<image class="house-image" src="/static/island/building/1.png" mode="widthFix" style="width:360rpx; position: static;">	</image>
+			<image class="house-image" src="/static/island/building/1.png" mode="widthFix" style="width:360rpx; position: static;" @click="onHouseClick" :animation="houseAnimationData">	</image>
 		</view>
 
     <!-- 回家箭头 -->
@@ -69,31 +69,31 @@
           </view>
         </view>
         <view class="ui-buttons">
-          <button class="ui-button" @click="showInventory">背包</button>
-          <button class="ui-button" @click="showCharacter">角色</button>
-          <button class="ui-button" @click="showShop">商店</button>
+          <image src="/static/island/icon_backpack.png" mode="widthFix" style="width:100rpx" @click="showInventory" class="ui-icon-button"></image>
+          <!-- <button class="ui-button" @click="showCharacter">角色</button>
+          <button class="ui-button" @click="showShop">商店</button> -->
         </view>
       </view>
     </view>
 
     <!-- 对话框组件 -->
-    <inventory-dialog :visible.sync="inventoryVisible" @close="onInventoryClose"></inventory-dialog>
+    <backpack-dialog :visible.sync="inventoryVisible" @close="onInventoryClose"></backpack-dialog>
     <character-dialog :visible.sync="characterVisible" @close="onCharacterClose"></character-dialog>
-    <shop-dialog :visible.sync="shopVisible" @close="onShopClose" @buy="onShopBuy"></shop-dialog>
+    <shop-dialog :visible.sync="shopVisible" :shopName="currentShopName" @close="onShopClose" @buy="onShopBuy"></shop-dialog>
     <farm-dialog :visible.sync="farmVisible" @close="onFarmClose"></farm-dialog>
   </view> 
 </template>
 
 
 <script>
-import InventoryDialog from '@/components/dialogs/InventoryDialog.vue'
+import BackpackDialog from '@/components/dialogs/BackpackDialog.vue'
 import CharacterDialog from '@/components/dialogs/CharacterDialog.vue'
 import ShopDialog from '@/components/dialogs/ShopDialog.vue'
 import FarmDialog from './FarmDialog.vue'
 
 export default {
 	components: {
-		InventoryDialog,
+		BackpackDialog,
 		CharacterDialog,
 		ShopDialog,
 		FarmDialog
@@ -113,8 +113,10 @@ export default {
 			islandHeight: 0,
 			houseAnimationData: {},
 			farmAnimationData: {},
+			shopAnimationData: {},
 			houseAnimating: false,
 			farmAnimating: false,
+			shopAnimating: false,
 			baseTranslate: { x: -50, y: 50 },
 			inventoryVisible: false,
 			characterVisible: false,
@@ -123,6 +125,7 @@ export default {
 			homeArrowAnimation: {},
 			homeArrowAnimating: false,
 			homeArrowVisible: false,
+			currentShopName: '商店',
 		}
 	},
 	onLoad() {
@@ -255,15 +258,14 @@ export default {
 		onHouseClick(event) {
 			if(this.houseAnimating) return;
 			// 处理点击事件
-			console.log('House clicked!');
+			console.log('house clicked!');
 			
-			// 播放房子的点击动画
+			// 播放房屋的点击动画
 			this.playAnimation('house');
 			
-			uni.showToast({
-				title: 'House clicked!',
-				icon: 'none'
-			});
+			// 设置商店名称为"房屋商店"
+			this.currentShopName = '材料商店';
+			this.shopVisible = true;
 		},
 
 		onFarmClick(event) {
@@ -283,6 +285,20 @@ export default {
 			});
 		},
 
+		onShopClick(event) {
+			if(this.shopAnimating) return;
+			// 处理点击事件
+			console.log('shop clicked!');
+			
+			// 播放商店的点击动画
+			this.playAnimation('shop');
+			
+			// 设置商店名称为"花店"
+			this.currentShopName = '花店';
+			// 打开商店对话框
+			this.shopVisible = true;
+		},
+
 		playAnimation(type) {
 			let self = this;
 			
@@ -291,6 +307,8 @@ export default {
 				this.houseAnimating = true;
 			} else if (type === 'farm') {
 				this.farmAnimating = true;
+			} else if (type === 'shop') {
+				this.shopAnimating = true;
 			}
 
 			// 创建动画实例
@@ -310,6 +328,8 @@ export default {
 				this.houseAnimationData = animation.export();
 			} else if (type === 'farm') {
 				this.farmAnimationData = animation.export();
+			} else if (type === 'shop') {
+				this.shopAnimationData = animation.export();
 			}
 
 			// 动画结束后重置状态
@@ -318,6 +338,8 @@ export default {
 					self.houseAnimating = false;
 				} else if (type === 'farm') {
 					self.farmAnimating = false;
+				} else if (type === 'shop') {
+					self.shopAnimating = false;
 				}
 			}, 800);
 		},
@@ -416,14 +438,24 @@ export default {
     flex-direction: column;
     gap: 20rpx;
     
+    .ui-icon-button {
+      transition: transform 0.2s ease;
+      
+      &:active {
+        transform: scale(0.9);
+        opacity: 0.8;
+      }
+    }
+    
     .ui-button {
-      background: rgba(255, 255, 255, 0.9);
-      border: none;
+      //   background: rgba(255, 255, 255, 0.9);
+      //   border: none;
+      width: 120rpx;
       padding: 16rpx 32rpx;
       border-radius: 8rpx;
       font-size: 28rpx;
       color: #333;
-      box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
+      //   box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
       min-width: 120rpx;
       
       &:active {
@@ -431,6 +463,13 @@ export default {
         transform: scale(0.95);
       }
     }
+    
+    .backpack-button {
+      background-image: url('/static/island/icon_backpack.png');
+      background-size: cover;
+      background-position: center;
+      background-repeat: no-repeat;
+    }
   }
 }