queenwuli
2020-12-27 cc499362b6eba119792e113796e4da029a70fc6d
hive-app/pages/workbench/productDetail/combo.vue
@@ -1,56 +1,87 @@
<template>
   <!-- 套餐 -->
   <view>
      <view class="content">
         <view class="content-title">
            <text>套餐项目权益</text>
      <view class="list">
         <view class="list-item">
            <text>商品编码</text>
            <text>{{productInfo.goodsNo}}</text>
         </view>
         <view class="content-row flex justify-between">
            <text>深层皮肤管理</text>
            <text>2次</text>
         <view class="list-item">
            <text>商品分类</text>
            <text>{{productInfo.goodsType}}</text>
         </view>
         <view class="content-row flex justify-between">
            <text>皮肤肌底修护液 (10%)</text>
            <text>2次</text>
         <view class="list-item">
            <text>套餐类型</text>
            <text>{{productInfo.isCourse | formatType}}</text>
         </view>
         <view class="list-item">
            <text>最大使用次数</text>
            <text>{{productInfo.maxUseCnt || '-'}}</text>
         </view>
         <view class="list-item">
            <text>每人限购次数</text>
            <text>{{productInfo.limitBuyCnt || '-'}}</text>
         </view>
         <view class="list-item">
            <text>最大销售数量</text>
            <text>{{productInfo.maxSaleCnt || '-'}}</text>
         </view>
      </view>
      <view class="content mt-10">
         <view class="content-title">
      <view class="list">
         <view class="title">
            <text>套餐项目权益</text>
         </view>
         <view class="list-item" v-for="item in productInfo.assembleTaocanProj">
            <text>{{item.goodsName}}</text>
            <text>{{item.volume}}次</text>
         </view>
      </view>
      <view class="list">
         <view class="title">
            <text>套餐产品权益</text>
         </view>
         <view class="content-row flex justify-between">
            <text>深层皮肤管理</text>
            <text>2次</text>
         </view>
         <view class="content-row flex justify-between">
            <text>皮肤肌底修护液 (10%)</text>
            <text>2次</text>
         <view class="list-item" v-for="item in productInfo.assembleTaocanProduct">
            <text>{{item.goodsName}}</text>
            <text>{{item.volume}}次</text>
         </view>
      </view>
   </view>
</template>
<script>
   export default{
      props:{
         productInfo: {
            default: {}
         }
      },
      filters:{
         formatType(val){
            if(val === 'Y'){
               return '任选套餐'
            } else {
               return '固定套餐'
            }
         }
      }
   }
</script>
<style>
   .content{
      text-align: center;
   .list{
      background: #FFFFFF;
      padding: 0 10px;
      border-radius: 4px;
      box-shadow:0 -6px 6px rgba(237,234,244,0.5);
      font-size: 14px;
   }
   .content-title{
      padding: 12px 0 0;
      font-size: 15px;
   .list .title{
      text-align: center;
      padding: 20px 0 8px;
      font-size: 16px;
   }
   .content-row{
   .list-item{
      display: flex;
      justify-content: space-between;
      border-bottom: 1px solid #EDEAF4;
      padding: 12px 0;
   }
   .content-row:nth-last-child(1){
      border: 0;
   }
</style>