第一次提交

2023-08-04 13:14:48 +08:00
commit 1b923e5cff
1030 changed files with 128016 additions and 0 deletions
--- a/sub_pages/goods/components/Service.vue
+++ b/sub_pages/goods/components/Service.vue
@@ -0,0 +1,158 @@
+<template>
+  <view v-if="list.length" class="service-wrapper" :style="appThemeStyle">
+    <!-- 服务简述 -->
+    <view class="service-simple" @click="handlePopup">
+      <view class="s-list">
+        <view class="s-item" v-for="(item, index) in list" :key="index">
+          <text class="item-icon iconfont icon-fuwu"></text>
+          <text class="item-val">{{ item.name }}</text>
+        </view>
+      </view>
+      <!-- 扩展箭头 -->
+      <view class="s-arrow f-26 col-9 t-r">
+        <text class="iconfont icon-arrow-right"></text>
+      </view>
+    </view>
+    <!-- 详情内容弹窗 -->
+    <u-popup v-model="showPopup" mode="bottom" :closeable="true" :border-radius="26">
+      <view class="service-content">
+        <view class="title">服务</view>
+        <scroll-view class="content-scroll" :scroll-y="true">
+          <view class="s-list clearfix">
+            <view class="s-item" v-for="(item, index) in list" :key="index">
+              <text class="item-icon iconfont icon-fuwu"></text>
+              <view class="item-val">{{ item.name }}</view>
+              <view class="item-summary">{{ item.summary }}</view>
+            </view>
+          </view>
+        </scroll-view>
+      </view>
+    </u-popup>
+  </view>
+</template>
+
+<script>
+  // import * as ServiceApi from '@/api/goods/service'
+
+  export default {
+    props: {
+      // 商品ID
+      goodsId: {
+        type: Number,
+        default: null
+      }
+    },
+    data() {
+      return {
+        // 正在加载
+        isLoading: true,
+        // 显示详情内容弹窗
+        showPopup: false,
+        // 服务列表数据
+        list: []
+      }
+    },
+
+    created() {
+      // 获取商品服务列表
+      // this.getServiceList()
+    },
+
+    methods: {
+
+      // 获取商品服务列表
+      getServiceList() {
+        const app = this
+        app.isLoading = true
+        ServiceApi.list(app.goodsId)
+          .then(result => app.list = result.data.list)
+          .finally(() => app.isLoading = false)
+      },
+
+      // 显示弹窗
+      handlePopup() {
+        this.showPopup = !this.showPopup
+      }
+
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .service-wrapper {
+    min-height: 24rpx;
+    margin-bottom: -24rpx;
+  }
+
+  // 服务简述
+  .service-simple {
+    padding: 24rpx 30rpx;
+    display: flex;
+    align-items: center;
+
+    .s-list {
+      flex: 1;
+      margin-left: -15rpx;
+    }
+
+    .s-item {
+      float: left;
+      font-size: 26rpx;
+      margin: 8rpx 15rpx;
+
+      .item-icon {
+        color: $main-bg;
+      }
+
+      .item-val {
+        margin-left: 12rpx;
+      }
+    }
+
+
+  }
+
+  // 服务详细内容
+  .service-content {
+    padding: 24rpx;
+
+    .title {
+      font-size: 30rpx;
+      margin-bottom: 50rpx;
+      font-weight: bold;
+      text-align: center;
+    }
+
+    .content-scroll {
+      min-height: 400rpx;
+      max-height: 760rpx;
+    }
+
+    .s-list {
+      padding: 0 30rpx 0 80rpx;
+    }
+
+    .s-item {
+      position: relative;
+      margin-bottom: 60rpx;
+
+      .item-icon {
+        position: absolute;
+        top: 6rpx;
+        left: -50rpx;
+        color: $main-bg;
+      }
+
+      .item-val {
+        font-size: 28rpx;
+      }
+
+      .item-summary {
+        font-size: 26rpx;
+        margin-top: 20rpx;
+        color: #6d6d6d;
+      }
+    }
+
+  }
+</style>