123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073207420752076207720782079208020812082208320842085208620872088208920902091209220932094209520962097209820992100210121022103210421052106210721082109211021112112211321142115211621172118211921202121212221232124212521262127212821292130213121322133213421352136213721382139214021412142214321442145214621472148214921502151215221532154215521562157215821592160216121622163216421652166216721682169217021712172217321742175217621772178217921802181218221832184218521862187218821892190219121922193219421952196219721982199220022012202220322042205220622072208220922102211221222132214221522162217221822192220222122222223222422252226222722282229223022312232223322342235223622372238223922402241224222432244224522462247224822492250225122522253225422552256225722582259226022612262226322642265226622672268226922702271227222732274227522762277227822792280228122822283228422852286228722882289229022912292229322942295229622972298229923002301230223032304230523062307230823092310231123122313231423152316231723182319232023212322232323242325232623272328232923302331233223332334233523362337233823392340234123422343234423452346234723482349235023512352235323542355235623572358235923602361236223632364236523662367236823692370237123722373237423752376237723782379238023812382238323842385238623872388238923902391239223932394239523962397239823992400240124022403240424052406240724082409241024112412241324142415241624172418241924202421242224232424242524262427242824292430243124322433243424352436243724382439244024412442244324442445244624472448244924502451245224532454245524562457245824592460246124622463246424652466246724682469247024712472247324742475247624772478247924802481248224832484248524862487248824892490249124922493249424952496249724982499250025012502250325042505250625072508250925102511251225132514251525162517251825192520252125222523252425252526252725282529253025312532253325342535253625372538253925402541254225432544254525462547254825492550255125522553255425552556255725582559256025612562256325642565256625672568256925702571257225732574257525762577257825792580258125822583258425852586258725882589259025912592259325942595259625972598259926002601260226032604260526062607260826092610261126122613261426152616261726182619262026212622262326242625262626272628262926302631263226332634263526362637263826392640264126422643264426452646264726482649265026512652265326542655265626572658265926602661266226632664266526662667266826692670267126722673267426752676267726782679268026812682268326842685268626872688268926902691269226932694269526962697269826992700270127022703270427052706270727082709271027112712271327142715271627172718271927202721272227232724272527262727272827292730273127322733273427352736273727382739274027412742274327442745274627472748274927502751275227532754275527562757275827592760276127622763276427652766276727682769277027712772277327742775277627772778277927802781278227832784278527862787278827892790279127922793279427952796279727982799280028012802280328042805280628072808280928102811281228132814281528162817281828192820282128222823282428252826282728282829283028312832283328342835283628372838283928402841284228432844284528462847284828492850285128522853285428552856285728582859286028612862286328642865286628672868286928702871287228732874287528762877287828792880288128822883288428852886288728882889289028912892289328942895289628972898289929002901290229032904290529062907290829092910291129122913291429152916291729182919292029212922292329242925292629272928292929302931293229332934293529362937293829392940294129422943294429452946294729482949295029512952295329542955295629572958295929602961296229632964296529662967296829692970297129722973297429752976297729782979298029812982298329842985298629872988298929902991299229932994299529962997299829993000300130023003300430053006300730083009301030113012301330143015301630173018301930203021302230233024302530263027302830293030303130323033303430353036303730383039304030413042304330443045304630473048304930503051305230533054305530563057305830593060306130623063306430653066306730683069307030713072307330743075307630773078307930803081308230833084308530863087308830893090309130923093309430953096309730983099310031013102310331043105310631073108310931103111311231133114311531163117311831193120312131223123312431253126312731283129313031313132313331343135313631373138313931403141314231433144314531463147314831493150315131523153315431553156315731583159316031613162316331643165316631673168316931703171317231733174317531763177317831793180318131823183318431853186318731883189319031913192319331943195319631973198319932003201320232033204320532063207320832093210321132123213321432153216321732183219322032213222322332243225322632273228322932303231323232333234323532363237323832393240324132423243324432453246324732483249325032513252325332543255325632573258325932603261326232633264326532663267326832693270327132723273327432753276327732783279328032813282328332843285328632873288328932903291329232933294329532963297329832993300330133023303330433053306330733083309331033113312331333143315331633173318331933203321332233233324332533263327332833293330333133323333333433353336333733383339334033413342334333443345334633473348334933503351335233533354335533563357335833593360336133623363336433653366336733683369337033713372337333743375337633773378337933803381338233833384338533863387338833893390339133923393339433953396339733983399340034013402340334043405340634073408340934103411341234133414341534163417341834193420342134223423342434253426342734283429343034313432343334343435343634373438343934403441344234433444344534463447344834493450345134523453345434553456345734583459346034613462346334643465346634673468346934703471347234733474347534763477347834793480348134823483348434853486348734883489349034913492349334943495349634973498349935003501350235033504350535063507350835093510351135123513351435153516351735183519352035213522352335243525352635273528352935303531353235333534353535363537353835393540354135423543354435453546354735483549355035513552355335543555355635573558355935603561356235633564356535663567356835693570357135723573357435753576357735783579358035813582358335843585358635873588358935903591359235933594359535963597359835993600360136023603360436053606360736083609361036113612361336143615361636173618361936203621362236233624362536263627362836293630363136323633363436353636363736383639364036413642364336443645364636473648364936503651365236533654365536563657365836593660366136623663366436653666366736683669367036713672367336743675367636773678367936803681368236833684368536863687368836893690369136923693369436953696369736983699370037013702370337043705370637073708370937103711371237133714371537163717371837193720372137223723372437253726372737283729373037313732373337343735373637373738373937403741374237433744374537463747374837493750375137523753375437553756375737583759376037613762376337643765376637673768376937703771377237733774377537763777377837793780378137823783378437853786378737883789379037913792379337943795379637973798379938003801380238033804380538063807380838093810381138123813381438153816381738183819382038213822382338243825382638273828382938303831383238333834383538363837383838393840384138423843384438453846384738483849385038513852385338543855385638573858385938603861386238633864386538663867386838693870387138723873387438753876387738783879388038813882388338843885388638873888388938903891389238933894389538963897389838993900390139023903390439053906390739083909391039113912391339143915391639173918391939203921392239233924392539263927392839293930393139323933393439353936393739383939394039413942394339443945394639473948394939503951395239533954395539563957395839593960396139623963396439653966396739683969397039713972397339743975397639773978397939803981398239833984398539863987398839893990399139923993399439953996399739983999400040014002400340044005400640074008400940104011401240134014401540164017401840194020402140224023402440254026402740284029403040314032403340344035403640374038403940404041404240434044404540464047404840494050405140524053405440554056405740584059406040614062406340644065406640674068406940704071407240734074407540764077407840794080408140824083408440854086408740884089409040914092409340944095409640974098409941004101410241034104410541064107410841094110411141124113411441154116411741184119412041214122412341244125412641274128412941304131413241334134413541364137413841394140414141424143414441454146414741484149415041514152415341544155415641574158415941604161416241634164416541664167416841694170417141724173417441754176417741784179418041814182418341844185418641874188418941904191419241934194419541964197419841994200420142024203420442054206420742084209421042114212421342144215421642174218421942204221422242234224422542264227422842294230423142324233423442354236423742384239424042414242424342444245424642474248424942504251425242534254425542564257425842594260426142624263426442654266426742684269427042714272427342744275427642774278427942804281428242834284428542864287428842894290429142924293429442954296429742984299430043014302430343044305430643074308430943104311431243134314431543164317431843194320432143224323432443254326432743284329433043314332433343344335433643374338433943404341434243434344434543464347434843494350435143524353435443554356435743584359436043614362436343644365436643674368436943704371437243734374437543764377437843794380438143824383438443854386438743884389439043914392439343944395439643974398439944004401440244034404440544064407440844094410441144124413441444154416441744184419442044214422442344244425442644274428 |
- <style scoped lang="scss">
- ::v-deep.vue-treeselect__control {
- line-height: 20px !important;
- }
- ::v-deep .table-page-search-wrapper .ant-form-item .ant-form-item-control {
- height: auto !important;
- line-height: 20px !important;
- }
- /deep/.display-none-selset {
- display: none !important;
- }
- .step-jump {
- /deep/ table tr td {
- border-bottom: 0px;
- }
- }
- .bottom-to-one {
- /deep/ .ant-form-item {
- margin-bottom: 0;
- }
- }
- .target-person-add-button {
- margin-left: 15px;
- }
- .card-person {
- width: 300px;
- /deep/.ant-card-body {
- padding: 0px;
- }
- /deep/.ant-card-head {
- padding: 0px 10px;
- }
- .card-main-case {
- height: 250px;
- overflow: auto;
- padding: 0 5px;
- }
- }
- .card-person-drawer {
- width: 100%;
- height: 90%;
- overflow: hidden;
- padding: 10px 0px;
- display: flex;
- flex-wrap: wrap;
- margin-right: -10px;
- justify-content: space-between;
- .card-item {
- width: calc(33% - 10px);
- margin-bottom: 10px;
- float: left;
- }
- .card-item-else {
- width: calc(20% - 10px);
- margin-bottom: 10px;
- float: left;
- }
- }
- .showShare {
- position: relative;
- }
- .share {
- display: none;
- }
- .showShare:hover .share {
- display: flex;
- justify-content: center;
- align-items: center;
- }
- .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;
- }
- .display-none-selset {
- display: none !important;
- }
- .logo {
- padding-left: 24px;
- img {
- height: 32px !important;
- }
- .name {
- font-size: 14px;
- font-family: PingFangSC-Medium, PingFang SC;
- font-weight: 500;
- color: #ced2d9;
- // line-height: 22px;
- margin-left: 20px;
- padding-left: 21px;
- position: relative;
- }
- .name::before {
- content: '';
- width: 1px;
- height: 18px;
- background: rgba(255, 255, 255, 0.31);
- position: absolute;
- left: 0;
- top: 50%;
- margin-top: -9px;
- }
- }
- .chartBox {
- margin-top: 80px;
- .chartBody {
- display: flex;
- justify-content: space-around;
- flex-wrap: wrap;
- }
- .search-box {
- margin-bottom: 20px;
- }
- }
- /deep/ .ant-descriptions-item-content {
- font-weight: bold;
- }
- .info-detail {
- /deep/ table tr td {
- border: 0;
- }
- /deep/ .ant-descriptions-item-label {
- color: darkgray;
- // min-width: 30px;
- white-space: nowrap;
- }
- }
- .flex-main {
- display: flex;
- margin-bottom: 10px;
- p {
- color: black;
- font-weight: 600;
- overflow: hidden; //超出的文本隐藏
- text-overflow: ellipsis; //溢出用省略号显示
- white-space: nowrap; //溢出不换行
- }
- }
- </style>
- <style lang="scss">
- .hide-checkbox .ant-table-thead .ant-table-selection {
- display: none;
- }
- .new-batch .ant-card-head-title {
- font-weight: 700;
- }
- // .new-batch textarea {
- // resize: none;
- // border: none;
- // outline: 0;
- // box-shadow: none;
- // }
- .create-info .ant-form-item {
- margin-bottom: 0 !important;
- }
- .fengmian .ant-checkbox-wrapper:first-child {
- margin-left: 8px;
- }
- @media screen and (max-width: 1200px) {
- // 这里写对应要修改的样式如:
- .new-batch .el-step__title {
- font-size: 12px;
- }
- }
- .line-height-one .ant-form-item-control {
- line-height: inherit;
- }
- .creat-all-info .ant-form-item-control {
- width: 60%;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- }
- .config-new-batch {
- .display-none-selset {
- display: none !important;
- }
- .ant-btn-danger {
- background-color: #ff4d4f !important;
- }
- }
- </style>
- <template>
- <div ref="questionnaireBox" class="new-batch config-new-batch">
- <a-layout-header
- class="ant-header-fixedHeader ant-header-side-opened"
- :style="{ padding: '0' }"
- style="background: #0b2040 !important; position: fixed; top: 0; z-index: 100; width: 100%"
- >
- <div :class="['top-nav-header-index', theme]">
- <div class="header-index-wide">
- <div class="header-index-left" :style="topMenuStyle.headerIndexLeft">
- <div class="logo">
- <img src="~@/assets/logoNew1.png" alt="logo" />
- <span class="name">有腾投放管家</span>
- </div>
- </div>
- </div>
- </div>
- </a-layout-header>
- <div class="chartBox" style="padding: 0 20px">
- <a-row :gutter="20">
- <a-col :sm="3" style="margin-bottom: 20px; z-index: 10; position: fixed">
- <a-card class="search-box" style="height: 90vh">
- <el-steps direction="vertical" finish-status="wait" space="50px" :active="activeStep">
- <el-step
- v-for="(item, index) in stepsArr"
- :key="index"
- :title="item.title"
- @click.native="jump(index)"
- >
- </el-step>
- </el-steps>
- </a-card>
- </a-col>
- <a-col :sm="21" :push="3" style="margin-bottom: 20px; z-index: 10" id="container">
- <a-card class="search-box step-jump" title="选择项目">
- <a-form layout="horizontal" v-bind="formItemLayout" :form="formProject">
- <a-row :gutter="16">
- <a-col :span="16" class=" table-page-search-wrapper">
- <a-form-item
- label="账户名称"
- :labelCol="formItemLayout.labelCol"
- class="require-check"
- >
- <selectTreeAccount
- v-decorator="[
- 'accountId',
- {
- rules: [{ required: true, message: '账户名称必选' }],
- initialValue: undefined
- }
- ]"
- style="display: inline-block;position: relative;margin-left: 0px;width:100%"
- :limit="1"
- :disabled="!!$route.query.id"
- />
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="营销目标">
- <a-radio-group
- button-style="solid"
- v-decorator="[
- 'campaignType',
- {
- rules: [{ required: true, message: '营销目标必选' }],
- initialValue: 2
- }
- ]"
- >
- <a-radio-button :value="2">提升应用安装</a-radio-button>
- <a-radio-button :value="5" disabled>收集销售线索</a-radio-button>
- <a-radio-button :value="7" disabled>提高应用活跃</a-radio-button>
- </a-radio-group>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="基础信息配置">
- <a-button type="primary" slot="extra" @click="formInfoShow">基础信息</a-button>
- </a-form-item>
- </a-col>
- </a-row>
- </a-form>
- </a-card>
- <a-card class="search-box step-jump" title="优化目标">
- <a-form layout="horizontal" v-bind="formItemLayout" :form="formOptimize">
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="优化目标">
- <a-radio-group
- v-decorator="['bidType', { initialValue: 10 }]"
- button-style="solid"
- >
- <a-radio-button :value="10">
- 转化数
- </a-radio-button>
- </a-radio-group>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="转化目标">
- <a-select
- style="width:300px"
- allowClear
- v-decorator="[
- 'ocpxActionType',
- { rules: [{ required: true, message: '转化目标必选' }] }
- ]"
- >
- <a-select-option :value="2">行为数</a-select-option>
- <a-select-option :value="180">激活</a-select-option>
- <a-select-option :value="53">表单提交</a-select-option>
- <a-select-option :value="394">订单提交</a-select-option>
- <a-select-option :value="348">使用有效线索</a-select-option>
- <a-select-option :value="383">授信出价</a-select-option>
- <a-select-option :value="384">完件出价</a-select-option>
- <a-select-option :value="190">付费出价</a-select-option>
- <a-select-option :value="191">首日ROI</a-select-option>
- <a-select-option :value="396">注册优化目标</a-select-option>
- <a-select-option :value="324">唤起应用</a-select-option>
- <a-select-option :value="715">微信复制优化目标</a-select-option>
- <a-select-option :value="716">多转化事件</a-select-option>
- <a-select-option :value="717">广告观看次数</a-select-option>
- <a-select-option :value="773">关键行为</a-select-option>
- </a-select>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="计费方式">
- <a-radio-group default-value="10" button-style="solid">
- <a-radio-button value="10">
- 按展示付费(oCPM)
- </a-radio-button>
- </a-radio-group>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="深度转化目标">
- <a-select
- style="width:300px"
- size="default"
- allowClear
- v-decorator="['deepConversionType']"
- >
- <a-select-option :value="3">
- 付费
- </a-select-option>
- <a-select-option :value="7">
- 次日留存
- </a-select-option>
- <a-select-option :value="10">
- 完件
- </a-select-option>
- <a-select-option :value="11">
- 授信
- </a-select-option>
- <a-select-option :value="13">
- 添加购物车
- </a-select-option>
- <a-select-option :value="14">
- 提交订单
- </a-select-option>
- <a-select-option :value="15">
- 购买
- </a-select-option>
- <a-select-option :value="44">
- 有效线索
- </a-select-option>
- <a-select-option :value="92">
- 付费roi
- </a-select-option>
- </a-select>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="转化目标出价">
- <a-input
- style="width:300px"
- v-decorator="[
- 'cpaBid',
- {
- rules: [
- { required: true, message: ' ' },
- { validator: cpaBidValid }
- ]
- }
- ]"
- >
- </a-input>
- <br />
- <span style="color:red"
- >单出价请输入单数字,阶梯出价请用/隔开 例如10/12,区间出价请用-链接
- 例如20-25</span
- >
- </a-form-item>
- </a-col>
- </a-row>
- <!-- { rules: [{ validator: deepBidValid }] } -->
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="深度转化出价">
- <a-input style="width:300px" v-decorator="['deepConversionBid']"> </a-input>
- <br />
- <span style="color:red"
- >单出价请输入单数字,阶梯出价请用/隔开 例如10/12,区间出价请用-链接
- 例如20-25</span
- >
- </a-form-item>
- </a-col>
- </a-row>
- </a-form>
- </a-card>
- <a-card class="search-box step-jump" title="目标应用">
- <a-button
- type="primary"
- slot="extra"
- @click="targetAppEdit"
- :disabled="!getFormData('formProject', 'accountId')"
- >编辑</a-button
- >
- <a-row :gutter="16" class="bottom-to-one">
- <a-col :span="16">
- <a-form-item label="" v-bind="tailFormItemLayout">
- <a-descriptions>
- <a-descriptions-item label="系统平台">
- {{
- appDetail && appDetail.platformOs
- ? appDetail.platformOs === 1
- ? 'Android'
- : 'IOS'
- : '-'
- }}
- </a-descriptions-item>
- <a-descriptions-item label="单/多应用">
- {{ multipleBidData.length > 1 ? '多应用' : '单应用' }}
- </a-descriptions-item>
- <a-descriptions-item label="应用数量">
- {{ multipleBidData.length }}
- </a-descriptions-item>
- <a-descriptions-item label="是否使用渠道号">
- {{ appDetail && appDetail.useChannel ? '是' : '否' }}
- </a-descriptions-item>
- <a-descriptions-item
- label="渠道号作用纬度"
- v-if="
- appDetail &&
- appDetail.useChannel &&
- channelData &&
- channelData.channel.usageLevel
- "
- >
- {{
- channelData.channel.usageLevel == 'account'
- ? '账户'
- : channelData.channel.usageLevel == 'plan'
- ? '计划'
- : '组'
- }}
- </a-descriptions-item>
- <a-descriptions-item
- label="是否使用单品"
- v-if="
- appDetail &&
- appDetail.useChannel &&
- channelData &&
- channelData.channel.isHaveItem
- "
- >
- {{ channelData.channel.isHaveItem == 1 ? '是' : '否' }}
- </a-descriptions-item>
- <a-descriptions-item label="调起链接">
- {{ appDetail && appDetail.schemaUri ? appDetail.schemaUri : '无' }}
- </a-descriptions-item>
- <a-descriptions-item label="转化跟踪" v-if="convertId && !convert">
- {{ convertId.label }}
- </a-descriptions-item>
- <a-descriptions-item label="优先从系统应用商店下载">
- {{ appDetail && appDetail.useAppMarket ? '是' : '否' }}
- </a-descriptions-item>
- </a-descriptions>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16" v-for="(item, index) in multipleBidData" :key="index">
- <a-col :span="16" v-if="!appDetail.useChannel">
- <a-form-item :label="'应用' + (index + 1)" v-bind="formItemLayout">
- <a-collapse expand-icon-position="right">
- <a-collapse-panel key="1" :header="item.appName">
- <a-descriptions>
- <a-descriptions-item label="应用标识" :span="3">
- {{ item.appVersion }}
- </a-descriptions-item>
- <a-descriptions-item label="第三方点击监测链接" :span="3">
- {{ !!item.tracUrl ? item.tracUrl : '-' }}
- </a-descriptions-item>
- <a-descriptions-item label="第三方actionBar监测链接" :span="3">
- {{ !!item.actionbarClickUrl ? item.actionbarClickUrl : '-' }}
- </a-descriptions-item>
- </a-descriptions>
- </a-collapse-panel>
- </a-collapse>
- </a-form-item>
- </a-col>
- <a-col :span="16" v-else>
- <a-form-item :label="'应用' + (index + 1)" v-bind="formItemLayout">
- <p style="width:100%;display: flex;justify-content: space-between;">
- {{ item.appName }}({{ item.appVersion }})
- <a @click="lookChannel(item.appName)">详情</a>
- </p>
- </a-form-item>
- </a-col>
- </a-row>
- </a-card>
- <a-card class="search-box step-jump">
- <span slot="title">
- 目标人群
- <a-tooltip>
- <template slot="title">
- 定向包支持多选
- 将根据人群包匹配情况进行随机匹配。若账户中无此人群包,则进行下一个定向包匹配。若此账户全部匹配不成功则不创建
- </template>
- <a-icon type="question-circle" />
- </a-tooltip>
- </span>
- <a-row :gutter="16">
- <a-col :span="16" style="width:100%; margin-left: -10%;">
- <a-form-item label="" v-bind="tailFormItemLayout">
- <div class="target-person-add">
- <span>已选定向包:{{ showCheckPerson.length }}</span>
- <a-button
- type="primary"
- class="target-person-add-button"
- @click="targetPersonCheck"
- :disabled="!getFormData('formProject', 'accountId')"
- >选择定向包 ></a-button
- >
- <a-tooltip>
- <template slot="title">
- 当编辑定向包时,需要重新选择定向包
- </template>
- <a-icon
- type="question-circle"
- v-if="$route.query.id"
- style="margin-left:20px"
- />
- </a-tooltip>
- </div>
- </a-form-item>
- <a-form-item label="" v-bind="tailFormItemLayout">
- <div
- class="card-person-drawer info-detail"
- style="justify-content: flex-start;max-height:500px;overflow:auto"
- >
- <a-card
- :title="item.targetName"
- class="card-person card-item-else"
- style="margin-right:10px"
- v-for="(item, index) in showCheckPerson"
- :key="index"
- >
- <div slot="extra">
- <a-popconfirm
- title="确定要删除这个定向吗?"
- ok-text="确定"
- cancel-text="取消"
- @confirm="removeVideoMaterial(index, item.id)"
- @cancel="cancel"
- >
- <a-icon type="delete" />
- </a-popconfirm>
- </div>
- <div class="card-main-case">
- <a-row style="margin-top:10px">
- <a-col :xl="24" :md="24" class="flex-main" v-if="item">
- <span class="ant-descriptions-item-label"> 人群:</span>
- <div v-if="item" style="word-break: break-all;">
- <span
- v-if="
- (!item.population && !item.excludePopulation) ||
- (item.population == '[]' &&
- item.excludePopulation == '[]')
- "
- >
- 不限
- </span>
- <span
- v-else-if="
- item.population &&
- (!item.excludePopulation ||
- item.excludePopulation == '[]')
- "
- >
- 定向人群:{{ JSON.parse(item.population).join() }}
- </span>
- <span
- v-else-if="
- item.excludePopulation &&
- (!item.population || item.population == '[]')
- "
- >
- 排除人群:{{
- JSON.parse(item.excludePopulation).join()
- }}
- </span>
- <span v-else>
- 定向人群:{{ JSON.parse(item.population).join() }}
- <br />
- 排除人群:{{
- JSON.parse(item.excludePopulation).join()
- }}
- </span>
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row style="margin-top:10px">
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 地区:</span>
- <div v-if="item">
- <span
- v-if="
- item.region == '' ||
- item.region == null ||
- JSON.parse(item.region).length == 0
- "
- >
- 不限
- </span>
- <div v-else>
- {{ item.regionName.join(',') }}
- </div>
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 年龄:</span>
- <div v-if="item">
- <span
- v-if="
- (item.agesRange == '[]' ||
- item.agesRange == null) &&
- (item.min == -1 || item.min == null) &&
- (item.max == -1 || item.max == null)
- "
- >
- 不限
- </span>
- <div v-else>
- <span
- v-if="
- item.agesRange == '[]' || item.agesRange == null
- "
- >
- {{ item.min + '岁~' + item.max + '岁' }}
- </span>
- <span v-else>
- <span
- v-for="(items, index) in JSON.parse(
- item.agesRange
- )"
- :key="index"
- >
- {{ items | kuaishouAge
- }}{{
- index ==
- JSON.parse(item.agesRange).length - 1
- ? ''
- : ','
- }}
- </span>
- </span>
- </div>
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 性别:</span>
- <div v-if="item">
- {{
- item.gender == 1
- ? '女'
- : item.gender == 2
- ? '男'
- : '不限'
- }}
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 最低版本:</span>
- <div v-if="item">
- {{
- item.platformOs == 1
- ? 'Android系统(' +
- (item.androidOsv == 3
- ? '不限)'
- : item.androidOsv + 'x+)')
- : item.platformOs == 2
- ? 'IOS系统(' +
- (item.iosOsv == 6 ? '不限)' : item.iosOsv + 'x+)')
- : '不限'
- }}
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 设备品牌:</span>
- <div v-if="item">
- <span
- v-if="
- item.deviceBrand == '' ||
- item.deviceBrand == null ||
- JSON.parse(item.deviceBrand).length == 0
- "
- >
- 不限
- </span>
- <span v-else>
- <span
- v-for="(items, index) in JSON.parse(
- item.deviceBrand
- )"
- :key="index"
- >
- {{ items | deviceBrand
- }}{{
- index == JSON.parse(item.deviceBrand).length - 1
- ? ''
- : ','
- }}
- </span>
- </span>
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 设备价格:</span>
- <div v-if="item">
- <span
- v-if="
- item.devicePrice == '' ||
- item.devicePrice == null ||
- JSON.parse(item.devicePrice).length == 0
- "
- >
- 不限
- </span>
- <span v-else>
- <span
- v-for="(items, index) in JSON.parse(
- item.devicePrice
- )"
- :key="index"
- >
- {{ items | kuaishouPrice
- }}{{
- index == JSON.parse(item.devicePrice).length - 1
- ? ''
- : ','
- }}
- </span>
- </span>
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 商业兴趣:</span>
- <div>
- <span
- v-if="
- item.businessInterest == '[]' ||
- item.businessInterest == null ||
- item.businessInterest == ''
- "
- >
- 不限
- </span>
- <div v-else>
- <span
- v-for="(items, index) in JSON.parse(
- item.businessInterest
- )"
- :key="index"
- >
- {{ items | business }}
- {{
- index ==
- JSON.parse(item.businessInterest).length - 1
- ? ''
- : ','
- }}
- </span>
- </div>
- </div>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 网红粉丝:</span>
- <span
- v-if="
- item.fansStar == '[]' ||
- item.fansStar == null ||
- item.fansStar == ''
- "
- >
- 不限
- </span>
- <div v-else>
- <span
- v-for="(items, index) in JSON.parse(item.fansStar)"
- :key="index"
- >
- {{ items | fansStarLabel }}
- {{
- index == JSON.parse(item.fansStar).length - 1
- ? ''
- : ','
- }}
- </span>
- </div>
- </a-col>
- </a-row>
- <a-row v-if="item.platformOs == 1">
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> APP行为:</span>
- <div v-if="item">
- <span
- v-if="
- (item.appIds == '[]' ||
- item.appIds == null ||
- item.appIds == '') &&
- (item.appInterest == '[]' ||
- item.appInterest == null ||
- item.appInterest == '')
- "
- >
- 不限
- </span>
- <div v-else>
- <span
- v-if="
- item.appIds == '[]' ||
- item.appIds == null ||
- item.appIds == ''
- "
- >
- <span
- v-for="(items, index) in JSON.parse(
- item.appInterest
- )"
- :key="index"
- >
- {{ items | optionsApp
- }}{{
- index ==
- JSON.parse(item.appInterest).length - 1
- ? ''
- : ','
- }}
- </span>
- </span>
- <span v-else>
- <span
- v-for="(items, index) in JSON.parse(
- item.appIds
- )"
- :key="index"
- >
- {{ items }}
- </span>
- </span>
- </div>
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 兴趣视频用户:</span>
- <div v-if="item">
- <span
- v-if="
- item.interestVideo == '[]' ||
- item.interestVideo == null ||
- item.interestVideo == ''
- "
- >
- 不限
- </span>
- <div v-else>
- <span
- v-for="(items, index) in JSON.parse(
- item.interestVideo
- )"
- :key="index"
- >
- {{ items | interestVideo
- }}{{
- index ==
- JSON.parse(item.interestVideo).length - 1
- ? ''
- : ','
- }}
- </span>
- </div>
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 网络环境:</span>
- <div v-if="item">
- {{
- item.network == 1
- ? 'Wi-Fi'
- : item.network == 2
- ? '移动网络'
- : '不限'
- }}
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label">
- 过滤已转换用户:</span
- >
- <div v-if="item">
- {{
- item.filterConvertedLevel | kuaishouFilterConvertedLevel
- }}
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 智能扩量:</span>
- <div v-if="item">
- {{ item.isOpen == 0 ? '关闭' : '开启' }}
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- </div>
- </a-card>
- </div>
- </a-form-item>
- </a-col>
- </a-row>
- </a-card>
- <a-card class="search-box step-jump" title="创意信息">
- <a-button
- type="primary"
- slot="extra"
- @click="originalityEdit"
- :disabled="!getFormData('formProject', 'accountId')"
- >编辑</a-button
- >
- <a-form-item v-bind="tailFormItemLayoutElse" style="margin-left:1.15%">
- <a-descriptions>
- <a-descriptions-item label="创意制作方式">
- <span v-if="showCreativeData">
- {{ showCreativeData.unitType | unitType }}
- </span>
- <span v-else>-</span>
- </a-descriptions-item>
- <a-descriptions-item label=" 广告位置">
- <span v-if="showCreativeData && showCreativeData.sceneId">
- <span v-for="(item, index) in showCreativeData.sceneId" :key="index">
- {{ item | kuaishouSceneId
- }}{{ index === showCreativeData.sceneId.length - 1 ? '' : ',' }}
- </span>
- </span>
- <span v-else>-</span>
- </a-descriptions-item>
- <a-descriptions-item label="关联封面数">
- <span v-if="showCreativeData && showCreativeData.imageCnt">
- {{ showCreativeData.imageCnt }}
- </span>
- <span v-else>-</span>
- </a-descriptions-item>
- <a-descriptions-item label="自定义计划数量/组数量">
- <span
- v-if="
- showCreativeData &&
- showCreativeData.customPlanCnt &&
- showCreativeData.customUnitCnt
- "
- >
- {{ showCreativeData.customPlanCnt + '/' + showCreativeData.customUnitCnt }}
- </span>
- <span v-else>-</span>
- </a-descriptions-item>
- <a-descriptions-item label="程序化计划数量/组数量">
- <span
- v-if="
- showCreativeData &&
- showCreativeData.programUnitCnt &&
- showCreativeData.programPlanCnt
- "
- >
- {{ showCreativeData.programPlanCnt + '/' + showCreativeData.programUnitCnt }}
- </span>
- <span v-else>-</span>
- </a-descriptions-item>
- <a-descriptions-item label="素材类型">
- <span v-if="showCreativeData">
- {{ showCreativeData.channelType | channelType }}
- </span>
- <span v-else>-</span>
- </a-descriptions-item>
- <a-descriptions-item label="素材挖掘">
- <span v-if="showCreativeData">
- {{ showCreativeData.assetMining === 0 ? '关闭' : '开启' }}
- </span>
- <span v-else>-</span>
- </a-descriptions-item>
- <a-descriptions-item label="智能抽帧">
- <span v-if="showCreativeData">
- {{ showCreativeData.smartCover === 0 ? '关闭' : '开启' }}
- </span>
- <span v-else>-</span>
- </a-descriptions-item>
- <a-descriptions-item label="素材选取">
- <span v-if="showCreativeData">
- 不限
- </span>
- <span v-else>-</span>
- </a-descriptions-item>
- <a-descriptions-item label="创意分类">
- <span v-if="showCreativeData && showCreativeData.creativeCategory">
- <a-cascader
- :options="createOptions"
- v-model="showCreativeData.creativeCategory"
- disabled
- :fieldNames="fieldNames"
- placeholder="请选择创意分类"
- />
- </span>
- <span v-else>-</span>
- </a-descriptions-item>
- <a-descriptions-item label="行动号召">
- <span v-if="showCreativeData && showCreativeData.actionBarText">
- {{ showCreativeData.actionBarText.join() }}
- </span>
- <span v-else>-</span>
- </a-descriptions-item>
- <a-descriptions-item label="创意标签">
- <span v-if="showCreativeData && showCreativeData.creativeTag">
- {{ showCreativeData.creativeTag.join() }}
- </span>
- <span v-else>-</span>
- </a-descriptions-item>
- <a-descriptions-item label="广告语" :span="3">
- <span v-if="showCreativeData">
- <span v-for="(item, index) in descriptionList" :key="index">
- {{ item.value }}{{ index === descriptionList.length - 1 ? '' : ';' }}
- </span>
- </span>
- <span v-else>-</span>
- </a-descriptions-item>
- </a-descriptions>
- </a-form-item>
- </a-card>
- <a-card class="search-box step-jump" title="素材信息">
- <a-form layout="horizontal" v-bind="formItemLayout" :form="formMaterial">
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item>
- <span slot="label">
- <a-tooltip>
- <template slot="title">
- 自动投放自动选取素材,在此处可限制选取素材逻辑。上新素材不可取消勾选,“高质量素材”“遗漏素材”“历史素材打捞”可随意组合使用
- </template>
- <a-icon type="question-circle" />
- </a-tooltip>
- 素材选取
- </span>
- <a-checkbox-group
- v-decorator="[
- 'sourceMaterial',
- {
- rules: [
- {
- required: true,
- message: '转化目标必选'
- }
- ],
- initialValue: [1]
- }
- ]"
- >
- <a-checkbox :value="1" disabled>
- 上新素材
- </a-checkbox>
- <a-checkbox :value="2">
- 高质量素材
- </a-checkbox>
- <a-checkbox :value="3">
- 遗漏素材
- </a-checkbox>
- <a-checkbox :value="4">
- 历史打捞
- </a-checkbox>
- </a-checkbox-group>
- </a-form-item>
- <a-form-item>
- <span slot="label">
- 素材匹配逻辑
- </span>
- <a-radio-group
- v-decorator="[
- 'matchType',
- {
- rules: [
- {
- required: true,
- message: '转化目标必选'
- }
- ],
- initialValue: 1
- }
- ]"
- >
- <a-radio :value="1">
- 定向匹配
- </a-radio>
- <a-radio :value="2">
- 素材匹配
- </a-radio>
- </a-radio-group>
- </a-form-item>
- <a-form-item>
- <span slot="label">
- 素材关键字
- </span>
- <a-textarea
- class="rending"
- placeholder="请输入素材关键字"
- v-decorator="[
- 'materialKeyword',
- {
- rules: [
- {
- required: true,
- message: '素材关键字必填'
- }
- ]
- }
- ]"
- :autosize="{ minRows: 2, maxRows: 6 }"
- ></a-textarea>
- </a-form-item>
- </a-col>
- </a-row>
- </a-form>
- </a-card>
- <div style="display: flex; justify-content: flex-end; margin-bottom: 100px">
- <div>
- <a-button
- type="primary"
- style="margin-right: 15px"
- @click="handleSubmit"
- :loading="sumbitLoading"
- :disabled="disabled"
- >
- 创建
- </a-button>
- <a-button @click="clearAllData"> 取消 </a-button>
- </div>
- </div>
- </a-col>
- </a-row>
- </div>
- <!-- 基本信息编辑 -->
- <a-drawer
- :width="800"
- :visible="formInformationVisible"
- :body-style="{ paddingBottom: '80px' }"
- @close="closeFormInfo"
- >
- <h2 slot="title" style="margin-bottom: 0">设置基本信息</h2>
- <a-form layout="horizontal" v-bind="formDrawerItemLayout" :form="formInformation">
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="计划命名规范">
- <a-input
- v-decorator="[
- 'campaignName',
- { rules: [{ required: true, message: '请填写计划的命名规则' }] }
- ]"
- allow-clear
- id="campaignName"
- />
- <a-tag color="#2db7f5" @click="getChangeAll('日期', 'formInformation', 'campaignName')"
- >+日期</a-tag
- >
- <!-- <a-tag
- color="#2db7f5"
- @click="getChangeAll('渠道号', 'formInformation', 'campaignName')"
- >+渠道号</a-tag
- >
- <a-tag
- color="#2db7f5"
- @click="getChangeAll('横竖版', 'formInformation', 'campaignName')"
- >+横竖版</a-tag
- > -->
- <a-tag color="#2db7f5" @click="getChangeAll('渠道号', 'formInformation', 'campaignName')"
- >+渠道号</a-tag
- >
- <a-tag
- color="#2db7f5"
- @click="getChangeAll('渠道号名称', 'formInformation', 'campaignName')"
- >+渠道号名称</a-tag
- >
- <a-tag color="#2db7f5" @click="getChangeAll('序号', 'formInformation', 'campaignName')"
- >+序号</a-tag
- >
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="计划单日预算">
- <a-radio-group v-model="budgetType" button-style="solid">
- <a-radio-button value="1">不限</a-radio-button>
- <a-radio-button value="2">统一预算</a-radio-button>
- </a-radio-group>
- <a-input-number
- v-if="budgetType === '2'"
- v-decorator="[
- 'campaignDayBudget',
- {
- rules: [
- {
- required: true,
- message: '不小于500, 不超过100000000,仅支持输入自然数'
- }
- ]
- }
- ]"
- :min="500"
- :precision="0"
- :max="100000000"
- style="width: 100%"
- placeholder="不小于500, 不超过100000000,仅支持输入自然数"
- />
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="组命名规范">
- <a-input
- v-decorator="[
- 'groupName',
- { rules: [{ required: true, message: '请填写组命名规范' }] }
- ]"
- allow-clear
- id="groupName"
- />
- <a-tag color="#2db7f5" @click="getChangeAll('日期', 'formInformation', 'groupName')"
- >+日期</a-tag
- >
- <a-tag color="#2db7f5" @click="getChangeAll('素材名称', 'formInformation', 'groupName')"
- >+素材名称</a-tag
- >
- <a-tag color="#2db7f5" @click="getChangeAll('应用名称', 'formInformation', 'groupName')"
- >+应用名称</a-tag
- >
- <a-tag color="#2db7f5" @click="getChangeAll('应用标记', 'formInformation', 'groupName')"
- >+应用标记</a-tag
- >
- <a-tag color="#2db7f5" @click="getChangeAll('创意制作方式', 'formInformation', 'groupName')"
- >+创意制作方式</a-tag
- >
- <a-tag color="#2db7f5" @click="getChangeAll('广告位置', 'formInformation', 'groupName')"
- >+广告位置</a-tag
- >
- <a-tag color="#2db7f5" @click="getChangeAll('渠道号', 'formInformation', 'groupName')"
- >+渠道号</a-tag
- >
- <a-tag color="#2db7f5" @click="getChangeAll('渠道号名称', 'formInformation', 'groupName')"
- >+渠道号名称</a-tag
- >
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="组单日预算">
- <a-radio-group v-model="dayBudgetType" button-style="solid">
- <a-radio-button value="1">不限</a-radio-button>
- <a-radio-button value="2">统一预算</a-radio-button>
- </a-radio-group>
- <a-input-number
- v-if="dayBudgetType === '2'"
- v-decorator="[
- 'unitDayBudget',
- {
- rules: [
- {
- required: true,
- message: '不小于500, 不超过100000000,仅支持输入自然数'
- }
- ]
- }
- ]"
- style="width: 100%"
- placeholder="不小于500, 不超过100000000,仅支持输入自然数"
- :min="500"
- :precision="0"
- />
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="广告组状态">
- <a-radio-group
- v-decorator="[
- 'unitStatus',
- {
- rules: [
- {
- required: true,
- message: '不小于500, 不超过100000000,仅支持输入自然数'
- }
- ],
- initialValue: '1'
- }
- ]"
- button-style="solid"
- >
- <a-radio-button value="1">投放</a-radio-button>
- <a-radio-button value="2">暂停</a-radio-button>
- </a-radio-group>
- </a-form-item>
- </a-col>
- </a-row>
- </a-form>
- <div
- :style="{
- position: 'absolute',
- right: 0,
- bottom: 0,
- width: '100%',
- borderTop: '1px solid #e9e9e9',
- padding: '10px 16px',
- background: '#fff',
- textAlign: 'right',
- zIndex: 1
- }"
- >
- <a-button :style="{ marginRight: '8px' }" @click="closeFormInfo"> 取消 </a-button>
- <a-button type="primary" @click="submitFormInfo"> 提交 </a-button>
- </div>
- </a-drawer>
- <!-- 目标应用编辑 -->
- <a-drawer :width="800" :visible="targetAppVisible" :body-style="{ paddingBottom: '80px' }" @close="closeUnit">
- <!-- @close="closeUnit('createForm')" -->
- <h2 slot="title" style="margin-bottom: 0">目标应用</h2>
- <!-- class="create-info" -->
- <a-form layout="horizontal" v-bind="formDrawerItemLayout" :form="formTargetApp">
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="系统平台">
- <a-radio-group
- v-decorator="['platformOs', { initialValue: 2 }]"
- button-style="solid"
- @change="changeType"
- >
- <!-- <a-radio-button :value="0">不限</a-radio-button> -->
- <a-radio-button :value="1">Android</a-radio-button>
- <a-radio-button :value="2">IOS</a-radio-button>
- </a-radio-group>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item>
- <span slot="label">
- <a-tooltip>
- <template slot="title">
- 单应用情况下 账户对应一个应用。多应用情况下 账户可对应多个应用
- </template>
- <a-icon type="question-circle" />
- </a-tooltip>
- 单/多应用
- </span>
- <a-radio-group v-decorator="['singleAppid', { initialValue: 1 }]" button-style="solid">
- <a-radio-button :value="1">单应用</a-radio-button>
- <a-radio-button :value="0">多应用</a-radio-button>
- </a-radio-group>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item>
- <span slot="label">
- <a-tooltip>
- <template slot="title">
- 调起链接需要加白使用 若多应用的情况下在创建时则一一匹配,若账户未加白
- 则不使用调起链接
- </template>
- <a-icon type="question-circle" />
- </a-tooltip>
- 调起链接
- </span>
- <a-switch default-checked v-model="uriCheck" />
- <span style="color:red"> 需加白使用</span>
- <div v-if="uriCheck">
- <a-input
- placeholder="请填写链接"
- v-decorator="['schemaUri', { rules: [{ message: '链接不能为空' }] }]"
- />
- </div>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="选择应用">
- <a-select
- v-decorator="['appId', { rules: [{ required: true, message: '请选择目标应用' }] }]"
- showSearch
- allowClear
- placeholder="选择应用目标"
- optionFilterProp="children"
- style="width: 500px"
- :filterOption="filterOption"
- @change="appIdChange"
- :mode="getFormData('formTargetApp', 'singleAppid') == 1 ? 'defalut' : 'multiple'"
- :maxTagCount="1"
- :labelInValue="true"
- >
- <a-select-option v-if="getFormData('formTargetApp', 'singleAppid') == 0" :value="0"
- >选择以下全部</a-select-option
- >
- <a-select-option
- v-for="appModel in appList"
- :key="appModel.appId"
- :value="appModel.appId"
- >
- {{ appModel.platform | platform }}   {{
- appModel.appName
- }}    {{ appModel.appVersion }}
- </a-select-option>
- </a-select>
- <!-- <a-button type="primary" @click="addApplication" :loading="tongbuLoading"
- >刷新应用</a-button
- > -->
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item>
- <span slot="label">
- <a-tooltip>
- <template slot="title">
- 渠道号开启后,会自动识别选中应用所绑定的监测链接、调起链接等,无需运营手动输入
- </template>
- <a-icon type="question-circle" />
- </a-tooltip>
- 使用渠道号
- </span>
- <a-switch default-checked v-model="useChannel" @change="changeChannel" />
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16" v-if="channelData && channelData.channel.isHaveItem">
- <a-col :span="16">
- <a-form-item>
- <span slot="label">
- 是否使用单品
- </span>
- <a-radio-group v-model="channelData.channel.isHaveItem" disabled>
- <a-radio-button :value="1">是</a-radio-button>
- <a-radio-button :value="0">否</a-radio-button>
- </a-radio-group>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16" v-if="channelData && channelData.channel.usageLevel">
- <a-col :span="16">
- <a-form-item>
- <span slot="label">
- 渠道号作用维度
- </span>
- <a-radio-group button-style="solid" v-model="channelData.channel.usageLevel" disabled>
- <a-radio-button value="account">账户</a-radio-button>
- <a-radio-button value="plan">计划</a-radio-button>
- <a-radio-button value="group">组</a-radio-button>
- </a-radio-group>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row
- :gutter="16"
- v-if="
- channelData && channelData.channel.usageLevel && channelData.list && channelData.list.length > 0
- "
- >
- <a-col :span="24">
- <a-form-item v-bind="tailFormDrawerItemLayout" style="margin-left:-12%">
- <a-collapse accordion ref="collapse">
- <template v-for="(item, index) in channelData.list">
- <a-collapse-panel
- :forceRender="true"
- :header="item.appName + '(应用标记)'"
- style="background: #f9f9fa;border-radius: 4px;margin-bottom:15px;overflow: hidden;border: 1px solid #d9d9d9;"
- >
- <a-form-item label="渠道号" v-bind="formItemLayout">
- {{ item.channelCode }}
- </a-form-item>
- <a-form-item label="素材关键字" v-bind="formItemLayout">
- {{ item.keyword }}
- </a-form-item>
- </a-collapse-panel>
- </template>
- </a-collapse>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="18">
- <a-form-item v-bind="formDrawerItemLayout">
- <a-table
- ref="table"
- size="middle"
- bordered
- :dataSource="multipleBidDataDrawer"
- :pagination="false"
- style="width:180%"
- :scroll="!useChannel ? { x: 1200 } : { x: true }"
- >
- <a-table-column
- key="appName"
- :width="!useChannel ? '10%' : true"
- data-index="appName"
- title="应用名称"
- align="center"
- />
- <a-table-column
- :width="!useChannel ? '10%' : true"
- key="appVersion"
- data-index="appVersion"
- title="应用标记"
- align="center"
- />
- <a-table-column
- v-if="!useChannel"
- width="20%"
- key="tracUrl"
- data-index="tracUrl"
- title="第三方点击监测链接"
- align="center"
- :ellipsis="true"
- >
- <template slot-scope="text, record">
- <editable-cell
- :text="text"
- @change="onCellChange(record.id, 'tracUrl', $event)"
- />
- </template>
- </a-table-column>
- <a-table-column
- v-if="!useChannel"
- width="20%"
- key="impressionUrl"
- data-index="impressionUrl"
- title="第三方开始播放监测链接"
- align="center"
- :ellipsis="true"
- >
- <template slot-scope="text, record">
- <editable-cell
- :text="text"
- @change="onCellChange(record.id, 'impressionUrl', $event)"
- />
- </template>
- </a-table-column>
- <a-table-column
- v-if="!useChannel"
- width="20%"
- key="actionbarClickUrl"
- data-index="actionbarClickUrl"
- title="第三方点击按钮监测链接"
- align="center"
- :ellipsis="true"
- >
- <template slot-scope="text, record">
- <editable-cell
- :text="text"
- @change="onCellChange(record.id, 'actionbarClickUrl', $event)"
- />
- </template>
- </a-table-column>
- <a-table-column
- v-if="!useChannel"
- width="20%"
- key="adPhotoPlayedT3sUrl"
- data-index="adPhotoPlayedT3sUrl"
- title="第三方有效播放监测链接"
- align="center"
- :ellipsis="true"
- >
- <template slot-scope="text, record">
- <editable-cell
- :text="text"
- @change="onCellChange(record.id, 'adPhotoPlayedT3sUrl', $event)"
- />
- </template>
- </a-table-column>
- <a-table-column
- v-if="useChannel"
- width="10%"
- key="action"
- data-index="action"
- title="操作"
- align="center"
- :ellipsis="true"
- >
- <template slot-scope="text, record">
- <a @click="lookChannel(record.appName)">详情</a>
- </template>
- </a-table-column>
- </a-table>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="转化跟踪">
- <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-col>
- </a-row>
- <a-row :gutter="16" v-if="getFormData('formTargetApp', 'platformOs') != 2">
- <a-col :span="16">
- <a-form-item v-bind="tailFormDrawerItemLayout">
- <a-checkbox
- v-decorator="[
- 'useAppMarket',
- {
- valuePropName: 'checked',
- initialValue: false
- }
- ]"
- >
- 优先从系统应用商店下载
- </a-checkbox>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row
- :gutter="16"
- v-if="
- getFormData('formTargetApp', 'platformOs') != 2 && getFormData('formTargetApp', 'useAppMarket')
- "
- >
- <a-col :span="24">
- <a-form-item v-bind="tailFormDrawerItemLayout" style="margin-left:-12%">
- 请勾选投放应用已上架的应用商店(默认全选)
- <a-checkbox-group
- v-decorator="[
- 'appStore',
- {
- initialValue: []
- }
- ]"
- >
- <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-col>
- </a-row>
- </a-form>
- <div
- :style="{
- position: 'absolute',
- right: 0,
- bottom: 0,
- width: '100%',
- borderTop: '1px solid #e9e9e9',
- padding: '10px 16px',
- background: '#fff',
- textAlign: 'right',
- zIndex: 1
- }"
- >
- <a-button :style="{ marginRight: '8px' }" @click="closeUnit"> 取消 </a-button>
- <a-button type="primary" @click="submitApp"> 提交 </a-button>
- </div>
- </a-drawer>
- <!-- 定向包选择 -->
- <a-drawer
- :width="800"
- :visible="targetPersonVisible"
- :body-style="{ paddingBottom: '80px' }"
- @close="closePerson"
- >
- <!-- @close="closeUnit('createForm')" -->
- <h2 slot="title" style="margin-bottom: 0">定向包选择</h2>
- <div style="display: flex;justify-content:space-between">
- <div>
- <a-input placeholder="输入定向包名称关键词" style="width:50%" v-model="searchTemplate" />
- <a-button
- type="primary"
- :style="{ marginRight: '8px', marginLeft: '8px' }"
- @click="getTargetPerson()"
- >
- 查询
- </a-button>
- <a-button
- @click="
- searchTemplate = null
- ipagination.current = 1
- checkPerson = checkPersonElse
- getTargetPerson()
- "
- >
- 重置
- </a-button>
- </div>
- <div style="display:flex">
- <div style="line-height: 32px;font-weight: 700;margin:0 20px;">已选择({{ sumContent }})</div>
- <a-button type="primary" @click="addNewTemplate">
- 新增定向包
- </a-button>
- </div>
- </div>
- <a-checkbox-group v-model="checkPerson" style="width: 100%;" @change="setVideoData">
- <div class="card-person-drawer info-detail">
- <a-card
- :title="item.targetName"
- class="card-person card-item"
- v-for="(item, index) in personList"
- :key="index"
- >
- <div slot="extra">
- <a-checkbox :value="item.id" @change="setData(item.id)"></a-checkbox>
- </div>
- <template slot="actions" class="ant-card-actions">
- <a-icon key="edit" type="edit" @click="editNewTemplate(item)" />
- <a-icon key="delete" type="delete" @click="deleteNewTemplate(item.id)" />
- </template>
- <div class="card-main-case">
- <a-row style="margin-top:10px">
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 人群:</span>
- <div v-if="item" style="word-break: break-all;">
- <span
- v-if="
- (!item.population && !item.excludePopulation) ||
- (item.population == '[]' && item.excludePopulation == '[]')
- "
- >
- 不限
- </span>
- <span
- v-else-if="
- item.population &&
- (!item.excludePopulation || item.excludePopulation == '[]')
- "
- >
- 定向人群:{{ JSON.parse(item.population).join() }}
- </span>
- <span
- v-else-if="
- item.excludePopulation && (!item.population || item.population == '[]')
- "
- >
- 排除人群:{{ JSON.parse(item.excludePopulation).join() }}
- </span>
- <span v-else>
- 定向人群:{{ JSON.parse(item.population).join() }} <br />排除人群:{{
- JSON.parse(item.excludePopulation).join()
- }}</span
- >
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row style="margin-top:10px">
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 地区:</span>
- <div v-if="item">
- <span
- v-if="
- item.region == '' ||
- item.region == null ||
- JSON.parse(item.region).length == 0
- "
- >
- 不限
- </span>
- <div v-else>
- {{ item.regionName.join(',') }}
- </div>
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 年龄:</span>
- <div v-if="item">
- <span
- v-if="
- (item.agesRange == '[]' || item.agesRange == null) &&
- (item.min == -1 || item.min == null) &&
- (item.max == -1 || item.max == null)
- "
- >
- 不限
- </span>
- <div v-else>
- <span v-if="item.agesRange == '[]' || item.agesRange == null">
- {{ item.min + '岁~' + item.max + '岁' }}
- </span>
- <span v-else>
- <span v-for="(items, index) in JSON.parse(item.agesRange)" :key="index">
- {{ items | kuaishouAge
- }}{{ index == JSON.parse(item.agesRange).length - 1 ? '' : ',' }}
- </span>
- </span>
- </div>
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 性别:</span>
- <div v-if="item">
- {{ item.gender == 1 ? '女' : item.gender == 2 ? '男' : '不限' }}
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 最低版本:</span>
- <div v-if="item">
- {{
- item.platformOs == 1
- ? 'Android系统(' +
- (item.androidOsv == 3 ? '不限)' : item.androidOsv + 'x+)')
- : item.platformOs == 2
- ? 'IOS系统(' + (item.iosOsv == 6 ? '不限)' : item.iosOsv + 'x+)')
- : '不限'
- }}
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 设备品牌:</span>
- <div v-if="item">
- <span
- v-if="
- item.deviceBrand == '' ||
- item.deviceBrand == null ||
- JSON.parse(item.deviceBrand).length == 0
- "
- >
- 不限
- </span>
- <span v-else>
- <span v-for="(items, index) in JSON.parse(item.deviceBrand)" :key="index">
- {{ items | deviceBrand
- }}{{ index == JSON.parse(item.deviceBrand).length - 1 ? '' : ',' }}
- </span>
- </span>
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 设备价格:</span>
- <div v-if="item">
- <span
- v-if="
- item.devicePrice == '' ||
- item.devicePrice == null ||
- JSON.parse(item.devicePrice).length == 0
- "
- >
- 不限
- </span>
- <span v-else>
- <span v-for="(items, index) in JSON.parse(item.devicePrice)" :key="index">
- {{ items | kuaishouPrice
- }}{{ index == JSON.parse(item.devicePrice).length - 1 ? '' : ',' }}
- </span>
- </span>
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 商业兴趣:</span>
- <div>
- <span
- v-if="
- item.businessInterest == '[]' ||
- item.businessInterest == null ||
- item.businessInterest == ''
- "
- >
- 不限
- </span>
- <div v-else>
- <span
- v-for="(items, index) in JSON.parse(item.businessInterest)"
- :key="index"
- >
- {{ items | business }}
- {{ index == JSON.parse(item.businessInterest).length - 1 ? '' : ',' }}
- </span>
- </div>
- </div>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 网红粉丝:</span>
- <span v-if="item.fansStar == '[]' || item.fansStar == null || item.fansStar == ''">
- 不限
- </span>
- <div v-else>
- <span v-for="(items, index) in JSON.parse(item.fansStar)" :key="index">
- {{ items | fansStarLabel }}
- {{ index == JSON.parse(item.fansStar).length - 1 ? '' : ',' }}
- </span>
- </div>
- </a-col>
- </a-row>
- <a-row v-if="item.platformOs == 1">
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> APP行为:</span>
- <div v-if="item">
- <span
- v-if="
- (item.appIds == '[]' || item.appIds == null || item.appIds == '') &&
- (item.appInterest == '[]' ||
- item.appInterest == null ||
- item.appInterest == '')
- "
- >
- 不限
- </span>
- <div v-else>
- <span
- v-if="item.appIds == '[]' || item.appIds == null || item.appIds == ''"
- >
- <span
- v-for="(items, index) in JSON.parse(item.appInterest)"
- :key="index"
- >
- {{ items | optionsApp
- }}{{ index == JSON.parse(item.appInterest).length - 1 ? '' : ',' }}
- </span>
- </span>
- <span v-else>
- <span v-for="(items, index) in JSON.parse(item.appIds)" :key="index">
- {{ items }}
- </span>
- </span>
- </div>
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 兴趣视频用户:</span>
- <div v-if="item">
- <span
- v-if="
- item.interestVideo == '[]' ||
- item.interestVideo == null ||
- item.interestVideo == ''
- "
- >
- 不限
- </span>
- <div v-else>
- <span v-for="(items, index) in JSON.parse(item.interestVideo)" :key="index">
- {{ items | interestVideo
- }}{{ index == JSON.parse(item.interestVideo).length - 1 ? '' : ',' }}
- </span>
- </div>
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 网络环境:</span>
- <div v-if="item">
- {{ item.network == 1 ? 'Wi-Fi' : item.network == 2 ? '移动网络' : '不限' }}
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 过滤已转换用户:</span>
- <div v-if="item">
- {{ item.filterConvertedLevel | kuaishouFilterConvertedLevel }}
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- <a-row>
- <a-col :xl="24" :md="24" class="flex-main">
- <span class="ant-descriptions-item-label"> 智能扩量:</span>
- <div v-if="item">
- {{ item.isOpen == 0 ? '关闭' : '开启' }}
- </div>
- <p title="-" v-else>-</p>
- </a-col>
- </a-row>
- </div>
- </a-card>
- </div>
- </a-checkbox-group>
- <a-pagination
- size="small"
- :showTotal="ipagination.showTotal"
- style="float: right"
- v-if="personList.length > 0"
- showQuickJumper
- :pageSize.sync="ipagination.pageSize"
- :total="ipagination.total"
- v-model="ipagination.current"
- @change="getDataSource"
- />
- <div
- :style="{
- position: 'absolute',
- right: 0,
- bottom: 0,
- width: '100%',
- borderTop: '1px solid #e9e9e9',
- padding: '10px 16px',
- background: '#fff',
- textAlign: 'right',
- zIndex: 1
- }"
- >
- <a-button :style="{ marginRight: '8px' }" @click="closePerson"> 取消 </a-button>
- <a-button type="primary" @click="submitPerson" :loading="personLoading"> 提交 </a-button>
- </div>
- </a-drawer>
- <!-- 创意信息编辑 -->
- <a-drawer
- :width="800"
- :visible="optimizeVisible"
- :body-style="{ paddingBottom: '80px' }"
- @close="closeCreative"
- >
- <!-- @close="closeUnit('createForm')" -->
- <h2 slot="title" style="margin-bottom: 0">创意信息</h2>
- <!-- class="create-info" -->
- <a-form layout="horizontal" v-bind="formDrawerItemLayout" :form="formOriginality">
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="创意制作方式">
- <a-radio-group
- button-style="solid"
- @change="unitTypeCheck"
- v-decorator="[
- 'unitType',
- {
- rules: [
- {
- required: true,
- message: '创意制作方式必选'
- }
- ],
- initialValue: 0
- }
- ]"
- >
- <a-radio-button :value="0">不限</a-radio-button>
- <a-radio-button :value="4">自定义</a-radio-button>
- <a-radio-button :value="7">程序化</a-radio-button>
- </a-radio-group>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16" style="width: 110%;margin-left: -11%;">
- <a-form-item label="广告位置">
- <checkBoxGroup
- :options="[
- { label: '优选广告位', value: 1 },
- { label: '上下滑大屏广告', value: 6 },
- { label: '视频播放页广告', value: 3 },
- { label: '激励广告', value: 24 },
- { label: '联盟广告', value: 5 }
- ]"
- v-decorator="[
- 'sceneId',
- {
- rules: [
- {
- required: true,
- message: '转化目标必选'
- }
- ],
- initialValue: [1]
- }
- ]"
- @change="changeData"
- />
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16" v-if="getFormData('formOriginality', 'unitType') != 7">
- <a-col :span="16">
- <a-form-item label="自定义计划数量">
- <a-input-number
- style="width:200px"
- :max="600"
- :step="1"
- :min="1"
- v-decorator="[
- 'customPlanCnt',
- { initialValue: 5, rules: [{ required: true, message: '请填写自定义计划数量' }] }
- ]"
- @change="setImageCnt"
- />
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16" v-if="getFormData('formOriginality', 'unitType') != 7">
- <a-col :span="16">
- <a-form-item label="自定义组数量">
- <a-input-number
- style="width:200px"
- :max="unitCntMax"
- :step="1"
- :min="1"
- v-decorator="[
- 'customUnitCnt',
- { initialValue: 120, rules: [{ required: true, message: '请填写自定义组数量' }] }
- ]"
- @change="setCreativeCntMax"
- />
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16" v-if="getFormData('formOriginality', 'unitType') != 7">
- <a-col :span="16">
- <a-form-item label="自定义创意数量">
- <a-input-number
- style="width:200px"
- :max="creativeCntMax"
- :step="1"
- :min="1"
- v-decorator="[
- 'imageCnt',
- { initialValue: 5, rules: [{ required: true, message: '请填写自定义创意数量' }] }
- ]"
- />
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16" v-if="getFormData('formOriginality', 'unitType') != 4">
- <a-col :span="16">
- <a-form-item label="程序化计划数量">
- <a-input-number
- v-decorator="[
- 'programPlanCnt',
- { initialValue: 3, rules: [{ required: true, message: '请填写程序化计划数量' }] }
- ]"
- style="width:200px"
- placeholder="仅支持输入自然数"
- :max="300"
- :precision="0"
- :step="1"
- @change="setProgramUnitCnt"
- />
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16" v-if="getFormData('formOriginality', 'unitType') != 4">
- <a-col :span="16">
- <a-form-item label="程序化组数量">
- <a-input-number
- v-decorator="[
- 'programUnitCnt',
- { initialValue: 100, rules: [{ required: true, message: '请填写程序化组数量' }] }
- ]"
- style="width: 200px"
- placeholder="仅支持输入自然数"
- :max="imageCntMax"
- :precision="0"
- />
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="素材类型">
- <a-radio-group
- button-style="solid"
- v-decorator="['channelType', { rules: [{ required: true }], initialValue: 2 }]"
- >
- <a-radio-button :value="2">不限</a-radio-button>
- <a-radio-button :value="0">内部</a-radio-button>
- <a-radio-button :value="1">素造</a-radio-button>
- </a-radio-group>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="素材挖掘">
- <a-radio-group
- button-style="solid"
- v-decorator="['assetMining', { rules: [{ required: true }], initialValue: 1 }]"
- >
- <a-radio-button :value="1">开启</a-radio-button>
- <a-radio-button :value="0">关闭</a-radio-button>
- </a-radio-group>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="智能抽帧">
- <a-radio-group
- button-style="solid"
- v-decorator="['smartCover', { rules: [{ required: true }], initialValue: 1 }]"
- >
- <a-radio-button :value="1">开启</a-radio-button>
- <a-radio-button :value="0">关闭</a-radio-button>
- </a-radio-group>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="行动号召">
- <a-select
- mode="multiple"
- 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-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="广告语">
- <div style="max-height:200px;overflow-y:auto;border:1px solid #f2f2f2;padding:10px 0">
- <div style="position:relative" v-for="(item, index) in descriptionList" :key="index">
- <a-textarea
- class="rending"
- placeholder="请输入广告语"
- @change="descriptionchange(item.value, index)"
- v-model.trim="item.value"
- :autosize="{ minRows: 2, maxRows: 6 }"
- :max-length="30"
- style=" width: 80%;"
- ></a-textarea>
- <p
- style="
- font-size: 12px;
- color: #b6bbc7;
- letter-spacing: 0.3px;
- text-align: right;
- line-height: 30px;
- position: absolute;
- bottom: 0;
- left: 0;
- width: 80%;
- margin-bottom: 0;
- "
- >
- {{ item.value.length }}/30
- <!-- {{ getFormData('description').length }}/30 -->
- </p>
- <div style="position:absolute;right:0;top:-10px">
- <a-icon type="plus" @click="addDescription()" style="margin-right:15px" />
- <a-icon
- type="minus"
- @click="removeDescription(index)"
- v-if="descriptionList.length > 1"
- />
- </div>
- </div>
- </div>
- <div style="display:flex">
- <a style="margin-right:10px" @click="selectDescription">选择广告语</a>
- <a @click="importExcel">导入广告语</a>
- </div>
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="创意分类">
- <a-cascader
- :options="createOptions"
- v-decorator="[
- 'creativeCategory',
- {
- initialValue: []
- }
- ]"
- :fieldNames="fieldNames"
- placeholder="请选择创意分类"
- />
- </a-form-item>
- </a-col>
- </a-row>
- <a-row :gutter="16">
- <a-col :span="16">
- <a-form-item label="创意标签">
- <a-select
- mode="tags"
- style="width: 100%"
- placeholder="按回车生成标签"
- v-decorator="[
- 'creativeTag',
- {
- initialValue: [],
- rules: [
- {
- validator: creativeTagValid
- }
- ]
- }
- ]"
- dropdownClassName="display-none-selset"
- :token-separators="[',', ' ', ',']"
- >
- </a-select>
- </a-form-item>
- </a-col>
- </a-row>
- </a-form>
- <div
- :style="{
- position: 'absolute',
- right: 0,
- bottom: 0,
- width: '100%',
- borderTop: '1px solid #e9e9e9',
- padding: '10px 16px',
- background: '#fff',
- textAlign: 'right',
- zIndex: 1
- }"
- >
- <a-button :style="{ marginRight: '8px' }" @click="closeCreative"> 取消 </a-button>
- <a-button type="primary" @click="submitCreative"> 提交 </a-button>
- </div>
- </a-drawer>
- <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="convertOk">
- 确定
- </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="
- getFormData('formProject', 'campaignType') == 4 ||
- getFormData('formProject', 'campaignType') == 5
- "
- >JS布玛</a-radio-button
- >
- <a-radio-button
- value="2"
- v-show="
- getFormData('formProject', 'campaignType') == 4 ||
- getFormData('formProject', 'campaignType') == 5
- "
- >Xpath</a-radio-button
- >
- <a-radio-button value="3" v-show="getFormData('formProject', 'campaignType') == 2"
- >应用-SDK
- </a-radio-button>
- <a-radio-button value="7" v-show="getFormData('formProject', '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 in convertList" :key="item.convert_id">
- {{ item.convert_name }}</a-select-option
- >
- </a-select>
- </a-form-item>
- </a-modal>
- <a-modal v-model="lookChannelVisible" :footer="null" :width="1000">
- <a-table
- :columns="TTcolumns"
- :dataSource="lookChannelList"
- :pagination="lookChannelIpagination"
- :loading="lookChannelLoading"
- bordered
- size="middle"
- style="word-break: break-all;font-size:16px;font-weight:600"
- id="outTable"
- ref="accountTable"
- rowKey="id"
- :scroll="{ x: 1500 }"
- >
- </a-table>
- </a-modal>
- <a-modal v-model="importExcelVisible" :footer="null" title="导入广告语">
- <a-upload
- name="file"
- :multiple="false"
- :headers="tokenHeader"
- :file-list="fileList"
- :showUploadList="false"
- :beforeUpload="beforeUpload"
- @change="handleChange"
- style="margin-right: 20px"
- class="require-class fileUpload"
- id="fileUpload"
- >
- <a-button :disabled="loadDisabled">
- <a-icon type="upload" />
- {{ loadDisabled ? '上传中,请稍后' : '文件上传' }}
- </a-button>
- </a-upload>
- </a-modal>
- <a-modal v-model="selectDescriptionVisible" title="选择广告语">
- <template slot="footer">
- <a-button
- key="back"
- @click="
- selectDescriptionVisible = false
- selectDescriptionArr = []
- "
- >取消</a-button
- >
- <a-button key="submit" type="primary" @click="okDescription">
- 确定
- </a-button>
- </template>
- <a-checkbox-group v-model="selectDescriptionArr">
- <a-list bordered :data-source="descriptionListCheck">
- <a-list-item slot="renderItem" slot-scope="item, index">
- <a-checkbox :value="item.textCopywriter">
- {{ item.textCopywriter }}
- </a-checkbox>
- </a-list-item>
- </a-list>
- </a-checkbox-group>
- </a-modal>
- <templateModal ref="templateModal" @getData="getTargetPerson" />
- </div>
- </template>
- <script>
- import Vue from 'vue'
- import { ACCESS_TOKEN } from '@/store/mutation-types'
- import $ from 'jquery'
- import Logo from '@/components/tools/Logo.vue'
- import pick from 'lodash.pick'
- import { mixin } from '@/utils/mixin.js'
- import Treeselect from '@/views/modules/Statistics/components/Treeselect.vue'
- import moment from 'moment'
- import selectCheckAll from '@/components/formComponents/toutiaoTime'
- import checkBoxGroup from '@/components/formComponents/checkBoxGroup'
- import { stopOtherVideo, closeAllVideoFun } from '@/utils/videoControl' // 停止除当前外的其他视频播放,及停止所有视频播放的方法
- import selectTable from '@/views/modules/Statistics/components/selectPagination.vue'
- import EditableCell from './components/editablCell'
- import selectTreeAccount from '@/components/formComponents/selectAccount.vue'
- import templateModal from './components/templateModal'
- // import lookPreviewVue from './lookPreview.vue'
- 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)
- }
- let optionsAppActive = []
- let businessOptions = []
- let fansStarOptions = []
- let interestVideoOptions = []
- let TTcolumns = [
- {
- title: '渠道号名称',
- dataIndex: 'channelName',
- scopedSlots: { customRender: 'channelName' },
- align: 'center',
- key: 'channelName'
- },
- {
- title: '下载链接',
- dataIndex: 'url',
- scopedSlots: { customRender: 'url' },
- align: 'center',
- key: 'url',
- width: 300
- },
- {
- title: '调起链接',
- dataIndex: 'schemaUri',
- scopedSlots: { customRender: 'schemaUri' },
- align: 'center',
- key: 'schemaUri',
- width: 300
- },
- {
- title: '第三方点击监测链接',
- dataIndex: 'clickTrackUrl',
- scopedSlots: { customRender: 'clickTrackUrl' },
- align: 'center',
- key: 'clickTrackUrl',
- width: 300
- },
- {
- title: '第三方actionBar监测链接',
- dataIndex: 'actionbarClickUrl',
- scopedSlots: { customRender: 'actionbarClickUrl' },
- align: 'center',
- key: 'actionbarClickUrl',
- width: 300
- }
- ]
- export default {
- name: 'GlobalHeader',
- components: {
- // UserMenu,
- // SMenu,
- Logo,
- Treeselect,
- selectCheckAll,
- checkBoxGroup,
- selectTable,
- EditableCell,
- selectTreeAccount,
- templateModal
- },
- mixins: [mixin],
- props: {
- mode: {
- type: String,
- // sidemenu, topmenu
- default: 'sidemenu'
- },
- theme: {
- type: String,
- required: false,
- default: 'dark'
- },
- collapsed: {
- type: Boolean,
- required: false,
- default: false
- },
- device: {
- type: String,
- required: false,
- default: 'desktop'
- }
- },
- data() {
- return {
- formProject: this.$form.createForm(this), //选择项目表单
- formInformation: this.$form.createForm(this), //设置基本信息表单
- formTargetApp: this.$form.createForm(this), //目标应用编辑表单
- formOptimize: this.$form.createForm(this), //优化目标表单
- formOriginality: this.$form.createForm(this), //创意表单
- formMaterial: this.$form.createForm(this), //素材表单
- sumbitLoading: false,
- //基本信息参数
- formInformationVisible: false,
- formInformaData: null,
- budgetType: '1',
- dayBudgetType: '1',
- projectId: null,
- projectName: null,
- accountId: null,
- //目标应用参数
- targetAppVisible: false,
- appList: [], //分平台数据,从总数据中筛选,避免多次请求接口
- appListAll: [], //所有的数据,做分平台的元数据
- tongbuLoading: false, //同步app按钮loading
- uriCheck: false, //调起链接,是否开启
- multipleBidDataDrawer: [],
- multipleBidData: [],
- appDetail: null,
- appDetailMiddle: null,
- personLoading: false,
- useChannel: false,
- channelData: null,
- convertId: null,
- convertList: [],
- convertType: '1',
- convert: false,
- TTcolumns,
- lookChannelVisible: false,
- lookChannelAppName: '',
- lookChannelList: [],
- lookChannelLoading: false,
- lookChannelIpagination: {
- current: 1,
- pageSize: 10,
- // pageSizeOptions: ['10', '20', '30'],
- showTotal: (total, range) => {
- return range[0] + '-' + range[1] + ' 共' + total + '条'
- },
- showQuickJumper: true,
- showSizeChanger: false,
- pageSizeOptions: ['10', '30', '50'],
- total: 0,
- onChange: (current, pageSize) => {
- // 切换分页时的回调,
- // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
- this.lookChannelIpagination.current = current
- this.lookChannelIpagination.pageSize = pageSize
- this.lookChannel(this.lookChannelAppName)
- }
- },
- //目标人群参数
- targetPersonVisible: false,
- personList: [],
- checkPerson: [],
- checkPersonAll: [],
- checkPersonElse: [],
- checkPersonOne: '',
- showCheckPerson: [],
- sumContent: 0,
- searchTemplate: '',
- ipagination: {
- current: 1,
- pageSize: 9,
- // pageSizeOptions: ['10', '20', '30'],
- showTotal: (total, range) => {
- return range[0] + '-' + range[1] + ' 共' + total + '条'
- },
- showQuickJumper: true,
- showSizeChanger: false,
- pageSizeOptions: ['10', '30', '50'],
- total: 0,
- onChange: (current, pageSize) => {
- // 切换分页时的回调,
- // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
- this.ipagination.current = current
- this.ipagination.pageSize = pageSize
- this.getTargetPerson()
- }
- },
- //优化目标参数
- groupTypeData: {},
- //创意信息参数
- optimizeVisible: false,
- adposition: 1,
- programUnitCnt: 60,
- customUnitCnt: 400,
- customUnitCntMax: 400,
- imageCntMax: 300,
- unitCntMax: 600,
- creativeCntMax: 15,
- actionBarTextList: [],
- descriptionList: [{ value: '' }],
- fieldNames: {
- label: 'category_name',
- value: 'category_id',
- children: 'child'
- },
- createOptions: [],
- showCreativeData: null,
- importExcelVisible: false,
- selectDescriptionVisible: false,
- selectDescriptionArr: [],
- descriptionListCheck: [],
- tokenHeader: { 'X-Access-Token': Vue.ls.get(ACCESS_TOKEN) },
- fileList: [],
- fileUrl: '',
- loadDisabled: false,
- dataFile: null,
- //公共参数
- activeStep: 0,
- screenWidth: document.body.clientWidth,
- headerBarFixed: false,
- //update-begin--author:sunjianlei---date:20190508------for: 顶部导航栏过长时显示更多按钮-----
- topMenuStyle: {
- headerIndexLeft: {},
- topNavHeader: {},
- headerIndexRight: {},
- topSmenuStyle: {}
- },
- stepsArr: [
- { title: '选择项目' },
- // { title: '设置基本信息' },
- { title: '优化目标' },
- { title: '目标应用' },
- { title: '目标人群' },
- { title: '创意信息' },
- { title: '素材信息' }
- ],
- formItemLayout: {
- labelCol: { span: 4 },
- wrapperCol: { span: 16 }
- },
- formDrawerItemLayout: {
- labelCol: { span: 6 },
- wrapperCol: { span: 18 }
- },
- tailFormItemLayout: {
- wrapperCol: {
- sm: {
- span: 20,
- offset: 4
- }
- }
- },
- tailFormItemLayoutElse: {
- wrapperCol: {
- sm: {
- span: 20,
- offset: 1
- }
- }
- },
- tailFormDrawerItemLayout: {
- wrapperCol: {
- sm: {
- span: 18,
- offset: 6
- }
- }
- },
- disabled: false
- }
- },
- computed: {},
- watch: {},
- mounted() {
- this.$nextTick(function() {
- // this.accountId = 23212
- this.getDataType('APP_INTEREST', 'optionsAppActive')
- this.getDataType('BUSINESS_INTEREST', 'businessOptions')
- this.getDataType('FANS_STAR', 'fansStarOptions')
- this.getDataType('INTEREST_VIDEO', 'interestVideoOptions')
- this.getActionBarText()
- if (this.$route.query.id) {
- this.getQueryById(this.$route.query.id)
- }
- window.addEventListener('scroll', this.onScroll)
- const that = this
- window.onresize = () => {
- return (() => {
- window.screenWidth = document.body.clientWidth
- that.screenWidth = window.screenWidth
- })()
- }
- })
- },
- filters: {
- unitType(val) {
- let data = {
- 4: '自定义',
- 7: '程序化',
- 0: '不限'
- }
- return data[val]
- },
- channelType(val) {
- let data = {
- 0: '内部',
- 1: '素造',
- 2: '不限'
- }
- return data[val]
- },
- business(theme) {
- let businessInterest = businessOptions.map(item => {
- return {
- tagId: item.tagId,
- tagName: item.tagName
- }
- })
- return businessInterest.filter(item => {
- return item.tagId == theme
- })[0].tagName
- },
- optionsApp(theme) {
- let optionsAppdata = optionsAppActive.map(item => {
- return {
- tagId: item.tagId,
- tagName: item.tagName
- }
- })
- return optionsAppdata.filter(item => {
- return item.tagId == theme
- })[0].tagName
- },
- fansStarLabel(theme) {
- let fansStarOptionsData = fansStarOptions.map(item => {
- return {
- tagId: item.tagId,
- tagName: item.tagName
- }
- })
- return fansStarOptionsData.filter(item => {
- return item.tagId == theme
- })[0].tagName
- },
- interestVideo(theme) {
- let interestVideoOptionsData = interestVideoOptions.map(item => {
- return {
- tagId: item.tagId,
- tagName: item.tagName
- }
- })
- return interestVideoOptionsData.filter(item => {
- return item.tagId == theme
- })[0].tagName
- }
- },
- methods: {
- moment,
- importExcel() {
- this.importExcelVisible = true
- },
- selectDescription() {
- this.selectDescriptionVisible = true
- this.getDescriptionList()
- },
- okDescription() {
- var data = this.selectDescriptionArr.map(item => {
- return { value: item }
- })
- if (this.descriptionList[0].value == '') {
- this.descriptionList = data
- } else {
- this.descriptionList.push(...data)
- }
- },
- getDescriptionList() {
- var params = {}
- params.accountIds = JSON.stringify([this.getFormData('formProject', 'accountId')])
- params.Keywords = null
- params.pageNumber = 1
- params.pageSize = 50
- this.getAction('/document/library/getDocumentList', params).then(res => {
- console.log(res)
- })
- },
- beforeUpload(file) {
- this.dataFile = $('.fileUpload').find('input')[0].files[0]
- console.log(this.dataFile)
- this.loadDisabled = true
- },
- handleChange() {
- let formData = new FormData()
- formData.append('file', this.dataFile)
- this.postDataAction('/document/library/importAdLanguage', formData).then(res => {
- this.loadDisabled = false
- if (res.code === 200) {
- // console.log(res)
- var data = res.result.map(item => {
- return { value: item }
- })
- if (this.descriptionList[0].value == '') {
- this.descriptionList = data
- } else {
- this.descriptionList.push(...data)
- }
- this.importExcelVisible = false
- } else {
- this.$message.error(res.message)
- }
- })
- },
- convertOk() {
- var dataLink = []
- dataLink = this.convertList.filter(item => {
- return item.convert_id == this.convertId.key
- })
- if (dataLink.length > 0) {
- this.convert = false
- } else {
- this.convert = false
- this.convertId = ''
- }
- },
- getPlatForm(appId) {
- if (appId) {
- var data = this.appList.filter(item => {
- return item.appId == appId.key
- })
- return data[0].platform
- }
- },
- showConvert() {
- this.convertChange()
- if (this.getFormData('formProject', 'campaignType') == 2) {
- if (this.getFormData('formTargetApp', 'appId')) {
- this.convert = true
- let appIdvalue = this.getFormData('formTargetApp', 'appId')
- if (
- this.getPlatForm(appIdvalue instanceof Array ? appIdvalue[0] : appIdvalue) == 1 ||
- this.getPlatForm(appIdvalue instanceof Array ? appIdvalue[0] : appIdvalue) == 2
- ) {
- this.convertType = '3'
- } else {
- this.convertType = '7'
- }
- } else {
- this.$message.error('请选择应用')
- }
- } else {
- this.convert = true
- this.convertType = '1'
- }
- this.getConvertList()
- },
- convertChange() {
- this.convertId = ''
- this.getConvertList()
- },
- getConvertList() {
- var params = {}
- params.accountId = this.getFormData('formProject', 'accountId')
- params.type = this.convertType
- this.getAction('/kuaishou/batch/getConvertList', params).then(res => {
- //console.log(res)
- if (res.success) {
- this.convertList = res.result.map(item => {
- return {
- ...item,
- convert_id: item.convert_id + ''
- }
- })
- }
- })
- },
- changeChannel(checked) {
- if (checked) {
- if (!!this.getFormData('formProject', 'accountId')) {
- if (!!this.getFormData('formTargetApp', 'appId')) {
- if (
- this.getFormData('formTargetApp', 'singleAppid') == 0 &&
- this.getFormData('formTargetApp', 'appId').length == 0
- ) {
- this.useChannel = false
- this.$message.error('未选择应用不可开启')
- return
- }
- var paramsData = {}
- paramsData.appIdArray =
- this.getFormData('formTargetApp', 'appId') instanceof Array
- ? this.getFormData('formTargetApp', 'appId').map(item => {
- return item.key
- })
- : [this.getFormData('formTargetApp', 'appId').key]
- this.postDataAction('/kuaishou/kuaiShouAppList/getAppNames', paramsData).then(result => {
- var params = {}
- params.appNameArray = result.result.map(item => {
- return item.appName
- })
- params.accountId = this.getFormData('formProject', 'accountId')
- this.postDataAction('/channel/queryChannelLevel', params).then(res => {
- console.log(res)
- if (res.code === 200) {
- if (res.result) {
- this.channelData = res.result
- } else {
- this.useChannel = false
- this.$message.error(res.message)
- }
- } else {
- this.useChannel = false
- this.$message.error('该账户不能使用渠道号')
- }
- })
- })
- } else {
- this.useChannel = false
- this.$message.error('未选择应用不可开启')
- }
- } else {
- this.useChannel = false
- this.$message.error('未选择账户不可开启')
- }
- } else {
- this.channelData = null
- }
- },
- test() {
- // this.formProject.validateFields((err, values) => {
- // console.log(values)
- // })
- // this.formInformation.validateFields((err, values) => {
- // console.log(values)
- // })
- this.formOptimize.validateFields((err, values) => {
- console.log(values)
- })
- // this.formMaterial.validateFields((err, values) => {
- // console.log(values)
- // })
- // formProject: this.$form.createForm(this), //选择项目表单
- // formInformation: this.$form.createForm(this), //设置基本信息表单
- // formTargetApp: this.$form.createForm(this), //目标应用编辑表单
- // formOptimize: this.$form.createForm(this), //优化目标表单
- // formOriginality: this.$form.createForm(this), //创意表单
- // formMaterial: this.$form.createForm(this), //素材表单
- },
- getQueryById(id) {
- this.getAction('/auto/aiKuaishouAccountAutoStrategy/queryById', { id }).then(res => {
- if (res.success) {
- this.getActionBarText()
- // this.getAction('/ctop/userAllocation/getAccountListByProjectId', {
- // projectId: res.result.projectId
- // }).then(res => {
- // if (res.success) {
- // }
- // })
- this.getAction('/kuaishou/batch/getCreativeCategory', {
- accountId: res.result.accountId
- }).then(result => {
- if (result.success) {
- //console.log(res)
- this.createOptions = result.result
- }
- })
- this.$nextTick(() => {
- let data = res.result
- this.formProject.setFieldsValue(pick(data, 'campaignType', 'accountId'))
- this.formInformaData = {
- budgetType: data.campaignDayBudget ? '2' : '1',
- dayBudgetType: data.unitDayBudget ? '2' : '1',
- campaignName: data.campaignName,
- groupName: data.groupName,
- campaignDayBudget: data.campaignDayBudget ? data.campaignDayBudget / 1000 : undefined,
- unitDayBudget: data.unitDayBudget ? data.unitDayBudget / 1000 : undefined
- }
- if (data.campaignDayBudget && data.campaignDayBudget > 0) {
- this.budgetType = '2'
- data.campaignDayBudget = data.campaignDayBudget / 1000
- setTimeout(() => {
- this.formInformation.setFieldsValue(pick(data, 'campaignDayBudget'))
- }, 100)
- } else {
- this.budgetType = '1'
- }
- if (data.unitDayBudget && data.unitDayBudget > 0) {
- this.dayBudgetType = '2'
- data.unitDayBudget = data.unitDayBudget / 1000
- setTimeout(() => {
- this.formInformation.setFieldsValue(pick(data, 'unitDayBudget'))
- }, 100)
- } else {
- this.dayBudgetType = '1'
- }
- data.deepConversionType =
- data.deepConversionType && data.deepConversionType != ''
- ? data.deepConversionType
- : undefined
- data.deepConversionBid =
- data.deepConversionBid && data.deepConversionBid != '' ? data.deepConversionBid : undefined
- if (data.deepConversionType && data.deepConversionBid && data.deepConversionBid != '') {
- if (res.result.deepConversionBid.includes('/')) {
- let bidArr = res.result.deepConversionBid.split('/')
- for (let index = 0; index < bidArr.length; index++) {
- bidArr[index] = bidArr[index] / 1000
- }
- data.deepConversionBid = bidArr.join('/')
- } else if (res.result.deepConversionBid.includes('-')) {
- let bidArr = res.result.deepConversionBid.split('-')
- for (let index = 0; index < bidArr.length; index++) {
- bidArr[index] = bidArr[index] / 1000
- }
- data.deepConversionBid = bidArr.join('-')
- } else {
- data.deepConversionBid = res.result.deepConversionBid / 1000 + ''
- }
- } else {
- data.deepConversionType = undefined
- data.deepConversionBid = undefined
- }
- if (data.cpaBid.includes('/')) {
- let bidArr = data.cpaBid.split('/')
- for (let index = 0; index < bidArr.length; index++) {
- bidArr[index] = bidArr[index] / 1000
- }
- data.cpaBid = bidArr.join('/')
- } else if (data.cpaBid.includes('-')) {
- let bidArr = data.cpaBid.split('-')
- for (let index = 0; index < bidArr.length; index++) {
- bidArr[index] = bidArr[index] / 1000
- }
- data.cpaBid = bidArr.join('-')
- } else {
- data.cpaBid = data.cpaBid / 1000 + ''
- }
- console.log(data.deepConversionBid, data.deepConversionType)
- this.formOptimize.setFieldsValue(
- pick(data, 'bidType', 'ocpxActionType', 'deepConversionType', 'cpaBid', 'deepConversionBid')
- )
- res.result.sourceMaterial = JSON.parse(res.result.sourceMaterial)
- this.formMaterial.setFieldsValue(pick(data, 'sourceMaterial', 'matchType', 'materialKeyword'))
- if (res.result.creativeCategory) {
- // let arr=[];
- if (res.result.creativeCategory > 10000) {
- res.result.creativeCategory = res.result.creativeCategory
- ? [
- parseInt(res.result.creativeCategory / 10000),
- parseInt(res.result.creativeCategory / 100),
- res.result.creativeCategory
- ]
- : []
- } else if (res.result.creativeCategory > 100) {
- res.result.creativeCategory = res.result.creativeCategory
- ? [parseInt(res.result.creativeCategory / 100), res.result.creativeCategory]
- : []
- } else {
- res.result.creativeCategory = res.result.creativeCategory
- ? [res.result.creativeCategory]
- : []
- }
- }
- res.result.creativeTag = res.result.creativeTag ? JSON.parse(res.result.creativeTag) : []
- this.descriptionList =
- res.result.description.charAt(0) === '['
- ? eval(res.result.description).map(item => {
- return { value: item }
- })
- : [{ value: res.result.description }]
- res.result.sceneId = JSON.parse(res.result.sceneId)
- data.actionBarText = data.actionBarText.split(',')
- this.showCreativeData = pick(
- data,
- 'unitType',
- 'sceneId',
- 'imageCnt',
- 'customPlanCnt',
- 'customUnitCnt',
- 'programPlanCnt',
- 'programUnitCnt',
- 'channelType',
- 'assetMining',
- 'smartCover',
- 'actionBarText',
- 'creativeCategory',
- 'creativeTag'
- )
- // this.appDetail = { platformOs: data.platformOs, singleAppid: 1 }
- this.postDataAction('/kuaishou/kuaiShouAppList/getAppNames', {
- appIdArray: JSON.parse(data.appIdArray)
- }).then(result => {
- if (result.success) {
- this.multipleBidData = result.result
- this.appDetail = {
- platformOs: result.result[0].platform < 3 ? 1 : 2,
- singleAppid: 1,
- appId: { key: result.result[0].appId },
- schemaUri: res.result.schemaUri,
- useChannel: this.useChannel
- }
- }
- })
- this.useChannel = res.result.useChannel ? (res.result.useChannel == 1 ? true : false) : false
- if (this.useChannel) {
- var paramsData = {}
- paramsData.appIdArray = JSON.parse(data.appIdArray)
- this.postDataAction('/kuaishou/kuaiShouAppList/getAppNames', paramsData).then(result => {
- var params = {}
- params.appNameArray = result.result.map(item => {
- return item.appName
- })
- params.accountId = data.accountId
- this.postDataAction('/channel/queryChannelLevel', params).then(res => {
- if (res.code === 200) {
- if (res.result) {
- this.channelData = res.result
- } else {
- this.useChannel = false
- this.$message.error(res.message)
- }
- } else {
- this.useChannel = false
- this.$message.error('该账户不能使用渠道号')
- }
- })
- })
- }
- this.checkPerson = JSON.parse(data.autoTargetArray)
- this.checkPersonElse = JSON.parse(data.autoTargetArray)
- if (data.autoTargetArray) {
- this.postDataAction('/auto/aiKuaishouAccountAutoTarget/getAutoTargetByIds', {
- ids: this.checkPerson
- }).then(res => {
- if (res.success) {
- this.showCheckPerson = res.result.map(item => {
- return {
- ...item,
- regionName: []
- }
- })
- for (let i = 0; i < this.showCheckPerson.length; i++) {
- if (
- this.showCheckPerson[i] &&
- (this.showCheckPerson[i].region == '' ||
- this.showCheckPerson[i].region == null ||
- JSON.parse(this.showCheckPerson[i].region).length == 0)
- ) {
- } else {
- // this.showRegion(this.personList[i].region, this.personList[i].regionName)
- let that = this
- new Promise((resolve, reject) => {
- this.postDataAction('/kuaishou/batch/getRegionDetail', {
- regionArr: that.showCheckPerson[i].region
- }).then(res => {
- if (res.success) {
- // this.populationData.allForm.region = res.result
- that.showCheckPerson[i].regionName = res.result.map(item => {
- return item.label
- })
- }
- })
- })
- }
- }
- }
- })
- }
- })
- }
- })
- },
- handleSubmit() {
- let formProjectData = new Promise((resolve, reject) => {
- this.formProject.validateFields((err, values) => {
- if (!err) {
- resolve({ ...values })
- } else {
- reject('选择项目表单出错')
- }
- })
- })
- let formInformationData = new Promise((resolve, reject) => {
- this.formInformation.validateFields((err, values) => {
- if (!err) {
- resolve({ ...values })
- } else {
- reject('基本信息出错')
- }
- })
- })
- let formOptimizeData = new Promise((resolve, reject) => {
- this.formOptimize.validateFields((err, values) => {
- console.log(values, err)
- if (!err) {
- resolve({ ...values })
- } else {
- reject('优化目标出错')
- }
- })
- })
- let formMaterialData = new Promise((resolve, reject) => {
- this.formMaterial.validateFields((err, values) => {
- if (!err) {
- resolve({ ...values })
- } else {
- reject('出错')
- }
- })
- })
- this.getAction('/auto/aiKuaishouAccountAutoStrategy/checkStrategy', {
- accountId: this.getFormData('formProject', 'accountId'),
- type: 1
- }).then(res => {
- if (res.success) {
- Promise.all([formProjectData, formInformationData, formOptimizeData, formMaterialData])
- .then(res => {
- if (
- !this.showCreativeData ||
- this.showCheckPerson.length === 0 ||
- this.multipleBidData.length === 0
- ) {
- this.$message.error('请填写完整')
- return
- }
- this.sumbitLoading = true
- let params = {
- ...res[0],
- ...res[1],
- ...res[2],
- ...res[3],
- ...this.showCreativeData,
- ...this.formInformaData
- }
- if (this.budgetType === '2') {
- params.campaignDayBudget = params.campaignDayBudget * 1000
- } else {
- params.campaignDayBudget = 0
- }
- if (this.dayBudgetType === '2') {
- params.unitDayBudget = params.unitDayBudget * 1000
- } else {
- params.unitDayBudget = 0
- }
- if (params.cpaBid) {
- if ((params.cpaBid + '').includes('/')) {
- let bidArr = params.cpaBid.split('/')
- for (let index = 0; index < bidArr.length; index++) {
- bidArr[index] = bidArr[index] * 1000
- }
- params.cpaBid = bidArr.join('/')
- } else if ((params.cpaBid + '').includes('-')) {
- let bidArr = params.cpaBid.split('-')
- for (let index = 0; index < bidArr.length; index++) {
- bidArr[index] = bidArr[index] * 1000
- }
- params.cpaBid = bidArr.join('-')
- } else {
- params.cpaBid = params.cpaBid * 1000
- }
- } else {
- params.cpaBid = 0
- }
- if (params.deepConversionBid && params.deepConversionBid != 0) {
- if ((params.deepConversionBid + '').includes('/')) {
- let bidArr = params.deepConversionBid.split('/')
- for (let index = 0; index < bidArr.length; index++) {
- bidArr[index] = bidArr[index] * 1000
- }
- params.deepConversionBid = bidArr.join('/')
- } else if ((params.deepConversionBid + '').includes('-')) {
- let bidArr = params.deepConversionBid.split('-')
- for (let index = 0; index < bidArr.length; index++) {
- bidArr[index] = bidArr[index] * 1000
- }
- params.deepConversionBid = bidArr.join('-')
- } else {
- params.deepConversionBid = params.deepConversionBid * 1000
- }
- } else {
- params.deepConversionBid = 0
- }
- if (params.creativeCategory && params.creativeCategory.length > 0) {
- params.creativeCategory = params.creativeCategory[params.creativeCategory.length - 1]
- } else {
- params.creativeCategory = undefined
- }
- params.creativeTag = params.creativeTag ? JSON.stringify(params.creativeTag) : undefined
- params.appIdArray = JSON.stringify(
- this.multipleBidData.map(res => {
- return res.appId
- })
- )
- params.autoTargetArray = this.showCheckPerson.map(item => {
- return item.id
- })
- params.description = JSON.stringify(
- this.descriptionList.map(item => {
- return item.value
- })
- )
- params.singleAppid = 1
- params.actionBarText = params.actionBarText.join()
- params.deepConversionType = params.deepConversionType ? params.deepConversionType : ''
- params.deepConversionBid = params.deepConversionBid ? params.deepConversionBid : ''
- params.usageLevel =
- this.channelData && this.channelData ? this.channelData.channel.usageLevel : null
- params.useChannel = this.appDetail.useChannel ? 1 : 0
- params.sourceMaterial = JSON.stringify(params.sourceMaterial)
- params.sceneId = JSON.stringify(params.sceneId)
- params.autoTargetArray = JSON.stringify(params.autoTargetArray)
- if (this.$route.query.id) {
- params.id = this.$route.query.id
- this.postDataAction('/auto/aiKuaishouAccountAutoStrategy/edit', params).then(res => {
- if (res.success) {
- this.sumbitLoading = false
- window.close()
- } else {
- this.sumbitLoading = false
- this.$message.error('创建失败')
- }
- })
- } else {
- this.postDataAction('/auto/aiKuaishouAccountAutoStrategy/add', params).then(res => {
- if (res.success) {
- this.sumbitLoading = false
- window.close()
- } else {
- this.sumbitLoading = false
- this.$message.error(res.message)
- }
- })
- }
- // this.getAction('/kuaishouProjectStrategy/checkProjectisOpen', { projectId: params.projectId }).then(
- // res => {
- // if (res.success) {
- // if (res.result === 1) {
- // } else {
- // this.$message.error('此项目有开启的配置,无法新建配置')
- // this.sumbitLoading = false
- // }
- // }
- // }
- // )
- })
- .catch(err => {
- this.$message.error('请填写完整')
- })
- }else{
- this.$message.error(res.message)
- }
- })
- },
- clearAllData() {
- window.close()
- },
- descriptionchange(val, index) {
- let data = val
- this.$nextTick(() => {
- this.descriptionList[index].value = data.replace(/\s/g, '')
- })
- },
- addDescription() {
- this.descriptionList.push({ value: '' })
- },
- removeDescription(index) {
- this.descriptionList.splice(index, 1)
- },
- // 获取行动号召按钮
- getActionBarText() {
- this.actionBarTextList = []
- let that = this
- setTimeout(() => {
- this.getAction('/kuaishou/batch/getActionBarTextByType', {
- type: '2'
- }).then(res => {
- if (res.success) {
- that.actionBarTextList = res.result
- }
- })
- })
- },
- closeCreative() {
- this.optimizeVisible = false
- this.customUnitCntMax = 400
- this.imageCntMax = 300
- this.unitCntMax = 600
- this.creativeCntMax = 15
- this.formOriginality.resetFields()
- },
- submitCreative() {
- this.formOriginality.validateFields((err, values) => {
- if (!err) {
- let isNotComplete = this.descriptionList.findIndex(item => {
- return item.value === ''
- })
- if (isNotComplete > -1) {
- this.$message.error('请正确填写必填项目,广告语未填')
- return
- }
- this.showCreativeData = JSON.parse(JSON.stringify(values))
- console.log(values, this.showCreativeData)
- this.optimizeVisible = false
- // this.closeCreative()
- }
- })
- },
- 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)
- } else if (data.length > 1 && data.findIndex(item => item == 5) == 0) {
- data.splice(
- data.findIndex(item => item == 5),
- 1
- )
- } else if (data.length > 1 && data.findIndex(item => item == 5) == data.length - 1) {
- data.splice(0, data.length - 1)
- }
- },
- unitTypeCheck(e) {
- // console.log(e.target.value)
- if (e.target.value === 7) {
- this.imageCntMax = 300
- } else {
- this.unitCntMax = 600
- this.creativeCntMax = 15
- }
- },
- setImageCnt(e) {
- this.unitCntMax = e ? Math.floor(600 / e) : 600
- this.creativeCntMax = e
- ? Math.floor(2000 / (e * this.getFormData('formOriginality', 'customUnitCnt'))) > 15
- ? 15
- : Math.floor(2000 / (e * this.getFormData('formOriginality', 'customUnitCnt')))
- : 15
- },
- setCreativeCntMax(e) {
- // v-if="getFormData('formOriginality', 'unitType') != 7"
- this.creativeCntMax = e
- ? Math.floor(2000 / (e * this.getFormData('formOriginality', 'customPlanCnt'))) > 15
- ? 15
- : Math.floor(2000 / (e * this.getFormData('formOriginality', 'customPlanCnt')))
- : 15
- },
- setProgramUnitCnt(e) {
- this.imageCntMax = e ? Math.floor(300 / e) : 300
- },
- creativeTagValid(rule, value, callback) {
- //console.log(rule, value, callback)
- if (value.length == 0 || value == undefined) {
- // //console.log(1)
- callback()
- } else if (value.length > 10) {
- callback('创意标签最多填写10个,请删减')
- } else {
- // //console.log(2)
- callback()
- }
- },
- cpaBidValid(rule, value, callback) {
- let z = /-/g
- let a = /\//g
- let d = /\./g
- if (value === '' || value === undefined || value === 0 || value === '0') {
- callback('出价必须填写')
- } else if (value.startsWith('.') || value.endsWith('.')) {
- callback('请填写正确出价')
- } else if (value.startsWith('-') || value.endsWith('-')) {
- callback('请填写正确出价')
- } else if (value.match(a) && value.match(z)) {
- callback('不允许出现除"-"和"/"之外的所有字符,并且二者不可同时出现')
- } else if (value.match(/[^0-9+-\/]/g)) {
- callback('请填写正确出价')
- } else {
- callback()
- }
- },
- deepBidValid(rule, value, callback) {
- let z = /-/g
- let a = /\//g
- let d = /\./g
- if (value === '' || value === undefined || value == 0 || value == '0') {
- callback()
- } else if (value.startsWith('.') || value.endsWith('.')) {
- callback('请填写正确出价')
- } else if (value.startsWith('-') || value.endsWith('-')) {
- callback('请填写正确出价')
- } else if (value.match(a) && value.match(z)) {
- callback('不允许出现除"-"和"/"之外的所有字符,并且二者不可同时出现')
- } else if (value.match(/[^0-9+-\/]/g)) {
- callback('请填写正确出价')
- } else {
- callback()
- }
- },
- getDataType(type, dataList) {
- this.getAction('/kuaishou/batch/getTargetList', { tagType: type }).then(res => {
- if (res.success) {
- if (dataList === 'businessOptions') {
- businessOptions = res.result
- } else if (dataList === 'optionsAppActive') {
- optionsAppActive = res.result
- } else if (dataList === 'fansStarOptions') {
- fansStarOptions = res.result
- } else if (dataList === 'interestVideoOptions') {
- interestVideoOptions = res.result
- }
- }
- })
- },
- setData(data) {
- this.checkPersonOne = data
- },
- setVideoData(data) {
- // checkPerson: [],
- // checkPersonAll: [],
- if (data.findIndex(item => item === this.checkPersonOne) > -1) {
- this.checkPersonElse.push(...data)
- this.checkPersonElse = [...new Set(this.checkPersonElse)]
- } else {
- data.findIndex(item => item === this.checkPersonOne) > -1
- this.checkPersonElse.splice(
- this.checkPersonElse.findIndex(item => item === this.checkPersonOne),
- 1
- )
- }
- // for (let i = 0; i < this.ipagination.current; i++) {
- // this.checkPersonAll.push([])
- // }
- // this.checkPersonAll[this.ipagination.current - 1] = data
- // var sum = 0
- // for (let i = 0; i < this.checkPersonAll.length; i++) {
- // sum += this.checkPersonAll[i].length
- // }
- this.sumContent = this.checkPersonElse.length
- var dataCount = 20
- if (this.sumContent > dataCount) {
- this.$message.error('最多选择' + dataCount + '个定向')
- this.checkPerson.pop()
- this.checkPersonElse.splice(
- this.checkPersonElse.findIndex(item => item === this.checkPersonOne),
- 1
- )
- this.sumContent--
- // this.checkPersonAll[this.ipagination.current - 1] = this.checkPerson
- }
- },
- cancel() {},
- removeVideoMaterial(index, id) {
- this.showCheckPerson.splice(index, 1)
- let indexElse = this.checkPerson.findIndex(item => {
- item == id
- })
- this.checkPerson.splice(indexElse, 1)
- // id
- this.checkPersonElse.splice(
- this.checkPersonElse.findIndex(item => {
- item == id
- }),
- 1
- )
- // for (let i = 0; i < this.checkPersonAll.length; i++) {
- // if (this.checkPersonAll[i].length > 0) {
- // for (let j = 0; j < this.checkPersonAll[i].length; j++) {
- // if (this.checkPersonAll[i][j] == id) {
- // this.checkPersonAll[i].splice(j, 1)
- // }
- // }
- // }
- // }
- // this.materialList[index].photoArr.splice(indexMaterial, 1)
- },
- getDataSource(current, pageSize) {
- // 切换分页时的回调,
- // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
- this.ipagination.current = current
- this.ipagination.pageSize = pageSize
- // this.checkPerson = this.checkPersonAll[current - 1]
- this.checkPerson = this.checkPersonElse
- this.getTargetPerson()
- },
- disabledDate(current) {
- // Can not select days before today and today
- return current && current < moment().subtract(1, 'days')
- },
- disabledDateOne(current) {
- // Can not select days before today and today
- return current && current < moment().subtract(0, 'days')
- },
- filterOption(input, option) {
- return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
- },
- //目标应用编辑
- targetAppEdit() {
- this.targetAppVisible = true
- if (this.appDetail) {
- if (this.appDetail.schemaUri) {
- this.uriCheck = true
- }
- this.appDetailMiddle = JSON.parse(JSON.stringify(this.appDetail))
- this.$nextTick(() => {
- this.formTargetApp.setFieldsValue({ ...this.appDetailMiddle })
- this.multipleBidDataDrawer = JSON.parse(JSON.stringify(this.multipleBidData))
- })
- }
- this.getAppList()
- },
- submitApp() {
- this.formTargetApp.validateFields((err, values) => {
- //console.log(values)
- if (!err) {
- this.appDetailMiddle = JSON.parse(JSON.stringify({ ...values, useChannel: this.useChannel }))
- this.appDetail = JSON.parse(JSON.stringify(this.appDetailMiddle))
- this.multipleBidData = JSON.parse(JSON.stringify(this.multipleBidDataDrawer))
- this.targetAppVisible = false
- this.multipleBidDataDrawer = []
- this.closeUnit()
- } else {
- }
- })
- },
- closeUnit(form) {
- this.uriCheck = false
- this.targetAppVisible = false
- this.multipleBidDataDrawer = []
- this.appDetailMiddle = null
- this.useChannel = false
- // this.channelData = null
- this.convertId = null
- this.formTargetApp.resetFields()
- },
- formInfoShow() {
- this.$nextTick(() => {
- console.log(this.formInformaData)
- if (this.formInformaData) {
- this.formInformationVisible = true
- this.budgetType = this.formInformaData.budgetType
- this.dayBudgetType = this.formInformaData.dayBudgetType
- setTimeout(() => {
- this.formInformation.setFieldsValue(pick(this.formInformaData, 'campaignName', 'groupName'))
- }, 100)
- if (this.budgetType == '2') {
- setTimeout(() => {
- this.formInformation.setFieldsValue(pick(this.formInformaData, 'campaignDayBudget'))
- }, 100)
- }
- if (this.dayBudgetType == '2') {
- setTimeout(() => {
- this.formInformation.setFieldsValue(pick(this.formInformaData, 'unitDayBudget'))
- }, 100)
- }
- } else {
- this.formInformationVisible = true
- }
- })
- },
- closeFormInfo() {
- this.formInformationVisible = false
- this.budgetType = '1'
- this.dayBudgetType = '1'
- this.formInformation.resetFields()
- },
- submitFormInfo() {
- this.formInformation.validateFields((err, values) => {
- if (!err) {
- var data = { ...values, budgetType: this.budgetType, dayBudgetType: this.dayBudgetType }
- this.formInformaData = JSON.parse(JSON.stringify(data))
- this.formInformationVisible = false
- }
- })
- },
- appIdChange(val) {
- // this.siteList = []
- // this.getPageList(val)
- this.multipleBidDataDrawer = []
- if (this.getFormData('formTargetApp', 'singleAppid') == 0) {
- if (val && val.findIndex(item => item.key === 0) > -1) {
- let appidArr = this.appList.map(item => {
- return {
- key: item.appId,
- label:
- `${
- item.platform === 1
- ? 'Android应用下载'
- : item.platform === 2
- ? 'Android网页游戏'
- : item.platform === 3
- ? 'iOS应用下载'
- : 'iOS网页游戏'
- }` +
- '\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0' +
- item.appName +
- '\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0' +
- item.appVersion
- }
- })
- this.$nextTick(() => {
- this.formTargetApp.setFieldsValue({
- appId: appidArr
- })
- this.postDataAction('/kuaishou/kuaiShouAppList/getAppNames', {
- appIdArray: appidArr.map(item => {
- return item.key
- })
- }).then(res => {
- if (res.success) {
- this.multipleBidDataDrawer = res.result
- }
- })
- })
- // this.$nextTick(() => {
- // this.formTargetApp.setFieldsValue({
- // appId: appidArr
- // })
- // this.multipleBidDataDrawer = appidArr.map(item => {
- // return {
- // ...item,
- // cpaBid: null,
- // trackUrl: '',
- // channelCode: '',
- // appId: item.key,
- // deepConversionBid: null
- // }
- // })
- // })
- } else {
- this.$nextTick(() => {
- // this.multipleBidDataDrawer = this.appList.filter(item => {
- // return item.id === val.key
- // })
- this.postDataAction('/kuaishou/kuaiShouAppList/getAppNames', {
- appIdArray: val.map(item => {
- return item.key
- })
- }).then(res => {
- if (res.success) {
- this.multipleBidDataDrawer = res.result
- }
- })
- })
- }
- if (this.multipleBidDataDrawer.length == 0) {
- this.useChannel = false
- this.channelData = null
- }
- } else {
- if (val) {
- this.$nextTick(() => {
- // this.multipleBidDataDrawer = this.appList.filter(item => {
- // return item.id === val.key
- // })
- this.postDataAction('/kuaishou/kuaiShouAppList/getAppNames', { appIdArray: [val.key] }).then(
- res => {
- if (res.success) {
- this.multipleBidDataDrawer = res.result
- }
- }
- )
- })
- } else {
- this.multipleBidDataDrawer = []
- this.useChannel = false
- this.channelData = null
- }
- }
- },
- lookChannel(appName) {
- this.lookChannelVisible = true
- this.lookChannelLoading = true
- this.lookChannelAppName = appName
- var params = {}
- params.accountId = this.getFormData('formProject', 'accountId')
- params.appName = appName
- params.pageNo = this.lookChannelIpagination.current
- params.pageSize = this.lookChannelIpagination.pageSize
- this.getAction('/channel/queryChannelList', params).then(res => {
- this.lookChannelLoading = false
- if (res.success) {
- this.lookChannelList = res.result.list || []
- this.lookChannelIpagination.total = res.result.total || 0
- }
- })
- },
- onCellChange(key, dataIndex, value) {
- const dataSource = [...this.multipleBidDataDrawer]
- const target = dataSource.find(item => item.id === key)
- if (target) {
- target[dataIndex] = value
- this.multipleBidDataDrawer = dataSource
- let params = { id: key }
- if (dataIndex == 'impressionUrl') {
- params.impressionUrl = value
- } else if (dataIndex == 'tracUrl') {
- params.tracUrl = value
- }
- this.postDataAction('/kuaishouAppPackage/edit', params).then(res => {
- if (res.success) {
- console.log(res)
- }
- })
- }
- },
- addApplication() {},
- changeType(e) {
- console.log(e.target.value)
- this.appList = []
- if (e.target.value === 1) {
- this.appList = this.appListAll.filter(item => {
- return item.platform == 1 || item.platform == 2
- })
- this.formTargetApp.setFieldsValue({ appId: undefined })
- this.multipleBidDataDrawer = []
- } else if (e.target.value === 2) {
- this.appList = this.appListAll.filter(item => {
- return item.platform == 3 || item.platform == 4
- })
- this.formTargetApp.setFieldsValue({ appId: undefined })
- this.multipleBidDataDrawer = []
- }
- },
- getAppList() {
- let params = {}
- params.accountId = this.getFormData('formProject', 'accountId')
- this.getAction('/kuaishou/batch/getAppList', params).then(res => {
- if (res.success) {
- this.appListAll = res.result.map((item, index) => {
- return {
- ...item,
- key: item.id
- }
- })
- if (this.getFormData('formTargetApp', 'platformOs') === 1) {
- this.appList = this.appListAll.filter(item => {
- return item.platform == 1 || item.platform == 2
- })
- } else if (this.getFormData('formTargetApp', 'platformOs') === 2) {
- this.appList = this.appListAll.filter(item => {
- return item.platform == 3 || item.platform == 4
- })
- }
- }
- })
- },
- //目标人群选择
- targetPersonCheck() {
- // this.checkPerson = this.checkPersonAll[0]
- this.checkPersonElse = this.showCheckPerson.map(item => {
- return item.id
- })
- this.checkPerson = this.checkPersonElse
- this.ipagination.current = 1
- this.sumContent = this.showCheckPerson.length
- this.targetPersonVisible = true
- this.searchTemplate = ''
- this.getTargetPerson()
- },
- submitPerson() {
- // var dataAll = tqFun(this.checkPersonAll)
- let dataAll = this.checkPersonElse
- this.checkPerson = dataAll
- this.personLoading = true
- if (this.checkPerson.length > 0) {
- this.postDataAction('/auto/aiKuaishouAccountAutoTarget/getAutoTargetByIds', {
- ids: this.checkPerson
- }).then(res => {
- this.personLoading = false
- if (res.success) {
- this.showCheckPerson = res.result.map(item => {
- return {
- ...item,
- regionName: []
- }
- })
- for (let i = 0; i < this.showCheckPerson.length; i++) {
- if (
- this.showCheckPerson[i] &&
- (this.showCheckPerson[i].region == '' ||
- this.showCheckPerson[i].region == null ||
- JSON.parse(this.showCheckPerson[i].region).length == 0)
- ) {
- } else {
- // this.showRegion(this.personList[i].region, this.personList[i].regionName)
- let that = this
- new Promise((resolve, reject) => {
- this.postDataAction('/kuaishou/batch/getRegionDetail', {
- regionArr: that.showCheckPerson[i].region
- }).then(res => {
- if (res.success) {
- // this.populationData.allForm.region = res.result
- that.showCheckPerson[i].regionName = res.result.map(item => {
- return item.label
- })
- }
- })
- })
- }
- }
- this.targetPersonVisible = false
- }
- })
- } else if (this.checkPerson.length > 20) {
- this.personLoading = false
- this.$message.error('最多选择20个定向包')
- } else {
- this.personLoading = false
- this.$message.error('请选择定向包')
- }
- },
- closePerson(form) {
- this.targetPersonVisible = false
- this.sumContent = 0
- if (this.showCheckPerson.lenght > 0) {
- } else {
- this.checkPersonAll = []
- this.checkPersonElse = []
- }
- this.checkPerson = []
- },
- editNewTemplate(item) {
- var params = { ...item }
- params.accountId = this.getFormData('formProject', 'accountId')
- this.$refs.templateModal.handleOk(params, 'edit')
- },
- deleteNewTemplate(id) {
- var params = {}
- params.ids = id
- this.getAction('/auto/aiKuaishouAccountAutoTarget/deleteBatch', params).then(res => {
- if (res.success) {
- this.getTargetPerson()
- } else {
- this.$message.error(res.messsage)
- }
- })
- },
- addNewTemplate() {
- this.$refs.templateModal.create(this.getFormData('formProject', 'accountId'), 'add')
- },
- getTargetPerson() {
- let params = {}
- params.pageSize = this.ipagination.pageSize
- params.pageNo = this.ipagination.current
- params.accountId = this.getFormData('formProject', 'accountId')
- params.targetName = this.searchTemplate == '' ? null : this.searchTemplate
- this.getAction('/auto/aiKuaishouAccountAutoTarget/list', params).then(res => {
- if (res.success) {
- this.personList = res.result.list.map(item => {
- return {
- ...item,
- regionName: []
- }
- })
- for (let i = 0; i < this.personList.length; i++) {
- if (
- this.personList[i] &&
- (this.personList[i].region == '' ||
- this.personList[i].region == null ||
- JSON.parse(this.personList[i].region).length == 0)
- ) {
- } else {
- // this.showRegion(this.personList[i].region, this.personList[i].regionName)
- let that = this
- new Promise((resolve, reject) => {
- this.postDataAction('/kuaishou/batch/getRegionDetail', {
- regionArr: that.personList[i].region
- }).then(res => {
- if (res.success) {
- // this.populationData.allForm.region = res.result
- that.personList[i].regionName = res.result.map(item => {
- return item.label
- })
- }
- })
- })
- }
- }
- this.ipagination.total = res.result.total
- }
- })
- },
- showRegion(data, name) {
- return new Promise((resolve, reject) => {
- this.postDataAction('/kuaishou/batch/getRegionDetail', {
- regionArr: data
- }).then(res => {
- if (res.success) {
- // this.populationData.allForm.region = res.result
- name = res.result.map(item => {
- return item.label
- })
- }
- })
- })
- },
- //创意信息
- originalityEdit() {
- this.optimizeVisible = true
- this.getActionBarText()
- this.getAction('/kuaishou/batch/getCreativeCategory', {
- accountId: this.getFormData('formProject', 'accountId')
- }).then(result => {
- if (result.success) {
- //console.log(res)
- this.createOptions = result.result
- }
- })
- this.$nextTick(() => {
- if (this.showCreativeData) {
- if (this.showCreativeData.unitType === 7) {
- this.imageCntMax = 8
- } else {
- this.imageCntMax = 15
- }
- this.formOriginality.setFieldsValue(this.showCreativeData)
- }
- })
- },
- //设置通配符
- getChangeAll(type, form, field) {
- var node = document.getElementById(field)
- var v = '-{{' + type + '}}-'
- if (document.selection) {
- //IE
- node.focus()
- var sel = document.selection.createRange()
- sel.text = v
- sel.select()
- if (field == 'campaignName') {
- this[form].setFieldsValue({ campaignName: sel.text })
- } else if (field == 'groupName') {
- this[form].setFieldsValue({ groupName: sel.text })
- }
- } else if (node.selectionStart || node.selectionStart == '0') {
- //MOZILLA/GOOGLE
- var startPos = node.selectionStart
- var endPos = node.selectionEnd
- var restoreTop = node.scrollTop
- node.value = node.value.substring(0, startPos) + v + node.value.substring(endPos, node.value.length)
- if (restoreTop > 0) {
- node.scrollTop = restoreTop
- }
- if (field == 'campaignName') {
- this[form].setFieldsValue({ campaignName: node.value })
- } else if (field == 'groupName') {
- this[form].setFieldsValue({ groupName: node.value })
- }
- node.focus()
- node.selectionStart = startPos + v.length
- node.selectionEnd = startPos + v.length
- // this.campaignName = node.value
- } else {
- //OTHER
- node.value += v
- // console.log(node.value)
- if (field == 'campaignName') {
- this[form].setFieldsValue({ campaignName: node.value })
- } else if (field == 'groupName') {
- this[form].setFieldsValue({ groupName: node.value })
- }
- node.focus()
- // this.campaignName = node.value
- }
- },
- //获取表单的某一个属性值
- getFormData(form, className) {
- return this[form].getFieldValue(className)
- },
- onScroll() {
- // var box = document.getElementById('box')
- // var t = document.documentElement.scrollTop || document.body.scrollTop
- // box.style.top = t + 'px'
- var jump = document.querySelectorAll('.step-jump')
- var distance =
- document.documentElement.scrollTop + 180 || window.pageYOffset + 180 || document.body.scrollTop + 180
- jump.forEach((item, index) => {
- if (distance >= item.offsetTop) {
- this.activeStep = index
- }
- })
- },
- // 锚点点击
- jump(index) {
- // console.log(index)
- this.activeStep = index
- // 用 class=".step-jump" 添加锚点,此时的类名要放在tr上,放在td上不对,
- // 以后做的时候要注意这点,不是表格的时候,如何放置锚点
- let jump = document.querySelectorAll('.step-jump')
- // 通过 offsetTop 获取对象到窗体顶部的距离,然后赋值给 scrollTop,就能实现锚点的功能
- let total = jump[index].offsetTop
- // console.log(total)
- // scrollTop滚动条距离页面的距离
- let distance = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop
- // console.log(distance)
- // 平滑滚动,时长500ms,每10ms一跳,共50跳
- let step = total / 50
- if (total > distance) {
- smoothDown()
- } else {
- let newTotal = distance - total
- step = newTotal / 100
- smoothUp()
- }
- function smoothDown() {
- if (distance < total) {
- distance += step
- document.body.scrollTop = distance
- document.documentElement.scrollTop = distance
- window.pageYOffset = distance
- setTimeout(smoothDown, 1)
- } else {
- document.body.scrollTop = total
- document.documentElement.scrollTop = total
- window.pageYOffset = total
- }
- }
- function smoothUp() {
- if (distance > total) {
- distance -= step
- document.body.scrollTop = distance
- document.documentElement.scrollTop = distance
- window.pageYOffset = distance
- setTimeout(smoothUp, 10)
- } else {
- document.body.scrollTop = total
- document.documentElement.scrollTop = total
- window.pageYOffset = total
- }
- }
- },
- getData(className, formName) {
- return this[formName].getFieldValue(className)
- }
- }
- }
- </script>
- <style lang="scss" scoped>
- /* update_begin author:scott date:20190220 for: 缩小首页布局顶部的高度*/
- $height: 59px;
- .layout .header .user-wrapper .action .anticon,
- .layout .top-nav-header-index .user-wrapper .action .anticon {
- color: #999;
- }
- .layout .header .user-wrapper .action .anticon,
- .layout .top-nav-header-index .user-wrapper .action .anticon {
- color: #999;
- }
- .layout {
- .top-nav-header-index {
- .header-index-wide {
- margin-left: 10px;
- .ant-menu.ant-menu-horizontal {
- height: $height;
- line-height: $height;
- }
- }
- .trigger {
- line-height: 48px;
- font-size: 17px;
- &:hover {
- background: rgba(0, 0, 0, 0.05);
- }
- }
- }
- .header {
- z-index: 2;
- color: #999;
- height: $height;
- background-color: #1890ff;
- transition: background 300ms;
- /* dark 样式 */
- &.dark {
- color: #000000;
- box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
- background-color: white !important;
- }
- }
- .header,
- .top-nav-header-index {
- &.dark .trigger:hover {
- background: rgba(0, 0, 0, 0.05);
- }
- }
- }
- .ant-layout-header {
- height: $height;
- line-height: $height;
- }
- </style>
|