Skip to content

M
member
Commit 55443f0a by 曾经
Options

UI优化

parent 6789272f
Showing with 171 additions and 137 deletions
src/components/allCustomers/components/importDialog.vue
<template>
<!-- 新建导入 -->
<el-dialog
title="新建导入"
title="批量导入"
custom-class="customer-dialog"
:visible.sync="dialogImport"
width="600px"
......@@ -13,7 +13,7 @@
:model="formByImport"
label-width="95px"
label-suffix="："
style="margin-bottom: 36px"
style="margin-bottom: 20px"
label-position="left"
>
<el-form-item label="导入类型" prop="importValue">
......@@ -37,7 +37,7 @@
</el-form-item>
</el-form>
<div class="dialogTips">
<h3>导入规则</h3>
<h3><i class="el-icon-info"></i><span>导入规则</span></h3>
<p>
1. 通过导入Excel表格的形式变更GIC已存在的会员信息；不支持导入新会员数据
</p>
......@@ -208,12 +208,20 @@ export default {
.dialogTips {
padding-bottom: 8px;
padding-top: 22px;
border-top: 1px solid #e4e7ed;
border-top: 1px dashed #DCDFE6;
color: #909399;
h3 {
font-weight: normal;
font-size: 14px;
margin-bottom: 10px;
font-size: 12px;
margin-bottom: 6px;
display: inline;
color: #606266;
line-height: 17px;
.el-icon-info{
color: #2F54EB;
font-size: 14px;
margin-right: 8px;
}
}
p {
font-size: 12px;
......
src/components/wechatmembers/abnormal-member/abnormal-member-list/abnormal-member.less
.forzen-container {
padding: 20px;
background-color: #fff;
height: 100%;
box-sizing: border-box;
.search {
margin-bottom: 24px;
.top-header {
......@@ -54,23 +56,65 @@
text-align: right;
padding: 20px 0 0;
}
/deep/.el-table-column--selection {
.cell {
padding-left: 16px;
padding-right: 0px;
/deep/.el-table {
.setting-cell.el-table__cell {
display: flex;
align-items: center;
height: 50px;
padding: 0;
.cell.setting-cell {
display: flex;
justify-content: space-between;
align-items: center;
height: 50px;
padding-right: 0;
.el-icon-setting {
display: flex;
justify-content: center;
align-items: center;
width: 50px;
height: 100%;
font-size: 20px;
color: #303133;
cursor: pointer;
background: #e5e6eb;
&:hover {
color: #000;
}
}
}
}
}
/deep/.cell {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/deep/.table-select-page .cell {
padding-left: 10px;
padding-right: 0;
display: flex;
align-items: center;
.el-dropdown {
/deep/.el-table__empty-block {
z-index: 1;
position: relative;
background: white;
}
/deep/.cell {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding-left: 10px;
}
/deep/.el-table-column--selection {
.cell {
padding-left: 16px;
padding-right: 0px;
}
}
/deep/.table-select-page .cell {
padding-left: 0px;
padding-right: 0;
display: flex;
align-items: center;
.el-dropdown {
padding: 0;
}
}
/deep/.el-table__header /deep/.el-table__cell{
padding: 0;
}
}
......@@ -78,45 +122,48 @@
.frozen-list {
height: 100%;
position: relative;
}
.no-setting-page {
height: 100%;
position: relative;
display: flex;
align-items: center;
justify-content: center;
.tips-box {
height: auto;
margin-right: 150px;
.label {
color: #0a1c2b;
font-size: 20px;
font-weight: 500;
}
.el-button--primary {
margin-top: 40px;
border-radius: 2px;
.no-setting-box{
position: absolute;
left: 50%;
top: 45%;
transform: translate(-50%,-50%);
.tips-box {
height: auto;
margin-right: 150px;
.label {
color: #0a1c2b;
font-size: 20px;
font-weight: 500;
margin-bottom: 40px;
min-width: 200px;
}
}
}
}
.no-update-page {
position: relative;
text-align: center;
height: calc(100% - 100px);
padding: 0 30px;
box-sizing: border-box;
.icon {
width: 120px;
height: 120px;
margin: 216px auto 16px;
width: 96px;
height: 96px;
margin: 216px auto 12px;
}
.label {
color: #606266;
font-size: 14px;
margin-bottom: 15px;
}
.no-update-alert{
width: auto;
margin-top: 15px;
/deep/.el-icon-info{
color: #2F54EB;
}
......@@ -124,10 +171,13 @@
}
.data-abnormal-page{
position: relative;
position: absolute;
left: 0;
top: 0;
width: 100%;
text-align: center;
height: 100%;
padding: 0 30px;
box-sizing: border-box;
.icon{
margin: 116px auto 30px;
color: #FA8C16;
......@@ -162,39 +212,3 @@
}
}
.frozen-table /deep/.el-table {
.setting-cell.el-table__cell {
display: flex;
align-items: center;
height: 65px;
padding: 0;
.cell.setting-cell {
display: flex;
justify-content: space-between;
align-items: center;
height: 65px;
padding-right: 0;
.el-icon-setting {
display: flex;
justify-content: center;
align-items: center;
width: 60px;
height: 100%;
font-size: 20px;
color: #666;
cursor: pointer;
background: #eaeaea;
&:hover {
color: #000;
}
}
}
}
/deep/.el-table__empty-block {
z-index: 1;
position: relative;
background: white;
}
}
src/components/wechatmembers/abnormal-member/abnormal-member-list/abnormal-member.vue
......@@ -74,7 +74,7 @@
<el-table-column type="selection" min-width="30" fixed="left">
</el-table-column>
<el-table-column
min-width="60"
width="50"
fixed="left"
header-align="center"
class-name="table-select-page"
......@@ -361,7 +361,7 @@
</div>
<!-- 未配置 -->
<div class="no-setting-page" v-else-if="settingType == 2">
<el-row type="flex" align="middle">
<el-row type="flex" align="middle" class="no-setting-box">
<div class="tips-box">
<div class="label">还未完善异常规则配置</div>
<el-button
......
src/components/wechatmembers/frozen-member/frozen-list/frozen-list.less
......@@ -68,23 +68,65 @@
text-align: right;
padding: 20px 0 0;
}
/deep/.el-table-column--selection {
.cell {
padding-left: 16px;
padding-right: 0px;
/deep/.el-table {
.setting-cell.el-table__cell {
display: flex;
align-items: center;
height: 50px;
padding: 0;
.cell.setting-cell {
display: flex;
justify-content: space-between;
align-items: center;
height: 50px;
padding-right: 0;
.el-icon-setting {
display: flex;
justify-content: center;
align-items: center;
width: 50px;
height: 100%;
font-size: 20px;
color: #303133;
cursor: pointer;
background: #e5e6eb;
&:hover {
color: #000;
}
}
}
}
}
/deep/.cell {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
/deep/.table-select-page .cell {
padding-left: 10px;
padding-right: 0;
display: flex;
align-items: center;
.el-dropdown {
/deep/.el-table__empty-block {
z-index: 1;
position: relative;
background: white;
}
/deep/.cell {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
padding-left: 10px;
}
/deep/.el-table-column--selection {
.cell {
padding-left: 16px;
padding-right: 0px;
}
}
/deep/.table-select-page .cell {
padding-left: 0px;
padding-right: 0;
display: flex;
align-items: center;
.el-dropdown {
padding: 0;
}
}
/deep/.el-table__header /deep/.el-table__cell{
padding: 0;
}
}
......@@ -176,40 +218,3 @@
vertical-align: middle;
}
}
.frozen-table /deep/.el-table {
.setting-cell.el-table__cell {
display: flex;
align-items: center;
height: 65px;
padding: 0;
.cell.setting-cell {
display: flex;
justify-content: space-between;
align-items: center;
height: 65px;
padding-right: 0;
.el-icon-setting {
display: flex;
justify-content: center;
align-items: center;
width: 60px;
height: 100%;
font-size: 20px;
color: #666;
cursor: pointer;
background: #eaeaea;
&:hover {
color: #000;
}
}
}
}
/deep/.el-table__empty-block {
z-index: 1;
position: relative;
background: white;
}
}
src/components/wechatmembers/frozen-member/frozen-list/frozen-list.vue
......@@ -67,7 +67,7 @@
<el-table-column type="selection" min-width="30" fixed="left">
</el-table-column>
<el-table-column
min-width="60"
width="50"
fixed="left"
header-align="center"
class-name="table-select-page"
......@@ -263,7 +263,8 @@
<template slot-scope="{ row }">
<el-row type="flex" align="middle">
<span style="margin-right: 3px;">{{ row.forzenType || '--' }}</span>
<el-popover placement="top" trigger="hover" :disabled="!row.frozenRemark">
<el-popover placement="top" trigger="hover"
:disabled="!row.frozenRemark" popper-class="custom-popper">
<span>{{ row.frozenRemark }}</span>
<div slot="reference" class="reason-icon-box" v-if="row.frozenRemark">
<i class="iconfont icon-yuanyin" hover-class=""></i>
......@@ -371,6 +372,9 @@ export default { ...action };
margin-block-start: 1em;
margin-block-end: 1em;
}
.custom-popper{
min-width: auto;
}
</style>
<style lang="less" scoped src="./frozen-list.less"></style>
src/components/wechatmembers/frozen-member/frozen-member/frozen-member.less
......@@ -50,7 +50,8 @@
position: relative;
height: calc(100% - 56px);
.selected-result-box{
height: 522px;
min-height: 322px;
height: calc(100% - 220px);
width: 380px;
overflow-y: scroll;
position: relative;
......
src/components/wechatmembers/frozen-member/frozen-member/frozen-member.vue
......@@ -63,6 +63,7 @@
</el-table>
<div class="pager" v-if="total > 0">
<dm-pagination
background
:page-size="searchData.pageSize"
:currentPage="searchData.currentPage"
:page-sizes="[20, 50, 75, 100]"
......
src/components/wechatmembers/frozen-member/white-list/white-list.vue
......@@ -123,6 +123,7 @@
<div class="pager" v-if="total > 0">
<dm-pagination
background
:page-size="searchData.pageSize"
:currentPage="searchData.currentPage"
:page-sizes="[20, 50, 75, 100]"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment