chenrui před 10 měsíci
rodič
revize
59b6147eb7

+ 167 - 99
src/views/promotionRulesManagement/promotionManagement/detailModal.vue

@@ -7,101 +7,127 @@
     title="详情"
     v-model="isShow"
     @cancel="isShow=false"
-    width="80%">
+    width="70%">
     <a-spin :spinning="spinning" tip="Loading...">
-      <a-form-model
-        id="promotion-basicInfo-form"
-        ref="ruleForm"
-        :model="form"
-        :label-col="formItemLayout.labelCol"
-        :wrapper-col="formItemLayout.wrapperCol" >
-        <a-form-model-item label="标题">
-          {{ form.title }}
-        </a-form-model-item>
-        <a-form-model-item label="排序">
-          {{ form.sort }}
-        </a-form-model-item>
-        <!-- 买产品送产品 -->
-        <a-form-model-item label="封面图片" prop="regularSameFlag" v-if="form.promotionRuleType ==='BUY_PROD_GIVE_PROD'">
-          <img
-            :src="con"
-            alt="图片走丢了"
-            width="80"
-            height="80"
-            v-for="(con,i) in form.imageSet"
-            style="margin-right:10px;"
-            :key="i"/>
-          <div class="upload-desc">说明:单张大小小于10Mb,最多10张;建议尺寸:宽(420px)*高(230px)</div>
-        </a-form-model-item>
-        <!-- 买产品送采购额 -->
-        <a-form-model-item label="内容类型" prop="regularSameFlag" v-if="form.promotionRuleType ==='BUY_PROD_GIVE_MONEY'">
-          {{ form.contentType }}
-        </a-form-model-item>
-        <!-- 特价产品 -->
-        <a-form-model-item label="基本规则" prop="regularSameFlag" v-if="form.promotionRuleType ==='PROMO_PROD'">
-          {{ form.promoRule&&form.promoRule.ruleType?form.promoRule.ruleType==='ticket'?'指定产品返代金券':'--':'--' }}
-        </a-form-model-item>
-        <a-form-model-item label="券名称" prop="accrualFlag" v-if="form.promotionRuleType ==='BUY_PROD_GIVE_PROD'&&form.accrualFlag">
-          {{ form.promoRule&&form.promoRule.ruleName?form.promoRule.ruleName:'--' }}
-        </a-form-model-item>
-        <a-form-model-item label="券副标题" prop="regularPromotionSameFlag">
-          {{ form.promoRule&&form.promoRule.ruleTitle?form.promoRule.ruleTitle:'--' }}
-        </a-form-model-item>
-        <a-form-model-item label="生成方式" prop="regularPromotionSameFlag">
-          {{ form.promoRule&&form.promoRule.ruleBaseType?form.promoRule.ruleBaseType==='bill'?'按订单生成券':'按订单产品款数生成券':'--' }}
-        </a-form-model-item>
-        <a-form-model-item label="券有效期" prop="scopeFlag" >
-          <span>
-            {{ form.promoRule&&form.promoRule.validType?form.promoRule.validType==='FIXED'?'固定日期':'期限时间':'--' }}
-          </span>
-          <span class="timeBox" v-if="form.promoRule.validType==='FIXED'">{{ form.promoRule.validStartDate }}~{{ form.promoRule.validEndDate }}</span>
-          <span class="timeBox" v-else>领取后,立即生效,有效期{{ form.promoRule.validDays }}天</span>
-        </a-form-model-item>
-        <a-form-model-item label="券适用范围" prop="scopeFlag" >
-          全部产品
-        </a-form-model-item>
-        <a-form-model-item label="使用说明" prop="scopeFlag" >
-          {{ form.promoRule&&form.promoRule.ruleExplain?form.promoRule.ruleExplain:'--' }}
-        </a-form-model-item>
-        <a-form-model-item label="加盟商编辑" prop="scopeFlag" >
-          {{ form.dealerEditFlag?form.dealerEditFlag==='1'?'是':'否':'--' }}
-        </a-form-model-item>
-        <a-form-model-item label="是否发布" prop="scopeFlag" >
-          {{ form.publishFlag?form.publishFlag==='1'?'是':'否':'--' }}
-        </a-form-model-item>
-        <a-form-model-item label="产品范围" prop="scopeFlag" >
-          <div v-if="form.promoRule&&form.promoRule.productRangeList">
-            <a-tree-select
-              v-model="form.promoRule.productRangeList"
-              :maxTagCount="12"
-              :tree-data="productTypeList"
-              tree-checkable
-              :disabled="true"
-              :getPopupContainer="triggerNode => triggerNode.parentNode"
-              :replaceFields="{children:'children',title: 'productTypeName',key: 'productTypeSn',value: 'productTypeSn'}"
-              placeholder="请选择产品范围" />
+      <div class="detailModal-con">
+        <a-form-model
+          id="promotion-basicInfo-form"
+          ref="ruleForm"
+          :model="form"
+          :rules="rules"
+          :label-col="formItemLayout.labelCol"
+          :wrapper-col="formItemLayout.wrapperCol" >
+          <a-form-model-item label="标题" prop="title">
+            {{ form.title }}
+          </a-form-model-item>
+          <a-form-model-item label="排序" prop="sort">
+            {{ form.sort }}
+          </a-form-model-item>
+          <a-form-model-item label="封面图片" prop="imageSet">
+            <img
+              :src="con"
+              alt="图片走丢了"
+              width="80"
+              height="80"
+              v-for="(con,i) in imageSet"
+              style="margin-right:10px;"
+              :key="i"/>
+            <div class="upload-desc">说明:单张大小小于10Mb,最多10张;建议尺寸:宽(420px)*高(230px)</div>
+          </a-form-model-item>
+          <a-form-model-item label="内容类型" prop="contentType">
+            {{ form.contentType==='IMAGE_CONTENT'?'图文展示':form.contentType==='VIDEO'?'视频展示':'跳转链接' }}
+          </a-form-model-item>
+          <div v-if="form.contentType==='IMAGE_CONTENT'">
+            <a-form-model-item label="内容" prop="content" >
+              <div class="box" v-html="form.content"></div>
+            </a-form-model-item>
+            <a-form-model-item label="是否发布" prop="publishFlag" >
+              {{ form.publishFlag?form.publishFlag==='1'?'是':'否':'--' }}
+            </a-form-model-item>
           </div>
-          <div>--</div>
-        </a-form-model-item>
-      </a-form-model>
-      <a-card size="small" :bordered="false" class="pages-wrap">
-        <div class="productTable">
-          <s-table
-            class="sTable"
-            ref="table"
-            size="small"
-            :rowKey="(record) => record.id"
-            :columns="columns"
-            :data="loadData"
-            :defaultLoadData="false"
-            :style="{ maxHeight: 300+'px' }"
-            :scroll="{ y:230 }"
-            bordered>
-          </s-table>
+          <div v-if="form.contentType==='VIDEO'">
+            <a-form-model-item label="内容" prop="content" >
+              <video
+                ref="videoPlayer"
+                width="230"
+                height="150"
+                controls
+                loop
+                controlsList="nodownload">
+                <source :src="form.content" type="video/mp4">
+              </video>
+            </a-form-model-item>
+            <a-form-model-item label="是否发布" prop="publishFlag" >
+              {{ form.publishFlag?form.publishFlag==='1'?'是':'否':'--' }}
+            </a-form-model-item>
+          </div>
+          <div v-if="form.contentType==='LINK'">
+            <a-form-model-item label="基本规则" prop="ruleType">
+              {{ form.promoRule&&form.promoRule.ruleType?form.promoRule.ruleType==='ticket'?'指定产品返代金券':'--':'--' }}
+            </a-form-model-item>
+            <a-form-model-item label="券名称" prop="ruleName">
+              {{ form.promoRule&&form.promoRule.ruleName?form.promoRule.ruleName:'--' }}
+            </a-form-model-item>
+            <a-form-model-item label="券副标题" prop="ruleTitle">
+              {{ form.promoRule&&form.promoRule.ruleTitle?form.promoRule.ruleTitle:'--' }}
+            </a-form-model-item>
+            <a-form-model-item label="生成方式" prop="ruleBaseType">
+              {{ form.promoRule&&form.promoRule.ruleBaseType?form.promoRule.ruleBaseType==='bill'?'按订单生成券':'按订单产品款数生成券':'--' }}
+            </a-form-model-item>
+            <a-form-model-item label="券有效期" prop="validType" >
+              <span>
+                {{ form.promoRule&&form.promoRule.validType?form.promoRule.validType==='FIXED'?'固定日期':'领取后,立即生效,':'--' }}
+              </span>
+              <span class="timeBox" v-if="form.promoRule.validType==='FIXED'">{{ form.promoRule.validStartDate }}~{{ form.promoRule.validEndDate }}</span>
+              <span class="timeBox" v-else>有效期{{ form.promoRule.validDays }}天</span>
+            </a-form-model-item>
+            <a-form-model-item label="券适用范围" prop="range" >
+              全部产品
+            </a-form-model-item>
+            <a-form-model-item label="使用说明" prop="ruleExplain" >
+              {{ form.promoRule&&form.promoRule.ruleExplain?form.promoRule.ruleExplain:'--' }}
+            </a-form-model-item>
+            <a-form-model-item label="加盟商编辑" prop="dealerEditFlag" >
+              {{ form.dealerEditFlag?form.dealerEditFlag==='1'?'是':'否':'--' }}
+            </a-form-model-item>
+            <a-form-model-item label="是否发布" prop="publishFlag" >
+              {{ form.publishFlag?form.publishFlag==='1'?'是':'否':'--' }}
+            </a-form-model-item>
+            <a-form-model-item label="产品范围" prop="productRangeList" >
+              <div v-if="form.promoRule&&form.promoRule.productRangeList">
+                <a-tree-select
+                  v-model="form.promoRule.productRangeList"
+                  :maxTagCount="12"
+                  :tree-data="productTypeList"
+                  tree-checkable
+                  :disabled="true"
+                  :getPopupContainer="triggerNode => triggerNode.parentNode"
+                  :replaceFields="{children:'children',title: 'productTypeName',key: 'productTypeSn',value: 'productTypeSn'}"
+                  placeholder="请选择产品范围" />
+              </div>
+              <div>--</div>
+            </a-form-model-item>
+          </div>
+        </a-form-model>
+        <a-card size="small" :bordered="false" class="pages-wrap" v-show="form.contentType==='LINK'">
+          <div class="productTable">
+            <s-table
+              class="sTable"
+              ref="table"
+              size="small"
+              :rowKey="(record) => record.id"
+              :columns="columns"
+              :data="loadData"
+              :defaultLoadData="false"
+              :style="{ maxHeight: 300+'px' }"
+              :scroll="{ y:230 }"
+              bordered>
+            </s-table>
+          </div>
+        </a-card>
+        <div class="btn-cont">
+          <a-button id="promotion-basicInfo-modal-back" @click="isShow = false">关闭</a-button>
         </div>
-      </a-card>
-      <div class="btn-cont">
-        <a-button id="promotion-basicInfo-modal-back" @click="isShow = false">关闭</a-button>
       </div>
     </a-spin>
   </a-modal>
@@ -109,9 +135,10 @@
 
 <script>
 import { commonMixin } from '@/utils/mixin'
-import { promoActiveDetail, promoRuleProductList } from '@/api/promoActive'
-import { productTypeQuery } from '@/api/productType'
 import { STable } from '@/components'
+import { productTypeQuery } from '@/api/productType'
+import { promoActiveDetail, promoRuleProductList } from '@/api/promoActive'
+
 export default {
   name: 'DetailModal',
   mixins: [commonMixin],
@@ -146,9 +173,22 @@ export default {
         ruleEnableFlag: '1', // 参数配置 1勾选配置  0不能配置
         publishFlag: '0',
         dealerEditFlag: '0', // 加盟商编辑 1是 0否
-        promoRule: {},
-        publishState: 'UNPUBLISH'
+        promoRule: {
+          ruleType: 'ticket', // 基本规则类型
+          productRangeFlag: '', // 产品范围标记 0无  1有产品范围
+          productRangeList: [], // 产品范围列表
+          ruleName: '', // 券名称
+          ruleTitle: '', // 副标题
+          ruleBaseType: 'category', // 券生成方式
+          ruleExplain: '', // 使用说明
+          validType: undefined, // 券有效期类型
+          validStartDate: undefined, // 券生效时间
+          validEndDate: undefined, // 券失效时间
+          validDays: undefined, // 券有效期天数
+          range: '1'
+        }
       },
+      imageSet: [],
       columns: [
         { title: '序号', dataIndex: 'no', width: '4%', align: 'center', customRender: function (text) { return text || '--' } },
         { title: '产品编码', dataIndex: 'productCode', width: '12%', align: 'center', customRender: function (text) { return text || '--' } },
@@ -158,6 +198,21 @@ export default {
         { title: '返券金额', dataIndex: 'ruleValue', width: '12%', align: 'center', customRender: text => { return ((text || text == 0) ? this.toThousands(text) : '--') } },
         { title: '参考终端价', dataIndex: 'terminalPrice', width: '12%', align: 'center', customRender: text => { return ((text || text == 0) ? this.toThousands(text) : '--') } }
       ],
+      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' }],
+        publishFlag: [{ required: true, message: '请选择是否发布', trigger: 'change' }],
+        range: [{ required: true, message: '请选择券适用范围', trigger: 'change' }],
+        ruleType: [{ required: true, message: '请选择基本规则', trigger: 'change' }],
+        ruleName: [{ required: true, message: '请输入券名称', trigger: ['change', 'blur'] }],
+        ruleBaseType: [{ required: true, message: '请选择生成方式', trigger: 'change' }],
+        validType: [{ required: true, message: '请选择券有效期类型', trigger: 'change' }],
+        ruleDetailList: [{ type: 'array', required: true, message: '请选择券内容', trigger: 'blur' }]
+      },
       // 加载数据方法 必须为 Promise 对象
       loadData: parameter => {
         this.disabled = true
@@ -194,24 +249,28 @@ export default {
         ruleEnableFlag: '1', // 参数配置 1勾选配置  0不能配置
         publishFlag: '0',
         dealerEditFlag: '0', // 加盟商编辑 1是 0否
-        promoRule: {},
-        publishState: 'UNPUBLISH'
+        promoRule: {}
       }
+      this.imageSet = []
     },
     // 获取列表详情
     getDetail () {
       promoActiveDetail({ sn: this.itemSn }).then(res => {
         if (res.status == 200) {
-          this.form = res.data
           if (res.data.contentType === 'LINK') {
             console.log('加载产品范围')
             this.$nextTick(() => {
               this.getTreeData()
             })
+            if (res.data.images) {
+              this.form.imageSet = res.data.images
+              this.imageSet = res.data.images.split(',')
+            }
             if (res.data.promoRule.productRangeList && res.data.promoRule.productRangeList.productRangeList.length > 0) {
               this.form.promoRule.productRangeList = res.data.promoRule.productRangeList.map(item => { return item.productTypeSn })
             }
           }
+          this.form = res.data
         }
       })
     },
@@ -249,6 +308,15 @@ export default {
 
 <style lang="less" scoped>
   .promotion-basicInfo-modal{
+    .detailModal-con{
+      max-height: 600px;
+      overflow-y: scroll;
+    }
+    .timeBox{
+      margin-left: 10px;
+      color:#ed1c24;
+      opacity: .7;
+    }
     .ant-modal-body {
       padding: 40px 40px 24px;
     }

+ 23 - 21
src/views/promotionRulesManagement/promotionManagement/edit.vue

@@ -322,7 +322,7 @@
             </a-col>
           </a-row>
           <a-row v-if="form.contentType !='LINK' ||(form.contentType ==='LINK'&&form.linkType==='2') ">
-            <a-col :xs="24" :sm="24" :md="24" :lg="16" :xl="16">
+            <a-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
               <a-form-model-item label="是否发布" prop="publishFlag">
                 <a-radio-group button-style="solid" v-model="form.publishFlag">
                   <a-radio-button value="1">
@@ -339,7 +339,6 @@
         </a-form-model>
       </a-card>
     </a-spin>
-    <!-- v-if="form.contentType !='LINK'||isShowNextStep" -->
     <div class="affix-cont">
       <a-button
         type="primary"
@@ -348,7 +347,7 @@
         id="productInfoEdit-submit-btn"
         size="large"
         @click="handleSave('all')"
-        v-if="form.contentType !='LINK'||isShowNextStep"
+        v-if="form.contentType !='LINK'|| isShowNextStep ||(form.contentType ==='LINK'&&form.linkType ==='2')"
         style="padding: 0 60px;">保存</a-button>
     </div>
     <!-- 预览 -->
@@ -568,17 +567,6 @@ export default {
       }
     },
     testAndVerify (callBack) {
-      if (this.sellForm.validType === 'FIXED') {
-        if (!this.sellForm.validStartDate || this.sellForm.validStartDate.validEndDate) {
-          this.$message.warning('请选择固定日期!')
-          return false
-        }
-      } else {
-        if (!this.sellForm.validDays) {
-          this.$message.warning('请输入有效天数!')
-          return false
-        }
-      }
       this.$refs.sellRuleForm.validate(valid => {
         if (valid) {
           callBack(valid)
@@ -612,6 +600,19 @@ export default {
         if (formData.promoRule.productRangeList && formData.promoRule.productRangeList.length > 0) {
           formData.promoRule.productRangeList = formData.promoRule.productRangeList.map(item => { return { productTypeSn: item } })
         }
+        if (this.form.linkType === '1') {
+          if (this.sellForm.validType === 'FIXED') {
+            if (!this.sellForm.validStartDate || this.sellForm.validStartDate.validEndDate) {
+              this.$message.warning('请选择固定日期!')
+              return false
+            }
+          } else {
+            if (!this.sellForm.validDays) {
+              this.$message.warning('请输入有效天数!')
+              return false
+            }
+          }
+        }
       }
       _this.spinning = true
       promoActivePublish(formData).then(res => {
@@ -733,12 +734,7 @@ export default {
     // 添加产品
     handleAddProduct () {
       this.chooseTypeList = this.sellForm.productRangeList
-      // 保存产品范围
-      saveBatchEntity({ list: this.productRangeList, promoActiveSn: this.$route.params.sn }).then(res => {
-        if (res.status == 200) {
-          this.showProModal = true
-        }
-      })
+      this.showProModal = true
     },
     // 批量添加
     handleBatchAdd () {
@@ -770,12 +766,18 @@ export default {
 
       this.$refs.setContent.setProductSn(productArr)
     },
-    onChangeTree () {
+    onChangeTree (e) {
       deleteByProductType({ promoActiveSn: this.$route.params.sn, productTypeSnList: this.sellForm.productRangeList || [] }).then(res => {
         if (res.status == 200) {
           this.$refs.chooseProduct.pageInit()
         }
       })
+      // 保存产品范围
+      saveBatchEntity({ list: this.sellForm.productRangeList, promoActiveSn: this.$route.params.sn }).then(res => {
+        if (res.status == 200) {
+          console.log('保存产品范围成功')
+        }
+      })
     },
     pageInit () {
       this.pageType = this.$route.params.pageType

+ 1 - 2
src/views/promotionRulesManagement/promotionManagement/list.vue

@@ -154,7 +154,6 @@
       <addModal :openModal="openAddModal" :itemId="itemId" @close="closeAddModal" @ok="$refs.table.refresh()"></addModal>
       <!-- 查看 -->
       <detail-Modal :openModal="openDetailModal" :itemSn="itemId" @close="closeDetailModal" @ok="$refs.table.refresh()" />
-
     </a-card>
   </div>
 </template>
@@ -328,7 +327,7 @@ export default {
       this.openDetailModal = true
       this.itemId = row.promoActiveSn
     },
-    // 关闭促销发布
+    // 关闭详情
     closeDetailModal () {
       this.openDetailModal = false
       this.itemId = ''