detailsPage.vue 40 KB

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