year-statistcs-list.html 10 KB

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