feat(property-marketing): 新增月数据复制功能,优化组件样式布局
This commit is contained in:
@ -8,6 +8,10 @@
|
|||||||
<p style="margin: 0">基于筛选出来的投流账户/计划的情况生成的总体描述。</p>
|
<p style="margin: 0">基于筛选出来的投流账户/计划的情况生成的总体描述。</p>
|
||||||
</template>
|
</template>
|
||||||
</a-popover>
|
</a-popover>
|
||||||
|
<span @click="copyData" class="copybtn">
|
||||||
|
<icon-copy :style="{ fontSize: '14px' }" />
|
||||||
|
复制
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="month-data-div">
|
<div class="month-data-div">
|
||||||
<div style="align-self: stretch">
|
<div style="align-self: stretch">
|
||||||
@ -24,6 +28,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { IconQuestionCircle } from '@arco-design/web-vue/es/icon';
|
import { IconQuestionCircle } from '@arco-design/web-vue/es/icon';
|
||||||
import { defineProps } from 'vue';
|
import { defineProps } from 'vue';
|
||||||
|
import { Message } from '@arco-design/web-vue';
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
overview: {
|
overview: {
|
||||||
@ -63,6 +68,19 @@ const formattedText = computed(() => {
|
|||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const copyData = () => {
|
||||||
|
const contentDiv = document.querySelector('.month-data-div');
|
||||||
|
const textToCopy = contentDiv.innerText || contentDiv.textContent;
|
||||||
|
navigator.clipboard
|
||||||
|
.writeText(textToCopy)
|
||||||
|
.then(() => {
|
||||||
|
Message.success('已复制');
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
console.error('复制失败:', err);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
const getCss = (highlight?: string) => {
|
const getCss = (highlight?: string) => {
|
||||||
return highlight ? classMap[highlight] : undefined;
|
return highlight ? classMap[highlight] : undefined;
|
||||||
};
|
};
|
||||||
|
|||||||
@ -38,3 +38,14 @@
|
|||||||
.month-text-black {
|
.month-text-black {
|
||||||
color: var(--Text-1, #211F24);
|
color: var(--Text-1, #211F24);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.copybtn {
|
||||||
|
position: absolute;
|
||||||
|
right: 20px;
|
||||||
|
color: var(--Brand-6, #6D4CFE);
|
||||||
|
font-size: 14px;
|
||||||
|
font-family: Alibaba PuHuiTi;
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: 22px;
|
||||||
|
word-wrap: break-word
|
||||||
|
}
|
||||||
|
|||||||
@ -155,7 +155,8 @@
|
|||||||
padding: 10px 24px 10px 24px;
|
padding: 10px 24px 10px 24px;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
display: inline-flex
|
display: inline-flex;
|
||||||
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.a-tab-class {
|
.a-tab-class {
|
||||||
|
|||||||
Reference in New Issue
Block a user