-      console.log("to", to);

-<template>

-  <div class="content admin-style overflow-y">

-    <div class="admin-page-title point-font2 mb30">

-      <p>메뉴별 접속 통계</p>

-    </div>

-    <div class="flex justify-between aling-center no-gutters mb30">

-      <div class="gd-6 flex justify-start align-center">

-        <div class="gd-4 pl0">

-          <input

-            type="date"

-            class="full-input"

-            v-model="searchDate.startDt"

-            @change="validateDate($event, 'startDt')"

-          />

-        </div>

-        <div>-</div>

-        <div class="gd-4">

-          <input

-            type="date"

-            class="full-input"

-            v-model="searchDate.endDt"

-            @change="validateDate($event, 'endDt')"

-          />

-        </div>

-        <div class="gd-2">

-          <button class="large-btn blue-border-btn" @click="axiosSelectList">

-            조회

-          </button>

-        </div>

-      </div>

-      <div class="gd-1">

-        <button

-          class="large-btn green-border-btn"

-          v-if="pageAuth.fileDwnldAuthrt == 'Y'"

-          @click="fnDownload"

-        >

-          다운로드

-        </button>

-      </div>

-    </div>

-    <div class="chart-zone mb30" v-show="menuCnt > 0">

-      <div class="chart-info">

-        <p class="detail-text">

-          방문자 총

-          <span class="detail-bold blue">{{ totalCnt }}</span>

-          명

-        </p>

-      </div>

-      <div class="chart-wrap" ref="chartdiv" :style="heightStyle">

-        <ClusteredBarChart :chartData="chartData" columnX="menu" />

-      </div>

-    </div>

-    <div class="table-zone">

-      <table class="list-table admin-list complex-table">

-        <colgroup>

-          <col width="25%" />

-          <col width="25%" />

-          <col width="25%" />

-          <col width="25%" />

-        </colgroup>

-        <thead>

-          <tr>

-            <th rowspan="2">구분</th>

-            <th colspan="3">사용자 구분</th>

-          </tr>

-          <tr>

-            <th class="text-ct">관리자</th>

-            <th class="text-ct">사용자</th>

-            <th class="text-ct">비로그인 사용자</th>

-          </tr>

-        </thead>

-        <tbody>

-          <template v-if="menuCnt > 0">

-            <tr v-for="(tr, index) of chartData" :key="index">

-              <td class="text-ct">{{ tr.menu }}</td>

-              <td class="text-rg">{{ tr["관리자"] }}</td>

-              <td class="text-rg">{{ tr["사용자"] }}</td>

-              <td class="text-rg">{{ tr["비로그인 사용자"] }}</td>

-            </tr>

-          </template>

-          <template v-else>

-            <tr>

-              <td colspan="4" class="text-ct">

-                등록된 정보가 존재하지 않습니다.

-              </td>

-            </tr>

-          </template>

-        </tbody>

-      </table>

-    </div>

-  </div>

-</template>

-<script>

-import defaultAxios from "../../../../resources/js/defaultAxios";

-import html2canvas from "html2canvas";

-import ClusteredBarChart from "../../../component/chart/ClusteredBarChart.vue";

-import statisticsDate from "../../../../resources/js/defaultDateParams";

-

-// API

-import { selectMenuCntnStatsProc } from "../../../../resources/api/cntnStats";

-

-export default {

-  mixins: [statisticsDate],

-  components: {

-    ClusteredBarChart: ClusteredBarChart,

-  },

-  data() {

-    return {

-      // 페이지 권한 객체

-      pageAuth: JSON.parse(localStorage.getItem("vuex")).pageAuth,

-      // 차트 데이터

-      chartData: [],

-      // 전체 수

-      totalCnt: 0,

-      // 메뉴 수

-      menuCnt: 0,

-      // 차트 높이 스타일

-      heightStyle: {},

-    };

-  },

-  created() {

-    this.axiosSelectList();

-  },

-  methods: {

-    // 메뉴별 접속 통계

-    async axiosSelectList() {

-      // 유효성 검사

-      if (this.searchDate.startDt == null || this.searchDate.startDt == "") {

-        alert("시작일을 선택하세요.");

-        this.searchDate.startDt = null;

-        return;

-      }

-      if (this.searchDate.endDt == null || this.searchDate.endDt == "") {

-        alert("종료일을 선택하세요.");

-        this.searchDate.endDt = null;

-        return;

-      }

-      // 데이터 세팅

-      let data = this.searchDate;

-      data["menuMainDepth"] = "MENU_000000000000002";

-      data["startDt"] = this.dateFormat(new Date(data["startDt"]));

-      data["endDt"] = this.dateFormat(new Date(data["endDt"]));

-      // 실행

-      try {

-        const response = await selectMenuCntnStatsProc(data);

-        let datas = [];

-        for (let data of response.data.data.list) {

-          let newData = {};

-          newData["menu"] = data["menu_name"];

-          for (let i = 0; i < data["authrt_nm"].length; i++) {

-            newData[data["authrt_nm"][i]] = data["cntn_nope"][i];

-          }

-          datas.push(newData);

-        }

-        this.chartData = datas;

-        this.totalCnt = response.data.data.totalCnt;

-        this.heightStyle = {

-          height: 100 + 100 * datas.length + "px",

-        };

-        this.menuCnt = response.data.data.menuCnt;

-      } catch (error) {

-        alert("에러가 발생했습니다.\n관리자에게 문의해주세요.");

-      }

-    },

-

-    // 다운로드

-    fnDownload() {

-      const vm = this;

-      const chartdiv = vm.$refs.chartdiv;

-      html2canvas(chartdiv).then(function (canvas) {

-        // 데이터 세팅

-        let cntnStats = [];

-        for (let item of vm.chartData) {

-          cntnStats.push({

-            date: item.menu,

-            admin: item["관리자"],

-            user: item["사용자"],

-            none: item["비로그인 사용자"],

-          });

-        }

-        // 폼데이터

-        var formData = new FormData();

-        const cntnStatsToBlob = new Blob([JSON.stringify(cntnStats)], {

-          type: "application/json; charset=UTF-8",

-        });

-        formData.append("cntnStats", cntnStatsToBlob);

-        let imageData = canvas.toDataURL("image/png");

-        imageData.replace("data:image/png; base64, ", "");

-        const chartToBlob = new Blob([imageData], {

-          type: "application/json; charset=UTF-8",

-        });

-        formData.append("chart", chartToBlob);

-        // 실행

-        defaultAxios({

-          url: "/sys/cntnStats/excelDownload.file",

-          method: "post",

-          headers: {

-            "Content-Type": "multipart/form-data; charset=UTF-8",

-            Authorization: vm.$store.state.authorization,

-          },

-          data: formData,

-          responseType: "blob",

-        })

-          .then((response) => {

-            const url = window.URL.createObjectURL(

-              new Blob([response.data], {

-                type: response.headers["content-type"],

-              })

-            );

-

-            let today = new Date().toISOString().substring(2, 10);

-            today = today.replace(/[^0-9]/g, "");

-

-            const link = document.createElement("a");

-            link.href = url;

-            link.setAttribute(

-              "download",

-              `[${today}]메뉴별접속통계(기업용)_${vm.searchDate.startDt}_${vm.searchDate.endDt}.xlsx`

-            );

-            document.body.appendChild(link);

-            link.click();

-            document.body.removeChild(link);

-            window.URL.revokeObjectURL(url);

-          })

-          .catch((error) => {

-            alert("에러가 발생했습니다.\n관리자에게 문의해주세요.");

-          });

-      });

-    },

-  },

-};

-</script>

-

-<style scoped>

-.chart-wrap {

-  height: 1000px;

-}

-</style>(파일 끝에 줄바꿈 문자 없음)

-      data["menuMainDepth"] = "MENU_000000000000003";