{"remainingRequest":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\front\\item\\zyAdmin\\src\\pages\\statistic\\balance\\index.vue?vue&type=script&lang=js","dependencies":[{"path":"D:\\front\\item\\zyAdmin\\src\\pages\\statistic\\balance\\index.vue","mtime":1761614939064},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":1761614927801},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\babel-loader\\lib\\index.js","mtime":1761614927320},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":1761614927801},{"path":"D:\\front\\item\\zyAdmin\\node_modules\\vue-loader\\lib\\index.js","mtime":1761614937402}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:DQppbXBvcnQgY2FyZHNEYXRhIGZyb20gJ0AvY29tcG9uZW50cy9jYXJkcy9jYXJkcyc7DQppbXBvcnQgZWNoYXJ0c05ldyBmcm9tICdAL2NvbXBvbmVudHMvZWNoYXJ0c05ldy9pbmRleCc7DQppbXBvcnQgeyBnZXRCYWxhbmNlQmFzaWMsIGdldEJhbGFuY2VUcmVuZCwgZ2V0QmFsYW5jZUNoYW5uZWwsIGdldEJhbGFuY2VUeXBlIH0gZnJvbSAnQC9hcGkvc3RhdGlzdGljJzsNCmltcG9ydCB7IGZvcm1hdERhdGUgfSBmcm9tICdAL3V0aWxzL3ZhbGlkYXRlJzsNCmltcG9ydCBlY2hhcnRzRnJvbSBmcm9tICdAL2NvbXBvbmVudHMvZWNoYXJ0cy9pbmRleCc7DQppbXBvcnQgZGF0ZVJhZGlvIGZyb20gJ0AvY29tcG9uZW50cy9kYXRlUmFkaW8nOw0KDQpleHBvcnQgZGVmYXVsdCB7DQogIG5hbWU6ICdpbmRleCcsDQogIGNvbXBvbmVudHM6IHsgY2FyZHNEYXRhLCBlY2hhcnRzTmV3LCBlY2hhcnRzRnJvbSwgZGF0ZVJhZGlvIH0sDQogIGRhdGEoKSB7DQogICAgcmV0dXJuIHsNCiAgICAgIHRpbWVWYWw6IFtdLA0KICAgICAgc3R5bGU6IHsgaGVpZ2h0OiAnNDAwcHgnIH0sDQogICAgICBpbmZvTGlzdDoge30sDQogICAgICBpbmZvTGlzdDI6IHt9LA0KICAgICAgZWNoYXJ0TGVmdDogdHJ1ZSwNCiAgICAgIGVjaGFydFJpZ2h0OiBmYWxzZSwNCiAgICAgIGxvYWRpbmc6IGZhbHNlLA0KICAgICAgbG9hZGluZzI6IGZhbHNlLA0KICAgICAgcGlja2VyT3B0aW9uczogdGhpcy4kdGltZU9wdGlvbnMsDQogICAgICBmb3JtVmFsaWRhdGU6IHsNCiAgICAgICAgdGltZTogJycsDQogICAgICB9LA0KICAgICAgY2FyZExpc3RzOiBbDQogICAgICAgIHsNCiAgICAgICAgICBjb2w6IDgsDQogICAgICAgICAgY291bnQ6IDAsDQogICAgICAgICAgbmFtZTogJ+W9k+WJjeS9meminScsDQogICAgICAgICAgY2xhc3NOYW1lOiAnaWNvbnl1ZXhpYW9oYW9qaW5lJywNCiAgICAgICAgfSwNCiAgICAgICAgew0KICAgICAgICAgIGNvbDogOCwNCiAgICAgICAgICBjb3VudDogMCwNCiAgICAgICAgICBuYW1lOiAn57Sv6K6h5L2Z6aKdJywNCiAgICAgICAgICBjbGFzc05hbWU6ICdpY29ueXVlY2hvbmd6aGknLA0KICAgICAgICB9LA0KICAgICAgICB7DQogICAgICAgICAgY29sOiA4LA0KICAgICAgICAgIGNvdW50OiAwLA0KICAgICAgICAgIG5hbWU6ICfntK/orqHmtojogJfkvZnpop0nLA0KICAgICAgICAgIGNsYXNzTmFtZTogJ2ljb255dWV4aWFvaGFvamluZScsDQogICAgICAgIH0sDQogICAgICBdLA0KICAgICAgb3B0aW9uRGF0YToge30sDQogICAgICBzcGluU2hvdzogZmFsc2UsDQogICAgICBvcHRpb25zOiB0aGlzLiR0aW1lT3B0aW9ucywNCiAgICAgIHRhYkxpc3Q6IFtdLA0KICAgICAgdGFiTGlzdDI6IFtdLA0KICAgIH07DQogIH0sDQogIGNyZWF0ZWQoKSB7DQogICAgY29uc3QgZW5kID0gbmV3IERhdGUoKTsNCiAgICBjb25zdCBzdGFydCA9IG5ldyBEYXRlKCk7DQogICAgc3RhcnQuc2V0VGltZShzdGFydC5zZXRUaW1lKG5ldyBEYXRlKG5ldyBEYXRlKCkuZ2V0RnVsbFllYXIoKSwgbmV3IERhdGUoKS5nZXRNb250aCgpLCBuZXcgRGF0ZSgpLmdldERhdGUoKSAtIDI5KSkpOw0KICAgIHRoaXMudGltZVZhbCA9IFtzdGFydCwgZW5kXTsNCiAgICB0aGlzLmZvcm1WYWxpZGF0ZS50aW1lID0gZm9ybWF0RGF0ZShzdGFydCwgJ3l5eXkvTU0vZGQnKSArICctJyArIGZvcm1hdERhdGUoZW5kLCAneXl5eS9NTS9kZCcpOw0KICAgIHRoaXMub25Jbml0KCk7DQogIH0sDQogIG1ldGhvZHM6IHsNCiAgICBvbkluaXQoKSB7DQogICAgICB0aGlzLmdldEJhbGFuY2VCYXNpYygpOw0KICAgICAgdGhpcy5nZXRCYWxhbmNlVHJlbmQoKTsNCiAgICAgIHRoaXMuZ2V0QmFsYW5jZUNoYW5uZWwoKTsNCiAgICAgIHRoaXMuZ2V0QmFsYW5jZVR5cGUoKTsNCiAgICB9LA0KICAgIG9uU2VsZWN0RGF0ZShlKSB7DQogICAgICB0aGlzLmZvcm1WYWxpZGF0ZS50aW1lID0gZTsNCiAgICAgIHRoaXMub25Jbml0KCk7DQogICAgfSwNCiAgICBnZXRCYWxhbmNlQmFzaWMoKSB7DQogICAgICBnZXRCYWxhbmNlQmFzaWModGhpcy5mb3JtVmFsaWRhdGUpLnRoZW4oKHJlcykgPT4gew0KICAgICAgICBsZXQgYXJyID0gWydub3dfYmFsYW5jZScsICdhZGRfYmFsYW5jZScsICdzdWJfYmFsYW5jZSddOw0KICAgICAgICB0aGlzLmNhcmRMaXN0cy5tYXAoKGksIGluZGV4KSA9PiB7DQogICAgICAgICAgaS5jb3VudCA9IHJlcy5kYXRhW2FycltpbmRleF1dOw0KICAgICAgICB9KTsNCiAgICAgIH0pOw0KICAgIH0sDQogICAgZ2V0QmFsYW5jZUNoYW5uZWwoKSB7DQogICAgICB0aGlzLmxvYWRpbmcgPSB0cnVlOw0KICAgICAgZ2V0QmFsYW5jZUNoYW5uZWwodGhpcy5mb3JtVmFsaWRhdGUpLnRoZW4oKHJlcykgPT4gew0KICAgICAgICB0aGlzLmluZm9MaXN0ID0gcmVzLmRhdGE7DQogICAgICAgIHRoaXMudGFiTGlzdCA9IHJlcy5kYXRhLmxpc3Q7DQogICAgICAgIHRoaXMubG9hZGluZyA9IGZhbHNlOw0KICAgICAgfSk7DQogICAgfSwNCiAgICBnZXRCYWxhbmNlVHlwZSgpIHsNCiAgICAgIHRoaXMubG9hZGluZzIgPSB0cnVlOw0KICAgICAgZ2V0QmFsYW5jZVR5cGUodGhpcy5mb3JtVmFsaWRhdGUpLnRoZW4oKHJlcykgPT4gew0KICAgICAgICB0aGlzLmluZm9MaXN0MiA9IHJlcy5kYXRhOw0KICAgICAgICB0aGlzLnRhYkxpc3QyID0gcmVzLmRhdGEubGlzdDsNCiAgICAgICAgdGhpcy5sb2FkaW5nMiA9IGZhbHNlOw0KICAgICAgfSk7DQogICAgfSwNCiAgICAvLyDlhbfkvZPml6XmnJ8NCiAgICBvbmNoYW5nZVRpbWUoZSkgew0KICAgICAgdGhpcy50aW1lVmFsID0gZTsNCiAgICAgIHRoaXMuZm9ybVZhbGlkYXRlLnRpbWUgPSB0aGlzLnRpbWVWYWwgPyB0aGlzLnRpbWVWYWwuam9pbignLScpIDogJyc7DQogICAgICB0aGlzLm5hbWUgPSB0aGlzLmZvcm1WYWxpZGF0ZS50aW1lOw0KICAgICAgdGhpcy5nZXRCYWxhbmNlQmFzaWMoKTsNCiAgICAgIHRoaXMuZ2V0QmFsYW5jZVRyZW5kKCk7DQogICAgfSwNCiAgICAvLyDnu5/orqHlm74NCiAgICBnZXRCYWxhbmNlVHJlbmQoKSB7DQogICAgICB0aGlzLnNwaW5TaG93ID0gdHJ1ZTsNCiAgICAgIGdldEJhbGFuY2VUcmVuZCh0aGlzLmZvcm1WYWxpZGF0ZSkNCiAgICAgICAgLnRoZW4oYXN5bmMgKHJlcykgPT4gew0KICAgICAgICAgIGxldCBsZWdlbmQgPSByZXMuZGF0YS5zZXJpZXMubWFwKChpdGVtKSA9PiB7DQogICAgICAgICAgICByZXR1cm4gaXRlbS5uYW1lOw0KICAgICAgICAgIH0pOw0KICAgICAgICAgIGxldCB4QXhpcyA9IHJlcy5kYXRhLnhBeGlzOw0KICAgICAgICAgIGxldCBjb2wgPSBbJyM1QjhGRjknLCAnIzVBRDhBNicsICcjRkZBQjJCJywgJyM1RDcwOTInXTsNCiAgICAgICAgICBsZXQgc2VyaWVzID0gW107DQogICAgICAgICAgcmVzLmRhdGEuc2VyaWVzLm1hcCgoaXRlbSwgaW5kZXgpID0+IHsNCiAgICAgICAgICAgIHNlcmllcy5wdXNoKHsNCiAgICAgICAgICAgICAgbmFtZTogaXRlbS5uYW1lLA0KICAgICAgICAgICAgICB0eXBlOiAnbGluZScsDQogICAgICAgICAgICAgIGRhdGE6IGl0ZW0uZGF0YSwNCiAgICAgICAgICAgICAgaXRlbVN0eWxlOiB7DQogICAgICAgICAgICAgICAgbm9ybWFsOiB7DQogICAgICAgICAgICAgICAgICBjb2xvcjogY29sW2luZGV4XSwNCiAgICAgICAgICAgICAgICB9LA0KICAgICAgICAgICAgICB9LA0KICAgICAgICAgICAgICBzbW9vdGg6IDAsDQogICAgICAgICAgICB9KTsNCiAgICAgICAgICB9KTsNCiAgICAgICAgICB0aGlzLm9wdGlvbkRhdGEgPSB7DQogICAgICAgICAgICB0b29sdGlwOiB7DQogICAgICAgICAgICAgIHRyaWdnZXI6ICdheGlzJywNCiAgICAgICAgICAgICAgYXhpc1BvaW50ZXI6IHsNCiAgICAgICAgICAgICAgICB0eXBlOiAnY3Jvc3MnLA0KICAgICAgICAgICAgICAgIGxhYmVsOiB7DQogICAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6ICcjNmE3OTg1JywNCiAgICAgICAgICAgICAgICB9LA0KICAgICAgICAgICAgICB9LA0KICAgICAgICAgICAgfSwNCiAgICAgICAgICAgIGxlZ2VuZDogew0KICAgICAgICAgICAgICB4OiAnY2VudGVyJywNCiAgICAgICAgICAgICAgZGF0YTogbGVnZW5kLA0KICAgICAgICAgICAgfSwNCiAgICAgICAgICAgIGdyaWQ6IHsNCiAgICAgICAgICAgICAgbGVmdDogJzMlJywNCiAgICAgICAgICAgICAgcmlnaHQ6ICc0JScsDQogICAgICAgICAgICAgIGJvdHRvbTogJzMlJywNCiAgICAgICAgICAgICAgY29udGFpbkxhYmVsOiB0cnVlLA0KICAgICAgICAgICAgfSwNCiAgICAgICAgICAgIHRvb2xib3g6IHsNCiAgICAgICAgICAgICAgZmVhdHVyZTogew0KICAgICAgICAgICAgICAgIHNhdmVBc0ltYWdlOiB7fSwNCiAgICAgICAgICAgICAgfSwNCiAgICAgICAgICAgIH0sDQogICAgICAgICAgICB4QXhpczogew0KICAgICAgICAgICAgICB0eXBlOiAnY2F0ZWdvcnknLA0KICAgICAgICAgICAgICBib3VuZGFyeUdhcDogdHJ1ZSwNCiAgICAgICAgICAgICAgLy8gYXhpc1RpY2s6ew0KICAgICAgICAgICAgICAvLyAgICAgc2hvdzpmYWxzZQ0KICAgICAgICAgICAgICAvLyB9LA0KICAgICAgICAgICAgICAvLyBheGlzTGluZTp7DQogICAgICAgICAgICAgIC8vICAgICBzaG93OmZhbHNlDQogICAgICAgICAgICAgIC8vIH0sDQogICAgICAgICAgICAgIC8vIHNwbGl0TGluZTogew0KICAgICAgICAgICAgICAvLyAgICAgc2hvdzogZmFsc2UNCiAgICAgICAgICAgICAgLy8gfSwNCiAgICAgICAgICAgICAgYXhpc0xhYmVsOiB7DQogICAgICAgICAgICAgICAgaW50ZXJ2YWw6IDAsDQogICAgICAgICAgICAgICAgcm90YXRlOiA0MCwNCiAgICAgICAgICAgICAgICB0ZXh0U3R5bGU6IHsNCiAgICAgICAgICAgICAgICAgIGNvbG9yOiAnIzAwMDAwMCcsDQogICAgICAgICAgICAgICAgfSwNCiAgICAgICAgICAgICAgfSwNCiAgICAgICAgICAgICAgZGF0YTogeEF4aXMsDQogICAgICAgICAgICB9LA0KICAgICAgICAgICAgeUF4aXM6IHsNCiAgICAgICAgICAgICAgdHlwZTogJ3ZhbHVlJywNCiAgICAgICAgICAgICAgYXhpc0xpbmU6IHsNCiAgICAgICAgICAgICAgICBzaG93OiBmYWxzZSwNCiAgICAgICAgICAgICAgfSwNCiAgICAgICAgICAgICAgYXhpc1RpY2s6IHsNCiAgICAgICAgICAgICAgICBzaG93OiBmYWxzZSwNCiAgICAgICAgICAgICAgfSwNCiAgICAgICAgICAgICAgYXhpc0xhYmVsOiB7DQogICAgICAgICAgICAgICAgdGV4dFN0eWxlOiB7DQogICAgICAgICAgICAgICAgICBjb2xvcjogJyM3RjhCOUMnLA0KICAgICAgICAgICAgICAgIH0sDQogICAgICAgICAgICAgIH0sDQogICAgICAgICAgICAgIHNwbGl0TGluZTogew0KICAgICAgICAgICAgICAgIHNob3c6IHRydWUsDQogICAgICAgICAgICAgICAgbGluZVN0eWxlOiB7DQogICAgICAgICAgICAgICAgICBjb2xvcjogJyNGNUY3RjknLA0KICAgICAgICAgICAgICAgIH0sDQogICAgICAgICAgICAgIH0sDQogICAgICAgICAgICB9LA0KICAgICAgICAgICAgc2VyaWVzOiBzZXJpZXMsDQogICAgICAgICAgfTsNCiAgICAgICAgICB0aGlzLnNwaW5TaG93ID0gZmFsc2U7DQogICAgICAgIH0pDQogICAgICAgIC5jYXRjaCgocmVzKSA9PiB7DQogICAgICAgICAgdGhpcy4kbWVzc2FnZS5lcnJvcihyZXMubXNnKTsNCiAgICAgICAgICB0aGlzLnNwaW5TaG93ID0gZmFsc2U7DQogICAgICAgIH0pOw0KICAgIH0sDQogIH0sDQp9Ow0K"},{"version":3,"sources":["index.vue"],"names":[],"mappings":";AAgHA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/pages/statistic/balance","sourcesContent":["<template>\r\n  <div v-loading=\"spinShow\">\r\n    <cards-data :cardLists=\"cardLists\" v-if=\"cardLists.length >= 0\"></cards-data>\r\n    <el-card :bordered=\"false\" shadow=\"never\" class=\"ivu-mb-16\">\r\n      <div class=\"acea-row row-middle\">\r\n        <span class=\"label_text\">时间选择：</span>\r\n        <el-date-picker\r\n          clearable\r\n          v-model=\"timeVal\"\r\n          type=\"daterange\"\r\n          :editable=\"false\"\r\n          @change=\"onchangeTime\"\r\n          format=\"yyyy/MM/dd\"\r\n          value-format=\"yyyy/MM/dd\"\r\n          start-placeholder=\"开始日期\"\r\n          end-placeholder=\"结束日期\"\r\n          :picker-options=\"pickerOptions\"\r\n          style=\"width: 250px\"\r\n          class=\"mr20\"\r\n        ></el-date-picker>\r\n      </div>\r\n    </el-card>\r\n    <el-card class=\"ivu-mb-16\" :bordered=\"false\" shadow=\"never\">\r\n      <h3>余额使用趋势</h3>\r\n      <echarts-new :option-data=\"optionData\" :styles=\"style\" height=\"100%\" width=\"100%\" v-if=\"optionData\"></echarts-new>\r\n    </el-card>\r\n    <div class=\"code-row-bg\">\r\n      <el-card :bordered=\"false\" shadow=\"never\" class=\"ivu-mt mr8\">\r\n        <div class=\"acea-row row-between-wrapper\">\r\n          <h3 class=\"statics-header-title\">余额来源分析</h3>\r\n          <div class=\"change-style\" v-db-click @click=\"echartLeft = !echartLeft\">切换样式</div>\r\n        </div>\r\n        <div class=\"ech-box\">\r\n          <echarts-from v-if=\"echartLeft\" ref=\"visitChart\" :infoList=\"infoList\" echartsTitle=\"circle\"></echarts-from>\r\n          <el-table\r\n            v-show=\"!echartLeft\"\r\n            ref=\"selection\"\r\n            :data=\"tabList\"\r\n            v-loading=\"loading\"\r\n            empty-text=\"暂无数据\"\r\n            highlight-current-row\r\n          >\r\n            <el-table-column type=\"index\" label=\"序号\" width=\"50\"> </el-table-column>\r\n            <el-table-column label=\"来源\" min-width=\"80\">\r\n              <template slot-scope=\"scope\">\r\n                <span>{{ scope.row.name }}</span>\r\n              </template>\r\n            </el-table-column>\r\n            <el-table-column label=\"金额\" min-width=\"130\">\r\n              <template slot-scope=\"scope\">\r\n                <span>{{ scope.row.value }}</span>\r\n              </template>\r\n            </el-table-column>\r\n            <el-table-column label=\"占比率\" min-width=\"130\">\r\n              <template slot-scope=\"scope\">\r\n                <div class=\"percent-box\">\r\n                  <div class=\"line\">\r\n                    <div class=\"bg\"></div>\r\n                    <div class=\"percent\" :style=\"'width:' + scope.row.percent + '%;'\"></div>\r\n                  </div>\r\n                  <div class=\"num\">{{ scope.row.percent }}%</div>\r\n                </div>\r\n              </template>\r\n            </el-table-column>\r\n          </el-table>\r\n        </div>\r\n      </el-card>\r\n      <el-card :bordered=\"false\" shadow=\"never\" class=\"ivu-mt ml8 pr10\">\r\n        <div class=\"acea-row row-between-wrapper\">\r\n          <h3 class=\"statics-header-title\">余额消耗</h3>\r\n          <div class=\"change-style\" v-db-click @click=\"echartRight = !echartRight\">切换样式</div>\r\n        </div>\r\n        <div class=\"ech-box\">\r\n          <echarts-from v-if=\"echartRight\" ref=\"visitChart\" :infoList=\"infoList2\" echartsTitle=\"circle\"></echarts-from>\r\n          <el-table\r\n            v-show=\"!echartRight\"\r\n            ref=\"selection\"\r\n            :data=\"tabList2\"\r\n            v-loading=\"loading2\"\r\n            empty-text=\"暂无数据\"\r\n            highlight-current-row\r\n          >\r\n            <el-table-column type=\"index\" label=\"序号\" width=\"50\"> </el-table-column>\r\n            <el-table-column label=\"来源\" min-width=\"80\">\r\n              <template slot-scope=\"scope\">\r\n                <span>{{ scope.row.name }}</span>\r\n              </template>\r\n            </el-table-column>\r\n            <el-table-column label=\"金额\" min-width=\"130\">\r\n              <template slot-scope=\"scope\">\r\n                <span>{{ scope.row.value }}</span>\r\n              </template>\r\n            </el-table-column>\r\n            <el-table-column label=\"占比率\" min-width=\"130\">\r\n              <template slot-scope=\"scope\">\r\n                <div class=\"percent-box\">\r\n                  <div class=\"line\">\r\n                    <div class=\"bg\"></div>\r\n                    <div class=\"percent\" :style=\"'width:' + scope.row.percent + '%;'\"></div>\r\n                  </div>\r\n                  <div class=\"num\">{{ scope.row.percent }}%</div>\r\n                </div>\r\n              </template>\r\n            </el-table-column>\r\n          </el-table>\r\n        </div>\r\n      </el-card>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport cardsData from '@/components/cards/cards';\r\nimport echartsNew from '@/components/echartsNew/index';\r\nimport { getBalanceBasic, getBalanceTrend, getBalanceChannel, getBalanceType } from '@/api/statistic';\r\nimport { formatDate } from '@/utils/validate';\r\nimport echartsFrom from '@/components/echarts/index';\r\nimport dateRadio from '@/components/dateRadio';\r\n\r\nexport default {\r\n  name: 'index',\r\n  components: { cardsData, echartsNew, echartsFrom, dateRadio },\r\n  data() {\r\n    return {\r\n      timeVal: [],\r\n      style: { height: '400px' },\r\n      infoList: {},\r\n      infoList2: {},\r\n      echartLeft: true,\r\n      echartRight: false,\r\n      loading: false,\r\n      loading2: false,\r\n      pickerOptions: this.$timeOptions,\r\n      formValidate: {\r\n        time: '',\r\n      },\r\n      cardLists: [\r\n        {\r\n          col: 8,\r\n          count: 0,\r\n          name: '当前余额',\r\n          className: 'iconyuexiaohaojine',\r\n        },\r\n        {\r\n          col: 8,\r\n          count: 0,\r\n          name: '累计余额',\r\n          className: 'iconyuechongzhi',\r\n        },\r\n        {\r\n          col: 8,\r\n          count: 0,\r\n          name: '累计消耗余额',\r\n          className: 'iconyuexiaohaojine',\r\n        },\r\n      ],\r\n      optionData: {},\r\n      spinShow: false,\r\n      options: this.$timeOptions,\r\n      tabList: [],\r\n      tabList2: [],\r\n    };\r\n  },\r\n  created() {\r\n    const end = new Date();\r\n    const start = new Date();\r\n    start.setTime(start.setTime(new Date(new Date().getFullYear(), new Date().getMonth(), new Date().getDate() - 29)));\r\n    this.timeVal = [start, end];\r\n    this.formValidate.time = formatDate(start, 'yyyy/MM/dd') + '-' + formatDate(end, 'yyyy/MM/dd');\r\n    this.onInit();\r\n  },\r\n  methods: {\r\n    onInit() {\r\n      this.getBalanceBasic();\r\n      this.getBalanceTrend();\r\n      this.getBalanceChannel();\r\n      this.getBalanceType();\r\n    },\r\n    onSelectDate(e) {\r\n      this.formValidate.time = e;\r\n      this.onInit();\r\n    },\r\n    getBalanceBasic() {\r\n      getBalanceBasic(this.formValidate).then((res) => {\r\n        let arr = ['now_balance', 'add_balance', 'sub_balance'];\r\n        this.cardLists.map((i, index) => {\r\n          i.count = res.data[arr[index]];\r\n        });\r\n      });\r\n    },\r\n    getBalanceChannel() {\r\n      this.loading = true;\r\n      getBalanceChannel(this.formValidate).then((res) => {\r\n        this.infoList = res.data;\r\n        this.tabList = res.data.list;\r\n        this.loading = false;\r\n      });\r\n    },\r\n    getBalanceType() {\r\n      this.loading2 = true;\r\n      getBalanceType(this.formValidate).then((res) => {\r\n        this.infoList2 = res.data;\r\n        this.tabList2 = res.data.list;\r\n        this.loading2 = false;\r\n      });\r\n    },\r\n    // 具体日期\r\n    onchangeTime(e) {\r\n      this.timeVal = e;\r\n      this.formValidate.time = this.timeVal ? this.timeVal.join('-') : '';\r\n      this.name = this.formValidate.time;\r\n      this.getBalanceBasic();\r\n      this.getBalanceTrend();\r\n    },\r\n    // 统计图\r\n    getBalanceTrend() {\r\n      this.spinShow = true;\r\n      getBalanceTrend(this.formValidate)\r\n        .then(async (res) => {\r\n          let legend = res.data.series.map((item) => {\r\n            return item.name;\r\n          });\r\n          let xAxis = res.data.xAxis;\r\n          let col = ['#5B8FF9', '#5AD8A6', '#FFAB2B', '#5D7092'];\r\n          let series = [];\r\n          res.data.series.map((item, index) => {\r\n            series.push({\r\n              name: item.name,\r\n              type: 'line',\r\n              data: item.data,\r\n              itemStyle: {\r\n                normal: {\r\n                  color: col[index],\r\n                },\r\n              },\r\n              smooth: 0,\r\n            });\r\n          });\r\n          this.optionData = {\r\n            tooltip: {\r\n              trigger: 'axis',\r\n              axisPointer: {\r\n                type: 'cross',\r\n                label: {\r\n                  backgroundColor: '#6a7985',\r\n                },\r\n              },\r\n            },\r\n            legend: {\r\n              x: 'center',\r\n              data: legend,\r\n            },\r\n            grid: {\r\n              left: '3%',\r\n              right: '4%',\r\n              bottom: '3%',\r\n              containLabel: true,\r\n            },\r\n            toolbox: {\r\n              feature: {\r\n                saveAsImage: {},\r\n              },\r\n            },\r\n            xAxis: {\r\n              type: 'category',\r\n              boundaryGap: true,\r\n              // axisTick:{\r\n              //     show:false\r\n              // },\r\n              // axisLine:{\r\n              //     show:false\r\n              // },\r\n              // splitLine: {\r\n              //     show: false\r\n              // },\r\n              axisLabel: {\r\n                interval: 0,\r\n                rotate: 40,\r\n                textStyle: {\r\n                  color: '#000000',\r\n                },\r\n              },\r\n              data: xAxis,\r\n            },\r\n            yAxis: {\r\n              type: 'value',\r\n              axisLine: {\r\n                show: false,\r\n              },\r\n              axisTick: {\r\n                show: false,\r\n              },\r\n              axisLabel: {\r\n                textStyle: {\r\n                  color: '#7F8B9C',\r\n                },\r\n              },\r\n              splitLine: {\r\n                show: true,\r\n                lineStyle: {\r\n                  color: '#F5F7F9',\r\n                },\r\n              },\r\n            },\r\n            series: series,\r\n          };\r\n          this.spinShow = false;\r\n        })\r\n        .catch((res) => {\r\n          this.$message.error(res.msg);\r\n          this.spinShow = false;\r\n        });\r\n    },\r\n  },\r\n};\r\n</script>\r\n\r\n<style scoped>\r\n.cl {\r\n  margin-right: 20px;\r\n}\r\n.code-row-bg {\r\n  display: flex;\r\n  flex-wrap: nowrap;\r\n  justify-content: space-between;\r\n}\r\n.code-row-bg .ivu-mt {\r\n  min-width: 50%;\r\n}\r\n.ech-box {\r\n  margin-top: 10px;\r\n}\r\n.change-style {\r\n  border: 1px solid #ccc;\r\n  border-radius: 15px;\r\n  padding: 0px 10px;\r\n  cursor: pointer;\r\n}\r\n.percent-box {\r\n  display: flex;\r\n  align-items: center;\r\n  padding-right: 10px;\r\n}\r\n.line {\r\n  width: 100%;\r\n  position: relative;\r\n}\r\n.bg {\r\n  position: absolute;\r\n  width: 100%;\r\n  height: 8px;\r\n  border-radius: 8px;\r\n  background-color: #f2f2f2;\r\n}\r\n.percent {\r\n  position: absolute;\r\n  border-radius: 5px;\r\n  height: 8px;\r\n  background-color: var(--prev-color-primary);\r\n  z-index: 999;\r\n}\r\n.num {\r\n  white-space: nowrap;\r\n  margin: 0 10px;\r\n  width: 20px;\r\n}\r\n</style>\r\n"]}]}