feat: 热更新-补丁版本录入

src/router/index.js

@@ -365,6 +365,13 @@ const router = createRouter({
       component: () => import("@/views/apkManage/add"),
       meta: { index: 1 },
     },
+    // apk热更新
+    {
+      path: "/apkHotUpdate",
+      name: "apkHotUpdate",
+      component: () => import("@/views/hotUpdate/index"),
+      meta: { index: 1 },
+    },
     // 报警历史
     {
       path: "/alarmHistory",

src/views/hotUpdate/index.vue

@@ -0,0 +1,97 @@
+<template>
+    <div class="hotUpdate" style="background-color: #ebedf0;">
+        <s-header :name="'热更新'" :noback="false"></s-header>
+        <br>
+        <van-form @submit="onSubmit">
+            <van-cell-group inset>
+                <!-- 版本号apkVersion，补丁状态，停止/发布，补丁是国内外，外链，选填clientId多个，灰度/全量，备注：更新内容 -->
+                <!-- 更新了xxx版本的设备有多少台 -->
+                <van-field v-model="patchVersion" name="版本号" label="版本号：" placeholder="补丁版本号" required clearable
+                    :rules="[{ required: true, message: '请输入补丁版本号' }]" />
+                <!-- 补丁状态：停止/发布 -->
+                <van-field name="radio" label="补丁状态：">
+                    <template #input>
+                        <van-radio-group v-model="checked" direction="horizontal" shape="dot">
+                            <van-radio name="0">停止</van-radio>
+                            <van-radio name="1">发布</van-radio>
+                        </van-radio-group>
+                    </template>
+                </van-field>
+
+                <!-- 补丁目标区域：国内/海外 -->
+                <van-field name="checkboxGroup" label="推送区域：">
+                    <template #input>
+                        <van-checkbox-group v-model="targetAreas" direction="horizontal">
+                            <van-checkbox name="1" shape="square">国内</van-checkbox>
+                            <van-checkbox name="2" shape="square">海外</van-checkbox>
+                        </van-checkbox-group>
+                    </template>
+                </van-field>
+                <!-- 补丁链接：外链 -->
+                <van-field v-model="patchLink" name="补丁外链" label="补丁外链：" placeholder="补丁外链" required clearable
+                    :rules="[{ required: true, message: '请填写补丁状态' }]" />
+                <!-- 选填clientId，填了就是灰度更新，不填就是全量更新 -->
+                <van-field v-model="clientId" rows="2" autosize name="clientId" label="设备编号：" type="textarea" clearable
+                    placeholder="选填clientId，使用','隔开" :disabled="hasTargetAreas" />
+                <!-- 补丁更新内容updateInfo -->
+                <van-field v-model="updateInfo" name="updateInfo" label="更新内容：" placeholder="补丁更新内容(选填)" clearable rows="2"
+                    autosize left-icon="edit" maxlength="50" show-word-limit type="textarea" />
+
+            </van-cell-group>
+            <br>
+            <div style="margin: 16px; display: flex; justify-content: center; align-items: center;">
+                <van-button round class="custom-button" type="primary" size="small" native-type="submit" block>
+                    提交
+                </van-button>
+            </div>
+        </van-form>
+    </div>
+</template>
+
+<script>
+import sHeader from "@/components/SimpleHeader";
+import { watch } from "vue";
+import { ref } from "vue";
+
+export default {
+    components: { sHeader },
+    setup() {
+
+        const patchVersion = ref(''); // 版本号
+        const checked = ref('0'); // 补丁状态: 停止('0') 发布('1')
+        const targetAreas = ref([]); // 目标区域
+        const patchLink = ref(''); // 补丁外链
+        const clientId = ref(''); // 设备编号
+        const updateInfo = ref(''); // 更新内容
+        const hasTargetAreas = ref(false); // 是否有目标区域
+
+        watch(targetAreas, (newVal) => {
+            hasTargetAreas.value = newVal.length > 0;
+            if (hasTargetAreas.value) {
+                clientId.value = ''; // 清空设备编号
+            }
+        })
+
+        // 点击提交
+        const onSubmit = async () => {
+
+        }
+        return {
+            onSubmit,
+            patchVersion,
+            checked,
+            targetAreas,
+            patchLink,
+            clientId,
+            updateInfo,
+            hasTargetAreas
+        }
+    }
+}
+</script>
+
+<style>
+.custom-button {
+    width: 120px;
+}
+</style>