Merge branch 'master' of git.picaiba.com:g7hoo/chenzhou
这个提交包含在:
当前提交
ae7adebae0
@ -10,11 +10,11 @@ const chartChart = ref(null);
|
||||
const chart = ref(null);
|
||||
// 小时数据
|
||||
const hourData = ref([
|
||||
// { lineName: '001', hour: '00:00', num: 10 },
|
||||
// { lineName: '002', hour: '00:20', num: 20 },
|
||||
// { lineName: '003', hour: '00:30', num: 30 },
|
||||
// { lineName: '004', hour: '00:40', num: 14 },
|
||||
// { lineName: '005', hour: '00:50', num: 50 }
|
||||
// { lineName: "001", hour: "00:00", num: 10 },
|
||||
// { lineName: "002", hour: "00:20", num: 20 },
|
||||
// { lineName: "003", hour: "00:30", num: 30 },
|
||||
// { lineName: "004", hour: "00:40", num: 14 },
|
||||
// { lineName: "005", hour: "00:50", num: 50 },
|
||||
]);
|
||||
store.$subscribe((mutation, state) => {
|
||||
// console.log("[HourChart] =======>", state.data2.lineHourList?.length);
|
||||
@ -50,7 +50,7 @@ function setupChart() {
|
||||
chartSetup(
|
||||
chart.value,
|
||||
hourData.value.map((item) => item.hour),
|
||||
hourData.value.map((item) => item.data)
|
||||
hourData.value.map((item) => item.num)
|
||||
);
|
||||
});
|
||||
|
||||
@ -73,12 +73,17 @@ function setupChart() {
|
||||
|
||||
onMounted(() => {
|
||||
chartChart.value.classList.add("h-full");
|
||||
// setupChart();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Container class="chart" title="小时数据" icon="cube">
|
||||
<div ref="chartChart" class="chart-chart" style="{opacity: (hourData && hourData.length > 0) ? 1 : 0}"></div>
|
||||
<div
|
||||
ref="chartChart"
|
||||
class="chart-chart"
|
||||
style="{opacity: (hourData && hourData.length > 0) ? 1 : 0}"
|
||||
></div>
|
||||
<p v-show="!hourData || hourData.length === 0" class="empty-data-hint">
|
||||
暂无数据
|
||||
</p>
|
||||
|
@ -1,4 +1,5 @@
|
||||
export const options = {
|
||||
color: ["#FFD160", "#99D66C", "#5B9BFF", "#2760FF", "#8167F6", "#FF00B2"],
|
||||
grid: {
|
||||
top: 10,
|
||||
bottom: 0,
|
||||
@ -37,9 +38,12 @@ export const options = {
|
||||
fontSize: 16,
|
||||
color: '#fff8'
|
||||
},
|
||||
minInterval: 1,
|
||||
max: 100,
|
||||
min: 1
|
||||
// minInterval: 1,
|
||||
// max: 100,
|
||||
// min: 1,
|
||||
max: function(value) {
|
||||
return value.max + Math.floor(value.max / 5)
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
@ -48,6 +52,16 @@ export const options = {
|
||||
type: "bar",
|
||||
// barWidth: 20,
|
||||
showBackground: true,
|
||||
label: {
|
||||
show: true,
|
||||
distance: 20,
|
||||
rotate: 90,
|
||||
color: '#fff',
|
||||
fontSize: 16,
|
||||
verticalAlign: "middle",
|
||||
position: 'top',
|
||||
formatter: "{c}"
|
||||
},
|
||||
backgroundStyle: {
|
||||
color: "rgba(180, 180, 180, 0.2)",
|
||||
},
|
||||
|
@ -41,7 +41,7 @@ const options = {
|
||||
axisLabel: { show: false },
|
||||
axisTick: { show: false },
|
||||
splitLine: { show: false },
|
||||
data: ["废片", "阶段成品"],
|
||||
data: ["阶段成品", "废片"],
|
||||
axisLabel: {
|
||||
fontSize: 24,
|
||||
color: "#fff",
|
||||
|
@ -37,6 +37,11 @@ function setupChart(chart, dom, data) {
|
||||
/** 有状态,处理数据 */
|
||||
function __apply(yieldArray) {
|
||||
const d = loadData(yieldArray);
|
||||
// const d = loadData([
|
||||
// { teamName: "A组", yield: 11 },
|
||||
// { teamName: "B组", yield: 23 },
|
||||
// { teamName: "C组", yield: 14 },
|
||||
// ]);
|
||||
if (!d) {
|
||||
showChartDom.value = false;
|
||||
if (chart.value) chart.value.dispose();
|
||||
@ -53,6 +58,7 @@ store.$subscribe((mutation, state) => {
|
||||
|
||||
onMounted(() => {
|
||||
chartChart.value.classList.add("h-full");
|
||||
// __apply();
|
||||
});
|
||||
</script>
|
||||
|
||||
|
@ -16,6 +16,14 @@ const store = useWsStore();
|
||||
onMounted(() => {
|
||||
chartContainer.value.classList.add("h-full");
|
||||
const d = loadData(store.data2.monthlyTarget);
|
||||
// const d = loadData([
|
||||
// {
|
||||
// targetProduction: 100,
|
||||
// nowProduction: 66,
|
||||
// targetYield: 13,
|
||||
// nowYield: 3,
|
||||
// },
|
||||
// ]);
|
||||
if (!d) {
|
||||
show.value = false;
|
||||
if (chartInstance.value) {
|
||||
|
@ -1,4 +1,5 @@
|
||||
export const options = {
|
||||
color: ["#99D66C", "#5B9BFF", "#8167F6", "#FF00B2"],
|
||||
grid: {
|
||||
top: 0,
|
||||
left: 0,
|
||||
|
@ -9,7 +9,16 @@ const store = useWsStore();
|
||||
const chartChart = ref(null);
|
||||
const chart = ref(null);
|
||||
// 小时数据
|
||||
const hourData = ref([]);
|
||||
const hourData = ref([
|
||||
// { hour: "0:1", data: 10 },
|
||||
// { hour: "0:2", data: 13 },
|
||||
// { hour: "0:3", data: 20 },
|
||||
// { hour: "0:4", data: 12 },
|
||||
// { hour: "0:5", data: 12 },
|
||||
// { hour: "0:6", data: 11 },
|
||||
// { hour: "0:7", data: 10 },
|
||||
// { hour: "0:8", data: 1 },
|
||||
]);
|
||||
store.$subscribe((mutation, state) => {
|
||||
if (
|
||||
state.data2.lineHourList == undefined ||
|
||||
@ -41,6 +50,7 @@ function setupChart() {
|
||||
|
||||
onMounted(() => {
|
||||
chartChart.value.classList.add("h-full");
|
||||
// setupChart();
|
||||
});
|
||||
</script>
|
||||
|
||||
|
@ -1,4 +1,5 @@
|
||||
export const options = {
|
||||
color: ["#FFD160", "#99D66C", "#5B9BFF", "#2760FF", "#8167F6", "#FF00B2"],
|
||||
grid: {
|
||||
top: 10,
|
||||
bottom: 0,
|
||||
@ -11,7 +12,7 @@ export const options = {
|
||||
data: [],
|
||||
axisLabel: {
|
||||
fontSize: 16,
|
||||
color: '#fff8'
|
||||
color: "#fff8",
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
@ -30,16 +31,19 @@ export const options = {
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
color: '#e6e6e633'
|
||||
}
|
||||
color: "#e6e6e633",
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
fontSize: 16,
|
||||
color: '#fff8'
|
||||
color: "#fff8",
|
||||
},
|
||||
minInterval: 1,
|
||||
max: 100,
|
||||
min: 1
|
||||
// max: 100,
|
||||
// min: 1
|
||||
max: function(value) {
|
||||
return value.max + Math.floor(value.max / 4)
|
||||
}
|
||||
},
|
||||
series: [
|
||||
{
|
||||
@ -48,6 +52,16 @@ export const options = {
|
||||
type: "bar",
|
||||
// barWidth: 20,
|
||||
showBackground: true,
|
||||
label: {
|
||||
show: true,
|
||||
distance: 20,
|
||||
rotate: 90,
|
||||
color: '#fff',
|
||||
fontSize: 16,
|
||||
verticalAlign: "middle",
|
||||
position: 'top',
|
||||
formatter: "{c}"
|
||||
},
|
||||
backgroundStyle: {
|
||||
color: "rgba(180, 180, 180, 0.2)",
|
||||
},
|
||||
|
@ -42,7 +42,50 @@ export const options = {
|
||||
},
|
||||
minInterval: 1,
|
||||
},
|
||||
series: [{ type: "bar" }, { type: "bar" }, { type: "bar" }],
|
||||
series: [
|
||||
{
|
||||
type: "bar",
|
||||
label: {
|
||||
show: true,
|
||||
distance: 20,
|
||||
rotate: 90,
|
||||
color: "#fff",
|
||||
verticalAlign: "middle",
|
||||
position: 'top',
|
||||
formatter: (params) => {
|
||||
return params.data[1];
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "bar",
|
||||
label: {
|
||||
show: true,
|
||||
distance: 20,
|
||||
rotate: 90,
|
||||
color: "#fff",
|
||||
verticalAlign: "middle",
|
||||
position: 'top',
|
||||
formatter: (params) => {
|
||||
return params.data[2];
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "bar",
|
||||
label: {
|
||||
show: true,
|
||||
distance: 20,
|
||||
rotate: 90,
|
||||
color: "#fff",
|
||||
verticalAlign: "middle",
|
||||
position: 'top',
|
||||
formatter: (params) => {
|
||||
return params.data[3];
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
export default function setup(
|
||||
|
@ -10,9 +10,6 @@ const chartContainer = ref(null);
|
||||
const chartInstance = ref(null);
|
||||
const store = useWsStore();
|
||||
|
||||
// 绿色:24FF5E
|
||||
// 黄色:FFB524
|
||||
// 红色:FF3737
|
||||
onMounted(() => {
|
||||
chartContainer.value.classList.add("h-full");
|
||||
const d = loadData(store.data2.monthlyTarget);
|
||||
|
@ -1,4 +1,5 @@
|
||||
export const options = {
|
||||
color: ["#99D66C", "#5B9BFF", "#8167F6", "#FF00B2"],
|
||||
grid: {
|
||||
top: 0,
|
||||
left: 0,
|
||||
@ -13,7 +14,7 @@ export const options = {
|
||||
top: "70%",
|
||||
textStyle: {
|
||||
fontSize: 16,
|
||||
color: '#fffa'
|
||||
color: '#fffd'
|
||||
},
|
||||
},
|
||||
{
|
||||
@ -23,7 +24,7 @@ export const options = {
|
||||
top: "85%",
|
||||
textStyle: {
|
||||
fontSize: 16,
|
||||
color: '#fffa'
|
||||
color: '#fffd'
|
||||
},
|
||||
},
|
||||
{
|
||||
@ -33,7 +34,7 @@ export const options = {
|
||||
top: "70%",
|
||||
textStyle: {
|
||||
fontSize: 16,
|
||||
color: '#fffa'
|
||||
color: '#fffd'
|
||||
},
|
||||
},
|
||||
{
|
||||
@ -43,7 +44,7 @@ export const options = {
|
||||
top: "85%",
|
||||
textStyle: {
|
||||
fontSize: 16,
|
||||
color: '#fffa'
|
||||
color: '#fffd'
|
||||
},
|
||||
},
|
||||
],
|
||||
|
@ -10,9 +10,6 @@ const chartContainer = ref(null);
|
||||
const chartInstance = ref(null);
|
||||
const store = useWsStore();
|
||||
|
||||
// 绿色:24FF5E
|
||||
// 黄色:FFB524
|
||||
// 红色:FF3737
|
||||
onMounted(() => {
|
||||
chartContainer.value.classList.add("h-full");
|
||||
const d = loadData(store.data2.dailyTarget);
|
||||
|
@ -1,4 +1,5 @@
|
||||
export const options = {
|
||||
color: ["#99D66C", "#5B9BFF", "#8167F6", "#FF00B2"],
|
||||
grid: {
|
||||
top: 0,
|
||||
left: 0,
|
||||
@ -13,7 +14,7 @@ export const options = {
|
||||
top: "70%",
|
||||
textStyle: {
|
||||
fontSize: 16,
|
||||
color: "#fffa",
|
||||
color: "#fffd",
|
||||
},
|
||||
},
|
||||
{
|
||||
@ -23,7 +24,7 @@ export const options = {
|
||||
top: "85%",
|
||||
textStyle: {
|
||||
fontSize: 16,
|
||||
color: "#fffa",
|
||||
color: "#fffd",
|
||||
},
|
||||
},
|
||||
{
|
||||
@ -33,7 +34,7 @@ export const options = {
|
||||
top: "70%",
|
||||
textStyle: {
|
||||
fontSize: 16,
|
||||
color: "#fffa",
|
||||
color: "#fffd",
|
||||
},
|
||||
},
|
||||
{
|
||||
@ -43,7 +44,7 @@ export const options = {
|
||||
top: "85%",
|
||||
textStyle: {
|
||||
fontSize: 16,
|
||||
color: "#fffa",
|
||||
color: "#fffd",
|
||||
},
|
||||
},
|
||||
],
|
||||
|
@ -37,6 +37,11 @@ function setupChart(chart, dom, data) {
|
||||
/** 有状态,处理数据 */
|
||||
function __apply(yieldArray) {
|
||||
const d = loadData(yieldArray);
|
||||
// const d = loadData([
|
||||
// { teamName: "A组", yield: 11 },
|
||||
// { teamName: "B组", yield: 23 },
|
||||
// { teamName: "C组", yield: 14 },
|
||||
// ]);
|
||||
if (!d) {
|
||||
showChartDom.value = false;
|
||||
if (chart.value) chart.value.dispose();
|
||||
@ -53,6 +58,7 @@ store.$subscribe((mutation, state) => {
|
||||
|
||||
onMounted(() => {
|
||||
chartChart.value.classList.add("h-full");
|
||||
// __apply();
|
||||
});
|
||||
</script>
|
||||
|
||||
|
@ -37,6 +37,11 @@ function setupChart(chart, dom, data) {
|
||||
/** 有状态,处理数据 */
|
||||
function __apply(yieldArray) {
|
||||
const d = loadData(yieldArray);
|
||||
// const d = loadData([
|
||||
// { teamName: "A组", yield: 11 },
|
||||
// { teamName: "B组", yield: 23 },
|
||||
// { teamName: "C组", yield: 14 },
|
||||
// ]);
|
||||
if (!d) {
|
||||
showChartDom.value = false;
|
||||
if (chart.value) chart.value.dispose();
|
||||
@ -53,6 +58,7 @@ store.$subscribe((mutation, state) => {
|
||||
|
||||
onMounted(() => {
|
||||
chartChart.value.classList.add("h-full");
|
||||
// __apply();
|
||||
});
|
||||
</script>
|
||||
|
||||
|
正在加载...
在新工单中引用
屏蔽一个用户