|
|
@@ -1,149 +1,177 @@
|
|
|
<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="patchStatus" direction="horizontal" shape="dot">
|
|
|
- <van-radio name="0">停止</van-radio>
|
|
|
- <van-radio name="1">发布</van-radio>
|
|
|
- </van-radio-group>
|
|
|
- </template>
|
|
|
- </van-field>
|
|
|
+ <div class="hotUpdate">
|
|
|
+ <!-- <div class="hotUpdate" style="background-color: #ebedf0;"> -->
|
|
|
+ <s-header name="热更新" :noback="true"></s-header>
|
|
|
|
|
|
- <!-- 补丁目标区域：国内/海外 -->
|
|
|
- <van-field name="checkboxGroup" label="推送区域：">
|
|
|
- <template #input>
|
|
|
- <van-checkbox-group v-model="targetAreasBlock" 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" maxlength="230" show-word-limit />
|
|
|
- <!-- 补丁更新内容note -->
|
|
|
- <van-field v-model="note" name="note" label="更新内容：" placeholder="补丁更新内容(选填)" clearable rows="2" autosize
|
|
|
- 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 class="headCon l-flex-between o-plr-20 o-pt-26 o-pb-12 kBordBott">
|
|
|
+ <div class="l-flex-RC">
|
|
|
+ <!-- <img class="ruleIcon o-mr-10" src="@/assets/advertManage/ruleIcon.png" alt="" /> -->
|
|
|
+ <div class="ruleIcon"></div>
|
|
|
+ <div class="c-text-color c-text-b c-text-15">
|
|
|
+ 共
|
|
|
+ <span class="c-text-20" style="color: #df5e4c">{{ patchTotal }}</span>
|
|
|
+ 条记录
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="l-flex-RC">
|
|
|
+ <div @click="toAdd" class="c-text-c">
|
|
|
+ <div>
|
|
|
+ <van-icon size="18" name="add-o" />
|
|
|
+ </div>
|
|
|
+ <div class="c-text-color c-text-12">
|
|
|
+ 添加
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </van-form>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- 补丁信息列表 -->
|
|
|
+ <div class="contentCon">
|
|
|
+ <van-pull-refresh disabled v-model="refreshing" @refresh="onRefresh">
|
|
|
+ <van-list v-model="loading" :finished="finished" :finished-text="$t('common.noMoreTxt')" @load="onLoad"
|
|
|
+ :offset="20" :immediate-check="false">
|
|
|
+ <div v-for="item in tableData" :key="item.id"
|
|
|
+ class="o-plr-20 o-pt-24 o-pb-12 l-flex-between kBordBott content">
|
|
|
+ <div>
|
|
|
+ <div class="l-flex-RC">
|
|
|
+ <span class="c-color c-text-12">原版本号：</span>
|
|
|
+ <span class="c-text-color c-text-12">{{ item.originalVersion }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="l-flex-RC">
|
|
|
+ <span class="c-color c-text-12">目标补丁版本：</span>
|
|
|
+ <span class="c-text-color c-text-12">{{ item.patchVersion }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="l-flex-RC">
|
|
|
+ <span class="c-color c-text-12">更新范围：</span>
|
|
|
+ <span class="c-text-color c-text-12">{{ getTargetAreasText(item) }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="l-flex-RC">
|
|
|
+ <span class="c-color c-text-12">创建时间：</span>
|
|
|
+ <span class="c-text-color c-text-12">{{
|
|
|
+ Format_time(item.createTime)
|
|
|
+ }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="l-flex-RC">
|
|
|
+ <span class="c-color c-text-12">更新比例：</span>
|
|
|
+ <span class="c-text-color c-text-12">{{ item.haveUpdateNum }}/{{ item.shouldUpdateNum
|
|
|
+ }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </van-list>
|
|
|
+ </van-pull-refresh>
|
|
|
+ </div>
|
|
|
+
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import sHeader from "@/components/SimpleHeader";
|
|
|
-import { postPatchInfo } from "../../service/hotUpdate/index";
|
|
|
-import { watch } from "vue";
|
|
|
-import { ref } from "vue";
|
|
|
-import { showFailToast, showToast } from "vant";
|
|
|
+import { ref, onMounted, toRefs, reactive } from "vue";
|
|
|
+import { styleUrl } from "../../common/js/utils";
|
|
|
+import { useRouter } from "vue-router";
|
|
|
+import {
|
|
|
+ getPatchPage
|
|
|
+} from "@/service/hotUpdate";
|
|
|
+import { Format_time } from "@/common/js/utils";
|
|
|
+import { computed } from "vue";
|
|
|
|
|
|
export default {
|
|
|
components: { sHeader },
|
|
|
setup() {
|
|
|
|
|
|
- const patchVersion = ref(''); // 版本号
|
|
|
- const patchStatus = ref('0'); // 补丁状态: 停止('0') 发布('1')
|
|
|
- const targetAreasBlock = ref([]); // 目标区域数组
|
|
|
- const targetAreas = ref(''); // 目标区域
|
|
|
- const patchLink = ref(''); // 补丁外链
|
|
|
- const clientId = ref(''); // 设备编号
|
|
|
- const note = ref(''); // 更新内容
|
|
|
- const hasTargetAreas = ref(false); // 是否有目标区域
|
|
|
+ // const { t } = useI18n();
|
|
|
+ onMounted(() => {
|
|
|
+ // 加载样式
|
|
|
+ styleUrl('hotUpdate');
|
|
|
+ onRefresh();
|
|
|
+ });
|
|
|
|
|
|
- watch(targetAreasBlock, (newVal) => {
|
|
|
- hasTargetAreas.value = newVal.length > 0;
|
|
|
- if (hasTargetAreas.value) {
|
|
|
- clientId.value = ''; // 清空设备编号
|
|
|
+ // 多少条规则
|
|
|
+ const patchTotal = ref(0);
|
|
|
+ // 分页
|
|
|
+ const pageNo = ref(1);
|
|
|
+ const pageSize = ref(20);
|
|
|
+ let ruleData = reactive({
|
|
|
+ tableData: [],
|
|
|
+ });
|
|
|
+ // 上拉刷新
|
|
|
+ const loading = ref(true);
|
|
|
+ const finished = ref(false);
|
|
|
+ // 下拉刷新
|
|
|
+ const onRefresh = (idx) => {
|
|
|
+ ruleData.tableData = [];
|
|
|
+ // 解决请求两次问题
|
|
|
+ if (!idx) {
|
|
|
+ finished.value = false;
|
|
|
}
|
|
|
- })
|
|
|
+ loading.value = true;
|
|
|
+ // 初始化分页
|
|
|
+ pageNo.value = 1;
|
|
|
+ pageSize.value = 20;
|
|
|
+ getList();
|
|
|
+ };
|
|
|
|
|
|
- // 点击提交
|
|
|
- const onSubmit = async () => {
|
|
|
- if (targetAreasBlock.value.length === 0) {
|
|
|
- targetAreas.value = '0';
|
|
|
- } else if (targetAreasBlock.value.length === 1) {
|
|
|
- targetAreas.value = targetAreasBlock.value[0];
|
|
|
- } else {
|
|
|
- targetAreas.value = '3';
|
|
|
- }
|
|
|
- // console.log("targetAreas >>> ", targetAreas.value);
|
|
|
- const patchInfoCheck = {
|
|
|
- patchVersion: patchVersion.value,
|
|
|
- patchStatus: patchStatus.value,
|
|
|
- targetAreas: targetAreas.value,
|
|
|
- patchLink: patchLink.value,
|
|
|
- clientId: clientId.value,
|
|
|
- note: note.value
|
|
|
- }
|
|
|
- try {
|
|
|
- const { data } = await postPatchInfo(patchInfoCheck);
|
|
|
- if (data.code === '00000') {
|
|
|
- showToast('提交成功', 'success');
|
|
|
- } else {
|
|
|
- showFailToast(data.message);
|
|
|
+ // 上拉加载
|
|
|
+ const onLoad = () => {
|
|
|
+ pageNo.value++;
|
|
|
+ getList();
|
|
|
+
|
|
|
+ };
|
|
|
+ // 下拉刷新
|
|
|
+ const refreshing = ref(false);
|
|
|
+ const getList = () => {
|
|
|
+ let param = {
|
|
|
+ current: pageNo.value,
|
|
|
+ size: pageSize.value,
|
|
|
+ };
|
|
|
+ getPatchPage(param).then((res) => {
|
|
|
+ const { data } = res.data;
|
|
|
+ refreshing.value = false;
|
|
|
+ ruleData.tableData.push(...data.records);
|
|
|
+ // 加载状态结束
|
|
|
+ loading.value = false;
|
|
|
+ // 总共
|
|
|
+ patchTotal.value = data.total;
|
|
|
+ if (ruleData.tableData.length >= data.total) {
|
|
|
+ finished.value = true;
|
|
|
}
|
|
|
- // 提交成功后重置表单
|
|
|
- resetForm();
|
|
|
- } catch (error) {
|
|
|
- // 处理请求出错的情况
|
|
|
- showFailToast(error.response.data.error);
|
|
|
- }
|
|
|
+ });
|
|
|
+ };
|
|
|
|
|
|
- }
|
|
|
- const formData = ref({
|
|
|
- patchVersion: patchVersion.value,
|
|
|
- patchStatus: patchStatus.value,
|
|
|
- targetAreas: targetAreas.value,
|
|
|
- patchLink: patchLink.value,
|
|
|
- clientId: clientId.value,
|
|
|
- note: note.value
|
|
|
- })
|
|
|
- // 重置表单的方法
|
|
|
- const resetForm = () => {
|
|
|
- formData.value = {
|
|
|
- patchVersion: '',
|
|
|
- patchStatus: '',
|
|
|
- targetAreas: '',
|
|
|
- patchLink: '',
|
|
|
- clientId: '',
|
|
|
- note: ''
|
|
|
+ // 获取目标范围
|
|
|
+ const getTargetAreasText = computed(() => {
|
|
|
+ const targetAreas = {
|
|
|
+ '0': '部分设备',
|
|
|
+ '1': '国内设备',
|
|
|
+ '2': '海外设备',
|
|
|
+ '3': '全部设备',
|
|
|
};
|
|
|
+ return (item) => targetAreas[item.targetAreas] || '';
|
|
|
+ });
|
|
|
+
|
|
|
+ const router = useRouter();
|
|
|
+
|
|
|
+ // 点击添加按钮
|
|
|
+ const toAdd = () => {
|
|
|
+ router.push("/apkHotUpdateAdd");
|
|
|
};
|
|
|
+
|
|
|
return {
|
|
|
- onSubmit,
|
|
|
- patchVersion,
|
|
|
- patchStatus,
|
|
|
- targetAreasBlock,
|
|
|
- targetAreas,
|
|
|
- patchLink,
|
|
|
- clientId,
|
|
|
- note,
|
|
|
- hasTargetAreas
|
|
|
- }
|
|
|
+ patchTotal,
|
|
|
+ toAdd,
|
|
|
+ onRefresh,
|
|
|
+ onLoad,
|
|
|
+ getList,
|
|
|
+ loading,
|
|
|
+ finished,
|
|
|
+ ...toRefs(ruleData),
|
|
|
+ refreshing,
|
|
|
+ getTargetAreasText,
|
|
|
+ Format_time,
|
|
|
+ };
|
|
|
}
|
|
|
-}
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
-<style>
|
|
|
-.custom-button {
|
|
|
- width: 120px;
|
|
|
-}
|
|
|
-</style>
|
|
|
+<style lang="less" scoped></style>
|
