index.vue 9.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380
  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 #usable="{ row }">
  20. <el-tag v-if="row.usable == '1'" type="success">已绑定</el-tag>
  21. <el-tag v-else type="info">未绑定</el-tag>
  22. </template>-->
  23. <!-- :disabled="row.usable == '1' ? false : true" -->
  24. <template #productManager-form="{ row }">
  25. <el-tree-select
  26. v-model="form.productManager"
  27. :data="userList"
  28. filterable
  29. />
  30. </template>
  31. <template #menu-right="{}">
  32. <el-dropdown split-button
  33. >导入
  34. <template #dropdown>
  35. <el-dropdown-menu>
  36. <el-dropdown-item
  37. @click="downloadTemplate('/api/v1/op/route/template')"
  38. >
  39. <i-ep-download />下载模板
  40. </el-dropdown-item>
  41. <el-dropdown-item @click="importExcelData">
  42. <i-ep-top />导入数据
  43. </el-dropdown-item>
  44. </el-dropdown-menu>
  45. </template>
  46. </el-dropdown>
  47. </template>
  48. <template #menu="{ row }">
  49. <el-button
  50. link
  51. icon="el-icon-copy-document"
  52. :disabled="false"
  53. @click="copyRow(row)"
  54. v-if="row.routeData != null && row.routeData != ''"
  55. >复制</el-button
  56. >
  57. <el-button
  58. link
  59. type="primary"
  60. v-if="row.upgradeVersion === '1'"
  61. icon="el-icon-notification"
  62. @click="changeLog(row)"
  63. >修改记录</el-button
  64. >
  65. <el-button link icon="el-icon-copy-document" @click="bindProcess(row)"
  66. >绑定</el-button
  67. >
  68. </template>
  69. </avue-crud>
  70. <CommonTable
  71. ref="ctableRef"
  72. tableTitle="添加产品"
  73. tableType="ROUTE_COMMON"
  74. @selected-sure="onSelectedFinish"
  75. />
  76. <ExcelUpload ref="uploadRef" @finished="uploadFinished" />
  77. <el-dialog
  78. v-model="centerDialogVisible"
  79. title="重命名"
  80. width="500"
  81. align-center
  82. >
  83. <el-form :model="tmpForm" label-width="auto" style="max-width: 800px">
  84. <el-row>
  85. <el-col :span="12">
  86. <el-form-item label="工艺路线编号">
  87. <el-input v-model="tmpForm.processRouteCode" />
  88. </el-form-item>
  89. </el-col>
  90. <el-col :span="12">
  91. <el-form-item label="工艺路线名称">
  92. <el-input v-model="tmpForm.processRouteName" />
  93. </el-form-item>
  94. </el-col>
  95. </el-row>
  96. </el-form>
  97. <template #footer>
  98. <div class="dialog-footer">
  99. <el-button @click="centerDialogVisible = false">取消</el-button>
  100. <el-button type="primary" @click="renameRoute()"> 确定 </el-button>
  101. </div>
  102. </template>
  103. </el-dialog>
  104. <el-dialog
  105. v-model="dialog1.visible"
  106. :title="dialog1.title"
  107. width="900px"
  108. @close="dialog1.visible = false"
  109. :destroy-on-close="true"
  110. >
  111. <RouteChangeLog :targetRouteId="routeDeatil.id" />
  112. </el-dialog>
  113. </div>
  114. </template>
  115. <script setup>
  116. import { ref, getCurrentInstance } from "vue";
  117. import { useCrud } from "@/hooks/userCrud";
  118. import ButtonPermKeys from "@/common/configs/buttonPermission";
  119. import dictDataUtil from "@/common/configs/dictDataUtil";
  120. import { useDictionaryStore } from "@/store";
  121. import { copyRoute } from "@/api/craft/route/index";
  122. import { getUserTree } from "@/api/system/user/index";
  123. import RouteChangeLog from "@/views/base/craftManagement/route/components/routeChangeLog.vue";
  124. // 数据字典相关
  125. const { dicts } = useDictionaryStore();
  126. const testDebunce = () => {
  127. console.log("执行了事件");
  128. };
  129. const dialog1 = ref({
  130. title: "修改记录",
  131. visible: false,
  132. });
  133. // 传入一个url,后面不带/
  134. const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
  135. useCrud({
  136. src: "/api/v1/op/route",
  137. });
  138. const { dataList, createRow, updateRow, deleteRow, searchChange, resetChange } =
  139. Methords; //增删改查
  140. const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
  141. const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
  142. // checkBtnPerm(ButtonPermKeys.PLAN.BTNS.order_add) :permission="permission"
  143. // const permission = reactive({
  144. // delBtn: checkPerm(buttonPermission.PLAN.BTNS.order_del),
  145. // addBtn: checkPerm(buttonPermission.PLAN.BTNS.order_add),
  146. // editBtn: checkPerm(buttonPermission.PLAN.BTNS.order_edit),
  147. // menu: true,
  148. // });
  149. let centerDialogVisible = ref(false);
  150. const crudRef = ref(null); //crudRef.value 获取avue-crud对象
  151. const tmpForm = ref({});
  152. onMounted(() => {
  153. // console.log("crudRef", crudRef)
  154. search.value.routeType = "common";
  155. dataList();
  156. getUserTree({}).then((data) => {
  157. userList.value = data.data;
  158. });
  159. });
  160. const changeLog = (row) => {
  161. console.log(row);
  162. routeDeatil.value = row;
  163. console.log(routeDeatil.value);
  164. dialog1.value.visible = true;
  165. };
  166. /**
  167. * 上传excel相关
  168. */
  169. const uploadRef = ref(null);
  170. const uploadFinished = () => {
  171. // 上传完成后的刷新操作
  172. page.currentPage = 1;
  173. search.value.routeType = "common";
  174. dataList();
  175. };
  176. const importExcelData = () => {
  177. if (uploadRef.value) {
  178. uploadRef.value.show("/api/v1/op/route/import");
  179. }
  180. };
  181. // 选择产品相关
  182. const ctableRef = ref(null);
  183. const userList = ref([]);
  184. const onSelectedFinish = (selectedValue) => {
  185. // search.value.prodtName = selectedValue.materialName;
  186. form.value.prodtName = selectedValue.materialName;
  187. form.value.prodtCode = selectedValue.materialCode;
  188. form.value.prodtModel = selectedValue.spec;
  189. };
  190. const startChooseProduct = () => {
  191. if (ctableRef.value) {
  192. ctableRef.value.startSelect();
  193. }
  194. };
  195. // 已经绑定了工序的可以复制,跟后端HT商量只传id即可。
  196. const copyRow = (row) => {
  197. form.value = Object.assign(form.value, row);
  198. form.value.processRouteVersion = "";
  199. crudRef.value.rowAdd();
  200. };
  201. const renameRoute = () => {
  202. tmpForm.value.id;
  203. tmpForm.value.processRouteCode;
  204. tmpForm.value.processRouteName;
  205. copyRoute(tmpForm.value).then(() => {
  206. tmpForm.value.id = undefined;
  207. tmpForm.value.processRouteCode = undefined;
  208. tmpForm.value.processRouteName = undefined;
  209. page.currentPage = 1;
  210. dataList();
  211. });
  212. centerDialogVisible.value = false;
  213. };
  214. const router = useRouter();
  215. // 绑定工序
  216. const bindProcess = (row) => {
  217. router.push({
  218. path: `/base/craftManagement/bindProcess/${row.id}/null`,
  219. });
  220. };
  221. // 设置表格列或者其他自定义的option
  222. option.value = Object.assign(option.value, {
  223. searchEnter: true,
  224. selection: true,
  225. labelWidth: 130,
  226. searchLabelWidth: 110,
  227. column: [
  228. {
  229. label: "工艺路线编号",
  230. prop: "processRouteCode",
  231. search: true,
  232. width: 150,
  233. addDisplay: true,
  234. editDisabled: true,
  235. overHidden: true,
  236. display: false,
  237. },
  238. {
  239. label: "工艺路线名称",
  240. prop: "processRouteName",
  241. width: 150,
  242. search: true,
  243. overHidden: true,
  244. rules: [
  245. {
  246. required: true,
  247. message: "工艺路线名称不能为空",
  248. trigger: "blur",
  249. },
  250. ],
  251. },
  252. {
  253. label: "工艺路线类型",
  254. prop: "processRouteType",
  255. width: 120,
  256. search: true,
  257. overHidden: true,
  258. rules: [
  259. {
  260. required: true,
  261. message: "工艺路线类型不能为空",
  262. trigger: "change",
  263. },
  264. ],
  265. type: "select",
  266. dicUrl: dictDataUtil.request_url + dictDataUtil.TYPE_CODE.routing_type,
  267. props: {
  268. label: "dictLabel",
  269. value: "dictValue",
  270. },
  271. },
  272. {
  273. label: "执行文件和标准",
  274. prop: "executeFileStd",
  275. width: 180,
  276. addDisplay: true,
  277. overHidden: true,
  278. rules: [
  279. {
  280. required: true,
  281. message: "执行文件和标准不能为空",
  282. trigger: "blur",
  283. },
  284. ],
  285. },
  286. // 在产品那边绑定了工艺路线才是已绑定
  287. {
  288. label: "启用状态",
  289. prop: "enabled",
  290. addDisplay: false,
  291. // editDisplay: false,
  292. slot: true,
  293. width: 100,
  294. type: "radio",
  295. dicData: [
  296. {
  297. label: "未启用",
  298. value: 1,
  299. },
  300. {
  301. label: "启用",
  302. value: 0,
  303. },
  304. ],
  305. value: 0,
  306. },
  307. // 只有绑定了工序才可以复制。
  308. {
  309. label: "是否可复制",
  310. prop: "usable2",
  311. slot: true,
  312. width: 100,
  313. search: false,
  314. filterable: true,
  315. hide: true,
  316. addDisplay: false,
  317. editDisplay: false,
  318. type: "radio",
  319. dicData: [
  320. {
  321. label: "否",
  322. value: 0,
  323. },
  324. {
  325. label: "是",
  326. value: 1,
  327. },
  328. ],
  329. value: 0,
  330. },
  331. {
  332. label: "产品负责人",
  333. prop: "productManager",
  334. width: 120,
  335. slot: true,
  336. rules: [
  337. {
  338. required: true,
  339. message: "工艺路线类型不能为空",
  340. trigger: "change",
  341. },
  342. ],
  343. },
  344. {
  345. label: "创建人",
  346. prop: "creator",
  347. addDisplay: false,
  348. editDisplay: false,
  349. overHidden: true,
  350. },
  351. {
  352. label: "创建时间",
  353. prop: "created",
  354. addDisplay: false,
  355. editDisplay: false,
  356. overHidden: true,
  357. },
  358. {
  359. label: "工艺路线类型",
  360. prop: "routeType",
  361. width: 150,
  362. hide: true,
  363. display: false,
  364. value: "common",
  365. },
  366. ],
  367. });
  368. </script>