1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581 |
- <style>
- .display-none-selset {
- display: none !important;
- }
- #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-card :body-style="{ padding: '24px 32px' }" :bordered="false" class="group-creat">
- <a-form @submit="handleSubmit" :form="form">
- <a-form-item
- label="今日已创建数"
- :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
- >
- <div style="color:red">
- {{createCount}}
- </div>
- </a-form-item>
-
- <a-form-item
- label="目标应用"
- :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
- v-if="campaignType == '2'"
- >
- <a-select
- 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>
- <!-- <a @click="addApplication" style="margin-left:10px">刷新应用</a> -->
- <a-button type="primary" @click="addApplication" :loading="tongbuLoading"> 刷新应用</a-button>
- </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 == 3||campaignType == 4||campaignType == 5||campaignType == 6||campaignType == 7"
- :class="{ 'else-label': campaignType == 3 }"
- >
- <a-input
- placeholder="请填写链接"
- v-decorator="['url', { rules: [{ required: true, message: '链接不能为空' }] }]"
- />
- </a-form-item>
- <a-form-item
- label="转化目标"
- :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
- v-if="campaignType == 2 || campaignType == 4 || campaignType == 5"
- >
- <span v-if="convertId && !convert" style="display: block; font-size: 16px"
- >已选择转化目标: {{ convertId.label }}</span
- >
- <a-button type="primary" @click="showConvert">{{ convertId ? '更换转化目标' : '选择转化目标' }}</a-button>
- </a-form-item>
- <a-modal v-model="convert" title="选择转化目标">
- <template slot="footer">
- <a-button key="back" @click="convert = false">取消</a-button>
- <a-button key="submit" type="primary" @click="convert = false"> 确定 </a-button>
- </template>
- <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="convertType" @change="convertChange">
- <a-radio-button value="1" v-show="campaignType == 4 || campaignType == 5">JS布玛</a-radio-button>
- <a-radio-button value="2" v-show="campaignType == 4 || campaignType == 5">Xpath</a-radio-button>
- <a-radio-button
- value="3"
- v-show="campaignType == 2 && (getPlatForm(getData('appId')) == 1 || getPlatForm(getData('appId')) == 2)"
- >应用-SDK
- </a-radio-button>
- <a-radio-button value="7" v-show="campaignType == 2">应用-API</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-select allowClear labelInValue style="width: 100%" v-model="convertId" @focus="getConvertList">
- <a-select-option :value="item.convert_id" v-for="(item, index) in convertList" :key="item.convert_id">
- {{ item.convert_name }}</a-select-option
- >
- </a-select>
- </a-form-item>
- </a-modal>
- <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
- v-decorator="[
- 'useAppMarket',
- {
- valuePropName: 'checked',
- initialValue: false,
- },
- ]"
- >
- 优先从系统应用商店下载
- </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="getData('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">
- <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="创建数量"
- :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
- >
- <a-input-number
- v-decorator="[
- 'createCount',
- {
- rules: [{ required: true, message: '创建数量必填' }],
- initialValue: 1,
- },
- ]"
- style="width: 150px"
- >
- </a-input-number>
- </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
- v-decorator="['templateId']"
- showSearch
- allowClear
- placeholder="选择定向模板"
- optionFilterProp="children"
- style="width: 500px"
- :filterOption="filterOption"
- >
- <a-select-option v-for="appModel in templateList" :key="appModel.templateId" :value="appModel.templateId">
- {{ appModel.templateName }}
- </a-select-option>
- </a-select>
- <a-button type="primary" @click="getTemplate(null)" :loading="templateLoading"> 刷新模板</a-button>
- <br>
- <a style="margin: 0 10px 0 0" @click="addTemplate(null)">新增模板</a>
- <a
- @click="lookTemplate(null, getData('templateId'))"
- :disabled="getData('templateId') == '' || getData('templateId') == null"
- >查看模板</a
- >
- </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-if="allForm.dayBudget == '1'"
- >
- <a-input
- placeholder="不小于100,不超过100000000,仅支持输入自然数"
- v-decorator="[
- 'dayBudget',
- {
- rules: [{ required: true, message: '请填写预算' }, { validator: budgetValue }],
- },
- ]"
- />
- </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', { initialValue: '1' }]">
- <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 } }"
- >
- <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: 10 }, sm: { span: 17 } }"
- >
- <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 } }"
- >
- <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: 10 }, sm: { span: 17 } }"
- >
- <checkBoxGroup
- :options="[
- { label: '优选广告位', value: 1 },
- { label: '信息流广告', value: 7 },
- { label: '上下滑大屏广告', value: 6 },
- { label: '视频播放页广告', value: 3 },
- ]"
- v-model="allForm.sceneId"
- @change="changeData"
- />
- </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'"
- >
- <a-radio-group buttonStyle="solid" v-decorator="['sceneId', { initialValue: '1' }]">
- <a-radio-button value="1">优选广告位</a-radio-button>
- <a-radio-button value="2">按场景选择广告位</a-radio-button>
- </a-radio-group>
- <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="getData('sceneId') == '2'"
- >
- <a-checkbox-group :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>
- <div style="width: 100%" v-for="(item, index) of allForm.group" :key="index">
- <div style="clear: both"></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="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: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, 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: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, 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: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, 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: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
- v-if="item.bidType == 1"
- >
- <!-- v-model="item.bid" -->
- <a-input-number
- v-decorator="[
- 'bid',
- {
- rules: [{ required: true, message: '出价必填' }, {validator: bidCheck}],
- },
- ]"
- :style="{ borderColor: item.showTipCheck ? 'red' : '#d9d9d9' }"
- style="width: 100%"
- >
- </a-input-number>
- <!-- <span style="color: red" v-if="item.showTipCheck && item.ocpxActionType == 180"
- >不得低于0.2元,不得高于项目最高出价{{ maxBid }}元</span
- > -->
- </a-form-item>
- <a-form-item
- label="目标成本"
- :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
- v-else
- >
- <!-- v-model="item.cpaBid" -->
- <a-input-number
- v-decorator="[
- 'cpaBid',
- {
- rules: [{ required: true, message: '目标成本必填' }, {validator: cpaBidCheck}],
- },]"
-
- 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-if="item.ocpxActionType == 2 && getData('cpaBid') && getData('cpaBid') > 1"
- >
- 行为出价大于1元,请注意!!!
- </span>
- </a-form-item>
- <a-form-item
- label="深度转化出价"
- :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, 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="getData('cpaBid')==null||getData('cpaBid') == ''"
- ></a-input-number>
- <span style="color: red" v-if="item.deepConversionBidCheck"
- >深度转化目标成本必须高于优化目标成本,且不得高于3000元</span
- >
- </a-form-item>
- <a-form-item
- label="广告组名称"
- :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
- >
- <!-- v-model="item.unitName" -->
- <a-input v-decorator="[
- 'unitName',
- {
- rules: [{ required: true, message: '广告组必填' }, {validator: handleConfirmValue}],
- },]" @change="checkGroup($event, index)"></a-input>
- <span style="color: red" v-if="item.unitNameCheck">广告组名称重复</span>
- </a-form-item>
- </div>
- <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-decorator="['creativeMaterialType', { initialValue: '1' }]"
- @change="changeType()"
- >
- <a-radio-button value="1">竖版视频</a-radio-button>
- <a-radio-button value="2">横版视频</a-radio-button>
- <!-- <a-radio-button value="4" v-if="JSON.parse(pane.sceneId).indexOf(7)>0">便利贴创意</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-input
- v-decorator="[
- 'creativeName',
- {
- rules: [{ required: true, message: '创意标题必填' }],
- initialValue: '自定义创意_竖版视频',
- },
- ]"
- ></a-input>
- </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="['createType', { rules: [{ required: true, message: '请选择目标应用' }], initialValue: '0' }]"
- @change="getPageSize"
- >
- <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 } }"
- >
- <a @click="getVideoList()">选择视频</a> {{ videoList.length + '/' + (getData('createType')=='0'?getData('createCount'):getData('createCount')*15) }}
- <br />
- <div v-if="videoList.length > 0 && showVideo" style="display:flex;flex-wrap:wrap">
- <span v-for="(item, index) of videoList" :key="index" style="position: relative" class="width-video">
- <a-icon type="close-circle" @click="deleteData(index, item)" style="position: absolute;right:0;color:red" />
- <img :src="item.coverUrl" controls="controls" style="width:100%" @click="matemalVideo(item)"></img>
- </span>
- </div>
- </a-form-item>
- <a-form-item
- label="广告语"
- :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
- >
- <!-- v-model.trim="allForm.description" -->
- <!-- @keyup="getData('description')?getData('description')=this.value.replace(/^ +| +$/g,'')" -->
- <a @click="showTitle()">推荐广告语</a>
- <div class="step4-else" style="display: inline-block; position: relative; border-radius: 4px; width: 100%; border: 1px solid #d9d9d9;">
- <a-textarea
- class="rending"
- placeholder="请输入广告语"
- v-decorator="['description',{ rules: [{ required: true, message: '广告语必填' }] }]"
- @keyup="getData('description')?form.setFieldsValue({
- description: getData('description').replace(/\s/g,'')
- }):null"
- @change="getData('description')?form.setFieldsValue({
- description: getData('description').replace(/\s/g,'')
- }):null"
- :autosize="{ minRows: 2, maxRows: 6 }"
- :max-length="30"
- ></a-textarea>
- <p
- style="
- font-size: 12px;
- color: #b6bbc7;
- letter-spacing: 0.3px;
- text-align: right;
- line-height: 20px;
- position: absolute;
- bottom: 0;
- right: 6px;
- width: 100%;
- margin-bottom: 0;
- "
- >
- {{ (getData('description')?getData('description').length:0) + '/30' }}
- </p>
- </div>
- <br />
- <a @click="cunTitle()">收藏</a>
- <a @click="showCunTitle()" style="margin-left: 10px">收藏列表</a>
- <!--
- <br />
- <a-tag v-for="(itemTag, indexTag) of tags" :key="indexTag" @click="getChange(item, itemTag, index)">{{
- itemTag.name
- }}</a-tag> -->
- </a-form-item>
- <a-form-item
- label="创意分类"
- :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
- v-if="creativeCategorySwitch"
- >
- <a-cascader
- :options="createOptions"
- v-decorator="['creativeCategory',{ rules: [{ required: true, message: '创意分类必选' }] }]"
- :fieldNames="fieldNames"
- placeholder="请选择创意分类"
- />
- </a-form-item>
- <a-form-item
- label="创意标签"
- :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
- v-if="creativeCategorySwitch"
- >
- <a-select
- mode="tags"
- style="width: 100%"
- placeholder="按回车生成标签"
- v-decorator="['creativeTag',{ rules: [{ required: true, message: '创意标签必填' }] }]"
- dropdownClassName="display-none-selset"
- :token-separators="[',', ' ', ',']"
- >
- </a-select>
- <span v-if="getData('creativeTag') && getData('creativeTag').length > 10" style="color: red"
- >创意标签最多填写10个,请删减</span>
- <br />
- <a-popconfirm @confirm="getInfo()">
- <div slot="title">
- <div>
- 分类名称:
- <a-input placeholder="请输入" v-model="tagName" style="display: inline-block; width: 300px" />
- </div>
- </div>
- <a style="margin-right: 10px" :disabled="!getData('creativeTag')">收藏</a>
- </a-popconfirm>
- <a @click="showCunTag('creativeTag')">收藏列表</a>
- </a-form-item>
- <a-form-item
- label="行动号召"
- :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
- >
- <a-select
- v-decorator="['actionBarText', { rules: [{ required: true, message: '行动号召按钮文案' }] }]"
- showSearch
- allowClear
- placeholder="选择行动号召按钮文案"
- optionFilterProp="children"
- :filterOption="filterOption"
- >
- <a-select-option v-for="appModel in actionBarTextList" :key="appModel.id" :value="appModel.actionBarText">
- {{ appModel.actionBarText }}
- </a-select-option>
- </a-select>
- </a-form-item>
- <a-form-item
- label="下载详情"
- v-if="showSite"
- :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
- >
- <a-select
- v-decorator="['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 } }"
- >
- <a-input v-decorator="['clickTrackUrl']" placeholder="请输入第三方检测链接"> </a-input>
- <a
- v-if="getData('clickTrackUrl')"
- @click="
- clickTrackUrlShow = true
- clickTrackUrlShowType == '1'
- "
- style="margin-right: 10px"
- >收藏监测链接</a
- >
- <a
- @click="
- getClickTrackUrlList('1')
- clickTrackUrlShowType = '1'
- "
- >监测链接列表</a
- >
- </a-form-item>
- <a-form-item
- label="第三方ActionBar点击监控链接"
- :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
- :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }"
- v-if="actionbarClickUrlSwitch"
- >
- <a-input v-decorator="['actionbarClickUrl']" placeholder="请输入第三方点击监控链接"> </a-input>
- <span style="color: red; position: relative; top: -10px">仅加白使用</span>
- <br />
- <a
- v-if="getData('actionbarClickUrl')"
- @click="
- clickTrackUrlShow = true
- clickTrackUrlShowType = '2'
- "
- style="margin-right: 10px; position: relative; top: -20px"
- >收藏监测链接</a
- >
- <a
- @click="
- getClickTrackUrlList('2')
- clickTrackUrlShowType = '2'
- "
- style="margin-right: 10px; position: relative; top: -20px"
- >监测链接列表</a
- >
- </a-form-item>
- <a-form-item :wrapperCol="{ span: 20 }" style="text-align: center">
- <a-button htmlType="submit" type="primary" :loading="loading">确定</a-button>
- <!-- <a-button style="margin-left: 8px" @click="prevStep" v-show="step == 1">上一步</a-button> -->
- </a-form-item>
- </a-form>
- <a-modal v-model="visible" title="广告组创建信息">
- <div>创建成功:{{ allForm.success }}条</div>
- <template slot="footer">
- <a-button key="submit" type="primary" @click="handleOk"> 返回列表 </a-button>
- </template>
- </a-modal>
- <templateModal ref="templateModal" @getData="getTemplateList" />
- <a-modal title="查看视频" v-model="visibleVideo" :width="400" :footer="null">
- <video class="video" :src="videoUrlShow" controls="controls" style="width: 100%">
- 您的浏览器不支持 video 标签。
- </video>
- </a-modal>
- <a-modal
- :maskClosable="false"
- title="选择素材"
- v-model="visibleMatemal"
- @ok="handleOkShow"
- @cancel="cancelAll"
- :width="1000"
- >
- <a-tabs type="card" @change="callback" v-model="active" class="check-video">
- <div slot="tabBarExtraContent">
- 当前选择数量
- {{ sumContent + '/' + (getData('createType')=='0'?getData('createCount'):getData('createCount')*15) }}
- <a-button type="primary" @click="tongbu()" :loading="tongbuLoading" style="margin-left:10px">
- 刷新素材</a-button
- >
- </div>
-
- <a-tab-pane :tab="item.label" v-for="item of tab" :key="item.value">
- <a-row :gutter="24">
- <a-col :span="12">
- <a-form-item label="日期选择" :labelCol="labelCol" :wrapperCol="wrapperCol">
- <a-range-picker name="buildTime" v-model="time" />
- </a-form-item>
- </a-col>
- <a-col :span="12">
- <a-button style="position: relative;top: 4px;" @click="selectAllVideo">
- 全选
- </a-button>
- </a-col>
- <!-- <a-col :span="12">
- <a-form-item label="筛选条件" :labelCol="labelCol" :wrapperCol="wrapperCol">
- <a-select v-model="orderBy" style="width: 100%">
- <a-select-option value="time"> 按时间排序 </a-select-option>
- <a-select-option value="cost"> 按消耗排序</a-select-option>
- </a-select>
- </a-form-item>
- </a-col> -->
- </a-row>
-
- <ul v-if="dataSource.length > 0" style="overflow: auto; padding-left: 0">
- <a-checkbox-group v-model="checkVideo" style="width: 100%" @change="setData">
- <li v-for="(item, index) of dataSource" :key="index" class="chouzhen" style="height: 400px">
- <!-- <video class="video" :src="item.url" controls="controls" style="width:100%">
- 您的浏览器不支持 video 标签。
- </video> -->
- <a-checkbox
- :value="item.photoId"
- style="width: 100%; position: absolute; z-index: 100; right: 0; top: 0"
- >
- <img :src="item.coverUrl" alt="" style="width: 90%; margin-bottom: 30px" />
- <div style="width: 100%; text-align: center">
- {{ item.statDate ? '时间:' + item.statDate.split(' ')[0] : '消耗:' + item.charge }}
- </div>
- </a-checkbox>
- <a @click="matemalVideo(item, index)" style="position: absolute; z-index: 100; right: 56px; bottom: 5px"
- >查看视频</a
- >
- </li>
- </a-checkbox-group>
- </ul>
- <div v-else style="width: 100%; height: 400px; display: flex; justify-content: center; align-items: center">
- <img
- src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1575627350102&di=02972956f2243933bffc0d85099adbfe&imgtype=jpg&src=http%3A%2F%2Fimg0.imgtn.bdimg.com%2Fit%2Fu%3D1095310825%2C1528244349%26fm%3D214%26gp%3D0.jpg"
- alt=""
- v-if="!loadingVideoList"
- />
- <img v-else src="@/views/modules/material/loading.gif" />
- </div>
- </a-tab-pane>
- <!-- <a-button slot="tabBarExtraContent" type="primary" @click="tongbu()" :loading="tongbuLoading">
- 刷新素材</a-button
- > -->
- </a-tabs>
- <div style="text-align: right">
- <a-pagination
- size="small"
- :showTotal="ipagination.showTotal"
- style="float: right"
- v-if="dataSource.length > 0"
- showQuickJumper
- :pageSize.sync="ipagination.pageSize"
- :total="ipagination.total"
- v-model="ipagination.current"
- @change="getDataSource"
- />
- </div>
- </a-modal>
- <a-modal title="监测链接名称" v-model="clickTrackUrlShow">
- <template slot="footer">
- <a-button
- key="submit"
- :disabled="trackUrlName == '' && !showTrackUrlNameElse"
- type="primary"
- @click="clickTrackUrlOk"
- >
- 确定
- </a-button>
- </template>
- <a-input placeholder="请输入监测链接名称" v-model="trackUrlName" @blur="changeTrackUrlName" style="width: 100%" />
- <span style="color: red" v-if="!showTrackUrlNameElse">名称重复</span>
- </a-modal>
- <a-modal title="监测链接列表" v-model="clickTrackUrlList" :width="1000" :footer="null">
- <a-spin :spinning="spinning">
- <a-row :gutter="10" class="onlny-click-track">
- <a-col :sm="24" style="margin-bottom: 20px; z-index: 10">
- <a-card class="search-box" style="over-flow: auto">
- <!-- <a-input v-model="trackName"></a-input> -->
- <a-input-search
- placeholder="请输入监测链接名称"
- enter-button="Search"
- size="large"
- @search="onSearch"
- style="width: 40%; margin-bottom: 20px"
- v-model="trackName"
- />
- <a-list size="large" bordered :dataSource="trackUrlList">
- <a-list-item slot="renderItem" slot-scope="item" :title="item.trackUrl" style="line-height: 50px">
- <div slot="actions">
- <a @click="okClickTrackUrl(item)">选择</a>
- <a-divider type="vertical" />
- <a @click="removeClickTrackUrl(item)">删除</a>
- </div>
- {{ item.trackName }}
- <a-input v-model="item.trackUrl" readOnly style="margin: 10px; width: 70%"></a-input>
- </a-list-item>
- </a-list>
- </a-card>
- </a-col>
- </a-row>
- </a-spin>
- </a-modal>
- <a-modal title="收藏标题" v-model="creativeTagVisible" :width="1000" @ok="okTag">
- <el-tree :data="optionsTag" show-checkbox node-key="id" :props="defaultProps" :check-strictly="true" ref="tree">
- </el-tree>
- </a-modal>
- <a-modal title="推荐标题" v-model="titleVisible" :width="1000" :footer="null">
- <a-row :gutter="10">
- <a-col :sm="10" style="margin-bottom: 20px; z-index: 10">
- <a-card class="search-box" style="min-height: 500px">
- <div style="margin-bottom: 30px">
- <span style="display: inline-block; width: 80px">行业</span>
- <a-cascader
- style="margin-top: 1rem; width: 300px"
- v-model="dataOne"
- :options="options"
- :showSearch="{ filter }"
- expandTrigger="hover"
- @change="onChangeTitle"
- placeholder="请选择行业"
- >
- <a-icon type="smile" slot="suffixIcon" class="test" />
- </a-cascader>
- </div>
- <div style="margin-bottom: 30px">
- <span style="display: inline-block; width: 80px">关键词</span>
- <a-input placeholder="请输入关键词" v-model="value" style="width: 300px" />
- </div>
- <span style="display: inline-block; width: 80px; float: left"></span>
- <a-button type="primary" @click="searchQuery" :disabled="value == ''">生成</a-button>
- </a-card>
- </a-col>
- <a-col :sm="14" style="margin-bottom: 20px; z-index: 10">
- <a-card class="search-box" style="over-flow: auto">
- <a-list size="large" bordered :dataSource="title">
- <a-list-item slot="renderItem" slot-scope="item">
- <a slot="actions" @click="okTitle(item)">选择</a>
- {{ item }}
- </a-list-item>
- </a-list>
- </a-card>
- </a-col>
- </a-row>
- </a-modal>
- <a-modal title="收藏标题" v-model="cunTitleVisible" :width="1000" :footer="null">
- <a-row :gutter="10">
- <a-col :sm="24" style="margin-bottom: 20px; z-index: 10">
- <a-card class="search-box" style="over-flow: auto">
- <a-list size="large" bordered :dataSource="cunTitleList">
- <a-list-item slot="renderItem" slot-scope="item">
- <div slot="actions">
- <a @click="okTitleCun(item)">选择</a>
- <a-divider type="vertical" />
- <a @click="removeTitleCun(item)">删除</a>
- </div>
- {{ item.title }}
- </a-list-item>
- </a-list>
- </a-card>
- </a-col>
- </a-row>
- </a-modal>
- </a-card>
- </template>
- <script>
- import { getAction, postAction, deleteAction } from '@/api/manage'
- import moment from 'moment'
- import { mapGetters } from 'vuex'
- import jq from 'jquery'
- import selectCheckAll from '@/views/modules/kuaishouapp/account/stepForm/stepModule/test'
- import templateModal from '@/views/modules/kuaishouapp/crossAccount/templateModal'
- import checkBoxGroup from '@/components/formComponents/checkBoxGroup'
- let dateQuantumRangeConst = ''
- const columns = [
- {
- title: '人群',
- dataIndex: 'orientationName',
- scopedSlots: {
- customRender: 'orientationName',
- },
- width: 150,
- },
- {
- title: '属性',
- dataIndex: 'populationType',
- filters: [
- {
- text: '上传人群',
- value: '1',
- },
- {
- text: '广告人群',
- value: '2',
- },
- {
- text: '主题专区',
- value: '3',
- },
- {
- text: '逻辑规则',
- value: '4',
- },
- {
- text: '人群扩展',
- value: '5',
- },
- {
- text: '平台定制',
- value: '6',
- },
- {
- text: '定制付费',
- value: '7',
- },
- {
- text: '网红粉丝类别',
- value: '8',
- },
- {
- text: '内容付费行为',
- value: '9',
- },
- {
- text: '移动应用安装',
- value: '10',
- },
- {
- text: '快手使用活跃度',
- value: '11',
- },
- {
- text: '行业分类',
- value: '12',
- },
- {
- text: '商业兴趣',
- value: '13',
- },
- {
- text: '固化标签',
- value: '14',
- },
- {
- text: '行业偏好',
- value: '15',
- },
- {
- text: '第三方标签',
- value: '16',
- },
- {
- text: '产品关键词',
- value: '17',
- },
- ],
- onFilter: (value, record) => record.populationType.toString().toLowerCase().includes(value.toLowerCase()),
- scopedSlots: {
- customRender: 'populationType',
- },
- width: 150,
- },
- {
- title: '创建时间',
- dataIndex: 'createTime',
- scopedSlots: {
- customRender: 'createTime',
- },
- sorter: (a, b) => a.createTime - b.createTime,
- },
- ]
- function tqFun(qcArr1) {
- var tempArr = []
- function bbFun(qcArr) {
- for (var i = 0; i < qcArr.length; i++) {
- if (qcArr[i] instanceof Array) {
- bbFun(qcArr[i])
- } else {
- tempArr.push(qcArr[i])
- }
- }
- return tempArr
- }
- return bbFun(qcArr1)
- }
- export default {
- name: 'creat-unit',
- components: {
- selectCheckAll,
- templateModal,
- checkBoxGroup,
- },
- props: {
- campaignId: {
- type: String,
- default() {
- return null
- },
- },
- },
- data() {
- return {
- templateLoading: false,
- dataOne: [],
- actionBarTextList: [],
- trackName: '',
- trackUrlList: [],
- showSite: false,
- appList: [],
- siteList: [],
- createOptions: [],
- fieldNames: {
- label: 'category_name',
- value: 'category_id',
- children: 'child',
- },
- defaultProps: {
- children: 'children',
- label: 'label',
- id: 'id',
- },
- showTrackUrlNameElse: true,
- clickTrackUrlList: false,
- spinning: false,
- trackUrlName: '',
- tagName: '',
- labelCol: {
- lg: {
- span: 6,
- },
- sm: {
- span: 6,
- },
- xs: {
- span: 6,
- },
- md: {
- span: 6,
- },
- },
- wrapperCol: {
- lg: {
- span: 18,
- },
- sm: {
- span: 18,
- },
- xs: {
- span: 14,
- },
- md: {
- span: 14,
- },
- },
- ipagination: {
- current: 1,
- pageSize: 5,
- // pageSizeOptions: ['10', '20', '30'],
- showTotal: (total, range) => {
- return range[0] + '-' + range[1] + ' 共' + total + '条'
- },
- showQuickJumper: true,
- // showSizeChanger: true,
- total: 0,
- onChange: (current) => {
- // 切换分页时的回调,
- // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
- this.ipagination.current = current
- },
- },
- showVideo: true,
- videoList: [],
- orderBy: 'time',
- visibleMatemal: false,
- loadingVideoList: false,
- checkVideo: [],
- checkVideoAll: [],
- checkVideoWai: [],
- checkVideoWhole:[],
- dataSource: [],
- active: 0,
- time: [],
- channelType: 0,
- creativeMaterialType: '',
- tab: [
- // {
- // value: 2,
- // label: '全部',
- // },
- {
- value: 0,
- label: '内部',
- },
- {
- value: 1,
- label: '外部',
- },
- ],
- templateList: [],
- allianceAccount: false,
- creativeCategorySwitch: false,
- actionbarClickUrlSwitch: false,
- tongbuLoading: false,
- convert: false,
- convertId: '',
- convertList: [],
- checkedTrue: false,
- nameValue: '',
- visible: false,
- timeRange: [],
- form: this.$form.createForm(this),
- step: 0,
- people: '2',
- targeted: '2',
- topMiddle: false,
- topMiddleNo: false,
- keyValue: '',
- keyValueNo: '',
- columns,
- 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: null,
- maxBid: 0,
- allForm: {
- dayBudget: '0',
- time: '1',
- scheduleTime: '1',
- scheduleTimeData:
- '000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000',
- group: [],
- groupTypeData: null,
- fail: [],
- success: [],
- sceneId: [1],
- appStore: ['huawei', 'oppo', 'vivo', 'xiaomi', 'meizu', 'smartisan'],
- allianceAccount: '1',
- description: '',
- },
- convertType: '1',
- dataList: [],
- clickTrackUrlShow: false,
- clickTrackUrlShowType: '1',
- optionsTag: [],
- creativeTagVisible: false,
- visibleVideo: false,
- videoUrlShow: '',
- sumContent: 0,
- titleVisible: false,
- options: [],
- value: '',
- title: [],
- cunTitleVisible: false,
- cunTitleList: [],
- createCount: 0,
- tongbuLoading: false,
- }
- },
- computed: {
- count() {
- return moment().startOf('day')
- },
- },
- filters: {
- getDate(value) {
- let date = new Date(value)
- let y = date.getFullYear()
- let MM = date.getMonth() + 1
- MM = MM < 10 ? '0' + MM : MM
- let d = date.getDate()
- d = d < 10 ? '0' + d : d
- return y + '-' + MM + '-' + d
- },
- platform(str) {
- var data = {
- 1: 'Android应用下载',
- 2: 'Android网页游戏',
- 3: 'iOS应用下载',
- 4: 'iOS网页游戏',
- }
- return data[str]
- },
- },
- methods: {
- tongbu() {
- this.tongbuLoading = true
- getAction('/kuaishou/batch/syncVideo', {
- accountId: localStorage.getItem('campaignAccountId'),
- }).then((res) => {
- if (res.success) {
- this.$message.success(res.message)
- this.tongbuLoading = false
- var params = {}
- params.accountId = localStorage.getItem('campaignAccountId')
- params.materialType = this.creativeMaterialType
- params.pageSize = this.ipagination.pageSize
- params.pageNo = 1
- params.status = 0
- params.channelType = this.channelType
- params.orderBy = this.orderBy
- if (this.time.length > 0) {
- // params.startDate = moment(this.time[0]).format('YYYY-MM-DD')
- // params.endDate = moment(this.time[1]).format('YYYY-MM-DD')
- params.startDate = moment(this.time[0]).format('YYYY-MM-DD') + ' 00:00:00'
- params.endDate = moment(this.time[1]).format('YYYY-MM-DD') + ' 23:59:59'
- }
- this.showVideoList('/kuaishou/kuaiShouVideoGet/getVideoList', params)
- } else {
- this.$message.error(res.message)
- this.tongbuLoading = false
- }
- })
- },
- removeTitleCun(item) {
- deleteAction('/kuaishou/kuaiShouTitleCollection/delete', {
- id: item.id,
- }).then((res) => {
- if (res.success) {
- this.getCunTitle()
- }
- })
- },
- okTitleCun(item) {
- this.allForm.description = item.title
- this.form.setFieldsValue({
- description: item.title,
- })
- this.cunTitleVisible = false
- this.cunTitleList = []
- },
- cunTitle() {
- if (this.getData('description') && this.getData('description') == '') {
- this.$message.error('请填写广告语后再进行收藏')
- } else {
- var params = {}
- params.accountId = localStorage.getItem('campaignAccountId')
- params.userId = this.userInfo().id
- params.title = this.getData('description')
- postAction('/kuaishou/kuaiShouTitleCollection/add', params).then((res) => {
- if (res.success) {
- this.$message.success('收藏成功')
- } else {
- this.$message.error(res.message)
- }
- })
- }
- },
- showCunTitle() {
- this.cunTitleVisible = true
- this.getCunTitle()
- },
- getCunTitle() {
- var params = {}
- params.accountId = localStorage.getItem('campaignAccountId')
- params.userId = this.userInfo().id
- params.pageNo = 1
- params.pageSize = 500
- getAction('/kuaishou/kuaiShouTitleCollection/list', params).then((res) => {
- if (res.success) {
- this.cunTitleList = res.result.records
- }
- })
- },
- okTitle(item) {
- this.allForm.description = item
- this.$nextTick(() => {
- this.form.setFieldsValue({
- description: item,
- })
- })
- this.titleVisible = false
- this.dataOne = []
- this.value = ''
- this.title = []
- },
- searchQuery() {
- // /ctop/creativeTitle/titleSuggestion
- getAction('/ctop/creativeTitle/titleSearch', {
- firstCategory: this.dataOne[0],
- secondCategory: this.dataOne[1],
- keywords: this.value,
- }).then((res) => {
- console.log(res)
- this.title = res.result ? res.result : []
- })
- // firstCategory,secondCategory,keywords
- },
- onChangeTitle(value, selectedOptions) {
- this.dataOne = value
- this.value = ''
- this.title = []
- },
- filter(inputValue, path) {
- return path.some((option) => option.label.toLowerCase().indexOf(inputValue.toLowerCase()) > -1)
- },
- showTitle() {
- this.titleVisible = true
- this.getHangye()
- },
- getHangye() {
- getAction('/ctop/creativeTitle/getTitleLabel', '').then((res) => {
- if (res.success) {
- this.options = res.result.map((item) => {
- return {
- label: item.label,
- value: item.value,
- children:
- item.children.length > 0
- ? [
- {
- label: '不限',
- value: 0,
- },
- ].concat(item.children)
- : [
- {
- label: '不限',
- value: 0,
- },
- ],
- }
- })
- this.options = [
- {
- label: '不限',
- value: 0,
- },
- ].concat(this.options)
- if (this.dataOne.length > 0) {
- return
- } else {
- this.dataOne = [0]
- }
- }
- })
- },
- matemalVideo(item) {
- this.visibleVideo = true
- this.videoUrlShow = item.url
- },
- showCunTag(type) {
- this.creativeTagVisible = true
- var params = {}
- params.accountId = localStorage.getItem('campaignAccountId')
- params.userId = this.userInfo().id
- params.pageSize = 1000
- params.pageNo = 1
- getAction('/tag/kuaiShouCreativeTagCollection/list', params).then((res) => {
- if (res.success) {
- // console.log(res.result)
- this.optionsTag = res.result.records.map((item) => {
- return {
- id: item.id,
- label: item.tagName,
- children: JSON.parse(item.tagArray).map((item) => {
- return {
- id: item,
- label: item,
- disabled: true,
- }
- }),
- }
- })
- }
- })
- },
- okTag() {
- var data = this.$refs.tree.getCheckedKeys()
- if (data.length > 1) {
- this.$message.error('只能选择一个选项')
- // this.$refs.tree.setCheckedKeys([]);
- } else {
- var params = {}
- params.accountId = localStorage.getItem('campaignAccountId')
- params.userId = this.userInfo().id
- params.pageSize = 1000
- params.pageNo = 1
- params.id = data[0]
- getAction('/tag/kuaiShouCreativeTagCollection/list', params).then((res) => {
- if (res.success) {
- // console.log(res.result)
- this.$nextTick(() => {
- this.form.setFieldsValue({
- creativeTag: JSON.parse(res.result.records[0].tagArray).map((item) => {
- return item
- }),
- })
- this.form.validateFields(['creativeTag'])
- })
- this.creativeTagVisible = false
- } else {
- this.$message.error('选择出错,请稍后选择或自行手填')
- }
- })
- }
- },
- getInfo() {
- if (this.tagName == '') {
- this.$message.error('请输入分类名称')
- return
- } else {
- let params = {}
- params.tagName = this.tagName
- // params.campaignBudget = this.campaignBudget
- params.tagArray = JSON.stringify(this.getData('creativeTag'))
- params.userId = this.userInfo().id
- params.accountId = localStorage.getItem('campaignAccountId')
- postAction('/tag/kuaiShouCreativeTagCollection/add', params).then((res) => {
- if (res.success) {
- this.$message.success('添加成功')
- this.tagName = ''
- } else {
- this.$message.error(res.message)
- }
- })
- }
- },
- onSearch(value) {
- var params = {}
- params.accountId = localStorage.getItem('campaignAccountId')
- params.userId = this.userInfo().id
- params.trackType = this.clickTrackUrlShowType
- params.pageNo = 1
- params.pageSize = 500
- params.trackName = value
- getAction('/kuaishou/kuaiShouTrackUrlCollection/list', params).then((res) => {
- if (res.success) {
- this.trackUrlList = res.result.records
- } else {
- this.$message.error(res.message)
- }
- })
- },
- okClickTrackUrl(item) {
- this.clickTrackUrlList = false
- if (this.clickTrackUrlShowType == '1') {
- this.form.setFieldsValue({
- clickTrackUrl: item.trackUrl,
- })
- } else {
- this.form.setFieldsValue({
- actionbarClickUrl: item.trackUrl,
- })
- }
- },
- removeClickTrackUrl(item) {
- deleteAction('/kuaishou/kuaiShouTrackUrlCollection/delete', {
- id: item.id,
- }).then((res) => {
- if (res.success) {
- this.getClickTrackUrlList(this.clickTrackUrlShowType)
- }
- })
- },
- getClickTrackUrlList(type) {
- this.spinning = true
- this.clickTrackUrlList = true
- this.trackUrlList = []
- var params = {}
- params.accountId = localStorage.getItem('campaignAccountId')
- params.trackType = type
- params.userId = this.userInfo().id
- params.pageNo = 1
- params.pageSize = 500
- getAction('/kuaishou/kuaiShouTrackUrlCollection/list', params).then((res) => {
- if (res.success) {
- this.spinning = false
- this.trackUrlList = res.result.records
- } else {
- this.spinning = false
- this.$message.error(res.message)
- }
- })
- },
- ...mapGetters(['nickname', 'avatar', 'userInfo']),
- changeTrackUrlName() {
- var params = {}
- params.accountId = localStorage.getItem('campaignAccountId')
- params.userId = this.userInfo().id
- params.trackName = this.trackUrlName
- getAction('/kuaishou/kuaiShouTrackUrlCollection/checkTrackName', params).then((res) => {
- this.showTrackUrlNameElse = res.result
- })
- },
- clickTrackUrlOk() {
- var params = {}
- params.accountId = localStorage.getItem('campaignAccountId')
- params.userId = this.userInfo().id
- params.trackName = this.trackUrlName
- params.trackType = this.clickTrackUrlShowType
- params.trackUrl =
- this.clickTrackUrlShowType == '1' ? this.getData('clickTrackUrl') : this.getData('actionbarClickUrl')
- postAction('/kuaishou/kuaiShouTrackUrlCollection/add', params).then((res) => {
- if (res.success) {
- this.clickTrackUrlShow = false
- this.trackUrlName = ''
- this.$message.success('添加成功')
- } else {
- this.$message.error(res.message)
- }
- })
- },
- deleteData(index, item) {
- this.videoList.splice(index, 1)
- var deleteIndex = this.checkVideo.findIndex((c) => c == item.photoId)
- this.checkVideo.splice(deleteIndex, 1)
- for (let i = 0; i < this.checkVideoAll.length; i++) {
- for (let j = 0; j < this.checkVideoAll[i].length; j++) {
- if (this.checkVideoAll[i][j] == item.photoId) {
- this.checkVideoAll[i] = this.checkVideo
- }
- }
- }
- for (let i = 0; i < this.checkVideoWai.length; i++) {
- for (let j = 0; j < this.checkVideoWai[i].length; j++) {
- if (this.checkVideoWai[i][j] == item.photoId) {
- this.checkVideoWai[i] = this.checkVideo
- }
- }
- }
- this.sumContent = this.checkVideo.length
- // var deleteIndexAll = this.checkVideoAll.findIndex((c) => c == item.photoId)
- // this.checkVideoAll.splice(deleteIndexAll, 1)
- },
- setVideUrl(photoId) {
- this.videoList = []
- getAction('/batch/kuaiShouGroupTemplate/getUrlByPhotoId', { photoId: photoId }).then((res) => {
- if (res.success) {
- this.videoList.push({ url: res.result.url, photoId: photoId, coverUrl: res.result.coverUrl })
- } else {
- }
- })
- },
- changeData(data) {
- if (data.length > 1 && data.findIndex((item) => item == 1) == 0) {
- data.splice(
- data.findIndex((item) => item == 1),
- 1
- )
- } else if (data.length > 1 && data.findIndex((item) => item == 1) == data.length - 1) {
- data.splice(0, data.length - 1)
- } else if (data.length == 0) {
- data.push(1)
- }
- },
- selectAllVideo() {
- this.checkVideo = this.dataSource.map((item) => {
- return item.photoId
- })
- if (this.active == 0) {
- for (let i = 0; i < this.ipagination.current; i++) {
- this.checkVideoAll.push([])
- }
- this.checkVideoAll[this.ipagination.current - 1] = this.checkVideo
- } else if (this.active == 1) {
- for (let i = 0; i < this.ipagination.current; i++) {
- this.checkVideoWai.push([])
- }
- this.checkVideoWai[this.ipagination.current - 1] = this.checkVideo
- }
- var sum = 0
- for (let i = 0; i < this.checkVideoAll.length; i++) {
- sum += this.checkVideoAll[i].length
- }
- for (let i = 0; i < this.checkVideoWai.length; i++) {
- sum += this.checkVideoWai[i].length
- }
- this.sumContent = sum
- if (this.getData('createType') == '0') {
- if (sum > this.getData('createCount')) {
- this.$message.error('最多选择' + this.getData('createCount') + '个素材')
- this.checkVideo = []
- this.sumContent = this.sumContent - 5
- if (this.active == 0) {
- this.checkVideoAll[this.ipagination.current - 1] = this.checkVideo
- } else if (this.active == 1) {
- this.checkVideoWai[this.ipagination.current - 1] = this.checkVideo
- }
- }
- } else {
- if (sum > this.getData('createCount') * 15) {
- this.$message.error('最多选择' + this.getData('createCount') * 15 + '个素材')
- this.checkVideo = []
- this.sumContent = this.sumContent - 15
- if (this.active == 0) {
- this.checkVideoAll[this.ipagination.current - 1] = this.checkVideo
- } else if (this.active == 1) {
- this.checkVideoWai[this.ipagination.current - 1] = this.checkVideo
- }
- }
- }
- },
- setData(data) {
- if (this.active == 0) {
- for (let i = 0; i < this.ipagination.current; i++) {
- this.checkVideoAll.push([])
- }
- this.checkVideoAll[this.ipagination.current - 1] = data
- } else if (this.active == 1) {
- for (let i = 0; i < this.ipagination.current; i++) {
- this.checkVideoWai.push([])
- }
- this.checkVideoWai[this.ipagination.current - 1] = data
- }
- var sum = 0
- for (let i = 0; i < this.checkVideoAll.length; i++) {
- sum += this.checkVideoAll[i].length
- }
- for (let i = 0; i < this.checkVideoWai.length; i++) {
- sum += this.checkVideoWai[i].length
- }
- this.sumContent = sum
- if (this.getData('createType') == '0') {
- if (sum > this.getData('createCount')) {
- this.$message.error('最多选择' + this.getData('createCount') + '个素材')
- this.checkVideo.pop()
- this.sumContent--
- if (this.active == 0) {
- this.checkVideoAll[this.ipagination.current - 1] = this.checkVideo
- } else if (this.active == 1) {
- this.checkVideoWai[this.ipagination.current - 1] = this.checkVideo
- }
- }
- } else {
- if (sum > this.getData('createCount') * 15) {
- this.$message.error('最多选择' + this.getData('createCount') * 15 + '个素材')
- this.checkVideo.pop()
- this.sumContent--
- if (this.active == 0) {
- this.checkVideoAll[this.ipagination.current - 1] = this.checkVideo
- } else if (this.active == 1) {
- this.checkVideoWai[this.ipagination.current - 1] = this.checkVideo
- }
- }
- }
- },
- getVideoList() {
- this.orderBy = 'time'
- this.visibleMatemal = true
- if (this.checkVideo.length > 0) {
- } else {
- this.showVideo = false
- this.checkVideo = []
- }
- this.active = 0
- this.time = []
- this.channelType = 0
- this.creativeMaterialType = this.getData('creativeMaterialType')
- },
- getDataSource(page, pageSize) {
- if (this.active == 0) {
- this.checkVideo = this.checkVideoAll[page - 1]
- } else if (this.active == 1) {
- this.checkVideo = this.checkVideoWai[page - 1]
- }
- this.ipagination.current = page
- var params = {}
- params.accountId = localStorage.getItem('campaignAccountId')
- params.materialType = this.creativeMaterialType
- params.pageSize = this.ipagination.pageSize
- params.pageNo = page
- params.channelType = this.channelType
- params.status = 0
- params.orderBy = this.orderBy
- if (this.time.length > 0) {
- // params.startDate = moment(this.time[0]).format('YYYY-MM-DD')
- // params.endDate = moment(this.time[1]).format('YYYY-MM-DD')
- params.startDate = moment(this.time[0]).format('YYYY-MM-DD') + ' 00:00:00'
- params.endDate = moment(this.time[1]).format('YYYY-MM-DD') + ' 23:59:59'
- }
- this.showVideoList('/kuaishou/kuaiShouVideoGet/getVideoList', params)
- },
- cancelAll() {
- // this.checkVideoAll = []
- // this.checkVideoWei = []
- },
- handleOkShow() {
- // this.checkVideoAll = [...new Set(this.checkVideoAll)]
- var data = tqFun(this.checkVideoAll).concat(tqFun(this.checkVideoWai))
- this.checkVideo = data
- // console.log(this.checkVideoAll, this.checkVideo)
- for (let i = 0; i < this.checkVideo.length; i++) {
- this.setVideUrl(this.checkVideo[i])
- if (i == this.checkVideo.length - 1) {
- this.showVideo = true
- this.visibleMatemal = false
- }
- }
- },
- callback(key) {
- this.channelType = key
- this.checkVideo = []
- this.ipagination.current = 1
- this.time = []
- if (key == 0) {
- this.checkVideo = this.checkVideoAll[this.ipagination.current - 1]
- } else if (key == 1) {
- this.checkVideo = this.checkVideoWai[this.ipagination.current - 1]
- }
- },
- changeType() {
- this.$nextTick(() => {
- if (this.getData('creativeMaterialType') == '1') {
- this.form.setFieldsValue({
- name: '自定义创意_竖版视频',
- })
- } else {
- this.form.setFieldsValue({
- name: '自定义创意_横版视频',
- })
- }
- })
- },
- lookTemplate(accountId, templateId) {
- this.$refs.templateModal.handleOk(localStorage.getItem('campaignAccountId'), templateId, 'look')
- },
- addTemplate(accountId) {
- this.$refs.templateModal.create(localStorage.getItem('campaignAccountId'), 'add')
- },
- getTemplate(accountId) {
- var data = null
- if (accountId) {
- data = accountId
- } else {
- this.templateLoading = true
- data = localStorage.getItem('campaignAccountId')
- }
- getAction('/batch/kuaishouTemplate/getTemplateByAccountId', {
- accountId: data,
- }).then((res) => {
- if (res.success) {
- this.getTemplateList(data)
- }
- })
- },
- getTemplateList(accountId) {
- this.templateList = []
- getAction('/batch/kuaishouTemplate/list', {
- accountId: accountId,
- pageSize: 1000,
- pageNo: 1,
- }).then((res) => {
- if (res.success) {
- this.templateList = res.result.records.map((item, index) => {
- return {
- ...item,
- key: index,
- }
- })
- this.templateLoading = false
- } else {
- this.templateLoading = false
- }
- })
- },
- showConvert() {
- this.convertChange()
- if (this.campaignType == 2) {
- if (this.getData('appId')) {
- this.convert = true
- if (this.getPlatForm(this.getData('appId')) == 1 || this.getPlatForm(this.getData('appId')) == 2) {
- this.convertType = '3'
- } else {
- this.convertType = '7'
- }
- } else {
- this.$message.error('请选择应用')
- }
- } else {
- this.convert = true
- this.convertType = '1'
- }
- this.getConvertList()
- },
- convertChange() {
- this.convertId = ''
- },
- getConvertList() {
- var params = {}
- params.accountId = localStorage.getItem('campaignAccountId')
- params.type = this.convertType
- getAction('/kuaishou/batch/getConvertList', params).then((res) => {
- if (res.success) {
- this.convertList = res.result.map((item) => {
- return {
- ...item,
- convert_id: item.convert_id + '',
- }
- })
- }
- })
- },
- getCheck(e) {
- this.checkedTrue = e.target.checked
- },
- addGroup() {
- this.allForm.group.push({
- bidType: 10,
- // bid: '',
- // cpaBid: '',
- showTipCheck: false,
- deepConversionBidCheck: false,
- // unitName: '',
- unitNameCheck: false,
- deepConversionType: '',
- deepConversionBid: '',
- ocpxActionType: this.campaignType == '2' && this.allForm.groupTypeData.isActivate == '1' ? 180 : 2,
- })
- },
- 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 = ''
- this.form.setFieldsValue({
- bid: undefined,
- })
- this.form.setFieldsValue({
- cpaBid: undefined,
- })
- },
- removeGroup(index) {
- this.allForm.group.splice(index, 1)
- },
- deep_conversion_bidTip(index) {
- if (
- this.allForm.group[index].deepConversionBid < this.getData('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('campaignList'),
- unitName: e.target.value,
- }).then((res) => {
- if (res.success) {
- this.allForm.group[index].unitNameCheck = !res.result
- } else {
- this.allForm.group[index].unitNameCheck = false
- }
- })
- }
- },
- showTip(index) {
- if (this.allForm.group[index].bidType == 1) {
- if (this.getData('bid') < 0.2 || this.getData('bid') > this.maxBid) {
- this.allForm.group[index].showTipCheck = true
- } else {
- this.allForm.group[index].showTipCheck = false
- }
- } else {
- if (this.getData('cpaBid') < 1 || this.getData('cpaBid') > this.maxBid) {
- this.allForm.group[index].showTipCheck = true
- } else {
- this.allForm.group[index].showTipCheck = false
- }
- }
- },
- getScheduleTime(item) {
- this.allForm.scheduleTimeData = item
- },
- setTime(e) {
- if (e.target.value == '2') {
- this.timeRange[0] = moment().startOf('day')
- this.timeRange[1] = moment().add(1, 'months')
- }
- },
- setTimeAll(e) {
- if (e.target.value == '2') {
- this.$nextTick(() => {
- this.$refs.selectCheck.init()
- })
- } else {
- }
- },
- getData(className) {
- return this.form.getFieldValue(className)
- },
- bidCheck(rule, value, callback) {
- if (value < 0.2 || value > this.maxBid) {
- callback('不得低于0.2元,不得高于项目最高出价' + this.maxBid + '元')
- } else {
- callback()
- }
- },
- cpaBidCheck(rule, value, callback) {
- if (value < 1 || value > this.maxBid) {
- callback('不得低于1元,不得高于项目最高出价' + this.maxBid + '元')
- } else {
- callback()
- }
- },
- handleConfirmValue(rule, value, callback) {
- if (value != '' && value != undefined) {
- getAction('/kuaishou/batch/checkUnitName', {
- campaignId: localStorage.getItem('campaignList'),
- unitName: value + '_0',
- }).then((res) => {
- if (res.success) {
- if (!res.result) {
- callback('广告组名称重复')
- } else {
- callback()
- }
- } else {
- callback()
- }
- })
- } else {
- callback()
- }
- },
- 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.tongbuLoading = true
- // this.$refs.application.showApplication()
- getAction('/kuaishou/batch/syncAppList', {
- accountId: localStorage.getItem('campaignAccountId'),
- }).then((res) => {
- if (res.success) {
- this.tongbuLoading = false
- this.$message.success(res.message)
- this.getAppList()
- } else {
- this.tongbuLoading = false
- this.$message.error(res.message)
- }
- })
- },
- handleOk() {
- var that = this
- this.$bus.$emit('remove', '/creat/creatUnit')
- this.$router.replace({
- path: '/batchCreation/campaignList',
- })
- },
- handleCancel(e) {
- this.visible = false
- },
- handleSubmit(e) {
- e.preventDefault()
- if (
- this.checkVideo.length <
- (this.getData('createType') == '0' ? this.getData('createCount') : this.getData('createCount') * 15)
- ) {
- // this.$message.error('选择的素材不能小于创建条数')
- this.getData('createType') == '0'
- ? this.$message.error('选择的素材不能小于创建条数')
- : this.$message.error('选择的素材不能小于创建条数*15')
- } else {
- this.form.validateFieldsAndScroll((err, values) => {
- if (!err) {
- this.loading = true
- var groupArr = this.allForm.group.map((item) => {
- return {
- ...item,
- deepConversionBid: item.deepConversionBid != '' ? item.deepConversionBid * 1000 : '',
- ocpxActionType: item.ocpxActionType,
- bidType: item.bidType == 1 ? 2 : 10,
- }
- })
- var json = {
- ...values,
- cpaBid: values.cpaBid && values.cpaBid != '' ? values.cpaBid * 1000 : null,
- bid: values.bid && values.bid != '' ? values.bid * 1000 : null,
- convertId: this.convertId ? this.convertId.key : null,
- dayBudget: values.dayBudget * 1000,
- photoArr: this.checkVideo,
- creativeCategory: values.creativeCategory
- ? values.creativeCategory[values.creativeCategory.length - 1]
- : null,
- unitType: '4',
- }
- var params = {
- userId: this.userInfo().id,
- ...json,
- ...groupArr[0],
- accountId: localStorage.getItem('campaignAccountId'),
- campaignId: localStorage.getItem('campaignList'),
- beginTime: moment(this.timeRange[0]).format('YYYY-MM-DD'),
- endTime: this.allForm.time == '2' ? moment(this.timeRange[1]).format('YYYY-MM-DD') : '',
- appStore: values.useAppMarket == true ? this.allForm.appStore : null,
- useAppMarket: values.useAppMarket ? 1 : 0,
- sceneId: this.allForm.allianceAccount == '1' ? this.allForm.sceneId : [5],
- scheduleTime:
- this.allForm.scheduleTime == '2'
- ? this.allForm.scheduleTimeData
- : '000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000',
- }
- postAction('/batch/kuaiShouGroupTemplate/submitUnitTask', params).then((res) => {
- this.loading = false
- if (res.success) {
- this.visible = true
- this.allForm.fail = res.result.code
- this.allForm.success = res.result.size
- } else {
- this.$message.error(res.message)
- }
- })
- }
- })
- }
- },
- onChange(value) {
- // console.log(value)
- },
- handleChange(value) {
- // this.$refs.population.getAppList(value)
- this.getSiteList(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')
- },
- getPageSize(data) {
- if (data.target.value == '0') {
- this.ipagination.pageSize = 5
- } else if (data.target.value == '1') {
- this.ipagination.pageSize = 15
- }
- this.videoList = []
- this.checkVideo = []
- this.checkVideoAll = []
- this.checkVideoWai = []
- this.sumContent = 0
- },
- filterOption(input, option) {
- return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
- },
- prevStep() {
- this.$emit('prevStep', this.campaignId ? this.campaignId : localStorage.getItem('campaignList'))
- },
- getMould() {
- let params = {}
- params.accountId = localStorage.getItem('campaignAccountId')
- 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('campaignAccountId')
- 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('campaignAccountId')
- params.campaignId = this.campaignId ? this.campaignId : localStorage.getItem('campaignList')
- getAction('/kuaishou/batch/getCampaignList', params).then((res) => {
- if (res.success) {
- this.campaignType = res.result.records[0].campaignType
- // console.log(this.campaignType)
- }
- })
- },
- getData(className) {
- return this.form.getFieldValue(className)
- },
- showVideoList(url, params) {
- this.dataSource = []
- this.loadingVideoList = true
- getAction(url, params).then((res) => {
- // console.log(res)
- if (res.success) {
- this.dataSource = res.result.list
- this.ipagination.total = res.result.total
- this.loadingVideoList = false
- } else {
- this.loadingVideoList = false
- }
- })
- },
- getSiteList(appId) {
- getAction('/kuaishou/batch/getPageList', {
- accountId: localStorage.getItem('campaignAccountId'),
- appId: appId,
- viewComp: 7,
- }).then((res) => {
- if (res.success) {
- this.siteList = res.result
- if (this.siteList.length > 0) {
- this.showSite = true
- }
- } else {
- this.showSite = false
- }
- })
- },
- },
- watch: {
- timeSeries(val) {
- // console.log(val)
- },
- checkVideo(n, o) {},
- checkVideoAll(n, o) {
- // this.checkVideoAll = [...new Set(n)]
- // console.log(n,o)
- // this.checkVideo = [...new Set(n)]
- },
- time(n, o) {
- if (n.length > 0) {
- var params = {}
- params.accountId = localStorage.getItem('campaignAccountId')
- params.materialType = this.creativeMaterialType
- params.pageSize = this.ipagination.pageSize
- params.pageNo = 1
- params.status = 0
- params.channelType = this.channelType
- params.startDate = moment(n[0]).format('YYYY-MM-DD') + ' 00:00:00'
- params.endDate = moment(n[1]).format('YYYY-MM-DD') + ' 23:59:59'
- params.orderBy = this.orderBy
- this.showVideoList('/kuaishou/kuaiShouVideoGet/getVideoList', params)
- } else {
- var params = {}
- params.accountId = localStorage.getItem('campaignAccountId')
- params.materialType = this.creativeMaterialType
- params.pageSize = this.ipagination.pageSize
- params.pageNo = 1
- params.status = 0
- params.channelType = this.channelType
- params.orderBy = this.orderBy
- this.ipagination.current = 1
- this.showVideoList('/kuaishou/kuaiShouVideoGet/getVideoList', params)
- }
- },
- },
- mounted: function () {
- this.step = localStorage.getItem('step')
- this.getTemplate(localStorage.getItem('campaignAccountId'))
- this.getAppList()
- // this.getCampaignList()
- this.campaignType = localStorage.getItem('campaignType')
- this.getMould()
- getAction('/kuaishou/batch/getIsActivate', {
- accountId: localStorage.getItem('campaignAccountId'),
- }).then((res) => {
- if (res.success) {
- this.allForm.groupTypeData = res.result
- this.addGroup()
- }
- })
- getAction('/kuaishou/batch/getWhiteList', {
- accountId: localStorage.getItem('campaignAccountId'),
- }).then((res) => {
- if (res.success) {
- // console.log(res)
- if (res.result) {
- this.creativeCategorySwitch = res.result.creative_category_switch == 1 ? true : false
- this.allianceAccount = res.result.alliance_account == 1 ? true : false
- this.actionbarClickUrlSwitch = res.result.actionbar_click_url_switch == 1 ? true : false
- // if (res.result.alliance_account == 1) {
- // this.allianceAccount = true
- // } else {
- // this.allianceAccount = false
- // }
- } else {
- this.allianceAccount = false
- this.creativeCategorySwitch = false
- this.actionbarClickUrlSwitch = false
- }
- }
- })
- getAction('/kuaishou/batch/getProjectMaxBid', {
- accountId: localStorage.getItem('campaignAccountId'),
- }).then((res) => {
- if (res.success) {
- this.maxBid = res.result / 1000
- }
- })
- getAction('/kuaishou/batch/getActionBarTextByType', {
- type: localStorage.getItem('campaignType'),
- }).then((res) => {
- if (res.success) {
- this.actionBarTextList = res.result
- }
- })
- getAction('/kuaishou/batch/getCreativeCategory', {
- accountId: localStorage.getItem('campaignAccountId'),
- }).then((res) => {
- if (res.success) {
- // console.log(res)
- this.createOptions = res.result
- }
- })
- getAction('/batch/kuaiShouGroupTemplate/getApiCreateCount', {
- accountId: localStorage.getItem('campaignAccountId'),
- }).then((res) => {
- this.createCount = res.result
- })
- },
- }
- </script>
- <style type="text/css" scoped lang="scss">
- .width-video {
- width: calc(20% - 10px);
- margin-right: 10px;
- margin-bottom: 10px;
- }
- .chouzhen {
- border-style: solid;
- border-width: 1px;
- border-color: #e4e4e4;
- width: calc(20% - 10px);
- padding: 10px;
- margin-right: 10px;
- margin-bottom: 10px;
- display: flex;
- align-items: center;
- background: #fff;
- position: relative;
- z-index: 99;
- float: left;
- }
- li.chouzhen.first:before {
- font-size: 12px;
- content: '首帧';
- position: absolute;
- top: 7px;
- left: 5px;
- width: 36px;
- height: 20px;
- color: rgb(255, 255, 255);
- line-height: 20px;
- text-align: center;
- background: rgba(0, 0, 0, 0.5);
- border-radius: 2px;
- z-index: 1000;
- }
- .actor-photo-list {
- display: flex;
- padding-left: 0;
- li {
- width: 25%;
- margin: 10px;
- position: relative;
- height: 250px;
- border: 1px solid #f2f2f2;
- list-style: none;
- img,
- video {
- width: 100%;
- margin-top: auto;
- margin-bottom: auto;
- top: 0;
- bottom: 0;
- position: absolute;
- max-height: 250px;
- }
- }
- }
- .plug-timer-grid {
- width: 100%;
- }
- .plug-timer-grid td,
- .plug-timer-grid th {
- border: 1px solid #97b4d1;
- text-align: center;
- /*cursor:pointer;*/
- font-size: 10px;
- line-height: 10px;
- }
- .Selected {
- background-color: rgb(102, 162, 243);
- opacity: 0.5;
- }
- .plug-timer-grid {
- border-collapse: collapse;
- z-index: 4;
- }
- .plug-timer-grid thead tr {
- display: table-row;
- vertical-align: inherit;
- border-color: inherit;
- }
- .group-creat table td {
- height: 20px;
- max-width: 5px;
- font-size: 12px;
- text-align: center;
- vertical-align: middle;
- overflow: hidden;
- transition: background 0.5s;
- -webkit-transition: background 0.5s;
- }
- .plug-timer-grid tbody th {
- width: 4%;
- }
- .plug-timer-grid tbody tr td {
- width: 2%;
- }
- /*.clear{*/
- /* margin:20px 0px 20px 0px;*/
- /*}*/
- </style>
|