ceres-merchant-web-v2.0/canvas-container/components/toolBar/toolModule/tool-product-source.vue

<template>
  <div class="tool-select-product">
    <div class="title">
      <div>商品来源</div>
      <div class="source-select">
        <el-radio class="source-item" v-model="productData.sourceType" label="1">商品</el-radio>
        <el-radio class="source-item" v-model="productData.sourceType" label="2">类别</el-radio>
        <el-radio class="source-item" v-model="productData.sourceType" label="3">新品推荐</el-radio>
        <el-radio class="source-item" v-model="productData.sourceType" label="4">低价优选</el-radio>
        <el-radio class="source-item" v-model="productData.sourceType" label="5">尖端首发</el-radio>
        <el-radio class="source-item" v-model="productData.sourceType" label="6">热销排行</el-radio>
      </div>
    </div>
    <div class="porListBox">
      <product-source-multiple :productData.sync='productData' v-if="productData.sourceType=='1'" :type="type"></product-source-multiple>
      <product-source-category :productData.sync='productData' v-if="productData.sourceType=='2'" :type="type"></product-source-category>
    </div>
  </div>
</template>

<script>
import ProductSourceCategory from './product-source-category'
import ProductSourceMultiple from './product-source-multiple'
export default {
name: "tool-product-source",
  components: { ProductSourceMultiple, ProductSourceCategory },
  data () {
    return {
      categoryList: [],
      dialogCategory: false,
      sourceType: "1",
    }
  },
  props: {
    productData: {
      type: Object,
      default: () => {}
    },
    type: {
      type: String,
      default: ''
    }
  },
  mounted () {
  },
  methods: {
  }
}
</script>

<style lang="scss" scoped>
 .tool-select-product{
   .title{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: flex-start;
    justify-content: center;
    align-items: flex-start;
     margin-bottom: 10px;

     .source-select{
      margin-top: 10px;
      .source-item{
        width: 50%;
        margin-right: 0px;
      }
     }
   }
 }
</style>