Browse Source

修改首页样式

chenbaoxin 4 months ago
parent
commit
1e217858e2

+ 33 - 4
src/components/LineChart/index.vue

@@ -106,14 +106,43 @@ const initChart = () => {
   myChart.setOption(option,true);
   myChart.setOption(option,true);
 };
 };
 const saveChartAndSend = async () => {
 const saveChartAndSend = async () => {
-  const imgData = await myChart.getDataURL({
+  // 创建一个临时的 DOM 元素
+  const tempDiv = document.createElement('div');
+  tempDiv.style.width = '800px'; // 设置宽度
+  tempDiv.style.height = '600px'; // 设置高度
+  document.body.appendChild(tempDiv);
+
+  // 初始化临时图表实例
+  const tempChart = echarts.init(tempDiv);
+  const option = myChart.getOption();
+  tempChart.setOption(option);
+
+  // 设置导出时坐标轴样式为黑色
+  tempChart.setOption({
+    xAxis: {
+      axisLine: { lineStyle: { color: "#000000" } },
+      axisLabel: { color: "#000000" }
+    },
+    yAxis: {
+      axisLine: { lineStyle: { color: "#000000" } },
+      axisLabel: { color: "#000000" }
+    }
+  });
+
+  // 导出图表
+  const imgData = await tempChart.getDataURL({
     type: 'png',
     type: 'png',
-    pixelRatio: 2,
+    pixelRatio: 1,
     backgroundColor: '#fff'
     backgroundColor: '#fff'
   });
   });
+
+  // 释放临时图表实例并移除临时 DOM 元素
+  tempChart.dispose();
+  document.body.removeChild(tempDiv);
+
   console.log(imgData);
   console.log(imgData);
-  return imgData
-  };
+  return imgData;
+};
  defineExpose({ saveChartAndSend });
  defineExpose({ saveChartAndSend });
 onMounted(() => {
 onMounted(() => {
   initChart();
   initChart();

+ 10 - 10
src/views/HealthStatusAnalysis/index.vue

@@ -20,12 +20,12 @@
             srcset=""
             srcset=""
           />
           />
           <!-- 添加注释和标签 -->
           <!-- 添加注释和标签 -->
-          <div class="annotation" style="top: 25%; left: 16%">左DE活塞</div>
-          <div class="annotation" style="top: 24%; left: 30%">左DE燃油齿条</div>
-          <div class="annotation" style="top: 15%; left: 38%">左DE冷却水</div>
-          <div class="annotation" style="top: 24%; left: 42%">左DE箱装体</div>
-          <div class="annotation" style="top: 19%; left: 47%">左DE燃油齿条</div>
-          <div class="annotation" style="top: 14%; left: 52%">右齿轮箱</div>
+          <div class="annotation" style="top: 25%; left: 14%">左DE活塞</div>
+          <div class="annotation" style="top: 24%; left: 28%">左DE燃油齿条</div>
+          <div class="annotation" style="top: 15%; left: 36%">左DE冷却水</div>
+          <div class="annotation" style="top: 24%; left: 40%">左DE箱装体</div>
+          <div class="annotation" style="top: 19%; left: 45%">左DE燃油齿条</div>
+          <div class="annotation" style="top: 14%; left: 53%">右齿轮箱</div>
           <div class="annotation" style="top: 22%; left: 58%">
           <div class="annotation" style="top: 22%; left: 58%">
             右GT高压压气机
             右GT高压压气机
           </div>
           </div>
@@ -35,15 +35,15 @@
           <div class="annotation" style="bottom: 16%; left: 20%">
           <div class="annotation" style="bottom: 16%; left: 20%">
             右DE增压空气
             右DE增压空气
           </div>
           </div>
-          <div class="annotation" style="bottom: 15%; left: 30%">
+          <div class="annotation" style="bottom: 15%; left: 32%">
             右DE海水泵
             右DE海水泵
           </div>
           </div>
           <div class="annotation" style="bottom: 9%; left: 32%">
           <div class="annotation" style="bottom: 9%; left: 32%">
             右DE箱装体冷却风机
             右DE箱装体冷却风机
           </div>
           </div>
-          <div class="annotation" style="bottom: 14%; left: 43%">右DE滑油</div>
+          <div class="annotation" style="bottom: 14%; left: 42%">右DE滑油</div>
           <!-- 带有小边框的注释 -->
           <!-- 带有小边框的注释 -->
-          <div class="annotation bordered-box" style="top: 10%; left: 8%">
+          <div class="annotation bordered-box" style="top: 10%; left: 2%">
             <div>
             <div>
               <div>压力A排</div>
               <div>压力A排</div>
         
         
@@ -72,7 +72,7 @@
               </div>
               </div>
             </div>
             </div>
           </div>
           </div>
-          <div class="annotation bordered-box" style="bottom: 11%; left: 2%">
+          <div class="annotation bordered-box" style="bottom: 11%; left: 0%">
             <div>
             <div>
               <div>后气压PP030</div>
               <div>后气压PP030</div>
               <div class="value">
               <div class="value">

+ 4 - 2
src/views/OperationalReliabilityPrediction/index.vue

@@ -155,11 +155,13 @@ let serviceDataRef=ref(null)
 const getAllDomElements = async () => {
 const getAllDomElements = async () => {
   // this.$nextTick(() => {
   // this.$nextTick(() => {
    let imgBase64= await lineChartRef.value.saveChartAndSend();
    let imgBase64= await lineChartRef.value.saveChartAndSend();
+   console.log(imgBase64.split(';')[1]);
+   
     serviceDataRef.value={
     serviceDataRef.value={
     ...serviceDataRef.value,
     ...serviceDataRef.value,
-    image:imgBase64
+    image:imgBase64.split(';')[1]
    }
    }
-     downloadFile(downloadStrategy(), "预测结果", { ...serviceDataRef.value });
+     downloadFile(downloadStrategy(), "预测结果.docx", { ...serviceDataRef.value });
 
 
   //  downloadStrategy({...serviceDataRef.value}).then((res:any)=>{
   //  downloadStrategy({...serviceDataRef.value}).then((res:any)=>{
   //   debugger
   //   debugger

+ 2 - 2
vite.config.ts

@@ -22,8 +22,8 @@ export default defineConfig({
     proxy: {
     proxy: {
       // 代理配置
       // 代理配置
       '/api': {
       '/api': {
-        target: 'http://192.168.1.103:8083',  // 目标服务器
-        // target: 'http://192.168.99.49:8083',  // 目标服务器
+        // target: 'http://192.168.1.103:8083',  // 目标服务器
+        target: 'http://192.168.99.49:8083',  // 目标服务器
         changeOrigin: true,            // 需要虚拟主机站点
         changeOrigin: true,            // 需要虚拟主机站点
         rewrite: (path) => path.replace(/^\/api/, '/api/')  // 重写 API 请求
         rewrite: (path) => path.replace(/^\/api/, '/api/')  // 重写 API 请求
       }
       }