monitor_v3 / hg-monitor-web · Commits

Go to a project

Authored by xwx
Commit 6018730acb350dac19a3eb6355de4f1e22a41e02 2 parents 3acddf94 b643faaf

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

…eb into master-500-dev-xwx
Inline Side-by-side
Showing 25 changed files with 737 additions and 76 deletions
@@ -317,8 +317,8 @@ layui.define(['form', 'admin', 'laydate', 'common', 'sessions', 'reskpilist'], f @@ -317,8 +317,8 @@ layui.define(['form', 'admin', 'laydate', 'common', 'sessions', 'reskpilist'], f
317 charToExpr(data, 'commonlyExpr'); 317 charToExpr(data, 'commonlyExpr');
318 charToExpr(data, 'importantExpr'); 318 charToExpr(data, 'importantExpr');
319 charToExpr(data, 'seriousExpr'); 319 charToExpr(data, 'seriousExpr');
320 -  
321 - form.on('submit(add-alarmpolicy-form)', function () { 320 + //lsq 告警策略编辑不了，id值应该选择的是submit的按钮的lay-filter，不是add-alarmpolicy-form， 2022-09-27
  321 + form.on('submit(alarmpolicy-form-save-id)', function () {
322 delete data.noticeMergeFlagExpr; 322 delete data.noticeMergeFlagExpr;
323 admin.req({ 323 admin.req({
324 url: domainName + '/api-web/alarmPolicy/save?access_token=' + accessToken 324 url: domainName + '/api-web/alarmPolicy/save?access_token=' + accessToken
@@ -407,7 +407,7 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -407,7 +407,7 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
407 var $html = addIconByValue(valueStr); 407 var $html = addIconByValue(valueStr);
408 var resStyle = obj.alarmEleMatchStyle(ar.flag, ar.kpiId); 408 var resStyle = obj.alarmEleMatchStyle(ar.flag, ar.kpiId);
409 span += ' <span ' + menuId + ' style="text-align:left;width:40%">' + ar.kpiName + '</span>' + 409 span += ' <span ' + menuId + ' style="text-align:left;width:40%">' + ar.kpiName + '</span>' +
410 - '<span title="' + titleStr + '" style="width:60%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;' + resStyle + '">' 410 + '<span title="' + titleStr + '" style="width:60%;overflow: hidden !important;text-overflow: ellipsis;white-space: nowrap;' + resStyle + '">'
411 + $html + valueStr +unit+ '</span>'; 411 + $html + valueStr +unit+ '</span>';
412 //补充空白区域 412 //补充空白区域
413 if (v.length < cols) { 413 if (v.length < cols) {
@@ -4554,6 +4554,8 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -4554,6 +4554,8 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
4554 //lsq 状态信息无其他下探 2022-06-08 4554 //lsq 状态信息无其他下探 2022-06-08
4555 var statusF = $menu.data('statusf'); 4555 var statusF = $menu.data('statusf');
4556 var one = $menu.data('one'); 4556 var one = $menu.data('one');
  4557 + //lsq 只有kpiIdent==1时才有性能趋势 2022-09-27
  4558 + var kpiIdent=$menu.data('ident');
4557 var menubox = '<div class="detail_menubox" id="detail_menubox_id" style="color:#666;"><ul>'; 4559 var menubox = '<div class="detail_menubox" id="detail_menubox_id" style="color:#666;"><ul>';
4558 //lsq 只有状态指标下探的标识 4560 //lsq 只有状态指标下探的标识
4559 if (one == 1) { 4561 if (one == 1) {
@@ -4567,7 +4569,7 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele @@ -4567,7 +4569,7 @@ layui.define(['laytpl', 'admin', 'form', 'table', 'echarts', 'sessions', 'xmSele
4567 if (!hideM) { 4569 if (!hideM) {
4568 menubox += '<li type="m"><i class="layui-icon">&#xe64d;</i>过滤多指标</li>'; 4570 menubox += '<li type="m"><i class="layui-icon">&#xe64d;</i>过滤多指标</li>';
4569 } 4571 }
4570 - if (!nature) { 4572 + if (!nature && kpiIdent==1) {
4571 menubox += '<li type="t"><i class="layui-icon">&#xe62c;</i>性能趋势</li>'; 4573 menubox += '<li type="t"><i class="layui-icon">&#xe62c;</i>性能趋势</li>';
4572 } 4574 }
4573 // if(!statusF){ 4575 // if(!statusF){
@@ -8660,3 +8660,11 @@ form.layui-card-header.layuiadmin-card-header-auto { @@ -8660,3 +8660,11 @@ form.layui-card-header.layuiadmin-card-header-auto {
8660 width: 16px; 8660 width: 16px;
8661 height: 16px; 8661 height: 16px;
8662 } 8662 }
  8663 +/*lsq 快照管理详情页基本信息悬浮样式修改 2022-09-27*/
  8664 +#base-info-tips>.info-table>li span,#base-info-tips>.info-table>li span .div-link-state-list{
  8665 + display: flex;
  8666 + align-items: center;
  8667 +}
  8668 +#base-info-tips>.info-table>li span:nth-child(2n){
  8669 + flex:2;
  8670 +}
@@ -345,8 +345,8 @@ @@ -345,8 +345,8 @@
345 </div> 345 </div>
346 </div> 346 </div>
347 </div> 347 </div>
348 -  
349 - <button type="submit" lay-submit class="layui-btn hide" id="alarmpolicy-form-save-id">保存</button> 348 + <!--lsq 告警策略编辑不了，按钮没有lay-filter 2022-09-27-->
  349 + <button type="submit" lay-submit class="layui-btn hide" lay-filter="alarmpolicy-form-save-id" id="alarmpolicy-form-save-id">保存</button>
350 </form> 350 </form>
351 <script> 351 <script>
352 layui.use('alarmpolicyAdd', function (fn) { 352 layui.use('alarmpolicyAdd', function (fn) {
@@ -54,7 +54,8 @@ @@ -54,7 +54,8 @@
54 <label class="layui-form-label">发送用户</label> 54 <label class="layui-form-label">发送用户</label>
55 <div style="width: calc(100% - 110px)"> 55 <div style="width: calc(100% - 110px)">
56 <div class="layui-input-inline" style="width: calc(100% - 10px);display: inline-flex;"> 56 <div class="layui-input-inline" style="width: calc(100% - 10px);display: inline-flex;">
57 - <div class="tags" id="select_noticeTimely_id_user" style="width: calc(100% - 20px);border: solid 1px #D2D2D2;margin-top: 0px;height: 36px;"></div> 57 + <!--lsq 选择用户过多时，超出高度滚动 2022-09-27-->
  58 + <div class="tags" id="select_noticeTimely_id_user" style="width: calc(100% - 20px);border: solid 1px #D2D2D2;margin-top: 0px;min-height:36px; height: auto; max-height: 200px; overflow: auto;"></div>
58 <i class="layui-icon form-btn-icon" id="noticeTimely-form-select-users" style="line-height: 36px;margin-left: 5px;">&#xe615;</i> 59 <i class="layui-icon form-btn-icon" id="noticeTimely-form-select-users" style="line-height: 36px;margin-left: 5px;">&#xe615;</i>
59 </div> 60 </div>
60 </div> 61 </div>
  1 +<title>操作日志</title>
  2 +<iframe class="layadmin-iframe" src="/vue3/index.html#/vue3/operationLog" style="height: 99.5%!important;"/>
@@ -11,6 +11,8 @@ @@ -11,6 +11,8 @@
11 @import "../css/cmdbdatasync.css"; 11 @import "../css/cmdbdatasync.css";
12 /*登录logo配置*/ 12 /*登录logo配置*/
13 @import "../css/logoConfig.css"; 13 @import "../css/logoConfig.css";
  14 +/*lsq 操作记录日志样式 2022-09-26*/
  15 +@import "../css/operationLog.css";
14 16
15 .d-flex { 17 .d-flex {
16 display: flex; 18 display: flex;
  1 +.operation-log-search{
  2 + display: flex;
  3 + align-items: center;
  4 + justify-content: center;
  5 + margin-top:6px;
  6 +}
  7 +.container-none{
  8 + width:100%;
  9 + height: 20px;
  10 + background:#fafafa;
  11 +}
  12 +.operation-log-container.container .cm-card .search-table{padding:15px;}
  13 +.echart-con{
  14 + padding:10px;
  15 +}
  16 +.echart-con .echart-title{
  17 + font-size: 16px;
  18 + color:#1e9fff;
  19 + text-align: left;
  20 + margin-bottom: 6px;
  21 + padding:10px;
  22 +}
  23 +.echart-left,.echart-right{
  24 + border:1px solid #eee;
  25 +}
  26 +.echart-chart{
  27 + height: 300px;
  28 +
  29 +}
@@ -178,6 +178,12 @@ const routes = [{ @@ -178,6 +178,12 @@ const routes = [{
178 name: 'thirdSet', 178 name: 'thirdSet',
179 component: () => myImport('views/thirdSet/index') 179 component: () => myImport('views/thirdSet/index')
180 }, 180 },
  181 + //操作日志
  182 + {
  183 + path: '/vue3/operationLog',
  184 + name: 'operationLog',
  185 + component: () => myImport('views/operationLog/index')
  186 + }
181 ]; 187 ];
182 188
183 // hash模式： createWebHashHistory 189 // hash模式： createWebHashHistory
  1 +<div :style="{'height':height+'px','max-height':height+'px'}" class="container operation-log-container">
  2 + <div :style="{'min-height':height+'px','max-height':height+'px','height':'100%'}" class="cm-card">
  3 + <el-row>
  4 + <el-col :span="14" class="search-item">
  5 + <div class="search">
  6 + <div class="operation-log-search">
  7 + <el-button-group class="ml-4">
  8 + <el-button :size="$global.elementConfig.size.button" :type="search.status == 1 ? 'primary' : ''"
  9 + @click="getDataList(1)">用户名
  10 + </el-button>
  11 + <el-button :size="$global.elementConfig.size.button" :type="search.status == 2 ? 'primary' : ''"
  12 + @click="getDataList(2)">巡检组
  13 + </el-button>
  14 + </el-button-group>
  15 + </div>
  16 + </div>
  17 + <div class="echart-con">
  18 + <div class="echart-left">
  19 + <div class="echart-title">巡检点击完成统计</div>
  20 + <div class="echart-chart">
  21 + <LineChart :optionData="optionData" v-if="optionData"></LineChart>
  22 + </div>
  23 + </div>
  24 + </div>
  25 +
  26 + </el-col>
  27 + <el-col :span="10">
  28 + <div class="search">
  29 + <div class="operation-log-search">
  30 + <el-button-group class="ml-4">
  31 + <el-button :size="$global.elementConfig.size.button" :type="search.status == 'yesterday' ? 'primary' : ''"
  32 + @click="getDataList('yesterday')">昨天
  33 + </el-button>
  34 + <el-button :size="$global.elementConfig.size.button" :type="search.status == 'today' ? 'primary' : ''"
  35 + @click="getDataList('today')">今天
  36 + </el-button>
  37 + <el-button :size="$global.elementConfig.size.button" :type="search.status == 'lastWeek' ? 'primary' : ''"
  38 + @click="getDataList('lastWeek')">上周
  39 + </el-button>
  40 + <el-button :size="$global.elementConfig.size.button" :type="search.status == 'thisWeek' ? 'primary' : ''"
  41 + @click="getDataList('thisWeek')">本周
  42 + </el-button>
  43 + <el-button :size="$global.elementConfig.size.button" :type="search.status == 'thisMonth' ? 'primary' : ''"
  44 + @click="getDataList('thisMonth')">本月
  45 + </el-button>
  46 + <el-button style="border-radius: 0;" :size="$global.elementConfig.size.button" :type="search.status == 'all' ? 'primary' : ''"
  47 + @click="getDataList('all')">全部
  48 + </el-button>
  49 + </el-button-group>
  50 + <el-date-picker
  51 + :size="$global.elementConfig.size.input"
  52 + style="width:150px;border-radius: 0 4px 4px 0;"
  53 + end-placeholder="结束日期"
  54 + format="YYYY-MM-DD"
  55 + range-separator="-"
  56 + start-placeholder="开始日期"
  57 + type="daterange"
  58 + v-model="search.dateTime"
  59 + value-format="YYYY-MM-DD"
  60 + :prefix-icon="'none'"
  61 + @focus="dateFocus"
  62 + @change="dateChange"
  63 + />
  64 + </div>
  65 + </div>
  66 + <div class="echart-con">
  67 + <div class="echart-right">
  68 + <div class="echart-title">人员功能点击量</div>
  69 + <div class="echart-chart">
  70 + <LineChart :optionData="optionDataR" v-if="optionDataR"></LineChart>
  71 + </div>
  72 + </div>
  73 + </div>
  74 +
  75 + </el-col>
  76 + </el-row>
  77 +
  78 + <div class="container-none"></div>
  79 + <div class="search-table">
  80 + <cm-table-page :columns="tableData.columns" :dataList="tableData.dataList"
  81 + :height="height - 110"
  82 + :loading="false"
  83 + :pageSize="pageSize"
  84 + :showBorder="true"
  85 + :showIndex="true"
  86 + :showPage="true"
  87 + :showSelection="false"
  88 + :showTools="false"
  89 + :total="tableData.count"
  90 + @loaddata="loaddata">
  91 + <template #default="{row,prop,column}">
  92 +
  93 + </template>
  94 + </cm-table-page>
  95 + </div>
  96 + </div>
  97 +</div>
  98 +
  99 +<!--新增编辑弹框-->
  100 +<cm-dialog :showDialogVisible="dialog.show" :showFooter="false" :title="dialog.title" @hidedialog="hideDialog">
  101 + <template v-slot>
  102 + </template>
  103 +</cm-dialog>
  104 +
  1 +export default {
  2 + name: 'operationLog',
  3 + template: '',
  4 + components: {
  5 + 'LineChart': Vue.defineAsyncComponent(
  6 + () => myImport('views/page/components/lineChart/index')
  7 + )
  8 + },
  9 + props: [],
  10 + setup(props, {attrs, slots, emit}) {
  11 + const {proxy} = Vue.getCurrentInstance();
  12 + let isView = Vue.ref(false);
  13 + let height = Vue.ref(window.innerHeight);
  14 + let optionData = Vue.ref('');
  15 + let optionDataR = Vue.ref('');
  16 + let series = Vue.ref([]);
  17 + let seriesR = Vue.ref([]);
  18 + let names = Vue.ref(['智能综合巡检系统', '数据中心虚拟化', '备份系统']);
  19 + let namesR = Vue.ref(['吴斌斌','袁晋鹏'])
  20 + let kpiName=Vue.ref('');
  21 + let kpiNameR = Vue.ref('');
  22 + let kpiUnit=Vue.ref('');
  23 + let kpiUnitR=Vue.ref('');
  24 + let colorsArr = Vue.ref([
  25 + {
  26 + start: '#468ced',
  27 + end: '#68a5fa'
  28 + },
  29 + {
  30 + start: '#79dda1',
  31 + end: '#9bddb5'
  32 + }
  33 + ])
  34 + const optionDataInit = () => {
  35 +
  36 + optionData.value = {
  37 + tooltip: {
  38 + trigger: 'axis',
  39 + formatter: function (param) {
  40 + var tips = kpiName.value + " " + param[0].name + "<br/>";
  41 + $.each(param, function (i, v) {
  42 + tips += v.marker + " " + v.seriesName + ":" + v.value + kpiUnit.value + "</br>"
  43 + });
  44 + return tips;
  45 + }
  46 + },
  47 + legend: {
  48 + show: true
  49 + },
  50 + grid: {
  51 + top: '10%',
  52 + left: '3%',
  53 + right: '4%',
  54 + bottom: '5%',
  55 + containLabel: true
  56 + },
  57 + toolbox: {
  58 + feature: {
  59 + saveAsImage: {
  60 + show: false
  61 + }
  62 + }
  63 + },
  64 + xAxis: {
  65 + type: 'category',
  66 + data: names.value,
  67 + axisLine: {
  68 + lineStyle: {
  69 + color: '#c9c9c9'
  70 + }
  71 + },
  72 + axisLabel: {
  73 + color: '#232425',
  74 + showMaxLabel: true,
  75 + lineHeight:18,
  76 + formatter: function (params) {
  77 + var newParamsName = '';
  78 + let paramsNameNumber = params.length;
  79 + let provideNumber = 4;
  80 + let rowNumber = Math.ceil(paramsNameNumber / provideNumber);
  81 + if (paramsNameNumber > provideNumber) {
  82 + for (let i = 0; i < rowNumber; i++) {
  83 + let tempStr = '';
  84 + let start = i * provideNumber;
  85 + let end = start + provideNumber;
  86 + if (i == rowNumber - 1) {
  87 + tempStr = params.substring(start, paramsNameNumber);
  88 + } else {
  89 + tempStr = params.substring(start, end) + "\n";
  90 + }
  91 + newParamsName += tempStr;
  92 + }
  93 + } else {
  94 + newParamsName = params;
  95 + }
  96 + return newParamsName;
  97 + }
  98 + },
  99 + splitArea: {
  100 + show: true,
  101 + areaStyle: {
  102 + color: ['rgba(200,200,200,0.1)', 'transparent'
  103 + ]
  104 + }
  105 + }
  106 + },
  107 + yAxis: {
  108 + type: 'value',
  109 + scale: true,
  110 + min:0,
  111 + boundaryGap: ['10%', '10%'],
  112 + axisLine: {
  113 + lineStyle: {
  114 + color: '#232425'
  115 + },
  116 + show: false
  117 + },
  118 + axisTick: {
  119 + show: false
  120 + },
  121 + splitLine: {
  122 + lineStyle: {
  123 + color: ['#ddd'],
  124 + type: 'dotted',
  125 +
  126 + }
  127 + }
  128 + },
  129 + series: series.value
  130 + };
  131 + optionDataR.value= {
  132 + tooltip: {
  133 + trigger: 'axis',
  134 + formatter: function (param) {
  135 + var tips = kpiName.value + " " + param[0].name + "<br/>";
  136 + $.each(param, function (i, v) {
  137 + tips += v.marker + " " + v.seriesName + ":" + v.value + kpiUnit.value + "</br>"
  138 + });
  139 + return tips;
  140 + }
  141 + },
  142 + legend: {
  143 + show: true
  144 + },
  145 + grid: {
  146 + top: '10%',
  147 + left: '3%',
  148 + right: '4%',
  149 + bottom: '5%',
  150 + containLabel: true
  151 + },
  152 + toolbox: {
  153 + feature: {
  154 + saveAsImage: {
  155 + show: false
  156 + }
  157 + }
  158 + },
  159 + xAxis: {
  160 + type: 'category',
  161 + data: namesR.value,
  162 + axisLine: {
  163 + lineStyle: {
  164 + color: '#c9c9c9'
  165 + }
  166 + },
  167 + axisLabel: {
  168 + color: '#232425',
  169 + showMaxLabel: true,
  170 + lineHeight:18,
  171 + formatter: function (params) {
  172 + var newParamsName = '';
  173 + let paramsNameNumber = params.length;
  174 + let provideNumber = 4;
  175 + let rowNumber = Math.ceil(paramsNameNumber / provideNumber);
  176 + if (paramsNameNumber > provideNumber) {
  177 + for (let i = 0; i < rowNumber; i++) {
  178 + let tempStr = '';
  179 + let start = i * provideNumber;
  180 + let end = start + provideNumber;
  181 + if (i == rowNumber - 1) {
  182 + tempStr = params.substring(start, paramsNameNumber);
  183 + } else {
  184 + tempStr = params.substring(start, end) + "\n";
  185 + }
  186 + newParamsName += tempStr;
  187 + }
  188 + } else {
  189 + newParamsName = params;
  190 + }
  191 + return newParamsName;
  192 + }
  193 + },
  194 + splitArea: {
  195 + show: true,
  196 + areaStyle: {
  197 + color: ['rgba(200,200,200,0.1)', 'transparent'
  198 + ]
  199 + }
  200 + }
  201 + },
  202 + yAxis: {
  203 + type: 'value',
  204 + scale: true,
  205 + boundaryGap: ['10%', '10%'],
  206 + axisLine: {
  207 + lineStyle: {
  208 + color: '#232425'
  209 + },
  210 + show: false
  211 + },
  212 + axisTick: {
  213 + show: false
  214 + },
  215 + splitLine: {
  216 + lineStyle: {
  217 + color: ['#ddd'],
  218 + type: 'dotted',
  219 +
  220 + }
  221 + }
  222 + },
  223 + series: seriesR.value
  224 + };
  225 + }
  226 + let rateData=Vue.ref([
  227 + {name:'应点击量',data:[1,34,12]},
  228 + {name:'实际点击量',data:[15,24,10]}
  229 + ])
  230 + let rateDataR=Vue.ref([
  231 + {name:'',data:[1,6,8,9,10]},
  232 + ])
  233 + const setSeries = () => {
  234 + series.value = [];
  235 + $.each(rateData.value, function (i, v) {
  236 + series.value.push({
  237 + name: v.name,
  238 + type: 'bar',
  239 + barWidth: 16,//设置柱状图大小
  240 + data: v.data,
  241 + stack:'total',
  242 + symbolSize: 12,
  243 + symbol: 'circle',
  244 + itemStyle: {
  245 + normal: {
  246 + // color: colorsArr.value[i].start //图标颜色
  247 + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ //关键在这里, 设置面积渐变
  248 + offset: 0,
  249 + color: colorsArr.value[i].start //这里是我设置的渐变的颜色从线条颜色变为透明
  250 + }, {
  251 + offset: 1,
  252 + color: colorsArr.value[i].end
  253 + }])
  254 + }
  255 + }
  256 + })
  257 + });
  258 +
  259 + seriesR.value = [];
  260 + $.each(rateDataR.value, function (i, v) {
  261 + seriesR.value.push({
  262 + name: v.name,
  263 + type: 'bar',
  264 + barWidth: 16,//设置柱状图大小
  265 + data: v.data,
  266 + stack:'noStack',
  267 + symbolSize: 12,
  268 + symbol: 'circle',
  269 + itemStyle: {
  270 + normal: {
  271 + // color: colorsArr.value[i].start //图标颜色
  272 + color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ //关键在这里, 设置面积渐变
  273 + offset: 0,
  274 + color: colorsArr.value[i].start //这里是我设置的渐变的颜色从线条颜色变为透明
  275 + }, {
  276 + offset: 1,
  277 + color: colorsArr.value[i].end
  278 + }])
  279 + },
  280 + borderRadius:[3,3,0,0]
  281 + }
  282 + })
  283 + });
  284 +
  285 + optionDataInit();
  286 + }
  287 + let search = Vue.ref({
  288 + status: 'today',
  289 + dateTime:'',
  290 + keyword: '',
  291 + page: 1,
  292 + limit: 10,
  293 + });
  294 + let dialog = Vue.ref({
  295 + title: "处理审批",
  296 + show: false,
  297 + amId: '',
  298 + amStatus: 0,
  299 + alarmId: '',
  300 + });
  301 +
  302 + //表格字段
  303 + let tableData = Vue.ref({
  304 + count: 0,
  305 + dataList: [],
  306 + columns: [
  307 + {
  308 + prop: 'alarmNo',
  309 + label: '用户名',
  310 + sortable: true,
  311 + align: 'center',
  312 + width: '150'
  313 + },
  314 + {
  315 + prop: 'resName',
  316 + label: '时间',
  317 + sortable: true,
  318 + align: 'center',
  319 + width: '250',
  320 + },
  321 + {
  322 + prop: 'resTypeName',
  323 + label: 'IP地址',
  324 + sortable: true,
  325 + align: 'center',
  326 + width: '150'
  327 + }, {
  328 + prop: 'managenameName',
  329 + label: '访问位置',
  330 + sortable: true,
  331 + align: 'center',
  332 + }, {
  333 + prop: 'reason',
  334 + label: '停留总时长',
  335 + sortable: true,
  336 + align: 'center',
  337 + width: '120'
  338 + }
  339 + ]
  340 + })
  341 + //点击时间选择时，其他按钮不高亮
  342 + let dateFocus=()=>{
  343 + search.value.status = 'dateRange';
  344 + }
  345 + //时间更改事件
  346 + let dateChange=(val)=>{
  347 + console.log(val,search.value.dateTime)
  348 + getDataList('dateRange')
  349 + }
  350 +
  351 + //获取aj配置信息
  352 + let statusVal = Vue.ref('today');
  353 + let getDataList = (status) => {
  354 + if (status == undefined) {
  355 + status = 'today'
  356 + }
  357 + if(status != 'dateRange'){
  358 + search.value.dateTime=[];
  359 + }
  360 + statusVal.value = status;
  361 + search.value.status = status;
  362 + let startTime='';
  363 + let endTime=''
  364 + if(search.value.dateTime && search.value.dateTime.length>0){
  365 + startTime=search.value.dateTime[0];
  366 + endTime=search.value.dateTime[1];
  367 + }
  368 + let params={
  369 + page: search.value.page,
  370 + limit: search.value.limit,
  371 + keyword: search.value.keyword,
  372 + status: search.value.status,
  373 + startTime:startTime,
  374 + endTime:endTime
  375 + }
  376 + proxy.$http.get(`/api-web/bAlarmManage/page`, params, function (res) {
  377 + if (res && res.data) {
  378 + tableData.value.dataList = res.data;
  379 + tableData.value.count = res.count;
  380 + } else {
  381 + tableData.value.dataList = [];
  382 + tableData.value.count = 0;
  383 + }
  384 + });
  385 + }
  386 +
  387 + let loaddata = ({page, limit}) => {
  388 + search.value.page = page;
  389 + search.value.limit = limit;
  390 + }
  391 +
  392 +
  393 + let hideDialog = (flg) => {
  394 + dialog.value.show = flg;
  395 + if (!flg) {
  396 + getDataList(dialog.value.amStatus)
  397 + }
  398 + }
  399 +
  400 + // 处理弹框
  401 + let handle = (row, flag) => {
  402 + isView.value = flag;
  403 + hideDialog(true);
  404 + dialog.value.amId = row.id;
  405 + dialog.value.amStatus = row.status;
  406 + dialog.value.alarmId = row.alarmId;
  407 + }
  408 + //审核保存后关闭弹框
  409 + let saveback = (val) => {
  410 + hideDialog(val)
  411 + }
  412 + let loginName = Vue.ref(localStorage.getItem('lgn'));
  413 +
  414 + // 挂载完
  415 + Vue.onMounted(() => {
  416 + getDataList();
  417 + setSeries();
  418 + })
  419 +
  420 + return {
  421 + loginName,
  422 + height,
  423 + optionData,
  424 + optionDataInit,
  425 + series,
  426 + names,
  427 + rateData,
  428 + optionDataR,
  429 + seriesR,
  430 + namesR,
  431 + rateDataR,
  432 + setSeries,
  433 + dateFocus,
  434 + dateChange,
  435 + dialog,
  436 + hideDialog,
  437 + search,
  438 + tableData,
  439 + loaddata,
  440 + getDataList,
  441 + handle,
  442 + saveback,
  443 + statusVal,
  444 + isView
  445 + }
  446 + }
  447 +
  448 +}
@@ -279,6 +279,12 @@ const routes = [{ @@ -279,6 +279,12 @@ const routes = [{
279 name: 'thirdSet', 279 name: 'thirdSet',
280 component: () => myImport('views/thirdSet/index') 280 component: () => myImport('views/thirdSet/index')
281 }, 281 },
  282 + //操作日志
  283 + {
  284 + path: '/vue3/operationLog',
  285 + name: 'operationLog',
  286 + component: () => myImport('views/operationLog/index')
  287 + }
282 ]; 288 ];
283 289
284 // hash模式： createWebHashHistory 290 // hash模式： createWebHashHistory
@@ -2325,6 +2325,7 @@ blockquote:before { @@ -2325,6 +2325,7 @@ blockquote:before {
2325 font-size: 36px; 2325 font-size: 36px;
2326 color:#333333; 2326 color:#333333;
2327 line-height: normal; 2327 line-height: normal;
  2328 + font-family: 'MicrosoftYaHei-Bold';
2328 } 2329 }
2329 .title-intro{ 2330 .title-intro{
2330 font-size: 18px; 2331 font-size: 18px;
@@ -2880,3 +2881,13 @@ blockquote:before { @@ -2880,3 +2881,13 @@ blockquote:before {
2880 -webkit-animation-duration: 2.5s; 2881 -webkit-animation-duration: 2.5s;
2881 animation-duration: 2.5s; 2882 animation-duration: 2.5s;
2882 } 2883 }
  2884 +.info-system{
  2885 + text-align: center;
  2886 +}
  2887 +.alarm-info-container .info-intro{
  2888 + max-width: 1200px;
  2889 + margin:auto;
  2890 +}
  2891 +.compatible-item .title-style{
  2892 + font-size:28px;
  2893 +}
@@ -39,9 +39,27 @@ export function culturalDatas() { @@ -39,9 +39,27 @@ export function culturalDatas() {
39 ] 39 ]
40 return res; 40 return res;
41 } 41 }
42 -export function partnerDatas() {  
43 - let res = [  
44 - {img:'assets/img/about/partner/partner-1.png'}  
45 - ] 42 +export function imgsDatas() {
  43 + let res = [{
  44 + name:'质量管理体系认证证书',
  45 + path:'assets/img/about/certificate/1.png'
  46 + },{
  47 + name:'技术服务管理体系认证证书',
  48 + path:'assets/img/about/certificate/2.png'
  49 + },{
  50 + name:'连续性管理体系认证证书',
  51 + path:'assets/img/about/certificate/3.png'
  52 + },{
  53 + name:'信息安全管理体系认证证书',
  54 + path:'assets/img/about/certificate/4.png'
  55 + },{
  56 + path:'assets/img/about/certificate/5.png'
  57 + },{
  58 + path:'assets/img/about/certificate/6.png'
  59 + },{
  60 + path:'assets/img/about/certificate/7.png'
  61 + },{
  62 + path:'assets/img/about/certificate/8.png'
  63 + }]
46 return res; 64 return res;
47 } 65 }
@@ -29,6 +29,7 @@ export function compatibleDatas(){ @@ -29,6 +29,7 @@ export function compatibleDatas(){
29 logoUrl:'logo-dong-default', 29 logoUrl:'logo-dong-default',
30 logoUrlTip:'logo-dong', 30 logoUrlTip:'logo-dong',
31 urlName:'dong', 31 urlName:'dong',
  32 + title:'国产中间件兼容认证',
32 content:'东方通应用服务器软件TongWeb V7.0 产品，是由东方通推出的遵循JavaEE7规范的企业级应用服务器，不仅为企业应用提供了可靠、可伸缩、可管理和高安全的基础平台，同时具有功能完善、支持开放标准和基于组件开发、多层架构、轻量等特点。' 33 content:'东方通应用服务器软件TongWeb V7.0 产品，是由东方通推出的遵循JavaEE7规范的企业级应用服务器，不仅为企业应用提供了可靠、可伸缩、可管理和高安全的基础平台，同时具有功能完善、支持开放标准和基于组件开发、多层架构、轻量等特点。'
33 }, 34 },
34 { 35 {
@@ -36,6 +37,7 @@ export function compatibleDatas(){ @@ -36,6 +37,7 @@ export function compatibleDatas(){
36 logoUrl:'logo-da-default', 37 logoUrl:'logo-da-default',
37 logoUrlTip:'logo-da', 38 logoUrlTip:'logo-da',
38 urlName:'da', 39 urlName:'da',
  40 + title:'国产数据库兼容认证',
39 content:'达梦数据库管理系统V8（简称DM8）融合了分布式、弹性计算与云计算的优势，多样化架构充分满足不同场景需求，支持超大规模并发事务处理和事务-分析混合型业务处理，动态分配计算资源，实现更精细化的资源利用、更低成本的投入。' 41 content:'达梦数据库管理系统V8（简称DM8）融合了分布式、弹性计算与云计算的优势，多样化架构充分满足不同场景需求，支持超大规模并发事务处理和事务-分析混合型业务处理，动态分配计算资源，实现更精细化的资源利用、更低成本的投入。'
40 }, 42 },
41 { 43 {
@@ -43,6 +45,7 @@ export function compatibleDatas(){ @@ -43,6 +45,7 @@ export function compatibleDatas(){
43 logoUrl:'logo-nan-default', 45 logoUrl:'logo-nan-default',
44 logoUrlTip:'logo-nan', 46 logoUrlTip:'logo-nan',
45 urlName:'nan', 47 urlName:'nan',
  48 + title:'国产数据库兼容认证',
46 content:'南大通用大规模分布式并行数据库集群系统[简称：GBase 8a MPP Cluster] 是基于 GBase 8a 列存储数据库的一款 Shared Nothing 架构的分布式并行分析型数据库集群，具备高性能、高可用、高扩展特性，可以为超大规模数据管理提供高性价比的通用计算平台。' 49 content:'南大通用大规模分布式并行数据库集群系统[简称：GBase 8a MPP Cluster] 是基于 GBase 8a 列存储数据库的一款 Shared Nothing 架构的分布式并行分析型数据库集群，具备高性能、高可用、高扩展特性，可以为超大规模数据管理提供高性价比的通用计算平台。'
47 }, 50 },
48 { 51 {
@@ -50,6 +53,7 @@ export function compatibleDatas(){ @@ -50,6 +53,7 @@ export function compatibleDatas(){
50 logoUrl:'logo-ren-default', 53 logoUrl:'logo-ren-default',
51 logoUrlTip:'logo-ren', 54 logoUrlTip:'logo-ren',
52 urlName:'ren', 55 urlName:'ren',
  56 + title:'国产数据库兼容认证',
53 content:'金仓数据库管理系统KingbaseES是面向事务处理类、兼顾分析类应用领域的通用数据库产品，致力于解决高安全、高并发、高可靠数据存储计算问题，是一款为企事业单位等管理信息系统、业务系统量身打造，具有高成熟度的数据库产品。' 57 content:'金仓数据库管理系统KingbaseES是面向事务处理类、兼顾分析类应用领域的通用数据库产品，致力于解决高安全、高并发、高可靠数据存储计算问题，是一款为企事业单位等管理信息系统、业务系统量身打造，具有高成熟度的数据库产品。'
54 }, 58 },
55 { 59 {
@@ -57,6 +61,7 @@ export function compatibleDatas(){ @@ -57,6 +61,7 @@ export function compatibleDatas(){
57 logoUrl:'logo-tong-default', 61 logoUrl:'logo-tong-default',
58 logoUrlTip:'logo-tong', 62 logoUrlTip:'logo-tong',
59 urlName:'tong', 63 urlName:'tong',
  64 + title:'国产操作系统兼容认证',
60 content:'统信服务器操作系统V20是一款用于构建信息化基础设施环境的平台级软件，是款体现当今主流 Linux 服务器操作系统发展水平的商业化软件产品。着重解决客户在信息化基础建设过程中，服务端基础设施的安装部署、运行维护、应用支撑等需求，具有极高的可靠性、持久的可用性、优良的可维护性。' 65 content:'统信服务器操作系统V20是一款用于构建信息化基础设施环境的平台级软件，是款体现当今主流 Linux 服务器操作系统发展水平的商业化软件产品。着重解决客户在信息化基础建设过程中，服务端基础设施的安装部署、运行维护、应用支撑等需求，具有极高的可靠性、持久的可用性、优良的可维护性。'
61 } 66 }
62 ] 67 ]
@@ -3,49 +3,49 @@ export function productDatas(){ @@ -3,49 +3,49 @@ export function productDatas(){
3 { 3 {
4 title:'综合告警智能算法平台', 4 title:'综合告警智能算法平台',
5 // introduction:'能快速接入各类告警信息，通过告警算法自动去重、规则压缩、算法降噪，实现告警降噪，避免告警风暴，更快响应告警，提升告警管理能力', 5 // introduction:'能快速接入各类告警信息，通过告警算法自动去重、规则压缩、算法降噪，实现告警降噪，避免告警风暴，更快响应告警，提升告警管理能力',
6 - introData:['基于智能算法对告警消息压缩合并','支持固定阈值、同环比，预测性异常检测','自动化故障修复','自动化故障修复'], 6 + introData:['基于业务的告警统一管理','基于算法的智能合并降噪','支持固定阈值、同环比，预测性异常检测','兼容并包，开放告警'],
7 type:'alarm' 7 type:'alarm'
8 }, 8 },
9 { 9 {
10 title:'综合监控管理A-view', 10 title:'综合监控管理A-view',
11 // introduction:'全方位监控应用/平台资源/基础设施，基于IT资源图谱，洞察问题根因，随时掌握业务健康状况，快速定位故障，保持IT业务良性、稳定和长效发展', 11 // introduction:'全方位监控应用/平台资源/基础设施，基于IT资源图谱，洞察问题根因，随时掌握业务健康状况，快速定位故障，保持IT业务良性、稳定和长效发展',
12 - introData:['告警消息统一在平台管理','基于智能算法对告警消息压缩合并','支持阈值、同环比、预测异常检测','自动故障修复'], 12 + introData:['强化主动监控，实现集中管理','灵活定制的自动化巡检','快速定位故障，恢复系统运行','提高运行效率，合理利用IT资源','提供统计分析和决策支持'],
13 type:'Aview' 13 type:'Aview'
14 }, 14 },
15 { 15 {
16 title:'CMDB资产管理', 16 title:'CMDB资产管理',
17 introduction:'建立以应用为中心的资源 管理模型，促进资产到资源的转变', 17 introduction:'建立以应用为中心的资源 管理模型，促进资产到资源的转变',
18 - introData:['告警消息统一在平台管理','基于智能算法对告警消息压缩合并','支持阈值、同环比、预测异常检测','自动故障修复'], 18 + introData:['随需而动的资源管理模型','独有的双模自动发现能力','面向业务的关联分析','丰富多样的服务化API'],
19 type:'cmdb' 19 type:'cmdb'
20 }, 20 },
21 { 21 {
22 title:'业务及应用综合分析平台', 22 title:'业务及应用综合分析平台',
23 introduction:'全新的端到端，全链路的应用性能管理平台，对业务性能问题进行快速发现，帮助用户有效地降低 MTTR、 提升IT部门对业务和用户体验的把控', 23 introduction:'全新的端到端，全链路的应用性能管理平台，对业务性能问题进行快速发现，帮助用户有效地降低 MTTR、 提升IT部门对业务和用户体验的把控',
24 - // introData:['告警消息统一在平台管理','基于智能算法对告警消息压缩合并','支持阈值、同环比、预测异常检测','自动故障修复'], 24 + introData:['全量的性能追踪和业务数据采集 ','分层级展示调用关系拓扑','业务关联性能数据分析'],
25 type:'businessApp' 25 type:'businessApp'
26 }, 26 },
27 { 27 {
28 title:'日志综合智能分析平台', 28 title:'日志综合智能分析平台',
29 introduction:'通过对日志的采集、存储、备份、查询、告警分析和报表统计功能，实现海量日志管理。', 29 introduction:'通过对日志的采集、存储、备份、查询、告警分析和报表统计功能，实现海量日志管理。',
30 - introData:['告警消息统一在平台管理','基于智能算法对告警消息压缩合并','支持阈值、同环比、预测异常检测','自动故障修复'], 30 + introData:['高效数据处理能力','基于策略分析的安全事件响应','可视化日志展示','海量日志全生命周期管理'],
31 type:'securityLog' 31 type:'securityLog'
32 }, 32 },
33 { 33 {
34 title:'信息化协同管理支撑平台', 34 title:'信息化协同管理支撑平台',
35 introduction:'基于“人工智能+大数据”底座对全新业务、系统、流程、管理、虚拟团队“全新”模式下的信息化协同。', 35 introduction:'基于“人工智能+大数据”底座对全新业务、系统、流程、管理、虚拟团队“全新”模式下的信息化协同。',
36 - introData:['告警消息统一在平台管理','基于智能算法对告警消息压缩合并','支持阈值、同环比、预测异常检测','自动故障修复'], 36 + introData:['信息、流程、时间全面统一，高效协同','理清流程、制度落地，业务按标准执行','流程申请、流程进度、流程审批全程可观'],
37 type:'information' 37 type:'information'
38 }, 38 },
39 { 39 {
40 title:'魔镜智能运维管理一体机', 40 title:'魔镜智能运维管理一体机',
41 - introduction:'数据中心已有的各类运维数据，包括业务指标数据、机器指标数据、各类监控工具的告警数据，建立涵盖数据管理、 故障发现、故障定位和故障预警的综合运维体系。',  
42 - introData:['告警消息统一在平台管理','基于智能算法对告警消息压缩合并','支持阈值、同环比、预测异常检测','自动故障修复'], 41 + // introduction:'数据中心已有的各类运维数据，包括业务指标数据、机器指标数据、各类监控工具的告警数据，建立涵盖数据管理、 故障发现、故障定位和故障预警的综合运维体系。',
  42 + introData:['动态关联IT与业务','故障根因分析溯源','业务健康随时掌控','提供IT规划参考依据','智能告警运维服务'],
43 type:'maintenance' 43 type:'maintenance'
44 }, 44 },
45 { 45 {
46 title:'魔镜智能多云运维平台', 46 title:'魔镜智能多云运维平台',
47 introduction:'基于“人工智能+大数据”底座对全新业务、系统、流程、管理、虚拟团队“全新”模式下的信息化协同。', 47 introduction:'基于“人工智能+大数据”底座对全新业务、系统、流程、管理、虚拟团队“全新”模式下的信息化协同。',
48 - introData:['告警消息统一在平台管理','基于智能算法对告警消息压缩合并','支持阈值、同环比、预测异常检测','自动故障修复'], 48 + introData:['多云资源统一管理','多云环境自动化编排','多云资源统一运维和监控','多维数据可视化'],
49 type:'cloud' 49 type:'cloud'
50 } 50 }
51 ] 51 ]
@@ -443,9 +443,15 @@ export function alarm() { @@ -443,9 +443,15 @@ export function alarm() {
443 introduction:'在告警降噪过程中，通过配置适当的合并规则，将具有相似特征的告警合并到同一个分组中，实现批量的通知。例如可以设置将相同应用的告警进行合并，从而避免同一个应用的多个告警频繁触发通知。', 443 introduction:'在告警降噪过程中，通过配置适当的合并规则，将具有相似特征的告警合并到同一个分组中，实现批量的通知。例如可以设置将相同应用的告警进行合并，从而避免同一个应用的多个告警频繁触发通知。',
444 img:'assets/img/serviceSecond/alarm/noiseReduce.png', 444 img:'assets/img/serviceSecond/alarm/noiseReduce.png',
445 type:'noiseReduce', 445 type:'noiseReduce',
446 - subTitle:'兼容并包:开放告警',  
447 - subIntro:'对于已有的监控系统产生的告警，或者多云场景下的告警，也可以通过开放告警的方式统一接入到综合告警算法平台，进行统一的告警管理。目前开放告警累计支持了PROMETHEUS、ALERTMANAGERGRAFANA、ZABBIXDATADOGLOKIAWS CLOUDWATCH.NEW RELIC 华为云云监控等十多个监控源，对各个不同系统的告警进行管理。', 446 + // subTitle:'兼容并包:开放告警',
  447 + // subIntro:'对于已有的监控系统产生的告警，或者多云场景下的告警，也可以通过开放告警的方式统一接入到综合告警算法平台，进行统一的告警管理。目前开放告警累计支持了PROMETHEUS、ALERTMANAGERGRAFANA、ZABBIXDATADOGLOKIAWS CLOUDWATCH.NEW RELIC 华为云云监控等十多个监控源，对各个不同系统的告警进行管理。',
448 }, 448 },
  449 + {
  450 + title:'兼容并包:开放告警',
  451 + introduction:'对于已有的监控系统产生的告警，或者多云场景下的告警，也可以通过开放告警的方式统一接入到综合告警算法平台，进行统一的告警管理。目前开放告警累计支持了PROMETHEUS、ALERTMANAGER、GRAFANA、ZABBIX、DATADOG、LOKI、AWS CLOUDWATCH、NEW RELIC、华为云云监控等十多个监控源，对各个不同系统的告警进行管理。',
  452 + img:'assets/img/serviceSecond/alarm/inclusive.png',
  453 + type:'inclusive'
  454 + }
449 ] 455 ]
450 } 456 }
451 457
@@ -30,7 +30,7 @@ @@ -30,7 +30,7 @@
30 //lsq 设置置顶之后的logo图片 2022-09-20 30 //lsq 设置置顶之后的logo图片 2022-09-20
31 let path=window.location.hash; 31 let path=window.location.hash;
32 let pathArr=path.split('/'); 32 let pathArr=path.split('/');
33 - if(pathArr.length>2){ 33 + if(pathArr.length>2 && window.location.hash.indexOf('#/about')==-1){
34 $('.logo-outer .hg-logo').attr('src','assets/img/logo.png'); 34 $('.logo-outer .hg-logo').attr('src','assets/img/logo.png');
35 $('.navigation').removeClass('navigation-white'); 35 $('.navigation').removeClass('navigation-white');
36 }else{ 36 }else{
@@ -81,7 +81,7 @@ @@ -81,7 +81,7 @@
81 <router-link to="/services">产品及服务</router-link> 81 <router-link to="/services">产品及服务</router-link>
82 </li> 82 </li>
83 <li top-nav="about"> 83 <li top-nav="about">
84 - <router-link to="/about">了解鸿果</router-link> 84 + <router-link to="/about/0">了解鸿果</router-link>
85 </li> 85 </li>
86 <li top-nav="concat"> 86 <li top-nav="concat">
87 <router-link to="/concat">加入我们</router-link> 87 <router-link to="/concat">加入我们</router-link>
@@ -132,10 +132,10 @@ @@ -132,10 +132,10 @@
132 <h4 class="footer-title">产品内容</h4> 132 <h4 class="footer-title">产品内容</h4>
133 <div class="widget-content"> 133 <div class="widget-content">
134 <ul> 134 <ul>
135 - <li><a href="#">综合告警智能算法平台</a></li>  
136 - <li><a href="#">综合监控管理A-view</a></li>  
137 - <li><a href="#">CMDB资产管理</a></li>  
138 - <li><a href="#">业务及应用综合分析平台</a></li> 135 + <li><router-link to="/services/alarm">综合告警智能算法平台</router-link></li>
  136 + <li><router-link to="/services/Aview">综合监控管理A-view</router-link></li>
  137 + <li><router-link to="/services/cmdb">CMDB资产管理</router-link></li>
  138 + <li><router-link to="/services/businessApp">业务及应用综合分析平台</router-link></li>
139 </ul> 139 </ul>
140 </div> 140 </div>
141 </div> 141 </div>
@@ -146,10 +146,10 @@ @@ -146,10 +146,10 @@
146 <h4 style=" font-weight: 600;position: relative;margin-bottom: 40px;text-transform: capitalize;">&nbsp;</h4> 146 <h4 style=" font-weight: 600;position: relative;margin-bottom: 40px;text-transform: capitalize;">&nbsp;</h4>
147 <div class="widget-content"> 147 <div class="widget-content">
148 <ul> 148 <ul>
149 - <li><a href="#">日志综合智能分析平台</a></li>  
150 - <li><a href="#">信息化协同管理支撑平台</a></li>  
151 - <li><a href="#">魔镜智能运维管理一体机</a></li>  
152 - <li><a href="#">魔镜智能多云运维平台</a></li> 149 + <li><router-link to="/services/securityLog">日志综合智能分析平台</router-link></li>
  150 + <li><router-link to="/services/information">信息化协同管理支撑平台</router-link></li>
  151 + <li><router-link to="/services/maintenance">魔镜智能运维管理一体机</router-link></li>
  152 + <li><router-link to="/services/cloud">魔镜智能多云运维平台</router-link></li>
153 </ul> 153 </ul>
154 </div> 154 </div>
155 </div> 155 </div>
@@ -164,12 +164,12 @@ @@ -164,12 +164,12 @@
164 <div class="col-sm-5"> 164 <div class="col-sm-5">
165 <div class="footer-widget links-widget"> 165 <div class="footer-widget links-widget">
166 <h4 class="footer-title">关于我们</h4> 166 <h4 class="footer-title">关于我们</h4>
167 - <div class="widget-content"> 167 + <div class="widget-content about-widget-content">
168 <ul> 168 <ul>
169 <li> 169 <li>
170 - <router-link to="/about">公司简介</router-link> 170 + <router-link to="/about/1" data-id="1">公司简介</router-link>
171 </li> 171 </li>
172 - <li><a href="#">合作流程</a></li> 172 + <li><router-link to="/about/6" data-id="6">合作流程</router-link></li>
173 </ul> 173 </ul>
174 </div> 174 </div>
175 </div> 175 </div>
1 export default { 1 export default {
2 mounted() { 2 mounted() {
3 this.pageInit() 3 this.pageInit()
  4 + if(window.location.hash.indexOf('#/about')!=-1){
  5 + $('.footer-section').hide();
  6 + let html=`<section>
  7 + <footer class="footer-section pt-100 footer-section-about">`+$('.footer-section').html()+`</footer>
  8 + </section>`
  9 + $('.wrap-container').append(html)
  10 + }else{
  11 + $('.footer-section').show();
  12 + }
4 }, 13 },
5 create(){ 14 create(){
6 this.pageInit() 15 this.pageInit()
@@ -217,7 +226,7 @@ export default { @@ -217,7 +226,7 @@ export default {
217 var target = $(this).attr('data-target'); 226 var target = $(this).attr('data-target');
218 //lsq 产品二级页面的二级导航锚点 2022-09-19 227 //lsq 产品二级页面的二级导航锚点 2022-09-19
219 let top=$(target).offset().top 228 let top=$(target).offset().top
220 - if($(this).hasClass('tab-item')){ 229 + if($(this).hasClass('tab-item') || $(this).hasClass('scroll-item')){
221 top-=100; 230 top-=100;
222 } 231 }
223 // animate 232 // animate
@@ -10,7 +10,7 @@ const routes = [ @@ -10,7 +10,7 @@ const routes = [
10 component: () => myImport('views/services/index') 10 component: () => myImport('views/services/index')
11 }, 11 },
12 { 12 {
13 - path: '/about', 13 + path: '/about/:id',
14 name: 'about', 14 name: 'about',
15 component: () => myImport('views/about/index') 15 component: () => myImport('views/about/index')
16 }, 16 },
1 import pageInit from "../../minixs/pageInit.js"; 1 import pageInit from "../../minixs/pageInit.js";
2 -import {culturalValuesDatas,culturalDatas} from "../../../../assets/img/data/aboutData.js";  
3 - 2 +import {culturalValuesDatas,culturalDatas,imgsDatas} from "../../../../assets/img/data/aboutData.js";
4 export default { 3 export default {
5 name: 'home', 4 name: 'home',
6 template: '', 5 template: '',
@@ -8,30 +7,11 @@ export default { @@ -8,30 +7,11 @@ export default {
8 components: {}, 7 components: {},
9 props: [], 8 props: [],
10 setup(props, {attrs, slots, emit}) { 9 setup(props, {attrs, slots, emit}) {
  10 + const {proxy} = Vue.getCurrentInstance();
11 let culturalValuesData=Vue.ref(culturalValuesDatas()); 11 let culturalValuesData=Vue.ref(culturalValuesDatas());
12 let culturalData=Vue.ref(culturalDatas()); 12 let culturalData=Vue.ref(culturalDatas());
13 13
14 - var imgs = [{  
15 - name:'质量管理体系认证证书',  
16 - path:'assets/img/about/certificate/1.png'  
17 - },{  
18 - name:'技术服务管理体系认证证书',  
19 - path:'assets/img/about/certificate/2.png'  
20 - },{  
21 - name:'连续性管理体系认证证书',  
22 - path:'assets/img/about/certificate/3.png'  
23 - },{  
24 - name:'信息安全管理体系认证证书',  
25 - path:'assets/img/about/certificate/4.png'  
26 - },{  
27 - path:'assets/img/about/certificate/5.png'  
28 - },{  
29 - path:'assets/img/about/certificate/6.png'  
30 - },{  
31 - path:'assets/img/about/certificate/7.png'  
32 - },{  
33 - path:'assets/img/about/certificate/8.png'  
34 - }]; 14 + var imgs = Vue.ref(imgsDatas());
35 let flag =Vue.ref(true); 15 let flag =Vue.ref(true);
36 let i=Vue.ref(0); 16 let i=Vue.ref(0);
37 let MousewheelFun=(e)=>{ 17 let MousewheelFun=(e)=>{
@@ -43,7 +23,6 @@ export default { @@ -43,7 +23,6 @@ export default {
43 if(e.deltaY<0){ 23 if(e.deltaY<0){
44 // 不能上滑了 24 // 不能上滑了
45 if(i.value>0){ 25 if(i.value>0){
46 - console.log(i)  
47 i.value--; 26 i.value--;
48 flag.value = false; 27 flag.value = false;
49 $('.wrap-container').animate({top:-i.value*hei},1000,function(){ 28 $('.wrap-container').animate({top:-i.value*hei},1000,function(){
@@ -62,6 +41,11 @@ export default { @@ -62,6 +41,11 @@ export default {
62 } 41 }
63 } 42 }
64 } 43 }
  44 + setNavStyle();
  45 +
  46 + }
  47 + // 设置导航的样式
  48 + let setNavStyle=()=>{
65 if(i.value==2 || i.value==4 || i.value==6){ 49 if(i.value==2 || i.value==4 || i.value==6){
66 $('.navigation').removeClass('navigation-white'); 50 $('.navigation').removeClass('navigation-white');
67 $('.logo-outer .hg-logo').attr('src','assets/img/logo.png'); 51 $('.logo-outer .hg-logo').attr('src','assets/img/logo.png');
@@ -71,18 +55,35 @@ export default { @@ -71,18 +55,35 @@ export default {
71 $('.logo-outer .hg-logo').attr('src','assets/img/logo-footer.png'); 55 $('.logo-outer .hg-logo').attr('src','assets/img/logo-footer.png');
72 56
73 } 57 }
74 -  
75 } 58 }
76 //联系方式是否出现 59 //联系方式是否出现
77 let isConcat=Vue.ref(false); 60 let isConcat=Vue.ref(false);
78 - Vue.onMounted(() =>{  
79 - if(window.location.hash=='#/about'){  
80 - $('.footer-section').hide();  
81 - let html=`<section>  
82 - <footer class="footer-section pt-100 footer-section-about">`+$('.footer-section').html()+`</footer>  
83 - </section>`  
84 - $('.wrap-container').append(html) 61 + //设置从footer进入页面的显示位置
  62 + let setFormFooter=(item)=>{
  63 + let id=proxy.$route.params.id;
  64 + if(item){
  65 + id=item;
85 } 66 }
  67 + if(id){
  68 + i.value=id;
  69 + let hei=$('.wrap-container>section').first().outerHeight();
  70 + flag.value = false;
  71 + $('.wrap-container').animate({top:-i.value*hei},1000,function(){
  72 + flag.value=true;
  73 + })
  74 + setTimeout(function (){
  75 + $('.wrap-container section:nth-child('+(Number(i.value)+1)+') .wow').removeAttr('style');
  76 + $('.about-widget-content li a').unbind('click.about').on('click.about',function (){
  77 + setFormFooter($(this).data('id'));
  78 + })
  79 + setNavStyle()
  80 + },300)
  81 +
  82 + }
  83 + }
  84 + Vue.onMounted(() =>{
  85 + setFormFooter();
  86 +
86 }) 87 })
87 88
88 89
@@ -93,7 +94,9 @@ export default { @@ -93,7 +94,9 @@ export default {
93 MousewheelFun, 94 MousewheelFun,
94 flag, 95 flag,
95 i, 96 i,
96 - isConcat 97 + isConcat,
  98 + setNavStyle,
  99 + setFormFooter
97 } 100 }
98 101
99 } 102 }
@@ -14,7 +14,7 @@ @@ -14,7 +14,7 @@
14 <div class="owl-carousel owl-theme owl-loaded all-height"> 14 <div class="owl-carousel owl-theme owl-loaded all-height">
15 <div class="owl-stage-outer owl-height all-height"> 15 <div class="owl-stage-outer owl-height all-height">
16 <div class="owl-stage all-height"> 16 <div class="owl-stage all-height">
17 - <div class="owl-item all-height" v-for="(item,index) in homeData" :style="'background: url(assets/img/index/' + (index+1) + '.png);background-size:cover;'"> 17 + <div :class="['owl-item', 'all-height',{'scroll-to-target':index==0,'cursor-pointer':index==0,'scroll-item':index==0}] " data-target=".team-section" v-for="(item,index) in homeData" :style="'background: url(assets/img/index/' + (index+1) + '.png);background-size:cover;'">
18 <!-- <img :src="'assets/img/index/' + (index+1) + '.png'" class="d-block w-100 h-75">--> 18 <!-- <img :src="'assets/img/index/' + (index+1) + '.png'" class="d-block w-100 h-75">-->
19 <div :class="['owl-item-content']"> 19 <div :class="['owl-item-content']">
20 <div :class="['owl-item-title', 'font-size-42',{'text-align-center':index==2}]">{{item.title}}</div> 20 <div :class="['owl-item-title', 'font-size-42',{'text-align-center':index==2}]">{{item.title}}</div>
@@ -46,8 +46,9 @@ @@ -46,8 +46,9 @@
46 </div> 46 </div>
47 <div class="tech-title-num">{{item.id}}</div> 47 <div class="tech-title-num">{{item.id}}</div>
48 <div class="tech-title pt-30 pb-30">{{item.title}}</div> 48 <div class="tech-title pt-30 pb-30">{{item.title}}</div>
49 - <div :class="[ 'tooltip', 'tooltip-self',{'opacity1':item.isHover,'opacity0':!item.isHover}]">  
50 - {{item.tipIntro}} 49 + <div :class="[ 'tooltip', 'tooltip-self','flex-column-center',{'opacity1':item.isHover,'opacity0':!item.isHover}]">
  50 + <div>{{item.title}}</div>
  51 + <div>{{item.tipIntro}}</div>
51 </div> 52 </div>
52 </div> 53 </div>
53 </div> 54 </div>
@@ -133,7 +134,7 @@ @@ -133,7 +134,7 @@
133 134
134 <section class="team-section rel pt-80 pb-80"> 135 <section class="team-section rel pt-80 pb-80">
135 <div class="container"> 136 <div class="container">
136 - <div class="section-title mb-35 pr-65 align-items-center flex-column-center"> 137 + <div class="mb-35 pr-65 align-items-center flex-column-center">
137 <div class="title-style">"魔镜智能"全面完成国产化兼容适配认证</div> 138 <div class="title-style">"魔镜智能"全面完成国产化兼容适配认证</div>
138 <div class="title-intro pt-20">完成对主流国产服务器、数据库、操作系统、中间件、等兼容适配，并取得一系列兼容性认证</div> 139 <div class="title-intro pt-20">完成对主流国产服务器、数据库、操作系统、中间件、等兼容适配，并取得一系列兼容性认证</div>
139 </div> 140 </div>
@@ -152,7 +153,7 @@ @@ -152,7 +153,7 @@
152 <img :src="'assets/img/index/'+item.logoUrlTip+'.png'" alt=""> 153 <img :src="'assets/img/index/'+item.logoUrlTip+'.png'" alt="">
153 </div> 154 </div>
154 <div class="item-content flex-column-start flex-text-left"> 155 <div class="item-content flex-column-start flex-text-left">
155 - <div class="title-style pt-30">国产中间件兼容认证</div> 156 + <div class="title-style pt-30">{{item.title}}</div>
156 <div class="item-text title-intro pt-30"> 157 <div class="item-text title-intro pt-30">
157 {{item.content}} 158 {{item.content}}
158 </div> 159 </div>
@@ -27,7 +27,7 @@ @@ -27,7 +27,7 @@
27 </section> 27 </section>
28 28
29 29
30 -<section :class="['info-container', 'rel', {'mb-70':item.type=='noiseReduce' || item.type=='lifeCycle'}, 'pt-55',{'info-container-bg':item.type=='advantage'}]" v-for="(item,index) in alarmData.data" :key="item"> 30 +<section :class="['info-container','alarm-info-container', 'rel', {'mb-70': item.type=='lifeCycle' || item.type=='inclusive'}, 'pt-55',{'info-container-bg':item.type=='advantage'}]" v-for="(item,index) in alarmData.data" :key="item">
31 <div class="div-type" :data-type="item.type" ></div> 31 <div class="div-type" :data-type="item.type" ></div>
32 <div class="container"> 32 <div class="container">
33 <h3 class="info-title">{{item.title}}</h3> 33 <h3 class="info-title">{{item.title}}</h3>