index.vue 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231
  1. <!-- 采购员上级采购经理匹配 -->
  2. <script>
  3. import useColumns from "./columns";
  4. import { dicts } from "./dicts";
  5. import { LIST, IMPORT } from "@/api/business/purchase/match";
  6. export default {
  7. name: "pu-match",
  8. dicts: [...dicts],
  9. components: {
  10. MatchDetails: () => import("./details/index.vue"),
  11. PlscButton: () => import("./fun-button/plsc/index.vue"),
  12. DcButton: () => import("./fun-button/daochu/index.vue"),
  13. BatchImport: () => import("@/components/BatchImport/index.vue"),
  14. ElSuperSearch: () => import("@/components/super-search/index.vue"),
  15. ElSuperUxTable: () => import("@/components/super-ux-table/index.vue"),
  16. TyQyButton: () => import("./fun-button/ty-qy/index.vue"),
  17. },
  18. data() {
  19. const { SearchColumns, TableColumns } = useColumns();
  20. const page = this.$init.page();
  21. const params = this.$init.params(SearchColumns);
  22. return {
  23. page,
  24. params,
  25. size: "mini",
  26. TableColumns,
  27. SearchColumns,
  28. loading: false,
  29. tableData: [],
  30. selectData: [],
  31. addType: "add",
  32. };
  33. },
  34. computed: {},
  35. methods: {
  36. //
  37. async useQuery(params, page) {
  38. try {
  39. this.loading = true;
  40. let { code, rows, total } = await LIST({ ...params, ...page });
  41. if (code === 200) {
  42. this.tableData = rows;
  43. this.page.total = total;
  44. }
  45. } catch (error) {
  46. } finally {
  47. this.loading = false;
  48. }
  49. },
  50. // 重置
  51. useReset() {
  52. this.page = this.$init.page();
  53. this.params = this.$init.params(this.SearchColumns);
  54. this.useQuery(this.params, this.page);
  55. },
  56. //
  57. useAdd() {
  58. this.addType = "add";
  59. let { setVisible } = this.$refs.matcDetails;
  60. setVisible(true);
  61. },
  62. //
  63. useEdit(prop) {
  64. this.addType = "edit";
  65. this.selectData = [{ ...prop }];
  66. let { setVisible } = this.$refs.matcDetails;
  67. setVisible(true);
  68. },
  69. //
  70. useSee(prop) {
  71. this.addType = "see";
  72. this.selectData = [{ ...prop }];
  73. let { setVisible } = this.$refs.matcDetails;
  74. setVisible(true);
  75. },
  76. // 导入
  77. async handelImport(fileList) {
  78. try {
  79. this.$modal.loading("正在上传文件,请稍候...");
  80. let formData = new FormData();
  81. formData.append("file", fileList[0].raw);
  82. let { code, data, msg } = await IMPORT(formData);
  83. if (code === 200) {
  84. let { setVisible } = this.$refs.batchImport;
  85. setVisible(false);
  86. this.$notify.success(msg);
  87. this.useQuery(this.params, this.page);
  88. }
  89. } catch (error) {
  90. } finally {
  91. this.$modal.closeLoading();
  92. }
  93. },
  94. // 模板下载
  95. handleTemDownload() {
  96. this.download(
  97. "/pu/match/downloadFailData",
  98. {},
  99. `采购员上级采购经理匹配模板${new Date().getTime()}.xlsx`
  100. );
  101. },
  102. // 选 择
  103. useSelect(prop) {
  104. this.selectData = prop;
  105. },
  106. },
  107. created() {
  108. this.useQuery(this.params, this.page);
  109. },
  110. };
  111. </script>
  112. <template>
  113. <el-card
  114. v-loading="loading"
  115. :body-style="{
  116. height: '100%',
  117. padding: 0,
  118. display: 'flex',
  119. 'flex-direction': 'column',
  120. }"
  121. >
  122. <el-super-search
  123. v-model="params"
  124. :size="size"
  125. :dict="dict"
  126. :columns="SearchColumns"
  127. @reset="useReset"
  128. @submit="useQuery(params, page)"
  129. ></el-super-search>
  130. <el-row
  131. :gutter="10"
  132. class="mb10"
  133. type="flex"
  134. justify="end"
  135. style="margin-top: 20px"
  136. >
  137. <el-button
  138. type="primary"
  139. :size="size"
  140. v-hasPermi="['pu:match:add']"
  141. @click="useAdd"
  142. >新增</el-button
  143. >
  144. <BatchImport
  145. ref="batchImport"
  146. v-hasPermi="['pu:match:export']"
  147. @import="handelImport"
  148. @temDownload="handleTemDownload"
  149. ></BatchImport>
  150. <ty-qy-button
  151. :size="size"
  152. :select-data="selectData"
  153. @refresh="useQuery(params, page)"
  154. ></ty-qy-button>
  155. <plsc-button
  156. :size="size"
  157. :select-data="selectData"
  158. @refresh="useQuery(params, page)"
  159. ></plsc-button>
  160. <dc-button
  161. :size="size"
  162. :select-sata="selectData"
  163. :params="params"
  164. ></dc-button>
  165. </el-row>
  166. <match-details
  167. :size="size"
  168. :dict="dict"
  169. :data="selectData"
  170. :add-type="addType"
  171. ref="matcDetails"
  172. @refresh="useQuery(params, page)"
  173. ></match-details>
  174. <el-super-ux-table
  175. v-model="tableData"
  176. :dict="dict"
  177. :size="size"
  178. :page="page"
  179. :columns="TableColumns"
  180. index
  181. checkbox
  182. pagination
  183. convenitentOperation
  184. storage-key="PuMatchSuperTable"
  185. @row-dblclick="useSee"
  186. @row-select="useSelect"
  187. @pagination="useQuery(params, page)"
  188. >
  189. <ux-table-column fixed="right" title="操作" width="180" align="center">
  190. <template slot-scope="scope">
  191. <el-button type="text" :size="size" @click.stop="useSee(scope.row)"
  192. >查看</el-button
  193. >
  194. <el-button
  195. type="text"
  196. :size="size"
  197. v-hasPermi="['pu:match:edit']"
  198. @click.stop="useEdit(scope.row)"
  199. >编辑</el-button
  200. >
  201. </template>
  202. </ux-table-column>
  203. </el-super-ux-table>
  204. </el-card>
  205. </template>
  206. <style scoped lang="scss">
  207. .el-card {
  208. width: calc(100% - 32px);
  209. height: calc(100vh - 32px);
  210. margin: 16px;
  211. padding: 16px;
  212. border-radius: 8px;
  213. }
  214. .el-button-group {
  215. margin: 0 10px;
  216. }
  217. </style>