产能预测
diff --git a/sub-operation-service/src/views/smartFarm/inspection/bugInspection.vue b/sub-operation-service/src/views/smartFarm/inspection/bugInspection.vue
new file mode 100644
index 0000000..0a3d9bc
--- /dev/null
+++ b/sub-operation-service/src/views/smartFarm/inspection/bugInspection.vue
@@ -0,0 +1,13 @@
+
+
+
+
+
+
+
+
+
diff --git a/sub-operation-service/src/views/smartFarm/fieldInspection/index.vue b/sub-operation-service/src/views/smartFarm/inspection/fieldInspection.vue
similarity index 50%
rename from sub-operation-service/src/views/smartFarm/fieldInspection/index.vue
rename to sub-operation-service/src/views/smartFarm/inspection/fieldInspection.vue
index e4e5792..3feacd0 100644
--- a/sub-operation-service/src/views/smartFarm/fieldInspection/index.vue
+++ b/sub-operation-service/src/views/smartFarm/inspection/fieldInspection.vue
@@ -6,7 +6,7 @@
@@ -58,11 +58,11 @@ import * as echarts from 'echarts';
/* --------------- data --------------- */
// #region
// 图表 DOM 引用
-const chartRef = ref(null);
+const chartRef1 = ref(null);
// ECharts 实例
let chartInstance = null;
// 颜色列表
-const colorList = ['#9E87FF', '#73DDFF'];
+const colorList = ['#3685FE', '#FFD500', '#25BF82'];
// x轴数据
const xData = ['1月', '2月', '3月', '4月', '5月', '6月'];
const devices = ref([
@@ -123,206 +123,240 @@ const devices = ref([
id: 7,
},
]);
+// 图表配置
+const option = {
+ backgroundColor: '#fff',
+ title: {
+ text: '',
+ textStyle: {
+ fontSize: 12,
+ fontWeight: 400,
+ },
+ left: 'center',
+ top: '5%',
+ },
+ legend: {
+ icon: 'circle',
+ top: '0',
+ right: '5%',
+ itemWidth: 6,
+ itemGap: 20,
+ textStyle: {
+ color: '#556677',
+ },
+ },
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ label: {
+ show: true,
+ backgroundColor: '#fff',
+ color: '#556677',
+ borderColor: 'rgba(0,0,0,0)',
+ shadowColor: 'rgba(0,0,0,0)',
+ shadowOffsetY: 0,
+ },
+ lineStyle: {
+ width: 0,
+ },
+ },
+ backgroundColor: '#fff',
+ textStyle: {
+ color: '#5c6c7c',
+ },
+ padding: [10, 10],
+ extraCssText: 'box-shadow: 1px 0 2px 0 rgba(163,163,163,0.5)',
+ },
+ grid: {
+ top: '20%',
+ },
+ xAxis: [
+ {
+ type: 'category',
+ data: xData,
+ axisLine: {
+ lineStyle: {
+ color: 'rgba(107,107,107,0.37)',
+ },
+ },
+ axisTick: {
+ show: false,
+ },
+ axisLabel: {
+ interval: 0,
+ textStyle: {
+ color: '#999',
+ },
+ margin: 15,
+ },
+ axisPointer: {
+ label: {
+ padding: [11, 5, 7],
+ backgroundColor: {
+ type: 'linear',
+ x: 0,
+ y: 0,
+ x2: 0,
+ y2: 1,
+ colorStops: [
+ {
+ offset: 0,
+ color: '#fff',
+ },
+ {
+ offset: 0.9,
+ color: '#fff',
+ },
+ {
+ offset: 0.9,
+ color: '#33c0cd',
+ },
+ {
+ offset: 1,
+ color: '#33c0cd',
+ },
+ ],
+ global: false,
+ },
+ },
+ },
+ boundaryGap: false,
+ },
+ ],
+ yAxis: [
+ {
+ type: 'value',
+ show: false,
+ axisTick: {
+ show: false,
+ },
+ axisLine: {
+ show: true,
+ lineStyle: {
+ color: 'rgba(107,107,107,0.37)',
+ },
+ },
+ axisLabel: {
+ textStyle: {
+ color: '#999',
+ },
+ },
+ splitLine: {
+ show: false,
+ },
+ },
+ ],
+ series: [
+ {
+ name: '茎秆高度',
+ type: 'line',
+ data: [10, 10, 30, 12, 15, 3],
+ symbolSize: 1,
+ symbol: 'circle',
+ smooth: true,
+ yAxisIndex: 0,
+ showSymbol: false,
+ lineStyle: {
+ width: 5,
+ color: '#3685FE',
+ shadowColor: 'rgba(158,135,255, 0.3)',
+ shadowBlur: 10,
+ shadowOffsetY: 20,
+ },
+ itemStyle: {
+ color: colorList[0],
+ borderColor: colorList[0],
+ },
+ },
+ {
+ name: '叶片温度',
+ type: 'line',
+ data: [5, 12, 11, 14, 25, 16],
+ symbolSize: 1,
+ symbol: 'circle',
+ smooth: true,
+ yAxisIndex: 0,
+ showSymbol: false,
+ lineStyle: {
+ width: 5,
+ color: '#FFD500',
+ shadowColor: 'rgba(115,221,255, 0.3)',
+ shadowBlur: 10,
+ shadowOffsetY: 20,
+ },
+ itemStyle: {
+ color: colorList[1],
+ borderColor: colorList[1],
+ },
+ },
+ {
+ name: '果实大小',
+ type: 'line',
+ data: [6, 14, 17, 25, 21, 10],
+ symbolSize: 1,
+ symbol: 'circle',
+ smooth: true,
+ yAxisIndex: 0,
+ showSymbol: false,
+ lineStyle: {
+ width: 5,
+ color: '#25BF82',
+ shadowColor: 'rgba(115,221,255, 0.3)',
+ shadowBlur: 10,
+ shadowOffsetY: 20,
+ },
+ itemStyle: {
+ color: colorList[2],
+ borderColor: colorList[2],
+ },
+ },
+ ],
+};
// #endregion
/* --------------- methods --------------- */
// #region
// 初始化图表
const initChart = () => {
- // 图表配置
- const option = {
- backgroundColor: '#fff',
- title: {
- text: '简单折线图',
- textStyle: {
- fontSize: 12,
- fontWeight: 400,
- },
- left: 'center',
- top: '5%',
- },
- legend: {
- icon: 'circle',
- top: '5%',
- right: '5%',
- itemWidth: 6,
- itemGap: 20,
- textStyle: {
- color: '#556677',
- },
- },
- tooltip: {
- trigger: 'axis',
- axisPointer: {
- label: {
- show: true,
- backgroundColor: '#fff',
- color: '#556677',
- borderColor: 'rgba(0,0,0,0)',
- shadowColor: 'rgba(0,0,0,0)',
- shadowOffsetY: 0,
- },
- lineStyle: {
- width: 0,
- },
- },
- backgroundColor: '#fff',
- textStyle: {
- color: '#5c6c7c',
- },
- padding: [10, 10],
- extraCssText: 'box-shadow: 1px 0 2px 0 rgba(163,163,163,0.5)',
- },
- grid: {
- top: '15%',
- },
- xAxis: [
- {
- type: 'category',
- data: xData,
- axisLine: {
- lineStyle: {
- color: 'rgba(107,107,107,0.37)',
- },
- },
- axisTick: {
- show: false,
- },
- axisLabel: {
- interval: 0,
- textStyle: {
- color: '#999',
- },
- margin: 15,
- },
- axisPointer: {
- label: {
- padding: [11, 5, 7],
- backgroundColor: {
- type: 'linear',
- x: 0,
- y: 0,
- x2: 0,
- y2: 1,
- colorStops: [
- {
- offset: 0,
- color: '#fff',
- },
- {
- offset: 0.9,
- color: '#fff',
- },
- {
- offset: 0.9,
- color: '#33c0cd',
- },
- {
- offset: 1,
- color: '#33c0cd',
- },
- ],
- global: false,
- },
- },
- },
- boundaryGap: false,
- },
- ],
- yAxis: [
- {
- type: 'value',
- axisTick: {
- show: false,
- },
- axisLine: {
- show: true,
- lineStyle: {
- color: 'rgba(107,107,107,0.37)',
- },
- },
- axisLabel: {
- textStyle: {
- color: '#999',
- },
- },
- splitLine: {
- show: false,
- },
- },
- ],
- series: [
- {
- name: 'Adidas',
- type: 'line',
- data: [10, 10, 30, 12, 15, 3, 7],
- symbolSize: 1,
- symbol: 'circle',
- smooth: true,
- yAxisIndex: 0,
- showSymbol: false,
- lineStyle: {
- width: 5,
- color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [
- {
- offset: 0,
- color: '#9effff',
- },
- {
- offset: 1,
- color: '#9E87FF',
- },
- ]),
- shadowColor: 'rgba(158,135,255, 0.3)',
- shadowBlur: 10,
- shadowOffsetY: 20,
- },
- itemStyle: {
- color: colorList[0],
- borderColor: colorList[0],
- },
- },
- {
- name: 'Nike',
- type: 'line',
- data: [5, 12, 11, 14, 25, 16, 10],
- symbolSize: 1,
- symbol: 'circle',
- smooth: true,
- yAxisIndex: 0,
- showSymbol: false,
- lineStyle: {
- width: 5,
- color: new echarts.graphic.LinearGradient(1, 1, 0, 0, [
- {
- offset: 0,
- color: '#73DD39',
- },
- {
- offset: 1,
- color: '#73DDFF',
- },
- ]),
- shadowColor: 'rgba(115,221,255, 0.3)',
- shadowBlur: 10,
- shadowOffsetY: 20,
- },
- itemStyle: {
- color: colorList[1],
- borderColor: colorList[1],
- },
- },
- ],
- };
- if (chartRef.value) {
+ if (chartRef1.value) {
// 基于准备好的dom,初始化echarts实例
- chartInstance = echarts.init(chartRef.value);
+ chartInstance = echarts.init(chartRef1.value);
// 绘制图表
chartInstance.setOption(option);
-
+ // 自动显示最大值点的tooltip
+ // showMaxValueTooltip();
// 响应式调整
window.addEventListener('resize', resizeChart);
}
};
+
+const showMaxValueTooltip = () => {
+ if (!chartInstance) return;
+
+ // 找出所有系列中的最大值点
+ let maxValue = -Infinity;
+ let maxSeriesIndex = 0;
+ let maxDataIndex = 0;
+
+ option.series.forEach((series, seriesIndex) => {
+ series.data.forEach((value, dataIndex) => {
+ if (value > maxValue) {
+ maxValue = value;
+ maxSeriesIndex = seriesIndex;
+ maxDataIndex = dataIndex;
+ }
+ });
+ });
+
+ // 延迟执行确保图表渲染完成
+ setTimeout(() => {
+ chartInstance.dispatchAction({
+ type: 'showTip',
+ seriesIndex: maxSeriesIndex,
+ dataIndex: maxDataIndex,
+ });
+ }, 300);
+};
+
// 组件挂载时初始化图表
onMounted(() => {
initChart();
diff --git a/sub-operation-service/src/views/smartFarm/inspection/waterInspection.vue b/sub-operation-service/src/views/smartFarm/inspection/waterInspection.vue
new file mode 100644
index 0000000..cd955de
--- /dev/null
+++ b/sub-operation-service/src/views/smartFarm/inspection/waterInspection.vue
@@ -0,0 +1,253 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
实时水质监测
+
+ 当前设备
+
+
+
+
+
+
+
+
+ {{ item.goat }}
+
{{ item.unit }}
+
+
+
![]()
+ {{ item.name }}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/sub-operation-service/src/views/userCenter/components/common.vue b/sub-operation-service/src/views/userCenter/components/common.vue
new file mode 100644
index 0000000..2fedef8
--- /dev/null
+++ b/sub-operation-service/src/views/userCenter/components/common.vue
@@ -0,0 +1,55 @@
+
+
+
+
+
diff --git a/sub-operation-service/src/views/userCenter/components/ischeck.vue b/sub-operation-service/src/views/userCenter/components/ischeck.vue
index 8fd93d2..8446af9 100644
--- a/sub-operation-service/src/views/userCenter/components/ischeck.vue
+++ b/sub-operation-service/src/views/userCenter/components/ischeck.vue
@@ -41,12 +41,12 @@ const doCheck = () => {
diff --git a/sub-operation-service/src/views/userCenter/components/userHeader.vue b/sub-operation-service/src/views/userCenter/components/userHeader.vue
index 7bbc6b6..10e5642 100644
--- a/sub-operation-service/src/views/userCenter/components/userHeader.vue
+++ b/sub-operation-service/src/views/userCenter/components/userHeader.vue
@@ -5,7 +5,14 @@