detailsPage.vue 36 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237
  1. <template>
  2. <div class="borderless">
  3. <div class="customer-head">
  4. <div class="customer-back">
  5. <el-button
  6. type="danger"
  7. style="border: none;background: none;color: red"
  8. icon="el-icon-arrow-left"
  9. @click="backToList"
  10. >返回列表
  11. </el-button>
  12. </div>
  13. <el-button type="info" class="sell-customer-btn" @click="saveSell"
  14. >生成采购单</el-button
  15. >
  16. <el-button type="success" class="copy-customer-btn" disabled>
  17. 复制新单
  18. </el-button>
  19. <el-button
  20. class="el-button--small-yh add-customer-btn"
  21. type="primary"
  22. :disabled="disabled"
  23. @click="editCustomer"
  24. >{{ form.id ? "确认修改" : "确认新增" }}
  25. </el-button>
  26. </div>
  27. <div style="margin-top: 60px;margin-bottom:35px">
  28. <containerTitle title="基础信息"></containerTitle>
  29. <basic-container>
  30. <avue-form ref="form" v-model="form" :option="option">
  31. <template slot="portOfLoad">
  32. <port-info
  33. v-model="form.portOfLoad"
  34. :disabled="detailData.status == 1"
  35. />
  36. </template>
  37. <template slot="portOfDestination">
  38. <port-info
  39. v-model="form.portOfDestination"
  40. :disabled="detailData.status == 1"
  41. />
  42. </template>
  43. <template slot="corpId">
  44. <select-component
  45. v-model="form.corpId"
  46. :configuration="configuration"
  47. :disabled="detailData.status == 1"
  48. ></select-component>
  49. </template>
  50. <template slot="boxNumber">
  51. <el-input
  52. size="mini"
  53. v-model="form.boxNumber"
  54. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d).*$/,
  55. "$1.$2")'
  56. placeholder="请输入 起订量"
  57. :disabled="detailData.status == 1"
  58. />
  59. </template>
  60. <template slot="minOrder">
  61. <el-input
  62. size="mini"
  63. v-model="form.minOrder"
  64. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d).*$/,
  65. "$1.$2")'
  66. placeholder="请输入 起订量"
  67. :disabled="detailData.status == 1"
  68. />
  69. </template>
  70. <template slot="predictOceanFreight">
  71. <el-input
  72. size="mini"
  73. v-model="form.predictOceanFreight"
  74. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d).*$/,
  75. "$1.$2")'
  76. placeholder="请输入 预计海运费"
  77. :disabled="detailData.status == 1"
  78. />
  79. </template>
  80. <template slot="referenceOceanFreight">
  81. <el-input
  82. size="mini"
  83. v-model="form.referenceOceanFreight"
  84. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d).*$/,
  85. "$1.$2")'
  86. placeholder="请输入 参考海运费"
  87. :disabled="detailData.status == 1"
  88. />
  89. </template>
  90. <template slot="oceanFreight">
  91. <el-input
  92. size="mini"
  93. v-model="form.oceanFreight"
  94. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d).*$/,
  95. "$1.$2")'
  96. placeholder="请输入 实际海运费"
  97. :disabled="detailData.status == 1"
  98. />
  99. </template>
  100. </avue-form>
  101. </basic-container>
  102. <div>
  103. <containerTitle title="商品信息"></containerTitle>
  104. <basic-container>
  105. <avue-crud
  106. ref="crud"
  107. :data="data"
  108. :option="tableOption"
  109. @row-del="rowDel"
  110. @selection-change="goodsSelectionChange"
  111. @saveColumn="saveColumn"
  112. :summary-method="summaryMethod"
  113. >
  114. <template slot="cname" slot-scope="{ row, index }">
  115. <el-button
  116. size="small"
  117. type="text"
  118. @click="rePick(row, index)"
  119. :disabled="disabled"
  120. class="picker"
  121. style="padding:4px 10px;float:left"
  122. >选择</el-button
  123. >
  124. <span> {{ row.cname }}</span>
  125. </template>
  126. <template slot="itemType" slot-scope="{ row }">
  127. <el-select
  128. v-if="row.$cellEdit"
  129. v-model="row.itemType"
  130. filterable
  131. allow-create
  132. default-first-option
  133. placeholder="请输入"
  134. @focus="itemTypeFocus(row)"
  135. >
  136. <el-option
  137. v-for="(item, index) in itemtypeList"
  138. :key="index"
  139. :label="item.value"
  140. :value="item.value"
  141. >
  142. </el-option>
  143. </el-select>
  144. <span v-else>{{ row.itemType }}</span>
  145. </template>
  146. <template slot="priorityReferrer" slot-scope="{ row }">
  147. <el-checkbox
  148. :disabled="!row.$cellEdit"
  149. v-model="row.priorityReferrer"
  150. :true-label="1"
  151. :false-label="0"
  152. />
  153. </template>
  154. <template slot="corpId" slot-scope="{ row, index }">
  155. <customer-dialog
  156. v-if="row.$cellEdit"
  157. v-model="row.corpName"
  158. :cropIndex="index"
  159. @getcorpId="getcorpId"
  160. ></customer-dialog>
  161. <span v-else>{{ row.corpName }}</span>
  162. </template>
  163. <template slot="purchaseAmount" slot-scope="{ row }">
  164. <el-input
  165. v-if="row.$cellEdit"
  166. v-model="row.purchaseAmount"
  167. size="small"
  168. placeholder="请输入"
  169. @change="priceChange(row)"
  170. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d).*$/, "$1.$2")'
  171. ></el-input>
  172. <span v-else>{{ row.purchaseAmount | micrometerFormat }}</span>
  173. </template>
  174. <template slot="price" slot-scope="{ row }">
  175. <el-input
  176. v-if="row.$cellEdit"
  177. v-model="row.price"
  178. size="small"
  179. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d).*$/, "$1.$2")'
  180. @change="priceChange(row)"
  181. ></el-input>
  182. <span v-else>{{ row.price | micrometerFormat }}</span>
  183. </template>
  184. <template slot="amount" slot-scope="{ row }">
  185. <span>{{ row.amount | micrometerFormat }}</span>
  186. </template>
  187. <template slot="orderQuantity" slot-scope="{ row }">
  188. <el-input
  189. v-if="row.$cellEdit"
  190. v-model="row.orderQuantity"
  191. size="small"
  192. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d).*$/, "$1.$2")'
  193. @change="priceChange(row)"
  194. ></el-input>
  195. <span v-else>{{ row.orderQuantity }}</span>
  196. </template>
  197. <template slot="discount" slot-scope="{ row }">
  198. <el-input
  199. v-if="row.$cellEdit"
  200. v-model="row.discount"
  201. size="small"
  202. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d).*$/, "$1.$2")'
  203. @change="discountChange(row)"
  204. ></el-input>
  205. <span v-else>{{ row.discount | isDiscount }}</span>
  206. </template>
  207. <template slot="insurance" slot-scope="{ row }">
  208. <el-input
  209. v-if="row.$cellEdit"
  210. v-model="row.insurance"
  211. size="small"
  212. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d).*$/, "$1.$2")'
  213. @change="priceChange(row)"
  214. ></el-input>
  215. <span v-else>{{ row.insurance | micrometerFormat }}</span>
  216. </template>
  217. <template slot="freight" slot-scope="{ row }">
  218. <el-input
  219. v-if="row.$cellEdit"
  220. v-model="row.freight"
  221. size="small"
  222. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d).*$/, "$1.$2")'
  223. @change="priceChange(row)"
  224. ></el-input>
  225. <span v-else>{{ row.freight | micrometerFormat }}</span>
  226. </template>
  227. <template slot="taxRate" slot-scope="{ row }">
  228. <el-input
  229. v-if="row.$cellEdit"
  230. v-model="row.taxRate"
  231. size="small"
  232. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d).*$/, "$1.$2")'
  233. @change="taxRateChange(row)"
  234. ></el-input>
  235. <span v-else>{{ row.taxRate | isPercentage }}</span>
  236. </template>
  237. <template slot="menuLeft">
  238. <el-button
  239. type="primary"
  240. icon="el-icon-plus"
  241. size="small"
  242. @click.stop="newDetails"
  243. :disabled="detailData.status == 1"
  244. >新增明细</el-button
  245. >
  246. <el-button
  247. type="info"
  248. icon="el-icon-printer"
  249. size="small"
  250. @click.stop="openReport()"
  251. >报 表</el-button
  252. >
  253. <el-button
  254. type="warning"
  255. icon="el-icon-plus"
  256. size="small"
  257. :disabled="detailData.status == 1 || orderItemIds.length == 0"
  258. @click="getInvoice"
  259. >生成发货单
  260. </el-button>
  261. </template>
  262. <template slot="menu" slot-scope="{ row, index }">
  263. <el-button
  264. size="small"
  265. icon="el-icon-edit"
  266. type="text"
  267. @click="rowCell(row, index)"
  268. :disabled="disabled"
  269. >{{ row.$cellEdit ? "保存" : "修改" }}</el-button
  270. >
  271. <el-button
  272. size="small"
  273. icon="el-icon-edit"
  274. type="text"
  275. @click="rowDel(row, index)"
  276. :disabled="detailData.status == 1"
  277. >删 除</el-button
  278. >
  279. </template>
  280. </avue-crud>
  281. </basic-container>
  282. </div>
  283. <fee-info
  284. ref="feeInfo"
  285. :orderFeesList="orderFeesList"
  286. :disabled="detailData.status == 1"
  287. feeUrl="/blade-purchase-sales/orderfees/update"
  288. />
  289. <upload-file
  290. ref="uploadFile"
  291. title="合同附件"
  292. :orderFilesList="orderFilesList"
  293. :disabled="detailData.status == 1"
  294. delUrl="/blade-purchase-sales/orderfiles/update"
  295. />
  296. <div>
  297. <containerTitle title="银行信息"></containerTitle>
  298. <basic-container>
  299. <avue-form ref="form" v-model="form" :option="bankOption" />
  300. </basic-container>
  301. </div>
  302. <div>
  303. <containerTitle title="保险信息"></containerTitle>
  304. <basic-container>
  305. <avue-form ref="form" v-model="form" :option="insuranceOption" />
  306. </basic-container>
  307. </div>
  308. <div>
  309. <containerTitle title="唛头"></containerTitle>
  310. <basic-container>
  311. <avue-form ref="form" v-model="form" :option="markOption" />
  312. </basic-container>
  313. </div>
  314. </div>
  315. <el-dialog
  316. title="导入商品"
  317. append-to-body
  318. class="el-dialogDeep"
  319. :visible.sync="dialogVisible"
  320. width="60%"
  321. :close-on-click-modal="false"
  322. :destroy-on-close="true"
  323. :close-on-press-escape="false"
  324. @close="closeGoods"
  325. top="10vh"
  326. >
  327. <span>
  328. <el-row>
  329. <el-col :span="5">
  330. <div>
  331. <el-scrollbar>
  332. <basic-container style="margin-top:45px">
  333. <avue-tree :option="treeOption" @node-click="nodeClick" />
  334. </basic-container>
  335. </el-scrollbar>
  336. </div>
  337. </el-col>
  338. <el-col :span="19">
  339. <avue-crud
  340. :option="goodsOption"
  341. :table-loading="loading"
  342. :data="goodsList"
  343. ref="goodsCrud"
  344. @refresh-change="refreshChange"
  345. @selection-change="selectionChange"
  346. @row-click="rowClick"
  347. :page.sync="page"
  348. @on-load="onLoad"
  349. @saveColumn="saveGoodsColumn"
  350. ></avue-crud>
  351. </el-col>
  352. </el-row>
  353. </span>
  354. <span slot="footer" class="dialog-footer">
  355. <el-button @click="dialogVisible = false">取 消</el-button>
  356. <el-button
  357. type="primary"
  358. @click="importGoods"
  359. :disabled="selectionList.length == 0"
  360. >导入</el-button
  361. >
  362. </span>
  363. </el-dialog>
  364. <report-dialog
  365. :switchDialog="switchDialog"
  366. :reportId="form.id"
  367. reportName="客户询价"
  368. @onClose="onClose()"
  369. ></report-dialog>
  370. </div>
  371. </template>
  372. <script>
  373. import tableOption from "./config/customerContact.json";
  374. import goodsOption from "./config/commodity.json";
  375. import feeInfo from "@/components/fee-info/main";
  376. import uploadFile from "@/components/upload-file/main";
  377. import {
  378. detail,
  379. submit,
  380. delItem,
  381. getDeptLazyTree,
  382. getGoods,
  383. deliverGoods,
  384. getPorts,
  385. getSysNo,
  386. getSpecification,
  387. saveSell
  388. } from "@/api/basicData/salesContract";
  389. import _ from "lodash";
  390. import reportDialog from "@/components/report-dialog/main";
  391. import { micrometerFormat } from "@/util/validate";
  392. import { contrastObj, contrastList } from "@/util/contrastData";
  393. import customerDialog from "@/components/customer-dialog/main";
  394. export default {
  395. name: "detailsPageEdit",
  396. data() {
  397. return {
  398. configuration: {
  399. multipleChoices: false,
  400. multiple: false,
  401. collapseTags: false,
  402. placeholder: "请点击右边按钮选择",
  403. dicData: []
  404. },
  405. switchDialog: false,
  406. form: {
  407. orderStatus: "录入"
  408. },
  409. disabled: false,
  410. dialogVisible: false,
  411. tableOption: {},
  412. option: {
  413. menuBtn: false,
  414. labelWidth: 100,
  415. column: [
  416. {
  417. label: "客户名称",
  418. prop: "corpId",
  419. rules: [
  420. {
  421. required: true,
  422. message: "",
  423. trigger: "blur"
  424. }
  425. ],
  426. span: 16,
  427. slot: true
  428. },
  429. {
  430. label: "系统号",
  431. prop: "sysNo",
  432. span: 8,
  433. disabled: true
  434. },
  435. {
  436. label: "联系人",
  437. prop: "corpAttn",
  438. span: 8
  439. },
  440. {
  441. label: "电话",
  442. prop: "corpTel",
  443. span: 8
  444. },
  445. {
  446. label: "订单状态",
  447. prop: "orderStatus",
  448. span: 8,
  449. type: "select",
  450. dicUrl: "/api/blade-system/dict-biz/dictionary?code=order_status",
  451. props: {
  452. label: "dictValue",
  453. value: "dictValue"
  454. }
  455. },
  456. {
  457. label: "起运港",
  458. prop: "portOfLoad",
  459. span: 8,
  460. type: "select",
  461. filterable: true,
  462. dicData: [],
  463. props: {
  464. label: "name",
  465. value: "name"
  466. }
  467. },
  468. {
  469. label: "目的港",
  470. prop: "portOfDestination",
  471. span: 8,
  472. type: "select",
  473. filterable: true,
  474. dicData: [],
  475. props: {
  476. label: "name",
  477. value: "name"
  478. }
  479. },
  480. {
  481. label: "运输方式",
  482. prop: "transport",
  483. span: 8,
  484. type: "select",
  485. dicUrl: "/api/blade-system/dict-biz/dictionary?code=mode_transport",
  486. props: {
  487. label: "dictValue",
  488. value: "dictValue"
  489. }
  490. },
  491. {
  492. label: "价格条款",
  493. prop: "priceTerms",
  494. span: 8,
  495. type: "select",
  496. dicUrl: "/api/blade-system/dict-biz/dictionary?code=pricing_terms",
  497. props: {
  498. label: "dictValue",
  499. value: "dictValue"
  500. }
  501. },
  502. {
  503. label: "条款说明",
  504. prop: "priceTermsDescription",
  505. span: 16
  506. },
  507. {
  508. label: "收款方式",
  509. prop: "paymentType",
  510. span: 8,
  511. type: "select",
  512. dicUrl: "/api/blade-system/dict-biz/dictionary?code=payment_term",
  513. props: {
  514. label: "dictValue",
  515. value: "dictValue"
  516. }
  517. },
  518. {
  519. label: "收款说明",
  520. prop: "paymentTypeDescription",
  521. span: 16
  522. },
  523. {
  524. label: "订单日期",
  525. prop: "businesDate",
  526. span: 8,
  527. type: "date",
  528. format: "yyyy-MM-dd",
  529. valueFormat: "yyyy-MM-dd 00:00:00",
  530. rules: [
  531. {
  532. required: true,
  533. message: "",
  534. trigger: "blur"
  535. }
  536. ]
  537. },
  538. {
  539. label: "预交日期",
  540. prop: "dateValidity",
  541. span: 8,
  542. type: "date",
  543. format: "yyyy-MM-dd",
  544. valueFormat: "yyyy-MM-dd 00:00:00",
  545. row: true
  546. },
  547. {
  548. label: "币别",
  549. prop: "currency",
  550. span: 8,
  551. type: "select",
  552. dicUrl: "/api/blade-system/dict-biz/dictionary?code=currency",
  553. props: {
  554. label: "dictValue",
  555. value: "dictValue"
  556. },
  557. change: ({ value }) => {
  558. if (value == "CNY") {
  559. this.form.exchangeRate = 1;
  560. }
  561. if (value == "USD") {
  562. this.form.exchangeRate = 6.3843;
  563. }
  564. }
  565. },
  566. {
  567. label: "汇率",
  568. prop: "exchangeRate",
  569. span: 8,
  570. slot: true,
  571. row: true,
  572. disabled: true
  573. },
  574. {
  575. label: "箱型",
  576. prop: "boxPile",
  577. span: 8
  578. },
  579. {
  580. label: "箱量",
  581. prop: "boxNumber",
  582. span: 8
  583. },
  584. {
  585. label: "起订量",
  586. prop: "minOrder",
  587. span: 8
  588. },
  589. {
  590. label: "预计海运费",
  591. prop: "predictOceanFreight",
  592. span: 8
  593. },
  594. {
  595. label: "参考海运费",
  596. prop: "referenceOceanFreight",
  597. span: 8
  598. },
  599. {
  600. label: "实际海运费",
  601. prop: "oceanFreight",
  602. span: 8
  603. },
  604. {
  605. label: "毛利额",
  606. prop: "grossProfit",
  607. span: 8,
  608. disabled: true
  609. },
  610. {
  611. label: "毛利率",
  612. prop: "grossProfitRate",
  613. span: 8,
  614. row: true,
  615. append: "%",
  616. disabled: true
  617. },
  618. {
  619. label: "备注",
  620. prop: "orderRemark",
  621. type: "textarea",
  622. minRows: 2,
  623. span: 8
  624. },
  625. {
  626. label: "采购备注",
  627. prop: "purchaseRemark",
  628. type: "textarea",
  629. minRows: 2,
  630. span: 8
  631. },
  632. {
  633. label: "船务备注",
  634. prop: "shippingRemark",
  635. type: "textarea",
  636. minRows: 2,
  637. span: 8
  638. }
  639. ]
  640. },
  641. treeOption: {
  642. nodeKey: "id",
  643. lazy: true,
  644. treeLoad: function(node, resolve) {
  645. const parentId = node.level === 0 ? 0 : node.data.id;
  646. getDeptLazyTree(parentId).then(res => {
  647. resolve(
  648. res.data.data.map(item => {
  649. return {
  650. ...item,
  651. leaf: !item.hasChildren
  652. };
  653. })
  654. );
  655. });
  656. },
  657. addBtn: false,
  658. menu: false,
  659. size: "small",
  660. props: {
  661. label: "title",
  662. value: "value",
  663. children: "children"
  664. }
  665. },
  666. bankOption: {
  667. menuBtn: false,
  668. labelWidth: 100,
  669. column: [
  670. {
  671. label: "外币银行",
  672. prop: "banks",
  673. span: 8
  674. },
  675. {
  676. label: "银行信息",
  677. prop: "banksAccountName",
  678. span: 16,
  679. type: "textarea",
  680. minRows: 2
  681. }
  682. ]
  683. },
  684. insuranceOption: {
  685. menuBtn: false,
  686. labelWidth: 100,
  687. column: [
  688. {
  689. label: "保险描述",
  690. prop: "insuranceRemarks",
  691. span: 24,
  692. type: "textarea",
  693. minRows: 2
  694. }
  695. ]
  696. },
  697. markOption: {
  698. menuBtn: false,
  699. labelWidth: 100,
  700. column: [
  701. {
  702. label: "唛头描述",
  703. prop: "marks",
  704. span: 24,
  705. type: "textarea",
  706. minRows: 2
  707. }
  708. ]
  709. },
  710. page: {
  711. pageSize: 10,
  712. currentPage: 1,
  713. total: 0
  714. },
  715. loading: false,
  716. goodsOption: {},
  717. data: [],
  718. goodsList: [],
  719. selectionList: [],
  720. treeDeptId: null,
  721. orderFeesList: [],
  722. orderFilesList: [],
  723. orderItemIds: [],
  724. itemtypeList: [],
  725. reData: null
  726. };
  727. },
  728. props: {
  729. detailData: {
  730. type: Object
  731. }
  732. },
  733. components: {
  734. reportDialog,
  735. feeInfo,
  736. uploadFile,
  737. customerDialog
  738. },
  739. async created() {
  740. this.tableOption = await this.getColumnData(
  741. this.getColumnName(5),
  742. tableOption
  743. );
  744. this.goodsOption = await this.getColumnData(
  745. this.getColumnName(28),
  746. goodsOption
  747. );
  748. if (this.detailData.id) {
  749. this.getDetail(this.detailData.id);
  750. }
  751. if (this.detailData.status == 1) {
  752. this.option.disabled = true;
  753. this.bankOption.disabled = true;
  754. this.insuranceOption.disabled = true;
  755. this.markOption.disabled = true;
  756. }
  757. let _this = this;
  758. this.tableOption.column.forEach(e => {
  759. if (e.prop == "taxRate") {
  760. e.formatter = function(row) {
  761. return _this.textFormat(
  762. Number(row.taxRate ? row.taxRate : 0) / 100,
  763. "0.00%"
  764. );
  765. };
  766. }
  767. if (e.prop == "amount" || e.prop == "price") {
  768. e.formatter = function(row) {
  769. return _this.textFormat(
  770. Number(row.amount ? row.amount : 0),
  771. "#,##0.00"
  772. );
  773. };
  774. }
  775. });
  776. getPorts().then(res => {
  777. this.findObject(this.option.column, "portOfLoad").dicData = res.data;
  778. this.findObject(this.option.column, "portOfDestination").dicData =
  779. res.data;
  780. });
  781. this.getWorkDicts("product_properties").then(res => {
  782. this.findObject(this.tableOption.column, "itemProp").dicData =
  783. res.data.data;
  784. });
  785. },
  786. methods: {
  787. saveSell() {
  788. if (!this.form.id) {
  789. return this.$message.error("此单据没有提交记录,请先提交");
  790. }
  791. this.$confirm("是否生成采购单?", {
  792. confirmButtonText: "确定",
  793. cancelButtonText: "取消",
  794. type: "warning"
  795. }).then(() => {
  796. saveSell(this.form.id).then(res => {
  797. if (res.data.code == 200) {
  798. this.$message.success("生成成功");
  799. }
  800. });
  801. });
  802. },
  803. getcorpId(row) {
  804. this.data[row.index].corpId = row.id;
  805. },
  806. rePick(row, index) {
  807. this.reData = {
  808. ...row,
  809. index: index
  810. };
  811. this.newDetails();
  812. },
  813. rowCell(row, index) {
  814. if (row.$cellEdit == true) {
  815. this.$set(row, "$cellEdit", false);
  816. } else {
  817. this.$set(row, "$cellEdit", true);
  818. }
  819. },
  820. itemTypeFocus(row) {
  821. this.itemtypeList = [];
  822. getSpecification({ goodId: row.itemId }).then(res => {
  823. const data = res.data.data;
  824. this.itemtypeList = data.map(item => ({ value: item }));
  825. });
  826. },
  827. priceChange(row) {
  828. const sum = _.multiply(
  829. _.add(
  830. Number(
  831. _.multiply(
  832. row.price ? row.price : 0,
  833. row.orderQuantity ? row.orderQuantity : 0
  834. )
  835. ),
  836. Number(
  837. _.add(
  838. Number(row.insurance ? row.insurance : 0),
  839. Number(row.freight ? row.freight : 0)
  840. )
  841. )
  842. ),
  843. _.divide(row.discount ? row.discount : 10, 10)
  844. );
  845. row.amount = Number(sum ? sum : 0).toFixed(2);
  846. let amountSum = 0;
  847. let purchaseAmountSum = 0;
  848. let grossProfitRate = 0;
  849. this.data.forEach(e => {
  850. amountSum = _.add(amountSum, Number(e.amount));
  851. purchaseAmountSum = _.add(
  852. purchaseAmountSum,
  853. Number(
  854. _.multiply(
  855. Number(e.purchaseAmount ? e.purchaseAmount : 0),
  856. Number(e.orderQuantity)
  857. )
  858. )
  859. );
  860. this.form.grossProfit = _.subtract(amountSum, purchaseAmountSum);
  861. grossProfitRate = _.multiply(
  862. _.divide(_.subtract(amountSum, purchaseAmountSum), amountSum),
  863. 100
  864. );
  865. this.form.grossProfitRate = Number(
  866. grossProfitRate ? grossProfitRate : 0
  867. ).toFixed(2);
  868. });
  869. },
  870. quantityChange(row) {
  871. if (Number(row.orderQuantity) < Number(row.actualQuantity)) {
  872. row.orderQuantity = row.actualQuantity;
  873. this.$message.error("修改的数量不能低于发货数量");
  874. }
  875. if (!row.orderQuantity) {
  876. row.orderQuantity = 0;
  877. } else {
  878. row.amount = _.multiply(row.price, row.orderQuantity).toFixed(2);
  879. }
  880. },
  881. taxRateChange(row) {
  882. if (Number(row.taxRate) >= 100) {
  883. row.taxRate = 0;
  884. this.$message.error("税率不能超过100%");
  885. }
  886. },
  887. grossProfitRateChange(row) {
  888. if (row >= 100) {
  889. this.form.grossProfitRate = 0;
  890. this.$message.error("毛利率不能超过100%");
  891. }
  892. },
  893. rowSave(row) {
  894. console.log(row);
  895. this.$set(row, "$cellEdit", false);
  896. },
  897. rowDel(row, index) {
  898. this.$confirm("确定删除数据?", {
  899. confirmButtonText: "确定",
  900. cancelButtonText: "取消",
  901. type: "warning"
  902. }).then(() => {
  903. if (row.id) {
  904. delItem(row.id).then(res => {
  905. this.$message({
  906. type: "success",
  907. message: "删除成功!"
  908. });
  909. this.data.splice(index, 1);
  910. });
  911. } else {
  912. this.$message({
  913. type: "success",
  914. message: "删除成功!"
  915. });
  916. this.data.splice(index, 1);
  917. }
  918. });
  919. },
  920. importGoods() {
  921. if (this.reData) {
  922. console.log(this.reData);
  923. if (this.selectionList.length != 1) {
  924. return this.$message.error("重新选择的时候只能选择一条数据");
  925. } else {
  926. this.selectionList.forEach(e => {
  927. this.data.forEach((item, index) => {
  928. if (index == this.reData.index) {
  929. item.itemId = e.id;
  930. item.code = e.code;
  931. item.cname = e.cname;
  932. item.priceCategory = e.goodsTypeName;
  933. item.itemUrl = e.url;
  934. item.itemProp = this.reData.itemProp;
  935. item.itemDescription = e.cnameDescription;
  936. item.itemType = this.reData.itemType;
  937. item.tradeTerms = this.reData.tradeTerms;
  938. item.price = this.reData.price;
  939. item.orderQuantity = this.reData.orderQuantity;
  940. item.insurance = this.reData.insurance;
  941. item.freight = this.reData.freight;
  942. item.discount = this.reData.discount;
  943. item.amount = this.reData.amount;
  944. item.taxRate = this.reData.taxRate;
  945. item.unit = e.unit;
  946. item.remarks = this.reData.remarks;
  947. item.$cellEdit = true;
  948. }
  949. });
  950. });
  951. }
  952. } else {
  953. this.selectionList.forEach(e => {
  954. this.data.push({
  955. itemId: e.id,
  956. code: e.code,
  957. cname: e.cname,
  958. priceCategory: e.goodsTypeName,
  959. itemUrl: e.url,
  960. itemProp: null,
  961. itemDescription: e.cnameDescription,
  962. itemType: null,
  963. tradeTerms: null,
  964. price: 0,
  965. orderQuantity: 0,
  966. insurance: 0,
  967. freight: 0,
  968. discount: null,
  969. amount: 0,
  970. taxRate: 0,
  971. unit: e.unit,
  972. remarks: null,
  973. $cellEdit: true
  974. });
  975. });
  976. }
  977. this.dialogVisible = false;
  978. },
  979. closeGoods() {
  980. this.selectionList = [];
  981. this.treeDeptId = "";
  982. this.reData = null;
  983. },
  984. goodsSelectionChange(list) {
  985. this.orderItemIds = [];
  986. list.map(e => {
  987. this.orderItemIds.push(e.id);
  988. });
  989. console.log(this.orderItemIds);
  990. },
  991. selectionChange(list) {
  992. this.selectionList = list;
  993. },
  994. rowClick(row) {
  995. this.$refs.goodsCrud.toggleSelection([this.goodsList[row.$index]]);
  996. },
  997. nodeClick(data) {
  998. this.treeDeptId = data.id;
  999. this.page.currentPage = 1;
  1000. this.onLoad(this.page);
  1001. },
  1002. //费用查询
  1003. onLoad(page, params = {}) {
  1004. this.loading = true;
  1005. getGoods(page.currentPage, page.pageSize, this.treeDeptId).then(res => {
  1006. const data = res.data.data;
  1007. this.page.total = data.total;
  1008. this.goodsList = data.records;
  1009. this.loading = false;
  1010. if (this.page.total) {
  1011. this.goodsOption.height = window.innerHeight - 550;
  1012. } else {
  1013. this.goodsOption.height = window.innerHeight - 475;
  1014. }
  1015. });
  1016. },
  1017. //商品明细导入
  1018. newDetails() {
  1019. this.dialogVisible = !this.dialogVisible;
  1020. },
  1021. getDetail(id) {
  1022. detail(id).then(res => {
  1023. this.form = res.data.data;
  1024. this.data = res.data.data.orderItemsList;
  1025. this.orderFeesList = res.data.data.orderFeesList;
  1026. this.orderFilesList = res.data.data.orderFilesList;
  1027. this.configuration.dicData = this.form.corpName;
  1028. });
  1029. },
  1030. //修改提交触发
  1031. editCustomer() {
  1032. this.$refs["form"].validate((valid, done) => {
  1033. done();
  1034. if (valid) {
  1035. const orderFeesList = this.$refs.feeInfo.submitData();
  1036. for (let i = 0; i < orderFeesList.length; i++) {
  1037. if (orderFeesList[i].corpId == null) {
  1038. return this.$message.error(`请输入第${i + 1}行的结算中心`);
  1039. }
  1040. if (orderFeesList[i].price == 0) {
  1041. return this.$message.error(`请正确输入第${i + 1}行的价格`);
  1042. }
  1043. if (orderFeesList[i].quantity == 0) {
  1044. return this.$message.error(`请正确输入第${i + 1}行的数量`);
  1045. }
  1046. }
  1047. const orderFilesList = this.$refs.uploadFile.submitData();
  1048. submit({
  1049. ...this.form,
  1050. orderItemsList: this.data,
  1051. orderFeesList: orderFeesList,
  1052. orderFilesList: orderFilesList
  1053. }).then(res => {
  1054. this.form = res.data.data;
  1055. this.data = res.data.data.orderItemsList;
  1056. this.orderFeesList = res.data.data.orderFeesList;
  1057. this.orderFilesList = res.data.data.orderFilesList;
  1058. this.$message.success(this.form.id ? "修改成功" : "提交成功");
  1059. });
  1060. } else {
  1061. return false;
  1062. }
  1063. });
  1064. },
  1065. //返回列表
  1066. backToList() {
  1067. this.$emit("goBack");
  1068. },
  1069. openReport() {
  1070. this.switchDialog = !this.switchDialog;
  1071. },
  1072. onClose(val) {
  1073. this.switchDialog = val;
  1074. },
  1075. getInvoice() {
  1076. if (this.$store.getters.outStatus) {
  1077. this.$alert("出口发货单存在,请保存发货单再进行操作", "温馨提示", {
  1078. confirmButtonText: "确定",
  1079. type: "warning",
  1080. callback: action => {
  1081. console.log(action);
  1082. }
  1083. });
  1084. } else {
  1085. this.inInvoice();
  1086. }
  1087. },
  1088. inInvoice() {
  1089. const data = { id: this.form.id, orderItemIds: this.orderItemIds };
  1090. deliverGoods(data).then(res => {
  1091. if (res.data.code == 200) {
  1092. this.$message.success("生成成功");
  1093. if (data) {
  1094. const data = res.data.data;
  1095. data.orderItemsList.forEach(e => {
  1096. e.actualQuantity = e.orderQuantity;
  1097. e.contractAmount = e.amount;
  1098. e.srcId = e.id;
  1099. e.specificationAndModel = e.itemType;
  1100. delete e.id;
  1101. delete e.version;
  1102. delete e.status;
  1103. delete e.createUser;
  1104. delete e.createTime;
  1105. delete e.updateUser;
  1106. delete e.updateTime;
  1107. delete e.isDeleted;
  1108. });
  1109. delete data.id;
  1110. delete data.version;
  1111. delete data.status;
  1112. delete data.createUser;
  1113. delete data.createTime;
  1114. delete data.updateUser;
  1115. delete data.updateTime;
  1116. delete data.isDeleted;
  1117. delete data.orderStatus;
  1118. data.deliveryStatus = "录入";
  1119. data.srcOrderNo = data.sysNo;
  1120. delete data.sysNo;
  1121. this.$router.$avueRouter.closeTag("/exportTrade/invoice/index");
  1122. this.$router.push({
  1123. path: "/exportTrade/invoice/index",
  1124. query: {
  1125. pageType: "Generate",
  1126. data: JSON.stringify(data)
  1127. }
  1128. });
  1129. }
  1130. }
  1131. });
  1132. },
  1133. async saveColumn() {
  1134. const inSave = await this.saveColumnData(
  1135. this.getColumnName(5),
  1136. this.tableOption
  1137. );
  1138. if (inSave) {
  1139. this.$message.success("保存成功");
  1140. //关闭窗口
  1141. this.$refs.crud.$refs.dialogColumn.columnBox = false;
  1142. }
  1143. },
  1144. summaryMethod({ columns, data }) {
  1145. const sums = [];
  1146. if (columns.length > 0) {
  1147. columns.forEach((item, index) => {
  1148. sums[0] = "合计";
  1149. if (item.property == "orderQuantity" || item.property == "amount") {
  1150. let qtySum = 0;
  1151. let amountSum = 0;
  1152. data.forEach(e => {
  1153. qtySum = _.add(qtySum, Number(e.orderQuantity));
  1154. amountSum = _.add(amountSum, Number(e.amount));
  1155. });
  1156. //数量总计
  1157. if (item.property == "orderQuantity") {
  1158. sums[index] = qtySum ? qtySum.toFixed(2) : "0.00";
  1159. }
  1160. //金额总计
  1161. if (item.property == "amount") {
  1162. sums[index] = micrometerFormat(amountSum);
  1163. }
  1164. }
  1165. });
  1166. }
  1167. return sums;
  1168. },
  1169. async saveGoodsColumn() {
  1170. const inSave = await this.saveColumnData(
  1171. this.getColumnName(28),
  1172. this.goodsOption
  1173. );
  1174. if (inSave) {
  1175. this.$message.success("保存成功");
  1176. //关闭窗口
  1177. this.$refs.goodsCrud.$refs.dialogColumn.columnBox = false;
  1178. }
  1179. }
  1180. }
  1181. };
  1182. </script>
  1183. <style lang="scss" scoped>
  1184. .customer-head {
  1185. position: fixed;
  1186. top: 105px;
  1187. width: 100%;
  1188. margin-left: -10px;
  1189. height: 62px;
  1190. background: #ffffff;
  1191. box-shadow: 0 4px 12px 0px rgba(232, 232, 235, 1);
  1192. z-index: 999;
  1193. }
  1194. .customer-back {
  1195. cursor: pointer;
  1196. line-height: 62px;
  1197. font-size: 16px;
  1198. color: #323233;
  1199. font-weight: 400;
  1200. }
  1201. .back-icon {
  1202. line-height: 64px;
  1203. font-size: 20px;
  1204. margin-right: 8px;
  1205. }
  1206. .sell-customer-btn {
  1207. position: fixed;
  1208. right: 244px;
  1209. top: 115px;
  1210. }
  1211. .copy-customer-btn {
  1212. position: fixed;
  1213. right: 140px;
  1214. top: 115px;
  1215. }
  1216. .add-customer-btn {
  1217. position: fixed;
  1218. right: 36px;
  1219. top: 115px;
  1220. }
  1221. ::v-deep .el-form-item {
  1222. margin-bottom: 8px;
  1223. }
  1224. ::v-deep .el-form-item__error {
  1225. display: none;
  1226. }
  1227. ::v-deep .select-component {
  1228. display: flex;
  1229. }
  1230. </style>