drawing-page.vue 7.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330
  1. <template>
  2. <div class="mainContentBox">
  3. <avue-form ref="formRef" v-model="form" :option="option" @submit="rowSave">
  4. <template #drawingPath="scope">
  5. <!-- <single-upload v-model="form.drawingPath" :generatePdf="true"/>-->
  6. <FilesUpload
  7. v-model:src-list="srcList"
  8. v-model:pdf-list="pdfUrlList"
  9. v-model:file-name-list="fileNameList"
  10. :limit="10"
  11. :generate-pdf="true"
  12. @finished="testFiles"
  13. />
  14. </template>
  15. </avue-form>
  16. <avue-crud
  17. ref="crudRef"
  18. v-model:search="search"
  19. v-model="form"
  20. :data="data"
  21. :option="option"
  22. v-model:page="page"
  23. @row-save="addRow"
  24. @row-update="updateRow"
  25. @row-del="deleteRow"
  26. @search-change="searchChange"
  27. @search-reset="resetChange"
  28. @size-change="dataList"
  29. @current-change="dataList"
  30. @selection-change="selectionChange"
  31. search-option="false"
  32. >
  33. <template #menu-left="{ size }">
  34. <el-button
  35. :disabled="toDeleteIds.length < 1"
  36. type="danger"
  37. icon="el-icon-delete"
  38. :size="size"
  39. @click="multipleDelete"
  40. >删除</el-button
  41. >
  42. <el-select
  43. v-model="version"
  44. placeholder="请选择BOM版本"
  45. style="width: 150px; margin-left: 15px"
  46. @change="getVersionDrawing"
  47. >
  48. <el-option
  49. v-for="item in options"
  50. :key="item"
  51. :label="item"
  52. :value="item"
  53. >
  54. </el-option>
  55. </el-select>
  56. </template>
  57. <template #menu="{ row, index, type }">
  58. <!-- <PDFView
  59. :need-to-show-pdf="true"
  60. content-type="button"
  61. :is-link="true"
  62. :pdf-source="filePath + row.pdfPath"
  63. />-->
  64. <el-button link type="primary" @click="toShowPDF(row)">
  65. </el-button>
  66. </template>
  67. </avue-crud>
  68. <PDFDrawerView ref="PDFDrawerViewRef"></PDFDrawerView>
  69. </div>
  70. </template>
  71. <script setup>
  72. import { ref, getCurrentInstance } from "vue";
  73. import { useCrud } from "@/hooks/userCrud";
  74. import ButtonPermKeys from "@/common/configs/buttonPermission";
  75. import { useCommonStoreHook } from "@/store";
  76. const { isShowTable, tableType } = toRefs(useCommonStoreHook());
  77. import { useDictionaryStore } from "@/store";
  78. import { addDrawing, getDrawing } from "@/api/drawing";
  79. const { dicts } = useDictionaryStore();
  80. const filePath = import.meta.env.VITE_APP_UPLOAD_URL;
  81. const test = () => {
  82. isShowTable.value = true;
  83. tableType.value = tableType.value == 1 ? 2 : 1;
  84. };
  85. const addRow = (form2, done) => {
  86. createRow(form, done, done);
  87. pdfUrlList.value = [];
  88. srcList.value = [];
  89. fileNameList.value = [];
  90. };
  91. const testFiles = () => {
  92. form.value.pdfPathList = pdfUrlList.value;
  93. form.value.drawingPathList = srcList.value;
  94. form.value.drawingPath = srcList.value[0];
  95. form.value.fileNameList = fileNameList.value;
  96. };
  97. // 传入一个url,后面不带/
  98. const { form, data, option, search, page, toDeleteIds, Methords, Utils } =
  99. useCrud({
  100. src: "/api/v1/base/drawing",
  101. });
  102. const { dataList } = Methords; //增删改查
  103. const { selectionChange, multipleDelete } = Methords; //选中和批量删除事件
  104. const { checkBtnPerm, downloadTemplate, exportData } = Utils; //按钮权限等工具
  105. // checkBtnPerm(ButtonPermKeys.PLAN.BTNS.order_add) :permission="permission"
  106. // const permission = reactive({
  107. // delBtn: checkPerm(buttonPermission.PLAN.BTNS.order_del),
  108. // addBtn: checkPerm(buttonPermission.PLAN.BTNS.order_add),
  109. // editBtn: checkPerm(buttonPermission.PLAN.BTNS.order_edit),
  110. // menu: true,
  111. // });
  112. const PDFDrawerViewRef = ref(null);
  113. const toShowPDF = (row) => {
  114. let url = import.meta.env.VITE_APP_UPLOAD_URL + row.pdfPath;
  115. PDFDrawerViewRef.value && PDFDrawerViewRef.value.showPdf(url);
  116. };
  117. const formRef = ref(null);
  118. const version = ref({
  119. value: "0",
  120. label: "请选择图纸版本",
  121. });
  122. const options = ref([]);
  123. const fileUrl = ref(""); //单文件
  124. const pdfUrlList = ref([]);
  125. const srcList = ref([]);
  126. const fileNameList = ref([]);
  127. import dictDataUtil from "@/common/configs/dictDataUtil";
  128. const getVersionDrawing = () => {
  129. if (version.value.value != "0") {
  130. search.value.materialCode = props.materialCode;
  131. search.value.drawingVersion = version.value;
  132. dataList();
  133. }
  134. };
  135. function rowSave(form, done) {
  136. form.associationCode = props.materialCode;
  137. form.associationName = props.materialName;
  138. console.info("formRef.value", done);
  139. addDrawing(form).then((data) => {
  140. if (data.code === "200") {
  141. ElMessage({
  142. message: data.msg,
  143. type: "success",
  144. });
  145. formRef.value.resetForm();
  146. dataList();
  147. } else {
  148. ElMessage({
  149. message: data.msg,
  150. type: "error",
  151. });
  152. }
  153. });
  154. done();
  155. }
  156. onMounted(() => {
  157. // console.log("crudRef", crudRef)
  158. getDrawing(props.materialCode).then((data) => {
  159. if (data.code === "200") {
  160. options.value = Array.from(data.data);
  161. } else {
  162. ElMessage({
  163. message: data.msg,
  164. type: "error",
  165. });
  166. }
  167. });
  168. search.value.materialCode = props.materialCode;
  169. dataList();
  170. });
  171. const ctableRef = ref(null);
  172. // 设置表格列或者其他自定义的option
  173. option.value = Object.assign(option.value, {
  174. selection: true,
  175. column: [
  176. {
  177. label: "物料编号",
  178. prop: "associationCode",
  179. hide: true,
  180. display: false,
  181. },
  182. {
  183. label: "物料编号",
  184. prop: "associationName",
  185. hide: true,
  186. display: false,
  187. },
  188. {
  189. label: "图纸编号",
  190. prop: "drawingCode",
  191. rules: [
  192. {
  193. required: true,
  194. message: "图纸编号不能为空",
  195. trigger: "blur",
  196. },
  197. ],
  198. },
  199. {
  200. label: "图纸标题",
  201. prop: "drawingTitle",
  202. rules: [
  203. {
  204. required: true,
  205. message: "图纸名称不能为空",
  206. trigger: "blur",
  207. },
  208. ],
  209. },
  210. {
  211. label: "图纸类型",
  212. prop: "drawingDictValue",
  213. filterable: true,
  214. type: "select",
  215. width: 100,
  216. overHidden: true,
  217. dicUrl: dictDataUtil.request_url + "drawing_type",
  218. props: { label: "dictLabel", value: "dictValue" },
  219. rules: [
  220. {
  221. required: true,
  222. message: "请选择物料属性",
  223. trigger: "blur",
  224. },
  225. ],
  226. },
  227. {
  228. label: "文件名称",
  229. prop: "fileName",
  230. span: 24,
  231. width: 120,
  232. overHidden: true,
  233. display: false,
  234. },
  235. {
  236. label: "文件数组",
  237. prop: "drawingPathList",
  238. span: 24,
  239. hide: true,
  240. display: false,
  241. },
  242. {
  243. label: "pdf数组",
  244. prop: "pdfPathList",
  245. span: 24,
  246. hide: true,
  247. display: false,
  248. },
  249. {
  250. label: "文件名称数组",
  251. prop: "fileNameList",
  252. span: 24,
  253. slot: true,
  254. hide: true,
  255. display: false,
  256. },
  257. {
  258. label: "版本",
  259. prop: "drawingVersion",
  260. precision: 1,
  261. rules: [
  262. {
  263. required: true,
  264. message: "版本号不能为空",
  265. trigger: "blur",
  266. },
  267. ],
  268. click() {
  269. dialog1.visible = true;
  270. },
  271. },
  272. {
  273. label: "图纸上传",
  274. prop: "drawingPath",
  275. span: 24,
  276. slot: true,
  277. hide: true,
  278. rules: [
  279. {
  280. required: true,
  281. message: "图纸上传不能为空",
  282. trigger: "blur",
  283. },
  284. ],
  285. /*formatter: (row, column, cellValue, index) => {
  286. return `<img src="${row.drawingPath}" alt="${row.drawingPath}" width="50" height="50">`;
  287. }
  288. */
  289. },
  290. ],
  291. delBtn: false,
  292. editBtn: false,
  293. viewBtn: false,
  294. addBtn: false,
  295. });
  296. const props = defineProps({
  297. materialCode: {
  298. type: String,
  299. default: () => {
  300. return 0;
  301. },
  302. },
  303. materialName: {
  304. type: String,
  305. default: () => {
  306. return 0;
  307. },
  308. },
  309. dialog: {
  310. type: Object,
  311. default: () => {
  312. return {};
  313. },
  314. },
  315. });
  316. </script>