Skip to content

M
memberTag-web
Commit 3c1b657c by liuchenxi
Options

update: 会员标签ui

parent 0609623f
Showing with 58 additions and 25 deletions
index.html
......@@ -5,7 +5,7 @@
<link rel="shortcut icon" href="./static/img/favicon.ico"/>
<title>GIC-会员标签</title>
<link rel="stylesheet" href="//at.alicdn.com/t/font_688955_99jmfacmlpp.css">
<link rel="stylesheet" href="//at.alicdn.com/t/font_3276801_w3vkjjmzzz.css">
<link rel="stylesheet" href="//at.alicdn.com/t/font_3276801_mkhlaisq2aq.css">
<script src="//at.alicdn.com/t/font_3276801_w3vkjjmzzz.js"></script>
</head>
<body style="background-color: #f0f2f5;min-width: 1400px;">
......
src/utils/clipboard.js
import Vue from 'vue'
import Clipboard from 'clipboard'
function clipboardSuccess() {
Vue.prototype.$message({
message: 'Copy successfully',
type: 'success',
duration: 1500
})
}
// function clipboardSuccess() {
// Vue.prototype.$message({
// message: 'Copy successfully',
// type: 'success',
// duration: 1500
// })
// }
function clipboardError() {
Vue.prototype.$message({
......@@ -21,7 +21,7 @@ export default function handleClipboard(text, event) {
text: () => text
})
clipboard.on('success', () => {
clipboardSuccess()
// clipboardSuccess()
clipboard.off('error')
clipboard.off('success')
clipboard.destroy()
......
src/view/layout/layout.vue
<template>
<dm-layout project-name="report">
<keep-alive>
<router-view :key="$route.fullPath"></router-view>
</keep-alive>
</dm-layout>
</template>
......
src/view/manualTag/manual-tag-value-edit.vue
......@@ -22,12 +22,19 @@
<el-table :data="tagValTableData" ref="sortTable" row-class-name="table-row" row-key="tagItemId">
<el-table-column width="40" class-name="tag-cell sort-cell" label-class-name="tag-head">
<template>
<el-popover placement="top" content="拖动排序" trigger="hover">
<i slot="reference" class="iconfont icon-tuozhuaipaixu deactive" />
</el-popover>
<el-tooltip placement="top" content="拖动排序" trigger="hover" effect="dark" popper-class="drag-tooltip">
<i class="iconfont icon-tuozhuaipaixu deactive" />
</el-tooltip>
</template>
</el-table-column>
<el-table-column label="标签值" prop="tagItemName" min-width="100" class-name="tag-cell" label-class-name="tag-head">
<template slot-scope="{ row }">
<span>{{ row.tagItemName }}</span>
<el-tooltip content="复制标签值" trigger="hover" placement="top">
<i class="iconfont copy-icon icon-fuzhi" @click="copy(row.tagItemName, $event)" />
</el-tooltip>
</template>
</el-table-column>
<el-table-column label="标签值" prop="tagItemName" min-width="100" class-name="tag-cell" label-class-name="tag-head"></el-table-column>
<el-table-column label="覆盖人数" prop="memberCount" min-width="200" class-name="tag-cell" label-class-name="tag-head"></el-table-column>
<el-table-column label="操作" min-width="220" class-name="tag-cell" label-class-name="tag-head">
<template slot-scope="scope">
......@@ -75,6 +82,7 @@
</template>
<script>
import './manualTagEdit.css';
import copy from '@/utils/clipboard';
import navCrumb from '@/components/nav/nav.vue';
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
......@@ -530,6 +538,10 @@ export default {
},
remoteDragData(params) {
getRequest('/member-tag-value/tag-item-sort', params);
},
// 复制文字
copy(text, e) {
copy(text, e);
}
},
mounted() {
......@@ -600,6 +612,7 @@ export default {
}
.table-row:hover {
.deactive {
color: #606266;
display: block;
cursor: grabbing;
}
......@@ -607,4 +620,18 @@ export default {
.deactive {
display: none;
}
.copy-icon {
display: inline-block;
margin-left: 3px;
width: 24px;
height: 24px;
font-size: 14px;
text-align: center;
color: #606266;
border-radius: 2px;
cursor: pointer;
&:hover {
background-color: #E5E6EB;
}
}
</style>
src/view/manualTag/manualTagEdit.vue
......@@ -316,6 +316,9 @@ export default {
};
</script>
<style lang="scss" scoped>
/deep/ .el-dialog {
margin-top: 10vh !important;
}
/deep/ .el-dialog-title {
font-size: 16px;
font-weight: bold;
......@@ -368,7 +371,7 @@ footer {
margin-bottom: 4px;
}
.tag-list {
max-height: 100px;
max-height: 200px;
overflow-y: auto;
}
</style>
src/view/platformTag/member-tag.vue
......@@ -954,7 +954,6 @@ export default {
.member-box {
overflow: hidden;
margin: 4px 0 20px;
min-width: 1400px;
height: 100%;
background-color: #fff;
}
......
src/view/platformTag/second-tag.vue
......@@ -322,7 +322,7 @@ export default {
overflow: hidden;
.name {
position: relative;
top: 1px;
top: 0;
float: left;
.second-title {
font-weight: bold;
......@@ -346,10 +346,11 @@ export default {
.tag-item {
display: inline-block;
line-height: 22px;
height: 22px;
margin-right: 8px;
margin-bottom: 12px;
font-size: 12px;
padding: 3px 8px;
padding: 0 8px;
background: #F2F3F5;
border-radius: 2px;
color: #303133;
......@@ -374,7 +375,7 @@ export default {
.arrow-line {
float: left;
position: relative;
top: 2px;
top: 1px;
font-size: 30px;
}
.icon-tag {
......@@ -388,6 +389,7 @@ export default {
padding: 5px 11px;
box-sizing: border-box;
display: flex;
border-radius: 2px;
align-items: center;
justify-content: center;
&:hover {
......
src/view/platformTag/tag-container-active.vue
......@@ -2,7 +2,7 @@
<!-- 具体标签 -->
<div class="tag-some-list">
<el-table :data="tableData" style="width: 100%">
<el-table-column label="标签名称" prop="tagName" min-width="100">
<el-table-column label="标签名称" prop="tagName" min-width="100" fixed="left">
<template slot-scope="scope">
<span class="tag-name">{{ scope.row.tagName }}</span>
<el-tooltip class="item" effect="dark" content="添加标签" placement="bottom">
......@@ -44,7 +44,7 @@
<span v-else>--</span>
</template>
</el-table-column>
<el-table-column label="操作">
<el-table-column label="操作" fixed="right">
<template slot-scope="{ row }">
<el-button type="text" @click="editActiveTag(row)">编辑</el-button>
<el-button type="text" @click="editActiveTagValue(row)">详情</el-button>
......
static/css/index.less
......@@ -115,13 +115,13 @@
// 幽灵按钮放在全局方便全局改样式
.ghost-btn {
background: #fff !important;
color: #1890ff !important;
color: #2f54eb !important;
&:hover {
border-color: #40a9ff;
color: #40a9ff !important;
border-color: #597EF7;
color: #597EF7 !important;
}
&:active {
border-color: #096dd9;
color: #096dd9 !important;
border-color: #1D39C4;
color: #1D39C4 !important;
}
}
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