design-cost.vue 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163
  1. <template>
  2. <div>
  3. <div style="margin-top: 6px;">
  4. <el-form :inline="true">
  5. <el-form-item label="研发项目名称">
  6. <project-select v-model="params.xmId" @change="handleProjectChange"></project-select>
  7. </el-form-item>
  8. <el-form-item label="研发项目编号">
  9. {{ selProject.xmbh }}
  10. </el-form-item>
  11. </el-form>
  12. </div>
  13. <avue-crud
  14. ref="crud"
  15. v-bind="bindVal"
  16. v-on="onEvent"
  17. v-model="form"
  18. :page.sync="page"
  19. >
  20. <template slot="menuLeft">
  21. <el-button
  22. v-if="!isSelAnnual"
  23. type="danger"
  24. size="small"
  25. icon="el-icon-delete"
  26. plain
  27. @click="handleDelete"
  28. >
  29. 删 除
  30. </el-button>
  31. <el-button
  32. v-if="!isSelAnnual"
  33. type="success"
  34. size="small"
  35. plain
  36. icon="el-icon-upload2"
  37. @click="handleImport"
  38. >
  39. 导入
  40. </el-button>
  41. <el-button
  42. type="warning"
  43. size="small"
  44. plain
  45. icon="el-icon-download"
  46. @click="handleExport"
  47. >
  48. 导出
  49. </el-button>
  50. <print-table-btn @click="printTable" />
  51. </template>
  52. </avue-crud>
  53. <upload-excel-dialog ref="uploadExcelDialog" :uploadAfter="uploadAfter"/>
  54. <WideTablePrinter
  55. ref="printWideTable"
  56. :columns="wideTableColumns"
  57. :data="data"
  58. :print-title="printTitle"
  59. :rows-per-page="30"
  60. :default-landscape="true"
  61. />
  62. </div>
  63. </template>
  64. <script>
  65. import {exportBloByPost} from "@/api/common";
  66. import UploadExcelDialog from "@/components/upload-excel-dialog";
  67. import projectSelect from "@/components/project-select";
  68. import {getToken} from "@/util/auth";
  69. import {downloadXls} from "@/util/util";
  70. export default window.$crudCommon({
  71. props: {
  72. projectId: [String, Number]
  73. },
  74. components: {
  75. UploadExcelDialog,
  76. projectSelect,
  77. },
  78. data() {
  79. return {
  80. params: {
  81. xmId: ''
  82. },
  83. selProject: {},
  84. wideTableColumns: [],
  85. printTitle: "",
  86. };
  87. },
  88. watch: {
  89. "params.xmId"() {
  90. this.page.currentPage = 1;
  91. this.getList(this.page);
  92. },
  93. },
  94. created() {
  95. this.params.xmId = this.projectId;
  96. this.option.height = window.innerHeight - 340;
  97. },
  98. methods: {
  99. handleBeforeOpen(done, type) {
  100. if (!this.params.xmId) {
  101. this.$message.warning("请选择项目!");
  102. return;
  103. }
  104. done();
  105. },
  106. getList() {
  107. if (!this.params.xmId) {
  108. return;
  109. }
  110. this.loadData();
  111. },
  112. getFormData() {
  113. return { ...this.form, xmId: this.params.xmId }
  114. },
  115. handleProjectChange(data) {
  116. this.selProject = data;
  117. },
  118. handleImport() {
  119. let excelParams = { xmId: this.params.xmId };
  120. this.$refs.uploadExcelDialog.open('/api/kd-scientific/ys-sjfy/import', excelParams);
  121. },
  122. uploadAfter() {
  123. this.page.currentPage = 1;
  124. this.getList(this.page);
  125. },
  126. handleExport() {
  127. exportBloByPost(`/api/kd-scientific/ys-sjfy/export?${this.website.tokenHeader}=${getToken()}`, this.params).then(res => {
  128. downloadXls(res.data, `${this.selProject.xmmc}设计费用.xlsx`);
  129. });
  130. },
  131. /**
  132. * 打印表格
  133. * @param isLandscape 是否横向打印
  134. */
  135. printTable(isLandscape) {
  136. this.wideTableColumns = this.$refs.crud.columnOption;
  137. this.printTitle = `${this.selProject.xmmc}设计费用`;
  138. this.$nextTick(() => {
  139. this.$refs.printWideTable.printTable(isLandscape);
  140. })
  141. },
  142. },
  143. }, {
  144. // 模块路径
  145. name: 'projectManage/designCost',
  146. res: ({ data }) => {
  147. data.records = data.records.map(item => {
  148. item.ysje = (item.ysje || 0).toFixed(2);
  149. return item;
  150. });
  151. return data;
  152. },
  153. });
  154. </script>