ruleModule.vue 50 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536
  1. <style>
  2. .display-none-selset {
  3. display: none !important;
  4. }
  5. </style>
  6. <template>
  7. <div class="ruleModule">
  8. <div class="toolbox-automate-rules-create-body">
  9. <!-- <a-steps :current="current" size="default" style="width: 50%; margin: 0 auto" v-if="editShow">
  10. <a-step title="预警值填写" />
  11. <a-step title="开关设置" />
  12. </a-steps> -->
  13. <!-- {{ ceshi }}{{ time }}
  14. <br />
  15. <selectGroup v-model="ceshi2" style="width: 300px;margin-right:5px" code="37f678d06fc45b494a924894355d6f76" :multiple="true" />
  16. <timeRange v-model="time" :allowClear="true" :disabledDate="disabledDate" /> -->
  17. <!-- {{ ceshi }}
  18. <checkBoxGroup
  19. v-model="ceshi"
  20. style="width: 400px"
  21. code="95224d306285ea267eb6b5a31b5d84b6"
  22. :allValue="true"
  23. :radioStyle="true"
  24. />
  25. {{ form }} -->
  26. <div class="toolbox-automate-rules-create-content_title">
  27. <h3>预警值{{ editShow ? '填写' : '表单预览' }}</h3>
  28. </div>
  29. <a-spin :spinning="spinLoading">
  30. <div class="toolbox-automate-rules-create-content">
  31. <a-form-model ref="ruleForm" :model="form" layout="horizontal">
  32. <div class="moduler">
  33. <template v-for="(item, index) of form.ruleList">
  34. <div class="row-item" v-if="item.ruleType == 'base' && item.isCopy == 0" :key="index">
  35. <div class="hint-item">
  36. <a-tooltip>
  37. <template slot="title">
  38. {{ item.remark }}
  39. </template>
  40. <a-icon type="question-circle" />
  41. </a-tooltip>
  42. </div>
  43. <div class="label-item">
  44. <div class="text-item">{{ item.groupName }}</div>
  45. <div class="required-item" v-if="item.isRequired == 1"></div>
  46. </div>
  47. <div class="input-item">
  48. <a-form-model-item
  49. v-for="(value, valueIndex) of item.ruleDetail"
  50. :key="valueIndex"
  51. :ref="value.indicatorCode + valueIndex"
  52. :prop="'ruleList.' + index + '.ruleDetail.' + valueIndex + '.threshold'"
  53. :rules="{
  54. required: item.isRequired == 1 ? true : false,
  55. message: `${item.groupName}必填`,
  56. trigger: value.dataType == 'array' ? 'change' : 'blur',
  57. }"
  58. >
  59. <a-input-number
  60. :disabled="!editShow"
  61. v-model="value.threshold"
  62. :min="0"
  63. style="width: 100px; margin-right: 5px"
  64. v-if="value.modelType == 'numberText'"
  65. />
  66. <a-input
  67. :disabled="!editShow"
  68. v-model="value.threshold"
  69. style="width: 300px; margin-right: 5px"
  70. v-else-if="value.modelType == 'text'"
  71. />
  72. <selectGroup
  73. :disabled="!editShow"
  74. v-model="value.threshold"
  75. style="width: 300px; margin-right: 5px"
  76. :code="value.dictId"
  77. :multiple="
  78. value.dataType == 'string' ||
  79. value.dataType == 'number' ||
  80. value.indicatorCode == 'presentedVideo' ||
  81. value.indicatorCode == 'hideIfExists'
  82. ? false
  83. : true
  84. "
  85. v-else-if="value.modelType == 'select'"
  86. />
  87. <!-- <selectGroup
  88. v-model="value.threshold"
  89. style="width: 300px;margin-right:5px"
  90. :code="value.dictId"
  91. :multiple="value.dataType == 'string' ? false : true"
  92. /> -->
  93. <checkBoxGroup
  94. :disabled="!editShow"
  95. v-model="value.threshold"
  96. style="width: 100%; margin-right: 5px"
  97. :code="value.dictId"
  98. :allValue="true"
  99. :radioStyle="
  100. value.dataType == 'string' ||
  101. value.dataType == 'number' ||
  102. value.indicatorCode == 'presentedVideo' ||
  103. value.indicatorCode == 'hideIfExists'
  104. ? true
  105. : false
  106. "
  107. v-else-if="value.modelType == 'checkBox'"
  108. />
  109. <a-select
  110. :disabled="!editShow"
  111. mode="tags"
  112. style="width: 100%"
  113. placeholder="按回车生成"
  114. v-model="value.threshold"
  115. dropdownClassName="display-none-selset"
  116. :token-separators="[',', ' ', ',']"
  117. v-else-if="value.modelType == 'tagBox'"
  118. >
  119. </a-select>
  120. <!-- <p v-else-if="value.modelType == 'timeRange'">{{value.threshold}}</p> -->
  121. <scheduleTime
  122. style="width: 100%"
  123. :scheduleTime.sync="value.threshold"
  124. ref="selectCheck"
  125. v-else-if="value.modelType == 'scheduleTime'"
  126. >
  127. </scheduleTime>
  128. <!-- v-model="value.threshold" -->
  129. <!-- :cascaderValue.sync="value.threshold" -->
  130. <region
  131. :disabled="!editShow"
  132. :checkData.sync="value.threshold"
  133. :dataValue="value.threshold"
  134. style="width: 100%"
  135. :isLazy="true"
  136. v-else-if="value.modelType == 'region'"
  137. >
  138. </region>
  139. <!-- {{value.threshold}} -->
  140. {{ value.dataUnit }}
  141. </a-form-model-item>
  142. </div>
  143. </div>
  144. <div class="row-item" v-else-if="item.ruleType == 'group' && item.isCopy == 0" :key="index">
  145. <div class="hint-item">
  146. <a-tooltip>
  147. <template slot="title">
  148. {{ item.remark }}
  149. </template>
  150. <a-icon type="question-circle" />
  151. </a-tooltip>
  152. </div>
  153. <div class="label-item">
  154. <div class="text-item">{{ item.groupName }}</div>
  155. <div class="required-item" v-if="item.isRequired == 1"></div>
  156. </div>
  157. <div class="input-item">
  158. <div class="toolbox-automate-rules-create-content_rules-and-condition_rules">
  159. <div class="content">
  160. <div class="rules-list">
  161. <div class="rules-list-item">
  162. <template v-for="(value, valueIndex) of item.ruleDetail">
  163. <div class="row-item row-group" v-if="value.variableType == 1" :key="valueIndex">
  164. <!-- <div class="hint-item"></div>
  165. <div class="label-item">
  166. <div class="text-item"></div>
  167. <div class="required-item"></div>
  168. </div> -->
  169. <div class="input-item">
  170. <a-form-model-item
  171. :label-col="{ span: 6 }"
  172. :wrapper-col="{ span: 18 }"
  173. :label="value.name"
  174. :ref="value.indicatorCode + valueIndex"
  175. :prop="'ruleList.' + index + '.ruleDetail.' + valueIndex + '.threshold'"
  176. :rules="{
  177. required: item.isRequired == 1 ? true : false,
  178. message: `${value.name}必填`,
  179. trigger: 'blur',
  180. }"
  181. v-if="value.modelType == 'numberText'"
  182. >
  183. <a-input-number
  184. :disabled="!editShow"
  185. style="width: 100px; margin-right: 5px"
  186. v-model="value.threshold"
  187. :min="0"
  188. />{{ value.dataUnit }}
  189. </a-form-model-item>
  190. <a-form-model-item
  191. :label-col="{ span: 6 }"
  192. :wrapper-col="{ span: 18 }"
  193. :label="value.name"
  194. :ref="value.indicatorCode + valueIndex"
  195. :prop="'ruleList.' + index + '.ruleDetail.' + valueIndex + '.threshold'"
  196. :rules="{
  197. required: item.isRequired == 1 ? true : false,
  198. message: `${value.name}必填`,
  199. trigger: 'blur',
  200. }"
  201. v-else-if="value.modelType == 'text'"
  202. >
  203. <a-input v-model="value.threshold" style="width: 95%" :disabled="!editShow" />
  204. </a-form-model-item>
  205. <a-form-model-item
  206. :label-col="{ span: 6 }"
  207. :wrapper-col="{ span: 18 }"
  208. :label="value.name"
  209. :ref="value.indicatorCode + valueIndex"
  210. :prop="'ruleList.' + index + '.ruleDetail.' + valueIndex + '.threshold'"
  211. :rules="{
  212. required: item.isRequired == 1 ? true : false,
  213. message: `${value.name}必选`,
  214. trigger: 'change',
  215. }"
  216. v-else-if="value.modelType == 'select' || value.modelType == 'checkBox'"
  217. >
  218. <selectGroup
  219. :disabled="!editShow"
  220. v-model="value.threshold"
  221. :code="value.dictId"
  222. :multiple="
  223. value.dataType == 'string' ||
  224. value.dataType == 'number' ||
  225. value.indicatorCode == 'presentedVideo' ||
  226. value.indicatorCode == 'hideIfExists'
  227. ? false
  228. : true
  229. "
  230. style="width: 95%"
  231. @clearValidate="clearAll"
  232. />
  233. </a-form-model-item>
  234. <a-form-model-item
  235. :label-col="{ span: 6 }"
  236. :wrapper-col="{ span: 18 }"
  237. :label="value.name"
  238. :ref="value.indicatorCode + valueIndex"
  239. :prop="'ruleList.' + index + '.ruleDetail.' + valueIndex + '.threshold'"
  240. :rules="{
  241. required: item.isRequired == 1 ? true : false,
  242. message: `${value.name}必选`,
  243. trigger: 'change',
  244. }"
  245. v-else-if="value.modelType == 'tagBox'"
  246. >
  247. <a-select
  248. :disabled="!editShow"
  249. mode="tags"
  250. style="width: 95%"
  251. placeholder="按回车生成"
  252. v-model="value.threshold"
  253. dropdownClassName="display-none-selset"
  254. :token-separators="[',', ' ', ',']"
  255. :maxTagCount="3"
  256. >
  257. </a-select>
  258. </a-form-model-item>
  259. </div>
  260. </div>
  261. </template>
  262. </div>
  263. </div>
  264. </div>
  265. </div>
  266. </div>
  267. </div>
  268. <div class="row-item" v-else-if="item.ruleType == 'group' && item.isCopy == 1" :key="index">
  269. <div class="hint-item">
  270. <a-tooltip>
  271. <template slot="title">
  272. {{ item.remark }}
  273. </template>
  274. <a-icon type="question-circle" />
  275. </a-tooltip>
  276. </div>
  277. <div class="label-item">
  278. <div class="text-item">{{ item.groupName }}</div>
  279. <div class="required-item" v-if="item.isRequired == 1"></div>
  280. </div>
  281. <div class="input-item">
  282. <div class="toolbox-automate-rules-create-content_rules-and-condition_rules">
  283. <div class="content">
  284. <div
  285. class="rules-list"
  286. v-for="(valueElse, valueIndex) of item.ruleDetail"
  287. :key="valueIndex + 'ruleDetail'"
  288. >
  289. <div class="rules-list-item">
  290. <template v-for="(value, valueElseIndex) of valueElse">
  291. <div
  292. class="row-item row-group"
  293. v-if="value.variableType == 1"
  294. :key="valueElseIndex + 'valueElse'"
  295. >
  296. <!-- <div class="hint-item"></div>
  297. <div class="label-item">
  298. <div class="text-item"></div>
  299. <div class="required-item"></div>
  300. </div> -->
  301. <div class="input-item">
  302. <a-form-model-item
  303. :label-col="{ span: 6 }"
  304. :wrapper-col="{ span: 18 }"
  305. :label="value.name"
  306. :ref="value.indicatorCode + valueIndex"
  307. :prop="
  308. 'ruleList.' +
  309. index +
  310. '.ruleDetail.' +
  311. valueIndex +
  312. '.' +
  313. valueElseIndex +
  314. '.threshold'
  315. "
  316. :rules="{
  317. required: item.isRequired == 1 ? true : false,
  318. message: `${value.name}必填`,
  319. trigger: 'blur',
  320. }"
  321. v-if="value.modelType == 'numberText'"
  322. >
  323. <a-input-number
  324. :disabled="!editShow"
  325. style="width: 100px; margin-right: 5px"
  326. v-model="value.threshold"
  327. :min="0"
  328. />{{ value.dataUnit }}
  329. </a-form-model-item>
  330. <a-form-model-item
  331. :label-col="{ span: 6 }"
  332. :wrapper-col="{ span: 18 }"
  333. :label="value.name"
  334. :ref="value.indicatorCode + valueIndex"
  335. :prop="
  336. 'ruleList.' +
  337. index +
  338. '.ruleDetail.' +
  339. valueIndex +
  340. '.' +
  341. valueElseIndex +
  342. '.threshold'
  343. "
  344. :rules="{
  345. required: item.isRequired == 1 ? true : false,
  346. message: `${value.name}必填`,
  347. trigger: 'blur',
  348. }"
  349. v-else-if="value.modelType == 'text'"
  350. >
  351. <a-input :disabled="!editShow" v-model="value.threshold" style="width: 95%" />
  352. </a-form-model-item>
  353. <a-form-model-item
  354. :label-col="{ span: 6 }"
  355. :wrapper-col="{ span: 18 }"
  356. :label="value.name"
  357. :ref="value.indicatorCode + valueIndex"
  358. :prop="
  359. 'ruleList.' +
  360. index +
  361. '.ruleDetail.' +
  362. valueIndex +
  363. '.' +
  364. valueElseIndex +
  365. '.threshold'
  366. "
  367. :rules="{
  368. required: item.isRequired == 1 ? true : false,
  369. message: `${value.name}必选`,
  370. trigger: 'change',
  371. }"
  372. v-else-if="value.modelType == 'select' || value.modelType == 'checkBox'"
  373. >
  374. <selectGroup
  375. :disabled="!editShow"
  376. v-model="value.threshold"
  377. :code="value.dictId"
  378. :multiple="
  379. value.dataType == 'string' ||
  380. value.dataType == 'number' ||
  381. value.indicatorCode == 'presentedVideo' ||
  382. value.indicatorCode == 'hideIfExists'
  383. ? false
  384. : true
  385. "
  386. style="width: 95%"
  387. @clearValidate="clearAll"
  388. />
  389. </a-form-model-item>
  390. <a-form-model-item
  391. :label-col="{ span: 6 }"
  392. :wrapper-col="{ span: 18 }"
  393. :label="value.name"
  394. :ref="value.indicatorCode + valueIndex"
  395. :prop="
  396. 'ruleList.' +
  397. index +
  398. '.ruleDetail.' +
  399. valueIndex +
  400. '.' +
  401. valueElseIndex +
  402. '.threshold'
  403. "
  404. :rules="{
  405. required: item.isRequired == 1 ? true : false,
  406. message: `${value.name}必选`,
  407. trigger: 'change',
  408. }"
  409. v-else-if="value.modelType == 'tagBox'"
  410. >
  411. <a-select
  412. :disabled="!editShow"
  413. mode="tags"
  414. style="width: 95%"
  415. placeholder="按回车生成"
  416. v-model="value.threshold"
  417. dropdownClassName="display-none-selset"
  418. :token-separators="[',', ' ', ',']"
  419. :maxTagCount="3"
  420. >
  421. </a-select>
  422. </a-form-model-item>
  423. </div>
  424. </div>
  425. <div
  426. class="rules-list-item-delete"
  427. v-if="item.isCopy == 1"
  428. @click="addData(item, valueElse, valueIndex)"
  429. :key="valueElseIndex"
  430. >
  431. {{ valueIndex == 0 ? '复建' : '删除' }}
  432. </div>
  433. </template>
  434. </div>
  435. </div>
  436. </div>
  437. </div>
  438. </div>
  439. </div>
  440. </template>
  441. </div>
  442. </a-form-model>
  443. </div>
  444. </a-spin>
  445. </div>
  446. <switchConfig :disabled="!editShow" v-if="form.mediaType == 1 || form.mediaType == 3" />
  447. <div class="toolbox-automate-rules-create-body" v-if="editShow">
  448. <div class="moduler">
  449. <div class="opt">
  450. <a-button type="default" style="margin-right: 15px" @click="goBack">{{
  451. editShow ? '取消' : '返回'
  452. }}</a-button>
  453. <a-button
  454. type="primary"
  455. style="margin-right: 15px"
  456. @click="saveHandler"
  457. :loading="saveLoading"
  458. v-if="editShow"
  459. >确定</a-button
  460. >
  461. </div>
  462. </div>
  463. </div>
  464. </div>
  465. </template>
  466. <script>
  467. import { isArray } from '@/utils/Tools'
  468. import moment from 'moment'
  469. import { getAction, postAction, downFile, downFilePost } from '@/api/manage'
  470. import { Switch } from 'ant-design-vue'
  471. import Treeselect from '@/views/modules/Statistics/components/Treeselect.vue'
  472. import selectGroup from '@/components/formComponents/selectGroup'
  473. import checkBoxGroup from '@/components/formComponents/checkBoxGroup'
  474. import timeRange from '@/components/formComponents/timeRange'
  475. import scheduleTime from '@/components/formComponents/toutiaoTime'
  476. import region from '@/components/formComponents/selectRegion'
  477. import switchConfig from './switchConfig'
  478. let statusList = [
  479. {
  480. id: 2,
  481. value: '1',
  482. title: '所有投放中',
  483. },
  484. ]
  485. let condition = [
  486. {
  487. value: '0',
  488. label: '展示数据',
  489. children: [
  490. {
  491. value: 'SHOW',
  492. label: '展示数',
  493. },
  494. {
  495. value: 'CLICK',
  496. label: '点击数',
  497. },
  498. {
  499. value: 'CLICK_RATE',
  500. label: '点击率',
  501. },
  502. {
  503. value: 'COST',
  504. label: '消耗',
  505. },
  506. {
  507. value: 'AD_CLICK_PRICE',
  508. label: '平均点击单价',
  509. },
  510. ],
  511. },
  512. {
  513. value: '1',
  514. label: '转化数据',
  515. children: [
  516. {
  517. value: 'CONVERT',
  518. label: '转化数',
  519. },
  520. {
  521. value: 'CONVERT_COST',
  522. label: '转化成本',
  523. },
  524. {
  525. value: 'CONVERT_RATE',
  526. label: '转化率',
  527. },
  528. {
  529. value: 'DEEP_CONVERT',
  530. label: '深度转化数',
  531. },
  532. {
  533. value: 'DEEP_CONVERT_COST',
  534. label: '深度转化成本',
  535. },
  536. {
  537. value: 'DEEP_CONVERT_RATE',
  538. label: '深度转化率',
  539. },
  540. ],
  541. },
  542. ]
  543. let budgetMultipleArr = [
  544. {
  545. value: 0.5,
  546. label: '0.5倍预算',
  547. },
  548. {
  549. value: 0.8,
  550. label: '0.8倍预算',
  551. },
  552. {
  553. value: 1,
  554. label: '1倍预算',
  555. },
  556. {
  557. value: 1.5,
  558. label: '1.5倍预算',
  559. },
  560. ]
  561. export default {
  562. components: {
  563. Treeselect,
  564. selectGroup,
  565. checkBoxGroup,
  566. timeRange,
  567. switchConfig,
  568. scheduleTime,
  569. region,
  570. },
  571. data() {
  572. return {
  573. editShow: false,
  574. current: 0,
  575. spinLoading: false,
  576. // allCol: {
  577. // labelCol: { span: 6 },
  578. // wrapperCol: { span: 18 },
  579. // },
  580. wrapperCol: { span: 14 },
  581. ceshi: [],
  582. ceshi2: [],
  583. time: [moment('2020/11/16', 'YYYY-MM-DD'), moment('2020/11/17', 'YYYY-MM-DD')],
  584. campaignList: [],
  585. currentRuleId: '',
  586. rulesFieldList: [],
  587. accountID: undefined,
  588. selectedCampaignValue: undefined,
  589. spinning: false,
  590. campaignHaveList: [],
  591. currentPage: 1,
  592. totalPage: 0,
  593. checkedList: [],
  594. indeterminate: false,
  595. checkAll: false,
  596. plainOptions: [],
  597. saveLoading: false,
  598. // 用到的参数数组
  599. condition,
  600. statusList,
  601. budgetMultipleArr,
  602. accountList: [],
  603. form: {},
  604. rules: {},
  605. rulesList: [
  606. {
  607. metricValueName: '',
  608. metricValueCode: '',
  609. dataRange: 'CURRENT_DAY_DATA',
  610. judgeMethod: 'GT_EQ',
  611. judgeType: 'MONEY',
  612. threshold: 0,
  613. minThreshold: 0,
  614. campaignStatus: undefined,
  615. unitStatus: undefined,
  616. },
  617. ],
  618. accountFieldList: [],
  619. campaignFieldList: [],
  620. unitFieldList: [],
  621. textData: {
  622. success: true,
  623. message: '操作成功!',
  624. code: 0,
  625. result: {
  626. templateName: '测试模板',
  627. applyAccount: '',
  628. ruleList: [
  629. {
  630. groupName: '成本限额',
  631. operate: '',
  632. ruleDetail: [
  633. {
  634. variableType: 1,
  635. ruleCondition: 'greater_equal',
  636. ruleDimension: 'account',
  637. dataType: 'number',
  638. indicatorCode: 'convert_cost',
  639. name: '转化成本',
  640. ruleName: '转化成本',
  641. threshold: '0',
  642. dictId: '',
  643. ruleId: 9,
  644. dataUnit: '元',
  645. },
  646. ],
  647. groupId: 4,
  648. ruleType: 'base',
  649. sendType: '',
  650. ruleRelationship: 'and',
  651. remark: '转化成本大于等于设置值X,报警',
  652. },
  653. {
  654. groupName: '消耗限额',
  655. operate: '',
  656. ruleDetail: [
  657. {
  658. variableType: 1,
  659. ruleCondition: 'greater_equal',
  660. ruleDimension: 'plan',
  661. dataType: 'number',
  662. indicatorCode: 'cost',
  663. name: '消耗',
  664. ruleName: '消耗',
  665. threshold: '0',
  666. dictId: '',
  667. ruleId: 10,
  668. dataUnit: '元',
  669. },
  670. ],
  671. groupId: 5,
  672. ruleType: 'base',
  673. sendType: '',
  674. ruleRelationship: 'and',
  675. remark: '消耗大于等于设置值X,触发报警',
  676. },
  677. {
  678. groupName: '账户余额限额',
  679. operate: '',
  680. ruleDetail: [
  681. {
  682. variableType: 1,
  683. ruleCondition: 'less_equal',
  684. ruleDimension: 'account',
  685. dataType: 'number',
  686. indicatorCode: 'validBalance',
  687. name: '账户余额',
  688. ruleName: '账户余额',
  689. threshold: '0',
  690. dictId: '',
  691. ruleId: 11,
  692. dataUnit: '元',
  693. },
  694. ],
  695. groupId: 6,
  696. ruleType: 'base',
  697. sendType: '',
  698. ruleRelationship: 'and',
  699. remark: '账户余额小于等于设置值X,报警',
  700. },
  701. {
  702. groupName: '广告位付费',
  703. operate: '',
  704. ruleDetail: [
  705. {
  706. variableType: 1,
  707. ruleCondition: 'equal',
  708. ruleDimension: 'plan',
  709. dataType: 'string',
  710. indicatorCode: 'pricing',
  711. name: '付费方式',
  712. ruleName: '付费方式',
  713. threshold: '',
  714. dictId: 'ba22a2f2777f7156a7bd814dafc36637',
  715. ruleId: 12,
  716. dataUnit: '',
  717. },
  718. {
  719. variableType: 1,
  720. ruleCondition: 'contain',
  721. ruleDimension: 'target',
  722. dataType: 'array',
  723. indicatorCode: 'inventoryType',
  724. name: '媒体广告位',
  725. ruleName: '媒体广告位',
  726. threshold: '0',
  727. dictId: 'eb595236fd3891c7d283986464eb40e5',
  728. ruleId: 13,
  729. dataUnit: '',
  730. },
  731. ],
  732. groupId: 7,
  733. ruleType: 'group',
  734. sendType: '',
  735. ruleRelationship: 'and',
  736. remark: '预警系统设置付费方式X,且媒体广告位为Y,触发报警',
  737. },
  738. ],
  739. mediaType: 1,
  740. templateId: 3,
  741. },
  742. timestamp: 1605605725236,
  743. },
  744. }
  745. },
  746. watch: {
  747. 'form.applyAccount'(n, o) {
  748. this.campaignList = []
  749. this.form.campaignId = ''
  750. if (n) {
  751. this.spinning = true
  752. if (this.form.eventRuleLevel == 'CAMPAIGN') {
  753. this.getCampaignList()
  754. } else if (this.form.eventRuleLevel == 'UNIT') {
  755. this.getCampaignList()
  756. this.getUnitList()
  757. }
  758. } else if (!n) {
  759. this.plainOptions = []
  760. }
  761. },
  762. 'form.campaignId'(n, o) {
  763. this.spinning = true
  764. this.getUnitList()
  765. },
  766. },
  767. methods: {
  768. addData(valueElse, value, index) {
  769. // alert(1)
  770. if (index == 0) {
  771. var data = JSON.parse(JSON.stringify(value))
  772. data = data.map((item) => {
  773. return {
  774. ...item,
  775. threshold: undefined,
  776. }
  777. })
  778. valueElse.ruleDetail.push(data)
  779. } else {
  780. valueElse.ruleDetail.splice(index, 1)
  781. }
  782. },
  783. disabledDate(current) {
  784. return current && current < moment().subtract(1, 'days')
  785. },
  786. // 应用方式改变
  787. applyRangeChange(e) {
  788. this.checkedList = []
  789. this.checkAll = false
  790. this.indeterminate = false
  791. if (e.target.value == 'ACCORDINGTO_STATUS') {
  792. this.form.appStatus = '1'
  793. } else {
  794. this.form.appStatus = null
  795. }
  796. },
  797. // 获取计划列表
  798. getCampaignList() {
  799. getAction('/kuaishou/batch/getCampaignList', {
  800. accountId: this.form.applyAccount,
  801. putStatus: 1,
  802. pageNo: 1,
  803. pageSize: 100000,
  804. }).then((res) => {
  805. this.plainOptions = []
  806. this.spinning = false
  807. if (res.success) {
  808. if (this.form.eventRuleLevel == 'CAMPAIGN') {
  809. this.plainOptions = res.result.records.map((item) => {
  810. return {
  811. ...item,
  812. label: item.campaignName,
  813. value: item.campaignId,
  814. }
  815. })
  816. }
  817. this.campaignList = res.result.records
  818. }
  819. })
  820. },
  821. // 获取计划列表
  822. getUnitList() {
  823. getAction('/kuaishou/batch/getUnitList', {
  824. accountId: this.form.applyAccount,
  825. campaignId: this.form.campaignId,
  826. pageNo: 1,
  827. pageSize: 100000,
  828. }).then((res) => {
  829. this.plainOptions = []
  830. this.spinning = false
  831. if (res.success) {
  832. this.plainOptions = res.result.records.map((item) => {
  833. return {
  834. ...item,
  835. label: item.unitName + '_(' + item.reviewDetail + ')',
  836. value: item.unitId,
  837. }
  838. })
  839. }
  840. })
  841. },
  842. inputCheck(val) {
  843. // console.log(val)
  844. },
  845. isCost(val) {
  846. if (val.indexOf('Cost') != -1) {
  847. return true
  848. } else if (val.indexOf('depletion') != -1) {
  849. return true
  850. } else {
  851. return false
  852. }
  853. },
  854. handleChange(value) {
  855. let rulesList = {}
  856. rulesList = this.rulesFieldList.filter((item) => {
  857. return item.metricValueCode == value
  858. })[0]
  859. this.rulesList = []
  860. rulesList.childs.forEach((ele, index) => {
  861. this.rulesList.push({
  862. metricValueName: ele.metricValueName,
  863. metricValueCode: ele.metricValueCode,
  864. dataRange: 'CURRENT_DAY_DATA',
  865. judgeMethod: 'GT_EQ',
  866. judgeType: 'MONEY',
  867. threshold: undefined,
  868. minThreshold: undefined,
  869. campaignStatus: undefined,
  870. unitStatus: undefined,
  871. })
  872. })
  873. },
  874. filterOption(input, option) {
  875. return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
  876. },
  877. // form-modal 自带方法
  878. onSubmit() {
  879. this.$refs.ruleForm.validate((valid) => {
  880. if (valid) {
  881. console.log('submit!', valid)
  882. } else {
  883. console.log('error submit!!')
  884. return false
  885. }
  886. })
  887. },
  888. resetForm() {
  889. this.$refs.ruleForm.resetFields()
  890. },
  891. addRule() {
  892. this.rulesList.push({
  893. metricValueName: ['0', 'COST'],
  894. dataRange: 'CURRENT_DAY_DATA',
  895. judgeMethod: 'GT_EQ',
  896. judgeType: 'MONEY',
  897. budgetMultiple: 0.5,
  898. budgetMultipleMin: 0.5,
  899. budgetMultipleMax: 0.8,
  900. campaignStatus: undefined,
  901. unitStatus: undefined,
  902. threshold: 0,
  903. maxNumber: 0,
  904. })
  905. },
  906. deleteRulesListItem(item, index) {
  907. console.log(item, index)
  908. this.rulesList = this.rulesList.filter((ele, ind) => {
  909. return ind != index
  910. })
  911. },
  912. displayRender({ labels }) {
  913. return labels[labels.length - 1]
  914. },
  915. conditionChange(item) {
  916. console.log(item)
  917. if (item.metricValueName[1] == 'COST') {
  918. item.judgeType = 'MONEY'
  919. } else {
  920. item.judgeType = undefined
  921. }
  922. item.specificMoney = undefined
  923. item.specificMoneyMin = undefined
  924. item.specificMoneyMax = undefined
  925. item.threshold = undefined
  926. item.maxNumber = undefined
  927. item.campaignStatus = undefined
  928. item.unitStatus = undefined
  929. },
  930. applyObjChange(e) {
  931. // console.log(e.target.value)
  932. this.plainOptions = []
  933. this.checkedList = []
  934. this.checkAll = false
  935. this.indeterminate = false
  936. if (e.target.value == 'ACCOUNT') {
  937. this.form.processMethod = 'SEND'
  938. this.rulesFieldList = this.accountFieldList
  939. } else if (e.target.value == 'CAMPAIGN') {
  940. this.rulesFieldList = this.campaignFieldList
  941. } else if (e.target.value == 'UNIT') {
  942. this.rulesFieldList = this.unitFieldList
  943. }
  944. if (this.form.applyAccount) {
  945. if (e.target.value == 'CAMPAIGN') {
  946. this.spinning = true
  947. this.getCampaignList()
  948. } else if (e.target.value == 'UNIT') {
  949. this.spinning = true
  950. this.getCampaignList()
  951. this.getUnitList()
  952. }
  953. }
  954. },
  955. saveHandler() {
  956. this.$refs.ruleForm.validate((valid) => {
  957. if (valid) {
  958. // this.form.rulesList=this.rulesList;
  959. var datas = []
  960. datas = this.form.ruleList.map((item) => {
  961. return {
  962. ...item,
  963. ruleDetail: item.ruleDetail.map((end) => {
  964. if (isArray(item.ruleDetail[0])) {
  965. var data = end.map((c) => {
  966. return {
  967. ...c,
  968. threshold: isArray(c.threshold) ? JSON.stringify(c.threshold) : c.threshold,
  969. }
  970. })
  971. return data
  972. } else {
  973. return {
  974. ...end,
  975. threshold: isArray(end.threshold)
  976. ? end.modelType == 'region'
  977. ? JSON.stringify(
  978. end.threshold.map((c) => {
  979. return c.value
  980. })
  981. )
  982. : JSON.stringify(end.threshold)
  983. : end.threshold,
  984. }
  985. }
  986. }),
  987. }
  988. })
  989. // console.log(data)
  990. var params = {
  991. ...this.form,
  992. ruleList: datas,
  993. accountId: JSON.parse(localStorage.getItem('getRuleDetail')).accountId,
  994. }
  995. this.saveLoading = true
  996. console.log(params)
  997. postAction('/ruleAccountThreshold/fillThreshold', params).then((res) => {
  998. if (res.success) {
  999. this.saveLoading = false
  1000. // this.goBack()
  1001. this.$router.replace('/earlyWarningRules/useRuleList')
  1002. this.$bus.$emit('remove', '/earlyWarningRules/ruleModule')
  1003. }
  1004. })
  1005. } else {
  1006. this.$message.error('请按提示填写必填项!')
  1007. return false
  1008. }
  1009. })
  1010. },
  1011. goBack() {
  1012. this.$router.replace('/earlyWarningRules/useRuleList')
  1013. this.$bus.$emit('remove', '/earlyWarningRules/ruleModule')
  1014. },
  1015. //分页页码改变
  1016. pageNoChange(val) {
  1017. console.log(val)
  1018. this.currentPage = val
  1019. this.selectedCampaign()
  1020. },
  1021. onChange(checkedList) {
  1022. this.indeterminate = !!checkedList.length && checkedList.length < this.plainOptions.length
  1023. this.checkAll = checkedList.length === this.plainOptions.length
  1024. },
  1025. onCheckAllChange(e) {
  1026. let valueOption = []
  1027. this.plainOptions.forEach((item) => {
  1028. valueOption.push(item.value)
  1029. })
  1030. Object.assign(this, {
  1031. checkedList: e.target.checked ? valueOption : [],
  1032. indeterminate: false,
  1033. checkAll: e.target.checked,
  1034. })
  1035. },
  1036. selectedCampaign(e) {
  1037. // console.log(e.target.value,this.selectedCampaignValue);
  1038. if (this.accountID) {
  1039. this.getExsitGroupList()
  1040. } else {
  1041. this.$message.warning('请选择账户后重试!')
  1042. this.selectedCampaignValue = undefined
  1043. }
  1044. },
  1045. clearAll(data) {
  1046. this.$nextTick(() => {
  1047. // if (data.length == 0) {
  1048. setTimeout(() => {
  1049. this.$refs.ruleForm.clearValidate()
  1050. }, 100)
  1051. // }
  1052. })
  1053. },
  1054. },
  1055. filters: {
  1056. handlerApplyObj(val) {
  1057. let showVal = ''
  1058. switch (val) {
  1059. case 'CAMPAIGN':
  1060. showVal = '计划'
  1061. break
  1062. case 'UNIT':
  1063. showVal = '组'
  1064. break
  1065. case 'CREATE':
  1066. showVal = '创意'
  1067. break
  1068. default:
  1069. break
  1070. }
  1071. return showVal
  1072. },
  1073. handlerDANWEI(val) {
  1074. // console.log(val.indexOf("RATE") != -1)
  1075. let returnVal = ''
  1076. if (val.indexOf('Roi') != -1) {
  1077. returnVal = ''
  1078. } else if (val.indexOf('Cost') != -1 || val.indexOf('depletion') != -1) {
  1079. returnVal = '元'
  1080. } else {
  1081. returnVal = ''
  1082. }
  1083. return returnVal
  1084. },
  1085. },
  1086. mounted() {
  1087. // getAction('/alarm/alarmMetricValue/queryParentChildList',{
  1088. // }).then(res=>{
  1089. // console.log(res);
  1090. // if(res.success){
  1091. // this.rulesFieldList=res.result
  1092. // }
  1093. // })
  1094. var data = JSON.parse(localStorage.getItem('getRuleDetail'))
  1095. this.editShow = data.edit
  1096. if (data.edit) {
  1097. this.spinLoading = true
  1098. getAction('/ruleTemplate/queryDetailByAccountIdAndTemplateId', {
  1099. templateId: data.id,
  1100. accountId: data.accountId,
  1101. }).then((res) => {
  1102. if (res.success) {
  1103. this.form = res.result
  1104. var data = this.form.ruleList.map((item) => {
  1105. return {
  1106. ...item,
  1107. ruleDetail: item.ruleDetail.map((end) => {
  1108. if (isArray(end)) {
  1109. var data = end.map((c) => {
  1110. return {
  1111. ...c,
  1112. threshold:
  1113. c.modelType == 'tagBox' ? (c.threshold == null ? undefined : c.threshold) : c.threshold,
  1114. }
  1115. })
  1116. return [...data]
  1117. } else {
  1118. return {
  1119. ...end,
  1120. threshold:
  1121. end.modelType == 'tagBox' ? (end.threshold == null ? undefined : end.threshold) : end.threshold,
  1122. }
  1123. }
  1124. }),
  1125. }
  1126. })
  1127. this.form.ruleList = data
  1128. this.spinLoading = false
  1129. } else {
  1130. this.spinLoading = false
  1131. }
  1132. })
  1133. } else {
  1134. this.spinLoading = true
  1135. getAction('/ruleTemplate/previewTemplate', { id: data.id }).then((res) => {
  1136. if (res.success) {
  1137. this.form = res.result
  1138. var str = ''
  1139. for (let i = 0; i < 7 * 24; i++) {
  1140. str += '0'
  1141. }
  1142. var data = this.form.ruleList.map((item) => {
  1143. return {
  1144. ...item,
  1145. ruleDetail: item.ruleDetail.map((end) => {
  1146. if (isArray(end)) {
  1147. var data = end.map((c) => {
  1148. return {
  1149. ...c,
  1150. threshold:
  1151. c.modelType == 'tagBox' ? undefined : c.modelType == 'scheduleTime' ? str : end.threshold,
  1152. }
  1153. })
  1154. return [...data]
  1155. } else {
  1156. return {
  1157. ...end,
  1158. threshold:
  1159. end.modelType == 'tagBox' ? undefined : end.modelType == 'scheduleTime' ? str : end.threshold,
  1160. }
  1161. }
  1162. }),
  1163. }
  1164. })
  1165. this.form.ruleList = data
  1166. this.spinLoading = false
  1167. } else {
  1168. this.spinLoading = false
  1169. }
  1170. })
  1171. }
  1172. },
  1173. }
  1174. </script>
  1175. <style lang="scss" scoped>
  1176. .ruleModule {
  1177. .toolbox-automate-rules-create-body {
  1178. margin: 16px 12px 12px;
  1179. padding: 32px 32px 16px;
  1180. background-color: #fff;
  1181. border-radius: 4px;
  1182. }
  1183. .toolbox-automate-rules-create-content_title {
  1184. background-color: #fff;
  1185. display: flex;
  1186. flex-flow: row nowrap;
  1187. justify-content: flex-start;
  1188. align-items: center;
  1189. margin-bottom: 28px;
  1190. h3 {
  1191. font-size: 22px;
  1192. margin: 0;
  1193. font-weight: 400;
  1194. height: 30px;
  1195. line-height: 30px;
  1196. }
  1197. }
  1198. .toolbox-automate-rules-create-content {
  1199. padding-left: 28px;
  1200. }
  1201. .moduler {
  1202. .opt {
  1203. text-align: right;
  1204. }
  1205. width: 100%;
  1206. background: #fff;
  1207. margin-bottom: 16px;
  1208. position: relative;
  1209. padding: 32px 24px 48px 32px;
  1210. // border-radius: 4px;
  1211. // box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.05);
  1212. .moduler-title {
  1213. display: flex;
  1214. align-items: center;
  1215. font-size: 22px;
  1216. margin-bottom: 20px;
  1217. }
  1218. .row-group {
  1219. margin-bottom: 0 !important;
  1220. }
  1221. .row-item {
  1222. display: flex;
  1223. justify-content: flex-start;
  1224. align-items: center;
  1225. margin-bottom: 20px;
  1226. }
  1227. .row-item:last-of-type {
  1228. margin-bottom: 0;
  1229. }
  1230. .row-item .hint-item {
  1231. width: 24px;
  1232. min-width: 24px;
  1233. align-self: flex-start;
  1234. line-height: 20px;
  1235. height: 20px;
  1236. margin-top: 9px;
  1237. }
  1238. .row-item .label-item {
  1239. position: relative;
  1240. align-items: flex-start;
  1241. align-self: flex-start;
  1242. line-height: 20px;
  1243. height: 20px;
  1244. margin-top: 10px;
  1245. width: 140px;
  1246. min-width: 140px;
  1247. .text-item {
  1248. font-size: 14px;
  1249. width: 120px;
  1250. }
  1251. }
  1252. .row-item .required-item {
  1253. width: 4px;
  1254. height: 4px;
  1255. border-radius: 2px;
  1256. background: #f45858;
  1257. position: absolute;
  1258. right: 10px;
  1259. top: 50%;
  1260. transform: translateY(-50%);
  1261. }
  1262. .row-item .input-item {
  1263. min-width: 480px;
  1264. position: relative;
  1265. // height: 35px;
  1266. .tip {
  1267. font-size: 12px;
  1268. color: tomato;
  1269. }
  1270. }
  1271. .adName {
  1272. display: flex;
  1273. .nameList {
  1274. width: 90%;
  1275. }
  1276. .item {
  1277. display: inline-block;
  1278. width: 30%;
  1279. margin-left: 15px;
  1280. margin-bottom: 10px;
  1281. }
  1282. }
  1283. }
  1284. // .toolbox-automate-rules-create-content_rules-and-condition_rules {
  1285. // // margin-bottom: 24px;
  1286. // }
  1287. .toolbox-automate-rules-create-content_rules-and-condition_rules,
  1288. .toolbox-automate-rules-create-content_rules-and-condition_condition {
  1289. width: 1138px;
  1290. background: #fff;
  1291. border-radius: 4px;
  1292. border: 1px solid #dadfe3;
  1293. }
  1294. .toolbox-automate-rules-create-content_rules-and-condition_rules,
  1295. .toolbox-automate-rules-create-content_rules-and-condition_condition {
  1296. .title {
  1297. height: 20px;
  1298. font-size: 14px;
  1299. font-weight: 600;
  1300. color: #333;
  1301. height: 56px;
  1302. border-bottom: 1px solid #E4E9ED;
  1303. padding-left: 24px;
  1304. display: flex;
  1305. justify-content: flex-start;
  1306. align-items: center;
  1307. .condition-title {
  1308. padding-right: 17px;
  1309. }
  1310. }
  1311. .content {
  1312. .add-rule {
  1313. cursor: pointer;
  1314. height: 40px;
  1315. border-radius: 2px;
  1316. border: 1px dashed #dadfe3;
  1317. font-size: 12px;
  1318. display: flex;
  1319. flex-flow: row column;
  1320. justify-content: center;
  1321. align-items: center;
  1322. color: #666;
  1323. margin-top: 16px;
  1324. -moz-user-select: none;
  1325. -webkit-user-select: none;
  1326. -ms-user-select: none;
  1327. -khtml-user-select: none;
  1328. user-select: none;
  1329. }
  1330. .rules-list-item {
  1331. box-sizing: border-box;
  1332. width: 100%;
  1333. padding: 10px;
  1334. background: #f8f9fa;
  1335. border-radius: 4px;
  1336. display: flex;
  1337. align-items: center;
  1338. position: relative;
  1339. flex-wrap: wrap;
  1340. .rules-list-item-delete {
  1341. position: absolute;
  1342. right: 24px;
  1343. height: 30px;
  1344. padding-left: 24px;
  1345. border-left: 1px solid #DADFE3;
  1346. cursor: pointer;
  1347. }
  1348. .rules-list-item-subject {
  1349. width: 120px;
  1350. margin-right: 16px;
  1351. display: flex;
  1352. .ruleName {
  1353. display: block;
  1354. width: 100%;
  1355. height: 32px;
  1356. line-height: 32px;
  1357. text-align: center;
  1358. background-color: #fff;
  1359. border: 1px solid #d9d9d9;
  1360. border-radius: 4px;
  1361. }
  1362. }
  1363. }
  1364. .rules—list_item:last-of-type {
  1365. margin-bottom: 0;
  1366. }
  1367. }
  1368. }
  1369. .selectedExist {
  1370. width: 500px;
  1371. padding-top: 5px;
  1372. .inventory-tags-lists-header {
  1373. background-color: #F8F9FA;
  1374. border: 1px solid #E4E9ED;
  1375. height: 36px;
  1376. line-height: 33px;
  1377. border-radius: 4px 4px 0 0;
  1378. font-weight: bold;
  1379. display: flex;
  1380. }
  1381. .inventory-tags-lists-container {
  1382. border: 1px solid #E4E9ED;
  1383. margin-top: -1px;
  1384. height: 100%;
  1385. padding: 4px 0px;
  1386. border-radius: 0 0 4px 4px;
  1387. height: 300px;
  1388. overflow: auto;
  1389. }
  1390. .inventory-tags-lists-item {
  1391. width: 100%;
  1392. height: 37px;
  1393. line-height: 37px;
  1394. padding-left: 12px;
  1395. padding-right: 12px;
  1396. display: flex;
  1397. font-size: 14px;
  1398. color: #333;
  1399. }
  1400. .input {
  1401. margin-bottom: 16px;
  1402. }
  1403. .campaign-have-list {
  1404. font-family: PingFangSC-Regular;
  1405. font-size: 14px;
  1406. color: #333;
  1407. border: 1px solid #DADFE3;
  1408. border-radius: 4px;
  1409. margin-bottom: 16px;
  1410. height: 388px;
  1411. .campaign-have-header {
  1412. height: 38px;
  1413. width: 100%;
  1414. padding-left: 13px;
  1415. line-height: 38px;
  1416. background: #f8f9fa;
  1417. border-radius: 4px 4px 0px 0px;
  1418. border-bottom: 1px solid #DADFE3;
  1419. }
  1420. .campaign-have-list ul {
  1421. width: 100%;
  1422. height: 350px;
  1423. padding-top: 6px;
  1424. }
  1425. li {
  1426. padding: 6px 10px;
  1427. cursor: pointer;
  1428. }
  1429. li:hover {
  1430. background: #EDF1F5;
  1431. }
  1432. .ad-d-flex-between {
  1433. justify-content: space-between !important;
  1434. }
  1435. .ad-d-flex,
  1436. .ad-btn {
  1437. display: flex;
  1438. align-items: center;
  1439. }
  1440. .byted-loading-v {
  1441. position: absolute;
  1442. top: 0;
  1443. right: 0;
  1444. bottom: 0;
  1445. left: 0;
  1446. z-index: 996;
  1447. background-color: hsla(0, 0%, 96%, 0.9);
  1448. }
  1449. .info {
  1450. width: 60%;
  1451. overflow: hidden;
  1452. text-overflow: ellipsis;
  1453. white-space: nowrap;
  1454. }
  1455. .landing-type {
  1456. color: #999;
  1457. font-size: 12px;
  1458. white-space: nowrap;
  1459. }
  1460. }
  1461. .noAccountID {
  1462. font-size: 14px;
  1463. text-align: center;
  1464. color: #999;
  1465. line-height: 388px;
  1466. }
  1467. .fenye {
  1468. height: 60px;
  1469. padding-top: 12px;
  1470. text-align: right;
  1471. }
  1472. }
  1473. }
  1474. </style>
  1475. <style lang="scss">
  1476. .ruleModule {
  1477. .ant-form-item {
  1478. margin-bottom: 0;
  1479. }
  1480. .content {
  1481. .ant-form-item {
  1482. margin-bottom: 0;
  1483. width: 100%;
  1484. }
  1485. }
  1486. .ant-radio-button-wrapper {
  1487. min-width: 70px;
  1488. text-align: center;
  1489. }
  1490. }
  1491. </style>