detailsPage.vue 39 KB

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