year-statistcs-list.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>月统计表-列表</title>
  5. <meta charset="utf-8">
  6. <meta name="viewport"
  7. content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
  8. <!-- 所有的 css & js 资源 -->
  9. <link rel="stylesheet" href="https://unpkg.com/element-ui@2.13.0/lib/theme-chalk/index.css">
  10. <link rel="stylesheet" href="../../static/sa.css">
  11. <script src="https://unpkg.com/vue@2.6.10/dist/vue.js"></script>
  12. <script src="https://unpkg.com/element-ui@2.13.0/lib/index.js"></script>
  13. <script src="https://unpkg.com/http-vue-loader@1.4.2/src/httpVueLoader.js"></script>
  14. <script src="https://unpkg.com/jquery@3.4.1/dist/jquery.js"></script>
  15. <script src="https://www.layuicdn.com/layer-v3.1.1/layer.js"></script>
  16. <script src="../../static/sa.js"></script>
  17. </head>
  18. <body>
  19. <div class="vue-box" style="display: none;" :style="'display: block;'">
  20. <div class="c-panel">
  21. <!-- ------------- 检索参数 ------------- -->
  22. <div class="c-title">检索参数</div>
  23. <el-form ref="form" :model='p' @submit.native.prevent>
  24. <div class="c-item">
  25. <label class="c-label">收费类型:</label>
  26. <el-select v-model="p.feeType" placeholder="请选择" filterable>
  27. <el-option label="-全部-" value=""></el-option>
  28. <el-option label="核酸检测" value="1"></el-option>
  29. <el-option label="消杀作业" value="2"></el-option>
  30. <el-option label="装卸作业" value="3"></el-option>
  31. <el-option label="停车业务" value="4"></el-option>
  32. <el-option label="过磅费" value="5"></el-option>
  33. <el-option label="入场管理费" value="6"></el-option>
  34. <el-option label="充电打冷作业" value="7"></el-option>
  35. </el-select>
  36. </div>
  37. <div class="c-item">
  38. <label class="c-label">日期:</label>
  39. <el-date-picker type="year" value-format="yyyy" v-model="p.year"></el-date-picker>
  40. </div>
  41. <el-button type="primary" icon="el-icon-search" @click="p.pageNo = 1; f5()">查询</el-button>
  42. <el-button size="mini" type="info" @click="sa.f5()">刷新</el-button>
  43. <el-button class="c-btn" type="warning" icon="el-icon" @click="exportStats()">导出</el-button>
  44. <el-button class="c-btn" type="success" icon="el-icon" @click="print()">打印</el-button>
  45. <br/>
  46. </el-form>
  47. <!-- ------------- 快捷按钮 ------------- -->
  48. <!-- ------------- 数据列表 ------------- -->
  49. <el-table class="data-table" ref="data-table" :data="dataList" show-summary :summary-method="getSumRol">
  50. <sa-td name="收费项目" prop="feeType" type="enum"
  51. :jv="{1: '核酸检测',2: '消杀作业', 3: '装卸作业', 4: '停车业务', 5: '过磅费', 6: '入场管理费', 7: '充电打冷作业'}"></sa-td>
  52. <sa-td name="年份" prop="year"></sa-td>
  53. <sa-td name="数量" prop="num"></sa-td>
  54. <!-- <sa-td name="含税收入(元)" prop="statisticsMoney"></sa-td>-->
  55. <el-table-column label="含税收入(元)">
  56. <template slot-scope="s">
  57. <span>{{Number(s.row.taxMoney).toFixed(2)}}</span>
  58. </template>
  59. </el-table-column>
  60. <el-table-column label="税率(%)">
  61. <template slot-scope="s">
  62. <span>{{s.row.taxRate * 100}}</span>
  63. </template>
  64. </el-table-column>
  65. <!-- <sa-td name="税款(元)" prop="taxes" ></sa-td>-->
  66. <el-table-column label="税款(元)">
  67. <template slot-scope="s">
  68. <span>{{Number(s.row.taxes).toFixed(2)}}</span>
  69. </template>
  70. </el-table-column>
  71. <!-- <sa-td name="不含税收入(元)" prop="noTaxMoney" ></sa-td>-->
  72. <el-table-column label="不含税收入(元)">
  73. <template slot-scope="s">
  74. <span>{{Number(s.row.noTaxMoney).toFixed(2)}}</span>
  75. </template>
  76. </el-table-column>
  77. </el-table>
  78. <!-- ------------- 分页 ------------- -->
  79. <sa-item type="page" :curr.sync="p.pageNo" :size.sync="p.pageSize" :total="dataCount" @change="f5()"></sa-item>
  80. </div>
  81. </div>
  82. <script>
  83. var app = new Vue({
  84. components: {
  85. "sa-item": httpVueLoader('../../sa-frame/com/sa-item.vue'),
  86. "sa-td": httpVueLoader('../../sa-frame/com/sa-td.vue'),
  87. },
  88. el: '.vue-box',
  89. data: {
  90. p: { // 查询参数
  91. id: '', // 主键
  92. feeType: '', // 收费类型(1=核酸检测,2=消杀作业,3=装卸作业,4=停车费,5=过磅费,6=入场管理费)
  93. itemTypeId: '', // 业务类型id
  94. itemTypeName: '', // 业务类型
  95. year: '', // 年份
  96. month: '', // 月份
  97. day: '', // 天
  98. dayTime: '', // 日期
  99. num: '', // 数量
  100. taxMoney: '', // 税款
  101. taxRate: '', // 税率
  102. noTaxMoney: '', // 不含税款
  103. payType: '', // 支付方式(1=微信支付)
  104. isYear: 1,
  105. pageNo: 1, // 当前页
  106. pageSize: 10, // 页大小
  107. sortType: 0 // 排序方式
  108. },
  109. dataCount: 0,
  110. dataList: [], // 数据集合
  111. tableSum: {
  112. taxMoneySum: 0,
  113. taxesSum: 0,
  114. noTaxMoneySum: 0,
  115. },
  116. },
  117. methods: {
  118. getSumRol(param) {
  119. console.log("执行了getSumRol")
  120. const columns = param.columns;
  121. const sums = [];
  122. columns.forEach((column, index) => {
  123. if (index === 0) {
  124. sums[index] = "合计";
  125. return;
  126. }
  127. //根据当前列绑定的字段名进行判断,根据字段名决定展示什么内容
  128. switch (column.label) {
  129. //金额;
  130. case "含税收入(元)":
  131. //在这里你就可以根据需要对数据进行一些处理(保留小数位数,加上单位等)
  132. sums[index] = this.tableSum.taxMoneySum;
  133. break;
  134. //人数
  135. case "税款(元)":
  136. sums[index] = this.tableSum.taxesSum;
  137. break;
  138. //件数;
  139. case "不含税收入(元)":
  140. sums[index] = this.tableSum.noTaxMoneySum;
  141. break;
  142. //不需要计算合计的列就展示‘--’
  143. default:
  144. sums[index] = "";
  145. break;
  146. }
  147. });
  148. return sums;
  149. },
  150. calcuSum() {
  151. var taxMoneySum = 0;
  152. var taxesSum = 0;
  153. var noTaxMoneySum = 0;
  154. var len = this.dataList.length;
  155. for (var i = 0; i < len; i++) {
  156. taxMoneySum = (taxMoneySum * 100 + this.dataList[i].taxMoney * 100) / 100;
  157. taxesSum = (taxesSum * 100 + this.dataList[i].taxes * 100) / 100;
  158. noTaxMoneySum = (noTaxMoneySum * 100 + this.dataList[i].noTaxMoney * 100) / 100;
  159. }
  160. this.tableSum.taxMoneySum = Number(taxMoneySum).toFixed(2);
  161. this.tableSum.taxesSum = Number(taxesSum).toFixed(2);
  162. this.tableSum.noTaxMoneySum = Number(noTaxMoneySum).toFixed(2);
  163. },
  164. getTotalMoney() {
  165. sa.ajax('/TbFeeStatistics/getSum', sa.removeNull(this.p), function (res) {
  166. this.tableSum.taxMoneySum = res.data.taxMoneySum;
  167. this.tableSum.taxesSum = res.data.taxesSum;
  168. this.tableSum.noTaxMoneySum = res.data.noTaxMoneySum;
  169. }.bind(this));
  170. },
  171. print: function () {
  172. var year = this.p.year;
  173. var feeType = this.p.feeType;
  174. var str = '';
  175. if (year === '') {
  176. str += '所有年份';
  177. } else {
  178. str += year + '年'
  179. }
  180. if (feeType === '') {
  181. str += "、所有收费项目";
  182. } else {
  183. var feeTypeName = '';
  184. if (feeType == 1) {
  185. feeTypeName = "核酸检测";
  186. } else if (feeType == 2) {
  187. feeTypeName = "消杀作业";
  188. } else if (feeType == 3) {
  189. feeTypeName = "装卸作业";
  190. } else if (feeType == 4) {
  191. feeTypeName = "停车费";
  192. } else if (feeType == 5) {
  193. feeTypeName = "过磅费";
  194. } else if (feeType == 6) {
  195. feeTypeName = "入场管理费";
  196. } else if (feeType == 7) {
  197. feeTypeName = "充电打冷作业";
  198. }
  199. str += "、收费项目为" + feeTypeName;
  200. }
  201. this.$confirm('确定打印' + str + '的数据?', '提示', {
  202. confirmButtonText: '确定',
  203. cancelButtonText: '取消',
  204. type: 'warning'
  205. }).then(() => {
  206. sa.showIframe('打印年报表', 'yearStatsPrint.html?year=' + year + "&feeType=" + feeType + "&isYear=1", '100%', '100%');
  207. }).catch(() => {
  208. });
  209. },
  210. exportStats() {
  211. var year = this.p.year;
  212. var feeType = this.p.feeType;
  213. var str = '';
  214. if (year === '') {
  215. str += '所有年份';
  216. } else {
  217. str += year + '年'
  218. }
  219. if (feeType === '') {
  220. str += "、所有收费项目";
  221. } else {
  222. var feeTypeName = '';
  223. if (feeType == 1) {
  224. feeTypeName = "核酸检测";
  225. } else if (feeType == 2) {
  226. feeTypeName = "消杀作业";
  227. } else if (feeType == 3) {
  228. feeTypeName = "装卸作业";
  229. } else if (feeType == 4) {
  230. feeTypeName = "停车费";
  231. } else if (feeType == 5) {
  232. feeTypeName = "过磅费";
  233. } else if (feeType == 6) {
  234. feeTypeName = "入场管理费";
  235. } else if (feeType == 7) {
  236. feeTypeName = "充电打冷作业";
  237. }
  238. str += "、收费项目为" + feeTypeName;
  239. }
  240. this.$confirm('确定导出' + str + '的数据?', '提示', {
  241. confirmButtonText: '确定',
  242. cancelButtonText: '取消',
  243. type: 'warning'
  244. }).then(() => {
  245. sa.ajax('/TbFeeStatistics/export/stats', sa.removeNull(this.p), function (resp) {
  246. window.open(resp.data);
  247. }.bind(this));
  248. }).catch(() => {
  249. });
  250. },
  251. // 刷新
  252. f5: function () {
  253. sa.ajax('/TbFeeStatistics/getYear', sa.removeNull(this.p), function (res) {
  254. this.dataList = res.data; // 数据
  255. this.dataCount = res.dataCount; // 数据总数
  256. sa.f5TableHeight(); // 刷新表格高度
  257. }.bind(this));
  258. this.getTotalMoney();
  259. },
  260. // 查看
  261. get: function (data) {
  262. sa.showIframe('数据详情', 'year-statistcs-info.html?id=' + data.id, '1050px', '90%');
  263. },
  264. // 查看 - 根据选中的
  265. getBySelect: function (data) {
  266. var selection = this.$refs['data-table'].selection;
  267. if (selection.length == 0) {
  268. return sa.msg('请选择一条数据')
  269. }
  270. this.get(selection[0]);
  271. },
  272. },
  273. created: function () {
  274. this.f5();
  275. sa.onInputEnter();
  276. }
  277. })
  278. </script>
  279. </body>
  280. </html>