detailsPage.vue 37 KB

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