Merge branch 'master' of http://112.124.40.88:5510/root/NanJingLamanRadarProject

# Conflicts:
#	04.系统编码/Frontend/src/components/Shared/Header.vue

04.系统编码/Backend/pom.xml

@@ -51,6 +51,7 @@
             <version>1.0.29</version>
         </dependency>
 
+
     </dependencies>
 
     <build>

04.系统编码/Backend/src/main/java/com/userinformation/backend/config/WebMvcConfig.java

@@ -0,0 +1,24 @@
+package com.userinformation.backend.config;
+
+import org.springframework.beans.factory.annotation.Value;
+import org.springframework.context.annotation.Configuration;
+import org.springframework.web.servlet.config.annotation.ResourceHandlerRegistry;
+import org.springframework.web.servlet.config.annotation.WebMvcConfigurationSupport;
+import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter;
+
+/**
+ * @describe: 虚拟目录配置
+ * @author: xiaowuler
+ * @createTime: 2021-12-03 09:33
+ */
+@Configuration
+public class WebMvcConfig extends WebMvcConfigurerAdapter {
+
+    @Value("${custom.image.path}")
+    private String path;
+
+    @Override
+    public void addResourceHandlers(ResourceHandlerRegistry registry) {
+        registry.addResourceHandler("/product/**").addResourceLocations("file:" + path + "/");
+    }
+}

04.系统编码/Backend/src/main/java/com/userinformation/backend/controller/ImageController.java

@@ -0,0 +1,29 @@
+package com.userinformation.backend.controller;
+
+import java.io.IOException;
+
+import org.springframework.web.bind.annotation.PostMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+import com.userinformation.backend.service.ImageService;
+import com.userinformation.backend.util.RequestResult;
+
+/**
+ * @describe: 图片处理控制层
+ * @author: xiaowuler
+ * @createTime: 2021-12-03 13:10
+ */
+@RestController
+@RequestMapping("image")
+public class ImageController {
+
+    private final ImageService imageService;
+    public ImageController(ImageService imageService){
+        this.imageService = imageService;
+    }
+
+    @PostMapping("convert")
+    public RequestResult convert(String url) throws IOException {
+        return RequestResult.success(imageService.convert(url));
+    }
+}

04.系统编码/Backend/src/main/java/com/userinformation/backend/service/ImageService.java

@@ -0,0 +1,43 @@
+package com.userinformation.backend.service;
+
+import javax.imageio.ImageIO;
+import java.awt.image.BufferedImage;
+import java.io.File;
+import java.io.IOException;
+import java.util.Locale;
+
+import org.springframework.beans.factory.annotation.Value;
+import org.springframework.stereotype.Service;
+import org.springframework.util.Assert;
+
+/**
+ * @describe: 图片处理 逻辑层
+ * @author: xiaowuler
+ * @createTime: 2021-12-03 13:12
+ */
+@Service
+public class ImageService {
+
+    @Value("${custom.image.path}")
+    private String imagePath;
+
+    @Value("${custom.image.url}")
+    private String imageUrl;
+
+    private final static String TIF_FILE_SUFFIX = ".tif";
+    private final static String PNG_FILE_SUFFIX = ".png";
+
+    public String convert(String url) throws IOException {
+        String filepath = url.replace(imageUrl, imagePath);
+        File sourceFile = new File(filepath);
+        Assert.isTrue(sourceFile.exists(), "文件不存在");
+        Assert.isTrue(filepath.toLowerCase(Locale.ROOT).endsWith(TIF_FILE_SUFFIX), "文件格式不正确");
+        String targetFilePath = filepath.replace(TIF_FILE_SUFFIX, PNG_FILE_SUFFIX);
+        File targetFile = new File(targetFilePath);
+        if (!targetFile.exists()){
+            BufferedImage image = ImageIO.read(sourceFile);
+            ImageIO.write(image, "png", targetFile);
+        }
+        return targetFilePath.replace(imagePath, imageUrl);
+    }
+}

04.系统编码/Backend/src/main/resources/application.yml

@@ -1,8 +1,12 @@
 server:
-  port: 8001
+  port: 8002
 spring:
   datasource:
     url: jdbc:mysql://112.124.40.88:33306/user_information?useUnicode=true&characteEncoding=utf-8
     username: root
     password: 3cqscbr@only1
     driver-class-name: com.mysql.cj.jdbc.Driver
+custom:
+  image:
+    url: http://112.124.40.88:8002/product
+    path: D:/Deployments/LamanRadar/product

04.系统编码/Backend/src/test/java/com/userinformation/backend/UserInformationApplicationTests.java

@@ -1,5 +1,11 @@
 package com.userinformation.backend;
 
+import javax.imageio.ImageIO;
+
+import java.awt.image.BufferedImage;
+import java.io.File;
+import java.io.IOException;
+
 import org.junit.jupiter.api.Test;
 import org.springframework.boot.test.context.SpringBootTest;
 
@@ -7,7 +13,11 @@ import org.springframework.boot.test.context.SpringBootTest;
 class UserInformationApplicationTests {
 
     @Test
-    void contextLoads() {
+    void contextLoads() throws IOException {
+        File inputFile = new File("C:\\Users\\xiaowuler\\Desktop\\images\\decision-support\\plan-advice\\control-experiment\\TFLD_Q2.tif");
+        File outputFile = new File("C:\\Users\\xiaowuler\\Desktop\\output.png");
+        BufferedImage image = ImageIO.read(inputFile);
+        ImageIO.write(image, "png", outputFile);
     }
 
 }

04.系统编码/Frontend/.idea/workspace.xml

@@ -2,10 +2,20 @@
 <project version="4">
   <component name="ChangeListManager">
     <list default="true" id="4b7d7b72-f5b8-41e4-85d5-6267bdc12fc5" name="默认变更列表" comment="">
-      <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/components/Login.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/Login.vue" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/../Backend/src/main/java/com/userinformation/backend/config/WebMvcConfig.java" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/../Backend/src/main/java/com/userinformation/backend/controller/ImageController.java" afterDir="false" />
+      <change afterPath="$PROJECT_DIR$/../Backend/src/main/java/com/userinformation/backend/service/ImageService.java" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/../Backend/pom.xml" beforeDir="false" afterPath="$PROJECT_DIR$/../Backend/pom.xml" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/../Backend/src/main/resources/application.yml" beforeDir="false" afterPath="$PROJECT_DIR$/../Backend/src/main/resources/application.yml" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/../Backend/src/test/java/com/userinformation/backend/UserInformationApplicationTests.java" beforeDir="false" afterPath="$PROJECT_DIR$/../Backend/src/test/java/com/userinformation/backend/UserInformationApplicationTests.java" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/components/DecisionSupport.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/DecisionSupport.vue" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/components/MicrowaveRadiation.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/MicrowaveRadiation.vue" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/components/RamanLidar.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/RamanLidar.vue" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/src/components/Shared/Header.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/Shared/Header.vue" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/components/SynergyEvaluation.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/SynergyEvaluation.vue" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/src/components/SystemManagement.vue" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/SystemManagement.vue" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/index.less" beforeDir="false" afterPath="$PROJECT_DIR$/src/index.less" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/uilts/Config.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/uilts/Config.ts" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/src/uilts/axios.ts" beforeDir="false" afterPath="$PROJECT_DIR$/src/uilts/axios.ts" afterDir="false" />
     </list>
     <option name="SHOW_DIALOG" value="false" />
@@ -85,7 +95,7 @@
       <workItem from="1638441956659" duration="5371000" />
       <workItem from="1638447904778" duration="262000" />
       <workItem from="1638496246090" duration="1527000" />
-      <workItem from="1638497917929" duration="11910000" />
+      <workItem from="1638497917929" duration="12291000" />
     </task>
     <task id="LOCAL-00001" summary="2021 12 01">
       <created>1638357539757</created>

04.系统编码/Frontend/src/components/DecisionSupport.vue

@@ -31,12 +31,15 @@
                         :initial-index="0"
                         fit="contain"
                         >
-                        <template #error>
+                            <template #error>
                                 <div class="image-slot">
                                     <img src="/images/null-picture.png" />
                                 </div>
                                 <p class="image-tip">暂无图片</p>
                             </template>
+                            <template #placeholder>
+                                <div class="image-placeholder">正在加载...</div>
+                            </template>
                         </el-image>
                     </el-col>
                 </el-row>
@@ -63,6 +66,7 @@
     import { onMounted, reactive, toRefs } from 'vue';
     import * as Tiff from 'browser-tiff.js';
     import { DecisionSupportConfig } from '../uilts/Config';
+import { post } from '../uilts/axios';
     
     export default {
         name: 'DecisionSupport',
@@ -73,32 +77,32 @@
                 items: [{
                     title: '比湿',
                     imgName: 'TFLD_Q2',
-                    imgUrl: '',
+                    imgUrl: '/images/null-picture.png',
                     preview: []
                 }, {
                     title: '风速和风向',
                     imgName: 'TFLD_V10',
-                    imgUrl: '',
+                    imgUrl: '/images/null-picture.png',
                     preview: []
                 }, {
                     title: '降水',
                     imgName: 'TFLD_RAIN',
-                    imgUrl: '',
+                    imgUrl: '/images/null-picture.png',
                     preview: []
                 }, {
                     title: '平均气温',
                     imgName: 'TFLD_T2',
-                    imgUrl: '',
+                    imgUrl: '/images/null-picture.png',
                     preview: []
                 }, {
                     title: '最低温度',
                     imgName: 'TFLD_TN',
-                    imgUrl: '',
+                    imgUrl: '/images/null-picture.png',
                     preview: []
                 }, {
                     title: '最高温度',
                     imgName: 'TFLD_TX',
-                    imgUrl: '',
+                    imgUrl: '/images/null-picture.png',
                     preview: []
                 }],
                 indicatorImg: '/images/decision-support/pollution-indicator/pollution-indicator.png',
@@ -128,18 +132,15 @@
             }
 
             const initImage = (type, imgName, index) => {
-                var xhr = new XMLHttpRequest();
-                xhr.responseType = 'arraybuffer';
-                xhr.open('GET', DecisionSupportConfig.getUrl(type, imgName));
-                xhr.onload = function (e) {
-                    let tiff = new Tiff({buffer: xhr.response});
-                    let canvas = tiff.toCanvas();
-                    let image = new Image();
-                    image.src = canvas.toDataURL("image/png");
-                    options.items[index].imgUrl = image.src;
-                    options.items[index].preview = [image.src];
-                };
-                xhr.send();
+                post("/image/convert", {url: DecisionSupportConfig.getUrl(type, imgName)}).then((response: any) => {
+                    if (response.error != 0){
+                        console.log("发生错误")
+                        return;
+                    }
+
+                    options.items[index].imgUrl = response.data;
+                    options.items[index].preview = [response.data];
+                })
             }
 
             return {
@@ -176,6 +177,10 @@
                         .el-image {
                             height: calc(~"100% - 0.4rem");
                             margin-top: 0.1rem;
+                            display: flex;
+                            flex-direction: column;
+                            align-items: center;
+                            justify-content: center;
                         }
                     }
                 }

04.系统编码/Frontend/src/components/MicrowaveRadiation.vue

@@ -74,7 +74,7 @@
             <div class="picture-view">
                 <span class="arrow arrow-prev" @click="onPrevImgClick"><img src="/images/prev-btn.png" /></span>
                 <span class="arrow arrow-next" @click="onNextImgClick"><img src="/images/next-btn.png" /></span>
-                <span class="save-btn"><img src="/images/save.png" /></span>
+                <a href="/images/picture1.png" download class="save-btn"><img src="/images/save.png" /></a>
                 <div class="picture-container">
                     <h2 class="title">{{title}}</h2>
                     <div class="picture">
@@ -90,6 +90,9 @@
                                 </div>
                                 <p class="image-tip">暂无图片</p>
                             </template>
+                            <template #placeholder>
+                                <div class="image-placeholder">正在加载...</div>
+                            </template>
                         </el-image>
                     </div>
                 </div>
@@ -118,7 +121,7 @@
                 hours: [],
                 times: [],
                 currentTime: null,
-                imgUrl: null,
+                imgUrl: '/images/null-picture.png',
                 srcList: [],
                 isPlay: false,
                 title: null,

04.系统编码/Frontend/src/components/RamanLidar.vue

@@ -71,6 +71,9 @@
                                 </div>
                                 <p class="image-tip">暂无图片</p>
                             </template>
+                            <template #placeholder>
+                                <div class="image-placeholder">正在加载...</div>
+                            </template>
                         </el-image>
                     </div>
                 </div>
@@ -97,7 +100,7 @@
                 hours: [],
                 times: [],
                 currentTime: null,
-                imgUrl: null,
+                imgUrl: '/images/null-picture.png',
                 srcList: [],
                 isPlay: false,
                 title: null,

04.系统编码/Frontend/src/components/Shared/Header.vue

@@ -5,46 +5,56 @@
             南京生态环境评估决策平台
         </div>
         <div class="nav">
-            <div class="nav-item" @click="onNavClick('MicrowaveRadiation')" :class="{'active': currentPath === 'MicrowaveRadiation'}">微波辐射计</div>
-            <div class="nav-item" @click="onNavClick('RamanLidar')" :class="{'active': currentPath === 'RamanLidar'}">拉曼激光雷达</div>
-            <div class="nav-item" @click="onNavClick('SynergyEvaluation')" :class="{'active': currentPath === 'SynergyEvaluation'}">生态环境效应评估</div>
-            <div class="nav-item" @click="onNavClick('DecisionSupport')" :class="{'active': currentPath === 'DecisionSupport'}">决策支持</div>
-            <div class="nav-item" @click="onNavClick('SystemManagement')" :class="{'active': currentPath === 'SystemManagement'}">系统管理</div>
+            <div class="nav-item">
+                <router-link to="/MicrowaveRadiation">微波辐射计</router-link>
+            </div>
+            <div class="nav-item">
+                <router-link to="/RamanLidar">拉曼激光雷达</router-link>
+            </div>
+            <div class="nav-item">
+                <router-link to="/SynergyEvaluation">生态环境效应评估</router-link>
+            </div>
+            <div class="nav-item">
+                <router-link to="/DecisionSupport">决策支持</router-link>
+            </div>
+            <div class="nav-item">
+                <router-link to="/SystemManagement">系统管理</router-link>
+            </div>
         </div>
-
           <span @click="Logout">退出登录</span>
     </div>
 </template>
 
 <script lang="ts">
+
     import { reactive, onMounted, toRefs } from "vue";
     import { useRouter } from 'vue-router';
     import { clear } from "../../uilts/storage";
 
     export default {
-        name: 'Header',
-        setup() {
-            const router = useRouter();
-            let options = reactive({
-                currentPath: 'MicrowaveRadiation'
-            })
+      name: 'Header',
+      setup() {
+        const router = useRouter();
+        let options = reactive({
+          currentPath: 'MicrowaveRadiation'
+        })
 
-            const onNavClick = (path) => {
-                options.currentPath = path;
-                router.push({path: path});
-            }
+        const onNavClick = (path) => {
+          options.currentPath = path;
+          router.push({path: path});
+        }
 
-            const Logout = () => {
-              clear()
-              router.replace('/Login')
-            }
+        const Logout = () => {
+          clear()
+          router.replace('/Login')
+        }
 
-            return {
-                ...toRefs(options),
-                onNavClick,
-              Logout
-            }
+        return {
+          ...toRefs(options),
+          onNavClick,
+          Logout
         }
+      }
     }
 </script>
 
@@ -87,14 +97,19 @@
                 text-align: center;
                 cursor: pointer;
 
+                a {
+                    height: 100%;
+                    color: #ffffff;
+                }
+
                 &:nth-of-type(3) {
                     width: 2.3rem;
-                    &.active {
+                    .active {
                         background: url("/images/nav-bg-big.png") no-repeat center/cover;
                     }
                 }
-                &.active {
-                    color: #ffffff;
+                .active {
+                    color: #23FBFF;
                     background: url("/images/nav-bg.png") no-repeat center/cover;
                 }
             }

04.系统编码/Frontend/src/components/SynergyEvaluation.vue

@@ -99,6 +99,9 @@
                                 </div>
                                 <p class="image-tip">暂无图片</p>
                             </template>
+                            <template #placeholder>
+                                <div class="image-placeholder">正在加载...</div>
+                            </template>
                         </el-image>
                     </el-col>
                 </el-row>
@@ -112,12 +115,15 @@
                         :initial-index="0"
                         fit="contain"
                         >
-                        <template #error>
+                            <template #error>
                                 <div class="image-slot">
                                     <img src="/images/null-picture.png" />
                                 </div>
                                 <p class="image-tip">暂无图片</p>
                             </template>
+                            <template #placeholder>
+                                <div class="image-placeholder">正在加载...</div>
+                            </template>
                         </el-image>
                     </el-col>
                 </el-row>
@@ -131,6 +137,7 @@
     import { format } from '../uilts/String';
     import * as Tiff from 'browser-tiff.js';
     import { SynergyEvaluationConfig } from '../uilts/Config';
+import { post } from '../uilts/axios';
     
     export default {
         name: 'SynergyEvaluation',
@@ -143,7 +150,7 @@
                 currentYear: '2000',
                 currentSurfaceTemperatureTime: 'time0130',
                 srcList: [],
-                imgUrl: null,
+                imgUrl: '/images/null-picture.png',
                 imgUrls: [],
                 items: [{
                     title: '地表温度（01:30）',
@@ -238,18 +245,15 @@
             }
 
             const initImage = (tabName, elementName, type, index, values) => {
-                var xhr = new XMLHttpRequest();
-                xhr.responseType = 'arraybuffer';
-                xhr.open('GET', SynergyEvaluationConfig.getUrl(tabName, elementName, type));
-                xhr.onload = function (e) {
-                    let tiff = new Tiff({buffer: xhr.response});
-                    let canvas = tiff.toCanvas();
-                    let image = new Image();
-                    image.src = canvas.toDataURL("image/png");
-                    values[index].imgUrl = image.src;
-                    values[index].preview = [image.src];
-                };
-                xhr.send();
+                post("/image/convert", {url: SynergyEvaluationConfig.getUrl(tabName, elementName, type)}).then((response: any) => {
+                    if (response.error != 0){
+                        console.log("发生错误")
+                        return;
+                    }
+
+                    values[index].imgUrl = response.data;
+                    values[index].preview = [response.data];
+                })
             }
             
             const onTabClick = (name) => {
@@ -324,6 +328,14 @@
                         .el-image {
                             height: calc(~"100% - 0.4rem");
                             margin-top: 0.1rem;
+                            display: flex;
+                            flex-direction: column;
+                            justify-content: center;
+                            align-items: center;
+                            background-color: #ffffff;
+                            .image-slot {
+                                margin-top: 0;
+                            }
                         }
                     }
                 }
@@ -342,6 +354,7 @@
                             display: flex;
                             align-items: center;
                             flex-direction: column;
+                            justify-content: center;
                         }
 
                         &:nth-of-type(6n) {

04.系统编码/Frontend/src/components/SystemManagement.vue

@@ -393,3 +393,4 @@ export default {
   color: #498DF0;
 }
 </style>
+

04.系统编码/Frontend/src/index.less

@@ -401,6 +401,10 @@ img {
                 .el-image {
                     height: 90%;
                     margin: 0 auto;
+                    display: flex;
+                    flex-direction: column;
+                    align-items: center;
+                    justify-content: center;
 
                     .el-image__inner {
                         width: auto;
@@ -418,7 +422,6 @@ img {
         .image-slot {
             width: 1.5rem;
             height: 1.5rem;
-            margin: 1rem auto 0 auto;
             text-align: center;
             display: flex;
             align-items: center;

04.系统编码/Frontend/src/uilts/Config.ts

@@ -1,8 +1,8 @@
 import { Moment } from "moment";
-import { format } from "../uilts/String";
+import { format } from "./String";
 
 export class Config {
-    public static parentUrl: string = "http://112.124.40.88:8890/product/picture";
+    public static parentUrl: string = "http://112.124.40.88:8002/product/picture";
 }
 
 export class MicrowaveRadiationConfig {
@@ -21,13 +21,15 @@ export class RamanLidarConfig {
 }
 
 export class SynergyEvaluationConfig {
+    private static url: string = Config.parentUrl + "/images";
     public static getUrl(tabName: string, elementName: string, type: string): string {
-        return format('/images/ecological-environment/{0}/{1}/{2}.tif', tabName, elementName, type)
+        return format('{3}/ecological-environment/{0}/{1}/{2}.tif', tabName, elementName, type, this.url);
     }
 }
 
 export class DecisionSupportConfig {
+    private static url: string = Config.parentUrl + "/images";
     public static getUrl(productName: string, imgName: string): string {
-        return format('/images/decision-support/{0}/{1}.tif', productName, imgName)
+        return format('{2}/decision-support/{0}/{1}.tif', productName, imgName, this.url);
     }
 }

04.系统编码/Frontend/src/uilts/axios.ts

@@ -5,7 +5,8 @@ import { ElLoading } from 'element-plus'
 
 let loading = null;
 const service = axios.create({
-    baseURL:"http://localhost:8001",
+    baseURL:"http://localhost:8002",
+    // baseURL:"",
     timeout: 500000
 })