{"remainingRequest":"D:\\guoan\\ts-bigscreen-vue\\node_modules\\@vue\\cli-plugin-babel\\node_modules\\babel-loader\\lib\\index.js!D:\\guoan\\ts-bigscreen-vue\\node_modules\\@vue\\vue-loader-v15\\lib\\index.js??vue-loader-options!D:\\guoan\\ts-bigscreen-vue\\src\\components\\overview\\CardOverview.vue?vue&type=script&lang=js","dependencies":[{"path":"D:\\guoan\\ts-bigscreen-vue\\src\\components\\overview\\CardOverview.vue","mtime":1741080776969},{"path":"D:\\guoan\\ts-bigscreen-vue\\babel.config.js","mtime":1740967860001},{"path":"D:\\guoan\\ts-bigscreen-vue\\node_modules\\@vue\\cli-plugin-babel\\node_modules\\cache-loader\\dist\\cjs.js","mtime":1740984332670},{"path":"D:\\guoan\\ts-bigscreen-vue\\node_modules\\@vue\\cli-plugin-babel\\node_modules\\babel-loader\\lib\\index.js","mtime":1740984332280},{"path":"D:\\guoan\\ts-bigscreen-vue\\node_modules\\@vue\\vue-loader-v15\\lib\\index.js","mtime":1740984469533}],"contextDependencies":[],"result":[{"type":"Buffer","data":"base64:aW1wb3J0ICJjb3JlLWpzL21vZHVsZXMvZXMuYXJyYXkucHVzaC5qcyI7CmV4cG9ydCBkZWZhdWx0IHsKICBuYW1lOiAiQ2FyZE92ZXJ2aWV3IiwKICBkYXRhOiBmdW5jdGlvbiBkYXRhKCkgewogICAgcmV0dXJuIHsKICAgICAgc2VsZWN0ZWRZZWFyOiAiMjAyNCIsCiAgICAgIHllYXJzOiBbIjIwMjQiLCAiMjAyMyIsICIyMDIyIiwgIjIwMjEiXSwKICAgICAgdG90YWxDYXJkczogMjg1MDAsCiAgICAgIGRhaWx5VXNhZ2U6IDg1NjAwLAogICAgICBjaGFydFNldHRpbmdzOiB7CiAgICAgICAgYXJlYTogdHJ1ZSwKICAgICAgICBheGlzU2l0ZTogewogICAgICAgICAgcmlnaHQ6IFsi5L2/55So5qyh5pWwIl0KICAgICAgICB9LAogICAgICAgIHlBeGlzTmFtZTogWyLmrKHmlbAiXQogICAgICB9LAogICAgICB1c2FnZURhdGE6IHsKICAgICAgICBjb2x1bW5zOiBbIuaXtumXtCIsICLkvb/nlKjmrKHmlbAiXSwKICAgICAgICByb3dzOiBbewogICAgICAgICAg5pe26Ze0OiAiNjowMCIsCiAgICAgICAgICDkvb/nlKjmrKHmlbA6IDIwMDAKICAgICAgICB9LCB7CiAgICAgICAgICDml7bpl7Q6ICI5OjAwIiwKICAgICAgICAgIOS9v+eUqOasoeaVsDogMTUwMDAKICAgICAgICB9LCB7CiAgICAgICAgICDml7bpl7Q6ICIxMjowMCIsCiAgICAgICAgICDkvb/nlKjmrKHmlbA6IDI1MDAwCiAgICAgICAgfSwgewogICAgICAgICAg5pe26Ze0OiAiMTU6MDAiLAogICAgICAgICAg5L2/55So5qyh5pWwOiAxODAwMAogICAgICAgIH0sIHsKICAgICAgICAgIOaXtumXtDogIjE4OjAwIiwKICAgICAgICAgIOS9v+eUqOasoeaVsDogMjAwMDAKICAgICAgICB9LCB7CiAgICAgICAgICDml7bpl7Q6ICIyMTowMCIsCiAgICAgICAgICDkvb/nlKjmrKHmlbA6IDU2MDAKICAgICAgICB9XQogICAgICB9LAogICAgICB1c2FnZVNjZW5lczogW3sKICAgICAgICBuYW1lOiAi6aOf5aCC5raI6LS5IiwKICAgICAgICBjb3VudDogMzUwMDAKICAgICAgfSwgewogICAgICAgIG5hbWU6ICLpl6jnpoHpgJrooYwiLAogICAgICAgIGNvdW50OiAyODAwMAogICAgICB9LCB7CiAgICAgICAgbmFtZTogIuWbvuS5puWAn+mYhSIsCiAgICAgICAgY291bnQ6IDEyMDAwCiAgICAgIH0sIHsKICAgICAgICBuYW1lOiAi5rC055S157y06LS5IiwKICAgICAgICBjb3VudDogODAwMAogICAgICB9XQogICAgfTsKICB9LAogIG1ldGhvZHM6IHsKICAgIGdvVG9EZXRhaWw6IGZ1bmN0aW9uIGdvVG9EZXRhaWwoKSB7CiAgICAgIHRoaXMuJHJvdXRlci5wdXNoKCIvY2FyZC1kZXRhaWwiKTsKICAgIH0KICB9Cn07"},{"version":3,"names":["name","data","selectedYear","years","totalCards","dailyUsage","chartSettings","area","axisSite","right","yAxisName","usageData","columns","rows","时间","使用次数","usageScenes","count","methods","goToDetail","$router","push"],"sources":["src/components/overview/CardOverview.vue"],"sourcesContent":["<template>\r\n  <div class=\"card-overview\">\r\n    <div class=\"header\">\r\n      <h3>一卡通概况</h3>\r\n      <!-- <el-select v-model=\"selectedYear\" size=\"small\">\r\n        <el-option\r\n          v-for=\"year in years\"\r\n          :key=\"year\"\r\n          :label=\"year\"\r\n          :value=\"year\"\r\n        />\r\n      </el-select> -->\r\n    </div>\r\n\r\n    <div class=\"content\">\r\n      <div class=\"statistics\">\r\n        <div class=\"stat-item\">\r\n          <div class=\"value\">{{ totalCards }}</div>\r\n          <div class=\"label\">发卡总量</div>\r\n        </div>\r\n        <div class=\"stat-item\">\r\n          <div class=\"value\">{{ dailyUsage }}</div>\r\n          <div class=\"label\">日均使用量</div>\r\n        </div>\r\n      </div>\r\n\r\n      <!-- <ve-line :data=\"usageData\" :settings=\"chartSettings\" height=\"180px\" /> -->\r\n\r\n      <div class=\"usage-scenes\">\r\n        <h4>使用场景分布</h4>\r\n        <div class=\"scene-list\">\r\n          <div\r\n            class=\"scene-item\"\r\n            v-for=\"(item, index) in usageScenes\"\r\n            :key=\"index\"\r\n          >\r\n            <span class=\"name\">{{ item.name }}</span>\r\n            <span class=\"value\">{{ item.count }}次</span>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"footer\">\r\n      <el-button type=\"text\" @click=\"goToDetail\">查看更多</el-button>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n  name: \"CardOverview\",\r\n  data() {\r\n    return {\r\n      selectedYear: \"2024\",\r\n      years: [\"2024\", \"2023\", \"2022\", \"2021\"],\r\n      totalCards: 28500,\r\n      dailyUsage: 85600,\r\n      chartSettings: {\r\n        area: true,\r\n        axisSite: { right: [\"使用次数\"] },\r\n        yAxisName: [\"次数\"],\r\n      },\r\n      usageData: {\r\n        columns: [\"时间\", \"使用次数\"],\r\n        rows: [\r\n          { 时间: \"6:00\", 使用次数: 2000 },\r\n          { 时间: \"9:00\", 使用次数: 15000 },\r\n          { 时间: \"12:00\", 使用次数: 25000 },\r\n          { 时间: \"15:00\", 使用次数: 18000 },\r\n          { 时间: \"18:00\", 使用次数: 20000 },\r\n          { 时间: \"21:00\", 使用次数: 5600 },\r\n        ],\r\n      },\r\n      usageScenes: [\r\n        { name: \"食堂消费\", count: 35000 },\r\n        { name: \"门禁通行\", count: 28000 },\r\n        { name: \"图书借阅\", count: 12000 },\r\n        { name: \"水电缴费\", count: 8000 },\r\n      ],\r\n    };\r\n  },\r\n  methods: {\r\n    goToDetail() {\r\n      this.$router.push(\"/card-detail\");\r\n    },\r\n  },\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.card-overview {\r\n  height: 100%;\r\n  color: #fff;\r\n\r\n  .header {\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: center;\r\n    margin-bottom: 15px;\r\n\r\n    h3 {\r\n      margin: 0;\r\n      font-size: 18px;\r\n    }\r\n  }\r\n\r\n  .content {\r\n    height: calc(100% - 80px);\r\n\r\n    .statistics {\r\n      display: flex;\r\n      justify-content: space-around;\r\n      margin-bottom: 15px;\r\n\r\n      .stat-item {\r\n        text-align: center;\r\n\r\n        .value {\r\n          font-size: 24px;\r\n          color: #409eff;\r\n          font-weight: bold;\r\n        }\r\n\r\n        .label {\r\n          font-size: 14px;\r\n          color: #909399;\r\n          margin-top: 5px;\r\n        }\r\n      }\r\n    }\r\n\r\n    .usage-scenes {\r\n      // margin-top: -30px;\r\n\r\n      h4 {\r\n        font-size: 14px;\r\n        margin-bottom: 10px;\r\n      }\r\n\r\n      .scene-list {\r\n        display: flex;\r\n        flex-wrap: wrap;\r\n\r\n        .scene-item {\r\n          width: 50%;\r\n          margin-bottom: 8px;\r\n          display: flex;\r\n          justify-content: space-between;\r\n          padding-right: 15px;\r\n\r\n          .name {\r\n            color: #909399;\r\n            font-size: 12px;\r\n          }\r\n\r\n          .value {\r\n            color: #409eff;\r\n            font-size: 12px;\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  .footer {\r\n    text-align: right;\r\n    margin-top: 15px;\r\n\r\n    .el-button {\r\n      color: #6a82fb;\r\n      font-size: 12px;\r\n      font-weight: bold;\r\n    }\r\n  }\r\n}\r\n</style>"],"mappings":";AAkDA;EACAA,IAAA;EACAC,IAAA,WAAAA,KAAA;IACA;MACAC,YAAA;MACAC,KAAA;MACAC,UAAA;MACAC,UAAA;MACAC,aAAA;QACAC,IAAA;QACAC,QAAA;UAAAC,KAAA;QAAA;QACAC,SAAA;MACA;MACAC,SAAA;QACAC,OAAA;QACAC,IAAA,GACA;UAAAC,EAAA;UAAAC,IAAA;QAAA,GACA;UAAAD,EAAA;UAAAC,IAAA;QAAA,GACA;UAAAD,EAAA;UAAAC,IAAA;QAAA,GACA;UAAAD,EAAA;UAAAC,IAAA;QAAA,GACA;UAAAD,EAAA;UAAAC,IAAA;QAAA,GACA;UAAAD,EAAA;UAAAC,IAAA;QAAA;MAEA;MACAC,WAAA,GACA;QAAAhB,IAAA;QAAAiB,KAAA;MAAA,GACA;QAAAjB,IAAA;QAAAiB,KAAA;MAAA,GACA;QAAAjB,IAAA;QAAAiB,KAAA;MAAA,GACA;QAAAjB,IAAA;QAAAiB,KAAA;MAAA;IAEA;EACA;EACAC,OAAA;IACAC,UAAA,WAAAA,WAAA;MACA,KAAAC,OAAA,CAAAC,IAAA;IACA;EACA;AACA","ignoreList":[]}]}