浏览器推荐版本弹框

src/App.vue

@@ -81,6 +81,7 @@
         >
       </div>
     </el-drawer>
+    <browserTip ref="browserTip" />
   </div>
 </template>
 
@@ -91,6 +92,7 @@ import {
 } from "@/api/dictionary/dictionary";
 import Vue from "vue";
 import i18n from "./lang";
+import browserTip from "@/views/dictionary/template/browser/tip.vue";
 export default {
   name: "App",
   data() {
@@ -102,9 +104,21 @@ export default {
       arr: [],
     };
   },
+  components: { browserTip },
   mounted() {
     this.show = process.env.VUE_APP_OSS_PATH === "/test/dist";
   },
+  watch: {
+    "$route.path": {
+      handler() {
+        if (this.$route.path === "/login") {
+          this.$refs.browserTip.open();
+        }
+      },
+      immediate: true,
+      deep: true,
+    },
+  },
   methods: {
     changeValue(target, attr, e) {
       this.$set(target, attr, e);
@@ -252,7 +266,7 @@ textarea {
 .title-logo {
   height: 40px;
 }
-.title-logo{
+.title-logo {
   height: 40px;
 }
 </style>

src/views/dictionary/template/browser/form.vue

@@ -124,6 +124,13 @@ export default {
       Object.keys(this.form).forEach((key) => {
         this.form[key] = this.data[key];
       });
+      if (this.form.FileName) {
+        this.fileList[0] = {
+          name: this.form.FileName,
+          path: this.form.Path,
+          fullPath: this.form.Path,
+        };
+      }
     }
   },
   methods: {

src/views/dictionary/template/browser/index.vue

@@ -63,7 +63,7 @@
       >
         <template slot-scope="scope">
           <a
-            :href="OSSclientConfig.basePath + scope.row.FullFilePath"
+            :href="OSSclientConfig.basePath + scope.row.Path"
             target="_blank"
             style="color: #428bca"
           >
@@ -139,7 +139,7 @@ const searchDataDefault = () => {
     Title: null,
     DownloadUrl: null,
     FileName: null,
-    IsDeleted: true,
+    IsDeleted: null,
     PageIndex: 1,
     PageSize: 20,
     Asc: false,

src/views/dictionary/template/browser/tip.vue

@@ -0,0 +1,83 @@
+<template>
+  <base-model :config="config">
+    <div slot="dialog-body">
+      <el-form ref="form" :model="form" label-width="100px" size="small">
+        <el-form-item
+          :label="$t('dictionary:browser:tip:form:title')"
+          prop="Title"
+        >
+          <span>{{ form.Title }}</span>
+        </el-form-item>
+        <el-form-item
+          :label="$t('dictionary:browser:tip:form:version')"
+          prop="Version"
+        >
+          <span>{{ form.Version }}</span>
+        </el-form-item>
+        <el-form-item
+          :label="$t('dictionary:browser:tip:form:downloadUrl')"
+          prop="DownloadUrl"
+        >
+          <a :href="form.DownloadUrl" target="_blank" style="color: #428bca">{{
+            form.DownloadUrl
+          }}</a>
+        </el-form-item>
+        <el-form-item prop="FileName">
+          <a
+            :href="OSSclientConfig.basePath + form.Path"
+            target="_blank"
+            style="color: #428bca"
+          >
+            {{ form.FileName }}
+          </a>
+        </el-form-item>
+      </el-form>
+    </div>
+  </base-model>
+</template>
+<script>
+import { getExploreRecommentInfo } from "@/api/dictionary";
+import baseModel from "@/components/BaseModel";
+export default {
+  name: "browserTip",
+  components: { baseModel },
+  data() {
+    return {
+      config: {
+        visible: false,
+        showClose: true,
+        width: "600px",
+        title: this.$t("dictionary:browser:tip:title"),
+        appendToBody: true,
+      },
+      form: {},
+    };
+  },
+  methods: {
+    async getInfo() {
+      try {
+        let res = await getExploreRecommentInfo();
+        if (res.IsSuccess) {
+          return res.Result;
+        }
+        return false;
+      } catch (err) {
+        console.log(err);
+        return false;
+      }
+    },
+    async open() {
+      try {
+        let res = await this.getInfo();
+        if (!res) return this.$t("dictionary:browser:tip:getError");
+        this.form = res;
+        this.config.visible = true;
+      } catch (err) {
+        console.log(err);
+      }
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+</style>