config.vue 1.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. <template>
  2. <!-- Echarts 全局设置 -->
  3. <global-setting :optionData="optionData"></global-setting>
  4. <CollapseItem
  5. v-for="(item, index) in seriesList"
  6. :key="index"
  7. name="单折线面积图"
  8. :expanded="true"
  9. >
  10. <SettingItemBox name="线条">
  11. <SettingItem name="宽度">
  12. <n-input-number
  13. v-model:value="item.lineStyle.width"
  14. :min="1"
  15. :max="100"
  16. size="small"
  17. placeholder="自动计算"
  18. ></n-input-number>
  19. </SettingItem>
  20. <SettingItem name="类型">
  21. <n-select
  22. v-model:value="item.lineStyle.type"
  23. size="small"
  24. :options="lineConf.lineStyle.type"
  25. ></n-select>
  26. </SettingItem>
  27. </SettingItemBox>
  28. </CollapseItem>
  29. </template>
  30. <script setup lang="ts">
  31. import { PropType, computed } from 'vue'
  32. import { lineConf } from '@/packages/chartConfiguration/echarts/index'
  33. import { GlobalThemeJsonType } from '@/settings/chartThemes/index'
  34. import {
  35. GlobalSetting,
  36. CollapseItem,
  37. SettingItemBox,
  38. SettingItem
  39. } from '@/components/Pages/ChartItemSetting'
  40. const props = defineProps({
  41. optionData: {
  42. type: Object as PropType<GlobalThemeJsonType>,
  43. required: true
  44. },
  45. })
  46. const seriesList = computed(() => {
  47. return props.optionData.series
  48. })
  49. </script>