AddOrUpdate.vue 43 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305
  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="90px">
  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.fId"
  283. :label="dict.fName"
  284. :value="dict.fId"
  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.fId"
  303. :label="dict.fName"
  304. :value="dict.fId"
  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 { getBasicInformation } from "@/api/kaihe/basicdata/container";
  992. import { listGoods } from "@/api/basicdata/goods";
  993. import { listCorps } from "@/api/basicdata/corps";
  994. import { listFees } from "@/api/basicdata/fees";
  995. import UploadFile from "@/components/Uploadfile";
  996. import Cookies from "js-cookie";
  997. import { getToken } from "@/utils/auth";
  998. export default {
  999. name: "plans",
  1000. props: {
  1001. addOrUpdateVisible: {
  1002. type: Boolean,
  1003. default: false,
  1004. },
  1005. title: {
  1006. type: String,
  1007. required: "",
  1008. },
  1009. form: Object,
  1010. DList: {
  1011. type: Array,
  1012. default: [],
  1013. },
  1014. CList: {
  1015. type: Array,
  1016. default: [],
  1017. },
  1018. disabled: Boolean,
  1019. },
  1020. components: {
  1021. UploadFile,
  1022. },
  1023. data() {
  1024. return {
  1025. // 控制弹出框显示隐藏
  1026. showDialog: false,
  1027. // 表单校验
  1028. rules: {
  1029. // fCorpId: [
  1030. // { required: true, message: "请输入客户名称", trigger: "blur" },
  1031. // ],
  1032. // billType: [
  1033. // { required: true, message: "请选择业务类型", trigger: "blur" },
  1034. // ],
  1035. // transType: [
  1036. // { required: true, message: "请选择运输方式", trigger: "blur" },
  1037. // ],
  1038. // loadAddr: [
  1039. // { required: true, message: "请输入提箱地点", trigger: "blur" },
  1040. // ],
  1041. // loadAttntel: [
  1042. // {
  1043. // pattern: /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/,
  1044. // message: "请正确输入手机号",
  1045. // trigger: "blur",
  1046. // },
  1047. // ],
  1048. // mdLoadAttnTel: [
  1049. // {
  1050. // pattern: /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/,
  1051. // message: "请正确输入手机号",
  1052. // trigger: "blur",
  1053. // },
  1054. // ],
  1055. // unLoadAttnTel: [
  1056. // {
  1057. // pattern: /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/,
  1058. // message: "请正确输入手机号",
  1059. // trigger: "blur",
  1060. // },
  1061. // ],
  1062. },
  1063. billTypeList: [],
  1064. transTypeList: [],
  1065. transPropList: [],
  1066. goodsLossTypeList: [],
  1067. relevantAttachments: [],
  1068. cntrIdList: [],
  1069. priceTypeList: [],
  1070. userType: null,
  1071. username: null,
  1072. collapses: [],
  1073. fMblnoOptions: [],
  1074. cntrId2List: [],
  1075. goodsOptions: [],
  1076. fWbuOptions: [],
  1077. ffeeunitidList: [],
  1078. polList: [],
  1079. podList: [],
  1080. uploadImgUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址
  1081. headers: {
  1082. Authorization: "Bearer " + getToken(),
  1083. },
  1084. };
  1085. },
  1086. created() {
  1087. this.getDicts("data_billType").then((response) => {
  1088. this.billTypeList = response.data;
  1089. });
  1090. this.getDicts("data_transType").then((response) => {
  1091. this.transTypeList = response.data;
  1092. });
  1093. this.getDicts("data_transProp").then((response) => {
  1094. this.transPropList = response.data;
  1095. });
  1096. this.getDicts("data_goodsLossType").then((response) => {
  1097. this.goodsLossTypeList = response.data;
  1098. });
  1099. this.getDicts("data_cntrId").then((response) => {
  1100. response.data.map((e) => (e.noOption = false));
  1101. this.cntrIdList = response.data;
  1102. });
  1103. this.getDicts("data_priceType").then((response) => {
  1104. this.priceTypeList = response.data;
  1105. });
  1106. this.getDicts("data_ffeeunitid").then((response) => {
  1107. this.ffeeunitidList = response.data;
  1108. });
  1109. getBasicInformation({
  1110. fTypes: 1,
  1111. fStatus: "T",
  1112. }).then((response) => {
  1113. this.polList = response;
  1114. this.podList = response;
  1115. });
  1116. listCorps().then((response) => {
  1117. this.fMblnoOptions = response.rows;
  1118. });
  1119. listGoods().then((response) => {
  1120. this.goodsOptions = response.rows;
  1121. });
  1122. listFees().then((response) => {
  1123. this.fWbuOptions = response.rows;
  1124. });
  1125. this.userType = Cookies.get("userType");
  1126. this.username = Cookies.get("userName");
  1127. },
  1128. methods: {
  1129. // 新增附件上传
  1130. addRelevt() {
  1131. this.relevantAttachments.push({
  1132. attachUrl: null,
  1133. attachName: null,
  1134. opuserID: this.username,
  1135. opdata: Date.parse(new Date()),
  1136. });
  1137. },
  1138. //附件删除
  1139. deleteFile(scope) {
  1140. this.relevantAttachments[scope.$index].attachName = "";
  1141. this.relevantAttachments[scope.$index].attachUrl = "";
  1142. if (this.relevantAttachments[scope.$index].attachUrl === "") {
  1143. this.$message.success("删除成功");
  1144. } else {
  1145. this.$message.error("未知错误,删除失败");
  1146. }
  1147. },
  1148. //附件查看
  1149. checkFile(scope) {
  1150. if (this.relevantAttachments[scope.$index].attachUrl) {
  1151. window.open(this.relevantAttachments[scope.$index].attachUrl);
  1152. } else {
  1153. this.$message.error("请上传附件");
  1154. }
  1155. },
  1156. //附件上传
  1157. handleSucces(scope, res, file) {
  1158. this.relevantAttachments[scope.$index].attachName = res.fileName;
  1159. this.relevantAttachments[scope.$index].attachUrl = res.url;
  1160. if (this.relevantAttachments[scope.$index].attachUrl === "") {
  1161. this.$message.error("上传失败");
  1162. } else {
  1163. this.$message.success("上传成功");
  1164. }
  1165. },
  1166. // 添加行
  1167. addRow(tableData, event) {
  1168. var obj = {};
  1169. tableData.push(obj);
  1170. },
  1171. addDListRow(tableData, event) {
  1172. var obj = {
  1173. fcorpid: this.form.fCorpId,
  1174. fcurrency: "RMB",
  1175. fPid: this.form.id,
  1176. fExrate: "1",
  1177. };
  1178. tableData.push(obj);
  1179. },
  1180. //删除行
  1181. deleteRow(index, rows) {
  1182. rows.splice(index, 1);
  1183. },
  1184. // 上传成功返回数据
  1185. showFile(row) {
  1186. for (let list in this.relevantAttachments) {
  1187. this.$set(this.relevantAttachments[list], "attachUrl", row.url);
  1188. this.$set(this.relevantAttachments[list], "attachName", row.fileName);
  1189. }
  1190. },
  1191. // 弹出框关闭后触发
  1192. handleClose() {
  1193. // 子组件调用父组件方法,并传递参数
  1194. this.$emit("changeShow", "false");
  1195. this.cntrIdList.forEach((item) => (item.noOption = false));
  1196. this.collapses = [];
  1197. },
  1198. /** 提交按钮 */
  1199. submitForm() {
  1200. this.$refs["form"].validate((valid) => {
  1201. if (valid) {
  1202. this.DList.map((e) => {
  1203. return (e.fDc = "D");
  1204. });
  1205. this.CList.map((e) => {
  1206. return (e.fDc = "C");
  1207. });
  1208. let formData = new window.FormData();
  1209. formData.append("cars", JSON.stringify(this.form));
  1210. formData.append("attachs", JSON.stringify(this.relevantAttachments));
  1211. formData.append(
  1212. "fees",
  1213. JSON.stringify(this.DList.concat(this.CList))
  1214. );
  1215. formData.append("operationType", "acceptDate");
  1216. insertDriverFtmsorderbillscars(formData).then((response) => {
  1217. if (response.code == 200) {
  1218. this.msgSuccess("提交成功");
  1219. this.$parent.getList();
  1220. this.showDialog = false;
  1221. }
  1222. });
  1223. }
  1224. });
  1225. },
  1226. //修改
  1227. submitFix() {
  1228. this.$refs["form"].validate((valid) => {
  1229. if (valid) {
  1230. }
  1231. });
  1232. },
  1233. //保存
  1234. submitSave() {
  1235. this.DList.map((e) => {
  1236. return (e.fDc = "D");
  1237. });
  1238. this.CList.map((e) => {
  1239. return (e.fDc = "C");
  1240. });
  1241. let formData = new window.FormData();
  1242. formData.append("cars", JSON.stringify(this.form));
  1243. formData.append("attachs", JSON.stringify(this.relevantAttachments));
  1244. formData.append("fees", JSON.stringify(this.DList.concat(this.CList)));
  1245. formData.append("operationType", "acceptDate");
  1246. driverSaveFtmsorderbillscars(formData).then((response) => {
  1247. if (response.code == 200) {
  1248. this.msgSuccess("保存成功");
  1249. this.$parent.getList();
  1250. // this.$parent.getSave(response);
  1251. }
  1252. });
  1253. },
  1254. //撤回
  1255. submitRetreat() {},
  1256. //修改
  1257. submitAllowChanges() {
  1258. if (this.form.orderStatus <= 20) {
  1259. this.$emit("fixDisabled", "false");
  1260. this.msgSuccess("允许修改");
  1261. } else {
  1262. this.msgSuccess("不允许修改");
  1263. }
  1264. },
  1265. //单条订单调度提交
  1266. addscarsRow(row) {},
  1267. delscarsRow(index, rows, row) {
  1268. if (row.billStatus != 6 && row.id != null) {
  1269. removeFtmsorderbillscars(row).then((response) => {
  1270. if (response.code == 200) {
  1271. rows.splice(index, 1);
  1272. this.msgSuccess("成功删除");
  1273. }
  1274. });
  1275. } else {
  1276. rows.splice(index, 1);
  1277. }
  1278. },
  1279. revokescarsRow(index, rows, row) {},
  1280. changescarsRow(row) {},
  1281. total(row) {
  1282. console.log(row);
  1283. if (row.fQty && row.fUnitprice) {
  1284. this.$set(row, "fAmount", (row.fQty * row.fUnitprice).toFixed(2));
  1285. } else {
  1286. this.$set(row, "fAmount", 0);
  1287. }
  1288. },
  1289. },
  1290. watch: {
  1291. // 监听 addOrUpdateVisible 改变
  1292. addOrUpdateVisible(oldVal, newVal) {
  1293. this.showDialog = this.addOrUpdateVisible;
  1294. },
  1295. },
  1296. };
  1297. </script>