detailsPage.vue 40 KB

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