|
@@ -0,0 +1,116 @@
|
|
|
+<template>
|
|
|
+ <a-card :body-style="{padding: '24px 32px'}" :bordered="false">
|
|
|
+ <a-form @submit="handleSubmit" :form="form">
|
|
|
+ <a-form-item
|
|
|
+ label="推广目的"
|
|
|
+ :labelCol="{lg: {span: 7}, sm: {span: 7}}"
|
|
|
+ :wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
|
|
|
+ <a-radio-group @change="promotionPurposeChange" v-model="promotionPurpose">
|
|
|
+ <a-radio-button v-for="purpose in promotionPurposeList" :key="purpose.itemText" :value="purpose.itemValue">
|
|
|
+ {{purpose.itemText}}
|
|
|
+ </a-radio-button>
|
|
|
+ </a-radio-group>
|
|
|
+ </a-form-item>
|
|
|
+
|
|
|
+ <a-form-item
|
|
|
+ label="广告组预算"
|
|
|
+ :labelCol="{lg: {span: 7}, sm: {span: 7}}"
|
|
|
+ :wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
|
|
|
+ <a-radio-group @change="showBudgetStatusChange" v-model="campaignBudget">
|
|
|
+ <a-radio-button value="UNLIMITED">不限</a-radio-button>
|
|
|
+ <a-radio-button value="AS_BUDGET">按预算</a-radio-button>
|
|
|
+ </a-radio-group>
|
|
|
+ </a-form-item>
|
|
|
+ <a-form-item
|
|
|
+ label="日预算"
|
|
|
+ v-if="showBudgetDaily"
|
|
|
+ :labelCol="{lg: {span: 7}, sm: {span: 7}}"
|
|
|
+ :wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
|
|
|
+ <a-input v-model="budgetDaily" style="width: 70%"></a-input>元
|
|
|
+ </a-form-item>
|
|
|
+
|
|
|
+ <a-form-item
|
|
|
+ label="广告组名称"
|
|
|
+ :labelCol="{lg: {span: 7}, sm: {span: 7}}"
|
|
|
+ :wrapperCol="{lg: {span: 10}, sm: {span: 17} }">
|
|
|
+ <a-input v-model="campaignName"></a-input>
|
|
|
+ </a-form-item>
|
|
|
+
|
|
|
+ <a-form-item
|
|
|
+ :wrapperCol="{ span: 24 }"
|
|
|
+ style="text-align: center"
|
|
|
+ >
|
|
|
+ <a-button htmlType="submit" type="primary">提交</a-button>
|
|
|
+ <a-button style="margin-left: 8px">保存</a-button>
|
|
|
+ </a-form-item>
|
|
|
+ </a-form>
|
|
|
+ </a-card>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {deleteAction, postAction, getAction} from '@/api/manage'
|
|
|
+ import moment from "moment"
|
|
|
+ export default {
|
|
|
+ name: 'BaseForm',
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ promotionPurpose:'APP',
|
|
|
+ promotionPurposeList: {},
|
|
|
+ showBudgetDaily:false,
|
|
|
+ campaignName:'APP_'+moment(new Date()),
|
|
|
+ campaignBudget:'UNLIMITED',
|
|
|
+ budgetDaily:0,
|
|
|
+ form: this.$form.createForm(this),
|
|
|
+ url: {
|
|
|
+ dictListUrl: 'toutiao/dictItem/list',
|
|
|
+ insertTemplateUrl:'toutiao/campaignModel/insert'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ handleSubmit(e) {
|
|
|
+ e.preventDefault()
|
|
|
+ this.form.validateFields((err, values) => {
|
|
|
+ if (!err) {
|
|
|
+ console.log('Received values of form: ', values);
|
|
|
+ let params = {};
|
|
|
+ params.promotionPurpose = this.promotionPurpose;
|
|
|
+ params.campaignBudget = this.campaignBudget;
|
|
|
+ params.budgetDaily = this.budgetDaily;
|
|
|
+ params.campaignName = this.campaignName;
|
|
|
+ console.log(params)
|
|
|
+ postAction(this.url.insertTemplateUrl,params).then((res)=>{
|
|
|
+ console.log(res)
|
|
|
+ });
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ onChange(value) {
|
|
|
+ console.log(value)
|
|
|
+ this.value = value
|
|
|
+ },
|
|
|
+ showBudgetStatusChange(){
|
|
|
+ if(this.campaignBudget == 'UNLIMITED'){
|
|
|
+ this.showBudgetDaily = false;
|
|
|
+ }else{
|
|
|
+ this.showBudgetDaily = true;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ promotionPurposeChange(){
|
|
|
+ this.campaignName = this.promotionPurpose +'_'+moment(new Date());
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created: function () {
|
|
|
+ //出价方式
|
|
|
+ let params = {};
|
|
|
+ params.dictId = '181afbae847dd3bc7e27795d89538c9c';
|
|
|
+ params.pageSize = '1000';
|
|
|
+ getAction(this.url.dictListUrl, params).then((res) => {
|
|
|
+ if (res.success) {
|
|
|
+ this.promotionPurposeList = res.result.records
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|