incomeStat.vue 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186
  1. <template>
  2. <view class="ex-page">
  3. <view class="top-bar">
  4. <DateSelect class="bar" top="0" @selectDateFn="selectDateFn" />
  5. </view>
  6. <scroll-view scroll-y scroll-with-animation class="main-view">
  7. <view class="space-view ex-table">
  8. <block>
  9. <t-table :headerBackgroundColor="'#F0F2F6'">
  10. <t-tr header><t-th>客户</t-th><t-th>应收款(元)</t-th><t-th>操作</t-th></t-tr>
  11. <t-tr><t-td><view>米加加鲜花</view></t-td><t-td><view>86500.00</view></t-td><t-td><view></view></t-td></t-tr>
  12. <t-tr><t-td><view>花点时间</view></t-td><t-td><view>70129.00</view></t-td><t-td><view></view></t-td></t-tr>
  13. <t-tr><t-td><view>国兰花尚</view></t-td><t-td><view>67111.00</view></t-td><t-td><view></view></t-td></t-tr>
  14. <t-tr><t-td><view>一间花店</view></t-td><t-td><view>51906.00</view></t-td><t-td><view></view></t-td></t-tr>
  15. <t-tr><t-td><view>花极客</view></t-td><t-td><view>4403.00</view></t-td><t-td><view></view></t-td></t-tr>
  16. <t-tr><t-td><view>花朵朵</view></t-td><t-td><view>3501.00</view></t-td><t-td><view></view></t-td></t-tr>
  17. <t-tr><t-td><view>松柏花艺</view></t-td><t-td><view>23214.00</view></t-td><t-td><view></view></t-td></t-tr>
  18. <t-tr><t-td><view>花和尚</view></t-td><t-td><view>1479.00</view></t-td><t-td><view></view></t-td></t-tr>
  19. <t-tr><t-td><view>花植言</view></t-td><t-td><view>1645.00</view></t-td><t-td><view></view></t-td></t-tr>
  20. <t-tr><t-td><view>拈花微笑</view></t-td><t-td><view>1153.00</view></t-td><t-td><view></view></t-td></t-tr>
  21. </t-table>
  22. </block>
  23. </view>
  24. </scroll-view>
  25. </view>
  26. </template>
  27. <script>
  28. import AppWrapperEmpty from "@/components/app-wrapper-empty";
  29. import SelectList from "@/components/plugin/selectList";
  30. import { getStatProfit } from "@/api/stat/index";
  31. import { list } from "@/mixins";
  32. import DorpdownSelect from "@/components/module/shopSelect";
  33. import {mapActions, mapGetters} from "vuex";
  34. export default {
  35. components: { SelectList, AppWrapperEmpty,DorpdownSelect },
  36. mixins: [list],
  37. computed: { ...mapGetters(["getDictionariesInfo","getLoginInfo"]) },
  38. data() {
  39. return {
  40. isShow:false,
  41. customizationTime:'',
  42. shopId:'',//选择分店id
  43. itemId:'',
  44. nowTime: "",
  45. showTimeDropdown: false,
  46. nowShop: "",
  47. showShopDropdown: false,
  48. columns: [
  49. {
  50. name: "姓名",
  51. dataIndex: "name",
  52. color: "info"
  53. },
  54. {
  55. name: "开单额",
  56. dataIndex: "amount",
  57. color: "info",
  58. width: 120,
  59. align: "center"
  60. },
  61. {
  62. name: "开单数",
  63. dataIndex: "num",
  64. color: "info",
  65. align: "center"
  66. }
  67. ],
  68. dataList: [],
  69. params:{
  70. itemId: '',
  71. searchTime:'',
  72. startTime: "",
  73. endTime: "",
  74. shopId: "",
  75. },
  76. profit:[],
  77. };
  78. },
  79. onPullDownRefresh() {
  80. this.resetList();
  81. this._list().then(res => {
  82. uni.stopPullDownRefresh();
  83. });
  84. },
  85. onLoad(e) {
  86. this.itemId = e.id;
  87. this.params.itemId = e.id;
  88. this.shopId = this.getLoginInfo.shopId;
  89. },
  90. methods: {
  91. ...mapActions(['setUserShopAll']),
  92. async init() {
  93. this._list();
  94. },
  95. _list() {
  96. let that = this
  97. getStatProfit(this.params).then(res => {
  98. that.profit = res.data
  99. });
  100. }
  101. }
  102. };
  103. </script>
  104. <style lang="scss" scoped>
  105. .ex-page {
  106. background: white;
  107. height: 100%;
  108. display: flex;
  109. flex-direction: column;
  110. .top-bar {
  111. position: absolute;
  112. left: 0;
  113. display: flex;
  114. width: 100%;
  115. top:116upx;
  116. z-index: 20;
  117. .bar{
  118. width: 50%;
  119. height: 100%;
  120. text-align: center;
  121. &:nth-child(1){
  122. border-right: 1upx solid #eeeeec;
  123. }
  124. }
  125. }
  126. .main-view {
  127. margin-top: 80upx;
  128. flex: 1;
  129. background-color: #f9fbfc;
  130. .space-view {
  131. background-color: #fff;
  132. }
  133. .ex-info {
  134. padding: 30upx;
  135. .info-cell {
  136. display: flex;
  137. align-items: center;
  138. font-size: 28upx;
  139. &:not(:first-child) {
  140. margin-top: 20upx;
  141. }
  142. .cell-label {
  143. width: 110upx;
  144. color: #666666;
  145. }
  146. .cell-value {
  147. margin-left: 40upx;
  148. color: #333;
  149. &.warning {
  150. color: #ffaf1d;
  151. }
  152. &.success {
  153. color: #27c325;
  154. }
  155. }
  156. }
  157. }
  158. .ex-table {
  159. ::v-deep.icon-info {
  160. color: #333333;
  161. }
  162. }
  163. }
  164. .bar-view {
  165. display: flex;
  166. justify-content: space-between;
  167. align-items: center;
  168. padding: 0 30upx;
  169. width: 100%;
  170. height: 100upx;
  171. box-shadow: 0upx -1upx 6upx 0upx rgba(4, 0, 0, 0.06);
  172. .info-view {
  173. font-size: 26upx;
  174. }
  175. .btn-view {
  176. display: flex;
  177. .admin-button-com {
  178. margin: 0 10upx;
  179. }
  180. }
  181. }
  182. }
  183. </style>