index.vue 7.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343
  1. <template>
  2. <div class="mainContentBox">
  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. @search-change="searchChange"
  14. @search-reset="resetChange"
  15. @size-change="dataList"
  16. @current-change="dataList"
  17. :row-style="rowStyle"
  18. :cell-style="cellStyle"
  19. @selection-change="selectionChange"
  20. >
  21. <template #menu-left="{ size }">
  22. <el-button
  23. :disabled="toDeleteIds.length < 1"
  24. type="danger"
  25. icon="el-icon-delete"
  26. :size="size"
  27. @click="multipleDelete"
  28. >删除</el-button
  29. >
  30. </template>
  31. </avue-crud>
  32. <el-dialog
  33. v-model="dialog1.visible"
  34. :title="dialog1.title"
  35. width="950px"
  36. @close="dialog1.visible = false"
  37. >
  38. <choice-item-page @material-info="materialInfo" />
  39. </el-dialog>
  40. <ExcelUpload ref="uploadRef" @finished="uploadFinished" />
  41. <CommonTable
  42. ref="houseRef"
  43. tableTitle="选择仓库位置"
  44. tableType="HOUSE_POSITION"
  45. @selected-sure="onSelectedFinish"
  46. />
  47. </div>
  48. </template>
  49. <script setup>
  50. import { ref, getCurrentInstance } from "vue";
  51. import { useCrud } from "@/hooks/userCrud";
  52. import ButtonPermKeys from "@/common/configs/buttonPermission";
  53. import { useCommonStoreHook } from "@/store";
  54. import dictDataUtil from "@/common/configs/dictDataUtil";
  55. const { isShowTable, tableType } = toRefs(useCommonStoreHook());
  56. const test = () => {
  57. isShowTable.value = true;
  58. tableType.value = tableType.value == 1 ? 2 : 1;
  59. };
  60. // 传入一个url,后面不带/
  61. const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
  62. useCrud({
  63. src: "/api/v1/wms/stock",
  64. });
  65. const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } =
  66. Methords; //增删改查
  67. const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
  68. const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
  69. const crudRef = ref(null); //crudRef.value 获取avue-crud对象
  70. const dialog1 = reactive({
  71. title: "物料选择",
  72. visible: false,
  73. });
  74. const materialInfo = (value) => {
  75. form.value.materialNo = value.materialCode;
  76. form.value.materialName = value.materialName;
  77. form.value.materialModel = value.spec;
  78. form.value.unit = value.unitDictValue;
  79. dialog1.visible = false;
  80. };
  81. // 设置表格列或者其他自定义的option
  82. option.value = Object.assign(option.value, {
  83. searchEnter: true,
  84. delBtn: false,
  85. selection: true,
  86. column: [
  87. /*{
  88. label: "入库单号",
  89. prop: "taskNo",
  90. search: true,
  91. rules: [
  92. {
  93. required: true,
  94. message: "入库单号不能为空",
  95. trigger: "trigger",
  96. },
  97. ],
  98. },
  99. {
  100. label: "计划单号",
  101. prop: "planNo",
  102. search: true,
  103. rules: [
  104. {
  105. required: true,
  106. message: "计划单号不能为空",
  107. trigger: "trigger",
  108. },
  109. ],
  110. },*/
  111. /*{
  112. label: "仓库编码",
  113. prop: "houseType",
  114. type: "select",
  115. search: true,
  116. width: 90,
  117. overHidden: true,
  118. editDisabled: true,
  119. dicUrl:
  120. dictDataUtil.request_url +
  121. dictDataUtil.TYPE_CODE.warehouse_type,
  122. props: {
  123. label: "dictLabel",
  124. value: "dictValue",
  125. },
  126. rules: [
  127. {
  128. required: true,
  129. message: "仓库编码不能为空",
  130. trigger: "trigger",
  131. },
  132. ],
  133. },*/
  134. {
  135. label: "入库单号",
  136. prop: "taskNo",
  137. //type: "select",
  138. search: true,
  139. width: 90,
  140. overHidden: true,
  141. //dicUrl: dictDataUtil.request_url + "stock_material_type",
  142. /* props: {
  143. label: "dictLabel",
  144. value: "dictValue",
  145. },*/
  146. rules: [
  147. {
  148. required: true,
  149. message: "入库单号不能为空",
  150. trigger: "trigger",
  151. },
  152. ],
  153. },
  154. /* {
  155. label: "料箱编号",
  156. prop: "vehicleCode",
  157. editDisabled: true,
  158. search: true,
  159. rules: [
  160. {
  161. required: true,
  162. message: "料箱编号不能为空",
  163. trigger: "trigger",
  164. },
  165. ],
  166. },*/
  167. {
  168. label: "仓库编号",
  169. prop: "houseNo",
  170. readonly: "true",
  171. click: () => {
  172. selectHouse();
  173. },
  174. rules: [
  175. {
  176. required: true,
  177. message: "仓库编号",
  178. trigger: "trigger",
  179. },
  180. ],
  181. },
  182. {
  183. label: "仓库名称",
  184. prop: "houseName",
  185. disabled: true,
  186. rules: [
  187. {
  188. required: true,
  189. message: "仓库名称",
  190. trigger: "trigger",
  191. },
  192. ],
  193. },
  194. {
  195. label: "库位",
  196. prop: "coordinate",
  197. disabled: true,
  198. rules: [
  199. {
  200. required: true,
  201. message: "仓库名称",
  202. trigger: "trigger",
  203. },
  204. ],
  205. },
  206. {
  207. label: "层级",
  208. prop: "position",
  209. disabled: true,
  210. rules: [
  211. {
  212. required: true,
  213. message: "仓库名称",
  214. trigger: "trigger",
  215. },
  216. ],
  217. },
  218. {
  219. label: "二维码",
  220. width: 120,
  221. overHidden: true,
  222. prop: "batchCode",
  223. search: true,
  224. },
  225. /*{
  226. label: "流转卡号",
  227. width: 130,
  228. overHidden: true,
  229. prop: "seqNo",
  230. },*/
  231. {
  232. label: "物料名称",
  233. prop: "materialName",
  234. width: 130,
  235. overHidden: true,
  236. search: true,
  237. rules: [
  238. {
  239. required: true,
  240. message: "物料名称不能为空",
  241. trigger: "trigger",
  242. },
  243. ],
  244. click: ({ value, column }) => {
  245. if (column.boxType) {
  246. dialog1.visible = true;
  247. }
  248. },
  249. /*rules: [
  250. {
  251. required: true,
  252. message: "物料名称不能为空",
  253. trigger: "trigger",
  254. },
  255. ],*/
  256. },
  257. {
  258. label: "数量",
  259. prop: "num",
  260. type: "number",
  261. min: 0,
  262. max: 99999,
  263. width: 150,
  264. overHidden: true,
  265. formatter: (val, value, label) => {
  266. if (val.warningMsg) {
  267. return val.num + "(" + val.warningMsg + ")";
  268. } else {
  269. return val.num;
  270. }
  271. },
  272. },
  273. {
  274. label: "单位",
  275. disabled: true,
  276. display: false,
  277. dicUrl: dictDataUtil.request_url + "danwei_type",
  278. props: {
  279. label: "dictLabel",
  280. value: "dictValue",
  281. },
  282. prop: "unit",
  283. },
  284. ],
  285. });
  286. const houseRef=ref(null);
  287. const selectHouse =()=>{
  288. houseRef.value.startSelect();
  289. }
  290. const onSelectedFinish =(val)=>{
  291. form.value.houseNo=val.houseNo;
  292. form.value.houseName=val.houseName;
  293. form.value.coordinate=val.coordinate;
  294. form.value.position=val.layer;
  295. }
  296. const rowStyle = ({ row, column, rowIndex }) => {
  297. if (row.warningMsg) {
  298. return {
  299. backgroundColor: "#f3d2d2",
  300. color: "#6c6a6a",
  301. };
  302. }
  303. };
  304. const cellStyle = ({ row, column, rowIndex, columnIndex }) => {
  305. if (columnIndex === 10) {
  306. if (row.warningMsg) {
  307. return {
  308. color: "red",
  309. fontWeight: "bold",
  310. fontSize: "20",
  311. };
  312. } else {
  313. return {
  314. color: "#60fc56",
  315. fontWeight: "bold",
  316. fontSize: "20",
  317. };
  318. }
  319. }
  320. };
  321. onMounted(() => {
  322. // console.log("crudRef", crudRef)
  323. dataList();
  324. });
  325. /**
  326. * 上传excel相关
  327. */
  328. const uploadRef = ref(null);
  329. const uploadFinished = () => {
  330. // 上传完成后的刷新操作
  331. page.currentPage = 1;
  332. dataList();
  333. };
  334. const importExcelData = () => {
  335. if (uploadRef.value) {
  336. uploadRef.value.show("/api/v1/device/import");
  337. }
  338. };
  339. </script>