| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029 |
- <style>
- #table_time_selected1 tr {
- border: 1px solid rgb(102, 162, 243);
- }
- .plug-timer-grid th {
- line-height: 25px;
- }
- .group-creat .ant-form-item-required::before {
- display: inline-block;
- margin-right: 4px;
- color: #f5222d;
- font-size: 14px;
- font-family: SimSun, sans-serif;
- line-height: 1;
- content: '';
- }
- .else-label .ant-form-item-label label::after {
- content: '';
- position: relative;
- top: -0.5px;
- margin: 0 8px 0 2px;
- }
- </style>
- <template>
- <a-modal v-model="visible" title="修改广告组信息" :width="900" v-if="visible">
- <a-form @submit="handleSubmit" :form="form">
- <a-form-item label="目标应用" :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }" v-if="campaignType == '2'">
- <a-select :disabled="typeCopy=='edit'"
- v-decorator="['appId', { rules: [{ required: true, message: '请选择目标应用' }] }]" showSearch allowClear
- placeholder="选择应用目标" optionFilterProp="children" style="width: 500px" @focus="handleFocus" @blur="handleBlur"
- @change="handleChange" :filterOption="filterOption">
- <a-select-option value="0">请选择目标应用</a-select-option>
- <a-select-option v-for="appModel in appList" :key="appModel.appId" :value="appModel.appId">
- {{ appModel.appName }}    {{ appModel.appVersion }}   {{
- appModel.platform | platform
- }}
- </a-select-option>
- </a-select>
- <br v-if="typeCopy!='edit'">
- <span v-if="typeCopy!='edit'" style="color:red">如修改目标应用,请重新选择落地页</span>
- <!-- <a @click="addApplication" style="margin-left:10px">添加应用</a> -->
- <creat-application ref="application" />
- </a-form-item>
- <a-form-item label=" " class="else-label" :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
- v-if="campaignType == '2'&&showSite&&(getPlatForm(getData('appId'))=='1'||getPlatForm(getData('appId'))=='2')">
- <a-select v-model="siteId" showSearch allowClear placeholder="选择应用下载详情页" optionFilterProp="children"
- :filterOption="filterOption">
- <a-select-option v-for="appModel in siteList" :key="appModel.siteId" :value="appModel.siteId">
- {{ appModel.name }}
- </a-select-option>
- </a-select>
- </a-form-item>
- <a-form-item label="转化类型" :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }" v-if="campaignType == '3'">
- <a-radio-group buttonStyle="solid"
- v-decorator="['urlType', { rules: [{ required: true, message: '请选择目标应用' }], initialValue:1 }]">
- <a-radio-button :value="1">淘宝商品</a-radio-button>
- <a-radio-button :value="2">淘客商品</a-radio-button>
- </a-radio-group>
- </a-form-item>
- <a-form-item :label="campaignType == '3' ? ' ' : '链接'" :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }" v-if="campaignType != '2'"
- :class="{ 'else-label': campaignType == '3' }">
- <!-- 请填写以http://或者https://开头的落地页地址,长度不超过1000个字符 -->
- <a-input placeholder="请填写链接"
- v-decorator="['url', { rules: [{ required: true, message: ' ' }, { validator: handleConfirmValue }] }]" />
- </a-form-item>
- <a-form-item label=" " :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }" class="else-label"
- v-if="campaignType == '2'&&(getPlatForm(getData('appId'))=='1'||getPlatForm(getData('appId'))=='2')">
- <a-checkbox @change="onChange" :checked="allForm.useAppMarket">
- 优先从系统应用商店下载
- </a-checkbox>
- </a-form-item>
- <a-form-item label=" " :labelCol="{ lg: { span: 7}, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 16 } }" class="else-label" v-if="allForm.useAppMarket">
- 请勾选投放应用已上架的应用商店(默认全选)
- <a-checkbox-group v-model="allForm.appStore">
- <a-checkbox value="huawei">华为</a-checkbox>
- <a-checkbox value="oppo">OPPO</a-checkbox>
- <a-checkbox value="vivo">VIVO</a-checkbox>
- <a-checkbox value="xiaomi">小米</a-checkbox>
- <a-checkbox value="meizu">魅族</a-checkbox>
- <a-checkbox value="smartisan">锤子</a-checkbox>
- </a-checkbox-group>
- </a-form-item>
- <a-form-item label="投放范围" :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
- v-if="allianceAccount">
- <a-radio-group buttonStyle="solid" v-model="allForm.allianceAccount" :disabled="typeCopy=='edit'">
- <a-radio-button value="1">默认</a-radio-button>
- <a-radio-button value="2">联盟广告</a-radio-button>
- </a-radio-group>
- </a-form-item>
- <div style="text-align:center;font-size:16px;margin-bottom:10px">
- 目标人群
- </div>
- <a-form-item label="选择模板" :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }">
- <a-select showSearch allowClear placeholder="选择模板" optionFilterProp="children" style="width: 500px"
- @change="handleChangeMould" :filterOption="filterOption">
- <a-select-option v-for="(appModel, index) in dataList" :key="index" :value="appModel.id">
- {{ appModel.templateName }}
- </a-select-option>
- </a-select>
- </a-form-item>
- <targeted-population ref="population" :populationData.sync="populationData"
- :platform="getPlatForm(getData('appId'))" :lol="allForm.allianceAccount"/>
- <a-form-item label=" " :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }" class="else-label">
- <div style="display:flex;">
- <a-checkbox :checked="checkedTrue" @change="getCheck">
- 是否设置为模板
- </a-checkbox>
- <a-input v-model="nameValue" v-if="checkedTrue" placeholder="请输入模板名称" style="width:70%" />
- </div>
- </a-form-item>
- <div style="text-align:center;font-size:16px">
- 预算和排期
- </div>
- <a-form-item label="单日预算" :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }">
- <a-radio-group buttonStyle="solid" v-model="allForm.dayBudget">
- <a-radio-button value="0">不限</a-radio-button>
- <a-radio-button value="1">统一预算</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 } }" class="else-label" v-show="allForm.dayBudget == '1'">
- <a-input placeholder="不小于100,不超过100000000,仅支持输入自然数" v-decorator="[
- 'dayBudget',
- ]" />
- </a-form-item>
- <a-form-item label="投放方式" :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }">
- <a-radio-group buttonStyle="solid" v-decorator="['speed']">
- <a-radio-button :value="1">正常投放</a-radio-button>
- <a-radio-button :value="2">平滑投放</a-radio-button>
- </a-radio-group>
- <br />
- <span>
- {{ getData('speed') == 2 ? '平滑匀速投放' : '尽快展示广告消耗预算' }}
- </span>
- </a-form-item>
- <a-form-item label="排期" :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }">
- <!-- v-decorator="['speed', { initialValue: '1' }]" -->
- <a-radio-group buttonStyle="solid" v-model="allForm.time" @change="setTime">
- <a-radio-button value="1">从今天开始长期投放</a-radio-button>
- <a-radio-button value="2">设置开始和结束日期</a-radio-button>
- </a-radio-group>
- <br />
- <a-range-picker v-if="allForm.time == '2'" v-model="timeRange" format="YYYY-MM-DD" :allowClear="false" />
- </a-form-item>
- <a-form-item label="投放时段" :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 17 }, sm: { span: 17 } }">
- <!-- v-decorator="['speed', { initialValue: '1' }]" -->
- <a-radio-group buttonStyle="solid" v-model="allForm.scheduleTime" @change="setTimeAll">
- <a-radio-button value="1">全天</a-radio-button>
- <a-radio-button value="2">特定时间</a-radio-button>
- </a-radio-group>
- <br />
- <selectCheckAll style="width:100%" v-show="allForm.scheduleTime == '2'"
- :scheduleTime.sync="allForm.scheduleTimeData" ref="selectCheck" />
- </a-form-item>
- <a-form-item label="创意展现方式" :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }">
- <!-- v-decorator="['speed', { initialValue: '1' }]" -->
- <a-radio-group buttonStyle="solid" v-decorator="['showMode', { initialValue: 2 }]">
- <a-radio-button :value="2">智能优选</a-radio-button>
- <a-radio-button :value="1">随机轮播</a-radio-button>
- </a-radio-group>
- <br />
- <span>
- {{
- getData('showMode') == 1
- ? '广告组包含的广告创意将随机展现'
- : '每一次展现的时候,系统会进行CTR预估,预估CTR高的会得到展现机会'
- }}
- </span>
- </a-form-item>
- <a-form-item label="场景广告位" :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 17 }, sm: { span: 17 } }" v-if="allForm.allianceAccount=='1'">
- <!-- v-decorator="['speed', { initialValue: '1' }]" -->
- <a-radio-group buttonStyle="solid" :disabled="typeCopy=='edit'" v-model="allForm.sceneIdAll">
- <a-radio-button :value="1">优选广告位</a-radio-button>
- <a-radio-button :value="2">按场景选择广告位</a-radio-button>
- </a-radio-group>
- <!-- getData('speed') == '2' -->
- <br>
- </a-form-item>
- <a-form-item label=" " :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }" class="else-label" v-if="allForm.sceneIdAll == 2">
- <a-checkbox-group :disabled="typeCopy=='edit'" :defaultValue="[7]" v-model="allForm.sceneId">
- <a-checkbox :value="7">信息流广告</a-checkbox>
- <a-checkbox :value="6">上下滑大屏广告</a-checkbox>
- <a-checkbox :value="3">视频播放页广告</a-checkbox>
- </a-checkbox-group>
- </a-form-item>
- <div style="text-align:center;font-size:16px">优化目标和计费</div>
- <a-form-item label=" " :labelCol="{ lg: { span: 6 }, sm: { span: 6 } }"
- :wrapperCol="{ lg: { span: 18 }, sm: { span: 18 } }" class="else-label">
- <div style="width:100%">
- <a-layout>
- <a-layout-content style="padding:10px;">
- <!-- <div :style="{ marginBottom: '16px' }">
- <a-button @click="addGroup" :disabled="allForm.group.length > 10">添加广告组</a-button>
- </div> -->
- <a-row>
- <a-col :sm="24" :md="24" :xl="24" :xxl="24" v-for="(item, index) of allForm.group" :key="index">
- <a-card title :ref="item" style="height:435px">
- <div style="clear:both"></div>
- <a-form-item label="优化目标" :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }">
- <a-radio-group buttonStyle="solid" v-model="item.bidType" @change="resData(index)">
- <a-radio-button :value="1">点击数</a-radio-button>
- <a-radio-button :value="10">转化数</a-radio-button>
- </a-radio-group>
- </a-form-item>
- <a-form-item label="转化目标" :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }" v-if="item.bidType==10">
- <a-select v-model="item.ocpxActionType">
- <a-select-option :value="2">行为数</a-select-option>
- <a-select-option :value="180"
- v-if="campaignType == '2' && allForm.groupTypeData.isActivate == '1'">激活</a-select-option>
- <a-select-option :value="53" v-if="
- (campaignType == '4' || campaignType == '5') && allForm.groupTypeData.isFormSubmit == '1'
- ">表单提交</a-select-option>
- <a-select-option :value="394" v-if="
- allForm.groupTypeData.isOrderSubmit == '1'
- ">订单提交</a-select-option>
- <a-select-option :value="348" v-if="
- allForm.groupTypeData.isValidClue == '1'
- ">使用有效线索</a-select-option>
- <a-select-option :value="383" v-if="
- allForm.groupTypeData.isCreditGrant == '1'
- ">授信出价</a-select-option>
- <a-select-option :value="384" v-if="
- allForm.groupTypeData.isWanJian == '1'
- ">完件出价</a-select-option>
- <a-select-option :value="190" v-if="
- allForm.groupTypeData.isPurchase == '1'
- ">付费出价</a-select-option>
- <a-select-option :value="191" v-if="
- allForm.groupTypeData.isFirstdayRoi == '1'
- ">首日ROI</a-select-option>
- <a-select-option :value="396" v-if="
- allForm.groupTypeData.isRegister == '1'
- ">注册优化目标</a-select-option>
- </a-select>
- </a-form-item>
- <a-form-item label="深度转化目标" :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }" v-if="
- (item.ocpxActionType == 180 || item.ocpxActionType == 53) &&
- allForm.groupTypeData.deepConversionTypes.length > 0
- ">
- <a-select v-model="item.deepConversionType" allowClear>
- <a-select-option :value="items.deepConversionType"
- v-for="(items, index) of allForm.groupTypeData.deepConversionTypes" :key="index">
- {{ items.desc }}</a-select-option>
- </a-select>
- </a-form-item>
- <a-form-item label="计费方式" :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }">
- <a-radio-group :defaultValue="1">
- <a-radio :value="1">{{item.bidType == 1?"点击计费":"展示计费(oCPM)"}}</a-radio>
- </a-radio-group>
- </a-form-item>
- <a-form-item label="出价" :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }" v-if="item.bidType ==1">
- <a-input-number v-model="item.bid" @change="showTip(index)"
- :style="{ borderColor: item.showTipCheck ? 'red' : '#d9d9d9' }" style="width:100%">
- </a-input-number>
- <span style="color:red" v-if="item.showTipCheck">不得低于0.2元,不得高于项目最高出价{{ maxBid }}元</span>
- </a-form-item>
- <a-form-item label="目标成本" :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }" v-else>
- <a-input-number v-model="item.cpaBid" @change="showTip(index)"
- :style="{ borderColor: item.showTipCheck ? 'red' : '#d9d9d9' }" style="width:100%">
- </a-input-number>
- <span style="color:red" v-if="item.showTipCheck">{{
- item.bidType == 1
- ? '不得低于1元,不得高于项目最高出价' + maxBid + '元'
- : '不得低于1元,不得高于项目最高出价' + maxBid + '元'
- }}</span>
- <span style="color:red;font-weight:700" v-else-if="item.ocpxActionType==2&&item.cpaBid&&item.cpaBid>1">
- 行为出价大于1元,请注意!!!
- </span>
- </a-form-item>
- <a-form-item label="深度转化出价" :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }" v-if="
- (item.ocpxActionType == 180 || item.ocpxActionType == 53) &&
- allForm.groupTypeData.deepConversionTypes.length > 0 &&
- item.deepConversionType != ''
- ">
- <a-input-number v-model="item.deepConversionBid" @change="deep_conversion_bidTip(index)"
- :style="{ borderColor: item.deepConversionBidCheck ? 'red' : '#d9d9d9' }" style="width:100%"
- :disabled="item.cpaBid == ''"></a-input-number>
- <span style="color:red" v-if="item.deepConversionBidCheck">深度转化目标成本必须高于优化目标成本,且不得高于3000元</span>
- </a-form-item>
- <a-form-item label="广告组名称" :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }">
- <a-input v-model="item.unitName" @change="checkGroup($event, index)"></a-input>
- <span style="color:red" v-if="item.unitNameCheck">广告组名称重复</span>
- </a-form-item>
- </a-card>
- </a-col>
- </a-row>
- </a-layout-content>
- </a-layout>
- </div>
- </a-form-item>
- </a-form>
- <template slot="footer">
- <a-button type="primary" @click="handleSubmit" :loading="loading">
- 确定
- </a-button>
- </template>
- <a-modal v-model="visibleFail" title="错误信息" :footer="null">
- <div v-if="visibleData">
- 失败条数:{{ visibleData.failCount }}
- <div style="margin-top:20px">
- <p v-for="(item, index) of visibleData.failInfo" :key="index">
- <span>名称:{{ item.campaignName?item.campaignName:item.unitName }}</span><br />
- <span>错误信息:{{ item.failMessage }}</span>
- </p>
- </div>
- </div>
- </a-modal>
- </a-modal>
- </template>
- <script>
- import {
- getAction,
- postAction,
- deleteAction,
- putAction
- } from '@/api/manage'
- import moment from 'moment'
- import {
- mapGetters
- } from 'vuex'
- import jq from 'jquery'
- import Treeselect from '@/views/modules/Statistics/components/Treeselect.vue'
- import targetedPopulation from '@/views/modules/kuaishouapp/account/stepForm/stepModule/targetedPopulation.vue'
- import creatApplication from '@/views/modules/kuaishouapp/account/stepForm/stepModule/creatApplication.vue'
- import selectCheckAll from '@/views/modules/kuaishouapp/account/stepForm/stepModule/test'
- import pick from 'lodash.pick'
- export default {
- name: 'new-mould',
- components: {
- targetedPopulation,
- Treeselect,
- creatApplication,
- selectCheckAll
- },
- data() {
- return {
- allianceAccount:false,
- visibleFail: false,
- visibleData: null,
- checkedTrue: false,
- nameValue: '',
- visible: false,
- timeRange: [],
- form: this.$form.createForm(this),
- step: 0,
- people: '2',
- targeted: '2',
- topMiddle: false,
- topMiddleNo: false,
- keyValue: '',
- keyValueNo: '',
- selectedRowKeys: [],
- selectedRowKeysValue: [],
- selectedRowKeysNo: [],
- selectedRowKeysValueNo: [],
- data: [],
- populationData: {},
- url: {
- insertTemplateUrl: '/kuaishou/create/createGroups',
- userAllocationList: '/ctop/userAllocation/list',
- campaignList: '/kuaishou/kuaiShouCampaignTemplate/list',
- getDeepConversionUrl: '/kuaishou/kuaiShouConversionTypes/getIsActivate',
- getCampaignTemplate: '/kuaishou/kuaiShouCampaignTemplate/getKuaiShouCampaignTemplate',
- appListUrl: '/kuaishou/kuaiShouCreateAppTemplate/list'
- },
- appList: [],
- appId: '',
- loading: false,
- campaignTemplateId: '',
- campaignType: '2',
- maxBid: 0,
- allForm: {
- sceneIdAll: 1,
- dayBudget: '0',
- time: '1',
- scheduleTime: '1',
- scheduleTimeData: '000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000',
- group: [],
- groupTypeData: null,
- fail: [],
- success: [],
- sceneId: [7],
- useAppMarket: false,
- appStore: ['huawei', 'oppo', 'vivo', 'xiaomi',
- 'meizu', 'smartisan'
- ],
- allianceAccount:'1'
- },
- typeCopy: "edit",
- dataList: [],
- unitId: '',
- oneCampaignId: '',
- copyCampaignId: '',
- showSite: false,
- siteId: "",
- siteList: [],
- isUpdateTrackUrl: false,
- clickTrackUrl: ""
- }
- },
- computed: {},
- filters: {
- platform(str) {
- var data = {
- 1: 'Android应用下载',
- 2: 'Android网页游戏',
- 3: 'iOS应用下载',
- 4: 'iOS网页游戏'
- }
- return data[str]
- }
- },
- methods: {
- getCheck(e) {
- this.checkedTrue = e.target.checked
- },
- resData(index) {
- this.allForm.group[index].bid = ''
- this.allForm.group[index].cpaBid = ''
- this.allForm.group[index].showTipCheck = false
- this.allForm.group[index].deepConversionBidCheck = false
- this.allForm.group[index].deepConversionType = ''
- this.allForm.group[index].deepConversionBid = ''
- },
- removeGroup(index) {
- this.allForm.group.splice(index, 1)
- },
- deep_conversion_bidTip(index) {
- if (
- this.allForm.group[index].deepConversionBid < this.allForm.group[index].cpaBid ||
- this.allForm.group[index].deepConversionBid > 3000
- ) {
- this.allForm.group[index].deepConversionBidCheck = true
- } else {
- this.allForm.group[index].deepConversionBidCheck = false
- }
- },
- checkGroup(e, index) {
- if (e.target.value != '') {
- getAction('/kuaishou/batch/checkUnitName', {
- campaignId: localStorage.getItem('advertisingGroupKey'),
- unitName: e.target.value
- }).then(res => {
- this.allForm.group[index].unitNameCheck = !res.result
- })
- }
- },
- showTip(index) {
- if (this.allForm.group[index].bidType == 1) {
- if (this.allForm.group[index].bid < 0.2 || this.allForm.group[index].bid > this.maxBid) {
- this.allForm.group[index].showTipCheck = true
- } else {
- this.allForm.group[index].showTipCheck = false
- }
- } else {
- if (this.allForm.group[index].cpaBid < 1 || this.allForm.group[index].cpaBid > this.maxBid) {
- this.allForm.group[index].showTipCheck = true
- } else {
- this.allForm.group[index].showTipCheck = false
- }
- }
- },
- getScheduleTime(item) {
- this.allForm.scheduleTimeData = item
- },
- setTime(e) {
- // console.log(moment('2019-12-27'))
- if (e.target.value == '2') {
- this.timeRange[0] = moment().startOf('day')
- this.timeRange[1] = moment().add(1, 'months')
- }
- },
- setTimeAll(e) {
- // console.log(moment('2019-12-27'))
- // if (e.target.value == '2') {
- // this.$refs.selectCheck.init()
- // } else {
- // }
- },
- getData(className) {
- return this.form.getFieldValue(className)
- },
- handleConfirmValue(rule, value, callback) {
- if (this.campaignType == '3') {
- if (value == '') {
- callback('请填写链接')
- }
- } else if (this.campaignType == '4') {
- if (/(http|https):\/\/([\w.]+\/?)\S*/.test(value) && value != '' && value.length < 10000) {
- callback()
- } else {
- callback('链接不能为空且开头为http://或https://,并且长度小于10000')
- }
- } else if (this.campaignType == '5') {
- if (/(http|https):\/\/([\w.]+\/?)\S*/.test(value) && value != '' && value.length < 10000) {
- callback()
- } else {
- callback('链接不能为空且开头为http://或https://,并且长度小于10000')
- }
- }
- },
- budgetValue(rule, value, callback) {
- if (value < 100 || value > 100000000) {
- callback('不小于100,不超过100000000,仅支持输入自然数')
- }
- callback()
- },
- handleConfirmBid(rule, value, callback) {
- if (this.bid == 0 || this.bid <= 0.2 || this.bid >= 100) {
- callback('不得低于0.2元,不得高于100元')
- }
- callback()
- },
- handleConfirmCpaBid(rule, value, callback) {
- if (this.ocpxActionType == '2' && (this.cpaBid == 0 || this.cpaBid <= 1 || this.cpaBid >= 3000)) {
- callback('金额不得低于1元,不得高于3000元')
- }
- if (this.ocpxActionType == '180' && (this.cpaBid == 0 || this.cpaBid <= 5 || this.cpaBid >= 3000)) {
- callback('金额不得低于5元,不得高于3000元')
- }
- callback()
- },
- onSelectChange(selectedRowKeys, selectionRows) {
- this.selectedRowKeys = selectedRowKeys
- this.selectedRowKeysValue = selectionRows.map(item => {
- return {
- orientationId: item.orientationId,
- orientationName: item.orientationName
- }
- })
- },
- getCheckboxProps(record) {
- return {
- props: {
- disabled: this.selectedRowKeysValueNo.some(item => item.orientationId === record.orientationId)
- }
- }
- },
- onSelectChangeNo(selectedRowKeys, selectionRows) {
- this.selectedRowKeysNo = selectedRowKeys
- this.selectedRowKeysValueNo = selectionRows.map(item => {
- return {
- orientationId: item.orientationId,
- orientationName: item.orientationName
- }
- })
- },
- getCheckboxPropsNo(record) {
- return {
- props: {
- disabled: this.selectedRowKeysValue.some(item => item.orientationId === record.orientationId)
- }
- }
- },
- okSelect() {
- this.keyValue = ''
- this.topMiddle = false
- for (let i = 0; i < this.selectedRowKeysValue.length; i++) {
- this.keyValue += this.selectedRowKeysValue[i].orientationName + ' '
- }
- },
- okSelectNo() {
- this.keyValueNo = ''
- this.topMiddleNo = false
- for (let i = 0; i < this.selectedRowKeysValueNo.length; i++) {
- this.keyValueNo += this.selectedRowKeysValueNo[i].orientationName + ' '
- }
- },
- radioChange() {
- this.selectedRowKeys = []
- this.selectedRowKeysValue = []
- this.selectedRowKeysNo = []
- this.selectedRowKeysValueNo = []
- this.keyValue = ''
- this.keyValueNo = ''
- },
- addApplication() {
- this.$refs.application.showApplication()
- },
- handleOk(item, type, campaignId, unitNameCopy, isUpdateTrackUrl, clickTrackUrl) {
- this.visible = true
- this.showSite = false
- this.isUpdateTrackUrl = isUpdateTrackUrl
- this.clickTrackUrl = clickTrackUrl
- // /kuaishou/batch/getUnitDetail
- this.typeCopy = type
- if (campaignId) {
- this.oneCampaignId = item.campaignId
- this.copyCampaignId = campaignId
- }
- console.log(item.campaignId, campaignId)
- this.unitId = item.unitId
- var params = {}
- params.accountId = item.accountId
- params.unitId = item.unitId
- getAction('/kuaishou/batch/getUnitDetail', params).then(res => {
- if (res.success) {
- var dataJson = {
- ...res.result.baseInfo,
- ...res.result.appInfo,
- ...res.result.target
- }
- // dataJson.useAppMarket = dataJson.useAppMarket==0?false:true
- this.allForm.sceneIdAll = JSON.parse(dataJson.sceneId).filter(item => item == 1).length > 0 ? 1 : JSON.parse(dataJson.sceneId)[0] ==5 ? 5 : 2
- this.allForm.allianceAccount = this.allForm.sceneIdAll==5?'2':'1'
- this.allForm.useAppMarket = dataJson.useAppMarket ? (dataJson.useAppMarket == 0 ? false : true) : false
- this.allForm.appStore = this.allForm.useAppMarket ? JSON.parse(dataJson.appStore) : ['huawei', 'oppo',
- 'vivo', 'xiaomi',
- 'meizu', 'smartisan'
- ]
- this.allForm.sceneId = this.allForm.sceneIdAll == 1 ? [7] : JSON.parse(res.result.baseInfo
- .sceneId)
- console.log(this.allForm.sceneId, 1111111)
- this.allForm.dayBudget = dataJson.dayBudget == 0 ? '0' : '1'
- dataJson.dayBudget = dataJson.dayBudget / 1000
- this.allForm.time = dataJson.endTime ? '2' : '1'
- this.timeRange = [moment(dataJson.beginTime), moment(dataJson.endTime)]
- this.allForm.scheduleTime = dataJson.scheduleTime.indexOf('1') != -1 ? '2' : '1'
- this.allForm.scheduleTimeData = dataJson.scheduleTime
- this.allForm.group = [{
- bidType: dataJson.bidType,
- bid: dataJson.bid,
- cpaBid: dataJson.cpaBid / 1000,
- showTipCheck: false,
- deepConversionBidCheck: false,
- unitName: unitNameCopy ? unitNameCopy : dataJson.unitName,
- unitNameCheck: false,
- deepConversionType: dataJson.deepConversionType,
- deepConversionBid: dataJson.deepConversionBid / 1000,
- ocpxActionType:dataJson.ocpxActionType
- }]
- this.populationData = dataJson
- this.populationData.population = dataJson.population ? JSON.parse(dataJson.population) : null
- this.populationData.excludePopulation = dataJson.excludePopulation ? JSON.parse(dataJson
- .excludePopulation) :
- null
- this.populationData.devicePrice = dataJson.devicePrice ? JSON.parse(dataJson.devicePrice) : null
- this.populationData.appInterest = dataJson.appInterest ? JSON.parse(dataJson.appInterest) : null
- this.populationData.businessInterest = dataJson.businessInterest ?
- JSON.parse(dataJson.businessInterest) :
- null
- this.populationData.fansStar = dataJson.fansStar ? JSON.parse(dataJson.fansStar) : null
- this.populationData.interestVideo = dataJson.interestVideo ? JSON.parse(dataJson.interestVideo) : null
- this.populationData.deviceBrand = dataJson.deviceBrand ? JSON.parse(dataJson.deviceBrand) : null
- this.populationData.age = dataJson.ageMin ? [dataJson.ageMin, dataJson.ageMax] : []
- this.populationData.agesRange = dataJson.agesRange ? JSON.parse(dataJson.agesRange) : []
- this.populationData.devicePrice = dataJson.devicePrice ? dataJson.devicePrice : null
- this.populationData.allForm = {}
- this.populationData.allForm.regionType =
- dataJson.region && JSON.parse(dataJson.region).length > 0 ? 'limit' : 'noLimit'
- this.populationData.allForm.region = dataJson.region
- // postAction('/kuaishou/batch/getRegionDetail', {
- // regionArr: dataJson.region
- // }).then(res => {
- // console.log(res, 11111)
- // if (res.success) {
- // this.populationData.allForm.region = res.result
- // }
- // })
- this.populationData.allForm.ageType =
- dataJson.agesRange.length > 0 ? 'ageLimit' : dataJson.ageMin ? 'ageCustom' : 'noLimit'
- this.populationData.allForm.device = dataJson.deviceBrand ? '1' : '0'
- this.populationData.allForm.price = dataJson.devicePrice ? '1' : '0'
- this.populationData.allForm.appType = dataJson.appInterest ? '1' : dataJson.appIds ? '2' : '0'
- this.populationData.allForm.fansStar = dataJson.fansStar ? '1' : '0'
- this.populationData.allForm.interestVideo = dataJson.interestVideo ? '1' : '0'
- this.populationData.allForm.platform_os = dataJson.platformOs
- this.populationData.allForm.businessInterestType = dataJson.businessInterest ? 2 : 0
- this.populationData.allForm.isOpen = dataJson.isOpen
- this.populationData.allForm.noAgeBreak = dataJson.noAgeBreak + ''
- this.populationData.allForm.noGenderBreak = dataJson.noGenderBreak + ''
- this.populationData.allForm.noAreaBreak = dataJson.noAreaBreak + ''
- this.populationData.allForm.checkArr = this.populationData.allForm.appType == '2' ? JSON.parse(dataJson
- .appIds) : []
- this.$nextTick(() => {
- console.log(dataJson)
- this.form.setFieldsValue(pick(dataJson, ['appId', 'urlType', 'url', 'dayBudget', 'speed',
- 'showMode'
- ]))
- // this.form.setFieldsValue({
- // appId: dataJson.appId
- // })
- // this.form.setFieldsValue({
- // dayBudget: dataJson.dayBudget
- // })
- // this.form.setFieldsValue({
- // speed: dataJson.speed
- // })
- // this.form.setFieldsValue({
- // showMode: dataJson.showMode
- // })
- // console.log(dataJson.sceneId)
- // this.form.setFieldsValue({
- // sceneId: dataJson.sceneId
- // })
- })
- }
- })
- },
- handleCancel(e) {
- this.visible = false
- },
- handleSubmit(e) {
- // this.$refs.population.handleSubmit()
- e.preventDefault()
- this.$refs.population.handleSubmit()
- this.form.validateFieldsAndScroll((err, values) => {
- if (!err) {
- this.loading = true
- var groupArr = this.allForm.group.map(item => {
- return {
- ...item,
- cpaBid: item.cpaBid != '' ? item.cpaBid * 1000 : '',
- bid: item.bid != '' ? item.bid * 1000 : '',
- deepConversionBid: item.deepConversionBid != '' ? item.deepConversionBid * 1000 : '',
- ocpxActionType: item.ocpxActionType,
- bidType: item.bidType == 1 ? 2 : 10
- }
- })[0]
- var json = {
- ...values,
- // sceneId: this.allForm.sceneIdAll == 1 ? [this.allForm.sceneIdAll] : this.allForm.sceneId,
- sceneId: this.allForm.allianceAccount=='1'?this.allForm.sceneIdAll == 1 ? [this.allForm.sceneIdAll] : this.allForm.sceneId:[5],
- dayBudget: values.dayBudget * 1000
- }
- var params = {
- ...this.populationData,
- ...json,
- accountId: localStorage.getItem('accountId'),
- unitId: this.unitId,
- unitType: 4,
- beginTime: this.allForm.time == '2' ? moment(this.timeRange[0]).format('YYYY-MM-DD') : moment()
- .startOf('day').format('YYYY-MM-DD'),
- endTime: this.allForm.time == '2' ? moment(this.timeRange[1]).format('YYYY-MM-DD') : '',
- scheduleTime: this.allForm.scheduleTimeData
- }
- if (this.allForm.useAppMarket == true || this.allForm.useAppMarket == false) {
- params.useAppMarket = this.allForm.useAppMarket ? 1 : 0
- if (this.allForm.useAppMarket == true) {
- params.appStore = this.allForm.appStore
- }
- }
- if (this.isUpdateTrackUrl) {
- if (this.showSite && (this.getPlatForm(this.getData('appId')) == '1' || this.getPlatForm(this.getData(
- 'appId')) == '2')) {
- params.otherJson = {
- isUpdate: true,
- siteId: this.siteId,
- isUpdateTrackUrl: true,
- clickTrackUrl: this.clickTrackUrl
- }
- } else {
- params.otherJson = {
- isUpdateTrackUrl: true,
- clickTrackUrl: this.clickTrackUrl,
- isUpdate: false
- }
- }
- } else {
- if (this.showSite && (this.getPlatForm(this.getData('appId')) == '1' || this.getPlatForm(this.getData(
- 'appId')) == '2')) {
- params.otherJson = {
- isUpdate: true,
- siteId: this.siteId,
- isUpdateTrackUrl: false,
- }
- } else {
- params.otherJson = {
- isUpdate: false,
- isUpdateTrackUrl: false,
- }
- }
- }
- if (this.checkedTrue) {
- var data = this.populationData
- postAction('/kuaishou/batch/addDirectionalTemplate', {
- accountId: localStorage.getItem('accountId'),
- templateName: this.nameValue,
- templateContent: JSON.stringify(this.populationData)
- }).then(res => {})
- }
- if(this.allForm.allianceAccount=='1'){
- var {...paramsEnd} = params
- }else{
- var {fansStar,appType,businessInterestType,interestVideo,isOpen,noAgeBreak,noGenderBreak,noAreaBreak,...paramsElse} = params.allForm
- params.allForm = paramsElse
- var {businessInterestType,isOpen,noAgeBreak,noGenderBreak,noAreaBreak,...paramsEnd} = params
- }
- if (this.typeCopy == 'edit') {
- var param = {
- ...paramsEnd,
- ...groupArr
- }
- postAction('/kuaishou/batch/updateUnit', param).then(res => {
- if (res.result.code == 0) {
- this.visible = false
- this.$emit('getList', localStorage.getItem('advertisingGroupKey'))
- this.loading = false
- } else {
- this.loading = false
- this.$message.error(res.result.message)
- }
- })
- } else if (this.typeCopy == 'copy') {
- paramsEnd.type = 'copy'
- paramsEnd.copyUnitId = this.unitId
- paramsEnd.copyToCampaignId = this.copyCampaignId
- paramsEnd.campaignId = this.oneCampaignId
- paramsEnd.createCount = 1
- paramsEnd.groupArr = [groupArr]
- postAction('/kuaishou/batch/copyUnit', paramsEnd).then(res => {
- if (res.success) {
- if (res.result.failCount > 0) {
- this.visibleFail = true
- this.visibleData = res.result
- this.loading = false
- } else {
- var that = this
- setTimeout(() => {
- that.visible = false
- that.loading = false
- that.$emit('getList', localStorage.getItem('advertisingGroupKey'))
- }, 1000)
- }
- } else {
- this.$message.error(res.message)
- }
- })
- }
- }
- })
- },
- onChange(e) {
- this.allForm.useAppMarket = e.target.checked
- // console.log(value)
- },
- getPageList(appId) {
- getAction('/kuaishou/batch/getPageList', {
- accountId: localStorage.getItem('accountId'),
- appId: appId,
- viewComp: 7
- }).then(res => {
- if (res.success) {
- console.log(res)
- this.siteList = res.result
- }
- })
- },
- handleChange(value) {
- // this.$refs.population.getAppList(value)
- if (value == this.getData('appId')) {
- this.showSite = false
- } else {
- this.showSite = true
- this.siteId = ''
- this.getPageList(value)
- }
- },
- handleChangeMould(value) {
- if (value) {
- this.populationData = JSON.parse(
- this.dataList.filter(item => {
- return item.id == value
- })[0].templateContent
- )
- } else {
- this.populationData = {}
- }
- },
- getPlatForm(appId) {
- if (appId) {
- var data = this.appList.filter(item => {
- return item.appId == appId
- })
- return data[0].platform
- }
- },
- handleBlur() {
- console.log('blur')
- },
- handleFocus() {
- console.log('focus')
- },
- filterOption(input, option) {
- return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
- },
- prevStep() {
- this.$emit('prevStep', this.campaignId ? this.campaignId : localStorage.getItem('advertisingGroupKey'))
- },
- getMould() {
- let params = {}
- params.accountId = localStorage.getItem('accountId')
- getAction('/kuaishou/batch/getDirectionalTemplate', params).then(res => {
- console.log(res)
- if (res.success) {
- this.dataList = res.result.map((item, index) => {
- return {
- ...item,
- key: index
- }
- })
- }
- })
- },
- getAppList() {
- let params = {}
- params.accountId = localStorage.getItem('accountId')
- getAction('/kuaishou/batch/getAppList', params).then(res => {
- if (res.success) {
- this.appList = res.result.map((item, index) => {
- return {
- ...item,
- key: index
- }
- })
- }
- })
- },
- getCampaignList() {
- var params = {}
- params.accountId = localStorage.getItem('accountId')
- params.campaignId = this.campaignId ? this.campaignId : localStorage.getItem('advertisingGroupKey')
- getAction('/kuaishou/batch/getCampaignList', params).then(res => {
- if (res.success) {
- this.campaignType = res.result.records[0].campaignType
- }
- })
- },
- },
- activated: function () {
- this.getAppList()
- this.getCampaignList()
- this.getMould()
- getAction('/kuaishou/batch/getIsActivate', {
- accountId: localStorage.getItem('accountId')
- }).then(res => {
- if (res.success) {
- this.allForm.groupTypeData = res.result
- }
- })
- getAction('/kuaishou/batch/getWhiteList',{
- accountId:localStorage.getItem('accountId')
- }).then(res=>{
- if(res.success){
- console.log(res)
- if(res.result){
- if(res.result.alliance_account == 1){
- this.allianceAccount = true
- }else{
- this.allianceAccount = false
- }
- }else{
- this.allianceAccount = false
- }
- }
- })
- getAction('/kuaishou/batch/getProjectMaxBid', {
- accountId: localStorage.getItem('accountId')
- }).then(res => {
- if (res.success) {
- this.maxBid = res.result / 1000
- }
- })
- }
- }
- </script>
|