index.vue 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227
  1. <template>
  2. <div class="mainContentBox">
  3. <avue-crud ref="crudRef1" v-model:search="data1.search" :data="data1.data" :option="data1.option"
  4. v-model:page="data1.page" @row-save="createRow" @row-update="updateRow" @row-del="deleteRow"
  5. @search-change="searchChange" @search-reset="resetChange" @size-change="dataList" @current-change="dataList"
  6. @selection-change="selectionChange" />
  7. </div>
  8. </template>
  9. <script setup>
  10. import { ref, getCurrentInstance } from "vue";
  11. import { useCrud } from "@/hooks/userCrud";
  12. import { useCommonStoreHook, useDictionaryStoreHook } from "@/store";
  13. import dictDataUtil from "@/common/configs/dictDataUtil";
  14. import editSkill from "@/views/base/skill/components/edit-skill.vue";
  15. import { getEchartData } from "@/api/report";
  16. import * as echarts from "echarts";
  17. // 数据字典相关
  18. const { dicts } = useDictionaryStoreHook();
  19. const editDialog = ref({ visible: false, title: "订单详情" });
  20. const key = ref(false);
  21. // const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
  22. // useCrud({
  23. // src: "/api/v1/process/census/completeOrder",
  24. // });
  25. // ;
  26. const data1 = ref(
  27. useCrud({
  28. src: "/api/v1/process/census/outputInfo",
  29. })
  30. );
  31. const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } =
  32. data1.value.Methords;
  33. const { selectionChange, multipleDelete } = data1.value.Methords;
  34. // 设置表格列或者其他自定义的option
  35. data1.value.option = Object.assign(data1.value.option, {
  36. selection: false,
  37. menuWidth: 100,
  38. addBtn: false,
  39. filterBtn: false,
  40. searchShowBtn: false,
  41. columnBtn: false,
  42. gridBtn: false,
  43. editBtn: false,
  44. viewBtn: false,
  45. delBtn: false,
  46. column: [
  47. {
  48. label: "日期范围",
  49. prop: "searchTime",
  50. search: true,
  51. hide: true,
  52. type: "date",
  53. format: "YYYY-MM-DD",
  54. valueFormat: "YYYY-MM-DD",
  55. searchRange: true,
  56. startPlaceholder: "开始日期",
  57. endPlaceholder: "结束日期",
  58. },
  59. {
  60. label: "订单编码",
  61. prop: "orderCode",
  62. overHidden: true,
  63. search: true,
  64. editDisabled: true,
  65. hide: true,
  66. },
  67. {
  68. label: "订单名称",
  69. prop: "orderName",
  70. overHidden: true,
  71. search: true,
  72. editDisabled: true,
  73. hide: true,
  74. },
  75. {
  76. label: "物料编码",
  77. prop: "materialCode",
  78. overHidden: true,
  79. search: true,
  80. editDisabled: true,
  81. hide: true,
  82. },
  83. {
  84. label: "工单编码",
  85. prop: "workOrderCode",
  86. width: 140,
  87. overHidden: true,
  88. search: true,
  89. editDisabled: true,
  90. hide: true,
  91. },
  92. {
  93. label: "报工人员",
  94. prop: "userName",
  95. width: 140,
  96. overHidden: true,
  97. search: true,
  98. editDisabled: true,
  99. hide: true,
  100. },
  101. {
  102. label: "工序code",
  103. prop: "operationCode",
  104. width: 140,
  105. overHidden: true,
  106. search: true,
  107. editDisabled: true,
  108. hide: true,
  109. },
  110. {
  111. label: "订单名称",
  112. prop: "orderName",
  113. search: false,
  114. },
  115. {
  116. label: "订单编码",
  117. prop: "orderCode",
  118. search: false,
  119. },
  120. {
  121. label: "工单编码",
  122. prop: "workOrderCode",
  123. search: false,
  124. },
  125. {
  126. label: "物料编码",
  127. prop: "materialCode",
  128. search: false,
  129. },
  130. {
  131. label: "物料名称",
  132. prop: "materialName",
  133. search: false,
  134. },
  135. {
  136. label: "物料规格",
  137. prop: "materialModel",
  138. search: false,
  139. },
  140. {
  141. label: "工序编码",
  142. prop: "operationCode",
  143. search: false,
  144. },
  145. {
  146. label: "工序名称",
  147. prop: "operationName",
  148. search: false,
  149. },
  150. {
  151. label: "工位",
  152. prop: "stationName",
  153. search: false,
  154. },
  155. {
  156. label: "流转卡号",
  157. prop: "seqNo",
  158. search: false,
  159. },
  160. {
  161. label: "开始时间",
  162. prop: "realStartWhen",
  163. search: false,
  164. },
  165. {
  166. label: "结束时间",
  167. prop: "realEndWhen",
  168. search: false,
  169. },
  170. {
  171. label: "标准用时(秒)",
  172. prop: "standardWorktime",
  173. search: false,
  174. },
  175. {
  176. label: "总共用时(秒)",
  177. prop: "totalTime",
  178. search: false,
  179. },
  180. {
  181. label: "人员占比",
  182. prop: "userTime",
  183. search: false,
  184. },
  185. ],
  186. });
  187. const getCurrentMonthStartAndEndDates = () => {
  188. // 获取当前日期
  189. let now = new Date();
  190. // 获取当前月份的第一天
  191. let startDate = new Date(now.getFullYear(), now.getMonth(), 1);
  192. // 获取当前月份的最后一天
  193. let endDate = new Date(now.getFullYear(), now.getMonth() + 1, 0);
  194. // 格式化日期为'YYYY-MM-DD'格式
  195. function formatDate(date) {
  196. let year = date.getFullYear();
  197. let month = String(date.getMonth() + 1).padStart(2, "0");
  198. let day = String(date.getDate()).padStart(2, "0");
  199. return `${year}-${month}-${day}`;
  200. }
  201. // 返回包含开始和结束日期的数组
  202. return [formatDate(startDate), formatDate(endDate)];
  203. };
  204. //设置搜索条件中的时间范围为默认此月
  205. const setTime = () => {
  206. data1.value.search.searchTime = getCurrentMonthStartAndEndDates();
  207. };
  208. onMounted(async () => {
  209. setTime();
  210. dataList();
  211. });
  212. </script>
  213. <style lang="scss" scoped>
  214. :deep(.avue-crud__left) {
  215. width: 100%;
  216. }
  217. </style>