Skip to content

S
so-manage-ui
Commit 122c99f4 authored by 白舜's avatar 白舜 🎱
Browse files
Options

Merge branch 'dev0331' into dev

parents 3a675eb3 494b827b
Hide whitespace changes
Inline Side-by-side
Showing with 570 additions and 49 deletions
.beagle.yml
View file @ 122c99f4
kind: pipeline
name: dev
name: dev0331
trigger:
branch:
- dev
- dev0331
clone:
disable: true
......@@ -70,7 +70,6 @@ steps: # 定义流水线执行步骤，这些步骤将顺序执行
from_secret: REGISTRY_USER_ALIYUN
registry_password: # 密码
from_secret: REGISTRY_PASSWORD_ALIYUN
# - name: deploy-amd64
# image: registry.cn-qingdao.aliyuncs.com/wod/devops-kubernetes:1.0
# settings:
......
src/assets/css/index.css
View file @ 122c99f4
......@@ -711,6 +711,19 @@ border-radius:8px;
background-color: #e1e4fb;
border-color: #e1e4fb;
}
.apaas_button .el-button--info {
color: #fff;
background-color: #404a62;
border-color: #404a62;
}
.apaas_button .el-button--info:hover{
background-color: #5c6579;
border-color: #5c6579;
}
.apaas_button .el-button--info:active{
background-color: #363f53;
border-color: #363f53;
}
.apaas_button .el-button--danger {
color: #fff;
......
src/bg-ui/bg-table.vue
View file @ 122c99f4
......@@ -20,7 +20,7 @@
<el-table-column type="selection" :selectable="selectable" width="38" v-if="select">
<!-- checkbox -->
</el-table-column>
<el-table-column v-if="isIndex" type="index" :label="indexLabel" width="54" align="left">
<el-table-column v-if="isIndex" type="index" :label="indexLabel" :width="indexWidth" align="left">
<!-- 序号 -->
</el-table-column>
<el-table-column
......@@ -98,6 +98,10 @@ const props = defineProps({
typr: Boolean,
default: "",
}, // 决定多选框是否禁用的字段
indexWidth: {
type: Number,
default: 54,
},
});
const table = ref(null);
......
src/page/main/config/cloud-platform/index.vue 0 → 100644
View file @ 122c99f4
<template>
<div class="detail_container">
<bg-breadcrumb></bg-breadcrumb>
<div class="main_container">
<bg-filter-group @search="changeSearch" v-model="filter.search" placeholder="请输入容器平台名称">
<template v-slot:left_action>
<div class="apaas_button">
<el-button class="register_btn" type="primary" @click="register">
<bg-icon style="font-size: 12px; color: #fff; margin-right: 8px" icon="#bg-ic-add"></bg-icon>
新增
</el-button>
</div>
</template>
</bg-filter-group>
<div class="table_container">
<div class="table bg-scroll">
<bg-table
ref="Bgtable"
:headers="headers"
:rows="tableRows"
isIndex
:paddingLeft="32"
:indexWidth="108"
:stripe="true">
<template v-slot:platform_name="{ row }">
<span class="can_click_text" @click="viewDetail(row)">
{{ row.platform_name }}
</span>
</template>
<template v-slot:platform_type="{ row }">
{{ ["", "自有平台", "第三方平台"][row.platform_type] }}
</template>
<template v-slot:action="{ row }">
<bg-table-btn
class="can_click_text"
:click="
() => {
edit_row(row);
}
">
编辑
</bg-table-btn>
<bg-table-btn
class="can_click_text"
:click="
() => {
delete_row(row);
}
"
:disabled="row.state == 1 || row.role_type == 1">
删除
</bg-table-btn>
</template>
</bg-table>
</div>
<bg-pagination
:page="filter.page"
:size="filter.limit"
:total="tableTotal"
@change-page="changePage"
@change-size="changeSize">
</bg-pagination>
</div>
</div>
<!-- 新增/编辑弹窗 -->
<el-dialog
class="dialog-box"
:title="dialogType == 1 ? '新增' : '编辑'"
:close-on-click-modal="false"
v-model="addDialog"
width="614px">
<el-form
class="bg_form"
ref="bgForm"
:model="formData"
:rules="rules"
label-width="130px"
style="margin-top: 24px">
<el-form-item label="平台类型" prop="platform_type">
<el-radio-group v-model="formData.platform_type">
<el-radio v-for="(item, index) in typeList" :key="'platform_type' + index" :label="item.value">
{{ item.name }}
</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="平台名称" prop="platform_name">
<el-input v-model.trim="formData.platform_name" placeholder="请输入平台名称" maxlength="50" show-word-limit />
</el-form-item>
<el-form-item label="平台帐号" prop="platform_account" v-if="formData.platform_type == 1">
<el-input
v-model.trim="formData.platform_account"
placeholder="请输入aPaaS在该平台注册的帐号"
maxlength="50"
show-word-limit />
</el-form-item>
<el-form-item label="工作组名称" prop="work_group" v-if="formData.platform_type == 1">
<el-input
v-model.trim="formData.work_group"
placeholder="请输入aPaaS在该平台注册申请的工作组名称"
maxlength="50"
show-word-limit />
</el-form-item>
<el-form-item label="服务地址" prop="service_url" v-if="formData.platform_type == 1">
<el-input
v-model.trim="formData.service_url"
placeholder="请输入服务地址URL"
maxlength="100"
show-word-limit />
</el-form-item>
<el-form-item label="服务地址TOKEN" prop="service_token" v-if="formData.platform_type == 1">
<el-input
v-model.trim="formData.service_token"
placeholder="请输入服务地址的TOKEN参数"
maxlength="100"
show-word-limit />
</el-form-item>
<el-form-item label="APISERVER" prop="apiserver">
<el-input
v-model.trim="formData.apiserver"
placeholder="请输入APISERVER参数"
maxlength="100"
show-word-limit />
</el-form-item>
<el-form-item label="SERVER TOKEN" prop="token">
<el-input
v-model.trim="formData.token"
placeholder="请输入SERVER TOKEN参数"
maxlength="100"
show-word-limit />
</el-form-item>
<el-form-item label="描述" prop="platform_desc">
<el-input
v-model.trim="formData.platform_desc"
placeholder="请输入描述"
maxlength="300"
show-word-limit
:rows="4"
type="textarea" />
</el-form-item>
</el-form>
<template v-slot:footer>
<div class="apaas_button">
<el-button
type="default"
@click="
() => {
addDialog = false;
dialogType = 0;
}
"
>取消</el-button
>
<el-button type="info" @click="testUrl">
<bg-icon style="font-size: 12px; color: #fff; margin-right: 8px" icon="#bg-ic-checklist"></bg-icon>
测试链接
</el-button>
<el-button type="primary" :disabled="!testSuccess" @click="postData">保存</el-button>
</div>
</template>
</el-dialog>
<!-- 平台详情 -->
<el-dialog class="dialog_box" title="平台详情" v-model="detailDialog" width="600px">
<div>
<bg-info class="info_box" :data="platfromInfo" :col="1"></bg-info>
</div>
</el-dialog>
<!-- 删除弹窗 -->
<el-dialog class="dialog_box" title="提示" v-model="delDialog" width="400px">
<div>删除后，aPaaS平台将不再与该容器平台对接，确认删除吗？</div>
<template v-slot:footer>
<div class="apaas_button">
<el-button type="default" @click="delDialog = false">取 消</el-button>
<el-button type="primary" @click="deleteData">确 定</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import { reactive, toRefs, ref, onBeforeMount, nextTick } from "vue";
import axios from "../../../../request/http.js";
import { ElMessage } from "element-plus";
import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
const Bgtable = ref(null);
const bgForm = ref(null);
const state = reactive({
filter: {
page: 1,
limit: 10,
search: "",
},
headers: [
{
label: "容器平台名称",
prop: "platform_name",
},
{
label: "平台类型",
prop: "platform_type",
},
{
label: "描述",
prop: "platform_desc",
minWidth: 346,
},
{
label: "创建人",
prop: "created_by",
},
{
label: "创建时间",
prop: "created_time",
width: 276,
},
{
label: "操作",
prop: "action",
width: 130,
fixed: "right",
},
],
tableRows: [],
tableTotal: 0,
actionRow: {}, // 当前选中的数据
delDialog: false, // 删除弹窗
dialogType: 1, // 1-新增 2-编辑
addDialog: false, // 新增/编辑弹窗
formData: {
platform_type: 1,
platform_name: "",
platform_account: "",
work_group: "",
service_url: "",
service_token: "",
apiserver: "",
token: "",
platform_desc: "",
},
rules: {
platform_name: [{ required: true, message: "平台名称不能为空", trigger: "blur" }],
platform_type: [{ required: true, message: "请选择平台类型", trigger: "change" }],
platform_account: [{ required: true, message: "平台帐号不能为空", trigger: "blur" }],
work_group: [{ required: true, message: "工作组名称不能为空", trigger: "blur" }],
service_url: [{ required: true, message: "服务地址URL不能为空", trigger: "blur" }],
service_token: [{ required: true, message: "服务地址的TOKEN参数不能为空", trigger: "blur" }],
apiserver: [{ required: true, message: "APISERVER参数不能为空", trigger: "blur" }],
token: [{ required: true, message: "SERVER TOKEN参数不能为空", trigger: "blur" }],
platform_desc: [{ required: true, message: "描述不能为空", trigger: "blur" }],
},
typeList: [
{
name: "自有平台",
value: 1,
},
{
name: "第三方平台",
value: 2,
},
],
detailDialog: false, // 详情弹窗
platfromInfo: [
{
name: "平台类型",
value: "",
nameWidth: 144,
},
{
name: "平台名称",
value: "",
nameWidth: 144,
},
{
name: "平台帐号",
value: "",
nameWidth: 144,
},
{
name: "工作组名称",
value: "",
nameWidth: 144,
},
{
name: "服务地址",
value: "",
nameWidth: 144,
},
{
name: "TOKEN",
value: "",
nameWidth: 144,
},
{
name: "APISERVER",
value: "",
nameWidth: 144,
},
{
name: "TOKEN",
value: "",
nameWidth: 144,
},
{
name: "描述",
value: "",
nameWidth: 144,
},
],
testSuccess: false, // 测试链接结果
});
const getRoleRows = () => {
let params = { ...state.filter };
axios.get(`/apaas/application/v5/platform/list`, { params }).then((res) => {
if (res.data.code == 200) {
state.tableRows = res.data.data || [];
state.tableTotal = res.data.total;
} else {
ElMessage.error(res.data.data);
}
});
}; // 获取列表
const changePage = (val) => {
state.filter.page = val;
getRoleRows();
}; // 改变页码
const changeSize = (val) => {
state.filter.limit = val;
changePage(1);
}; // 改变每页条数
const changeSearch = (val) => {
state.filter.search = val;
changePage(1);
}; // 表格关键字筛选
const register = () => {
resetForm();
state.dialogType = 1;
state.addDialog = true;
}; // 新增
const resetForm = () => {
state.formData = {
platform_type: 1,
platform_name: "",
platform_account: "",
work_group: "",
service_url: "",
service_token: "",
apiserver: "",
token: "",
platform_desc: "",
};
if (bgForm.value) {
nextTick(() => {
bgForm.value.validate((valid) => {
if (!valid) {
bgForm.value.clearValidate();
}
});
});
}
}; // 重置表单
const viewDetail = async (row) => {
let { data } = await getDetail(row.id);
if (data.code == 200) {
state.platfromInfo[0].value = ["", "自有平台", "第三方平台"][data.data.platform_type];
state.platfromInfo[1].value = data.data.platform_name;
state.platfromInfo[2].value = data.data.platform_account;
state.platfromInfo[3].value = data.data.work_group;
state.platfromInfo[4].value = data.data.service_url;
state.platfromInfo[5].value = data.data.service_token;
state.platfromInfo[6].value = data.data.apiserver;
state.platfromInfo[7].value = data.data.token;
state.platfromInfo[8].value = data.data.platform_desc;
if (data.data.platform_type == 2) {
state.platfromInfo.splice(2, 4);
}
state.detailDialog = true;
} else {
ElMessage.error(data.data);
}
}; // 查看详情
const getDetail = (id) => {
return axios.get(`/apaas/application/v5/platform/detail/${id}`);
}; // 获取详情
const edit_row = async (row) => {
resetForm();
let { data } = await getDetail(row.id);
if (data.code == 200) {
Object.assign(state.formData, data.data);
state.dialogType = 2;
state.addDialog = true;
} else {
ElMessage.error(data.data);
}
}; // 编辑
const testUrl = () => {
bgForm.value.validate((valid) => {
if (valid) {
let params = {
...state.formData,
};
axios.post(`/apaas/application/v5/platform/check`, params).then((res) => {
if (res.data.code == 200) {
ElMessage.success("链接测试通过！");
state.testSuccess = true;
} else {
ElMessage.error(res.data.data);
}
});
}
});
}; // 测试链接
const postData = () => {
let params = {
...state.formData,
};
let url = ["", "/apaas/application/v5/platform/add", "/apaas/application/v5/platform/update"];
axios.post(url[state.dialogType], params).then((res) => {
if (res.data.code == 200) {
ElMessage.success(res.data.msg);
state.addDialog = false;
state.testSuccess = false;
changePage(1);
} else {
ElMessage.error(res.data.data);
}
});
}; // 新建/编辑数据
const delete_row = (row) => {
state.actionRow = row;
state.delDialog = true;
}; // 删除
const deleteData = () => {
axios.delete(`/apaas/application/v5/platform/${state.actionRow.id}`).then((res) => {
if (res.data.code == 200) {
ElMessage.success(res.data.msg);
state.delDialog = false;
changePage(1);
} else {
ElMessage.error(res.data.data);
}
});
}; // 确认删除
onBeforeMount(() => {
getRoleRows();
});
const {
filter,
headers,
tableRows,
tableTotal,
delDialog,
dialogType,
addDialog,
formData,
rules,
typeList,
detailDialog,
platfromInfo,
testSuccess,
} = toRefs(state);
</script>
<style lang="scss" scoped>
.detail_container {
width: 100%;
padding: 0 24px;
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: stretch;
.main_container {
flex-grow: 1;
width: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: stretch;
background-color: #fff;
box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
border-radius: 6px;
margin: 0 0 16px;
position: relative;
height: calc(100% - 62px);
.table_container {
height: calc(100% - 70px);
padding: 0 16px;
.table {
max-height: calc(100% - 64px);
}
}
}
}
</style>
<style>
.dialog-box .el-dialog__body {
padding: 0 24px;
}
.bg-info {
text-align: left;
}
</style>
vite.config.js
View file @ 122c99f4
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
const path = require('path')
const path = require("path");
function resolve_path (dir) {
return path.join(__dirname, './', dir)
function resolve_path(dir) {
return path.join(__dirname, "./", dir);
}
export default {
plugins: [
vue()
],
plugins: [vue()],
//本地运行基础路径，如：http://localhost:5173/apaas/ui/
base: "/apaas/manage/ui/",
clearScreen:false,
resolve:{
clearScreen: false,
resolve: {
//别名，代码引入时方便引入
alias:{
'@':resolve_path('src'),
}
alias: {
"@": resolve_path("src"),
},
},
css:{
devSourcemap:true,//代码编排，调试时是否能看到源码
css: {
devSourcemap: true, //代码编排，调试时是否能看到源码
},
server:{
host:'0.0.0.0',//host配置，0.0.0.0会添加本地ip，开启局域网访问路径
hmr:true,//热更新
server: {
host: "0.0.0.0", //host配置，0.0.0.0会添加本地ip，开启局域网访问路径
hmr: true, //热更新
proxy: {
// 选项写法
'/apaas/system':{
target: 'https://apaas5.wodcloud.com/apaas/system', // 所要代理的目标地址
rewrite: path => path.replace(/^\/apaas\/system/, ''), // 重写传过来的path路径，比如 `/api/index/1?id=10&name=zs`（注意:path路径最前面有斜杠（/），因此，正则匹配的时候不要忘了是斜杠（/）开头的；选项的 key 也是斜杠（/）开头的）
changeOrigin: true, // true/false, Default: false - changes the origin of the host header to the target URL
secure: false,//解决证书缺失问题
"/apaas/system": {
target: "https://apaas5.wodcloud.com/apaas/system", // 所要代理的目标地址
rewrite: (path) => path.replace(/^\/apaas\/system/, ""), // 重写传过来的path路径，比如 `/api/index/1?id=10&name=zs`（注意:path路径最前面有斜杠（/），因此，正则匹配的时候不要忘了是斜杠（/）开头的；选项的 key 也是斜杠（/）开头的）
changeOrigin: true, // true/false, Default: false - changes the origin of the host header to the target URL
secure: false, //解决证书缺失问题
},
"/apaas/portal/ui": {
target: "https://apaas5.wodcloud.com/apaas/portal/ui", // 所要代理的目标地址
rewrite: (path) => path.replace(/^\/apaas\/portal\/ui/, ""), // 重写传过来的path路径，比如 `/api/index/1?id=10&name=zs`（注意:path路径最前面有斜杠（/），因此，正则匹配的时候不要忘了是斜杠（/）开头的；选项的 key 也是斜杠（/）开头的）
changeOrigin: true, // true/false, Default: false - changes the origin of the host header to the target URL
secure: false, //解决证书缺失问题
},
'/apaas/portal/ui':{
target: 'https://apaas5.wodcloud.com/apaas/portal/ui', // 所要代理的目标地址
rewrite: path => path.replace(/^\/apaas\/portal\/ui/, ''), // 重写传过来的path路径，比如 `/api/index/1?id=10&name=zs`（注意:path路径最前面有斜杠（/），因此，正则匹配的时候不要忘了是斜杠（/）开头的；选项的 key 也是斜杠（/）开头的）
changeOrigin: true, // true/false, Default: false - changes the origin of the host header to the target URL
secure: false,//解决证书缺失问题
"/apaas/service": {
target: "https://apaas5.wodcloud.com/apaas/service", // 所要代理的目标地址
rewrite: (path) => path.replace(/^\/apaas\/service/, ""), // 重写传过来的path路径，比如 `/api/index/1?id=10&name=zs`（注意:path路径最前面有斜杠（/），因此，正则匹配的时候不要忘了是斜杠（/）开头的；选项的 key 也是斜杠（/）开头的）
changeOrigin: true, // true/false, Default: false - changes the origin of the host header to the target URL
secure: false, //解决证书缺失问题
},
'/apaas/service':{
target: 'https://apaas5.wodcloud.com/apaas/service', // 所要代理的目标地址
rewrite: path => path.replace(/^\/apaas\/service/, ''), // 重写传过来的path路径，比如 `/api/index/1?id=10&name=zs`（注意:path路径最前面有斜杠（/），因此，正则匹配的时候不要忘了是斜杠（/）开头的；选项的 key 也是斜杠（/）开头的）
changeOrigin: true, // true/false, Default: false - changes the origin of the host header to the target URL
secure: false,//解决证书缺失问题
"/apaas/common": {
target: "https://apaas5.wodcloud.com/apaas/common", // 所要代理的目标地址
rewrite: (path) => path.replace(/^\/apaas\/common/, ""), // 重写传过来的path路径，比如 `/api/index/1?id=10&name=zs`（注意:path路径最前面有斜杠（/），因此，正则匹配的时候不要忘了是斜杠（/）开头的；选项的 key 也是斜杠（/）开头的）
changeOrigin: true, // true/false, Default: false - changes the origin of the host header to the target URL
secure: false, //解决证书缺失问题
},
'/apaas/common':{
target: 'https://apaas5.wodcloud.com/apaas/common', // 所要代理的目标地址
rewrite: path => path.replace(/^\/apaas\/common/, ''), // 重写传过来的path路径，比如 `/api/index/1?id=10&name=zs`（注意:path路径最前面有斜杠（/），因此，正则匹配的时候不要忘了是斜杠（/）开头的；选项的 key 也是斜杠（/）开头的）
changeOrigin: true, // true/false, Default: false - changes the origin of the host header to the target URL
secure: false,//解决证书缺失问题
"/apaas/application/v5": {
target: "https://apaas5.wodcloud.com/apaas/application/v5",
rewrite: (path) => path.replace(/^\/apaas\/application\/v5/, ""),
changeOrigin: true,
secure: false,
},
}
},
},
build:{
outDir:'dist/apaas/manage/ui',//打包输出文件夹
assetsDir:'static',//打包输出静态文件
build: {
outDir: "dist/apaas/manage/ui", //打包输出文件夹
assetsDir: "static", //打包输出静态文件
},
}
};
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment