111

src/request/index.js

@@ -1,21 +1,7 @@
 import { httpApi } from './httpApi'
 
-//page
-export const page = (form= {}) => httpApi({
-    url: '/api/blade-manager/appVersion/page',
-    method: 'get',
-    params: form,
-})
-
-//detail
-export const detail = (form= {}) => httpApi({
-    url: '/api/blade-manager/appVersionDetail/page',
-    method: 'get',
-    params: form,
-})
-
 //获取最新版本
-export const version = (form= {}) => httpApi({
+export const getNewVersion = (form= {}) => httpApi({
     url: '/api/blade-manager/appVersionDetail/getNewVersion',
     method: 'get',
     params: form,

src/views/app.vue

@@ -11,47 +11,101 @@
                 </div>
                 <div class="title-box">
                     <div class="name">工程云家</div>
-                    <div class="version">当前版本：1.0.0</div>
-                    <div class="time">更新时间：2023-04-23</div>
+                    <div class="version">当前版本：{{androidInfo.versionNumber}}</div>
+                    <div class="time">更新时间：{{androidInfo.updateTime}}</div>
                 </div>
             </div>
-            <div class="app-img hc-flex-center">
+            <div class="app-img hc-flex-center" v-if="isPcType === 'mobile'">
                 <img :src="appImg" alt="">
             </div>
             <div class="app-btn">
-                <el-row :gutter="20">
+                <template v-if="isPcType === 'pc'">
+                    <el-button type="success" @click="downloadAndroid">
+                        <i class="i-ic-baseline-android"/>
+                        <span class="ml-1">下载安卓APP</span>
+                    </el-button>
+                    <el-button type="success" @click="downloadApple">
+                        <i class="i-ic-baseline-apple"/>
+                        <span class="ml-1">下载苹果APP</span>
+                    </el-button>
+                </template>
+                <el-row :gutter="20" v-if="isPcType === 'mobile'">
                     <el-col :span="12">
-                        <el-button type="success">
+                        <el-button type="success" @click="downloadAndroid">
                             <i class="i-ic-baseline-android"/>
                             <span class="ml-1">下载安卓APP</span>
                         </el-button>
                     </el-col>
                     <el-col :span="12">
-                        <el-button type="success">
+                        <el-button type="success" @click="downloadApple">
                             <i class="i-ic-baseline-apple"/>
                             <span class="ml-1">下载苹果APP</span>
                         </el-button>
                     </el-col>
                 </el-row>
             </div>
-            <div class="h-100px"/>
+            <div class="h-100px" v-if="isPcType === 'mobile'"/>
         </div>
     </div>
 </template>
 
 <script setup>
-import {onMounted, onUnmounted} from "vue";
+import {onMounted, onUnmounted, ref} from "vue";
+import {getNewVersion} from "~src/request/index";
 import bgImg from '~src/assets/archives/topHead.png'
 import companyName from '~src/assets/index/companyName.png'
 import appIcon from '~src/assets/index/app-icon.png'
 import appImg from '~src/assets/index/1242_2208.png'
+import {getObjValue, isNullES, newWindow} from "js-fast-way";
+import { ElMessage } from 'element-plus'
 
 //渲染完成
+const isPcType = ref('mobile')
 onMounted(() => {
     const dom = document.documentElement
+    isPcType.value = `${dom.offsetWidth > 700 ?'pc':'mobile'}`
     dom.setAttribute('class', `${dom.offsetWidth > 700 ?'hc-app-pc':'hc-app-mobile'}`)
+    getApiData()
 })
 
+//获取接口数据
+const androidInfo = ref({})
+const appleInfo = ref({})
+const getApiData = async () => {
+    androidInfo.value = await getAppInfo(1) //安卓
+    appleInfo.value = await getAppInfo(2) //ios
+}
+
+//获取APP数据
+const getAppInfo = async (type) => {
+    const { data } = await getNewVersion({
+        softwareType: type,
+        fileType: 0,
+        platform: 'client',
+    })
+    return getObjValue(data)
+}
+
+//下载安卓APP
+const downloadAndroid = () => {
+    const info = androidInfo.value
+    if (isNullES(info.fileUrl)) {
+        ElMessage.warning('系统维护中，请稍后再试')
+        return
+    }
+    newWindow(info.fileUrl)
+}
+
+//下载苹果APP
+const downloadApple = () => {
+    const info = appleInfo.value
+    if (isNullES(info.fileUrl)) {
+        ElMessage.warning('系统维护中，请稍后再试')
+        return
+    }
+    newWindow(info.fileUrl)
+}
+
 //页面卸载
 onUnmounted(() => {
     document.documentElement.removeAttribute('class')
@@ -133,4 +187,22 @@ html.hc-app-mobile body #app {
         }
     }
 }
+.hc-app-pc .hc-app-body .app-body {
+    width: 350px;
+    margin: auto;
+    .app-title {
+        margin-top: 40%;
+    }
+    .app-btn {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        .el-button {
+            width: auto;
+        }
+        .el-button + .el-button {
+            margin-left: 24px;
+        }
+    }
+}
 </style>