detailsPage.vue 39 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210
  1. <template>
  2. <div class="borderless">
  3. <div class="customer-head">
  4. <div class="customer-back">
  5. <el-button type="danger" style="border: none;background: none;color: red" icon="el-icon-arrow-left"
  6. @click="backToList">返回列表
  7. </el-button>
  8. </div>
  9. <div class="upper_right_button">
  10. <el-button type="primary"
  11. class="el-button--small-yh add-customer-btn-five"
  12. :disabled="true"
  13. @click.stop="">请核
  14. </el-button>
  15. <el-button type="warning"
  16. class="el-button--small-yh add-customer-btn-four"
  17. @click.stop="applyPayment()">申请货款
  18. </el-button>
  19. <el-button type="warning"
  20. class="el-button--small-yh add-customer-btn-three"
  21. @click.stop="">生成销售单
  22. </el-button>
  23. <el-button type="success"
  24. class="el-button--small-yh add-customer-btn-two"
  25. :disabled="true"
  26. @click.stop="">复制新单
  27. </el-button>
  28. <el-button
  29. class="el-button--small-yh add-customer-btn"
  30. type="primary"
  31. :disabled="disabled"
  32. @click="editCustomer"
  33. :loading="editCustomerLoading"
  34. >{{form.id?'确认修改':'确认新增'}}
  35. </el-button>
  36. </div>
  37. </div>
  38. <div style="margin-top: 60px">
  39. <el-form :model="form" ref="form" label-width="130px">
  40. <containerTitle title="基础信息"></containerTitle>
  41. <basic-container style="margin-bottom: 10px">
  42. <el-row>
  43. <el-col v-for="(item, index) in basicData.column" :span="item.span?item.span:8" :key="index">
  44. <el-form-item :label="item.label" :prop="item.prop" :rules="item.rules">
  45. <el-date-picker v-if="item.type === 'date'" style="width: 100%;" v-model="form[item.prop]" size="small" type="date" placeholder="选择日期" value-format="yyyy-MM-dd HH:mm:ss"/>
  46. <el-select v-else-if="item.type === 'select'" style="width: 100%" v-model="form[item.prop]" size="small" placeholder="请选择" clearable filterable>
  47. <el-option
  48. v-for="(data, index) in item.dicData"
  49. :key="index"
  50. :label="data.label"
  51. :value="data.value"
  52. ></el-option>
  53. </el-select>
  54. <el-input type="age" v-else-if="item.prop === 'orderAmount'" v-model="form[item.prop]" :disabled="item.disabled?true:false" size="small" autocomplete="off" @input="currencyChange" placeholder="请输入"></el-input>
  55. <selectComponent v-else-if="item.prop === 'corpId'" v-model="form[item.prop]" :configuration="configuration"/>
  56. <selectComponent v-else-if="item.prop === 'purchaserId'" v-model="form[item.prop]" :configuration="pConfiguration"/>
  57. <el-select v-else-if="item.prop === 'orderType'" style="width: 100%" v-model="form[item.prop]" size="small" placeholder="请选择" clearable filterable>
  58. <el-option v-for="(item,index) in contractTypeDic" :key="index" :label="item.dictValue" :value="item.dictValue"></el-option>
  59. </el-select>
  60. <el-select v-else-if="item.prop === 'currency'" style="width: 100%" v-model="form[item.prop]" size="small" placeholder="请选择" @change="currencyChange" clearable filterable>
  61. <el-option v-for="(item,index) in currencyDic" :key="index" :label="item.dictValue" :value="item.dictValue"></el-option>
  62. </el-select>
  63. <el-select v-else-if="item.prop === 'paymentType'" style="width: 100%" v-model="form[item.prop]" size="small" placeholder="请选择" clearable filterable>
  64. <el-option v-for="(item,index) in paymentTypeDic" :key="index" :label="item.dictValue" :value="item.dictValue"></el-option>
  65. </el-select>
  66. <el-input type="textarea" v-else-if="(item.prop === 'orderRemark')" v-model="form[item.prop]" size="small" autocomplete="off" placeholder="请输入"></el-input>
  67. <el-input type="age" v-else v-model="form[item.prop]" :disabled="item.disabled?true:false" size="small" autocomplete="off" placeholder="请输入"></el-input>
  68. </el-form-item>
  69. </el-col>
  70. </el-row>
  71. </basic-container>
  72. <!-- 采购明细-->
  73. <containerTitle title="采购明细"></containerTitle>
  74. <basic-container style="margin-bottom: 10px">
  75. <avue-crud
  76. :option="customerContact"
  77. v-model="contactsForm"
  78. :data="contactsData"
  79. ref="crudContact"
  80. @row-save="rowSave"
  81. @selection-change="selectionContact"
  82. @row-click="handleRowClick"
  83. @row-update="rowUpdate"
  84. @row-del="rowDel"
  85. @saveColumn="saveColumn"
  86. >
  87. <template slot="priceCategory" slot-scope="{row,index}">
  88. <span v-if="row.$cellEdit" class="required_fields">*</span>
  89. <el-input
  90. v-if="row.$cellEdit"
  91. v-model="row.priceCategoryNames"
  92. size="small"
  93. placeholder="请点击右侧按钮选择"
  94. :disabled="true"
  95. style="width: 63%"
  96. ></el-input>
  97. <el-button v-if="row.$cellEdit" size="small" icon="el-icon-search" @click="choice(row)"></el-button>
  98. <span v-else>{{ row.priceCategoryNames }}</span>
  99. </template>
  100. <template slot="itemType" slot-scope="{row,index}">
  101. <el-select
  102. v-if="row.$cellEdit"
  103. v-model="row.itemType"
  104. size="small"
  105. style="width:90% !important;"
  106. filterable
  107. allow-create
  108. default-first-option
  109. clearable
  110. >
  111. <el-option
  112. v-for="(item,index) in row.specificationList"
  113. :key="index"
  114. :label="item.value"
  115. :value="item.value"
  116. >
  117. </el-option>
  118. </el-select>
  119. <span v-else>{{ row.itemType }}</span>
  120. </template>
  121. <template slot="orderQuantity" slot-scope="{ row }">
  122. <span v-if="row.$cellEdit" class="required_fields">*</span>
  123. <el-input
  124. v-if="row.$cellEdit"
  125. v-model="row.orderQuantity"
  126. placeholder="请输入"
  127. size="small"
  128. style="width: 93%"
  129. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d).*$/, "$1.$2")'
  130. ></el-input>
  131. <span v-else>{{ row.orderQuantity }}</span>
  132. </template>
  133. <template slot="price" slot-scope="{ row }">
  134. <el-input
  135. v-if="row.$cellEdit"
  136. v-model="row.price"
  137. placeholder="请输入"
  138. size="small"
  139. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d).*$/, "$1.$2")'
  140. @input="priceChange(row)"
  141. ></el-input>
  142. <span v-else>{{ row.price }}</span>
  143. </template>
  144. <template slot="invoiceWeight" slot-scope="{ row }">
  145. <el-input
  146. v-if="row.$cellEdit"
  147. v-model="row.invoiceWeight"
  148. placeholder="请输入"
  149. size="small"
  150. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d\d\d\d\d).*$/, "$1.$2")'
  151. @input="invoiceWeightChange(row)"
  152. @change="totalChange(row.invoiceWeight)"
  153. ></el-input>
  154. <span v-else>{{ row.invoiceWeight }}</span>
  155. </template>
  156. <template slot="billWeight" slot-scope="{ row }">
  157. <el-input
  158. v-if="row.$cellEdit"
  159. v-model="row.billWeight"
  160. placeholder="请输入"
  161. size="small"
  162. oninput='this.value=this.value.replace(/[^(\d.)]/g,"").replace(/^(\d+)\.(\d\d\d\d\d\d).*$/, "$1.$2")'
  163. @change="totalChange(row.billWeight)"
  164. ></el-input>
  165. <span v-else>{{ row.billWeight }}</span>
  166. </template>
  167. <template slot-scope="{row,index}" slot="menu">
  168. <el-button
  169. type="text"
  170. size="small"
  171. :disabled="row.actualQuantity !=0"
  172. @click="rowCell(row,index)"
  173. >{{ row.$cellEdit ? '修改完成' : '修改' }}
  174. </el-button>
  175. <el-button
  176. type="text"
  177. size="small"
  178. :disabled="row.actualQuantity !=0"
  179. @click="rowDel(row,index)"
  180. >删除
  181. </el-button>
  182. </template>
  183. <template slot="menuLeft" slot-scope="{size}">
  184. <el-button type="primary"
  185. icon="el-icon-plus"
  186. size="small"
  187. @click="commoditySelection"
  188. >录入明细
  189. </el-button>
  190. <el-button type="warning"
  191. size="small"
  192. :disabled="selectContact.length == 0"
  193. @click="beforePage(false)"
  194. >生成收货单
  195. </el-button>
  196. <el-button type="info"
  197. size="small"
  198. @click="applicationDialog = true,applicationData = contactsData"
  199. >查看申请记录
  200. </el-button>
  201. </template>
  202. </avue-crud>
  203. </basic-container>
  204. <fee-info
  205. ref="feeInfo"
  206. :orderFeesList="orderFeesList"
  207. :billData="billData"
  208. :beforeBillData="beforeBillData"
  209. feeUrl=""
  210. />
  211. <upload-file
  212. ref="uploadFile"
  213. title="合同附件"
  214. :orderFilesList="orderFilesList"
  215. delUrl=""
  216. />
  217. </el-form>
  218. </div>
  219. <el-dialog
  220. title="导入商品详情"
  221. append-to-body
  222. class="el-dialogDeep"
  223. :visible.sync="dialogVisible"
  224. width="60%"
  225. :close-on-click-modal="false"
  226. :destroy-on-close="true"
  227. :close-on-press-escape="false"
  228. top="10vh"
  229. v-dialog-drag>
  230. <el-row style="height: 0;">
  231. <el-col :span="5">
  232. <div>
  233. <el-scrollbar>
  234. <basic-container>
  235. <avue-tree :option="treeOption" :data="treeData" @node-click="nodeClick"/>
  236. </basic-container>
  237. </el-scrollbar>
  238. </div>
  239. </el-col>
  240. <el-col :span="19">
  241. <basic-container>
  242. <avue-crud :option="optionTwo"
  243. :table-loading="loading"
  244. :data="data"
  245. ref="crud"
  246. @search-change="searchChange"
  247. @refresh-change="refreshChange"
  248. @selection-change="selectionChange"
  249. :page.sync="page"
  250. @on-load="onLoad"></avue-crud>
  251. </basic-container>
  252. </el-col>
  253. </el-row>
  254. <span slot="footer" class="dialog-footer">
  255. <el-button @click="dialogVisible = false , selectKind = -1">取 消</el-button>
  256. <el-button type="primary" @click="commodityConfirm" v-if="selectKind != -1" :disabled="tableData.length !== 1">确定</el-button>
  257. </span>
  258. </el-dialog>
  259. <el-dialog
  260. title="申请记录"
  261. append-to-body
  262. class="el-dialogDeep"
  263. :visible.sync="applicationDialog"
  264. width="60%"
  265. :close-on-click-modal="false"
  266. :destroy-on-close="true"
  267. :close-on-press-escape="false"
  268. v-dialog-drag
  269. >
  270. <basic-container>
  271. <avue-crud :option="customerContact"
  272. :table-loading="applicationLoading"
  273. :data="applicationData"
  274. ref="applicationCrud"
  275. @refresh-change="applicationRefreshChange"
  276. :page.sync="applicationPage"
  277. @on-load="applicationOnLoad"></avue-crud>
  278. </basic-container>
  279. <span slot="footer" class="dialog-footer">
  280. <el-button @click="applicationDialog = false ">关 闭</el-button>
  281. </span>
  282. </el-dialog>
  283. <el-dialog
  284. append-to-body
  285. class="el-dialogDeep"
  286. :visible.sync="applyPaymentDialog"
  287. width="60%"
  288. :close-on-click-modal="false"
  289. :destroy-on-close="true"
  290. :close-on-press-escape="false"
  291. v-dialog-drag
  292. >
  293. <apply-payment
  294. :billType="billType"
  295. :billData="billData"
  296. :choceFun="choceFun"
  297. >
  298. </apply-payment>
  299. </el-dialog>
  300. </div>
  301. </template>
  302. <script>
  303. import customerContact from "./config/customerContact.json"
  304. import uploadList from './config/uploadList.json'
  305. import advantageProject from "./config/advantageProject.json"
  306. import {getDeptLazyTree,customerList} from "@/api/basicData/basicFeesDesc";
  307. import optionTwoCost from "./config/mainListCost.json"
  308. import {detailListData, submitData,getSysNo} from "@/api/importTrade/purchase";
  309. import commodity from "./config/commodity.json"
  310. import feeInfo from "@/components/fee-info/main";
  311. import uploadFile from "@/components/upload-file/main";
  312. import _ from "lodash";
  313. //商品详情接口
  314. import {corpsattn, corpsbank, getDeptLazyTreeS} from "@/api/basicData/configuration"
  315. import { getList } from "@/api/basicData/commodityType"
  316. import { contrastObj,contrastList } from "@/util/contrastData";
  317. import {getSpecification} from "@/api/exportTrade/purchaseContract";
  318. import option from "./config/mainList.json";
  319. import ApplyPayment from "../../../components/finance/applyPayment";
  320. export default {
  321. name: "detailsPage",
  322. props: {
  323. detailData: {
  324. type: Object
  325. }
  326. },
  327. data() {
  328. return {
  329. form: {},
  330. disabled: false,
  331. customerContact: {},
  332. contactsForm: {},
  333. contactsData: [],
  334. editCustomerLoading:false,
  335. applyPaymentDialog:false,
  336. dialogVisible:false,
  337. commodityData: false,
  338. tableData: [],
  339. optionTwo: commodity,
  340. loading: false,
  341. data: [],
  342. billType:"申请",
  343. billData:{},
  344. page: {
  345. pageSize: 10,
  346. currentPage: 1,
  347. total: 0
  348. },
  349. contractTypeDic:[],
  350. currencyDic:[],
  351. selectContact:[],//选中采购明细
  352. selectKind: -1,//选择采购明细的货品
  353. paymentTypeDic:[],
  354. orderFeesList:[],
  355. orderFilesList:[],
  356. treeDeptId: '',
  357. treeOption: {
  358. nodeKey: 'id',
  359. lazy: true,
  360. treeLoad: function (node, resolve) {
  361. const parentId = (node.level === 0) ? 0 : node.data.id;
  362. getDeptLazyTreeS(parentId).then(res => {
  363. resolve(res.data.data.map(item => {
  364. return {
  365. ...item,
  366. leaf: !item.hasChildren
  367. }
  368. }))
  369. });
  370. },
  371. addBtn: false,
  372. menu: false,
  373. size: 'small',
  374. props: {
  375. labelText: '标题',
  376. label: 'title',
  377. value: 'value',
  378. children: 'children'
  379. }
  380. },
  381. configuration:{
  382. multipleChoices:false,
  383. multiple:false,
  384. disabled:false,
  385. searchShow:true,
  386. collapseTags:false,
  387. placeholder:'请点击右边按钮选择',
  388. dicData:[]
  389. },
  390. pConfiguration:{
  391. multipleChoices:false,
  392. multiple:false,
  393. disabled:false,
  394. searchShow:true,
  395. collapseTags:false,
  396. placeholder:'请点击右边按钮选择',
  397. dicData:[]
  398. },
  399. // 合同上传数据
  400. uploadList: uploadList,
  401. // 合同数据
  402. bankOfDepositData: [],
  403. bankOfDepositForm: {},
  404. // 其他费用
  405. advantageProject: advantageProject,
  406. advantageProjectData: [],
  407. advantageProjectForm: {},
  408. dialogCost: false,
  409. choiceData: false,
  410. treeOptionCost:{
  411. nodeKey: 'id',
  412. lazy: true,
  413. treeLoad: function (node, resolve) {
  414. const parentId = (node.level === 0) ? 0 : node.data.id;
  415. getDeptLazyTree(parentId).then(res => {
  416. resolve(res.data.data.map(item => {
  417. return {
  418. ...item,
  419. leaf: !item.hasChildren
  420. }
  421. }))
  422. });
  423. },
  424. addBtn: false,
  425. menu: false,
  426. size: 'small',
  427. props: {
  428. labelText: '标题',
  429. label: 'title',
  430. value: 'value',
  431. children: 'children'
  432. }
  433. },
  434. // 导入其他费用配置
  435. optionTwoCost: optionTwoCost,
  436. loadingCost: false,
  437. dataCost:[],
  438. pageCost:{
  439. pageSize: 10,
  440. currentPage: 1,
  441. total: 0
  442. },
  443. tableDataCost: [],
  444. treeDeptIdCost: '',
  445. choiceIndex: '',
  446. //查看申请记录
  447. applicationDialog:false,
  448. applicationLoading:false,
  449. applicationData:[],
  450. applicationPage:{
  451. pageSize: 10,
  452. currentPage: 1,
  453. total: 0
  454. },
  455. //对比新旧数据信息
  456. oldContactsData:[],
  457. oldForm:{},
  458. oldFeesList:[],
  459. oldFilesList:[],
  460. // 基础信息
  461. basicData: {
  462. column: [
  463. {
  464. label: '系统编号',
  465. prop: 'sysNo',
  466. disabled:true,
  467. rules: [
  468. {
  469. required: false,
  470. message: ' ',
  471. trigger: 'blur'
  472. }
  473. ]
  474. }, {
  475. label: '供应商',
  476. prop: 'corpId',
  477. span: 16,
  478. dicData: [],
  479. rules: [
  480. {
  481. required: true,
  482. message: ' ',
  483. trigger: 'blur'
  484. }
  485. ]
  486. },{
  487. label: '合同号',
  488. prop: 'orderNo',
  489. disabled:true,
  490. rules: [
  491. {
  492. required: false,
  493. message: ' ',
  494. trigger: 'blur'
  495. }
  496. ]
  497. }, {
  498. label: '采购商',
  499. prop: 'purchaserId',
  500. span: 16,
  501. dicData: [],
  502. rules: [
  503. {
  504. required: true,
  505. message: ' ',
  506. trigger: 'blur'
  507. }
  508. ]
  509. }, {
  510. label: '合同日期',
  511. prop: 'businesDate',
  512. type:'date',
  513. rules: [
  514. {
  515. required: false,
  516. message: ' ',
  517. trigger: 'blur'
  518. }
  519. ]
  520. }, {
  521. label: '合同类型',
  522. prop: 'orderType',
  523. // type:'select',
  524. dicData: [],
  525. rules: [
  526. {
  527. required: false,
  528. message: ' ',
  529. trigger: 'blur'
  530. }
  531. ]
  532. }, {
  533. label: '合同金额',
  534. prop: 'orderAmount',
  535. rules: [
  536. {
  537. pattern: /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/,
  538. message: ' ',
  539. trigger: 'blur'
  540. }
  541. ]
  542. }, {
  543. label: '合同重量',
  544. prop: 'contractWeight',
  545. rules: [
  546. {
  547. required: false,
  548. message: ' ',
  549. trigger: 'blur'
  550. }
  551. ]
  552. }, {
  553. label: '业务员',
  554. prop: 'salesName',
  555. dicData: [],
  556. rules: [
  557. {
  558. required: false,
  559. message: ' ',
  560. trigger: 'blur'
  561. }
  562. ]
  563. },{
  564. label: '要求发货日期',
  565. prop: 'requiredDeliveryDate',
  566. type:'date',
  567. rules: [
  568. {
  569. required: true,
  570. message: ' ',
  571. trigger: 'blur'
  572. }
  573. ]
  574. }, {
  575. label: '要求到货日期',
  576. prop: 'requiredArrivalDate',
  577. type:'date',
  578. rules: [
  579. {
  580. required: true,
  581. message: ' ',
  582. trigger: 'blur'
  583. }
  584. ]
  585. },{
  586. label: '到港日期',
  587. prop: 'dateOfArrival',
  588. type:'date',
  589. rules: [
  590. {
  591. required: false,
  592. message: ' ',
  593. trigger: 'blur'
  594. }
  595. ]
  596. }, {
  597. label: '单价',
  598. prop: 'salesPrice',
  599. rules: [
  600. {
  601. pattern: /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/,
  602. message: ' ',
  603. trigger: 'blur'
  604. }
  605. ]
  606. }, {
  607. label: '币别',
  608. prop: 'currency'
  609. }, {
  610. label: '汇率',
  611. prop: 'exchangeRate',
  612. disabled: true,
  613. }, {
  614. label: '人民币金额',
  615. prop: 'rmbAmount',
  616. rules: [
  617. {
  618. pattern: /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/,
  619. message: ' ',
  620. trigger: 'blur'
  621. }
  622. ]
  623. }, {
  624. label: '付款方式',
  625. prop: 'paymentType',
  626. }, {
  627. label: '付款/开证日期',
  628. prop: 'accountsCollectionDate',
  629. type:'date',
  630. rules: [
  631. {
  632. required: false,
  633. message: ' ',
  634. trigger: 'blur'
  635. }
  636. ]
  637. }, {
  638. label: '预付(保证)金额',
  639. prop: 'advancePayment',
  640. rules: [
  641. {
  642. pattern: /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/,
  643. message: ' ',
  644. trigger: 'blur'
  645. }
  646. ]
  647. },{
  648. label: '已付金额',
  649. prop: 'settlmentAmount',
  650. rules: [
  651. {
  652. pattern: /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^(0){1}$)|(^[0-9]\.[0-9]([0-9])?$)/,
  653. message: ' ',
  654. trigger: 'blur'
  655. }
  656. ]
  657. }, {
  658. label: '信用证到期日',
  659. prop: 'creditDate',
  660. type:'date',
  661. rules: [
  662. {
  663. required: false,
  664. message: ' ',
  665. trigger: 'blur'
  666. }
  667. ]
  668. }, {
  669. label: '码单重量',
  670. prop: 'billWeight',
  671. disabled: true,
  672. rules: [
  673. {
  674. required: false,
  675. message: ' ',
  676. trigger: 'blur'
  677. }
  678. ]
  679. }, {
  680. label: '发票重量',
  681. prop: 'invoiceWeight',
  682. disabled: true,
  683. rules: [
  684. {
  685. required: false,
  686. message: ' ',
  687. trigger: 'blur'
  688. }
  689. ]
  690. }, {
  691. label: "订单备注",
  692. span: 24,
  693. prop: "orderRemark",
  694. mock: {
  695. type: 'county'
  696. }
  697. }
  698. ],
  699. },
  700. }
  701. },
  702. async created() {
  703. this.customerContact = await this.getColumnData(this.getColumnName(37), customerContact);
  704. //币别
  705. this.getWorkDicts("entrance_currency").then(res =>{
  706. this.currencyDic = res.data.data
  707. })
  708. this.getWorkDicts("contractType").then(res =>{
  709. this.contractTypeDic = res.data.data
  710. })
  711. this.getWorkDicts("payment_term").then(res =>{
  712. this.paymentTypeDic = res.data.data
  713. })
  714. if (this.detailData.id) {
  715. let id = this.detailData.id.replace(/\"/g, "")
  716. detailListData(id).then(res => {
  717. this.form = res.data.data;
  718. this.oldForm = Object.assign({},res.data.data);
  719. this.configuration.dicData = this.form.corpsName
  720. this.pConfiguration.dicData = this.form.purchaserName
  721. if(res.data.data.itemsVOList){
  722. this.contactsData = res.data.data.itemsVOList
  723. this.oldContactsData = this.deepClone(res.data.data.itemsVOList)
  724. }
  725. if(res.data.data.orderFeesList){
  726. this.orderFeesList = res.data.data.orderFeesList
  727. this.oldFeesList = this.deepClone(res.data.data.orderFeesList)
  728. }
  729. if( res.data.data.orderFilesList){
  730. this.orderFilesList = res.data.data.orderFilesList
  731. this.oldFilesList = this.deepClone(res.data.data.orderFilesList)
  732. }
  733. })
  734. }else{
  735. this.$set(this.form,"currency","USD")
  736. this.$set(this.form,"exchangeRate",6.3843)
  737. }
  738. },
  739. components: {
  740. ApplyPayment,
  741. feeInfo,
  742. uploadFile
  743. },
  744. methods: {
  745. //单价
  746. priceChange(row) {
  747. if (!row.price) {
  748. row.price = "";
  749. row.amount = 0
  750. } else {
  751. row.amount = _.multiply(row.invoiceWeight, row.price).toFixed(2);
  752. }
  753. },
  754. //发票净重
  755. invoiceWeightChange(row) {
  756. if (!row.invoiceWeight) {
  757. row.invoiceWeight = "";
  758. row.amount = 0
  759. } else {
  760. row.amount = _.multiply(row.invoiceWeight, row.price).toFixed(2);
  761. }
  762. },
  763. //带出人民币
  764. currencyChange(){
  765. if(this.form.orderAmount){
  766. if(this.form.currency === "CNY"){
  767. this.form.exchangeRate = 1
  768. this.$set(this.form,"rmbAmount",this.form.orderAmount)
  769. }else{
  770. this.form.exchangeRate = 6.3843
  771. this.$set(this.form,"rmbAmount",_.multiply(this.form.orderAmount, 6.3843).toFixed(2))
  772. }
  773. }else{
  774. this.$set(this.form,"rmbAmount","")
  775. }
  776. },
  777. //合计
  778. totalChange(){
  779. let invoiceList = this.contactsData.map(item => {
  780. if(item.invoiceWeight){
  781. return parseFloat(item.invoiceWeight);
  782. }else return 0
  783. });
  784. let billList = this.contactsData.map(item => {
  785. if(item.billWeight){
  786. return parseFloat(item.billWeight);
  787. }else return 0
  788. });
  789. this.form.invoiceWeight = invoiceList.reduce((n,m) => n + m)
  790. this.form.billWeight = billList.reduce((n,m) => n + m)
  791. },
  792. //件数
  793. // quantityChange(row) {
  794. // if (!row.orderQuantity) {
  795. // row.orderQuantity = "";
  796. // row.amount = 0
  797. // } else {
  798. // row.amount =_.multiply(row.orderQuantity,row.price).toFixed(2);
  799. // }
  800. // },
  801. //修改提交触发
  802. editCustomer(status) {
  803. this.$refs["form"].validate((valid) => {
  804. if (valid) {
  805. let orderFeesList = this.$refs.feeInfo.submitData();
  806. for (let i = 0; i < orderFeesList.length; i++) {
  807. if (orderFeesList[i].corpId == null) {
  808. return this.$message.error(`请输入第${i + 1}行的结算中心`);
  809. }
  810. if (orderFeesList[i].price == 0) {
  811. return this.$message.error(`请正确输入第${i + 1}行的价格`);
  812. }
  813. if (orderFeesList[i].orderQuantity == 0) {
  814. return this.$message.error(`请正确输入第${i + 1}行的数量`);
  815. }
  816. }
  817. const orderFilesList = this.$refs.uploadFile.submitData();
  818. for (let j = 0; j < this.contactsData.length; j++) {
  819. if (this.contactsData[j].billNo === "") {
  820. return this.$message.error(`请输入采购明细第${j + 1}行的提单号`);
  821. }
  822. if (this.contactsData[j].priceCategory === "") {
  823. return this.$message.error(`请输入采购明细第${j + 1}行的货物品种`);
  824. }
  825. if (this.contactsData[j].orderQuantity === "") {
  826. return this.$message.error(`请输入采购明细第${j + 1}行的数量`);
  827. }
  828. if (this.contactsData[j].orderQuantity == 0) {
  829. return this.$message.error(`采购明细第${j + 1}行的数量不能为0`);
  830. }
  831. }
  832. this.form.billNo = this.contactsData.map(item =>{return item.billNo}).join(",")
  833. let submitDto = {
  834. ...this.form,
  835. tradeType:"JK",
  836. billType:"CG",
  837. itemsVOList: this.contactsData,
  838. orderFeesList: orderFeesList,
  839. orderFilesList: orderFilesList
  840. };
  841. this.editCustomerLoading = true;
  842. submitData(submitDto).then(res => {
  843. if(res.data.success){
  844. this.form.id = res.data.data
  845. this.$message.success("操作成功!")
  846. detailListData(this.form.id).then(res => {
  847. this.form = res.data.data;
  848. this.oldForm = Object.assign({},res.data.data);
  849. this.configuration.dicData = this.form.corpsName
  850. this.pConfiguration.dicData = this.form.purchaserName
  851. if(res.data.data.itemsVOList){
  852. this.contactsData = res.data.data.itemsVOList
  853. this.oldContactsData = this.deepClone(res.data.data.itemsVOList)
  854. }
  855. if(res.data.data.orderFeesList){
  856. this.orderFeesList = res.data.data.orderFeesList
  857. this.oldFeesList = this.deepClone(res.data.data.orderFeesList)
  858. }
  859. if( res.data.data.orderFilesList){
  860. this.orderFilesList = res.data.data.orderFilesList
  861. this.oldFilesList = this.deepClone(res.data.data.orderFilesList)
  862. }
  863. this.editCustomerLoading = false
  864. })
  865. }
  866. }).finally()
  867. setTimeout(() =>{
  868. },1000);
  869. this.butLoading = false;
  870. if(status === true){
  871. this.$emit("goBack");
  872. }
  873. } else {
  874. return false;
  875. }
  876. });
  877. },
  878. selectionContact(row){
  879. this.selectContact = row;
  880. },
  881. beforePage(type){
  882. let id = this.selectContact.map(item=>{
  883. return item.id ? true : false
  884. })
  885. if(id.findIndex(item => item != true) == -1){
  886. const params = {
  887. id:this.form.id,
  888. orderItemIds:this.selectContact.map(i=>{return i.$index})
  889. }
  890. if(contrastObj(this.form,this.oldForm) || contrastList(this.contactsData,this.oldContactsData)
  891. || contrastList(this.orderFeesList,this.oldFeesList) || contrastList(this.orderFilesList,this.oldFilesList)
  892. ){
  893. this.$confirm("您已改动数据,是否先保存在进行操作!", {
  894. confirmButtonText: "保存",
  895. cancelButtonText: "取消",
  896. type: "warning"
  897. }).then(() => {
  898. this.editCustomer();
  899. })
  900. }else{
  901. if(type){
  902. //进入付款管理
  903. // if(this.$store.getters.payStatus){
  904. // this.$alert("付款页面已存在,请关闭付款页面再进行操作", "温馨提示", {
  905. // confirmButtonText: "确定",
  906. // type: 'warning',
  907. // callback: action => {
  908. // }
  909. // });
  910. // }else{
  911. // this.$router.$avueRouter.closeTag('/financialManagement/payment');
  912. // this.$router.push({
  913. // path: "/financialManagement/payment",
  914. // query: {params: params},
  915. // });
  916. // }
  917. }else{
  918. //进入收货单
  919. if(this.$store.getters.takeStatus){
  920. this.$alert("收货单页面已存在,请关闭收货单再进行操作", "温馨提示", {
  921. confirmButtonText: "确定",
  922. type: 'warning',
  923. callback: action => {
  924. }
  925. });
  926. }else{
  927. //关闭一下存在的列表页
  928. this.$router.$avueRouter.closeTag('/importTrade/receipt/index');
  929. this.$router.push({
  930. path: "/importTrade/receipt/index",
  931. query: {params: params},
  932. });
  933. }
  934. }
  935. }
  936. }else{
  937. this.$confirm("列表内存在新录入数据,是否先保存此数据?", {
  938. confirmButtonText: "保存",
  939. cancelButtonText: "取消",
  940. type: "warning"
  941. }).then(() => {
  942. this.editCustomer();
  943. })
  944. }
  945. },
  946. beforeBillData(type){
  947. this.billData = {
  948. srcOrderno:this.form.orderNo,
  949. itemType:"采购",
  950. accDate:this.form.businesDate,
  951. currency:this.form.currency,
  952. exchangeRate:this.form.exchangeRate,
  953. srcParentId:this.form.id,
  954. }
  955. if(type){ //申请货款
  956. this.billData.srcId = -1
  957. }
  958. },
  959. // 付款
  960. applyPayment(){
  961. if(contrastObj(this.form,this.oldForm) || contrastList(this.contactsData,this.oldContactsData)
  962. || contrastList(this.orderFeesList,this.oldFeesList) || contrastList(this.orderFilesList,this.oldFilesList)
  963. ){
  964. this.$confirm("您已改动数据,是否先保存在进行操作!", {
  965. confirmButtonText: "保存",
  966. cancelButtonText: "取消",
  967. type: "warning"
  968. }).then(() => {
  969. this.editCustomer();
  970. })
  971. }else{
  972. this.beforeBillData(true);
  973. this.applyPaymentDialog = true;
  974. }
  975. },
  976. //选择货物品种
  977. choice(row){
  978. this.dialogVisible = true;
  979. this.selectKind = row.$index;
  980. },
  981. //选择货品
  982. commodityConfirm(){
  983. if(this.tableData){
  984. this.contactsData[this.selectKind].priceCategory = this.tableData[0].id;
  985. this.contactsData[this.selectKind].itemId = this.tableData[0].id;
  986. this.$set(this.contactsData[this.selectKind],'priceCategoryNames',this.tableData[0].cname)
  987. this.$set(this.contactsData[this.selectKind],'itemDescription',this.tableData[0].cnameDescription) //英文描述
  988. //根据选择的商品id 带出规格型号
  989. getSpecification({ goodId: this.tableData[0].id}).then(res =>{
  990. this.$set(this.contactsData[this.selectKind],'itemType',res.data.data.map(item =>item)[0])
  991. this.$set(this.contactsData[this.selectKind],'specificationList',res.data.data.map(item => ({ value: item })))
  992. }).finally(()=>{
  993. this.selectKind = -1
  994. })
  995. this.dialogVisible = !this.dialogVisible
  996. }
  997. },
  998. //新增商品明细保存触发
  999. rowSave(row, done, loading) {
  1000. // this.contactsData.push(row)
  1001. done()
  1002. },
  1003. //修改商品信息触发
  1004. rowUpdate(row, index, done, loading) {
  1005. done(row);
  1006. },
  1007. //删除商品信息触发
  1008. rowDel(row, index, donerowDel) {
  1009. this.$confirm("确定将选择数据删除?", {
  1010. confirmButtonText: "确定",
  1011. cancelButtonText: "取消",
  1012. type: "warning"
  1013. }).then(() => {
  1014. //商品判断是否需要调用删除接口
  1015. if (row.id) {
  1016. corpsattn(row.id).then(res => {
  1017. this.$message({
  1018. type: "success",
  1019. message: "操作成功!"
  1020. });
  1021. this.contactsData.splice(index, 1);
  1022. })
  1023. } else {
  1024. this.$message({
  1025. type: "success",
  1026. message: "操作成功!"
  1027. });
  1028. this.contactsData.splice(index, 1);
  1029. }
  1030. })
  1031. },
  1032. //关闭账单
  1033. choceFun(){
  1034. this.applyPaymentDialog = false
  1035. },
  1036. //刷新
  1037. applicationRefreshChange(){
  1038. },
  1039. //申请记录
  1040. applicationOnLoad(){
  1041. },
  1042. //点击商品明细选择触发
  1043. commodityChoice(row) {
  1044. this.dialogVisible = !this.dialogVisible
  1045. this.commodityData = true
  1046. this.choiceIndexT = row.$index
  1047. },
  1048. //商品编辑
  1049. rowCell(row, index) {
  1050. this.$refs.crudContact.rowCell(row, index)
  1051. },
  1052. //商品新增触发
  1053. commoditySelection() {
  1054. this.$refs.crudContact.rowCellAdd();
  1055. },
  1056. //点击行可编辑
  1057. handleRowClick(row, event, column) {
  1058. },
  1059. searchChange(params, done){
  1060. this.onLoad(this.page, params);
  1061. done()
  1062. },
  1063. //刷新触发
  1064. refreshChange() {
  1065. this.treeDeptId = '';
  1066. this.page.currentPage = 1;
  1067. this.onLoad(this.page);
  1068. },
  1069. //选中触发
  1070. selectionChange(list) {
  1071. this.tableData = list
  1072. },
  1073. //导入页左商品类型查询
  1074. nodeClick(data) {
  1075. this.treeDeptId = data.id;
  1076. this.page.currentPage = 1;
  1077. this.onLoad(this.page);
  1078. },
  1079. //商品详情list
  1080. onLoad(page, params = {}) {
  1081. if (this.page.total) {
  1082. this.optionTwo.height = window.innerHeight - 520;
  1083. } else {
  1084. this.optionTwo.height = window.innerHeight - 475;
  1085. }
  1086. this.loading = true;
  1087. getList(page.currentPage, page.pageSize, Object.assign(params, this.query), this.treeDeptId).then(res => {
  1088. const data = res.data.data;
  1089. if(data.total>10){
  1090. this.page.total = data.total;
  1091. }
  1092. this.data = data.records;
  1093. this.loading = false;
  1094. });
  1095. },
  1096. //确认导入触发
  1097. importGoods() {
  1098. if (this.tableData.length > 0) {
  1099. for (let item in this.tableData) {
  1100. const params ={
  1101. priceCategory:this.tableData[item].code,
  1102. priceCategoryNames:this.tableData[item].cname,
  1103. itemId:this.tableData[item].id,
  1104. cname:this.tableData[item].cname,
  1105. purchaseQuantity:0,
  1106. price:0,
  1107. amount:0.00
  1108. }
  1109. this.$refs.crudContact.rowCellAdd(params);
  1110. this.$refs.crudContact.rowCell(params,this.contactsData.length - 1)
  1111. }
  1112. }
  1113. this.tableData = []
  1114. this.dialogVisible = false
  1115. },
  1116. //导入商品触发
  1117. importChoice() {
  1118. if (this.tableData.length === 1) {
  1119. this.contactsData[this.choiceIndexT].cname = this.tableData[0].cname
  1120. this.contactsData[this.choiceIndexT].code = this.tableData[0].code
  1121. this.contactsData[this.choiceIndexT].typeno = this.tableData[0].typeno
  1122. this.contactsData[this.choiceIndexT].specificationAndModel = this.tableData[0].specificationAndModel
  1123. this.contactsData[this.choiceIndexT].itemId = this.tableData[0].id
  1124. this.contactsData[this.choiceIndexT].priceCategory = this.tableData[0].goodsTypeName
  1125. }
  1126. this.dialogVisible = !this.dialogVisible
  1127. this.commodityData = false
  1128. },
  1129. backToList() {
  1130. if(contrastObj(this.form,this.oldForm) || contrastList(this.contactsData,this.oldContactsData)
  1131. || contrastList(this.orderFeesList,this.oldFeesList) || contrastList(this.orderFilesList,this.oldFilesList)
  1132. ){
  1133. this.$confirm("是否保存当前页面?", "提示", {
  1134. confirmButtonText: "保存",
  1135. cancelButtonText: "取消",
  1136. type: "warning",
  1137. }).then(() => {
  1138. this.editCustomer(true)
  1139. }).catch(()=>{
  1140. this.$emit("goBack");
  1141. })
  1142. }else{
  1143. this.$emit("goBack");
  1144. }
  1145. },
  1146. //列保存触发
  1147. async saveColumn() {
  1148. const inSave = await this.saveColumnData(
  1149. this.getColumnName(37),
  1150. this.customerContact
  1151. );
  1152. if (inSave) {
  1153. this.$message.success("保存成功");
  1154. //关闭窗口
  1155. this.$refs.crudContact.$refs.dialogColumn.columnBox = false;
  1156. }
  1157. },
  1158. }
  1159. }
  1160. </script>
  1161. <style scoped lang="scss">
  1162. .customer-head {
  1163. position: fixed;
  1164. top: 105px;
  1165. width: 100%;
  1166. margin-left: -10px;
  1167. height: 62px;
  1168. background: #ffffff;
  1169. box-shadow: 0 4px 12px 0px rgba(232, 232, 235, 1);
  1170. z-index: 999;
  1171. /* display: flex;
  1172. justify-content: left; */
  1173. }
  1174. .customer-back {
  1175. cursor: pointer;
  1176. line-height: 62px;
  1177. font-size: 16px;
  1178. color: #323233;
  1179. font-weight: 400;
  1180. }
  1181. .upper_right_button{
  1182. display: flex;
  1183. position: fixed;
  1184. right: 20px;
  1185. top: 115px;
  1186. }
  1187. .required_fields{
  1188. color: #F56C6C;
  1189. display:inline-block;
  1190. width: 7%
  1191. }
  1192. ::v-deep .el-form-item {
  1193. margin-bottom: 0;
  1194. }
  1195. //el-icon-plus avue-upload__icon
  1196. .avue-upload /deep/ .avue-upload__icon {
  1197. line-height: 178px !important;
  1198. }
  1199. ::v-deep .el-form-item__content{
  1200. line-height: 32px;
  1201. }
  1202. </style>