gaoluyang
17 小时以前 2088822f2bca6d93ad3e550a166a9b18332747fd
src/views/reportAnalysis/productionAnalysis/components/right-top.vue
@@ -2,9 +2,21 @@
  <div>
    <PanelHeader title="工单执行效率分析" />
    <div class="main-panel panel-item-customers">
      <Echarts ref="chart" :chartStyle="chartStyle" :grid="grid" :legend="barLegend" :series="chartSeries"
        :tooltip="tooltip" :xAxis="xAxis1" :yAxis="yAxis1"
        :options="{ backgroundColor: 'transparent', textStyle: { color: '#B8C8E0' } }" style="height: 260px" />
      <div class="filters-row">
        <DateTypeSwitch v-model="dateType" @change="handleDateTypeChange" />
      </div>
      <Echarts
        ref="chart"
        :chartStyle="chartStyle"
        :grid="grid"
        :legend="barLegend"
        :series="chartSeries"
        :tooltip="tooltip"
        :xAxis="xAxis1"
        :yAxis="yAxis1"
        :options="{ backgroundColor: 'transparent', textStyle: { color: '#B8C8E0' } }"
        style="height: 260px"
      />
    </div>
  </div>
</template>
@@ -14,10 +26,13 @@
import { workOrderEfficiencyAnalysis } from '@/api/viewIndex.js'
import PanelHeader from './PanelHeader.vue'
import Echarts from '@/components/Echarts/echarts.vue'
import DateTypeSwitch from './DateTypeSwitch.vue'
const dateType = ref(1) // 1=周 2=月 3=季度
const chartStyle = {
  width: '100%',
  height: '160%',
  height: '140%',
}
const grid = { left: '3%', right: '4%', bottom: '3%', top: '10%', containLabel: true }
@@ -115,24 +130,25 @@
  },
]
const handleDateTypeChange = () => {
  fetchData()
}
const fetchData = () => {
  workOrderEfficiencyAnalysis()
  workOrderEfficiencyAnalysis({ dateType: dateType.value })
    .then((res) => {
      // 根据你的结构,数据直接在 res.data 中
      if (!res?.data || !Array.isArray(res.data)) return
      const list = res.data
      xAxis1.value[0].data = list.map((item) => item.date)
      chartSeries.value[0].data = list.map((item) => Number(item.startQuantity) || 0)
      chartSeries.value[1].data = list.map((item) => Number(item.finishQuantity) || 0)
      chartSeries.value[2].data = list.map((item) => Number(item.yieldRate) || 0)
      if (res.code !== 200 || !Array.isArray(res.data)) return
      const items = res.data
      xAxis1.value[0].data = items.map((d) => d.date)
      // 开工
      chartSeries.value[0].data = items.map((d) => Number(d.startQuantity) || 0)
      // 完成
      chartSeries.value[1].data = items.map((d) => Number(d.finishQuantity) || 0)
      // 良品率
      chartSeries.value[2].data = items.map((d) => Math.min(100, parseFloat(d.yieldRate) || 0))
    })
    .catch((err) => {
      console.error('获取工单效率数据失败:', err)
      console.error('获取工单执行效率分析失败:', err)
    })
}
@@ -148,6 +164,14 @@
  gap: 20px;
}
.filters-row {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
}
.panel-item-customers {
  border: 1px solid #1a58b0;
  padding: 18px;