index.vue 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445
  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. @selection-change="selectionChange"
  18. >
  19. <template #menu-left="{ size }">
  20. <el-button
  21. :disabled="toDeleteIds.length < 1"
  22. type="danger"
  23. icon="el-icon-delete"
  24. :size="size"
  25. @click="multipleDelete"
  26. >删除</el-button
  27. >
  28. </template>
  29. <template #menu-right="{}">
  30. <el-dropdown split-button
  31. >导入
  32. <template #dropdown>
  33. <el-dropdown-menu>
  34. <el-dropdown-item
  35. @click="downloadTemplate('/api/v1/plan/order/template')"
  36. >
  37. <i-ep-download />下载模板
  38. </el-dropdown-item>
  39. <el-dropdown-item @click="importExcelData">
  40. <i-ep-top />导入数据
  41. </el-dropdown-item>
  42. </el-dropdown-menu>
  43. </template>
  44. </el-dropdown>
  45. <el-button
  46. class="ml-3"
  47. @click="exportData('/api/v1/plan/order/export')"
  48. >
  49. <template #icon> <i-ep-download /> </template>导出
  50. </el-button>
  51. </template>
  52. </avue-crud>
  53. <ExcelUpload ref="uploadRef" @finished="uploadFinished" />
  54. </div>
  55. </template>
  56. <script setup>
  57. import { ref, getCurrentInstance } from "vue";
  58. import { useCrud } from "@/hooks/userCrud";
  59. import dictDataUtil from "@/common/configs/dictDataUtil";
  60. import ButtonPermKeys from "@/common/configs/buttonPermission";
  61. import { useCommonStoreHook, useDictionaryStoreHook } from "@/store";
  62. // 数据字典相关
  63. const { dicts } = useDictionaryStoreHook();
  64. // 传入一个url,后面不带/
  65. const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
  66. useCrud({
  67. src: "/api/v1/op/baseOperation",
  68. });
  69. const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } =
  70. Methords; //增删改查
  71. const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
  72. const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
  73. // checkBtnPerm(ButtonPermKeys.PLAN.BTNS.order_add) :permission="permission"
  74. // const permission = reactive({
  75. // delBtn: checkPerm(buttonPermission.PLAN.BTNS.order_del),
  76. // addBtn: checkPerm(buttonPermission.PLAN.BTNS.order_add),
  77. // editBtn: checkPerm(buttonPermission.PLAN.BTNS.order_edit),
  78. // menu: true,
  79. // });
  80. const crudRef = ref(null); //crudRef.value 获取avue-crud对象
  81. onMounted(() => {
  82. // console.log("crudRef", crudRef)
  83. dataList();
  84. });
  85. /**
  86. * 上传excel相关
  87. */
  88. const uploadRef = ref(null);
  89. const uploadFinished = () => {
  90. // 上传完成后的刷新操作
  91. page.currentPage = 1;
  92. dataList();
  93. };
  94. const importExcelData = () => {
  95. if (uploadRef.value) {
  96. uploadRef.value.show("/api/v1/plan/order/import");
  97. }
  98. };
  99. // 设置表格列或者其他自定义的option
  100. const switchOp = [
  101. {
  102. label: "",
  103. value: 0,
  104. },
  105. {
  106. label: "",
  107. value: 1,
  108. },
  109. ];
  110. option.value = Object.assign(option.value, {
  111. selection: true,
  112. column: [
  113. {
  114. label: "工序OP号",
  115. prop: "operationOp",
  116. search: true,
  117. span: 12,
  118. dispaly: false,
  119. rules: [
  120. {
  121. required: true,
  122. message: "工序OP号不能为空",
  123. trigger: "blur",
  124. },
  125. ],
  126. },
  127. {
  128. label: "工序名称",
  129. prop: "operationName",
  130. span: 12,
  131. search: true,
  132. rules: [
  133. {
  134. required: true,
  135. message: "工序名称不能为空",
  136. trigger: "blur",
  137. },
  138. ],
  139. },
  140. {
  141. label: "工序编码",
  142. prop: "operationCode",
  143. span: 12,
  144. search: true,
  145. rules: [
  146. {
  147. required: true,
  148. message: "工序编码不能为空",
  149. trigger: "blur",
  150. },
  151. ],
  152. },
  153. {
  154. label: "工段",
  155. prop: "workSection",
  156. type: "select",
  157. search: true,
  158. dicData: dicts.workshop_section,
  159. props: {
  160. label: "dictLabel",
  161. value: "dictValue",
  162. },
  163. span: 12,
  164. rules: [
  165. {
  166. required: true,
  167. message: "请选择工段",
  168. trigger: "change",
  169. },
  170. ],
  171. },
  172. {
  173. label: "工序类型",
  174. prop: "operationType",
  175. type: "select",
  176. search: true,
  177. dicData: dicts.process_type,
  178. props: {
  179. label: "dictLabel",
  180. value: "dictValue",
  181. },
  182. span: 12,
  183. rules: [
  184. {
  185. required: true,
  186. message: "请选择工序类型",
  187. trigger: "change",
  188. },
  189. ],
  190. },
  191. {
  192. label: "加工要求",
  193. prop: "processAsk",
  194. span: 12,
  195. rules: [
  196. {
  197. required: true,
  198. message: "加工要求不能为空",
  199. trigger: "blur",
  200. },
  201. ],
  202. },
  203. {
  204. label: "技能要求",
  205. prop: "skillAsk",
  206. span: 12,
  207. type: "select",
  208. search: true,
  209. filterable: true,
  210. dicData: dicts.skill_requirements,
  211. props: {
  212. label: "dictLabel",
  213. value: "dictValue",
  214. },
  215. rules: [
  216. {
  217. required: true,
  218. message: "请选择技能要求",
  219. trigger: "change",
  220. },
  221. ],
  222. },
  223. {
  224. label: "人工工时",
  225. prop: "preparationTime",
  226. span: 12,
  227. rules: [
  228. {
  229. required: true,
  230. message: "人工工时不能为空",
  231. trigger: "blur",
  232. },
  233. ],
  234. },
  235. {
  236. label: "标准机时",
  237. prop: "timeingNum",
  238. span: 12,
  239. rules: [
  240. {
  241. required: true,
  242. message: "标准机时不能为空",
  243. trigger: "blur",
  244. },
  245. ],
  246. },
  247. {
  248. label: "标准工时",
  249. prop: "standardWorktime",
  250. span: 12,
  251. rules: [
  252. {
  253. required: true,
  254. message: "标准工时不能为空",
  255. trigger: "blur",
  256. },
  257. ],
  258. },
  259. // {
  260. // label: '岗位',
  261. // prop: 'type',
  262. // type: 'select',
  263. // dicData: [
  264. // {
  265. // label: '岗位1',
  266. // value: 'position1',
  267. // },
  268. // ],
  269. // props: {
  270. // label: 'label',
  271. // value: 'value',
  272. // },
  273. // span: 12,
  274. // },
  275. {
  276. label: "工位类型",
  277. prop: "stanType",
  278. search: true,
  279. type: "select",
  280. dicData: dicts.station_type,
  281. props: {
  282. label: "dictLabel",
  283. value: "dictValue",
  284. },
  285. span: 12,
  286. row: true,
  287. rules: [
  288. {
  289. required: true,
  290. message: "请选择工位类型",
  291. trigger: "blur",
  292. },
  293. ],
  294. },
  295. {
  296. label: "是否可跳过",
  297. prop: "skipped",
  298. span: 8,
  299. hide: true,
  300. type: "switch",
  301. dicData: switchOp,
  302. value: 0,
  303. },
  304. {
  305. label: "是否禁用",
  306. prop: "enabled",
  307. hide: true,
  308. span: 8,
  309. type: "switch",
  310. dicData: switchOp,
  311. value: 0,
  312. },
  313. {
  314. label: "是否外协",
  315. prop: "externalCooperation",
  316. span: 8,
  317. hide: true,
  318. type: "switch",
  319. dicData: switchOp,
  320. value: 0,
  321. },
  322. {
  323. label: "是否首检",
  324. prop: "firstCheck",
  325. span: 8,
  326. hide: true,
  327. type: "switch",
  328. dicData: switchOp,
  329. value: 0,
  330. },
  331. {
  332. label: "是否巡检",
  333. prop: "inspection",
  334. span: 8,
  335. hide: true,
  336. type: "switch",
  337. dicData: switchOp,
  338. value: 0,
  339. },
  340. {
  341. label: "是否自检",
  342. prop: "selfCheck",
  343. span: 8,
  344. hide: true,
  345. type: "switch",
  346. dicData: switchOp,
  347. value: 0,
  348. },
  349. {
  350. label: "是否工艺数量",
  351. prop: "common",
  352. span: 8,
  353. hide: true,
  354. type: "switch",
  355. dicData: switchOp,
  356. value: 0,
  357. },
  358. {
  359. label: "是否分批",
  360. prop: "batch",
  361. span: 8,
  362. hide: true,
  363. type: "switch",
  364. dicData: switchOp,
  365. value: 0,
  366. },
  367. {
  368. label: "是否合批",
  369. prop: "merge",
  370. span: 8,
  371. hide: true,
  372. type: "switch",
  373. dicData: switchOp,
  374. value: 0,
  375. },
  376. {
  377. label: "合批数量",
  378. prop: "mergeNum",
  379. span: 5,
  380. hide: true,
  381. value: 0,
  382. },
  383. {
  384. label: "是否委外",
  385. prop: "outsourcing",
  386. span: 8,
  387. hide: true,
  388. type: "switch",
  389. dicData: switchOp,
  390. value: 0,
  391. },
  392. {
  393. label: "分批数量",
  394. prop: "batchNum",
  395. span: 5,
  396. hide: true,
  397. value: 0,
  398. // slot:true, // 自定义列
  399. },
  400. {
  401. label: "外协时间",
  402. prop: "outTime",
  403. span: 5,
  404. hide: true,
  405. value: 0,
  406. // slot:true, // 自定义列
  407. },
  408. {
  409. label: "前置时间",
  410. prop: "forceTime",
  411. hide: true,
  412. span: 6,
  413. value: 0,
  414. rules: [
  415. {
  416. required: true,
  417. message: "前置时间不能为空",
  418. trigger: "blur",
  419. },
  420. ],
  421. // slot:true, // 自定义列
  422. },
  423. {
  424. label: "工序描述",
  425. prop: "operationDesc",
  426. hide: true,
  427. span: 24,
  428. type: "textarea",
  429. },
  430. {
  431. label: "备注",
  432. prop: "remark",
  433. hide: true,
  434. span: 24,
  435. type: "textarea",
  436. },
  437. ],
  438. });
  439. </script>