AddOrUpdate.vue 43 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303
  1. <template>
  2. <el-dialog
  3. :title="title"
  4. :visible.sync="showDialog"
  5. width="80%"
  6. @close="handleClose"
  7. :close-on-click-modal="false"
  8. >
  9. <span>
  10. <el-form ref="form" :model="form" :rules="rules" label-width="80px">
  11. <el-row>
  12. <el-col :span="6">
  13. <el-form-item label="客户名称" prop="fCorpId">
  14. <el-select
  15. v-model="form.fCorpId"
  16. placeholder="请输入客户名称"
  17. :clearable="true"
  18. filterable
  19. size="mini"
  20. style="width: 180px"
  21. :disabled="true"
  22. >
  23. <el-option
  24. v-for="(dict, index) in fMblnoOptions"
  25. :key="index.fId"
  26. :label="dict.fName"
  27. :value="dict.fId"
  28. />
  29. </el-select>
  30. </el-form-item>
  31. </el-col>
  32. <el-col :span="6">
  33. <el-form-item label="业务类型" prop="billType">
  34. <el-select
  35. v-model="form.billType"
  36. placeholder="请选择业务类型"
  37. :disabled="true"
  38. size="mini"
  39. style="width: 180px"
  40. >
  41. <el-option
  42. v-for="(dict, index) in billTypeList"
  43. :key="index.dictValue"
  44. :label="dict.dictLabel"
  45. :value="dict.dictValue"
  46. />
  47. </el-select>
  48. </el-form-item>
  49. </el-col>
  50. <el-col :span="6">
  51. <el-form-item label="运输方式" prop="transType">
  52. <el-select
  53. v-model="form.transType"
  54. placeholder="请选择运输方式"
  55. :disabled="true"
  56. size="mini"
  57. style="width: 180px"
  58. >
  59. <el-option
  60. v-for="(dict, index) in transTypeList"
  61. :key="index.dictValue"
  62. :label="dict.dictLabel"
  63. :value="dict.dictValue"
  64. />
  65. </el-select>
  66. </el-form-item>
  67. </el-col>
  68. <el-col :span="6">
  69. <el-form-item label="运输性质" prop="transProp">
  70. <el-select
  71. v-model="form.transProp"
  72. placeholder="请选择运输方式"
  73. :disabled="true"
  74. size="mini"
  75. style="width: 180px"
  76. >
  77. <el-option
  78. v-for="(dict, index) in transPropList"
  79. :key="index.dictValue"
  80. :label="dict.dictLabel"
  81. :value="dict.dictValue"
  82. />
  83. </el-select>
  84. </el-form-item>
  85. </el-col>
  86. </el-row>
  87. <el-row>
  88. <el-col :span="6">
  89. <el-form-item label="装车地点" prop="tLoadAddr">
  90. <el-input
  91. v-model="form.tLoadAddr"
  92. placeholder="请输入装车地点"
  93. :disabled="true"
  94. size="mini"
  95. style="width: 180px"
  96. />
  97. </el-form-item>
  98. </el-col>
  99. <el-col :span="6">
  100. <el-form-item label="计划时间" prop="tLoadDate">
  101. <el-date-picker
  102. clearable
  103. size="mini"
  104. style="width: 180px"
  105. v-model="form.tLoadDate"
  106. type="date"
  107. value-format="yyyy-MM-dd"
  108. placeholder="选择计划装车时间"
  109. :disabled="true"
  110. >
  111. </el-date-picker>
  112. </el-form-item>
  113. </el-col>
  114. <el-col :span="6">
  115. <el-form-item label="联系人" prop="loadAttn">
  116. <el-input
  117. v-model="form.loadAttn"
  118. placeholder="请输入装车联系人"
  119. :disabled="true"
  120. size="mini"
  121. style="width: 180px"
  122. />
  123. </el-form-item>
  124. </el-col>
  125. <el-col :span="6">
  126. <el-form-item label="联系电话" prop="loadAttntel">
  127. <el-input
  128. v-model="form.loadAttntel"
  129. placeholder="请输入装车联系电话"
  130. :disabled="true"
  131. v-input-limit="0"
  132. size="mini"
  133. style="width: 180px"
  134. />
  135. </el-form-item>
  136. </el-col>
  137. </el-row>
  138. <el-row>
  139. <el-col :span="6">
  140. <el-form-item label="卸车地点" prop="unLoadAddr">
  141. <el-input
  142. v-model="form.unLoadAddr"
  143. placeholder="请输入卸车地点"
  144. :disabled="true"
  145. size="mini"
  146. style="width: 180px"
  147. />
  148. </el-form-item>
  149. </el-col>
  150. <el-col :span="6">
  151. <el-form-item label="计划时间" prop="tUnLoadDate">
  152. <el-date-picker
  153. clearable
  154. size="mini"
  155. style="width: 180px"
  156. v-model="form.tUnLoadDate"
  157. type="date"
  158. value-format="yyyy-MM-dd"
  159. placeholder="选择计划卸车时间"
  160. :disabled="true"
  161. >
  162. </el-date-picker>
  163. </el-form-item>
  164. </el-col>
  165. <el-col :span="6">
  166. <el-form-item label="联系人" prop="unLoadAttn">
  167. <el-input
  168. v-model="form.unLoadAttn"
  169. placeholder="请输入卸车联系人"
  170. :disabled="true"
  171. size="mini"
  172. style="width: 180px"
  173. />
  174. </el-form-item>
  175. </el-col>
  176. <el-col :span="6">
  177. <el-form-item label="联系电话" prop="unLoadAttnTel">
  178. <el-input
  179. v-model="form.unLoadAttnTel"
  180. placeholder="请输入卸车联系电话"
  181. :disabled="true"
  182. v-input-limit="0"
  183. size="mini"
  184. style="width: 180px"
  185. />
  186. </el-form-item>
  187. </el-col>
  188. </el-row>
  189. <el-row>
  190. <el-col :span="6">
  191. <el-form-item label="提单号" prop="mblno">
  192. <el-input
  193. v-model="form.mblno"
  194. placeholder="请输入提单号"
  195. :disabled="true"
  196. size="mini"
  197. style="width: 180px"
  198. />
  199. </el-form-item>
  200. </el-col>
  201. <el-col :span="6">
  202. <el-form-item label="货品名称" prop="goodsId">
  203. <el-select
  204. v-model="form.goodsId"
  205. placeholder="请输入货品名称"
  206. :disabled="true"
  207. clearable
  208. filterable
  209. size="mini"
  210. style="width: 180px"
  211. >
  212. <el-option
  213. v-for="(dict, index) in goodsOptions"
  214. :key="index.fId"
  215. :label="dict.fName"
  216. :value="dict.fId"
  217. />
  218. </el-select>
  219. </el-form-item>
  220. </el-col>
  221. <el-col :span="6">
  222. <el-form-item label="计划件数" prop="qtyPlan">
  223. <el-input
  224. v-model="form.qtyPlan"
  225. placeholder="请输入计划件数"
  226. :disabled="true"
  227. v-input-limit="2"
  228. size="mini"
  229. style="width: 180px"
  230. />
  231. </el-form-item>
  232. </el-col>
  233. <el-col :span="6">
  234. <el-form-item label="重量(吨)" prop="weightPlan">
  235. <el-input
  236. v-model="form.weightPlan"
  237. placeholder="请输入计划重量"
  238. :disabled="true"
  239. v-input-limit="2"
  240. size="mini"
  241. style="width: 180px"
  242. />
  243. </el-form-item>
  244. </el-col>
  245. </el-row>
  246. <el-row>
  247. <el-col :span="6">
  248. <el-form-item label="船名" prop="ysl">
  249. <el-input
  250. v-model="form.ysl"
  251. placeholder="请输入船名"
  252. :disabled="true"
  253. size="mini"
  254. style="width: 180px"
  255. />
  256. </el-form-item>
  257. </el-col>
  258. <el-col :span="6">
  259. <el-form-item label="航次" prop="voy">
  260. <el-input
  261. v-model="form.voy"
  262. placeholder="请输入航次"
  263. :disabled="true"
  264. size="mini"
  265. style="width: 180px"
  266. />
  267. </el-form-item>
  268. </el-col>
  269. <el-col :span="6">
  270. <el-form-item label="起运港" prop="polId">
  271. <el-select
  272. v-model="form.polId"
  273. placeholder="请输入起运港"
  274. :clearable="true"
  275. filterable
  276. :disabled="true"
  277. size="mini"
  278. style="width: 180px"
  279. >
  280. <el-option
  281. v-for="(dict, index) in polList"
  282. :key="index.dictValue"
  283. :label="dict.dictLabel"
  284. :value="dict.dictValue"
  285. />
  286. </el-select>
  287. </el-form-item>
  288. </el-col>
  289. <el-col :span="6">
  290. <el-form-item label="目的港" prop="podId">
  291. <el-select
  292. v-model="form.podId"
  293. placeholder="请输入目的港"
  294. :clearable="true"
  295. filterable
  296. :disabled="true"
  297. size="mini"
  298. style="width: 180px"
  299. >
  300. <el-option
  301. v-for="(dict, index) in podList"
  302. :key="index.dictValue"
  303. :label="dict.dictLabel"
  304. :value="dict.dictValue"
  305. />
  306. </el-select>
  307. </el-form-item>
  308. </el-col>
  309. </el-row>
  310. <el-row>
  311. <el-col :span="6">
  312. <el-form-item label="车号" prop="carregNo">
  313. <el-input
  314. v-model="form.carregNo"
  315. placeholder="请输入车号"
  316. :disabled="true"
  317. size="mini"
  318. style="width: 180px"
  319. />
  320. </el-form-item>
  321. </el-col>
  322. <el-col :span="6">
  323. <el-form-item label="司机" prop="driverName">
  324. <el-input
  325. v-model="form.driverName"
  326. placeholder="请输入司机"
  327. :disabled="true"
  328. size="mini"
  329. style="width: 180px"
  330. />
  331. </el-form-item>
  332. </el-col>
  333. <el-col :span="6">
  334. <el-form-item label="司机电话" prop="driverTel">
  335. <el-input
  336. v-model="form.driverTel"
  337. placeholder="请输入司机电话"
  338. :disabled="true"
  339. size="mini"
  340. style="width: 180px"
  341. />
  342. </el-form-item>
  343. </el-col>
  344. </el-row>
  345. <el-row>
  346. <!-- <el-col :span="6">
  347. <el-form-item label="接单时间" prop="acceptDate">
  348. <el-date-picker
  349. clearable
  350. size="mini"
  351. style="width: 180px"
  352. v-model="form.acceptDate"
  353. type="date"
  354. value-format="yyyy-MM-dd"
  355. placeholder="选择接单时间"
  356. :disabled="true"
  357. >
  358. </el-date-picker>
  359. </el-form-item>
  360. </el-col> -->
  361. <el-col :span="6">
  362. <el-form-item label="提箱时间" prop="loadDate">
  363. <el-date-picker
  364. clearable
  365. size="mini"
  366. style="width: 180px"
  367. v-model="form.loadDate"
  368. type="date"
  369. value-format="yyyy-MM-dd"
  370. placeholder="选择提箱时间"
  371. :disabled="true"
  372. >
  373. </el-date-picker>
  374. </el-form-item>
  375. </el-col>
  376. <el-col :span="6">
  377. <el-form-item label="装卸货时间" prop="mdLoadDate">
  378. <el-date-picker
  379. clearable
  380. size="mini"
  381. style="width: 180px"
  382. v-model="form.mdLoadDate"
  383. type="date"
  384. value-format="yyyy-MM-dd"
  385. placeholder="选择装卸货时间"
  386. :disabled="true"
  387. >
  388. </el-date-picker>
  389. </el-form-item>
  390. </el-col>
  391. <el-col :span="6">
  392. <el-form-item label="还柜时间" prop="unLoadDate">
  393. <el-date-picker
  394. clearable
  395. size="mini"
  396. style="width: 180px"
  397. v-model="form.unLoadDate"
  398. type="date"
  399. value-format="yyyy-MM-dd"
  400. placeholder="选择还柜时间"
  401. :disabled="true"
  402. >
  403. </el-date-picker>
  404. </el-form-item>
  405. </el-col>
  406. <el-col :span="6">
  407. <el-form-item label="回单时间" prop="waybillDate">
  408. <el-date-picker
  409. clearable
  410. size="mini"
  411. style="width: 180px"
  412. v-model="form.waybillDate"
  413. type="date"
  414. value-format="yyyy-MM-dd"
  415. placeholder="选择回单时间"
  416. :disabled="true"
  417. >
  418. </el-date-picker>
  419. </el-form-item>
  420. </el-col>
  421. </el-row>
  422. <el-row>
  423. <el-col :span="6">
  424. <el-form-item label="起始里程" prop="odometerFrom">
  425. <el-input
  426. v-model="form.odometerFrom"
  427. placeholder="请输入起始里程表读数"
  428. size="mini"
  429. style="width: 180px"
  430. v-input-limit="2"
  431. :disabled="disabled"
  432. />
  433. </el-form-item>
  434. </el-col>
  435. <el-col :span="6">
  436. <el-form-item label="结束里程" prop="odometerEnd">
  437. <el-input
  438. v-model="form.odometerEnd"
  439. placeholder="请输入结束里程表读数"
  440. size="mini"
  441. style="width: 180px"
  442. v-input-limit="2"
  443. :disabled="disabled"
  444. />
  445. </el-form-item>
  446. </el-col>
  447. <el-col :span="6">
  448. <el-form-item label="接单时间" prop="acceptDate">
  449. <el-date-picker
  450. clearable
  451. size="mini"
  452. style="width: 180px"
  453. v-model="form.acceptDate"
  454. type="date"
  455. value-format="yyyy-MM-dd"
  456. placeholder="选择接单时间"
  457. :disabled="disabled"
  458. >
  459. </el-date-picker>
  460. </el-form-item>
  461. </el-col>
  462. <el-col :span="6">
  463. <el-form-item label="接单备注" prop="acceptRemarks">
  464. <el-input
  465. v-model="form.acceptRemarks"
  466. placeholder="请输入接单备注"
  467. size="mini"
  468. style="width: 180px"
  469. :disabled="disabled"
  470. />
  471. </el-form-item>
  472. </el-col>
  473. </el-row>
  474. </el-form>
  475. <el-collapse v-model="collapses">
  476. <el-collapse-item>
  477. <template slot="title">
  478. <i class="header-icon el-icon-circle-plus" style="font-size: 16px"
  479. ><span
  480. style="font-size: 16px; font-weight: bolder; margin-left: 5px"
  481. >附件上传</span
  482. >
  483. </i>
  484. </template>
  485. <div>
  486. <div
  487. style="
  488. display: flex;
  489. justify-content: space-between;
  490. margin: 10px 0;
  491. "
  492. >
  493. <div>
  494. <el-button
  495. type="primary"
  496. icon="el-icon-plus"
  497. size="mini"
  498. @click="addRelevt"
  499. :disabled="disabled"
  500. >添加</el-button
  501. >
  502. </div>
  503. </div>
  504. <el-table
  505. :data="relevantAttachments"
  506. tooltip-effect="dark"
  507. border
  508. stripe
  509. style="width: 100%"
  510. height="150"
  511. >
  512. <el-table-column label="序号" type="index" width="80">
  513. </el-table-column>
  514. <el-table-column
  515. prop="attachName"
  516. header-align="center"
  517. align="center"
  518. label="附件名称"
  519. >
  520. <template slot-scope="scope">
  521. <el-input
  522. v-model="scope.row.attachName"
  523. placeholder="附件名称"
  524. show-word-limit
  525. />
  526. </template>
  527. </el-table-column>
  528. <el-table-column
  529. prop="opuserID "
  530. header-align="center"
  531. align="center"
  532. label="上传人"
  533. >
  534. <template slot-scope="scope">
  535. <el-input
  536. v-model="scope.row.opuserID"
  537. placeholder="上传人"
  538. show-word-limit
  539. />
  540. </template>
  541. </el-table-column>
  542. <el-table-column
  543. prop="opdata"
  544. header-align="center"
  545. align="center"
  546. label="上传时间"
  547. >
  548. <template slot-scope="scope">
  549. <el-date-picker
  550. v-model="scope.row.opdata"
  551. type="date"
  552. disabled
  553. placeholder="上传时间"
  554. format="yyyy-MM-dd HH:mm"
  555. value-format="timestamp"
  556. ></el-date-picker>
  557. </template>
  558. </el-table-column>
  559. <el-table-column
  560. prop="attachUrl"
  561. header-align="center"
  562. align="center"
  563. label="上传附件"
  564. >
  565. <template slot-scope="scope">
  566. <div style="display: flex; justify-content: center">
  567. <el-upload
  568. class="upload-demo"
  569. :action="uploadImgUrl"
  570. :on-success="
  571. (res, file) => {
  572. handleSucces(scope, res, file);
  573. }
  574. "
  575. :headers="headers"
  576. :disabled="disabled"
  577. :show-file-list="false"
  578. :limit="1"
  579. >
  580. <el-button size="small" type="text" :disabled="disabled"
  581. >点击上传</el-button
  582. >
  583. </el-upload>
  584. <el-button
  585. size="small"
  586. type="text"
  587. @click="checkFile(scope)"
  588. :disabled="disabled"
  589. style="margin-left: 10px"
  590. >查看</el-button
  591. >
  592. <el-button
  593. size="small"
  594. type="text"
  595. :disabled="disabled"
  596. @click="deleteFile(scope)"
  597. >删除</el-button
  598. >
  599. </div>
  600. </template>
  601. </el-table-column>
  602. <el-table-column
  603. header-align="center"
  604. align="center"
  605. label="操作"
  606. width="130PX"
  607. >
  608. <template slot-scope="scope">
  609. <el-button
  610. size="mini"
  611. type="text"
  612. icon="el-icon-delete"
  613. @click.native.prevent="
  614. deleteRow(scope.$index, relevantAttachments)
  615. "
  616. :disabled="disabled"
  617. >删除</el-button
  618. >
  619. </template>
  620. </el-table-column>
  621. </el-table>
  622. </div>
  623. </el-collapse-item>
  624. <el-collapse-item v-if="userType == '00'">
  625. <template slot="title">
  626. <i class="header-icon el-icon-circle-plus" style="font-size: 16px"
  627. ><span
  628. style="font-size: 16px; font-weight: bolder; margin-left: 5px"
  629. >收款信息</span
  630. >
  631. </i>
  632. </template>
  633. <div>
  634. <div
  635. style="
  636. display: flex;
  637. justify-content: space-between;
  638. margin: 10px 0;
  639. "
  640. >
  641. <div>
  642. <el-button
  643. type="primary"
  644. icon="el-icon-plus"
  645. size="mini"
  646. @click="addDListRow(DList)"
  647. :disabled="disabled"
  648. >添加</el-button
  649. >
  650. </div>
  651. </div>
  652. <el-table :data="DList">
  653. <el-table-column label="结算单位" align="center" prop="fCorpid">
  654. <template slot-scope="scope">
  655. <el-select
  656. v-model="scope.row.fCorpid"
  657. placeholder="结算单位"
  658. :clearable="true"
  659. filterable
  660. :disabled="disabled"
  661. >
  662. <el-option
  663. v-for="(dict, index) in fMblnoOptions"
  664. :key="index.fId"
  665. :label="dict.fName"
  666. :value="dict.fId"
  667. />
  668. </el-select>
  669. </template>
  670. </el-table-column>
  671. <el-table-column label="费用名称" align="center" prop="fFeeid">
  672. <template slot-scope="scope">
  673. <el-select
  674. v-model="scope.row.fFeeid"
  675. placeholder="费用名称"
  676. clearable
  677. filterable
  678. :disabled="disabled"
  679. >
  680. <el-option
  681. v-for="(dict, index) in fWbuOptions"
  682. :key="index.fId"
  683. :label="dict.fName"
  684. :value="dict.fId"
  685. />
  686. </el-select>
  687. </template>
  688. </el-table-column>
  689. <el-table-column
  690. label="计费单位"
  691. align="center"
  692. prop="fFeeunitid"
  693. >
  694. <template slot-scope="scope">
  695. <el-select
  696. v-model="scope.row.fFeeunitid"
  697. placeholder="计费单位"
  698. :disabled="disabled"
  699. >
  700. <el-option
  701. v-for="(dict, index) in ffeeunitidList"
  702. :key="index.dictValue"
  703. :label="dict.dictLabel"
  704. :value="dict.dictValue"
  705. />
  706. </el-select>
  707. </template>
  708. </el-table-column>
  709. <el-table-column label="计费数量" align="center" prop="fQty">
  710. <template slot-scope="scope">
  711. <el-input
  712. v-model="scope.row.fQty"
  713. placeholder="计费数量"
  714. v-input-limit="0"
  715. :disabled="disabled"
  716. @input="total(scope.row)"
  717. />
  718. </template>
  719. </el-table-column>
  720. <el-table-column label="单价" align="center" prop="fUnitprice">
  721. <template slot-scope="scope">
  722. <el-input
  723. v-model="scope.row.fUnitprice"
  724. placeholder="单价"
  725. v-input-limit="2"
  726. :disabled="disabled"
  727. @input="total(scope.row)"
  728. />
  729. </template>
  730. </el-table-column>
  731. <el-table-column label="币种" align="center" prop="fCurrency">
  732. <template slot-scope="scope">
  733. <el-input
  734. v-model="scope.row.fCurrency"
  735. placeholder="RMB"
  736. :disabled="true"
  737. />
  738. </template>
  739. </el-table-column>
  740. <el-table-column label="汇率" align="center" prop="fExrate">
  741. <template slot-scope="scope">
  742. <el-input
  743. v-model="scope.row.fExrate"
  744. placeholder="汇率"
  745. v-input-limit="2"
  746. :disabled="disabled"
  747. />
  748. </template>
  749. </el-table-column>
  750. <el-table-column label="金额" align="center" prop="fAmount">
  751. <template slot-scope="scope">
  752. <el-input
  753. v-model="scope.row.fAmount"
  754. placeholder="金额"
  755. v-input-limit="2"
  756. :disabled="true"
  757. />
  758. </template>
  759. </el-table-column>
  760. <el-table-column label="税率" align="center" prop="fTaxrate">
  761. <template slot-scope="scope">
  762. <el-input
  763. v-model="scope.row.fTaxrate"
  764. placeholder="税率"
  765. v-input-limit="2"
  766. :disabled="disabled"
  767. />
  768. </template>
  769. </el-table-column>
  770. <el-table-column label="备注" align="center" prop="remarks">
  771. <template slot-scope="scope">
  772. <el-input
  773. v-model="scope.row.remarks"
  774. placeholder="备注"
  775. :disabled="disabled"
  776. />
  777. </template>
  778. </el-table-column>
  779. <el-table-column
  780. label="操作"
  781. align="center"
  782. class-name="small-padding fixed-width"
  783. width="100"
  784. >
  785. <template slot-scope="scope">
  786. <el-button
  787. size="mini"
  788. type="text"
  789. icon="el-icon-delete"
  790. @click.native.prevent="deleteRow(scope.$index, DList)"
  791. :disabled="disabled"
  792. >删除</el-button
  793. >
  794. </template>
  795. </el-table-column>
  796. </el-table>
  797. </div>
  798. </el-collapse-item>
  799. <el-collapse-item v-if="userType == '00'">
  800. <template slot="title">
  801. <i class="header-icon el-icon-circle-plus" style="font-size: 16px"
  802. ><span
  803. style="font-size: 16px; font-weight: bolder; margin-left: 5px"
  804. >付款信息</span
  805. >
  806. </i>
  807. </template>
  808. <div>
  809. <div
  810. style="
  811. display: flex;
  812. justify-content: space-between;
  813. margin: 10px 0;
  814. "
  815. >
  816. <div>
  817. <el-button
  818. type="primary"
  819. icon="el-icon-plus"
  820. size="mini"
  821. @click="addDListRow(CList)"
  822. :disabled="disabled"
  823. >添加</el-button
  824. >
  825. </div>
  826. </div>
  827. <el-table :data="CList">
  828. <el-table-column label="结算单位" align="center" prop="fCorpid">
  829. <template slot-scope="scope">
  830. <el-select
  831. v-model="scope.row.fCorpid"
  832. placeholder="结算单位"
  833. :clearable="true"
  834. filterable
  835. :disabled="disabled"
  836. >
  837. <el-option
  838. v-for="(dict, index) in fMblnoOptions"
  839. :key="index.fId"
  840. :label="dict.fName"
  841. :value="dict.fId"
  842. />
  843. </el-select>
  844. </template>
  845. </el-table-column>
  846. <el-table-column label="费用名称" align="center" prop="fFeeid">
  847. <template slot-scope="scope">
  848. <el-select
  849. v-model="scope.row.fFeeid"
  850. placeholder="费用名称"
  851. clearable
  852. filterable
  853. :disabled="disabled"
  854. >
  855. <el-option
  856. v-for="(dict, index) in fWbuOptions"
  857. :key="index.fId"
  858. :label="dict.fName"
  859. :value="dict.fId"
  860. />
  861. </el-select>
  862. </template>
  863. </el-table-column>
  864. <el-table-column
  865. label="计费单位"
  866. align="center"
  867. prop="fFeeunitid"
  868. >
  869. <template slot-scope="scope">
  870. <el-select
  871. v-model="scope.row.fFeeunitid"
  872. placeholder="计费单位"
  873. :disabled="disabled"
  874. >
  875. <el-option
  876. v-for="(dict, index) in ffeeunitidList"
  877. :key="index.dictValue"
  878. :label="dict.dictLabel"
  879. :value="dict.dictValue"
  880. />
  881. </el-select>
  882. </template>
  883. </el-table-column>
  884. <el-table-column label="计费数量" align="center" prop="fQty">
  885. <template slot-scope="scope">
  886. <el-input
  887. v-model="scope.row.fQty"
  888. placeholder="计费数量"
  889. v-input-limit="0"
  890. :disabled="disabled"
  891. @input="total(scope.row)"
  892. />
  893. </template>
  894. </el-table-column>
  895. <el-table-column label="单价" align="center" prop="fUnitprice">
  896. <template slot-scope="scope">
  897. <el-input
  898. v-model="scope.row.fUnitprice"
  899. placeholder="单价"
  900. v-input-limit="2"
  901. :disabled="disabled"
  902. @input="total(scope.row)"
  903. />
  904. </template>
  905. </el-table-column>
  906. <el-table-column label="币种" align="center" prop="fCurrency">
  907. <template slot-scope="scope">
  908. <el-input
  909. v-model="scope.row.fCurrency"
  910. placeholder="RMB"
  911. :disabled="true"
  912. />
  913. </template>
  914. </el-table-column>
  915. <el-table-column label="汇率" align="center" prop="fExrate">
  916. <template slot-scope="scope">
  917. <el-input
  918. v-model="scope.row.fExrate"
  919. placeholder="汇率"
  920. v-input-limit="2"
  921. :disabled="disabled"
  922. />
  923. </template>
  924. </el-table-column>
  925. <el-table-column label="金额" align="center" prop="fAmount">
  926. <template slot-scope="scope">
  927. <el-input
  928. v-model="scope.row.fAmount"
  929. placeholder="金额"
  930. v-input-limit="2"
  931. :disabled="true"
  932. />
  933. </template>
  934. </el-table-column>
  935. <el-table-column label="税率" align="center" prop="fTaxrate">
  936. <template slot-scope="scope">
  937. <el-input
  938. v-model="scope.row.fTaxrate"
  939. placeholder="税率"
  940. v-input-limit="2"
  941. :disabled="disabled"
  942. />
  943. </template>
  944. </el-table-column>
  945. <el-table-column label="备注" align="center" prop="remarks">
  946. <template slot-scope="scope">
  947. <el-input
  948. v-model="scope.row.remarks"
  949. placeholder="备注"
  950. :disabled="disabled"
  951. />
  952. </template>
  953. </el-table-column>
  954. <el-table-column
  955. label="操作"
  956. align="center"
  957. class-name="small-padding fixed-width"
  958. width="100"
  959. >
  960. <template slot-scope="scope">
  961. <el-button
  962. size="mini"
  963. type="text"
  964. icon="el-icon-delete"
  965. @click.native.prevent="deleteRow(scope.$index, DList)"
  966. :disabled="disabled"
  967. >删除</el-button
  968. >
  969. </template>
  970. </el-table-column>
  971. </el-table>
  972. </div>
  973. </el-collapse-item>
  974. </el-collapse>
  975. </span>
  976. <span slot="footer" class="dialog-footer">
  977. <el-button type="primary" @click="submitForm">提 交</el-button>
  978. <el-button type="success" @click="submitAllowChanges">修 改</el-button>
  979. <el-button type="info" @click="submitSave">保 存</el-button>
  980. <el-button type="warning" @click="submitRetreat">撤 回</el-button>
  981. <el-button @click="showDialog = false">取 消</el-button>
  982. </span>
  983. </el-dialog>
  984. </template>
  985. <script>
  986. import {
  987. removeFtmsorderbillscars,
  988. driverSaveFtmsorderbillscars,
  989. insertDriverFtmsorderbillscars,
  990. } from "@/api/fleet/ftmsorderbillscars";
  991. import { listGoods } from "@/api/basicdata/goods";
  992. import { listCorps } from "@/api/basicdata/corps";
  993. import { listFees } from "@/api/basicdata/fees";
  994. import UploadFile from "@/components/Uploadfile";
  995. import Cookies from "js-cookie";
  996. import { getToken } from "@/utils/auth";
  997. export default {
  998. name: "plans",
  999. props: {
  1000. addOrUpdateVisible: {
  1001. type: Boolean,
  1002. default: false,
  1003. },
  1004. title: {
  1005. type: String,
  1006. required: "",
  1007. },
  1008. form: Object,
  1009. DList: {
  1010. type: Array,
  1011. default: [],
  1012. },
  1013. CList: {
  1014. type: Array,
  1015. default: [],
  1016. },
  1017. disabled: Boolean,
  1018. },
  1019. components: {
  1020. UploadFile,
  1021. },
  1022. data() {
  1023. return {
  1024. // 控制弹出框显示隐藏
  1025. showDialog: false,
  1026. // 表单校验
  1027. rules: {
  1028. // fCorpId: [
  1029. // { required: true, message: "请输入客户名称", trigger: "blur" },
  1030. // ],
  1031. // billType: [
  1032. // { required: true, message: "请选择业务类型", trigger: "blur" },
  1033. // ],
  1034. // transType: [
  1035. // { required: true, message: "请选择运输方式", trigger: "blur" },
  1036. // ],
  1037. // loadAddr: [
  1038. // { required: true, message: "请输入提箱地点", trigger: "blur" },
  1039. // ],
  1040. // loadAttntel: [
  1041. // {
  1042. // pattern: /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/,
  1043. // message: "请正确输入手机号",
  1044. // trigger: "blur",
  1045. // },
  1046. // ],
  1047. // mdLoadAttnTel: [
  1048. // {
  1049. // pattern: /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/,
  1050. // message: "请正确输入手机号",
  1051. // trigger: "blur",
  1052. // },
  1053. // ],
  1054. // unLoadAttnTel: [
  1055. // {
  1056. // pattern: /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/,
  1057. // message: "请正确输入手机号",
  1058. // trigger: "blur",
  1059. // },
  1060. // ],
  1061. },
  1062. billTypeList: [],
  1063. transTypeList: [],
  1064. transPropList: [],
  1065. goodsLossTypeList: [],
  1066. relevantAttachments: [],
  1067. cntrIdList: [],
  1068. priceTypeList: [],
  1069. userType: null,
  1070. username: null,
  1071. collapses: [],
  1072. fMblnoOptions: [],
  1073. cntrId2List: [],
  1074. goodsOptions: [],
  1075. fWbuOptions: [],
  1076. ffeeunitidList: [],
  1077. polList: [],
  1078. podList: [],
  1079. uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址
  1080. headers: {
  1081. Authorization: "Bearer " + getToken(),
  1082. },
  1083. };
  1084. },
  1085. created() {
  1086. this.getDicts("data_billType").then((response) => {
  1087. this.billTypeList = response.data;
  1088. });
  1089. this.getDicts("data_transType").then((response) => {
  1090. this.transTypeList = response.data;
  1091. });
  1092. this.getDicts("data_transProp").then((response) => {
  1093. this.transPropList = response.data;
  1094. });
  1095. this.getDicts("data_goodsLossType").then((response) => {
  1096. this.goodsLossTypeList = response.data;
  1097. });
  1098. this.getDicts("data_cntrId").then((response) => {
  1099. response.data.map((e) => (e.noOption = false));
  1100. this.cntrIdList = response.data;
  1101. });
  1102. this.getDicts("data_priceType").then((response) => {
  1103. this.priceTypeList = response.data;
  1104. });
  1105. this.getDicts("data_ffeeunitid").then((response) => {
  1106. this.ffeeunitidList = response.data;
  1107. });
  1108. this.getDicts("port_start").then((response) => {
  1109. this.polList = response.data;
  1110. });
  1111. this.getDicts("port_end").then((response) => {
  1112. this.podList = response.data;
  1113. });
  1114. listCorps().then((response) => {
  1115. this.fMblnoOptions = response.rows;
  1116. });
  1117. listGoods().then((response) => {
  1118. this.goodsOptions = response.rows;
  1119. });
  1120. listFees().then((response) => {
  1121. this.fWbuOptions = response.rows;
  1122. });
  1123. this.userType = Cookies.get("userType");
  1124. this.username = Cookies.get("userName");
  1125. },
  1126. methods: {
  1127. // 新增附件上传
  1128. addRelevt() {
  1129. this.relevantAttachments.push({
  1130. attachUrl: null,
  1131. attachName: null,
  1132. opuserID: this.username,
  1133. opdata: Date.parse(new Date()),
  1134. });
  1135. },
  1136. //附件删除
  1137. deleteFile(scope) {
  1138. this.relevantAttachments[scope.$index].attachName = "";
  1139. this.relevantAttachments[scope.$index].attachUrl = "";
  1140. if (this.relevantAttachments[scope.$index].attachUrl === "") {
  1141. this.$message.success("删除成功");
  1142. } else {
  1143. this.$message.error("未知错误,删除失败");
  1144. }
  1145. },
  1146. //附件查看
  1147. checkFile(scope) {
  1148. if (this.relevantAttachments[scope.$index].attachUrl) {
  1149. window.open(this.relevantAttachments[scope.$index].attachUrl);
  1150. } else {
  1151. this.$message.error("请上传附件");
  1152. }
  1153. },
  1154. //附件上传
  1155. handleSucces(scope, res, file) {
  1156. this.relevantAttachments[scope.$index].attachName = res.fileName;
  1157. this.relevantAttachments[scope.$index].attachUrl = res.url;
  1158. if (this.relevantAttachments[scope.$index].attachUrl === "") {
  1159. this.$message.error("上传失败");
  1160. } else {
  1161. this.$message.success("上传成功");
  1162. }
  1163. },
  1164. // 添加行
  1165. addRow(tableData, event) {
  1166. var obj = {};
  1167. tableData.push(obj);
  1168. },
  1169. addDListRow(tableData, event) {
  1170. var obj = {
  1171. fcorpid: this.form.fCorpId,
  1172. fcurrency: "RMB",
  1173. fPid: this.form.id,
  1174. fExrate: "1",
  1175. };
  1176. tableData.push(obj);
  1177. },
  1178. //删除行
  1179. deleteRow(index, rows) {
  1180. rows.splice(index, 1);
  1181. },
  1182. // 上传成功返回数据
  1183. showFile(row) {
  1184. for (let list in this.relevantAttachments) {
  1185. this.$set(this.relevantAttachments[list], "attachUrl", row.url);
  1186. this.$set(this.relevantAttachments[list], "attachName", row.fileName);
  1187. }
  1188. },
  1189. // 弹出框关闭后触发
  1190. handleClose() {
  1191. // 子组件调用父组件方法,并传递参数
  1192. this.$emit("changeShow", "false");
  1193. this.cntrIdList.forEach((item) => (item.noOption = false));
  1194. this.collapses = [];
  1195. },
  1196. /** 提交按钮 */
  1197. submitForm() {
  1198. this.$refs["form"].validate((valid) => {
  1199. if (valid) {
  1200. this.DList.map((e) => {
  1201. return (e.fDc = "D");
  1202. });
  1203. this.CList.map((e) => {
  1204. return (e.fDc = "C");
  1205. });
  1206. let formData = new window.FormData();
  1207. formData.append("cars", JSON.stringify(this.form));
  1208. formData.append("attachs", JSON.stringify(this.relevantAttachments));
  1209. formData.append(
  1210. "fees",
  1211. JSON.stringify(this.DList.concat(this.CList))
  1212. );
  1213. formData.append("operationType", "acceptDate");
  1214. insertDriverFtmsorderbillscars(formData).then((response) => {
  1215. if (response.code == 200) {
  1216. this.msgSuccess("提交成功");
  1217. this.$parent.getList();
  1218. this.showDialog = false;
  1219. }
  1220. });
  1221. }
  1222. });
  1223. },
  1224. //修改
  1225. submitFix() {
  1226. this.$refs["form"].validate((valid) => {
  1227. if (valid) {
  1228. }
  1229. });
  1230. },
  1231. //保存
  1232. submitSave() {
  1233. this.DList.map((e) => {
  1234. return (e.fDc = "D");
  1235. });
  1236. this.CList.map((e) => {
  1237. return (e.fDc = "C");
  1238. });
  1239. let formData = new window.FormData();
  1240. formData.append("cars", JSON.stringify(this.form));
  1241. formData.append("attachs", JSON.stringify(this.relevantAttachments));
  1242. formData.append("fees", JSON.stringify(this.DList.concat(this.CList)));
  1243. formData.append("operationType", "acceptDate");
  1244. driverSaveFtmsorderbillscars(formData).then((response) => {
  1245. if (response.code == 200) {
  1246. this.msgSuccess("保存成功");
  1247. this.$parent.getList();
  1248. // this.$parent.getSave(response);
  1249. }
  1250. });
  1251. },
  1252. //撤回
  1253. submitRetreat() {},
  1254. //修改
  1255. submitAllowChanges() {
  1256. if(this.form.orderStatus<=20){
  1257. this.$emit("fixDisabled", "false");
  1258. this.msgSuccess("允许修改");
  1259. }else{
  1260. this.msgSuccess("不允许修改");
  1261. }
  1262. },
  1263. //单条订单调度提交
  1264. addscarsRow(row) {},
  1265. delscarsRow(index, rows, row) {
  1266. if (row.billStatus != 6 && row.id != null) {
  1267. removeFtmsorderbillscars(row).then((response) => {
  1268. if (response.code == 200) {
  1269. rows.splice(index, 1);
  1270. this.msgSuccess("成功删除");
  1271. }
  1272. });
  1273. } else {
  1274. rows.splice(index, 1);
  1275. }
  1276. },
  1277. revokescarsRow(index, rows, row) {},
  1278. changescarsRow(row) {},
  1279. total(row) {
  1280. console.log(row);
  1281. if (row.fQty && row.fUnitprice) {
  1282. this.$set(row, "fAmount", (row.fQty * row.fUnitprice).toFixed(2));
  1283. } else {
  1284. this.$set(row, "fAmount", 0);
  1285. }
  1286. },
  1287. },
  1288. watch: {
  1289. // 监听 addOrUpdateVisible 改变
  1290. addOrUpdateVisible(oldVal, newVal) {
  1291. this.showDialog = this.addOrUpdateVisible;
  1292. },
  1293. },
  1294. };
  1295. </script>