<template>
|
<div class="app-container">
|
<!-- <el-form :model="queryParams" ref="queryRef" v-show="showSearch" :inline="true" label-width="100px">
|
<el-form-item label="状态" prop="useState">
|
<el-select v-model="queryParams.useState" placeholder="状态" clearable style="width: 240px">
|
<el-option :key="0" label="全部" value="" />
|
<el-option :key="1" label="正常" :value="1" />
|
<el-option :key="2" label="禁用" :value="2" />
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-button type="primary" icon="Search" @click="getDataList">搜索</el-button>
|
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
</el-form-item>
|
</el-form> -->
|
<el-row :gutter="10" class="mb8">
|
<el-col :span="1.5">
|
<el-button type="primary" plain icon="Plus" :disabled="power.add" @click="handleAdd" v-hasPermi="['system:role:add']">新增</el-button>
|
</el-col>
|
<el-col :span="1.5">
|
<el-button type="danger" plain icon="Delete" :disabled="power.multiple" @click="handleDelete()" v-hasPermi="['system:role:remove']">删除</el-button>
|
</el-col>
|
<!-- <right-toolbar v-model:showSearch="showSearch" @queryTable="getDataList"></right-toolbar> -->
|
</el-row>
|
<el-table v-loading="tableOption.loading" :data="dataTable" @selection-change="handleSelectionChange" @cell-dblclick="handleInfo">
|
<el-table-column type="selection" width="50" align="center" />
|
<el-table-column label="版本号" align="center" key="versionNo" prop="versionNo" width="120" />
|
<el-table-column label="版本描述" align="center" key="versionDesc" prop="versionDesc" />
|
<el-table-column label="版本地址" align="center">
|
<template #default="scope">
|
<el-button type="primary" link @click="downFile(scope.row.versionPath)"> {{ scope.row.versionPath }}</el-button>
|
</template>
|
</el-table-column>
|
<el-table-column label="版本类型" align="center" key="versionType" prop="versionType" width="120" />
|
<el-table-column label="强制更新" align="center" key="useState" width="100">
|
<template #default="scope">
|
<span>{{ scope.row.updState == 1 ? "是" : "否" }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="状态" align="center" key="useState" width="100">
|
<template #default="scope">
|
<span>{{ scope.row.useState == 1 ? "正常" : "禁用" }}</span>
|
</template>
|
</el-table-column>
|
<!-- <el-table-column label="更新时间" align="center" key="updateTime" prop="updateTime" width="170" /> -->
|
<el-table-column label="操作" align="center" width="120">
|
<template #default="scope">
|
<el-tooltip content="修改" placement="top" v-if="!power.single">
|
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:role:edit']"></el-button>
|
</el-tooltip>
|
<el-tooltip content="删除" placement="top" v-if="scope.row.roleId !== 1">
|
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:role:remove']"></el-button>
|
</el-tooltip>
|
</template>
|
</el-table-column>
|
</el-table>
|
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getDataList" />
|
|
<el-dialog :title="dialogTitle" v-model="isOpenFormData" width="600px" draggable :close-on-click-modal="false">
|
<el-form ref="formRef" :model="data" :rules="formData.rules" label-width="100px">
|
<el-form-item label="版本文件" prop="versionPath">
|
<FileUpload v-model="data.versionPath" :limit="1" :fileType="['apk', 'ipa']" :fileSize="120"></FileUpload>
|
</el-form-item>
|
<el-form-item label="版本类型" prop="versionType">
|
<el-radio-group v-model="data.versionType">
|
<el-radio label="android" size="large">android</el-radio>
|
<el-radio label="ios" size="large">ios</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<el-form-item label="版本号" prop="versionNo">
|
<el-input v-model="data.versionNo" placeholder="请输入版本号 例：0.0.1" style="width: 200px" />
|
</el-form-item>
|
<el-form-item label="描述" prop="versionDesc">
|
<el-input v-model="data.versionDesc" placeholder="请输入版本描述" style="width: 300px" />
|
</el-form-item>
|
<el-form-item label="强制更新" prop="updState">
|
<el-switch v-model="data.updState" :active-value="1" :inactive-value="2" active-text="是"></el-switch>
|
</el-form-item>
|
<el-form-item label="状态" prop="useState">
|
<el-switch v-model="data.useState" :active-value="1" :inactive-value="2" active-text="启用"></el-switch>
|
</el-form-item>
|
</el-form>
|
<template #footer>
|
<el-button @click="formData.isOpenFormData = false">取消</el-button>
|
<el-button type="primary" @click="submitDataScope"> 提交 </el-button>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
<script setup lang="ts">
|
import { reactive, onMounted, toRefs, getCurrentInstance, ref } from "vue";
|
import { saveData, getList, updateData, deleteData, getInfo } from "@/api/app/version";
|
import { versionDTO, TypeVersionDTO } from "@/types/DTO/appVersionDTO";
|
const baseUrl = import.meta.env.VITE_APP_BASE_API;
|
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
const ids = ref<number[]>([]);
|
const state = reactive({
|
dataTable: [] as TypeVersionDTO[], //数据列表
|
total: 0, //总条数
|
tableOption: {
|
//表格配置
|
loading: false,
|
},
|
power: {
|
//操作权限
|
add: false,
|
single: false, //
|
multiple: true, //
|
},
|
showSearch: true, //是否显示搜索
|
showAddGoods: false, //是否显示新增
|
isOpenSeletGoods: false, //是否显示选择商品
|
isOpenInfo: false, //是否显示优惠券详情
|
});
|
const { dataTable, total, tableOption, power, showSearch } = toRefs(state);
|
|
onMounted(() => {
|
getDataList();
|
});
|
|
//#region commonDisp
|
|
//#endregion
|
|
//#region 查询
|
const queryRef = ref<Omit<Common.formDataType, "formRef">>();
|
const queryParams = reactive({
|
//查询配置参数
|
pageNum: 1,
|
pageSize: 10,
|
isAsc: "desc",
|
orderByColumn: "create_time",
|
});
|
|
/**
|
* 获取数据列表
|
*/
|
const getDataList = async () => {
|
await getList(queryParams).then((res) => {
|
if (res.code == 200) {
|
state.dataTable = res.rows;
|
state.tableOption.loading = false;
|
state.total = res.total;
|
}
|
});
|
};
|
/**
|
* 重置
|
*/
|
const resetQuery = () => {
|
queryRef.value!.resetFields();
|
};
|
//#endregion
|
|
//#region 新增
|
|
/**
|
* 新增
|
*/
|
const handleAdd = () => {
|
formData.dialogTitle = "新增版本";
|
formData.handleStatus = 1;
|
formData.data = { ...versionDTO };
|
formData.isOpenFormData = true;
|
};
|
|
const validatePass = (rule: any, value: any, callback: any) => {
|
if (Number.isInteger(Number(value)) && Number(value) > 0) {
|
callback();
|
} else {
|
callback(new Error(rule.message));
|
}
|
};
|
|
interface formA extends Common.formDataType<TypeVersionDTO> {}
|
|
const formData = reactive<formA>({
|
data: {} as TypeVersionDTO,
|
isOpenFormData: false, //是否展开新增对话框
|
dialogTitle: "", //弹窗标题
|
handleStatus: 0,
|
formRef: null,
|
rules: {
|
versionPath: [{ required: true, message: "请上传版本文件", trigger: "change" }],
|
versionNo: [{ required: true, message: "请填写版本号", trigger: "change" }],
|
versionDesc: [{ required: true, message: "请填写版本描述", trigger: "change" }],
|
},
|
});
|
|
const { data, isOpenFormData, dialogTitle, formRef } = toRefs(formData);
|
|
/**
|
* 提交表单检验
|
*/
|
const submitDataScope = () => {
|
formData.formRef!.validate((valid) => {
|
if (valid) {
|
if (formData.data.id) {
|
editData();
|
} else {
|
SaveData();
|
}
|
}
|
});
|
};
|
|
/**
|
* 保存
|
*/
|
const SaveData = async () => {
|
await saveData(formData.data).then((res) => {
|
if (res.code == 200) {
|
proxy.$modal.msgSuccess("新增成功");
|
state.isOpenSeletGoods = false;
|
getDataList();
|
formData.isOpenFormData = false;
|
} else {
|
proxy.$modal.msgError(res.msg);
|
}
|
});
|
};
|
|
/**
|
* 修改
|
*/
|
const editData = async () => {
|
await updateData(formData.data).then((res) => {
|
if (res.code == 200) {
|
proxy.$modal.msgSuccess("操作成功");
|
state.isOpenSeletGoods = false;
|
getDataList();
|
formData.isOpenFormData = false;
|
} else {
|
proxy.$modal.msgError(res.msg);
|
}
|
});
|
};
|
|
//#endregion
|
|
//#region 删除
|
/**
|
* 选择时
|
* @param {} row
|
*/
|
const handleSelectionChange = (row: TypeVersionDTO[]) => {
|
ids.value = row.map((item: TypeVersionDTO) => item.id);
|
state.power.multiple = !ids.value.length;
|
};
|
|
/**
|
* 删除
|
*/
|
const handleDelete = (row?: TypeVersionDTO) => {
|
const roleIds = (row && row.id) || ids.value;
|
proxy.$modal
|
.confirm("是否确认删除选中的版本?")
|
.then(function () {
|
return deleteData(roleIds);
|
})
|
.then(() => {
|
getDataList();
|
proxy.$modal.msgSuccess("删除成功");
|
})
|
.catch(() => {});
|
};
|
|
//#endregion
|
|
//#region 修改
|
|
/**
|
* 修改
|
*/
|
const handleUpdate = (e: TypeVersionDTO) => {
|
getDataInfo(e.id, () => {
|
formData.dialogTitle = "修改版本";
|
formData.handleStatus = 2;
|
formData.isOpenFormData = true;
|
});
|
};
|
|
//#endregion
|
|
//#region 详情
|
|
/**
|
* 展开详情
|
*/
|
const handleInfo = (e: TypeVersionDTO) => {
|
getDataInfo(e.id, () => {
|
state.isOpenInfo = true;
|
});
|
};
|
|
/**
|
* 获取详情
|
* @param {} e
|
*/
|
const getDataInfo = async (e: number, fnc: () => void) => {
|
await getInfo(e).then((res) => {
|
if (res.code == 200) {
|
let data = res.data;
|
formData.data = { ...data };
|
if (fnc != null) {
|
fnc();
|
}
|
}
|
});
|
};
|
|
//#endregion
|
|
const downFile = (e: string) => {
|
if (e.indexOf("http://") != -1 || e.indexOf("https://") != -1) {
|
window.open(e);
|
} else {
|
window.open(import.meta.env.VITE_APP_BASE + e);
|
}
|
};
|
/**
|
* 导出
|
*/
|
const handleExport = () => {};
|
</script>
|
|
<style scoped lang="scss">
|
._el-row {
|
padding: 5px 0px;
|
border-bottom: 1px solid var(--el-border-color);
|
margin-left: 20px;
|
align-items: center;
|
}
|
.actImage {
|
max-width: 250px;
|
}
|
</style>
|
