monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by zhangtianqi
Commit eba366931ea5480c0ca7daf6c2d2fbe684e1184c 2 parents 038c5016 ef9e7654

Merge branch 'master-500-dev' of http://113.200.75.45:82/monitor_v3/hg-monitor-w… 

…eb into master-500-dev-ztq1
Inline Side-by-side
Showing 7 changed files with 215 additions and 1 deletions
@@ -3329,6 +3329,8 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -3329,6 +3329,8 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
3329 title += `<a class="layui-icon res-view-relation-topo" data-id=${resId} lay-tips="查看资源关系拓扑" style="margin-left: 10px"><i class="iconfont">&#XE515;</i></a>`; 3329 title += `<a class="layui-icon res-view-relation-topo" data-id=${resId} lay-tips="查看资源关系拓扑" style="margin-left: 10px"><i class="iconfont">&#XE515;</i></a>`;
3330 //lsq 2022-04-25 增加ping详情提交按钮 3330 //lsq 2022-04-25 增加ping详情提交按钮
3331 title += `<a class="layui-icon res-view-ping" data-id=${resId} data-resname=${resName} data-ip=${ip} data-restypename=${resTypeName} data-adminname=${adminName} lay-tips="历史数据" style="margin-left: 10px;position:relative;top:-3px;"> <img width="20" src="/src/style/img/ping.png" ></a>`; 3331 title += `<a class="layui-icon res-view-ping" data-id=${resId} data-resname=${resName} data-ip=${ip} data-restypename=${resTypeName} data-adminname=${adminName} lay-tips="历史数据" style="margin-left: 10px;position:relative;top:-3px;"> <img width="20" src="/src/style/img/ping.png" ></a>`;
  3332 + title += `<a class="layui-icon res-view-history" data-id=${resId} data-resname=${res.resName} data-ip=${ip} data-restypename=${res.resTypeName} data-adminname=${res.adminName} lay-tips="快照历史记录" style="top: -3px;float: right;"> <img width="20" src="/src/style/img/snapshothistory.png" ></a>`;
  3333 + title += `<a class="layui-icon res-view-addSnapshot" data-id=${resId} lay-tips="创建快照" style="top: -3px;float: right; margin-right: 10px"> <img width="20" src="/src/style/img/snapshotadd.png" ></a>`;
3332 if (resCategory === 'share' && hardwareFlag.endsWith("Y")) { 3334 if (resCategory === 'share' && hardwareFlag.endsWith("Y")) {
3333 /* 3335 /*
3334 title += `<a class="layui-icon res-view-assets-details" data-ip=${ip} data-name=${name} data-restype=${resType} data-id=${resId} lay-tips="资产配置信息"><i class="iconfont">&#XE517;</i></a>`; 3336 title += `<a class="layui-icon res-view-assets-details" data-ip=${ip} data-name=${name} data-restype=${resType} data-id=${resId} lay-tips="资产配置信息"><i class="iconfont">&#XE517;</i></a>`;
@@ -3354,6 +3356,8 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -3354,6 +3356,8 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
3354 title += `<a class="layui-icon res-view-relation-topo" data-id=${resId} lay-tips="查看资源关系拓扑" style="margin-left: 10px"><i class="iconfont">&#XE515;</i></a>`; 3356 title += `<a class="layui-icon res-view-relation-topo" data-id=${resId} lay-tips="查看资源关系拓扑" style="margin-left: 10px"><i class="iconfont">&#XE515;</i></a>`;
3355 //lsq 2022-04-25 增加ping详情提交按钮 3357 //lsq 2022-04-25 增加ping详情提交按钮
3356 title += `<a class="layui-icon res-view-ping" data-id=${resId} data-resname=${res.resName} data-ip=${ip} data-restypename=${res.resTypeName} data-adminname=${res.adminName} lay-tips="历史数据" style="margin-left: 10px;position:relative;top:-3px;"> <img width="20" src="/src/style/img/ping.png" ></a>`; 3358 title += `<a class="layui-icon res-view-ping" data-id=${resId} data-resname=${res.resName} data-ip=${ip} data-restypename=${res.resTypeName} data-adminname=${res.adminName} lay-tips="历史数据" style="margin-left: 10px;position:relative;top:-3px;"> <img width="20" src="/src/style/img/ping.png" ></a>`;
  3359 + title += `<a class="layui-icon res-view-history" data-id=${resId} data-resname=${res.resName} data-ip=${ip} data-restypename=${res.resTypeName} data-adminname=${res.adminName} lay-tips="快照历史记录" style="top: -3px;float: right;"> <img width="20" src="/src/style/img/snapshothistory.png" ></a>`;
  3360 + title += `<a class="layui-icon res-view-addSnapshot" data-id=${resId} lay-tips="创建快照" style="top: -3px;float: right; margin-right: 10px"> <img width="20" src="/src/style/img/snapshotadd.png" ></a>`;
3357 if (resCategory === 'share' && hardwareFlag.endsWith("Y")) { 3361 if (resCategory === 'share' && hardwareFlag.endsWith("Y")) {
3358 /* 3362 /*
3359 title += `<a class="layui-icon res-view-assets-details" data-ip=${ip} data-name=${name} data-restype=${resType} data-id=${resId} lay-tips="资产配置信息"><i class="iconfont">&#XE517;</i></a>`; 3363 title += `<a class="layui-icon res-view-assets-details" data-ip=${ip} data-name=${name} data-restype=${resType} data-id=${resId} lay-tips="资产配置信息"><i class="iconfont">&#XE517;</i></a>`;
@@ -3645,7 +3649,39 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -3645,7 +3649,39 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
3645 }); 3649 });
3646 }); 3650 });
3647 //end lsq 2022-04-24 3651 //end lsq 2022-04-24
3648 - 3652 + $('a.res-view-addSnapshot').unbind('click').on('click', function () {
  3653 + var resId = $(this).data('id');
  3654 + layer.confirm('将创建该资源的所有快照信息，请确认', {
  3655 + btn: ['确定', '取消'] //按钮
  3656 + }, function () {
  3657 + admin.req({
  3658 + url: common.domainName + '/api-web/snapshot/his/add?access_token=' + layui.sessions.getToken().access_token +'&resId=' + resId
  3659 + , type: 'get'
  3660 + , done: function (res) {
  3661 + if (res.success) {
  3662 + layer.msg('操作成功！', {offset: '15px', icon: 1, time: 2000});
  3663 + } else {
  3664 + layer.msg('操作失败，请与管理员联系！', {offset: '15px', icon: 7, time: 2000});
  3665 + }
  3666 + }
  3667 + });
  3668 + });
  3669 + });
  3670 + $('a.res-view-history').unbind('click').on('click', function () {
  3671 + let name = $(this).data('resname')+' |'+$(this).data('restypename')+' |'+$(this).data('ip')+' |'+'历史快照数据';
  3672 + let paramStr = '?resId=' + $(this).data('id');
  3673 + layer.open({
  3674 + title: [name, 'font-size:18px;'],
  3675 + type: 2,
  3676 + area: ['90%', '90%'],
  3677 + shadeClose: true,//开启遮罩层
  3678 + id: 'res-history',
  3679 + content: ['/vue3/index.html#/vue3/snapshot/history' + paramStr, 'no'],
  3680 + cancel: function () {
  3681 + clearTimeout();
  3682 + }
  3683 + });
  3684 + });
3649 // 查看资产配置信息 3685 // 查看资产配置信息
3650 $('a.res-view-assets-details').unbind('click').on('click', function () { 3686 $('a.res-view-assets-details').unbind('click').on('click', function () {
3651 var $that = $(this); 3687 var $that = $(this);
@@ -155,6 +155,12 @@ const routes = [{ @@ -155,6 +155,12 @@ const routes = [{
155 name: 'snapshot', 155 name: 'snapshot',
156 component: () => myImport('views/snapshot/index') 156 component: () => myImport('views/snapshot/index')
157 }, 157 },
  158 + //快照历史
  159 + {
  160 + path: '/vue3/snapshot/history',
  161 + name: 'snapshotHistory',
  162 + component: () => myImport('views/snapshot/history/index')
  163 + },
158 ]; 164 ];
159 165
160 // hash模式： createWebHashHistory 166 // hash模式： createWebHashHistory
  1 +<div :style="{'height':height+'px','max-height':height+'px','padding':'10px 0 10px 10px','background':'#fff','box-sizing':'border-box'}"
  2 + class="container">
  3 + <div :style="{'min-height':height+'px','max-height':height+'px','height':'100%','padding-top':'3px'}"
  4 + class="cm-card">
  5 + <div class="search">
  6 + <div class="condition ping">
  7 + <el-form-item>
  8 + <el-date-picker
  9 + :size="$global.elementConfig.size.input"
  10 + end-placeholder="开始时间"
  11 + placeholder="开始时间"
  12 + type="datetime"
  13 + v-model="search.startTime"
  14 + value-format="YYYY-MM-DD HH:mm:ss"
  15 + />
  16 +
  17 + </el-form-item>
  18 + <el-form-item>
  19 + <el-date-picker
  20 + :size="$global.elementConfig.size.input"
  21 + end-placeholder="结束时间"
  22 + placeholder="结束时间"
  23 + type="datetime"
  24 + v-model="search.endTime"
  25 + value-format="YYYY-MM-DD HH:mm:ss"
  26 + />
  27 +
  28 + </el-form-item>
  29 + <el-form-item>
  30 + <el-button :size="$global.elementConfig.size.button" type="primary" @click="getDataList">查询</el-button>
  31 + </el-form-item>
  32 + </div>
  33 + </div>
  34 + <div class="search-table">
  35 + <cm-table-page :columns="tableData.columns" :dataList="tableData.dataList" :height="(height - 110)"
  36 + :loading="false" :pageSize="search.pageSize" :showBorder="true"
  37 + :showIndex="true" :showPage="true" :showSelection="true"
  38 + :showTools="true" :total="tableData.count" @loaddata="loaddata">
  39 + <template #tools="{scope}">
  40 + <div class="list-handle">
  41 + <span class="icon-bg">
  42 + <i @click="goResDetail(scope.row.resName,scope.row.resType)" class="el-icon-view" title="查看详情"></i>
  43 + </span>
  44 + <span class="icon-bg">
  45 + <i @click="handleDelete(scope.row)" class="el-icon-delete" title="删除"></i>
  46 + </span>
  47 + </div>
  48 + </template>
  49 + </cm-table-page>
  50 + </div>
  51 + </div>
  52 +</div>
  53 +
  1 +export default {
  2 + name: 'snapshotHistory',
  3 + template: '',
  4 + components: {},
  5 + props: [],
  6 + setup(props, {attrs, slots, emit}) {
  7 + const {proxy} = Vue.getCurrentInstance();
  8 + let height = Vue.ref(window.innerHeight);
  9 + let resId = Vue.ref('');
  10 + let search = Vue.ref({
  11 + pageNum: 1,
  12 + pageSize: 20,
  13 + startTime: '',
  14 + endTime: '',
  15 + keyWord: ''
  16 +
  17 + });
  18 + //表格字段
  19 + let tableData = Vue.ref({
  20 + count: 0,
  21 + dataList: [],
  22 + columns: [
  23 + {
  24 + prop: 'createUser',
  25 + label: '快照创建人',
  26 + sortable: true,
  27 + align: 'center',
  28 + width: '250'
  29 + },
  30 + {
  31 + prop: 'createTime',
  32 + label: '快照创建时间',
  33 + sortable: true,
  34 + align: 'center',
  35 + width: '300'
  36 + },
  37 + {
  38 + prop: 'batchNo',
  39 + label: '批次号',
  40 + sortable: true,
  41 + align: 'center',
  42 + }
  43 + ]
  44 + })
  45 + // 获取列表
  46 + let getDataList = () => {
  47 + let params = {
  48 + resId: resId.value,
  49 + startTime: search.value.startTime,
  50 + endTime: search.value.endTime,
  51 + keyWord: search.value.keyword
  52 + }
  53 + proxy.$http.get(`/api-web/snapshot/his/getList`, params, function (res) {
  54 + if (res.success) {
  55 + tableData.value.dataList = res.data;
  56 + tableData.value.count = res.count;
  57 + } else {
  58 + tableData.value.dataList = [];
  59 + tableData.value.count = 0;
  60 + }
  61 + });
  62 + }
  63 + //删除快照历史数据
  64 + let handleDelete = (row) =>{
  65 + let params = {
  66 + resId: resId.value,
  67 + batchNo: row.batchNo
  68 + }
  69 + proxy.$global.confirm('将永久删除该快照历史数据，请确认', function () {
  70 + proxy.$http.get(`/api-web/snapshot/his/delete`, params, function (res) {
  71 + if (res.success) {
  72 + proxy.$global.showMsg("删除成功","success");
  73 + getDataList();
  74 + } else {
  75 + proxy.$global.showMsg("删除失败","error");
  76 + }
  77 + });
  78 + });
  79 + }
  80 +
  81 + //获取resId
  82 + let getResId = () => {
  83 + resId.value = proxy.$route.query.resId;
  84 + }
  85 + let loaddata = ({page, limit}) => {
  86 + search.value.pageNum = page;
  87 + search.value.pageSize = limit;
  88 + getDataList();
  89 + }
  90 + //查看资源详情
  91 + let goResDetail = (resName, resType) => {
  92 + proxy.$global.openDetail(resId.value, resType, proxy);
  93 + }
  94 + // 挂载完
  95 + Vue.onMounted(() => {
  96 + getResId();
  97 + getDataList();
  98 + })
  99 +
  100 +
  101 + return {
  102 + height,
  103 + resId,
  104 + getDataList,
  105 + tableData,
  106 + search,
  107 + loaddata,
  108 + goResDetail,
  109 + handleDelete
  110 + }
  111 + }
  112 +
  113 +}
@@ -250,6 +250,12 @@ const routes = [{ @@ -250,6 +250,12 @@ const routes = [{
250 name: 'snapshot', 250 name: 'snapshot',
251 component: () => myImport('views/snapshot/index') 251 component: () => myImport('views/snapshot/index')
252 }, 252 },
  253 + //快照历史
  254 + {
  255 + path: '/vue3/snapshot/history',
  256 + name: 'snapshotHistory',
  257 + component: () => myImport('views/snapshot/history/index')
  258 + },
253 ]; 259 ];
254 260
255 // hash模式： createWebHashHistory 261 // hash模式： createWebHashHistory