yuan
3 天以前 7726b6cdab80596d2e2f7dd3fe1ec3dfbdeee155
src/views/reportAnalysis/productionAnalysis/components/center-center.vue
@@ -10,8 +10,12 @@
        />
        <span class="equipment-title">投入产出分析</span>
      </div>
      <div class="filters-row">
        <DateTypeSwitch v-model="dateType" @change="handleDateTypeChange" />
      </div>
      <Echarts
        ref="chart"
        ref="chartRef"
        :chartStyle="chartStyle"
        :grid="grid"
        :legend="lineLegend"
@@ -27,11 +31,14 @@
</template>
<script setup>
import { ref, onMounted } from 'vue'
import { ref, onMounted, inject, watch, nextTick } from 'vue'
import * as echarts from 'echarts'
import Echarts from '@/components/Echarts/echarts.vue'
import { productInOutAnalysis } from '@/api/viewIndex.js'
import { inputOutputAnalysis } from '@/api/viewIndex.js'
import DateTypeSwitch from "@/views/reportAnalysis/productionAnalysis/components/DateTypeSwitch.vue";
const dateType = ref(3) // 1=周 2=月 3=季度
const chartRef = ref(null)
const chartStyle = { width: '100%', height: '100%' }
const grid = {
  left: '3%',
@@ -50,8 +57,8 @@
  itemHeight: 12,
  textStyle: { color: '#B8C8E0', fontSize: 14 },
  data: [
    { name: '出库', itemStyle: { color: 'rgba(11, 137, 254, 1)' } },
    { name: '入库', itemStyle: { color: 'rgba(11, 249, 254, 1)' } },
    { name: '产出', itemStyle: { color: 'rgba(11, 137, 254, 1)' } },
    { name: '投入', itemStyle: { color: 'rgba(11, 249, 254, 1)' } },
  ],
}
@@ -78,9 +85,13 @@
  },
]
const handleDateTypeChange = () => {
  fetchData()
}
const lineSeries = ref([
  {
    name: '出库',
    name: '产出',
    type: 'line',
    smooth: false,
    showSymbol: true,
@@ -98,7 +109,7 @@
    emphasis: { focus: 'series' },
  },
  {
    name: '入库',
    name: '投入',
    type: 'line',
    smooth: false,
    showSymbol: true,
@@ -132,13 +143,14 @@
}
const fetchData = () => {
  productInOutAnalysis({ type: 1 })
  inputOutputAnalysis({ type: dateType.value })
    .then((res) => {
      if (res.code === 200 && Array.isArray(res.data)) {
        const list = res.data
        xAxis1.value[0].data = list.map((d) => d.date)
        lineSeries.value[0].data = list.map((d) => Number(d.outCount) || 0)
        lineSeries.value[1].data = list.map((d) => Number(d.inCount) || 0)
        lineSeries.value[0].data = list.map((d) => Number(d.outputSum) || 0)
        lineSeries.value[1].data = list.map((d) => Number(d.inputSum) || 0)
        scheduleChartResize()
      }
    })
    .catch((err) => {
@@ -146,8 +158,24 @@
    })
}
const scheduleChartResize = () => {
  nextTick(() => {
    ;[0, 150, 400].forEach((ms) => {
      setTimeout(() => chartRef.value?.resize?.(), ms)
    })
  })
}
const dataDashboardRefreshTick = inject('dataDashboardRefreshTick', null)
if (dataDashboardRefreshTick) {
  watch(dataDashboardRefreshTick, () => {
    fetchData()
  })
}
onMounted(() => {
  fetchData()
  scheduleChartResize()
})
</script>
@@ -190,4 +218,10 @@
  width: 50px;
  height: 50px;
}
.filters-row {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
</style>