createUnit.vue 90 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113
  1. <style>
  2. .create-unit .ant-form-item-control {
  3. line-height: inherit;
  4. }
  5. .create-unit .ant-tabs-bar {
  6. width: 50%;
  7. margin: auto;
  8. margin-bottom: 16px;
  9. border-bottom: 1px solid #e8e8e8;
  10. outline: none;
  11. -webkit-transition: padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  12. transition: padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  13. }
  14. .create-unit .ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab-active {
  15. color: #fff;
  16. background: #1890ff !important;
  17. border-color: #1890ff !important;
  18. border-bottom: 1px solid #1890ff !important;
  19. }
  20. .create-unit .ant-tabs.ant-tabs-card .ant-tabs-card-bar .ant-tabs-tab {
  21. height: 40px;
  22. margin: 0;
  23. margin-right: 2px;
  24. padding: 0 16px;
  25. line-height: 38px;
  26. background: #fafafa;
  27. border: 1px solid #e8e8e8 !important;
  28. border-radius: 4px 4px 0 0 !important;
  29. -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  30. transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  31. }
  32. </style>
  33. <template>
  34. <div class="create-unit">
  35. <a-card :body-style="{ padding: '24px 32px' }" :bordered="false">
  36. <a-form-model ref="unitCreate" :model="form" :label-col="labelCol" :wrapper-col="wrapperCol">
  37. <a-tabs type="card" :label-col="labelCol" :wrapper-col="wrapperCol" @change="changeAccount">
  38. <a-tab-pane :key="item.accountId" :tab="'账户:' + item.accountName" v-for="(item, index) of form.accountArr">
  39. <a-form-model-item label="计划下组是否相同" prop="campaignAgreement">
  40. <a-radio-group v-model="item.campaignAgreement" buttonStyle="solid">
  41. <a-radio-button :value="0">是</a-radio-button>
  42. <a-radio-button :value="1">否</a-radio-button>
  43. </a-radio-group>
  44. </a-form-model-item>
  45. <a-form-model-item label="计划下组数量" prop="unitCount">
  46. <a-input-number v-model="item.unitCount" :min="1" :max="10" @change="changeCreateTotal(item)" />
  47. </a-form-model-item>
  48. <a-tabs type="card" v-if="item.campaignAgreement == 1">
  49. <a-tab-pane
  50. :key="campaign.campaignId"
  51. :tab="'计划:' + campaign.campaignName"
  52. v-for="(campaign, campaignIndex) of item.campaignList"
  53. >
  54. <a-form-model-item label="组是否相同">
  55. <a-radio-group buttonStyle="solid" v-model="campaign.check" @change="nameTypeChange(campaign, item)">
  56. <a-radio-button value="1">是</a-radio-button>
  57. <a-radio-button value="2">否</a-radio-button>
  58. </a-radio-group>
  59. </a-form-model-item>
  60. <a-tabs v-if="campaign.check == '2'" type="card">
  61. <a-tab-pane
  62. :key="indexUnit"
  63. :tab="'组 : ' + (indexUnit + 1)"
  64. v-for="(unitName, indexUnit) of campaign.unit"
  65. >
  66. <a-form-model-item
  67. ref="unitName"
  68. :key="indexUnit"
  69. :label="'组名称'"
  70. :prop="'accountArr.' + index + '.campaignList.' + campaignIndex + '.unit.' + indexUnit + '.name'"
  71. :rules="{
  72. required: true,
  73. message: '组名称必填',
  74. trigger: 'blur',
  75. }"
  76. ><a-input
  77. v-model="unitName.name"
  78. placeholder="请输入组名称"
  79. style="width: 60%; margin-right: 8px"
  80. />
  81. </a-form-model-item>
  82. <a-form-model-item
  83. label="目标应用"
  84. ref="appId"
  85. v-if="item.campaignType == 2"
  86. :prop="'accountArr.' + index + '.campaignList.' + campaignIndex + '.unit.' + indexUnit + '.appId'"
  87. :rules="{
  88. required: true,
  89. message: '目标应用必选',
  90. trigger: 'change',
  91. }"
  92. >
  93. <a-select
  94. v-model="unitName.appId"
  95. showSearch
  96. allowClear
  97. placeholder="选择应用目标"
  98. optionFilterProp="children"
  99. style="width: 500px"
  100. @focus="handleFocus"
  101. @blur="handleBlur"
  102. @change="handleChange"
  103. :filterOption="filterOption"
  104. >
  105. <a-select-option
  106. v-for="appModel in appList"
  107. :key="appModel.appId + 'campaignList'"
  108. :value="appModel.appId"
  109. >
  110. {{ appModel.appName }}&#12288;&nbsp;&#12288;
  111. {{ appModel.appVersion }}&#12288;&#12288;&#12288;{{ appModel.platform | platform }}
  112. </a-select-option>
  113. </a-select>
  114. </a-form-model-item>
  115. <a-form-model-item label="转化类型" ref="urlType" prop="urlType" v-if="item.campaignType == 3">
  116. <a-radio-group buttonStyle="solid" v-model="unitName.urlType">
  117. <a-radio-button value="1">淘宝商品</a-radio-button>
  118. <a-radio-button value="2">淘客商品</a-radio-button>
  119. </a-radio-group>
  120. </a-form-model-item>
  121. <a-form-model-item
  122. :label="item.campaignType == 3 ? ' ' : '链接'"
  123. v-if="item.campaignType != 2"
  124. :rules="{
  125. required: true,
  126. message: '链接不能为空',
  127. trigger: 'blur',
  128. }"
  129. >
  130. <a-input placeholder="请填写链接" v-model="unitName.url" />
  131. </a-form-model-item>
  132. <a-form-model-item
  133. label="转化目标"
  134. v-if="item.campaignType == 2 || item.campaignType == 4 || item.campaignType == 5"
  135. >
  136. <span v-if="unitName.convertId && !convert" style="display: block; font-size: 16px"
  137. >已选择转化目标: {{ convertId.label }}</span
  138. >
  139. <a-button type="primary" @click="showConvert(item, unitName)">{{
  140. unitName.convertId ? '更换转化目标' : '选择转化目标'
  141. }}</a-button>
  142. </a-form-model-item>
  143. <a-form-model-item
  144. v-bind="formItemLayout"
  145. v-if="
  146. item.campaignType == 2 &&
  147. (getPlatForm(unitName.appId) == '1' || getPlatForm(unitName.appId) == '2')
  148. "
  149. >
  150. <a-checkbox v-model="unitName.useAppMarket"> 优先从系统应用商店下载 </a-checkbox>
  151. </a-form-model-item>
  152. <a-form-model-item v-bind="formItemLayout" v-if="unitName.useAppMarket">
  153. 请勾选投放应用已上架的应用商店(默认全选)
  154. <br />
  155. <a-checkbox-group v-model="unitName.appStore">
  156. <a-checkbox value="huawei">华为</a-checkbox>
  157. <a-checkbox value="oppo">OPPO</a-checkbox>
  158. <a-checkbox value="vivo">VIVO</a-checkbox>
  159. <a-checkbox value="xiaomi">小米</a-checkbox>
  160. <a-checkbox value="meizu">魅族</a-checkbox>
  161. <a-checkbox value="smartisan">锤子</a-checkbox>
  162. </a-checkbox-group>
  163. </a-form-model-item>
  164. <a-form-model-item
  165. label="定向模板"
  166. ref="templateId"
  167. :prop="
  168. 'accountArr.' + index + '.campaignList.' + campaignIndex + '.unit.' + indexUnit + '.templateId'
  169. "
  170. :rules="{
  171. required: true,
  172. message: '定向模板必选',
  173. trigger: 'change',
  174. }"
  175. >
  176. <a-select
  177. v-model="unitName.templateId"
  178. showSearch
  179. allowClear
  180. placeholder="选择定向模板"
  181. optionFilterProp="children"
  182. style="width: 500px"
  183. @focus="handleFocus"
  184. @blur="handleBlur"
  185. @change="handleChange"
  186. :filterOption="filterOption"
  187. >
  188. <a-select-option
  189. v-for="appModel in templateList"
  190. :key="appModel.templateId"
  191. :value="appModel.templateId"
  192. >
  193. {{ appModel.templateName }}
  194. </a-select-option>
  195. </a-select>
  196. <a style="margin: 0 10px" @click="addTemplate(item.accountId)">新增模板</a>
  197. <a
  198. @click="lookTemplate(item.accountId, unitName.templateId)"
  199. :disabled="unitName.templateId == ''"
  200. >查看模板</a
  201. >
  202. </a-form-model-item>
  203. <a-form-model-item label="投放范围">
  204. <a-radio-group buttonStyle="solid" v-model="unitName.allianceAccount" disabled>
  205. <a-radio-button value="1">默认</a-radio-button>
  206. <a-radio-button value="2">联盟广告</a-radio-button>
  207. </a-radio-group>
  208. </a-form-model-item>
  209. <a-form-model-item label="单日预算">
  210. <a-radio-group buttonStyle="solid" v-model="unitName.dayBudgetType">
  211. <a-radio-button value="0">不限</a-radio-button>
  212. <a-radio-button value="1">统一预算</a-radio-button>
  213. </a-radio-group>
  214. </a-form-model-item>
  215. <a-form-model-item
  216. label=""
  217. v-bind="unitName.dayBudgetType == '1' ? formItemLayout : {}"
  218. v-if="unitName.dayBudgetType == '1'"
  219. :prop="
  220. 'accountArr.' + index + '.campaignList.' + campaignIndex + '.unit.' + indexUnit + '.dayBudget'
  221. "
  222. :rules="{
  223. required: true,
  224. message: '预算不能为空',
  225. trigger: 'blur',
  226. }"
  227. >
  228. <a-input
  229. placeholder="不小于100,不超过100000000,仅支持输入自然数"
  230. style="width: 60%"
  231. v-model="unitName.dayBudget"
  232. />
  233. </a-form-model-item>
  234. <a-form-model-item label="投放方式">
  235. <a-radio-group buttonStyle="solid" v-model="unitName.speed">
  236. <a-radio-button value="1">正常投放</a-radio-button>
  237. <a-radio-button value="2">平滑投放</a-radio-button>
  238. </a-radio-group>
  239. <br />
  240. <span>
  241. {{ unitName.speed == '2' ? '平滑匀速投放' : '尽快展示广告消耗预算' }}
  242. </span>
  243. </a-form-model-item>
  244. <a-form-model-item label="排期">
  245. <!-- v-decorator="['speed', { initialValue: '1' }]" -->
  246. <a-radio-group buttonStyle="solid" v-model="unitName.time" @change="setTime(unitName)">
  247. <a-radio-button value="1">从今天开始长期投放</a-radio-button>
  248. <a-radio-button value="2">设置开始和结束日期</a-radio-button>
  249. </a-radio-group>
  250. <br />
  251. <a-range-picker
  252. v-if="unitName.time == '2'"
  253. v-model="unitName.timeRange"
  254. format="YYYY-MM-DD"
  255. style="margin-top: 15px"
  256. :allowClear="false"
  257. />
  258. </a-form-model-item>
  259. <a-form-model-item label="投放时段">
  260. <a-radio-group
  261. buttonStyle="solid"
  262. v-model="unitName.scheduleTimeData"
  263. @change="setTimeAll(unitName)"
  264. >
  265. <a-radio-button value="1">全天</a-radio-button>
  266. <a-radio-button value="2">特定时间</a-radio-button>
  267. </a-radio-group>
  268. <br />
  269. <selectCheckAll
  270. style="width: 60%; margin-top: 15px"
  271. v-if="unitName.scheduleTimeData == '2'"
  272. :scheduleTime.sync="unitName.scheduleTime"
  273. ref="selectCheck"
  274. />
  275. </a-form-model-item>
  276. <a-form-model-item label="创意展现方式" prop="campaign">
  277. <a-radio-group buttonStyle="solid" v-model="unitName.showMode">
  278. <a-radio-button value="2">智能优选</a-radio-button>
  279. <a-radio-button value="1">随机轮播</a-radio-button>
  280. </a-radio-group>
  281. <br />
  282. <span>
  283. {{
  284. unitName.showMode == '1'
  285. ? '广告组包含的广告创意将随机展现'
  286. : '每一次展现的时候,系统会进行CTR预估,预估CTR高的会得到展现机会'
  287. }}
  288. </span>
  289. </a-form-model-item>
  290. <a-form-model-item label="场景广告位">
  291. <checkBoxGroup
  292. :options="[
  293. { label: '优选广告位', value: 1 },
  294. { label: '信息流广告', value: 7 },
  295. { label: '上下滑大屏广告', value: 6 },
  296. { label: '视频播放页广告', value: 3 },
  297. ]"
  298. v-model="unitName.sceneId"
  299. @change="changeData"
  300. :disabled="unitName.allianceAccount == '2'"
  301. />
  302. </a-form-model-item>
  303. <a-form-model-item label="优化目标">
  304. <a-radio-group buttonStyle="solid" v-model="unitName.bidType" @change="changeBidType(unitName)">
  305. <a-radio-button :value="1">点击数</a-radio-button>
  306. <a-radio-button :value="10">转化数</a-radio-button>
  307. </a-radio-group>
  308. </a-form-model-item>
  309. <a-form-model-item label="转化目标" v-if="unitName.bidType == 10">
  310. <a-select v-model="unitName.ocpxActionType" style="width: 60%">
  311. <a-select-option :value="2">行为数</a-select-option>
  312. <a-select-option :value="180" v-if=" groupTypeData.isActivate == '1'"
  313. >激活</a-select-option
  314. >
  315. <a-select-option
  316. :value="53"
  317. v-if="
  318. groupTypeData.isFormSubmit == '1'
  319. "
  320. >表单提交</a-select-option
  321. >
  322. <a-select-option :value="394" v-if="groupTypeData.isOrderSubmit == '1'"
  323. >订单提交</a-select-option
  324. >
  325. <a-select-option :value="348" v-if="groupTypeData.isValidClue == '1'"
  326. >使用有效线索</a-select-option
  327. >
  328. <a-select-option :value="383" v-if="groupTypeData.isCreditGrant == '1'"
  329. >授信出价</a-select-option
  330. >
  331. <a-select-option :value="384" v-if="groupTypeData.isWanJian == '1'">完件出价</a-select-option>
  332. <a-select-option :value="190" v-if="groupTypeData.isPurchase == '1'">付费出价</a-select-option>
  333. <a-select-option :value="191" v-if="groupTypeData.isFirstdayRoi == '1'"
  334. >首日ROI</a-select-option
  335. >
  336. <a-select-option :value="396" v-if="groupTypeData.isRegister == '1'"
  337. >注册优化目标</a-select-option
  338. >
  339. </a-select>
  340. </a-form-model-item>
  341. <a-form-model-item
  342. label="深度转化目标"
  343. v-if="
  344. (unitName.ocpxActionType == 180 || unitName.ocpxActionType == 53) &&
  345. groupTypeData.deepConversionTypes.length > 0
  346. "
  347. >
  348. <a-select v-model="unitName.deepConversionType" allowClear>
  349. <a-select-option
  350. :value="items.deepConversionType"
  351. v-for="(items, index) of groupTypeData.deepConversionTypes"
  352. :key="index"
  353. >
  354. {{ items.desc }}</a-select-option
  355. >
  356. </a-select>
  357. </a-form-model-item>
  358. <a-form-model-item label="计费方式">
  359. <a-radio-group defaultValue="1" style="margin-top: 8px">
  360. <a-radio value="1">{{ unitName.bidType == 1 ? '点击计费' : '展示计费(oCPM)' }}</a-radio>
  361. </a-radio-group>
  362. </a-form-model-item>
  363. <a-form-model-item
  364. label="出价"
  365. v-if="unitName.bidType == 1"
  366. :prop="'accountArr.' + index + '.campaignList.' + campaignIndex + '.unit.' + indexUnit + '.bid'"
  367. :rules="{
  368. required: true,
  369. message: '出价不能为空',
  370. trigger: 'blur',
  371. }"
  372. >
  373. <a-input-number v-model="unitName.bid"> </a-input-number>
  374. </a-form-model-item>
  375. <a-form-model-item
  376. label="目标成本"
  377. v-else
  378. :prop="
  379. 'accountArr.' + index + '.campaignList.' + campaignIndex + '.unit.' + indexUnit + '.cpaBid'
  380. "
  381. :rules="{
  382. required: true,
  383. message: '目标成本不能为空',
  384. trigger: 'blur',
  385. }"
  386. >
  387. <a-input-number v-model="unitName.cpaBid"> </a-input-number>
  388. </a-form-model-item>
  389. <a-form-model-item
  390. label="深度转化出价"
  391. :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
  392. :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }"
  393. v-if="
  394. (unitName.ocpxActionType == 180 || unitName.ocpxActionType == 53) &&
  395. groupTypeData.deepConversionTypes.length > 0 &&
  396. unitName.deepConversionType != ''
  397. "
  398. >
  399. <a-input-number
  400. v-model="unitName.deepConversionBid"
  401. :disabled="unitName.cpaBid == '' || unitName.cpaBid == null"
  402. ></a-input-number>
  403. </a-form-model-item>
  404. </a-tab-pane>
  405. </a-tabs>
  406. <div v-else>
  407. <a-form-model-item
  408. label="组名称"
  409. :prop="
  410. 'accountArr.' +
  411. index +
  412. '.campaignList.' +
  413. campaignIndex +
  414. '.unitIdentical.unitName.' +
  415. unitIndex +
  416. '.name'
  417. "
  418. :rules="{
  419. required: true,
  420. message: '组名称必填',
  421. trigger: 'blur',
  422. }"
  423. v-for="(unitCount, unitIndex) in campaign.unitIdentical.unitName"
  424. :key="unitIndex"
  425. :label="unitIndex == 0 ? '组名称' : ''"
  426. v-bind="unitIndex !== 0 ? formItemLayout : {}"
  427. >
  428. <a-input
  429. v-model="unitCount.name"
  430. placeholder="请输入组名称"
  431. style="width: 60%; margin-right: 8px"
  432. />
  433. </a-form-model-item>
  434. <a-form-model-item
  435. label="目标应用"
  436. ref="appId"
  437. prop="appId"
  438. v-if="item.campaignType == 2"
  439. :prop="'accountArr.' + index + '.campaignList.' + campaignIndex + '.unitIdentical.appId'"
  440. :rules="{
  441. required: true,
  442. message: '应用目标必选',
  443. trigger: 'change',
  444. }"
  445. >
  446. <a-select
  447. v-model="campaign.unitIdentical.appId"
  448. showSearch
  449. allowClear
  450. placeholder="选择应用目标"
  451. optionFilterProp="children"
  452. style="width: 500px"
  453. @focus="handleFocus"
  454. @blur="handleBlur"
  455. @change="handleChange"
  456. :filterOption="filterOption"
  457. >
  458. <a-select-option
  459. v-for="appModel in appList"
  460. :key="appModel.appId + 'unitIdentical'"
  461. :value="appModel.appId"
  462. >
  463. {{ appModel.appName }}&#12288;&nbsp;&#12288; {{ appModel.appVersion }}&#12288;&#12288;&#12288;{{
  464. appModel.platform | platform
  465. }}
  466. </a-select-option>
  467. </a-select>
  468. </a-form-model-item>
  469. <a-form-model-item label="转化类型" ref="urlType" prop="urlType" v-if="item.campaignType == 3">
  470. <a-radio-group buttonStyle="solid" v-model="campaign.unitIdentical.urlType">
  471. <a-radio-button value="1">淘宝商品</a-radio-button>
  472. <a-radio-button value="2">淘客商品</a-radio-button>
  473. </a-radio-group>
  474. </a-form-model-item>
  475. <a-form-model-item
  476. :label="item.campaignType == 3 ? ' ' : '链接'"
  477. v-if="item.campaignType != 2"
  478. :rules="{
  479. required: true,
  480. message: '链接不能为空',
  481. trigger: 'blur',
  482. }"
  483. >
  484. <a-input placeholder="请填写链接" v-model="campaign.unitIdentical.url" />
  485. </a-form-model-item>
  486. <a-form-model-item
  487. label="转化目标"
  488. v-if="item.campaignType == 2 || item.campaignType == 4 || item.campaignType == 5"
  489. >
  490. <span v-if="campaign.unitIdentical.convertId && !convert" style="display: block; font-size: 16px"
  491. >已选择转化目标: {{ campaign.unitIdentical.label }}</span
  492. >
  493. <a-button type="primary" @click="showConvert(item, campaign.unitIdentical)">{{
  494. campaign.unitIdentical.convertId ? '更换转化目标' : '选择转化目标'
  495. }}</a-button>
  496. </a-form-model-item>
  497. <a-form-model-item
  498. v-bind="formItemLayout"
  499. v-if="
  500. item.campaignType == 2 &&
  501. (getPlatForm(campaign.unitIdentical.appId) == '1' ||
  502. getPlatForm(campaign.unitIdentical.appId) == '2')
  503. "
  504. >
  505. <a-checkbox v-model="campaign.unitIdentical.useAppMarket"> 优先从系统应用商店下载 </a-checkbox>
  506. </a-form-model-item>
  507. <a-form-model-item v-bind="formItemLayout" v-if="campaign.unitIdentical.useAppMarket">
  508. 请勾选投放应用已上架的应用商店(默认全选)
  509. <br />
  510. <a-checkbox-group v-model="campaign.unitIdentical.appStore">
  511. <a-checkbox value="huawei">华为</a-checkbox>
  512. <a-checkbox value="oppo">OPPO</a-checkbox>
  513. <a-checkbox value="vivo">VIVO</a-checkbox>
  514. <a-checkbox value="xiaomi">小米</a-checkbox>
  515. <a-checkbox value="meizu">魅族</a-checkbox>
  516. <a-checkbox value="smartisan">锤子</a-checkbox>
  517. </a-checkbox-group>
  518. </a-form-model-item>
  519. <a-form-model-item
  520. label="定向模板"
  521. ref="templateId"
  522. :prop="'accountArr.' + index + '.campaignList.' + campaignIndex + '.unitIdentical.templateId'"
  523. :rules="{
  524. required: true,
  525. message: '定向模板必选',
  526. trigger: 'change',
  527. }"
  528. >
  529. <a-select
  530. v-model="campaign.unitIdentical.templateId"
  531. showSearch
  532. allowClear
  533. placeholder="选择定向模板"
  534. optionFilterProp="children"
  535. style="width: 500px"
  536. @focus="handleFocus"
  537. @blur="handleBlur"
  538. @change="handleChange"
  539. :filterOption="filterOption"
  540. >
  541. <a-select-option
  542. v-for="appModel in templateList"
  543. :key="appModel.templateId"
  544. :value="appModel.templateId"
  545. >
  546. {{ appModel.templateName }}
  547. </a-select-option>
  548. </a-select>
  549. <a style="margin: 0 10px" @click="addTemplate(item.accountId)">新增模板</a>
  550. <a
  551. @click="lookTemplate(item.accountId, campaign.unitIdentical.templateId)"
  552. :disabled="campaign.unitIdentical.templateId == ''"
  553. >查看模板</a
  554. >
  555. </a-form-model-item>
  556. <a-form-model-item label="投放范围">
  557. <a-radio-group buttonStyle="solid" v-model="campaign.unitIdentical.allianceAccount" disabled>
  558. <a-radio-button value="1">默认</a-radio-button>
  559. <a-radio-button value="2">联盟广告</a-radio-button>
  560. </a-radio-group>
  561. </a-form-model-item>
  562. <a-form-model-item label="单日预算">
  563. <a-radio-group buttonStyle="solid" v-model="campaign.unitIdentical.dayBudgetType">
  564. <a-radio-button value="0">不限</a-radio-button>
  565. <a-radio-button value="1">统一预算</a-radio-button>
  566. </a-radio-group>
  567. </a-form-model-item>
  568. <a-form-model-item
  569. label=""
  570. v-bind="campaign.unitIdentical.dayBudgetType == '1' ? formItemLayout : {}"
  571. v-if="campaign.unitIdentical.dayBudgetType == '1'"
  572. :prop="'accountArr.' + index + '.campaignList.' + campaignIndex + '.unitIdentical.dayBudget'"
  573. :rules="{
  574. required: true,
  575. message: '预算不能为空',
  576. trigger: 'blur',
  577. }"
  578. >
  579. <a-input
  580. placeholder="不小于100,不超过100000000,仅支持输入自然数"
  581. style="width: 60%"
  582. v-model="campaign.unitIdentical.dayBudget"
  583. />
  584. </a-form-model-item>
  585. <a-form-model-item label="投放方式">
  586. <a-radio-group buttonStyle="solid" v-model="campaign.unitIdentical.speed">
  587. <a-radio-button value="1">正常投放</a-radio-button>
  588. <a-radio-button value="2">平滑投放</a-radio-button>
  589. </a-radio-group>
  590. <br />
  591. <span>
  592. {{ campaign.unitIdentical.speed == '2' ? '平滑匀速投放' : '尽快展示广告消耗预算' }}
  593. </span>
  594. </a-form-model-item>
  595. <a-form-model-item label="排期">
  596. <!-- v-decorator="['speed', { initialValue: '1' }]" -->
  597. <a-radio-group
  598. buttonStyle="solid"
  599. v-model="campaign.unitIdentical.time"
  600. @change="setTime(campaign.unitIdentical)"
  601. >
  602. <a-radio-button value="1">从今天开始长期投放</a-radio-button>
  603. <a-radio-button value="2">设置开始和结束日期</a-radio-button>
  604. </a-radio-group>
  605. <br />
  606. <a-range-picker
  607. v-if="campaign.unitIdentical.time == '2'"
  608. v-model="campaign.unitIdentical.timeRange"
  609. format="YYYY-MM-DD"
  610. style="margin-top: 15px"
  611. :allowClear="false"
  612. />
  613. </a-form-model-item>
  614. <a-form-model-item label="投放时段">
  615. <a-radio-group
  616. buttonStyle="solid"
  617. v-model="campaign.unitIdentical.scheduleTimeData"
  618. @change="setTimeAll(campaign.unitIdentical)"
  619. >
  620. <a-radio-button value="1">全天</a-radio-button>
  621. <a-radio-button value="2">特定时间</a-radio-button>
  622. </a-radio-group>
  623. <br />
  624. <selectCheckAll
  625. style="width: 60%; margin-top: 15px"
  626. v-if="campaign.unitIdentical.scheduleTimeData == '2'"
  627. :scheduleTime.sync="campaign.unitIdentical.scheduleTime"
  628. ref="selectCheck"
  629. />
  630. </a-form-model-item>
  631. <a-form-model-item label="创意展现方式" prop="campaign">
  632. <a-radio-group buttonStyle="solid" v-model="campaign.unitIdentical.showMode">
  633. <a-radio-button value="2">智能优选</a-radio-button>
  634. <a-radio-button value="1">随机轮播</a-radio-button>
  635. </a-radio-group>
  636. <br />
  637. <span>
  638. {{
  639. campaign.unitIdentical.showMode == '1'
  640. ? '广告组包含的广告创意将随机展现'
  641. : '每一次展现的时候,系统会进行CTR预估,预估CTR高的会得到展现机会'
  642. }}
  643. </span>
  644. </a-form-model-item>
  645. <a-form-model-item label="场景广告位">
  646. <checkBoxGroup
  647. :options="[
  648. { label: '优选广告位', value: 1 },
  649. { label: '信息流广告', value: 7 },
  650. { label: '上下滑大屏广告', value: 6 },
  651. { label: '视频播放页广告', value: 3 },
  652. ]"
  653. v-model="campaign.unitIdentical.sceneId"
  654. @change="changeData"
  655. :disabled="campaign.unitIdentical.allianceAccount == '2'"
  656. />
  657. </a-form-model-item>
  658. <a-form-model-item label="优化目标">
  659. <a-radio-group
  660. buttonStyle="solid"
  661. v-model="campaign.unitIdentical.bidType"
  662. @change="changeBidType(campaign.unitIdentical)"
  663. >
  664. <a-radio-button :value="1">点击数</a-radio-button>
  665. <a-radio-button :value="10">转化数</a-radio-button>
  666. </a-radio-group>
  667. </a-form-model-item>
  668. <a-form-model-item label="转化目标" v-if="campaign.unitIdentical.bidType == 10">
  669. <a-select v-model="campaign.unitIdentical.ocpxActionType" style="width: 60%">
  670. <a-select-option :value="2">行为数</a-select-option>
  671. <a-select-option :value="180" v-if=" groupTypeData.isActivate == '1'"
  672. >激活</a-select-option
  673. >
  674. <a-select-option
  675. :value="53"
  676. v-if="
  677. groupTypeData.isFormSubmit == '1'
  678. "
  679. >表单提交</a-select-option
  680. >
  681. <a-select-option :value="394" v-if="groupTypeData.isOrderSubmit == '1'">订单提交</a-select-option>
  682. <a-select-option :value="348" v-if="groupTypeData.isValidClue == '1'"
  683. >使用有效线索</a-select-option
  684. >
  685. <a-select-option :value="383" v-if="groupTypeData.isCreditGrant == '1'">授信出价</a-select-option>
  686. <a-select-option :value="384" v-if="groupTypeData.isWanJian == '1'">完件出价</a-select-option>
  687. <a-select-option :value="190" v-if="groupTypeData.isPurchase == '1'">付费出价</a-select-option>
  688. <a-select-option :value="191" v-if="groupTypeData.isFirstdayRoi == '1'">首日ROI</a-select-option>
  689. <a-select-option :value="396" v-if="groupTypeData.isRegister == '1'"
  690. >注册优化目标</a-select-option
  691. >
  692. </a-select>
  693. </a-form-model-item>
  694. <a-form-model-item
  695. label="深度转化目标"
  696. v-if="
  697. (campaign.unitIdentical.ocpxActionType == 180 || campaign.unitIdentical.ocpxActionType == 53) &&
  698. groupTypeData.deepConversionTypes.length > 0
  699. "
  700. >
  701. <a-select v-model="campaign.unitIdentical.deepConversionType" allowClear>
  702. <a-select-option
  703. :value="items.deepConversionType"
  704. v-for="(items, index) of groupTypeData.deepConversionTypes"
  705. :key="index"
  706. >
  707. {{ items.desc }}</a-select-option
  708. >
  709. </a-select>
  710. </a-form-model-item>
  711. <a-form-model-item label="计费方式">
  712. <a-radio-group defaultValue="1" style="margin-top: 8px">
  713. <a-radio value="1">{{
  714. campaign.unitIdentical.bidType == 1 ? '点击计费' : '展示计费(oCPM)'
  715. }}</a-radio>
  716. </a-radio-group>
  717. </a-form-model-item>
  718. <a-form-model-item
  719. label="出价"
  720. v-if="campaign.unitIdentical.bidType == 1"
  721. :prop="'accountArr.' + index + '.campaignList.' + campaignIndex + '.unitIdentical.bid'"
  722. :rules="{
  723. required: true,
  724. message: '出价不能为空',
  725. trigger: 'change',
  726. }"
  727. >
  728. <a-input-number v-model="campaign.unitIdentical.bid"> </a-input-number>
  729. </a-form-model-item>
  730. <a-form-model-item
  731. label="目标成本"
  732. v-else
  733. :prop="'accountArr.' + index + '.campaignList.' + campaignIndex + '.unitIdentical.cpaBid'"
  734. :rules="{
  735. required: true,
  736. message: '目标成本不能为空',
  737. trigger: 'change',
  738. }"
  739. >
  740. <a-input-number v-model="campaign.unitIdentical.cpaBid"> </a-input-number>
  741. </a-form-model-item>
  742. <a-form-model-item
  743. label="深度转化出价"
  744. :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
  745. :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }"
  746. v-if="
  747. (campaign.unitIdentical.ocpxActionType == 180 || campaign.unitIdentical.ocpxActionType == 53) &&
  748. groupTypeData.deepConversionTypes.length > 0 &&
  749. campaign.unitIdentical.deepConversionType != ''
  750. "
  751. >
  752. <a-input-number
  753. v-model="campaign.unitIdentical.deepConversionBid"
  754. :disabled="campaign.unitIdentical.cpaBid == '' || campaign.unitIdentical.cpaBid == null"
  755. ></a-input-number>
  756. </a-form-model-item>
  757. </div>
  758. </a-tab-pane>
  759. </a-tabs>
  760. <div v-else>
  761. <a-form-model-item
  762. ref="unitName"
  763. v-for="(unitName, indexUnit) of item.campaignOne.unitNames"
  764. :key="indexUnit"
  765. :label="indexUnit == 0 ? '组名称' : ''"
  766. v-bind="indexUnit !== 0 ? formItemLayout : {}"
  767. :prop="'accountArr.' + index + '.campaignOne.unitNames.' + indexUnit + '.value'"
  768. :rules="{
  769. required: true,
  770. message: '组名称必填',
  771. trigger: 'blur',
  772. }"
  773. ><a-input v-model="unitName.value" placeholder="请输入组名称" style="width: 60%; margin-right: 8px" />
  774. </a-form-model-item>
  775. <a-form-model-item
  776. label="目标应用"
  777. ref="appId"
  778. prop="appId"
  779. v-if="item.campaignType == 2"
  780. :prop="'accountArr.' + index + '.campaignOne.appId'"
  781. :rules="{
  782. required: true,
  783. message: '目标应用必选',
  784. trigger: 'change',
  785. }"
  786. >
  787. <a-select
  788. v-model="item.campaignOne.appId"
  789. showSearch
  790. allowClear
  791. placeholder="选择应用目标"
  792. optionFilterProp="children"
  793. style="width: 500px"
  794. @focus="handleFocus"
  795. @blur="handleBlur"
  796. @change="handleChange"
  797. :filterOption="filterOption"
  798. >
  799. <a-select-option
  800. v-for="appModel in appList"
  801. :key="appModel.appId + 'campaignOne'"
  802. :value="appModel.appId"
  803. >
  804. {{ appModel.appName }}&#12288;&nbsp;&#12288; {{ appModel.appVersion }}&#12288;&#12288;&#12288;{{
  805. appModel.platform | platform
  806. }}
  807. </a-select-option>
  808. </a-select>
  809. </a-form-model-item>
  810. <a-form-model-item label="转化类型" ref="urlType" prop="urlType" v-if="item.campaignType == 3">
  811. <a-radio-group buttonStyle="solid" v-model="item.campaignOne.urlType">
  812. <a-radio-button value="1">淘宝商品</a-radio-button>
  813. <a-radio-button value="2">淘客商品</a-radio-button>
  814. </a-radio-group>
  815. </a-form-model-item>
  816. <a-form-model-item
  817. :label="item.campaignType == 3 ? ' ' : '链接'"
  818. v-if="item.campaignType != 2"
  819. :rules="{
  820. required: true,
  821. message: '链接不能为空',
  822. trigger: 'blur',
  823. }"
  824. >
  825. <a-input placeholder="请填写链接" v-model="item.campaignOne.url" />
  826. </a-form-model-item>
  827. <a-form-model-item
  828. label="转化目标"
  829. v-if="item.campaignType == 2 || item.campaignType == 4 || item.campaignType == 5"
  830. >
  831. <span v-if="item.campaignOne.convertId && !convert" style="display: block; font-size: 16px"
  832. >已选择转化目标: {{ item.campaignOne.convertId.label }}</span
  833. >
  834. <a-button type="primary" @click="showConvert(item, item.campaignOne)">{{
  835. item.campaignOne.convertId ? '更换转化目标' : '选择转化目标'
  836. }}</a-button>
  837. </a-form-model-item>
  838. <a-form-model-item
  839. v-bind="formItemLayout"
  840. v-if="
  841. item.campaignType == 2 &&
  842. (getPlatForm(item.campaignOne.appId) == '1' || getPlatForm(item.campaignOne.appId) == '2')
  843. "
  844. >
  845. <a-checkbox v-model="item.campaignOne.useAppMarket"> 优先从系统应用商店下载 </a-checkbox>
  846. </a-form-model-item>
  847. <a-form-model-item v-bind="formItemLayout" v-if="item.campaignOne.useAppMarket">
  848. 请勾选投放应用已上架的应用商店(默认全选)
  849. <br />
  850. <a-checkbox-group v-model="item.campaignOne.appStore">
  851. <a-checkbox value="huawei">华为</a-checkbox>
  852. <a-checkbox value="oppo">OPPO</a-checkbox>
  853. <a-checkbox value="vivo">VIVO</a-checkbox>
  854. <a-checkbox value="xiaomi">小米</a-checkbox>
  855. <a-checkbox value="meizu">魅族</a-checkbox>
  856. <a-checkbox value="smartisan">锤子</a-checkbox>
  857. </a-checkbox-group>
  858. </a-form-model-item>
  859. <a-form-model-item
  860. label="定向模板"
  861. ref="templateId"
  862. :prop="'accountArr.' + index + '.campaignOne.templateId'"
  863. :rules="{
  864. required: true,
  865. message: '定向模板必选',
  866. trigger: 'change',
  867. }"
  868. >
  869. <a-select
  870. v-model="item.campaignOne.templateId"
  871. showSearch
  872. allowClear
  873. placeholder="选择定向模板"
  874. optionFilterProp="children"
  875. style="width: 500px"
  876. @focus="handleFocus"
  877. @blur="handleBlur"
  878. @change="handleChange"
  879. :filterOption="filterOption"
  880. >
  881. <a-select-option
  882. v-for="appModel in templateList"
  883. :key="appModel.templateId"
  884. :value="appModel.templateId"
  885. >
  886. {{ appModel.templateName }}
  887. </a-select-option>
  888. </a-select>
  889. <a style="margin: 0 10px" @click="addTemplate(item.accountId)">新增模板</a>
  890. <a
  891. @click="lookTemplate(item.accountId, item.campaignOne.templateId)"
  892. :disabled="item.campaignOne.templateId == ''"
  893. >查看模板</a
  894. >
  895. </a-form-model-item>
  896. <a-form-model-item label="投放范围">
  897. <a-radio-group buttonStyle="solid" v-model="item.campaignOne.allianceAccount" disabled>
  898. <a-radio-button value="1">默认</a-radio-button>
  899. <a-radio-button value="2">联盟广告</a-radio-button>
  900. </a-radio-group>
  901. </a-form-model-item>
  902. <a-form-model-item label="单日预算">
  903. <a-radio-group buttonStyle="solid" v-model="item.campaignOne.dayBudgetType">
  904. <a-radio-button value="0">不限</a-radio-button>
  905. <a-radio-button value="1">统一预算</a-radio-button>
  906. </a-radio-group>
  907. </a-form-model-item>
  908. <a-form-model-item
  909. label=""
  910. v-bind="item.campaignOne.dayBudgetType == '1' ? formItemLayout : {}"
  911. v-if="item.campaignOne.dayBudgetType == '1'"
  912. :prop="'accountArr.' + index + '.campaignOne.dayBudget'"
  913. :rules="{
  914. required: true,
  915. message: '预算不能为空',
  916. trigger: 'blur',
  917. }"
  918. >
  919. <a-input
  920. placeholder="不小于100,不超过100000000,仅支持输入自然数"
  921. style="width: 60%"
  922. v-model="item.campaignOne.dayBudget"
  923. />
  924. </a-form-model-item>
  925. <a-form-model-item label="投放方式">
  926. <a-radio-group buttonStyle="solid" v-model="item.campaignOne.speed">
  927. <a-radio-button value="1">正常投放</a-radio-button>
  928. <a-radio-button value="2">平滑投放</a-radio-button>
  929. </a-radio-group>
  930. <br />
  931. <span>
  932. {{ item.campaignOne.speed == '2' ? '平滑匀速投放' : '尽快展示广告消耗预算' }}
  933. </span>
  934. </a-form-model-item>
  935. <a-form-model-item label="排期">
  936. <!-- v-decorator="['speed', { initialValue: '1' }]" -->
  937. <a-radio-group buttonStyle="solid" v-model="item.campaignOne.time" @change="setTime(item.campaignOne)">
  938. <a-radio-button value="1">从今天开始长期投放</a-radio-button>
  939. <a-radio-button value="2">设置开始和结束日期</a-radio-button>
  940. </a-radio-group>
  941. <br />
  942. <a-range-picker
  943. v-if="item.campaignOne.time == '2'"
  944. v-model="item.campaignOne.timeRange"
  945. format="YYYY-MM-DD"
  946. style="margin-top: 15px"
  947. :allowClear="false"
  948. />
  949. </a-form-model-item>
  950. <a-form-model-item label="投放时段">
  951. <a-radio-group
  952. buttonStyle="solid"
  953. v-model="item.campaignOne.scheduleTimeData"
  954. @change="setTimeAll(item.campaignOne)"
  955. >
  956. <a-radio-button value="1">全天</a-radio-button>
  957. <a-radio-button value="2">特定时间</a-radio-button>
  958. </a-radio-group>
  959. <br />
  960. <selectCheckAll
  961. style="width: 60%; margin-top: 15px"
  962. v-if="item.campaignOne.scheduleTimeData == '2'"
  963. :scheduleTime.sync="item.campaignOne.scheduleTime"
  964. ref="selectCheck"
  965. />
  966. </a-form-model-item>
  967. <a-form-model-item label="创意展现方式" prop="campaign">
  968. <a-radio-group buttonStyle="solid" v-model="item.campaignOne.showMode">
  969. <a-radio-button value="2">智能优选</a-radio-button>
  970. <a-radio-button value="1">随机轮播</a-radio-button>
  971. </a-radio-group>
  972. <br />
  973. <span>
  974. {{
  975. item.campaignOne.showMode == '1'
  976. ? '广告组包含的广告创意将随机展现'
  977. : '每一次展现的时候,系统会进行CTR预估,预估CTR高的会得到展现机会'
  978. }}
  979. </span>
  980. </a-form-model-item>
  981. <a-form-model-item label="场景广告位">
  982. <checkBoxGroup
  983. :options="[
  984. { label: '优选广告位', value: 1 },
  985. { label: '信息流广告', value: 7 },
  986. { label: '上下滑大屏广告', value: 6 },
  987. { label: '视频播放页广告', value: 3 },
  988. ]"
  989. v-model="item.campaignOne.sceneId"
  990. @change="changeData"
  991. :disabled="item.campaignOne.allianceAccount == '2'"
  992. />
  993. </a-form-model-item>
  994. <a-form-model-item label="优化目标">
  995. <a-radio-group
  996. buttonStyle="solid"
  997. v-model="item.campaignOne.bidType"
  998. @change="changeBidType(item.campaignOne)"
  999. >
  1000. <a-radio-button :value="1">点击数</a-radio-button>
  1001. <a-radio-button :value="10">转化数</a-radio-button>
  1002. </a-radio-group>
  1003. </a-form-model-item>
  1004. <a-form-model-item label="转化目标" v-if="item.campaignOne.bidType == 10">
  1005. <a-select v-model="item.campaignOne.ocpxActionType" style="width: 60%">
  1006. <a-select-option :value="2">行为数</a-select-option>
  1007. <a-select-option :value="180" v-if=" groupTypeData.isActivate == '1'"
  1008. >激活</a-select-option
  1009. >
  1010. <a-select-option
  1011. :value="53"
  1012. v-if=" groupTypeData.isFormSubmit == '1'"
  1013. >表单提交</a-select-option
  1014. >
  1015. <a-select-option :value="394" v-if="groupTypeData.isOrderSubmit == '1'">订单提交</a-select-option>
  1016. <a-select-option :value="348" v-if="groupTypeData.isValidClue == '1'">使用有效线索</a-select-option>
  1017. <a-select-option :value="383" v-if="groupTypeData.isCreditGrant == '1'">授信出价</a-select-option>
  1018. <a-select-option :value="384" v-if="groupTypeData.isWanJian == '1'">完件出价</a-select-option>
  1019. <a-select-option :value="190" v-if="groupTypeData.isPurchase == '1'">付费出价</a-select-option>
  1020. <a-select-option :value="191" v-if="groupTypeData.isFirstdayRoi == '1'">首日ROI</a-select-option>
  1021. <a-select-option :value="396" v-if="groupTypeData.isRegister == '1'">注册优化目标</a-select-option>
  1022. </a-select>
  1023. </a-form-model-item>
  1024. <a-form-model-item
  1025. label="深度转化目标"
  1026. v-if="
  1027. (item.campaignOne.ocpxActionType == 180 || item.campaignOne.ocpxActionType == 53) &&
  1028. groupTypeData.deepConversionTypes.length > 0
  1029. "
  1030. >
  1031. <a-select v-model="item.campaignOne.deepConversionType" allowClear>
  1032. <a-select-option
  1033. :value="items.deepConversionType"
  1034. v-for="(items, index) of groupTypeData.deepConversionTypes"
  1035. :key="index"
  1036. >
  1037. {{ items.desc }}</a-select-option
  1038. >
  1039. </a-select>
  1040. </a-form-model-item>
  1041. <a-form-model-item label="计费方式">
  1042. <a-radio-group defaultValue="1" style="margin-top: 8px">
  1043. <a-radio value="1">{{ item.campaignOne.bidType == 1 ? '点击计费' : '展示计费(oCPM)' }}</a-radio>
  1044. </a-radio-group>
  1045. </a-form-model-item>
  1046. <a-form-model-item
  1047. label="出价"
  1048. v-if="item.campaignOne.bidType == 1"
  1049. :prop="'accountArr.' + index + '.campaignOne.bid'"
  1050. :rules="{
  1051. required: true,
  1052. message: '出价不能为空',
  1053. trigger: 'blur',
  1054. }"
  1055. >
  1056. <a-input-number v-model="item.campaignOne.bid"> </a-input-number>
  1057. </a-form-model-item>
  1058. <a-form-model-item
  1059. label="目标成本"
  1060. v-else
  1061. :prop="'accountArr.' + index + '.campaignOne.cpaBid'"
  1062. :rules="{
  1063. required: true,
  1064. message: '目标成本不能为空',
  1065. trigger: 'blur',
  1066. }"
  1067. >
  1068. <a-input-number v-model="item.campaignOne.cpaBid"> </a-input-number>
  1069. </a-form-model-item>
  1070. <a-form-model-item
  1071. label="深度转化出价"
  1072. :labelCol="{ lg: { span: 6 }, sm: { span: 7 } }"
  1073. :wrapperCol="{ lg: { span: 18 }, sm: { span: 17 } }"
  1074. v-if="
  1075. (item.campaignOne.ocpxActionType == 180 || item.campaignOne.ocpxActionType == 53) &&
  1076. groupTypeData.deepConversionTypes.length > 0 &&
  1077. item.campaignOne.deepConversionType != ''
  1078. "
  1079. >
  1080. <a-input-number
  1081. v-model="item.campaignOne.deepConversionBid"
  1082. :disabled="item.campaignOne.cpaBid == '' || item.campaignOne.cpaBid == null"
  1083. ></a-input-number>
  1084. </a-form-model-item>
  1085. </div>
  1086. </a-tab-pane>
  1087. </a-tabs>
  1088. <a-form-model-item
  1089. :wrapperCol="{
  1090. xs: { span: 24, offset: 0 },
  1091. sm: { span: 20, offset: 7 },
  1092. }"
  1093. >
  1094. <a-button type="primary" html-type="submit" @click="submitForm('unitCreate')" :loading="submitFormLoading">
  1095. 提交
  1096. </a-button>
  1097. <a-button style="margin-left: 10px" @click="resetForm('unitCreate')" :loading="submitFormLoading">
  1098. 重置
  1099. </a-button>
  1100. </a-form-model-item>
  1101. <!-- <a-form-model-item
  1102. ref="unitName"
  1103. prop="unitName"
  1104. v-for="(domain, index) in tabList[activeIndex].form.unitName"
  1105. :key="index"
  1106. :label="index === 0 ? '组名称' : ''"
  1107. :prop="'unitName.' + index + '.value'"
  1108. :rules="{
  1109. required: true,
  1110. message: '组名称必填',
  1111. trigger: 'blur',
  1112. }"
  1113. ><a-input v-model="domain.value" placeholder="请输入组名称" style="width: 60%; margin-right: 8px" />
  1114. </a-form-model-item> -->
  1115. </a-form-model>
  1116. <a-modal v-model="convert" title="选择转化目标">
  1117. <template slot="footer">
  1118. <a-button key="back" @click="convert = false">取消</a-button>
  1119. <a-button key="submit" type="primary" @click="convert = false"> 确定 </a-button>
  1120. </template>
  1121. <a-form-model-item label="追踪方式" :labelCol="{ span: 7 }" :wrapperCol="{ span: 17 }">
  1122. <a-radio-group buttonStyle="solid" v-model="convertType" @change="convertChange(convertData)">
  1123. <a-radio-button value="1" v-show="convertData.campaignType == 4 || convertData.campaignType == 5"
  1124. >JS布玛</a-radio-button
  1125. >
  1126. <a-radio-button value="2" v-show="convertData.campaignType == 4 || convertData.campaignType == 5"
  1127. >Xpath</a-radio-button
  1128. >
  1129. <a-radio-button
  1130. value="3"
  1131. v-show="convertData.campaignType == 2 && (convertData.appId == 1 || convertData.appId == 2)"
  1132. >应用-SDK
  1133. </a-radio-button>
  1134. <a-radio-button value="7" v-show="convertData.campaignType == 2">应用-API</a-radio-button>
  1135. </a-radio-group>
  1136. </a-form-model-item>
  1137. <a-form-model-item label="选择转化" :labelCol="{ span: 7 }" :wrapperCol="{ span: 17 }">
  1138. <a-select
  1139. allowClear
  1140. labelInValue
  1141. style="width: 100%"
  1142. v-model="convertData.convertId"
  1143. @focus="getConvertList(convertData.accountId)"
  1144. >
  1145. <a-select-option :value="item.convert_id" v-for="(item, index) in convertList" :key="item.convert_id">
  1146. {{ item.convert_name }}</a-select-option
  1147. >
  1148. </a-select>
  1149. </a-form-model-item>
  1150. </a-modal>
  1151. <a-modal v-model="showCreate" title="创建失败条数">
  1152. <template slot="footer">
  1153. <a-button key="back" @click="showCreate = false">取消</a-button>
  1154. <a-button key="submit" type="primary" @click="tiaozhuan"> 确定 </a-button>
  1155. </template>
  1156. <ul v-if="createUnitList.length > 0">
  1157. <li v-for="(item, index) in createUnitList">
  1158. <p v-if="item.code == -1">
  1159. 组名称:{{ item.unitName }},创建失败 <br /><span style="margin-left: 10px"
  1160. >失败原因:{{ item.message }}</span
  1161. >
  1162. </p>
  1163. </li>
  1164. </ul>
  1165. <div v-else style="width: 100%; height: 200px; text-align: center; line-height: 200px">无创建失败条数</div>
  1166. </a-modal>
  1167. <templateModal ref="templateModal" @getData="getTemplateList" />
  1168. </a-card>
  1169. </div>
  1170. </template>
  1171. <script>
  1172. import { deleteAction, postAction, getAction } from '@/api/manage'
  1173. import moment from 'moment'
  1174. import { mapActions, mapGetters } from 'vuex'
  1175. import Treeselect from '@/views/modules/Statistics/components/Treeselect.vue'
  1176. import selectCheckAll from '../account/stepForm/stepModule/test'
  1177. import checkBoxGroup from '@/components/formComponents/checkBoxGroup'
  1178. import templateModal from './templateModal'
  1179. export default {
  1180. name: 'create-unit',
  1181. components: {
  1182. Treeselect,
  1183. selectCheckAll,
  1184. checkBoxGroup,
  1185. templateModal,
  1186. },
  1187. data() {
  1188. return {
  1189. groupTypeData: {},
  1190. appList: [],
  1191. allAppList: [],
  1192. templateList: [],
  1193. labelCol: { span: 7 },
  1194. wrapperCol: { span: 17 },
  1195. formItemLayout: {
  1196. labelCol: {
  1197. xs: { span: 7 },
  1198. sm: { span: 7 },
  1199. },
  1200. wrapperCol: {
  1201. xs: { span: 17, offset: 0 },
  1202. sm: { span: 17, offset: 7 },
  1203. },
  1204. },
  1205. form: {
  1206. accountArr: [],
  1207. },
  1208. tabList: [
  1209. {
  1210. key: 'article',
  1211. tab: '账户1',
  1212. form: {
  1213. campaignAgreement: 0,
  1214. unitName: [{ value: '' }],
  1215. },
  1216. },
  1217. {
  1218. key: 'app',
  1219. tab: '账户2',
  1220. form: {
  1221. campaignAgreement: 0,
  1222. unitName: [{ value: '' }],
  1223. },
  1224. },
  1225. {
  1226. key: 'project',
  1227. tab: '账户3',
  1228. form: {
  1229. campaignAgreement: 1,
  1230. unitName: [{ value: '' }],
  1231. },
  1232. },
  1233. ],
  1234. key: 'article',
  1235. activeIndex: 0,
  1236. accountIds: [],
  1237. active: null,
  1238. promotionName: '',
  1239. tabs: [],
  1240. dayBudgetSchedule: [{ one: '' }, { one: '' }, { one: '' }, { one: '' }, { one: '' }, { one: '' }, { one: '' }],
  1241. type: '2',
  1242. typeList: {},
  1243. showBudgetDaily: false,
  1244. campaignName: '',
  1245. campaignBudget: 'UNLIMITED',
  1246. dayBudget: 0,
  1247. showApp: true,
  1248. redirectUrl: '', // 链接地址
  1249. showRedirect: false,
  1250. urlType: '1',
  1251. showUrlType: false,
  1252. channelType: '1',
  1253. showChannelType: false,
  1254. loading: false,
  1255. url: {
  1256. dictListUrl: 'toutiao/dictitem/list',
  1257. appListUrl: '/kuaishou/kuaiShouCreateAppTemplate/list',
  1258. insertTemplateUrl: '/kuaishou/batch/campaignCreate',
  1259. },
  1260. createTotal: [],
  1261. convert: false,
  1262. convertType: '1',
  1263. convertList: [],
  1264. convertData: {},
  1265. submitFormLoading: false,
  1266. showCreate: false,
  1267. createUnitList: [],
  1268. createUnitSuccess: [],
  1269. }
  1270. },
  1271. methods: {
  1272. lookTemplate(accountId, templateId) {
  1273. this.$refs.templateModal.handleOk(accountId, templateId, 'look')
  1274. },
  1275. addTemplate(accountId) {
  1276. this.$refs.templateModal.create(accountId, 'add')
  1277. },
  1278. tiaozhuan() {
  1279. this.showCreate = false
  1280. localStorage.setItem('crossAccountUnit', JSON.stringify(this.createUnitSuccess))
  1281. this.$router.replace({ path: '/crossAccount/createCreative' })
  1282. this.$bus.$emit('remove', '/crossAccount/createUnit')
  1283. },
  1284. getPlatForm(appId) {
  1285. if (appId) {
  1286. var data = this.allAppList.filter((item) => {
  1287. return item.appId == appId
  1288. })
  1289. return data[0].platform
  1290. }
  1291. },
  1292. showConvert(item, data) {
  1293. this.convertChange(data)
  1294. this.convertData = { ...item, campaignType: item.campaignType, ...data }
  1295. if (item.campaignType == 2) {
  1296. if (this.convertData.appId) {
  1297. this.convert = true
  1298. if (this.convertData.appId == 1 || this.convertData.appId == 2) {
  1299. this.convertType = '3'
  1300. } else {
  1301. this.convertType = '7'
  1302. }
  1303. } else {
  1304. this.$message.error('请选择应用')
  1305. }
  1306. } else {
  1307. this.convert = true
  1308. this.convertType = '1'
  1309. }
  1310. this.getConvertList(this.convertData.accountId)
  1311. },
  1312. convertChange(data) {
  1313. data.convertId = ''
  1314. },
  1315. getConvertList(accountId) {
  1316. var params = {}
  1317. params.accountId = accountId
  1318. params.type = this.convertType
  1319. this.convertList = []
  1320. getAction('/kuaishou/batch/getConvertList', params).then((res) => {
  1321. console.log(res)
  1322. if (res.success) {
  1323. this.convertList = res.result.map((item) => {
  1324. return {
  1325. ...item,
  1326. convert_id: item.convert_id + '',
  1327. }
  1328. })
  1329. }
  1330. })
  1331. },
  1332. changeBidType(data) {
  1333. console.log(data)
  1334. if (data.bidType == 1) {
  1335. data.ocpxActionType = null
  1336. data.cpaBid = null
  1337. } else if (data.bidType == 10) {
  1338. data.ocpxActionType = 2
  1339. data.bid = null
  1340. }
  1341. },
  1342. changeData(data) {
  1343. if (data.length > 1 && data.findIndex((item) => item == 1) == 0) {
  1344. data.splice(
  1345. data.findIndex((item) => item == 1),
  1346. 1
  1347. )
  1348. } else if (data.length > 1 && data.findIndex((item) => item == 1) == data.length - 1) {
  1349. data.splice(0, data.length - 1)
  1350. } else if (data.length == 0) {
  1351. data.push(1)
  1352. }
  1353. },
  1354. setTime(item) {
  1355. console.log(item)
  1356. this.$nextTick(() => {
  1357. if (item.time == '2') {
  1358. item.timeRange = []
  1359. item.timeRange[0] = moment().startOf('day')
  1360. item.timeRange[1] = moment().add(1, 'months')
  1361. } else {
  1362. item.timeRange = []
  1363. }
  1364. })
  1365. },
  1366. setTimeAll(item) {
  1367. // console.log(moment('2019-12-27'))
  1368. if (item.scheduleTimeData == '2') {
  1369. } else {
  1370. item.scheduleTime =
  1371. '000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000'
  1372. }
  1373. },
  1374. changeAccount(data) {
  1375. this.getAppList(data)
  1376. this.getIsActivate(data)
  1377. this.getTemplate(data)
  1378. this.getTemplateList(data)
  1379. },
  1380. getTemplate(accountId) {
  1381. getAction('/batch/kuaishouTemplate/getTemplateByAccountId', {
  1382. accountId: accountId,
  1383. }).then((res) => {
  1384. if (res.success) {
  1385. this.getTemplateList(accountId)
  1386. }
  1387. })
  1388. },
  1389. getTemplateList(accountId) {
  1390. this.templateList = []
  1391. getAction('/batch/kuaishouTemplate/list', {
  1392. accountId: accountId,
  1393. }).then((res) => {
  1394. if (res.success) {
  1395. this.templateList = res.result.map((item, index) => {
  1396. return {
  1397. ...item,
  1398. key: index,
  1399. }
  1400. })
  1401. }
  1402. })
  1403. },
  1404. getAppList(accountId) {
  1405. this.appList = []
  1406. let params = {}
  1407. params.accountId = accountId
  1408. getAction('/kuaishou/batch/getAppList', params).then((res) => {
  1409. if (res.success) {
  1410. this.appList = res.result.map((item, index) => {
  1411. return {
  1412. ...item,
  1413. key: index,
  1414. }
  1415. })
  1416. this.allAppList.push(...this.appList)
  1417. }
  1418. })
  1419. },
  1420. getIsActivate(accountId) {
  1421. getAction('/kuaishou/batch/getIsActivate', {
  1422. accountId: accountId,
  1423. }).then((res) => {
  1424. if (res.success) {
  1425. this.groupTypeData = res.result
  1426. }
  1427. })
  1428. },
  1429. submitForm(formName) {
  1430. this.submitFormLoading = true
  1431. this.$refs[formName].validate((valid) => {
  1432. if (valid) {
  1433. // alert('submit!')
  1434. var params = this.form.accountArr.map((item) => {
  1435. // campaignAgreement: 0, //判断是否计划相同 0为相同取值campaignOne 1不同取值1不同取值campaignList
  1436. if (item.campaignAgreement == 0) {
  1437. return {
  1438. ...item,
  1439. campaignList: null,
  1440. campaignOne: {
  1441. useAppMarket: item.campaignOne.useAppMarket,
  1442. appStore: item.campaignOne.useAppMarket ? item.campaignOne.appStore : null,
  1443. convertId: item.campaignOne.convertId ? item.campaignOne.convertId.key : null,
  1444. campaignIds: item.campaignOne.campaignIds,
  1445. unitNames: item.campaignOne.unitNames.map((c) => {
  1446. return c.value
  1447. }),
  1448. allianceAccount: item.campaignOne.allianceAccount,
  1449. appId: item.campaignOne.appId,
  1450. urlType: item.campaignOne.urlType,
  1451. url: item.campaignOne.url,
  1452. templateId: item.campaignOne.templateId,
  1453. dayBudget: item.campaignOne.dayBudget == null ? null : item.campaignOne.dayBudget * 1000,
  1454. dayBudgetType: item.campaignOne.dayBudgetType,
  1455. speed: item.campaignOne.speed,
  1456. time: item.campaignOne.time,
  1457. timeRange: item.campaignOne.timeRange,
  1458. beginTime:
  1459. item.campaignOne.time == '1'
  1460. ? moment().startOf('day').format('YYYY-MM-DD')
  1461. : moment(item.campaignOne.timeRange[0]).format('YYYY-MM-DD'),
  1462. endTime:
  1463. item.campaignOne.time == '2' ? moment(item.campaignOne.timeRange[1]).format('YYYY-MM-DD') : '',
  1464. scheduleTimeData: item.campaignOne.scheduleTimeData,
  1465. scheduleTime: item.campaignOne.scheduleTime,
  1466. showMode: item.campaignOne.showMode,
  1467. sceneId: item.campaignOne.allianceAccount == '1' ? item.campaignOne.sceneId : [5],
  1468. ocpxActionType: item.campaignOne.ocpxActionType,
  1469. bidType: item.campaignOne.bidType,
  1470. deepConversionType: item.campaignOne.deepConversionType,
  1471. bid:
  1472. item.campaignOne.bid == null || item.campaignOne.bid == '' || item.campaignOne.bid == undefined
  1473. ? null
  1474. : item.campaignOne.bid * 1000,
  1475. cpaBid:
  1476. item.campaignOne.cpaBid == null ||
  1477. item.campaignOne.cpaBid == '' ||
  1478. item.campaignOne.cpaBid == undefined
  1479. ? null
  1480. : item.campaignOne.cpaBid * 1000,
  1481. deepConversionBid:
  1482. item.campaignOne.deepConversionBid == null ||
  1483. item.campaignOne.deepConversionBid == '' ||
  1484. item.campaignOne.deepConversionBid == undefined
  1485. ? null
  1486. : item.campaignOne.deepConversionBid * 1000,
  1487. unitType: '4',
  1488. },
  1489. }
  1490. } else {
  1491. return {
  1492. ...item,
  1493. campaignOne: null,
  1494. campaignList: item.campaignList.map((i) => {
  1495. if (i.check == '1') {
  1496. return {
  1497. ...i,
  1498. unit: null,
  1499. unitIdentical: {
  1500. unitType: '4',
  1501. useAppMarket: i.unitIdentical.useAppMarket,
  1502. appStore: i.unitIdentical.useAppMarket ? i.unitIdentical.appStore : null,
  1503. convertId: i.unitIdentical.convertId ? i.unitIdentical.convertId.key : null,
  1504. unitName: i.unitIdentical.unitName.map((b) => {
  1505. return b.name
  1506. }),
  1507. allianceAccount: i.unitIdentical.allianceAccount,
  1508. appId: i.unitIdentical.appId,
  1509. urlType: i.unitIdentical.urlType,
  1510. url: i.unitIdentical.url,
  1511. templateId: i.unitIdentical.templateId,
  1512. dayBudget: i.unitIdentical.dayBudget == null ? null : i.unitIdentical.dayBudget * 1000,
  1513. dayBudgetType: i.unitIdentical.dayBudgetType,
  1514. speed: i.unitIdentical.speed,
  1515. time: i.unitIdentical.time,
  1516. timeRange: i.unitIdentical.timeRange,
  1517. beginTime:
  1518. i.unitIdentical.time == '1'
  1519. ? moment().startOf('day').format('YYYY-MM-DD')
  1520. : moment(i.unitIdentical.timeRange[0]).format('YYYY-MM-DD'),
  1521. endTime:
  1522. i.unitIdentical.time == '2' ? moment(i.unitIdentical.timeRange[1]).format('YYYY-MM-DD') : '',
  1523. scheduleTimeData: i.unitIdentical.scheduleTimeData,
  1524. scheduleTime: i.unitIdentical.scheduleTime,
  1525. showMode: i.unitIdentical.showMode,
  1526. sceneId: i.unitIdentical.allianceAccount == '1' ? i.unitIdentical.sceneId : [5],
  1527. ocpxActionType: i.unitIdentical.ocpxActionType,
  1528. bidType: i.unitIdentical.bidType,
  1529. deepConversionType: i.unitIdentical.deepConversionType,
  1530. bid:
  1531. i.unitIdentical.bid == null || i.unitIdentical.bid == '' || i.unitIdentical.bid == undefined
  1532. ? null
  1533. : i.unitIdentical.bid * 1000,
  1534. cpaBid:
  1535. i.unitIdentical.cpaBid == null ||
  1536. i.unitIdentical.cpaBid == '' ||
  1537. i.unitIdentical.cpaBid == undefined
  1538. ? null
  1539. : i.unitIdentical.cpaBid * 1000,
  1540. deepConversionBid:
  1541. i.unitIdentical.deepConversionBid == null ||
  1542. i.unitIdentical.deepConversionBid == '' ||
  1543. i.unitIdentical.deepConversionBid == undefined
  1544. ? null
  1545. : i.unitIdentical.deepConversionBid * 1000,
  1546. },
  1547. }
  1548. } else {
  1549. return {
  1550. ...i,
  1551. unitIdentical: null,
  1552. unit: i.unit.map((c) => {
  1553. return {
  1554. unitType: '4',
  1555. useAppMarket: c.useAppMarket,
  1556. appStore: c.useAppMarket ? c.appStore : null,
  1557. convertId: c.convertId ? c.convertId.key : null,
  1558. name: c.name,
  1559. allianceAccount: c.allianceAccount,
  1560. appId: c.appId,
  1561. urlType: c.urlType,
  1562. url: c.url,
  1563. templateId: c.templateId,
  1564. dayBudget: c.dayBudget == null ? c.dayBudget : c.dayBudget * 1000,
  1565. dayBudgetType: c.dayBudgetType,
  1566. speed: c.speed,
  1567. time: c.time,
  1568. timeRange: c.timeRange,
  1569. beginTime:
  1570. c.time == '1'
  1571. ? moment().startOf('day').format('YYYY-MM-DD')
  1572. : moment(c.timeRange[0]).format('YYYY-MM-DD'),
  1573. endTime: c.time == '2' ? moment(c.timeRange[1]).format('YYYY-MM-DD') : '',
  1574. scheduleTimeData: c.scheduleTimeData,
  1575. scheduleTime: c.scheduleTime,
  1576. showMode: c.showMode,
  1577. sceneId: c.allianceAccount == '1' ? c.sceneId : [5],
  1578. ocpxActionType: c.ocpxActionType,
  1579. bidType: c.bidType,
  1580. deepConversionType: c.deepConversionType,
  1581. bid: c.bid == null || c.bid == '' || c.bid == undefined ? null : c.bid * 1000,
  1582. cpaBid: c.cpaBid == null || c.cpaBid == '' || c.cpaBid == undefined ? null : c.cpaBid * 1000,
  1583. deepConversionBid:
  1584. c.deepConversionBid == null || c.deepConversionBid == '' || c.deepConversionBid == undefined
  1585. ? null
  1586. : c.deepConversionBid * 1000,
  1587. }
  1588. }),
  1589. }
  1590. }
  1591. }),
  1592. }
  1593. }
  1594. })
  1595. console.log(params)
  1596. postAction('/kuaishou/crossAccount/crossAccountUnitCreate', { accountArr: params }).then((res) => {
  1597. console.log(res)
  1598. if (res.success) {
  1599. this.createUnitList = res.result.filter((item) => {
  1600. return item.code != 0
  1601. })
  1602. this.createUnitSuccess = res.result.filter((item) => {
  1603. return item.code == 0
  1604. })
  1605. this.submitFormLoading = false
  1606. this.showCreate = true
  1607. } else {
  1608. this.submitFormLoading = false
  1609. }
  1610. })
  1611. } else {
  1612. setTimeout(() => {
  1613. var isError = document.getElementsByClassName('has-error')
  1614. console.log(isError)
  1615. isError[0].querySelector('input').focus()
  1616. }, 100)
  1617. this.submitFormLoading = false
  1618. console.log('error submit!!')
  1619. return false
  1620. }
  1621. })
  1622. },
  1623. resetForm(formName) {
  1624. this.$refs[formName].resetFields()
  1625. },
  1626. onTabChange(key, type) {
  1627. console.log(key, type)
  1628. this[type] = key
  1629. this.activeIndex = this.tabList.findIndex((item) => this.key == item.key)
  1630. },
  1631. ...mapGetters(['nickname', 'avatar', 'userInfo']),
  1632. numberReturn(num) {
  1633. var arr = ['一', '二', '三', '四', '五', '六', '天']
  1634. return arr[num]
  1635. },
  1636. changeCreateTotal(item) {
  1637. this.$nextTick(() => {
  1638. var arr = []
  1639. var arrUnitName = []
  1640. for (let i = 0; i < item.unitCount; i++) {
  1641. arr.push({
  1642. useAppMarket: false,
  1643. appStore: ['huawei', 'oppo', 'vivo', 'xiaomi', 'meizu', 'smartisan'],
  1644. convertId: '',
  1645. name: '',
  1646. allianceAccount: '1',
  1647. appId: '',
  1648. templateId: '',
  1649. urlType: '1',
  1650. url: '',
  1651. dayBudget: null,
  1652. dayBudgetType: '0',
  1653. speed: '1',
  1654. time: '1',
  1655. timeRange: [],
  1656. scheduleTimeData: '1',
  1657. scheduleTime:
  1658. '000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000',
  1659. showMode: '2',
  1660. sceneId: [1],
  1661. ocpxActionType: 2,
  1662. bidType: 10,
  1663. deepConversionType: null,
  1664. bid: null,
  1665. cpaBid: null,
  1666. deepConversionBid: null,
  1667. })
  1668. arrUnitName.push({ name: '' })
  1669. }
  1670. item.campaignOne.unitNames = JSON.parse(JSON.stringify(arr))
  1671. item.campaignList.forEach((element) => {
  1672. if (element.check == '1') {
  1673. element.unitIdentical = JSON.parse(
  1674. JSON.stringify({
  1675. useAppMarket: false,
  1676. appStore: ['huawei', 'oppo', 'vivo', 'xiaomi', 'meizu', 'smartisan'],
  1677. convertId: '',
  1678. unitName: arrUnitName,
  1679. allianceAccount: '1',
  1680. appId: '',
  1681. urlType: '1',
  1682. url: '',
  1683. templateId: '',
  1684. dayBudget: null,
  1685. dayBudgetType: '0',
  1686. speed: '1',
  1687. time: '1',
  1688. timeRange: [],
  1689. scheduleTimeData: '1',
  1690. scheduleTime:
  1691. '000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000',
  1692. showMode: '2',
  1693. sceneId: [1],
  1694. ocpxActionType: 2,
  1695. bidType: 10,
  1696. deepConversionType: null,
  1697. bid: null,
  1698. cpaBid: null,
  1699. deepConversionBid: null,
  1700. })
  1701. )
  1702. } else {
  1703. element.unit = []
  1704. element.unit = JSON.parse(JSON.stringify(arr))
  1705. }
  1706. })
  1707. })
  1708. },
  1709. AllTypeChange(e) {
  1710. console.log(e.target.value)
  1711. if (e.target.value == 1) {
  1712. if (this.accountIds.length > 0) {
  1713. }
  1714. } else {
  1715. }
  1716. },
  1717. nameTypeChange(item, accountData) {
  1718. console.log(item)
  1719. this.changeCreateTotal(accountData)
  1720. },
  1721. getChangeAll(name, indexBest, index, items) {
  1722. var node = document.getElementsByClassName('rending')[indexBest]
  1723. var v = '{{' + name + '}}-'
  1724. if (document.selection) {
  1725. //IE
  1726. node.focus()
  1727. var sel = document.selection.createRange()
  1728. sel.text = v
  1729. sel.select()
  1730. items.campaignName = v
  1731. } else if (node.selectionStart || node.selectionStart == '0') {
  1732. //MOZILLA/GOOGLE
  1733. var startPos = node.selectionStart
  1734. var endPos = node.selectionEnd
  1735. var restoreTop = node.scrollTop
  1736. node.value = node.value.substring(0, startPos) + v + node.value.substring(endPos, node.value.length)
  1737. if (restoreTop > 0) {
  1738. node.scrollTop = restoreTop
  1739. }
  1740. items.campaignName = node.value
  1741. node.focus()
  1742. node.selectionStart = startPos + v.length
  1743. node.selectionEnd = startPos + v.length
  1744. // this.campaignName = node.value
  1745. } else {
  1746. //OTHER
  1747. node.value += v
  1748. items.campaignName = node.value
  1749. node.focus()
  1750. // this.campaignName = node.value
  1751. }
  1752. },
  1753. getChange(name, index) {
  1754. console.log(index, document.getElementsByClassName('rending'))
  1755. var node = document.getElementsByClassName('rending')[index]
  1756. var v = '{{' + name + '}}-'
  1757. if (document.selection) {
  1758. //IE
  1759. node.focus()
  1760. var sel = document.selection.createRange()
  1761. sel.text = v
  1762. sel.select()
  1763. this.campaignName = v
  1764. } else if (node.selectionStart || node.selectionStart == '0') {
  1765. //MOZILLA/GOOGLE
  1766. var startPos = node.selectionStart
  1767. var endPos = node.selectionEnd
  1768. var restoreTop = node.scrollTop
  1769. node.value = node.value.substring(0, startPos) + v + node.value.substring(endPos, node.value.length)
  1770. if (restoreTop > 0) {
  1771. node.scrollTop = restoreTop
  1772. }
  1773. this.campaignName = node.value
  1774. node.focus()
  1775. node.selectionStart = startPos + v.length
  1776. node.selectionEnd = startPos + v.length
  1777. // this.campaignName = node.value
  1778. } else {
  1779. //OTHER
  1780. node.value += v
  1781. this.campaignName = node.value
  1782. node.focus()
  1783. // this.campaignName = node.value
  1784. }
  1785. },
  1786. handleConfirmValue(rule, value, callback) {
  1787. if (value == '' || value < 500 || value >= 100000000) {
  1788. callback('请输入正确预算金额')
  1789. }
  1790. callback()
  1791. },
  1792. handleConfirmAppId(rule, value, callback) {
  1793. if (this.type == 2 && (this.appId == '0' || this.appId == '')) {
  1794. callback('请选择目标应用')
  1795. }
  1796. callback()
  1797. },
  1798. handleSubmit(e) {
  1799. e.preventDefault()
  1800. this.form.validateFields((err, values) => {
  1801. if (!err) {
  1802. this.loading = true
  1803. let params = {}
  1804. params.type = values.type
  1805. // params.campaignBudget = this.campaignBudget
  1806. if (this.campaignBudget == 'UNLIMITED') {
  1807. params.dayBudget = 0
  1808. } else if (this.campaignBudget == 'AS_BUDGET') {
  1809. params.dayBudget = values.dayBudget * 1000
  1810. } else {
  1811. params.dayBudgetSchedule = this.dayBudgetSchedule.map((item) => {
  1812. if (item.one == '') {
  1813. return 0
  1814. } else {
  1815. return item.one * 1000
  1816. }
  1817. })
  1818. }
  1819. // if (this.getData('nameType') == 0) {
  1820. // var dataArr = this.campaignName.split('-')
  1821. // if (dataArr[dataArr.length - 1] == '') {
  1822. // dataArr.pop()
  1823. // }
  1824. // params.campaignName = dataArr.join('-')
  1825. // } else {
  1826. // params.nameArr = this.tabs.map((item) => {
  1827. // return {
  1828. // accountId: item.accountId,
  1829. // campaignNames: item.campaignNames.map((i) => {
  1830. // return i.campaignName
  1831. // }),
  1832. // }
  1833. // })
  1834. // }
  1835. params.accountArr = this.accountIds
  1836. params.nameType = values.nameType
  1837. params.createTotal = values.createTotal
  1838. console.log(params)
  1839. postAction('/kuaishou/crossAccount/batchCampaignCreate', params).then((res) => {
  1840. console.log(res)
  1841. if (res.success) {
  1842. this.$message.success('创建成功')
  1843. localStorage.setItem('campaignId', res.result)
  1844. this.loading = false
  1845. this.nextStep(res.result)
  1846. } else {
  1847. this.$message.error(res.message)
  1848. this.loading = false
  1849. }
  1850. })
  1851. }
  1852. })
  1853. },
  1854. onChange(value) {
  1855. console.log(value)
  1856. },
  1857. showBudgetStatusChange() {
  1858. if (this.campaignBudget == 'UNLIMITED') {
  1859. this.showBudgetDaily = false
  1860. this.dayBudget = 0
  1861. } else {
  1862. this.showBudgetDaily = true
  1863. this.dayBudget = ''
  1864. }
  1865. },
  1866. typeChange() {
  1867. if (this.type == 2) {
  1868. this.promotionName = '提升应用安装'
  1869. this.showApp = true
  1870. this.showRedirect = false
  1871. this.showUrlType = false
  1872. this.showChannelType = false
  1873. }
  1874. if (this.type == 3) {
  1875. this.promotionName = '获取电商下单'
  1876. this.showApp = false
  1877. this.showRedirect = true
  1878. this.showUrlType = true
  1879. this.showChannelType = false
  1880. }
  1881. if (this.type == 4) {
  1882. this.promotionName = '推广品牌活动'
  1883. this.showApp = false
  1884. this.showRedirect = true
  1885. this.showUrlType = false
  1886. this.showChannelType = false
  1887. }
  1888. if (this.type == 5) {
  1889. this.promotionName = '收集销售线索'
  1890. this.showApp = false
  1891. this.showRedirect = true
  1892. this.showUrlType = false
  1893. this.showChannelType = true
  1894. }
  1895. this.campaignName = this.promotionName + '_' + moment(new Date())
  1896. },
  1897. handleChange(value) {
  1898. console.log(`selected ${value}`)
  1899. },
  1900. handleBlur() {
  1901. console.log('blur')
  1902. },
  1903. handleFocus() {
  1904. console.log('focus')
  1905. },
  1906. filterOption(input, option) {
  1907. return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
  1908. },
  1909. nextStep() {
  1910. this.$emit('nextStep')
  1911. },
  1912. // getData(className) {
  1913. // return this.form.getFieldValue(className)
  1914. // },
  1915. getLOLTrue(accountId) {
  1916. getAction('/kuaishou/batch/getWhiteList', {
  1917. accountId: accountId,
  1918. }).then((res) => {
  1919. if (res.success) {
  1920. console.log(res)
  1921. if (res.result) {
  1922. if (res.result.alliance_account == 1) {
  1923. return true
  1924. } else {
  1925. return false
  1926. }
  1927. } else {
  1928. return false
  1929. }
  1930. }
  1931. })
  1932. },
  1933. },
  1934. filters: {
  1935. getDate(value) {
  1936. let date = new Date(value)
  1937. let y = date.getFullYear()
  1938. let MM = date.getMonth() + 1
  1939. MM = MM < 10 ? '0' + MM : MM
  1940. let d = date.getDate()
  1941. d = d < 10 ? '0' + d : d
  1942. return y + '-' + MM + '-' + d
  1943. },
  1944. platform(str) {
  1945. var data = {
  1946. 1: 'Android应用下载',
  1947. 2: 'Android网页游戏',
  1948. 3: 'iOS应用下载',
  1949. 4: 'iOS网页游戏',
  1950. }
  1951. return data[str]
  1952. },
  1953. },
  1954. mounted: function () {
  1955. this.$nextTick(() => {
  1956. // this.changeCreateTotal()
  1957. if (localStorage.getItem('crossAccountCampaign')) {
  1958. var data = JSON.parse(localStorage.getItem('crossAccountCampaign'))
  1959. this.form.accountArr = data.map((item) => {
  1960. return {
  1961. accountId: item.accountId,
  1962. accountName: item.accountId,
  1963. campaignAgreement: 0, //判断是否计划相同 0为相同取值campaignOne 1不同取值campaignList
  1964. unitCount: 1,
  1965. allianceAccount: true,
  1966. campaignType: item.createDetail[0].type,
  1967. //多个计划分开创建
  1968. campaignList: item.createDetail.map((c) => {
  1969. return {
  1970. campaignId: c.campaignId,
  1971. campaignName: c.campaignName,
  1972. check: '1', //判断计划下组是否相同 1为相同取值 unitIdentical 2为不同 取值unit
  1973. unit: [
  1974. {
  1975. useAppMarket: false,
  1976. appStore: ['huawei', 'oppo', 'vivo', 'xiaomi', 'meizu', 'smartisan'],
  1977. convertId: '',
  1978. name: '',
  1979. allianceAccount: '1',
  1980. appId: '',
  1981. urlType: '1',
  1982. url: '',
  1983. templateId: '',
  1984. dayBudget: null,
  1985. dayBudgetType: '0',
  1986. speed: '1',
  1987. time: '1',
  1988. timeRange: [],
  1989. scheduleTimeData: '1',
  1990. scheduleTime:
  1991. '000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000',
  1992. showMode: '2',
  1993. sceneId: [1],
  1994. ocpxActionType: 2,
  1995. bidType: 10,
  1996. deepConversionType: null,
  1997. bid: null,
  1998. cpaBid: null,
  1999. deepConversionBid: null,
  2000. unitType: '4',
  2001. },
  2002. ],
  2003. unitIdentical: {
  2004. useAppMarket: false,
  2005. appStore: ['huawei', 'oppo', 'vivo', 'xiaomi', 'meizu', 'smartisan'],
  2006. convertId: '',
  2007. unitName: [{ name: '' }],
  2008. allianceAccount: '1',
  2009. appId: '',
  2010. urlType: '1',
  2011. url: '',
  2012. templateId: '',
  2013. dayBudget: null,
  2014. dayBudgetType: '0',
  2015. speed: '1',
  2016. time: '1',
  2017. timeRange: [],
  2018. scheduleTimeData: '1',
  2019. scheduleTime:
  2020. '000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000',
  2021. showMode: '2',
  2022. sceneId: [1],
  2023. ocpxActionType: 2,
  2024. bidType: 10,
  2025. deepConversionType: null,
  2026. bid: null,
  2027. cpaBid: null,
  2028. deepConversionBid: null,
  2029. unitType: '4',
  2030. },
  2031. }
  2032. }),
  2033. //所有计划创建一样
  2034. campaignOne: {
  2035. useAppMarket: false,
  2036. appStore: ['huawei', 'oppo', 'vivo', 'xiaomi', 'meizu', 'smartisan'],
  2037. convertId: '',
  2038. campaignIds: item.createDetail.map((c) => {
  2039. return c.campaignId
  2040. }),
  2041. unitNames: [{ value: '' }],
  2042. allianceAccount: '1',
  2043. appId: '',
  2044. urlType: '1',
  2045. url: '',
  2046. templateId: '',
  2047. dayBudget: null,
  2048. dayBudgetType: '0',
  2049. speed: '1',
  2050. time: '1',
  2051. timeRange: [],
  2052. scheduleTimeData: '1',
  2053. scheduleTime:
  2054. '000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000',
  2055. showMode: '2',
  2056. sceneId: [1],
  2057. ocpxActionType: 2,
  2058. bidType: 10,
  2059. deepConversionType: null,
  2060. bid: null,
  2061. cpaBid: null,
  2062. deepConversionBid: null,
  2063. unitType: '4',
  2064. },
  2065. }
  2066. })
  2067. this.getAppList(this.form.accountArr[0].accountId)
  2068. this.getIsActivate(this.form.accountArr[0].accountId)
  2069. this.getTemplate(this.form.accountArr[0].accountId)
  2070. this.getTemplateList(this.form.accountArr[0].accountId)
  2071. }
  2072. })
  2073. },
  2074. }
  2075. </script>