mirror of
https://gitee.com/lab1024/smart-admin.git
synced 2025-11-16 07:33:49 +08:00
2.0的js版本和后端 完成
This commit is contained in:
zhuoda
@@ -0,0 +1,90 @@
|
||||
<!--
|
||||
* reload 表单
|
||||
*
|
||||
* @Author: 1024创新实验室-主任：卓大
|
||||
* @Date: 2022-07-21 21:55:12
|
||||
* @Wechat: zhuda1024
|
||||
* @Email: lab1024@163.com
|
||||
* @Copyright 1024创新实验室 （ https://1024lab.net ），2012-2022
|
||||
-->
|
||||
<template>
|
||||
<a-modal :visible="visible" title="执行Reload" ok-text="确认" cancel-text="取消" @ok="onSubmit" @cancel="onClose">
|
||||
<a-form ref="formRef" :model="form" :rules="rules" :label-col="{ span: 5 }">
|
||||
<a-form-item label="标签">
|
||||
<a-input v-model:value="form.tag" :disabled="true" />
|
||||
</a-form-item>
|
||||
<a-form-item label="运行标识" name="identification">
|
||||
<a-input v-model:value="form.identification" placeholder="请输入运行标识" />
|
||||
</a-form-item>
|
||||
<a-form-item label="参数" name="args">
|
||||
<a-input v-model:value="form.args" placeholder="请输入参数" />
|
||||
</a-form-item>
|
||||
</a-form>
|
||||
</a-modal>
|
||||
</template>
|
||||
<script setup>
|
||||
import { message } from 'ant-design-vue';
|
||||
import { reactive, ref } from 'vue';
|
||||
import { reloadApi } from '/@/api/support/reload/reload-api';
|
||||
import { smartSentry } from '/@/lib/smart-sentry';
|
||||
import { SmartLoading } from '/@/components/framework/smart-loading';
|
||||
|
||||
// emit
|
||||
const emit = defineEmits(['refresh']);
|
||||
defineExpose({
|
||||
showModal,
|
||||
});
|
||||
|
||||
// ----------------------- 表单 隐藏 与 显示 ------------------------
|
||||
// 是否展示
|
||||
const visible = ref(false);
|
||||
function showModal(tag) {
|
||||
form.tag = tag;
|
||||
form.identification = '';
|
||||
form.args = '';
|
||||
visible.value = true;
|
||||
}
|
||||
|
||||
function onClose() {
|
||||
Object.assign(form, formDefault);
|
||||
visible.value = false;
|
||||
}
|
||||
|
||||
// 组件
|
||||
const formRef = ref();
|
||||
|
||||
const formDefault = {
|
||||
tag: '',
|
||||
identification: '',
|
||||
args: '',
|
||||
};
|
||||
let form = reactive({ ...formDefault });
|
||||
const rules = {
|
||||
identification: [{ required: true, message: '请输入运行标识' }],
|
||||
args: [{ required: true, message: '请输入参数值' }],
|
||||
};
|
||||
|
||||
// ----------------------- 提交 ------------------------
|
||||
|
||||
function onSubmit() {
|
||||
formRef.value
|
||||
.validate()
|
||||
.then(async () => {
|
||||
SmartLoading.show();
|
||||
try {
|
||||
await reloadApi.reload(form);
|
||||
message.success('reload成功');
|
||||
emit('refresh');
|
||||
onClose();
|
||||
} catch (error) {
|
||||
smartSentry.captureError(error);
|
||||
} finally {
|
||||
SmartLoading.hide();
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log('error', error);
|
||||
message.error('参数验证错误，请仔细填写表单数据!');
|
||||
});
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,133 @@
|
||||
<!--
|
||||
* reload
|
||||
*
|
||||
* @Author: 1024创新实验室-主任：卓大
|
||||
* @Date: 2022-07-21 21:55:12
|
||||
* @Wechat: zhuda1024
|
||||
* @Email: lab1024@163.com
|
||||
* @Copyright 1024创新实验室 （ https://1024lab.net ），2012-2022
|
||||
-->
|
||||
<template>
|
||||
<a-card size="small" :bordered="false" :hoverable="true">
|
||||
<a-alert>
|
||||
<template v-slot:message>
|
||||
<h4>Smart-Reload 心跳服务介绍：</h4>
|
||||
</template>
|
||||
<template v-slot:description>
|
||||
<pre>
|
||||
简介：SmartReload是一个可以在不重启进程的情况下动态重新加载配置或者执行某些预先设置的代码。
|
||||
|
||||
原理：
|
||||
- Java后端会在项目启动的时候开启一个Daemon线程，这个Daemon线程会每隔几秒轮询t_smart_item表的状态。
|
||||
- 如果【状态标识】与【上次状态标识】比较发生变化，会将参数传入SmartReload实现类，进行自定义操作。
|
||||
用途：
|
||||
· 用于刷新内存中的缓存
|
||||
· 用于执行某些后门代码
|
||||
· 用于进行Java热加载（前提是类结构不发生变化）
|
||||
· 其他不能重启服务的应用
|
||||
</pre
|
||||
>
|
||||
</template>
|
||||
</a-alert>
|
||||
|
||||
<a-row justify="end">
|
||||
<TableOperator class="smart-margin-bottom5 smart-margin-top5" v-model="columns" :tableId="TABLE_ID_CONST.SUPPORT.RELOAD" :refresh="ajaxQuery" />
|
||||
</a-row>
|
||||
|
||||
<a-table
|
||||
size="small"
|
||||
bordered
|
||||
class="smart-margin-top10"
|
||||
:dataSource="tableData"
|
||||
:loading="tableLoading"
|
||||
:columns="columns"
|
||||
rowKey="tag"
|
||||
:pagination="false"
|
||||
>
|
||||
<template #bodyCell="{ text, record, index, column }">
|
||||
<template v-if="column.dataIndex === 'action'">
|
||||
<div class="smart-table-operate">
|
||||
<a-button @click="doReload(record.tag)" v-privilege="'reload:execute'" type="link">执行</a-button>
|
||||
<a-button @click="showResultList(record.tag)" v-privilege="'reload:result'" type="link">查看结果</a-button>
|
||||
</div>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
|
||||
<DoReloadForm @refresh="ajaxQuery" ref="doReloadForm" />
|
||||
<ReloadResultList ref="reloadResultList" />
|
||||
</a-card>
|
||||
</template>
|
||||
<script setup>
|
||||
import { onMounted, reactive, ref } from 'vue';
|
||||
import DoReloadForm from './do-reload-form-modal.vue';
|
||||
import ReloadResultList from './reload-result-list.vue';
|
||||
import { reloadApi } from '/@/api/support/reload/reload-api';
|
||||
import { smartSentry } from '/@/lib/smart-sentry';
|
||||
import TableOperator from '/@/components/support/table-operator/index.vue';
|
||||
import { TABLE_ID_CONST } from '/@/constants/support/table-id-const';
|
||||
|
||||
//------------------------ 表格渲染 ---------------------
|
||||
|
||||
const columns = ref([
|
||||
{
|
||||
title: '标签',
|
||||
dataIndex: 'tag',
|
||||
width: 200,
|
||||
},
|
||||
{
|
||||
title: '运行标识',
|
||||
dataIndex: 'identification',
|
||||
},
|
||||
{
|
||||
title: '参数',
|
||||
dataIndex: 'args',
|
||||
},
|
||||
{
|
||||
title: '更新时间',
|
||||
dataIndex: 'updateTime',
|
||||
width: 150,
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createTime',
|
||||
width: 150,
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
dataIndex: 'action',
|
||||
fixed: 'right',
|
||||
width: 150,
|
||||
},
|
||||
]);
|
||||
|
||||
const tableLoading = ref(false);
|
||||
const tableData = ref([]);
|
||||
|
||||
async function ajaxQuery() {
|
||||
try {
|
||||
tableLoading.value = true;
|
||||
let res = await reloadApi.queryList();
|
||||
tableData.value = res.data;
|
||||
} catch (e) {
|
||||
smartSentry.captureError(e);
|
||||
} finally {
|
||||
tableLoading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(ajaxQuery);
|
||||
|
||||
// ------------------------------ 表格操作列： 执行 reload ------------------------------
|
||||
const doReloadForm = ref();
|
||||
function doReload(tag) {
|
||||
doReloadForm.value.showModal(tag);
|
||||
}
|
||||
|
||||
// ------------------------------ 表格操作列： 查看执行结果 ------------------------------
|
||||
|
||||
const reloadResultList = ref();
|
||||
function showResultList(tag) {
|
||||
reloadResultList.value.showModal(tag);
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,100 @@
|
||||
<!--
|
||||
* reload 结果
|
||||
*
|
||||
* @Author: 1024创新实验室-主任：卓大
|
||||
* @Date: 2022-07-21 21:55:12
|
||||
* @Wechat: zhuda1024
|
||||
* @Email: lab1024@163.com
|
||||
* @Copyright 1024创新实验室 （ https://1024lab.net ），2012-2022
|
||||
-->
|
||||
<template>
|
||||
<a-modal :visible="visible" title="reload结果列表" width="60%" :footer="null" @cancel="onClose">
|
||||
<a-button type="primary" @click="ajaxQuery" size="small">
|
||||
<template #icon>
|
||||
<ReloadOutlined />
|
||||
</template>
|
||||
刷新
|
||||
</a-button>
|
||||
<a-table :scroll="{ y: 350 }" size="small" bordered rowKey="id" class="smart-margin-top10" :dataSource="tableData" :columns="columns">
|
||||
<template #bodyCell="{ text, column }">
|
||||
<template v-if="column.dataIndex === 'result'">
|
||||
<a-tag :color="text ? 'success' : 'error'">{{ text ? '成功' : '失败' }}</a-tag>
|
||||
</template>
|
||||
</template>
|
||||
<template #expandedRowRender="{ record }">
|
||||
<pre style="margin: 0; font-size: 12px">
|
||||
{{ record.exception }}
|
||||
</pre>
|
||||
</template>
|
||||
</a-table>
|
||||
</a-modal>
|
||||
</template>
|
||||
<script setup>
|
||||
import { reactive, ref } from 'vue';
|
||||
import { reloadApi } from '/@/api/support/reload/reload-api';
|
||||
import { smartSentry } from '/@/lib/smart-sentry';
|
||||
defineExpose({
|
||||
showModal,
|
||||
});
|
||||
|
||||
// ----------------------- 表单 隐藏 与 显示 ------------------------
|
||||
// 是否展示
|
||||
const visible = ref(false);
|
||||
|
||||
function showModal(tag) {
|
||||
queryTag = tag;
|
||||
ajaxQuery();
|
||||
visible.value = true;
|
||||
}
|
||||
|
||||
function onClose() {
|
||||
visible.value = false;
|
||||
}
|
||||
|
||||
//------------------------ 表格查询 ---------------------
|
||||
let queryTag = '';
|
||||
const tableLoading = ref(false);
|
||||
const tableData = ref([]);
|
||||
|
||||
async function ajaxQuery() {
|
||||
try {
|
||||
tableLoading.value = true;
|
||||
let res = await reloadApi.queryReloadResult(queryTag);
|
||||
let count = 1;
|
||||
for (const item of res.data) {
|
||||
item.id = count++;
|
||||
}
|
||||
tableData.value = res.data;
|
||||
} catch (e) {
|
||||
smartSentry.captureError(e);
|
||||
} finally {
|
||||
tableLoading.value = false;
|
||||
}
|
||||
}
|
||||
|
||||
//------------------------ 表格列 ---------------------
|
||||
|
||||
const columns = reactive([
|
||||
{
|
||||
title: '标签',
|
||||
dataIndex: 'tag',
|
||||
},
|
||||
{
|
||||
title: '参数',
|
||||
dataIndex: 'args',
|
||||
},
|
||||
{
|
||||
title: '运行结果',
|
||||
dataIndex: 'result',
|
||||
},
|
||||
{
|
||||
title: '异常',
|
||||
dataIndex: 'exception',
|
||||
ellipsis: true,
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
dataIndex: 'createTime',
|
||||
},
|
||||
]);
|
||||
</script>
|
||||
Reference in New Issue
Block a user