chenrui 11 mesiacov pred
rodič
commit
158e78fbbb

+ 22 - 0
src/config/router.config.js

@@ -3429,6 +3429,28 @@ export const asyncRouterMap = [
                   hidden: true,
                   permission: 'M_promotionManagementList'
                 }
+              },
+              {
+                path: 'add',
+                name: 'promotionManagementAdd',
+                component: () => import(/* webpackChunkName: "promotionRulesManagement" */ '@/views/promotionRulesManagement/promotionManagement/edit.vue'),
+                meta: {
+                  title: '新增修理厂促销',
+                  icon: 'file-ppt',
+                  hidden: true
+                  // permission: 'B_promotionManagementAdd'
+                }
+              },
+              {
+                path: 'edit/:sn',
+                name: 'promotionManagementEdit',
+                component: () => import(/* webpackChunkName: "promotionRulesManagement" */ '@/views/promotionRulesManagement/promotionManagement/edit.vue'),
+                meta: {
+                  title: '编辑修理厂促销',
+                  icon: 'file-ppt',
+                  hidden: true
+                  // permission: 'B_promotionManagementEdit'
+                }
               }
             ]
           },

+ 275 - 0
src/views/promotionRulesManagement/promotionManagement/chooseProductsModal.vue

@@ -0,0 +1,275 @@
+<template>
+  <a-drawer
+    :zIndex="zIndex"
+    title="选择产品"
+    placement="right"
+    :visible="isShow"
+    width="80%"
+    :get-container="false"
+    :wrap-style="{ position: 'absolute' }"
+    :headerStyle="{ padding: '10px' }"
+    @close="onClose"
+    wrapClassName="chooseProducts-modal">
+    <a-spin :spinning="spinning" tip="Loading...">
+      <div class="products-con">
+        <!-- 搜索条件 -->
+        <div class="table-page-search-wrapper">
+          <a-form-model
+            ref="ruleForm"
+            class="form-model-con"
+            layout="inline"
+            :model="queryParam"
+            :label-col="formItemLayout.labelCol"
+            :wrapper-col="formItemLayout.wrapperCol">
+            <a-row :gutter="15">
+              <a-col :md="8" :sm="24">
+                <a-form-model-item label="产品编码">
+                  <a-input id="chooseProducts-code" v-model.trim="queryParam.code" allowClear placeholder="请输入产品编码"/>
+                </a-form-model-item>
+              </a-col>
+              <a-col :md="8" :sm="24">
+                <a-form-model-item label="原厂编码">
+                  <a-input id="chooseProducts-code" v-model.trim="queryParam.code" allowClear placeholder="请输入原厂编码"/>
+                </a-form-model-item>
+              </a-col>
+              <a-col :md="8" :sm="24">
+                <a-form-model-item label="产品名称">
+                  <a-input id="chooseProducts-name" v-model.trim="queryParam.name" allowClear placeholder="请输入产品名称"/>
+                </a-form-model-item>
+              </a-col>
+              <a-col :md="8" :sm="24">
+                <a-form-model-item label="产品分类">
+                  <productTypeAll placeholder="请选择产品分类" @change="changeProductType" v-model="queryParam.productType" id="chooseProducts-productType"></productTypeAll>
+                </a-form-model-item>
+              </a-col>
+              <a-col :md="8" :sm="24">
+                <a-form-model-item label="产品品牌">
+                  <ProductBrand id="chooseProducts-productBrandSn" v-model="queryParam.productBrandSn"></ProductBrand>
+                </a-form-model-item>
+              </a-col>
+              <a-col :md="8" :sm="24" style="margin-bottom: 10px;">
+                <a-button type="primary" @click="$refs.table.refresh()" :disabled="disabled" id="chooseProducts-refresh">查询</a-button>
+                <a-button style="margin-left: 5px" @click="resetData" :disabled="disabled" id="chooseProducts-reset">重置</a-button>
+              </a-col>
+            </a-row>
+          </a-form-model>
+        </div>
+        <div style="margin-bottom: 10px">
+          <a-button type="primary" ghost :loading="loading" @click="handleSave">批量添加</a-button>
+          <span style="margin-left: 5px">
+            <template v-if="selectCount"> {{ `已选 ${selectCount} 项` }} </template>
+          </span>
+        </div>
+        <!-- 列表 -->
+        <s-table
+          class="sTable"
+          ref="table"
+          size="small"
+          :rowKey="(record) => record.productSn"
+          rowKeyName="productSn"
+          :row-selection="{ columnWidth: 40, getCheckboxProps:record =>({props: { disabled: this.chooseDataList && this.chooseDataList.indexOf(record.productSn) > -1 } })}"
+          @rowSelection="rowSelectionFun"
+          :columns="columns"
+          :pagination="{pageSizeOptions: ['20','50','100','200','500']}"
+          :data="loadData"
+          :defaultLoadData="false"
+          style="max-height:700px;"
+          :scroll="{ y: 550 }"
+          bordered>
+          <!-- 产品分类 -->
+          <template slot="productType" slot-scope="text, record">
+            <span v-if="record.productTypeName2 || record.productTypeName3">{{ record.productTypeName2 }} {{ record.productTypeName3 ? '>' : '' }} {{ record.productTypeName3 }}</span>
+            <span v-else>--</span>
+          </template>
+          <!-- 包装数 -->
+          <template slot="productQty" slot-scope="text, record">
+            <span v-if="record.packQty">
+              {{ record.packQty }}{{ record.unit }}/{{ record.packQtyUnit?record.packQtyUnit:'--' }}
+            </span>
+            <span v-else>--</span>
+          </template>
+        </s-table>
+      </div>
+    </a-spin>
+  </a-drawer>
+</template>
+
+<script>
+import { commonMixin } from '@/utils/mixin'
+import { STable } from '@/components'
+import { productList } from '@/api/product'
+import ProductBrand from '@/views/common/productBrand.js'
+import productTypeAll from '@/views/common/productTypeAll.js'
+export default {
+  name: 'ChooseProductsModal',
+  components: { STable, ProductBrand, productTypeAll },
+  mixins: [commonMixin],
+  props: {
+    openModal: { //  弹框显示状态
+      type: Boolean,
+      default: false
+    },
+    chooseData: {
+      type: Array,
+      default: () => {
+        return []
+      }
+    },
+    zIndex: { // 层级
+      type: [String, Number],
+      default: 1000
+    }
+  },
+  data () {
+    const _this = this
+    return {
+      spinning: false,
+      isShow: this.openModal, //  是否打开弹框
+      formItemLayout: {
+        labelCol: { span: 4 },
+        wrapperCol: { span: 20 }
+      },
+      queryParam: { //  查询条件
+        name: '', // 产品名称
+        code: '', //  产品编码
+        productBrandSn: undefined, //  产品品牌
+        productType: [],
+        productTypeSn1: '', //  产品一级分类
+        productTypeSn2: '', //  产品二级分类
+        productTypeSn3: '' //  产品三级分类
+      },
+      chooseDataList: [],
+      disabled: false, //  查询、重置按钮是否可操作
+      loading: false, //  表格加载中
+      columns: [
+        { title: '序号', dataIndex: 'no', width: 60, align: 'center' },
+        { title: '产品编码', dataIndex: 'code', align: 'center' },
+        { title: '产品名称', dataIndex: 'name', align: 'center', width: '18%', ellipsis: true, customRender: function (text) { return text || '--' } },
+        { title: '原厂编码', dataIndex: 'origCode', align: 'center', ellipsis: true, customRender: function (text) { return text || '--' } },
+        { title: '省级价', dataIndex: 'provincePrice', width: '6%', align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
+        { title: '市级价', dataIndex: 'cityPrice', width: '6%', align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
+        { title: '特约价', dataIndex: 'specialPrice', width: '6%', align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
+        { title: '品牌', dataIndex: 'productBrandName', align: 'center', ellipsis: true, customRender: function (text) { return text || '--' } },
+        { title: '产品分类', scopedSlots: { customRender: 'productType' }, width: '10%', align: 'center' },
+        { title: '包装数', scopedSlots: { customRender: 'productQty' }, align: 'center' },
+        { title: '单位', dataIndex: 'unit', align: 'center', ellipsis: true, customRender: function (text) { return text || '--' } }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        this.disabled = true
+        this.spinning = true
+        const params = Object.assign(parameter, this.queryParam)
+        return productList(params).then(res => {
+          let data
+          if (res.status == 200) {
+            data = res.data
+            const no = (data.pageNo - 1) * data.pageSize
+            for (var i = 0; i < data.list.length; i++) {
+              data.list[i].no = no + i + 1
+            }
+            this.disabled = false
+          }
+          this.spinning = false
+          return data
+        })
+      },
+      rowSelectionInfo: null
+    }
+  },
+  computed: {
+    selectCount () {
+      return this.rowSelectionInfo && this.rowSelectionInfo.selectedRowKeys.length
+    }
+  },
+  methods: {
+    // 表格选中项
+    rowSelectionFun (obj) {
+      this.rowSelectionInfo = obj || null
+    },
+    // 重置数据
+    resetData () {
+      this.queryParam.code = ''
+      this.queryParam.name = ''
+      this.queryParam.productBrandSn = undefined
+      this.queryParam.productTypeSn1 = ''
+      this.queryParam.productTypeSn2 = ''
+      this.queryParam.productTypeSn3 = ''
+      this.queryParam.productType = []
+      this.$nextTick(() => {
+        this.$refs.table.refresh(true)
+      })
+    },
+    //  清空选项
+    resetSearchForm () {
+      this.$refs.table.clearSelected()
+    },
+    // 保存
+    handleSave () {
+      if (!this.rowSelectionInfo || (this.rowSelectionInfo && this.rowSelectionInfo.selectedRowKeys.length < 1)) {
+        this.$message.warning('请在列表勾选后再进行操作!')
+        return
+      }
+      const resultList = JSON.parse(JSON.stringify(this.rowSelectionInfo && this.rowSelectionInfo.selectedRows))
+      this.$emit('ok', resultList)
+      this.isShow = false
+    },
+    // 关闭弹框
+    onClose () {
+      this.isShow = false
+      this.$emit('close')
+    },
+    //  产品分类  change
+    changeProductType (val, opt) {
+      this.queryParam.productTypeSn1 = val[0] ? val[0] : ''
+      this.queryParam.productTypeSn2 = val[1] ? val[1] : ''
+      this.queryParam.productTypeSn3 = val[2] ? val[2] : ''
+    },
+    // 禁用
+    handleDisabled (list) {
+      this.chooseDataList = list
+    }
+  },
+  watch: {
+    //  父页面传过来的弹框状态
+    openModal (newValue, oldValue) {
+      this.isShow = newValue
+    },
+    //  重定义的弹框状态
+    isShow (newValue, oldValue) {
+      if (!newValue) {
+        this.resetSearchForm()
+        this.rowSelectionInfo = null
+        this.$emit('close')
+      } else {
+        const _this = this
+        _this.resetData()
+        if (_this.chooseData && _this.chooseData.length > 0) {
+          let selectedRows = []
+          const selectedRowKeys = []
+          _this.chooseData.forEach(item => {
+            selectedRowKeys.push(item.goodsSn)
+          })
+          selectedRows = _this.chooseData
+          this.$nextTick(() => { // 页面渲染完成后的回调
+            _this.$refs.table.setTableSelected(selectedRowKeys, selectedRows) // 设置表格选中项
+          })
+        }
+      }
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+  .chooseProducts-modal{
+    .products-con{
+      .btn-con{
+        text-align: center;
+        margin: 30px 0 20px;
+        .button-cancel{
+          font-size: 12px;
+        }
+      }
+    }
+  }
+</style>

+ 489 - 0
src/views/promotionRulesManagement/promotionManagement/edit.vue

@@ -0,0 +1,489 @@
+<template>
+  <div class="promotionEdit-wrap">
+    <a-spin :spinning="spinning" tip="Loading...">
+      <a-page-header :ghost="false" :backIcon="false" class="promotionEdit-cont" >
+        <!-- 自定义的二级文字标题 -->
+        <template slot="subTitle">
+          <a id="promotionEdit-back-btn" href="javascript:;" @click="handleBack"><a-icon type="left" /> 返回列表</a>
+        </template>
+      </a-page-header>
+      <!-- 表单 -->
+      <a-form-model
+        id="promotionEdit-form"
+        ref="ruleForm"
+        :model="form"
+        :rules="rules"
+        :label-col="formItemLayout.labelCol"
+        :wrapper-col="formItemLayout.wrapperCol"
+      >
+        <a-card :bordered="false" class="promotionEdit-cont">
+          <a-row>
+            <a-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
+              <a-form-model-item label="标题名称" prop="title">
+                <a-input
+                  id="promotionEdit-title"
+                  :maxLength="30"
+                  v-model.trim="form.title"
+                  placeholder="请输入标题名称(最多30个字符)"
+                  :disabled="isDisabled"
+                  allowClear/>
+              </a-form-model-item>
+            </a-col>
+            <a-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
+              <a-form-model-item label="排序" prop="sort">
+                <a-input-number
+                  style="width:100%"
+                  id="promotionEdit-sort"
+                  :disabled="isDisabled"
+                  allowClear
+                  placeholder="请输入排序数字(数字越大越靠后)"
+                  v-model="form.sort"
+                  :min="0"
+                  :max="999999"/>
+              </a-form-model-item>
+            </a-col>
+            <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+              <a-form-model-item label="封面图片" prop="imageSet" :label-col="{span:2}" :wrapper-col="{span:20}">
+                <Upload
+                  v-if="pageType==='add'"
+                  class="upload"
+                  id="promotionEdit-imageSet"
+                  v-model="form.imageSet"
+                  ref="imageSet"
+                  :fileSize="10"
+                  :maxNums="10"
+                  @change="changeImage"
+                  listType="picture-card"></Upload>
+                <Upload
+                  v-else-if="pageType==='edit'&&!isDisabled"
+                  class="upload"
+                  id="promotionEdit-imageSet"
+                  v-model="form.imageSet"
+                  ref="imageSet"
+                  :fileSize="10"
+                  :maxNums="10"
+                  @change="changeImage"
+                  listType="picture-card"></Upload>
+                <div v-else>
+                  <img
+                    :src="con"
+                    alt="图片走丢了"
+                    width="80"
+                    height="80"
+                    v-for="(con,i) in images"
+                    style="margin-right:10px;"
+                    :key="i" />
+                </div>
+                <span class="upload-desc">说明:单张大小小于10Mb,最多10张;建议尺寸:宽(420px)*高(230px)</span>
+              </a-form-model-item>
+            </a-col>
+            <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+              <a-form-model-item label="内容类型" prop="contentType" :label-col="{span:2}" :wrapper-col="{span:18}">
+                <v-select
+                  v-model="form.contentType"
+                  ref="saleStatus"
+                  id="promotion-saleStatus"
+                  code="PROMO_CONTENT_TYPE"
+                  showType="radio"
+                  :disabled="isDisabled"
+                  allowClear></v-select>
+              </a-form-model-item>
+            </a-col>
+            <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+              <a-form-model-item label="内容" prop="content" v-show="form.contentType =='IMAGE_CONTENT'" :label-col="{span:2}" :wrapper-col="{span:20}">
+                <editor
+                  v-if="pageType === 'add'"
+                  id="promotionEdit-editor"
+                  ref="editor"
+                  class="promotionEdit-editor"
+                  @on-change="editorChange"
+                  :cache="false"></editor>
+                <editor
+                  v-if="pageType === 'edit'&&!isDisabled"
+                  id="promotionEdit-editor"
+                  ref="editor"
+                  class="promotionEdit-editor"
+                  @on-change="editorChange"
+                  :cache="false"></editor>
+                <div v-show="pageType === 'edit'&&isDisabled" class="box" v-html="form.content"></div>
+              </a-form-model-item>
+              <a-form-model-item label="上传视频" prop="content" v-show="form.contentType =='VIDEO'" :label-col="{span:3}" :wrapper-col="{span:18}">
+                <Upload
+                  v-if="pageType==='add'"
+                  class="upload"
+                  id="promotionEdit-imageSet"
+                  v-model="form.content"
+                  fileType="video/mp4"
+                  ref="videoSet"
+                  :fileSize="100"
+                  :maxNums="1"
+                  @change="changeVideo"
+                ></Upload>
+                <Upload
+                  v-else-if="pageType==='edit'&&!isDisabled"
+                  class="upload"
+                  id="promotionEdit-imageSet"
+                  v-model="form.content"
+                  fileType="video/mp4"
+                  ref="videoSet"
+                  :fileSize="100"
+                  :maxNums="1"
+                  @change="changeVideo"
+                ></Upload>
+                <div v-if="pageType==='edit'&&isDisabled">
+                  <video width="230" height="150" controls loop controlsList="nodownload">
+                    <source :src="form.content" type="video/mp4">
+                  </video>
+                </div>
+                <span class="upload-desc">说明:文件最大100M;视频:mp4.avi.flv</span>
+              </a-form-model-item>
+              <a-form-model-item label="跳转链接" prop="contentLink" v-if="form.contentType =='LINK'" :label-col="{span:3}" :wrapper-col="{span:18}">
+                <a-input
+                  :disabled="isDisabled"
+                  id="promotionEdit-title"
+                  :maxLength="100"
+                  v-model.trim="form.contentLink"
+                  placeholder="请输入跳转链接"
+                  allowClear />
+              </a-form-model-item>
+            </a-col>
+          </a-row>
+          <a-row style="width:83%;margin:0 auto 24px;">
+            <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+              <a-checkbox @change="onChangeParams">参数配置</a-checkbox>
+            </a-col>
+            <a-col
+              :xs="24"
+              :sm="24"
+              :md="24"
+              :lg="24"
+              :xl="24"
+              v-show="isShowParams">
+              <!-- 参数配置内容 -->
+              <setPromotion style="margin-top:20px;" @addProduct="insterProduct"></setPromotion>
+            </a-col>
+          </a-row>
+          <a-row>
+            <a-col :xs="24" :sm="24" :md="24" :lg="16" :xl="16">
+              <a-form-model-item label="是否发布" prop="enabledFlag" :label-col="{span:3}" :wrapper-col="{span:18}">
+                <a-radio-group button-style="solid" v-model="form.enabledFlag">
+                  <a-radio-button value="1">
+                    是
+                  </a-radio-button>
+                  <a-radio-button value="0">
+                    否
+                  </a-radio-button>
+                </a-radio-group>
+              </a-form-model-item>
+            </a-col>
+          </a-row>
+          <!-- <a-form-model-item label="是否显示" prop="showFlag" v-if="form.enabledFlag == 1">
+            <a-radio-group button-style="solid" v-model="form.showFlag">
+              <a-radio-button value="1">
+                显示
+              </a-radio-button>
+              <a-radio-button value="0">
+                隐藏
+              </a-radio-button>
+            </a-radio-group>
+          </a-form-model-item> -->
+        </a-card>
+      </a-form-model>
+      <!-- <div class="btn-cont">
+        <a-button id="product-brand-edit-modal-back" @click="isShow = false" style="margin-right:15px;">取消</a-button>
+        <a-button
+          style="margin-right:15px;color: #fff;background-color: #39f;border-color: #39f;"
+          @click="handleSee"
+          v-if="form.contentType !='LINK'">预览</a-button>
+        <a-button type="primary" id="product-brand-edit-modal-save" @click="handleSave">确定</a-button>
+      </div> -->
+    </a-spin>
+    <div class="affix-cont">
+      <a-button
+        type="primary"
+        class="button-primary"
+        :disabled="spinning"
+        id="productInfoEdit-submit-btn"
+        size="large"
+        @click="handleSave"
+        style="padding: 0 60px;">保存</a-button>
+    </div>
+    <!-- 预览 -->
+    <promotion-show-modal ref="showModal" :openModal="openShowModal" @close="openShowModal = false"></promotion-show-modal>
+    <!-- 添加产品 -->
+    <chooseProduct ref="chooseProduct" :openModal="showProModal" @close="closeProductModal"></chooseProduct>
+  </div>
+</template>
+
+<script>
+import { commonMixin } from '@/utils/mixin'
+import { VSelect, Upload } from '@/components'
+import Editor from '@/components/WEeditor'
+import { saveActive, promoTerminalDetail } from '@/api/promoTerminal'
+import promotionShowModal from './promotionShowModal'
+import setPromotion from './setPromotion'
+import chooseProduct from './chooseProductsModal.vue'
+export default {
+  name: 'ProductBrandEditModal',
+  mixins: [commonMixin],
+  components: { VSelect, Upload, Editor, promotionShowModal, setPromotion, chooseProduct },
+  props: {
+    openModal: { //  弹框显示状态
+      type: Boolean,
+      default: false
+    },
+    itemId: {
+      type: [Number, String],
+      default: ''
+    },
+    pageType: {
+      type: String,
+      default: 'add'
+    }
+  },
+  computed: {
+    modalTit () {
+      return this.pageType != 'add' ? '发布修改' : '促销发布'
+    }
+  },
+  data () {
+    return {
+      isShow: this.openModal, //  是否打开弹框
+      spinning: false,
+      formItemLayout: {
+        labelCol: { span: 4 },
+        wrapperCol: { span: 16 }
+      },
+      form: {
+        promoActiveSn: undefined,
+        title: '',
+        contentType: 'IMAGE_CONTENT',
+        imageSet: '',
+        showFlag: '0',
+        content: '',
+        enabledFlag: '0',
+        sort: undefined,
+        contentLink: ''
+      },
+      showProModal: false,
+      images: [],
+      isShowParams: false, // 是否显示参数配置内容
+      openShowModal: false,
+      isDisabled: false, // 控制是否能编辑
+      rules: {
+        title: [
+          { required: true, message: '请输入标题名称', trigger: 'blur' }
+        ],
+        imageSet: [
+          { required: true, message: '请选择要上传的封面图片', trigger: 'change' }
+        ],
+        sort: [
+          { required: true, message: '请输入排序数字', trigger: 'blur' }
+        ],
+        contentType: [
+          { required: true, message: '请选择内容类型', trigger: 'change' }
+        ],
+        content: [
+          { required: true, message: '请输入对应内容', trigger: ['blur', 'change'] }
+        ],
+        contentLink: [
+          { required: true, message: '请输入对应内容', trigger: 'blur' }
+        ],
+        enabledFlag: [
+          { required: true, message: '请选择是否发布', trigger: 'change' }
+        ],
+        showFlag: [
+          { required: true, message: '请选择是否显示', trigger: 'change' }
+        ]
+      }
+    }
+  },
+  methods: {
+    // 设置参数
+    onChangeParams (e) {
+      this.isShowParams = e.target.checked
+    },
+    // 打开弹窗
+    insterProduct (flag) {
+      this.showProModal = true
+    },
+    // 返回列表
+    handleBack () {
+      this.$router.push({ name: 'promotionManagementList', query: { closeLastOldTab: true } })
+    },
+    // 预览
+    handleSee () {
+      if (this.form.content) {
+        this.openShowModal = true
+        this.$refs.showModal.pageInit({ type: this.form.contentType, con: this.form.content })
+      } else {
+        this.$message.error('请输入预览内容!')
+      }
+    },
+    //  详情
+    getDetail () {
+      promoTerminalDetail({ sn: this.itemId }).then(res => {
+        if (res.status == 200) {
+          this.isDisabled = res.data.state === 'PUBLISH'
+          this.form.promoActiveSn = res.data.promoActiveSn
+          this.form.title = res.data.title
+          this.form.contentType = res.data.contentType
+          this.form.showFlag = res.data.showFlag
+          this.form.enabledFlag = res.data.enabledFlag
+          this.form.sort = res.data.sort
+          this.images = res.data.imageSet
+          this.form.imageSet = res.data.images
+          this.form.content = res.data.content
+          this.$refs.imageSet.setFileList(res.data.images)
+          if (res.data.contentType == 'IMAGE_CONTENT') {
+            this.$refs.editor.setHtml(res.data.content)
+          } else if (res.data.contentType == 'VIDEO') {
+            if (res.data.state != 'PUBLISH') {
+              this.$refs.videoSet.setFileList(res.data.content)
+            }
+          } else if (res.data.contentType == 'LINK') {
+            this.form.contentLink = res.data.content
+          }
+        }
+      })
+    },
+    closeProductModal () {
+
+    },
+
+    //  确定
+    handleSave () {
+      const _this = this
+      if (_this.form.contentType == 'LINK') {
+        _this.form.content = _this.form.contentLink
+      }
+      _this.$refs.ruleForm.validate(valid => {
+        if (valid) {
+          _this.form.promoActiveSn = this.itemId
+          const formData = JSON.parse(JSON.stringify(_this.form))
+          formData.imageSet = formData.imageSet ? formData.imageSet.split(',') : []
+          formData.showFlag = formData.enabledFlag == 0 ? '0' : formData.showFlag
+          if (formData.contentType == 'LINK') {
+            delete formData.contentLink
+          }
+          _this.spinning = true
+          saveActive(formData).then(res => {
+            if (res.status == 200) {
+              _this.$message.success(res.message)
+              _this.spinning = false
+              _this.isShow = false
+              _this.$emit('ok')
+            } else {
+              _this.spinning = false
+            }
+          })
+        } else {
+          return false
+        }
+      })
+    },
+    //  图片上传
+    changeImage (file) {
+      this.form.imageSet = file
+    },
+    // 视频上传
+    changeVideo (file) {
+      this.form.content = file
+    },
+    //  文本编辑器
+    editorChange (html, text) {
+      this.form.content = html
+    }
+  },
+  watch: {
+    //  父页面传过来的弹框状态
+    openModal (newValue, oldValue) {
+      this.isShow = newValue
+    },
+    //  重定义的弹框状态
+    isShow (newValue, oldValue) {
+      if (!newValue) {
+        this.$emit('close')
+        if (this.pageType == 'add' || (this.pageType == 'edit' && !this.isDisabled)) {
+          this.$refs.imageSet.setFileList('')
+          this.$refs.videoSet.setFileList('')
+        }
+        if (this.$refs.editor) {
+          this.$refs.editor.setHtml('')
+        }
+        this.form = {
+          promoActiveSn: undefined,
+          title: '',
+          contentType: 'IMAGE_CONTENT',
+          imageSet: '',
+          showFlag: '0',
+          content: '',
+          enabledFlag: '0',
+          sort: undefined
+        }
+        this.images = []
+        this.isDisabled = false
+        this.$refs.ruleForm.resetFields()
+        this.$refs.formBox.scrollTop = 0
+      } else {
+        if (this.pageType == 'edit') {
+          this.getDetail()
+        }
+      }
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.promotionEdit-wrap{
+    position: relative;
+    height: 100%;
+    padding-bottom: 51px;
+    box-sizing: border-box;
+    >.ant-spin-nested-loading{
+      overflow-y: scroll;
+      height: 100%;
+    }
+    .promotionEdit-cont{
+      margin-bottom: 10px;
+    }
+    .upload{
+      width: 100%!important;
+    }
+    //  文本编辑器  工具栏样式换行
+    .promotionEdit-editor{
+      .w-e-toolbar{
+        flex-wrap: wrap;
+        z-index: 0;
+      }
+    }
+    // /deep/.upload-file .ant-upload-list-item-info{
+    //   padding:2px !important;
+    // }
+    //  商品图片描述
+    .upload-desc{
+      font-size: 12px;
+      color: #808695;
+    }
+    #promotionEdit-attachList{
+      height: auto;
+    }
+    // a{
+    //   color: inherit;
+    // }
+    .box{
+      border:1px solid #d9d9d9;
+      border-radius:4px;
+      padding:4px 11px;
+      color:rgba(0, 0, 0, 0.25);
+      cursor: not-allowed;
+      background:#fdfdfd;
+    }
+    .affix{
+      .ant-affix{
+        z-index: 101;
+      }
+    }
+  }
+</style>

+ 0 - 414
src/views/promotionRulesManagement/promotionManagement/editModal.vue

@@ -1,414 +0,0 @@
-<template>
-  <a-modal
-    centered
-    class="promotionEdit-modal"
-    :footer="null"
-    :maskClosable="false"
-    :title="modalTit"
-    v-model="isShow"
-    @cancel="isShow=false"
-    width="76%">
-    <!-- 表单 -->
-    <div class="promotionEdit-content" ref="formBox">
-      <a-spin :spinning="spinning" tip="Loading...">
-        <a-form-model
-          id="promotionEdit-form"
-          ref="ruleForm"
-          :model="form"
-          :rules="rules"
-          :label-col="formItemLayout.labelCol"
-          :wrapper-col="formItemLayout.wrapperCol"
-        >
-          <a-form-model-item label="标题名称" prop="title">
-            <a-input
-              id="promotionEdit-title"
-              :maxLength="30"
-              v-model.trim="form.title"
-              placeholder="请输入标题名称(最多30个字符)"
-              :disabled="isDisabled"
-              allowClear/>
-          </a-form-model-item>
-          <a-form-model-item label="封面图片" prop="imageSet">
-            <Upload
-              v-if="pageType==='add'"
-              class="upload"
-              id="promotionEdit-imageSet"
-              v-model="form.imageSet"
-              ref="imageSet"
-              :fileSize="10"
-              :maxNums="10"
-              @change="changeImage"
-              listType="picture-card"></Upload>
-            <Upload
-              v-else-if="pageType==='edit'&&!isDisabled"
-              class="upload"
-              id="promotionEdit-imageSet"
-              v-model="form.imageSet"
-              ref="imageSet"
-              :fileSize="10"
-              :maxNums="10"
-              @change="changeImage"
-              listType="picture-card"></Upload>
-            <div v-else>
-              <img
-                :src="con"
-                alt="图片走丢了"
-                width="80"
-                height="80"
-                v-for="(con,i) in images"
-                style="margin-right:10px;"
-                :key="i" />
-            </div>
-            <span class="upload-desc">说明:单张大小小于10Mb,最多10张;建议尺寸:宽(420px)*高(230px)</span>
-          </a-form-model-item>
-          <a-form-model-item label="排序" prop="sort">
-              <a-input-number style="width:300px;" id="promotionEdit-sort" :disabled="isDisabled" allowClear placeholder="请输入排序数字(数字越大越靠后)" v-model="form.sort" :min="0" :max="999999"/>
-          </a-form-model-item>
-          <a-form-model-item label="内容类型" prop="contentType">
-            <v-select
-              v-model="form.contentType"
-              ref="saleStatus"
-              id="promotion-saleStatus"
-              code="PROMO_CONTENT_TYPE"
-              showType="radio"
-              :disabled="isDisabled"
-              allowClear></v-select>
-          </a-form-model-item>
-          <a-form-model-item label="内容" prop="content" v-show="form.contentType =='IMAGE_CONTENT'">
-            <editor
-              v-if="pageType === 'add'"
-              id="promotionEdit-editor"
-              ref="editor"
-              class="promotionEdit-editor"
-              @on-change="editorChange"
-              :cache="false"></editor>
-            <editor
-              v-if="pageType === 'edit'&&!isDisabled"
-              id="promotionEdit-editor"
-              ref="editor"
-              class="promotionEdit-editor"
-              @on-change="editorChange"
-              :cache="false"></editor>
-            <div v-show="pageType === 'edit'&&isDisabled" class="box" v-html="form.content"></div>
-          </a-form-model-item>
-          <a-form-model-item label="上传视频" prop="content" v-show="form.contentType =='VIDEO'">
-            <Upload
-              v-if="pageType==='add'"
-              class="upload"
-              id="promotionEdit-imageSet"
-              v-model="form.content"
-              fileType="video/mp4"
-              ref="videoSet"
-              :fileSize="100"
-              :maxNums="1"
-              @change="changeVideo"
-              ></Upload>
-            <Upload
-              v-else-if="pageType==='edit'&&!isDisabled"
-              class="upload"
-              id="promotionEdit-imageSet"
-              v-model="form.content"
-              fileType="video/mp4"
-              ref="videoSet"
-              :fileSize="100"
-              :maxNums="1"
-              @change="changeVideo"
-              ></Upload>
-            <div v-if="pageType==='edit'&&isDisabled">
-              <video width="230" height="150" controls loop controlsList="nodownload">
-                <source :src="form.content" type="video/mp4">
-              </video>
-            </div>
-            <span class="upload-desc">说明:文件最大100M;视频:mp4.avi.flv</span>
-          </a-form-model-item>
-          <a-form-model-item label="跳转链接" prop="contentLink" v-if="form.contentType =='LINK'">
-            <a-input
-              :disabled="isDisabled"
-              id="promotionEdit-title"
-              :maxLength="100"
-              v-model.trim="form.contentLink"
-              placeholder="请输入跳转链接"
-              allowClear />
-          </a-form-model-item>
-          <a-form-model-item label="是否发布" prop="enabledFlag">
-            <a-radio-group button-style="solid" v-model="form.enabledFlag">
-              <a-radio-button value="1">
-                是
-              </a-radio-button>
-              <a-radio-button value="0">
-                否
-              </a-radio-button>
-            </a-radio-group>
-          </a-form-model-item>
-          <a-form-model-item label="是否显示" prop="showFlag" v-if="form.enabledFlag == 1">
-            <a-radio-group button-style="solid" v-model="form.showFlag">
-              <a-radio-button value="1">
-                显示
-              </a-radio-button>
-              <a-radio-button value="0">
-                隐藏
-              </a-radio-button>
-            </a-radio-group>
-          </a-form-model-item>
-        </a-form-model>
-      </a-spin>
-      <div class="btn-cont">
-        <a-button id="product-brand-edit-modal-back" @click="isShow = false" style="margin-right:15px;">取消</a-button>
-        <a-button
-          style="margin-right:15px;color: #fff;background-color: #39f;border-color: #39f;"
-          @click="handleSee"
-          v-if="form.contentType !='LINK'">预览</a-button>
-        <a-button type="primary" id="product-brand-edit-modal-save" @click="handleSave">确定</a-button>
-      </div>
-    </div>
-    <!-- 预览 -->
-    <promotion-show-modal ref="showModal" :openModal="openShowModal" @close="openShowModal = false"></promotion-show-modal>
-  </a-modal>
-</template>
-
-<script>
-import { commonMixin } from '@/utils/mixin'
-import { VSelect, Upload } from '@/components'
-import Editor from '@/components/WEeditor'
-import { saveActive, promoTerminalDetail } from '@/api/promoTerminal'
-import promotionShowModal from './promotionShowModal'
-export default {
-  name: 'ProductBrandEditModal',
-  mixins: [commonMixin],
-  components: { VSelect, Upload, Editor, promotionShowModal },
-  props: {
-    openModal: { //  弹框显示状态
-      type: Boolean,
-      default: false
-    },
-    itemId: {
-      type: [Number, String],
-      default: ''
-    },
-    pageType: {
-      type: String,
-      default: 'add'
-    }
-  },
-  computed: {
-    modalTit () {
-      return this.pageType != 'add' ? '发布修改' : '促销发布'
-    }
-  },
-  data () {
-    return {
-      isShow: this.openModal, //  是否打开弹框
-      spinning: false,
-      formItemLayout: {
-        labelCol: { span: 4 },
-        wrapperCol: { span: 18 }
-      },
-      form: {
-        promoActiveSn: undefined,
-        title: '',
-        contentType: 'IMAGE_CONTENT',
-        imageSet: '',
-        showFlag: '0',
-        content: '',
-        enabledFlag: '0',
-        sort: undefined,
-        contentLink: ''
-      },
-      images: [],
-      openShowModal: false,
-      isDisabled: false, // 控制是否能编辑
-      rules: {
-        title: [
-          { required: true, message: '请输入标题名称', trigger: 'blur' }
-        ],
-        imageSet: [
-          { required: true, message: '请选择要上传的封面图片', trigger: 'change' }
-        ],
-        sort: [
-          { required: true, message: '请输入排序数字', trigger: 'blur' }
-        ],
-        contentType: [
-          { required: true, message: '请选择内容类型', trigger: 'change' }
-        ],
-        content: [
-          { required: true, message: '请输入对应内容', trigger: ['blur', 'change'] }
-        ],
-        contentLink: [
-          { required: true, message: '请输入对应内容', trigger: 'blur' }
-        ],
-        enabledFlag: [
-          { required: true, message: '请选择是否发布', trigger: 'change' }
-        ],
-        showFlag: [
-          { required: true, message: '请选择是否显示', trigger: 'change' }
-        ]
-      }
-    }
-  },
-  methods: {
-    // 预览
-    handleSee () {
-      if (this.form.content) {
-        this.openShowModal = true
-        this.$refs.showModal.pageInit({ type: this.form.contentType, con: this.form.content })
-      } else {
-        this.$message.error('请输入预览内容!')
-      }
-    },
-    //  详情
-    getDetail () {
-      promoTerminalDetail({ sn: this.itemId }).then(res => {
-        if (res.status == 200) {
-          this.isDisabled = res.data.state === 'PUBLISH'
-          this.form.promoActiveSn = res.data.promoActiveSn
-          this.form.title = res.data.title
-          this.form.contentType = res.data.contentType
-          this.form.showFlag = res.data.showFlag
-          this.form.enabledFlag = res.data.enabledFlag
-          this.form.sort = res.data.sort
-          this.images = res.data.imageSet
-          this.form.imageSet = res.data.images
-          this.form.content = res.data.content
-          this.$refs.imageSet.setFileList(res.data.images)
-          if (res.data.contentType == 'IMAGE_CONTENT') {
-            this.$refs.editor.setHtml(res.data.content)
-          } else if (res.data.contentType == 'VIDEO') {
-            if (res.data.state != 'PUBLISH') {
-              this.$refs.videoSet.setFileList(res.data.content)
-            }
-          } else if (res.data.contentType == 'LINK') {
-            this.form.contentLink = res.data.content
-          }
-        }
-      })
-    },
-    //  确定
-    handleSave () {
-      const _this = this
-      if (_this.form.contentType == 'LINK') {
-        _this.form.content = _this.form.contentLink
-      }
-      _this.$refs.ruleForm.validate(valid => {
-        if (valid) {
-          _this.form.promoActiveSn = this.itemId
-          const formData = JSON.parse(JSON.stringify(_this.form))
-          formData.imageSet = formData.imageSet ? formData.imageSet.split(',') : []
-          formData.showFlag = formData.enabledFlag == 0 ? '0' : formData.showFlag
-          if (formData.contentType == 'LINK') {
-            delete formData.contentLink
-          }
-          _this.spinning = true
-          saveActive(formData).then(res => {
-            if (res.status == 200) {
-              _this.$message.success(res.message)
-              _this.spinning = false
-              _this.isShow = false
-              _this.$emit('ok')
-            } else {
-              _this.spinning = false
-            }
-          })
-        } else {
-          return false
-        }
-      })
-    },
-    //  图片上传
-    changeImage (file) {
-      this.form.imageSet = file
-    },
-    // 视频上传
-    changeVideo (file) {
-      this.form.content = file
-    },
-    //  文本编辑器
-    editorChange (html, text) {
-      this.form.content = html
-    }
-  },
-  watch: {
-    //  父页面传过来的弹框状态
-    openModal (newValue, oldValue) {
-      this.isShow = newValue
-    },
-    //  重定义的弹框状态
-    isShow (newValue, oldValue) {
-      if (!newValue) {
-        this.$emit('close')
-        if (this.pageType == 'add' || (this.pageType == 'edit' && !this.isDisabled)) {
-          this.$refs.imageSet.setFileList('')
-          this.$refs.videoSet.setFileList('')
-        }
-        if (this.$refs.editor) {
-          this.$refs.editor.setHtml('')
-        }
-        this.form = {
-          promoActiveSn: undefined,
-          title: '',
-          contentType: 'IMAGE_CONTENT',
-          imageSet: '',
-          showFlag: '0',
-          content: '',
-          enabledFlag: '0',
-          sort: undefined
-        }
-        this.images = []
-        this.isDisabled = false
-        this.$refs.ruleForm.resetFields()
-        this.$refs.formBox.scrollTop = 0
-      } else {
-        if (this.pageType == 'edit') {
-          this.getDetail()
-        }
-      }
-    }
-  }
-}
-</script>
-
-<style lang="less" scoped>
-  .promotionEdit-modal{
-    .promotionEdit-content{
-      max-height:60vh;
-      overflow-y: scroll;
-  }
-    .ant-modal-body {
-      padding: 40px 40px 24px;
-    }
-    .upload{
-      width: 100%!important;
-    }
-    /deep/.upload-file .ant-upload-list-item-info{
-      padding:2px !important;
-    }
-    //  商品图片描述
-    .upload-desc{
-      font-size: 12px;
-      color: #808695;
-    }
-    //  文本编辑器  工具栏样式换行
-    .promotionEdit-editor{
-      .w-e-toolbar{
-        flex-wrap: wrap;
-      }
-    }
-    .btn-cont {
-      text-align: center;
-      margin: 35px 0 10px;
-    }
-    #promotionEdit-attachList{
-      height: auto;
-    }
-    a{
-      color: inherit;
-    }
-    .box{
-      border:1px solid #d9d9d9;
-      border-radius:4px;
-      padding:4px 11px;
-      color:rgba(0, 0, 0, 0.25);
-      cursor: not-allowed;
-      background:#fdfdfd;
-    }
-  }
-</style>

+ 13 - 9
src/views/promotionRulesManagement/promotionManagement/list.vue

@@ -160,7 +160,7 @@
       <!-- 新增 -->
       <addModal :openModal="openAddModal" :itemId="itemId" @close="closeAddModal" @ok="$refs.table.refresh()"></addModal>
       <!-- 促销发布 -->
-      <promotion-edit-modal :pageType="pageType" :openModal="openPromotionEditModal" :itemId="itemId" @close="closePromotionEditModal" @ok="$refs.table.refresh()" />
+      <!-- <promotion-edit-modal :pageType="pageType" :openModal="openPromotionEditModal" :itemId="itemId" @close="closePromotionEditModal" @ok="$refs.table.refresh()" /> -->
     </a-card>
   </div>
 </template>
@@ -174,7 +174,7 @@ import lookUpCustomersModal from './lookUpCustomersModal'
 import promotionDescModal from './promotionDescModal'
 import promotionShowModal from './promotionShowModal'
 import addModal from './addModal'
-import promotionEditModal from './editModal'
+// import promotionEditModal from './editModal'
 export default {
   name: 'PromotionList',
   mixins: [commonMixin],
@@ -185,8 +185,7 @@ export default {
     lookUpCustomersModal,
     promotionShowModal,
     promotionDescModal,
-    addModal,
-    promotionEditModal
+    addModal
   },
   data () {
     return {
@@ -333,11 +332,16 @@ export default {
     },
     // 促销发布
     handleRelease (row, type) {
-      this.itemId = row.promoActiveSn
-      this.pageType = row.imageSet && row.imageSet.length > 0 ? 'edit' : type
-      this.$nextTick(() => {
-        this.openPromotionEditModal = true
-      })
+      if (type === 'add') {
+        this.$router.push({ name: 'promotionManagementAdd' })
+      } else {
+        this.$router.push({ name: 'promotionManagementEdit', query: { sn: row.promoActiveSn } })
+      }
+      // this.itemId = row.promoActiveSn
+      // this.pageType = row.imageSet && row.imageSet.length > 0 ? 'edit' : type
+      // this.$nextTick(() => {
+      //   this.openPromotionEditModal = true
+      // })
     },
     // 关闭促销发布
     closePromotionEditModal () {

+ 372 - 0
src/views/promotionRulesManagement/promotionManagement/setPromotion.vue

@@ -0,0 +1,372 @@
+<template>
+  <a-spin :spinning="spinning" tip="Loading...">
+    <a-form-model
+      id="setPromotion-form"
+      ref="sellRuleForm"
+      :model="sellForm"
+      :rules="sellRules"
+      :label-col="sellFormItemLayout.labelCol"
+      :wrapper-col="sellFormItemLayout.wrapperCol">
+      <a-row>
+        <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+          <a-form-model-item label="基本规则" prop="contentType">
+            <v-select
+              v-model="sellForm.contentType"
+              placeholder="请选择基本规则"
+              ref="saleStatus"
+              id="promotion-saleStatus"
+              code="PROMO_CONTENT_TYPE"
+              allowClear></v-select>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
+          <a-form-model-item label="券名称" prop="title" :label-col="{span:6}" :wrapper-col="{span:18}">
+            <a-input id="setPromotion-title" :maxLength="20" v-model.trim="sellForm.title" placeholder="请输入券名称(最多20个字符)" allowClear />
+          </a-form-model-item>
+        </a-col>
+        <a-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
+          <a-form-model-item label="券副标题" :label-col="{span:4}" :wrapper-col="{span:18}">
+            <a-input id="setPromotion-title" :maxLength="20" v-model.trim="sellForm.title" placeholder="请输入券副标题(最多20个字符)" allowClear />
+          </a-form-model-item>
+        </a-col>
+        <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+          <a-form-model-item label="产品范围">
+            <div id="setPromotionRange" style="position:relative;">
+              <a-tree-select
+                v-model="con"
+                style="width: 100%"
+                :tree-data="treeData"
+                tree-checkable
+                :show-checked-strategy="SHOW_ALL"
+                :getPopupContainer="triggerNode => triggerNode.parentNode"
+                placeholder="请选择产品范围" />
+                <!-- @change="onChangeTree" -->
+            </div>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+          <a-form-model-item label="生成方式" prop="contentType">
+            <a-radio-group v-model="sellForm.value" @change="onChangeType">
+              <a-radio :value="1">
+                按订单生成券
+              </a-radio>
+              <a-radio :value="2">
+                按产品款数生成券
+              </a-radio>
+            </a-radio-group>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
+          <a-form-model-item label="券内容" prop="imageSet">
+            <div class="couponCon">
+              <a-row v-show="sellForm.value===1">
+                <a-col :md="22" :sm="24">
+                  <div class="couponList">
+                    <!-- 具体内容 -->
+                    <a-form-model ref="couponRuleForm" :model="couponForm" :rules="couponRules" :label-col="couponFormLayout.labelCol" :wrapper-col="couponFormLayout.wrapperCol">
+                      <a-form-model-item ref="name" prop="name" style="margin-left:26px;">
+                        购买<a-input-number
+                          style="margin:0 5px;"
+                          v-model="couponForm.regularValue"
+                          :step="1"
+                          :max="99999999"
+                          :precision="0"
+                          size="small"/>
+                        <a-select
+                          default-value="GE"
+                          :disabled="i!=0"
+                          v-model="couponForm.regularUnit"
+                          style="width: 60px;"
+                          size="small"
+                          @change="handleChangeUnit">
+                          <a-select-option value="GE">
+                            个
+                          </a-select-option>
+                          <a-select-option value="YUAN">
+                            元
+                          </a-select-option>
+                        </a-select>
+                        活动产品,送<a-input-number
+                          v-model="couponForm.promotionValue"
+                          style="margin:0 5px;"
+                          :min="0"
+                          :step="1"
+                          :precision="2"
+                          :max="99999999"
+                          size="small"/> 元
+                      </a-form-model-item>
+                      <a-form-model-item label="活动产品" prop="region">
+                        <a-button type="primary" @click="handleAddProduct" size="small">添加产品</a-button>
+                        <div class="productCon">
+                          <a-tag closable @close="delBuyerName(con)">
+                            产品编码
+                          </a-tag>
+                          <a-tag closable @close="delBuyerName(con)">
+                            产品编码
+                          </a-tag>
+                        </div>
+                      </a-form-model-item>
+                      <a-form-model-item label="券适用范围" prop="desc">
+                        全部产品
+                      </a-form-model-item>
+                    </a-form-model>
+                  </div>
+                </a-col>
+                <a-col :md="2" :sm="24">
+                  <a-button type="link" class="button-info">+新增</a-button>
+                  <a-button type="link">删除</a-button>
+                </a-col>
+              </a-row>
+              <a-row v-show="sellForm.value===2" v-for="item in couponList" :key="item.id">
+                <a-col :md="22" :sm="24">
+                  <div class="couponList">
+                    <!-- 具体内容 -->
+                    <a-form-model ref="couponRuleForm" :model="couponForm" :rules="couponRules" :label-col="couponFormLayout.labelCol" :wrapper-col="couponFormLayout.wrapperCol">
+                      <a-form-model-item ref="name" prop="name" style="margin-left:26px;">
+                        购买<a-input-number
+                          style="margin:0 5px;"
+                          v-model="couponForm.regularValue"
+                          :step="1"
+                          :max="99999999"
+                          :precision="0"
+                          size="small"/>
+                        <a-select
+                          default-value="GE"
+                          :disabled="i!=0"
+                          v-model="couponForm.regularUnit"
+                          style="width: 60px;"
+                          size="small"
+                          @change="handleChangeUnit">
+                          <a-select-option value="GE">
+                            个
+                          </a-select-option>
+                          <a-select-option value="YUAN">
+                            元
+                          </a-select-option>
+                        </a-select>
+                        活动产品,送<a-input-number
+                          v-model="couponForm.promotionValue"
+                          style="margin:0 5px;"
+                          :min="0"
+                          :step="1"
+                          :precision="2"
+                          :max="99999999"
+                          size="small"/> 元
+                      </a-form-model-item>
+                      <a-form-model-item label="活动产品" prop="region">
+                        <a-button type="primary" @click="handleAddProduct" size="small">添加产品</a-button>
+                        <div class="productCon">
+                          <a-tag closable @close="delBuyerName(con)">
+                            产品编码
+                          </a-tag>
+                          <a-tag closable @close="delBuyerName(con)">
+                            产品编码
+                          </a-tag>
+                        </div>
+                      </a-form-model-item>
+                      <a-form-model-item label="券适用范围" prop="desc">
+                        全部产品
+                      </a-form-model-item>
+                      <a-form-model-item label="使用说明" prop="desc">
+                        <a-input v-model="couponForm.desc" style="width:80%;" type="textarea" placeholder="请输入使用说明" :maxLength="200" />
+                      </a-form-model-item>
+                    </a-form-model>
+                  </div>
+                </a-col>
+                <a-col :md="2" :sm="24">
+                  <a-button type="link" v-if="i===0" class="button-info" @click="addCouponCon">+新增</a-button>
+                  <a-button type="link" v-else @click="delCouponCon(item.id)">删除</a-button>
+                </a-col>
+              </a-row>
+            </div>
+          </a-form-model-item>
+        </a-col>
+        <a-col
+          :xs="24"
+          :sm="24"
+          :md="12"
+          :lg="24"
+          :xl="24"
+          v-show="sellForm.value===1">
+          <a-form-model-item label="使用说明">
+            <a-input v-model="sellForm.desc" type="textarea" placeholder="请输入使用说明" :maxLength="200" />
+          </a-form-model-item>
+        </a-col>
+        <a-col :xs="24" :sm="24" :md="12" :lg="24" :xl="24">
+          <a-form-model-item label="券有效期">
+            <a-radio-group v-model="sellForm.termVal">
+              <a-radio :style="radioStyle" :value="1">
+                <span>固定日期</span>
+                <a-range-picker
+                  style="width:100%;margin-left:5px;"
+                  v-model="sellForm.time"
+                  :format="dateFormat"
+                  @change="dateChange"
+                  :placeholder="['开始时间', '结束时间']" />
+                  <!-- :disabled-date="disabledDate" -->
+              </a-radio>
+              <a-radio :style="radioStyle" :value="2">
+                <span>领取后,当天生效,有效期至</span><a-input-number
+                  style="margin:0 5px;"
+                  v-model="sellForm.regularValue"
+                  :step="1"
+                  :max="99999999"
+                  :precision="0"/>天
+              </a-radio>
+            </a-radio-group>
+          </a-form-model-item>
+        </a-col>
+        <a-col :xs="24" :sm="24" :md="12" :lg="24" :xl="24">
+          <a-form-model-item label="加盟商编辑" prop="enabledFlag">
+            <a-radio-group button-style="solid" v-model="sellForm.enabledFlag">
+              <a-radio-button value="1">
+                是
+              </a-radio-button>
+              <a-radio-button value="0">
+                否
+              </a-radio-button>
+            </a-radio-group>
+          </a-form-model-item>
+        </a-col>
+      </a-row>
+    </a-form-model>
+  </a-spin>
+</template>
+
+<script>
+import { commonMixin } from '@/utils/mixin'
+import { VSelect } from '@/components'
+import { TreeSelect } from 'ant-design-vue'
+const SHOW_ALL = TreeSelect.SHOW_ALL
+export default {
+  name: 'PromotionAddModal',
+  mixins: [commonMixin],
+  components: { VSelect },
+  data () {
+    return {
+      spinning: false,
+      SHOW_ALL,
+      // form 表单label布局设置
+      sellFormItemLayout: {
+        labelCol: { span: 3 }, // 文字前距离设置
+        wrapperCol: { span: 20 }// 表单后距离设置  数字越大距离越小
+      },
+      couponFormLayout: {
+        labelCol: { span: 3 },
+        wrapperCol: { span: 18 }
+      },
+      // 单选按钮样式
+      radioStyle: {
+        display: 'block',
+        height: '50px',
+        lineHeight: '40px'
+      },
+      sellForm: {
+        value: 2,
+        termVal: undefined,
+        enabledFlag: '0',
+        con: []
+      },
+      dateFormat: 'YYYY-MM',
+      con: [],
+      couponList: [{
+        val1: '',
+        unit: ''
+      }], // 按产品款数生成券 数据
+      treeData: [],
+      showProModal: false,
+      couponForm: {},
+      couponRules: [],
+
+      sellRules: {
+        promoBuyerList: [{
+          required: true,
+          message: '请选择参与经销商',
+          trigger: 'change'
+        }],
+        time: [{
+          required: true,
+          message: '请选择促销时间',
+          trigger: 'change'
+        }],
+        name: [{
+          required: true,
+          message: '请输入促销名称',
+          trigger: 'blur'
+        }],
+        description: [{
+          required: true,
+          message: '请输入促销描述',
+          trigger: 'blur'
+        }]
+      }
+    }
+  },
+  methods: {
+    delBuyerName (row) {
+
+    },
+    onChange () {
+
+    },
+    dateChange () {
+
+    },
+    handleChangeUnit () {},
+    // 添加产品
+    handleAddProduct () {
+      console.log('111111111111111111:')
+      this.$emit('addProduct', true)
+    },
+    // 生成方式 change
+    onChangeType (e) {
+      this.couponList = [{}]
+      this.sellForm.value = e.target.value
+    },
+    // 新增券内容
+    addCouponCon () {
+      const obj = {
+        val1: '',
+        unit: ''
+      }
+      if (this.couponList.length >= 10) {
+        this.$message.warning('最多只能新增10个!')
+        return
+      }
+      this.couponList.push(obj)
+    },
+    // 删除券内容
+    delCouponCon (id) {
+
+    },
+    onChangeTree (e) {
+      debugger
+    }
+
+  }
+}
+</script>
+
+<style lang="less" scoped>
+  .couponList{
+    background: #EFEFEF;
+    border-radius:5px;
+    padding:15px 15px 2px;
+    margin-bottom:5px;
+    .ant-form-item{
+      margin-bottom:12px;
+    }
+  }
+  .productCon{
+    width: 80%;
+    margin-left:12.3%;
+    max-height: 150px;
+    overflow-y: scroll;
+    background: #fff;
+    border-radius: 5px;
+    padding: 10px 15px;
+  }
+  .productCon::-webkit-scrollbar {
+    display: none;
+  }
+</style>