tag.vue
2.1 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
<template>
<u-navbar title=" " :autoBack="true" bgColor="#ffffff" placeholder safeAreaInsetTop :titleStyle="{ color: '#fff' }">
<template #right>
<view style="width: 126rpx">
<up-button color="#05B8D2" shape="circle" text="保存" throttleTime="1500" size="small" @click="confirmSelectDataHandler"></up-button>
</view>
</template>
</u-navbar>
<view class="minetag">
<view class="title">我的标签</view>
<view class="content">丰富的个形特点 ，客户看到会主动咨询哦</view>
<view class="flexJ" style="margin-bottom: 32rpx">
<view class="title1">选择标签</view>
<view class="content1">标签可多选，最多选择5个</view>
</view>
<view class="flexW">
<view v-for="(_, index) in 5" class="grayTag flexC" :class="{ blueTag: index > 1 }">标签111</view>
</view>
</view>
</template>
<script setup lang="ts">
import { ref, getCurrentInstance, ComponentPublicInstance } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
const { proxy } = getCurrentInstance() as { proxy: ComponentPublicInstance }
interface EventType {
flag: string
}
const Event = ref<EventType>()
onLoad((e: EventType) => {
Event.value = e
})
const confirmSelectDataHandler = () => {}
</script>
<style lang="scss" scoped>
.minetag {
box-sizing: border-box;
padding: 50rpx 32rpx 0;
.grayTag {
width: fit-content;
box-sizing: border-box;
padding: 22rpx 24rpx;
margin-right: 22rpx;
border-radius: 8rpx;
font-size: 28rpx;
font-weight: 700;
color: #323233;
background: #f7f7f7;
border: 2rpx solid #f7f7f7;
margin-bottom: 28rpx;
}
.blueTag {
border: 2rpx solid #05b8d2;
background: #ebfdff;
color: #05b8d2;
}
.title {
color: #323233;
font-size: 52rpx;
font-weight: 700;
margin-bottom: 14rpx;
}
.title1 {
color: #323233;
font-size: 40rpx;
font-weight: 700;
}
.content {
color: #666666;
font-size: 28rpx;
font-weight: 700;
margin-bottom: 114rpx;
}
.content1 {
color: #999999;
font-size: 24rpx;
font-weight: 700;
}
}
</style>