bottomTable.vue 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360
  1. <template>
  2. <div>
  3. <avue-crud
  4. ref="crudRef"
  5. v-model:search="search"
  6. v-model="form"
  7. :data="data"
  8. :option="option"
  9. v-model:page="page"
  10. @row-save="createRow"
  11. @row-update="updateRow"
  12. @row-del="deleteRow"
  13. @selection-change="selectionChange"
  14. @sortable-change="onSortChange"
  15. @search-change="searchChange"
  16. @search-reset="resetChange"
  17. @size-change="dataList"
  18. @current-change="dataList"
  19. >
  20. <template #filePath-form="scope">
  21. <!-- <single-upload v-model="form.filePath" />
  22. <FilesUpload v-model:src="form.filePath" v-model:src-list="form.filePath" /> -->
  23. <div style="height: 100px; width: 100px; overflow: hidden">
  24. <PDFView
  25. :need-to-show-pdf="true"
  26. content-type="button"
  27. :is-link="true"
  28. :show-pdf-number="form.showAppointPageNum"
  29. :pdf-source="pdfPath"
  30. />
  31. </div>
  32. </template>
  33. <template #filePath="{ row }">
  34. <PDFView
  35. :need-to-show-pdf="true"
  36. content-type="button"
  37. btnText="查看PDF"
  38. :is-link="true"
  39. :pdf-source="getSOAPpdf(row)"
  40. />
  41. </template>
  42. </avue-crud>
  43. <CommonTable
  44. ref="commonTableRef"
  45. :tableTitle="tableTitle"
  46. :tableType="commonTableType"
  47. :multipleRow="multipleRow"
  48. @selected-sure="onSelectedFinish"
  49. />
  50. <el-dialog v-model="dialogVisible">
  51. <VuePdfEmbed :source="previewImgUrl" annotation-layer text-layer />
  52. </el-dialog>
  53. </div>
  54. </template>
  55. <script setup>
  56. import { ref, getCurrentInstance } from "vue";
  57. import { useCrud } from "@/hooks/userCrud";
  58. import { getTableConfig } from "./configs";
  59. import PDFView from "@/components/PDFView/index.vue";
  60. import VuePdfEmbed from "vue-pdf-embed";
  61. import {
  62. saveCompoents,
  63. getBomVersion,
  64. getRouteMaxVersion,
  65. addBatch,
  66. addEsopBatch,
  67. addCheckBatch,
  68. } from "@/api/craft/process/index";
  69. import SingleUpload from "@/components/Upload/SingleUpload.vue";
  70. const props = defineProps({
  71. tableTitle: {
  72. default: "",
  73. type: String,
  74. },
  75. tableType: {
  76. default: "",
  77. type: String,
  78. },
  79. });
  80. const route = useRoute();
  81. const tableConfig = getTableConfig(route.params.id);
  82. // 传入一个url,后面不带/
  83. const { url, form, data, option, search, page, toDeleteIds, Methords, Utils } =
  84. useCrud({
  85. src: tableConfig[props.tableType].url,
  86. });
  87. const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } =
  88. Methords; //增删改查
  89. const { selectionChange, multipleUpdate } = Methords; //选中和批量删除事件
  90. const crudRef = ref(null); //crudRef.value 获取avue-crud对象
  91. const bomVersion = ref(null);
  92. const pdfPath = ref(null);
  93. const multipleRow = ref(true);
  94. const startCreat = () => {
  95. if (props.tableType === "wuliaocaiji") {
  96. if (data.value && data.value.length > 0) {
  97. bomVersion.value = data.value[0].recordVersion;
  98. }
  99. if (!route.params.prodtCode) {
  100. ElMessage.error("物料编号读取错误");
  101. return;
  102. }
  103. //根据物料编码和版本号获取对应的物料BOM
  104. let bomParam = {
  105. materialCode: route.params.prodtCode,
  106. };
  107. getBomVersion(bomParam).then((res) => {
  108. let resListMap = [];
  109. //说明时物料采集的添加框 进行物料采集的下拉框数据获取
  110. res?.data.forEach((versions) => {
  111. resListMap.push({
  112. label: versions.bomVersion,
  113. value: versions.bomVersion,
  114. });
  115. });
  116. //查询参数
  117. let configParam = {};
  118. configParam.materialCode = route.params.prodtCode;
  119. if (bomVersion.value) {
  120. configParam.bomVersion = bomVersion.value;
  121. }
  122. //根据物料编码和版本号获取对应的物料BOM
  123. commonTableType.value = "MARTERIAL_BOM";
  124. nextTick(() => {
  125. commonTableRef.value?.startSelect(configParam);
  126. commonTableRef.value?.refreshDictData(
  127. "bomVersion",
  128. resListMap,
  129. "value"
  130. );
  131. commonTableRef.value?.mergeOption({
  132. searchShow: bomVersion.value ? false : true,
  133. selection: true,
  134. reserveSelection: true,
  135. });
  136. });
  137. });
  138. } else if (props.tableType === "dianjian") {
  139. commonTableType.value = "OP_CHECK";
  140. nextTick(() => {
  141. commonTableRef.value?.startSelect();
  142. commonTableRef.value?.mergeOption({
  143. selection: true,
  144. reserveSelection: true,
  145. });
  146. });
  147. } else if (props.tableType === "ESOP") {
  148. commonTableType.value = "ESOP";
  149. nextTick(() => {
  150. commonTableRef.value?.startSelect({
  151. materialCode: route.params.prodtCode,
  152. enable: 1,
  153. });
  154. commonTableRef.value?.mergeOption({
  155. selection: true,
  156. reserveSelection: true,
  157. });
  158. });
  159. } else {
  160. crudRef.value && crudRef.value.rowAdd();
  161. }
  162. };
  163. const saveSortData = async () => {
  164. multipleUpdate();
  165. };
  166. defineExpose({ startCreat, saveSortData });
  167. const onSortChange = () => {
  168. data.value.forEach((item) => {
  169. console.log(item.id);
  170. });
  171. };
  172. // ============公共弹窗table选择相关,物料采集等使用===============
  173. const commonTableRef = ref({});
  174. const commonTableType = ref("MARTERIAL_BOM");
  175. //批量增加物料采集
  176. const itemRecord = ref({});
  177. const itemRecordList = ref([]);
  178. //批量增加ESOP
  179. const esopItem = ref({});
  180. const esopList = ref([]);
  181. //批量增加点检
  182. const checkItem = ref({});
  183. const checkList = ref([]);
  184. const onSelectedFinish = (itemValue) => {
  185. if (Object.keys(itemValue).length == 0) {
  186. return false;
  187. }
  188. itemRecordList.value = [];
  189. itemRecord.value.itemRecordList = [];
  190. checkList.value = [];
  191. checkItem.value.checkList = [];
  192. esopItem.value.esopList = [];
  193. esopList.value = [];
  194. if (props.tableType === "wuliaocaiji") {
  195. itemValue?.forEach((item, index) => {
  196. const recordItem = ref({});
  197. recordItem.value.itemName = item.bomMaterialName;
  198. recordItem.value.itemCode = item.bomMaterialCode;
  199. recordItem.value.itemModel = item.bomMaterialAttribute;
  200. recordItem.value.recordVersion = item.bomVersion;
  201. recordItem.value.num = item.bomMaterialNumber;
  202. recordItem.value.traceType = "S";
  203. recordItem.value.operationId = route.params.id;
  204. recordItem.value.unit = item.unit;
  205. recordItem.value.isTrace = 1;
  206. itemRecordList.value.push(recordItem.value);
  207. });
  208. itemRecord.value.operationId = route.params.id;
  209. itemRecord.value.itemRecordList = Array.from(itemRecordList.value);
  210. addBatch(itemRecord.value).then((data) => {
  211. if (data.code == "200") {
  212. dataList();
  213. ElMessage({
  214. message: data.msg,
  215. type: "success",
  216. });
  217. } else {
  218. ElMessage({
  219. message: data.msg,
  220. type: "error",
  221. });
  222. }
  223. });
  224. //form.value.unit = itemValue.unit;
  225. } else if (props.tableType === "dianjian") {
  226. /*form.value.checkName = itemValue.checkName;
  227. form.value.checkCode = itemValue.checkCode;
  228. form.value.content = itemValue.content;
  229. form.value.standard = itemValue.standard;
  230. form.value.upper = itemValue.upper;
  231. form.value.lower = itemValue.lower;
  232. form.value.unit = itemValue.unit;*/
  233. itemValue?.forEach((item, index) => {
  234. const recordItem = ref({});
  235. recordItem.value.operationId = route.params.id;
  236. recordItem.value.checkName = item.checkName;
  237. recordItem.value.checkCode = item.checkCode;
  238. recordItem.value.content = item.content;
  239. recordItem.value.standard = item.standard;
  240. recordItem.value.upper = item.upper;
  241. recordItem.value.lower = item.lower;
  242. recordItem.value.unit = item.unit;
  243. checkList.value.push(recordItem.value);
  244. });
  245. checkItem.value.operationId = route.params.id;
  246. checkItem.value.checkList = Array.from(checkList.value);
  247. addCheckBatch(checkItem.value).then((data) => {
  248. if (data.code == "200") {
  249. dataList();
  250. commonTableRef.value?.mergeOption({
  251. reserveSelection: false,
  252. });
  253. ElMessage({
  254. message: data.msg,
  255. type: "success",
  256. });
  257. } else {
  258. ElMessage({
  259. message: data.msg,
  260. type: "error",
  261. });
  262. }
  263. });
  264. } else if (props.tableType === "ESOP") {
  265. /*form.value.filePath = itemValue.pdfPath;
  266. pdfPath.value = import.meta.env.VITE_APP_UPLOAD_URL + itemValue.pdfPath;
  267. form.value.drawingCode = itemValue.drawingCode;
  268. form.value.recordVersion = itemValue.drawingVersion;
  269. form.value.sortNum = itemValue.sort;
  270. form.value.title = itemValue.drawingTitle;*/
  271. itemValue?.forEach((item, index) => {
  272. const recordItem = ref({});
  273. recordItem.value.operationId = route.params.id;
  274. recordItem.value.filePath = item.pdfPath;
  275. recordItem.value.showAppointPageNum = 1;
  276. recordItem.value.drawingCode = item.drawingCode;
  277. recordItem.value.recordVersion = item.drawingVersion;
  278. recordItem.value.sortNum = item.sort;
  279. recordItem.value.title = item.drawingTitle;
  280. esopList.value.push(recordItem.value);
  281. });
  282. esopItem.value.operationId = route.params.id;
  283. esopItem.value.esopList = Array.from(esopList.value);
  284. addEsopBatch(esopItem.value).then((data) => {
  285. if (data.code == "200") {
  286. dataList();
  287. ElMessage({
  288. message: data.msg,
  289. type: "success",
  290. });
  291. } else {
  292. ElMessage({
  293. message: data.msg,
  294. type: "error",
  295. });
  296. }
  297. });
  298. }
  299. };
  300. const previewImgUrl = ref("");
  301. const dialogVisible = ref(false);
  302. const imgUrlClick = (itemValue) => {
  303. previewImgUrl.value =
  304. import.meta.env.VITE_APP_UPLOAD_URL + itemValue.filePath;
  305. dialogVisible.value = true;
  306. };
  307. const getSOAPpdf = (itemValue) => {
  308. return import.meta.env.VITE_APP_UPLOAD_URL + itemValue.filePath;
  309. };
  310. onMounted(() => {
  311. search.value.operationId = route.params.id;
  312. url.value = tableConfig[props.tableType].url;
  313. option.value = Object.assign(option.value, {
  314. addBtn: false,
  315. searchShow: false,
  316. header: false,
  317. sortable: true,
  318. column: tableConfig[props.tableType].column,
  319. });
  320. dataList();
  321. getRouteMaxVersion(route.params.routeId).then(({ data }) => {
  322. if (data) {
  323. bomVersion.value = data;
  324. }
  325. });
  326. });
  327. watch(
  328. () => props.tableType,
  329. () => {
  330. console.log("faslegb");
  331. url.value = tableConfig[props.tableType].url;
  332. option.value = Object.assign(option.value, {
  333. addBtn: false,
  334. selection: true,
  335. searchShow: false,
  336. header: false,
  337. sortable: true,
  338. column: tableConfig[props.tableType].column,
  339. });
  340. dataList();
  341. getRouteMaxVersion(route.params.routeId).then(({ data }) => {
  342. if (data) {
  343. bomVersion.value = data;
  344. }
  345. });
  346. }
  347. );
  348. </script>