提交

src/api/index.js

@@ -1042,6 +1042,18 @@ export function getRegionChart(data) {
     data,
   });
 }
+/**
+ * 获取大数据平台地域分析 地图级别分类；
+ * @return {AxjxPromise}
+ */
+export function getMaplever(data) {
+  return ajax({
+    urlType: "url2",
+    url: "/new-media/user/area-range",
+    method: "POST",
+    data,
+  });
+}
 /**
  * 获取大数据平台渠道分析 图表；
  * @return {AxjxPromise}

src/api/newMdeiaApi.js

@@ -115,7 +115,7 @@ export function getCloudLiveList(data) {
 export function getIncomeist(data) {
   return ajax({
     urlType: 'url2',
-    url: '/new-media/cloud-live/pay?liveId=' + data,
-    method: 'POST',
+    url: '/new-media/cloud-live/pay?liveId=' + data.liveId + '&page=' + data.page + '&pageSize=' + data.size,
+    method: 'GET',
   });
 }

src/views/Ranking/live.vue

@@ -137,31 +137,40 @@
       :total="search.total"
     />
 
-    <el-dialog v-model="dialogList.length" :title="clickRowData.title" width="50%">
-        <el-table
-      :header-cell-style="{ backgroundColor: '#f4f5f7', color: '#606266' }"
-      border
-      :data="dialogList"
-      stripe
-      style="width: 100%"
+    <el-dialog
+      v-model="dialogList.length"
+      :title="clickRowData.title"
+      width="50%"
     >
-      <el-table-column
-        align="center"
-        header-align="center"
-        type="userName"
-        label="付款人"
+      <el-table
+        :header-cell-style="{ backgroundColor: '#f4f5f7', color: '#606266' }"
+        border
+        :data="dialogList"
+        stripe
+        style="width: 100%"
       >
-        <template #default="scope">
-          {{ scope.row.userName }}
-        </template>
-      </el-table-column>
-      <el-table-column
-        align="center"
-        header-align="center"
-        prop="money"
-        label="付款金额"
+        <el-table-column
+          align="center"
+          header-align="center"
+          type="userName"
+          label="付款人"
+        >
+          <template #default="scope">
+            {{ scope.row.userName }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          align="center"
+          header-align="center"
+          prop="money"
+          label="付款金额"
+        />
+      </el-table>
+      <el-pagination
+        @current-change="soncurrentChange"
+        layout="prev, pager, next"
+        :total="clickRowData.total || 0"
       />
-    </el-table>
     </el-dialog>
   </div>
 </template>
@@ -190,6 +199,7 @@ export default {
         page: 1,
         size: 10,
         total: 0,
+        sonpage: 1,
       },
       datas: {
         department: [],
@@ -249,14 +259,25 @@ export default {
       this.getlist();
     },
     getIncome(row) {
-      getIncomeist(row.id).then(r => {
-        if (!r || !r.length) {
+      this.search.sonpage = 1;
+      this.getson(row);
+    },
+    soncurrentChange() {
+      this.getIncome(this.clickRowData);
+    },
+    getson(row) {
+      getIncomeist({
+        liveId: row.id,
+        page: this.search.sonpage++,
+        size: 10,
+      }).then(r => {
+        if (!r || !r.records.length) {
           this.dialogList = [];
           this.clickRowData = {};
           return;
         }
-        this.clickRowData = row;
-        this.dialogList = r;
+        this.clickRowData = { ...row, ...r };
+        this.dialogList = r.records;
       });
     },
   },

src/views/Region/index.vue

@@ -83,6 +83,23 @@
             </el-option>
           </el-select>
         </el-form-item>
+        <el-form-item label="来源">
+          <el-select
+            collapse-tags
+            clearable
+            v-model="form.client"
+            placeholder="请选择来源"
+          >
+            <el-option
+              v-for="item in client"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+              :disabled="item.disabled"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
         <el-form-item style="float: right">
           <el-button type="primary" @click="onSubmit">查询</el-button>
           <el-button type="primary" @click="onExport">导出</el-button>
@@ -129,7 +146,7 @@
             >
               <template #default="scope">
                 {{
-                  lastParams.cityType === "1"
+                  lastParams.cityType === '1'
                     ? scope.row.city
                     : scope.row.province
                 }}
@@ -142,7 +159,7 @@
               align="center"
             >
               <template #default>
-                <span>{{ lastParams.app || "-" }}</span>
+                <span>{{ lastParams.app || '-' }}</span>
               </template>
             </el-table-column>
             <el-table-column
@@ -187,9 +204,9 @@
 </template>
 
 <script>
-import china from "../../assets/map/100000_full.json";
-import shanxi from "../../assets/map/610000_shaanxi.json";
-import countTo from "@/components/counto/vue-countTo.vue";
+import china from '../../assets/map/100000_full.json';
+import shanxi from '../../assets/map/610000_shaanxi.json';
+import countTo from '@/components/counto/vue-countTo.vue';
 import { defaultAppNameFunc } from '@/utils/tool.js';
 // @ is an alias to /src
 import {
@@ -197,54 +214,69 @@ import {
   getAppList,
   getRegionChart,
   getSearchData,
-} from "@/api/index";
+  getMaplever,
+} from '@/api/index';
 
-import * as echarts from "echarts";
+import * as echarts from 'echarts';
 
 // import config from "@/config/index";
 let chart = undefined;
 export default {
-  name: "region",
+  name: 'region',
   data() {
     return {
       lastParams: {},
       table: [],
       form: {
-        app: "",
+        app: '',
         version: [],
         channel: [],
         date: [],
-        region: "",
-        cityType: "1",
+        region: '',
+        cityType: '1',
+        client: '',
       },
       cycle: [],
       item: {},
       version: [],
       channel: [],
+      client: [],
     };
   },
   async mounted() {
     if (echarts) {
-      echarts.registerMap("China", china);
-      echarts.registerMap("ShanXi", shanxi);
+      echarts.registerMap('China', china);
+      echarts.registerMap('ShanXi', shanxi);
     }
     if (chart && chart.dispose) chart.dispose();
-    const { source, appV, appC, appli, appCLi, appVLi } =
+    const { source, appV, appC, appli, appCLi, appVLi, clentli, clentV } =
       await this.getAppListFunc();
     const keys = {
-      value: "mname",
-      label: "mname",
+      value: 'mname',
+      label: 'mname',
     };
+    const clentliList = clentli.find(r => r.mdefault) || false;
+    let client = clentliList ? clentliList.mcode.toString() : -1;
     this.cycle = this.verifyList(appli, source, keys, false);
     this.channel = this.verifyList(appCLi, appC, keys, true);
     this.version = this.verifyList(appVLi, appV, keys, true);
+    this.client = this.verifyList(
+      clentli,
+      clentV,
+      {
+        value: 'mcode',
+        label: 'mname',
+      },
+      true
+    );
     this.form = {
       //   app: (this.cycle[0] || { value: "" }).value,
       app: defaultAppNameFunc(this.cycle),
-      version: [(this.version[0] || { value: "" }).value],
-      channel: [(this.channel[0] || { value: "" }).value],
+      version: [(this.version[0] || { value: '' }).value],
+      channel: [(this.channel[0] || { value: '' }).value],
       date: [new Date(Date.now() - 604800000), new Date(Date.now() - 86400000)],
-      cityType: "1",
+      cityType: '1',
+      client,
     };
     this.onSubmit();
   },
@@ -254,7 +286,7 @@ export default {
       if (!obj) return;
       let li = list || [];
       const out = [];
-      more && out.push({ value: -1, label: "不限" });
+      more && out.push({ value: -1, label: '不限' });
       for (let i = 0; i < li.length; i++) {
         const v = li[i];
         if (verify.length !== 0 && !verify[v.mcode]) continue;
@@ -276,34 +308,36 @@ export default {
         manufacturer: this.form.channel == -1 ? undefined : this.form.channel,
         version: this.form.version == -1 ? undefined : this.form.version,
         cityType: this.form.cityType,
+        lib: this.form.client == -1 ? undefined : this.form.client,
       };
-      getRegionChart(this.lastParams)
+      getMaplever(this.lastParams)
         .then(r => {
           if (!this.$refs.regionChart) return;
-          let list = r || [];
+          let list = r.list || [];
           chart && chart.clear();
           this.lastParams.cityType = this.form.cityType;
           this.table = list;
           for (let i = 0; i < list.length; i++) {
             const v = list[i];
-            if (v.city === "西安市" || v.province === "陕西省") {
+            if (v.city === '西安市' || v.province === '陕西省') {
               this.item = {
-                name: v.city === "西安市" ? "西安市" : "陕西省",
+                name: v.city === '西安市' ? '西安市' : '陕西省',
                 value: v.userSum,
-                distribution: (v.distribution * 100).toFixed(2) - 0 + "%",
+                distribution: (v.distribution * 100).toFixed(2) - 0 + '%',
                 userSum: v.userSum,
               };
               break;
             }
           }
-          this.createImage(list);
+          console.log(r);
+          this.createImage(list, r.range || []);
           chart && chart.hideLoading();
         })
         .catch(() => {
           chart && chart.clear() && chart.hideLoading();
         });
     },
-    createImage(list) {
+    createImage(list, range) {
       if (!chart) {
         chart = echarts.init(this.$refs.regionChart);
         window.onresize = chart.resize;
@@ -312,14 +346,14 @@ export default {
       chart.resize({
         height: this.$refs.regionChart.offsetWidth * 1,
       });
-    //   let min = list[list.length - 1].userSum;
+      //   let min = list[list.length - 1].userSum;
       const p = {
         tooltip: {
           confine: true,
-          trigger: "item",
+          trigger: 'item',
           formatter: function (e) {
-            if (e.value) return e.name + "<br />" + (e.value || "");
-            return "";
+            if (e.value) return e.name + '<br />' + (e.value || '');
+            return '';
           },
         },
         visualMap: {
@@ -330,27 +364,21 @@ export default {
           //   inRange: {
           //     color: ["lightskyblue", "yellow", "orangered"],
           //   },
-          type: "piecewise",
-          pieces: [
-            {min: 0, max: 500, label: "活跃用户数< 5000", color: '#02a7f0'},
-            {max: 1000, min: 500, label: "500<=活跃用户数< 1000", color: '#95f204'},
-            {min: 1000, max: 2500, label: "1000<=活跃用户数< 2500", color: '#ffff00'},
-            {min: 2500, max: 5000, label: "2500<= 活跃用户数< 5000", color: '#f59a23'},
-            {min: 5000, label: "活跃用户数>= 5000", color: '#d9001b'},
-          ],
+          type: 'piecewise',
+          pieces: range,
         },
         series: [
           {
-            type: "map",
-            map: this.lastParams.cityType === "1" ? "ShanXi" : "China",
+            type: 'map',
+            map: this.lastParams.cityType === '1' ? 'ShanXi' : 'China',
             label: {
               show: true,
             },
             data: list.map(v => {
               return {
-                name: this.lastParams.cityType === "1" ? v.city : v.province,
+                name: this.lastParams.cityType === '1' ? v.city : v.province,
                 value: v.userSum,
-                distribution: (v.distribution * 100).toFixed(2) - 0 + "%",
+                distribution: (v.distribution * 100).toFixed(2) - 0 + '%',
                 userSum: v.userSum,
               };
             }),
@@ -359,12 +387,12 @@ export default {
       };
       chart.setOption(p);
       const _this = this;
-      chart.on("click", function (params) {
+      chart.on('click', function (params) {
         _this.item = params.data || {};
       });
     },
     async getAppListFunc() {
-      const { r, li, appVersion, channel } = await this.getAppListOri();
+      const { r, li, appVersion, channel, clientList } = await this.getAppListOri();
       let source = { length: 0 },
         appli = [];
       let appV = { length: 0 },
@@ -373,19 +401,21 @@ export default {
         appCLi = [];
       let clentV = { length: 0 },
         clentli = [];
-      let prvList = r.output.data.prvRolectrl || [];
+      let prvList =
+        r.output && r.output.data ? r.output.data.prvRolectrl || [] : [];
       for (let i = 0; i < prvList.length; i++) {
         const v = prvList[i];
-        if (v.controlid == "RMT_SOURCE")
+        if (v.controlid == 'RMT_SOURCE')
           (source[v.detid] = true), (source.length = source.length + 1);
-        if (v.controlid == "APP_VERSION")
+        if (v.controlid == 'APP_VERSION')
           (appV[v.detid] = true), (appV.length = appV.length + 1);
-        if (v.controlid == "CHANNEL")
+        if (v.controlid == 'CHANNEL')
           (appC[v.detid] = true), (appC.length = appC.length + 1);
       }
-      if (li.status === "0") appli = li.output.data || [];
+      if (li.status === '0') appli = li.output.data || [];
       if (appVersion.length) appVLi = appVersion || [];
       if (channel.length) appCLi = channel || [];
+      if (clientList.length) clentli = clientList || [];
       return {
         source,
         appV,
@@ -399,37 +429,41 @@ export default {
     },
     async getAppListOri() {
       const roleid = JSON.parse(
-        window.parent.localStorage.userinfo || "{}"
+        window.parent.localStorage.userinfo || '{}'
       ).roleid;
       const r = await getRule({
-        db: "authplat",
-        exportMark: "0",
+        db: 'authplat',
+        exportMark: '0',
         menuid: 399,
         roleid,
       });
       //   应用列表
-
       const li = await getAppList({
-        exportMark: "0",
-        gcode: "SOURCE",
+        exportMark: '0',
+        gcode: 'SOURCE',
         pageid: 1,
         pagesize: 1000,
       });
       const cycle = li.output ? li.output.data || [] : [];
+      // 端列表
+      const clientList = await getSearchData({
+        gcode: 'CLIENT_TYPE',
+        source: defaultAppNameFunc(cycle, 'mname'),
+      });
       //   应用版本列表
       const appVersion = await getSearchData({
-        gcode: "APP_VERSION",
+        gcode: 'APP_VERSION',
         source: defaultAppNameFunc(cycle, 'mname'),
       });
       //   应用渠道列表
       const channel = await getSearchData({
-        gcode: "CHANNEL",
+        gcode: 'CHANNEL',
         source: defaultAppNameFunc(cycle, 'mname'),
       });
-      return { r, li, appVersion, channel };
+      return { r, li, appVersion, channel, clientList };
     },
     disabledDate(time) {
-      const first = new Date("2021-06-21 00:00:00");
+      const first = new Date('2021-06-21 00:00:00');
       return (
         time.getTime() > Date.now() - 86400000 ||
         time.getTime() < first.getTime()
@@ -439,9 +473,9 @@ export default {
       const d = new Date(date || Date.now() - 86400000);
       const year = d.getFullYear();
       const month =
-        d.getMonth() <= 8 ? "0" + (d.getMonth() + 1) : d.getMonth() + 1;
-      const day = d.getDate() <= 9 ? "0" + d.getDate() : d.getDate();
-      return [year, month, day].join("-");
+        d.getMonth() <= 8 ? '0' + (d.getMonth() + 1) : d.getMonth() + 1;
+      const day = d.getDate() <= 9 ? '0' + d.getDate() : d.getDate();
+      return [year, month, day].join('-');
     },
     timeFormat(t) {
       const Time = t || 0;
@@ -449,40 +483,40 @@ export default {
       let hour = (Time - mH) / 3600;
       let min = (mH - (mH % 60)) / 60;
       let son = Number(mH % 60).toFixed(0);
-      hour = hour <= 9 ? "0" + hour : hour;
-      min = min <= 9 ? "0" + min : min;
-      son = son <= 9 ? "0" + son : son;
+      hour = hour <= 9 ? '0' + hour : hour;
+      min = min <= 9 ? '0' + min : min;
+      son = son <= 9 ? '0' + son : son;
       let out = [];
       if (hour * 1 > 0) out.push(hour);
       out.push(...[min, son]);
-      return out.join(":");
+      return out.join(':');
     },
     change() {
       const roleid = JSON.parse(
-        window.parent.localStorage.userinfo || "{}"
+        window.parent.localStorage.userinfo || '{}'
       ).roleid;
       const appV = {
         length: 0,
       };
       getRule({
-        db: "authplat",
-        exportMark: "0",
+        db: 'authplat',
+        exportMark: '0',
         menuid: 399,
         roleid,
       }).then(rule => {
         let prvList = rule.output.data.prvRolectrl || [];
         for (let i = 0; i < prvList.length; i++) {
           const v = prvList[i];
-          if (v.controlid == "APP_VERSION")
+          if (v.controlid == 'APP_VERSION')
             (appV[v.detid] = true), (appV.length = appV.length + 1);
         }
         getSearchData({
-          gcode: "APP_VERSION",
+          gcode: 'APP_VERSION',
           source: this.form.app,
         }).then(r => {
           let version = [
             {
-              label: "不限",
+              label: '不限',
               value: -1,
             },
           ];
@@ -531,23 +565,23 @@ export default {
       getRegionChart(this.lastParams).then(r => {
         // 生成数据
         let strcsv =
-          "data:text/csv;charset=utf-8,\uFEFF应用名称,省份,地市,活跃用户数\r\n";
+          'data:text/csv;charset=utf-8,\uFEFF应用名称,省份,地市,活跃用户数\r\n';
         (r || []).map(v => {
           strcsv += [
             this.lastParams.app,
             v.province,
             v.city,
             v.userSum,
-            "\r\n",
-          ].join(",");
+            '\r\n',
+          ].join(',');
         });
         // 导出
-        let link = document.createElement("a");
-        link.id = "download-csv";
-        link.setAttribute("href", encodeURI(strcsv));
+        let link = document.createElement('a');
+        link.id = 'download-csv';
+        link.setAttribute('href', encodeURI(strcsv));
         link.setAttribute(
-          "download",
-          this.lastParams.app + "地域分析" + S + "_" + E + ".csv"
+          'download',
+          this.lastParams.app + '地域分析' + S + '_' + E + '.csv'
         );
         // document.body.appendChild(link);
         link.click();