index.vue 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171
  1. <template>
  2. <div>
  3. <basic-container v-show="show" class="page-crad">
  4. <avue-crud ref="crud" :option="option" :data="dataList" v-model="form" :page.sync="page"
  5. :search.sync="search" @search-change="searchChange" @current-change="currentChange"
  6. @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad" :table-loading="loading"
  7. @saveColumn="saveColumn" @resetColumn="resetColumn" :cell-style="cellStyle"
  8. @selection-change="selectionChange" @search-criteria-switch="searchCriteriaSwitch">
  9. <template slot="menuLeft">
  10. <el-button type="primary" icon="el-icon-plus" size="small" @click.stop="newAdd()">创建单据
  11. </el-button>
  12. </template>
  13. <template slot-scope="{ row,index}" slot="menu">
  14. <el-button type="text" icon="el-icon-delete" size="small" @click.stop="rowDel(row, index)">删除
  15. </el-button>
  16. </template>
  17. </avue-crud>
  18. </basic-container>
  19. <detail-page @goBack="goBack" :detailData="detailData" v-if="!show"></detail-page>
  20. </div>
  21. </template>
  22. <script>
  23. import option from "./config/mainList.json";
  24. import detailPage from "./detailsPage";
  25. import _ from "lodash";
  26. export default {
  27. name: "customerInformation",
  28. data() {
  29. return {
  30. search: {},
  31. form: {},
  32. option: {},
  33. dataList: [],
  34. page: {
  35. pageSize: 20,
  36. currentPage: 1,
  37. total: 0,
  38. pageSizes: [10, 20, 30, 40, 50, 100, 200, 300, 400, 500]
  39. },
  40. show: true,
  41. detailData: {},
  42. loading: false,
  43. searchShow: true,
  44. selectionList: [],
  45. };
  46. },
  47. components: { detailPage },
  48. async created() {
  49. this.option = await this.getColumnData(this.getColumnName(167), option);
  50. this.option.height = window.innerHeight - 210;
  51. },
  52. methods: {
  53. searchCriteriaSwitch(type) {
  54. if (type) {
  55. this.option.height = this.option.height - 191;
  56. } else {
  57. this.option.height = this.option.height + 191;
  58. }
  59. this.$refs.crud.getTableHeight();
  60. },
  61. cellStyle() {
  62. return "padding:0;height:40px;";
  63. },
  64. rowDel(row, index, done) {
  65. // this.$confirm("确定删除数据?", {
  66. // confirmButtonText: "确定",
  67. // cancelButtonText: "取消",
  68. // type: "warning"
  69. // }).then(() => {
  70. // this.$message({
  71. // type: "success",
  72. // message: "删除成功!"
  73. // });
  74. // this.onLoad(this.page, this.search);
  75. // });
  76. },
  77. selectionChange(list) {
  78. this.selectionList = list;
  79. },
  80. editOpen(row, status) {
  81. this.detailData = {
  82. id: row.id,
  83. status: status
  84. };
  85. this.show = false;
  86. },
  87. //点击搜索按钮触发
  88. searchChange(params, done) {
  89. this.page.currentPage = 1;
  90. this.onLoad(this.page, params);
  91. done();
  92. },
  93. currentChange(val) {
  94. this.page.currentPage = val;
  95. },
  96. sizeChange(val) {
  97. this.page.currentPage = 1;
  98. this.page.pageSize = val;
  99. },
  100. onLoad(page, params) {
  101. // let data = this.deepClone(Object.assign(params, this.search));
  102. // this.loading = true;
  103. // getList(page.currentPage, page.pageSize, data)
  104. // .then(res => {
  105. // this.dataList = res.data.data.records ? res.data.data.records : [];
  106. // this.page.total = res.data.data.total;
  107. // })
  108. // .finally(() => {
  109. // this.loading = false;
  110. // });
  111. },
  112. refreshChange() {
  113. this.onLoad(this.page, this.search);
  114. },
  115. newAdd() {
  116. this.show = false;
  117. },
  118. goBack() {
  119. if (this.$route.query.id) {
  120. this.$router.$avueRouter.closeTag(this.$route.fullPath);
  121. this.$router.push({
  122. path: "/warehousing/inStock/index"
  123. });
  124. }
  125. this.detailData = this.$options.data().detailData;
  126. this.show = true;
  127. this.onLoad(this.page, this.search);
  128. },
  129. async saveColumn() {
  130. const inSave = await this.saveColumnData(
  131. this.getColumnName(167),
  132. this.option
  133. );
  134. if (inSave) {
  135. this.$nextTick(() => {
  136. this.$refs.crud.doLayout();
  137. });
  138. this.$message.success("保存成功");
  139. //关闭窗口
  140. this.$refs.crud.$refs.dialogColumn.columnBox = false;
  141. }
  142. },
  143. async resetColumn() {
  144. this.option = option;
  145. const inSave = await this.delColumnData(this.getColumnName(167), this.option);
  146. if (inSave) {
  147. this.$nextTick(() => {
  148. this.$refs.crud.doLayout();
  149. });
  150. this.$message.success("重置成功");
  151. this.$refs.crud.$refs.dialogColumn.columnBox = false;
  152. }
  153. }
  154. }
  155. };
  156. </script>
  157. <style scoped>
  158. ::v-deep .select-component {
  159. display: flex;
  160. }
  161. .page-crad ::v-deep .basic-container__card {
  162. height: 94.2vh;
  163. }
  164. .itemTable ::v-deep .el-table {
  165. width: 738px;
  166. }
  167. </style>