提交修改

mock/role/index.mock.ts

@@ -36,11 +36,11 @@ const adminList = [
             }
           },
           {
-            path: 'version_client',
-            component: 'views/Version/VersionClient',
-            name: 'VersionClient',
+            path: 'version_hotUp',
+            component: 'views/Version/VersionHotUp',
+            name: 'VersionHotUp',
             meta: {
-              title: 'router.version_client',
+              title: 'router.version_hotUp',
               noCache: true
             }
           }

src/locales/en.ts

@@ -121,7 +121,7 @@ export default {
     version: 'Version',
     version_list: 'Version list',
     version_server: 'Backend version',
-    version_client: 'Frontend version',
+    version_HotUp: 'hotUp version',
     version_test: 'API test',
     level: 'Multi level menu',
     menu: 'Menu',
@@ -211,7 +211,7 @@ export default {
     allChannels: 'All channels',
     confirm: 'Confirm'
   },
-  version_client: {
+  version_hotUp: {
     proj: 'Project',
     os: 'Platform',
     packageUrl: 'Package URL',

src/locales/zh-CN.ts

@@ -122,7 +122,7 @@ export default {
     version: '版本管理',
     version_list: '版本列表',
     version_server: '后端版本',
-    version_client: '前端版本',
+    version_hotUp: '热更版本',
     version_test: '接口测试',
     channel: '渠道管理',
     channel_manage: '渠道列表',
@@ -275,9 +275,10 @@ export default {
     allChannels: '全部渠道',
     confirm: '确定'
   },
-  version_client: {
+  version_hotUp: {
     proj: '项目',
     os: '平台',
+    version: '版本',
     packageUrl: '包地址',
     remoteManifestUrl: '远程资源',
     remoteVersionUrl: '远程版本',

src/views/Version/VersionClient.vue

@@ -1,248 +0,0 @@
-<script setup lang="tsx">
-import { ElButton, ElSwitch, ElDrawer, ElForm, ElFormItem, ElInput } from 'element-plus'
-import { ContentWrap } from '@/components/ContentWrap'
-import { useI18n } from '@/hooks/web/useI18n'
-import { Table, TableColumn } from '@/components/Table'
-import { HotVersionData } from '@/api/version/types'
-import { ref, h, reactive } from 'vue'
-import { BaseButton } from '@/components/Button'
-import { editHotVersionApi, getHotVersionListApi, newHotVersionApi } from '@/api/version'
-
-interface Params {
-  pageIndex?: number
-  pageSize?: number
-}
-
-const { t } = useI18n()
-
-const columns: TableColumn[] = [
-  {
-    field: 'proj',
-    label: t('version_client.proj')
-  },
-  {
-    field: 'os',
-    label: t('version_client.os')
-  },
-  {
-    field: 'packageUrl',
-    label: t('version_client.packageUrl')
-  },
-  {
-    field: 'remoteManifestUrl',
-    label: t('version_client.remoteManifestUrl')
-  },
-  {
-    field: 'remoteVersionUrl',
-    label: t('version_client.remoteVersionUrl')
-  },
-  {
-    field: 'default',
-    label: t('version_client.default'),
-    slots: {
-      default: (data) => {
-        return (
-          <ElSwitch
-            modelValue={data.row.status == 1 ? true : false}
-            onUpdate:modelValue={(val) => updateDefaultStatus(data.row, val)}
-            class="ml-2"
-            style="--ElSwitch-on-color: #13ce66; --ElSwitch-off-color: #ff4949"
-          />
-        )
-      }
-    }
-  },
-  {
-    field: 'action',
-    label: t('version_client.action'),
-    slots: {
-      default: (data) => {
-        return (
-          <>
-            <BaseButton type="primary" onClick={() => actionFn('edit', data.row)}>
-              {t('version_client.action')}
-            </BaseButton>
-          </>
-        )
-      }
-    }
-  }
-]
-const drawer = ref(false)
-const loading = ref(true)
-const drawerText = ref('')
-
-const versionDataList = ref<HotVersionData[]>([])
-
-const form = reactive({
-  type: 'new',
-  data: {
-    id: '',
-    proj: '',
-    os: '',
-    packageUrl: '',
-    remoteManifestUrl: '',
-    remoteVersionUrl: '',
-    status: 0
-  }
-})
-
-const formReset = () => {
-  form.data.id = ''
-  form.data.proj = ''
-  form.data.os = ''
-  form.data.packageUrl = ''
-  form.data.remoteManifestUrl = ''
-  form.data.remoteVersionUrl = ''
-  form.data.status = 0
-}
-
-const getVersionList = async (params?: Params) => {
-  const res = await getHotVersionListApi(
-    params || {
-      start: 1,
-      limit: 10
-    }
-  )
-    .catch(() => {})
-    .finally(() => {
-      loading.value = false
-    })
-
-  if (res) {
-    versionDataList.value = res.data
-  }
-}
-
-const newVersion = async () => {
-  await newHotVersionApi(form.data)
-    .catch(() => {})
-    .finally(() => {
-      loading.value = false
-    })
-}
-
-// const deleteVersion = async (key) => {
-//   await delVersionApi(key)
-//     .catch(() => {})
-//     .finally(() => {
-//       loading.value = false
-//     })
-// }
-
-const editVersion = async (params) => {
-  await editHotVersionApi(params)
-    .catch(() => {})
-    .finally(() => {
-      loading.value = false
-    })
-}
-
-getVersionList()
-
-const updateDefaultStatus = async (row: HotVersionData, val) => {
-  row.status = val
-  const params = {
-    id: row.id,
-    version: '',
-    status: 0
-  }
-  params.version = row.version
-  params.status = row.status ? 1 : 0
-  await editHotVersionApi(params)
-  getVersionList()
-
-  console.log(`更新版本 ${row.version} 的 default 状态为: ${val}`)
-}
-
-const onSubmit = async () => {
-  if (form.type === 'new') {
-    await newVersion()
-  } else {
-    await editVersion(form.data)
-  }
-
-  drawer.value = !drawer.value
-  getVersionList()
-}
-
-// const deleteFn = async (data: any) => {
-//   // deleteVersion(data.id.id)
-//   getVersionList()
-// }
-
-// const syncVersion = async () => {
-//   await syncVersionApi()
-//     .catch(() => {})
-//     .finally(() => {
-//       loading.value = false
-//     })
-// }
-
-const actionFn = (type: string, data: any) => {
-  if (type == 'new') {
-    formReset()
-    form.type = 'new'
-    drawerText.value = t('version_client.new')
-  }
-  if (type == 'edit') {
-    form.type = 'edit'
-    drawerText.value = t('version_client.edit')
-    form.data.id = data.id.id
-    form.data.proj = data.proj
-    form.data.os = data.os
-    form.data.packageUrl = data.packageUrl
-    form.data.remoteManifestUrl = data.remoteManifestUrl
-    form.data.remoteVersionUrl = data.remoteVersionUrl
-  }
-  drawer.value = !drawer.value
-}
-
-const closeDrawer = () => {
-  drawer.value = false
-}
-</script>
-
-<template>
-  <ContentWrap>
-    <div style="display: flex; justify-content: space-between; align-items: center">
-      <ElButton type="primary" @click="() => actionFn('new', null)">
-        {{ t('version_client.new') }}
-      </ElButton>
-    </div>
-  </ContentWrap>
-  <ContentWrap>
-    <Table
-      :columns="columns"
-      :data="versionDataList"
-      :loading="loading"
-      :defaultSort="{ prop: 'display_time', order: 'descending' }"
-    />
-  </ContentWrap>
-  <ElDrawer v-model="drawer" direction="rtl" size="40%" :z-index="4000">
-    <template #header>
-      <span class="text-16px font-700">{{ drawerText }}</span>
-    </template>
-    <ElForm :model="form" label-width="auto" style="max-width: 600px">
-      <ElFormItem :label="t('version_client.proj')">
-        <ElInput v-model="form.data.proj" />
-      </ElFormItem>
-      <ElFormItem :label="t('version_client.os')">
-        <el-input v-model="form.data.os" />
-      </ElFormItem>
-      <ElFormItem :label="t('version_client.packageUrl')">
-        <el-input v-model="form.data.packageUrl" />
-      </ElFormItem>
-      <ElFormItem :label="t('version_client.remoteManifestUrl')">
-        <el-input v-model="form.data.remoteManifestUrl" />
-      </ElFormItem>
-      <ElFormItem :label="t('version_client.remoteVersionUrl')">
-        <el-input v-model="form.data.remoteVersionUrl" />
-      </ElFormItem>
-      <ElFormItem>
-        <el-button type="primary" @click="onSubmit">确定</el-button>
-        <el-button @click="closeDrawer">取消</el-button>
-      </ElFormItem>
-    </ElForm>
-  </ElDrawer>
-</template>

src/views/Version/VersionHotUp.vue

@@ -0,0 +1,109 @@
+<script setup lang="tsx">
+import { ElSwitch } from 'element-plus'
+import { ContentWrap } from '@/components/ContentWrap'
+import { useI18n } from '@/hooks/web/useI18n'
+import { Table, TableColumn } from '@/components/Table'
+import { HotVersionData } from '@/api/version/types'
+import { ref } from 'vue'
+import { editHotVersionApi, getHotVersionListApi } from '@/api/version'
+
+interface Params {
+  pageIndex?: number
+  pageSize?: number
+}
+
+const { t } = useI18n()
+
+const columns: TableColumn[] = [
+  {
+    field: 'proj',
+    label: t('version_hotUp.proj')
+  },
+  {
+    field: 'os',
+    label: t('version_hotUp.os')
+  },
+  {
+    field: 'version',
+    label: t('version_hotUp.version')
+  },
+  {
+    field: 'packageUrl',
+    label: t('version_hotUp.packageUrl')
+  },
+  {
+    field: 'remoteManifestUrl',
+    label: t('version_hotUp.remoteManifestUrl')
+  },
+  {
+    field: 'remoteVersionUrl',
+    label: t('version_hotUp.remoteVersionUrl')
+  },
+  {
+    field: 'default',
+    label: t('version_hotUp.default'),
+    slots: {
+      default: (data) => {
+        return (
+          <ElSwitch
+            modelValue={data.row.status == 1 ? true : false}
+            onUpdate:modelValue={(val) => updateDefaultStatus(data.row, val)}
+            class="ml-2"
+            style="--ElSwitch-on-color: #13ce66; --ElSwitch-off-color: #ff4949"
+          />
+        )
+      }
+    }
+  }
+]
+
+const loading = ref(true)
+
+const versionDataList = ref<HotVersionData[]>([])
+
+const getVersionList = async (params?: Params) => {
+  const res = await getHotVersionListApi(
+    params || {
+      start: 1,
+      limit: 10
+    }
+  )
+    .catch(() => {})
+    .finally(() => {
+      loading.value = false
+    })
+
+  if (res) {
+    versionDataList.value = res.data
+  }
+}
+
+getVersionList()
+
+const updateDefaultStatus = async (row: HotVersionData, val) => {
+  row.status = val
+  const params = {
+    id: row.id,
+    version: '',
+    status: 0
+  }
+  params.version = row.version
+  params.status = row.status ? 1 : 0
+  await editHotVersionApi(params)
+  getVersionList()
+
+  console.log(`更新版本 ${row.version} 的 default 状态为: ${val}`)
+}
+
+</script>
+
+<template>
+  <ContentWrap>
+    <Table
+      :columns="columns"
+      :data="versionDataList"
+      :loading="loading"
+      :defaultSort="{ prop: 'display_time', order: 'descending' }"
+    />
+  </ContentWrap>
+</template>

src/views/Version/VersionServer.vue

@@ -30,11 +30,13 @@ import type { ChannelData } from '@/api/channel/types'
 interface Params {
   pageIndex?: number
   pageSize?: number
+  channel?: string
 }
 
 const { t } = useI18n()
 
 const getChannelLabel = (code: string) => {
+  console.log(code)
   const c = channelOptions.value.find((x) => x.code === code)
   return c ? c.name : code
 }
@@ -42,8 +44,12 @@ const getChannelLabel = (code: string) => {
 const columns: TableColumn[] = [
   {
     field: 'name',
+    label: t('version_server.title')
+  },
+  {
+    field: 'channel',
     label: t('version_server.channel'),
-    formatter: (row) => getChannelLabel(row.name)
+    formatter: (row) => getChannelLabel(row.channel)
   },
   {
     field: 'version',
@@ -114,20 +120,19 @@ const getChannelList = async () => {
   }
 }
 
-// 根据渠道筛选后的列表（点击确定后应用），version.name 存渠道 code
-const filteredVersionList = computed(() => {
-  if (!appliedChannel.value) return versionDataList.value
-  return versionDataList.value.filter((item) => item.name === appliedChannel.value)
-})
-
 const applyChannelFilter = () => {
-  appliedChannel.value = selectedChannel.value
+  getVersionList({
+    pageIndex: 1,
+    pageSize: 10,
+    channel: selectedChannel.value
+  })
 }
 
 const form = reactive({
   type: 'new',
   data: {
     id: '',
+    channel: '',
     version: '',
     name: '',
     cdn: '',
@@ -138,6 +143,7 @@ const form = reactive({
 
 const formReset = () => {
   form.data.id = ''
+  form.data.channel = ''
   form.data.version = ''
   form.data.name = ''
   form.data.cdn = ''
@@ -238,6 +244,7 @@ const actionFn = (type: string, data: any) => {
   if (type == 'edit') {
     form.type = 'edit'
     drawerText.value = t('version_server.edit')
+    form.data.channel = data.channel
     form.data.id = data.id.id
     form.data.cdn = data.cdn
     form.data.url = data.url
@@ -251,6 +258,7 @@ const actionFn = (type: string, data: any) => {
 const closeDrawer = () => {
   drawer.value = false
 }
+
 </script>
 
 <template>
@@ -297,42 +305,40 @@ const closeDrawer = () => {
   <ContentWrap>
     <Table
       :columns="columns"
-      :data="filteredVersionList"
+      :data="versionDataList"
       :loading="loading"
       :defaultSort="{ prop: 'display_time', order: 'descending' }"
     />
   </ContentWrap>
-  <ElDrawer v-model="drawer" direction="rtl" size="40%" :z-index="4000">
+  <ElDrawer
+      v-model="drawer"
+      direction="rtl"
+      size="40%"
+  >
     <template #header>
       <span class="text-16px font-700">{{ drawerText }}</span>
     </template>
     <ElForm :model="form" label-width="auto" style="max-width: 600px">
       <ElFormItem :label="t('version_server.channel')" required>
         <ElSelect
-          v-model="form.data.name"
+          v-model="form.data.channel"
           :placeholder="
-            channelOptions.length ? t('version_server.channelSelect') : t('version_server.channelEmpty')
+            channelOptions.length
+              ? t('version_server.channelSelect')
+              : t('version_server.channelEmpty')
           "
           style="width: 100%"
+          :disabled="form.type == 'edit'"
         >
-          <ElOption
-            v-for="c in channelOptions"
-            :key="c.code"
-            :label="c.name"
-            :value="c.code"
-          />
-          <!-- 编辑时若渠道已删除，保留原值选项 -->
-          <ElOption
-            v-if="form.type === 'edit' && form.data.name && !channelOptions.some((x) => x.code === form.data.name)"
-            :key="form.data.name"
-            :label="form.data.name"
-            :value="form.data.name"
-          />
+          <ElOption v-for="c in channelOptions" :key="c.code" :label="c.name" :value="c.code" />
         </ElSelect>
         <div v-if="!channelOptions.length" class="el-form-item__error">
           {{ t('version_server.channelEmptyTip') }}
         </div>
       </ElFormItem>
+      <ElFormItem :label="t('version_server.title')">
+        <ElInput v-model="form.data.name" />
+      </ElFormItem>
       <ElFormItem :label="t('version_server.number')">
         <el-input v-model="form.data.version" />
       </ElFormItem>