{"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\\AssetOverview.vue?vue&type=script&lang=js","dependencies":[{"path":"D:\\guoan\\ts-bigscreen-vue\\src\\components\\overview\\AssetOverview.vue","mtime":1741155790925},{"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:aW1wb3J0IF90b0NvbnN1bWFibGVBcnJheSBmcm9tICJEOi9ndW9hbi90cy1iaWdzY3JlZW4tdnVlL25vZGVfbW9kdWxlcy9AYmFiZWwvcnVudGltZS9oZWxwZXJzL2VzbS90b0NvbnN1bWFibGVBcnJheS5qcyI7CmltcG9ydCAiY29yZS1qcy9tb2R1bGVzL2VzLmFycmF5LmNvbmNhdC5qcyI7CmltcG9ydCAiY29yZS1qcy9tb2R1bGVzL2VzLmFycmF5LnB1c2guanMiOwppbXBvcnQgImNvcmUtanMvbW9kdWxlcy9lcy5vYmplY3QudG8tc3RyaW5nLmpzIjsKaW1wb3J0ICJjb3JlLWpzL21vZHVsZXMvZXMucmVnZXhwLmV4ZWMuanMiOwppbXBvcnQgImNvcmUtanMvbW9kdWxlcy9lcy5yZWdleHAudG8tc3RyaW5nLmpzIjsKaW1wb3J0ICJjb3JlLWpzL21vZHVsZXMvZXMuc3RyaW5nLnJlcGxhY2UuanMiOwpleHBvcnQgZGVmYXVsdCB7CiAgbmFtZTogIkFzc2V0T3ZlcnZpZXciLAogIGRhdGE6IGZ1bmN0aW9uIGRhdGEoKSB7CiAgICByZXR1cm4gewogICAgICB0b3RhbEFzc2V0czogNTgwMDAwLAogICAgICBhc3NldFRyZW5kRGF0YTogewogICAgICAgIGNvbHVtbnM6IFsi5pyI5Lu9IiwgIui1hOS6p+aAu+WAvCJdLAogICAgICAgIHJvd3M6IFt7CiAgICAgICAgICDmnIjku706ICIx5pyIIiwKICAgICAgICAgIOi1hOS6p+aAu+WAvDogMzgwMDAwCiAgICAgICAgfSwgewogICAgICAgICAg5pyI5Lu9OiAiMuaciCIsCiAgICAgICAgICDotYTkuqfmgLvlgLw6IDUzNTAwMAogICAgICAgIH0sIHsKICAgICAgICAgIOaciOS7vTogIjPmnIgiLAogICAgICAgICAg6LWE5Lqn5oC75YC8OiA0NDUwMDAKICAgICAgICB9LCB7CiAgICAgICAgICDmnIjku706ICI05pyIIiwKICAgICAgICAgIOi1hOS6p+aAu+WAvDogNTIwMDAwCiAgICAgICAgfSwgewogICAgICAgICAg5pyI5Lu9OiAiNeaciCIsCiAgICAgICAgICDotYTkuqfmgLvlgLw6IDU3MDAwMAogICAgICAgIH0sIHsKICAgICAgICAgIOaciOS7vTogIjbmnIgiLAogICAgICAgICAg6LWE5Lqn5oC75YC8OiA0ODAwMDAKICAgICAgICB9XQogICAgICB9LAogICAgICBhc3NldENhdGVnb3JpZXM6IFt7CiAgICAgICAgbmFtZTogIuWbuuWumui1hOS6pyIsCiAgICAgICAgdmFsdWU6IDQyMDAwMAogICAgICB9LCB7CiAgICAgICAgbmFtZTogIua1geWKqOi1hOS6pyIsCiAgICAgICAgdmFsdWU6IDEyMDAwMAogICAgICB9LCB7CiAgICAgICAgbmFtZTogIuaXoOW9oui1hOS6pyIsCiAgICAgICAgdmFsdWU6IDQwMDAwCiAgICAgIH1dCiAgICB9OwogIH0sCiAgY29tcHV0ZWQ6IHsKICAgIGRpc3BsYXlEYXRhOiBmdW5jdGlvbiBkaXNwbGF5RGF0YSgpIHsKICAgICAgLy8g5aSN5Yi25Y6f5aeL5pWw5o2u5bm25Zyo5pyr5bC+5re75Yqg5YmN6Z2i55qE5pWw5o2u5Lul5a6e546w5peg57yd5rua5YqoCiAgICAgIHJldHVybiBbXS5jb25jYXQoX3RvQ29uc3VtYWJsZUFycmF5KHRoaXMuYXNzZXRUcmVuZERhdGEucm93cyksIF90b0NvbnN1bWFibGVBcnJheSh0aGlzLmFzc2V0VHJlbmREYXRhLnJvd3MpKTsKICAgIH0KICB9LAogIG1ldGhvZHM6IHsKICAgIGZvcm1hdE51bWJlcjogZnVuY3Rpb24gZm9ybWF0TnVtYmVyKG51bSkgewogICAgICByZXR1cm4gbnVtLnRvU3RyaW5nKCkucmVwbGFjZSgvXEIoPz0oXGR7M30pKyg/IVxkKSkvZywgIiwiKTsKICAgIH0sCiAgICBnb1RvRGV0YWlsOiBmdW5jdGlvbiBnb1RvRGV0YWlsKCkgewogICAgICB0aGlzLiRyb3V0ZXIucHVzaCgiL2Fzc2V0LWRldGFpbCIpOwogICAgfSwKICAgIHRhYmxlUm93Q2xhc3NOYW1lOiBmdW5jdGlvbiB0YWJsZVJvd0NsYXNzTmFtZShfcmVmKSB7CiAgICAgIHZhciByb3dJbmRleCA9IF9yZWYucm93SW5kZXg7CiAgICAgIC8vIOagueaNruihjOe0ouW8leiuvue9ruS4jeWQjOeahOWKqOeUu+W7tui/nwogICAgICByZXR1cm4gInJvdy0iLmNvbmNhdChyb3dJbmRleCk7CiAgICB9CiAgfQp9Ow=="},{"version":3,"names":["name","data","totalAssets","assetTrendData","columns","rows","月份","资产总值","assetCategories","value","computed","displayData","concat","_toConsumableArray","methods","formatNumber","num","toString","replace","goToDetail","$router","push","tableRowClassName","_ref","rowIndex"],"sources":["src/components/overview/AssetOverview.vue"],"sourcesContent":["<template>\r\n  <div class=\"asset-overview\">\r\n    <div class=\"header\">\r\n      <h3>资产概况</h3>\r\n      <el-button type=\"text\" @click=\"goToDetail\">查看更多</el-button>\r\n    </div>\r\n\r\n    <div class=\"content\">\r\n      <!-- 总资产和资产类别信息 -->\r\n      <div class=\"asset-summary\">\r\n        <div class=\"total-assets\">\r\n          <div class=\"value\">¥ {{ formatNumber(totalAssets) }}</div>\r\n          <div class=\"label\">总资产（万元）</div>\r\n        </div>\r\n\r\n        <div class=\"asset-categories\">\r\n          <div\r\n            class=\"category-item\"\r\n            v-for=\"(item, index) in assetCategories\"\r\n            :key=\"index\"\r\n          >\r\n            <span class=\"label\">{{ item.name }}</span>\r\n            <span class=\"value\">{{ formatNumber(item.value) }}万</span>\r\n          </div>\r\n        </div>\r\n      </div>\r\n\r\n      <!-- 修改表格部分 -->\r\n      <div class=\"table-container\">\r\n        <el-table\r\n          :data=\"displayData\"\r\n          style=\"width: 100%\"\r\n          class=\"animated-table custom-table\"\r\n          :row-class-name=\"tableRowClassName\"\r\n          :header-cell-style=\"{\r\n            background: 'transparent',\r\n            color: '#fff',\r\n            height: '35px',\r\n          }\"\r\n          :row-style=\"{ height: '30px' }\"\r\n          :cell-style=\"{ padding: '0' }\"\r\n        >\r\n          <el-table-column\r\n            prop=\"月份\"\r\n            label=\"月份\"\r\n            width=\"180\"\r\n            align=\"center\"\r\n          />\r\n          <el-table-column\r\n            prop=\"资产总值\"\r\n            label=\"资产总值（万元）\"\r\n            align=\"center\"\r\n          />\r\n        </el-table>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"footer\"></div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n  name: \"AssetOverview\",\r\n  data() {\r\n    return {\r\n      totalAssets: 580000,\r\n      assetTrendData: {\r\n        columns: [\"月份\", \"资产总值\"],\r\n        rows: [\r\n          { 月份: \"1月\", 资产总值: 380000 },\r\n          { 月份: \"2月\", 资产总值: 535000 },\r\n          { 月份: \"3月\", 资产总值: 445000 },\r\n          { 月份: \"4月\", 资产总值: 520000 },\r\n          { 月份: \"5月\", 资产总值: 570000 },\r\n          { 月份: \"6月\", 资产总值: 480000 },\r\n        ],\r\n      },\r\n      assetCategories: [\r\n        { name: \"固定资产\", value: 420000 },\r\n        { name: \"流动资产\", value: 120000 },\r\n        { name: \"无形资产\", value: 40000 },\r\n      ],\r\n    };\r\n  },\r\n  computed: {\r\n    displayData() {\r\n      // 复制原始数据并在末尾添加前面的数据以实现无缝滚动\r\n      return [...this.assetTrendData.rows, ...this.assetTrendData.rows];\r\n    },\r\n  },\r\n  methods: {\r\n    formatNumber(num) {\r\n      return num.toString().replace(/\\B(?=(\\d{3})+(?!\\d))/g, \",\");\r\n    },\r\n    goToDetail() {\r\n      this.$router.push(\"/asset-detail\");\r\n    },\r\n    tableRowClassName({ rowIndex }) {\r\n      // 根据行索引设置不同的动画延迟\r\n      return `row-${rowIndex}`;\r\n    },\r\n  },\r\n};\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.asset-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    .asset-summary {\r\n      display: flex;\r\n      justify-content: space-between;\r\n      align-items: center;\r\n      margin-bottom: 20px;\r\n\r\n      .total-assets {\r\n        text-align: center;\r\n        .value {\r\n          font-size: 24px;\r\n          font-weight: bold;\r\n          background: linear-gradient(135deg, #6a82fb, #fc5c7d);\r\n          -webkit-background-clip: text;\r\n          -webkit-text-fill-color: transparent;\r\n        }\r\n\r\n        .label {\r\n          font-size: 14px;\r\n          color: #fff;\r\n          margin-top: 5px;\r\n        }\r\n      }\r\n\r\n      .asset-categories {\r\n        display: flex;\r\n        gap: 20px;\r\n\r\n        .category-item {\r\n          text-align: center;\r\n\r\n          .label {\r\n            display: block;\r\n            font-size: 12px;\r\n            color: #fff;\r\n          }\r\n\r\n          .value {\r\n            display: block;\r\n            font-size: 16px;\r\n            background: linear-gradient(135deg, #6a82fb, #fc5c7d);\r\n            -webkit-background-clip: text;\r\n            -webkit-text-fill-color: transparent;\r\n            margin-top: 5px;\r\n          }\r\n        }\r\n      }\r\n    }\r\n\r\n    .table-container {\r\n      height: 120px;\r\n      position: relative;\r\n      overflow: hidden; /* 隐藏滚动条 */\r\n      border: 1px solid #6a82fb;\r\n      border-radius: 8px;\r\n\r\n      .custom-table {\r\n        ::v-deep {\r\n          // 移除重复的边框\r\n          .el-table__cell {\r\n            border-right: none !important;\r\n          }\r\n\r\n          .el-table__header-wrapper {\r\n            th {\r\n              background: transparent;\r\n              color: #fff;\r\n              border-bottom: 1px solid #6a82fb;\r\n              .cell {\r\n                font-weight: bold;\r\n              }\r\n            }\r\n          }\r\n\r\n          .el-table__body-wrapper {\r\n            background: transparent;\r\n            overflow: hidden;\r\n\r\n            td {\r\n              background: transparent;\r\n              border-bottom: 1px solid rgba(106, 130, 251, 0.1);\r\n            }\r\n\r\n            .el-table__body {\r\n              animation: scroll 15s linear infinite;\r\n              &:hover {\r\n                animation-play-state: paused;\r\n              }\r\n            }\r\n          }\r\n\r\n          // 修改滚动动画\r\n          @keyframes scroll {\r\n            0% {\r\n              transform: translateY(0);\r\n            }\r\n            100% {\r\n              transform: translateY(-50%); // 修改为-50%，因为数据是双倍的\r\n            }\r\n          }\r\n\r\n          // 去除表格右侧边框\r\n          .el-table__inner-wrapper::after {\r\n            display: none;\r\n          }\r\n\r\n          // 去除表格内部边框\r\n          .el-table--border::after {\r\n            display: none;\r\n          }\r\n        }\r\n      }\r\n    }\r\n  }\r\n\r\n  .el-table {\r\n    background-color: transparent;\r\n  }\r\n  // 表格内背景颜色\r\n  ::v-deep .el-table th,\r\n  ::v-deep .el-table tr,\r\n  ::v-deep .el-table td {\r\n    background-color: transparent;\r\n    border: 1px solid #6a82fb;\r\n    color: #fff;\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":";;;;;;;AA8DA;EACAA,IAAA;EACAC,IAAA,WAAAA,KAAA;IACA;MACAC,WAAA;MACAC,cAAA;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,eAAA,GACA;QAAAR,IAAA;QAAAS,KAAA;MAAA,GACA;QAAAT,IAAA;QAAAS,KAAA;MAAA,GACA;QAAAT,IAAA;QAAAS,KAAA;MAAA;IAEA;EACA;EACAC,QAAA;IACAC,WAAA,WAAAA,YAAA;MACA;MACA,UAAAC,MAAA,CAAAC,kBAAA,MAAAV,cAAA,CAAAE,IAAA,GAAAQ,kBAAA,MAAAV,cAAA,CAAAE,IAAA;IACA;EACA;EACAS,OAAA;IACAC,YAAA,WAAAA,aAAAC,GAAA;MACA,OAAAA,GAAA,CAAAC,QAAA,GAAAC,OAAA;IACA;IACAC,UAAA,WAAAA,WAAA;MACA,KAAAC,OAAA,CAAAC,IAAA;IACA;IACAC,iBAAA,WAAAA,kBAAAC,IAAA;MAAA,IAAAC,QAAA,GAAAD,IAAA,CAAAC,QAAA;MACA;MACA,cAAAZ,MAAA,CAAAY,QAAA;IACA;EACA;AACA","ignoreList":[]}]}