index.vue 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. <template>
  2. <div class="m-right-block" style="position: relative;">
  3. <div class="right-block-bd">
  4. <div class="text-xl leading-10 pb-4 text-blue">
  5. <p>学时证明</p>
  6. </div>
  7. <div class="ng-scope">
  8. <el-table v-loading="listLoading" :data="list" border fit highlight-current-row>
  9. <el-table-column label="培训内容" align="center" min-width="120">
  10. <template slot-scope="{row}">
  11. <span>{{row.name}}</span>
  12. </template>
  13. </el-table-column>
  14. <el-table-column label="学习年度" align="center" >
  15. <template slot-scope="{row}">
  16. <span>{{row.nd}}</span>
  17. </template>
  18. </el-table-column>
  19. <el-table-column label="学时" align="center">
  20. <template slot-scope="{row}">
  21. <span>{{row.totalXs/10}}</span>
  22. </template>
  23. </el-table-column>
  24. <el-table-column label="学习时间" align="center" min-width="120">
  25. <template slot-scope="{row}">
  26. <span>{{ row.startDate }} 到 {{ row.endDate }}</span>
  27. </template>
  28. </el-table-column>
  29. <el-table-column label="操作" fixed="right" align="center" min-width="80">
  30. <template slot-scope="{row}">
  31. <el-button v-if="row.signUrl" @click="showSign(row.signUrl )" type="primary" size="small">打印学时证明</el-button>
  32. <el-button v-else @click="printCert( row )" type="warning" size="small">生成学时证明</el-button>
  33. </template>
  34. </el-table-column>
  35. </el-table>
  36. <el-pagination
  37. class="m-pages"
  38. @current-change="handleCurrentChange"
  39. :current-page="page"
  40. :page-size="size"
  41. layout="total, prev,pager, next"
  42. :total="total">
  43. </el-pagination>
  44. </div>
  45. </div>
  46. </div>
  47. </template>
  48. <script>
  49. import {
  50. httpServer
  51. } from "@/components/httpServer/httpServer.js";
  52. export default {
  53. name: "Index",
  54. data() {
  55. return {
  56. page: 1,
  57. size: 12,
  58. total: 1,
  59. list: [],
  60. listLoading: false
  61. };
  62. },
  63. beforeMount() {
  64. this.getData()
  65. },
  66. methods: {
  67. getData() {
  68. let param = {from: (this.page - 1) * this.size,size:this.size}
  69. httpServer('Cert.getCertList', param).then(({
  70. data,
  71. code
  72. }) => {
  73. if( code != 200 ) return;
  74. this.list = data.list.map(v => {
  75. this.$set(v, 'edit', false)
  76. return v
  77. });
  78. this.total = data.total || 0;
  79. })
  80. },
  81. initEdit( row ) {
  82. row.temp = Object.assign({}, row);
  83. row.edit = true;
  84. },
  85. cancelEdit(row) {
  86. row = Object.assign(row, row.temp);
  87. row.edit = false;
  88. },
  89. printCert( row ){
  90. httpServer('Cert.printCert', {id:row.id}).then( res => {
  91. if( res.code != 200 ) return;
  92. row.signUrl = res.data.url
  93. this.showSign( row.signUrl )
  94. this.$message.success("录入成功")
  95. })
  96. },
  97. showSign( url ){
  98. window.open( url )
  99. },
  100. confirmEdit(row) {
  101. let {rzCode, id} = row
  102. httpServer('Cert.addRzCode', {rzCode, id}).then( res => {
  103. if( res.code != 200 ) return;
  104. this.showSign( res.data.url );
  105. })
  106. },
  107. handleCurrentChange: function(page) {
  108. this.page = page
  109. this.getData()
  110. }
  111. }
  112. }
  113. </script>
  114. <style>
  115. </style>