materialList.vue 41 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152
  1. <style lang="scss" scoped>
  2. .orderDetail{
  3. ul,li{
  4. margin: 0;
  5. padding: 0;
  6. }
  7. width: 100%;
  8. .topBody{
  9. width: 100%;
  10. background: #FFFFFF;
  11. margin-bottom: 12px;
  12. padding: 20px;
  13. box-sizing: border-box;
  14. .breadcrumb{
  15. height: 22px;
  16. font-size: 12px;
  17. font-family: PingFangSC-Regular, PingFang SC;
  18. font-weight: 400;
  19. color: #000000;
  20. line-height: 22px;
  21. }
  22. .bottom{
  23. display: flex;
  24. position: relative;
  25. justify-content: space-between;
  26. // padding: 20px;
  27. .orderIcon{
  28. width: 28px;
  29. height: 28px;
  30. margin-right: 15px;
  31. img{
  32. width: 100%;
  33. }
  34. }
  35. .tip{
  36. .greet{
  37. width: 300px;
  38. height: 28px;
  39. font-size: 20px;
  40. font-family: PingFangSC-Medium, PingFang SC;
  41. font-weight: 500;
  42. color: rgba(0, 0, 0, 0.85);
  43. line-height: 28px;
  44. margin-bottom: 5px;
  45. }
  46. .descPosition{
  47. font-size: 14px;
  48. font-family: PingFangSC-Regular, PingFang SC;
  49. font-weight: 400;
  50. color: rgba(0, 0, 0, 0.45);
  51. overflow: hidden;
  52. margin-bottom: 0;
  53. li{
  54. height: 22px;
  55. line-height: 22px;
  56. margin-top:3px ;
  57. }
  58. span{
  59. width: 250px;
  60. display: inline-block;
  61. }
  62. }
  63. }
  64. .optBody{
  65. width: 200px;
  66. flex-shrink:0;
  67. // justify-content: flex-end;
  68. text-align: right;
  69. .btnBody{
  70. margin-bottom: 10px;
  71. }
  72. .orderInfo{
  73. display: flex;
  74. justify-content: space-between;
  75. text-align: right;
  76. p{
  77. margin-bottom: 0;
  78. }
  79. .markName{
  80. height: 22px;
  81. font-size: 14px;
  82. font-family: PingFangSC-Regular, PingFang SC;
  83. font-weight: 400;
  84. color: rgba(0, 0, 0, 0.45);
  85. line-height: 22px;
  86. }
  87. .big{
  88. height: 28px;
  89. font-size: 20px;
  90. font-family: PingFangSC-Regular, PingFang SC;
  91. font-weight: 400;
  92. color: rgba(0, 0, 0, 0.85);
  93. line-height: 28px;
  94. }
  95. }
  96. }
  97. }
  98. }
  99. .section{
  100. background: white;
  101. padding:20px ;
  102. .breadcrumb{
  103. height: 22px;
  104. font-size: 12px;
  105. font-family: PingFangSC-Regular, PingFang SC;
  106. font-weight: 400;
  107. color: #000000;
  108. line-height: 22px;
  109. }
  110. .sectionBody{
  111. p{
  112. margin-bottom: 0;
  113. }
  114. .section-item{
  115. background: white;
  116. margin-bottom: 20px;
  117. }
  118. .tabBox{
  119. padding: 15px 20px 0;
  120. display: flex;
  121. flex-wrap: wrap;
  122. position: relative;
  123. .search-item{
  124. margin-bottom: 12px;
  125. width: 30%;
  126. }
  127. .opt-item{
  128. position: absolute;
  129. right: 20px;
  130. top: 16px;
  131. }
  132. }
  133. .sectionHead{
  134. padding: 15px 20px;
  135. // height: 24px;
  136. font-size: 16px;
  137. font-family: PingFangSC-Medium, PingFang SC;
  138. font-weight: 500;
  139. color: rgba(0, 0, 0, 0.85);
  140. line-height: 24px;
  141. border-bottom: 1px solid #E9E9E9;;
  142. .allOrder{
  143. float: right;
  144. }
  145. }
  146. .section-box{
  147. margin-top: 30px;
  148. padding: 20px 20px;
  149. border: 1px solid #E9E9E9;
  150. .description{
  151. margin-top: 10px;
  152. .time{
  153. height: 32px;
  154. line-height: 32px;
  155. }
  156. }
  157. ul{
  158. display: flex;
  159. flex-wrap: wrap;
  160. // justify-content: space-around;
  161. }
  162. li{
  163. width: 30%;
  164. height: 22px;
  165. font-size: 14px;
  166. font-family: PingFangSC-Regular, PingFang SC;
  167. font-weight: 400;
  168. color: rgba(0, 0, 0, 0.85);
  169. line-height: 22px;
  170. text-align: left;
  171. margin-bottom: 15px;
  172. }
  173. .top{
  174. margin-bottom: 25px;
  175. }
  176. .bottom{
  177. h4{
  178. font-size: 15px;
  179. font-family: PingFangSC-Medium, PingFang SC;
  180. font-weight: 600;
  181. color: rgba(0, 0, 0, 0.85);
  182. margin-bottom: 25px;
  183. }
  184. }
  185. .shenhe{
  186. width: 6px;
  187. height: 6px;
  188. display: inline-block;
  189. background: #52C41A;
  190. border-radius: 50%;
  191. position: relative;
  192. top: -2px;
  193. }
  194. .wancheng{
  195. width: 6px;
  196. height: 6px;
  197. display: inline-block;
  198. background: #1890FF;
  199. border-radius: 50%;
  200. // margin-right: 3px;
  201. position: relative;
  202. top: -2px;
  203. }
  204. .bohui{
  205. width: 6px;
  206. height: 6px;
  207. display: inline-block;
  208. background: #F5222D;
  209. border-radius: 50%;
  210. position: relative;
  211. top: -2px;
  212. }
  213. }
  214. }
  215. }
  216. }
  217. .videoBox{
  218. height: 240px;
  219. }
  220. .imgBox{
  221. width: 90%;
  222. }
  223. .videomarterialInfo{
  224. position: relative;
  225. // height: 800px;
  226. }
  227. .marterialInfo{
  228. overflow: auto;
  229. // height: 800px;
  230. position: relative;
  231. p{margin-bottom: 0;}
  232. ul,li{
  233. margin: 0;
  234. padding: 0;
  235. }
  236. .info-item{
  237. margin-bottom: 20px;
  238. display: flex;
  239. // justify-content: center;
  240. align-items: flex-start;
  241. span{
  242. display: inline-block;
  243. width: 70px;
  244. text-align: left;
  245. flex-shrink: 0;
  246. text-align: right;
  247. }
  248. .ant-tag{
  249. width: auto;
  250. min-width: 50px;
  251. text-align: center;
  252. }
  253. }
  254. .info{
  255. width: 100%;
  256. ul{
  257. width: 100%;
  258. display: flex;
  259. justify-content: space-between;
  260. flex-wrap: wrap;
  261. width: 100%;
  262. }
  263. li{
  264. width: 33.3%;
  265. margin-bottom: 20px;
  266. }
  267. margin-bottom: 0;
  268. }
  269. .bottom-btn{
  270. width: 100%;
  271. text-align: center;
  272. position: absolute;
  273. bottom: 0px;
  274. left: 0;
  275. // margin-top: 20px;
  276. }
  277. .scriptbottom-btn{
  278. width: 100%;
  279. // height: 60px;
  280. line-height: 60px;
  281. text-align: center;
  282. position: absolute;
  283. bottom: 0px;
  284. left: 0;
  285. }
  286. }
  287. </style>
  288. <style lang="less">
  289. .orderDetail{
  290. .ant-timeline-item-head{
  291. background: rgb(240,242,245);
  292. }
  293. .muen{
  294. cursor: pointer;
  295. }
  296. .muen:hover{
  297. color: #1890ff;
  298. }
  299. }
  300. </style>
  301. <template>
  302. <div class="orderDetail ">
  303. <div class="section">
  304. <p class="breadcrumb">
  305. <a-breadcrumb style="display:block;width:100%">
  306. <a-breadcrumb-item ><span class="muen" @click="goPlantForm()">工作台</span></a-breadcrumb-item>
  307. <a-breadcrumb-item>物料列表</a-breadcrumb-item>
  308. </a-breadcrumb>
  309. </p>
  310. <div class="sectionBody">
  311. <!-- <div class="tabBody">
  312. <a-tabs v-model="activeKey" @change='tabChange'>
  313. <a-tab-pane v-for="pane in panes" :key="pane.key" :tab="pane.title" >
  314. </a-tab-pane>
  315. </a-tabs>
  316. </div> -->
  317. <!-- 素材列表 -->
  318. <div class="section-item">
  319. <div class="tabBox">
  320. <!-- <div class="search-item">
  321. <span>名称:</span>
  322. <a-input placeholder="请输入订单名称" allow-clear v-model="materialName" style="width:300px" />
  323. </div>
  324. <div class="search-item">
  325. <span>编号:</span>
  326. <a-input placeholder="请输入订单编号" allow-clear v-model="materialId" style="width:300px" />
  327. </div>
  328. <div class="search-item">
  329. <span>所属订单:</span>
  330. <a-input placeholder="所属订单" allow-clear v-model="orderSponsor" style="width:300px" />
  331. </div>
  332. <div class="opt-item">
  333. <a-button type='primary' @click="search" style="margin-right:20px">查询</a-button>
  334. <a-button type='default' @click="reset">查询</a-button>
  335. </div> -->
  336. </div>
  337. <div class="section-box">
  338. <a-table
  339. size="middle"
  340. :columns="columns"
  341. :dataSource="data"
  342. id="outTable"
  343. :pagination="ipagination"
  344. :loading="loading"
  345. @change="sort"
  346. style="word-break: break-all;"
  347. >
  348. <div slot="materialStatus" slot-scope="text" >
  349. <span class="wancheng" v-if="text==7"> </span>
  350. <span class="bohui" v-else-if="text==6||text==3"> </span>
  351. <span class="shenhe" v-else> </span>
  352. {{text | handlerMaterialStatus}}
  353. </div>
  354. <div slot="scriptStatus" slot-scope="text,record">
  355. <span v-if="record.materialStatus==0">-</span>
  356. <span v-else>
  357. <a href="javascript:;" @click="scriptViewDetails(record)">{{record.planName}}</a>
  358. </span>
  359. </div>
  360. <div slot="videoStatus" slot-scope="text,record">
  361. <span v-if="record.materialStatus==0">-</span>
  362. <span v-else>
  363. <a href="javascript:;" @click="viewDetails(record)">{{record.clipName}}</a>
  364. </span>
  365. </div>
  366. <div slot="orderTitle" slot-scope="text,record">
  367. <a href="javascript:;" @click="goOrderDetail(record)">{{text}}</a>
  368. </div>
  369. </a-table>
  370. </div>
  371. <a-drawer
  372. title="视频详情"
  373. width="700"
  374. :placement="placement"
  375. :closable="false"
  376. :visible="visible"
  377. @close="onClose"
  378. >
  379. <a-spin :spinning="visibleLoading">
  380. <div class="marterialInfo videomarterialInfo">
  381. <div class="info-item">
  382. <span>视频状态:</span>
  383. <p>{{ currentVideo.videoStatus | handlerVideoStatus }}</p>
  384. </div>
  385. <div class="info-item">
  386. <span>视频预览:</span>
  387. <div class="videoBox" v-if="currentVideo.videoStatus==1||currentVideo.videoStatus==3">
  388. <video style="height:100%" :src="currentVideo.url" v-if="currentVideo.url" controls></video>
  389. <img :src="defaultPic" alt="" style="height:100%" v-else>
  390. </div>
  391. </div>
  392. <div class="info-item">
  393. <span>封面预览:</span>
  394. <div class="imgBox" v-if="currentVideo.imgList&&currentVideo.imgList.length">
  395. <img alt="" style="width:100px;margin:0 10px 8px 0" v-for="(item,index) in currentVideo.imgList" :key='index' :src="item">
  396. </div>
  397. <div v-else>
  398. <span>暂无封面</span>
  399. </div>
  400. </div>
  401. <div class="info-item" v-if="currentVideo.videoStatus==1">
  402. <span>视频标签:</span>
  403. <p>
  404. <a-tag v-for="(item,index) in currentVideo.tagList" :key="index" style="margin-bottom:8px">{{item}}</a-tag>
  405. <!-- {{currentVideo.tag}} -->
  406. </p>
  407. </div>
  408. <div class="info-item info">
  409. <ul>
  410. <li><span>编导:</span> {{ currentVideo.planName }} </li>
  411. <li><span>拍摄:</span> {{ currentVideo.shotName }} </li>
  412. <li><span>剪辑:</span> {{ currentVideo.clipName }} </li>
  413. </ul>
  414. </div>
  415. <div class="info-item" v-if="currentVideo.videoStatus==2">
  416. <span>驳回理由:</span>
  417. <p>{{ currentVideo.videoAdvise }}</p>
  418. </div>
  419. <!-- <div class="bottom-btn">
  420. <a-button type='primary' @click="approved" v-if="currentMaterial.materialStatus==5" :loading='acceptLoading' style="margin-right:20px">通过审核</a-button>
  421. <a-button type='default' @click="()=>{videoRejectVisiable=true}" v-if="currentMaterial.materialStatus==5" style="margin-right:20px">驳回</a-button>
  422. <a-button type='default' @click="onClose">关闭</a-button>
  423. </div> -->
  424. </div>
  425. </a-spin>
  426. <div
  427. :style="{
  428. position: 'absolute',
  429. right: 0,
  430. bottom: 0,
  431. width: '100%',
  432. borderTop: '1px solid #e9e9e9',
  433. padding: '10px 16px',
  434. background: '#fff',
  435. textAlign: 'right',
  436. zIndex: 1,
  437. }"
  438. >
  439. <a-button type='primary' @click="approved" v-if="currentMaterial.materialStatus==5" :loading='acceptLoading' style="margin-right:20px">通过审核</a-button>
  440. <a-button type='default' @click="()=>{videoRejectVisiable=true}" v-if="currentMaterial.materialStatus==5" style="margin-right:20px">驳回</a-button>
  441. <a-button type='default' @click="onClose">关闭</a-button>
  442. </div>
  443. </a-drawer>
  444. <a-drawer
  445. title="脚本详情"
  446. width="600"
  447. :placement="placement"
  448. :closable="false"
  449. :visible="scriptVisible"
  450. @close="scriptClose"
  451. >
  452. <a-spin :spinning="visibleLoading">
  453. <div class="marterialInfo">
  454. <div class="info-item">
  455. <span>脚本状态:</span>
  456. <p>{{ currentScript.scriptStatus | handlerVideoStatus }}</p>
  457. </div>
  458. <div class="info-item">
  459. <span>所属项目:</span>
  460. <p>{{currentScript.projectName}}</p>
  461. </div>
  462. <div class="info-item">
  463. <span>所属物料:</span>
  464. <p>{{currentScript.materialName}}</p>
  465. </div>
  466. <div class="info-item">
  467. <span>编导:</span>
  468. <p>{{currentScript.planName}}</p>
  469. </div>
  470. <div class="info-item" v-if="currentScript.scriptStatus==2">
  471. <span>驳回理由:</span>
  472. <p>{{currentScript.scriptAdvise}}</p>
  473. </div>
  474. <div class="info-item">
  475. <span>脚本:</span>
  476. <p v-if="currentScript.scriptStatus==0">暂无</p>
  477. <p v-else><a :href="currentScript.url">{{currentScript.scriptName}}</a></p>
  478. </div>
  479. <div class="scriptbottom-btn">
  480. <!-- <a-button type='primary' @click="scriptApproved" v-if="currentMaterial.materialStatus==2" :loading='acceptLoading' style="margin-right:20px" >通过审核</a-button>
  481. <a-button type='default' v-if="currentMaterial.materialStatus==2" @click="()=>{scriptRejectVisiable=true}" style="margin-right:20px">驳回</a-button>
  482. <a-button type='default' @click="scriptClose">关闭</a-button> -->
  483. </div>
  484. </div>
  485. </a-spin>
  486. <div
  487. :style="{
  488. position: 'absolute',
  489. right: 0,
  490. bottom: 0,
  491. width: '100%',
  492. borderTop: '1px solid #e9e9e9',
  493. padding: '10px 16px',
  494. background: '#fff',
  495. textAlign: 'right',
  496. zIndex: 1,
  497. }"
  498. >
  499. <a-button type='primary' @click="scriptApproved" v-if="currentMaterial.materialStatus==2" :loading='acceptLoading' style="margin-right:20px" >通过审核</a-button>
  500. <a-button type='default' v-if="currentMaterial.materialStatus==2" @click="()=>{scriptRejectVisiable=true}" style="margin-right:20px">驳回</a-button>
  501. <a-button type='default' @click="scriptClose">关闭</a-button>
  502. </div>
  503. </a-drawer>
  504. <!-- bohui -->
  505. <a-modal v-model="videoRejectVisiable" title="视频驳回" width='600px'>
  506. <template slot="footer">
  507. <a-button key="back" @click="()=>{videoRejectVisiable=false}">取消</a-button>
  508. <a-button type="primary" @click="reject" :loading="loadingElse">确定驳回</a-button>
  509. </template>
  510. <div style="position:relative">
  511. <a-textarea
  512. v-model="videoAdvise"
  513. placeholder="请填写驳回理由"
  514. :auto-size="{ minRows: 3, maxRows: 5 }"
  515. :maxLength='50'
  516. />
  517. <span style="position:absolute;bottom:5px;right:10px;line-height:24px"><span style="color:#1890ff">{{videoAdvise.length}}</span>/50</span>
  518. </div>
  519. </a-modal>
  520. <a-modal v-model="scriptRejectVisiable" title="脚本驳回" width='600px'>
  521. <template slot="footer">
  522. <a-button key="back" @click="()=>{scriptRejectVisiable=false}">取消</a-button>
  523. <a-button type="primary" @click="scriptReject" :loading="loadingElse">确定驳回</a-button>
  524. </template>
  525. <div style="position:relative">
  526. <a-textarea
  527. v-model="scriptAdvise"
  528. placeholder="请填写驳回理由"
  529. :auto-size="{ minRows: 3, maxRows: 5 }"
  530. :maxLength='50'
  531. />
  532. <span style="position:absolute;bottom:5px;right:10px;line-height:24px"><span style="color:#1890ff">{{scriptAdvise.length}}</span>/50</span>
  533. </div>
  534. </a-modal>
  535. </div>
  536. </div>
  537. </div>
  538. </div>
  539. </template>
  540. <script>
  541. import moment from 'moment';
  542. import { getAction, postAction, downFile, downFilePost } from '@/api/manage';
  543. import qs from 'qs'
  544. let columns=[
  545. {
  546. title: '物料名称',
  547. dataIndex: 'materialName',
  548. align: 'center',
  549. key: 'materialName',
  550. scopedSlots: { customRender: 'materialName' }
  551. },
  552. {
  553. title: '物料编号',
  554. dataIndex: 'materialId',
  555. align: 'center',
  556. key: 'tag',
  557. scopedSlots: { customRender: 'materialId' }
  558. },
  559. {
  560. title: '物料状态',
  561. dataIndex: 'materialStatus',
  562. align: 'center',
  563. key: 'materialStatus',
  564. scopedSlots: { customRender: 'materialStatus' }
  565. },
  566. {
  567. title: '脚本',
  568. dataIndex: 'scriptStatus',
  569. align: 'center',
  570. key: 'scriptStatus',
  571. scopedSlots: { customRender: 'scriptStatus' }
  572. },
  573. {
  574. title: '视频',
  575. dataIndex: 'videoStatus',
  576. align: 'center',
  577. key: 'videoStatus',
  578. width:250,
  579. scopedSlots: { customRender: 'videoStatus' }
  580. },
  581. {
  582. title: '所属订单',
  583. dataIndex: 'orderTitle',
  584. align: 'center',
  585. key: 'orderTitle',
  586. scopedSlots: { customRender: 'orderTitle' }
  587. },
  588. ]
  589. export default {
  590. name:'material-list',
  591. data() {
  592. const panes = [
  593. { title: '脚本列表', content: '', key: 1 , },
  594. { title: '视频列表', content: '', key: 2 , },
  595. ];
  596. return {
  597. visibleLoading:false,
  598. loadingElse:false,
  599. videoRejectVisiable:false,
  600. scriptRejectVisiable:false,
  601. acceptLoading:false,
  602. videoAdvise:'',
  603. scriptAdvise:'',
  604. currentScript:{},
  605. currentVideo:{},
  606. userInfo:{},
  607. roleCode:'',
  608. panes,
  609. activeKey: 1,
  610. orderInfo:{ },
  611. columns,
  612. data:[],
  613. loading:false,
  614. ipagination: {
  615. current: 1,
  616. pageSize: 10,
  617. // pageSizeOptions: ['10', '20', '30'],
  618. showTotal: (total, range) => {
  619. return range[0] + "-" + range[1] + " 共" + total + "条"
  620. },
  621. showQuickJumper: true,
  622. showSizeChanger:true,
  623. pageSizeOptions: ['10', '30', '50'],
  624. total: 0,
  625. onChange: (current, pageSize) => {
  626. // 切换分页时的回调,
  627. // 当在页面定义change事件时,切记要把此处的事件清除,因为这两个事件重叠了,可能到时候会导致一些莫名的bug
  628. this.ipagination.current = current;
  629. this.ipagination.pageSize= pageSize;
  630. }
  631. },
  632. // 订单进度
  633. materialName:'',
  634. materialId:'',
  635. orderStatus:'',
  636. orderParticipants:"",
  637. orderSponsor:'',
  638. visible: false,
  639. scriptVisible:false,
  640. placement: 'right',
  641. currentMaterial:{},
  642. sizeType:[],
  643. size: "4",
  644. url:{
  645. scriptDetail:'/platform/material/scriptDetail',
  646. videoDetail:'/platform/material/videoDetail',
  647. scriptAccept:'/platform/material/script/accept',
  648. scriptReject:'/platform/material/script/reject',
  649. videoAccept:'/platform/material/video/accept',
  650. videoReject:'/platform/material/video/reject',
  651. }
  652. }
  653. },
  654. methods: {
  655. goOrderDetail(record){
  656. console.log(record)
  657. this.$parent.currentTabComponent='orderDetail';
  658. this.$parent.orderId=record.orderId
  659. },
  660. goPlantForm(){
  661. if(this.$parent.role=='operator'){
  662. this.$parent.currentTabComponent='operatorPlatform'
  663. }else if(this.$parent.role=='designLeader'){
  664. this.$parent.currentTabComponent='designleaderPlatform'
  665. }else if(this.$parent.role=='design'){
  666. this.$parent.currentTabComponent='designPlatform'
  667. }
  668. },
  669. tabChange(key){
  670. console.log(key)
  671. this.tableHttp(key)
  672. },
  673. handleChange(value) {
  674. console.log(`selected ${value}`);
  675. },
  676. filterOption(input, option) {
  677. return (
  678. option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
  679. );
  680. },
  681. // 视频查看详情
  682. viewDetails(record){
  683. console.log(record)
  684. this.currentMaterial=record
  685. if(record.materialStatus>=4){
  686. this.currentVideo={};
  687. this.visible = true;
  688. this.visibleLoading=true
  689. if(record.videoId){
  690. getAction(this.url.videoDetail,{
  691. videoId:record.videoId
  692. }).then(res=>{
  693. console.log(res);
  694. this.visibleLoading=false
  695. if(res.success){
  696. if(res.result){
  697. let tagList=res.result.tag?res.result.tag.split(','):[]
  698. let imgList=res.result.imageUrl?res.result.imageUrl.split(','):[]
  699. // console.log(tagList)
  700. this.currentVideo={
  701. ...res.result,
  702. tagList,
  703. imgList
  704. }
  705. }
  706. }else{
  707. this.currentVideo={};
  708. }
  709. })
  710. }else{
  711. this.currentVideo=record
  712. this.visible = true;
  713. }
  714. }else{
  715. this.$message.error('请等待脚本审核通过后,上传视频')
  716. }
  717. },
  718. // 脚本查看详情
  719. scriptViewDetails(record){
  720. console.log(record)
  721. this.currentMaterial=record
  722. this.currentScript={};
  723. this.scriptVisible = true;
  724. if(record.scriptId){
  725. this.visibleLoading=true
  726. getAction(this.url.scriptDetail,{
  727. scriptId:record.scriptId
  728. }).then(res=>{
  729. console.log(res);
  730. this.visibleLoading=false
  731. if(res.success){
  732. this.currentScript=res.result;
  733. }else{
  734. this.currentScript={};
  735. }
  736. })
  737. }else{
  738. this.currentScript=record
  739. this.scriptVisible = true;
  740. }
  741. },
  742. // 撤回订单
  743. withdrawOrder(){
  744. },
  745. // 更多操作
  746. handleMenuClick(e) {
  747. console.log('click', e);
  748. },
  749. // 验收
  750. checkAccept(record){
  751. console.log(record)
  752. },
  753. onClose() {
  754. this.visible = false;
  755. },
  756. scriptClose() {
  757. this.scriptVisible = false;
  758. },
  759. // 上传素材
  760. uploadMaterial(){
  761. },
  762. sort(pagination, filters, sorter, { currentDataSource }){
  763. this.ipagination.current=pagination.current;
  764. this.ipagination.pageSize=pagination.pageSize;
  765. this.tableHttp(this.activeKey)
  766. },
  767. // 脚本通过审核
  768. scriptApproved(){
  769. this.acceptLoading=true;
  770. getAction('/platform/material/verifyScript',{
  771. materialCode:this.currentMaterial.materialCode,
  772. scriptId:this.currentMaterial.scriptId,
  773. }).then(res=>{
  774. if(res.success){
  775. postAction(this.url.scriptAccept,{
  776. id:this.currentMaterial.materialId,
  777. orderCode:this.currentMaterial.orderCode,
  778. materialCode:this.currentMaterial.materialCode
  779. }).then(res=>{
  780. console.log(res);
  781. this.acceptLoading=false;
  782. this.scriptVisible=false;
  783. if(res.success){
  784. this.$message.success(res.message);
  785. this.tableHttp(this.$parent.materialStatus)
  786. }else{
  787. this.$message.error(res.message)
  788. }
  789. })
  790. }else{
  791. this.acceptLoading=false;
  792. this.scriptVisible=false;
  793. this.tableHttp(this.$parent.materialStatus)
  794. this.$message.error(res.message)
  795. }
  796. })
  797. },
  798. // 脚本驳回
  799. scriptReject(){
  800. this.loadingElse=true
  801. getAction('/platform/material/verifyScript',{
  802. materialCode:this.currentMaterial.materialCode,
  803. scriptId:this.currentMaterial.scriptId,
  804. }).then(res=>{
  805. if(res.success){
  806. if(this.scriptAdvise){
  807. postAction(this.url.scriptReject,{
  808. id:this.currentMaterial.materialId,
  809. scriptAdvise:this.scriptAdvise,
  810. materialCode:this.currentMaterial.materialCode
  811. }).then(res=>{
  812. console.log(res);
  813. this.scriptAdvise=''
  814. this.scriptVisible=false;
  815. this.loadingElse=false;
  816. this.scriptRejectVisiable=false
  817. if(res.success){
  818. this.$message.success(res.message);
  819. this.tableHttp(this.$parent.materialStatus)
  820. }else{
  821. this.$message.error(res.message)
  822. }
  823. })
  824. }else{
  825. this.loadingElse=false;
  826. this.$message.error('请填写驳回理由')
  827. }
  828. }else{
  829. this.loadingElse=false;
  830. this.scriptVisible=false;
  831. this.tableHttp(this.$parent.materialStatus)
  832. this.$message.error(res.message)
  833. }
  834. })
  835. },
  836. // 视频通过审核
  837. approved(){
  838. this.acceptLoading=true;
  839. getAction('/platform/material/verifyVideo',{
  840. materialCode:this.currentMaterial.materialCode,
  841. videoId:this.currentMaterial.videoId,
  842. }).then(res=>{
  843. if(res.success){
  844. postAction(this.url.videoAccept,{
  845. id:this.currentMaterial.materialId,
  846. orderCode:this.currentMaterial.orderCode,
  847. materialCode:this.currentMaterial.materialCode,
  848. videoId:this.currentVideo.videoId
  849. }).then(res=>{
  850. console.log(res);
  851. this.acceptLoading=false;
  852. this.visible=false;
  853. if(res.success){
  854. this.$message.success(res.message);
  855. this.tableHttp(this.$parent.materialStatus)
  856. }else{
  857. this.$message.error(res.message)
  858. }
  859. })
  860. }else{
  861. this.$message.error(res.message)
  862. this.acceptLoading=false
  863. this.visible=false;
  864. this.tableHttp(this.$parent.materialStatus)
  865. }
  866. })
  867. },
  868. // 视频驳回
  869. reject(){
  870. this.loadingElse=true
  871. getAction('/platform/material/verifyVideo',{
  872. materialCode:this.currentMaterial.materialCode,
  873. videoId:this.currentMaterial.videoId,
  874. }).then(res=>{
  875. if(res.success){
  876. if(this.videoAdvise){
  877. postAction(this.url.videoReject,{
  878. id:this.currentMaterial.materialId,
  879. videoAdvise:this.videoAdvise,
  880. materialCode:this.currentMaterial.materialCode
  881. }).then(res=>{
  882. console.log(res);
  883. this.videoAdvise='';
  884. this.visible=false;
  885. this.loadingElse=false;
  886. this.videoRejectVisiable=false
  887. if(res.success){
  888. this.$message.success(res.message);
  889. this.tableHttp(this.$parent.materialStatus)
  890. }else{
  891. this.$message.error(res.message)
  892. }
  893. })
  894. }else{
  895. this.loadingElse=false;
  896. this.$message.error('请填写驳回理由')
  897. }
  898. }else{
  899. this.$message.error(res.message)
  900. this.loadingElse=false
  901. this.visible=false;
  902. this.tableHttp(this.$parent.materialStatus)
  903. }
  904. })
  905. },
  906. search(){
  907. },
  908. reset(){
  909. this.materialName='';
  910. this.materialId='';
  911. this.orderStatus='';
  912. this.orderParticipants="";
  913. this.orderSponsor='';
  914. },
  915. tableHttp(type){
  916. this.loading=true;
  917. let params=this.handlerParams(type)
  918. params={
  919. ...params,
  920. pageNo:this.ipagination.current,
  921. pageSize:this.ipagination.pageSize
  922. }
  923. console.log(params)
  924. getAction('/platform/material/listByOperatorUserId',params).then(res=>{
  925. console.log(res);
  926. if(res.success){
  927. this.loading=false;
  928. this.data=res.result.list;
  929. this.ipagination.total=res.result.total;
  930. }
  931. })
  932. },
  933. handlerParams(status){
  934. if(this.$parent.role=='operator'){
  935. if(status==1){
  936. return {
  937. operatorUserId:this.userInfo.id
  938. }
  939. }
  940. }else if(this.$parent.role=='designLeader'){
  941. if(status==1){
  942. return {
  943. materialStatus:0,
  944. design:this.userInfo.id
  945. }
  946. }else if(status==2){
  947. return {
  948. materialStatus:1,
  949. design:this.userInfo.id
  950. }
  951. }
  952. }else if(this.$parent.role=='design'){
  953. if(status==1){
  954. return {
  955. materialStatus:0,
  956. design:this.userInfo.id
  957. }
  958. }else if(status==2){
  959. return {
  960. materialStatus:1,
  961. design:this.userInfo.id
  962. }
  963. }else if(status==3){
  964. return {
  965. materialStatus:3,
  966. design:this.userInfo.id
  967. }
  968. }else if(status==4){
  969. return {
  970. design:this.userInfo.id
  971. }
  972. }
  973. }
  974. },
  975. },
  976. mounted(){
  977. let userInfo=localStorage.getItem('pro__Login_Userinfo');
  978. if(userInfo){
  979. this.userInfo=JSON.parse(userInfo).value
  980. }
  981. this.roleCode=localStorage.getItem('roleCode')
  982. console.log(this.$parent.materialStatus)
  983. this.tableHttp(this.$parent.materialStatus)
  984. this.activeKey=this.$parent.materialStatus
  985. },
  986. activated() {
  987. // this.tableHttp(this.$parent.materialStatus)
  988. },
  989. filters:{
  990. handlerMaterialStatus(val){
  991. let str='';
  992. switch(val){
  993. case 0:
  994. str= '待指派'
  995. break;
  996. case 1:
  997. str= '脚本待上传'
  998. break;
  999. case 2:
  1000. str= '脚本待审核'
  1001. break;
  1002. case 3:
  1003. str= '脚本被驳回'
  1004. break;
  1005. case 4:
  1006. str= '视频待上传'
  1007. break;
  1008. case 5:
  1009. str= '视频待审核'
  1010. break;
  1011. case 6:
  1012. str= '视频被驳回'
  1013. break;
  1014. case 7:
  1015. str= '物料已完结'
  1016. break;
  1017. default:
  1018. str='出错了'
  1019. break;
  1020. }
  1021. return str
  1022. },
  1023. handlerVideoStatus(val){
  1024. let str='';
  1025. switch(val){
  1026. case 0:
  1027. str= '待上传'
  1028. break;
  1029. case 1:
  1030. str= '待审核'
  1031. break;
  1032. case 2:
  1033. str= '被驳回'
  1034. break;
  1035. case 3:
  1036. str= '已审核'
  1037. break;
  1038. default:
  1039. str='出错了'
  1040. break;
  1041. }
  1042. return str
  1043. },
  1044. },
  1045. }
  1046. </script>