configLaunchInfo.vue 171 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328332933303331333233333334333533363337333833393340334133423343334433453346334733483349335033513352335333543355335633573358335933603361336233633364336533663367336833693370337133723373337433753376337733783379338033813382338333843385338633873388338933903391339233933394339533963397339833993400340134023403340434053406340734083409341034113412341334143415341634173418341934203421342234233424342534263427342834293430343134323433343434353436343734383439344034413442344334443445344634473448344934503451345234533454345534563457345834593460346134623463346434653466346734683469347034713472347334743475347634773478347934803481348234833484348534863487348834893490349134923493349434953496349734983499350035013502350335043505350635073508350935103511351235133514351535163517351835193520352135223523352435253526352735283529353035313532353335343535353635373538353935403541354235433544354535463547354835493550355135523553355435553556355735583559356035613562356335643565356635673568356935703571357235733574357535763577357835793580358135823583358435853586358735883589359035913592359335943595359635973598359936003601360236033604360536063607360836093610361136123613361436153616361736183619362036213622362336243625362636273628362936303631363236333634363536363637363836393640364136423643364436453646364736483649365036513652365336543655365636573658365936603661366236633664366536663667366836693670367136723673367436753676367736783679368036813682368336843685368636873688368936903691369236933694369536963697369836993700370137023703370437053706370737083709371037113712371337143715371637173718371937203721372237233724372537263727372837293730373137323733373437353736373737383739374037413742374337443745374637473748374937503751375237533754375537563757375837593760376137623763376437653766376737683769377037713772377337743775377637773778377937803781378237833784378537863787378837893790379137923793379437953796379737983799380038013802380338043805380638073808380938103811381238133814381538163817381838193820382138223823382438253826382738283829383038313832383338343835383638373838383938403841384238433844384538463847384838493850385138523853385438553856385738583859386038613862386338643865386638673868386938703871387238733874387538763877387838793880388138823883388438853886388738883889389038913892
  1. <template>
  2. <div class="configLaunchInfo">
  3. <a-spin :spinning="spinning">
  4. <a-form :form="form">
  5. <!-- 投放范围 -->
  6. <div class="moduler">
  7. <div class="moduler-title">选择账户</div>
  8. <div>
  9. <div class="row-item">
  10. <div class="hint-item"></div>
  11. <div class="label-item">
  12. <div class="text-item">账户</div>
  13. <div class="required-item"></div>
  14. </div>
  15. <div class="input-item">
  16. <Treeselect :appId.sync="accountId" :multiple="false" request="2,4" ref="treeSelect" style="margin-bottom:8px;width:600px " />
  17. <!-- <Treeselect :appId.sync="accountId" :multiple="false" request="2" reqUrl='/ctop/projectMember/getProjectAccountByUserId' ref="treeSelect" style="margin-bottom:8px;width:580px " /> -->
  18. </div>
  19. </div>
  20. </div>
  21. </div>
  22. <!-- 推广目的 -->
  23. <div class="moduler">
  24. <div class="moduler-title">请选择营销目标</div>
  25. <div class="row-item">
  26. <div class="hint-item">
  27. </div>
  28. <div class="label-item">
  29. <div class="text-item">营销目标</div>
  30. <div class="required-item"></div>
  31. </div>
  32. <div class="input-item">
  33. <a-form-item >
  34. <a-radio-group v-decorator="['campaignType',{initialValue:2 }]" @change="campaignTypeChange">
  35. <a-radio-button :value="2" :disabled="editRecordId!==''">提升应用安装</a-radio-button>
  36. <a-radio-button :value="3" :disabled='true'>获取电商下单</a-radio-button>
  37. <a-radio-button :value="4" :disabled='true'>推广品牌活动</a-radio-button>
  38. <a-radio-button :value="5" :disabled="editRecordId!==''">收集销售线索</a-radio-button>
  39. <a-radio-button :value="7" :disabled="editRecordId!==''">提高应用活跃</a-radio-button>
  40. </a-radio-group>
  41. </a-form-item>
  42. </div>
  43. </div>
  44. </div>
  45. <!-- 基础信息 -->
  46. <div class="moduler">
  47. <div class="moduler-title">请设置基本信息</div>
  48. <!-- <div class="row-item">
  49. <div class="hint-item"> </div>
  50. <div class="label-item">
  51. <div class="text-item">模板名称</div>
  52. <div class="required-item"></div>
  53. </div>
  54. <div class="input-item">
  55. <a-form-item>
  56. <a-input v-model="strategyName" allow-clear />
  57. </a-form-item>
  58. </div>
  59. </div> -->
  60. <div class="row-item">
  61. <div class="hint-item"> </div>
  62. <div class="label-item">
  63. <div class="text-item">计划命名规范</div>
  64. <div class="required-item"></div>
  65. </div>
  66. <div class="input-item">
  67. <a-form-item>
  68. <a-input v-decorator="['campaignName',{ rules: [{ required: true, message: '请填写计划的命名规则' }] }]" allow-clear id="campaignName"/>
  69. </a-form-item>
  70. </div>
  71. </div>
  72. <div class="row-item">
  73. <div class="hint-item"> </div>
  74. <div class="label-item">
  75. <div class="text-item"></div>
  76. </div>
  77. <div class="input-item">
  78. <a-form-item>
  79. <a-tag color="#2db7f5" @click="getChangeAll('日期', 'form', 'campaignName')"
  80. >+日期</a-tag
  81. >
  82. <!-- <a-tag color="#2db7f5" @click="getChangeAll('应用包名', 'form', 'campaignName')"
  83. >+应用包名</a-tag
  84. >
  85. <a-tag color="#2db7f5" @click="getChangeAll('自定义', 'form', 'campaignName')"
  86. >+自定义</a-tag
  87. > -->
  88. </a-form-item>
  89. </div>
  90. </div>
  91. <div class="row-item">
  92. <div class="hint-item"> </div>
  93. <div class="label-item">
  94. <div class="text-item">广告计划单日预算</div>
  95. <div class="required-item"></div>
  96. </div>
  97. <div class="input-item">
  98. <a-form-item>
  99. <a-radio-group v-model="budgetType">
  100. <a-radio-button value="1">不限</a-radio-button>
  101. <a-radio-button value="2">统一预算</a-radio-button>
  102. </a-radio-group>
  103. </a-form-item>
  104. </div>
  105. </div>
  106. <div class="row-item" v-if="budgetType == '2'">
  107. <div class="hint-item"> </div>
  108. <div class="label-item">
  109. <div class="text-item"></div>
  110. <div class="required-item"></div>
  111. </div>
  112. <div class="input-item">
  113. <a-form-item>
  114. <a-input-number
  115. v-decorator="[
  116. 'campaignDayBudget',
  117. {
  118. rules: [{ required: true, message: '不小于500, 不超过100000000,仅支持输入自然数' }],
  119. },
  120. ]"
  121. :min="500"
  122. :precision="0"
  123. :max="100000000"
  124. style="width: 100%"
  125. placeholder="不小于500, 不超过100000000,仅支持输入自然数"
  126. />
  127. </a-form-item>
  128. </div>
  129. </div>
  130. <div class="row-item">
  131. <div class="hint-item"> </div>
  132. <div class="label-item">
  133. <div class="text-item">组命名规范</div>
  134. <div class="required-item"></div>
  135. </div>
  136. <div class="input-item">
  137. <a-form-item>
  138. <a-input v-decorator="['groupName',{ rules: [{ required: true, message: '请填写组的命名规则' }] }]" allow-clear id="groupName"/>
  139. </a-form-item>
  140. </div>
  141. </div>
  142. <div class="row-item">
  143. <div class="hint-item"> </div>
  144. <div class="label-item">
  145. <div class="text-item"></div>
  146. </div>
  147. <div class="input-item">
  148. <a-form-item>
  149. <a-tag color="#2db7f5" @click="getChangeAll('日期', 'form', 'groupName')">+日期</a-tag>
  150. <a-tag color="#2db7f5" @click="getChangeAll('素材名称', 'form', 'groupName')">+素材名称</a-tag>
  151. <!-- <a-tag color="#2db7f5" @click="getChangeAll('定向包', 'form', 'groupName')"
  152. >+定向包</a-tag
  153. > -->
  154. <a-tag color="#2db7f5" @click="getChangeAll('应用名称', 'form', 'groupName')">+应用名称</a-tag>
  155. <a-tag color="#2db7f5" @click="getChangeAll('应用标记', 'form', 'groupName')">+应用标记</a-tag>
  156. <!-- <a-tag color="#2db7f5" @click="getChangeAll('应用包名', 'form', 'groupName')"
  157. >+应用包名</a-tag
  158. > -->
  159. <a-tag color="#2db7f5" @click="getChangeAll('创意制作方式', 'form', 'groupName')"
  160. >+创意制作方式</a-tag
  161. >
  162. <a-tag color="#2db7f5" @click="getChangeAll('广告位置', 'form', 'groupName')"
  163. >+广告位置</a-tag
  164. >
  165. <!-- <a-tag color="#2db7f5" @click="getChangeAll('自定义', 'form', 'groupName')"
  166. >+自定义</a-tag
  167. > -->
  168. </a-form-item>
  169. </div>
  170. </div>
  171. <div class="row-item">
  172. <div class="hint-item"> </div>
  173. <div class="label-item">
  174. <div class="text-item">广告组单日预算</div>
  175. <div class="required-item"></div>
  176. </div>
  177. <div class="input-item">
  178. <a-form-item>
  179. <a-radio-group v-model="dayBudgetType">
  180. <a-radio-button value="1">不限</a-radio-button>
  181. <a-radio-button value="2">统一预算</a-radio-button>
  182. </a-radio-group>
  183. </a-form-item>
  184. </div>
  185. </div>
  186. <div class="row-item" v-if="dayBudgetType=='2'">
  187. <div class="hint-item"> </div>
  188. <div class="label-item">
  189. <div class="text-item"></div>
  190. <div class="required-item"></div>
  191. </div>
  192. <div class="input-item">
  193. <a-form-item>
  194. <a-input-number
  195. v-decorator="[
  196. 'unitDayBudget',
  197. {
  198. rules: [{ required: true, message: '不小于500, 不超过100000000,仅支持输入自然数' }],
  199. },
  200. ]"
  201. style="width: 100%"
  202. placeholder="不小于500, 不超过100000000,仅支持输入自然数"
  203. :min="500"
  204. :precision="0"
  205. />
  206. </a-form-item>
  207. </div>
  208. </div>
  209. </div>
  210. <div class="moduler" v-if="getData('campaignType') === 2">
  211. <div class="moduler-title">目标应用</div>
  212. <div class="ad-range">
  213. <div class="row-item" >
  214. <div class="hint-item"></div>
  215. <div class="label-item">
  216. <div class="text-item">是否单一应用</div>
  217. <div class="required-item"></div>
  218. </div>
  219. <div class="input-item">
  220. <a-form-item >
  221. <a-radio-group v-decorator="['singleAppid', {initialValue:1 }]" @change="singleAppidChange">
  222. <a-radio-button :value="1">是</a-radio-button>
  223. <a-radio-button :value="0">否</a-radio-button>
  224. </a-radio-group>
  225. </a-form-item>
  226. </div>
  227. </div>
  228. <div class="row-item" >
  229. <div class="hint-item"></div>
  230. <div class="label-item">
  231. <div class="text-item">系统类型</div>
  232. <div class="required-item"></div>
  233. </div>
  234. <div class="input-item">
  235. <a-form-item >
  236. <a-radio-group v-model="sysType" @change="sysTypeChange" >
  237. <a-radio-button :value="1">安卓</a-radio-button>
  238. <a-radio-button :value="2">IOS</a-radio-button>
  239. </a-radio-group>
  240. </a-form-item>
  241. </div>
  242. </div>
  243. <div class="row-item" v-if="getFormData('campaignType')==2||getFormData('campaignType')==7">
  244. <div class="hint-item"></div>
  245. <div class="label-item">
  246. <div class="text-item">选择应用</div>
  247. <div class="required-item"></div>
  248. </div>
  249. <div class="input-item">
  250. <a-form-item>
  251. <a-select v-decorator="['appId', { rules: [{ required: true, message: '请选择目标应用' }] }]" showSearch allowClear
  252. placeholder="选择应用目标" optionFilterProp="children" style="width: 500px"
  253. :filterOption="filterOption" @change="appIdChange" :mode="getFormData('singleAppid')==1?'defalut':'multiple'" :maxTagCount='1'
  254. :labelInValue="true">
  255. <a-select-option v-if="getFormData('singleAppid')==0" :value='0' @click="selectAllAppId">选择以下全部</a-select-option>
  256. <a-select-option v-for="appModel in appList" :key="appModel.appId" :value="appModel.appId">
  257. {{
  258. appModel.platform | platform
  259. }}&#12288;&#12288;&#12288;{{ appModel.appName }}&#12288;&nbsp;&#12288; {{ appModel.appVersion }}
  260. </a-select-option>
  261. </a-select>
  262. <a-button type="primary" @click="addApplication" style="margin-left:10px" :loading="tongbuLoading">刷新应用</a-button>
  263. </a-form-item>
  264. </div>
  265. </div>
  266. <div class="row-item">
  267. <div class="hint-item"></div>
  268. <div class="label-item">
  269. <div class="text-item">调起链接</div>
  270. </div>
  271. <div class="input-item">
  272. <a-form-item>
  273. <a-switch default-checked v-model="uriCheck"/>
  274. <span style="color:red"> 需加白使用</span>
  275. <div v-if="uriCheck">
  276. <a-input placeholder="请填写链接" v-decorator="['schemaUri', { rules: [{ message:'链接不能为空'}] }]" />
  277. </div>
  278. </a-form-item>
  279. </div>
  280. </div>
  281. <div class="row-item" v-if="getFormData('singleAppid')==0">
  282. <div class="hint-item"></div>
  283. <div class="label-item">
  284. <div class="text-item">是否多应用分别出价</div>
  285. </div>
  286. <div class="input-item">
  287. <a-form-item >
  288. <a-radio-group v-decorator="['multipleBids', {initialValue:0 }]">
  289. <a-radio-button :value="0">否</a-radio-button>
  290. <a-radio-button :value="1">是</a-radio-button>
  291. </a-radio-group>
  292. </a-form-item>
  293. </div>
  294. </div>
  295. <div class="row-item" v-if="getFormData('multipleBids')==1">
  296. <div class="hint-item"></div>
  297. <div class="label-item">
  298. <div class="text-item">分别出价</div>
  299. </div>
  300. <div class="input-item">
  301. <div style="width:120vh;height:300px;overflow:auto;border:1px solid #f2f2f2;padding:10px">
  302. <p v-for="(item,index) in multipleBidData" :key="index" style="display:flex">
  303. <span style="white-space:nowrap;line-height: 30px;margin-right: 10px;">OCPM出价</span>
  304. <a-input-number
  305. style="width:150px"
  306. :max="10000"
  307. :step="0.1"
  308. v-model="item.cpaBid"
  309. />
  310. <span style="white-space:nowrap;line-height: 30px;margin-right: 10px;">深度转化出价</span>
  311. <a-input-number
  312. style="width:150px"
  313. :max="10000"
  314. :step="0.1"
  315. v-model="item.deepConversionBid"
  316. />
  317. <span style="margin-left:20px;white-space:nowrap;line-height: 30px;margin-right: 10px;">渠道号</span>
  318. <a-input style="width:150px" placeholder="请填写渠道号" v-model="item.channelCode" />
  319. <a-icon
  320. @click="checkOneBid(item)"
  321. type="check" style="margin-left:20px;white-space:nowrap;line-height: 30px;margin-right: 10px;cursor:pointer;color:green" />
  322. <span style="margin:5px;width:50%">{{item.label}}</span>
  323. </p>
  324. </div>
  325. </div>
  326. </div>
  327. <div class="row-item" v-if="getFormData('campaignType') == 3">
  328. <div class="hint-item"></div>
  329. <div class="label-item">
  330. <div class="text-item">转化类型</div>
  331. <div class="required-item"></div>
  332. </div>
  333. <div class="input-item">
  334. <a-form-item >
  335. <a-radio-group buttonStyle="solid"
  336. v-decorator="['urlType', { rules: [{ required: true, message: '请选择目标应用' }], initialValue: '1' }]">
  337. <a-radio-button value="1">淘宝商品</a-radio-button>
  338. <a-radio-button value="2">淘客商品</a-radio-button>
  339. </a-radio-group>
  340. </a-form-item>
  341. </div>
  342. </div>
  343. <div class="row-item" v-if="getFormData('campaignType') == 3||getFormData('campaignType') == 4||getFormData('campaignType') == 5">
  344. <div class="hint-item"></div>
  345. <div class="label-item">
  346. <div class="text-item">链接</div>
  347. <!-- <div class="required-item"></div> -->
  348. </div>
  349. <div class="input-item">
  350. <a-form-item v-if="getFormData('campaignType') != 2" :class="{ 'else-label': getFormData('campaignType') == 3 }">
  351. <a-input placeholder="请填写链接" v-decorator="['url', { rules: [{ required: true,message:'链接不能为空'}] }]" />
  352. </a-form-item>
  353. </div>
  354. </div>
  355. <div class="row-item" v-if="getFormData('campaignType') == 2||getFormData('campaignType') == 4||getFormData('campaignType') == 5">
  356. <div class="hint-item"></div>
  357. <div class="label-item">
  358. <div class="text-item">转化追踪</div>
  359. <!-- <div class="required-item"></div> -->
  360. </div>
  361. <div class="input-item">
  362. <a-form-item >
  363. <span v-if="convertId&&!convert" style="display:block;font-size:16px">已选择转化目标: {{convertId.label}}</span>
  364. <a-button type="primary" @click="showConvert">{{convertId?'更换转化目标':'选择转化目标'}}</a-button>
  365. </a-form-item>
  366. <div style="margin-top:10px">
  367. <a-form-item v-if="sysType==1" >
  368. <a-checkbox v-decorator="[
  369. 'useAppMarket',
  370. {
  371. valuePropName: 'checked',
  372. initialValue: false,
  373. },
  374. ]">
  375. 优先从系统应用商店下载
  376. </a-checkbox>
  377. </a-form-item>
  378. <a-form-item v-if="sysType==1&&getData('useAppMarket')">
  379. 请勾选投放应用已上架的应用商店(默认全选)
  380. <a-checkbox-group v-model="appStore">
  381. <a-checkbox value="huawei">华为</a-checkbox>
  382. <a-checkbox value="oppo">OPPO</a-checkbox>
  383. <a-checkbox value="vivo">VIVO</a-checkbox>
  384. <a-checkbox value="xiaomi">小米</a-checkbox>
  385. <a-checkbox value="meizu">魅族</a-checkbox>
  386. <a-checkbox value="smartisan">锤子</a-checkbox>
  387. </a-checkbox-group>
  388. </a-form-item>
  389. </div>
  390. </div>
  391. </div>
  392. </div>
  393. </div>
  394. <div class="moduler" v-if="getData('campaignType') === 5">
  395. <div class="moduler-title">链接</div>
  396. <div class="ad-range">
  397. <div class="row-item">
  398. <div class="hint-item"></div>
  399. <div class="label-item">
  400. <div class="text-item">链接</div>
  401. <div class="required-item"></div>
  402. </div>
  403. <div class="input-item">
  404. <a-form-item>
  405. <a-input placeholder="请填写链接" v-decorator="['url', { rules: [{ required: true,message:'链接不能为空'}] }]" />
  406. </a-form-item>
  407. </div>
  408. </div>
  409. <div class="row-item" v-if="getFormData('campaignType') == 2||getFormData('campaignType') == 4||getFormData('campaignType') == 5">
  410. <div class="hint-item"></div>
  411. <div class="label-item">
  412. <div class="text-item">转化追踪</div>
  413. <!-- <div class="required-item"></div> -->
  414. </div>
  415. <div class="input-item">
  416. <a-form-item >
  417. <span v-if="convertId&&!convert" style="display:block;font-size:16px">已选择转化目标: {{convertId.label}}</span>
  418. <a-button type="primary" @click="showConvert">{{convertId?'更换转化目标':'选择转化目标'}}</a-button>
  419. </a-form-item>
  420. </div>
  421. </div>
  422. </div>
  423. </div>
  424. <div class="moduler" v-if="getData('campaignType') === 7">
  425. <div class="moduler-title">链接</div>
  426. <div class="row-item">
  427. <div class="hint-item"></div>
  428. <div class="label-item">
  429. <div class="text-item">选择应用</div>
  430. <div class="required-item"></div>
  431. </div>
  432. <div class="input-item">
  433. <a-form-item>
  434. <a-select v-decorator="['appId', { rules: [{ required: true, message: '请选择目标应用' }] }]" showSearch allowClear
  435. placeholder="选择应用目标" optionFilterProp="children" style="width: 500px"
  436. :filterOption="filterOption" @change="appIdChange" :labelInValue="true">
  437. <a-select-option v-for="appModel in appList" :key="appModel.appId" :value="appModel.appId">
  438. {{ appModel.appName }}&#12288;&nbsp;&#12288; {{ appModel.appVersion }}&#12288;&#12288;&#12288;{{
  439. appModel.platform | platform
  440. }}
  441. </a-select-option>
  442. </a-select>
  443. <a-button type="primary" @click="addApplication" style="margin-left:10px" :loading="tongbuLoading">刷新应用</a-button>
  444. </a-form-item>
  445. </div>
  446. </div>
  447. <div class="row-item">
  448. <div class="hint-item"></div>
  449. <div class="label-item">
  450. <div class="text-item">调起链接</div>
  451. <div class="required-item"></div>
  452. </div>
  453. <div class="input-item">
  454. <a-form-item>
  455. <a-input placeholder="请填写链接" v-decorator="['schemaUri', { rules: [{ required: true,message:'链接不能为空'}] }]" />
  456. </a-form-item>
  457. </div>
  458. </div>
  459. <div class="row-item">
  460. <div class="hint-item"></div>
  461. <div class="label-item">
  462. <div class="text-item">H5链接</div>
  463. <div class="required-item"></div>
  464. </div>
  465. <div class="input-item">
  466. <a-form-item>
  467. <a-input placeholder="请填写H5链接" v-decorator="['url', { rules: [{ required: true,message:'H5链接不能为空'}] }]" />
  468. </a-form-item>
  469. </div>
  470. </div>
  471. </div>
  472. <div class="moduler">
  473. <div class="moduler-title">用户定向
  474. <!-- <div style="margin-left:30px;position:relative;top:-2px">
  475. <a-radio-group v-model="useDirectional" @change="useDirectionalChange">
  476. <a-radio :value="1">
  477. 不使用定向
  478. </a-radio>
  479. <a-radio :value="0">
  480. 使用定向包
  481. </a-radio>
  482. </a-radio-group>
  483. </div> -->
  484. </div>
  485. <div class="ad-range" v-if="useDirectional==1">
  486. <div class="row-item">
  487. <div class="hint-item"></div>
  488. <div class="label-item">
  489. <div class="text-item">地域</div>
  490. <div class="required-item"></div>
  491. </div>
  492. <div class="input-item">
  493. <a-form-item>
  494. <a-radio-group v-model="district" @change="cityChange">
  495. <a-radio-button value="NONE">不限</a-radio-button>
  496. <a-radio-button value="CITY">按省市</a-radio-button>
  497. <!-- <a-radio-button value="COUNTY">按区县</a-radio-button> -->
  498. </a-radio-group>
  499. </a-form-item>
  500. <div class="region" style="margin-top:20px" v-show="district!='NONE'">
  501. <!-- 省市 -->
  502. <div class="provincyCity" v-if="district=='CITY'">
  503. <!-- <linkMultiSelect title='省份' :listArr='regionList' :maxLayers='2' :listUrl='regionCityListUrl' @getSelectedArr='getSelectedCityArr'/> -->
  504. <select-region :checkData.sync="regionList" :dataValue="regionList" />
  505. </div>
  506. <!-- 区县 -->
  507. <!-- <div class="district" v-else-if="district=='COUNTY'">
  508. <linkMultiSelect title='省份' :listArr='regionList' :maxLayers='3' :listUrl='regionCityListUrl' @getSelectedArr='getSelectedCountyArr'/>
  509. </div> -->
  510. </div>
  511. </div>
  512. </div>
  513. <div class="row-item">
  514. <div class="hint-item"></div>
  515. <div class="label-item">
  516. <div class="text-item">性别</div>
  517. <div class="required-item"></div>
  518. </div>
  519. <div class="input-item">
  520. <a-form-item>
  521. <a-radio-group v-decorator="['gender', {initialValue:0 }]" >
  522. <a-radio-button :value="0">不限</a-radio-button>
  523. <a-radio-button :value="2">男</a-radio-button>
  524. <a-radio-button :value="1">女</a-radio-button>
  525. </a-radio-group>
  526. </a-form-item>
  527. </div>
  528. </div>
  529. <div class="row-item">
  530. <div class="hint-item"></div>
  531. <div class="label-item">
  532. <div class="text-item">年龄</div>
  533. <div class="required-item"></div>
  534. </div>
  535. <div class="input-item">
  536. <a-form-item>
  537. <radioCheck v-model="agesRange" :options="ageArr" @change='getAgeSelect' />
  538. </a-form-item>
  539. </div>
  540. </div>
  541. <div class="row-item">
  542. <div class="hint-item"></div>
  543. <div class="label-item">
  544. <div class="text-item">操作系统</div>
  545. <div class="required-item"></div>
  546. </div>
  547. <div class="input-item">
  548. <a-form-item>
  549. <a-radio-group v-decorator="['platformOs', {initialValue:1 }]" @change="platformOsChange">
  550. <!-- <a-radio-button :value="0">不限</a-radio-button> -->
  551. <a-radio-button :value="1">Android</a-radio-button>
  552. <a-radio-button :value="2">IOS</a-radio-button>
  553. </a-radio-group>
  554. </a-form-item>
  555. <div style="margin-top:24px" v-if="getFormData('platformOs')!=0">
  556. <div v-if="getFormData('platformOs')==1">
  557. <a-form-item>
  558. <a-radio-group v-decorator="['androidOsv',{initialValue: 3,}]">
  559. <a-radio :value="3">不限</a-radio>
  560. <a-radio :value="4">4x+</a-radio>
  561. <a-radio :value="5">5x+</a-radio>
  562. <a-radio :value="6">6x+</a-radio>
  563. <a-radio :value="7">7x+</a-radio>
  564. </a-radio-group>
  565. </a-form-item>
  566. </div>
  567. <div v-if="getFormData('platformOs')==2">
  568. <a-form-item>
  569. <a-radio-group v-decorator="['iosOsv',{initialValue: 6,}]">
  570. <a-radio :value="6">不限</a-radio>
  571. <a-radio :value="7">7x+</a-radio>
  572. <a-radio :value="8">8x+</a-radio>
  573. <a-radio :value="9">9x+</a-radio>
  574. <a-radio :value="10">10x+</a-radio>
  575. </a-radio-group>
  576. </a-form-item>
  577. </div>
  578. </div>
  579. </div>
  580. </div>
  581. <div class="row-item" v-if="getFormData('platformOs')!=2">
  582. <div class="hint-item"></div>
  583. <div class="label-item">
  584. <div class="text-item">设备品牌</div>
  585. <div class="required-item"></div>
  586. </div>
  587. <div class="input-item">
  588. <a-form-item>
  589. <a-radio-group v-model="deviceBrand">
  590. <a-radio-button :value="0">不限</a-radio-button>
  591. <a-radio-button :value="1">选择品牌</a-radio-button>
  592. </a-radio-group>
  593. </a-form-item>
  594. <div style="width: 400px; margin-top: 24px;" class="inventoryTypes" v-if="deviceBrand==1">
  595. <div class="inventory-tags-lists-header" style="padding-left:15px">
  596. <div class="inventory-tags-lists-name"><strong>品牌名称</strong></div>
  597. </div>
  598. <div class="inventory-tags-lists-container" >
  599. <a-form-item>
  600. <a-checkbox-group
  601. v-decorator="['deviceBrand', { rules: [{ required: true, message: '请选择设备品牌' }] }]"
  602. >
  603. <a-checkbox :value="1" style="margin-bottom: 8px">OPPO</a-checkbox>
  604. <a-checkbox :value="2" style="margin-bottom: 8px">VIVO</a-checkbox>
  605. <a-checkbox :value="3" style="margin-bottom: 8px">华为</a-checkbox>
  606. <a-checkbox :value="4" style="margin-bottom: 8px">小米</a-checkbox>
  607. <a-checkbox :value="5" style="margin-bottom: 8px">荣耀</a-checkbox>
  608. <a-checkbox :value="6" style="margin-bottom: 8px">三星</a-checkbox>
  609. <a-checkbox :value="7" style="margin-bottom: 8px">金立</a-checkbox>
  610. <a-checkbox :value="8" style="margin: 0 0 8px 0">魅族</a-checkbox>
  611. <a-checkbox :value="9" style="margin-bottom: 8px">乐视</a-checkbox>
  612. <a-checkbox :value="10" style="margin-bottom: 8px">其他</a-checkbox>
  613. <a-checkbox :value="11" v-if="getFormData('platformOs') == 0" style="margin-bottom: 8px">苹果</a-checkbox>
  614. </a-checkbox-group>
  615. </a-form-item>
  616. </div>
  617. </div>
  618. </div>
  619. </div>
  620. <div class="row-item">
  621. <div class="hint-item"></div>
  622. <div class="label-item">
  623. <div class="text-item">设备价格</div>
  624. <div class="required-item"></div>
  625. </div>
  626. <div class="input-item">
  627. <a-form-item>
  628. <a-radio-group v-model="devicePrice">
  629. <a-radio-button :value="0">不限</a-radio-button>
  630. <a-radio-button :value="1">选择价格</a-radio-button>
  631. </a-radio-group>
  632. </a-form-item>
  633. <div style="width: 400px; margin-top: 24px;" class="inventoryTypes" v-if="devicePrice==1">
  634. <div class="inventory-tags-lists-header" style="padding-left:15px">
  635. <div class="inventory-tags-lists-name"><strong>价格区间</strong></div>
  636. </div>
  637. <div class="inventory-tags-lists-container" >
  638. <a-form-item>
  639. <a-checkbox-group
  640. v-decorator="['devicePrice', { rules: [{ required: true, message: '请选择设备价格' }] }]"
  641. style="width: 120%"
  642. >
  643. <a-checkbox :value="1" style="margin-bottom: 8px">1500以下</a-checkbox>
  644. <a-checkbox :value="2" style="margin-bottom: 8px">1501~2000</a-checkbox>
  645. <a-checkbox :value="3" style="margin-bottom: 8px">2001~2500</a-checkbox>
  646. <a-checkbox :value="4" style="margin-bottom: 8px">2501~3000</a-checkbox>
  647. <a-checkbox :value="5" style="margin-left: 0; margin-bottom: 8px">3001~3500</a-checkbox>
  648. <a-checkbox :value="6" style="margin-bottom: 8px">3501~4000</a-checkbox>
  649. <a-checkbox :value="7" style="margin-bottom: 8px">4001~4500</a-checkbox>
  650. <a-checkbox :value="8" style="margin-bottom: 8px">4501~5000</a-checkbox>
  651. <a-checkbox :value="9" style="margin-left: 0; margin-bottom: 8px">5001~5500</a-checkbox>
  652. <a-checkbox :value="10" style="margin-bottom: 8px">5500以上</a-checkbox>
  653. </a-checkbox-group>
  654. </a-form-item>
  655. </div>
  656. </div>
  657. </div>
  658. </div>
  659. <div class="row-item" v-if="getFormData('platformOs')==1">
  660. <div class="hint-item"></div>
  661. <div class="label-item">
  662. <div class="text-item">APP行为</div>
  663. <div class="required-item"></div>
  664. </div>
  665. <div class="input-item">
  666. <a-form-item>
  667. <a-radio-group v-model="appType" @change="getAppType">
  668. <a-radio-button value="0">不限</a-radio-button>
  669. <a-radio-button value="1">按分类</a-radio-button>
  670. <a-radio-button value="2">按APP名称</a-radio-button>
  671. </a-radio-group>
  672. </a-form-item>
  673. <a-form-item v-if="appType==='1'">
  674. <a-select
  675. mode="multiple"
  676. style="width: 100%"
  677. optionFilterProp="children"
  678. showSearch
  679. :filterOption="filterOption"
  680. v-decorator="['appInterest', { rules: [{ required: true, message: '请选择APP行为' }] }]"
  681. >
  682. <a-select-option v-for="item in optionsAppActive" :key="item.tagId" :value="item.tagId">{{
  683. item.tagName
  684. }}</a-select-option>
  685. </a-select>
  686. </a-form-item>
  687. <a-form-item v-if="appType==='2'">
  688. <div style="position: relative" v-clickoutside="handleClose">
  689. <a-input
  690. placeholder="请输入搜索内容"
  691. @change="getAppAll"
  692. @focus="getAppAllElse"
  693. style="width: 100%; position: relative"
  694. v-model="appListValue"
  695. />
  696. <div
  697. style="
  698. width: 100%;
  699. position: absolute;
  700. z-index: 10;
  701. height: 200px;
  702. background: white;
  703. overflow: auto;
  704. box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.15);
  705. "
  706. v-if="closeDialog"
  707. >
  708. <ul>
  709. <li style="padding: 0 10px">
  710. <a-checkbox
  711. style="float: left; margin: 0 5px"
  712. @change="onCheckAllChangeApp"
  713. :indeterminate="indeterminateApp"
  714. :checked="checkAllApp"
  715. ></a-checkbox
  716. >全选
  717. </li>
  718. <a-checkbox-group @change="onChangeApp" v-model="checkArr" class="home-card" style="width: 100%">
  719. <li style="padding: 0 10px; width: 100%" v-for="item of optionsApp" :key="item.appId">
  720. <a-checkbox :value="item.appId" style="float: left; margin: 0 5px"></a-checkbox>{{ item.appName }}
  721. </li>
  722. </a-checkbox-group>
  723. </ul>
  724. </div>
  725. <div style="width: 100%" v-if="optionsAll.length > 0">
  726. <a-tag v-for="item of optionsAll" :key="item" closable :afterClose="() => log(item)">
  727. {{ showAppName(item) ? showAppName(item) : item }}
  728. </a-tag>
  729. </div>
  730. </div>
  731. </a-form-item>
  732. </div>
  733. </div>
  734. <div class="row-item">
  735. <div class="hint-item"></div>
  736. <div class="label-item">
  737. <div class="text-item">自定义人群</div>
  738. <div class="required-item"></div>
  739. </div>
  740. <div class="input-item">
  741. <a-form-item>
  742. <a-radio-group v-decorator="['customCrowd', {initialValue:'0' }]" @change="customCrowdChange">
  743. <a-radio-button value="0">不限</a-radio-button>
  744. <a-radio-button value="1">定向</a-radio-button>
  745. <a-radio-button value="2">排除</a-radio-button>
  746. <a-radio-button value="3">同时定向排除</a-radio-button>
  747. </a-radio-group>
  748. </a-form-item>
  749. <div class="dingxiang_paichu" v-if="getFormData('customCrowd')&&getFormData('customCrowd')!='0'" style="width:60%">
  750. <a-tabs v-model="tabKey" @change="retargetTabChange" >
  751. <a-tab-pane key="1" tab="定向池" v-if="getFormData('customCrowd')!='2'">
  752. <a-table
  753. :columns="retargetColumns"
  754. :row-key="record => record.key"
  755. :data-source="retargetDataAll"
  756. :loading="loading"
  757. style="width:100%;margin:15px 0"
  758. :pagination='false'
  759. @change="retargetTableChange"
  760. :scroll="{ y: 250 }"
  761. :row-selection="rowSelection"
  762. bordered
  763. >
  764. <template slot="name" slot-scope="name"> {{ name }} </template>
  765. <template slot="populationType" slot-scope="populationType"> {{ populationType | customCrowdHandler}} </template>
  766. </a-table>
  767. </a-tab-pane>
  768. <a-tab-pane key="2" tab="排除池" v-if="getFormData('customCrowd')!='1'">
  769. <a-table
  770. :columns="retargetColumns"
  771. :row-key="record => record.key"
  772. :data-source="retargetDataAll"
  773. :loading="loading"
  774. style="width:100%;margin:15px 0"
  775. :pagination='false'
  776. @change="retargetTableChange"
  777. :scroll="{ y: 250 }"
  778. :row-selection="rowSelection2"
  779. bordered
  780. >
  781. <template slot="name" slot-scope="name"> {{ name }} </template>
  782. <template slot="populationType" slot-scope="populationType"> {{ populationType |customCrowdHandler}} </template>
  783. </a-table>
  784. </a-tab-pane>
  785. <a-button slot="tabBarExtraContent" type='primary' @click="refreshPopulation" :loading='refreshPopulationLoading'>刷新人群包</a-button>
  786. </a-tabs>
  787. </div>
  788. </div>
  789. </div>
  790. <div class="row-item">
  791. <div class="hint-item"></div>
  792. <div class="label-item">
  793. <div class="text-item">过滤已转化用户</div>
  794. <div class="required-item"></div>
  795. </div>
  796. <div class="input-item">
  797. <a-form-item>
  798. <a-radio-group v-decorator="['filterConvertedLevel', { initialValue: 0 }]">
  799. <a-radio-button :value="0">不限</a-radio-button>
  800. <a-radio-button :value="1">广告组</a-radio-button>
  801. <a-radio-button :value="2">广告计划</a-radio-button>
  802. <a-radio-button :value="3">本账户</a-radio-button>
  803. <a-radio-button :value="4">公司主体</a-radio-button>
  804. <a-radio-button :value="5" :disabled="getData('campaignType')===5||getData('campaignType')===7">APP</a-radio-button>
  805. </a-radio-group>
  806. </a-form-item>
  807. </div>
  808. </div>
  809. <div class="row-item" >
  810. <div class="hint-item"></div>
  811. <div class="label-item">
  812. <div class="text-item">是否开启智能扩量</div>
  813. <div class="required-item"></div>
  814. </div>
  815. <div class="input-item">
  816. <a-form-item>
  817. <a-radio-group v-decorator="['isOpen', { initialValue: 0 }]" @change="isOpenChange">
  818. <a-radio-button :value='0'>关闭</a-radio-button>
  819. <a-radio-button :value="1">开启</a-radio-button>
  820. </a-radio-group>
  821. </a-form-item>
  822. <div style="width: 400px; margin-top: 24px;" class="inventoryTypes" v-show="getFormData('isOpen')==1">
  823. <div class="inventory-tags-lists-container">
  824. <a-checkbox v-model="noAgeBreak">不可突破年龄</a-checkbox>
  825. <a-checkbox v-model="noGenderBreak">不可突破性别</a-checkbox>
  826. <a-checkbox v-model="noAreaBreak">不可突破地域</a-checkbox>
  827. </div>
  828. </div>
  829. </div>
  830. </div>
  831. </div>
  832. <div class="ad-range2" v-if="useDirectional==0">
  833. <div style="position:relative" class="ad-range2-title">
  834. <span>当前选择模板数量:{{directionalCheckedList.length}}</span>
  835. <a-checkbox :indeterminate="indeterminateDirectional" :checked="checkAllDirectional" @change="onCheckAllDirectionalChange" class="quanxuanDirectional">
  836. <span>点击全选</span>
  837. </a-checkbox>
  838. </div>
  839. <a-spin :spinning="directionalSpinning">
  840. <div class="title-list">
  841. <a-checkbox-group v-model="directionalCheckedList" @change="directionalChange">
  842. <div class="title-item" v-for="(item,index) in directionalList" :key='index'>
  843. <label>
  844. <a-checkbox :value='item.id'>
  845. {{item.templateName+'_('+item.id+')'}}
  846. </a-checkbox>
  847. </label>
  848. </div>
  849. </a-checkbox-group>
  850. </div>
  851. </a-spin>
  852. </div>
  853. </div>
  854. <!-- <div class="moduler">
  855. <div class="moduler-title">预算和排期</div>
  856. <div class="ad-range">
  857. <div class="row-item" >
  858. <div class="hint-item"></div>
  859. <div class="label-item">
  860. <div class="text-item">投放时间</div>
  861. <div class="required-item"></div>
  862. </div>
  863. <div class="input-item">
  864. <a-form-item>
  865. <a-radio-group v-decorator="['scheduleType', { initialValue:'SCHEDULE_FROM_NOW' }]" @change="scheduleTypeChange">
  866. <a-radio-button value="SCHEDULE_FROM_NOW">从今天起长期投放</a-radio-button>
  867. <a-radio-button value="SCHEDULE_START_END">设置开始和结束时间</a-radio-button>
  868. </a-radio-group>
  869. <p style="margin-top:15px">
  870. <a-range-picker
  871. @change="dateChange"
  872. v-model="dateRange"
  873. :disabled-date="disabledDate"
  874. v-if="getFormData('scheduleType')=='SCHEDULE_START_END'"
  875. />
  876. </p>
  877. </a-form-item>
  878. </div>
  879. </div>
  880. <div class="row-item">
  881. <div class="hint-item"></div>
  882. <div class="label-item">
  883. <div class="text-item">投放时段</div>
  884. <div class="required-item"></div>
  885. </div>
  886. <div class="input-item">
  887. <a-form-item>
  888. <a-radio-group v-decorator="['scheduleTimes', { initialValue:'' }]" >
  889. <a-radio-button value=''>不限</a-radio-button>
  890. <a-radio-button value="SpecifiedTImePeriod">指定时间段</a-radio-button>
  891. </a-radio-group>
  892. <div
  893. v-show="getFormData('scheduleTimes')=='SpecifiedTImePeriod'"
  894. style="margin-top:15px"
  895. >
  896. <scheduleTime
  897. style="width:100%"
  898. :scheduleTime.sync="scheduleTimeData"
  899. ref="selectCheck"
  900. />
  901. </div>
  902. </a-form-item>
  903. </div>
  904. </div>
  905. <div class="row-item">
  906. <div class="hint-item">
  907. </div>
  908. <div class="label-item">
  909. <div class="text-item">策略预算</div>
  910. <div class="required-item"></div>
  911. </div>
  912. <div class="input-item">
  913. <a-form-item>
  914. <a-radio-group v-decorator="['strategyBudget', { initialValue:'' }]" >
  915. <a-radio-button value=''>不限</a-radio-button>
  916. <a-radio-button value="unifiedBudget">统一预算</a-radio-button>
  917. </a-radio-group>
  918. <a-input-group compact v-if="getFormData('strategyBudget')=='unifiedBudget'" style="margin-top:20px">
  919. <a-select :disabled="true" v-decorator="['budgetMode', { initialValue:'TOTAL' }]">
  920. <a-select-option value="TOTAL" >总预算</a-select-option>
  921. <a-select-option
  922. value="TOTAL"
  923. v-if="getFormData('smartBidType')=='SMART_BID_CUSTOM'"
  924. >总预算</a-select-option>
  925. </a-select>
  926. <a-input style="width: 25%" v-decorator="['budget', { initialValue:300 }]" />
  927. </a-input-group>
  928. <span class="tip" v-if="getFormData('budget')<300">请输入预算,不少于300元,不超过9999999.99元</span>
  929. </a-form-item>
  930. </div>
  931. </div>
  932. </div>
  933. </div> -->
  934. <div class="moduler">
  935. <div class="moduler-title">优化目标和付费</div>
  936. <div class="ad-range">
  937. <div class="row-item" >
  938. <div class="hint-item"></div>
  939. <div class="label-item">
  940. <div class="text-item">优化目标</div>
  941. <!-- <div class="required-item"></div> -->
  942. </div>
  943. <div class="input-item">
  944. <a-form-item>
  945. <a-radio-group v-decorator="['bidType', { initialValue:10 }]" @change="bidTypeChange">
  946. <!-- <a-radio-button :value="2">封面点击数</a-radio-button> -->
  947. <a-radio-button :value="10">转化数</a-radio-button>
  948. </a-radio-group>
  949. </a-form-item>
  950. </div>
  951. </div>
  952. <div class="row-item" v-if="getFormData('bidType')==10">
  953. <div class="hint-item"></div>
  954. <div class="label-item">
  955. <div class="text-item">转化目标</div>
  956. <!-- <div class="required-item"></div> -->
  957. </div>
  958. <div class="input-item">
  959. <a-form-item>
  960. <a-select size="default" v-decorator="['ocpxActionType']" style="width: 200px" @change="handleChange">
  961. <a-select-option :value="2">行为数</a-select-option>
  962. <!-- v-if="getFormData('campaignType') == 2 && groupTypeData.isActivate == 1 -->
  963. <a-select-option :value="180" >激活</a-select-option>
  964. <a-select-option :value="53" v-if="
  965. groupTypeData.isFormSubmit == '1'
  966. ">表单提交</a-select-option>
  967. <a-select-option :value="394" v-if="
  968. groupTypeData.isOrderSubmit == '1'
  969. ">订单提交</a-select-option>
  970. <a-select-option :value="348" v-if="
  971. groupTypeData.isValidClue == '1'
  972. ">使用有效线索</a-select-option>
  973. <a-select-option :value="383" v-if="
  974. groupTypeData.isCreditGrant == '1'
  975. ">授信出价</a-select-option>
  976. <a-select-option :value="384" v-if="
  977. groupTypeData.isWanJian == '1'
  978. ">完件出价</a-select-option>
  979. <a-select-option :value="190" v-if="
  980. groupTypeData.isPurchase == '1'
  981. ">付费出价</a-select-option>
  982. <a-select-option :value="191" v-if="
  983. groupTypeData.isFirstdayRoi == '1'
  984. ">首日ROI</a-select-option>
  985. <a-select-option :value="396" v-if="
  986. groupTypeData.isRegister == '1'
  987. ">注册优化目标</a-select-option>
  988. <a-select-option :value="324" v-if="
  989. groupTypeData.isAppInvoked == '1'
  990. ">唤起应用</a-select-option>
  991. <a-select-option :value="715" v-if="
  992. groupTypeData.isAddWechat == '1'
  993. ">微信复制优化目标</a-select-option>
  994. <a-select-option :value="716" v-if="
  995. groupTypeData.isMultiConversion == '1'
  996. ">多转化事件</a-select-option>
  997. <a-select-option :value="717" v-if="
  998. groupTypeData.isAdWatchTimes == '1'
  999. ">广告观看次数</a-select-option>
  1000. </a-select>
  1001. </a-form-item>
  1002. </div>
  1003. </div>
  1004. <div class="row-item" v-if="(getFormData('ocpxActionType') == 180 || getFormData('ocpxActionType') == 53) && groupTypeData.deepConversionTypes && groupTypeData.deepConversionTypes.length > 0 ">
  1005. <div class="hint-item"></div>
  1006. <div class="label-item">
  1007. <div class="text-item">深度转化目标</div>
  1008. <!-- <div class="required-item"></div> -->
  1009. </div>
  1010. <div class="input-item">
  1011. <a-form-item>
  1012. <a-select v-decorator="['deepConversionType']" allowClear style="width: 200px">
  1013. <a-select-option v-for="(items, index) of groupTypeData.deepConversionTypes" :key="index" :value='items.deepConversionType'>
  1014. {{ items.desc }}</a-select-option>
  1015. </a-select>
  1016. </a-form-item>
  1017. </div>
  1018. </div>
  1019. <div class="row-item" >
  1020. <div class="hint-item"></div>
  1021. <div class="label-item">
  1022. <div class="text-item">计费方式</div>
  1023. <!-- <div class="required-item"></div> -->
  1024. </div>
  1025. <div class="input-item">
  1026. <a-form-item>
  1027. <a-radio-group v-model="chargeMethods">
  1028. <a-radio-button v-if="getFormData('bidType')==2" value="CPC">点击计费(CPC)</a-radio-button>
  1029. <a-radio-button v-if="getFormData('bidType')==10" value="OCPM">按展示付费(oCPM)</a-radio-button>
  1030. </a-radio-group>
  1031. </a-form-item>
  1032. </div>
  1033. </div>
  1034. <div class="row-item" v-if="getFormData('bidType')==2">
  1035. <div class="hint-item">
  1036. </div>
  1037. <div class="label-item">
  1038. <div class="text-item">点击出价</div>
  1039. <div class="required-item"></div>
  1040. </div>
  1041. <div class="input-item">
  1042. <a-form-item>
  1043. <a-input-number
  1044. style="width:200px"
  1045. :max="10000"
  1046. :step="0.1"
  1047. v-decorator="['bid', {rules:validationRules.bid} ]"
  1048. />
  1049. <span style="margin-left:5px">元</span>
  1050. <!-- <span style="margin-left:20px">请填入必填字段,获取建议出价</span> -->
  1051. </a-form-item>
  1052. <span
  1053. class="tip"
  1054. v-if="getFormData('bid')<0.1"
  1055. >请输入点击出价,不少于0.1元,不超过10000元</span>
  1056. </div>
  1057. </div>
  1058. <div class="row-item" v-if="getFormData('bidType')==10&&getFormData('ocpxActionType')!= 191&&getFormData('multipleBids')!==1">
  1059. <div class="hint-item">
  1060. </div>
  1061. <div class="label-item">
  1062. <div class="text-item">转化目标出价</div>
  1063. <div class="required-item"></div>
  1064. </div>
  1065. <div class="input-item">
  1066. <a-form-item>
  1067. <!-- <a-input-number
  1068. style="width:200px"
  1069. :max="10000"
  1070. :step="0.1"
  1071. v-decorator="['cpaBid', {rules:validationRules.bid} ]"
  1072. /> -->
  1073. <a-input style="width:200px;ime-mode:disabled" v-decorator="['cpaBid', {rules:validationRules.bid} ]" @blur="checkCpaBid"
  1074. @keypress="keyDown">
  1075. </a-input>
  1076. <span style="margin-left:5px">元</span>
  1077. <br>
  1078. <span style="color:red">单出价请输入单数字,阶梯出价请用/隔开</span>
  1079. </a-form-item>
  1080. <span
  1081. class="tip"
  1082. v-if="checkCpaBidBloon"
  1083. >不允许出现除"-"和"/"之外的所有字符,并且二者不可同时出现</span>
  1084. </div>
  1085. </div>
  1086. <div class="row-item" v-if="getFormData('bidType')==10&&getFormData('ocpxActionType') == 191">
  1087. <div class="hint-item">
  1088. </div>
  1089. <div class="label-item">
  1090. <div class="text-item">ROI系数</div>
  1091. <div class="required-item"></div>
  1092. </div>
  1093. <div class="input-item">
  1094. <a-form-item>
  1095. <a-input-number
  1096. style="width:200px"
  1097. :max="100"
  1098. :min="0"
  1099. :step="0.01"
  1100. v-decorator="['roiRatio', { rules: [{ required: true, message: 'ROI系数必填' }] }]"
  1101. />
  1102. <span style="margin-left:5px">元</span>
  1103. </a-form-item>
  1104. <span
  1105. class="tip"
  1106. v-if="getFormData('cpaBid')<0.1"
  1107. >请输入点击出价,不少于0.1元,不超过10000元</span>
  1108. </div>
  1109. </div>
  1110. <div class="row-item" v-if="(getFormData('ocpxActionType') == 180 || getFormData('ocpxActionType') == 53)
  1111. && groupTypeData.deepConversionTypes && groupTypeData.deepConversionTypes.length > 0 && getFormData('multipleBids')!==1 ">
  1112. <div class="hint-item">
  1113. </div>
  1114. <div class="label-item">
  1115. <div class="text-item">深度转化目标出价</div>
  1116. <!-- <div class="required-item"></div> -->
  1117. <!-- {{getFormData('deepConversionBid')}} -->
  1118. </div>
  1119. <div class="input-item">
  1120. <a-form-item>
  1121. <a-input-number
  1122. style="width:200px"
  1123. :max="10000"
  1124. :step="0.1"
  1125. v-decorator="['deepConversionBid' ]"
  1126. />
  1127. <span style="margin-left:5px">元</span>
  1128. <!-- <span style="margin-left:20px">请填入必填字段,获取建议出价</span> -->
  1129. </a-form-item>
  1130. <!-- <span
  1131. class="tip"
  1132. v-if="getFormData('deepConversionBid')<0.1"
  1133. >请输入点击出价,不少于0.1元,不超过10000元</span> -->
  1134. </div>
  1135. </div>
  1136. </div>
  1137. </div>
  1138. <div class="moduler">
  1139. <div class="moduler-title">创意信息</div>
  1140. <div class="ad-range">
  1141. <div class="row-item">
  1142. <div class="hint-item"></div>
  1143. <div class="label-item">
  1144. <div class="text-item">创意制作方式</div>
  1145. <div class="required-item"></div>
  1146. </div>
  1147. <div class="input-item">
  1148. <a-form-item>
  1149. <a-radio-group v-decorator="['openProgramCreate', { initialValue:2 }]" @change="adposition=1;checkedList=[];checkAll=false">
  1150. <a-radio-button :value='2'>不限</a-radio-button>
  1151. <a-radio-button :value="0">自定义</a-radio-button>
  1152. <a-radio-button :value="1">程序化</a-radio-button>
  1153. </a-radio-group>
  1154. </a-form-item>
  1155. </div>
  1156. </div>
  1157. <div class="row-item">
  1158. <div class="hint-item"></div>
  1159. <div class="label-item">
  1160. <div class="text-item">广告位置</div>
  1161. <div class="required-item"></div>
  1162. </div>
  1163. <div class="input-item">
  1164. <a-form-item>
  1165. <a-radio-group v-model="adposition" @change="adpositionChange">
  1166. <a-radio-button :value='1'>优选广告位</a-radio-button>
  1167. <a-radio-button value="inventoryTypes">按媒体指定位置</a-radio-button>
  1168. <a-radio-button :value='5' :disabled="getData('openProgramCreate')==1">联盟广告</a-radio-button>
  1169. </a-radio-group>
  1170. </a-form-item>
  1171. <div style="width: 400px; margin-top: 24px;" class="inventoryTypes" v-show="adposition=='inventoryTypes'">
  1172. <div class="inventory-tags-lists-header">
  1173. <a-checkbox :indeterminate="indeterminate" :checked="checkAll" @change="onCheckAllChange">
  1174. </a-checkbox>
  1175. <div class="inventory-tags-lists-name"><strong>APP名称</strong></div>
  1176. </div>
  1177. <div class="inventory-tags-lists-container">
  1178. <a-checkbox-group v-model="checkedList" @change="onChange" >
  1179. <a-checkbox :value="item.value" v-for="(item,index) in plainOptions" :key="index" :disabled="item.value==3&&getData('openProgramCreate')==1">
  1180. {{item.label}}
  1181. </a-checkbox>
  1182. </a-checkbox-group>
  1183. </div>
  1184. </div>
  1185. </div>
  1186. </div>
  1187. <div class="row-item">
  1188. <div class="hint-item"></div>
  1189. <div class="label-item">
  1190. <div class="text-item">关联封面数</div>
  1191. <div class="required-item"></div>
  1192. </div>
  1193. <div class="input-item">
  1194. <a-form-item >
  1195. <a-input-number
  1196. style="width:200px"
  1197. :max="15"
  1198. :step="1"
  1199. :min='1'
  1200. v-decorator="['imageCnt',{ initialValue:5, rules: [{ required: true, message: '请填写关联封面数' }] } ]"
  1201. @change="setImageCnt"
  1202. />
  1203. </a-form-item>
  1204. </div>
  1205. </div>
  1206. <div class="row-item" v-if="getData('openProgramCreate')!=1">
  1207. <div class="hint-item"></div>
  1208. <div class="label-item">
  1209. <div class="text-item">自定义组上限</div>
  1210. <div class="required-item"></div>
  1211. </div>
  1212. <div class="input-item">
  1213. <a-form-item>
  1214. <a-input-number
  1215. v-decorator="['customUnitCnt',{ initialValue:400, rules: [{ required: true, message: '请填写自定义组上限' }] } ]"
  1216. style="width: 100%"
  1217. placeholder="仅支持输入自然数"
  1218. :max="customUnitCntMax"
  1219. :precision="0"
  1220. />
  1221. </a-form-item>
  1222. </div>
  1223. </div>
  1224. <div class="row-item" v-if="getData('openProgramCreate')!=0">
  1225. <div class="hint-item"></div>
  1226. <div class="label-item">
  1227. <div class="text-item">程序化组上限</div>
  1228. <div class="required-item"></div>
  1229. </div>
  1230. <div class="input-item">
  1231. <a-form-item>
  1232. <a-input-number
  1233. v-decorator="['programUnitCnt',{ initialValue:60, rules: [{ required: true, message: '请填写程序化组上限' }] } ]"
  1234. style="width: 100%"
  1235. placeholder="仅支持输入自然数"
  1236. :max="60"
  1237. :precision="0"
  1238. />
  1239. </a-form-item>
  1240. </div>
  1241. </div>
  1242. <div class="row-item">
  1243. <div class="hint-item"></div>
  1244. <div class="label-item">
  1245. <div class="text-item">素材类型</div>
  1246. <div class="required-item"></div>
  1247. </div>
  1248. <div class="input-item">
  1249. <a-form-item>
  1250. <a-radio-group v-decorator="['channelType', { initialValue:2 }]">
  1251. <a-radio-button :value='2'>不限</a-radio-button>
  1252. <a-radio-button :value="0">内部</a-radio-button>
  1253. <a-radio-button :value="1">素造</a-radio-button>
  1254. </a-radio-group>
  1255. </a-form-item>
  1256. </div>
  1257. </div>
  1258. <div class="row-item">
  1259. <div class="hint-item"></div>
  1260. <div class="label-item">
  1261. <div class="text-item">是否开启历史素材挖掘</div>
  1262. <div class="required-item"></div>
  1263. </div>
  1264. <div class="input-item">
  1265. <a-form-item>
  1266. <a-radio-group v-decorator="['assetMining', { initialValue:0 }]">
  1267. <a-radio-button :value='1'>是</a-radio-button>
  1268. <a-radio-button :value="0">否</a-radio-button>
  1269. </a-radio-group>
  1270. </a-form-item>
  1271. </div>
  1272. </div>
  1273. <div class="row-item" >
  1274. <div class="hint-item"></div>
  1275. <div class="label-item">
  1276. <div class="text-item">是否开启智能抽帧</div>
  1277. <div class="required-item"></div>
  1278. </div>
  1279. <div class="input-item">
  1280. <a-form-item>
  1281. <a-radio-group v-decorator="['smartCover', { initialValue:0 }]">
  1282. <a-radio-button :value='1'>是</a-radio-button>
  1283. <a-radio-button :value="0">否</a-radio-button>
  1284. </a-radio-group>
  1285. </a-form-item>
  1286. </div>
  1287. </div>
  1288. <!-- <div class="row-item" >
  1289. <div class="hint-item"></div>
  1290. <div class="label-item">
  1291. <div class="text-item">下载详情</div>
  1292. <div class="required-item"></div>
  1293. </div>
  1294. <div class="input-item" >
  1295. <a-form-item>
  1296. <a-select
  1297. v-decorator="['siteId']"
  1298. showSearch
  1299. allowClear
  1300. placeholder="选择应用下载详情页"
  1301. optionFilterProp="children"
  1302. :filterOption="filterOption"
  1303. style="width:400px"
  1304. >
  1305. <a-select-option v-for="appModel in siteList" :key="appModel.siteId" :value="appModel.siteId">
  1306. {{ appModel.name }}
  1307. </a-select-option>
  1308. </a-select>
  1309. </a-form-item>
  1310. </div>
  1311. </div> -->
  1312. <div class="row-item" >
  1313. <div class="hint-item"></div>
  1314. <div class="label-item">
  1315. <div class="text-item">监测链接选择</div>
  1316. <div class="required-item"></div>
  1317. </div>
  1318. <div class="input-item">
  1319. <a-form-item>
  1320. <a-radio-group v-decorator="['generalTrack', { initialValue: 1 }]">
  1321. <a-radio-button :value="1">通用</a-radio-button>
  1322. <a-radio-button :value="0">非通用</a-radio-button>
  1323. </a-radio-group>
  1324. </a-form-item>
  1325. </div>
  1326. </div>
  1327. <div class="row-item" v-if="getFormData('generalTrack')==1">
  1328. <div class="hint-item"></div>
  1329. <div class="label-item">
  1330. <div class="text-item">第三方点击监测链接</div>
  1331. </div>
  1332. <div class="input-item">
  1333. <a-form-item>
  1334. <a-input v-decorator="['clickTrackUrl']" @focus="clickTrackUrlFocus" @blur="clickTrackUrlBlur"/>
  1335. <span v-show="clickTrackUrlTip" style="font-size:14px;color:red;">填写点击检测连接的话,开始播放链接必须填写</span>
  1336. </a-form-item>
  1337. </div>
  1338. </div>
  1339. <div class="row-item" v-if="getFormData('generalTrack')==1">
  1340. <div class="hint-item"></div>
  1341. <div class="label-item">
  1342. <div class="text-item">第三方开始播放监测链接</div>
  1343. <!-- <div class="required-item"></div> -->
  1344. </div>
  1345. <div class="input-item">
  1346. <a-form-item>
  1347. <a-input v-decorator="['impressionUrl']" />
  1348. </a-form-item>
  1349. </div>
  1350. </div>
  1351. <div class="row-item" v-if="whiteList.actionbar_click_url_switch==1&&getFormData('generalTrack')==1">
  1352. <div class="hint-item"></div>
  1353. <div class="label-item">
  1354. <div class="text-item">第三方actionBar监测链接</div>
  1355. <!-- <div class="required-item"></div> -->
  1356. </div>
  1357. <div class="input-item">
  1358. <a-form-item>
  1359. <a-input v-decorator="['actionbarClickUrl']" />
  1360. </a-form-item>
  1361. </div>
  1362. </div>
  1363. <!-- <div class="row-item" v-if="whiteList.actionbar_click_url_switch&&getFormData('generalTrack')==1">
  1364. <div class="hint-item"></div>
  1365. <div class="label-item">
  1366. <div class="text-item">第三方ActionBar点击监控链接</div>
  1367. <div class="required-item"></div>
  1368. </div>
  1369. <div class="input-item">
  1370. <a-form-item >
  1371. <a-input
  1372. v-decorator="[
  1373. 'actionbarClickUrl',
  1374. {
  1375. rules: [{ message: '请输入第三方点击监控链接' }],
  1376. },
  1377. ]"
  1378. placeholder="请输入第三方点击监控链接"
  1379. >
  1380. </a-input>
  1381. <span style="color: red; position: relative; top: -10px">仅加白使用</span>
  1382. </a-form-item>
  1383. </div>
  1384. </div> -->
  1385. <div class="row-item" v-if="whiteList.creative_category_switch==1">
  1386. <div class="hint-item"></div>
  1387. <div class="label-item">
  1388. <div class="text-item">创意分类</div>
  1389. <div class="required-item" ></div>
  1390. </div>
  1391. <div class="input-item">
  1392. <a-form-item >
  1393. <a-cascader
  1394. :options="createOptions"
  1395. v-decorator="['creativeCategory',{ initialValue:[],rules: [{ required: whiteList.creative_category_switch==1, message: '创意分类必填' }] }]"
  1396. :fieldNames="fieldNames"
  1397. placeholder="请选择创意分类"
  1398. />
  1399. </a-form-item>
  1400. </div>
  1401. </div>
  1402. <div class="row-item" v-if="whiteList.creative_category_switch==1">
  1403. <div class="hint-item"></div>
  1404. <div class="label-item">
  1405. <div class="text-item">创意标签</div>
  1406. <div class="required-item" ></div>
  1407. </div>
  1408. <div class="input-item">
  1409. <a-form-item>
  1410. <a-select
  1411. mode="tags"
  1412. style="width: 100%"
  1413. placeholder="按回车生成标签"
  1414. v-decorator="['creativeTag',{initialValue:[],rules: [ {required: whiteList.creative_category_switch==1, validator: creativeTagValid }]}]"
  1415. dropdownClassName="display-none-selset"
  1416. :token-separators="[',', ' ', ',']"
  1417. >
  1418. </a-select>
  1419. <span v-if="getData('creativeTag')&&getData('creativeTag').length > 10" style="color:red">创意标签最多填写10个,请删减</span>
  1420. </a-form-item>
  1421. </div>
  1422. </div>
  1423. <div class="row-item">
  1424. <div class="hint-item"></div>
  1425. <div class="label-item">
  1426. <div class="text-item">行动号召</div>
  1427. <div class="required-item"></div>
  1428. </div>
  1429. <div class="input-item">
  1430. <a-form-item >
  1431. <a-select
  1432. v-decorator="['actionBarText', { rules: [{ required: true, message: '请选择行动号召按钮文案' }] }]"
  1433. showSearch
  1434. allowClear
  1435. placeholder="选择行动号召按钮文案"
  1436. optionFilterProp="children"
  1437. :filterOption="filterOption"
  1438. >
  1439. <a-select-option v-for="appModel in actionBarTextList" :key="appModel.id" :value="appModel.actionBarText">
  1440. {{ appModel.actionBarText }}
  1441. </a-select-option>
  1442. </a-select>
  1443. </a-form-item>
  1444. </div>
  1445. </div>
  1446. <div class="row-item">
  1447. <div class="hint-item"> </div>
  1448. <div class="label-item">
  1449. <div class="text-item">广告语</div>
  1450. <div class="required-item"></div>
  1451. </div>
  1452. <div class="input-item">
  1453. <a-form-item v-for="(item,index) in descriptionList" :key="index">
  1454. <div style="position:relative">
  1455. <a-textarea
  1456. class="rending"
  1457. placeholder="请输入广告语"
  1458. @change="descriptionchange(item.value,index)"
  1459. v-model.trim="item.value"
  1460. :autosize="{ minRows: 2, maxRows: 6 }"
  1461. :max-length="30"
  1462. ></a-textarea>
  1463. <p
  1464. style="
  1465. font-size: 12px;
  1466. color: #b6bbc7;
  1467. letter-spacing: 0.3px;
  1468. text-align: right;
  1469. line-height: 30px;
  1470. position: absolute;
  1471. bottom: 0;
  1472. right: 6px;
  1473. width: 100%;
  1474. margin-bottom: 0;
  1475. "
  1476. >
  1477. {{ item.value.length }}/30
  1478. <!-- {{ getFormData('description').length }}/30 -->
  1479. </p>
  1480. <div style="position:absolute;right:-50px;top:-10px">
  1481. <a-icon type="plus" @click="addDescription()" style="margin-right:15px"/>
  1482. <a-icon type="minus" @click="removeDescription(index)" v-if="descriptionList.length>1"/>
  1483. </div>
  1484. </div>
  1485. </a-form-item>
  1486. </div>
  1487. </div>
  1488. <div class="row-item">
  1489. <div class="hint-item"> </div>
  1490. <div class="label-item">
  1491. <div class="text-item">素材关键字</div>
  1492. </div>
  1493. <div class="input-item">
  1494. <a-form-item>
  1495. <div style="position:relative">
  1496. <a-textarea
  1497. class="rending"
  1498. placeholder="请输入素材关键字"
  1499. v-decorator="['materialKeyword']"
  1500. :autosize="{ minRows: 2, maxRows: 6 }"
  1501. ></a-textarea>
  1502. </div>
  1503. </a-form-item>
  1504. </div>
  1505. </div>
  1506. <div class="row-item">
  1507. <div class="hint-item"> </div>
  1508. <div class="label-item">
  1509. <div class="text-item">是否高质量素材复建</div>
  1510. </div>
  1511. <div class="input-item">
  1512. <a-form-item>
  1513. <a-radio-group v-decorator="['historyTop', { initialValue: 0 }]">
  1514. <a-radio-button :value="0">是</a-radio-button>
  1515. <a-radio-button :value="1">否</a-radio-button>
  1516. </a-radio-group>
  1517. </a-form-item>
  1518. </div>
  1519. </div>
  1520. </div>
  1521. </div>
  1522. <!-- <div class="moduler">
  1523. <div class="opt">
  1524. <a-button type="default" style="margin-right:15px" @click="goBack">取消</a-button>
  1525. <a-button type="primary" @click="goNext" :loading="goNextloading">下一步</a-button>
  1526. </div>
  1527. </div> -->
  1528. <div class="moduler">
  1529. <!-- <div class="moduler-title">计划名称</div> -->
  1530. <div class="opt">
  1531. <a-button type="default" style="margin-right:15px" @click="goBack">取消</a-button>
  1532. <!-- -->
  1533. <a-button type="primary" @click="goNext" :loading="goNextloading">确定</a-button>
  1534. </div>
  1535. </div>
  1536. </a-form>
  1537. <div class="infoModal">
  1538. <a-modal v-model="visible" title="提示" @ok="handleOk" :keyboard='false' :maskClosable='false'>
  1539. <ul>
  1540. <li v-for="(item,index) in errorInfo" :key="index">
  1541. <span>账户{{LHKaccountInfo[index].title}}:</span>{{item.message || '定向设置成功'}}
  1542. </li>
  1543. </ul>
  1544. <template slot="footer">
  1545. <a-button key="back" @click="handleCancel">
  1546. 返回本页
  1547. </a-button>
  1548. <a-button key="submit" type="primary" @click="handleOk">
  1549. 下一步
  1550. </a-button>
  1551. </template>
  1552. </a-modal>
  1553. </div>
  1554. <a-modal v-model="convert" title="选择转化目标">
  1555. <template slot="footer">
  1556. <a-button key="back" @click="convert=false">取消</a-button>
  1557. <a-button key="submit" type="primary" @click="convertOk">
  1558. 确定
  1559. </a-button>
  1560. </template>
  1561. <a-form-item label="追踪方式" :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
  1562. :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }">
  1563. <a-radio-group buttonStyle="solid" v-model="convertType" @change="convertChange">
  1564. <a-radio-button value="1" v-show="getFormData('campaignType') == 4||getFormData('campaignType') == 5">JS布玛</a-radio-button>
  1565. <a-radio-button value="2" v-show="getFormData('campaignType') == 4||getFormData('campaignType') == 5">Xpath</a-radio-button>
  1566. <a-radio-button value="3"
  1567. v-show="getFormData('campaignType') == 2">应用-SDK
  1568. </a-radio-button>
  1569. <a-radio-button value="7" v-show="getFormData('campaignType') == 2">应用-API</a-radio-button>
  1570. </a-radio-group>
  1571. </a-form-item>
  1572. <a-form-item label="选择转化" :labelCol="{ lg: { span: 7 }, sm: { span: 7 } }"
  1573. :wrapperCol="{ lg: { span: 10 }, sm: { span: 17 } }">
  1574. <a-select allowClear labelInValue style="width:100%" v-model="convertId" @focus="getConvertList">
  1575. <a-select-option :value="item.convert_id" v-for="item in convertList" :key="item.convert_id">
  1576. {{item.convert_name}}</a-select-option>
  1577. </a-select>
  1578. </a-form-item>
  1579. </a-modal>
  1580. <a-modal v-model="useDirectionalVisible" title="选择定向包" @ok="selectDirectionalOk" width='600px' height='500px'>
  1581. <div style="position:relative">
  1582. <span>当前选择模板数量:{{directionalCheckedList.length}}</span>
  1583. <a-checkbox :indeterminate="indeterminateDirectional" :checked="checkAllDirectional" @change="onCheckAllDirectionalChange" class="quanxuanDirectional">
  1584. <span>点击全选</span>
  1585. </a-checkbox>
  1586. </div>
  1587. <a-spin :spinning="directionalSpinning">
  1588. <div class="title-list">
  1589. <a-checkbox-group v-model="directionalCheckedList" @change="directionalChange">
  1590. <div class="title-item" v-for="(item,index) in directionalList" :key='index'>
  1591. <label>
  1592. <a-checkbox :value='item.id'>
  1593. {{item.templateName+'_('+item.id+')'}}
  1594. </a-checkbox>
  1595. </label>
  1596. </div>
  1597. </a-checkbox-group>
  1598. </div>
  1599. </a-spin>
  1600. </a-modal>
  1601. </a-spin>
  1602. </div>
  1603. </template>
  1604. <script>
  1605. import moment from 'moment'
  1606. import { getAction, postAction, downFile, downFilePost } from '@/api/manage'
  1607. import Treeselect from '@/views/modules/Statistics/components/Treeselect.vue'
  1608. import { TreeSelect } from 'ant-design-vue';
  1609. import qs from 'qs'
  1610. const SHOW_PARENT = TreeSelect.SHOW_PARENT;
  1611. // import selectCheckAll from './toutiaoTime'
  1612. // import radioCheck from './components/radioCheck';
  1613. import radioCheck from '@/components/formComponents/checkBoxGroup'
  1614. import linkMultiSelect from './components/linkMultiSelect'
  1615. import singleLayersSelecte from './components/singleLayerSelecte'
  1616. import scheduleTime from '@/components/formComponents/toutiaoTime'
  1617. import selectRegion from '@/views/modules/kuaishouapp/account/stepForm/stepModule/selectRegion'
  1618. import $ from "jquery"
  1619. // import { filter } from 'vue/types/umd';
  1620. var str = ""
  1621. for (let i = 0; i < 7*24; i++) {
  1622. str+='0'
  1623. }
  1624. let ageArr=[
  1625. {
  1626. value:1,
  1627. label:'不限',
  1628. },
  1629. {
  1630. value:18,
  1631. label:' 18-23岁'
  1632. },
  1633. {
  1634. value:24,
  1635. label:'24-30岁',
  1636. },
  1637. {
  1638. value:31,
  1639. label:'31-40岁',
  1640. },
  1641. {
  1642. value:41,
  1643. label:'41-49岁',
  1644. },
  1645. {
  1646. value:50,
  1647. label:'50岁+',
  1648. },
  1649. ]
  1650. let autoExtendOptions=[
  1651. {
  1652. label:'地域',
  1653. value:'REGION',
  1654. },
  1655. {
  1656. label:'性别',
  1657. value:'GENDER',
  1658. },
  1659. {
  1660. label:'年龄',
  1661. value:'AGE',
  1662. },
  1663. {
  1664. label:'行为兴趣',
  1665. value:'INTEREST_ACTION',
  1666. },
  1667. {
  1668. label:'自定义人群',
  1669. value:'CUSTOM_AUDIENCE',
  1670. },
  1671. ]
  1672. let retargetColumns=[
  1673. {
  1674. title: '人群包',
  1675. dataIndex: 'name',
  1676. sorter: true,
  1677. width: '40%',
  1678. scopedSlots: { customRender: 'name' },
  1679. },
  1680. {
  1681. title: '属性',
  1682. dataIndex: 'populationType',
  1683. scopedSlots: {
  1684. customRender: 'populationType'
  1685. },
  1686. width: 200
  1687. },
  1688. {
  1689. title: '所属账号',
  1690. dataIndex: 'accountId',
  1691. sorter: true,
  1692. width: '40%',
  1693. scopedSlots: { customRender: 'accountId' },
  1694. },
  1695. ]
  1696. const plainOptions = [
  1697. {
  1698. value: 6,
  1699. label: '上下滑大屏广告'
  1700. },
  1701. {
  1702. value: 7,
  1703. label: '信息流广告'
  1704. },
  1705. {
  1706. value: 3,
  1707. label: '视频播放页广告'
  1708. },
  1709. ];
  1710. export default {
  1711. components: {
  1712. // selectCheckAll,
  1713. // newDirectedPackage,
  1714. Treeselect,
  1715. radioCheck,
  1716. linkMultiSelect,
  1717. singleLayersSelecte,
  1718. scheduleTime,
  1719. selectRegion
  1720. },
  1721. data() {
  1722. return {
  1723. checkCpaBidBloon:false,
  1724. appType: '0',
  1725. uriCheck: false,
  1726. programUnitCnt:60,
  1727. customUnitCnt:400,
  1728. customUnitCntMax:400,
  1729. budgetType:'1',
  1730. dayBudgetType:'1',
  1731. clickTrackUrlTip:false,
  1732. deviceBrand:0,
  1733. devicePrice:0,
  1734. tongbuLoading:false,
  1735. refreshPopulationLoading:false,
  1736. noAreaBreak:false,
  1737. noGenderBreak:false,
  1738. noAgeBreak:false,
  1739. regionList:[],
  1740. editRecordId:'',
  1741. spinning:false,
  1742. description:'',
  1743. whiteList:{},
  1744. actionBarTextList:[],
  1745. treeData:[],
  1746. accountId:undefined,
  1747. strategyName: '',
  1748. form: this.$form.createForm(this),
  1749. goNextloading:false,
  1750. goPlanShowloading:false,
  1751. dateRange: [moment(), moment()],
  1752. visible:false,
  1753. errorInfo:[],
  1754. fieldNames: {
  1755. label: 'category_name',
  1756. value: 'category_id',
  1757. children: 'child',
  1758. },
  1759. createOptions: [],
  1760. appStore: ["huawei", "oppo", "vivo", "xiaomi", "meizu", "smartisan"],
  1761. sysType:1,
  1762. indeterminateDirectional:false,
  1763. checkAllDirectional:false,
  1764. directionalList:[],
  1765. directionalSpinning:false,
  1766. directionalCheckedList:[],
  1767. useDirectional:1,
  1768. siteList:[],
  1769. tabKey:'1',
  1770. adposition:1,
  1771. groupTypeData:{},
  1772. convert: false,
  1773. convertId: "",
  1774. convertList: [],
  1775. convertType: '1',
  1776. strategyInfo:{},
  1777. accountInfo:{},
  1778. appList: [],
  1779. appListAll:[],
  1780. dateRange: [moment(), moment()],
  1781. scheduleTime: '',
  1782. scheduleTimeData:str,
  1783. projectInfo:[],
  1784. chargeMethods:'CPC',
  1785. unionVideoType:'REWARDED_VIDEO',
  1786. district:'NONE',
  1787. sceneInventory:'',
  1788. checkedList: [],
  1789. indeterminate: false,
  1790. checkAll: false,
  1791. plainOptions,
  1792. // 定向的参数
  1793. regionValue:'NONE',
  1794. ageArr,//受众年龄
  1795. region:[],
  1796. agesRange:[1],
  1797. regionCityListUrl:'/kuaishou/batch/getRegion',
  1798. regionCountyListUrl:'/kuaishou/batch/getRegion',
  1799. // 自定义人群
  1800. // 自定义人群参数
  1801. retargetColumns,
  1802. retargetData:[],
  1803. retargetDataAll:[],
  1804. loading:false,
  1805. customCrowd:'NONE',//自定义人群 选择的值
  1806. selectedRowKeys:[],
  1807. incluedSelectedRowKeys:[],
  1808. incluedSelectedKeys:[],
  1809. excludeSelectedKeys:[],
  1810. excludeSelectedRowKeys:[],
  1811. autoExtendEnabled:0,//智能放量是否开启
  1812. autoExtendOptions,//智能投放可选定向数组
  1813. autoExtendTargets:[],//智能放量开启后的选择数据----------需传递的参数
  1814. autoExtendTargetsChecked:[],
  1815. radioStyle: {
  1816. display: 'block',
  1817. height: '30px',
  1818. lineHeight: '30px',
  1819. padding: '0 15px'
  1820. },
  1821. goNextloading:false,
  1822. goPlanShowloading:false,
  1823. dateRange: [moment(), moment()],
  1824. visible:false,
  1825. errorInfo:[],
  1826. validationRules: {
  1827. url: [
  1828. {
  1829. required: true,
  1830. validator: this.validateURL,
  1831. },
  1832. ],
  1833. name:[{
  1834. required: true,
  1835. validator: this.validateName,
  1836. }],
  1837. bid:[{
  1838. required: true,
  1839. message:'出价信息必须填写',
  1840. // validator: this.validateBid,
  1841. }],
  1842. roi:[{
  1843. required: true,
  1844. message:'ROI系数必须填写',
  1845. // validator: this.validateBid,
  1846. }],
  1847. },
  1848. optionsApp: [],
  1849. optionsAppActive: [],
  1850. checkArr: [],
  1851. closeDialog: false,
  1852. indeterminateApp: false,
  1853. useDirectionalVisible:false,
  1854. appListValue: '',
  1855. checkOptions: [],
  1856. checkAllApp: false,
  1857. optionsAll: [],
  1858. multipleBidData:[],
  1859. descriptionList:[{value:""}]
  1860. }
  1861. },
  1862. watch: {
  1863. checkArr(n, o) {
  1864. this.optionsAll.push(...n)
  1865. this.optionsAll = [...new Set(this.optionsAll)]
  1866. if (n.length != o.length) {
  1867. if (n.length < o.length) {
  1868. var a = new Set(n)
  1869. var b = new Set(o)
  1870. var c = new Set([...b].filter((item) => !a.has(item))) // {1}
  1871. var d = this.optionsAll.indexOf(...c)
  1872. if (d > 0) {
  1873. this.optionsAll.splice(d, 1)
  1874. }
  1875. }
  1876. }
  1877. },
  1878. accountId(newValue,oldValue){
  1879. setTimeout(()=>{
  1880. this.form.setFieldsValue({
  1881. appId:undefined,
  1882. ocpxActionType:undefined
  1883. })
  1884. },0)
  1885. if(newValue){
  1886. // this.treeData.forEach(item=>{
  1887. // if(item.children){
  1888. // item.children.forEach(ele=>{
  1889. // if(ele.value==newValue){
  1890. // this.$parent.accountInfo=ele
  1891. // }
  1892. // })
  1893. // }
  1894. // })
  1895. this.getAppList()
  1896. let editRecordId=this.$route.query.id;
  1897. if(editRecordId){
  1898. }else{
  1899. getAction('/kuaishou/batch/getIsActivate', {
  1900. accountId: this.accountId
  1901. }).then(res => {
  1902. if (res.success) {
  1903. this.groupTypeData = res.result
  1904. }
  1905. })
  1906. }
  1907. getAction('/kuaishou/batch/getCreativeCategory', {
  1908. accountId:this.accountId,
  1909. }).then((res) => {
  1910. if (res.success) {
  1911. //console.log(res)
  1912. this.createOptions = res.result
  1913. }
  1914. })
  1915. this.getWhiteList()
  1916. this.getpopulationlist()
  1917. }else{
  1918. }
  1919. },
  1920. },
  1921. computed: {
  1922. hasSelected() {
  1923. return this.selectedRowKeys.length > 0;
  1924. },
  1925. rowSelection() {
  1926. return {
  1927. // selectedRowKeys: this.incluedSelectedRowKeys,
  1928. onChange: (selectedRowKeys, selectedRows) => {
  1929. //console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
  1930. this.incluedSelectedRowKeys = selectedRowKeys;
  1931. this.incluedSelectedKeys=selectedRows
  1932. },
  1933. getCheckboxProps: record => ({
  1934. props: {
  1935. disabled: this.excludeSelectedRowKeys.indexOf(record.key)>-1, // Column configuration not to be checked
  1936. name: record.name,
  1937. defaultChecked:this.incluedSelectedRowKeys.indexOf(record.key)>-1
  1938. },
  1939. }),
  1940. };
  1941. },
  1942. rowSelection2() {
  1943. return {
  1944. // selectedRowKeys: this.excludeSelectedRowKeys,
  1945. onChange: (selectedRowKeys, selectedRows) => {
  1946. // //console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
  1947. // this.selectedRowKeys = selectedRowKeys;
  1948. this.excludeSelectedRowKeys = selectedRowKeys;
  1949. this.excludeSelectedKeys=selectedRows
  1950. },
  1951. getCheckboxProps: record => ({
  1952. props: {
  1953. disabled: this.incluedSelectedRowKeys.indexOf(record.key)>-1, // Column configuration not to be checked
  1954. name: record.name,
  1955. defaultChecked:this.excludeSelectedRowKeys.indexOf(record.key)>-1
  1956. },
  1957. }),
  1958. };
  1959. },
  1960. },
  1961. methods: {
  1962. keyDown(event){
  1963. if((event.keyCode>=96&&event.keyCode<=105)||(event.keyCode>=109&&event.keyCode<=111)||event.keyCode==46||event.keyCode==45||(event.keyCode>=48&&event.keyCode<=57)){
  1964. }else{
  1965. event.returnValue = false;
  1966. }
  1967. },
  1968. checkCpaBid(e) {
  1969. let z = /-/g;
  1970. let a = /\//g;
  1971. let d = /\./g;
  1972. if(e.target.value.startsWith("-")||e.target.value.endsWith("-")){
  1973. this.checkCpaBidBloon = true
  1974. return
  1975. }else if(e.target.value.startsWith(".")||e.target.value.endsWith(".")){
  1976. this.checkCpaBidBloon = true
  1977. return
  1978. }
  1979. if(e.target.value.match(a)&&e.target.value.match(z)){
  1980. this.checkCpaBidBloon = true
  1981. }else {
  1982. if(e.target.value.match(z)&&e.target.value.match(z).length>1){
  1983. this.checkCpaBidBloon = true
  1984. }else if(e.target.value.match(a)&&e.target.value.match(a)){
  1985. var arr = e.target.value.split('/')
  1986. var arrary = []
  1987. for (let i = 0; i < arr.length; i++) {
  1988. if(arr[i].match(d)&&arr[i].match(d).length>1){
  1989. arrary.push(true)
  1990. }
  1991. }
  1992. if(arrary.length>0){
  1993. this.checkCpaBidBloon = true
  1994. }else{
  1995. this.checkCpaBidBloon = false
  1996. }
  1997. }else{
  1998. this.checkCpaBidBloon = false
  1999. }
  2000. }
  2001. },
  2002. checkOneBid(item) {
  2003. console.log(item)
  2004. let params = {...item}
  2005. params.cpaBid = params.cpaBid*1000
  2006. params.deepConversionBid = params.deepConversionBid*1000
  2007. postAction('/adsp/kuaiShouAppMultipleBids/saveOrUpdate',params).then(res=>{
  2008. if(res.success){
  2009. this.$message.success('添加成功')
  2010. }else{
  2011. this.$message.error('新增失败')
  2012. }
  2013. })
  2014. },
  2015. convertOk() {
  2016. var dataLink = []
  2017. dataLink = this.convertList.filter((item) => {
  2018. return item.convert_id == this.convertId.key
  2019. })
  2020. if (dataLink.length > 0) {
  2021. this.form.setFieldsValue({ clickTrackUrl: dataLink[0].click_url })
  2022. this.convert = false
  2023. }
  2024. },
  2025. getDataType(type, dataList) {
  2026. getAction('/kuaishou/batch/getTargetList', { tagType: type }).then((res) => {
  2027. if (res.success) {
  2028. this[dataList] = res.result
  2029. }
  2030. })
  2031. },
  2032. clearAll() {
  2033. this.$nextTick(()=>{
  2034. this.checkArr = []
  2035. this.optionsAll = []
  2036. this.indeterminateApp = false
  2037. this.checkAllApp = false
  2038. })
  2039. },
  2040. log(appId) {
  2041. var index = this.optionsAll.findIndex((item) => item === appId)
  2042. this.optionsAll.splice(index, 1)
  2043. if (this.optionsAll.length == 0) {
  2044. this.indeterminateApp = false
  2045. this.checkAllApp = false
  2046. }
  2047. },
  2048. getAppType(e) {
  2049. this.optionsApp = []
  2050. this.form.setFieldsValue({ appInterest: [] })
  2051. this.checkArr = []
  2052. if (e.target.value == '1') {
  2053. getAction('/kuaishou/batch/getTargetList', { tagType: 'APP_INTEREST' }).then((res) => {
  2054. if (res.success) {
  2055. this.optionsApp = res.result
  2056. }
  2057. })
  2058. }
  2059. },
  2060. handleClose(e) {
  2061. this.closeDialog = false
  2062. },
  2063. showAppName(appId) {
  2064. if (this.checkOptions.length > 0) {
  2065. var data = this.checkOptions.filter((item) => {
  2066. return item.appId == appId
  2067. })
  2068. if (data[0]) {
  2069. return data[0].appName
  2070. } else {
  2071. return null
  2072. }
  2073. } else {
  2074. return null
  2075. }
  2076. },
  2077. getAppAllElse(e) {
  2078. this.checkArr = this.optionsAll
  2079. if (this.appListValue != '') {
  2080. getAction('/kuaishou/batch/getAppSearch', {
  2081. accountId: this.accountId,
  2082. appName: e.target.value,
  2083. }).then((res) => {
  2084. if (res.result) {
  2085. this.optionsApp = res.result
  2086. this.checkOptions.push(...res.result)
  2087. this.closeDialog = true
  2088. } else {
  2089. this.optionsApp = []
  2090. this.closeDialog = false
  2091. }
  2092. })
  2093. } else {
  2094. this.optionsApp = []
  2095. this.closeDialog = false
  2096. }
  2097. },
  2098. getAppAll(e) {
  2099. if (e.target.value !== '') {
  2100. getAction('/kuaishou/batch/getAppSearch', {
  2101. accountId:this.accountId,
  2102. appName: e.target.value,
  2103. }).then((res) => {
  2104. if (res.result) {
  2105. this.optionsApp = res.result
  2106. this.checkOptions.push(...res.result)
  2107. this.closeDialog = true
  2108. } else {
  2109. this.optionsApp = []
  2110. this.closeDialog = false
  2111. }
  2112. })
  2113. } else {
  2114. this.optionsApp = []
  2115. this.closeDialog = false
  2116. }
  2117. },
  2118. onCheckAllChangeApp(e) {
  2119. Object.assign(this, {
  2120. checkArr: e.target.checked
  2121. ? this.optionsApp.map((item) => {
  2122. return item.appId
  2123. })
  2124. : [],
  2125. indeterminateApp: false,
  2126. checkAllApp: e.target.checked,
  2127. })
  2128. this.$nextTick(()=>{
  2129. if (this.optionsAll.length > 20) {
  2130. this.$message.error('最多选择20个APP行为')
  2131. this.checkArr = []
  2132. this.optionsAll = []
  2133. this.indeterminateApp = false
  2134. this.checkAllApp = false
  2135. }
  2136. })
  2137. },
  2138. onChangeApp(checkedList) {
  2139. this.indeterminateApp =
  2140. !!checkedList.length &&
  2141. checkedList.length <
  2142. this.optionsApp.map((item) => {
  2143. return item.appId
  2144. }).length
  2145. this.checkAllApp =
  2146. checkedList.length ===
  2147. this.optionsApp.map((item) => {
  2148. return item.appId
  2149. }).length
  2150. },
  2151. setImageCnt(e){
  2152. this.customUnitCntMax = e?Math.floor(2000/e):2000
  2153. },
  2154. platformOsChange(e){
  2155. //console.log(e);
  2156. this.deviceBrand=0;
  2157. this.sysType=e.target.value;
  2158. this.sysTypeChange(e)
  2159. },
  2160. refreshPopulation(){
  2161. if(this.accountId){
  2162. this.refreshPopulationLoading = true
  2163. // this.$refs.application.showApplication()
  2164. getAction('/kuaishou/batch/pullPopulationList', {
  2165. accountId: this.accountId
  2166. }).then(res => {
  2167. if (res.success) {
  2168. this.refreshPopulationLoading = false
  2169. this.$message.success(res.message)
  2170. this.retargetTabChange()
  2171. } else {
  2172. this.refreshPopulationLoading = false
  2173. this.$message.error(res.message)
  2174. }
  2175. })
  2176. }else{
  2177. this.$message.error('请先选择账户')
  2178. }
  2179. },
  2180. addApplication() {
  2181. if(this.accountId){
  2182. this.tongbuLoading = true
  2183. // this.$refs.application.showApplication()
  2184. getAction('/kuaishou/batch/syncAppList', {
  2185. accountId: this.accountId
  2186. }).then(res => {
  2187. if (res.success) {
  2188. this.tongbuLoading = false
  2189. this.$message.success(res.message)
  2190. this.getAppList()
  2191. } else {
  2192. this.tongbuLoading = false
  2193. this.$message.error(res.message)
  2194. }
  2195. })
  2196. }else{
  2197. this.$message.error('请先选择账户')
  2198. }
  2199. },
  2200. getIsActivate(val){
  2201. let params={};
  2202. params.accountId=this.accountId;
  2203. params.campaignType=this.getFormData('campaignType');
  2204. params.appId=val
  2205. getAction('/kuaishou/batch/getIsActivate',params).then(res => {
  2206. if (res.success) {
  2207. this.groupTypeData = res.result
  2208. }
  2209. })
  2210. },
  2211. isOpenChange(e){
  2212. this.noAreaBreak=false;
  2213. this.noGenderBreak=false;
  2214. this.noAgeBreak=false;
  2215. },
  2216. selectAllAppId(){
  2217. //console.log(this.getFormData('appId'))
  2218. },
  2219. singleAppidChange(e){
  2220. // //console.log(e.target.value,this.getFormData('appId'));
  2221. this.form.setFieldsValue({
  2222. appId:undefined
  2223. })
  2224. },
  2225. addDescription(){
  2226. this.descriptionList.push({value:""})
  2227. },
  2228. removeDescription(index){
  2229. this.descriptionList.splice(index,1)
  2230. },
  2231. descriptionchange(val,index){
  2232. let data = val;
  2233. this.$nextTick(()=>{
  2234. this.descriptionList[index].value = data.replace(/\s/g,'')
  2235. })
  2236. // if(this.getData('description')){
  2237. // this.$nextTick(()=>{
  2238. // this.form.setFieldsValue({
  2239. // description: this.getData('description').replace(/\s/g,'')
  2240. // })
  2241. // })
  2242. // }
  2243. // this.description=e.target.value.replace(/\s/g,'')
  2244. },
  2245. //获取表单的某一个属性值
  2246. getFormData(className) {
  2247. return this.form.getFieldValue(className)
  2248. },
  2249. dateChange(date, dateString) {
  2250. // //console.log(date,dateString)
  2251. this.form.getFieldDecorator('startTime')
  2252. this.form.getFieldDecorator('endTime')
  2253. this.form.setFieldsValue({
  2254. startTime: date[0].format('YYYY-MM-DD HH:mm'),
  2255. endTime: date[1].format('YYYY-MM-DD HH:mm'),
  2256. })
  2257. },
  2258. //推广目的改变
  2259. campaignTypeChange(e){
  2260. //console.log(e.target)
  2261. let strategyNamepart=this.campaignTypeHandle(e.target.value);
  2262. this.strategyName ='[策略]_'+ strategyNamepart+'_' + moment().format('MM_DD_hh:mm') ;
  2263. this.getActionBarText()
  2264. },
  2265. goBack() {
  2266. this.$router.replace('/autoLaunch/configLaunchList')
  2267. this.$bus.$emit('remove', '/autoLaunch/configLaunchInfo')
  2268. this.$bus.$emit('remove', `/autoLaunch/configLaunchInfo?id=${this.editRecordId}`)
  2269. },
  2270. //请求项目和账户内容
  2271. accountHttp(){
  2272. this.treeData=[];
  2273. this.accountIds=[];
  2274. getAction('/ctop/projectMember/getProjectAccountByUserId?mediaType=2', {}).then(res => {
  2275. if(res.success){
  2276. // //console.log(res);
  2277. if(res.result){
  2278. res.result.forEach((element,index) => {
  2279. if(element){
  2280. this.treeData.push({});
  2281. this.treeData[index].title=element.project.projectName +'_('+ element.project.advertiserName +')';
  2282. this.treeData[index].value='project'+element.project.projectId;
  2283. this.treeData[index].key=element.project.projectId;
  2284. this.treeData[index].mediaId=element.project.mediaId;
  2285. this.treeData[index].children=[];
  2286. if(element.account.length){
  2287. element.account.forEach((ele,i)=>{
  2288. this.treeData[index].children.push({});
  2289. this.treeData[index].children[i].title=ele.userName+'_'+ele.authName+'_'+element.project.projectName;
  2290. this.treeData[index].children[i].value=ele.accountId;
  2291. this.treeData[index].children[i].key=ele.accountId;
  2292. })
  2293. }
  2294. }
  2295. });
  2296. // //console.log(this.treeData)
  2297. }
  2298. }
  2299. })
  2300. },
  2301. campaignTypeHandle(val){
  2302. let str='';
  2303. switch (val) {
  2304. case '2':
  2305. str='应用安装'
  2306. break;
  2307. case '3':
  2308. str='电商下单'
  2309. break;
  2310. case '4':
  2311. str='推广品牌'
  2312. break;
  2313. case '5':
  2314. str='营销线索'
  2315. break;
  2316. case '7':
  2317. str='应用活跃'
  2318. break;
  2319. default:
  2320. str='转化错误'
  2321. break;
  2322. }
  2323. return str
  2324. },
  2325. creativeTagValid(rule, value, callback) {
  2326. //console.log(rule, value, callback)
  2327. if(value.length == 0 || value==undefined){
  2328. // //console.log(1)
  2329. callback('创意标签必须填写')
  2330. }else if (value.length > 10) {
  2331. callback('创意标签最多填写10个,请删减')
  2332. }else{
  2333. // //console.log(2)
  2334. callback()
  2335. }
  2336. },
  2337. directionalChange(checkedList) {
  2338. // //console.log(checkedList)
  2339. this.indeterminateDirectional = !!checkedList.length && checkedList.length < this.directionalList.length;
  2340. this.checkAllDirectional = checkedList.length === this.directionalList.length;
  2341. },
  2342. onCheckAllDirectionalChange(e) {
  2343. //console.log(e)
  2344. let valueOption=[];
  2345. valueOption=this.directionalList.map(item=>{
  2346. return item.id
  2347. })
  2348. Object.assign(this, {
  2349. directionalCheckedList: e.target.checked ? valueOption : [],
  2350. indeterminateDirectional: false,
  2351. checkAllDirectional: e.target.checked,
  2352. });
  2353. },
  2354. selectDirectionalOk(e){
  2355. this.useDirectionalVisible=false
  2356. },
  2357. useDirectionalChange(e){
  2358. //console.log(e);
  2359. if(e.target.value==0){
  2360. // this.useDirectionalVisible=true;
  2361. this.getUserDirectional()
  2362. }
  2363. },
  2364. // 获取定向包
  2365. getUserDirectional(){
  2366. getAction('/kuaishou/batch/getDirectionalTemplate',{
  2367. accountId:this.accountId
  2368. }).then(res=>{
  2369. //console.log(res);
  2370. this.directionalList=res.result
  2371. })
  2372. },
  2373. appIdChange(val){
  2374. console.log(val)
  2375. this.siteList=[]
  2376. // this.getPageList(val)
  2377. if(this.getFormData('singleAppid')==0){
  2378. if(val&&val.findIndex(item=>item.key===0)>-1){
  2379. let appidArr=this.appList.map(item=>{
  2380. return {key:item.appId,label:`${item.platform === 1?'Android应用下载':item.platform === 2?'Android网页游戏':item.platform === 3?'iOS应用下载':'iOS网页游戏'}`
  2381. +'\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0'+
  2382. item.appName+'\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0'+item.appVersion}
  2383. })
  2384. // setTimeout(()=>{
  2385. // this.form.setFieldsValue({
  2386. // appId:appidArr
  2387. // })
  2388. // },0)
  2389. this.$nextTick(()=>{
  2390. this.form.setFieldsValue({
  2391. appId:appidArr
  2392. })
  2393. this.multipleBidData = appidArr.map(item=>{
  2394. return {
  2395. ...item,
  2396. cpaBid:null,
  2397. trackUrl:'',
  2398. channelCode:'',
  2399. appId:item.key,
  2400. accountId:this.accountId,
  2401. deepConversionBid:null
  2402. }
  2403. })
  2404. })
  2405. }else{
  2406. this.$nextTick(()=>{
  2407. this.multipleBidData = val.map(item=>{
  2408. return {
  2409. ...item,
  2410. cpaBid:null,
  2411. trackUrl:'',
  2412. channelCode:'',
  2413. appId:item.key,
  2414. accountId:this.accountId,
  2415. deepConversionBid:null
  2416. }
  2417. })
  2418. })
  2419. }
  2420. }
  2421. if(val!=undefined && (val&&val.length>0) ){
  2422. if(this.getFormData('campaignType')==2){
  2423. if(this.getFormData('singleAppid')==1){
  2424. this.getIsActivate(val.key)
  2425. }else{
  2426. this.getIsActivate(val[0].key)
  2427. }
  2428. }
  2429. }
  2430. },
  2431. disabledDate(current) {
  2432. return current && current < moment().subtract(1, 'day')
  2433. },
  2434. bidTypeChange(e){
  2435. //console.log(e);
  2436. this.chargeMethods=e.target.value==10?"OCPM":'CPC'
  2437. },
  2438. getData(className) {
  2439. return this.form.getFieldValue(className)
  2440. },
  2441. handleChange(val){
  2442. //console.log(val)
  2443. },
  2444. // 投放日期改变
  2445. scheduleTypeChange(val){
  2446. //console.log(val)
  2447. if(val=='SCHEDULE_FROM_NOW'){
  2448. this.dateRange=[moment(),moment().add(10,'years')]
  2449. }else{
  2450. this.dateRange=[moment(),moment().add(10,'days')]
  2451. }
  2452. },
  2453. filterOption(input, option) {
  2454. return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
  2455. },
  2456. adpositionChange(){
  2457. if(this.adposition!='inventoryTypes'){
  2458. this.checkedList=[];
  2459. this.indeterminate=false;
  2460. this.checkAll=false;
  2461. }
  2462. },
  2463. cityChange(){
  2464. this.region=[];
  2465. this.regionList=[];
  2466. },
  2467. onChange(checkedList) {
  2468. this.indeterminate = !!checkedList.length && checkedList.length < plainOptions.length;
  2469. this.checkAll = checkedList.length === plainOptions.length;
  2470. },
  2471. onCheckAllChange(e) {
  2472. let valueOption = [];
  2473. this.plainOptions.forEach((item) => {
  2474. if(this.getData('openProgramCreate')==1){
  2475. if(item.value!=3){
  2476. valueOption.push(item.value)
  2477. }
  2478. }else{
  2479. valueOption.push(item.value)
  2480. }
  2481. })
  2482. Object.assign(this, {
  2483. checkedList: e.target.checked ? valueOption : [],
  2484. indeterminate: false,
  2485. checkAll: e.target.checked,
  2486. });
  2487. },
  2488. customCrowdChange(e){
  2489. //console.log(e);
  2490. if(e.target.value=='1' || e.target.value=='2'){
  2491. this.retargetTabChange();
  2492. this.tabKey=e.target.value
  2493. }else if(e.target.value=='3'){
  2494. this.retargetTabChange();
  2495. this.tabKey='1'
  2496. }
  2497. },
  2498. // 自定义人群的--同时定向排除tab切换事件
  2499. retargetTabChange(){
  2500. //console.log()
  2501. this.retargetDataAll=[];
  2502. this.loading=true;
  2503. getAction('/kuaishou/batch/getPopulationList',{
  2504. accountId:this.accountId
  2505. }).then((res)=>{
  2506. // //console.log(res)
  2507. this.loading=false;
  2508. if(res.success){
  2509. res.result.forEach((ele)=>{
  2510. ele.key=ele.orientationId
  2511. ele.id= ele.orientationId
  2512. ele.name=ele.orientationName+"("+ele.orientationId+")"
  2513. // ele.accountName=this.accountInfo.title
  2514. ele.accountId=this.accountId
  2515. })
  2516. // this.retargetData=res.data;
  2517. this.retargetDataAll=[...this.retargetDataAll,...res.result];
  2518. this.retargetDataAll = this.retargetDataAll.filter(item=>{
  2519. return item.populationType !== 7
  2520. })
  2521. }
  2522. })
  2523. },
  2524. onSelectChange(selectedRowKeys) {
  2525. // //console.log('selectedRowKeys changed: ', selectedRowKeys);
  2526. this.selectedRowKeys = selectedRowKeys;
  2527. },
  2528. // 自定义人群的改变
  2529. retargetTableChange(pagination, filters, sorter){
  2530. // //console.log(pagination);
  2531. },
  2532. //获取选中的城市
  2533. getSelectedCityArr(val){
  2534. //console.log(val);
  2535. this.region=[];
  2536. this.region=val;
  2537. },
  2538. // 获取选中的区县
  2539. getSelectedCountyArr(val){
  2540. // //console.log(val)
  2541. this.region=[];
  2542. this.region=val;
  2543. },
  2544. //获取选中的年龄段
  2545. getAgeSelect(data){
  2546. if (data.length > 1 && data.findIndex((item) => item == 1) == 0) {
  2547. data.splice(data.findIndex((item) => item == 1),1)
  2548. } else if (data.length > 1 && data.findIndex((item) => item == 1) == data.length - 1) {
  2549. data.splice(0, data.length - 1)
  2550. } else if (data.length == 0) {
  2551. data.push(1)
  2552. }
  2553. // //console.log(val)
  2554. // if(val.length==1&&val[0]==""){
  2555. // this.agesRange=[]
  2556. // }else{
  2557. // this.agesRange=val;
  2558. // }
  2559. },
  2560. //获取智能放量定向的值
  2561. getAutoExtendEnabled(val){
  2562. // //console.log(val)
  2563. this.autoExtendTargets=[];
  2564. this.autoExtendTargets.push(...val)
  2565. },
  2566. callback(val) {
  2567. //console.log(val);
  2568. },
  2569. handleOk(e) {
  2570. this.visible=false;
  2571. this.$router.push({path:'/LaunchHousekeeper/setProjectCreate'})
  2572. },
  2573. handleCancel(e) {
  2574. this.visible = false;
  2575. },
  2576. // 直达链接是否启用
  2577. useOpenUrlChange(){
  2578. this.form.setFieldsValue({
  2579. openUrl:''
  2580. })
  2581. },
  2582. //获取表单的某一个属性值
  2583. getFormData(className) {
  2584. return this.form.getFieldValue(className)
  2585. },
  2586. dateChange(date, dateString) {
  2587. // //console.log(date,dateString)
  2588. this.form.getFieldDecorator('beginTime')
  2589. this.form.getFieldDecorator('endTime')
  2590. this.form.setFieldsValue({
  2591. beginTime: date[0].format('YYYY-MM-DD HH:mm'),
  2592. endTime: date[1].format('YYYY-MM-DD HH:mm'),
  2593. })
  2594. },
  2595. // 验证网址
  2596. IsURL(res) {
  2597. // var strRegex = /^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/|www\.)(([A-Za-z0-9-~]+)\.)+([A-Za-z0-9-~\/])+$/
  2598. var strRegex = /^([hH][tT]{2}[pP]:\/\/|[hH][tT]{2}[pP][sS]:\/\/)(([A-Za-z0-9-~]+)\.)+([A-Za-z0-9-~\/])+(.+[A-Za-z0-9-~\/])+$/
  2599. var re = new RegExp(strRegex)
  2600. // //console.log(re.test(res))
  2601. if (re.test(res)) {
  2602. return true
  2603. } else {
  2604. return false
  2605. }
  2606. },
  2607. validateURL(rule, value, callback) {
  2608. // //console.log(rule, value, callback);
  2609. if (this.IsURL(value)) {
  2610. callback()
  2611. } else if (value && !this.IsURL(value)) {
  2612. callback('链接地址无法访问,请正确输入')
  2613. } else {
  2614. callback('链接必须填写')
  2615. }
  2616. },
  2617. validateName(rule, value, callback){
  2618. // //console.log(rule, value, callback);
  2619. if (value) {
  2620. callback()
  2621. } else {
  2622. callback('应用包名称必须填写')
  2623. }
  2624. },
  2625. validateBid(rule, value, callback){
  2626. // //console.log(rule, value, callback);
  2627. if (value) {
  2628. callback()
  2629. } else {
  2630. callback('出价必须填写')
  2631. }
  2632. },
  2633. // 保存并新建创意
  2634. goNext() {
  2635. this.$nextTick(()=>{
  2636. if(this.checkCpaBidBloon){
  2637. this.$message.error('请正确填写必填项目')
  2638. return
  2639. }
  2640. this.form.validateFields((err, values) => {
  2641. //console.log(values)
  2642. if (!err) {
  2643. let isNotComplete = this.descriptionList.findIndex(item => {
  2644. return item.value === ''
  2645. })
  2646. if (isNotComplete > -1) {
  2647. this.$message.error('请正确填写必填项目,广告语未填')
  2648. return
  2649. }
  2650. if(values.multipleBids === 1) {
  2651. let multipleBidData = this.multipleBidData.findIndex(item => {
  2652. return item.cpaBid === null
  2653. })
  2654. if (multipleBidData > -1) {
  2655. this.$message.error('请正确填写必填项目,广告语未填')
  2656. return
  2657. }
  2658. }
  2659. // console.log(values)
  2660. this.goNextloading=true;
  2661. // //console.log(this.excludeSelectedKeys,this.incluedSelectedKeys)
  2662. // 设置广告位值
  2663. if(this.adposition!='inventoryTypes'){
  2664. this.checkedList=[];
  2665. values.sceneId=JSON.stringify([this.adposition])
  2666. }else{
  2667. values.sceneId=JSON.stringify(this.checkedList)
  2668. }
  2669. // 时间段值
  2670. // if(this.getFormData('scheduleTime')!=''){
  2671. // values.scheduleTime=this.scheduleTimeData
  2672. // }else{
  2673. // values.scheduleTime=''
  2674. // }
  2675. // 投放时间的值
  2676. // if(this.getFormData('scheduleType')=='SCHEDULE_FROM_NOW'){
  2677. // values.beginTime=this.dateRange[0].format('YYYY-MM-DD');
  2678. // values.endTime= this.dateRange[1].add(10,"years").format('YYYY-MM-DD');
  2679. // }else{
  2680. // values.beginTime=this.dateRange[0].format('YYYY-MM-DD');
  2681. // values.endTime= this.dateRange[1].format('YYYY-MM-DD');
  2682. // }
  2683. if(this.getData('campaignType') === 2 ) {
  2684. values.appIdArray=values.appId instanceof Array?JSON.stringify(values.appId.map(item=>{return item.key})):JSON.stringify([values.appId.key])
  2685. values.appId=undefined;
  2686. }else if(this.getData('campaignType') === 7){
  2687. values.appIdArray=values.appId instanceof Array?JSON.stringify(values.appId.map(item=>{return item.key})):JSON.stringify([values.appId.key])
  2688. values.appId=undefined;
  2689. values.singleAppid = 1
  2690. }else {
  2691. values.singleAppid = 1
  2692. values.appIdArray=JSON.stringify([])
  2693. }
  2694. values.appId = undefined
  2695. values.agesRange=this.agesRange[0]==1?JSON.stringify([]):JSON.stringify(this.agesRange)
  2696. values.region=JSON.stringify(this.regionList.map(item=>{return item.value}));
  2697. if(this.district!='NONE'){
  2698. values.district=this.district
  2699. }else{
  2700. values.region="[]"
  2701. }
  2702. values.convertId=this.convertId==''?undefined:this.convertId.key;
  2703. values.appInterest = JSON.stringify(values.appInterest)
  2704. if (this.appType == '2') {
  2705. values.appIds = JSON.stringify(this.optionsAll)
  2706. values.appInterest = JSON.stringify([])
  2707. }else if(this.appType == '0'){
  2708. values.appIds = JSON.stringify([])
  2709. values.appInterest = JSON.stringify([])
  2710. }else {
  2711. values.appIds = JSON.stringify([])
  2712. }
  2713. // let excludePopulation=this.excludeSelectedKeys.map(item=>{
  2714. // return item.id
  2715. // })
  2716. // //console.log(this.excludeSelectedKeys)
  2717. // let population=this.incluedSelectedKeys.map(item=>{
  2718. // return item.id
  2719. // })
  2720. if(values.customCrowd==0){
  2721. values.excludePopulation='[]';
  2722. values.population='[]';
  2723. }else{
  2724. values.excludePopulation=this.excludeSelectedRowKeys.length>0?JSON.stringify(this.excludeSelectedRowKeys):'[]';
  2725. values.population=this.incluedSelectedRowKeys.length>0?JSON.stringify(this.incluedSelectedRowKeys):'[]';
  2726. }
  2727. values.description = JSON.stringify(this.descriptionList.map(item=>{
  2728. return item.value
  2729. }))
  2730. values.useAppMarket=values.useAppMarket?'1':'0'
  2731. // if(this.useDirectional==0){
  2732. // values.templateId=this.directionalCheckedList
  2733. // }
  2734. if(this.sysType==1&&this.getData('useAppMarket')){
  2735. values.appStore=JSON.stringify(this.appStore)
  2736. }else if(this.sysType==1&&!this.getData('useAppMarket')){
  2737. values.appStore="[]"
  2738. }
  2739. if(values.cpaBid){
  2740. if((values.cpaBid+'').includes('/')){
  2741. let bidArr = values.cpaBid.split('/')
  2742. for (let index = 0; index < bidArr.length; index++) {
  2743. bidArr[index] = bidArr[index]*1000
  2744. }
  2745. values.cpaBid = bidArr.join('/')
  2746. }else if((values.cpaBid+'').includes('-')){
  2747. let bidArr = values.cpaBid.split('-')
  2748. for (let index = 0; index < bidArr.length; index++) {
  2749. bidArr[index] = bidArr[index]*1000
  2750. }
  2751. values.cpaBid = bidArr.join('-')
  2752. }else{
  2753. values.cpaBid = values.cpaBid*1000
  2754. }
  2755. }else{
  2756. values.cpaBid=0
  2757. }
  2758. if(values.deepConversionBid){
  2759. values.deepConversionBid=parseInt(values.deepConversionBid*1000)
  2760. }else{
  2761. values.deepConversionBid=0
  2762. }
  2763. if(values.creativeCategory&&values.creativeCategory.length>0){
  2764. values.creativeCategory=values.creativeCategory[values.creativeCategory.length-1]
  2765. }else{
  2766. values.creativeCategory=undefined
  2767. }
  2768. values.deviceBrand=this.deviceBrand==0?'[]':JSON.stringify(values.deviceBrand)
  2769. values.devicePrice=this.devicePrice==0?'[]':JSON.stringify(values.devicePrice)
  2770. values.accountId = this.accountId
  2771. values.creativeTag=values.creativeTag?JSON.stringify(values.creativeTag):undefined
  2772. values.noAreaBreak=this.noAreaBreak?1:0
  2773. values.noGenderBreak=this.noGenderBreak?1:0
  2774. values.noAgeBreak=this.noAgeBreak?1:0
  2775. values.campaignDayBudget = this.budgetType =='1'?0: values.campaignDayBudget*1000
  2776. values.unitDayBudget = this.dayBudgetType =='1'?0: values.unitDayBudget*1000
  2777. let url=''
  2778. if(this.editRecordId){
  2779. url='/ctop/aiKuaishouAdvertiserStrategy/edit';
  2780. values.id=this.editRecordId
  2781. }else{
  2782. url='/ctop/aiKuaishouAdvertiserStrategy/add'
  2783. }
  2784. postAction(url,values).then(res=>{
  2785. //console.log(res)
  2786. this.goNextloading=false
  2787. if(res.success){
  2788. this.$router.replace('/autoLaunch/configLaunchList')
  2789. this.$bus.$emit('remove', '/autoLaunch/configLaunchInfo')
  2790. this.$bus.$emit('remove', `/autoLaunch/configLaunchInfo?id=${this.editRecordId}`)
  2791. }else{
  2792. this.$message.error(res.message)
  2793. // this.$router.replace('/autoLaunch/configLaunchList')
  2794. // this.$bus.$emit('remove', '/autoLaunch/configLaunchInfo')
  2795. // this.$bus.$emit('remove', `/autoLaunch/configLaunchInfo?id=${this.editRecordId}`)
  2796. }
  2797. })
  2798. // $.ajax({
  2799. // url:'http://192.168.1.193:31012/add_advertiser_strategy',
  2800. // type:"POST",
  2801. // data:JSON.stringify(values),
  2802. // crossDomain:true,
  2803. // contentType:"application/json; charset=utf-8;",
  2804. // dataType:'json',
  2805. // success:(res)=>{
  2806. // this.goNextloading=false
  2807. // //console.log(res)
  2808. // let result=JSON.parse(res)
  2809. // if(result.code==0){
  2810. // this.$router.replace('/autoLaunch/configLaunchList')
  2811. // this.$bus.$emit('remove', '/autoLaunch/configLaunchInfo')
  2812. // }else{
  2813. // this.$message.error(result.message)
  2814. // this.$router.replace('/autoLaunch/configLaunchList')
  2815. // this.$bus.$emit('remove', '/autoLaunch/configLaunchInfo')
  2816. // }
  2817. // },
  2818. // error:(res)=>{
  2819. // //console.log(res)
  2820. // }
  2821. // })
  2822. }else{
  2823. this.$message.error('请正确填写必填项目')
  2824. }
  2825. })
  2826. })
  2827. },
  2828. // 获取applist
  2829. getAppList() {
  2830. let params = {}
  2831. params.accountId = this.accountId
  2832. getAction('/kuaishou/batch/getAppList', params).then(res => {
  2833. if (res.success) {
  2834. this.appListAll = res.result.map((item, index) => {
  2835. return {
  2836. ...item,
  2837. key: index
  2838. }
  2839. })
  2840. if(this.sysType==1){
  2841. this.appList=this.appListAll.filter(item=>{
  2842. return item.platform==1||item.platform==2
  2843. })
  2844. }else if(this.sysType==2){
  2845. this.appList=this.appListAll.filter(item=>{
  2846. return item.platform==3||item.platform==4
  2847. })
  2848. }
  2849. }
  2850. })
  2851. },
  2852. convertChange() {
  2853. this.convertId = ""
  2854. },
  2855. getConvertList() {
  2856. var params = {}
  2857. params.accountId = this.accountId
  2858. params.type = this.convertType
  2859. getAction('/kuaishou/batch/getConvertList', params).then(res => {
  2860. //console.log(res)
  2861. if (res.success) {
  2862. this.convertList = res.result.map(item => {
  2863. return {
  2864. ...item,
  2865. convert_id: item.convert_id + ""
  2866. }
  2867. })
  2868. }
  2869. })
  2870. },
  2871. sysTypeChange(e){
  2872. //console.log(e.target.value);
  2873. this.form.setFieldsValue({
  2874. appId:undefined,
  2875. platformOs:e.target.value
  2876. })
  2877. // if(this.getFormData('campaignType')==2 || this.getFormData('campaignType')==7){
  2878. // this.appIdChange(this.getFormData('appId'))
  2879. // }
  2880. if(this.sysType==1){
  2881. this.appList=this.appListAll.filter(item=>{
  2882. return (item.platform==1 || item.platform==2)
  2883. })
  2884. }else if(this.sysType==2){
  2885. this.appList=this.appListAll.filter(item=>{
  2886. return (item.platform==3||item.platform==4)
  2887. })
  2888. }
  2889. },
  2890. getPlatForm(appId) {
  2891. if (appId) {
  2892. var data = this.appList.filter(item => {
  2893. return item.appId == appId
  2894. })
  2895. return data[0].platform
  2896. }
  2897. },
  2898. showConvert() {
  2899. this.convertChange()
  2900. if (this.getFormData('campaignType') == 2) {
  2901. if (this.getData('appId')) {
  2902. this.convert = true;
  2903. let appIdvalue=this.getData('appId');
  2904. if (this.getPlatForm(appIdvalue instanceof Array?appIdvalue[0]:appIdvalue) == 1 || this.getPlatForm(appIdvalue instanceof Array?appIdvalue[0]:appIdvalue) == 2) {
  2905. this.convertType = '3'
  2906. } else {
  2907. this.convertType = '7'
  2908. }
  2909. } else {
  2910. this.$message.error('请选择应用')
  2911. }
  2912. } else {
  2913. this.convert = true
  2914. this.convertType = '1'
  2915. }
  2916. this.getConvertList()
  2917. },
  2918. getPageList(appId) {
  2919. getAction('/kuaishou/batch/getPageList', {
  2920. accountId: this.accountId,
  2921. appId: appId,
  2922. viewComp: 7,
  2923. }).then((res) => {
  2924. if (res.success) {
  2925. this.siteList = res.result
  2926. }
  2927. })
  2928. },
  2929. // 获取行动号召按钮
  2930. getActionBarText(){
  2931. this.actionBarTextList=[]
  2932. let that = this
  2933. setTimeout(()=>{
  2934. getAction('/kuaishou/batch/getActionBarTextByType', {
  2935. type:that.getFormData('campaignType')
  2936. }).then((res) => {
  2937. if (res.success) {
  2938. that.actionBarTextList = res.result
  2939. }
  2940. })
  2941. })
  2942. },
  2943. // 获取创意分类创意标签白名单
  2944. getWhiteList(){
  2945. this.whiteList={}
  2946. getAction('/kuaishou/batch/getWhiteList', {
  2947. accountId: this.accountId,
  2948. }).then((res) => {
  2949. if (res.success) {
  2950. // //console.log(res)
  2951. if (res.result) {
  2952. this.whiteList=res.result
  2953. }
  2954. }
  2955. })
  2956. },
  2957. editEchoPage(){
  2958. this.spinning=true;
  2959. if(this.editRecordId){
  2960. getAction('/ctop/aiKuaishouAdvertiserStrategy/queryById',{
  2961. id:this.editRecordId
  2962. }).then(res=>{
  2963. //console.log(res);
  2964. this.accountId=res.result.accountId;
  2965. this.description=res.result.description
  2966. this.appType = res.result.appInterest ? '1' : res.result.appIds ? '2' : '0'
  2967. // if(this.appType === '2') {
  2968. // postAction('/kuaishou/batch/getAppNames',{accountId:this.accountId,appIds:res.result.appIds}).then((result) => {
  2969. // if (result.success) {
  2970. // this.checkOptions = result.result.map(i=>{
  2971. // return {
  2972. // appId: i.id,
  2973. // appName: i.name
  2974. // }
  2975. // })
  2976. // }
  2977. // })
  2978. // }
  2979. // res.result.creativeTag=res.result.creativeTag?res.result.creativeTag:[]
  2980. this.sysType=res.result.platformOs
  2981. let fngetIsActivate=new Promise((resolve,reject)=>{
  2982. getAction('/kuaishou/batch/getIsActivate', {
  2983. accountId: this.accountId,
  2984. campaignType: res.result.campaignType,
  2985. appId:res.result.appIdArray?JSON.parse(res.result.appIdArray)[0]:null
  2986. }).then(res => {
  2987. if (res.success) {
  2988. this.groupTypeData = res.result
  2989. resolve()
  2990. }
  2991. })
  2992. })
  2993. let fngetWhite=new Promise((resolve,reject)=>{
  2994. getAction('/kuaishou/batch/getWhiteList', {
  2995. accountId: this.accountId,
  2996. }).then((res) => {
  2997. if (res.success) {
  2998. this.whiteList=res.result
  2999. resolve()
  3000. }
  3001. })
  3002. })
  3003. Promise.all([fngetIsActivate,fngetWhite]).then(r=>{
  3004. // this.form.setFieldsValue({
  3005. // ...res.result,
  3006. // creativeTag:res.result.creativeTag?JSON.parse(res.result.creativeTag):[],
  3007. // useAppMarket:res.result.useAppMarket==1?true:false,
  3008. // isOpen:res.result.isOpen?res.result.isOpen:0,
  3009. // cpaBid:res.result.cpaBid/1000,
  3010. // appId:res.singleAppid?JSON.parse(res.result.appIdArray)[0]:JSON.parse(res.result.appIdArray)
  3011. // })
  3012. if(res.result.creativeCategory){
  3013. // let arr=[];
  3014. if(res.result.creativeCategory>10000){
  3015. res.result.creativeCategory=res.result.creativeCategory?[parseInt(res.result.creativeCategory/10000),parseInt(res.result.creativeCategory/100),res.result.creativeCategory]:[];
  3016. }else if(res.result.creativeCategory>100){
  3017. res.result.creativeCategory=res.result.creativeCategory?[parseInt(res.result.creativeCategory/100),res.result.creativeCategory]:[];
  3018. }else{
  3019. res.result.creativeCategory=res.result.creativeCategory?[res.result.creativeCategory]:[];
  3020. }
  3021. }
  3022. let cpaBid = "";
  3023. if(res.result.cpaBid.includes('/')){
  3024. let bidArr = res.result.cpaBid.split('/')
  3025. for (let index = 0; index < bidArr.length; index++) {
  3026. bidArr[index] = bidArr[index]/1000
  3027. }
  3028. cpaBid = bidArr.join('/')
  3029. }else if(res.result.cpaBid.includes('-')){
  3030. let bidArr = res.result.cpaBid.split('-')
  3031. for (let index = 0; index < bidArr.length; index++) {
  3032. bidArr[index] = bidArr[index]/1000
  3033. }
  3034. cpaBid = bidArr.join('-')
  3035. }else{
  3036. cpaBid = res.result.cpaBid/1000
  3037. }
  3038. this.deviceBrand=res.result.deviceBrand?JSON.parse(res.result.deviceBrand).length>0?1:0:0;
  3039. this.devicePrice=res.result.devicePrice?JSON.parse(res.result.devicePrice).length>0?1:0:0
  3040. this.budgetType = res.result.campaignDayBudget?res.result.campaignDayBudget>0?'2':'1':'1'
  3041. this.dayBudgetType = res.result.unitDayBudget?res.result.unitDayBudget>0?'2':'1':'1'
  3042. this.customUnitCnt = res.result.customUnitCnt
  3043. this.programUnitCnt = res.result.programUnitCnt
  3044. this.customUnitCntMax = Math.floor(2000/res.result.imageCnt)
  3045. this.uriCheck = res.result.schemaUri ? true : false
  3046. this.appType = res.result.appInterest&&JSON.parse(res.result.appInterest).length>0 ? '1' : res.result.appIds&&JSON.parse(res.result.appIds).length>0 ? '2' : '0'
  3047. this.checkArr = this.appType === '2' ? JSON.parse(res.result.appIds) : []
  3048. this.optionsAll = res.result.appIds ? (typeof res.result.appIds == 'string' ? JSON.parse(res.result.appIds) : res.result.appIds) : []
  3049. this.checkAllApp = false
  3050. res.result.appInterest = res.result.appInterest?eval(res.result.appInterest):undefined
  3051. this.descriptionList = res.result.description.charAt(0) === '['?eval(res.result.description).map(item=>{
  3052. return {value:item}
  3053. }):[{value:res.result.description}]
  3054. this.multipleBidData = res.result.appInfoList ? res.result.appInfoList.map(item=>{
  3055. return {
  3056. appId:item.app_id,
  3057. accountId:item.account_id,
  3058. label:`${item.platform === 1?'Android应用下载':item.platform === 2?'Android网页游戏':item.platform === 3?'iOS应用下载':'iOS网页游戏'}`
  3059. +'\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0'+
  3060. item.app_name+'\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0'+item.app_version,
  3061. cpaBid:item.cpa_bid?item.cpa_bid/1000:null,
  3062. trackUrl:item.track_url,
  3063. channelCode:item.channel_code,
  3064. deepConversionBid:item.deep_conversion_bid?item.deep_conversion_bid/1000:null,
  3065. }
  3066. }):[]
  3067. setTimeout(()=>{
  3068. this.form.setFieldsValue({
  3069. ...res.result,
  3070. appId:[],
  3071. creativeTag:res.result.creativeTag?JSON.parse(res.result.creativeTag):[],
  3072. isOpen:res.result.isOpen?res.result.isOpen:0,
  3073. deviceBrand:res.result.deviceBrand?JSON.parse(res.result.deviceBrand):[],
  3074. devicePrice:res.result.devicePrice?JSON.parse(res.result.devicePrice):[],
  3075. useAppMarket:res.result.useAppMarket==1?true:false,
  3076. campaignDayBudget:res.result.campaignDayBudget?res.result.campaignDayBudget/1000:null,
  3077. unitDayBudget:res.result.unitDayBudget?res.result.unitDayBudget/1000:null,
  3078. })
  3079. },0)
  3080. setTimeout(()=>{
  3081. this.form.setFieldsValue({
  3082. androidOsv:res.result.androidOsv?res.result.androidOsv:3,
  3083. iosOsv:res.result.iosOsv?res.result.iosOsv:6,
  3084. url:res.result.url,
  3085. schemaUri:res.result.schemaUri,
  3086. appId:res.result.singleAppid?JSON.parse(res.result.appIdArray).map(item=>{return {key:item}})[0]:JSON.parse(res.result.appIdArray).map(item=>{return {key:item}}),
  3087. appInterest:res.result.appInterest,
  3088. roiRatio:res.result.roiRatio?res.result.roiRatio:null,
  3089. multipleBids:res.result.multipleBids,
  3090. cpaBid:cpaBid,
  3091. })
  3092. },100)
  3093. if((res.result.ocpxActionType == 180 || res.result.ocpxActionType == 53) && this.groupTypeData.deepConversionTypes&&this.groupTypeData.deepConversionTypes.length > 0){
  3094. // //console.log(1)
  3095. setTimeout(()=>{
  3096. this.form.setFieldsValue({
  3097. deepConversionType:res.result.deepConversionType,
  3098. })
  3099. if(res.result.deepConversionBid!=null){
  3100. this.form.setFieldsValue({
  3101. deepConversionBid:res.result.deepConversionBid/1000,
  3102. })
  3103. }
  3104. },0)
  3105. }
  3106. // //console.log(this.getFormData('deepConversionBid'))
  3107. this.noAreaBreak=res.result.noAreaBreak?true:false
  3108. this.noGenderBreak=res.result.noGenderBreak?true:false
  3109. this.noAgeBreak=res.result.noAgeBreak?true:false
  3110. this.appStore=res.result.appStore?JSON.parse(res.result.appStore):[]
  3111. this.ageArr=[];
  3112. this.ageArr=JSON.parse(JSON.stringify(ageArr))
  3113. this.agesRange=res.result.agesRange?JSON.parse(res.result.agesRange).length>0?JSON.parse(res.result.agesRange):[1]:[1]
  3114. // if(agesRange.length>0){
  3115. // agesRange.forEach((item,index)=>{
  3116. // this.ageArr.forEach((ele)=>{
  3117. // if(ele.value==item){
  3118. // ele.checked=true;
  3119. // }
  3120. // })
  3121. // });
  3122. // }
  3123. let sceneId=res.result.sceneId?JSON.parse(res.result.sceneId):[]
  3124. if(sceneId.length==1&&sceneId[0]==1){
  3125. this.adposition=1
  3126. }else if(sceneId.length==1&&sceneId[0]==5){
  3127. this.adposition=5
  3128. }else{
  3129. this.adposition='inventoryTypes';
  3130. this.checkedList=sceneId
  3131. }
  3132. let population=res.result.population?JSON.parse(res.result.population):[]
  3133. let excludePopulation=res.result.excludePopulation?JSON.parse(res.result.excludePopulation):[]
  3134. if(population.length&&excludePopulation.length){
  3135. this.form.setFieldsValue({
  3136. customCrowd:'3'
  3137. })
  3138. }else if(population.length&&!excludePopulation.length){
  3139. this.form.setFieldsValue({
  3140. customCrowd:'1'
  3141. })
  3142. }else if(!population.length&&!excludePopulation.length){
  3143. this.form.setFieldsValue({
  3144. customCrowd:'0'
  3145. })
  3146. }else{
  3147. this.form.setFieldsValue({
  3148. customCrowd:'2'
  3149. })
  3150. }
  3151. this.incluedSelectedRowKeys=res.result.population?JSON.parse(res.result.population):[]
  3152. this.excludeSelectedRowKeys=res.result.excludePopulation?JSON.parse(res.result.excludePopulation):[]
  3153. let region=res.result.region&&eval(res.result.region).length>0?JSON.parse(res.result.region):[]
  3154. if(region.length==0){
  3155. this.district='NONE'
  3156. }else{
  3157. this.district='CITY';
  3158. this.regionList=region
  3159. }
  3160. if(this.getFormData('customCrowd')=='1' || this.getFormData('customCrowd')=='2'){
  3161. this.tabKey=this.getFormData('customCrowd')
  3162. }else if(this.getFormData('customCrowd')=='3'){
  3163. this.tabKey='1'
  3164. }
  3165. this.spinning=false;
  3166. })
  3167. })
  3168. }
  3169. },
  3170. getpopulationlist(){
  3171. this.retargetDataAll=[]
  3172. getAction('/kuaishou/batch/getPopulationList',{
  3173. accountId:this.accountId
  3174. }).then((res)=>{
  3175. // //console.log(res)
  3176. this.loading=false;
  3177. if(res.success){
  3178. res.result.forEach((ele)=>{
  3179. ele.key=ele.orientationId
  3180. ele.id= ele.orientationId
  3181. ele.name=ele.orientationName+"("+ele.orientationId+")"
  3182. ele.accountName=this.accountInfo.title
  3183. ele.accountId=this.accountId
  3184. })
  3185. // this.retargetData=res.data;
  3186. // this.retargetDataAll=[...this.retargetDataAll,...res.result];
  3187. this.retargetDataAll=[...res.result];
  3188. this.retargetDataAll = this.retargetDataAll.filter(item=>{
  3189. return item.populationType !== 7
  3190. })
  3191. }
  3192. })
  3193. },
  3194. clickTrackUrlFocus(){
  3195. // //console.log('focus')
  3196. this.clickTrackUrlTip=true;
  3197. },
  3198. clickTrackUrlBlur(){
  3199. // //console.log('blur')
  3200. this.clickTrackUrlTip=false;
  3201. },
  3202. getChangeAll(type, form, field) {
  3203. var node = document.getElementById(field)
  3204. var v = '-{{' + type + '}}-'
  3205. if (document.selection) {
  3206. //IE
  3207. node.focus()
  3208. var sel = document.selection.createRange()
  3209. sel.text = v
  3210. sel.select()
  3211. if (field == 'campaignName') {
  3212. this[form].setFieldsValue({ campaignName: sel.text })
  3213. } else if (field == 'groupName') {
  3214. this[form].setFieldsValue({ groupName: sel.text })
  3215. }
  3216. } else if (node.selectionStart || node.selectionStart == '0') {
  3217. //MOZILLA/GOOGLE
  3218. var startPos = node.selectionStart
  3219. var endPos = node.selectionEnd
  3220. var restoreTop = node.scrollTop
  3221. node.value = node.value.substring(0, startPos) + v + node.value.substring(endPos, node.value.length)
  3222. if (restoreTop > 0) {
  3223. node.scrollTop = restoreTop
  3224. }
  3225. if (field == 'campaignName') {
  3226. this[form].setFieldsValue({ campaignName: node.value })
  3227. } else if (field == 'groupName') {
  3228. this[form].setFieldsValue({ groupName: node.value })
  3229. }
  3230. node.focus()
  3231. node.selectionStart = startPos + v.length
  3232. node.selectionEnd = startPos + v.length
  3233. // this.campaignName = node.value
  3234. } else {
  3235. //OTHER
  3236. node.value += v
  3237. // console.log(node.value)
  3238. if (field == 'campaignName') {
  3239. this[form].setFieldsValue({ campaignName: node.value })
  3240. } else if (field == 'groupName') {
  3241. this[form].setFieldsValue({ groupName: node.value })
  3242. }
  3243. node.focus()
  3244. // this.campaignName = node.value
  3245. }
  3246. },
  3247. },
  3248. created() {
  3249. if(this.$route){
  3250. let editRecordId=this.$route.query.id;
  3251. if(editRecordId){
  3252. this.$nextTick(()=>{
  3253. this.editRecordId=editRecordId;
  3254. this.editEchoPage()
  3255. })
  3256. }
  3257. }
  3258. },
  3259. mounted() {
  3260. this.accountHttp()
  3261. this.getDataType('APP_INTEREST', 'optionsAppActive')
  3262. // this.$bus.$emit('remove', '/modules/BatchCreate/newGroup')
  3263. let strategyNamepart=this.campaignTypeHandle(this.getFormData('campaignType'));
  3264. this.strategyName ='[预设]_'+ strategyNamepart+'_' + moment().format('MM_DD_hh:mm') ;
  3265. this.getActionBarText()
  3266. },
  3267. filters: {
  3268. getDate(value) {
  3269. let date = new Date(value)
  3270. let y = date.getFullYear()
  3271. let MM = date.getMonth() + 1
  3272. MM = MM < 10 ? '0' + MM : MM
  3273. let d = date.getDate()
  3274. d = d < 10 ? '0' + d : d
  3275. return y + '-' + MM + '-' + d
  3276. },
  3277. platform(str) {
  3278. var data = {
  3279. 1: 'Android应用下载',
  3280. 2: 'Android网页游戏',
  3281. 3: 'iOS应用下载',
  3282. 4: 'iOS网页游戏'
  3283. }
  3284. return data[str]
  3285. },
  3286. customCrowdHandler(val){
  3287. let str=''
  3288. switch (val) {
  3289. case 1:
  3290. str='上传人群'
  3291. break;
  3292. case 2:
  3293. str='广告人群'
  3294. break;
  3295. case 3:
  3296. str='主题专区'
  3297. break;
  3298. case 4:
  3299. str='逻辑规则'
  3300. break;
  3301. case 5:
  3302. str='人群扩展'
  3303. break;
  3304. case 6:
  3305. str='平台定制'
  3306. break;
  3307. case 7:
  3308. str='定制付费'
  3309. break;
  3310. case 8:
  3311. str='网红粉丝类别'
  3312. break;
  3313. case 9:
  3314. str='内容付费行为'
  3315. break;
  3316. case 10:
  3317. str='移动应用安装'
  3318. break;
  3319. case 11:
  3320. str='快手使用活跃度'
  3321. break;
  3322. case 12:
  3323. str='行业分类'
  3324. break;
  3325. case 13:
  3326. str='商业兴趣'
  3327. break;
  3328. case 14:
  3329. str='固化标签'
  3330. break;
  3331. case 15:
  3332. str='行业偏好'
  3333. break;
  3334. case 16:
  3335. str='第三方标签'
  3336. break;
  3337. case 17:
  3338. str='产品关键词'
  3339. break;
  3340. default:
  3341. break;
  3342. }
  3343. return str
  3344. }
  3345. },
  3346. }
  3347. </script>
  3348. <style lang="scss">
  3349. .configLaunchInfo{
  3350. .display-none-selset {
  3351. display: none !important;
  3352. }
  3353. .ant-btn-danger {
  3354. background-color: #ff4d4f !important;
  3355. }
  3356. }
  3357. .ant-tooltip-inner,
  3358. .ant-tooltip-arrow::before {
  3359. background-color: #fff;
  3360. color: #333;
  3361. }
  3362. .ant-tooltip-inner {
  3363. span {
  3364. display: block;
  3365. }
  3366. }
  3367. .ant-tooltip {
  3368. max-width: 450px;
  3369. }
  3370. .configLaunchInfo {
  3371. .ant-radio-button-wrapper {
  3372. min-width: 80px;
  3373. text-align: center;
  3374. }
  3375. .ant-form-item {
  3376. -webkit-box-sizing: border-box;
  3377. box-sizing: border-box;
  3378. margin: 0;
  3379. padding: 0;
  3380. color: rgba(0, 0, 0, 0.65);
  3381. font-size: 14px;
  3382. font-variant: tabular-nums;
  3383. line-height: 1.5;
  3384. list-style: none;
  3385. -webkit-font-feature-settings: 'tnum';
  3386. font-feature-settings: 'tnum';
  3387. vertical-align: top;
  3388. }
  3389. .directedBody {
  3390. .ant-form-item {
  3391. margin-bottom: 20px;
  3392. }
  3393. }
  3394. .inventoryTypes{
  3395. .ant-checkbox-wrapper,
  3396. .ant-checkbox-group-item {
  3397. display: block;
  3398. padding: 5px 15px;
  3399. }
  3400. .ant-checkbox-wrapper:first-child {
  3401. padding: 0 15px 5px;
  3402. }
  3403. .ant-checkbox-wrapper + .ant-checkbox-wrapper {
  3404. margin-left: 0px;
  3405. }
  3406. }
  3407. }
  3408. </style>
  3409. <style lang="scss" scoped>
  3410. .configLaunchInfo {
  3411. .region{
  3412. width: 100%;
  3413. }
  3414. font-family: PingFangSC-Regular, tahoma, arial, 'Hiragino Sans GB', 'Microsoft yahei', sans-serif;
  3415. color: #333;
  3416. ul,
  3417. li {
  3418. margin: 0;
  3419. padding: 0;
  3420. }
  3421. .moduler {
  3422. background: #fff;
  3423. margin-bottom: 16px;
  3424. position: relative;
  3425. padding: 32px 24px 48px 32px;
  3426. border-radius: 4px;
  3427. box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.05);
  3428. .ad-range2{
  3429. width: 680px;
  3430. padding: 5px 32px;
  3431. .ad-range2-title{
  3432. background: #f9f9f9;
  3433. // line-height: 32px;
  3434. // height: 32px;
  3435. padding: 15px 15px;
  3436. border: 1px solid #eaeaea;
  3437. border-bottom: 0;
  3438. }
  3439. .quanxuanDirectional{
  3440. // padding: 0 8px;
  3441. position: absolute;
  3442. right: 10px;
  3443. top: 15px;
  3444. color: #1890ff;
  3445. }
  3446. .title-list {
  3447. // width: calc(100% + 48px);
  3448. width: 100%;
  3449. margin: 0;
  3450. margin-bottom: 0;
  3451. padding: 0;
  3452. background: #fff;
  3453. height: 363px;
  3454. border: 1px solid #eaeaea;
  3455. overflow: scroll;
  3456. overflow-x: hidden;
  3457. // margin-top: 10px;
  3458. }
  3459. .title-list .title-item{
  3460. padding: 10px 30px;
  3461. width: 100%;
  3462. // height: 32px;
  3463. // line-height: 32px;
  3464. // border-bottom: 1px solid #eaeaea;
  3465. }
  3466. }
  3467. .moduler-title {
  3468. display: flex;
  3469. align-items: center;
  3470. font-size: 22px;
  3471. margin-bottom: 20px;
  3472. }
  3473. .row-item {
  3474. display: flex;
  3475. justify-content: flex-start;
  3476. align-items: center;
  3477. margin-bottom: 32px;
  3478. }
  3479. .row-item:last-of-type {
  3480. margin-bottom: 0;
  3481. }
  3482. .row-item .hint-item {
  3483. width: 24px;
  3484. min-width: 24px;
  3485. align-self: flex-start;
  3486. line-height: 20px;
  3487. height: 20px;
  3488. margin-top: 9px;
  3489. }
  3490. .row-item .label-item {
  3491. position: relative;
  3492. align-items: flex-start;
  3493. align-self: flex-start;
  3494. line-height: 20px;
  3495. height: 20px;
  3496. margin-top: 10px;
  3497. width: 120px;
  3498. // min-width: 80px;
  3499. .text-item {
  3500. font-size: 14px;
  3501. width: 100px;
  3502. }
  3503. }
  3504. .row-item .required-item {
  3505. width: 4px;
  3506. height: 4px;
  3507. border-radius: 2px;
  3508. background: #f45858;
  3509. position: absolute;
  3510. right: 10px;
  3511. top: 50%;
  3512. transform: translateY(-50%);
  3513. }
  3514. .row-item .input-item {
  3515. min-width: 480px;
  3516. position: relative;
  3517. // height: 35px;
  3518. .tip {
  3519. font-size: 12px;
  3520. color: tomato;
  3521. }
  3522. .inventory-tags-lists-header {
  3523. background-color: #F8F9FA;
  3524. border: 1px solid #E4E9ED;
  3525. height: 36px;
  3526. line-height: 33px;
  3527. border-radius: 4px 4px 0 0;
  3528. font-weight: bold;
  3529. display: flex;
  3530. }
  3531. .inventory-tags-lists-container {
  3532. border: 1px solid #E4E9ED;
  3533. margin-top: -1px;
  3534. height: 100%;
  3535. padding: 4px 0px;
  3536. border-radius: 0 0 4px 4px;
  3537. }
  3538. .inventory-tags-lists-item {
  3539. width: 100%;
  3540. height: 37px;
  3541. line-height: 37px;
  3542. padding-left: 12px;
  3543. padding-right: 12px;
  3544. display: flex;
  3545. font-size: 14px;
  3546. color: #333;
  3547. }
  3548. }
  3549. }
  3550. .opt {
  3551. text-align: right;
  3552. }
  3553. }
  3554. </style>