index.vue 7.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268
  1. <template>
  2. <div>
  3. <basic-container v-if="isShow">
  4. <avue-crud :option="option"
  5. :data="dataList"
  6. ref="crud"
  7. v-model="form"
  8. :page.sync="page"
  9. :search.sync="search"
  10. @row-del="rowDel"
  11. @row-update="rowUpdate"
  12. :before-open="beforeOpen"
  13. :before-close="beforeClose"
  14. @row-save="rowSave"
  15. @search-change="searchChange"
  16. @search-reset="searchReset"
  17. @selection-change="selectionChange"
  18. @current-change="currentChange"
  19. @size-change="sizeChange"
  20. @refresh-change="refreshChange"
  21. @on-load="onLoad"
  22. @tree-load="treeLoad">
  23. <template slot-scope="{}" slot="startTimeSearchLabel">
  24. <span>有效日期:</span>
  25. </template>
  26. <template slot="corpsSearch">
  27. <select-component
  28. v-model="search.corps"
  29. :configuration="configuration"
  30. ></select-component>
  31. </template>
  32. <template slot-scope="scope" slot="corps">
  33. {{ scope.row.corps }}
  34. </template>
  35. <template slot-scope="scope" slot="menu">
  36. <el-button
  37. type="text"
  38. icon="el-icon-view"
  39. size="small"
  40. @click.stop="beforeOpenPage(scope.row,scope.index)"
  41. >查看
  42. </el-button>
  43. <el-button
  44. type="text"
  45. icon="el-icon-edit"
  46. size="small"
  47. @click.stop="editOpen(scope.row,scope.index)"
  48. >编辑
  49. </el-button>
  50. <el-button
  51. type="text"
  52. icon="el-icon-delete"
  53. size="small"
  54. @click.stop="rowDel(scope.row,scope.index)"
  55. >删除
  56. </el-button>
  57. </template>
  58. </avue-crud>
  59. </basic-container>
  60. <detail-page
  61. ref="detail"
  62. @goBack="goBack"
  63. :detailData="detailData"
  64. v-else
  65. ></detail-page>
  66. </div>
  67. </template>
  68. <script>
  69. import option from "./configuration/mainList.json";
  70. import {customerList, typeSave, deleteDetails} from "@/api/maintenance/salesPolicy";
  71. import detailPage from "./detailsPageEdit";
  72. export default {
  73. name: "customerInformation",
  74. components: {
  75. detailPage
  76. },
  77. data() {
  78. return {
  79. form: {},
  80. option: option,
  81. search: {},
  82. configuration: {
  83. multipleChoices: false,
  84. multiple: false,
  85. collapseTags: false,
  86. placeholder: "请点击右边按钮选择",
  87. dicData: [],
  88. clearable: true
  89. },
  90. parentId: 0,
  91. dataList: [],
  92. page: {
  93. pageSize: 10,
  94. pagerCount: 5,
  95. total: 0,
  96. },
  97. isShow: true,
  98. detailData: {},
  99. }
  100. },
  101. created() {
  102. let i = 0;
  103. this.option.column.forEach(item => {
  104. if (item.search) i++
  105. })
  106. if (i % 3 !== 0){
  107. const num = 3 - Number(i % 3)
  108. this.option.searchMenuSpan = num * 8;
  109. this.option.searchMenuPosition = "right";
  110. }
  111. },
  112. methods: {
  113. //删除列表后面的删除按钮触发触发(row, index, done)
  114. rowDel(row, index, done) {
  115. this.$confirm("确定将选择数据删除?", {
  116. confirmButtonText: "确定",
  117. cancelButtonText: "取消",
  118. type: "warning"
  119. }).then(() => {
  120. return deleteDetails(row.id);
  121. }).then(() => {
  122. this.$message({
  123. type: "success",
  124. message: "操作成功!"
  125. });
  126. this.page.currentPage = 1;
  127. this.onLoad(this.page, {parentId: 0});
  128. });
  129. },
  130. //修改时的修改按钮点击触发
  131. rowUpdate(row, index, done, loading) {
  132. typeSave(row).then(() => {
  133. this.$message({
  134. type: "success",
  135. message: "操作成功!"
  136. });
  137. // 数据回调进行刷新
  138. done(row);
  139. }, error => {
  140. window.console.log(error);
  141. loading();
  142. });
  143. },
  144. //新增修改时保存触发
  145. rowSave(row, done, loading) {
  146. typeSave(row).then(res => {
  147. console.log(res)
  148. done()
  149. })
  150. },
  151. //查询全部
  152. initData() {
  153. customerList().then(res => {
  154. console.log(this.form);
  155. const column = this.findObject(this.option.column, "parentId");
  156. column.dicData = res.data.data.records;
  157. });
  158. },
  159. //新增子项触发
  160. handleAdd(row) {
  161. this.parentId = row.id;
  162. const column = this.findObject(this.option.column, "parentId");
  163. column.value = row.id;
  164. column.addDisabled = true;
  165. this.$refs.crud.rowAdd();
  166. },
  167. //查看跳转页面
  168. beforeOpenPage(row, index) {
  169. this.detailData = {
  170. id: row.id,
  171. };
  172. this.isShow = false;
  173. // this.$router.push({
  174. // path: "/salesPolicy_detailsPageEdit",
  175. // query: {id: JSON.stringify(row.id)},
  176. // });
  177. },
  178. //新增跳转页面
  179. beforeOpen(row, index) {
  180. this.detailData = {
  181. id: row.id,
  182. };
  183. this.isShow = false;
  184. // this.$router.push({
  185. // path: "/salesPolicy_detailsPageEdit",
  186. // query: {id: JSON.stringify(row.id)},
  187. // });
  188. },
  189. editOpen(row, index) {
  190. this.detailData = {
  191. id: row.id,
  192. };
  193. this.isShow = false;
  194. // this.$router.push({
  195. // path: "/salesPolicy_detailsPageEdit",
  196. // query: {id: JSON.stringify(row.id)},
  197. // });
  198. },
  199. //点击新增时触发
  200. beforeClose(done) {
  201. this.parentId = "";
  202. const column = this.findObject(this.option.column, "parentId");
  203. column.value = "";
  204. column.addDisabled = false;
  205. done();
  206. },
  207. //点击搜索按钮触发
  208. searchChange(params, done) {
  209. if (params.createTime) {
  210. params.createTimeStart = params.createTime[0]+ " " + "00:00:00"
  211. params.createTimeEnd = params.createTime[1]+ " " + "23:59:59"
  212. delete params.createTime;
  213. }
  214. if (params.startTime) {
  215. params.dateValidityStart = params.startTime[0]+ " " + "00:00:00"
  216. params.dateValidityEnd = params.startTime[1]+ " " + "23:59:59"
  217. delete params.startTime;
  218. }
  219. this.page.currentPage = 1;
  220. this.onLoad(this.page, params);
  221. done()
  222. },
  223. searchReset() {
  224. console.log('1')
  225. },
  226. selectionChange() {
  227. console.log('1')
  228. },
  229. currentChange() {
  230. console.log('1')
  231. },
  232. sizeChange() {
  233. console.log('1')
  234. },
  235. refreshChange() {
  236. console.log('1')
  237. },
  238. onLoad(page, params = {parentId: 0}) {
  239. let queryParams = Object.assign({}, params, {
  240. size: page.pageSize,
  241. current: page.currentPage,
  242. })
  243. customerList(queryParams).then(res => {
  244. this.dataList = res.data.data.records
  245. this.page.total = res.data.data.total
  246. })
  247. },
  248. //树桩列点击展开触发
  249. treeLoad(tree, treeNode, resolve) {
  250. const parentId = tree.id;
  251. customerList({parentId: parentId}).then(res => {
  252. resolve(res.data.data.records);
  253. });
  254. },
  255. goBack() {
  256. this.detailData=this.$options.data().detailData
  257. this.isShow = true;
  258. },
  259. }
  260. }
  261. </script>
  262. <style scoped>
  263. </style>