feat: clientarea 布局重构 — 顶栏全宽独占一行
All checks were successful
continuous-integration/drone/push Build is passing
All checks were successful
continuous-integration/drone/push Build is passing
HTML 结构变更 (20个PHP文件): - 旧: el-container > [aside-menu, el-container > [top-menu, el-main]] - 新: el-container[direction=vertical] > [top-menu, el-container > [aside-menu, el-main]] CSS 适配: - el-header: sticky top:0, z-index:100, width:100% - el-aside: height calc(100vh-60px), sticky top:60px
This commit is contained in:
@@ -5,10 +5,10 @@
|
||||
|
||||
<body>
|
||||
<div class="template">
|
||||
<el-container>
|
||||
<aside-menu></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<div class="main-card">
|
||||
|
||||
@@ -28,10 +28,10 @@
|
||||
|
||||
<body>
|
||||
<div class="template">
|
||||
<el-container>
|
||||
<aside-menu></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<div class="main-card">
|
||||
|
||||
@@ -14,10 +14,10 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div id="account" class="template">
|
||||
<el-container>
|
||||
<aside-menu :menu-active-id="2" @getruleslist="getRule"></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu ref="topMenuRef"></top-menu>
|
||||
<el-container>
|
||||
<top-menu ref="topMenuRef"></top-menu>
|
||||
<aside-menu :menu-active-id="2" @getruleslist="getRule"></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<div class="main-card">
|
||||
|
||||
@@ -13,10 +13,10 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="product">
|
||||
<el-container>
|
||||
<aside-menu></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu></aside-menu>
|
||||
<el-main>
|
||||
<div class="main-card">
|
||||
<!-- 表格 -->
|
||||
|
||||
@@ -29,6 +29,9 @@ html, body {
|
||||
.el-aside {
|
||||
background: #FFFFFF !important;
|
||||
border-right: 1px solid rgba(0,0,0,0.06);
|
||||
height: calc(100vh - 60px) !important;
|
||||
position: sticky !important;
|
||||
top: 60px !important;
|
||||
}
|
||||
|
||||
.ali-logo {
|
||||
@@ -111,6 +114,10 @@ html, body {
|
||||
backdrop-filter: none !important;
|
||||
box-shadow: 0 1px 0 rgba(0,0,0,0.06) !important;
|
||||
border-bottom: 1px solid rgba(0,0,0,0.06);
|
||||
position: sticky !important;
|
||||
top: 0 !important;
|
||||
z-index: 100 !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.el-header .search-value,
|
||||
|
||||
0
clientarea/hgcloud/css/light
Normal file
0
clientarea/hgcloud/css/light
Normal file
0
clientarea/hgcloud/css/lighter
Normal file
0
clientarea/hgcloud/css/lighter
Normal file
@@ -14,10 +14,10 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="template" id="finance">
|
||||
<el-container>
|
||||
<aside-menu @getruleslist="getRule"></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu @getruleslist="getRule"></aside-menu>
|
||||
<el-main>
|
||||
<!-- 订单列表 -->
|
||||
<div class="finance main-card">
|
||||
|
||||
@@ -14,10 +14,10 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="template">
|
||||
<el-container>
|
||||
<aside-menu @getruleslist="getRule"></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu @getruleslist="getRule"></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<div class="main-card security-group">
|
||||
|
||||
@@ -12,10 +12,10 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="template">
|
||||
<el-container>
|
||||
<aside-menu></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<div class="main-card">
|
||||
|
||||
@@ -5,10 +5,10 @@
|
||||
|
||||
<body>
|
||||
<div class="template">
|
||||
<el-container>
|
||||
<aside-menu></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<div class="main-card">
|
||||
|
||||
@@ -13,10 +13,10 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="template">
|
||||
<el-container>
|
||||
<aside-menu></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu></aside-menu>
|
||||
<el-main>
|
||||
<div class="box">
|
||||
<!-- 自己的东西 -->
|
||||
|
||||
@@ -13,10 +13,10 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="template">
|
||||
<el-container>
|
||||
<aside-menu></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<div class="order-detail">
|
||||
|
||||
@@ -11,10 +11,10 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="product">
|
||||
<el-container>
|
||||
<aside-menu></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<!-- 后端渲染出来的配置页面 -->
|
||||
|
||||
@@ -13,10 +13,10 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="product">
|
||||
<el-container>
|
||||
<aside-menu></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu></aside-menu>
|
||||
<el-main>
|
||||
<div class="main-card">
|
||||
<div class="main-card-title">
|
||||
|
||||
@@ -13,10 +13,10 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="template">
|
||||
<el-container>
|
||||
<aside-menu></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<div class="main-card">
|
||||
|
||||
@@ -1,58 +1,58 @@
|
||||
{include file="header"}
|
||||
<link rel="stylesheet" href="/{$template_catalog}/template/{$themes}/css/productdetail.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- mounted之前显示 -->
|
||||
<div class="product_detail template">
|
||||
<el-container>
|
||||
<aside-menu></aside-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<!-- 后端渲染出来的配置页面 -->
|
||||
<div class="config-box" v-if="timeouted">
|
||||
<!-- 电子合同判断 -->
|
||||
<div class="contract-box" v-if="actStatus.includes('unable_access')">
|
||||
<div class="contract-top">
|
||||
<svg t="1749023272025" class="back-img" viewBox="0 0 1024 1024" version="1.1" @click="goBack"
|
||||
style="cursor: pointer;" xmlns="http://www.w3.org/2000/svg" p-id="20485" width="0.26rem"
|
||||
height="0.26rem">
|
||||
<path
|
||||
d="M672.426667 209.92H455.68v-136.533333l-295.253333 170.666666 295.253333 170.666667v-136.533333h215.04C819.2 278.186667 938.666667 397.653333 938.666667 546.133333s-119.466667 267.946667-267.946667 267.946667H52.906667c-18.773333 0-34.133333 15.36-34.133334 34.133333s15.36 34.133333 34.133334 34.133334h619.52c186.026667 0 336.213333-150.186667 336.213333-336.213334s-151.893333-336.213333-336.213333-336.213333z"
|
||||
p-id="20486" fill="var(--color-primary)"></path>
|
||||
</svg>
|
||||
<span class="top-product-name">{{hostData.product_name}}</span>
|
||||
</div>
|
||||
<div class="go-contract">
|
||||
<img class="contract-img" src="/{$template_catalog}/template/{$themes}/img/common/contract_img.png" />
|
||||
<div class="contract-text">{{lang.product_text1}}</div>
|
||||
<el-button class="contract-btn" @click="goContractDetail">{{lang.product_text2}}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content" v-else></div>
|
||||
</div>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-container>
|
||||
</div>
|
||||
<!-- =======页面独有======= -->
|
||||
<script src="/{$template_catalog}/template/{$themes}/js/common/jquery.mini.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/safeConfirm/safeConfirm.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/captchaDialog/captchaDialog.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/countDownButton/countDownButton.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/payDialog/payDialog.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/hostStatus/hostStatus.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/pagination/pagination.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/discountCode/discountCode.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/cashBack/cashBack.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/flowPacket/flowPacket.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/batchRenewpage/batchRenewpage.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/autoRenew/autoRenew.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/ipDefase/ipDefase.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/resetAuth/resetAuth.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/api/product.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/js/productdetail.js"></script>
|
||||
|
||||
{include file="footer"}
|
||||
{include file="header"}
|
||||
<link rel="stylesheet" href="/{$template_catalog}/template/{$themes}/css/productdetail.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- mounted之前显示 -->
|
||||
<div class="product_detail template">
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<aside-menu></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<!-- 后端渲染出来的配置页面 -->
|
||||
<div class="config-box" v-if="timeouted">
|
||||
<!-- 电子合同判断 -->
|
||||
<div class="contract-box" v-if="actStatus.includes('unable_access')">
|
||||
<div class="contract-top">
|
||||
<svg t="1749023272025" class="back-img" viewBox="0 0 1024 1024" version="1.1" @click="goBack"
|
||||
style="cursor: pointer;" xmlns="http://www.w3.org/2000/svg" p-id="20485" width="0.26rem"
|
||||
height="0.26rem">
|
||||
<path
|
||||
d="M672.426667 209.92H455.68v-136.533333l-295.253333 170.666666 295.253333 170.666667v-136.533333h215.04C819.2 278.186667 938.666667 397.653333 938.666667 546.133333s-119.466667 267.946667-267.946667 267.946667H52.906667c-18.773333 0-34.133333 15.36-34.133334 34.133333s15.36 34.133333 34.133334 34.133334h619.52c186.026667 0 336.213333-150.186667 336.213333-336.213334s-151.893333-336.213333-336.213333-336.213333z"
|
||||
p-id="20486" fill="var(--color-primary)"></path>
|
||||
</svg>
|
||||
<span class="top-product-name">{{hostData.product_name}}</span>
|
||||
</div>
|
||||
<div class="go-contract">
|
||||
<img class="contract-img" src="/{$template_catalog}/template/{$themes}/img/common/contract_img.png" />
|
||||
<div class="contract-text">{{lang.product_text1}}</div>
|
||||
<el-button class="contract-btn" @click="goContractDetail">{{lang.product_text2}}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="content" v-else></div>
|
||||
</div>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-container>
|
||||
</div>
|
||||
<!-- =======页面独有======= -->
|
||||
<script src="/{$template_catalog}/template/{$themes}/js/common/jquery.mini.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/safeConfirm/safeConfirm.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/captchaDialog/captchaDialog.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/countDownButton/countDownButton.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/payDialog/payDialog.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/hostStatus/hostStatus.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/pagination/pagination.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/discountCode/discountCode.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/cashBack/cashBack.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/flowPacket/flowPacket.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/batchRenewpage/batchRenewpage.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/autoRenew/autoRenew.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/ipDefase/ipDefase.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/resetAuth/resetAuth.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/api/product.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/js/productdetail.js"></script>
|
||||
|
||||
{include file="footer"}
|
||||
|
||||
@@ -13,10 +13,10 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="template">
|
||||
<el-container>
|
||||
<aside-menu @getruleslist="getRule"></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu @getruleslist="getRule"></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<div class="main-card">
|
||||
|
||||
@@ -1,138 +1,138 @@
|
||||
{include file="header"}
|
||||
<!-- 页面独有样式 -->
|
||||
<link rel="stylesheet" href="/{$template_catalog}/template/{$themes}/css/security_group.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- mounted之前显示 -->
|
||||
<div id="mainLoading">
|
||||
<div class="ddr ddr1"></div>
|
||||
<div class="ddr ddr2"></div>
|
||||
<div class="ddr ddr3"></div>
|
||||
<div class="ddr ddr4"></div>
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="template">
|
||||
<el-container>
|
||||
<aside-menu @getruleslist="getRule"></aside-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<div class="main-card security-group">
|
||||
<div class="main-card-title">{{lang.security_title}}</div>
|
||||
<el-tabs v-model="activeName" @tab-click="handleClick">
|
||||
<el-tab-pane label="API" name="1" v-if="isShowAPI"></el-tab-pane>
|
||||
{foreach $addons as $addon}
|
||||
{if ($addon.name=='IdcsmartSshKey')}
|
||||
<el-tab-pane :label="lang.security_tab1" name="2"></el-tab-pane>
|
||||
{/if}
|
||||
{/foreach}
|
||||
<el-tab-pane :label="lang.security_tab2" name="3" v-if="isShowAPILog"></el-tab-pane>
|
||||
{foreach $addons as $addon}
|
||||
{if ($addon.name=='IdcsmartCloud')}
|
||||
<el-tab-pane :label="lang.security_group" name="4">
|
||||
<div class="content-table">
|
||||
<div class="content_searchbar">
|
||||
<div class="left-btn" @click="createSecurity">
|
||||
{{lang.create_security_group}}
|
||||
</div>
|
||||
<div class="searchbar com-search">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="tabledata">
|
||||
<el-table v-loading="loading" :data="dataList" style="width: 100%;margin-bottom: .2rem;">
|
||||
<el-table-column prop="name" :label="lang.security_label1" width="200" align="left">
|
||||
<template slot-scope="{row}">
|
||||
<a :href="`group_rules.htm?id=${row.id}`" class="link">{{row.name}}</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="host_num" :label="lang.cloud_menu_1" align="left" width="150">
|
||||
</el-table-column>
|
||||
<el-table-column prop="rule_num" :label="lang.rules" align="left">
|
||||
</el-table-column>
|
||||
<el-table-column prop="description" :label="lang.security_label8" align="left">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.description || '--'}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="create_time" :label="lang.account_label10" align="left" width="200">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.create_time | formateTime}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="type" :label="lang.security_label3" width="100" fixed="right" align="left">
|
||||
<template slot-scope="scope">
|
||||
<el-popover placement="top-start" trigger="hover">
|
||||
<div class="operation">
|
||||
<div class="operation-item">
|
||||
<a :href="`group_rules.htm?id=${scope.row.id}`" class="link">{{lang.coin_text78}}</a>
|
||||
</div>
|
||||
<div class="operation-item" @click="editItem(scope.row)">{{lang.edit}}</div>
|
||||
<div class="operation-item" @click="deleteItem(scope.row)">{{lang.security_btn4}}</div>
|
||||
</div>
|
||||
<span class="more-operation" slot="reference">
|
||||
<div class="dot"></div>
|
||||
<div class="dot"></div>
|
||||
<div class="dot"></div>
|
||||
</span>
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination :page-data="params" @sizechange="sizeChange" @currentchange="currentChange">
|
||||
</pagination>
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
{/if}
|
||||
{/foreach}
|
||||
</el-tabs>
|
||||
<!-- 创建/编辑安全组弹窗 -->
|
||||
<div class="create-api-dialog">
|
||||
<el-dialog width="6.8rem" :visible.sync="isShowCj" :show-close=false @close="cjClose">
|
||||
<div class="dialog-title">
|
||||
{{optType === 'add' ? lang.create_security_group : lang.edit_security_group}}
|
||||
</div>
|
||||
<div class="dialog-main">
|
||||
<div class="label">{{lang.security_label1}}</div>
|
||||
<el-input v-model="createForm.name"></el-input>
|
||||
<div class="label">{{lang.account_label9}}</div>
|
||||
<el-input type="textarea" rows="5" v-model="createForm.description"></el-input>
|
||||
<el-alert class="alert-text" :title="errText" v-show="errText" type="error" show-icon
|
||||
:closable="false">
|
||||
</el-alert>
|
||||
</div>
|
||||
<div class="dialog-footer">
|
||||
<div class="btn-ok" @click="cjSub" v-loading="submitLoading">{{lang.security_btn5}}</div>
|
||||
<div class="btn-no" @click="cjClose">{{lang.security_btn6}}</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
<!-- 删除安全组弹窗 -->
|
||||
<div class="delete-dialog">
|
||||
<el-dialog width="6.8rem" :visible.sync="isShowDel" :show-close=false @close="delClose">
|
||||
<div class="del-dialog-title">
|
||||
<i class="el-icon-warning-outline del-icon"></i>{{lang.del_group}}?
|
||||
</div>
|
||||
<div class="del-dialog-main">
|
||||
{{lang.del_group}}:{{delName}}
|
||||
</div>
|
||||
<div class="del-dialog-footer">
|
||||
<div class="btn-ok" @click="delSub" v-loading="submitLoading">{{lang.security_btn9}}</div>
|
||||
<div class="btn-no" @click="delClose">{{lang.security_btn6}}</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-container>
|
||||
</div>
|
||||
<!-- =======页面独有======= -->
|
||||
<script src="/{$template_catalog}/template/{$themes}/api/security_group.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/pagination/pagination.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/js/security_group.js"></script>
|
||||
{include file="footer"}
|
||||
{include file="header"}
|
||||
<!-- 页面独有样式 -->
|
||||
<link rel="stylesheet" href="/{$template_catalog}/template/{$themes}/css/security_group.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!-- mounted之前显示 -->
|
||||
<div id="mainLoading">
|
||||
<div class="ddr ddr1"></div>
|
||||
<div class="ddr ddr2"></div>
|
||||
<div class="ddr ddr3"></div>
|
||||
<div class="ddr ddr4"></div>
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="template">
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<aside-menu @getruleslist="getRule"></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<div class="main-card security-group">
|
||||
<div class="main-card-title">{{lang.security_title}}</div>
|
||||
<el-tabs v-model="activeName" @tab-click="handleClick">
|
||||
<el-tab-pane label="API" name="1" v-if="isShowAPI"></el-tab-pane>
|
||||
{foreach $addons as $addon}
|
||||
{if ($addon.name=='IdcsmartSshKey')}
|
||||
<el-tab-pane :label="lang.security_tab1" name="2"></el-tab-pane>
|
||||
{/if}
|
||||
{/foreach}
|
||||
<el-tab-pane :label="lang.security_tab2" name="3" v-if="isShowAPILog"></el-tab-pane>
|
||||
{foreach $addons as $addon}
|
||||
{if ($addon.name=='IdcsmartCloud')}
|
||||
<el-tab-pane :label="lang.security_group" name="4">
|
||||
<div class="content-table">
|
||||
<div class="content_searchbar">
|
||||
<div class="left-btn" @click="createSecurity">
|
||||
{{lang.create_security_group}}
|
||||
</div>
|
||||
<div class="searchbar com-search">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="tabledata">
|
||||
<el-table v-loading="loading" :data="dataList" style="width: 100%;margin-bottom: .2rem;">
|
||||
<el-table-column prop="name" :label="lang.security_label1" width="200" align="left">
|
||||
<template slot-scope="{row}">
|
||||
<a :href="`group_rules.htm?id=${row.id}`" class="link">{{row.name}}</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="host_num" :label="lang.cloud_menu_1" align="left" width="150">
|
||||
</el-table-column>
|
||||
<el-table-column prop="rule_num" :label="lang.rules" align="left">
|
||||
</el-table-column>
|
||||
<el-table-column prop="description" :label="lang.security_label8" align="left">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.description || '--'}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="create_time" :label="lang.account_label10" align="left" width="200">
|
||||
<template slot-scope="scope">
|
||||
<span>{{scope.row.create_time | formateTime}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="type" :label="lang.security_label3" width="100" fixed="right" align="left">
|
||||
<template slot-scope="scope">
|
||||
<el-popover placement="top-start" trigger="hover">
|
||||
<div class="operation">
|
||||
<div class="operation-item">
|
||||
<a :href="`group_rules.htm?id=${scope.row.id}`" class="link">{{lang.coin_text78}}</a>
|
||||
</div>
|
||||
<div class="operation-item" @click="editItem(scope.row)">{{lang.edit}}</div>
|
||||
<div class="operation-item" @click="deleteItem(scope.row)">{{lang.security_btn4}}</div>
|
||||
</div>
|
||||
<span class="more-operation" slot="reference">
|
||||
<div class="dot"></div>
|
||||
<div class="dot"></div>
|
||||
<div class="dot"></div>
|
||||
</span>
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination :page-data="params" @sizechange="sizeChange" @currentchange="currentChange">
|
||||
</pagination>
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
{/if}
|
||||
{/foreach}
|
||||
</el-tabs>
|
||||
<!-- 创建/编辑安全组弹窗 -->
|
||||
<div class="create-api-dialog">
|
||||
<el-dialog width="6.8rem" :visible.sync="isShowCj" :show-close=false @close="cjClose">
|
||||
<div class="dialog-title">
|
||||
{{optType === 'add' ? lang.create_security_group : lang.edit_security_group}}
|
||||
</div>
|
||||
<div class="dialog-main">
|
||||
<div class="label">{{lang.security_label1}}</div>
|
||||
<el-input v-model="createForm.name"></el-input>
|
||||
<div class="label">{{lang.account_label9}}</div>
|
||||
<el-input type="textarea" rows="5" v-model="createForm.description"></el-input>
|
||||
<el-alert class="alert-text" :title="errText" v-show="errText" type="error" show-icon
|
||||
:closable="false">
|
||||
</el-alert>
|
||||
</div>
|
||||
<div class="dialog-footer">
|
||||
<div class="btn-ok" @click="cjSub" v-loading="submitLoading">{{lang.security_btn5}}</div>
|
||||
<div class="btn-no" @click="cjClose">{{lang.security_btn6}}</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
<!-- 删除安全组弹窗 -->
|
||||
<div class="delete-dialog">
|
||||
<el-dialog width="6.8rem" :visible.sync="isShowDel" :show-close=false @close="delClose">
|
||||
<div class="del-dialog-title">
|
||||
<i class="el-icon-warning-outline del-icon"></i>{{lang.del_group}}?
|
||||
</div>
|
||||
<div class="del-dialog-main">
|
||||
{{lang.del_group}}:{{delName}}
|
||||
</div>
|
||||
<div class="del-dialog-footer">
|
||||
<div class="btn-ok" @click="delSub" v-loading="submitLoading">{{lang.security_btn9}}</div>
|
||||
<div class="btn-no" @click="delClose">{{lang.security_btn6}}</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-container>
|
||||
</div>
|
||||
<!-- =======页面独有======= -->
|
||||
<script src="/{$template_catalog}/template/{$themes}/api/security_group.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/components/pagination/pagination.js"></script>
|
||||
<script src="/{$template_catalog}/template/{$themes}/js/security_group.js"></script>
|
||||
{include file="footer"}
|
||||
|
||||
@@ -13,10 +13,10 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="template">
|
||||
<el-container>
|
||||
<aside-menu @getruleslist="getRule"></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu @getruleslist="getRule"></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<div class="main-card">
|
||||
|
||||
@@ -13,10 +13,10 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="template">
|
||||
<el-container>
|
||||
<aside-menu @getruleslist="getRule"></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu @getruleslist="getRule"></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<div class="main-card">
|
||||
|
||||
@@ -13,10 +13,10 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="template">
|
||||
<el-container>
|
||||
<aside-menu></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
</el-main>
|
||||
|
||||
@@ -13,10 +13,10 @@
|
||||
<div class="ddr ddr5"></div>
|
||||
</div>
|
||||
<div class="template">
|
||||
<el-container>
|
||||
<aside-menu></aside-menu>
|
||||
<el-container direction="vertical">
|
||||
<top-menu></top-menu>
|
||||
<el-container>
|
||||
<top-menu></top-menu>
|
||||
<aside-menu></aside-menu>
|
||||
<el-main>
|
||||
<!-- 自己的东西 -->
|
||||
<div class="main-card">
|
||||
|
||||
Binary file not shown.
Reference in New Issue
Block a user