activeStatisticsList.vue 37 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943
  1. <template>
  2. <div :style="{padding:type=='edit'?'10px':0}">
  3. <a-spin :spinning="spinning" tip="Loading...">
  4. <ve-table
  5. style="width:100%"
  6. border-y
  7. border-x
  8. border-around
  9. row-key-field-name="salesPromoSn"
  10. :checkbox-option="checkboxOption"
  11. :column-width-resize-option="columnWidthResizeOption"
  12. :cell-style-option="cellStyleOption"
  13. :row-style-option="{clickHighlight: true}"
  14. :cellSelectionOption="{enable: false}"
  15. :virtual-scroll-option="{enable: false}"
  16. :columns="columns"
  17. :table-data="tableData" />
  18. </a-spin>
  19. <!-- 活动规则详情 -->
  20. <detailModal :openModal="openDetailModal" pageType="salesPage" :itemSn="promoRuleSn" @close="closeDetailModal"></detailModal>
  21. <!-- 导入产品 -->
  22. <importGuideModal
  23. v-if="type=='edit'"
  24. ref="importGuideModal"
  25. :openModal="openGuideModal"
  26. @close="closeGuideModel"
  27. @ok="hanldeImportOk" />
  28. <!-- 查看累计产品 -->
  29. <totalProductDetailModal ref="totalProductModal" :show="openTotalProductModal" @cancel="openTotalProductModal=false"></totalProductDetailModal>
  30. <!-- 查看买赠产品详情 -->
  31. <normalProductDetailModal ref="normalProductModal" :buyGiftsInfo="buyGiftsInfo" :openModal="openNormalProductModal" @close="openNormalProductModal=false"></normalProductDetailModal>
  32. </div>
  33. </template>
  34. <script>
  35. import { commonMixin } from '@/utils/mixin'
  36. import detailModal from '@/views/promotionRulesManagement/dealerPromotions/detailModal.vue'
  37. import totalProductDetailModal from './totalProductDetailModal.vue'
  38. import normalProductDetailModal from './normalProductDetailModal.vue'
  39. import ImportGuideModal from './importGuideModal.vue'
  40. import { salesDisablePromo, salesEnablePromoPromo, salesBatchInsert } from '@/api/salesDetailNew'
  41. import { salesPromoSaveSort } from '@/api/salesNew'
  42. export default {
  43. mixins: [commonMixin],
  44. components: { detailModal, ImportGuideModal, totalProductDetailModal, normalProductDetailModal },
  45. props: {
  46. type: {
  47. type: String,
  48. default: 'edit'
  49. },
  50. activeList: {
  51. type: Array,
  52. default: () => []
  53. },
  54. // 仓库sn
  55. warehouseSn: {
  56. type: String,
  57. default: ''
  58. },
  59. // 销售单sn
  60. salesBillSn: {
  61. type: String,
  62. default: ''
  63. },
  64. showCols: {
  65. type: Array,
  66. default: () => []
  67. }
  68. },
  69. watch: {
  70. activeList: {
  71. handler (val) {
  72. if (!this.hasInit) {
  73. this.tableData = []
  74. this.getDataList(val)
  75. }
  76. },
  77. immediate: true
  78. }
  79. },
  80. data () {
  81. return {
  82. hasInit: false,
  83. spinning: false,
  84. // 表格列宽拖到
  85. columnWidthResizeOption: {
  86. // default false
  87. enable: true,
  88. // column resize min width
  89. minWidth: 50
  90. },
  91. openTotalProductModal: false, // 查看累计产品
  92. openNormalProductModal: false, // 查看买赠产品详情
  93. // 表格复选框
  94. checkboxOption: {
  95. hideSelectAll: true,
  96. selectedRowKeys: [],
  97. // 禁用的选择(禁止勾选或者禁止取消勾选)
  98. disableSelectedRowKeys: [],
  99. // 行选择改变事件
  100. selectedRowChange: ({ row, isSelected, selectedRowKeys }) => {
  101. // 当前勾选产品
  102. const endSelProduct = selectedRowKeys[selectedRowKeys.length - 1]
  103. // 叠加多选
  104. if (endSelProduct && row.promotionRule && row.promotionRule.stackFlag == '1') {
  105. const rows = this.tableData.filter(item => selectedRowKeys.includes(item.salesPromoSn) && item.promotionRule && item.promotionRule.stackFlag == '1')
  106. this.checkboxOption.selectedRowKeys = rows.map(item => item.salesPromoSn)
  107. } else {
  108. // 非叠加单选
  109. this.checkboxOption.selectedRowKeys = isSelected ? [endSelProduct] : []
  110. }
  111. // 查询此活动下的已选产品列表
  112. this.$emit('selected', this.checkboxOption.selectedRowKeys)
  113. }
  114. },
  115. // 单元格样式
  116. cellStyleOption: {
  117. headerCellClass: ({ column, rowIndex }) => {
  118. if (column.key >= 4 && column.key <= 8) {
  119. return 'table-header-cell-blue'
  120. }
  121. if (column.key >= 9 && column.key < 12) {
  122. return 'table-header-cell-red'
  123. }
  124. if (column.key >= 12 && column.key <= 15) {
  125. return 'table-header-cell-green'
  126. }
  127. if (column.key >= 16 && column.key <= 18) {
  128. return 'table-header-cell-org'
  129. }
  130. if (column.key >= 19 && column.key <= 21) {
  131. return 'table-header-cell-zs'
  132. }
  133. },
  134. bodyCellClass: ({ row, column, rowIndex }) => {
  135. }
  136. },
  137. // 筛选
  138. ruleTypeList: [
  139. { value: 'BUY_PROD_GIVE_PROD', label: '买产品送产品', selected: true },
  140. { value: 'BUY_PROD_GIVE_MONEY', label: '买产品送采购额', selected: true },
  141. { value: 'PROMO_PROD', label: '特价活动', selected: true }
  142. ],
  143. ruleEnableList: [
  144. { value: '1', label: '启用', selected: true },
  145. { value: '0', label: '禁用', selected: true }
  146. ],
  147. searchData: {
  148. ruleType: [],
  149. enable: []
  150. },
  151. // 表格列表
  152. tableData: [],
  153. openDetailModal: false, // 规则详情弹框
  154. promoRuleSn: null, // 销售单sn
  155. disabledActiveOption: null, // 禁用规则选项
  156. enableActiveOption: null, // 启用规则选项
  157. openGuideModal: false, // 导入产品引导
  158. buyGiftsInfo: null // 买赠产品弹窗详情信息
  159. }
  160. },
  161. computed: {
  162. columns () {
  163. const _this = this
  164. // 格式化数字金额单元格
  165. const formatTd = (row, column, rowIndex, uniKey, fun) => {
  166. if (column.field != 'regularBaseVal' && column.field != 'regularNextVal' ? row[column.field] : (row[column.field] || row[column.field] == 0)) {
  167. return (<div onClick={() => fun ? fun(row, uniKey) : false}><span class={fun ? 'table-link-btn' : (column.field == 'geteBalance' || column.field == 'regularBaseVal') ? 'table-word-color' : ''}>{row[column.field]}</span><span style="font-size:10px;zoom:0.7;margin-left:3px;">{row[uniKey]}</span></div>)
  168. } else {
  169. return ''
  170. }
  171. }
  172. const cols = [
  173. {
  174. field: '',
  175. key: '1',
  176. title: '序号',
  177. width: 25,
  178. align: 'center',
  179. fixed: 'left',
  180. renderBodyCell: ({ row, column, rowIndex }, h) => {
  181. return ++rowIndex
  182. }
  183. },
  184. {
  185. field: 'promotionRuleType',
  186. key: '2',
  187. width: 90,
  188. title: '活动类型',
  189. align: 'center',
  190. fixed: 'left',
  191. renderBodyCell: ({ row, column, rowIndex }, h) => {
  192. const isTejia = row && row.promotionRule && row.promotionRule.promotionRuleType == 'PROMO_PROD' && row.promotionRule.stackFlag == 1 && _this.type == 'edit' // 是否特价叠加
  193. const tejiaLen = _this.tableData.filter(item => item.promotionRule && item.promotionRule.promotionRuleType == 'PROMO_PROD' && item.promotionRule.stackFlag == 1).length // 特价叠加活动数量
  194. const tjStart = _this.tableData.findIndex(item => item.promotionRule && item.promotionRule.promotionRuleType == 'PROMO_PROD' && item.promotionRule.stackFlag == 1) // 特价叠加活动开始索引
  195. // 特价活动上移下移排序
  196. const equalWord = <div class="table-arrow-box">
  197. {rowIndex > tjStart ? <span class="up" onClick={() => _this.moveTjRow(row, rowIndex, 1)} title="上移">⇡</span> : ''}
  198. {rowIndex < tjStart + tejiaLen - 1 ? <span class="down" onClick={() => _this.moveTjRow(row, rowIndex, 0)} title="下移">⇣</span> : <span></span>}
  199. </div>
  200. // 买产品送产品 同款产品 是累计产品才弹详情窗
  201. if (row.promotionRule.promotionRuleType === 'BUY_PROD_GIVE_PROD' && row.promotionRule.borrowFlag == '1' && row.promotionRule.regularSameFlag == '1') {
  202. return (<div style="width:100%;display:flex;justify-content: space-between;">
  203. <div class="table-link-text" onClick={() => _this.showBuyGifts(row)} style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;" title={row[column.field]}>{row[column.field]}</div>
  204. {isTejia && tejiaLen > 1 ? equalWord : ''}
  205. </div>)
  206. } else {
  207. return (<div style="width:100%;display:flex;justify-content: space-between;">
  208. <div style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;" title={row[column.field]}>{row[column.field]}</div>
  209. {isTejia && tejiaLen > 1 ? equalWord : ''}
  210. </div>)
  211. }
  212. },
  213. // 筛选项
  214. filter: {
  215. filterList: _this.ruleTypeList,
  216. isMultiple: true,
  217. // filter confirm
  218. filterConfirm: (filterList) => {
  219. const labels = filterList
  220. .filter((x) => x.selected)
  221. .map((x) => x.value)
  222. _this.searchData.ruleType = labels
  223. _this.filtrateList()
  224. },
  225. // filter reset
  226. filterReset: (filterList) => {
  227. filterList.map(x => { x.selected = true })
  228. _this.searchData.ruleType = []
  229. _this.filtrateList()
  230. }
  231. }
  232. },
  233. { field: 'promotionRuleDesc',
  234. key: '3',
  235. width: 110,
  236. title: '规则简称',
  237. align: 'center',
  238. fixed: 'left',
  239. renderBodyCell: ({ row, column, rowIndex }, h) => {
  240. let mkInfo = ''
  241. if (row.promotionRule.gateFlag === '1') {
  242. if (row.promotionRule.gateType === 'RATIO_AMOUNT') {
  243. mkInfo = `购买门槛产品金额 ${row.promotionRule.gateValue ? (row.promotionRule.gateValue * 100).toFixed(2) : '0.00'}% 作为配额`
  244. } else if (row.promotionRule.gateType === 'MIN_AMOUNT') {
  245. mkInfo = `购买门槛产品满最低金额 ${this.toThousands(row.promotionRule.gateValue)} 元,不限制配额`
  246. } else {
  247. if (row.promotionRule.promotionRuleType != 'PROMO_PROD') {
  248. mkInfo = `购买满 ${this.toThousands(row.promotionRule.gateValue)} 元门槛产品,可使用 ${this.toThousands(row.promotionRule.quotaAmount)} 元配额,采购规则中的正价商品`
  249. } else {
  250. mkInfo = `购买每满 ${row.promotionRule.gateUnit === 'YUAN' ? this.toThousands(row.promotionRule.gateValue) : row.promotionRule.gateValue} ${row.promotionRule.gateUnit === 'YUAN' ? '元' : '个'}门槛产品,可采购 ${row.promotionRule.quotaAmount} 个特价产品`
  251. }
  252. }
  253. }
  254. return (<div style="width:100%;display:flex;justify-content: space-between;" onClick={() => _this.showDesc(row)}>
  255. <div class="table-link-text">
  256. <a-popover placement="right">
  257. <template slot="title">
  258. {row.promotionTitle + '(' + row[column.field] + ')'}
  259. </template>
  260. <template slot="content">
  261. <div><strong>规则门槛:</strong>{row.promotionRule.gateFlag === '1' ? <div>{mkInfo}</div> : <span>无</span>}</div>
  262. <div><strong>规则:</strong><div domPropsInnerHTML={row.promotionRule.ruleInfo}></div></div>
  263. </template>
  264. <span style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">{row[column.field]}</span>
  265. </a-popover>
  266. </div>
  267. <div style="position:absolute;right:0;">
  268. {row.promotionRule.stackFlag == 1 ? <a-badge count="叠" numberStyle={{ backgroundColor: '#00aa00', marginLeft: '2px', zoom: '0.7' }}/> : ''}
  269. {row.promotionRule.borrowFlag == 1 ? <a-badge count="累" numberStyle={{ backgroundColor: '#F5222D', marginLeft: '2px', zoom: '0.7' }} /> : ''}
  270. </div>
  271. </div>)
  272. }
  273. },
  274. {
  275. title: '门槛产品',
  276. children: [
  277. {
  278. field: 'gateSelected',
  279. key: '4',
  280. title: '已选',
  281. width: 50,
  282. align: 'center',
  283. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'gateUnit')
  284. },
  285. {
  286. field: 'gateTotal',
  287. key: '5',
  288. title: '累计',
  289. width: 50,
  290. align: 'center',
  291. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'gateUnit')
  292. // renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'gateUnit', _this.openTotalProduct)
  293. },
  294. {
  295. field: 'geteBalance',
  296. key: '6',
  297. title: '差额',
  298. width: 50,
  299. align: 'center',
  300. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'gateUnit')
  301. },
  302. {
  303. field: 'gateQuota',
  304. key: '7',
  305. title: '配额',
  306. width: 50,
  307. align: 'center',
  308. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'gateUnit')
  309. },
  310. {
  311. field: 'unUseGateQuota',
  312. key: '8',
  313. title: '未用配额',
  314. width: 60,
  315. align: 'center',
  316. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'gateUnit')
  317. }
  318. ]
  319. },
  320. {
  321. title: '特价',
  322. children: [
  323. {
  324. field: 'specialPriceSelected',
  325. key: '9',
  326. title: '已选',
  327. width: 50,
  328. align: 'center',
  329. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'specialPriceUnit')
  330. },
  331. {
  332. field: 'discountRuleValue',
  333. key: '10',
  334. title: '基础',
  335. width: 60,
  336. align: 'center',
  337. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'discountRuleUnit')
  338. },
  339. {
  340. field: 'discountRuleNextValue',
  341. key: '11',
  342. title: '下阶差',
  343. width: 60,
  344. align: 'center',
  345. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'discountRuleUnit')
  346. }
  347. ]
  348. },
  349. {
  350. title: '正价产品',
  351. children: [
  352. {
  353. field: 'regularSelected',
  354. key: '12',
  355. title: '已选',
  356. width: 50,
  357. align: 'center',
  358. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'regularUnit')
  359. },
  360. {
  361. field: 'regularTotal',
  362. key: '13',
  363. title: '累计',
  364. width: 50,
  365. align: 'center',
  366. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'regularUnit')
  367. // renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'regularUnit', _this.openTotalProduct)
  368. },
  369. {
  370. field: 'regularBaseVal',
  371. key: '14',
  372. title: '基础',
  373. width: 60,
  374. align: 'center',
  375. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'regularUnit')
  376. },
  377. {
  378. field: 'regularNextVal',
  379. key: '15',
  380. title: '下阶差',
  381. width: 60,
  382. align: 'center',
  383. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'regularUnit')
  384. }
  385. ]
  386. },
  387. {
  388. title: '促销品',
  389. children: [
  390. {
  391. field: 'promoLimit',
  392. key: '16',
  393. title: '额度',
  394. width: 50,
  395. align: 'center',
  396. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'promoUnit')
  397. },
  398. {
  399. field: 'promoSelected',
  400. key: '17',
  401. title: '已选',
  402. width: 50,
  403. align: 'center',
  404. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'promoUnit')
  405. },
  406. {
  407. field: 'promoBalance',
  408. key: '18',
  409. title: '差额',
  410. width: 50,
  411. align: 'center',
  412. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'promoUnit')
  413. }
  414. ]
  415. },
  416. {
  417. title: '采购额',
  418. children: [
  419. {
  420. field: 'purchaseLimit',
  421. key: '19',
  422. title: '额度',
  423. width: 50,
  424. align: 'center',
  425. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'purchaseUnit')
  426. },
  427. {
  428. field: 'purchaseSelected',
  429. key: '20',
  430. title: '已选',
  431. width: 50,
  432. align: 'center',
  433. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'purchaseUnit')
  434. },
  435. {
  436. field: 'purchaseSurplus',
  437. key: '21',
  438. title: '结余',
  439. width: 50,
  440. align: 'center',
  441. renderBodyCell: ({ row, column, rowIndex }, h) => formatTd(row, column, rowIndex, 'purchaseUnit')
  442. }
  443. ]
  444. },
  445. { field: 'totalCategory', key: '22', title: '款数', width: 50, align: 'center', fixed: 'right' },
  446. { field: 'totalQty', key: '23', title: '数量', width: 50, align: 'center', fixed: 'right' }
  447. ]
  448. // 复选框
  449. cols.unshift({
  450. field: '',
  451. key: '0',
  452. type: 'checkbox',
  453. title: '',
  454. width: 23,
  455. align: 'center',
  456. fixed: 'left'
  457. })
  458. // 销售价权限
  459. if (this.type == 'view' && this.$hasPermissions('B_salesDetail_salesPrice') || this.type == 'edit' && this.$hasPermissions('B_salesEdit_salesPrice')) {
  460. cols.push({ field: 'totalAmount', key: '24', title: '总金额', width: 60, align: 'center', fixed: 'right', renderBodyCell: ({ row, column, rowIndex }, h) => { return this.toThousands(row[column.field]) } })
  461. cols.push({ field: 'lossAmount', key: '25', title: '优惠金额', width: 60, align: 'center', fixed: 'right', renderBodyCell: ({ row, column, rowIndex }, h) => { return this.toThousands(row[column.field]) } })
  462. }
  463. // 编辑页面
  464. if (this.type == 'edit') {
  465. cols.push({
  466. field: '',
  467. key: '26',
  468. title: '状态',
  469. width: 50,
  470. align: 'center',
  471. fixed: 'right',
  472. renderBodyCell: ({ row, column, rowIndex }, h) => {
  473. return (
  474. <div>
  475. <a-switch checked-children="启" un-checked-children="禁" checked={row.enabledFlag == 1} on-change={(c, e) => this.enableRow(c, e, row)}/>
  476. </div>
  477. )
  478. },
  479. // 筛选项
  480. filter: {
  481. filterList: _this.ruleEnableList,
  482. isMultiple: true,
  483. // filter confirm
  484. filterConfirm: (filterList) => {
  485. const labels = filterList
  486. .filter((x) => x.selected)
  487. .map((x) => x.value)
  488. _this.searchData.enable = labels
  489. _this.filtrateList()
  490. },
  491. // filter reset
  492. filterReset: (filterList) => {
  493. filterList.map(x => { x.selected = true })
  494. _this.searchData.enable = []
  495. _this.filtrateList()
  496. }
  497. }
  498. })
  499. cols.push({
  500. field: '',
  501. key: '27',
  502. title: '操作',
  503. width: 100,
  504. align: 'center',
  505. fixed: 'right',
  506. renderBodyCell: ({ row, column, rowIndex }, h) => {
  507. // 导入产品按钮
  508. const importButton = []
  509. if (row && row.promotionRule && row.promotionRule.gateFlag === '1') {
  510. importButton.push({ key: 'GATE', name: '门槛产品' })
  511. }
  512. if (row && row.promotionRule && row.promotionRule.promotionRuleType != 'PROMO_PROD') {
  513. importButton.push({ key: 'REGULAR', name: '正价产品' })
  514. }
  515. if (row && row.promotionRule && (row.promotionRule.regularPromotionSameFlag === '0' || row.promotionRule.scopeFlag === '0' || (row.promotionRule.promotionRuleType == 'BUY_PROD_GIVE_MONEY' && row.promotionRule.scopeFlag === '1'))) {
  516. importButton.push({ key: 'GIFT', name: '促销产品' })
  517. }
  518. if (row && row.promotionRule && row.promotionRule.promotionRuleType == 'PROMO_PROD') {
  519. importButton.push({ key: 'DISCOUNT', name: '特价产品' })
  520. }
  521. if (row && row.promotionRule && row.promotionRule.borrowFlag == 1 && row.promotionRule.gateFlag === '1') {
  522. importButton.push({ key: 'BORROW_GATE', name: '累计门槛产品' })
  523. }
  524. if (row && row.promotionRule && row.promotionRule.borrowFlag == 1 && row.promotionRule.promotionRuleType != 'PROMO_PROD') {
  525. importButton.push({ key: 'BORROW_REGULAR', name: '累计正价产品' })
  526. }
  527. return (
  528. <div>
  529. {row.enabledFlag == 1 ? <a-dropdown>
  530. <a-menu slot="overlay" on-click={(e) => this.handleImportClick(e, row, importButton)} id={'salesEdit-menu-import-' + row.id}>
  531. {importButton.map(item => {
  532. return (
  533. <a-menu-item id={'salesEdit-menu-import-' + item.key + '-' + row.id} key={item.key}>{item.name}</a-menu-item>
  534. )
  535. })}
  536. </a-menu>
  537. <a-button
  538. id={'salesEdit-menu-import-plaction-' + row.id}
  539. type="link"
  540. class="button-primary"
  541. size="small"
  542. >
  543. 导入∨
  544. </a-button>
  545. </a-dropdown> : ''}
  546. {row.enabledFlag == 1 ? <a-button
  547. type="link"
  548. size="small"
  549. class="button-primary"
  550. on-click={() => this.addProduct(row, 1)}
  551. >
  552. 添加
  553. </a-button> : ''}
  554. {row.enabledFlag == 1 && row.promotionRule.borrowFlag == 1 ? <a-button
  555. type="link"
  556. size="small"
  557. class="button-primary"
  558. on-click={() => this.addProduct(row, 2)}
  559. >
  560. 累计
  561. </a-button> : <span style="width:40px;display:inline-block;"></span>}
  562. </div>
  563. )
  564. }
  565. })
  566. }
  567. return cols.filter((item, index) => {
  568. const i = index - 1
  569. return this.showCols.includes(i.toString()) || index == 0 || index > 12
  570. })
  571. }
  572. },
  573. methods: {
  574. // 筛选
  575. filtrateList () {
  576. const { ruleType, enable } = this.searchData
  577. const list = this.activeList.filter(item => ruleType.length === 0 || ruleType.includes(item.promotionRule.promotionRuleType)).filter(item => enable.length == 0 || enable.includes(item.enabledFlag))
  578. this.tableData = []
  579. this.getDataList(list)
  580. },
  581. getDataList (list) {
  582. this.hasInit = true
  583. for (let i = 0; i < list.length; i++) {
  584. const item = list[i]
  585. // 门槛统计
  586. const isYuan = item.gateRuleUnit == 'YUAN'
  587. const gateUnit = isYuan ? '元' : '个' // 单位
  588. const gateSelected = isYuan ? item.gateTotalAmount : item.gateQty // 已选
  589. const gateTotal = isYuan ? item.gateBorrowAmount : item.gateBorrowQty // 累计
  590. const gateQuota = isYuan ? item.gateQuotaAmount : item.gateQuotaQty // 配额
  591. const unUseGateQuota = isYuan ? item.unUseAmount : item.unUseQty // 未用配额(正价产品)=配额 - 已选 - 累计;未用配额(特价产品)= 配额 - 已选
  592. const geteBalance = item.gateShortfallValue // 差额 = 配额 - 已选 - 累计
  593. // 特价产品
  594. const isYuan2 = item.gateRuleUnit == 'YUAN'
  595. const specialPriceUnit = isYuan2 ? '元' : '个' // 单位
  596. const discountRuleUnit = item.discountRuleUnit == 'YUAN' ? '元' : '个' // 单位
  597. const specialPriceSelected = isYuan2 ? item.discountAmount : item.discountQty || 0 // 已选
  598. const specialPriceQuota = item.promotionRule.promotionRuleType === 'PROMO_PROD' ? item.gateQuotaAmount : 0 // 配额
  599. const specialPriceBalance = !specialPriceQuota ? 0 : isYuan ? item.discountCeAmount : item.discountCeQty// 差额 = 配额 - 已选
  600. const discountRuleValue = item.discountRuleUnit == 'YUAN' ? Number(item.discountRuleValue).toFixed(2) : item.discountRuleValue
  601. const discountRuleNextValue = item.discountRuleUnit == 'YUAN' ? Number(item.discountRuleNextValue).toFixed(2) : item.discountRuleNextValue
  602. // 正价统计
  603. const isYuan1 = item.regularRuleUnit == 'YUAN'
  604. const regularUnit = isYuan1 ? '元' : '个' // 单位
  605. const regularQuota = item.promotionRule.promotionRuleType != 'PROMO_PROD' ? item.gateQuotaAmount : 0// 配额 // 额度item.regularRuleValue
  606. const regularSelected = isYuan1 ? item.regularTotalAmount : item.regularTotalQty // 已选
  607. const regularTotal = isYuan1 ? item.regularBorrowAmount : item.regularBorrowQty // 累计
  608. const regularBaseVal = (item.promotionRule.promotionRuleType === 'BUY_PROD_GIVE_PROD' && item.promotionRule.regularPromotionSameFlag == 1) ? undefined : (isYuan1 ? item.baseAmount : item.baseQty) * 1 <= 0 ? 0 : (isYuan1 ? item.baseAmount : item.baseQty) // 基础差
  609. const regularNextVal = (item.promotionRule.promotionRuleType === 'BUY_PROD_GIVE_PROD' && item.promotionRule.regularPromotionSameFlag == 1) ? undefined : (isYuan1 ? item.nextAmount : item.nextQty) * 1 <= 0 ? 0 : (isYuan1 ? item.nextAmount : item.nextQty) // 下级差
  610. // 促销品
  611. const promoUnit = '个'
  612. const promoSelected = item.giftQty || 0 // 已选
  613. const promoBalance = item.giftShortfallQty // 差额
  614. const promoLimit = item.giftCeQty // 额度 = 差额 + 已选
  615. // 采购额
  616. const purchaseUnit = '元'
  617. const purchaseLimit = item.totalPromoGiftsAmount // 额度
  618. const purchaseSelected = item.totalUsePromoGiftsAmount // 已选
  619. const purchaseSurplus = item.surplusAmount || 0 // 结余
  620. // 促销品
  621. this.tableData.push({
  622. ...item,
  623. ruleType: item.promotionRule.promotionRuleType,
  624. promotionRuleType: item.promotionRule.promotionRuleTypeDictValue,
  625. promotionRuleDesc: item.promotionRule.description,
  626. promotionTitle: item.promotion.title,
  627. // 门槛
  628. gateUnit, // 单位
  629. gateQuota, // 配额
  630. unUseGateQuota, // 未用配额
  631. gateSelected, // 已选
  632. gateTotal, // 累计
  633. geteBalance, // 差额 = 配额 - 已选 - 累计
  634. // 特价产品
  635. specialPriceUnit, // 单位
  636. discountRuleUnit,
  637. specialPriceQuota, // 配额
  638. specialPriceSelected, // 已选
  639. specialPriceBalance, // 差额
  640. discountRuleValue,
  641. discountRuleNextValue,
  642. // 正价
  643. regularUnit, // 单位
  644. regularQuota, // 配额
  645. regularSelected, // 已选
  646. regularTotal, // 累计
  647. regularBaseVal, // 基础差
  648. regularNextVal, // 下阶差
  649. // 促销品
  650. promoUnit, // 单位
  651. promoLimit, // 额度
  652. promoSelected, // 已选
  653. promoBalance, // 差额 = 额度 - 已选
  654. // 采购额
  655. purchaseUnit,
  656. purchaseLimit, // 额度
  657. purchaseSelected, // 已选
  658. purchaseSurplus // 结余
  659. })
  660. }
  661. // 获取禁用的活动规则
  662. this.disabledActiveIds()
  663. },
  664. // 禁用的活动规则
  665. disabledActiveIds () {
  666. this.checkboxOption.disableSelectedRowKeys = this.tableData.filter(item => item.enabledFlag == 0).map(item => item.id)
  667. },
  668. // 上下移动特价活动
  669. moveTjRow (item, rowIndex, type) {
  670. const temp = this.tableData[type == 1 ? rowIndex - 1 : rowIndex + 1]
  671. const tempSort = temp.sort
  672. temp.sort = item.sort
  673. item.sort = tempSort
  674. // 保存排序
  675. const tejia = this.tableData.filter(item => item.promotionRule && item.promotionRule.promotionRuleType == 'PROMO_PROD')
  676. const data = tejia.map(item => {
  677. return {
  678. id: item.id,
  679. sort: item.sort
  680. }
  681. })
  682. this.spinning = true
  683. salesPromoSaveSort({ salesBillSn: this.salesBillSn, salesPromoList: data }).then(res => {
  684. this.spinning = false
  685. if (res.status == 200) {
  686. this.$emit('refash', '', 'sort')
  687. } else {
  688. // 恢复排序
  689. item.sort = temp.sort
  690. temp.sort = tempSort
  691. }
  692. })
  693. },
  694. // 刷新当前规则
  695. refashRow (item, enable) {
  696. // 刷新产品列表
  697. this.$emit('refash', '', 'enable')
  698. const active = this.tableData.find(k => k.id == item.id)
  699. active.enabledFlag = enable
  700. // 获取禁用的活动规则
  701. this.disabledActiveIds()
  702. },
  703. // 查看累计产品 详情
  704. openTotalProduct (row, type) {
  705. this.openTotalProductModal = true
  706. this.$refs.totalProductModal.pageInit({ salesBillSn: row.salesBillSn, salesPromoSn: row.salesPromoSn, promotionFlag: type === 'gateUnit' ? 'GATE' : 'REGULAR' })
  707. },
  708. // 显示买赠产品弹窗
  709. showBuyGifts (rowVal) {
  710. rowVal.promotionRule.salesPromoSn = rowVal.salesPromoSn
  711. this.buyGiftsInfo = rowVal.promotionRule
  712. this.openNormalProductModal = true
  713. const _this = this
  714. this.$nextTick(() => {
  715. _this.$refs.normalProductModal.resetSearchForm()
  716. })
  717. },
  718. // 启用规则
  719. enabledActive (item) {
  720. const _this = this
  721. this.spinning = true
  722. salesEnablePromoPromo({
  723. salesBillSn: _this.salesBillSn,
  724. salesPromoSn: item.salesPromoSn,
  725. salesEnableType: _this.enableActiveOption
  726. }).then(res => {
  727. if (res.status == 200) {
  728. // 刷新
  729. _this.refashRow(item, 1)
  730. _this.enableActiveOption = null
  731. _this.$message.success('启用成功')
  732. }
  733. _this.spinning = false
  734. })
  735. },
  736. // 禁用规则
  737. disabledActive (item) {
  738. const _this = this
  739. _this.spinning = true
  740. salesDisablePromo({
  741. salesBillSn: _this.salesBillSn,
  742. salesPromoSn: item.salesPromoSn,
  743. promoRuleSn: item.promoRuleSn,
  744. salesDisableType: _this.disabledActiveOption
  745. }).then(res => {
  746. if (res.status == 200) {
  747. // 刷新
  748. _this.refashRow(item, 0)
  749. _this.disabledActiveOption = null
  750. _this.$message.success('禁用成功')
  751. }
  752. _this.spinning = false
  753. })
  754. },
  755. enableRow (c, e, item) {
  756. const _this = this
  757. // 启用
  758. if (item.enabledFlag == 0) {
  759. const isJiejia = item.promotionRule.stackFlag == 1 // 叠加产品
  760. this.$confirm({
  761. title: item.promotion.description + '-' + item.promotionRule.description + ',确定启用规则?',
  762. centered: true,
  763. class: 'confirm-center',
  764. content: <div>
  765. <div style="padding:10px;">
  766. <div style="padding:10px 0;">请选择</div>
  767. <aRadioGroup onChange={e => { _this.enableActiveOption = e.target.value }}>
  768. <aRadio style="display:block;height: '30px';lineHeight: '30px';padding:5px 0;" value="ENABLE_WITH_NORMAL">
  769. 正常产品适配
  770. </aRadio>
  771. {isJiejia ? <aRadio style="display:block;height: '30px';lineHeight: '30px';padding:5px 0;" value="ENABLE_WITH_STACK">
  772. 叠加规则产品适配
  773. </aRadio> : ''}
  774. {isJiejia ? <aRadio style="display:block;height: '30px';lineHeight: '30px';padding:5px 0;" value="ENABLE_WITH_STACK_NORMAL">
  775. 所有产品适配
  776. </aRadio> : ''}
  777. <aRadio style="display:block;height: '30px';lineHeight: '30px';padding:5px 0;" value="ENABLE_ONLY">
  778. 仅启用不适配
  779. </aRadio>
  780. </aRadioGroup>
  781. </div>
  782. </div>,
  783. onOk () {
  784. if (_this.enableActiveOption) {
  785. _this.enabledActive(item)
  786. } else {
  787. _this.$message.info('请选择启用方式!')
  788. return true
  789. }
  790. },
  791. onCancel () {
  792. _this.enableActiveOption = null
  793. }
  794. })
  795. return
  796. }
  797. // 禁用
  798. // 无产品直接禁用
  799. if (item.totalQty == 0) {
  800. _this.disabledActiveOption = 'DELETE'
  801. _this.disabledActive(item)
  802. return
  803. }
  804. this.$confirm({
  805. title: item.promotion.description + '-' + item.promotionRule.description + ',确定禁用规则?',
  806. centered: true,
  807. class: 'confirm-center',
  808. content: <div>
  809. <div style="padding:10px 0;text-align:center;">禁用规则后,将无法享受该活动规则优惠</div>
  810. <div style="padding:0 0 10px 0;text-align:center;">
  811. <aRadioGroup onChange={e => { _this.disabledActiveOption = e.target.value }}>
  812. <aRadio style="display:block;height: '30px';lineHeight: '30px';padding:5px 0;" value="DELETE">
  813. 删除产品
  814. </aRadio>
  815. <aRadio style="display:block;height: '30px';lineHeight: '30px';padding:5px 0;" value="REMOVE">
  816. 移出产品
  817. </aRadio>
  818. </aRadioGroup>
  819. </div>
  820. </div>,
  821. onOk () {
  822. if (_this.disabledActiveOption) {
  823. _this.disabledActive(item)
  824. } else {
  825. _this.$message.info('请选择禁用方式!')
  826. return true
  827. }
  828. },
  829. onCancel () {
  830. _this.disabledActiveOption = null
  831. }
  832. })
  833. },
  834. // 导入产品
  835. handleImportClick (e, row, importButton) {
  836. const title = importButton.find(item => item.key === e.key).name
  837. this.$refs.importGuideModal.pageInit({ promoProductClz: e.key, salesBillSn: this.salesBillSn, salesPromoSn: row.salesPromoSn }, row, title)
  838. this.openGuideModal = true
  839. },
  840. // 关闭导入弹框
  841. closeGuideModel () {
  842. this.openGuideModal = false
  843. },
  844. // 批量导入产品
  845. hanldeImportOk (salesBillDetailList, row, promoProductClz) {
  846. const params = {
  847. salesBillSn: this.salesBillSn,
  848. salesBillDetailList: salesBillDetailList
  849. }
  850. // 活动导入
  851. if (row.salesPromoSn) {
  852. params.salesPromoSn = row.salesPromoSn
  853. params.promoRuleSn = row.promoRuleSn
  854. params.promoProductClz = promoProductClz
  855. }
  856. salesBatchInsert(params).then(res => {
  857. if (res.status == 200) {
  858. this.$message.success('产品导入成功', 2.5)
  859. this.$emit('refash', '', 'import')
  860. }
  861. })
  862. },
  863. // 添加产品
  864. addProduct (row, type) {
  865. this.$emit('openCpModal', type, row)
  866. },
  867. // 查看活动详情
  868. showDesc (row) {
  869. if (row.promoRuleSn) {
  870. this.promoRuleSn = row.promoRuleSn
  871. this.openDetailModal = true
  872. }
  873. },
  874. // 关闭详情弹窗
  875. closeDetailModal () {
  876. this.promoRuleSn = null
  877. this.openDetailModal = false
  878. }
  879. }
  880. }
  881. </script>
  882. <style lang="less">
  883. .table-header-cell-blue {
  884. background: #c9fbff !important;
  885. }
  886. .table-header-cell-red {
  887. background: #ffdccb !important;
  888. }
  889. .table-header-cell-green {
  890. background: #deffec !important;
  891. }
  892. .table-header-cell-zs {
  893. background: #fff2ff !important;
  894. }
  895. .table-header-cell-org {
  896. background: #fff3c2 !important;
  897. }
  898. .table-link-text{
  899. width:100%;
  900. color: #409EFF;
  901. display:flex;
  902. cursor:pointer;
  903. &:hover{
  904. text-decoration: underline;
  905. }
  906. }
  907. .table-link-btn{
  908. color: #409EFF;
  909. cursor:pointer;
  910. &:hover{
  911. text-decoration: underline;
  912. }
  913. }
  914. .table-word-color{
  915. color:#ed1c24;
  916. }
  917. .table-arrow-box{
  918. display: flex;
  919. span{
  920. width:16px;
  921. text-align:center;
  922. cursor:pointer;
  923. border-radius: 50px;
  924. }
  925. .up{
  926. color:#ed1c24;
  927. &:hover{
  928. color:#fff;
  929. background:#ed1c24;
  930. }
  931. }
  932. .down{
  933. color:#00aaff;
  934. &:hover{
  935. color:#fff;
  936. background:#00aaff;
  937. }
  938. }
  939. }
  940. </style>