Feat: 地标好物（服务）

(cherry picked from commit d3957be379)

pages/home/components/culture.vue

@@ -1,7 +1,17 @@
 <template>
+ <view>
   <view class="culture v12-d-grid-columns-2">
-    <view class="img-item " v-for="item in 10" :key="item"></view>
+    <view class="img-item " v-for="(item, index) in list" :key="index">
+      <image class="img-item" :src="item" mode="widthFix|heightFix" lazy-load="false"></image>
+    </view>
   </view>
+  <image
+    v-if="list.length === 0"
+    :src="webUrl + '/20231023131208675588.png'"
+    class="img-nodata"
+    mode="scaleToFill"
+  />
+ </view>
 </template>
 
 <script>
@@ -14,14 +24,27 @@ export default {
   },
   data() {
     return {
+      webUrl: this.$VUE_APP_RESOURCES_URL,
       list: []
     }
   },
-  mounted() {
-    getCulture({landmarkDataId: this.landmarkDataId}).then(res => {
-      this.list = res.data
-    })
+  watch: {
+    landmarkDataId(value) {
+      if(value) {
+        this.getData()
+      }
+    }
   },
+  mounted() {
+    this.getData()
+  },
+  methods: {
+    getData() {
+      getCulture({landmarkDataId: this.landmarkDataId}).then(res => {
+        this.list = res.data.cultureImages
+      })
+    }
+  }
 }
 </script>
 
@@ -31,8 +54,17 @@ export default {
   padding: 20rpx;
 }
 .img-item{
+  width: 340rpx;
   height: 320rpx;
-  background: rgba(137,35,35,0.39);
   border-radius: 16rpx;
 }
+.img-nodata {
+  position: relative;
+  top: 0;
+  left: 50%;
+  transform: translate(-50%, 0);
+  width: 352rpx;
+  height: 338rpx;
+  margin-bottom: 60rpx;
+}
 </style>