增加代客下单页面

src/views/tool/Instead/components/goods-item.vue

@@ -0,0 +1,50 @@
+<template>
+  <div class="goods-item">
+    <el-image v-if="item.coverImg" class="goods-image" :src="item.coverImg" fit="cover"></el-image>
+    <div class="info">
+      <div class="name u-flex u-flex-wrap">
+        <span class="weight" v-if="item.type == 'weigh'">称重</span>
+        <span>{{ item.name }}</span>
+      </div>
+      <div class="">￥{{ item.lowPrice }}</div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+const props = defineProps({
+  item: {
+    type: Object,
+    default: () => ({}),
+  },
+  index: Number,
+  active: Boolean,
+  select: Function,
+});
+</script>
+<style scoped lang="scss">
+.goods-item {
+  width: 100px;
+  height: 100px;
+  border-radius: 4px;
+  position: relative;
+  overflow: hidden;
+  cursor: pointer;
+  .goods-image {
+    width: 100%;
+    height: 100%;
+  }
+  .info {
+    position: absolute;
+    box-sizing: border-box;
+    padding: 8px;
+    font-size: 14px;
+    color: #fff;
+    inset: 0;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    background-color: rgba(46, 46, 46, 0.38);
+  }
+}
+</style>