提交

src/views/mechanism/ledger/components/add.vue

@@ -8,6 +8,11 @@
             <el-input v-model="form.devicename" placeholder="请输入设备名称" />
           </el-form-item>
         </el-col>
+        <el-col :span="12">
+          <el-form-item label="工区" prop="workArea">
+            <el-input v-model="form.workArea" placeholder="请输入工区" />
+          </el-form-item>
+        </el-col>
       </el-row>
       <el-row>
         <el-col :span="12">
@@ -162,7 +167,8 @@ const form: any = ref({
   qualificationId: undefined,
   equipmentPhotoId: undefined,
   verificationReportId: undefined,
-  remark: undefined
+  remark: undefined,
+  workArea: undefined
 });
 const rules = ref({
   devicename: [{ required: true, message: '设备名称不能为空', trigger: 'blur' }],
@@ -245,7 +251,8 @@ const reset = () => {
     equipmentPhotoId: undefined,
     verificationReportId: undefined,
     equipmentType: undefined,
-    remark: undefined
+    remark: undefined,
+    workArea: undefined
   };
   mechanicalrewritingFormRef.value?.resetFields();
 };

src/views/mechanism/ledger/components/details.vue

@@ -10,6 +10,9 @@
         <el-col :span="12">
           <el-form-item label="设备名称">{{ formData.devicename }}</el-form-item>
         </el-col>
+        <el-col :span="12">
+          <el-form-item label="工区">{{ formData.workArea }}</el-form-item>
+        </el-col>
         <el-col :span="12">
           <el-form-item label="设备类型">{{ formData.deviceType }}</el-form-item>
         </el-col>

src/views/mechanism/ledger/index.vue

@@ -53,7 +53,7 @@
         <el-table-column label="新旧程度" align="center" prop="degree" />
         <el-table-column label="车辆容量" align="center" prop="vehicleCapacity" />
         <el-table-column label="车辆净重" align="center" prop="suttle" />
-
+        <el-table-column label="工区" align="center" prop="workArea" />
         <el-table-column label="备注" align="center" prop="remark" />
         <el-table-column label="操作" align="center" fixed="right" min-width="200" fixed-width>
           <template #default="scope">

src/views/projectLarge/ProjectScreen/components/leftPage.vue

@@ -156,7 +156,7 @@ var lastTime = 0;
 var scrolltimerTable = null;
 var rotate = false;
 
-const autoScrollTable = (time: number) => {
+const autoScrollTable = (time: any, isAsc?: boolean) => {
   const divData = document.getElementById('event_scroll');
 
   if (time - lastTime < 25) {

src/views/projectLarge/ProjectScreen/components/optionList.ts

@@ -22,7 +22,7 @@ export let pieOption = {
         fontSize: 14,
         fill: '#fff'
       }
-    },
+    }
   ],
   legend: {
     show: true,
@@ -62,7 +62,7 @@ export let pieOption = {
     },
     legend: {
       top: 'bottom'
-    },
+    }
   }
 };
 
@@ -76,12 +76,12 @@ export let barOption = {
     top: 10,
     right: 20,
     textStyle: {
-      color: '#fff',
+      color: '#fff'
     }
   },
   xAxis: {
     type: 'category',
-    data: ['地块1', '地块2', '地块3', '地块4', '地块5', '地块6'],
+    data: [],
     axisLabel: {
       color: '#fff'
     },
@@ -97,30 +97,59 @@ export let barOption = {
     type: 'value',
     axisLabel: {
       formatter: '{value}'
+    },
+    splitLine: {
+      show: false // 不显示分割线
     }
   },
   grid: {
     bottom: 0, // 距离容器底部的距离
     containLabel: true // 确保坐标轴标签不被裁剪
   },
+  tooltip: {
+    show: true,
+    backgroundColor: '',
+    trigger: 'axis',
+    // formatter: '{b0}：{c0}万元',
+    formatter: (params: any) => {
+      // console.log(params);
+      const projectName = params[0].name;
+      // params 是数组，对应每条柱子
+      // return params.map((p: any) => `${p.name} <br/>  ${p.seriesName}：${Number(p.value).toFixed(2)} MW`).join('<br/>');
+      return (
+        `${projectName}<br/>` +
+        params
+          .slice(0, 2)
+          .map((p) => `${p.seriesName}：${Number(p.value).toFixed(2)} m²`)
+          .join('<br/>')
+      );
+    },
+    textStyle: {
+      color: '#fff'
+    },
+    axisPointer: {
+      type: 'shadow' // 默认为直线，可选为：'line' | 'shadow',
+    }
+    // borderColor: 'rgba(252, 217, 18, 1)'
+  },
   series: [
     {
       name: '计划流转面积',
       type: 'bar',
       data: [],
-      barWidth: '20%',
+      barWidth: '10',
       itemStyle: {
         color: 'rgb(29, 253, 253)'
-      },
+      }
     },
     {
       name: '已流转面积',
       type: 'bar',
       data: [],
-      barWidth: '20%',
+      barWidth: '10',
       itemStyle: {
         color: 'rgb(25, 181, 251)'
-      },
+      }
     }
   ]
 };
@@ -129,7 +158,7 @@ export let mapOption = {
   geo: {
     map: 'ch',
     roam: true,
-    aspectScale: Math.cos((47 * Math.PI) / 180),
+    aspectScale: Math.cos((47 * Math.PI) / 180)
   },
   series: [
     {
@@ -147,7 +176,7 @@ export let mapOption = {
         { name: 'i', value: [9.085994375000002, 47.55395822835779] },
         { name: 'j', value: [8.653968125000002, 47.47709530818285] },
         { name: 'k', value: [8.203158125000002, 47.44506909144329] }
-      ],
+      ]
     }
   ]
 };

src/views/projectLarge/ProjectScreen/components/rightPage.vue

@@ -41,6 +41,7 @@ let lineChart: any = null;
 // 土地数据 折线图
 const designAreaData = ref([]);
 const transferAreaData = ref([]);
+const barNames = ref([]);
 // 饼图数据
 let pieData = [
   { label: 'areaPercentage', name: '场区', value: 0 },
@@ -66,12 +67,13 @@ const initPieChart = () => {
   pieChart.setOption(pieOption);
 };
 
-// 初始化折线图
+// 初始柱状图线图
 const initLineChart = () => {
   if (!lineChartRef.value) {
     console.error('未找到折线图容器元素');
     return;
   }
+  barOption.xAxis.data = barNames.value;
   barOption.series[0].data = designAreaData.value;
   barOption.series[1].data = transferAreaData.value;
   lineChart = echarts.init(lineChartRef.value, null, {
@@ -88,6 +90,8 @@ const getScreenLandData = async () => {
   const res = await getScreenLand(projectIdTwo);
   const { data, code } = res;
   if (code === 200) {
+    console.log(data);
+    barNames.value = res.data.map((item: any) => item.landName);
     designAreaData.value = data.map((item: any) => Number(item.designArea));
     transferAreaData.value = data.map((item: any) => Number(item.transferArea));
     initLineChart();