subsidiary.vue 6.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198
  1. <template>
  2. <div style="height: calc(100vh - 114px); overflow-y: auto; overflow-x: hidden">
  3. <byTable
  4. :hideTable="true"
  5. :hidePagination="true"
  6. :source="sourceList.data"
  7. :pagination="sourceList.pagination"
  8. :config="config"
  9. :loading="loading"
  10. :searchConfig="searchConfig"
  11. highlight-current-row
  12. @get-list="getList"
  13. @clickReset="clickReset">
  14. </byTable>
  15. <div style="margin-bottom: 10px; display: flex">
  16. <div style="height: 30px; line-height: 30px; margin-right: 10px">
  17. <el-button type="primary" @click="handleBOM()" v-preReClick>选择bom</el-button>
  18. </div>
  19. <div style="height: 30px; line-height: 30px; margin-right: 10px">
  20. <el-button type="primary" @click="handleReset" text>重置</el-button>
  21. </div>
  22. <div style="height: 30px; line-height: 30px; margin-right: 10px">
  23. <el-button type="primary" @click="handleReplace" text>一键替换</el-button>
  24. </div>
  25. </div>
  26. <el-table :data="selectData" :cell-style="{ padding: '0' }" :row-style="{ height: '35px' }" header-row-class-name="tableHeader" style="margin-bottom: 10px">
  27. <el-table-column label="品号" prop="code" width="220" />
  28. <el-table-column label="品名" prop="name" min-width="220" />
  29. <el-table-column label="操作" align="center" width="120">
  30. <template #default="{ row, $index }">
  31. <el-button type="text" @click="handleDelete($index)">删 除</el-button>
  32. </template>
  33. </el-table-column>
  34. </el-table>
  35. <br />
  36. <el-table :data="sourceList.data" :row-style="{ height: '35px' }" header-row-class-name="tableHeader">
  37. <el-table-column label="群组品号" prop="skuCode" width="120" />
  38. <el-table-column label="SKU品号" prop="skuSpecCode" width="140" />
  39. <el-table-column label="品名" prop="skuSpecName" min-width="240" />
  40. <el-table-column label="彩纸" prop="colouredPaper" width="100" />
  41. <el-table-column label="OPP膜" prop="oppMembrane" width="100" />
  42. <el-table-column label="PE袋" prop="peBag" width="100" />
  43. <el-table-column label="网包" prop="meshBag" width="100" />
  44. <el-table-column label="纸箱" prop="paperBox" width="100" />
  45. <el-table-column label="气泡袋" prop="bubblePack" width="100" />
  46. <el-table-column label="快递包材" prop="logisticsPackagingMaterial" width="100" />
  47. <el-table-column label="其他包材" prop="otherPackingMaterial" width="100" />
  48. <el-table-column label="不干胶" prop="selfAdhesiveSticker" width="100" />
  49. <el-table-column label="吊牌" prop="drop" width="100" />
  50. <el-table-column label="背带" prop="suspenders" width="100" />
  51. <el-table-column label="辅料" prop="accessory" width="100" />
  52. </el-table>
  53. <el-row style="padding: 10px 0" justify="end" type="flex">
  54. <el-pagination
  55. background
  56. layout="total, sizes, prev, pager, next, jumper"
  57. :current-page="sourceList.pagination.pageNum"
  58. :page-size="sourceList.pagination.pageSize"
  59. :total="sourceList.pagination.total"
  60. @current-change="handlePageChange"
  61. @size-change="handleSizeChange" />
  62. </el-row>
  63. <el-dialog title="选择BOM" v-if="openBOM" v-model="openBOM" width="84%">
  64. <SelectBOM :selectStatus="true" :bomClassifyIdList="[2, 3]" @selectBOM="selectBOM"></SelectBOM>
  65. <template #footer>
  66. <el-button @click="openBOM = false" size="large">关 闭</el-button>
  67. </template>
  68. </el-dialog>
  69. </div>
  70. </template>
  71. <script setup>
  72. import byTable from "@/components/byTable/index";
  73. import SelectBOM from "@/views/group/BOM/management/index";
  74. import { ElMessage, ElMessageBox } from "element-plus";
  75. const { proxy } = getCurrentInstance();
  76. const sourceList = ref({
  77. data: [],
  78. pagination: {
  79. total: 0,
  80. pageNum: 1,
  81. pageSize: 10,
  82. skuCode: "",
  83. skuSpecCode: "",
  84. bomSpecCode: "",
  85. length: "",
  86. width: "",
  87. height: "",
  88. },
  89. });
  90. const loading = ref(false);
  91. const searchConfig = computed(() => {
  92. return [
  93. {
  94. type: "input",
  95. prop: "skuCode",
  96. label: "群组品号",
  97. },
  98. {
  99. type: "input",
  100. prop: "skuSpecCode",
  101. label: "SKU品号",
  102. },
  103. {
  104. type: "input",
  105. prop: "bomSpecCode",
  106. label: "BOM品号",
  107. },
  108. {
  109. type: "input",
  110. prop: "length",
  111. label: "长",
  112. },
  113. {
  114. type: "input",
  115. prop: "width",
  116. label: "宽",
  117. },
  118. {
  119. type: "input",
  120. prop: "height",
  121. label: "高",
  122. },
  123. ];
  124. });
  125. const config = computed(() => {
  126. return [];
  127. });
  128. const getList = async (req, status) => {
  129. if (status) {
  130. sourceList.value.pagination = {
  131. pageNum: sourceList.value.pagination.pageNum,
  132. pageSize: sourceList.value.pagination.pageSize,
  133. };
  134. } else {
  135. sourceList.value.pagination = { ...sourceList.value.pagination, ...req };
  136. }
  137. loading.value = true;
  138. proxy.post("/sku/getReplacePackagingMaterialPage", sourceList.value.pagination).then((res) => {
  139. sourceList.value.data = res.rows;
  140. sourceList.value.pagination.total = res.total;
  141. setTimeout(() => {
  142. loading.value = false;
  143. }, 200);
  144. });
  145. };
  146. getList();
  147. const clickReset = () => {
  148. getList("", true);
  149. };
  150. const handlePageChange = (val) => {
  151. getList({ pageNum: val });
  152. };
  153. const handleSizeChange = (val) => {
  154. getList({ pageNum: 1, pageSize: val });
  155. };
  156. const openBOM = ref(false);
  157. const selectData = ref([]);
  158. const handleBOM = () => {
  159. openBOM.value = true;
  160. };
  161. const selectBOM = (item) => {
  162. selectData.value = [item];
  163. ElMessage({ message: "选择完成", type: "success" });
  164. openBOM.value = false;
  165. };
  166. const handleDelete = (index) => {
  167. selectData.value.splice(index, 1);
  168. };
  169. const handleReset = () => {
  170. selectData.value = [];
  171. };
  172. const handleReplace = () => {
  173. if (selectData.value && selectData.value.length > 0) {
  174. ElMessageBox.confirm("是否确认替换所有BOM", "提示", {
  175. confirmButtonText: "确定",
  176. cancelButtonText: "取消",
  177. type: "warning",
  178. })
  179. .then(() => {
  180. proxy.post("/sku/replacePackagingMaterial", { ...sourceList.value.pagination, replaceBomSpecId: selectData.value[0].id }).then(() => {
  181. ElMessage({ message: "替换成功", type: "success" });
  182. getList();
  183. });
  184. })
  185. .catch(() => {});
  186. } else {
  187. return ElMessage("请选择BOM");
  188. }
  189. };
  190. </script>
  191. <style lang="scss" scoped></style>