index.vue 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181
  1. <template>
  2. <el-card
  3. v-loading="loading"
  4. style="width: calc(100% - 24px); height: 100%; margin: 10px;padding: 10px;"
  5. :body-style="{ padding: 0 }"
  6. >
  7. <AddChangeOrders
  8. ref="addChangeOrders"
  9. :size="size"
  10. :dict="dict"
  11. :add-type="optionType"
  12. @success="useReset"
  13. ></AddChangeOrders>
  14. <SeeChangeOrders
  15. ref="seeChangeOrders"
  16. :size="size"
  17. :dict="dict"
  18. @success="useReset"
  19. ></SeeChangeOrders>
  20. <div>
  21. <el-super-search
  22. v-model="params"
  23. :size="size"
  24. :dict="dict"
  25. :columns="SearchColumns"
  26. @reset="useReset"
  27. @row-dblclick="useSee"
  28. @submit="useQuery(params, page)"
  29. ></el-super-search>
  30. <el-row
  31. :gutter="10"
  32. class="mb10"
  33. type="flex"
  34. justify="end"
  35. style="margin-top: 20px;"
  36. >
  37. <el-col :span="1.5">
  38. <el-button type="primary" size="small" @click="newAdd">新增</el-button>
  39. </el-col>
  40. </el-row>
  41. <el-super-table
  42. v-model="tableList"
  43. :dict="dict"
  44. :columns="TableColumns"
  45. :size="size"
  46. pagination
  47. :page="page"
  48. @pagination="useQuery(params, page)"
  49. @row-dblclick="useSee"
  50. >
  51. <el-table-column fixed="right" label="操作" width="150" align="center">
  52. <template slot-scope="scope">
  53. <el-button type="text" size="small" @click="useSee(scope.row)">查看</el-button>
  54. <el-button @click="handleEdit(scope.row)" v-if="scope.row.status == 0 || scope.row.status == 3" type="text" size="small">编辑</el-button>
  55. <el-button type="text" size="small" @click="deleteRow(scope.row)" v-if="scope.row.status == 0 || scope.row.status == 3">删除</el-button>
  56. </template>
  57. </el-table-column>
  58. </el-super-table>
  59. </div>
  60. </el-card>
  61. </template>
  62. <script>
  63. import { dicts } from "./dicts";
  64. import { getChangeList , deleteChangeList} from '@/api/changeApply/basic';
  65. import useColumns from './columns';
  66. export default {
  67. name: 'changeApply',
  68. dicts:dicts,
  69. components: {
  70. AddChangeOrders:() => import('./add/index.vue'),
  71. SeeChangeOrders:() => import('./see/index.vue'),
  72. ElSuperTable: () => import("@/components/super-table/index.vue"),
  73. ElSuperSearch: () => import("@/components/super-search/index.vue"),
  74. },
  75. data(){
  76. const {TableColumns,SearchColumns} = useColumns();
  77. const params = this.$init.params(SearchColumns);
  78. return {
  79. loading:false,
  80. size:'mini',
  81. tableList: [],
  82. TableColumns:TableColumns,
  83. page: { pageNum: 1, pageSize: 10, total: 0 },
  84. params:params,
  85. SearchColumns:SearchColumns,
  86. optionType:'add',
  87. }
  88. },
  89. methods:{
  90. useReset(){
  91. this.page.pageNum = 1;
  92. this.page.pageSize = 10;
  93. this.params = this.$init.params(this.SearchColumns);
  94. this.useQuery(this.params, this.page);
  95. },
  96. //
  97. openAddChangeOrders(row) {
  98. const {setVisible,fetchItem} = this.$refs.addChangeOrders;
  99. setVisible(true);
  100. row && fetchItem(row);
  101. },
  102. async newAdd(){
  103. this.optionType = 'add';
  104. await this.openAddChangeOrders();
  105. },
  106. async handleEdit(row){
  107. this.optionType = 'edit';
  108. await this.openAddChangeOrders(row);
  109. },
  110. async useQuery(params,page) {
  111. try {
  112. this.loading = true;
  113. let {code,rows,total} = await getChangeList({...params,...page});
  114. if (code === 200) {
  115. this.tableList = rows
  116. this.page.total = total;
  117. }
  118. } catch (error) {
  119. }finally{
  120. this.loading = false;
  121. }
  122. },
  123. async useSee(row){
  124. const {setVisible,fetchItem} = this.$refs.seeChangeOrders;
  125. await setVisible(true);
  126. await fetchItem(row);
  127. },
  128. deleteRow(row){
  129. this.$confirm('是否删除此条数据?', '提示', {
  130. confirmButtonText: '确定',
  131. cancelButtonText: '取消',
  132. type: 'warning'
  133. }).then(async() => {
  134. try {
  135. let {code,msg} = await deleteChangeList({id: row.id});
  136. if(code == 200){
  137. this.$notify.success({
  138. // title: '成功',
  139. message: msg,
  140. });
  141. await this.useQuery(this.params, this.page);
  142. }
  143. } catch (error) {}
  144. })
  145. },
  146. },
  147. created(){
  148. this.useQuery(this.params, this.page);
  149. },
  150. }
  151. </script>