index.vue 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  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. >
  18. </avue-crud>
  19. </div>
  20. </template>
  21. <script setup>
  22. import { ref, getCurrentInstance } from "vue";
  23. import { useCrud } from "@/hooks/userCrud";
  24. import ButtonPermKeys from "@/common/configs/buttonPermission";
  25. import { useCommonStoreHook } from "@/store";
  26. import dictDataUtil from "@/common/configs/dictDataUtil";
  27. const { isShowTable, tableType } = toRefs(useCommonStoreHook());
  28. const test = () => {
  29. isShowTable.value = true;
  30. tableType.value = tableType.value == 1 ? 2 : 1;
  31. };
  32. // 传入一个url,后面不带/
  33. const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
  34. useCrud({
  35. src: "/api/v1/wms/task",
  36. });
  37. const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } = Methords; //增删改查
  38. const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
  39. const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
  40. const crudRef = ref(null); //crudRef.value 获取avue-crud对象
  41. // 设置表格列或者其他自定义的option
  42. option.value = Object.assign(option.value, {
  43. delBtn: false,
  44. selection: false,
  45. viewBtn: false,
  46. editBtn: false,
  47. menu: false,
  48. addBtn: false,
  49. column: [
  50. {
  51. label: "出库单号",
  52. prop: "taskNo",
  53. search: true,
  54. width:150,
  55. overHidden: true
  56. },
  57. {
  58. label: "计划单号",
  59. prop: "planNo",
  60. search: true,
  61. },
  62. {
  63. label: "物料编号",
  64. prop: "materialNo",
  65. },
  66. {
  67. label: "物料名称",
  68. width:150,
  69. overHidden: true,
  70. prop: "materialName",
  71. },
  72. {
  73. label: "批次号",
  74. prop: "batchCode",
  75. width:150,
  76. overHidden: true
  77. },
  78. {
  79. label: "出库总数量",
  80. prop: "num",
  81. },
  82. {
  83. label: "已出库数量",
  84. prop: "completedNum",
  85. },
  86. {
  87. label: "待出库数量",
  88. prop: "unDoNum",
  89. },
  90. {
  91. label: "单位",
  92. prop: "unit",
  93. },
  94. {
  95. label: "出库类型",
  96. prop: "outType",
  97. type: "select",
  98. search: true,
  99. dicUrl:
  100. dictDataUtil.request_url +
  101. dictDataUtil.TYPE_CODE.warehouse_out_task_type,
  102. props: {
  103. label: "dictLabel",
  104. value: "dictValue",
  105. }
  106. },
  107. {
  108. label: "状态",
  109. prop: "state",
  110. type: "select",
  111. search: true,
  112. dicUrl:
  113. dictDataUtil.request_url +
  114. dictDataUtil.TYPE_CODE.warehouse_task_state,
  115. props: {
  116. label: "dictLabel",
  117. value: "dictValue",
  118. }
  119. },
  120. ],
  121. });
  122. onMounted(() => {
  123. // console.log("crudRef", crudRef)
  124. search.value.type = '2'
  125. dataList();
  126. });
  127. </script>