wxzc-details.vue 9.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293
  1. <template>
  2. <basic-container>
  3. <avue-crud
  4. v-bind="bindVal"
  5. v-on="onEvent"
  6. v-model="form"
  7. :page.sync="page"
  8. :permission="permissionList"
  9. >
  10. <template slot="menuLeft">
  11. <el-button
  12. v-if="!isSelAnnual"
  13. type="danger"
  14. size="small"
  15. icon="el-icon-delete"
  16. plain
  17. @click="handleDelete"
  18. >
  19. 删 除
  20. </el-button>
  21. <el-button
  22. v-if="!isSelAnnual"
  23. type="success"
  24. size="small"
  25. plain
  26. icon="el-icon-upload2"
  27. @click="handleImport"
  28. >
  29. 导入
  30. </el-button>
  31. <el-button
  32. type="warning"
  33. size="small"
  34. plain
  35. icon="el-icon-download"
  36. @click="handleExport"
  37. >
  38. 导出
  39. </el-button>
  40. <el-button
  41. v-if="!isSelAnnual"
  42. type="primary"
  43. size="small"
  44. @click="handleReadyDevData"
  45. >
  46. 直接引用
  47. </el-button>
  48. <print-table-btn @click="printTable" />
  49. </template>
  50. <template slot="body">
  51. <h3 class="page-title">{{ pageTitle }}</h3>
  52. <year-month-select v-model="params.yearAndMonth"></year-month-select>
  53. </template>
  54. <template slot="sysmSearch">
  55. <div style="display: flex; align-items: center;">
  56. <span>使用寿命:</span>
  57. <avue-input-number v-model="extraParams.sysmMin" :min="0" style="width: 90px !important;"></avue-input-number>
  58. <span style="width: 20px; text-align: center;">至</span>
  59. <avue-input-number v-model="extraParams.sysmMax" :min="0" style="width: 90px !important;"></avue-input-number>
  60. </div>
  61. </template>
  62. <template slot="zcyzSearch">
  63. <div style="display: flex; align-items: center;">
  64. <span>资产原值:</span>
  65. <avue-input-number v-model="extraParams.zcyzMin" :min="0" style="width: 90px !important;"></avue-input-number>
  66. <span style="width: 20px; text-align: center;">至</span>
  67. <avue-input-number v-model="extraParams.zcyzMax" :min="0" style="width: 90px !important;"></avue-input-number>
  68. </div>
  69. </template>
  70. <template slot="ysysmSearch">
  71. <div style="display: flex; align-items: center;">
  72. <span>已使用月数:</span>
  73. <avue-input-number v-model="extraParams.ysysmMin" :min="0" style="width: 90px !important;"></avue-input-number>
  74. <span style="width: 20px; text-align: center;">至</span>
  75. <avue-input-number v-model="extraParams.ysysmMax" :min="0" style="width: 90px !important;"></avue-input-number>
  76. </div>
  77. </template>
  78. <template slot="yzjeSearch">
  79. <div style="display: flex; align-items: center;">
  80. <span>月折旧额(每台/套):</span>
  81. <avue-input-number v-model="extraParams.yzjeMin" :min="0" style="width: 90px !important;"></avue-input-number>
  82. <span style="width: 20px; text-align: center;">至</span>
  83. <avue-input-number v-model="extraParams.yzjeMax" :min="0" style="width: 90px !important;"></avue-input-number>
  84. </div>
  85. </template>
  86. <template slot="xmIdForm">
  87. <project-select v-model="form.xmId" :params="{ yearAndMonth: params.yearAndMonth }" :noDetail="true" @change="handleProjectChange"></project-select>
  88. </template>
  89. <template slot="assetIdForm">
  90. <asset-select
  91. v-model="form.assetId"
  92. :params="{ yearAndMonth: params.yearAndMonth, zclb: '软件,专利权,非专利技术,其他' }"
  93. @change="handleAssetChange"
  94. ></asset-select>
  95. </template>
  96. <template slot="userUnicodeForm">
  97. <el-select
  98. v-model="form.userUnicode"
  99. filterable
  100. placeholder="请选择 使用人"
  101. style="width: 100%;"
  102. >
  103. <el-option
  104. v-for="item in cyPersonList"
  105. :key="item.value"
  106. :label="item.label"
  107. :value="item.value">
  108. </el-option>
  109. </el-select>
  110. </template>
  111. </avue-crud>
  112. <upload-excel-dialog ref="uploadExcelDialog" :uploadAfter="uploadAfter"/>
  113. <WideTablePrinter
  114. ref="printWideTable"
  115. :columns="wideTableColumns"
  116. :data="wideTableData"
  117. :print-title="pageTitle"
  118. :rows-per-page="30"
  119. :default-landscape="true"
  120. :zoom="75"
  121. />
  122. </basic-container>
  123. </template>
  124. <script>
  125. import { fetchDeviceData } from "@/api/yfCostManage/basicDataSetting/wxzcDetail";
  126. import { getList as getCyPersonList } from "@/api/techPerson/cyPersonSumList"
  127. import YearMonthSelect from "@/components/year-month-select";
  128. import UploadExcelDialog from "@/components/upload-excel-dialog";
  129. import projectSelect from "@/components/project-select";
  130. import assetSelect from "@/components/asset-select";
  131. import moment from "moment";
  132. import Decimal from "decimal.js";
  133. import { mapGetters } from "vuex";
  134. import {exportBloByPost} from "@/api/common";
  135. import {getToken} from "@/util/auth";
  136. import {downloadXls} from "@/util/util";
  137. export default window.$crudCommon({
  138. components: {
  139. YearMonthSelect,
  140. projectSelect,
  141. assetSelect,
  142. UploadExcelDialog,
  143. },
  144. data() {
  145. return {
  146. params: {
  147. yearAndMonth: "",
  148. },
  149. isSelAnnual: false,
  150. cyPersonList: [],
  151. wideTableColumns: [],
  152. wideTableData: [],
  153. };
  154. },
  155. watch: {
  156. 'params.yearAndMonth'(newVal) {
  157. if (newVal.length > 4) {
  158. // 是否勾选未全年
  159. this.isSelAnnual = false;
  160. } else {
  161. this.isSelAnnual = true;
  162. }
  163. this.page.currentPage = 1;
  164. this.getList(this.page);
  165. },
  166. },
  167. computed: {
  168. ...mapGetters(['tag']),
  169. permissionList() {
  170. return {
  171. addBtn: !this.isSelAnnual,
  172. editBtn: !this.isSelAnnual,
  173. delBtn: !this.isSelAnnual,
  174. };
  175. },
  176. pageTitle() {
  177. let yearAndMonthCN = '';
  178. if (this.params.yearAndMonth) {
  179. let formatTemp = this.isSelAnnual ? "yyyy年" : "yyyy年MM月";
  180. yearAndMonthCN = moment(this.params.yearAndMonth).format(formatTemp);
  181. }
  182. return `${yearAndMonthCN}${this.tag.label}`.replace(/每月/g, '');
  183. }
  184. },
  185. methods: {
  186. handleImport() {
  187. let excelParams = { yearAndMonth: this.params.yearAndMonth };
  188. this.$refs.uploadExcelDialog.open('/api/kd-scientific/asset/intangible/import', excelParams);
  189. },
  190. uploadAfter() {
  191. this.page.currentPage = 1;
  192. this.getList(this.page);
  193. },
  194. handleExport() {
  195. exportBloByPost(`/api/kd-scientific/asset/intangible/export?${this.website.tokenHeader}=${getToken()}`, this.params).then(res => {
  196. downloadXls(res.data, `${this.pageTitle}.xlsx`);
  197. });
  198. },
  199. /**
  200. * 打印表格
  201. * @param isLandscape 是否横向打印
  202. */
  203. printTable(isLandscape) {
  204. this.wideTableColumns = this.printOption.column;
  205. this.wideTableData = [...this.$refs.crud.list];
  206. this.$nextTick(() => {
  207. this.$refs.printWideTable.printTable(isLandscape);
  208. })
  209. },
  210. handleReadyDevData() {
  211. fetchDeviceData({ yearAndMonth: this.params.yearAndMonth}).then(res => {
  212. let data = res.data;
  213. if (data.success) {
  214. this.$message.success('引用成功!');
  215. this.page.currentPage = 1;
  216. this.getList(this.page);
  217. }
  218. });
  219. },
  220. handleAssetChange({ zcbm }) {
  221. this.form = { ...this.form, zcbm };
  222. },
  223. getFormData() {
  224. const { id, xmId, assetId, zcbm, userUnicode } = this.form;
  225. let userName;
  226. if (!!userUnicode) {
  227. let personObj = this.cyPersonList.find(item => item.unicode === userUnicode);
  228. userName = personObj ? personObj.name : undefined;
  229. }
  230. return { id, xmId, assetId, zcbm, userUnicode, userName, yearAndMonth: this.params.yearAndMonth };
  231. },
  232. handleProjectChange(data) {
  233. this.getCyPersonListFunc(data.xmmc);
  234. },
  235. // 获取项目参研人员列表
  236. getCyPersonListFunc(xmmc) {
  237. getCyPersonList(1, 99999, { xmmc, yearAndMonth: this.params.yearAndMonth }).then(({ data }) => {
  238. if (data.code == 200) {
  239. let list = data.data.records && data.data.records.length ? data.data.records[0].technicianList : [];
  240. this.cyPersonList = list.map(item => {
  241. let nameArr = [item.name, item.number || '-', item.idCard || '-'];
  242. return {
  243. label: nameArr.join(' \\ '),
  244. value: item.unicode,
  245. ...item
  246. }
  247. });
  248. }
  249. });
  250. }
  251. },
  252. }, {
  253. // 模块路径
  254. name: 'yfCostManage/basicDataSetting/wxzcDetail',
  255. res: ({ data }) => {
  256. data.records = data.records.map(item => {
  257. item.zcmc = item.asset ? item.asset.zcmc : '';
  258. item.zclb = item.asset ? item.asset.zclb : '';
  259. item.gl = item.asset ? item.asset.gl : '';
  260. item.yt = item.asset ? item.asset.yt : '';
  261. item.kssj = item.asset ? item.asset.kssj : '';
  262. item.sysm = item.asset ? item.asset.sysm : '';
  263. item.ysysm = item.asset ? item.asset.ysysm : '';
  264. item.zcyz = item.asset ? item.asset.zcyz : '';
  265. item.jcz = item.asset ? new Decimal(item.asset.jcz || 0).mul(new Decimal(100)) : '';
  266. item.yzje = item.asset ? item.asset.yzje : '';
  267. item.status = item.asset ? item.asset.status : '';
  268. return item;
  269. });
  270. return data;
  271. },
  272. });
  273. </script>