599 lines
14 KiB
Vue
599 lines
14 KiB
Vue
|
|
<template>
|
|||
|
|
<view>
|
|||
|
|
<view class="body">
|
|||
|
|
<view class="list">
|
|||
|
|
<view class="list_create faj">
|
|||
|
|
<text class="faj" v-if="!loverBasicList" @click="imageClick">+创建形象</text>
|
|||
|
|
<text class="faj" v-if="loverBasicList" @click="imageClick">+修改形象</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="list_content">
|
|||
|
|
<view class="list_title">恋人性别</view>
|
|||
|
|
<view class="list_item fa">
|
|||
|
|
<view class="list_table" v-for="(item, index) in genderList" :key="index"
|
|||
|
|
:class="genderIndex == index ? 'list_active' : ''" @click="genderClick(index)">
|
|||
|
|
<image class="list_sexImage" :src="item.image" mode="aspectFill"></image>
|
|||
|
|
<view class="list_name" :style="genderIndex == index ? 'list_active' : ''">{{ item.name }}
|
|||
|
|
</view>
|
|||
|
|
<image class="list_tag" v-if="genderIndex == index" src="/static/images/lover_back.png"
|
|||
|
|
mode="aspectFill"></image>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="list_content fa">
|
|||
|
|
<view class="list_title">昵称</view>
|
|||
|
|
<input class="f1" v-model="form.name" placeholder="给虚拟梦中人起个名字" placeholder-class="list_input" />
|
|||
|
|
</view>
|
|||
|
|
<view class="list_contentCharacter">
|
|||
|
|
<view class="list_title">人物简介</view>
|
|||
|
|
<textarea class="" v-model="form.intro" placeholder="一句话描述这个人物信息" maxlength="50"
|
|||
|
|
@input="openingIntroNum" placeholder-class="list_textarea" />
|
|||
|
|
<view class="list_count">{{ openingIntroNumber }}/50</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="list_content">
|
|||
|
|
<view class="list_title">性格模板</view>
|
|||
|
|
<view class="list_detail fa">
|
|||
|
|
<view class="list_text f1 fa wp">
|
|||
|
|
<text class="faj" v-for="(item, index) in personalityOptions" :key="index"
|
|||
|
|
@click="personalityClick(index)"
|
|||
|
|
:class="personalityIndex == index ? 'list_actives' : ''">{{ item.name }}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="list_contents">
|
|||
|
|
<view class="list_title">故事背景</view>
|
|||
|
|
<textarea class="" v-model="form.story_background" maxlength="100" @input="storyBackgroundNum"
|
|||
|
|
placeholder="添加虚拟人设,如身份、经历、性格等" placeholder-class="list_textarea" />
|
|||
|
|
<view class="list_count">{{ storyBackgroundNumber }}/100</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="list_contents">
|
|||
|
|
<view class="list_title">开场白</view>
|
|||
|
|
<textarea class="" v-model="form.opening_line" maxlength="20" @input="openingRemarksNum"
|
|||
|
|
placeholder="说点什么来开启聊天吧" placeholder-class="list_textarea" />
|
|||
|
|
<view class="list_count">{{ openingRemarksNumber }}/20</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="list_content">
|
|||
|
|
<view class="list_title">兴趣标签</view>
|
|||
|
|
<view class="list_detail fa">
|
|||
|
|
<view class="list_text f1 fa wp">
|
|||
|
|
<text class="faj" v-for="(item, index) in hobbyOptions" :key="index"
|
|||
|
|
@click="hobbyClick(index)" :class="hobbyIndex.includes(index) ? 'list_actives' : ''">{{
|
|||
|
|
item.name }}</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="list_content fa">
|
|||
|
|
<view class="list_title">音色</view>
|
|||
|
|
<view class="list_timbre f1 fa sb" @click="timbreClick">
|
|||
|
|
<text class="f1">{{ currentVoice.name || voicesInfo || '请选择音色' }}</text>
|
|||
|
|
<image src="/static/images/more.png" mode="widthFix"></image>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="opt">
|
|||
|
|
<view class="opt_module">
|
|||
|
|
<view class="opt_data">
|
|||
|
|
<view class="opt_btn faj" @click="submit">
|
|||
|
|
保存形象
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import {
|
|||
|
|
GetLoverConfig,
|
|||
|
|
LoverConfig,
|
|||
|
|
GetLoverOptions,
|
|||
|
|
} from '@/utils/api.js'
|
|||
|
|
import {
|
|||
|
|
isPhone
|
|||
|
|
} from '@/utils/utils.js'
|
|||
|
|
import notHave from '@/components/not-have.vue';
|
|||
|
|
import topSafety from '@/components/top-safety.vue';
|
|||
|
|
// 导入Pinia store
|
|||
|
|
import { useVoiceStore } from '@/store/index.js'
|
|||
|
|
export default {
|
|||
|
|
components: {
|
|||
|
|
notHave,
|
|||
|
|
topSafety,
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
form: {
|
|||
|
|
gender: '',
|
|||
|
|
name: '',
|
|||
|
|
intro: '',
|
|||
|
|
personality_tag: '',
|
|||
|
|
story_background: '',
|
|||
|
|
opening_line: '',
|
|||
|
|
interest_tags: [],
|
|||
|
|
},
|
|||
|
|
storyBackgroundNumber: 0,
|
|||
|
|
openingRemarksNumber: 0,
|
|||
|
|
openingIntroNumber: 0,
|
|||
|
|
genderList: [{
|
|||
|
|
name: '男生',
|
|||
|
|
image: 'https://nvlovers.oss-cn-qingdao.aliyuncs.com/uploads/20251226/e90acc9a7675bb463188a8ecf8f46054.png',
|
|||
|
|
id: 'male',
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '女生',
|
|||
|
|
image: 'https://nvlovers.oss-cn-qingdao.aliyuncs.com/uploads/20251231/a8b27c789ba9515ac0d07f77a3913d0b.png',
|
|||
|
|
id: 'female',
|
|||
|
|
},],
|
|||
|
|
genderIndex: 0,
|
|||
|
|
getLoverConfigList: '',
|
|||
|
|
personalityOptions: [],
|
|||
|
|
personalityIndex: -1,
|
|||
|
|
getLoverOptionsList: '',
|
|||
|
|
hobbyOptions: [], // 添加兴趣标签选项数据
|
|||
|
|
hobbyIndex: [], // 添加兴趣标签选中索引
|
|||
|
|
voicesInfo: '', // 添加音色信息
|
|||
|
|
timbre: '',
|
|||
|
|
loverBasicList: '',
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
computed: {
|
|||
|
|
// 计算属性,从Pinia store获取当前音色
|
|||
|
|
currentVoice() {
|
|||
|
|
const voiceStore = useVoiceStore()
|
|||
|
|
return voiceStore.currentVoice
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad() {
|
|||
|
|
this.getLoverConfig()
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
// 页面显示时,从Pinia store获取最新的音色信息
|
|||
|
|
const voiceStore = useVoiceStore()
|
|||
|
|
if (voiceStore.selectedVoiceId) {
|
|||
|
|
this.voicesInfo = voiceStore.selectedVoiceName
|
|||
|
|
this.timbre = voiceStore.selectedVoiceId
|
|||
|
|
}
|
|||
|
|
if (uni.getStorageSync('loverBasicList')) {
|
|||
|
|
this.loverBasicList = uni.getStorageSync('loverBasicList')
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
getLoverConfig() {
|
|||
|
|
GetLoverConfig({}).then(res => {
|
|||
|
|
if (res.code == 1) {
|
|||
|
|
this.getLoverConfigList = res.data
|
|||
|
|
|
|||
|
|
this.genderIndex = this.getLoverConfigList.gender == 'male' ? 0 : 1//0:男生 1:女生,默认根据接口选择男女
|
|||
|
|
this.form.gender = this.getLoverConfigList.gender//默认根据接口获取性别
|
|||
|
|
|
|||
|
|
this.personalityOptions = this.getLoverConfigList.personality_options // 默认从总接口获取性格模板
|
|||
|
|
this.form.personality_tag = this.personalityOptions[0].id // 默认选择第一个性格模板
|
|||
|
|
|
|||
|
|
this.hobbyOptions = this.getLoverConfigList.hobby_options // 获取兴趣标签选项
|
|||
|
|
|
|||
|
|
if (this.getLoverConfigList.lover.voice_id != null) {
|
|||
|
|
for (let i = 0; i < this.getLoverConfigList.voices.length; i++) {
|
|||
|
|
if (this.getLoverConfigList.voices[i].id == this.getLoverConfigList.lover.voice_id) {
|
|||
|
|
this.voicesInfo = this.getLoverConfigList.voices[i].name
|
|||
|
|
this.timbre = this.getLoverConfigList.voices[i].id
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
for (let i = 0; i < this.getLoverConfigList.voices.length; i++) {
|
|||
|
|
if (this.getLoverConfigList.voices[i].id == this.getLoverConfigList.default_voice_id) {
|
|||
|
|
this.voicesInfo = this.getLoverConfigList.voices[i].name
|
|||
|
|
this.timbre = this.getLoverConfigList.voices[i].id
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const voiceStore = useVoiceStore()
|
|||
|
|
voiceStore.setVoice(this.timbre, this.voicesInfo)
|
|||
|
|
|
|||
|
|
} else {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: res.msg,
|
|||
|
|
icon: 'none',
|
|||
|
|
position: 'top'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
LoverConfig() {
|
|||
|
|
LoverConfig(this.form).then(res => {
|
|||
|
|
if (res.code == 1) {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '保存成功',
|
|||
|
|
icon: 'none',
|
|||
|
|
position: 'top'
|
|||
|
|
})
|
|||
|
|
setTimeout(() => {
|
|||
|
|
uni.navigateBack({
|
|||
|
|
delta: 1,
|
|||
|
|
});
|
|||
|
|
}, 500);
|
|||
|
|
} else {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: res.msg,
|
|||
|
|
icon: 'none',
|
|||
|
|
position: 'top'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
getLoverOptions() {
|
|||
|
|
GetLoverOptions(
|
|||
|
|
{ gender: this.form.gender }
|
|||
|
|
).then(res => {
|
|||
|
|
if (res.code == 1) {
|
|||
|
|
this.getLoverOptionsList = res.data
|
|||
|
|
this.personalityOptions = this.getLoverOptionsList.personality_options
|
|||
|
|
this.form.personality_tag = this.personalityOptions[0].id // 默认选择第一个性格模板的id
|
|||
|
|
this.personalityIndex = 0// 默认选择第一个性格模板
|
|||
|
|
this.form.interest_tags = []// 默认兴趣标签为空
|
|||
|
|
this.hobbyIndex = []// 默认兴趣标签选中索引为空
|
|||
|
|
|
|||
|
|
for (let i = 0; i < this.getLoverOptionsList.voices.length; i++) {
|
|||
|
|
if (this.getLoverOptionsList.voices[i].id == this.getLoverOptionsList.default_voice_id) {
|
|||
|
|
this.voicesInfo = this.getLoverOptionsList.voices[i].name
|
|||
|
|
this.timbre = this.getLoverOptionsList.voices[i].id
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const voiceStore = useVoiceStore()
|
|||
|
|
voiceStore.setVoice(this.timbre, this.voicesInfo)
|
|||
|
|
|
|||
|
|
} else {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: res.msg,
|
|||
|
|
icon: 'none',
|
|||
|
|
position: 'top'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
genderClick(index) {
|
|||
|
|
this.genderIndex = index
|
|||
|
|
this.form.gender = this.genderList[index].id
|
|||
|
|
|
|||
|
|
this.form.name = ''
|
|||
|
|
this.form.intro = ''
|
|||
|
|
this.form.personality_tag = ''
|
|||
|
|
this.form.story_background = ''
|
|||
|
|
this.form.opening_line = ''
|
|||
|
|
this.form.interest_tags = []
|
|||
|
|
|
|||
|
|
this.getLoverOptions()
|
|||
|
|
},
|
|||
|
|
personalityClick(index) {
|
|||
|
|
this.personalityIndex = index
|
|||
|
|
this.form.personality_tag = this.personalityOptions[index].id
|
|||
|
|
},
|
|||
|
|
hobbyClick(index) {
|
|||
|
|
const currentIndex = this.hobbyIndex.indexOf(index);
|
|||
|
|
|
|||
|
|
if (currentIndex > -1) {
|
|||
|
|
// 如果已选中,则取消选中
|
|||
|
|
this.hobbyIndex.splice(currentIndex, 1);
|
|||
|
|
this.form.interest_tags.splice(currentIndex, 1);
|
|||
|
|
} else {
|
|||
|
|
// 如果未选中,先检查是否已达到最大选择数
|
|||
|
|
if (this.hobbyIndex.length >= 3) {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '最多只能选择3个兴趣标签',
|
|||
|
|
icon: 'none',
|
|||
|
|
position: 'top'
|
|||
|
|
});
|
|||
|
|
return; // 不做任何操作
|
|||
|
|
}
|
|||
|
|
// 未达到最大选择数,添加选中
|
|||
|
|
this.hobbyIndex.push(index);
|
|||
|
|
this.form.interest_tags.push(this.hobbyOptions[index].id);
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
storyBackgroundNum(e) {
|
|||
|
|
this.storyBackgroundNumber = e.detail.value.length;
|
|||
|
|
},
|
|||
|
|
openingRemarksNum(e) {
|
|||
|
|
this.openingRemarksNumber = e.detail.value.length;
|
|||
|
|
},
|
|||
|
|
openingIntroNumber(e) {
|
|||
|
|
this.openingIntroNumber = e.detail.value.length;
|
|||
|
|
},
|
|||
|
|
submit() {
|
|||
|
|
console.log(this.form)
|
|||
|
|
if (this.form.name == '') {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: "请输入昵称",
|
|||
|
|
icon: 'none',
|
|||
|
|
position: 'top'
|
|||
|
|
})
|
|||
|
|
} else if (this.form.intro == '') {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: "请输入人物简介",
|
|||
|
|
icon: 'none',
|
|||
|
|
position: 'top'
|
|||
|
|
})
|
|||
|
|
} else if (this.form.personality_tag == '') {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: "请选择性格模板",
|
|||
|
|
icon: 'none',
|
|||
|
|
position: 'top'
|
|||
|
|
})
|
|||
|
|
} else if (this.form.story_background == '') {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: "请输入故事背景",
|
|||
|
|
icon: 'none',
|
|||
|
|
position: 'top'
|
|||
|
|
})
|
|||
|
|
} else if (this.form.opening_line == '') {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: "请输入开场白",
|
|||
|
|
icon: 'none',
|
|||
|
|
position: 'top'
|
|||
|
|
})
|
|||
|
|
} else if (this.form.interest_tags.length == 0) {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: "请选择兴趣标签",
|
|||
|
|
icon: 'none',
|
|||
|
|
position: 'top'
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
console.log(this.form)
|
|||
|
|
this.LoverConfig()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
imageClick() {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: '/pages/create/image'
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
timbreClick() {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: '/pages/create/timbre?sex=' + this.form.gender
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
<style>
|
|||
|
|
page {
|
|||
|
|
background: #F6F8FA;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
<style>
|
|||
|
|
.body {
|
|||
|
|
position: relative;
|
|||
|
|
padding: 0 50rpx 50rpx 50rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list {
|
|||
|
|
position: relative;
|
|||
|
|
margin: 54rpx 0 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_create {
|
|||
|
|
position: relative;
|
|||
|
|
margin: 0 0 70rpx 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_create text {
|
|||
|
|
padding: 20rpx 58rpx;
|
|||
|
|
font-weight: 400;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: #222222;
|
|||
|
|
line-height: 50rpx;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
border-radius: 254rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_content {
|
|||
|
|
position: relative;
|
|||
|
|
margin: 0 0 30rpx 0;
|
|||
|
|
padding: 30rpx 40rpx;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
border-radius: 12rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_title {
|
|||
|
|
margin: 0 80rpx 0 0;
|
|||
|
|
font-weight: 500;
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
color: #222222;
|
|||
|
|
line-height: 50rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_title text {
|
|||
|
|
color: #817EFE;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_item {
|
|||
|
|
position: relative;
|
|||
|
|
margin: 30rpx 0 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_table {
|
|||
|
|
position: relative;
|
|||
|
|
margin: 0 32rpx 0 0;
|
|||
|
|
padding: 8rpx 6rpx;
|
|||
|
|
width: 168rpx;
|
|||
|
|
background: #FAFAFA;
|
|||
|
|
border-radius: 12rpx;
|
|||
|
|
border: 2rpx solid #FAFAFA;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_sexImage {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 136rpx;
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_name {
|
|||
|
|
font-weight: 400;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: #333333;
|
|||
|
|
line-height: 50rpx;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_active {
|
|||
|
|
color: #817EFE;
|
|||
|
|
border: 2rpx solid #817EFE;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_tag {
|
|||
|
|
position: absolute;
|
|||
|
|
right: 0;
|
|||
|
|
top: 0;
|
|||
|
|
width: 42rpx;
|
|||
|
|
height: 32rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_content input {
|
|||
|
|
font-weight: 400;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: #333;
|
|||
|
|
line-height: 50rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_input {
|
|||
|
|
color: #D3D3D3;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_contentCharacter {
|
|||
|
|
position: relative;
|
|||
|
|
margin: 0 0 30rpx 0;
|
|||
|
|
padding: 30rpx 40rpx 60rpx 40rpx;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
border-radius: 12rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_contentCharacter textarea {
|
|||
|
|
margin: 22rpx 0 0 0;
|
|||
|
|
height: 70rpx;
|
|||
|
|
font-weight: 400;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: #333;
|
|||
|
|
line-height: 50rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_contents {
|
|||
|
|
position: relative;
|
|||
|
|
margin: 0 0 30rpx 0;
|
|||
|
|
padding: 30rpx 40rpx 60rpx 40rpx;
|
|||
|
|
background: #FFFFFF;
|
|||
|
|
border-radius: 12rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_contents textarea {
|
|||
|
|
margin: 22rpx 0 0 0;
|
|||
|
|
height: 125rpx;
|
|||
|
|
font-weight: 400;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: #333;
|
|||
|
|
line-height: 50rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_textarea {
|
|||
|
|
color: #ADADAD;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_count {
|
|||
|
|
position: absolute;
|
|||
|
|
right: 30rpx;
|
|||
|
|
bottom: 14rpx;
|
|||
|
|
font-weight: 400;
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
color: #ADADAD;
|
|||
|
|
line-height: 50rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_timbre {
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_timbre text {
|
|||
|
|
width: 148rpx;
|
|||
|
|
height: 50rpx;
|
|||
|
|
font-family: Alibaba PuHuiTi 3.0, Alibaba PuHuiTi 30;
|
|||
|
|
font-weight: 400;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
color: #ADADAD;
|
|||
|
|
line-height: 50rpx;
|
|||
|
|
text-align: left;
|
|||
|
|
font-style: normal;
|
|||
|
|
text-transform: none;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_timbre image {
|
|||
|
|
width: 8rpx;
|
|||
|
|
height: 8rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_detail {
|
|||
|
|
position: relative;
|
|||
|
|
margin: 20rpx 0 0 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_detail image {
|
|||
|
|
width: 8rpx;
|
|||
|
|
height: 8rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_text {
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_text text {
|
|||
|
|
margin: 0 30rpx 30rpx 0;
|
|||
|
|
padding: 0 26rpx;
|
|||
|
|
font-weight: 400;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
color: #9E9E9E;
|
|||
|
|
line-height: 50rpx;
|
|||
|
|
background: #F6F8FA;
|
|||
|
|
border-radius: 12rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.list_actives {
|
|||
|
|
color: #FF51B3 !important;
|
|||
|
|
background: #FCE6F3 !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.opt {
|
|||
|
|
position: relative;
|
|||
|
|
height: 150rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.opt_module {
|
|||
|
|
position: fixed;
|
|||
|
|
padding: 5rpx 0 70rpx 0;
|
|||
|
|
height: 85rpx;
|
|||
|
|
width: 100%;
|
|||
|
|
background: #F6F8FA;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
box-sizing: content-box;
|
|||
|
|
border-top: 1px solid #f0f0f0;
|
|||
|
|
z-index: 2;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.opt_data {
|
|||
|
|
padding: 5rpx 50rpx;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.opt_btn {
|
|||
|
|
padding: 24rpx 0;
|
|||
|
|
font-weight: 400;
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
color: #FFFFFF;
|
|||
|
|
line-height: 50rpx;
|
|||
|
|
background: linear-gradient(135deg, #9F47FF 0%, #0053FA 100%);
|
|||
|
|
border-radius: 12rpx;
|
|||
|
|
}
|
|||
|
|
</style>
|