{"version":3,"file":"tags_chart-Cp9LlFhG.js","sources":["../../../app/javascript/src/pages/tags/constants/highcharts_basic_options.js","../../../app/javascript/src/pages/tags/utils/highcharts_area_helper.js","../../../app/javascript/src/pages/tags/components/PerformanceChart.vue","../../../app/javascript/src/pages/tags/components/PerformanceLabel.vue","../../../app/javascript/src/pages/tags/App.vue","../../../app/javascript/entrypoints/tags/tags_chart.js"],"sourcesContent":["export default {\n  accessibility: {\n    enabled: false,\n  },\n  credits: {\n    enabled: false,\n  },\n  title: false,\n  chart: {\n    ignoreHiddenSeries: false,\n    marginTop: 20,\n    marginRight: 55,\n    marginLeft: 1, // 設定為 0 會造成破版\n    style: {\n      fontFamily: \"'HanHei TC','PingFang TC', 'Helvetica Neue', 'Helvetica', 'STHeitiTC-Light', 'Arial', 'sans-serif'\",\n      color: '#434343',\n    },\n    zooming: {\n      mouseWheel: {\n        enabled: false,\n      },\n    },\n  },\n  plotOptions: {\n    series: {\n      animation: 500,\n    },\n  },\n  tooltip: {\n    dateTimeLabelFormats: {\n      day: '%Y/%m/%d',\n      month: '%Y/%m/%d',\n      week: '%Y/%m/%d',\n    },\n    valueSuffix: '%',\n  },\n  scrollbar: {\n    enabled: false,\n  },\n  navigator: {\n    enabled: false,\n  },\n  rangeSelector: {\n    enabled: false,\n  },\n  xAxis: [{\n    ordinal: false,\n    tickPositioner() {\n      return [this.chart.xAxis[0].dataMin, this.chart.xAxis[0].dataMax]\n    },\n    dateTimeLabelFormats: {\n      day: '%Y/%m/%d',\n      week: '%Y/%m/%d',\n      month: '%Y/%m/%d',\n    },\n    labels: {\n      align: 'center',\n      style: {\n        fontSize: '0.875rem',\n        color: '#434343',\n      },\n    },\n  }],\n  yAxis: [{\n    opposite: true,\n    showLastLabel: true,\n    labels: {\n      format: '{text}%',\n      align: 'left',\n      style: {\n        fontSize: '0.875rem',\n        color: '#434343',\n      },\n    },\n  }],\n}\n","import Highcharts from 'highcharts/highstock'\n\nimport basicOptions from '../constants/highcharts_basic_options'\n\nconst generateChart = ({ mountedElementId, dataSeries }) => {\n  const highchartsInstance = Highcharts.stockChart(mountedElementId, {\n    ...basicOptions,\n    series: [{\n      name: '報酬率',\n      type: 'area',\n      data: dataSeries,\n      color: '#EA5E5B',\n      fillOpacity: 0.2,\n      negativeColor: '#51A551',\n    }],\n  })\n  return highchartsInstance\n}\n\nexport default generateChart\n","<template>\n  <div class=\"performance-chart\">\n    <div id=\"performance-chart-graph\" />\n  </div>\n</template>\n\n<script>\nimport generateChart from '../utils/highcharts_area_helper'\n\nexport default {\n  name: 'PerformanceChart',\n  props: {\n    dataSeries: {\n      type: Array,\n      required: true,\n    },\n  },\n  data() {\n    return {\n      chartInstance: null,\n    }\n  },\n  computed: {\n    highchartsDataSeries() {\n      return this.dataSeries.map((dataItem) => {\n        const itemDate = new Date(dataItem[0])\n        return [\n          itemDate.getTime(),\n          parseFloat(dataItem[1]),\n        ]\n      })\n    },\n  },\n  mounted() {\n    this.$nextTick(() => {\n      this.chartInstance = generateChart({\n        mountedElementId: 'performance-chart-graph',\n        dataSeries: this.highchartsDataSeries,\n      })\n    })\n  },\n  methods: {\n    updateChart() {\n      this.chartInstance.update({\n        series: this.highchartsDataSeries,\n      })\n    },\n  },\n}\n</script>\n\n<style scoped lang=\"scss\">\n#performance-chart-graph {\n  height: 300px;\n  @media screen and (min-width: 1024px) {\n    height: 350px;\n  }\n}\n</style>\n","<template>\n  <div class=\"performance-label\">\n    <div class=\"performance-label-title\">\n      {{ title }}\n    </div>\n    <div\n      :class=\"[\n        'performance-label-diff-percentage',\n        {'is-red': isPositive},\n        {'is-green': isNegative},\n      ]\"\n    >\n      {{ isPositive ? '+' : '' }}{{ diffPercentage }}%\n    </div>\n  </div>\n</template>\n\n<script>\nexport default {\n  name: 'PerformanceLabel',\n  props: {\n    title: {\n      type: String,\n      required: true,\n    },\n    diffPercentage: {\n      type: Number,\n      required: true,\n    },\n  },\n  computed: {\n    isPositive() {\n      return this.diffPercentage > 0\n    },\n    isNegative() {\n      return this.diffPercentage < 0\n    },\n  },\n}\n</script>\n\n<style scoped lang=\"scss\">\n.performance-label {\n  display: flex;\n  flex-direction: column;\n  width: 33%;\n  @media screen and (min-width: 768px) {\n    width: 25%;\n  }\n  @media screen and (min-width: 1280px) {\n    width: 20%;\n  }\n}\n.performance-label-title {\n  font-size: 0.8125rem;\n  line-height: 1;\n  color: #737373;\n  margin-bottom: 6px;\n\n  @media screen and (min-width: 568px) {\n    font-size: 0.875rem;\n    margin-bottom: 0;\n  }\n}\n.performance-label-diff-percentage {\n  font-size: 1.25rem;\n  color: #434343;\n  font-weight: bold;\n  @media screen and (min-width: 568px) {\n    font-size: 1.5rem;\n  }\n\n  &.is-green {\n    color: #51A551;\n  }\n  &.is-red {\n    color: #EA5E5B;\n  }\n}\n</style>\n","<template>\n  <div class=\"tags-chart-app\">\n    <template v-if=\"isContentReady\">\n      <div class=\"tags-chart-text-content\">\n        <PerformanceLabel\n          title=\"近 1 日漲跌幅\"\n          :diff-percentage=\"performanceDiffPercentage.day\"\n        />\n        <PerformanceLabel\n          title=\"近 1 週漲跌幅\"\n          :diff-percentage=\"performanceDiffPercentage.week\"\n        />\n        <PerformanceLabel\n          title=\"近 1 月漲跌幅\"\n          :diff-percentage=\"performanceDiffPercentage.month\"\n        />\n      </div>\n      <div class=\"tags-chart-graph-content\">\n        <PerformanceChart :data-series=\"performanceChartSeries\" />\n      </div>\n    </template>\n    <template v-else>\n      <template v-if=\"isLoading\">\n        <CommonLoadingHint class=\"tags-chart-loading-hint\" />\n      </template>\n      <template v-else-if=\"isEmptyContent\">\n        <CommonMessageHint class=\"tags-chart-empty-content-hint\" />\n      </template>\n      <template v-else>\n        <CommonErrorHint class=\"tags-chart-error-hint\" />\n      </template>\n    </template>\n  </div>\n</template>\n\n<script>\nimport {\n  CommonLoadingHint,\n  CommonErrorHint,\n  CommonMessageHint,\n} from '@/modules/shared/components/CommonHint'\n\nimport PerformanceChart from './components/PerformanceChart.vue'\nimport PerformanceLabel from './components/PerformanceLabel.vue'\n\nexport default {\n  name: 'TagChartsApp',\n  components: {\n    PerformanceLabel,\n    PerformanceChart,\n    CommonLoadingHint,\n    CommonErrorHint,\n    CommonMessageHint,\n  },\n  props: {\n    isLoading: {\n      type: Boolean,\n      default: false,\n    },\n    hasLoadingError: {\n      type: Boolean,\n      default: false,\n    },\n    isEmptyContent: {\n      type: Boolean,\n      default: false,\n    },\n    performanceChartSeries: {\n      type: Array,\n      default: () => [],\n    },\n    performanceDiffPercentage: {\n      type: Object,\n      default: () => ({}),\n      validator(value) {\n        return (\n          Object.keys(value).includes('day')\n          && Object.keys(value).includes('week')\n          && Object.keys(value).includes('month')\n        )\n      },\n    },\n  },\n  computed: {\n    isContentReady() {\n      return !this.isLoading && !this.hasLoadingError && !this.isEmptyContent\n    },\n  },\n}\n</script>\n\n<style scoped lang=\"scss\">\n.tags-chart-app {\n  padding: 0.5rem 1rem 0;\n  height: 400px;\n\n  @media screen and (min-width: 1024px) {\n    padding: 0.5rem 1.5rem 0;\n    height: 455px;\n  }\n}\n.tags-chart-heading {\n  margin: 0;\n  font-size: 1.25rem;\n  font-weight: bold;\n}\n.tags-chart-text-content {\n  display: flex;\n  justify-content: space-between;\n  margin: 1rem 0;\n  @media screen and (min-width: 768px) {\n    justify-content: left;\n  }\n}\n.tags-chart-loading-hint,\n.tags-chart-error-hint {\n  margin: 0 auto;\n  padding: 1rem 0 2rem;\n\n  @media screen and (min-width: 768px) {\n    padding: 4rem 0 4rem;\n  }\n}\n.tags-chart-empty-content-hint {\n  margin: 0 auto;\n  padding: 1rem 0 2rem;\n  font-size: 0.875rem;\n\n  @media screen and (min-width: 768px) {\n    font-size: 1rem;\n    padding: 3rem 0 4rem;\n  }\n  @media screen and (min-width: 1024px) {\n    font-size: 1rem;\n    padding: 5rem 0 6rem;\n  }\n}\n</style>\n","import { createApp, h } from 'vue'\n\nimport initSentry from '@/common/sentry'\nimport App from '@/pages/tags/App.vue'\n\nconst tagsChartApp = createApp({\n  data() {\n    return {\n      isLoading: false,\n      hasLoadingError: false,\n      isEmptyContent: false,\n      performanceChartSeries: [],\n      performanceDiffPercentage: {\n        day: 0,\n        week: 0,\n        month: 0,\n      },\n    }\n  },\n  created() {\n    this.isLoading = true\n  },\n  methods: {\n    // 這個 Method 會被外部使用，參照 app/assets/javascripts/tags/index.js\n    setPerformanceChartData(data) {\n      this.performanceDiffPercentage = {\n        day: parseFloat(data.diff_percentage?.day || 0, 10),\n        week: parseFloat(data.diff_percentage?.week || 0, 10),\n        month: parseFloat(data.diff_percentage?.month || 0, 10),\n      }\n      this.performanceChartSeries = data.chart\n    },\n    setIsLoading(isLoading) {\n      this.isLoading = isLoading\n    },\n    setHasLoadingError(hasLoadingError) {\n      this.hasLoadingError = hasLoadingError\n    },\n    setIsEmptyContent(isEmptyContent) {\n      this.isEmptyContent = isEmptyContent\n    },\n  },\n  render() {\n    return h(App, {\n      isLoading: this.isLoading,\n      hasLoadingError: this.hasLoadingError,\n      performanceChartSeries: this.performanceChartSeries,\n      performanceDiffPercentage: this.performanceDiffPercentage,\n      isEmptyContent: this.isEmptyContent,\n    })\n  },\n})\n\ninitSentry({ app: tagsChartApp })\n\nconst appInstance = tagsChartApp.mount('#tags-chart-app')\n\nwindow.tagsChartApp = appInstance\n"],"names":["basicOptions","generateChart","mountedElementId","dataSeries","Highcharts","_sfc_main","dataItem","_hoisted_1","_openBlock","_createElementBlock","_cache","_createElementVNode","_hoisted_2","_toDisplayString","$props","_normalizeClass","$options","PerformanceLabel","PerformanceChart","CommonLoadingHint","CommonErrorHint","CommonMessageHint","value","_hoisted_3","_Fragment","_createVNode","_component_PerformanceLabel","_component_PerformanceChart","_createBlock","_component_CommonLoadingHint","_component_CommonMessageHint","_component_CommonErrorHint","tagsChartApp","createApp","data","_a","_b","_c","isLoading","hasLoadingError","isEmptyContent","h","App","initSentry","appInstance"],"mappings":"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"}