|
|
@@ -1,159 +1,175 @@
|
|
|
<template>
|
|
|
- <div class="modelBlock">
|
|
|
- <div class="model-title">
|
|
|
- <div class="model-title-text">押金余额分析</div>
|
|
|
- <div class="model-title-right">
|
|
|
- <el-select v-model="mixins_query.depositType" placeholder="押金类型" clearable class="saveColumn-select" @change="getData">
|
|
|
- <el-option label="装修押金" :value="1"></el-option>
|
|
|
- <el-option label="租赁押金" :value="2"></el-option>
|
|
|
- </el-select>
|
|
|
- <el-date-picker
|
|
|
- value-format="yyyy"
|
|
|
- v-model="date"
|
|
|
- type="year"
|
|
|
- placeholder="选择年"
|
|
|
- class="saveColumn-select saveColumn-select-time"
|
|
|
- @change="changeTime"
|
|
|
- :clearable="false"
|
|
|
- >
|
|
|
- </el-date-picker>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="model-content">
|
|
|
- <zz-echart :option="clientOptions" class="chart"></zz-echart>
|
|
|
- </div>
|
|
|
+ <div class="modelBlock">
|
|
|
+ <div class="model-title">
|
|
|
+ <div class="model-title-text">押金余额分析</div>
|
|
|
+ <div class="model-title-right">
|
|
|
+ <el-select
|
|
|
+ v-model="mixins_query.depositType"
|
|
|
+ placeholder="押金类型"
|
|
|
+ clearable
|
|
|
+ class="saveColumn-select"
|
|
|
+ @change="getData"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ label="装修押金"
|
|
|
+ :value="1"
|
|
|
+ ></el-option>
|
|
|
+ <el-option
|
|
|
+ label="租赁押金"
|
|
|
+ :value="2"
|
|
|
+ ></el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-date-picker
|
|
|
+ value-format="yyyy"
|
|
|
+ v-model="date"
|
|
|
+ type="year"
|
|
|
+ placeholder="选择年"
|
|
|
+ class="saveColumn-select saveColumn-select-time"
|
|
|
+ @change="changeTime"
|
|
|
+ :clearable="false"
|
|
|
+ >
|
|
|
+ </el-date-picker>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
+ <div class="model-content">
|
|
|
+ <zz-echart
|
|
|
+ :option="clientOptions"
|
|
|
+ class="chart"
|
|
|
+ ></zz-echart>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import { columnOptionsChartName } from './indexOptionChart.js';
|
|
|
import allcommunit from './allcommunit';
|
|
|
export default {
|
|
|
- mixins: [allcommunit],
|
|
|
- data() {
|
|
|
- return {
|
|
|
- mixins_query: {
|
|
|
- communityId: '',
|
|
|
- depositType: '',
|
|
|
- year: ''
|
|
|
- },
|
|
|
- date: '',
|
|
|
- clientOptions: columnOptionsChartName(
|
|
|
- '(元)',
|
|
|
- ['应收', '已收', '已退', '余额'],
|
|
|
- [
|
|
|
- {
|
|
|
- name: '应收',
|
|
|
- data: 0
|
|
|
- },
|
|
|
- {
|
|
|
- name: '已收',
|
|
|
- data: 0
|
|
|
- },
|
|
|
- {
|
|
|
- name: '已退',
|
|
|
- data: 0
|
|
|
- },
|
|
|
- {
|
|
|
- name: '余额',
|
|
|
- data: 0
|
|
|
- }
|
|
|
- ],
|
|
|
- [],
|
|
|
- 10
|
|
|
- )
|
|
|
- };
|
|
|
- },
|
|
|
+ mixins: [allcommunit],
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ mixins_query: {
|
|
|
+ communityId: '',
|
|
|
+ depositType: '',
|
|
|
+ year: ''
|
|
|
+ },
|
|
|
+ date: '',
|
|
|
+ clientOptions: columnOptionsChartName(
|
|
|
+ '(元)',
|
|
|
+ ['应收', '已收', '已退', '余额'],
|
|
|
+ [
|
|
|
+ {
|
|
|
+ name: '应收',
|
|
|
+ data: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '已收',
|
|
|
+ data: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '已退',
|
|
|
+ data: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '余额',
|
|
|
+ data: 0
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ [],
|
|
|
+ 10
|
|
|
+ )
|
|
|
+ };
|
|
|
+ },
|
|
|
|
|
|
- mounted() {},
|
|
|
- computed: {},
|
|
|
- methods: {
|
|
|
- getData() {
|
|
|
- this.$http
|
|
|
- .get('/sc-charge/deposit/statistics/balance', this.mixins_query)
|
|
|
- .then(({ status, data, msg }) => {
|
|
|
- if (status == 0 && !!data) {
|
|
|
- this.clientOptions = columnOptionsChartName(
|
|
|
- '(元)',
|
|
|
- ['应收', '已收', '已退', '余额'],
|
|
|
- [
|
|
|
- {
|
|
|
- name: '应收',
|
|
|
- data: data.amount || 0
|
|
|
- },
|
|
|
- {
|
|
|
- name: '已收',
|
|
|
- data: data.paymentAmount || 0
|
|
|
- },
|
|
|
- {
|
|
|
- name: '已退',
|
|
|
- data: data.refundAmount || 0
|
|
|
- },
|
|
|
- {
|
|
|
- name: '余额',
|
|
|
- data: data.balance || 0
|
|
|
- }
|
|
|
- ],
|
|
|
- [],
|
|
|
- 10
|
|
|
- );
|
|
|
- } else {
|
|
|
- this.clientOptions = columnOptionsChartName(
|
|
|
- '(元)',
|
|
|
- ['应收', '已收', '已退', '余额'],
|
|
|
- [
|
|
|
- {
|
|
|
- name: '应收',
|
|
|
- data: 0
|
|
|
- },
|
|
|
- {
|
|
|
- name: '已收',
|
|
|
- data: 0
|
|
|
- },
|
|
|
- {
|
|
|
- name: '已退',
|
|
|
- data: 0
|
|
|
- },
|
|
|
- {
|
|
|
- name: '余额',
|
|
|
- data: 0
|
|
|
- }
|
|
|
- ],
|
|
|
- [],
|
|
|
- 10
|
|
|
- );
|
|
|
- }
|
|
|
- })
|
|
|
- .catch((err) => {});
|
|
|
- },
|
|
|
- eachartObj(data) {
|
|
|
- this.total = data.total;
|
|
|
- let typeName = {
|
|
|
- 1: '微信在线',
|
|
|
- 2: '支付宝',
|
|
|
- 3: '现金',
|
|
|
- 4: '预存',
|
|
|
- 5: '其他',
|
|
|
- 6: '刷卡',
|
|
|
- 7: '微信扫码'
|
|
|
- };
|
|
|
- let newData = [];
|
|
|
- for (let a in data.datas) {
|
|
|
- newData.push({
|
|
|
- value: data.datas[a],
|
|
|
- name: typeName[a]
|
|
|
- });
|
|
|
- }
|
|
|
- return newData;
|
|
|
- },
|
|
|
- changeTime(v) {
|
|
|
- this.mixins_query.year = v;
|
|
|
- this.getData();
|
|
|
- }
|
|
|
+ mounted () { },
|
|
|
+ computed: {},
|
|
|
+ methods: {
|
|
|
+ getData () {
|
|
|
+ this.$http
|
|
|
+ .get('/sc-charge/deposit/statistics/balance', this.mixins_query)
|
|
|
+ .then(({ status, data, msg }) => {
|
|
|
+ if (status == 0 && !!data) {
|
|
|
+ this.clientOptions = columnOptionsChartName(
|
|
|
+ '(元)',
|
|
|
+ ['应收', '已收', '已退', '余额'],
|
|
|
+ [
|
|
|
+ {
|
|
|
+ name: '应收',
|
|
|
+ data: data.amount || 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '已收',
|
|
|
+ data: data.paymentAmount || 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '已退',
|
|
|
+ data: data.refundAmount || 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '余额',
|
|
|
+ // data: data.balance || 0
|
|
|
+ data: (data.paymentAmount - data.refundAmount) || 0
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ [],
|
|
|
+ 10
|
|
|
+ );
|
|
|
+ } else {
|
|
|
+ this.clientOptions = columnOptionsChartName(
|
|
|
+ '(元)',
|
|
|
+ ['应收', '已收', '已退', '余额'],
|
|
|
+ [
|
|
|
+ {
|
|
|
+ name: '应收',
|
|
|
+ data: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '已收',
|
|
|
+ data: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '已退',
|
|
|
+ data: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '余额',
|
|
|
+ data: 0
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ [],
|
|
|
+ 10
|
|
|
+ );
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch((err) => { });
|
|
|
+ },
|
|
|
+ eachartObj (data) {
|
|
|
+ this.total = data.total;
|
|
|
+ let typeName = {
|
|
|
+ 1: '微信在线',
|
|
|
+ 2: '支付宝',
|
|
|
+ 3: '现金',
|
|
|
+ 4: '预存',
|
|
|
+ 5: '其他',
|
|
|
+ 6: '刷卡',
|
|
|
+ 7: '微信扫码'
|
|
|
+ };
|
|
|
+ let newData = [];
|
|
|
+ for (let a in data.datas) {
|
|
|
+ newData.push({
|
|
|
+ value: data.datas[a],
|
|
|
+ name: typeName[a]
|
|
|
+ });
|
|
|
+ }
|
|
|
+ return newData;
|
|
|
},
|
|
|
- created() {
|
|
|
- this.date = this.$moment().format('YYYY');
|
|
|
- this.mixins_query.year = this.$moment().format('YYYY');
|
|
|
+ changeTime (v) {
|
|
|
+ this.mixins_query.year = v;
|
|
|
+ this.getData();
|
|
|
}
|
|
|
+ },
|
|
|
+ created () {
|
|
|
+ this.date = this.$moment().format('YYYY');
|
|
|
+ this.mixins_query.year = this.$moment().format('YYYY');
|
|
|
+ }
|
|
|
};
|
|
|
</script>
|
|
|
<style scoped lang="scss">
|
