ProjectMemberList.vue 31 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042
  1. <style>
  2. .my-project .ant-tabs-nav-scroll {
  3. display: flex;
  4. justify-content: center;
  5. }
  6. .close-account-my-project .ant-modal-footer .ant-btn-primary {
  7. display: none;
  8. }
  9. .only .ant-badge-count {
  10. right: -16px;
  11. }
  12. </style>
  13. <template>
  14. <a-card
  15. :bordered="false"
  16. :tabList="tabListNoTitle"
  17. :activeTabKey="noTitleKey"
  18. @tabChange="(key) => onTabChange(key, 'noTitleKey')"
  19. class="my-project"
  20. >
  21. <!-- 查询区域 -->
  22. <div class="table-page-search-wrapper">
  23. <a-form layout="inline">
  24. <a-row :gutter="24">
  25. <a-col :md="6" :sm="8">
  26. <a-form-item label="项目名称">
  27. <a-input placeholder="请输入项目名称" v-model="keyWord"></a-input>
  28. </a-form-item>
  29. </a-col>
  30. <a-col :md="6" :sm="8">
  31. <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
  32. <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
  33. <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
  34. </span>
  35. </a-col>
  36. </a-row>
  37. </a-form>
  38. </div>
  39. <!-- table区域-begin -->
  40. <div>
  41. <a-table
  42. ref="table"
  43. size="middle"
  44. bordered
  45. rowKey="id"
  46. :columns="columns"
  47. :dataSource="dataSource"
  48. :pagination="ipagination"
  49. :loading="loading"
  50. >
  51. <span slot="bidType" slot-scope="text">
  52. <div v-if="text && JSON.parse(text).length > 0">
  53. <span v-for="(item, index) of JSON.parse(text)" :key="index"
  54. >{{ item | bidTypeData }}{{ index == JSON.parse(text).length - 1 ? '' : '、' }}</span
  55. >
  56. </div>
  57. <div v-else>-</div>
  58. </span>
  59. <span slot="maxBid" slot-scope="maxBid,record">{{ record.maxBid == 0? '-': (record.maxBid / 1000).toFixed(2) }}</span>
  60. <span slot="mediaId" slot-scope="mediaId">{{
  61. mediaId == 1 ? '头条' : mediaId == 2 ? '快手' : mediaId == 3 ? '头条内广' : mediaId == 4 ? '快手内广':mediaId== 5 ? '千川' :'磁力金牛'
  62. }}</span>
  63. <span slot="action" slot-scope="text, record">
  64. <a @click="handleEdit(record)">{{ noTitleKey == 'myProject' ? '查看成员' : '账号绑定' }}</a>
  65. <a-divider type="vertical" />
  66. <a @click="addParams(record)">{{ noTitleKey == 'myProject' ? '新增人员' : '查看账户' }}</a>
  67. <a-divider type="vertical" v-if="noTitleKey == 'myProject'" />
  68. <a-badge :count="record.needExamine" class="only">
  69. <a
  70. @click="projectLook(record)"
  71. v-if="noTitleKey == 'myProject'"
  72. :disabled="record.needExamine == 0 || record.needExamine == null"
  73. >待办事项</a
  74. >
  75. </a-badge>
  76. </span>
  77. </a-table>
  78. </div>
  79. <!-- table区域-end -->
  80. <!-- 查看项目成员 -->
  81. <a-modal
  82. :maskClosable="false"
  83. :title="title"
  84. v-model="visible"
  85. @ok="handleOk"
  86. width="800px"
  87. class="close-account-my-project"
  88. >
  89. <div style="display: flex; line-height: 50px; flex-wrap: wrap">
  90. <div style="width: 25%; text-align: center" v-for="(item, index) of memberList" :key="index">
  91. <a-tag color="#2db7f5" @close="log(item.id)" closable>
  92. {{ item.userName }}
  93. <a-divider type="vertical" />
  94. {{ item.roleCode | roleCode }}
  95. </a-tag>
  96. </div>
  97. </div>
  98. </a-modal>
  99. <!-- 添加项目成员 -->
  100. <a-modal
  101. :maskClosable="false"
  102. title="添加项目成员"
  103. v-model="visibleAdd"
  104. @ok="handleOkAdd"
  105. :confirmLoading="confirmLoading"
  106. >
  107. <!-- /sys/user/getAllUserList -->
  108. <a-select
  109. v-model="appId"
  110. showSearch
  111. allowClear
  112. mode="multiple"
  113. placeholder="请选择成员"
  114. optionFilterProp="children"
  115. style="width: 100%"
  116. @focus="handleFocus"
  117. @blur="handleBlur"
  118. @change="handleChange"
  119. :filterOption="true"
  120. @search="search"
  121. :maxTagCount="1"
  122. >
  123. <a-select-option
  124. v-for="appModel in options"
  125. :key="appModel.userId + new Date().getTime()"
  126. :value="appModel.userId"
  127. >
  128. {{ appModel.realName }}
  129. &#12288;&#12288;{{ appModel.roleName }}
  130. </a-select-option>
  131. </a-select>
  132. </a-modal>
  133. <!-- 账号绑定 -->
  134. <a-modal
  135. :maskClosable="false"
  136. title="账号绑定"
  137. v-model="visibleBind"
  138. @ok="handleSubmit"
  139. @cancel="handleCancel"
  140. :width="800"
  141. :okButtonProps="{ props: { disabled: false } }"
  142. :cancelButtonProps="{ props: { disabled: false } }"
  143. >
  144. <a-form :form="formEdit">
  145. <a-form-item
  146. label="选择方式"
  147. :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
  148. :wrapperCol="{ xs: { span: 24 }, sm: { span: 16 } }"
  149. >
  150. <a-radio-group buttonStyle="solid" v-model="mode" @change="onChageLogin">
  151. <a-radio-button value="authorization">授权</a-radio-button>
  152. <a-radio-button value="login">登录</a-radio-button>
  153. </a-radio-group>
  154. </a-form-item>
  155. <div v-if="mode == 'authorization'">
  156. <a-form-item
  157. label="媒体:"
  158. :label-col="{ xs: { span: 24 }, sm: { span: 5 } }"
  159. :wrapper-col="{ xs: { span: 24 }, sm: { span: 16 } }"
  160. >
  161. <a-radio-group buttonStyle="outline" v-model="loginType">
  162. <a-radio-button value="kuaishou">快手</a-radio-button>
  163. <a-radio-button value="bytedance">头条</a-radio-button>
  164. </a-radio-group>
  165. <br />
  166. <span style="color: red" v-if="loginType == 'bytedance'"
  167. >*重要:如存在一户多开情况,请勾选所有子账号进行授权!!!</span
  168. >
  169. </a-form-item>
  170. <a-form-item
  171. label="授权时间:"
  172. :label-col="{ xs: { span: 24 }, sm: { span: 5 } }"
  173. :wrapper-col="{ xs: { span: 24 }, sm: { span: 16 } }"
  174. >
  175. <a-date-picker
  176. v-model="dateValue"
  177. style="width: 180px;"
  178. :allowClear="false"
  179. format="YYYY-MM-DD"
  180. :disabled-date="disabledDate"
  181. @change="handleCostTimeChange"
  182. />
  183. </a-form-item>
  184. <a-form-item
  185. label="开户代理商:"
  186. :label-col="{ xs: { span: 24 }, sm: { span: 5 } }"
  187. :wrapper-col="{ xs: { span: 24 }, sm: { span: 16 } }"
  188. v-if="loginType == 'kuaishou'"
  189. >
  190. <a-radio-group buttonStyle="outline" v-model="id">
  191. <!-- <a-radio-button value="0">否</a-radio-button>
  192. <a-radio-button value="1">是</a-radio-button> -->
  193. <a-radio-button v-for="item in authConfigList" :key="item.id" :value="item.id">{{
  194. item.agentName
  195. }}</a-radio-button>
  196. </a-radio-group>
  197. </a-form-item>
  198. <a-form-item
  199. label="系统类型:"
  200. :label-col="{ xs: { span: 24 }, sm: { span: 5 } }"
  201. :wrapper-col="{ xs: { span: 24 }, sm: { span: 16 } }"
  202. >
  203. <a-radio-group buttonStyle="outline" v-model="systemType">
  204. <a-radio-button value="不限">不限</a-radio-button>
  205. <a-radio-button value="ios">ios</a-radio-button>
  206. <a-radio-button value="android">android</a-radio-button>
  207. <a-radio-button value="4">其他</a-radio-button>
  208. </a-radio-group>
  209. <a-input v-model="systemTypeName" v-if="systemType == '4'" placeholder="请输入系统类型" />
  210. </a-form-item>
  211. <a-form-item
  212. label="预警金额"
  213. :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
  214. :wrapperCol="{ xs: { span: 24 }, sm: { span: 16 } }"
  215. >
  216. <!-- <a-input v-decorator="['warningAmount', { rules: [{ required: true, message: '请输入预警金额' }] }]" /> -->
  217. <a-input-number
  218. style="width: 50%"
  219. v-decorator="[
  220. 'warningAmount',
  221. { rules: [{ required: true, message: '请输入预警金额' }], initialValue: 5000 },
  222. ]"
  223. />
  224. </a-form-item>
  225. <a-form-item
  226. label="预警比例"
  227. :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
  228. :wrapperCol="{ xs: { span: 24 }, sm: { span: 16 } }"
  229. >
  230. <a-input-number
  231. :step="0.1"
  232. style="width: 50%"
  233. v-decorator="[
  234. 'warningProportion',
  235. { rules: [{ required: true, message: '请输入预警比例' }], initialValue: 1.5 },
  236. ]"
  237. />
  238. </a-form-item>
  239. </div>
  240. <div v-else>
  241. <a-form-item
  242. label="媒体:"
  243. :label-col="{ xs: { span: 24 }, sm: { span: 5 } }"
  244. :wrapper-col="{ xs: { span: 24 }, sm: { span: 16 } }"
  245. >
  246. <a-radio-group buttonStyle="outline" v-model="loginType">
  247. <a-radio-button value="pangolin">穿山甲</a-radio-button>
  248. </a-radio-group>
  249. </a-form-item>
  250. <a-form-item
  251. label="账号:"
  252. :label-col="{ xs: { span: 24 }, sm: { span: 5 } }"
  253. :wrapper-col="{ xs: { span: 24 }, sm: { span: 16 } }"
  254. v-show="mode == 'login'"
  255. >
  256. <a-input v-model="accountName" placeholder="请输入账户名" />
  257. </a-form-item>
  258. <a-form-item
  259. label="密码:"
  260. :label-col="{ xs: { span: 24 }, sm: { span: 5 } }"
  261. :wrapper-col="{ xs: { span: 24 }, sm: { span: 16 } }"
  262. v-show="mode == 'login'"
  263. >
  264. <a-input type="password" v-model="password" placeholder="请输入密码" />
  265. </a-form-item>
  266. </div>
  267. <a-form-item
  268. label="自动投放"
  269. :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
  270. :wrapperCol="{ xs: { span: 24 }, sm: { span: 16 } }"
  271. >
  272. <a-radio-group
  273. buttonStyle="outline"
  274. v-decorator="[
  275. 'autoDelivery',
  276. { rules: [{ required: true, message: '请选择是否自动投放' }], initialValue: 1 },
  277. ]"
  278. >
  279. <a-radio-button :value="1">允许</a-radio-button>
  280. <a-radio-button :value="3">禁止</a-radio-button>
  281. </a-radio-group>
  282. </a-form-item>
  283. <a-form-item
  284. label="物料同步"
  285. :labelCol="{ xs: { span: 24 }, sm: { span: 5 } }"
  286. :wrapperCol="{ xs: { span: 24 }, sm: { span: 16 } }"
  287. >
  288. <checkBoxGroup
  289. :options="[
  290. { label: '不同步', value: 0 },
  291. { label: '应用包', value: 1 },
  292. { label: '人群包', value: 2, disabled:true},
  293. { label: '定向包', value: 3, disabled:true },
  294. ]"
  295. v-decorator="['materialType', { rules: [{ required: true, message: '请选择同步物料' }], initialValue: [0] }]"
  296. @change="changeData"
  297. />
  298. </a-form-item>
  299. </a-form>
  300. </a-modal>
  301. <!-- 查看项目下的账号 -->
  302. <a-modal
  303. :maskClosable="false"
  304. :title="titleAccount"
  305. v-model="visibleAccount"
  306. @ok="handleOk"
  307. width="800px"
  308. class="close-account-my-project"
  309. >
  310. <a-table
  311. ref="table"
  312. size="middle"
  313. bordered
  314. rowKey="id"
  315. :columns="columnsAccount"
  316. :dataSource="dataAccount"
  317. :pagination="ipaginationAccount"
  318. :loading="loadingAccount"
  319. >
  320. <span slot="createTime" slot-scope="createTime">{{ createTime | getDate }}</span>
  321. </a-table>
  322. </a-modal>
  323. <!-- 待办事件审核 -->
  324. <a-modal
  325. :maskClosable="false"
  326. title="待办事件审核"
  327. v-model="projectVisible"
  328. @ok="handleOkProject"
  329. width="800px"
  330. class="close-account-my-project"
  331. :footer="null"
  332. >
  333. <a-table
  334. ref="table"
  335. size="middle"
  336. bordered
  337. rowKey="id"
  338. :columns="columnsProject"
  339. :dataSource="dataProject"
  340. :pagination="ipaginationAccount"
  341. :loading="loadingAccount"
  342. >
  343. <span slot="action" slot-scope="text, record">
  344. <a @click="projectEdit(record, 1)">通过</a>
  345. <a-divider type="vertical" />
  346. <a @click="projectEdit(record, 2)">拒绝</a>
  347. </span>
  348. </a-table>
  349. </a-modal>
  350. </a-card>
  351. </template>
  352. <script>
  353. import moment from 'moment';
  354. import { httpAction, getAction, deleteAction, putAction } from '@/api/manage'
  355. import { mapGetters } from 'vuex'
  356. import JSelectUserByDep from '@/components/jeecgbiz/JSelectUserByDep'
  357. import { JeecgListMixin } from '@/mixins/ipagination'
  358. import checkBoxGroup from '@/components/formComponents/checkBoxGroup'
  359. const myProjectColumns = [
  360. {
  361. title: '项目名称',
  362. align: 'center',
  363. dataIndex: 'projectName',
  364. },
  365. {
  366. title: '广告主名称',
  367. align: 'center',
  368. dataIndex: 'advertiserId_dictText',
  369. },
  370. {
  371. title: '产品名称',
  372. align: 'center',
  373. dataIndex: 'productId_dictText',
  374. },
  375. {
  376. title: '运营负责人',
  377. align: 'center',
  378. dataIndex: 'responsibleId_dictText',
  379. },
  380. {
  381. title: '设计负责人',
  382. align: 'center',
  383. dataIndex: 'designResponsibleId_dictText',
  384. },
  385. {
  386. title: '媒体类型',
  387. align: 'center',
  388. dataIndex: 'mediaId',
  389. scopedSlots: {
  390. customRender: 'mediaId',
  391. },
  392. },
  393. {
  394. title: '优化目标',
  395. align: 'center',
  396. dataIndex: 'bidType',
  397. scopedSlots: {
  398. customRender: 'bidType',
  399. },
  400. },
  401. {
  402. title: '最高出价(元)',
  403. align: 'center',
  404. dataIndex: 'maxBid',
  405. scopedSlots: {
  406. customRender: 'maxBid',
  407. },
  408. },
  409. {
  410. title: '操作',
  411. dataIndex: 'action',
  412. align: 'center',
  413. scopedSlots: {
  414. customRender: 'action',
  415. },
  416. },
  417. ]
  418. const participationColumns = [
  419. {
  420. title: '项目名称',
  421. align: 'center',
  422. dataIndex: 'projectName',
  423. },
  424. {
  425. title: '广告主名称',
  426. align: 'center',
  427. dataIndex: 'advertiserName',
  428. },
  429. {
  430. title: '产品名称',
  431. align: 'center',
  432. dataIndex: 'productName',
  433. },
  434. {
  435. title: '运营负责人',
  436. align: 'center',
  437. dataIndex: 'responsibleName',
  438. },
  439. {
  440. title: '设计负责人',
  441. align: 'center',
  442. dataIndex: 'designResponsibleName',
  443. },
  444. {
  445. title: '媒体类型',
  446. align: 'center',
  447. dataIndex: 'mediaId',
  448. scopedSlots: {
  449. customRender: 'mediaId',
  450. },
  451. },
  452. {
  453. title: '优化目标',
  454. align: 'center',
  455. dataIndex: 'bidType',
  456. scopedSlots: {
  457. customRender: 'bidType',
  458. },
  459. },
  460. {
  461. title: '最高出价(元)',
  462. align: 'center',
  463. dataIndex: 'maxBid',
  464. scopedSlots: {
  465. customRender: 'maxBid',
  466. },
  467. },
  468. {
  469. title: '操作',
  470. dataIndex: 'action',
  471. align: 'center',
  472. scopedSlots: {
  473. customRender: 'action',
  474. },
  475. },
  476. ]
  477. export default {
  478. name: 'ProjectMemberList',
  479. components: {
  480. JSelectUserByDep,
  481. checkBoxGroup
  482. },
  483. mixins: [JeecgListMixin],
  484. data() {
  485. return {
  486. moment,
  487. dateValue: '',
  488. authConfigList:[],
  489. title: '',
  490. titleAccount: '',
  491. description: '我的项目',
  492. // 表头
  493. visible: false,
  494. keyWord: '',
  495. mode: 'authorization',
  496. mediaId: '2',
  497. accountName: '',
  498. password: '',
  499. loginType: 'kuaishou',
  500. id: undefined,
  501. formEdit: this.$form.createForm(this),
  502. record: '',
  503. systemType: '不限',
  504. systemTypeName: '',
  505. queryParam: {
  506. projectId: '',
  507. userId: '',
  508. },
  509. projectId: '',
  510. user: '',
  511. tabListNoTitle: [
  512. {
  513. key: 'myProject',
  514. tab: '我管理的',
  515. },
  516. {
  517. key: 'participation',
  518. tab: '我参与的',
  519. },
  520. ],
  521. noTitleKey: 'participation',
  522. columns: participationColumns,
  523. columnsAccount: [
  524. {
  525. title: '账户id',
  526. align: 'center',
  527. dataIndex: 'accountId',
  528. },
  529. {
  530. title: '账户名称',
  531. align: 'center',
  532. dataIndex: 'authName',
  533. },
  534. {
  535. title: '所属人',
  536. align: 'center',
  537. dataIndex: 'userName',
  538. },
  539. {
  540. title: '授权时间',
  541. align: 'center',
  542. dataIndex: 'createTime',
  543. scopedSlots: {
  544. customRender: 'createTime',
  545. },
  546. },
  547. ],
  548. ipaginationAccount: {
  549. current: 1,
  550. pageSize: 10,
  551. // pageSizeOptions: ['10', '20', '30'],
  552. showTotal: (total, range) => {
  553. return range[0] + '-' + range[1] + ' 共' + total + '条'
  554. },
  555. showQuickJumper: true,
  556. // showSizeChanger: true,
  557. total: 0,
  558. onChange: (current) => {
  559. // 切换分页时的回调,
  560. // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
  561. this.ipaginationAccount.current = current
  562. },
  563. },
  564. loadingAccount: false,
  565. projectVisible: false,
  566. columnsProject: [
  567. {
  568. title: '转让账户',
  569. align: 'center',
  570. dataIndex: 'accountId',
  571. },
  572. {
  573. title: '受让人姓名',
  574. align: 'center',
  575. dataIndex: 'assigneeName',
  576. },
  577. {
  578. title: '转户人姓名',
  579. align: 'center',
  580. dataIndex: 'transferorName',
  581. },
  582. {
  583. title: '受让人绩效开始时间',
  584. align: 'center',
  585. dataIndex: 'assigneeDate',
  586. },
  587. {
  588. title: '转户人绩效结束时间',
  589. align: 'center',
  590. dataIndex: 'transferorDate',
  591. },
  592. {
  593. title: '操作',
  594. dataIndex: 'action',
  595. align: 'center',
  596. scopedSlots: {
  597. customRender: 'action',
  598. },
  599. },
  600. ],
  601. dataProject: [],
  602. dataAccount: [],
  603. dataSource: [],
  604. dataElse: [],
  605. loading: false,
  606. memberList: [],
  607. visibleAdd: false,
  608. member: [],
  609. itemJson: null,
  610. visibleBind: false,
  611. bindAccountLoginUrl: '/ctop/bindAccountLogin/login',
  612. bindAuthorizationUrl: '/ctop/bindAccountAuth/authorization',
  613. appId: [],
  614. list: [],
  615. options: [],
  616. visibleAccount: false,
  617. confirmLoading: false,
  618. }
  619. },
  620. computed: {
  621. importExcelUrl: function () {
  622. return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`
  623. },
  624. },
  625. filters: {
  626. roleCode(value) {
  627. var state = {
  628. clip: '剪辑',
  629. shot: '拍摄',
  630. plan: '策划',
  631. plane: '平面',
  632. admin: '管理员',
  633. operator: '运营专员',
  634. kuaishouOperationManager: '快手运营经理',
  635. designTeamLeader: '设计组长',
  636. planeLeader: '平面组长',
  637. touTiaoOperationManager: '头条运营经理',
  638. operationAssistant: '运营助理',
  639. }
  640. if (value) {
  641. return state[value]
  642. } else {
  643. return '暂无'
  644. }
  645. },
  646. bidTypeData(sta) {
  647. var data = {
  648. null: '-',
  649. 1: 'CPM',
  650. 2: '点击数',
  651. 6: 'OCPC',
  652. 10: 'OCPM',
  653. 12: "最大转化数"
  654. }
  655. return data[sta]
  656. },
  657. getDate(value) {
  658. let date = new Date(value)
  659. let y = date.getFullYear()
  660. let MM = date.getMonth() + 1
  661. MM = MM < 10 ? '0' + MM : MM
  662. let d = date.getDate()
  663. d = d < 10 ? '0' + d : d
  664. return y + '-' + MM + '-' + d
  665. },
  666. },
  667. watch: {
  668. 'ipagination.current': function (n, o) {
  669. console.log(n, o)
  670. if (this.noTitleKey == 'participation') {
  671. this.getParticipateList()
  672. } else {
  673. this.getResponsibleList()
  674. }
  675. },
  676. },
  677. methods: {
  678. changeData(data) {
  679. if (data.length > 1 && data.findIndex((item) => item == 1) == 0) {
  680. data.splice(
  681. data.findIndex((item) => item == 1),
  682. 1
  683. )
  684. } else if (data.length > 1 && data.findIndex((item) => item == 1) == data.length - 1) {
  685. data.splice(0, data.length - 1)
  686. } else if (data.length == 0) {
  687. data.push(1)
  688. }
  689. },
  690. getFormFieldValue(field) {
  691. return this.formEdit.getFieldValue(field)
  692. },
  693. // /ctop/userAllocation/getAccountsByProjectId projectId userId
  694. handleCostTimeChange(date, dateString) {
  695. console.log(dateString, 'dateString');
  696. this.dateValue = dateString;
  697. },
  698. disabledDate(current) {
  699. if (this.loginType == 'kuaishou') {
  700. return current && !(current > moment().subtract(7, 'days'));
  701. }
  702. else if (this.loginType == 'bytedance') {
  703. return false;
  704. }
  705. // TODO 时间限制格式
  706. // return current && !(current > moment().subtract(7, 'days'));
  707. // return current && !(current > (moment().subtract(7, 'days')) && current < moment());
  708. // return false;
  709. },
  710. projectLook(item) {
  711. var params = {}
  712. params.projectId = item.id
  713. params.status = 0
  714. getAction('/ctop/transferAccount/list', params).then((res) => {
  715. if (res.success) {
  716. this.projectVisible = true
  717. this.dataProject = res.result.map((item, index) => {
  718. return {
  719. ...item,
  720. key: index,
  721. }
  722. })
  723. this.ipaginationAccount.total = res.result.length
  724. }
  725. })
  726. },
  727. projectEdit(item, status) {
  728. var params = {}
  729. params.id = item.id
  730. params.status = status
  731. params.auditor = this.userInfo().id
  732. putAction('/ctop/transferAccount/edit', params).then((res) => {
  733. if (res.success) {
  734. this.projectVisible = false
  735. this.getResponsibleList()
  736. }
  737. })
  738. },
  739. handleOkProject() {},
  740. ...mapGetters(['nickname', 'avatar', 'userInfo']),
  741. add(value, key) {
  742. var dataValue = value.split(',')
  743. var dataKey = key.split(',')
  744. var jsonArr = []
  745. for (let i = 0; i < dataValue.length; i++) {
  746. jsonArr.push({
  747. userId: dataKey[i],
  748. userName: dataValue[i],
  749. })
  750. }
  751. this.member = jsonArr
  752. },
  753. log(id) {
  754. deleteAction('/ctop/projectMember/delete', {
  755. id: id,
  756. }).then((res) => {
  757. if (res.success) {
  758. this.getMemberList(this.projectId)
  759. this.$message.success('删除成功')
  760. } else {
  761. this.$message.error(res.message)
  762. }
  763. })
  764. },
  765. onTabChange(key, type) {
  766. this[type] = key
  767. this.keyWord = ''
  768. this.ipagination.current = 1
  769. if (key == 'myProject') {
  770. this.columns = myProjectColumns
  771. this.getResponsibleList()
  772. } else {
  773. this.columns = participationColumns
  774. this.getParticipateList()
  775. }
  776. },
  777. getResponsibleList() {
  778. //我管理的
  779. this.dataSource = []
  780. this.dataElse = []
  781. this.loading = true
  782. getAction('/ctop/project/responsibleListV2', {
  783. userId: this.userInfo().id,
  784. pageSize: this.ipagination.pageSize,
  785. pageNo: this.ipagination.current,
  786. projectName: this.keyWord,
  787. }).then((res) => {
  788. if (res.code == 0) {
  789. this.loading = false
  790. this.dataSource = res.result.records
  791. this.dataElse = res.result.records
  792. this.ipagination.total = res.result.total
  793. }
  794. })
  795. },
  796. getParticipateList() {
  797. //我参与的
  798. this.dataSource = []
  799. this.dataElse = []
  800. this.loading = true
  801. getAction('/ctop/projectMember/participateListV2', {
  802. userId: this.userInfo().id,
  803. pageSize: this.ipagination.pageSize,
  804. pageNo: this.ipagination.current,
  805. projectName: this.keyWord,
  806. }).then((res) => {
  807. if (res.code == 0) {
  808. this.dataSource = res.result.records
  809. this.dataElse = res.result.records
  810. this.ipagination.total = res.result.total
  811. this.loading = false
  812. }
  813. })
  814. },
  815. getMemberList(projectId) {
  816. //成员查看
  817. this.memberList = []
  818. getAction('/ctop/projectMember/getMemberList', {
  819. projectId: projectId,
  820. }).then((res) => {
  821. if (res.code == 0) {
  822. this.visible = true
  823. this.memberList = res.result
  824. }
  825. })
  826. },
  827. handleOk(e) {
  828. this.visible = false
  829. },
  830. handleOkAdd(e) {
  831. var params = {}
  832. params.projectId = this.itemJson.id
  833. params.projectName = this.itemJson.projectName
  834. params.memberArr = this.appId
  835. this.confirmLoading = true
  836. httpAction('/ctop/projectMember/batchAdd', params, 'post').then((res) => {
  837. this.confirmLoading = false
  838. if (res.success) {
  839. this.visibleAdd = false
  840. this.appId = []
  841. this.$message.success('添加成功')
  842. } else {
  843. this.$message.error('添加失败')
  844. }
  845. })
  846. },
  847. getAllUserList(value) {
  848. getAction('/sys/user/getAllUserList', { pageSize: 50, pageNo: 1, userName: value }).then((res) => {
  849. if (res.success) {
  850. this.list = res.result.list
  851. this.options = res.result.list
  852. }
  853. })
  854. },
  855. addParams(item) {
  856. if (this.noTitleKey == 'myProject') {
  857. this.visibleAdd = true
  858. this.itemJson = item
  859. this.getAllUserList()
  860. } else {
  861. this.visibleAccount = true
  862. this.titleAccount = item.projectName
  863. this.loadingAccount = true
  864. getAction('/ctop/userAllocation/getAccountsByProjectId', {
  865. projectId: item.projectId,
  866. userId: this.userInfo().id,
  867. }).then((res) => {
  868. if (res.success) {
  869. this.dataAccount = res.result
  870. this.loadingAccount = false
  871. this.ipaginationAccount.total = res.result.length
  872. }
  873. })
  874. }
  875. },
  876. handleAdd() {},
  877. handleEdit(item) {
  878. if (this.noTitleKey == 'myProject') {
  879. this.title = item.projectName
  880. this.projectId = item.id
  881. this.getMemberList(item.id)
  882. } else {
  883. this.mode = 'authorization'
  884. this.loginType = item.mediaId == '1' || item.mediaId == '3' ? 'bytedance' : 'kuaishou'
  885. this.record = item
  886. this.visibleBind = true
  887. }
  888. },
  889. handleDelete(id) {},
  890. onChageLogin(e) {
  891. if (this.mode == 'login') {
  892. this.loginType = 'pangolin'
  893. } else {
  894. this.loginType = 'kuaishou'
  895. this.systemType = '不限'
  896. }
  897. },
  898. handleCancel() {
  899. this.visibleBind = false
  900. this.formEdit.resetFields();
  901. },
  902. handleSubmit() {
  903. let params = {}
  904. params.advertiserId = this.record.advertiserId
  905. params.advertiser_name = this.record.advertiserName
  906. params.userId = this.userInfo().id
  907. params.userName = this.userInfo().realname
  908. params.projectId = this.record.projectId
  909. params.projectName = this.record.projectName
  910. params.systemType = this.systemType == '4' ? this.systemTypeName : this.systemType
  911. params.authBeginTime = this.dateValue;
  912. // 触发表单验证
  913. this.formEdit.validateFields((err, values) => {
  914. if (!err) {
  915. params.materialType = values.materialType
  916. params.autoDelivery = values.autoDelivery
  917. if (this.mode == 'login') {
  918. params.accountName = this.accountName
  919. params.password = this.password
  920. params.loginType = this.loginType
  921. httpAction(this.bindAccountLoginUrl, params, 'post').then((res) => {
  922. if (res.success) {
  923. this.$message.success('绑定成功')
  924. this.accountName = ''
  925. this.password = ''
  926. this.loginType = 'kuaishou'
  927. this.visibleBind = false
  928. } else {
  929. this.$message.error(res.message)
  930. }
  931. })
  932. }
  933. // 授权登录
  934. if (this.mode == 'authorization') {
  935. params.authorizationType = this.loginType
  936. if (this.loginType == 'kuaishou') {
  937. params.mediaId = this.mediaId
  938. params.id = this.id
  939. } else if (this.loginType == 'bytedance') {
  940. params.mediaId = 1
  941. }
  942. params.warningAmount = values.warningAmount
  943. params.warningProportion = values.warningProportion
  944. httpAction(this.bindAuthorizationUrl, params, 'post').then((res) => {
  945. if (res.success) {
  946. window.open(res.message, '_blank')
  947. this.visibleBind = false
  948. this.formEdit.resetFields();
  949. } else {
  950. alert('绑定失败')
  951. }
  952. })
  953. }
  954. }
  955. })
  956. },
  957. searchReset() {
  958. this.keyWord = ''
  959. this.ipagination.current = 1
  960. // this.dataSource = this.dataElse
  961. if (this.noTitleKey == 'participation') {
  962. this.getParticipateList()
  963. } else {
  964. this.getResponsibleList()
  965. }
  966. },
  967. searchQuery() {
  968. this.ipagination.current = 1
  969. if (this.noTitleKey == 'participation') {
  970. this.getParticipateList()
  971. } else {
  972. this.getResponsibleList()
  973. }
  974. // this.dataSource = this.dataElse.filter(item => {
  975. // return item.projectName.toLowerCase().indexOf(this.keyWord.toLowerCase()) > -1
  976. // })
  977. },
  978. handleChange(value, options) {
  979. // this.appId = value
  980. },
  981. getElseData(value) {
  982. this.getStatistics()
  983. },
  984. handleBlur() {},
  985. handleFocus() {},
  986. search(value) {
  987. this.options = []
  988. if (value != '') {
  989. // this.options = this.list.filter(item => {
  990. // var data = item.realName + ' ' + item.roleName
  991. // return data.toLowerCase().indexOf(value.toLowerCase()) > -1
  992. // })
  993. // this.options = [...this.options]
  994. this.getAllUserList(value)
  995. } else {
  996. this.getAllUserList()
  997. }
  998. },
  999. getauthConfigList() {
  1000. getAction('/auth/oauthConfig/list', {
  1001. status: 0,
  1002. mediaId: 2,
  1003. }).then((res) => {
  1004. console.log(res)
  1005. this.authConfigList = res.result
  1006. if (res.result.length > 0) {
  1007. this.id = res.result[0].id
  1008. }
  1009. })
  1010. },
  1011. },
  1012. mounted() {
  1013. this.$nextTick(() => {
  1014. this.getParticipateList()
  1015. this.getauthConfigList()
  1016. })
  1017. },
  1018. }
  1019. </script>
  1020. <style scoped>
  1021. @import '~@assets/less/common.less';
  1022. </style>