| 1 |
- {"remainingRequest":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\src\\pages\\statistic\\integral\\index.vue?vue&type=style&index=0&id=79aca6d2&scoped=true&lang=css","dependencies":[{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\src\\pages\\statistic\\integral\\index.vue","mtime":1761185180196},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\css-loader\\index.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\postcss-loader\\src\\index.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"C:\\Users\\Administrator\\Desktop\\crmeb5.0\\template\\admin\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:DQouY2wgew0KICBtYXJnaW4tcmlnaHQ6IDIwcHg7DQp9DQouY29kZS1yb3ctYmcgew0KICBkaXNwbGF5OiBmbGV4Ow0KICBmbGV4LXdyYXA6IG5vd3JhcDsNCn0NCi5jb2RlLXJvdy1iZyAuaXZ1LW10IHsNCiAgd2lkdGg6IDEwMCU7DQogIG1hcmdpbjogMCA1cHg7DQp9DQo="},{"version":3,"sources":["index.vue"],"names":[],"mappings":";AA0PA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"index.vue","sourceRoot":"src/pages/statistic/integral","sourcesContent":["<template>\r\n <div v-loading=\"spinShow\">\r\n <el-card :bordered=\"false\" shadow=\"never\" class=\"ivu-mt\">\r\n <el-form ref=\"formValidate\" :model=\"formValidate\" class=\"tabform\" @submit.native.prevent>\r\n <el-row :gutter=\"24\">\r\n <el-col :span=\"24\">\r\n <el-form-item label=\"订单时间：\">\r\n <el-radio-group\r\n v-model=\"formValidate.data\"\r\n type=\"button\"\r\n @change=\"selectChange(formValidate.data)\"\r\n class=\"mr\"\r\n >\r\n <el-radio-button :label=\"item.val\" v-for=\"(item, i) in fromList.fromTxt\" :key=\"i\">{{\r\n item.text\r\n }}</el-radio-button>\r\n </el-radio-group>\r\n <el-date-picker\r\n :editable=\"false\"\r\n clearable\r\n @change=\"onchangeTime\"\r\n v-model=\"timeVal\"\r\n format=\"yyyy/MM/dd\"\r\n type=\"daterange\"\r\n value-format=\"yyyy/MM/dd\"\r\n range-separator=\"-\"\r\n start-placeholder=\"开始日期\"\r\n end-placeholder=\"结束日期\"\r\n ></el-date-picker>\r\n </el-form-item> </el-col\r\n ></el-row>\r\n </el-form>\r\n </el-card>\r\n <cards-data :cardLists=\"cardLists\" v-if=\"cardLists.length >= 0\"></cards-data>\r\n <echarts-new :option-data=\"optionData\" :styles=\"style\" height=\"100%\" width=\"100%\" v-if=\"optionData\"></echarts-new>\r\n <div class=\"code-row-bg\">\r\n <el-card :bordered=\"false\" shadow=\"never\" class=\"ivu-mt\">\r\n <div class=\"acea-row row-between-wrapper\">\r\n <div class=\"statics-header-title\">积分来源</div>\r\n <div>切换样式</div>\r\n </div>\r\n <echarts-new\r\n :option-data=\"optionData\"\r\n :styles=\"style\"\r\n height=\"100%\"\r\n width=\"100%\"\r\n v-if=\"optionData\"\r\n ></echarts-new>\r\n </el-card>\r\n <el-card :bordered=\"false\" shadow=\"never\" class=\"ivu-mt\">\r\n <div class=\"acea-row row-between-wrapper\">\r\n <div class=\"statics-header-title\">积分消耗</div>\r\n <div>切换样式</div>\r\n </div>\r\n <echarts-new\r\n :option-data=\"optionData\"\r\n :styles=\"style\"\r\n height=\"100%\"\r\n width=\"100%\"\r\n v-if=\"optionData\"\r\n ></echarts-new>\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\n\r\nexport default {\r\n name: 'index',\r\n components: { cardsData, echartsNew },\r\n data() {\r\n return {\r\n timeVal: [],\r\n style: { height: '400px' },\r\n\r\n fromList: {\r\n title: '选择时间',\r\n custom: true,\r\n fromTxt: [\r\n { text: '全部', val: '' },\r\n { text: '今天', val: 'today' },\r\n { text: '本周', val: 'week' },\r\n { text: '本月', val: 'month' },\r\n { text: '本季度', val: 'quarter' },\r\n { text: '本年', val: 'year' },\r\n ],\r\n },\r\n formValidate: {\r\n status: '',\r\n date: '',\r\n },\r\n cardLists: [\r\n {\r\n col: 6,\r\n count: 0,\r\n name: '参与人数(人)',\r\n className: 'ios-speedometer-outline',\r\n },\r\n {\r\n col: 6,\r\n count: 0,\r\n name: '成团数量(个)',\r\n className: 'md-rose',\r\n },\r\n {\r\n col: 6,\r\n count: 0,\r\n name: '参与人数(人)',\r\n className: 'ios-speedometer-outline',\r\n },\r\n {\r\n col: 6,\r\n count: 0,\r\n name: '成团数量(个)',\r\n className: 'md-rose',\r\n },\r\n {\r\n col: 6,\r\n count: 0,\r\n name: '参与人数(人)',\r\n className: 'ios-speedometer-outline',\r\n },\r\n {\r\n col: 6,\r\n count: 0,\r\n name: '成团数量(个)',\r\n className: 'md-rose',\r\n },\r\n ],\r\n optionData: {},\r\n spinShow: false,\r\n };\r\n },\r\n created() {\r\n // this.getTrend();\r\n },\r\n methods: {\r\n // 具体日期\r\n onchangeTime(e) {\r\n this.timeVal = e;\r\n this.dataTime = this.timeVal ? this.timeVal.join('-') : '';\r\n this.name = this.dataTime;\r\n },\r\n // 统计图\r\n getTrend() {\r\n this.spinShow = true;\r\n statisticUserTrendApi(this.formInline)\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.value,\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}\r\n.code-row-bg .ivu-mt {\r\n width: 100%;\r\n margin: 0 5px;\r\n}\r\n</style>\r\n"]}]}
|
