index.vue 34 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024
  1. <style lang="scss" scoped>
  2. .adver-position-radio {
  3. margin-bottom: 15px;
  4. .create-web-url-class {
  5. width: 320px;
  6. height: 110px;
  7. background-color: #f9f8f8;
  8. display: flex;
  9. .web-url-img {
  10. width: 53px;
  11. img {
  12. width: 100%;
  13. }
  14. }
  15. .web-url-content {
  16. margin-top: 10px;
  17. margin-left: 10px;
  18. .url-content-id {
  19. margin-top: 10px;
  20. }
  21. }
  22. }
  23. .creative-label-content {
  24. width: 400px;
  25. height: 200px;
  26. padding: 10px;
  27. border: 1px solid #eee;
  28. .label-content-select-tag {
  29. height: 80%;
  30. overflow: auto;
  31. }
  32. .tag-select-class {
  33. margin-bottom: 15px;
  34. }
  35. }
  36. .examin-form-icon {
  37. font-size: 18px;
  38. color: #1890ff;
  39. cursor: pointer;
  40. margin-left: 10px;
  41. }
  42. }
  43. .search-bar {
  44. display: flex;
  45. align-items: center;
  46. }
  47. .search-box p {
  48. display: inline-block;
  49. border: 1px solid #f2f2f2;
  50. border-radius: 5px;
  51. margin-right: 10px;
  52. padding: 5px 10px;
  53. cursor: pointer;
  54. }
  55. .card-person-drawer {
  56. width: 100%;
  57. height: 90%;
  58. overflow: hidden;
  59. padding: 10px 0px;
  60. display: flex;
  61. flex-wrap: wrap;
  62. margin-right: -10px;
  63. ::v-deep .ant-card-body {
  64. padding: 0;
  65. }
  66. ::v-deep .ant-card-head {
  67. padding: 0 5px;
  68. }
  69. .card-item {
  70. width: calc(20% - 10px);
  71. margin: 10px 5px;
  72. float: left;
  73. }
  74. .card-item-else {
  75. width: calc(20% - 10px);
  76. margin: 10px 5px;
  77. float: left;
  78. }
  79. }
  80. </style>
  81. <style scoped>
  82. .showNumBox {
  83. margin: 10px 0;
  84. }
  85. .showNumBox .ant-card-body {
  86. display: flex;
  87. justify-content: center;
  88. }
  89. .showNumBox p,
  90. .showNumBox span {
  91. text-align: center;
  92. line-height: 40px;
  93. font-size: 30px;
  94. font-weight: 600;
  95. color: red;
  96. margin: 0;
  97. }
  98. .search-box .ant-card-body {
  99. padding: 5px 15px;
  100. }
  101. .showNumBox .ant-card-body .styleElse {
  102. line-height: 60px;
  103. height: 40px;
  104. font-size: 16px;
  105. font-weight: 400;
  106. margin-left: 10px;
  107. }
  108. .ant-modal-wrap .yincang .ant-modal-content .ant-modal-footer {
  109. display: none !important;
  110. }
  111. .yincang .ant-col-6 p {
  112. text-align: left;
  113. color: red;
  114. font-size: 16px;
  115. font-weight: 500;
  116. }
  117. .ant-table-thead div {
  118. font-weight: 700;
  119. }
  120. .tool-tip {
  121. position: absolute;
  122. top: 65px;
  123. right: 10px;
  124. }
  125. </style>
  126. <style lang="less" scoped>
  127. .ant-card-head .ant-tabs-bar {
  128. padding: 0;
  129. }
  130. .search-box .ant-card-body {
  131. padding: 5px 15px;
  132. }
  133. .search-box {
  134. padding: 15px 10px;
  135. }
  136. .search-box p {
  137. display: inline-block;
  138. border: 1px solid #f2f2f2;
  139. border-radius: 5px;
  140. margin-right: 10px;
  141. padding: 5px 10px;
  142. cursor: pointer;
  143. }
  144. .statistics .ant-col-6 .ant-card-body .styleElse {
  145. line-height: 60px;
  146. height: 40px;
  147. font-size: 16px;
  148. font-weight: 400;
  149. margin-left: 10px;
  150. }
  151. .ant-modal-wrap .yincang .ant-modal-content .ant-modal-footer {
  152. display: none !important;
  153. }
  154. .yincang .ant-col-6 p {
  155. text-align: left;
  156. color: red;
  157. font-size: 16px;
  158. font-weight: 500;
  159. }
  160. .ant-table-thead div {
  161. font-weight: 700;
  162. }
  163. .tool-tip {
  164. position: absolute;
  165. top: 65px;
  166. right: 10px;
  167. }
  168. .statistics {
  169. .ant-card-bordered {
  170. border: none;
  171. }
  172. .ant-card-head .ant-tabs {
  173. clear: both;
  174. margin-bottom: -13px;
  175. color: rgba(0, 0, 0, 0.65);
  176. font-weight: normal;
  177. font-size: 14px;
  178. }
  179. .duibi {
  180. position: absolute;
  181. right: 24px;
  182. top: 15px;
  183. }
  184. p {
  185. margin-bottom: 0;
  186. }
  187. }
  188. </style>
  189. <style lang="less" scoped>
  190. .middle-button {
  191. margin: 0 8px;
  192. }
  193. .newPlanStatic {
  194. .divider {
  195. height: 62px;
  196. }
  197. .showNumBox {
  198. background: white;
  199. overflow: hidden;
  200. margin: 15px 0;
  201. padding: 30px 0;
  202. text-align: center;
  203. .ant-card-body {
  204. padding-top: 0;
  205. }
  206. .title {
  207. font-size: 14px;
  208. font-family: PingFangSC-Regular, PingFang SC;
  209. font-weight: 400;
  210. color: #999999;
  211. line-height: 22px;
  212. display: inline-block;
  213. }
  214. }
  215. .tabbody {
  216. background: white;
  217. padding: 0 24px;
  218. margin-bottom: 15px;
  219. .ant-tabs-bar {
  220. margin: 0;
  221. }
  222. }
  223. .chartBox {
  224. background: white;
  225. padding: 20px 0;
  226. }
  227. .tableBody {
  228. background: white;
  229. padding: 20px;
  230. }
  231. }
  232. </style>
  233. <style>
  234. .display-none-selset {
  235. display: none !important;
  236. }
  237. </style>
  238. <template>
  239. <div class="newPlanStatic config-project">
  240. <div class="tabbody">
  241. <a-tabs v-model="tabKey" @change="tabChange">
  242. <a-tab-pane :key="1" tab="脚本配置列表"> </a-tab-pane>
  243. <a-tab-pane :key="2" tab="脚本数据导出列表"> </a-tab-pane>
  244. <a-button slot="tabBarExtraContent" type="primary" @click="newCreat(null)" v-if="tabKey == 1">
  245. 新建
  246. </a-button>
  247. </a-tabs>
  248. </div>
  249. <a-card>
  250. <div class="table-page-search-wrapper">
  251. <a-form layout="inline" :form="form" hide-required-mark :selfUpdate="true" @submit="handleQueryList">
  252. <a-row :gutter="24" v-if="tabKey === 1">
  253. <a-col :md="6" :sm="6" :xxl="6">
  254. <a-form-item label="关键字">
  255. <a-input v-decorator="['search_word']" placeholder="请输入关键字" />
  256. </a-form-item>
  257. </a-col>
  258. <a-col :md="6" :sm="6" :xxl="6">
  259. <a-form-item label="时间选择">
  260. <a-range-picker
  261. v-decorator="[
  262. 'timeRange',
  263. { initialValue: [moment().subtract(1, 'months'), moment()] }
  264. ]"
  265. :ranges="dateRanges"
  266. :disabled-date="disabledDate"
  267. />
  268. </a-form-item>
  269. </a-col>
  270. <a-col :md="6" :sm="6" :xxl="6">
  271. <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
  272. <a-button type="primary" icon="search" @click="handleQueryList">查询</a-button>
  273. <a-button type="primary" @click="handleResetForm" icon="reload" class="middle-button"
  274. >重置</a-button
  275. >
  276. </span>
  277. </a-col>
  278. </a-row>
  279. <a-row :gutter="24" v-else>
  280. <a-col :md="6" :sm="6" :xxl="6">
  281. <a-form-item label="选择来源">
  282. <a-select v-decorator="['source_code']" mode="multiple" style="width: 100%;">
  283. <a-select-option value="1">内部创意</a-select-option
  284. ><a-select-option value="2">巨量创意</a-select-option
  285. ><a-select-option value="3">开眼快创</a-select-option>
  286. </a-select>
  287. </a-form-item>
  288. </a-col>
  289. <a-col :md="6" :sm="6" :xxl="6">
  290. <a-form-item label="关键字">
  291. <a-input v-decorator="['search_word']" placeholder="请输入关键字" />
  292. </a-form-item>
  293. </a-col>
  294. <a-col :md="6" :sm="6" :xxl="6">
  295. <a-form-item label="时间选择">
  296. <a-range-picker
  297. v-decorator="[
  298. 'timeRange',
  299. { initialValue: [moment().subtract(1, 'months'), moment()] }
  300. ]"
  301. :ranges="dateRanges"
  302. :disabled-date="disabledDateThen"
  303. />
  304. </a-form-item>
  305. </a-col>
  306. <a-col :md="6" :sm="6" :xxl="6">
  307. <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
  308. <a-button type="primary" icon="search" @click="handleQueryList">查询</a-button>
  309. <a-button type="primary" @click="handleResetForm" icon="reload" class="middle-button"
  310. >重置</a-button
  311. >
  312. <a-button
  313. type="primary"
  314. @click="handleOkDownLoad"
  315. class="middle-button"
  316. :loading="downLoading"
  317. :disabled="selectedRowKeys.length == 0"
  318. >导出</a-button
  319. >
  320. </span>
  321. </a-col>
  322. <!-- <a-col :md="24" :sm="24" :xxl="24" v-if="config_id">
  323. <a-form-item label="脚本ID">
  324. <a-tag :key="config_id" closable @close="() => handleClose(config_id)">
  325. {{ config_id }}
  326. </a-tag>
  327. </a-form-item>
  328. </a-col> -->
  329. </a-row>
  330. </a-form>
  331. </div>
  332. </a-card>
  333. <a-row style="margin-bottom:15px;margin-top:12px">
  334. <a-col :span="24">
  335. <div class="tableBody" style="min-height:200px;padding-bottom: 50px">
  336. <a-table
  337. :columns="columns"
  338. :dataSource="dataSource"
  339. :pagination="false"
  340. :loading="dataLoading"
  341. bordered
  342. size="middle"
  343. style="word-break: break-all;font-size:16px;font-weight:600"
  344. id="outTable"
  345. ref="accountTable"
  346. rowKey="number"
  347. :customRow="rowClick"
  348. :rowSelection="tabKey == 1 ? null : { selectedRowKeys, onChange: onSelectChange }"
  349. >
  350. <span slot="query_word" slot-scope="text, record">
  351. {{ Array.isArray(text) ? text.join() : text }}
  352. </span>
  353. <span slot="recommended_word" slot-scope="text, record">
  354. {{ !!text[0] ? text.join() : '-' }}
  355. </span>
  356. <span slot="script_num" slot-scope="text, record">
  357. {{ text ? text : '-' }}
  358. </span>
  359. <span slot="action" slot-scope="text, record">
  360. <a @click.stop="deleteScript(record)">删除</a>
  361. </span>
  362. </a-table>
  363. <a-pagination
  364. size="small"
  365. :showTotal="ipagination.showTotal"
  366. style="float: right;margin-top:10px"
  367. v-if="dataSource.length > 0"
  368. showQuickJumper
  369. show-size-changer
  370. :pageSize.sync="ipagination.pageSize"
  371. :total="ipagination.total"
  372. v-model="ipagination.current"
  373. @change="getDataSource"
  374. @showSizeChange="getDataSource"
  375. />
  376. </div>
  377. </a-col>
  378. </a-row>
  379. <a-modal
  380. v-if="addScriptVisible"
  381. title="新建脚本配置"
  382. :visible="addScriptVisible"
  383. dialog-class="web-url-modal"
  384. @cancel="handleCancelAll"
  385. @ok="handleBudgetSure"
  386. >
  387. <keyWord :projectId.sync="scriptLabel" :allScript.sync="creativeTag" ref="selectTable" />
  388. <!-- <div class="adver-position-radio">
  389. <div class="creative-label-content">
  390. <p>已选:{{ creativeTag.length || 0 }}</p>
  391. <div class="label-content-select-tag">
  392. <a-tag
  393. v-for="item in creativeTag"
  394. :key="item"
  395. :closable="true"
  396. class="tag-select-class"
  397. @close="handleTagsClose(item)"
  398. >
  399. {{ item }}
  400. </a-tag>
  401. </div>
  402. </div>
  403. </div> -->
  404. </a-modal>
  405. </div>
  406. </template>
  407. <script>
  408. import { TreeSelect } from 'ant-design-vue'
  409. const SHOW_PARENT = TreeSelect.SHOW_PARENT
  410. import ARow from 'ant-design-vue/es/grid/Row'
  411. import ACol from 'ant-design-vue/es/grid/Col'
  412. import moment from 'moment'
  413. import { getAction, postAction, downFile, downFilePost } from '@/api/manage'
  414. import checkBoxGroup from '@/components/formComponents/checkBoxGroup'
  415. import selectCheckAll from '@/views/modules/kuaishouapp/account/stepForm/stepModule/test'
  416. import qs from 'qs'
  417. import { mapGetters } from 'vuex'
  418. import selectTreeAccount from '@/components/formComponents/selectAccount.vue'
  419. import keyWord from './components/keyWord.vue'
  420. function tqFun(qcArr1) {
  421. var tempArr = []
  422. function bbFun(qcArr) {
  423. for (var i = 0; i < qcArr.length; i++) {
  424. if (qcArr[i] instanceof Array) {
  425. bbFun(qcArr[i])
  426. } else {
  427. tempArr.push(qcArr[i])
  428. }
  429. }
  430. return tempArr
  431. }
  432. return bbFun(qcArr1)
  433. }
  434. let TTcolumns = [
  435. {
  436. title: '关键字',
  437. dataIndex: 'query_word',
  438. scopedSlots: { customRender: 'query_word' },
  439. align: 'center',
  440. key: 'query_word'
  441. },
  442. {
  443. title: '推荐词',
  444. dataIndex: 'recommended_word',
  445. scopedSlots: { customRender: 'recommended_word' },
  446. align: 'center',
  447. key: 'recommended_word'
  448. },
  449. {
  450. title: '创建时间',
  451. dataIndex: 'create_time',
  452. scopedSlots: { customRender: 'create_time' },
  453. align: 'center',
  454. key: 'create_time'
  455. },
  456. {
  457. title: '创建人',
  458. dataIndex: 'operator',
  459. scopedSlots: { customRender: 'operator' },
  460. align: 'center',
  461. key: 'operator'
  462. },
  463. {
  464. title: '操作',
  465. dataIndex: 'action',
  466. scopedSlots: { customRender: 'action' },
  467. align: 'center',
  468. key: 'action'
  469. }
  470. ]
  471. let KScolumns = [
  472. {
  473. title: '来源',
  474. dataIndex: 'source_name',
  475. scopedSlots: { customRender: 'source_name' },
  476. align: 'center',
  477. key: 'source_name'
  478. },
  479. {
  480. title: '关键字',
  481. dataIndex: 'query_word',
  482. scopedSlots: { customRender: 'query_word' },
  483. align: 'center',
  484. key: 'query_word'
  485. },
  486. {
  487. title: '时间',
  488. dataIndex: 'stat_date',
  489. scopedSlots: { customRender: 'stat_date' },
  490. align: 'center',
  491. key: 'stat_date'
  492. },
  493. {
  494. title: '数据量级',
  495. dataIndex: 'script_num',
  496. scopedSlots: { customRender: 'script_num' },
  497. align: 'center',
  498. key: 'script_num'
  499. },
  500. {
  501. title: '状态',
  502. dataIndex: 'task_status',
  503. scopedSlots: { customRender: 'task_status' },
  504. align: 'center',
  505. key: 'task_status'
  506. }
  507. ]
  508. export default {
  509. components: {
  510. ACol,
  511. ARow,
  512. checkBoxGroup,
  513. selectCheckAll,
  514. selectTreeAccount,
  515. keyWord
  516. },
  517. data() {
  518. return {
  519. addScriptVisible: false,
  520. scriptLabel: [],
  521. creativeTag: [],
  522. selectedRowKeys: [],
  523. selectedRowKeysAll: [],
  524. selectionRows: [],
  525. selectionRowsAll: [],
  526. downLoading: false,
  527. config_id: null,
  528. appIds: [],
  529. appOptions: [],
  530. materialVisible: false,
  531. materialLoading: false,
  532. scheduleTimeData: [{ scheduleTime: '' }],
  533. indexAll: 0,
  534. spinning: false,
  535. form: this.$form.createForm(this),
  536. priceForm: this.$form.createForm(this),
  537. variableForm: this.$form.createForm(this),
  538. variableLoading: false,
  539. exportloading: false,
  540. dateRange: [moment().subtract(1, 'weeks'), moment()],
  541. noImg: require('@/assets/noImg.png'),
  542. validationRules: {
  543. bid: [
  544. {
  545. required: true,
  546. message: '出价信息必须填写'
  547. // validator: this.validateBid,
  548. }
  549. ]
  550. },
  551. dateRanges: {
  552. 昨天: [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
  553. 近三天: [moment().subtract(2, 'days'), moment()],
  554. 近一周: [moment().subtract(6, 'days'), moment()],
  555. 近14天: [moment().subtract(13, 'days'), moment()],
  556. 近一月: [moment().subtract(1, 'months'), moment()]
  557. },
  558. rowClick: record => {
  559. return {
  560. on: {
  561. click: () => {
  562. if (this.tabKey == 1) {
  563. this.tabKey = 2
  564. this.config_id = record.config_id
  565. this.tabChange(this.tabKey)
  566. }
  567. }
  568. }
  569. }
  570. },
  571. ipagination: {
  572. current: 1,
  573. pageSize: 10,
  574. // pageSizeOptions: ['10', '20', '30'],
  575. showTotal: (total, range) => {
  576. return range[0] + '-' + range[1] + ' 共' + total + '条'
  577. },
  578. showQuickJumper: true,
  579. showSizeChanger: true,
  580. pageSizeOptions: ['10', '30', '50'],
  581. total: 0,
  582. onChange: (current, pageSize) => {
  583. // 切换分页时的回调,
  584. // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
  585. this.ipagination.current = current
  586. this.ipagination.pageSize = pageSize
  587. }
  588. },
  589. value: 'valid',
  590. KSaccountList: [],
  591. TTaccountList: [],
  592. KSdesignList: [],
  593. TTdesignList: [],
  594. operateDisabled: false,
  595. duration: 1000,
  596. //treeselect的参数
  597. treeValue: [],
  598. treeData: [],
  599. SHOW_PARENT,
  600. type: 3,
  601. dateValue: [moment().subtract(30, 'days'), moment()],
  602. operate: '',
  603. designList: [],
  604. tabKey: 1,
  605. loading: false,
  606. TTcolumns,
  607. KScolumns,
  608. columns: [...TTcolumns],
  609. dataSource: [],
  610. dataVideoList: [],
  611. checkVideo: [],
  612. checkPersonOne: '',
  613. checkPersonElse: [],
  614. sumContent: 0,
  615. tableTab: 1,
  616. newPlan: 0,
  617. effectPlan: 0,
  618. openOptions: false,
  619. target: 'createTime',
  620. order: 'descend',
  621. projectId: undefined,
  622. projectIdAll: undefined,
  623. dataLoading: false,
  624. url: process.env.VUE_APP_BASE_SCRIPT_URL + '/get_script_config_lst/',
  625. modifyPriceVisible: false,
  626. modifyPriceLoading: false,
  627. modifyPriceDetail: null,
  628. accountVisible: false,
  629. againLoading: false,
  630. accountProjectDetail: null,
  631. regionData: [{ label: '不限', value: 'unlimited' }],
  632. ageData: [{ label: '不限', value: 'unlimited' }]
  633. }
  634. },
  635. methods: {
  636. moment,
  637. ...mapGetters(['userInfo']),
  638. deleteScript(item) {
  639. let that = this
  640. this.$confirm({
  641. title: '确定要删除此条脚本?',
  642. content: '',
  643. onOk() {
  644. var params = {}
  645. params.config_id = item.config_id
  646. params.user_id = item.user_id
  647. params.operator = item.operator
  648. that.postDataAction(process.env.VUE_APP_BASE_SCRIPT_URL + '/delete_script_config/', params).then(
  649. res => {
  650. if (res.success) {
  651. const paramsData = that.form.getFieldsValue()
  652. that.handleGetTableList(paramsData)
  653. }
  654. }
  655. )
  656. },
  657. onCancel() {}
  658. })
  659. },
  660. handleOkDownLoad() {
  661. this.selectionRows = tqFun(this.selectionRowsAll)
  662. if (this.selectionRows.length > 0) {
  663. this.downLoading = true
  664. let params = this.selectionRows.map(item => {
  665. return {
  666. source_code: item.source_name == '内部创意' ? 1 : item.source_name == '巨量创意' ? 2 : 3,
  667. query_word: item.query_word,
  668. stat_date: item.stat_date
  669. }
  670. })
  671. downFilePost(process.env.VUE_APP_BASE_SCRIPT_URL + '/export_script_file/', params).then(res => {
  672. this.downLoading = false
  673. let blob = new Blob([res], {
  674. type: 'application/vnd.openxmlformats-officedocument.spre1adsheetml.sheet'
  675. })
  676. let downloadElement = document.createElement('a')
  677. let href = window.URL.createObjectURL(blob) //创建下载的链接
  678. downloadElement.href = href
  679. downloadElement.download = '脚本.xlsx' //下载后文件名
  680. document.body.appendChild(downloadElement)
  681. downloadElement.click() //点击下载
  682. document.body.removeChild(downloadElement) //下载完成移除元素
  683. window.URL.revokeObjectURL(href) //释放掉blob对象
  684. })
  685. } else {
  686. this.$message.error('请选择导出的脚本')
  687. }
  688. },
  689. disabledDateThen(current) {
  690. // console.log(current)
  691. return current && (current > moment() || current < moment().subtract(32, 'days'))
  692. },
  693. disabledDate(current) {
  694. // console.log(current)
  695. return current && current > moment()
  696. },
  697. newCreat(id) {
  698. this.addScriptVisible = true
  699. },
  700. handleCancelAll() {
  701. this.addScriptVisible = false
  702. this.creativeTag = []
  703. this.scriptLabel = []
  704. },
  705. handleEnterChang(value) {
  706. this.creativeTag.push(...value)
  707. this.creativeTag = [...new Set(this.creativeTag)]
  708. if (this.creativeTag.length > 50) {
  709. this.$message.error('视频脚本每次最多创建五十个,超过的已清除')
  710. this.creativeTag.pop()
  711. } else {
  712. for (let i = 0; i < this.creativeTag.length; i++) {
  713. if (this.creativeTag[i].length > 10) {
  714. this.creativeTag.splice(i, 1)
  715. this.$message.error('视频脚本最多只能十个字符,超过的已清除')
  716. }
  717. }
  718. }
  719. this.scriptLabel = []
  720. },
  721. handleBudgetSure() {
  722. if (this.creativeTag.length == 0) {
  723. this.$message.error('请输入关键字')
  724. } else {
  725. var params = {}
  726. params.query_word_pair = this.creativeTag
  727. params.operator = this.userInfo().realname
  728. params.user_id = this.userInfo().id
  729. this.postDataAction(process.env.VUE_APP_BASE_SCRIPT_URL + '/add_script_config/', params).then(res => {
  730. if (res.success) {
  731. this.handleCancelAll()
  732. this.creativeTag = []
  733. this.scriptLabel = []
  734. const paramsData = this.form.getFieldsValue()
  735. this.handleGetTableList(paramsData)
  736. }
  737. })
  738. }
  739. },
  740. handleTagsClose(removedTag) {
  741. const tags = this.creativeTag.filter(tag => tag !== removedTag)
  742. this.creativeTag = tags
  743. },
  744. getData(className) {
  745. return this.priceForm.getFieldValue(className)
  746. },
  747. getElseData(className) {
  748. return this.variableForm.getFieldValue(className)
  749. },
  750. onSelectChange(selectedRowKeys, selectionRows) {
  751. this.selectedRowKeys = selectedRowKeys
  752. this.selectionRows = selectionRows
  753. for (let i = 0; i < this.ipagination.current; i++) {
  754. this.selectedRowKeysAll.push([])
  755. this.selectionRowsAll.push([])
  756. }
  757. this.selectedRowKeysAll[this.ipagination.current - 1] = selectedRowKeys
  758. this.selectionRowsAll[this.ipagination.current - 1] = selectionRows
  759. console.log(this.selectedRowKeysAll,this.selectionRowsAll)
  760. },
  761. getDataSource(current, pageSize) {
  762. console.log(pageSize)
  763. // 切换分页时的回调,
  764. // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
  765. this.$nextTick(() => {
  766. this.ipagination.current = current
  767. this.ipagination.pageSize = pageSize
  768. for (let i = 0; i < this.ipagination.current; i++) {
  769. this.selectedRowKeysAll.push([])
  770. this.selectionRowsAll.push([])
  771. }
  772. this.selectedRowKeys = this.selectedRowKeysAll[current - 1]
  773. this.selectionRows = this.selectionRowsAll[current - 1]
  774. const paramsData = this.form.getFieldsValue()
  775. this.handleGetTableList(paramsData)
  776. })
  777. },
  778. handleQueryList(event) {
  779. this.ipagination.current = 1
  780. this.selectedRowKeys = []
  781. this.selectionRows = []
  782. this.selectedRowKeysAll = []
  783. this.selectionRowsAll = []
  784. event.preventDefault()
  785. const paramsData = this.form.getFieldsValue()
  786. this.handleGetTableList(paramsData)
  787. },
  788. handleClose() {
  789. this.config_id = null
  790. const paramsData = this.form.getFieldsValue()
  791. this.handleGetTableList(paramsData)
  792. },
  793. handleResetForm() {
  794. this.ipagination.current = 1
  795. this.selectedRowKeys = []
  796. this.selectionRows = []
  797. this.selectedRowKeysAll = []
  798. this.selectionRowsAll = []
  799. this.form.resetFields()
  800. if (this.tabKey == 1) {
  801. this.projectId = undefined
  802. this.projectIdAll = undefined
  803. }
  804. const paramsData = this.form.getFieldsValue()
  805. this.handleGetTableList(paramsData)
  806. },
  807. handleGetTableList(data) {
  808. let paramsData = {
  809. ...data,
  810. start_date:
  811. data.timeRange && data.timeRange.length === 2
  812. ? moment(data.timeRange[0]).format('YYYY-MM-DD')
  813. : null,
  814. end_date:
  815. data.timeRange && data.timeRange.length === 2
  816. ? moment(data.timeRange[1]).format('YYYY-MM-DD')
  817. : null,
  818. page_num: this.ipagination.current,
  819. page_size: this.ipagination.pageSize
  820. // userId: this.userInfo().id
  821. }
  822. if (this.tabKey == 2 && this.config_id) {
  823. paramsData.config_id = this.config_id
  824. }
  825. this.dataSource = []
  826. this.dataLoading = true
  827. this.postDataAction(this.url, paramsData)
  828. .then(result => {
  829. this.dataLoading = false
  830. if (result.success) {
  831. this.dataSource = result.result || []
  832. // if (result.result.total) {
  833. // this.dataSource.unshift(result.result.total)
  834. // }
  835. this.ipagination.total = result.total_num || 0
  836. // result.result.total
  837. } else {
  838. this.$message.error(result.message)
  839. }
  840. })
  841. .catch(error => {
  842. this.dataLoading = false
  843. console.log(error, 'eeee')
  844. })
  845. },
  846. getAccountNoProject() {
  847. this.projectId = undefined
  848. const paramsData = this.form.getFieldsValue()
  849. this.handleGetTableList(paramsData)
  850. },
  851. dateChange(date, dateString) {
  852. // console.log(date,dateString)
  853. },
  854. filterOption(input, option) {
  855. // console.log(input, option)
  856. return option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
  857. },
  858. // 快手头条的切换
  859. tabChange(key) {
  860. this.ipagination.current = 1
  861. this.ipagination.pageSize = 10
  862. this.columns = this.tabKey == 1 ? [...TTcolumns] : [...KScolumns]
  863. this.url =
  864. this.tabKey == 1
  865. ? process.env.VUE_APP_BASE_SCRIPT_URL + '/get_script_config_lst/'
  866. : process.env.VUE_APP_BASE_SCRIPT_URL + '/get_query_word_task_info_lst/'
  867. if (this.tabKey == 1) {
  868. this.config_id = null
  869. }
  870. this.selectedRowKeys = []
  871. this.selectionRows = []
  872. this.form.resetFields()
  873. const paramsData = this.form.getFieldsValue()
  874. this.handleGetTableList(paramsData)
  875. },
  876. operateChange(value) {
  877. console.log(value)
  878. if (value) {
  879. this.accountDisabled = true
  880. this.accountId = ''
  881. } else {
  882. this.accountDisabled = false
  883. }
  884. },
  885. // table区域的tab切换
  886. tableTabChange(key) {
  887. if (key == 1) {
  888. this.columns = this.tabKey == 1 ? [...TTcolumns] : [...KScolumns]
  889. this.target = 'new'
  890. } else {
  891. this.columns = this.tabKey == 1 ? [...TTcolumns] : [...KScolumns]
  892. this.target = 'valid'
  893. }
  894. }
  895. },
  896. watch: {
  897. dateValue(newName, oldName) {
  898. this.search()
  899. }
  900. },
  901. computed: {
  902. newDate() {
  903. var myDate = new Date()
  904. myDate.getYear() //获取当前年份(2位)
  905. var n = myDate.getFullYear() //获取完整的年份(4位,1970-????)
  906. var m = myDate.getMonth() //获取当前月份(0-11,0代表1月)
  907. var d = myDate.getDate() //获取当前日(1-31)
  908. var day = myDate.getHours()
  909. return day
  910. }
  911. },
  912. mounted() {
  913. const paramsData = this.form.getFieldsValue()
  914. this.handleGetTableList(paramsData)
  915. },
  916. activated: function() {},
  917. filters: {
  918. toPercentage(val) {
  919. if (typeof val != 'string') {
  920. return (val * 100).toFixed(2) + '%'
  921. } else {
  922. return val
  923. }
  924. },
  925. //保留两位小数并且变成货币格式
  926. decimalsHandle(val) {
  927. if (val && typeof val != 'string') {
  928. if (val >= 0) {
  929. val = parseFloat(val).toFixed(2)
  930. let numberStr = val.toString()
  931. let str = numberStr.split('.')
  932. let str0 = str[0].split('').reverse()
  933. for (let i = 0; i < str0.length; i++) {
  934. if ((i + 1) % 4 === 0) {
  935. str0.splice(i, 0, ',')
  936. }
  937. }
  938. str0.reverse()
  939. let handleResult = ''
  940. for (let j = 0; j < str0.length; j++) {
  941. handleResult += str0[j]
  942. }
  943. return handleResult + '.' + str[1]
  944. } else {
  945. val = parseFloat(val).toFixed(2)
  946. let numberStr = val.toString()
  947. let str = numberStr.split('.')
  948. let str0 = str[0]
  949. .substr(1)
  950. .split('')
  951. .reverse()
  952. for (let i = 0; i < str0.length; i++) {
  953. if ((i + 1) % 4 === 0) {
  954. str0.splice(i, 0, ',')
  955. }
  956. }
  957. str0.reverse()
  958. let handleResult = ''
  959. for (let j = 0; j < str0.length; j++) {
  960. handleResult += str0[j]
  961. }
  962. return '-' + handleResult + '.' + str[1]
  963. }
  964. } else if (typeof val == 'string') {
  965. return val
  966. } else {
  967. return 0
  968. }
  969. },
  970. //变成货币格式
  971. formatCurrency(val) {
  972. if (val) {
  973. let numberStr = val.toString()
  974. let str = numberStr.split('').reverse()
  975. for (let i = 0; i < str.length; i++) {
  976. if ((i + 1) % 4 === 0) {
  977. str.splice(i, 0, ',')
  978. }
  979. }
  980. str.reverse()
  981. let handleResult = ''
  982. for (let j = 0; j < str.length; j++) {
  983. handleResult += str[j]
  984. }
  985. return handleResult
  986. } else {
  987. return '-'
  988. }
  989. }
  990. }
  991. }
  992. </script>