retail_form.vue 40 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414
  1. <template>
  2. <div class="detail-container">
  3. <el-page-header
  4. @back="goBack"
  5. :content="listItem ? '编辑' : '新增'"
  6. ></el-page-header>
  7. <div class="main-title">
  8. <div class="title">订单信息</div>
  9. </div>
  10. <el-form
  11. ref="mainForm"
  12. :model="mainForm"
  13. :rules="mainFormRules"
  14. label-width="120px"
  15. size="small"
  16. label-position="right"
  17. >
  18. <el-row :gutter="20">
  19. <!-- <el-col :xs="24" :sm="12" :lg="8">
  20. <el-form-item label="订单号" prop="id">
  21. <el-input
  22. v-model="mainForm.id"
  23. placeholder="订单号"
  24. readonly
  25. ></el-input>
  26. </el-form-item>
  27. </el-col> -->
  28. <el-col
  29. :xs="24"
  30. :sm="12"
  31. :lg="8"
  32. v-if="!listItem"
  33. @click.native="handleShow"
  34. >
  35. <el-form-item label="销售政策编号" prop="policyCode">
  36. <el-input
  37. v-model="mainForm.policyCode"
  38. placeholder="销售政策编号"
  39. readonly
  40. ></el-input>
  41. </el-form-item>
  42. </el-col>
  43. <el-col :xs="24" :sm="12" :lg="8" v-else>
  44. <el-form-item label="销售政策编号" prop="policyCode">
  45. <el-input
  46. v-model="mainForm.policyCode"
  47. placeholder="销售政策编号"
  48. ></el-input>
  49. </el-form-item>
  50. </el-col>
  51. <el-col :xs="24" :sm="12" :lg="8" style="height: 51px">
  52. <el-form-item label="单据日期" prop="date">
  53. <el-date-picker
  54. v-model="mainForm.date"
  55. type="datetime"
  56. :picker-options="pickerOptions"
  57. value-format="yyyy-MM-dd HH:mm:ss"
  58. style="width: 100%"
  59. placeholder="选择日期"
  60. >
  61. </el-date-picker>
  62. </el-form-item>
  63. </el-col>
  64. <el-col :xs="24" :sm="12" :lg="8">
  65. <el-form-item label="产品大类" prop="type">
  66. <el-select
  67. v-model="mainForm.type"
  68. placeholder="选择产品大类"
  69. style="width: 100%"
  70. >
  71. <el-option
  72. v-for="item in typeList"
  73. :key="item.dictCode"
  74. :label="item.dictValue"
  75. :value="item.dictCode"
  76. ></el-option>
  77. </el-select>
  78. </el-form-item>
  79. </el-col>
  80. <el-col :xs="24" :sm="16" :lg="16">
  81. <el-form-item label="备注" prop="remark">
  82. <el-input
  83. v-model="mainForm.remark"
  84. placeholder="请输入备注"
  85. ></el-input>
  86. </el-form-item>
  87. </el-col>
  88. </el-row>
  89. <el-row :gutter="20">
  90. <!--
  91. <el-col :xs="24" :sm="12" :lg="8">
  92. <el-form-item label="销售政策" prop="id">
  93. <el-select
  94. v-model="mainForm.ztype"
  95. placeholder="选择销售政策"
  96. style="width: 100%"
  97. >
  98. <el-option
  99. v-for="item in ztypeList"
  100. :key="item.id"
  101. :label="item.saleName"
  102. :value="item.id"
  103. ></el-option>
  104. </el-select>
  105. </el-form-item>
  106. </el-col>
  107. <el-col :xs="24" :sm="12" :lg="8">
  108. <el-form-item label="销售政策说明" prop="policyRemark">
  109. <el-input
  110. v-model="mainForm.policyRemark"
  111. placeholder="销售政策说明"
  112. ></el-input>
  113. </el-form-item>
  114. </el-col> -->
  115. </el-row>
  116. <!--
  117. <el-row :gutter="20">
  118. <el-col :xs="24" :sm="12" :lg="8">
  119. <el-form-item label="业务员" prop="serviceName">
  120. <el-input
  121. v-model="mainForm.serviceName"
  122. placeholder="订单号"
  123. ></el-input>
  124. </el-form-item>
  125. </el-col>
  126. <el-col :xs="24" :sm="16" :lg="16">
  127. <el-form-item label="备注" prop="remark">
  128. <el-input
  129. v-model="mainForm.remark"
  130. placeholder="请输入备注"
  131. ></el-input>
  132. </el-form-item>
  133. </el-col>
  134. </el-row> -->
  135. </el-form>
  136. <div class="main-title">
  137. <div class="title">货品信息</div>
  138. <div v-if="!listItem">
  139. <el-select
  140. v-model="warehouseValue"
  141. placeholder="请选择发货仓库"
  142. size="small"
  143. style="margin-right: 10px"
  144. >
  145. <el-option
  146. :label="item.name"
  147. :value="item.id"
  148. v-for="(item, index) in warehouseList"
  149. :key="index"
  150. ></el-option>
  151. </el-select>
  152. <el-button
  153. type="primary"
  154. size="small"
  155. icon="el-icon-search"
  156. @click="checkStock"
  157. >检查库存</el-button
  158. >
  159. <el-divider direction="vertical"></el-divider>
  160. </div>
  161. </div>
  162. <div class="table" style="margin-top: 20px">
  163. <el-table
  164. :data="goodsList"
  165. element-loading-text="Loading"
  166. border
  167. fit
  168. highlight-current-row
  169. stripe
  170. max-height="400"
  171. >
  172. <el-table-column
  173. align="center"
  174. label="序号"
  175. type="index"
  176. width="50"
  177. ></el-table-column>
  178. <el-table-column
  179. align="center"
  180. label="销售类型"
  181. prop="saleTypeName"
  182. min-width="100"
  183. show-overflow-tooltip
  184. ></el-table-column>
  185. <el-table-column
  186. align="center"
  187. label="存货编码"
  188. prop="materialNumber"
  189. min-width="100"
  190. show-overflow-tooltip
  191. ></el-table-column>
  192. <el-table-column
  193. align="center"
  194. label="产品名称"
  195. prop="materialName"
  196. min-width="160"
  197. show-overflow-tooltip
  198. ></el-table-column>
  199. <el-table-column
  200. align="center"
  201. label="规格型号"
  202. prop="specification"
  203. min-width="160"
  204. show-overflow-tooltip
  205. ></el-table-column>
  206. <el-table-column
  207. align="center"
  208. label="单位"
  209. prop="unit"
  210. min-width="100"
  211. show-overflow-tooltip
  212. ></el-table-column>
  213. <el-table-column
  214. align="center"
  215. label="单价"
  216. prop="price"
  217. min-width="100"
  218. show-overflow-tooltip
  219. ></el-table-column>
  220. <el-table-column
  221. align="center"
  222. label="总数量"
  223. prop="qty"
  224. min-width="100"
  225. show-overflow-tooltip
  226. >
  227. <!-- <template slot-scope="scope">
  228. <el-input v-model="scope.row.qty" size="small"></el-input>
  229. </template> -->
  230. </el-table-column>
  231. <el-table-column
  232. align="center"
  233. label="订单金额"
  234. min-width="100"
  235. show-overflow-tooltip
  236. >
  237. <template slot-scope="scope">
  238. {{ scope.row.price * scope.row.qty }}
  239. </template>
  240. </el-table-column>
  241. <el-table-column
  242. align="center"
  243. label="返利钱包"
  244. prop="customerWalletId2"
  245. min-width="160"
  246. show-overflow-tooltip
  247. >
  248. <template slot-scope="scope">
  249. <el-select
  250. v-model="scope.row.customerWalletId2"
  251. placeholder="选择返利钱包"
  252. size="small"
  253. @change="changeWallet(scope.$index)"
  254. >
  255. <el-option label="全部" value=""></el-option>
  256. <el-option
  257. v-for="item in flWalletList"
  258. :key="item.customerWalletId"
  259. :label="item.name"
  260. :value="item.customerWalletId"
  261. >
  262. </el-option>
  263. </el-select>
  264. </template>
  265. </el-table-column>
  266. <el-table-column
  267. align="center"
  268. label="返利金额"
  269. min-width="100"
  270. show-overflow-tooltip
  271. >
  272. <template slot-scope="scope">
  273. {{
  274. (scope.row.price * scope.row.qty * (scope.row.rebateRate * 100)) /
  275. 100 || 0
  276. }}
  277. </template>
  278. </el-table-column>
  279. <el-table-column
  280. align="center"
  281. label="格力折扣"
  282. min-width="100"
  283. show-overflow-tooltip
  284. >
  285. <template slot-scope="scope">
  286. {{ scope.row.qty * scope.row.discAmount }}
  287. </template>
  288. </el-table-column>
  289. <el-table-column
  290. align="center"
  291. label="现金钱包"
  292. prop="customerWalletId"
  293. min-width="160"
  294. show-overflow-tooltip
  295. >
  296. <template slot-scope="scope">
  297. <el-select
  298. v-model="scope.row.customerWalletId"
  299. placeholder="选择现金钱包"
  300. size="small"
  301. >
  302. <el-option label="全部" value=""></el-option>
  303. <el-option
  304. v-for="item in comxjWalletList(scope.row.walletRelaList)"
  305. :key="item.customerWalletId"
  306. :label="item.name"
  307. :value="item.customerWalletId"
  308. >
  309. </el-option>
  310. </el-select>
  311. </template>
  312. </el-table-column>
  313. <el-table-column
  314. align="center"
  315. label="实付金额"
  316. prop="qty"
  317. min-width="100"
  318. show-overflow-tooltip
  319. >
  320. <template slot-scope="scope">
  321. {{
  322. (scope.row.price * scope.row.qty * 100 -
  323. ((scope.row.price *
  324. scope.row.qty *
  325. (scope.row.rebateRate * 100)) /
  326. 100) *
  327. 100 -
  328. ((scope.row.qty * (scope.row.discAmount * 100)) / 100) * 100) /
  329. 100 || 0
  330. }}
  331. </template>
  332. </el-table-column>
  333. <el-table-column
  334. align="center"
  335. label="是否直调"
  336. prop="isDirectTransfer"
  337. min-width="100"
  338. >
  339. <template slot-scope="scope">
  340. <el-checkbox v-model="scope.row.isDirectTransfer"></el-checkbox>
  341. </template>
  342. </el-table-column>
  343. <!-- <el-table-column
  344. align="center"
  345. label="直调数量"
  346. prop="directTransferQty"
  347. min-width="100"
  348. >
  349. <template slot-scope="scope">
  350. <el-input
  351. v-model="scope.row.directTransferQty"
  352. size="small"
  353. ></el-input>
  354. </template>
  355. </el-table-column> -->
  356. <el-table-column
  357. align="center"
  358. label="备注"
  359. prop="remark"
  360. min-width="160"
  361. >
  362. <template slot-scope="scope">
  363. <el-input v-model="scope.row.remark" size="small"></el-input>
  364. </template>
  365. </el-table-column>
  366. <el-table-column
  367. align="center"
  368. label="税率"
  369. prop="tax"
  370. min-width="100"
  371. show-overflow-tooltip
  372. ></el-table-column>
  373. <el-table-column
  374. align="center"
  375. label="总仓库"
  376. prop="status1"
  377. min-width="100"
  378. show-overflow-tooltip
  379. v-if="!listItem"
  380. >
  381. <template slot-scope="scope">
  382. <div>{{ scope.row.status1 | status1Filter }}</div>
  383. </template>
  384. </el-table-column>
  385. <el-table-column
  386. align="center"
  387. label="仓库状态"
  388. prop="status2"
  389. min-width="100"
  390. show-overflow-tooltip
  391. v-if="!listItem"
  392. >
  393. <template slot-scope="scope">
  394. <div>{{ status2Filter(scope.row) }}</div>
  395. </template>
  396. </el-table-column>
  397. <el-table-column align="center" label="操作" width="100" fixed="right">
  398. <template slot-scope="scope">
  399. <el-button type="text" @click="deleteItem(scope.$index)"
  400. >删除</el-button
  401. >
  402. </template>
  403. </el-table-column>
  404. </el-table>
  405. </div>
  406. <div class="page-footer">
  407. <div class="footer" :class="classObj">
  408. <el-button type="primary" @click="clickSubmitForm">保 存</el-button>
  409. <el-popconfirm
  410. title="确定关闭吗?"
  411. @onConfirm="goBack"
  412. style="margin-left: 10px"
  413. >
  414. <el-button slot="reference">关 闭</el-button>
  415. </el-popconfirm>
  416. </div>
  417. </div>
  418. <el-dialog
  419. :visible.sync="isShowDialog"
  420. @close="handleClose"
  421. width="80%"
  422. title="引用销售政策"
  423. >
  424. <template v-if="!cusIndex">
  425. <el-form
  426. :model="screenForm"
  427. ref="screenForm"
  428. label-width="120px"
  429. size="small"
  430. >
  431. <el-row :gutter="20">
  432. <el-col :xs="24" :sm="8" :lg="8">
  433. <el-form-item label="销售政策">
  434. <el-select
  435. v-model="screenForm.policyId"
  436. placeholder="选择销售政策"
  437. filterable
  438. style="width: 100%"
  439. >
  440. <el-option
  441. v-for="(item, index) in policyList"
  442. :key="index"
  443. :label="item.title"
  444. :value="item.code"
  445. ></el-option>
  446. </el-select> </el-form-item
  447. ></el-col>
  448. <el-col :xs="24" :sm="8" :lg="8">
  449. <el-form-item label="销售类型">
  450. <el-select
  451. v-model="screenForm.saleTypeCode"
  452. filterable
  453. placeholder="选择销售类型"
  454. style="width: 100%"
  455. >
  456. <el-option label="全部" value=""></el-option>
  457. <el-option
  458. v-for="item in ztypeList"
  459. :key="item.id"
  460. :label="item.saleName"
  461. :value="item.saleCode"
  462. ></el-option>
  463. </el-select>
  464. </el-form-item>
  465. </el-col>
  466. <el-col :xs="24" :sm="8" :lg="8" class="tr">
  467. <el-button
  468. type="primary"
  469. size="small"
  470. @click="handlePolicyTypeList"
  471. >查询</el-button
  472. >
  473. </el-col>
  474. </el-row>
  475. </el-form>
  476. <el-row :gutter="20" style="margin: 10px 0"> 选择限定机型 </el-row>
  477. <el-table
  478. v-loading="listLoading"
  479. :data="dataList"
  480. element-loading-text="Loading"
  481. border
  482. fit
  483. highlight-current-row
  484. stripe
  485. >
  486. <el-table-column align="center" width="55"
  487. ><template slot-scope="scope">
  488. <el-radio
  489. v-model="radio"
  490. :label="
  491. scope.row.id +
  492. '&' +
  493. scope.row.policyId +
  494. '&' +
  495. scope.row.materialId +
  496. '&' +
  497. scope.row.policyConditionId
  498. "
  499. >{{ "" }}</el-radio
  500. >
  501. </template>
  502. </el-table-column>
  503. <template v-for="col in columns">
  504. <el-table-column
  505. v-if="col.num"
  506. align="center"
  507. :label="col.lable"
  508. :prop="col.prop"
  509. :min-width="col.widht"
  510. show-overflow-tooltip
  511. >
  512. <template slot-scope="scope">
  513. <el-input v-model="scope.row.qty" size="small"></el-input>
  514. </template>
  515. </el-table-column>
  516. <el-table-column
  517. v-else-if="col.jie"
  518. align="center"
  519. :label="col.lable"
  520. :prop="col.prop"
  521. :min-width="col.widht"
  522. show-overflow-tooltip
  523. >
  524. <template slot-scope="scope">
  525. {{ scope.row.qty * scope.row.price || 0 }}
  526. </template>
  527. </el-table-column>
  528. <el-table-column
  529. v-else
  530. align="center"
  531. :label="col.lable"
  532. :prop="col.prop"
  533. :min-width="col.widht"
  534. show-overflow-tooltip
  535. >
  536. </el-table-column>
  537. </template>
  538. </el-table>
  539. <!-- 分页 -->
  540. <div style="margin: 10px 0">
  541. <el-pagination
  542. @size-change="handleSizeChange"
  543. @current-change="handleCurrentChange"
  544. :current-page="currentPage"
  545. :page-sizes="[10]"
  546. :page-size="10"
  547. layout="total, sizes, prev, pager, next, jumper"
  548. :total="total"
  549. >
  550. </el-pagination>
  551. </div>
  552. <span slot="footer" class="dialog-footer">
  553. <el-button type="primary" @click="submitAddGoods">下一步</el-button>
  554. </span>
  555. </template>
  556. <template v-else>
  557. <el-form
  558. :model="screenForm"
  559. ref="screenForm"
  560. label-width="120px"
  561. size="small"
  562. >
  563. <el-row :gutter="20">
  564. <el-col :xs="24" :sm="8" :lg="8">
  565. <el-form-item label="销售政策">
  566. <el-select
  567. disabled
  568. v-model="screenForm.policyId"
  569. placeholder="选择销售政策"
  570. filterable
  571. style="width: 100%"
  572. >
  573. <el-option
  574. v-for="(item, index) in policyList"
  575. :key="index"
  576. :label="item.title"
  577. :value="item.code"
  578. ></el-option>
  579. </el-select>
  580. </el-form-item>
  581. </el-col>
  582. <el-col :xs="24" :sm="8" :lg="8">
  583. <el-form-item label="销售类型">
  584. <el-select
  585. filterable
  586. v-model="screenForm.saleTypeCode"
  587. placeholder="选择销售类型"
  588. style="width: 100%"
  589. >
  590. <el-option label="全部" value=""></el-option>
  591. <el-option
  592. v-for="item in ztypeList"
  593. :key="item.id"
  594. :label="item.saleName"
  595. :value="item.saleCode"
  596. ></el-option>
  597. </el-select>
  598. </el-form-item>
  599. </el-col>
  600. <el-col :xs="24" :sm="8" :lg="8" class="tr">
  601. <el-button
  602. type="primary"
  603. size="small"
  604. @click="handlePolicyTypeList"
  605. >查询</el-button
  606. >
  607. </el-col>
  608. </el-row>
  609. </el-form>
  610. <el-row type="flex" :gutter="30" style="margin: 10px 0">
  611. <el-col :span="10">已选择限定机型</el-col>
  612. <el-col :span="8" class="ellipsis">{{ comText("materialName") }}</el-col>
  613. <el-col :span="12" class="ellipsis">{{ comText("specification") }}</el-col>
  614. <el-col style="text-align: right">配提比例:{{ pop }}</el-col>
  615. </el-row>
  616. <template v-for="(item, index) in popArr">
  617. <el-table
  618. v-if="index + 1 == cusIndex"
  619. v-loading="listLoading"
  620. :data="popDataArr[cusIndex - 1]"
  621. element-loading-text="Loading"
  622. border
  623. fit
  624. highlight-current-row
  625. stripe
  626. >
  627. <el-table-column align="center" width="55"
  628. ><template slot-scope="scope">
  629. <el-radio
  630. v-model="radioObj['radio' + cusIndex]"
  631. :label=" scope.row.id +
  632. '&' +
  633. scope.row.policyId +
  634. '&' +
  635. scope.row.materialId +
  636. '&' +
  637. scope.row.policyConditionId
  638. ""
  639. >{{ "" }}</el-radio
  640. >
  641. </template>
  642. </el-table-column>
  643. <template v-for="col in columns">
  644. <el-table-column
  645. v-if="col.num"
  646. align="center"
  647. :label="col.lable"
  648. :prop="col.prop"
  649. :min-width="col.widht"
  650. show-overflow-tooltip
  651. >
  652. <template slot-scope="scope">
  653. <el-input v-model="scope.row.qty" size="small"></el-input>
  654. </template>
  655. </el-table-column>
  656. <el-table-column
  657. v-else-if="col.jie"
  658. align="center"
  659. :label="col.lable"
  660. :prop="col.prop"
  661. :min-width="col.widht"
  662. show-overflow-tooltip
  663. >
  664. <template slot-scope="scope">
  665. {{ scope.row.qty * scope.row.price || 0 }}
  666. </template>
  667. </el-table-column>
  668. <el-table-column
  669. v-else
  670. align="center"
  671. :label="col.lable"
  672. :prop="col.prop"
  673. :min-width="col.widht"
  674. show-overflow-tooltip
  675. >
  676. </el-table-column>
  677. </template>
  678. </el-table>
  679. <!-- 分页 -->
  680. <div style="margin: 10px 0" v-if="index + 1 == cusIndex">
  681. <el-pagination
  682. layout="total"
  683. :total="popDataArr[cusIndex - 1]?popDataArr[cusIndex - 1].length:0"
  684. >
  685. </el-pagination>
  686. </div>
  687. </template>
  688. <span slot="footer" class="dialog-footer">
  689. <el-button type="primary" @click="cusIndex -= 1">上一步</el-button>
  690. <el-button
  691. type="primary"
  692. @click="handleCondition"
  693. v-if="popArr.length != cusIndex"
  694. >下一步</el-button
  695. >
  696. <el-button
  697. type="primary"
  698. @click="hanlePopData"
  699. v-if="popArr.length == cusIndex"
  700. >完成</el-button
  701. >
  702. </span>
  703. </template>
  704. </el-dialog>
  705. </div>
  706. </template>
  707. <script>
  708. import {
  709. getDetail,
  710. addData,
  711. editData,
  712. getSalesTypeList,
  713. getGoodsList,
  714. getWalletList,
  715. getWarehouseList,
  716. policyList,
  717. checkStock,
  718. typeList,
  719. getpolicyList,
  720. getConditionList,
  721. getConditionDetail,
  722. getpolicyTypeList,
  723. } from "@/api/supply/policy";
  724. import { getDictList } from "@/api/common";
  725. import { findElem } from "@/utils/util";
  726. export default {
  727. name: "RetailForm",
  728. componentName: "RetailForm",
  729. props: ["listItem"],
  730. filters: {
  731. status1Filter(val) {
  732. if (val === "" || val === null || val === undefined) return "未检查";
  733. else if (val === 0) return "无货";
  734. else if (val > 0 && val <= 30) return val;
  735. else if (val > 30 && val <= 1000) return "有货";
  736. else if (val > 1000) return "充足";
  737. },
  738. },
  739. data() {
  740. return {
  741. tableData: [],
  742. currentPage: 1, // 当前页码
  743. pageSize: 10, // 每页数量
  744. listTotal: 0, // 列表总数
  745. cusIndex: 0,
  746. total:0,
  747. radio: "",
  748. pop: "",
  749. popArr: [],
  750. mainForm: {
  751. id: "",
  752. date: "",
  753. type: "",
  754. ztype: "",
  755. remark: "",
  756. policyCode: "",
  757. policyRemark: "",
  758. policyId: "",
  759. },
  760. mainFormRules: {
  761. date: [
  762. { required: true, message: "请选择单据日期", trigger: "change" },
  763. ],
  764. type: [{ required: true, message: "请选择品类", trigger: "change" }],
  765. },
  766. goodsList: [],
  767. warehouseList: [],
  768. warehouseValue: "",
  769. isShowDialog: false,
  770. screenForm: {
  771. policyId: "",
  772. saleTypeCode: "",
  773. },
  774. currentPage: 1,
  775. listTotal: 0,
  776. salesTypeList: [],
  777. typeList: [],
  778. ztypeList: [],
  779. leftGoodsList: [],
  780. rightGoodsList: [],
  781. leftSelection: [],
  782. rightSelection: [],
  783. policyList: [],
  784. xjWalletList: [],
  785. flWalletList: [],
  786. dataList: [],
  787. columns: [
  788. {
  789. prop: "saleTypeName",
  790. lable: "销售类型",
  791. widht: 160,
  792. },
  793. {
  794. prop: "materialName",
  795. lable: "货品名称",
  796. widht: 160,
  797. },
  798. {
  799. prop: "specification",
  800. lable: "规格型号",
  801. widht: 160,
  802. },
  803. {
  804. prop: "qty",
  805. lable: "数量",
  806. widht: 160,
  807. num: true,
  808. },
  809. {
  810. prop: "price",
  811. lable: "单价",
  812. widht: 160,
  813. },
  814. {
  815. prop: "zong",
  816. lable: "金额",
  817. jie: true,
  818. },
  819. ],
  820. listLoading: false,
  821. popDataArr: [],
  822. radioObj: {},
  823. step: 0,
  824. policyId:''
  825. };
  826. },
  827. computed: {
  828. sidebar() {
  829. return this.$store.state.app.sidebar;
  830. },
  831. classObj() {
  832. return {
  833. hideSidebar: !this.sidebar.opened,
  834. openSidebar: this.sidebar.opened,
  835. };
  836. },
  837. comxjWalletList() {
  838. return (c) => {
  839. console.log(c, "现金钱包");
  840. const walle = [];
  841. const ovalVall = c == undefined || !c.length ? [] : c;
  842. for (let i = 0; i < this.xjWalletList.length; i++) {
  843. for (let j = 0; j < ovalVall.length; j++) {
  844. if (this.xjWalletList[i].walletRebateId == ovalVall[j].walletId) {
  845. walle.push(this.xjWalletList[i]);
  846. }
  847. }
  848. }
  849. return walle;
  850. };
  851. },
  852. comText() {
  853. return (val) => {
  854. if (this.cusIndex-1 ==0) {
  855. const params = this.radio.split("&");
  856. return this.dataList.filter((k) => {
  857. return k.id == params[0];
  858. })[0][val]
  859. }else{
  860. const params = this.radioObj['radio' + (this.cusIndex-1)].split("&")
  861. return this.popDataArr[this.cusIndex - 2].filter(k=>{
  862. return k.id == params[0]
  863. })[0][val]
  864. }
  865. };
  866. },
  867. pickerOptions({ $props }) {
  868. return {
  869. disabledDate: (time) => {
  870. return time.getTime() < Date.now()-1 * 24 * 60 * 60 * 1000
  871. }
  872. };
  873. }
  874. },
  875. created() {
  876. this.getDictList();
  877. this.getWalletList();
  878. this.getWarehouseList();
  879. this.getTypeList();
  880. if (this.listItem) {
  881. this.getDetail();
  882. }
  883. },
  884. beforeUpdate() {},
  885. methods: {
  886. // 返回列表
  887. goBack() {
  888. this.$emit("backListFormDetail");
  889. },
  890. // 获取详情
  891. getDetail() {
  892. getDetail({ id: this.listItem.id }).then((res) => {
  893. let data = res.data;
  894. this.mainForm.date = data.theTime;
  895. this.mainForm.type = data.mainId;
  896. this.mainForm.remark = data.remark;
  897. data.retailOrderItemList.forEach((item) => {
  898. item.status1 = "";
  899. item.status2 = "";
  900. });
  901. this.goodsList = data.retailOrderItemList;
  902. });
  903. },
  904. // 获取销售政策
  905. getPolicyList() {
  906. policyList({
  907. pageNum: 1,
  908. pageSize: -1,
  909. }).then((res) => {
  910. console.log(res, "tyep");
  911. this.screenForm.policyId = res.data.records[0].code;
  912. this.policyList = res.data.records;
  913. console.log(this.policyList,'policyList');
  914. });
  915. },
  916. getTypeList() {
  917. const params = {
  918. pageNum: 1,
  919. pageSize: -1,
  920. saleCode: "",
  921. saleName: "",
  922. status: "",
  923. };
  924. typeList(params).then((res) => {
  925. this.ztypeList = res.data.records;
  926. console.log(this.ztypeList, "type1111");
  927. });
  928. },
  929. handleSelectiontAllChange(e) {
  930. console.log(e);
  931. },
  932. handleSelectionChange(e) {
  933. console.log(e);
  934. },
  935. // 获取仓库列表
  936. getWarehouseList() {
  937. getWarehouseList({
  938. pageNum: 1,
  939. pageSize: -1,
  940. }).then((res) => {
  941. this.warehouseList = res.data.records;
  942. });
  943. },
  944. // 获取限定机型
  945. getpolicyTypeList() {
  946. getpolicyTypeList({
  947. pageNum: 1,
  948. pageSize: 10,
  949. policyId: this.screenForm.policyId,
  950. saleTypeCode: this.screenForm.saleTypeCode,
  951. }).then((res) => {
  952. for (let i = 0; i < res.data.records.length; i++) {
  953. res.data.records[i].qty = 1;
  954. }
  955. this.dataList = res.data.records;
  956. this.total = res.data.total
  957. console.log(this.dataList, "kkkk");
  958. });
  959. },
  960. getMaterialTypeList() {
  961. getMaterialTypeList({
  962. pageNum: 1,
  963. pageSize: 10,
  964. policyId: this.screenForm.policyId,
  965. saleTypeCode: this.screenForm.saleTypeCode,
  966. }).then((res) => {});
  967. },
  968. //引用销售政策搜索
  969. handlePolicyTypeList() {
  970. this.getpolicyTypeList();
  971. },
  972. handleShow() {
  973. this.isShowDialog = true;
  974. this.getPolicyList();
  975. },
  976. // 获取钱包列表
  977. getWalletList() {
  978. getWalletList({
  979. customerId: JSON.parse(localStorage.getItem("supply_user")).customerId,
  980. type: "COMMONLY",
  981. }).then((res) => {
  982. this.xjWalletList = res.data;
  983. console.log(res.data, "xxxxx");
  984. });
  985. getWalletList({
  986. customerId: JSON.parse(localStorage.getItem("supply_user")).customerId,
  987. type: "REBATE",
  988. }).then((res) => {
  989. this.flWalletList = res.data;
  990. console.log(this.flWalletList, "xxccc");
  991. });
  992. },
  993. // 获取销售类型列表
  994. getSalesTypeList() {
  995. getSalesTypeList({
  996. pageNum: 1,
  997. pageSize: -1,
  998. }).then((res) => {
  999. this.salesTypeList = res.data.records;
  1000. });
  1001. },
  1002. getDictList() {
  1003. getDictList({ sysDictEnum: "PRODUCT_TYPE" }).then((res) => {
  1004. this.typeList = res.data;
  1005. });
  1006. },
  1007. // 获取商品列表
  1008. getGoodsList() {
  1009. getGoodsList({
  1010. pageNum: this.currentPage,
  1011. pageSize: 10,
  1012. mainId: this.screenForm.type,
  1013. saleId: this.screenForm.salesType,
  1014. materialCode: this.screenForm.proNum,
  1015. materialName: this.screenForm.proName,
  1016. specification: this.screenForm.proModel,
  1017. price1: this.screenForm.price1,
  1018. price2: this.screenForm.price2,
  1019. }).then((res) => {
  1020. let oldGoodsList = this.goodsList;
  1021. let newGoodsList = res.data.records;
  1022. for (let i = 0; i < oldGoodsList.length; i++) {
  1023. let oldItem = oldGoodsList[i];
  1024. for (let j = 0; j < newGoodsList.length; j++) {
  1025. let newItem = newGoodsList[j];
  1026. if (newItem.materialId === oldItem.materialId) {
  1027. newGoodsList[j].selected = true;
  1028. break;
  1029. }
  1030. }
  1031. }
  1032. res.data.records.forEach((item) => {
  1033. item.materialName = item.name;
  1034. item.materialCode = item.number;
  1035. item.saleTypeName = item.saleName;
  1036. item.unit = item.baseUnit;
  1037. item.price = item.batchPrice;
  1038. item.tax = item.taxRate;
  1039. item.isDirectTransfer = false;
  1040. item.directTransferQty = "";
  1041. item.status1 = "";
  1042. item.status2 = "";
  1043. item.rebateAmount = "";
  1044. item.rebateRate = "";
  1045. item.productPriceId = item.id;
  1046. });
  1047. this.leftGoodsList = res.data.records;
  1048. this.listTotal = res.data.total;
  1049. });
  1050. },
  1051. // 查询重复值并禁选
  1052. checkboxSelect(row, rowIndex) {
  1053. if (row.selected) {
  1054. return false; // 禁用
  1055. } else {
  1056. return true; // 不禁用
  1057. }
  1058. },
  1059. // 点击 选择商品
  1060. openDialog() {
  1061. this.getSalesTypeList();
  1062. this.getGoodsList();
  1063. this.isShowDialog = true;
  1064. },
  1065. // 提交筛选表单
  1066. submitScreenForm() {
  1067. this.currentPage = 1;
  1068. this.getGoodsList();
  1069. },
  1070. // 重置筛选表单
  1071. resetScreenForm() {
  1072. this.$refs.screenForm.resetFields();
  1073. this.currentPage = 1;
  1074. this.getGoodsList();
  1075. },
  1076. // 更改列表当前页
  1077. handleTableCurrentChange(val) {
  1078. this.currentPage = val;
  1079. this.getGoodsList();
  1080. },
  1081. // 关闭 弹窗
  1082. closeDialog() {
  1083. this.isShowDialog = false;
  1084. },
  1085. // 删除
  1086. deleteGoods() {
  1087. let rightGoodsList = this.rightGoodsList;
  1088. let rightSelection = this.rightSelection;
  1089. for (let i = 0; i < rightGoodsList.length; i++) {
  1090. for (let j = 0; j < rightSelection.length; j++) {
  1091. if (rightSelection[j].materialId == rightGoodsList[i].materialId) {
  1092. this.rightGoodsList.splice(i, 1);
  1093. }
  1094. }
  1095. }
  1096. },
  1097. handleCondition() {
  1098. if (Object.values(this.radioObj)[this.cusIndex - 1] !== "") {
  1099. this.popArr.length >= this.cusIndex ? (this.cusIndex += 1) : "";
  1100. const params = this.radio.split("&");
  1101. this.step = this.cusIndex + 1;
  1102. this.getConditionList(params[3], this.step);
  1103. return;
  1104. } else {
  1105. this.$errorMsg("请选择");
  1106. }
  1107. },
  1108. // 确定 添加产品
  1109. submitAddGoods() {
  1110. if (this.radio) {
  1111. const params = this.radio.split("&");
  1112. this.screenForm.policyId = params[1];
  1113. this.mainForm.policyId = params[1];
  1114. this.cusIndex += 1;
  1115. getpolicyList({
  1116. materialId: params[2],
  1117. policyId: params[1],
  1118. }).then((res) => {
  1119. this.pop = res.data.pop;
  1120. this.popArr = res.data.pop.split(":");
  1121. this.popArr.splice(0, 1);
  1122. for (let i = 0; i < this.popArr.length; i++) {
  1123. this.$set(this.radioObj, "radio" + (i + 1), "");
  1124. }
  1125. this.step = this.cusIndex + 1;
  1126. this.getConditionList(params[3], this.step);
  1127. });
  1128. } else {
  1129. this.$errorMsg("请选择");
  1130. }
  1131. },
  1132. // 更改每页数量
  1133. handleSizeChange(val) {
  1134. this.pageSize = val;
  1135. this.currentPage = 1;
  1136. const params = this.radio.split("&");
  1137. this.step = this.cusIndex + 1;
  1138. this.getConditionList(params[3], this.step);
  1139. },
  1140. // 更改当前页
  1141. handleCurrentChange(val) {
  1142. this.currentPage = val;
  1143. const params = this.radio.split("&");
  1144. this.step = this.cusIndex + 1;
  1145. this.getConditionList(params[3], this.step);
  1146. },
  1147. getConditionList(policyConditionId, popType) {
  1148. getConditionList({
  1149. pageNum: this.currentPage,
  1150. pageSize: this.pageSize,
  1151. policyConditionId,
  1152. popType,
  1153. }).then((res) => {
  1154. const datas = res.data.records;
  1155. for (let i = 0; i < res.data.records.length; i++) {
  1156. res.data.records[i].qty = 1;
  1157. }
  1158. if (this.popDataArr.length) {
  1159. this.popDataArr.splice(this.cusIndex - 1, 1);
  1160. }
  1161. if (this.cusIndex == 0) {
  1162. this.popDataArr = [];
  1163. }
  1164. // this.popDataArr.push(datas)
  1165. if (this.cusIndex == 1) {
  1166. const params = this.radio.split("&");
  1167. for (let k = 0; k < datas.length; k++) {
  1168. if (params[2]== datas[k].materialId) {
  1169. datas.splice(k, 1);
  1170. }
  1171. }
  1172. this.popDataArr.push(datas);
  1173. } else {
  1174. const params = this.radioObj['radio' + (this.cusIndex-1)].split("&")
  1175. for (let k = 0; k < datas.length; k++) {
  1176. if (params[2] == datas[k].id) {
  1177. datas.splice(k, 1);
  1178. }
  1179. }
  1180. this.popDataArr.push(datas);
  1181. }
  1182. });
  1183. },
  1184. hanlePopData() {
  1185. if (!Object.values(this.radioObj).includes("")) {
  1186. let arrData = [];
  1187. for (let i = 0; i < this.popDataArr.length; i++) {
  1188. arrData = [...arrData, ...this.popDataArr[i]];
  1189. }
  1190. for (let j = 0; j < arrData.length; j++) {
  1191. for (const key in this.radioObj) {
  1192. const params = this.radioObj[key].split("&");
  1193. console.log(params);
  1194. if (arrData[j].id == params[0]) {
  1195. this.goodsList = [...this.goodsList, arrData[j]];
  1196. }
  1197. }
  1198. }
  1199. const params = this.radio.split("&");
  1200. let arr = [];
  1201. console.log(this.dataList, "dataList");
  1202. for (let k = 0; k < this.dataList.length; k++) {
  1203. if (this.dataList[k].id == params[0]) {
  1204. arr = [this.dataList[k]];
  1205. console.log(...arr, "jjjjj");
  1206. }
  1207. }
  1208. this.goodsList = [...arr, ...this.goodsList];
  1209. this.goodsList.forEach((item) => {
  1210. this.$set(item, "status1", "");
  1211. this.$set(item, "status2", "");
  1212. });
  1213. this.cusIndex = 0;
  1214. this.radio = "";
  1215. this.dataList = [];
  1216. this.policyId =this.screenForm.policyId
  1217. this.isShowDialog = false;
  1218. } else {
  1219. this.$errorMsg("请选择");
  1220. }
  1221. },
  1222. handleClose() {
  1223. this.cusIndex = 0;
  1224. this.radio = "";
  1225. this.dataList = [];
  1226. this.screenForm.policyId = "";
  1227. this.screenForm.saleTypeCode = "";
  1228. },
  1229. // 删除产品
  1230. deleteItem(index) {
  1231. this.goodsList.splice(index, 1);
  1232. },
  1233. // 修改返利钱包
  1234. changeWallet(index) {
  1235. if (this.goodsList[index].customerWalletId2) {
  1236. let obj = this.flWalletList.find(
  1237. (o) => o.customerWalletId == this.goodsList[index].customerWalletId2
  1238. );
  1239. this.goodsList[index].rebateRate = obj.rebateRate;
  1240. } else {
  1241. this.goodsList[index].rebateRate = "";
  1242. }
  1243. },
  1244. // 检查库存
  1245. checkStock() {
  1246. if (!this.warehouseValue) {
  1247. return this.$errorMsg("请选择仓库");
  1248. }
  1249. if (!this.goodsList) {
  1250. return this.$errorMsg("请添加货品");
  1251. }
  1252. let ids = [];
  1253. this.goodsList.forEach((item) => {
  1254. ids.push(item.materialId);
  1255. });
  1256. checkStock({
  1257. correspondId: this.warehouseValue,
  1258. materialId: ids.join(","),
  1259. }).then((res) => {
  1260. if (res.data) {
  1261. this.goodsList.forEach((item, index) => {
  1262. item.status1 = res.data[index].allStockNum;
  1263. item.status2 = res.data[index].stockNum;
  1264. console.log(item.status1, item.status2);
  1265. });
  1266. }
  1267. });
  1268. },
  1269. status2Filter(item) {
  1270. if (
  1271. item.status2 === "" ||
  1272. item.status2 === null ||
  1273. item.status2 === undefined
  1274. )
  1275. return "未检查";
  1276. else if (item.status2 >= item.qty) return "可用";
  1277. else return "短缺";
  1278. },
  1279. // 保存
  1280. clickSubmitForm() {
  1281. this.$refs.mainForm.validate((valid) => {
  1282. if (valid) {
  1283. let mainName =
  1284. this.typeList[
  1285. findElem(this.typeList, "dictCode", this.mainForm.type)
  1286. ].dictValue;
  1287. let params = {
  1288. theTime: this.mainForm.date + " 00:00:00",
  1289. mainId: this.mainForm.type,
  1290. mainName,
  1291. remark: this.mainForm.remark,
  1292. type: 2, // 1:普通零售单,2:政策零售单
  1293. retailOrderItemList: this.goodsList,
  1294. policyId:this.policyId,
  1295. };
  1296. if (this.listItem) {
  1297. params.id = this.listItem.id;
  1298. editData(params).then((res) => {
  1299. this.$successMsg("编辑成功");
  1300. this.goBack();
  1301. this.$parent.getList();
  1302. });
  1303. } else {
  1304. addData(params).then((res) => {
  1305. this.$successMsg("添加成功");
  1306. this.goBack();
  1307. this.$parent.getList();
  1308. });
  1309. }
  1310. }
  1311. });
  1312. },
  1313. },
  1314. };
  1315. </script>
  1316. <style scoped lang="scss">
  1317. .fr {
  1318. margin: 10px;
  1319. overflow: hidden;
  1320. }
  1321. .detail-container {
  1322. width: 100%;
  1323. height: 100%;
  1324. }
  1325. .main-title {
  1326. display: flex;
  1327. justify-content: space-between;
  1328. align-items: center;
  1329. margin-top: 20px;
  1330. height: 60px;
  1331. border-bottom: 1px solid #dcdfe6;
  1332. margin-bottom: 20px;
  1333. .title {
  1334. font-size: 16px;
  1335. font-weight: 600;
  1336. padding-left: 10px;
  1337. }
  1338. }
  1339. .tables {
  1340. display: flex;
  1341. margin-top: 10px;
  1342. .table {
  1343. width: 45%;
  1344. }
  1345. .buttons {
  1346. display: flex;
  1347. flex-direction: column;
  1348. justify-content: center;
  1349. align-items: center;
  1350. padding: 0 10px;
  1351. button {
  1352. margin: 0;
  1353. margin-top: 10px;
  1354. }
  1355. }
  1356. }
  1357. .ellipsis{
  1358. overflow: hidden;
  1359. text-overflow: ellipsis;
  1360. white-space: nowrap;
  1361. }
  1362. </style>