index.vue 7.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281
  1. <template>
  2. <div>
  3. <basic-container class="page-crad">
  4. <avue-crud ref="crud" :option="option" :data="dataList" :page.sync="page" :search.sync="search"
  5. :cell-style="cellStyle" @search-change="searchChange" @current-change="currentChange" @size-change="sizeChange"
  6. @refresh-change="refreshChange" @on-load="onLoad" :table-loading="loading" @saveColumn="saveColumn"
  7. @resetColumn="resetColumn" @search-criteria-switch="searchCriteriaSwitch">
  8. <template slot="menuLeft">
  9. <el-button type="info" size="small" @click="outExport">导出
  10. </el-button>
  11. </template>
  12. <template slot="businesDateSearch">
  13. <el-date-picker v-model="search.businesDate" type="daterange" start-placeholder="开始日期" end-placeholder="结束日期"
  14. format="yyyy-MM-dd" value-format="yyyy-MM-dd HH:mm:ss" :default-time="['00:00:00', '23:59:59']">
  15. </el-date-picker>
  16. </template>
  17. </avue-crud>
  18. </basic-container>
  19. </div>
  20. </template>
  21. <script>
  22. import { getToken } from "@/util/auth";
  23. import { getList } from "@/api/statisticAnalysis/specificationsDelivery"
  24. import { gainUser } from "@/api/basicData/customerInquiry";
  25. export default {
  26. name: "index",
  27. data() {
  28. return {
  29. UConfiguration: {
  30. multipleChoices: false,
  31. multiple: false,
  32. disabled: false,
  33. searchShow: true,
  34. collapseTags: false,
  35. placeholder: '请点击右边按钮选择',
  36. dicData: []
  37. },
  38. form: {},
  39. search: {},
  40. dataList: [],
  41. loading: false,
  42. detailData: {},
  43. page: {
  44. pageSize: 20,
  45. currentPage: 1,
  46. total: 0,
  47. pageSizes: [10, 20, 30, 40, 50, 100, 200, 300, 400, 500]
  48. },
  49. option: {},
  50. optionBack: {
  51. align: "center",
  52. searchShow: true,
  53. searchMenuPosition: "right",
  54. searchSpan: 8,
  55. searchMenuSpan: 24,
  56. border: true,
  57. index: true,
  58. addBtn: false,
  59. viewBtn: false,
  60. editBtn: false,
  61. delBtn: false,
  62. searchIcon: true,
  63. menu: false,
  64. summaryText: "合计",
  65. showSummary: true,
  66. sumColumnList: [
  67. {
  68. name: "quantity",
  69. type: "sum"
  70. },
  71. {
  72. name: "amount",
  73. type: "sum"
  74. }
  75. ],
  76. column: [
  77. {
  78. label: "业务日期",
  79. prop: "date",
  80. type: "date",
  81. format: 'yyyy-MM-dd',
  82. valueFormat: 'yyyy-MM-dd',
  83. searchRange: true,
  84. overHidden: true,
  85. hide: true,
  86. showColumn: false,
  87. search: true,
  88. },
  89. {
  90. label: "业务员",
  91. prop: "chargeMember",
  92. type: "select",
  93. dicUrl: "",
  94. filterable: true,
  95. multiple: true,
  96. props: {
  97. label: "name",
  98. value: "name"
  99. },
  100. dicData:[],
  101. dataType: "string",
  102. overHidden: true,
  103. hide: true,
  104. showColumn: false,
  105. search: true
  106. },
  107. {
  108. label: "品号",
  109. prop: "code",
  110. overHidden: true
  111. },
  112. {
  113. label: "规格",
  114. prop: "typeNo",
  115. overHidden: true
  116. },
  117. {
  118. label: "品牌",
  119. prop: "brand",
  120. filterable: true,
  121. multiple: true,
  122. type: "select",
  123. props: {
  124. label: "dictValue",
  125. value: "dictValue"
  126. },
  127. dicData: [],
  128. dataType: "string",
  129. overHidden: true,
  130. search: true
  131. },
  132. {
  133. label: "花纹",
  134. prop: "brandItem",
  135. overHidden: true,
  136. },
  137. {
  138. label: "数量",
  139. prop: "quantity",
  140. overHidden: true,
  141. },
  142. {
  143. label: "数量占比排名",
  144. prop: "rankNo",
  145. overHidden: true,
  146. },
  147. {
  148. label: "金额",
  149. prop: "amount",
  150. overHidden: true,
  151. }
  152. ]
  153. }
  154. };
  155. },
  156. async created() {
  157. this.option = await this.getColumnData(this.getColumnName(230), this.optionBack);
  158. this.getAllWorkDicts()
  159. },
  160. activated() {
  161. this.$nextTick(() => {
  162. this.$refs.crud.refreshTable();
  163. });
  164. },
  165. methods: {
  166. getAllWorkDicts() {
  167. this.option.height = window.innerHeight - 210;
  168. this.getWorkDicts('brand').then(res => {
  169. this.findObject(this.option.column, "brand").dicData =
  170. res.data.data;
  171. })
  172. gainUser().then(res => {
  173. this.findObject(this.option.column, "chargeMember").dicData =
  174. res.data.data;
  175. })
  176. },
  177. cellStyle() {
  178. return "padding:0;height:40px;";
  179. },
  180. searchCriteriaSwitch(type) {
  181. if (type) {
  182. this.option.height = this.option.height - 46;
  183. } else {
  184. this.option.height = this.option.height + 46;
  185. }
  186. this.$refs.crud.getTableHeight();
  187. },
  188. //点击搜索按钮触发
  189. searchChange(params, done) {
  190. this.page.currentPage = 1;
  191. this.onLoad(this.page, params);
  192. done();
  193. },
  194. refreshChange() {
  195. this.onLoad(this.page, this.search);
  196. },
  197. currentChange(val) {
  198. this.page.currentPage = val;
  199. },
  200. sizeChange(val) {
  201. this.page.currentPage = 1;
  202. this.page.pageSize = val;
  203. },
  204. onLoad(page, params = {}) {
  205. let data = this.deepClone(Object.assign({}, params, this.search));
  206. if (data.date) {
  207. data.beginTime = data.date[0]
  208. data.endTime = data.date[1]
  209. delete data.date
  210. }
  211. this.loading = true;
  212. getList(
  213. page.currentPage,
  214. page.pageSize,
  215. data
  216. ).then(res => {
  217. this.dataList = res.data.data.records ? res.data.data.records : [];
  218. this.page.total = res.data.data.total;
  219. }).finally(() => {
  220. this.loading = false;
  221. });
  222. },
  223. //列保存触发
  224. async saveColumn() {
  225. const inSave = await this.saveColumnData(this.getColumnName(230), this.option);
  226. if (inSave) {
  227. this.$message.success("保存成功");
  228. //关闭窗口
  229. this.$refs.crud.$refs.dialogColumn.columnBox = false;
  230. }
  231. },
  232. async resetColumn() {
  233. this.option = this.optionBack;
  234. const inSave = await this.delColumnData(this.getColumnName(230), this.optionBack);
  235. this.getAllWorkDicts()
  236. if (inSave) {
  237. this.$message.success("重置成功");
  238. this.$refs.crud.$refs.dialogColumn.columnBox = false;
  239. }
  240. },
  241. editOpen(row) {
  242. },
  243. outExport() {
  244. let params = { ...this.search }
  245. if (params.date && params.date.length > 0) {
  246. params = {
  247. ...params,
  248. beginTime: params.date[0],
  249. endTime: params.date[1],
  250. }
  251. } else {
  252. params = {
  253. ...params,
  254. beginTime: '',
  255. endTime: '',
  256. }
  257. }
  258. window.open(
  259. `/api/blade-purchase-sales/exportOrder/specificationsProfitExport?${this.website.tokenHeader
  260. }=${getToken()}&beginTime=${params.beginTime}&endTime=${params.endTime}&chargeMember=${params.chargeMember}&brand=${params.brand? params.brand : ''}`
  261. );
  262. }
  263. }
  264. };
  265. </script>
  266. <style scoped>
  267. .page-crad ::v-deep .basic-container__card {
  268. height: 94.2vh;
  269. }
  270. ::v-deep .el-table__expanded-cell[class*="cell"] {
  271. padding: 0px;
  272. }
  273. .itemTable ::v-deep .el-table {
  274. width: 100%;
  275. }
  276. </style>