AddOrUpdate.vue 40 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226
  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="odometerFrom">
  348. <el-input
  349. v-model="form.odometerFrom"
  350. placeholder="请输入起始里程表读数"
  351. size="mini"
  352. style="width: 180px"
  353. v-input-limit="2"
  354. :disabled="disabled"
  355. />
  356. </el-form-item>
  357. </el-col>
  358. <el-col :span="6">
  359. <el-form-item label="结束里程" prop="odometerEnd">
  360. <el-input
  361. v-model="form.odometerEnd"
  362. placeholder="请输入结束里程表读数"
  363. size="mini"
  364. style="width: 180px"
  365. v-input-limit="2"
  366. :disabled="disabled"
  367. />
  368. </el-form-item>
  369. </el-col>
  370. <el-col :span="6">
  371. <el-form-item label="回单时间" prop="waybillDate">
  372. <el-date-picker
  373. clearable
  374. size="mini"
  375. style="width: 180px"
  376. v-model="form.waybillDate"
  377. type="date"
  378. value-format="yyyy-MM-dd"
  379. placeholder="选择回单时间"
  380. :disabled="disabled"
  381. >
  382. </el-date-picker>
  383. </el-form-item>
  384. </el-col>
  385. <el-col :span="6">
  386. <el-form-item label="回单备注" prop="waybillRemarks">
  387. <el-input
  388. v-model="form.waybillRemarks"
  389. placeholder="请输入回单备注"
  390. size="mini"
  391. style="width: 180px"
  392. :disabled="disabled"
  393. />
  394. </el-form-item>
  395. </el-col>
  396. </el-row>
  397. </el-form>
  398. <el-collapse v-model="collapses">
  399. <el-collapse-item>
  400. <template slot="title">
  401. <i class="header-icon el-icon-circle-plus" style="font-size: 16px"
  402. ><span
  403. style="font-size: 16px; font-weight: bolder; margin-left: 5px"
  404. >附件上传</span
  405. >
  406. </i>
  407. </template>
  408. <div>
  409. <div
  410. style="
  411. display: flex;
  412. justify-content: space-between;
  413. margin: 10px 0;
  414. "
  415. >
  416. <div>
  417. <el-button
  418. type="primary"
  419. icon="el-icon-plus"
  420. size="mini"
  421. @click="addRelevt"
  422. :disabled="disabled"
  423. >添加</el-button
  424. >
  425. </div>
  426. </div>
  427. <el-table
  428. :data="relevantAttachments"
  429. tooltip-effect="dark"
  430. border
  431. stripe
  432. style="width: 100%"
  433. height="150"
  434. >
  435. <el-table-column label="序号" type="index" width="80">
  436. </el-table-column>
  437. <el-table-column
  438. prop="attachName"
  439. header-align="center"
  440. align="center"
  441. label="附件名称"
  442. >
  443. <template slot-scope="scope">
  444. <el-input
  445. v-model="scope.row.attachName"
  446. placeholder="附件名称"
  447. show-word-limit
  448. />
  449. </template>
  450. </el-table-column>
  451. <el-table-column
  452. prop="opuserID "
  453. header-align="center"
  454. align="center"
  455. label="上传人"
  456. >
  457. <template slot-scope="scope">
  458. <el-input
  459. v-model="scope.row.opuserID"
  460. placeholder="上传人"
  461. show-word-limit
  462. />
  463. </template>
  464. </el-table-column>
  465. <el-table-column
  466. prop="opdata"
  467. header-align="center"
  468. align="center"
  469. label="上传时间"
  470. >
  471. <template slot-scope="scope">
  472. <el-date-picker
  473. v-model="scope.row.opdata"
  474. type="date"
  475. disabled
  476. placeholder="上传时间"
  477. format="yyyy-MM-dd HH:mm"
  478. value-format="timestamp"
  479. ></el-date-picker>
  480. </template>
  481. </el-table-column>
  482. <el-table-column
  483. prop="attachUrl"
  484. header-align="center"
  485. align="center"
  486. label="上传附件"
  487. >
  488. <template slot-scope="scope">
  489. <div style="display: flex; justify-content: center">
  490. <el-upload
  491. class="upload-demo"
  492. :action="uploadImgUrl"
  493. :on-success="
  494. (res, file) => {
  495. handleSucces(scope, res, file);
  496. }
  497. "
  498. :headers="headers"
  499. :disabled="disabled"
  500. :show-file-list="false"
  501. :limit="1"
  502. >
  503. <el-button size="small" type="text" :disabled="disabled"
  504. >点击上传</el-button
  505. >
  506. </el-upload>
  507. <el-button
  508. size="small"
  509. type="text"
  510. @click="checkFile(scope)"
  511. :disabled="disabled"
  512. style="margin-left: 10px"
  513. >查看</el-button
  514. >
  515. <el-button
  516. size="small"
  517. type="text"
  518. :disabled="disabled"
  519. @click="deleteFile(scope)"
  520. >删除</el-button
  521. >
  522. </div>
  523. </template>
  524. </el-table-column>
  525. <el-table-column
  526. header-align="center"
  527. align="center"
  528. label="操作"
  529. width="130PX"
  530. >
  531. <template slot-scope="scope">
  532. <el-button
  533. size="mini"
  534. type="text"
  535. icon="el-icon-delete"
  536. @click.native.prevent="
  537. deleteRow(scope.$index, relevantAttachments)
  538. "
  539. :disabled="disabled"
  540. >删除</el-button
  541. >
  542. </template>
  543. </el-table-column>
  544. </el-table>
  545. </div>
  546. </el-collapse-item>
  547. <el-collapse-item v-if="userType == '00'">
  548. <template slot="title">
  549. <i class="header-icon el-icon-circle-plus" style="font-size: 16px"
  550. ><span
  551. style="font-size: 16px; font-weight: bolder; margin-left: 5px"
  552. >收款信息</span
  553. >
  554. </i>
  555. </template>
  556. <div>
  557. <div
  558. style="
  559. display: flex;
  560. justify-content: space-between;
  561. margin: 10px 0;
  562. "
  563. >
  564. <div>
  565. <el-button
  566. type="primary"
  567. icon="el-icon-plus"
  568. size="mini"
  569. @click="addDListRow(DList)"
  570. :disabled="disabled"
  571. >添加</el-button
  572. >
  573. </div>
  574. </div>
  575. <el-table :data="DList">
  576. <el-table-column label="结算单位" align="center" prop="fCorpid">
  577. <template slot-scope="scope">
  578. <el-select
  579. v-model="scope.row.fCorpid"
  580. placeholder="结算单位"
  581. :clearable="true"
  582. filterable
  583. :disabled="disabled"
  584. >
  585. <el-option
  586. v-for="(dict, index) in fMblnoOptions"
  587. :key="index.fId"
  588. :label="dict.fName"
  589. :value="dict.fId"
  590. />
  591. </el-select>
  592. </template>
  593. </el-table-column>
  594. <el-table-column label="费用名称" align="center" prop="fFeeid">
  595. <template slot-scope="scope">
  596. <el-select
  597. v-model="scope.row.fFeeid"
  598. placeholder="费用名称"
  599. clearable
  600. filterable
  601. :disabled="disabled"
  602. >
  603. <el-option
  604. v-for="(dict, index) in fWbuOptions"
  605. :key="index.fId"
  606. :label="dict.fName"
  607. :value="dict.fId"
  608. />
  609. </el-select>
  610. </template>
  611. </el-table-column>
  612. <el-table-column
  613. label="计费单位"
  614. align="center"
  615. prop="fFeeunitid"
  616. >
  617. <template slot-scope="scope">
  618. <el-select
  619. v-model="scope.row.fFeeunitid"
  620. placeholder="计费单位"
  621. :disabled="disabled"
  622. >
  623. <el-option
  624. v-for="(dict, index) in ffeeunitidList"
  625. :key="index.dictValue"
  626. :label="dict.dictLabel"
  627. :value="dict.dictValue"
  628. />
  629. </el-select>
  630. </template>
  631. </el-table-column>
  632. <el-table-column label="计费数量" align="center" prop="fQty">
  633. <template slot-scope="scope">
  634. <el-input
  635. v-model="scope.row.fQty"
  636. placeholder="计费数量"
  637. v-input-limit="0"
  638. :disabled="disabled"
  639. @input="total(scope.row)"
  640. />
  641. </template>
  642. </el-table-column>
  643. <el-table-column label="单价" align="center" prop="fUnitprice">
  644. <template slot-scope="scope">
  645. <el-input
  646. v-model="scope.row.fUnitprice"
  647. placeholder="单价"
  648. v-input-limit="2"
  649. :disabled="disabled"
  650. @input="total(scope.row)"
  651. />
  652. </template>
  653. </el-table-column>
  654. <el-table-column label="币种" align="center" prop="fCurrency">
  655. <template slot-scope="scope">
  656. <el-input
  657. v-model="scope.row.fCurrency"
  658. placeholder="RMB"
  659. :disabled="true"
  660. />
  661. </template>
  662. </el-table-column>
  663. <el-table-column label="汇率" align="center" prop="fExrate">
  664. <template slot-scope="scope">
  665. <el-input
  666. v-model="scope.row.fExrate"
  667. placeholder="汇率"
  668. v-input-limit="2"
  669. :disabled="disabled"
  670. />
  671. </template>
  672. </el-table-column>
  673. <el-table-column label="金额" align="center" prop="fAmount">
  674. <template slot-scope="scope">
  675. <el-input
  676. v-model="scope.row.fAmount"
  677. placeholder="金额"
  678. v-input-limit="2"
  679. :disabled="true"
  680. />
  681. </template>
  682. </el-table-column>
  683. <el-table-column label="税率" align="center" prop="fTaxrate">
  684. <template slot-scope="scope">
  685. <el-input
  686. v-model="scope.row.fTaxrate"
  687. placeholder="税率"
  688. v-input-limit="2"
  689. :disabled="disabled"
  690. />
  691. </template>
  692. </el-table-column>
  693. <el-table-column label="备注" align="center" prop="remarks">
  694. <template slot-scope="scope">
  695. <el-input
  696. v-model="scope.row.remarks"
  697. placeholder="备注"
  698. :disabled="disabled"
  699. />
  700. </template>
  701. </el-table-column>
  702. <el-table-column
  703. label="操作"
  704. align="center"
  705. class-name="small-padding fixed-width"
  706. width="100"
  707. >
  708. <template slot-scope="scope">
  709. <el-button
  710. size="mini"
  711. type="text"
  712. icon="el-icon-delete"
  713. @click.native.prevent="deleteRow(scope.$index, DList)"
  714. :disabled="disabled"
  715. >删除</el-button
  716. >
  717. </template>
  718. </el-table-column>
  719. </el-table>
  720. </div>
  721. </el-collapse-item>
  722. <el-collapse-item v-if="userType == '00'">
  723. <template slot="title">
  724. <i class="header-icon el-icon-circle-plus" style="font-size: 16px"
  725. ><span
  726. style="font-size: 16px; font-weight: bolder; margin-left: 5px"
  727. >付款信息</span
  728. >
  729. </i>
  730. </template>
  731. <div>
  732. <div
  733. style="
  734. display: flex;
  735. justify-content: space-between;
  736. margin: 10px 0;
  737. "
  738. >
  739. <div>
  740. <el-button
  741. type="primary"
  742. icon="el-icon-plus"
  743. size="mini"
  744. @click="addDListRow(CList)"
  745. :disabled="disabled"
  746. >添加</el-button
  747. >
  748. </div>
  749. </div>
  750. <el-table :data="CList">
  751. <el-table-column label="结算单位" align="center" prop="fCorpid">
  752. <template slot-scope="scope">
  753. <el-select
  754. v-model="scope.row.fCorpid"
  755. placeholder="结算单位"
  756. :clearable="true"
  757. filterable
  758. :disabled="disabled"
  759. >
  760. <el-option
  761. v-for="(dict, index) in fMblnoOptions"
  762. :key="index.fId"
  763. :label="dict.fName"
  764. :value="dict.fId"
  765. />
  766. </el-select>
  767. </template>
  768. </el-table-column>
  769. <el-table-column label="费用名称" align="center" prop="fFeeid">
  770. <template slot-scope="scope">
  771. <el-select
  772. v-model="scope.row.fFeeid"
  773. placeholder="费用名称"
  774. clearable
  775. filterable
  776. :disabled="disabled"
  777. >
  778. <el-option
  779. v-for="(dict, index) in fWbuOptions"
  780. :key="index.fId"
  781. :label="dict.fName"
  782. :value="dict.fId"
  783. />
  784. </el-select>
  785. </template>
  786. </el-table-column>
  787. <el-table-column
  788. label="计费单位"
  789. align="center"
  790. prop="fFeeunitid"
  791. >
  792. <template slot-scope="scope">
  793. <el-select
  794. v-model="scope.row.fFeeunitid"
  795. placeholder="计费单位"
  796. :disabled="disabled"
  797. >
  798. <el-option
  799. v-for="(dict, index) in ffeeunitidList"
  800. :key="index.dictValue"
  801. :label="dict.dictLabel"
  802. :value="dict.dictValue"
  803. />
  804. </el-select>
  805. </template>
  806. </el-table-column>
  807. <el-table-column label="计费数量" align="center" prop="fQty">
  808. <template slot-scope="scope">
  809. <el-input
  810. v-model="scope.row.fQty"
  811. placeholder="计费数量"
  812. v-input-limit="0"
  813. :disabled="disabled"
  814. @input="total(scope.row)"
  815. />
  816. </template>
  817. </el-table-column>
  818. <el-table-column label="单价" align="center" prop="fUnitprice">
  819. <template slot-scope="scope">
  820. <el-input
  821. v-model="scope.row.fUnitprice"
  822. placeholder="单价"
  823. v-input-limit="2"
  824. :disabled="disabled"
  825. @input="total(scope.row)"
  826. />
  827. </template>
  828. </el-table-column>
  829. <el-table-column label="币种" align="center" prop="fCurrency">
  830. <template slot-scope="scope">
  831. <el-input
  832. v-model="scope.row.fCurrency"
  833. placeholder="RMB"
  834. :disabled="true"
  835. />
  836. </template>
  837. </el-table-column>
  838. <el-table-column label="汇率" align="center" prop="fExrate">
  839. <template slot-scope="scope">
  840. <el-input
  841. v-model="scope.row.fExrate"
  842. placeholder="汇率"
  843. v-input-limit="2"
  844. :disabled="disabled"
  845. />
  846. </template>
  847. </el-table-column>
  848. <el-table-column label="金额" align="center" prop="fAmount">
  849. <template slot-scope="scope">
  850. <el-input
  851. v-model="scope.row.fAmount"
  852. placeholder="金额"
  853. v-input-limit="2"
  854. :disabled="true"
  855. />
  856. </template>
  857. </el-table-column>
  858. <el-table-column label="税率" align="center" prop="fTaxrate">
  859. <template slot-scope="scope">
  860. <el-input
  861. v-model="scope.row.fTaxrate"
  862. placeholder="税率"
  863. v-input-limit="2"
  864. :disabled="disabled"
  865. />
  866. </template>
  867. </el-table-column>
  868. <el-table-column label="备注" align="center" prop="remarks">
  869. <template slot-scope="scope">
  870. <el-input
  871. v-model="scope.row.remarks"
  872. placeholder="备注"
  873. :disabled="disabled"
  874. />
  875. </template>
  876. </el-table-column>
  877. <el-table-column
  878. label="操作"
  879. align="center"
  880. class-name="small-padding fixed-width"
  881. width="100"
  882. >
  883. <template slot-scope="scope">
  884. <el-button
  885. size="mini"
  886. type="text"
  887. icon="el-icon-delete"
  888. @click.native.prevent="deleteRow(scope.$index, DList)"
  889. :disabled="disabled"
  890. >删除</el-button
  891. >
  892. </template>
  893. </el-table-column>
  894. </el-table>
  895. </div>
  896. </el-collapse-item>
  897. </el-collapse>
  898. </span>
  899. <span slot="footer" class="dialog-footer">
  900. <el-button type="primary" @click="submitForm">提 交</el-button>
  901. <el-button type="success" @click="submitAllowChanges">修 改</el-button>
  902. <el-button type="info" @click="submitSave">保 存</el-button>
  903. <el-button type="warning" @click="submitRetreat">撤 回</el-button>
  904. <el-button @click="showDialog = false">取 消</el-button>
  905. </span>
  906. </el-dialog>
  907. </template>
  908. <script>
  909. import {
  910. removeFtmsorderbillscars,
  911. driverSaveFtmsorderbillscars,
  912. insertDriverFtmsorderbillscars,
  913. } from "@/api/fleet/ftmsorderbillscars";
  914. import { listGoods } from "@/api/basicdata/goods";
  915. import { listCorps } from "@/api/basicdata/corps";
  916. import { listFees } from "@/api/basicdata/fees";
  917. import UploadFile from "@/components/Uploadfile";
  918. import Cookies from "js-cookie";
  919. import { getToken } from "@/utils/auth";
  920. export default {
  921. name: "plans",
  922. props: {
  923. addOrUpdateVisible: {
  924. type: Boolean,
  925. default: false,
  926. },
  927. title: {
  928. type: String,
  929. required: "",
  930. },
  931. form: Object,
  932. DList: {
  933. type: Array,
  934. default: [],
  935. },
  936. CList: {
  937. type: Array,
  938. default: [],
  939. },
  940. disabled: Boolean,
  941. },
  942. components: {
  943. UploadFile,
  944. },
  945. data() {
  946. return {
  947. // 控制弹出框显示隐藏
  948. showDialog: false,
  949. // 表单校验
  950. rules: {
  951. // fCorpId: [
  952. // { required: true, message: "请输入客户名称", trigger: "blur" },
  953. // ],
  954. // billType: [
  955. // { required: true, message: "请选择业务类型", trigger: "blur" },
  956. // ],
  957. // transType: [
  958. // { required: true, message: "请选择运输方式", trigger: "blur" },
  959. // ],
  960. // // loadAddr: [
  961. // // { required: true, message: "请输入提箱地点", trigger: "blur" },
  962. // // ],
  963. // loadAttntel: [
  964. // {
  965. // pattern: /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/,
  966. // message: "请正确输入手机号",
  967. // trigger: "blur",
  968. // },
  969. // ],
  970. // mdLoadAttnTel: [
  971. // {
  972. // pattern: /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/,
  973. // message: "请正确输入手机号",
  974. // trigger: "blur",
  975. // },
  976. // ],
  977. // unLoadAttnTel: [
  978. // {
  979. // pattern: /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/,
  980. // message: "请正确输入手机号",
  981. // trigger: "blur",
  982. // },
  983. // ],
  984. },
  985. billTypeList: [],
  986. transTypeList: [],
  987. transPropList: [],
  988. goodsLossTypeList: [],
  989. relevantAttachments: [],
  990. cntrIdList: [],
  991. priceTypeList: [],
  992. userType: null,
  993. username: null,
  994. collapses: [],
  995. fMblnoOptions: [],
  996. cntrId2List: [],
  997. goodsOptions: [],
  998. fWbuOptions: [],
  999. ffeeunitidList: [],
  1000. polList: [],
  1001. podList: [],
  1002. uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址
  1003. headers: {
  1004. Authorization: "Bearer " + getToken(),
  1005. },
  1006. };
  1007. },
  1008. created() {
  1009. this.getDicts("data_billType").then((response) => {
  1010. this.billTypeList = response.data;
  1011. });
  1012. this.getDicts("data_transType").then((response) => {
  1013. this.transTypeList = response.data;
  1014. });
  1015. this.getDicts("data_transProp").then((response) => {
  1016. this.transPropList = response.data;
  1017. });
  1018. this.getDicts("data_goodsLossType").then((response) => {
  1019. this.goodsLossTypeList = response.data;
  1020. });
  1021. this.getDicts("data_cntrId").then((response) => {
  1022. response.data.map((e) => (e.noOption = false));
  1023. this.cntrIdList = response.data;
  1024. });
  1025. this.getDicts("data_priceType").then((response) => {
  1026. this.priceTypeList = response.data;
  1027. });
  1028. this.getDicts("data_ffeeunitid").then((response) => {
  1029. this.ffeeunitidList = response.data;
  1030. });
  1031. this.getDicts("port_start").then((response) => {
  1032. this.polList = response.data;
  1033. });
  1034. this.getDicts("port_end").then((response) => {
  1035. this.podList = response.data;
  1036. });
  1037. listCorps().then((response) => {
  1038. this.fMblnoOptions = response.rows;
  1039. });
  1040. listGoods().then((response) => {
  1041. this.goodsOptions = response.rows;
  1042. });
  1043. listFees().then((response) => {
  1044. this.fWbuOptions = response.rows;
  1045. });
  1046. this.userType = Cookies.get("userType");
  1047. this.username = Cookies.get("userName");
  1048. },
  1049. methods: {
  1050. // 新增附件上传
  1051. addRelevt() {
  1052. this.relevantAttachments.push({
  1053. attachUrl: null,
  1054. attachName: null,
  1055. opuserID: this.username,
  1056. opdata: Date.parse(new Date()),
  1057. });
  1058. },
  1059. //附件删除
  1060. deleteFile(scope) {
  1061. this.relevantAttachments[scope.$index].attachName = "";
  1062. this.relevantAttachments[scope.$index].attachUrl = "";
  1063. if (this.relevantAttachments[scope.$index].attachUrl === "") {
  1064. this.$message.success("删除成功");
  1065. } else {
  1066. this.$message.error("未知错误,删除失败");
  1067. }
  1068. },
  1069. //附件查看
  1070. checkFile(scope) {
  1071. if (this.relevantAttachments[scope.$index].attachUrl) {
  1072. window.open(this.relevantAttachments[scope.$index].attachUrl);
  1073. } else {
  1074. this.$message.error("请上传附件");
  1075. }
  1076. },
  1077. //附件上传
  1078. handleSucces(scope, res, file) {
  1079. this.relevantAttachments[scope.$index].attachName = res.fileName;
  1080. this.relevantAttachments[scope.$index].attachUrl = res.url;
  1081. if (this.relevantAttachments[scope.$index].attachUrl === "") {
  1082. this.$message.error("上传失败");
  1083. } else {
  1084. this.$message.success("上传成功");
  1085. }
  1086. },
  1087. // 添加行
  1088. addRow(tableData, event) {
  1089. var obj = {};
  1090. tableData.push(obj);
  1091. },
  1092. addDListRow(tableData, event) {
  1093. var obj = {
  1094. fcorpid: this.form.fCorpId,
  1095. fcurrency: "RMB",
  1096. fPid: this.form.id,
  1097. fExrate: "1",
  1098. };
  1099. tableData.push(obj);
  1100. },
  1101. //删除行
  1102. deleteRow(index, rows) {
  1103. rows.splice(index, 1);
  1104. },
  1105. // 上传成功返回数据
  1106. showFile(row) {
  1107. for (let list in this.relevantAttachments) {
  1108. this.$set(this.relevantAttachments[list], "attachUrl", row.url);
  1109. this.$set(this.relevantAttachments[list], "attachName", row.fileName);
  1110. }
  1111. },
  1112. // 弹出框关闭后触发
  1113. handleClose() {
  1114. // 子组件调用父组件方法,并传递参数
  1115. this.$emit("changeShow", "false");
  1116. this.cntrIdList.forEach((item) => (item.noOption = false));
  1117. this.collapses = [];
  1118. },
  1119. /** 提交按钮 */
  1120. submitForm() {
  1121. this.$refs["form"].validate((valid) => {
  1122. if (valid) {
  1123. this.DList.map((e) => {
  1124. return (e.fDc = "D");
  1125. });
  1126. this.CList.map((e) => {
  1127. return (e.fDc = "C");
  1128. });
  1129. let formData = new window.FormData();
  1130. formData.append("cars", JSON.stringify(this.form));
  1131. formData.append("attachs", JSON.stringify(this.relevantAttachments));
  1132. formData.append(
  1133. "fees",
  1134. JSON.stringify(this.DList.concat(this.CList))
  1135. );
  1136. formData.append("operationType", "waybillDate");
  1137. insertDriverFtmsorderbillscars(formData).then((response) => {
  1138. if (response.code == 200) {
  1139. this.msgSuccess("提交成功");
  1140. this.$parent.getList();
  1141. this.showDialog = false;
  1142. }
  1143. });
  1144. }
  1145. });
  1146. },
  1147. //修改
  1148. submitFix() {
  1149. this.$refs["form"].validate((valid) => {
  1150. if (valid) {
  1151. }
  1152. });
  1153. },
  1154. //保存
  1155. submitSave() {
  1156. this.DList.map((e) => {
  1157. return (e.fDc = "D");
  1158. });
  1159. this.CList.map((e) => {
  1160. return (e.fDc = "C");
  1161. });
  1162. let formData = new window.FormData();
  1163. formData.append("cars", JSON.stringify(this.form));
  1164. formData.append("attachs", JSON.stringify(this.relevantAttachments));
  1165. formData.append("fees", JSON.stringify(this.DList.concat(this.CList)));
  1166. formData.append("operationType", "waybillDate");
  1167. driverSaveFtmsorderbillscars(formData).then((response) => {
  1168. if (response.code == 200) {
  1169. this.msgSuccess("保存成功");
  1170. this.$parent.getList();
  1171. // this.$parent.getSave(response);
  1172. }
  1173. });
  1174. },
  1175. //撤回
  1176. submitRetreat() {},
  1177. //修改
  1178. submitAllowChanges() {
  1179. if(this.form.orderStatus<=80){
  1180. this.$emit("fixDisabled", "false");
  1181. this.msgSuccess("允许修改");
  1182. }else{
  1183. this.msgSuccess("不允许修改");
  1184. }
  1185. },
  1186. //单条订单调度提交
  1187. addscarsRow(row) {},
  1188. delscarsRow(index, rows, row) {
  1189. if (row.billStatus != 6 && row.id != null) {
  1190. removeFtmsorderbillscars(row).then((response) => {
  1191. if (response.code == 200) {
  1192. rows.splice(index, 1);
  1193. this.msgSuccess("成功删除");
  1194. }
  1195. });
  1196. } else {
  1197. rows.splice(index, 1);
  1198. }
  1199. },
  1200. revokescarsRow(index, rows, row) {},
  1201. changescarsRow(row) {},
  1202. total(row) {
  1203. console.log(row);
  1204. if (row.fQty && row.fUnitprice) {
  1205. this.$set(row, "fAmount", (row.fQty * row.fUnitprice).toFixed(2));
  1206. } else {
  1207. this.$set(row, "fAmount", 0);
  1208. }
  1209. },
  1210. },
  1211. watch: {
  1212. // 监听 addOrUpdateVisible 改变
  1213. addOrUpdateVisible(oldVal, newVal) {
  1214. this.showDialog = this.addOrUpdateVisible;
  1215. },
  1216. },
  1217. };
  1218. </script>