retail_form.vue 40 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415
  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="10"
  684. >
  685. <!-- :total=" popDataArr[cusIndex - 1]? popDataArr[cusIndex - 1].length:0" -->
  686. </el-pagination>
  687. </div>
  688. </template>
  689. <span slot="footer" class="dialog-footer">
  690. <el-button type="primary" @click="cusIndex -= 1">上一步</el-button>
  691. <el-button
  692. type="primary"
  693. @click="handleCondition"
  694. v-if="popArr.length != cusIndex"
  695. >下一步</el-button
  696. >
  697. <el-button
  698. type="primary"
  699. @click="hanlePopData"
  700. v-if="popArr.length == cusIndex"
  701. >完成</el-button
  702. >
  703. </span>
  704. </template>
  705. </el-dialog>
  706. </div>
  707. </template>
  708. <script>
  709. import {
  710. getDetail,
  711. addData,
  712. editData,
  713. getSalesTypeList,
  714. getGoodsList,
  715. getWalletList,
  716. getWarehouseList,
  717. policyList,
  718. checkStock,
  719. typeList,
  720. getpolicyList,
  721. getConditionList,
  722. getConditionDetail,
  723. getpolicyTypeList,
  724. } from "@/api/supply/policy";
  725. import { getDictList } from "@/api/common";
  726. import { findElem } from "@/utils/util";
  727. export default {
  728. name: "RetailForm",
  729. componentName: "RetailForm",
  730. props: ["listItem"],
  731. filters: {
  732. status1Filter(val) {
  733. if (val === "" || val === null || val === undefined) return "未检查";
  734. else if (val === 0) return "无货";
  735. else if (val > 0 && val <= 30) return val;
  736. else if (val > 30 && val <= 1000) return "有货";
  737. else if (val > 1000) return "充足";
  738. },
  739. },
  740. data() {
  741. return {
  742. tableData: [],
  743. currentPage: 1, // 当前页码
  744. pageSize: 10, // 每页数量
  745. listTotal: 0, // 列表总数
  746. cusIndex: 0,
  747. total:0,
  748. radio: "",
  749. pop: "",
  750. popArr: [],
  751. mainForm: {
  752. id: "",
  753. date: "",
  754. type: "",
  755. ztype: "",
  756. remark: "",
  757. policyCode: "",
  758. policyRemark: "",
  759. policyId: "",
  760. },
  761. mainFormRules: {
  762. date: [
  763. { required: true, message: "请选择单据日期", trigger: "change" },
  764. ],
  765. type: [{ required: true, message: "请选择品类", trigger: "change" }],
  766. },
  767. goodsList: [],
  768. warehouseList: [],
  769. warehouseValue: "",
  770. isShowDialog: false,
  771. screenForm: {
  772. policyId: "",
  773. saleTypeCode: "",
  774. },
  775. currentPage: 1,
  776. listTotal: 0,
  777. salesTypeList: [],
  778. typeList: [],
  779. ztypeList: [],
  780. leftGoodsList: [],
  781. rightGoodsList: [],
  782. leftSelection: [],
  783. rightSelection: [],
  784. policyList: [],
  785. xjWalletList: [],
  786. flWalletList: [],
  787. dataList: [],
  788. columns: [
  789. {
  790. prop: "saleTypeName",
  791. lable: "销售类型",
  792. widht: 160,
  793. },
  794. {
  795. prop: "materialName",
  796. lable: "货品名称",
  797. widht: 160,
  798. },
  799. {
  800. prop: "specification",
  801. lable: "规格型号",
  802. widht: 160,
  803. },
  804. {
  805. prop: "qty",
  806. lable: "数量",
  807. widht: 160,
  808. num: true,
  809. },
  810. {
  811. prop: "price",
  812. lable: "单价",
  813. widht: 160,
  814. },
  815. {
  816. prop: "zong",
  817. lable: "金额",
  818. jie: true,
  819. },
  820. ],
  821. listLoading: false,
  822. popDataArr: [],
  823. radioObj: {},
  824. step: 0,
  825. policyId:''
  826. };
  827. },
  828. computed: {
  829. sidebar() {
  830. return this.$store.state.app.sidebar;
  831. },
  832. classObj() {
  833. return {
  834. hideSidebar: !this.sidebar.opened,
  835. openSidebar: this.sidebar.opened,
  836. };
  837. },
  838. comxjWalletList() {
  839. return (c) => {
  840. console.log(c, "现金钱包");
  841. const walle = [];
  842. const ovalVall = c == undefined || !c.length ? [] : c;
  843. for (let i = 0; i < this.xjWalletList.length; i++) {
  844. for (let j = 0; j < ovalVall.length; j++) {
  845. if (this.xjWalletList[i].walletRebateId == ovalVall[j].walletId) {
  846. walle.push(this.xjWalletList[i]);
  847. }
  848. }
  849. }
  850. return walle;
  851. };
  852. },
  853. comText() {
  854. return (val) => {
  855. if (this.cusIndex-1 ==0) {
  856. const params = this.radio.split("&");
  857. return this.dataList.filter((k) => {
  858. return k.id == params[0];
  859. })[0][val]
  860. }else{
  861. const params = this.radioObj['radio' + (this.cusIndex-1)].split("&")
  862. return this.popDataArr[this.cusIndex - 2].filter(k=>{
  863. return k.id == params[0]
  864. })[0][val]
  865. }
  866. };
  867. },
  868. pickerOptions({ $props }) {
  869. return {
  870. disabledDate: (time) => {
  871. return time.getTime() < Date.now()-1 * 24 * 60 * 60 * 1000
  872. }
  873. };
  874. }
  875. },
  876. created() {
  877. this.getDictList();
  878. this.getWalletList();
  879. this.getWarehouseList();
  880. this.getTypeList();
  881. if (this.listItem) {
  882. this.getDetail();
  883. }
  884. },
  885. beforeUpdate() {},
  886. methods: {
  887. // 返回列表
  888. goBack() {
  889. this.$emit("backListFormDetail");
  890. },
  891. // 获取详情
  892. getDetail() {
  893. getDetail({ id: this.listItem.id }).then((res) => {
  894. let data = res.data;
  895. this.mainForm.date = data.theTime;
  896. this.mainForm.type = data.mainId;
  897. this.mainForm.remark = data.remark;
  898. data.retailOrderItemList.forEach((item) => {
  899. item.status1 = "";
  900. item.status2 = "";
  901. });
  902. this.goodsList = data.retailOrderItemList;
  903. });
  904. },
  905. // 获取销售政策
  906. getPolicyList() {
  907. policyList({
  908. pageNum: 1,
  909. pageSize: -1,
  910. }).then((res) => {
  911. console.log(res, "tyep");
  912. this.screenForm.policyId = res.data.records[0].code;
  913. this.policyList = res.data.records;
  914. console.log(this.policyList,'policyList');
  915. });
  916. },
  917. getTypeList() {
  918. const params = {
  919. pageNum: 1,
  920. pageSize: -1,
  921. saleCode: "",
  922. saleName: "",
  923. status: "",
  924. };
  925. typeList(params).then((res) => {
  926. this.ztypeList = res.data.records;
  927. console.log(this.ztypeList, "type1111");
  928. });
  929. },
  930. handleSelectiontAllChange(e) {
  931. console.log(e);
  932. },
  933. handleSelectionChange(e) {
  934. console.log(e);
  935. },
  936. // 获取仓库列表
  937. getWarehouseList() {
  938. getWarehouseList({
  939. pageNum: 1,
  940. pageSize: -1,
  941. }).then((res) => {
  942. this.warehouseList = res.data.records;
  943. });
  944. },
  945. // 获取限定机型
  946. getpolicyTypeList() {
  947. getpolicyTypeList({
  948. pageNum: 1,
  949. pageSize: 10,
  950. policyId: this.screenForm.policyId,
  951. saleTypeCode: this.screenForm.saleTypeCode,
  952. }).then((res) => {
  953. for (let i = 0; i < res.data.records.length; i++) {
  954. res.data.records[i].qty = 1;
  955. }
  956. this.dataList = res.data.records;
  957. this.total = res.data.total
  958. console.log(this.dataList, "kkkk");
  959. });
  960. },
  961. getMaterialTypeList() {
  962. getMaterialTypeList({
  963. pageNum: 1,
  964. pageSize: 10,
  965. policyId: this.screenForm.policyId,
  966. saleTypeCode: this.screenForm.saleTypeCode,
  967. }).then((res) => {});
  968. },
  969. //引用销售政策搜索
  970. handlePolicyTypeList() {
  971. this.getpolicyTypeList();
  972. },
  973. handleShow() {
  974. this.isShowDialog = true;
  975. this.getPolicyList();
  976. },
  977. // 获取钱包列表
  978. getWalletList() {
  979. getWalletList({
  980. customerId: JSON.parse(localStorage.getItem("supply_user")).customerId,
  981. type: "COMMONLY",
  982. }).then((res) => {
  983. this.xjWalletList = res.data;
  984. console.log(res.data, "xxxxx");
  985. });
  986. getWalletList({
  987. customerId: JSON.parse(localStorage.getItem("supply_user")).customerId,
  988. type: "REBATE",
  989. }).then((res) => {
  990. this.flWalletList = res.data;
  991. console.log(this.flWalletList, "xxccc");
  992. });
  993. },
  994. // 获取销售类型列表
  995. getSalesTypeList() {
  996. getSalesTypeList({
  997. pageNum: 1,
  998. pageSize: -1,
  999. }).then((res) => {
  1000. this.salesTypeList = res.data.records;
  1001. });
  1002. },
  1003. getDictList() {
  1004. getDictList({ sysDictEnum: "PRODUCT_TYPE" }).then((res) => {
  1005. this.typeList = res.data;
  1006. });
  1007. },
  1008. // 获取商品列表
  1009. getGoodsList() {
  1010. getGoodsList({
  1011. pageNum: this.currentPage,
  1012. pageSize: 10,
  1013. mainId: this.screenForm.type,
  1014. saleId: this.screenForm.salesType,
  1015. materialCode: this.screenForm.proNum,
  1016. materialName: this.screenForm.proName,
  1017. specification: this.screenForm.proModel,
  1018. price1: this.screenForm.price1,
  1019. price2: this.screenForm.price2,
  1020. }).then((res) => {
  1021. let oldGoodsList = this.goodsList;
  1022. let newGoodsList = res.data.records;
  1023. for (let i = 0; i < oldGoodsList.length; i++) {
  1024. let oldItem = oldGoodsList[i];
  1025. for (let j = 0; j < newGoodsList.length; j++) {
  1026. let newItem = newGoodsList[j];
  1027. if (newItem.materialId === oldItem.materialId) {
  1028. newGoodsList[j].selected = true;
  1029. break;
  1030. }
  1031. }
  1032. }
  1033. res.data.records.forEach((item) => {
  1034. item.materialName = item.name;
  1035. item.materialCode = item.number;
  1036. item.saleTypeName = item.saleName;
  1037. item.unit = item.baseUnit;
  1038. item.price = item.batchPrice;
  1039. item.tax = item.taxRate;
  1040. item.isDirectTransfer = false;
  1041. item.directTransferQty = "";
  1042. item.status1 = "";
  1043. item.status2 = "";
  1044. item.rebateAmount = "";
  1045. item.rebateRate = "";
  1046. item.productPriceId = item.id;
  1047. });
  1048. this.leftGoodsList = res.data.records;
  1049. this.listTotal = res.data.total;
  1050. });
  1051. },
  1052. // 查询重复值并禁选
  1053. checkboxSelect(row, rowIndex) {
  1054. if (row.selected) {
  1055. return false; // 禁用
  1056. } else {
  1057. return true; // 不禁用
  1058. }
  1059. },
  1060. // 点击 选择商品
  1061. openDialog() {
  1062. this.getSalesTypeList();
  1063. this.getGoodsList();
  1064. this.isShowDialog = true;
  1065. },
  1066. // 提交筛选表单
  1067. submitScreenForm() {
  1068. this.currentPage = 1;
  1069. this.getGoodsList();
  1070. },
  1071. // 重置筛选表单
  1072. resetScreenForm() {
  1073. this.$refs.screenForm.resetFields();
  1074. this.currentPage = 1;
  1075. this.getGoodsList();
  1076. },
  1077. // 更改列表当前页
  1078. handleTableCurrentChange(val) {
  1079. this.currentPage = val;
  1080. this.getGoodsList();
  1081. },
  1082. // 关闭 弹窗
  1083. closeDialog() {
  1084. this.isShowDialog = false;
  1085. },
  1086. // 删除
  1087. deleteGoods() {
  1088. let rightGoodsList = this.rightGoodsList;
  1089. let rightSelection = this.rightSelection;
  1090. for (let i = 0; i < rightGoodsList.length; i++) {
  1091. for (let j = 0; j < rightSelection.length; j++) {
  1092. if (rightSelection[j].materialId == rightGoodsList[i].materialId) {
  1093. this.rightGoodsList.splice(i, 1);
  1094. }
  1095. }
  1096. }
  1097. },
  1098. handleCondition() {
  1099. if (Object.values(this.radioObj)[this.cusIndex - 1] !== "") {
  1100. this.popArr.length >= this.cusIndex ? (this.cusIndex += 1) : "";
  1101. const params = this.radio.split("&");
  1102. this.step = this.cusIndex + 1;
  1103. this.getConditionList(params[3], this.step);
  1104. return;
  1105. } else {
  1106. this.$errorMsg("请选择");
  1107. }
  1108. },
  1109. // 确定 添加产品
  1110. submitAddGoods() {
  1111. if (this.radio) {
  1112. const params = this.radio.split("&");
  1113. this.screenForm.policyId = params[1];
  1114. this.mainForm.policyId = params[1];
  1115. this.cusIndex += 1;
  1116. getpolicyList({
  1117. materialId: params[2],
  1118. policyId: params[1],
  1119. }).then((res) => {
  1120. this.pop = res.data.pop;
  1121. this.popArr = res.data.pop.split(":");
  1122. this.popArr.splice(0, 1);
  1123. for (let i = 0; i < this.popArr.length; i++) {
  1124. this.$set(this.radioObj, "radio" + (i + 1), "");
  1125. }
  1126. this.step = this.cusIndex + 1;
  1127. this.getConditionList(params[3], this.step);
  1128. });
  1129. } else {
  1130. this.$errorMsg("请选择");
  1131. }
  1132. },
  1133. // 更改每页数量
  1134. handleSizeChange(val) {
  1135. this.pageSize = val;
  1136. this.currentPage = 1;
  1137. const params = this.radio.split("&");
  1138. this.step = this.cusIndex + 1;
  1139. this.getConditionList(params[3], this.step);
  1140. },
  1141. // 更改当前页
  1142. handleCurrentChange(val) {
  1143. this.currentPage = val;
  1144. const params = this.radio.split("&");
  1145. this.step = this.cusIndex + 1;
  1146. this.getConditionList(params[3], this.step);
  1147. },
  1148. getConditionList(policyConditionId, popType) {
  1149. getConditionList({
  1150. pageNum: this.currentPage,
  1151. pageSize: this.pageSize,
  1152. policyConditionId,
  1153. popType,
  1154. }).then((res) => {
  1155. const datas = res.data.records;
  1156. for (let i = 0; i < res.data.records.length; i++) {
  1157. res.data.records[i].qty = 1;
  1158. }
  1159. if (this.popDataArr.length) {
  1160. this.popDataArr.splice(this.cusIndex - 1, 1);
  1161. }
  1162. if (this.cusIndex == 0) {
  1163. this.popDataArr = [];
  1164. }
  1165. // this.popDataArr.push(datas)
  1166. if (this.cusIndex == 1) {
  1167. const params = this.radio.split("&");
  1168. for (let k = 0; k < datas.length; k++) {
  1169. if (params[2]== datas[k].materialId) {
  1170. datas.splice(k, 1);
  1171. }
  1172. }
  1173. this.popDataArr.push(datas);
  1174. } else {
  1175. const params = this.radioObj['radio' + (this.cusIndex-1)].split("&")
  1176. for (let k = 0; k < datas.length; k++) {
  1177. if (params[2] == datas[k].id) {
  1178. datas.splice(k, 1);
  1179. }
  1180. }
  1181. this.popDataArr.push(datas);
  1182. }
  1183. });
  1184. },
  1185. hanlePopData() {
  1186. if (!Object.values(this.radioObj).includes("")) {
  1187. let arrData = [];
  1188. for (let i = 0; i < this.popDataArr.length; i++) {
  1189. arrData = [...arrData, ...this.popDataArr[i]];
  1190. }
  1191. for (let j = 0; j < arrData.length; j++) {
  1192. for (const key in this.radioObj) {
  1193. const params = this.radioObj[key].split("&");
  1194. console.log(params);
  1195. if (arrData[j].id == params[0]) {
  1196. this.goodsList = [...this.goodsList, arrData[j]];
  1197. }
  1198. }
  1199. }
  1200. const params = this.radio.split("&");
  1201. let arr = [];
  1202. console.log(this.dataList, "dataList");
  1203. for (let k = 0; k < this.dataList.length; k++) {
  1204. if (this.dataList[k].id == params[0]) {
  1205. arr = [this.dataList[k]];
  1206. console.log(...arr, "jjjjj");
  1207. }
  1208. }
  1209. this.goodsList = [...arr, ...this.goodsList];
  1210. this.goodsList.forEach((item) => {
  1211. this.$set(item, "status1", "");
  1212. this.$set(item, "status2", "");
  1213. });
  1214. this.cusIndex = 0;
  1215. this.radio = "";
  1216. this.dataList = [];
  1217. this.policyId =this.screenForm.policyId
  1218. this.isShowDialog = false;
  1219. } else {
  1220. this.$errorMsg("请选择");
  1221. }
  1222. },
  1223. handleClose() {
  1224. this.cusIndex = 0;
  1225. this.radio = "";
  1226. this.dataList = [];
  1227. this.screenForm.policyId = "";
  1228. this.screenForm.saleTypeCode = "";
  1229. },
  1230. // 删除产品
  1231. deleteItem(index) {
  1232. this.goodsList.splice(index, 1);
  1233. },
  1234. // 修改返利钱包
  1235. changeWallet(index) {
  1236. if (this.goodsList[index].customerWalletId2) {
  1237. let obj = this.flWalletList.find(
  1238. (o) => o.customerWalletId == this.goodsList[index].customerWalletId2
  1239. );
  1240. this.goodsList[index].rebateRate = obj.rebateRate;
  1241. } else {
  1242. this.goodsList[index].rebateRate = "";
  1243. }
  1244. },
  1245. // 检查库存
  1246. checkStock() {
  1247. if (!this.warehouseValue) {
  1248. return this.$errorMsg("请选择仓库");
  1249. }
  1250. if (!this.goodsList) {
  1251. return this.$errorMsg("请添加货品");
  1252. }
  1253. let ids = [];
  1254. this.goodsList.forEach((item) => {
  1255. ids.push(item.materialId);
  1256. });
  1257. checkStock({
  1258. correspondId: this.warehouseValue,
  1259. materialId: ids.join(","),
  1260. }).then((res) => {
  1261. if (res.data) {
  1262. this.goodsList.forEach((item, index) => {
  1263. item.status1 = res.data[index].allStockNum;
  1264. item.status2 = res.data[index].stockNum;
  1265. console.log(item.status1, item.status2);
  1266. });
  1267. }
  1268. });
  1269. },
  1270. status2Filter(item) {
  1271. if (
  1272. item.status2 === "" ||
  1273. item.status2 === null ||
  1274. item.status2 === undefined
  1275. )
  1276. return "未检查";
  1277. else if (item.status2 >= item.qty) return "可用";
  1278. else return "短缺";
  1279. },
  1280. // 保存
  1281. clickSubmitForm() {
  1282. this.$refs.mainForm.validate((valid) => {
  1283. if (valid) {
  1284. let mainName =
  1285. this.typeList[
  1286. findElem(this.typeList, "dictCode", this.mainForm.type)
  1287. ].dictValue;
  1288. let params = {
  1289. theTime: this.mainForm.date + " 00:00:00",
  1290. mainId: this.mainForm.type,
  1291. mainName,
  1292. remark: this.mainForm.remark,
  1293. type: 2, // 1:普通零售单,2:政策零售单
  1294. retailOrderItemList: this.goodsList,
  1295. policyId:this.policyId,
  1296. };
  1297. if (this.listItem) {
  1298. params.id = this.listItem.id;
  1299. editData(params).then((res) => {
  1300. this.$successMsg("编辑成功");
  1301. this.goBack();
  1302. this.$parent.getList();
  1303. });
  1304. } else {
  1305. addData(params).then((res) => {
  1306. this.$successMsg("添加成功");
  1307. this.goBack();
  1308. this.$parent.getList();
  1309. });
  1310. }
  1311. }
  1312. });
  1313. },
  1314. },
  1315. };
  1316. </script>
  1317. <style scoped lang="scss">
  1318. .fr {
  1319. margin: 10px;
  1320. overflow: hidden;
  1321. }
  1322. .detail-container {
  1323. width: 100%;
  1324. height: 100%;
  1325. }
  1326. .main-title {
  1327. display: flex;
  1328. justify-content: space-between;
  1329. align-items: center;
  1330. margin-top: 20px;
  1331. height: 60px;
  1332. border-bottom: 1px solid #dcdfe6;
  1333. margin-bottom: 20px;
  1334. .title {
  1335. font-size: 16px;
  1336. font-weight: 600;
  1337. padding-left: 10px;
  1338. }
  1339. }
  1340. .tables {
  1341. display: flex;
  1342. margin-top: 10px;
  1343. .table {
  1344. width: 45%;
  1345. }
  1346. .buttons {
  1347. display: flex;
  1348. flex-direction: column;
  1349. justify-content: center;
  1350. align-items: center;
  1351. padding: 0 10px;
  1352. button {
  1353. margin: 0;
  1354. margin-top: 10px;
  1355. }
  1356. }
  1357. }
  1358. .ellipsis{
  1359. overflow: hidden;
  1360. text-overflow: ellipsis;
  1361. white-space: nowrap;
  1362. }
  1363. </style>