修正项目

xlcs-user/components/PickUpLocationItem/PickUpLocationItem.vue

@@ -0,0 +1,99 @@
+<template>
+  <block>
+    <u-tag v-if="isCurrent" class="gg-current-location-tag u-m-l-20" mode="dark" size="mini" text="当前提货点"
+           type="error"/>
+
+    <view :class="{ selected }" class="gg-current-location u-p-20" @click="changePickUpLocation(location.id)">
+      <u-image :src="location.storePath" border-radius="10rpx" class="gg-current-location-img" height="150rpx"
+               width="150rpx"></u-image>
+      <view class="gg-current-location-msg u-m-l-20 u-m-r-20">
+        <view class="gg-current-location-msg-title u-m-b-5">{{ location.takeName }}</view>
+        <view class="gg-current-location-msg-distance-address u-m-t-5">
+          <text v-if="location.distance" class="gg-current-location-msg-distance u-font-xs u-m-r-20">
+            距离最近*距离{{ location.distance }}km
+          </text>
+          <text class="gg-current-location-msg-address u-font-xs">{{ location.detailAddress }}</text>
+        </view>
+      </view>
+      <block v-if="showRadio">
+        <view v-if="isCurrent" class="gg-current-location-btn">
+          <u-icon color="#fa3534" name="checkmark-circle-fill" size="40"/>
+        </view>
+        <view v-else class="gg-current-location-btn">
+          <u-icon name="checkmark-circle-fill" size="40"/>
+        </view>
+      </block>
+    </view>
+  </block>
+</template>
+
+<script>
+export default {
+  name: 'PickUpLocationItem',
+  props: {
+    selected: {
+      type: Boolean,
+      default: false
+    },
+    isCurrent: {
+      type: Boolean,
+      default: true
+    },
+    showRadio: {
+      type: Boolean,
+      default: true
+    },
+    location: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    }
+  },
+  methods: {
+    changePickUpLocation(id) {
+      this.$emit('selectPickUpLocation', id);
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.selected {
+  background-color: $u-type-info !important;
+}
+
+.gg-current-location {
+  display: flex;
+  background-color: $u-type-info-light;
+  border-radius: 20rpx;
+
+  &-tag {
+    position: absolute;
+    z-index: 9999;
+  }
+
+  &-msg {
+    flex: 1;
+
+    &-title {
+      font-weight: bold;
+    }
+
+    &-distance {
+      color: $u-type-error;
+    }
+
+    &-address {
+      color: $u-type-info;
+    }
+  }
+
+  &-btn {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+  }
+}
+</style>