|
@@ -0,0 +1,326 @@
|
|
|
|
+<template>
|
|
|
|
+ <a-modal
|
|
|
|
+ centered
|
|
|
|
+ class="promotionRules-basicInfo-modal"
|
|
|
|
+ :footer="null"
|
|
|
|
+ :maskClosable="false"
|
|
|
|
+ title="新增"
|
|
|
|
+ v-model="isShow"
|
|
|
|
+ @cancle="isShow = false"
|
|
|
|
+ width="80%">
|
|
|
|
+ <a-form-model
|
|
|
|
+ id="promotionRules-basicInfo-form"
|
|
|
|
+ ref="ruleForm"
|
|
|
|
+ :model="form"
|
|
|
|
+ :rules="rules"
|
|
|
|
+ :label-col="formItemLayout.labelCol"
|
|
|
|
+ :wrapper-col="formItemLayout.wrapperCol"
|
|
|
|
+ >
|
|
|
|
+ <a-form-model-item label="活动名称" prop="name" :label-col="{span: 4}">
|
|
|
|
+ <a-input
|
|
|
|
+ id="promotionRules-basicInfo-name"
|
|
|
|
+ :maxLength="100"
|
|
|
|
+ v-model.trim="form.name"
|
|
|
|
+ placeholder="请输入活动名称(最多100个字符)"
|
|
|
|
+ allowClear />
|
|
|
|
+ </a-form-model-item>
|
|
|
|
+ <a-row :gutter="15">
|
|
|
|
+ <a-col span="12">
|
|
|
|
+ <a-form-model-item label="活动时间" prop="activeDateEnable">
|
|
|
|
+ <a-select
|
|
|
|
+ id="promotionRules-basicInfo-activeDateEnable"
|
|
|
|
+ placeholder="请选择"
|
|
|
|
+ v-model="form.activeDateEnable"
|
|
|
|
+ style="width: 100%;">
|
|
|
|
+ <a-select-option v-for="item in rangeList" :key="item.val" :value="item.val">{{ item.name }}</a-select-option>
|
|
|
|
+ </a-select>
|
|
|
|
+ </a-form-model-item>
|
|
|
|
+ </a-col>
|
|
|
|
+ <a-col span="12">
|
|
|
|
+ <a-form-model-item prop="activeDate">
|
|
|
|
+ <a-range-picker
|
|
|
|
+ v-if="form.activeDateEnable==1"
|
|
|
|
+ style="width:100%"
|
|
|
|
+ id="promotionRules-basicInfo-activeDate"
|
|
|
|
+ :disabledDate="disabledDate"
|
|
|
|
+ v-model="form.activeDate"
|
|
|
|
+ :format="dateFormat"
|
|
|
|
+ :placeholder="['开始时间', '结束时间']" />
|
|
|
|
+ </a-form-model-item>
|
|
|
|
+ </a-col>
|
|
|
|
+ </a-row>
|
|
|
|
+ <a-row :gutter="15">
|
|
|
|
+ <a-col span="12">
|
|
|
|
+ <a-form-model-item label="参与客户" prop="promoBuyerEnable">
|
|
|
|
+ <a-select
|
|
|
|
+ id="promotionRules-basicInfo-promoBuyerEnable"
|
|
|
|
+ placeholder="请选择"
|
|
|
|
+ v-model="form.promoBuyerEnable"
|
|
|
|
+ style="width: 100%;">
|
|
|
|
+ <a-select-option v-for="item in rangeCList" :key="item.val" :value="item.val">{{ item.name }}</a-select-option>
|
|
|
|
+ </a-select>
|
|
|
|
+ </a-form-model-item>
|
|
|
|
+ </a-col>
|
|
|
|
+ <a-col span="12">
|
|
|
|
+ <a-form-model-item prop="promoBuyerEnable">
|
|
|
|
+ <a-button v-if="form.promoBuyerEnable==1" id="promotionRules-basicInfo-choose" type="primary" class="button-success" @click="openModal=true">选择</a-button>
|
|
|
|
+ </a-form-model-item>
|
|
|
|
+ </a-col>
|
|
|
|
+ </a-row>
|
|
|
|
+ <a-row :gutter="15">
|
|
|
|
+ <a-col span="12">
|
|
|
|
+ <a-form-model-item prop="activeAmountEnable">
|
|
|
|
+ <template slot="label">
|
|
|
|
+ <a-popover style="margin-top: 13px;">
|
|
|
|
+ <template slot="content">即促销品的销售价总额不能高于限值,达到后活动不能参与。</template>
|
|
|
|
+ <a-icon type="question-circle" theme="twoTone" />
|
|
|
|
+ </a-popover>
|
|
|
|
+ <span>活动经费上限</span>
|
|
|
|
+ </template>
|
|
|
|
+ <a-select
|
|
|
|
+ id="promotionRules-basicInfo-activeAmountEnable"
|
|
|
|
+ placeholder="请选择"
|
|
|
|
+ v-model="form.activeAmountEnable"
|
|
|
|
+ style="width: 100%;">
|
|
|
|
+ <a-select-option v-for="item in rangeList" :key="item.val" :value="item.val">{{ item.name }}</a-select-option>
|
|
|
|
+ </a-select>
|
|
|
|
+ </a-form-model-item>
|
|
|
|
+ </a-col>
|
|
|
|
+ <a-col span="12">
|
|
|
|
+ <a-form-model-item prop="activeAmount">
|
|
|
|
+ <a-input-number
|
|
|
|
+ v-if="form.activeAmountEnable==1"
|
|
|
|
+ id="promotionRules-basicInfo-activeAmount"
|
|
|
|
+ v-model="form.activeAmount"
|
|
|
|
+ :min="1"
|
|
|
|
+ :max="999999"
|
|
|
|
+ :precision="2"
|
|
|
|
+ style="width: 85%;margin-right: 5px;"
|
|
|
|
+ placeholder="请输入活动经费上限(1~999999)"
|
|
|
|
+ allowClear />
|
|
|
|
+ <span v-if="form.activeAmountEnable==1">万元</span>
|
|
|
|
+ </a-form-model-item>
|
|
|
|
+ </a-col>
|
|
|
|
+ </a-row>
|
|
|
|
+ <a-row :gutter="15">
|
|
|
|
+ <a-col span="12">
|
|
|
|
+ <a-form-model-item prop="orderAmountEnable">
|
|
|
|
+ <template slot="label">
|
|
|
|
+ <a-popover style="margin-top: 13px;">
|
|
|
|
+ <template slot="content">即限制每个采购单需达到下限金额才能参与促销。</template>
|
|
|
|
+ <a-icon type="question-circle" theme="twoTone" />
|
|
|
|
+ </a-popover>
|
|
|
|
+ <span>订单起订金额</span>
|
|
|
|
+ </template>
|
|
|
|
+ <a-select
|
|
|
|
+ id="promotionRules-basicInfo-orderAmountEnable"
|
|
|
|
+ placeholder="请选择"
|
|
|
|
+ v-model="form.orderAmountEnable"
|
|
|
|
+ style="width: 100%;">
|
|
|
|
+ <a-select-option v-for="item in rangeList" :key="item.val" :value="item.val">{{ item.name }}</a-select-option>
|
|
|
|
+ </a-select>
|
|
|
|
+ </a-form-model-item>
|
|
|
|
+ </a-col>
|
|
|
|
+ <a-col span="12">
|
|
|
|
+ <a-form-model-item prop="orderAmount">
|
|
|
|
+ <a-input-number
|
|
|
|
+ v-if="form.orderAmountEnable==1"
|
|
|
|
+ id="promotionRules-basicInfo-orderAmount"
|
|
|
|
+ v-model="form.orderAmount"
|
|
|
|
+ :min="1"
|
|
|
|
+ :max="999999"
|
|
|
|
+ :precision="2"
|
|
|
|
+ style="width: 85%;margin-right: 5px;"
|
|
|
|
+ placeholder="请输入订单起订金额(1~999999)"
|
|
|
|
+ allowClear />
|
|
|
|
+ <span v-if="form.orderAmountEnable==1">万元</span>
|
|
|
|
+ </a-form-model-item>
|
|
|
|
+ </a-col>
|
|
|
|
+ </a-row>
|
|
|
|
+ <a-form-model-item label="备注" prop="remark" :label-col="{span: 4}">
|
|
|
|
+ <a-input
|
|
|
|
+ id="promotionRules-basicInfo-remark"
|
|
|
|
+ :maxLength="100"
|
|
|
|
+ v-model.trim="form.remark"
|
|
|
|
+ placeholder="请输入备注(最多100个字符)"
|
|
|
|
+ allowClear />
|
|
|
|
+ </a-form-model-item>
|
|
|
|
+ </a-form-model>
|
|
|
|
+ <div class="btn-cont">
|
|
|
|
+ <a-button type="primary" id="promotionRules-basicInfo-modal-save" @click="handleSave">保存</a-button>
|
|
|
|
+ <a-button id="promotionRules-basicInfo-modal-back" @click="isShow = false" style="margin-left: 15px;">取消</a-button>
|
|
|
|
+ </div>
|
|
|
|
+ </a-modal>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+import moment from 'moment'
|
|
|
|
+import { VSelect } from '@/components'
|
|
|
|
+// import { storeCallOutSave } from '@/api/storeCallOut'
|
|
|
|
+// import { custAllList } from '@/api/customer'
|
|
|
|
+// import { getLookUpData } from '@/api/data'
|
|
|
|
+// import { storeCallOutTypeAllList } from '@/api/storeCallOutType'
|
|
|
|
+export default {
|
|
|
|
+ name: 'StoreTransferOutBasicInfoModal',
|
|
|
|
+ components: { VSelect },
|
|
|
|
+ props: {
|
|
|
|
+ openModal: {
|
|
|
|
+ // 弹框显示状态
|
|
|
|
+ type: Boolean,
|
|
|
|
+ default: false
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ data () {
|
|
|
|
+ return {
|
|
|
|
+ isShow: this.openModal, // 是否打开弹框
|
|
|
|
+ formItemLayout: {
|
|
|
|
+ labelCol: { span: 8 },
|
|
|
|
+ wrapperCol: { span: 16 }
|
|
|
|
+ },
|
|
|
|
+ form: {
|
|
|
|
+ name: '',
|
|
|
|
+ activeDateEnable: undefined, // 活动时间启用标记
|
|
|
|
+ activeDate: [],
|
|
|
|
+ activeDateStart: '', // 活动时间-开始
|
|
|
|
+ activeDateEnd: '', // 活动时间-结束
|
|
|
|
+ promoBuyerEnable: undefined, // 参与客户启用标记
|
|
|
|
+ activeAmountEnable: undefined, // 活动经费启用标记
|
|
|
|
+ activeAmount: '', // 活动经费上限
|
|
|
|
+ orderAmountEnable: undefined, // 起订金额启用标记
|
|
|
|
+ orderAmount: '', // 订单起订金额
|
|
|
|
+ remark: ''
|
|
|
|
+ },
|
|
|
|
+ rules: {
|
|
|
|
+ name: [{ required: true, message: '请输入活动名称', trigger: 'blur' }],
|
|
|
|
+ activeDateEnable: [{ required: true, message: '请选择调往对象名称', trigger: 'change' }],
|
|
|
|
+ putPersonName: [{ required: true, message: '请输入调往对象名称', trigger: 'blur' }],
|
|
|
|
+ callOutType: [{ required: true, message: '请选择调拨类型', trigger: 'change' }]
|
|
|
|
+ },
|
|
|
|
+ custData: [], // 调往对象 下拉数据
|
|
|
|
+ putPersonTypeList: [], // 调往对象类型
|
|
|
|
+ storeCallOutTypeList: [], // 调拨类型
|
|
|
|
+ dateFormat: 'YYYY-MM-DD',
|
|
|
|
+ rangeList: [ // 是否限制
|
|
|
|
+ { name: '不限', val: 0 },
|
|
|
|
+ { name: '限制', val: 1 }
|
|
|
|
+ ],
|
|
|
|
+ rangeCList: [ // 是否全部
|
|
|
|
+ { name: '全部客户', val: 0 },
|
|
|
|
+ { name: '部分客户', val: 1 }
|
|
|
|
+ ],
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ computed: {
|
|
|
|
+ // 当前所选调往对象是否为客户
|
|
|
|
+ isCustomer () {
|
|
|
|
+ return this.form.putPersonType == 'CUSTOMER'
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ // 保存
|
|
|
|
+ handleSave () {
|
|
|
|
+ const _this = this
|
|
|
|
+ this.$refs.ruleForm.validate(valid => {
|
|
|
|
+ if (valid) {
|
|
|
|
+ const form = JSON.parse(JSON.stringify(_this.form))
|
|
|
|
+ storeCallOutSave(form).then(res => {
|
|
|
|
+ if (res.status == 200) {
|
|
|
|
+ _this.$message.success(res.message)
|
|
|
|
+ setTimeout(() => {
|
|
|
|
+ _this.isShow = false
|
|
|
|
+ _this.$emit('ok', res.data)
|
|
|
|
+ }, 1000)
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ } else {
|
|
|
|
+ console.log('error submit!!')
|
|
|
|
+ return false
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ // 调往对象 change
|
|
|
|
+ putPersonTypeChange (e) {
|
|
|
|
+ this.$refs.ruleForm.resetFields()
|
|
|
|
+ this.form.putPersonSn = undefined
|
|
|
|
+ this.form.putPersonName = ''
|
|
|
|
+ this.form.putPersonType = e.target.value
|
|
|
|
+ },
|
|
|
|
+ // 调往对象名称 change
|
|
|
|
+ putPersonChange (val) {
|
|
|
|
+ const ind = this.custData.findIndex(item => item.customerSn == val)
|
|
|
|
+ this.form.putPersonName = this.custData[ind].customerName
|
|
|
|
+ },
|
|
|
|
+ // 调往对象列表
|
|
|
|
+ getCustAllList () {
|
|
|
|
+ custAllList().then(res => {
|
|
|
|
+ if (res.status == 200) {
|
|
|
|
+ this.custData = res.data
|
|
|
|
+ } else {
|
|
|
|
+ this.custData = []
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ // 调往对象类型
|
|
|
|
+ getPutPersonTypeList () {
|
|
|
|
+ const _this = this
|
|
|
|
+ getLookUpData({
|
|
|
|
+ pageNo: 1,
|
|
|
|
+ pageSize: 1000,
|
|
|
|
+ lookupCode: 'PUT_PERSON_TYPE'
|
|
|
|
+ }).then(res => {
|
|
|
|
+ if (res.status == 200) {
|
|
|
|
+ _this.putPersonTypeList = res.data.list
|
|
|
|
+ } else {
|
|
|
|
+ _this.putPersonTypeList = []
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ // 调拨类型
|
|
|
|
+ getStoreCallOutTypeAllList () {
|
|
|
|
+ storeCallOutTypeAllList().then(res => {
|
|
|
|
+ if (res.status == 200) {
|
|
|
|
+ this.storeCallOutTypeList = res.data
|
|
|
|
+ } else {
|
|
|
|
+ this.storeCallOutTypeList = []
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ filterOption (input, option) {
|
|
|
|
+ return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
|
|
|
+ },
|
|
|
|
+ // 不可选日期
|
|
|
|
+ disabledDate (date, dateStrings) {
|
|
|
|
+ return date && date.valueOf('day') < moment().subtract(1, 'day') // 今天以后,包含今天
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+ watch: {
|
|
|
|
+ // 父页面传过来的弹框状态
|
|
|
|
+ openModal (newValue, oldValue) {
|
|
|
|
+ this.isShow = newValue
|
|
|
|
+ },
|
|
|
|
+ // 重定义的弹框状态
|
|
|
|
+ isShow (newValue, oldValue) {
|
|
|
|
+ if (!newValue) {
|
|
|
|
+ this.$emit('close')
|
|
|
|
+ this.$refs.ruleForm.resetFields()
|
|
|
|
+ } else {
|
|
|
|
+ // this.getCustAllList()
|
|
|
|
+ // this.getPutPersonTypeList()
|
|
|
|
+ // this.getStoreCallOutTypeAllList()
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style lang="less">
|
|
|
|
+.promotionRules-basicInfo-modal {
|
|
|
|
+ .ant-modal-body {
|
|
|
|
+ padding: 40px 40px 24px;
|
|
|
|
+ }
|
|
|
|
+ .btn-cont {
|
|
|
|
+ text-align: center;
|
|
|
|
+ margin: 35px 0 10px;
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+</style>
|