|
@@ -13,7 +13,7 @@ |
|
|
<div class="ui sixteen wide column"> |
|
|
<div class="ui sixteen wide column"> |
|
|
<div class="ui two column stackable grid"> |
|
|
<div class="ui two column stackable grid"> |
|
|
<div class="column"> |
|
|
<div class="column"> |
|
|
<el-input placeholder="请输入内容" v-model="search" class="input-with-select"> |
|
|
|
|
|
|
|
|
<el-input placeholder="请输入镜像名称关健词" v-model="search" class="input-with-select" @keyup.enter.native="searchName()"> |
|
|
<el-button id="success" slot="append" icon="el-icon-search" @click="searchName()">搜索</el-button> |
|
|
<el-button id="success" slot="append" icon="el-icon-search" @click="searchName()">搜索</el-button> |
|
|
</el-input> |
|
|
</el-input> |
|
|
</div> |
|
|
</div> |
|
@@ -44,7 +44,7 @@ |
|
|
<el-table-column |
|
|
<el-table-column |
|
|
label="镜像名称" |
|
|
label="镜像名称" |
|
|
width="350" |
|
|
width="350" |
|
|
align="center" |
|
|
|
|
|
|
|
|
align="left" |
|
|
prop="name" |
|
|
prop="name" |
|
|
sortable |
|
|
sortable |
|
|
> |
|
|
> |
|
@@ -55,14 +55,14 @@ |
|
|
<el-table-column |
|
|
<el-table-column |
|
|
label="文件路径/镜像描述" |
|
|
label="文件路径/镜像描述" |
|
|
width="450" |
|
|
width="450" |
|
|
align="center" |
|
|
|
|
|
|
|
|
align="left" |
|
|
> |
|
|
> |
|
|
<template slot-scope="scope"> |
|
|
<template slot-scope="scope"> |
|
|
<el-tooltip class="item" effect="dark" content="点击复制文件路径" placement="top"> |
|
|
<el-tooltip class="item" effect="dark" content="点击复制文件路径" placement="top"> |
|
|
<a class="text-over" style="display:block;" @click="copyUrl(scope.row.place)">{{ scope.row.place }}</a> |
|
|
<a class="text-over" style="display:block;" @click="copyUrl(scope.row.place)">{{ scope.row.place }}</a> |
|
|
</el-tooltip> |
|
|
</el-tooltip> |
|
|
|
|
|
|
|
|
<span class="text-over" :title="scope.row.description">{{ scope.row.description }}</span> |
|
|
|
|
|
|
|
|
<span class="text-over" :title="scope.row.description">{{ scope.row.description | clearP}}</span> |
|
|
</template> |
|
|
</template> |
|
|
</el-table-column> |
|
|
</el-table-column> |
|
|
<el-table-column |
|
|
<el-table-column |
|
@@ -77,6 +77,9 @@ |
|
|
label="创建时间" |
|
|
label="创建时间" |
|
|
align="center" |
|
|
align="center" |
|
|
sortable> |
|
|
sortable> |
|
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
|
{{scope.row.createtime | transformTimestamp}} |
|
|
|
|
|
</template> |
|
|
</el-table-column> |
|
|
</el-table-column> |
|
|
</el-table> |
|
|
</el-table> |
|
|
</el-row> |
|
|
</el-row> |
|
@@ -99,7 +102,7 @@ |
|
|
<div class="ui sixteen wide column"> |
|
|
<div class="ui sixteen wide column"> |
|
|
<div class="ui two column stackable grid"> |
|
|
<div class="ui two column stackable grid"> |
|
|
<div class="column"> |
|
|
<div class="column"> |
|
|
<el-input placeholder="请输入内容" v-model="search" class="input-with-select"> |
|
|
|
|
|
|
|
|
<el-input placeholder="请输入内容" v-model="search" class="input-with-select" @keyup.enter.native="searchName()"> |
|
|
<el-button slot="append" id="success" icon="el-icon-search" @click="searchName()">搜索</el-button> |
|
|
<el-button slot="append" id="success" icon="el-icon-search" @click="searchName()">搜索</el-button> |
|
|
</el-input> |
|
|
</el-input> |
|
|
</div> |
|
|
</div> |
|
@@ -132,7 +135,7 @@ |
|
|
<el-table-column |
|
|
<el-table-column |
|
|
label="镜像名称" |
|
|
label="镜像名称" |
|
|
width="350" |
|
|
width="350" |
|
|
align="center" |
|
|
|
|
|
|
|
|
align="left" |
|
|
prop="name" |
|
|
prop="name" |
|
|
sortable |
|
|
sortable |
|
|
> |
|
|
> |
|
@@ -143,7 +146,7 @@ |
|
|
<el-table-column |
|
|
<el-table-column |
|
|
label="文件路径/镜像描述" |
|
|
label="文件路径/镜像描述" |
|
|
width="450" |
|
|
width="450" |
|
|
align="center" |
|
|
|
|
|
|
|
|
align="left" |
|
|
|
|
|
|
|
|
> |
|
|
> |
|
|
<template slot-scope="scope"> |
|
|
<template slot-scope="scope"> |
|
@@ -151,7 +154,7 @@ |
|
|
<a class="text-over" style="display:block;" @click="copyUrl(scope.row.place)">{{ scope.row.place }}</a> |
|
|
<a class="text-over" style="display:block;" @click="copyUrl(scope.row.place)">{{ scope.row.place }}</a> |
|
|
</el-tooltip> |
|
|
</el-tooltip> |
|
|
|
|
|
|
|
|
<span class="text-over" :title="scope.row.description">{{ scope.row.description }}</span> |
|
|
|
|
|
|
|
|
<span class="text-over" :title="scope.row.description">{{ scope.row.description | clearP }}</span> |
|
|
</template> |
|
|
</template> |
|
|
</el-table-column> |
|
|
</el-table-column> |
|
|
<el-table-column |
|
|
<el-table-column |
|
@@ -166,6 +169,9 @@ |
|
|
label="创建时间" |
|
|
label="创建时间" |
|
|
align="center" |
|
|
align="center" |
|
|
sortable> |
|
|
sortable> |
|
|
|
|
|
<template slot-scope="scope"> |
|
|
|
|
|
{{scope.row.createtime | transformTimestamp}} |
|
|
|
|
|
</template> |
|
|
</el-table-column> |
|
|
</el-table-column> |
|
|
</el-table> |
|
|
</el-table> |
|
|
</el-row> |
|
|
</el-row> |
|
@@ -315,7 +321,7 @@ export default { |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
handleCurrentChange1(){ |
|
|
|
|
|
|
|
|
handleCurrentChange1(val){ |
|
|
this.params1.page = val |
|
|
this.params1.page = val |
|
|
this.getImageList1() |
|
|
this.getImageList1() |
|
|
|
|
|
|
|
@@ -366,6 +372,37 @@ export default { |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
|
|
|
filters:{ |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
clearP(value){ |
|
|
|
|
|
console.log("sorce value",value) |
|
|
|
|
|
if(!value) return '' |
|
|
|
|
|
const reg = /\<\/?p\>/g; |
|
|
|
|
|
value = value.replace(reg,'') |
|
|
|
|
|
console.log("repalace:",value) |
|
|
|
|
|
return value |
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
|
transformTimestamp(timestamp){ |
|
|
|
|
|
console.log("timestamp",timestamp) |
|
|
|
|
|
let a = new Date(timestamp).getTime(); |
|
|
|
|
|
const date = new Date(a); |
|
|
|
|
|
const Y = date.getFullYear() + '-'; |
|
|
|
|
|
const M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'; |
|
|
|
|
|
const D = (date.getDate() < 10 ? '0'+date.getDate() : date.getDate()) + ' '; |
|
|
|
|
|
const h = (date.getHours() < 10 ? '0'+date.getHours() : date.getHours()) + ':'; |
|
|
|
|
|
const m = (date.getMinutes() <10 ? '0'+date.getMinutes() : date.getMinutes()) + ':' ; |
|
|
|
|
|
const s = (date.getSeconds() <10 ? '0'+date.getSeconds() : date.getSeconds()) ; // 秒 |
|
|
|
|
|
const dateString = Y + M + D + h + m + s; |
|
|
|
|
|
// console.log('dateString', dateString); // > dateString 2021-07-06 14:23 |
|
|
|
|
|
return dateString; |
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
watch:{ |
|
|
watch:{ |
|
|
search(val){ |
|
|
search(val){ |
|
|
if(!val && this.activeName=='first'){ |
|
|
if(!val && this.activeName=='first'){ |
|
@@ -407,8 +444,57 @@ export default { |
|
|
.el-table thead{ |
|
|
.el-table thead{ |
|
|
background-color: #f5f5f6; |
|
|
background-color: #f5f5f6; |
|
|
} |
|
|
} |
|
|
|
|
|
/deep/ .el-tabs__item:hover{ |
|
|
|
|
|
color: #000; |
|
|
|
|
|
font-weight: 500; |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
/deep/ .el-tabs__item.is-active { |
|
|
|
|
|
color: #000; |
|
|
|
|
|
font-weight: 500; |
|
|
|
|
|
} |
|
|
|
|
|
/deep/ .el-tabs__active-bar{ |
|
|
|
|
|
background-color:#000 |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active { |
|
|
|
|
|
background-color: #5bb973; |
|
|
|
|
|
color: #FFF; |
|
|
|
|
|
} |
|
|
|
|
|
/deep/ .el-pagination.is-background .el-pager li.active { |
|
|
|
|
|
color: #fff; |
|
|
|
|
|
cursor: default; |
|
|
|
|
|
} |
|
|
|
|
|
/deep/ .el-pagination.is-background .el-pager li:hover { |
|
|
|
|
|
color: #5bb973; |
|
|
|
|
|
} |
|
|
|
|
|
/deep/ .el-pagination.is-background .el-pager li:not(.disabled):hover { |
|
|
|
|
|
color: #5bb973; |
|
|
|
|
|
} |
|
|
|
|
|
/deep/ .el-pagination.is-background .el-pager li:not(.disabled).active:hover { |
|
|
|
|
|
background-color: #5bb973; |
|
|
|
|
|
color: #FFF; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/deep/ .el-pager li.active { |
|
|
|
|
|
color: #08C0B9; |
|
|
|
|
|
cursor: default; |
|
|
|
|
|
} |
|
|
|
|
|
/deep/ .el-pagination .el-pager li:hover { |
|
|
|
|
|
color: #08C0B9; |
|
|
|
|
|
} |
|
|
|
|
|
/deep/ .el-pagination .el-pager li:not(.disabled):hover { |
|
|
|
|
|
color: #08C0B9; |
|
|
|
|
|
} |
|
|
|
|
|
/* /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active{ |
|
|
|
|
|
background-color: #5bb973; |
|
|
|
|
|
color: #000; |
|
|
|
|
|
} */ |
|
|
|
|
|
/* /deep/ .el-pager li:hover{ |
|
|
|
|
|
color: #000; |
|
|
|
|
|
} */ |
|
|
#success{ |
|
|
#success{ |
|
|
background-color: #4093ff; |
|
|
|
|
|
|
|
|
background-color: #5bb973; |
|
|
color: white; |
|
|
color: white; |
|
|
} |
|
|
} |
|
|
.text-over{ |
|
|
.text-over{ |
|
|