1、前端主页修改，清空每日一句，移到翻译管理模块

2022-01-17 16:25:50 +08:00 · 2022-01-17 16:25:50 +08:00 · 9517158900
parent b898b9feb1
commit 9517158900
6 changed files with 164 additions and 166 deletions
--- a/ruoyi-ui/src/api/business/openapi/aword.js
+++ b/ruoyi-ui/src/api/business/openapi/aword.js
@ -25,3 +25,13 @@ export function delAword(id) {
    method: 'delete'
  })
 }
+
+// 查询英语单词列表
+export function getApiAWord(query) {
+  return request({
+    url: '/openapi/aword/',
+    method: 'get',
+    params: query
+  })
+}
+
--- a/ruoyi-ui/src/api/index.js
+++ b/ruoyi-ui/src/api/index.js
@ -3,11 +3,3 @@
 import request from '@/utils/request'


-// 查询英语单词列表
-export function getApiAWord(query) {
-  return request({
-    url: '/openapi/aword/',
-    method: 'get',
-    params: query
-  })
-}
--- a/ruoyi-ui/src/layout/components/Navbar.vue
+++ b/ruoyi-ui/src/layout/components/Navbar.vue
@ -13,8 +13,9 @@
      <el-popover
        placement="top"
        width="400"
+        title="❉预报天气❉"
        v-model="weatherVisible">
-        <table style="text-align: center">
+        <table style="text-align: center" v-loading="loading">
          <td v-for="(cast,index) in forecastWeatherData.casts" width="100px">
            <tr>{{cast.dayweather}}</tr>
            <tr>
@ -149,6 +150,9 @@ export default {

  data() {
    return {
+      // 遮罩层
+      loading: false,
+
      //预警数据
      warnData: {},

@ -205,9 +209,10 @@ export default {
  methods: {
    //获取预报天气
    getForecastWeather() {
-      console.log("点击了")
+      this.loading = true;
      getForecastWeather().then(res => {
        this.forecastWeatherData = res.data
+        this.loading = false;
      })

    },
--- a/ruoyi-ui/src/views/business/openapi/translation/index.vue
+++ b/ruoyi-ui/src/views/business/openapi/translation/index.vue
@ -2,19 +2,20 @@
  <div class="app-container">
    <el-row>
      <el-col :span="24" v-loading="loading1">
-          <div class="grid-content bg-purple" style="height: 180px">
-              <!--          文案内容区域-->
-              <!--          内容-->
-              <div class="content_div">
-                {{responseCopyWriting.content}}
-              </div>
-              <!--          来源-->
-              <div class="source_div">
-                {{responseCopyWriting.source}}
-              </div>
+        <div class="grid-content bg-purple" style="height: 180px">
+          <!--          文案内容区域-->
+          <!--          内容-->
+          <div class="content_div">
+            {{ responseCopyWriting.content }}
          </div>
+          <!--          来源-->
+          <div class="source_div">
+            {{ responseCopyWriting.source }}
+          </div>
+        </div>
      </el-col>
    </el-row>
+
    <el-row :gutter="20">
      <el-col :span="12">
        <!--        翻译区域-->
@ -38,7 +39,7 @@
                  </el-select>
                </el-form-item>
              </el-col>
-              <el-col :span="20" >
+              <el-col :span="20">
                <el-form-item label="翻译区域" prop="q">
                  <el-input v-model="translationData.q" type="textarea" placeholder="请输入翻译内容" show-word-limit
                            :autosize="{minRows: 4, maxRows: 4}" :style="{width: '100%'}"></el-input>
@ -65,14 +66,51 @@
      </el-col>
    </el-row>

+    <el-row :gutter="0">
+      <el-col :span="24" v-loading="loading3"></el-col>
+      <div class="aword">
+        <div class="div1">
+          <el-image
+            style="width: 120px; height: 148px"
+            :src=apiAWord.imgurl
+            :preview-src-list=[apiAWord.imgurl]
+          >
+          </el-image>
+        </div>
+
+        <div class="div2 div23">
+          <audio :src=apiAWord.tts controls="controls">
+            您的浏览器不支持 audio 标签。
+          </audio>
+        </div>
+
+        <div class="div3 div23 div34" style="margin-left: 0px">
+          <p>
+            {{apiAWord.content}}
+          </p>
+        </div>
+
+        <div class="div4 div34">
+          <p>
+            {{apiAWord.note}}
+          </p>
+        </div>
+      </div>
+
+    </el-row>
+

  </div>
 </template>

 <script>
-import {translation,getCopyWriting} from "@/api/business/openapi/translation";
+import {translation, getCopyWriting} from "@/api/business/openapi/translation";
+
+import {getApiAWord} from "@/api/business/openapi/aword";
+import Aword from "@/views/business/openapi/aword";

 export default {
+  components: {Aword},
  dicts: ['translation_type'],
  name: "Log",
  data() {
@ -80,6 +118,15 @@ export default {
      // 遮罩层
      loading1: true,
      loading2: false,
+      loading3: false,
+
+      //响应数据
+      apiAWord: {},
+
+      //apiAWord请求参数
+      apiAWordParams: {
+        rand: 1
+      },

      //翻译响应数据
      responseTranslation: '',
@ -90,10 +137,10 @@ export default {
      },

      //文案参数
-      copyWriting:[],
+      copyWriting: [],

      //文案响应数据
-      responseCopyWriting:{},
+      responseCopyWriting: {},

      translationRules: {
        translationType: [{
@ -103,10 +150,10 @@ export default {
        }],
        q: [
          {
-          required: true,
-          message: '请输入翻译内容',
-          trigger: 'blur'
-        },
+            required: true,
+            message: '请输入翻译内容',
+            trigger: 'blur'
+          },
          {
            min: 1,
            max: 120,
@ -119,13 +166,21 @@ export default {
  },
  created() {
    this.getCopyWriting()
+    this.getApiAWord()
  },
  methods: {
+    //随机获取一条每日一句
+    getApiAWord() {
+      getApiAWord(this.apiAWordParams).then(res => {
+        this.apiAWord = res.data
+      })
+    },
+
    //获取文案
    getCopyWriting() {
      this.loading1 = true;
-      getCopyWriting(this.copyWriting).then(res =>{
-        this.responseCopyWriting=res.data
+      getCopyWriting(this.copyWriting).then(res => {
+        this.responseCopyWriting = res.data
        this.loading1 = false;
      })
    },
@ -155,6 +210,44 @@ export default {
 </script>

 <style scoped>
+.aword div {
+  float: left;
+  width: 24%;
+  height: 100%;
+}
+
+.aword .div1 {
+  padding-left: 110px;
+}
+.aword .div2 {
+  padding: 50px 0px;
+}
+
+.aword .div23{
+  margin: 0 18px;
+}
+
+.aword .div34{
+  text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+}
+
+.aword {
+  box-shadow: 0 0 9px 3px #999;
+  font-style: italic;
+  height: 200px;
+  font-family: Georgia;
+  border-radius: 4px;
+  margin-top: 20px;
+
+  padding: 25px;
+  min-height: 36px;
+
+}
+
 .bg-purple {
  box-shadow: 0 0 9px 3px #999;
 }
@ -162,15 +255,15 @@ export default {
 .grid-content {
  border-radius: 4px;
  min-height: 36px;
-  height: 500px;
-  margin-top: 20px;
-  padding: 50px;
+  height: 360px;
+  margin-top: 15px;
+  padding: 25px;
 }

 .spans {
-  margin: 50px;
-  margin-top: 40px;
-  padding: 50px;
+  margin: 25px;
+  margin-top: 5px;
+  padding: 30px;
  font-family: Georgia;
  font-size: 20px;
  height: 300px;
@ -178,17 +271,18 @@ export default {
  font-style: italic;
 }

-.content_div{
+.content_div {
  float: left;
  width: 75%;
  text-shadow: 2px 2px 2px grey;
 }
-.source_div{
+
+.source_div {
  float: left;
-  padding-top: 70px;
+  padding-top: 100px;
  width: 25%;
  text-shadow: 2px 2px 2px grey;
-  text-align :right
+  text-align: right
 }

 </style>
--- a/ruoyi-ui/src/views/index.vue
+++ b/ruoyi-ui/src/views/index.vue
@ -1,75 +1,27 @@
 <template>
  <div>

-    <el-row :gutter="20">
-      <el-col :span="12">
-        <div class="grid-content bg-purple">
-          <!--每日一句-->
-          <div class="box-card">
-            <div class="aWordImage">
-              <el-image
-                class="aWordImage"
-                :src=apiAWord.imgurl
-                :preview-src-list=[apiAWord.imgurl]>
-              </el-image>
-            </div>
-            <div class="aWordAudio">
-              <audio :src=apiAWord.tts controls="controls">
-                您的浏览器不支持 audio 标签。
-              </audio>
-            </div>
-            <div class="aWordContent">
-              <span>{{ apiAWord.content }}</span>
-            </div>
-            <div class="aWordNote">
-              <span>{{ apiAWord.note }}</span>
-            </div>
-          </div>
-        </div>
-      </el-col>

-      <!--todo 天气预报    -->
-      <el-col :span="12">
-        <div class="grid-content bg-purple">
-
-        </div>
-      </el-col>
-    </el-row>
-
-    <el-row :gutter="20">
-    </el-row>
  </div>
 </template>

 <script>

-import {getApiAWord} from "@/api/index";

 export default {
  name: "Index",
  data() {
    return {
-      //响应数据
-      apiAWord: {},

-      //apiAWord请求参数
-      apiAWordParams: {
-        rand: 1
-      }
    };
  },

  created() {
-    this.getApiAWord();
+
  },

  methods: {
-    //随机获取一条每日一句
-    getApiAWord() {
-      getApiAWord(this.apiAWordParams).then(res => {
-        this.apiAWord = res.data
-      })
-    },
+
  },

 };
@ -77,65 +29,6 @@ export default {

 <style scoped lang="scss">

-.bg-purple {
-  background: #d3dce6;
-}
-
-.grid-content {
-  border-radius: 4px;
-  min-height: 36px;
-  height: 141px;
-}
-
-.box-card {
-  width: 744px;
-  background-color: #f2f2f2;
-  height: 141px;
-}
-
-.box-card div {
-  float: left;
-}
-
-
-.aWordImage {
-  float: left;
-  width: 108px;
-  height: 141px;
-}
-
-.aWordAudio {
-  float: left;
-  height: 141px;
-  width: 300px;
-  /*flex 布局*/
-  display: flex;
-  /*实现垂直居中*/
-  align-items: center;
-  /*实现水平居中*/
-  justify-content: center;
-}
-
-.aWordContent {
-  float: left;
-  width: 168px;
-  height: 141px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  text-align: center;
-  overflow:hidden;
-}
-
-.aWordNote {
-  width: 168px;
-  height: 141px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  float: left;
-  overflow:hidden;
-}

 </style>

--- a/xjs-business/xjs-business-openapi/src/main/java/com/xjs/common/aop/ApiLogAspect.java
+++ b/xjs-business/xjs-business-openapi/src/main/java/com/xjs/common/aop/ApiLogAspect.java
@ -32,9 +32,10 @@ import java.util.Objects;
 import static com.xjs.consts.ApiWarnHandleConst.NO;

 /**
+ * api日志切面类
+ *
 * @author xiejs
- * @desc  api日志切面类
- * @create 2021-12-26
+ * @since 2021-12-26
 */
@Component
@Aspect
@ -44,7 +45,9 @@ public class ApiLogAspect {
    @Autowired
    private RemoteLogFeign remoteLogFeign;

-    //用来调用预警，记录预警信息
+    /**
+     * 用来调用预警，记录预警信息
+     */
    @Autowired
    private RemoteWarningCRUDFeign remoteWarningCRUDFeign;

@ -77,6 +80,7 @@ public class ApiLogAspect {

    /**
     * 处理完请求后执行
+     *
     * @param joinPoint 切点
     */
    @AfterReturning(pointcut = "@annotation(apiLog)", returning = "jsonResult")
@ -87,9 +91,10 @@ public class ApiLogAspect {

    /**
     * 异常切点
+     *
     * @param joinPoint 连接点
-     * @param apiLog 自定义注解
-     * @param e 抛出的异常
+     * @param apiLog    自定义注解
+     * @param e         抛出的异常
     */
    @AfterThrowing(value = "@annotation(apiLog)", throwing = "e")
    public void doAfterThrowing(JoinPoint joinPoint, ApiLog apiLog, Exception e) {
@ -110,7 +115,7 @@ public class ApiLogAspect {
            //判断最后一位
            if (i == args.length - 1) {
                builder.append(json);
-            }else {
+            } else {
                builder.append(json + ",");
            }
        }
@ -122,15 +127,16 @@ public class ApiLogAspect {
        }
        if (e != null) {
            entity.setIsSuccess(ReqConst.ERROR);
-        }else {
+        } else {
            entity.setIsSuccess(ReqConst.SUCCESS);
        }
        remoteLogFeign.saveApiLog(entity);
    }

    /**
-     *  预警切入
-     * @param between api接口调用时间
+     * 预警切入
+     *
+     * @param between   api接口调用时间
     * @param joinPoint aop连接对象
     */
    private void warning(long between, ProceedingJoinPoint joinPoint) {
@ -161,13 +167,13 @@ public class ApiLogAspect {
                                apiRecord.setTotalCount(1L);
                                apiRecord.setDayCount(1L);
                                remoteWarningCRUDFeign.saveApiRecordForRPC(apiRecord);
-                            }else {
+                            } else {
                                ApiRecord haveApiRecord = data.get(0);

                                haveApiRecord.setRequestTime((int) between);
-                                haveApiRecord.setTotalCount(haveApiRecord.getTotalCount()+1L);
+                                haveApiRecord.setTotalCount(haveApiRecord.getTotalCount() + 1L);
                                //统计当前的请求次数，隔天清零
-                                haveApiRecord.setDayCount(haveApiRecord.getDayCount()+1L);
+                                haveApiRecord.setDayCount(haveApiRecord.getDayCount() + 1L);
                                Date updateTime = haveApiRecord.getUpdateTime();
                                String dateTime = DateUtil.formatDateTime(updateTime);
                                Date date = DateUtil.parseDate(dateTime).toJdkDate();
@ -180,7 +186,7 @@ public class ApiLogAspect {
                                haveApiRecord.setUpdateTime(null);
                                remoteWarningCRUDFeign.updateApiRecordForRPC(haveApiRecord);
                                //判断接口请求是否超过阈值
-                                if(Objects.nonNull(haveApiRecord.getLimitCount())){
+                                if (Objects.nonNull(haveApiRecord.getLimitCount())) {
                                    if (haveApiRecord.getDayCount() > haveApiRecord.getLimitCount()) {
                                        //把记录添加到预警表中
                                        ApiWarning apiWarning = new ApiWarning();
@ -189,8 +195,8 @@ public class ApiLogAspect {
                                        apiWarning.setApiName(haveApiRecord.getApiName());
                                        apiWarning.setHandle(NO);
                                        apiWarning.setWarningLevel(WarnLevelEnum.NOEMAL.getMessage());
-                                        if(haveApiRecord.getDayCount()>haveApiRecord.getLimitCount()*2 &&
-                                                haveApiRecord.getDayCount() < haveApiRecord.getLimitCount() * 3){
+                                        if (haveApiRecord.getDayCount() > haveApiRecord.getLimitCount() * 2 &&
+                                                haveApiRecord.getDayCount() < haveApiRecord.getLimitCount() * 3) {
                                            apiWarning.setWarningLevel(WarnLevelEnum.WARNING.getMessage());
                                        } else if (haveApiRecord.getDayCount() > haveApiRecord.getLimitCount() * 3) {
                                            apiWarning.setWarningLevel(WarnLevelEnum.DANGER.getMessage());
@ -202,8 +208,6 @@ public class ApiLogAspect {
                                                haveApiRecord.getDayCount());
                                        apiWarning.setWarningMessage(message);
                                        remoteWarningCRUDFeign.saveApiWarningForRPC(apiWarning);
-
-                                        // todo websocket实现即时推送到客户端
                                    }
                                }
                            }