app管理
This commit is contained in:
于晏彭
parent
552ca79958
commit
b810b72cae
@ -75,3 +75,21 @@ export const deleteDictionary = (params: { id: number }) => {
|
||||
export const deleteDia = (params: { id: number }) => {
|
||||
return http.post(PORT1 + `/xmgl/systemDictData/delete`, params);
|
||||
};
|
||||
|
||||
// app管理
|
||||
export const getAppList = (params: User.ReqUserParams) => {
|
||||
return http.post<ResPage<User.ResUserList>>(PORT1 + `/xmgl/appVersion/page`, params);
|
||||
};
|
||||
// app增加
|
||||
export const addApp = (params: FormData) => {
|
||||
return http.post(PORT1 + `/xmgl/appVersion/add`, params);
|
||||
};
|
||||
// * 编辑app
|
||||
export const editApp = (params: { id: string }) => {
|
||||
return http.post(PORT1 + `/xmgl/appVersion/edit`, params);
|
||||
};
|
||||
|
||||
// 文件下载
|
||||
export const exportApp = (params: User.ReqUserParams) => {
|
||||
return http.download(PORT1 + `/xmgl/file/download`, params);
|
||||
};
|
||||
|
||||
@ -29,8 +29,8 @@
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "/system",
|
||||
|
||||
"path": "/appmanage",
|
||||
"name": "appmanage",
|
||||
"meta": {
|
||||
"icon": "Tools",
|
||||
"title": "APP管理",
|
||||
|
||||
@ -34,7 +34,8 @@ export const staticRouter: RouteRecordRaw[] = [
|
||||
name: "dictionary",
|
||||
component: () => import("@/views/jxjview/dictionary/index.vue")
|
||||
},
|
||||
{ path: "/dictionary/detail", name: "dicDetail", component: () => import("@/views/jxjview/dictionary/detail.vue") }
|
||||
{ path: "/dictionary/detail", name: "dicDetail", component: () => import("@/views/jxjview/dictionary/detail.vue") },
|
||||
{ path: "/appmanage", name: "appManage", component: () => import("@/views/jxjview/appmanage/index.vue") }
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
160
src/views/jxjview/appmanage/index.vue
Normal file
160
src/views/jxjview/appmanage/index.vue
Normal file
@ -0,0 +1,160 @@
|
||||
<template>
|
||||
<div class="table-box">
|
||||
<ProTable
|
||||
ref="proTable"
|
||||
title="用户列表"
|
||||
:columns="columns"
|
||||
:requestApi="getTableList"
|
||||
:initParam="initParam"
|
||||
:dataCallback="dataCallback"
|
||||
:tool-button="false"
|
||||
:pagination="true"
|
||||
background
|
||||
>
|
||||
<!-- 表格操作 -->
|
||||
<template #downloadPath="scope">
|
||||
<el-button type="primary" link @click="handleEditItem(scope.row)">下载</el-button>
|
||||
<el-button type="primary" link v-copy="scope.row.downloadPath">复制apk地址</el-button>
|
||||
</template>
|
||||
<template #operation="{ row }">
|
||||
<el-button type="primary" link @click="onUpload(row)"
|
||||
><el-icon><RefreshRight /></el-icon>更新版本</el-button
|
||||
>
|
||||
</template>
|
||||
</ProTable>
|
||||
<el-dialog v-model="visible" title="更新版本" width="40%">
|
||||
<el-form :data="formData" center>
|
||||
<el-form-item label="版本名称:">
|
||||
<el-input v-model="formData.versionName" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="版本号:">
|
||||
<el-input v-model="formData.versionNum" placeholder="请输入" />
|
||||
</el-form-item>
|
||||
<el-form-item label="版本描述:">
|
||||
<el-input v-model="formData.versionDesc" type="textarea" />
|
||||
</el-form-item>
|
||||
<el-form-item label="上传apk:">
|
||||
<el-upload
|
||||
:headers="headers"
|
||||
v-model:file-list="fileList"
|
||||
class="upload-demo"
|
||||
action="http://192.168.34.122:6688/xmgl/file/upload"
|
||||
multiple
|
||||
:limit="1"
|
||||
:on-success="uploadSuccess"
|
||||
>
|
||||
<el-button type="primary">点击上传</el-button>
|
||||
<template #tip>
|
||||
<div class="el-upload__tip">apk文件大小不能超过500KB.</div>
|
||||
</template>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="visible = false">取消</el-button>
|
||||
<el-button type="primary" @click="onSave(formData)">保存</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="tsx" name="jxjSystem">
|
||||
import { ref, reactive } from "vue";
|
||||
import { ElMessage, ElMessageBox } from "element-plus";
|
||||
import { useRouter } from "vue-router";
|
||||
import { User } from "@/api/interface";
|
||||
import { GlobalStore } from "@/stores";
|
||||
import { ColumnProps } from "@/components/ProTable/interface";
|
||||
import { useHandleData } from "@/hooks/useHandleData";
|
||||
import { useDownload } from "@/hooks/useDownload";
|
||||
import ProTable from "@/components/ProTable/index.vue";
|
||||
import { CirclePlus, Delete, EditPen, Download, Upload, View, Refresh } from "@element-plus/icons-vue";
|
||||
import { getAppList, editApp, addApp, exportApp } from "@/api/modules/jxjview";
|
||||
|
||||
const router = useRouter();
|
||||
const globalStore = GlobalStore();
|
||||
const data = ref<string>("复制成功");
|
||||
const headers = ref({ Authorization: "Bearer " + globalStore.token });
|
||||
const fileList = ref([]);
|
||||
|
||||
const visible = ref(false);
|
||||
const formData = ref({
|
||||
versionName: "",
|
||||
versionNum: "",
|
||||
versionDesc: "",
|
||||
fileName: "",
|
||||
downloadPath: "",
|
||||
versionId: 0
|
||||
});
|
||||
|
||||
// 获取 ProTable 元素，调用其获取刷新数据方法（还能获取到当前查询参数，方便导出携带参数）
|
||||
const proTable = ref();
|
||||
|
||||
// 修改数据按钮
|
||||
const handleEditItem = async (row: any) => {
|
||||
ElMessageBox.confirm("确认下载数据?", "温馨提示", { type: "warning" }).then(() =>
|
||||
useDownload(exportApp, "用户列表", { fileUrl: row.downloadPath })
|
||||
);
|
||||
};
|
||||
|
||||
// 表格配置项
|
||||
const columns: ColumnProps[] = [
|
||||
{
|
||||
prop: "versionId",
|
||||
label: "序号"
|
||||
},
|
||||
{
|
||||
prop: "versionName",
|
||||
label: "版本名称"
|
||||
// search: { el: "input" }
|
||||
},
|
||||
// 多级 prop
|
||||
{ prop: "versionNum", label: "版本号" },
|
||||
{ prop: "versionDesc", label: "版本描述" },
|
||||
{ prop: "downloadPath", label: "apk地址" },
|
||||
{ prop: "operation", label: "操作", fixed: "right", width: 330 }
|
||||
];
|
||||
|
||||
// 如果表格需要初始化请求参数，直接定义传给 ProTable(之后每次请求都会自动带上该参数，此参数更改之后也会一直带上，改变此参数会自动刷新表格数据)
|
||||
const initParam = reactive({
|
||||
type: 1
|
||||
});
|
||||
|
||||
// dataCallback 是对于返回的表格数据做处理，如果你后台返回的数据不是 list && total && pageNum && pageSize 这些字段，那么你可以在这里进行处理成这些字段
|
||||
// 或者直接去 hooks/useTable.ts 文件中把字段改为你后端对应的就行
|
||||
const dataCallback = (data: any) => {
|
||||
// console.log(data);
|
||||
return {
|
||||
list: data.records,
|
||||
total: Number(data.total),
|
||||
pageNo: Number(data.current),
|
||||
pageSize: Number(data.size)
|
||||
};
|
||||
};
|
||||
|
||||
// 如果你想在请求之前对当前请求参数做一些操作，可以自定义如下函数：params 为当前所有的请求参数（包括分页），最后返回请求列表接口
|
||||
// 默认不做操作就直接在 ProTable 组件上绑定 :requestApi="getUserList"
|
||||
const getTableList = (params: any) => {
|
||||
let newParams = JSON.parse(JSON.stringify(params));
|
||||
return getAppList(newParams);
|
||||
};
|
||||
|
||||
const onUpload = (row: any) => {
|
||||
visible.value = true;
|
||||
formData.value.versionId = row.versionId;
|
||||
fileList.value = [{ name: row.fileName, url: row.downloadPath }];
|
||||
formData.value = reactive(row);
|
||||
// formData.value?.resetFields();
|
||||
};
|
||||
const onSave = async (params: any) => {
|
||||
const res = await editApp(params);
|
||||
proTable.value.getAppList();
|
||||
};
|
||||
const uploadSuccess = (response: any) => {
|
||||
ElMessage.success("上传成功");
|
||||
formData.value.fileName = response.result.filename;
|
||||
formData.value.downloadPath = response.result.url;
|
||||
};
|
||||
</script>
|
||||
@ -10,6 +10,7 @@
|
||||
:tool-button="false"
|
||||
:pagination="true"
|
||||
background
|
||||
:isShowSearch="false"
|
||||
>
|
||||
<!-- 表格 header 按钮 -->
|
||||
<!-- <template #tableHeader="scope">
|
||||
|
||||
@ -39,16 +39,16 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
|
||||
host: "0.0.0.0",
|
||||
port: viteEnv.VITE_PORT,
|
||||
open: viteEnv.VITE_OPEN,
|
||||
cors: true
|
||||
cors: true,
|
||||
// 跨域代理配置
|
||||
// proxy: {
|
||||
// "/api": {
|
||||
// target: "http://10.0.1.49:6688", // easymock
|
||||
// // target: "https://www.fastmock.site/mock/f81e8333c1a9276214bcdbc170d9e0a0", // fastmock
|
||||
// changeOrigin: true,
|
||||
// rewrite: path => path.replace(/^\/api/, "")
|
||||
// }
|
||||
// }
|
||||
proxy: {
|
||||
"/api": {
|
||||
target: "http://192.168.34.122:6688", // easymock
|
||||
// target: "https://www.fastmock.site/mock/f81e8333c1a9276214bcdbc170d9e0a0", // fastmock
|
||||
changeOrigin: true,
|
||||
rewrite: path => path.replace(/^\/api/, "")
|
||||
}
|
||||
}
|
||||
},
|
||||
plugins: [
|
||||
vue(),
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user