63 lines
2.2 KiB
Vue
63 lines
2.2 KiB
Vue
<template>
|
|
<view class="container">
|
|
<!-- 顶部导航栏 -->
|
|
<u-navbar back-text="" title="聊天信息" :background="{ background: 'transparent' }" :title-style="{ fontweight:'bold'}" ></u-navbar>
|
|
|
|
<!-- 功能菜单区域 -->
|
|
<u-cell-group class="cell-group">
|
|
<u-cell-item bg-color="#fff" class="u-m-b-20" style="margin-bottom: 40px;font-weight: bold;" title="查找聊天记录" :arrow="true"
|
|
:border-bottom="false"></u-cell-item>
|
|
</u-cell-group>
|
|
|
|
<u-cell-group class="cell-group u-m-b-20" style="font-weight: bold;">
|
|
<u-cell-item bg-color="#fff" title="消息免打扰" :arrow="false"><u-switch v-model="disturb"></u-switch></u-cell-item>
|
|
<u-cell-item bg-color="#fff" title="置顶聊天" :arrow=" false"><u-switch v-model="topChat"></u-switch></u-cell-item>
|
|
<u-cell-item bg-color="#fff" title="项目提醒" :arrow=" false"><u-switch v-model="projectRemind"></u-switch></u-cell-item>
|
|
</u-cell-group>
|
|
|
|
<u-cell-group class="cell-group" style="font-weight: bold;">
|
|
<u-cell-item bg-color="#fff" class="u-m-b-20" style="margin-bottom: 40px;" title="清空聊天记录" :arrow="true"
|
|
:border-bottom="false"></u-cell-item>
|
|
</u-cell-group>
|
|
|
|
<u-cell-group class="cell-group" style="font-weight: bold;">
|
|
<u-cell-item bg-color="#fff" class="u-m-b-20" style="margin-bottom: 40px;" title="联系客服" :arrow="true"
|
|
:border-bottom="false"></u-cell-item>
|
|
</u-cell-group>
|
|
|
|
<u-cell-group class="cell-group" style="font-weight: bold;">
|
|
<u-cell-item bg-color="#fff" class="u-m-b-20" style="margin-bottom: 40px;" title="投诉" :arrow="true"
|
|
:border-bottom="false"></u-cell-item>
|
|
</u-cell-group>
|
|
|
|
|
|
<u-link href="#" :under-line="false" class="u-m-b-44" style="position: absolute;bottom: 0;left: 0;right: 0;text-align: center;">标记为 不感兴趣</u-link>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref } from 'vue'
|
|
|
|
// 为每个 switch 创建响应式数据
|
|
const disturb = ref(false)
|
|
const topChat = ref(false)
|
|
const projectRemind = ref(false)
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.container {
|
|
background: var(--bottom, #F0F3FF);
|
|
background-blend-mode: lighten;
|
|
width: 100%;
|
|
height: 100%;
|
|
|
|
::v-deep .cell-group {
|
|
.u-cell-item-box{
|
|
background-color: transparent;
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
</style> |