printOrder.vue 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363
  1. <template>
  2. <el-card v-loading="loading">
  3. <div style="text-align: center; font-size: 30px; padding: 8px; font-weight: 700">{{ props.rowData.departmentName }}-胜德体育对账单</div>
  4. <div style="text-align: center; font-size: 18px; padding-bottom: 8px; font-weight: 700">( 对账时间: {{ props.rowData.dimensionality }} )</div>
  5. <div style="height: calc(100vh - 235px - 88px); overflow-y: auto; overflow-x: hidden">
  6. <el-auto-resizer>
  7. <template #default="{ height, width }">
  8. <el-table-v2 :columns="columns" :data="tableData" :width="width" :height="height" fixed :cache="20" :header-height="35" :row-height="35">
  9. <template #row="props">
  10. <Row v-bind="props" />
  11. </template>
  12. </el-table-v2>
  13. </template>
  14. </el-auto-resizer>
  15. </div>
  16. <div style="padding: 4px; text-align: center">
  17. <el-button type="primary" v-if="judgeOneKeyStatus()" @click="clickOneKeyStatus()" :loading="loadingOneKey" v-preReClick>一键出库</el-button>
  18. <el-button @click="clickCancel">关 闭</el-button>
  19. <el-button type="primary" @click="deriveExcel()" v-preReClick>导 出</el-button>
  20. </div>
  21. </el-card>
  22. </template>
  23. <script setup>
  24. import { ElMessage } from "element-plus";
  25. import { cloneVNode } from "vue";
  26. const { proxy } = getCurrentInstance();
  27. const props = defineProps({
  28. rowData: Object,
  29. tabValues: Object,
  30. });
  31. const loading = ref(false);
  32. const tableData = ref([]);
  33. const getAggregate = (data) => {
  34. let total = 0;
  35. if (data && data.length > 0) {
  36. for (let i = 0; i < data.length; i++) {
  37. if (data[i].total) {
  38. total = Number(Math.round((total + data[i].total) * 100) / 100);
  39. }
  40. }
  41. }
  42. return total;
  43. };
  44. const tabsCard = ref();
  45. watch(
  46. () => props.tabValues,
  47. (val) => {
  48. if (val.activeName === "order" && val.tabsCard != tabsCard.value) {
  49. tabsCard.value = val.tabsCard;
  50. if (props.rowData && props.rowData.idGroupConcat) {
  51. loading.value = true;
  52. proxy.post("/statementOfAccountMerge/getDocumentByOrder", { idGroupConcat: props.rowData.idGroupConcat, orderClassify: props.tabValues.tabsCard }).then(
  53. (res) => {
  54. let total = getAggregate(proxy.deepClone(res));
  55. let list = [];
  56. if (res && res.length > 0) {
  57. for (let i = 0; i < res.length; i++) {
  58. if (res[i].skuSpecList && res[i].skuSpecList.length > 0) {
  59. for (let j = 0; j < res[i].skuSpecList.length; j++) {
  60. if (res[i].skuSpecList[j].bomSpecList && res[i].skuSpecList[j].bomSpecList.length > 0) {
  61. for (let y = 0; y < res[i].skuSpecList[j].bomSpecList.length; y++) {
  62. let indexOne = 0;
  63. if (j === 0 && y === 0) {
  64. for (let z = 0; z < res[i].skuSpecList.length; z++) {
  65. if (res[i].skuSpecList[z].bomSpecList && res[i].skuSpecList[z].bomSpecList.length > 0) {
  66. indexOne = Number(indexOne + res[i].skuSpecList[z].bomSpecList.length);
  67. }
  68. }
  69. }
  70. let indexTwo = 0;
  71. if (y === 0) {
  72. indexTwo = res[i].skuSpecList[j].bomSpecList.length;
  73. }
  74. list.push({
  75. wlnCreateTime: res[i].wlnCreateTime,
  76. code: res[i].code,
  77. wlnCode: res[i].wlnCode,
  78. skuSpecCode: res[i].skuSpecList[j].skuSpecCode,
  79. skuSpecName: res[i].skuSpecList[j].skuSpecName,
  80. quantitySKU: res[i].skuSpecList[j].quantity,
  81. subtotal: res[i].skuSpecList[j].subtotal,
  82. bomSpecCode: res[i].skuSpecList[j].bomSpecList[y].bomSpecCode,
  83. bomSpecName: res[i].skuSpecList[j].bomSpecList[y].bomSpecName,
  84. quantityBOM: res[i].skuSpecList[j].bomSpecList[y].quantity,
  85. unitPriceBOM: res[i].skuSpecList[j].bomSpecList[y].unitPrice,
  86. laserLogoSummary: res[i].skuSpecList[j].bomSpecList[y].laserLogoSummary,
  87. laserMitochondrialSummary: res[i].skuSpecList[j].bomSpecList[y].laserMitochondrialSummary,
  88. lssueFeeSummary: res[i].skuSpecList[j].bomSpecList[y].lssueFeeSummary,
  89. deliveryMaterialsFeeSummary: res[i].skuSpecList[j].bomSpecList[y].deliveryMaterialsFeeSummary,
  90. packingLaborSummary: res[i].skuSpecList[j].bomSpecList[y].packingLaborSummary,
  91. managementFeeSummary: res[i].skuSpecList[j].bomSpecList[y].managementFeeSummary,
  92. proofingFeeSummary: res[i].skuSpecList[j].bomSpecList[y].proofingFeeSummary,
  93. unitPriceSKU: res[i].skuSpecList[j].unitPrice,
  94. checkFee: res[i].skuSpecList[j].checkFee,
  95. total: res[i].total,
  96. indexOne: indexOne,
  97. indexTwo: indexTwo,
  98. });
  99. }
  100. }
  101. }
  102. }
  103. }
  104. }
  105. list.push({
  106. indexOne: 1,
  107. indexTwo: 1,
  108. total: total,
  109. wlnCreateTime: "总计:",
  110. });
  111. tableData.value = Object.freeze(list);
  112. loading.value = false;
  113. },
  114. (err) => {
  115. console.log(err);
  116. loading.value = false;
  117. }
  118. );
  119. }
  120. }
  121. if (val.activeName === "order" && val.tabsCard === 5) {
  122. getOrder();
  123. }
  124. },
  125. {
  126. deep: true,
  127. immediate: true,
  128. }
  129. );
  130. const emit = defineEmits(["clickCancel"]);
  131. const clickCancel = () => {
  132. emit("clickCancel", "");
  133. };
  134. const deriveExcel = () => {
  135. loading.value = true;
  136. proxy
  137. .getFile("/statementOfAccountMerge/exportDocumentByOrder", {
  138. idGroupConcat: props.rowData.idGroupConcat,
  139. departmentName: props.rowData.departmentName,
  140. beginDate: props.rowData.dimensionality,
  141. orderClassify: props.tabValues.tabsCard,
  142. })
  143. .then(
  144. () => {
  145. emit("clickCancel", true);
  146. loading.value = false;
  147. },
  148. (err) => {
  149. console.log(err);
  150. loading.value = false;
  151. }
  152. );
  153. };
  154. const columns = computed(() => {
  155. return [
  156. {
  157. dataKey: "wlnCreateTime",
  158. key: "column-0",
  159. title: "订单时间",
  160. width: 150,
  161. rowIndex: 1,
  162. },
  163. {
  164. dataKey: "code",
  165. key: "column-1",
  166. title: "订单号",
  167. width: 160,
  168. },
  169. {
  170. dataKey: "wlnCode",
  171. key: "column-2",
  172. title: "E10单号",
  173. width: 140,
  174. },
  175. {
  176. dataKey: "skuSpecCode",
  177. key: "column-3",
  178. title: "SKU品号",
  179. width: 140,
  180. },
  181. {
  182. dataKey: "skuSpecName",
  183. key: "column-4",
  184. title: "SKU品名",
  185. width: 220,
  186. },
  187. {
  188. dataKey: "quantitySKU",
  189. key: "column-5",
  190. title: "SKU数量",
  191. width: 80,
  192. },
  193. {
  194. dataKey: "bomSpecCode",
  195. key: "column-6",
  196. title: "BOM品号",
  197. width: 140,
  198. },
  199. {
  200. dataKey: "bomSpecName",
  201. key: "column-7",
  202. title: "BOM品名",
  203. width: 260,
  204. },
  205. {
  206. dataKey: "quantityBOM",
  207. key: "column-8",
  208. title: "BOM数量",
  209. width: 80,
  210. },
  211. {
  212. dataKey: "unitPriceBOM",
  213. key: "column-9",
  214. title: "单价",
  215. width: 100,
  216. },
  217. {
  218. dataKey: "laserLogoSummary",
  219. key: "column-10",
  220. title: "激光LOGO",
  221. width: 100,
  222. },
  223. {
  224. dataKey: "laserMitochondrialSummary",
  225. key: "column-11",
  226. title: "激光体位线",
  227. width: 100,
  228. },
  229. {
  230. dataKey: "lssueFeeSummary",
  231. key: "column-12",
  232. title: "代发费",
  233. width: 100,
  234. },
  235. {
  236. dataKey: "deliveryMaterialsFeeSummary",
  237. key: "column-13",
  238. title: "快递包材费",
  239. width: 100,
  240. },
  241. {
  242. dataKey: "packingLaborSummary",
  243. key: "column-14",
  244. title: "包装人工费",
  245. width: 100,
  246. },
  247. {
  248. dataKey: "managementFeeSummary",
  249. key: "column-15",
  250. title: "管理费",
  251. width: 100,
  252. },
  253. {
  254. dataKey: "proofingFeeSummary",
  255. key: "column-16",
  256. title: "打样费",
  257. width: 100,
  258. },
  259. {
  260. dataKey: "unitPriceSKU",
  261. key: "column-17",
  262. title: "SKU单价",
  263. width: 100,
  264. },
  265. {
  266. dataKey: "checkFee",
  267. key: "column-18",
  268. title: "质检费",
  269. width: 100,
  270. },
  271. {
  272. dataKey: "subtotal",
  273. key: "column-19",
  274. title: "小计",
  275. width: 120,
  276. },
  277. {
  278. dataKey: "total",
  279. key: "column-20",
  280. title: "合计",
  281. width: 120,
  282. },
  283. ];
  284. });
  285. const mergeColumnOne = [0, 1, 2, 20];
  286. const mergeColumnTwo = [3, 4, 5, 17, 18, 19];
  287. const Row = ({ rowData, cells }) => {
  288. if (rowData.indexOne > 1) {
  289. for (let i = 0; i < mergeColumnOne.length; i++) {
  290. const cell = cells[mergeColumnOne[i]];
  291. const style = {
  292. ...cell.props.style,
  293. backgroundColor: "#fff",
  294. height: `${rowData.indexOne * 35 - 1}px`,
  295. alignSelf: "flex-start",
  296. zIndex: 1,
  297. };
  298. cells[mergeColumnOne[i]] = cloneVNode(cell, { style });
  299. }
  300. }
  301. if (rowData.indexTwo > 1) {
  302. for (let i = 0; i < mergeColumnTwo.length; i++) {
  303. const cell = cells[mergeColumnTwo[i]];
  304. const style = {
  305. ...cell.props.style,
  306. backgroundColor: "#fff",
  307. height: `${rowData.indexTwo * 35 - 1}px`,
  308. alignSelf: "flex-start",
  309. zIndex: 1,
  310. };
  311. cells[mergeColumnTwo[i]] = cloneVNode(cell, { style });
  312. }
  313. }
  314. return cells;
  315. };
  316. const orderList = ref([]);
  317. const loadingOneKey = ref(false);
  318. const judgeOneKeyStatus = () => {
  319. let status = true;
  320. if (proxy.useUserStore().user.userId !== "1") {
  321. status = false;
  322. } else {
  323. if (!(props.tabValues.tabsCard === 5 && orderList.value && orderList.value.length > 0)) {
  324. status = false;
  325. }
  326. }
  327. return status;
  328. };
  329. const getOrder = () => {
  330. proxy.post("/statementOfAccountMerge/getNotSalesOutOfWarehouseOrder", { idGroupConcat: props.rowData.idGroupConcat }).then((res) => {
  331. if (res && res.length > 0) {
  332. orderList.value = res;
  333. } else {
  334. orderList.value = [];
  335. }
  336. });
  337. };
  338. const clickOneKeyStatus = () => {
  339. loadingOneKey.value = true;
  340. proxy.post("/statementOfAccountMerge/salesOutOfWarehouse", orderList.value).then(
  341. () => {
  342. ElMessage({ message: "操作完成", type: "success" });
  343. getOrder();
  344. loadingOneKey.value = false;
  345. },
  346. (err) => {
  347. console.log(err);
  348. loadingOneKey.value = false;
  349. }
  350. );
  351. };
  352. </script>
  353. <style lang="scss" scoped>
  354. ::v-deep(.el-table-v2__header-cell) {
  355. background-color: #eeeeee !important;
  356. }
  357. ::v-deep(.el-card__body) {
  358. padding: 10px !important;
  359. }
  360. </style>