Skip to content

N
nse-ui
Commit f45302ab by wanglizhen
Options

License管理

parent 43ad4e84
正在显示 包含 128 行增加 和 83 行删除
src/views/systemConfig/License/index.vue
......@@ -50,48 +50,56 @@ onMounted(() => {
<template>
<div class="app-container scroller">
<PageTitle>
<template #title>License管理</template>
</PageTitle>
<div class="app-container__body">
<div class="pageTitle">
<img class="icon" src="@/assets/images/systemConfig/systemParamPage.png" alt="">
<span>License管理</span>
</div>
<div class="box">
<div class="line"></div>
<div class="content">
<DividerTitle :title-name="getHeaderName()" />
<div class="infoContainer">
<div class="document">
<div class="document-left">
<img class="licenseBg" src="@/assets/images/systemConfig/Lisencebg.png" alt="license" />
<img class="mask" v-if="infoData.status === '3'" src="@/assets/images/systemConfig/rightMask.png" alt="mask" />
<div class="itemLi">
<div class="name">有效期：</div>
<div class="value">
{{ (infoData.startDatelicensekey && infoData.endDatelicensekey) ? `${infoData.startDatelicensekey}
至 ${infoData.endDatelicensekey}` : '--' }}
</div>
</div>
<div class="itemLi">
<div class="name">名称：</div>
<div class="value">{{ infoData.licname ? infoData.licname : '--' }}</div>
</div>
<div class="itemLi">
<div class="name">硬盘号：</div>
<div class="value">{{ infoData.licInfoIp ? infoData.licInfoIp : '--' }}</div>
</div>
<div class="itemLi">
<div class="name">MAC地址：</div>
<div class="value">{{ infoData.licInfoMac ? infoData.licInfoMac : '--' }}</div>
</div>
<div class="document-right">
<div class="title-header">{{ getHeaderName() }}</div>
<div class="title-item">有效期：
{{ ( infoData.startDatelicensekey && infoData.endDatelicensekey ) ? `${ infoData.startDatelicensekey } 至 ${ infoData.endDatelicensekey }` : '--' }}
</div>
<div class="title-item">名称：{{ infoData.licname ? infoData.licname : '--' }}</div>
<div class="title-item">硬盘号：{{ infoData.licInfoIp ? infoData.licInfoIp : '--' }}</div>
<div class="title-item">MAC地址：{{ infoData.licInfoMac ? infoData.licInfoMac : '--' }}</div>
<div class="but">
<el-button :icon="(infoData.status === '2' || infoData.status === '3') ? 'Refresh' : 'Upload'"
:loading="uploadLoading"
type="primary">{{ (infoData.status === '2' || infoData.status === '3') ? '更新授权文件' : '上传授权文件' }}</el-button>
:loading="uploadLoading" type="primary" style="height: 40px;">{{ (infoData.status === '2' ||
infoData.status === '3') ? '更新授权文件'
: '上传授权文件' }}</el-button>
<div class="upload">
<CustomUpload v-if="!uploadLoading" @file-change="handleFileChange" />
</div>
</div>
</div>
</div>
<div class="ipMacContent" v-if="infoData && infoData.ipMacList && infoData.ipMacList.length > 0">
<div class="title">申请License所需信息</div>
<DividerTitle title-name="申请License所需信息" :leftBox="true">
<template v-slot:leftBox>
<div class="tips">您需要提供应用所在服务器的硬盘号和MAC地址，我们再向您提供License</div>
<div class="point_content">
<el-row class="title_row">
<el-col :span="6">序号</el-col>
<el-col :span="10">当前服务器IP地址</el-col>
<el-col :span="8">当前服务器MAC地址</el-col>
</el-row>
<el-row class="content_row" v-for="(item,index) in infoData.ipMacList" :key="index">
<el-col :span="6">{{ index + 1 }}</el-col>
<el-col :span="10">{{ item.ip }}</el-col>
<el-col :span="8">{{ item.mac }}</el-col>
</el-row>
</template>
</DividerTitle>
<el-table ref="table" class="table" :data="infoData.ipMacList" stripe>
<el-table-column type="index" label="序号" width="100" align="center"></el-table-column>
<el-table-column property="ip" label="当前服务器IP地址" align="center"></el-table-column>
<el-table-column property="mac" label="当前服务器MAC地址" align="center"></el-table-column>
</el-table>
</div>
</div>
</div>
......@@ -101,47 +109,95 @@ onMounted(() => {
<style lang="scss" scoped>
.app-container__body {
// align-items: center;
// justify-content: center;
.pageTitle {
margin-bottom: 20px;
display: flex;
align-items: center;
justify-content: center;
font-size: 16px;
font-weight: 500;
letter-spacing: 0px;
line-height: 22px;
color: rgba(53, 64, 79, 1);
.icon {
margin-right: 6px;
width: 16px;
height: 16px;
}
}
.box {
display: flex;
flex-direction: column;
flex: 1;
overflow: hidden;
background: #fff;
.line {
width: 100%;
height: 2px;
border-radius: 5px 5px 0px 0px;
background: linear-gradient(90deg,
rgba(33, 103, 217, 1) 0%,
rgba(17, 200, 250, 1) 34.03%,
rgba(33, 103, 217, 1) 64.58%,
rgba(48, 128, 255, 1) 100%);
}
.content {
padding: 28px 30px;
flex: 1;
overflow: hidden;
display: flex;
flex-direction: column;
.infoContainer {
margin-top: -8%;
min-width: 668px;
.document {
width: 100%;
border-radius: 5px;
background: rgba(245, 252, 255, 1);
border: 1px solid rgba(29, 178, 245, 1);
overflow: hidden;
background: rgba(235, 235, 235, 1);
.itemLi {
margin-bottom: 1px;
display: flex;
&-left {
margin-right: 84px;
position: relative;
height: 310px;
.licenseBg {
height: 100%;
height: 40px;
.name {
margin-right: 1px;
width: 111px;
background: rgba(245, 252, 255, 1);
font-size: 12px;
line-height: 40px;
color: rgba(148, 148, 148, 1);
text-align: right;
}
.value {
flex: 1;
padding-left: 20px;
background: rgba(245, 252, 255, 1);
font-size: 12px;
line-height: 40px;
color: rgba(53, 64, 79, 1);
}
.mask {
position: absolute;
bottom: 6px;
right: 6px;
width: 70px;
height: 70px;
}
}
&-right {
padding-top: 50px;
.title-header {
font-weight: 700;
font-size: 18px;
color: #333;
position: relative;
margin-bottom: 20px;
}
.title-item {
color: #333;
margin-bottom: 10px;
}
.but {
position: relative;
margin-top: 20px;
margin-top: 40px;
margin-bottom: 100px;
position: relative;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
.upload {
position: absolute;
top: 0;
......@@ -155,31 +211,20 @@ onMounted(() => {
opacity: 0;
}
}
}
}
.ipMacContent {
margin-top: 100px;
.title {
font-size: 16px;
color: #333;
margin-bottom: 4px;
}
flex: 1;
overflow: hidden;
display: flex;
flex-direction: column;
.tips {
color: #858f9e;
margin-bottom: 11px;
}
.point_content {
border: 1px solid #d8d8d8;
border-radius: 4px;
background: hsla(0, 0%, 100%, 0.6);
padding: 10px 30px 2px;
.title_row {
color: #333;
margin-bottom: 10px;
}
.content_row {
color: #858f9e;
margin-bottom: 8px;
font-size: 14px;
color: rgba(253, 84, 81, 1);
}
.table {
flex: 1;
}
}
}
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论