|
|
@@ -0,0 +1,716 @@
|
|
|
+<template>
|
|
|
+ <view class="mone">
|
|
|
+ <view class="m-top">
|
|
|
+ <image :src="baseURL + '/resource/icon/model2/tli.png'" mode="" class="top-left-img"></image>
|
|
|
+ <button type="default" class="top-btn fx-btn" v-if="isShare" open-type="share">
|
|
|
+ <image :src="baseURL + '/resource/icon/model1/fx.png'" mode=""></image>
|
|
|
+ </button>
|
|
|
+ <!-- 模板查看次数 -->
|
|
|
+ <view class="top-btn visit mvisit padding-r-10" v-if="isLook==1">
|
|
|
+ 浏览:{{cardInfo.look_count}}
|
|
|
+ </view>
|
|
|
+ <!-- 别人查看次数 -->
|
|
|
+ <view class="top-btn visit padding-r-10" v-else-if="isLook==2">
|
|
|
+ 浏览：{{cardInfo.card_look_count}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="m-body ">
|
|
|
+ <!-- 个人信息 -->
|
|
|
+ <view class="hua3">
|
|
|
+ <view class="hua2 ">
|
|
|
+ <view class="m-card m-card-t " >
|
|
|
+ <!-- 用户名称 -->
|
|
|
+ <view class="u-name">
|
|
|
+ {{cardInfo.name || '暂无'}}
|
|
|
+ </view>
|
|
|
+ <!-- 编号 -->
|
|
|
+ <view class="u-bh flex">
|
|
|
+ <image :src="baseURL + '/resource/icon/model2/bh.png'" mode=""></image>编号:{{cardInfo.no || "myj23031421"}}
|
|
|
+ </view>
|
|
|
+ <!-- 头像 -->
|
|
|
+ <view class="user-img">
|
|
|
+ <image :src="baseURL + '/resource/icon/model2/txk.png'" mode="" class="base-bg"></image>
|
|
|
+ <image :src="cardInfo.avatar" mode="" class="user-av"></image>
|
|
|
+ </view>
|
|
|
+ <!-- 职业 -->
|
|
|
+ <view class="zy-wrap" v-if="cardInfo.user_work_type_title">
|
|
|
+ <view class="zy">
|
|
|
+ 职业:{{cardInfo.user_work_type_title || '暂无'}}
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="card-content card-content-t">
|
|
|
+ <view class="user-info-t flex">
|
|
|
+
|
|
|
+ <view class="info-item-b">
|
|
|
+ 年龄： {{cardInfo.age|| '暂无'}}
|
|
|
+ </view>
|
|
|
+ <view class="info-item-b">
|
|
|
+ 属相： {{cardInfo.twelve|| '暂无'}}
|
|
|
+ </view>
|
|
|
+ <view class="info-item-b">
|
|
|
+ 从业： {{(cardInfo.work_year + '年')|| '暂无'}}
|
|
|
+ </view>
|
|
|
+ <view class="info-item-b">
|
|
|
+ 星座： {{cardInfo.constellation.replace('座','') || '暂无'}}
|
|
|
+ </view>
|
|
|
+ <!-- <view class="info-item-b">
|
|
|
+ 职业： {{cardInfo.user_work_type_title || '暂无'}}
|
|
|
+ </view> -->
|
|
|
+ <view class="info-item-b">
|
|
|
+ 籍贯： {{cardInfo.ancestral_place || '暂无'}}
|
|
|
+ </view>
|
|
|
+ <view class="info-item-b">
|
|
|
+ 民族： {{cardInfo.minority || '暂无'}}
|
|
|
+ </view>
|
|
|
+ <view class="info-item-b">
|
|
|
+ 学历： {{cardInfo.education || '暂无'}}
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ <view class="user-info flex">
|
|
|
+ <view class="info-item-q flex" style="align-items: flex-start;">
|
|
|
+ <text style="flex-shrink: 0;">服务地区：</text>
|
|
|
+ <view class="fwdz flex">
|
|
|
+ <view v-for="(fwitem,fwindex) in cardInfo.service_area_all">
|
|
|
+ {{fwitem}}{{fwindex ==(cardInfo.service_area_all.length -1) ?'': '、' }}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="info-item-q flex" style="align-items: flex-start;height: 110rpx;">
|
|
|
+ <text style="flex-shrink: 0;">服务价格： </text>
|
|
|
+ <view class="gzt">
|
|
|
+ <image :src="baseURL + '/resource/icon/model2/tiao.png'" mode=""></image>
|
|
|
+ <view class="gzt-price">
|
|
|
+ <text>{{cardInfo.service_min_price}}</text>元/{{ cardInfo.service_time_type_title && cardInfo.service_time_type_title.replace('每','')}}
|
|
|
+ </view>
|
|
|
+ <view class=" gzt-price-b">
|
|
|
+ <text>{{cardInfo.service_max_price}}</text>元/{{cardInfo.service_time_type_title && cardInfo.service_time_type_title.replace('每','')}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <image :src="baseURL + '/resource/icon/model1/yrz.png'" mode="" class="rz"
|
|
|
+ v-if="cardInfo.is_type_audit == 1"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- <view class="" style="height: 40rpx;"></view> -->
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 自我评价 -->
|
|
|
+ <view class="hua4">
|
|
|
+ <view class="">
|
|
|
+ <view class="m-card">
|
|
|
+ <view class="card-tit flex">
|
|
|
+ <image :src="baseURL + '/resource/icon/model2/zwpj.png'" mode="" class=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="card-content">
|
|
|
+ {{cardInfo.service_intro_content}}
|
|
|
+ </view>
|
|
|
+ <view class="img-list flex" style="padding-top: 0;">
|
|
|
+ <image :src="siiitem" mode="" v-for="siiitem in cardInfo.service_intro_imgs"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 我的证书 -->
|
|
|
+ <view class="hua5" v-if="cardInfo.service_audit_imgs && cardInfo.service_audit_imgs.length > 0">
|
|
|
+ <view class="m-card">
|
|
|
+ <view class="card-tit flex">
|
|
|
+ <image :src="baseURL + '/resource/icon/model2/wdzs.png'" mode="" class=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="img-list flex">
|
|
|
+ <image :src="saiitem" mode="" v-for="saiitem in cardInfo.service_audit_imgs"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 服务内容 -->
|
|
|
+ <view class="hua6">
|
|
|
+ <view class="m-card">
|
|
|
+ <view class="card-tit flex">
|
|
|
+ <image :src="baseURL + '/resource/icon/model2/fwnr.png'" mode="" class=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="card-content">
|
|
|
+ <view class="fw" v-for="spaitem in cardInfo.service_project_ar">
|
|
|
+ <view class="fw-tit">
|
|
|
+ <text class="yg"></text>{{spaitem.title}}
|
|
|
+ </view>
|
|
|
+ <view class="fw-content">
|
|
|
+ {{spaitem.content}}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 服务照片 -->
|
|
|
+ <view class="hua7" v-if="cardInfo.service_imgs && cardInfo.service_imgs.length > 0">
|
|
|
+ <view class="hua8">
|
|
|
+ <view class="m-card" >
|
|
|
+ <view class="card-tit flex">
|
|
|
+ <image :src="baseURL + '/resource/icon/model2/fwzp.png'" mode="" class=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="img-list flex">
|
|
|
+ <image :src="siitem" mode="" v-for="siitem in cardInfo.service_imgs"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import {
|
|
|
+ mapState,
|
|
|
+ mapMutations
|
|
|
+ } from 'vuex';
|
|
|
+ import {
|
|
|
+ getUserCardInfo,
|
|
|
+ getCommonUserCardInfo,
|
|
|
+ getShowTemplateItem,
|
|
|
+ subShowTemplateOrder
|
|
|
+ } from '@/api/model.js'
|
|
|
+ import {
|
|
|
+ getUser
|
|
|
+ } from '@/api/user.js';
|
|
|
+ export default {
|
|
|
+ props: {
|
|
|
+ isShare: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false
|
|
|
+ },
|
|
|
+ //1为模板2为用户
|
|
|
+ isLook: {
|
|
|
+ type: Number,
|
|
|
+ default: 0
|
|
|
+ },
|
|
|
+ cardInfo: {
|
|
|
+ type: Object,
|
|
|
+ default: () => {
|
|
|
+ return {
|
|
|
+ name: '佚名',
|
|
|
+ avatar: 'https://api.myjie.cn/resource/icon/base/f.png',
|
|
|
+ age: '41',
|
|
|
+ twelve: '鼠',
|
|
|
+ work_year: '10',
|
|
|
+ constellation: '处女座',
|
|
|
+ ancestral_place: '浙江',
|
|
|
+ minority: '汉族',
|
|
|
+ education: '本科',
|
|
|
+ service_area_all: ['浙江省台州市路桥区'],
|
|
|
+ service_min_price: 100,
|
|
|
+ service_max_price: 200,
|
|
|
+ service_time_type_title: '每小时',
|
|
|
+ service_intro_content: '高级育婴师证|高级催乳师证|早产儿护理师母婴护理证|金牌月嫂证|产后恢复师证|公共营养师证|月子药膳调理师证|国际宝宝睡眠咨询师证|普通话二级甲等|中央广播电视大学学历|学前教育专业，深耕幼教十年，技能全面，性格活泼，有亲和力，做事干净利落，有很强的责任心。对宝宝有爱心，体贴新手妈妈。专业技能熟练。应急能力强。让家人放心、产妇舒心的坐好月子。',
|
|
|
+ service_intro_imgs: ['https://api.myjie.cn/resource/icon/base/pj1.png',
|
|
|
+ 'https://api.myjie.cn/resource/icon/base/pj2.png',
|
|
|
+ 'https://api.myjie.cn/resource/icon/base/pj3.png',
|
|
|
+ 'https://api.myjie.cn/resource/icon/base/pj4.png'
|
|
|
+ ],
|
|
|
+ service_imgs: ['https://api.myjie.cn/resource/icon/base/pj1.png',
|
|
|
+ 'https://api.myjie.cn/resource/icon/base/pj2.png',
|
|
|
+ 'https://api.myjie.cn/resource/icon/base/pj3.png',
|
|
|
+ 'https://api.myjie.cn/resource/icon/base/pj4.png'
|
|
|
+ ],
|
|
|
+ service_audit_imgs: ['https://api.myjie.cn/resource/icon/base/zs1.png',
|
|
|
+ 'https://api.myjie.cn/resource/icon/base/zs2.png',
|
|
|
+ 'https://api.myjie.cn/resource/icon/base/zs3.png',
|
|
|
+ 'https://api.myjie.cn/resource/icon/base/zs4.png'
|
|
|
+ ],
|
|
|
+ service_project_ar: [{
|
|
|
+ title: '婴幼儿睡眠管理',
|
|
|
+ content: '如：日夜颠倒、睡眠不规律、乳头混淆、奶睡、抱睡等问题，帮助宝爸宝妈规律孩子作息、解决婴幼儿喂养困扰，培养良好的生活、学习习惯。'
|
|
|
+ }, {
|
|
|
+ title: '特色月子餐',
|
|
|
+ content: '套用客户的一句话“养眼、养心更养胃”！家常菜、面食、点心、甜品、靓汤、五谷杂粮粥、婴幼儿花样辅食等。'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '早产儿特殊护理',
|
|
|
+ content: '包括早产儿基础护理、安全喂养方法、追赶性生长、消化与免疫系统等技能，根据宝宝具体情况给予早产儿家长的科学入户指导。'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '0-6岁早期教育',
|
|
|
+ content: '在婴孩最敏感最能接受的时期进行事半功倍的适时教育，针对不同年龄段的孩子，开发婴幼儿潜能的教育，为孩子多元化和健康人格打下良好基础。'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ is_type_audit: 1
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {}
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState(['baseURL']),
|
|
|
+ ...mapState('user', ['userInfo'])
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ // this.getUser()
|
|
|
+ },
|
|
|
+ onUnload() {
|
|
|
+ let pages = getCurrentPages(); //获取加载的页面
|
|
|
+ let currentPage = pages[pages.length - 2]; //获取当前页面的对象
|
|
|
+ if (currentPage.route == 'pages/public/wxLogin') {
|
|
|
+ uni.switchTab({
|
|
|
+ url: '/pages/index/index'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {}
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .mone {
|
|
|
+ background-color: #fffbed;
|
|
|
+ padding-bottom: 43rpx;
|
|
|
+
|
|
|
+ .m-top {
|
|
|
+ width: 750rpx;
|
|
|
+ position: relative;
|
|
|
+ width: 750rpx;
|
|
|
+ height: 150rpx;
|
|
|
+ background-color: #fffbed;
|
|
|
+ .top-left-img {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ width: 280rpx;
|
|
|
+ height: 248rpx;
|
|
|
+ }
|
|
|
+ .top-bg {
|
|
|
+ position: relative;
|
|
|
+ width: 750rpx;
|
|
|
+ height: 370rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .readme {
|
|
|
+ width: 534rpx;
|
|
|
+ height: 83rpx;
|
|
|
+ position: absolute;
|
|
|
+ top: 172rpx;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ margin: auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ .fx-btn {
|
|
|
+ padding: 0;
|
|
|
+ &::after {
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+ border-radius: 24rpx 0 0 24rpx;
|
|
|
+ image {
|
|
|
+ width: 150rpx;
|
|
|
+ height: 48rpx;
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .top-btn {
|
|
|
+ height: 48rpx;
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top: 70rpx;
|
|
|
+ line-height: 48rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
+ .visit {
|
|
|
+ border-radius: 24rpx 0 0 24rpx;
|
|
|
+ top: 130rpx;
|
|
|
+ border: 1px solid #f65486;
|
|
|
+ color: #f65486;
|
|
|
+ padding-left: 24rpx;
|
|
|
+ }
|
|
|
+ .mvisit {
|
|
|
+ top: 70rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .m-body {
|
|
|
+
|
|
|
+ width: 750rpx;
|
|
|
+ margin: auto;
|
|
|
+ margin-top: 20rpx;
|
|
|
+
|
|
|
+ padding: 45rpx 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .info-item-b,
|
|
|
+ .info-item-q {
|
|
|
+ padding: 10rpx 0;
|
|
|
+ color: #000000;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ padding-left: 20rpx;
|
|
|
+ &::before {
|
|
|
+ display: inline-block;
|
|
|
+ content: '';
|
|
|
+ width: 15rpx;
|
|
|
+ height: 15rpx;
|
|
|
+ background: linear-gradient(225deg, #FE9E32, #FDE37D);
|
|
|
+ border-radius: 50%;
|
|
|
+ position: absolute;
|
|
|
+ top: 22rpx;
|
|
|
+ left: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .qianger {
|
|
|
+ width: 2em;
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+
|
|
|
+ .laner {
|
|
|
+ width: 0.5em;
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .m-card-t {
|
|
|
+ border: none !important;
|
|
|
+ background: transparent !important;
|
|
|
+ }
|
|
|
+ .m-card {
|
|
|
+ width: 640rpx;
|
|
|
+ background: rgba(255, 255, 255, 0.6);
|
|
|
+ border-radius: 20rpx;
|
|
|
+ position: relative;
|
|
|
+ // min-height: 270rpx;
|
|
|
+ border: 4px solid #fff;
|
|
|
+ margin: 0 auto 46rpx;
|
|
|
+ .user-img {
|
|
|
+ position: absolute;
|
|
|
+ right: -20rpx;
|
|
|
+ top: -49rpx;
|
|
|
+ width: 318rpx;
|
|
|
+ height: 366rpx;
|
|
|
+ .base-bg {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ .user-av {
|
|
|
+ width: 272rpx;
|
|
|
+ height: 272rpx;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 17rpx;
|
|
|
+ left: 12rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .zy-wrap {
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top: 330rpx;
|
|
|
+ width: 300rpx;
|
|
|
+ // background-color: #fea540;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ font-size: 26rpx;
|
|
|
+ .zy {
|
|
|
+ display: inline-block;
|
|
|
+ margin: auto;
|
|
|
+ border: 1px solid #fea540;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ padding: 8rpx 16rpx;
|
|
|
+ color: #fea540;
|
|
|
+ margin: auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ .card-tit {
|
|
|
+ justify-content: center;
|
|
|
+ padding-top: 55rpx;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ &::after {
|
|
|
+ content: '';
|
|
|
+ width: 60rpx;
|
|
|
+ height: 10rpx;
|
|
|
+ background: #FE9E32;
|
|
|
+ border-radius: 5rpx;
|
|
|
+ position: absolute;
|
|
|
+ bottom: -20rpx;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ margin: auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: 213rpx;
|
|
|
+ height: 47rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .card-bg {
|
|
|
+ width: 100%;
|
|
|
+ height: 270rpx;
|
|
|
+ position: absolute;
|
|
|
+ bottom: 0rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .card-content {
|
|
|
+ padding: 25rpx 35rpx;
|
|
|
+ font-size: 26rpx;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #2C2E35;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .card-content-t {
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .img-list {
|
|
|
+ justify-content: space-between;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ margin: auto;
|
|
|
+ padding: 30rpx 30rpx 0;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: 270rpx;
|
|
|
+ height: 270rpx;
|
|
|
+ background-color: #fff;
|
|
|
+ margin-bottom: 30rpx;
|
|
|
+ box-shadow: 0px 0px 20rpx 0px rgba(50, 50, 52, 0.6);
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ .fw {
|
|
|
+ font-size: 26rpx;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #2C2E35;
|
|
|
+ padding: 10rpx 0;
|
|
|
+
|
|
|
+ .fw-tit {
|
|
|
+ color: #FE9E32;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .yg {
|
|
|
+ background-color: #FE9E32;
|
|
|
+ display: inline-block;
|
|
|
+ width: 10rpx;
|
|
|
+ height: 10rpx;
|
|
|
+ border-radius: 50%;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .fw-content {
|
|
|
+ padding-top: 10rpx;
|
|
|
+ padding-left: 18rpx;
|
|
|
+ text-align: justify;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ .user-info-t {
|
|
|
+ width: 350rpx;
|
|
|
+ }
|
|
|
+ .user-info, .user-info-t {
|
|
|
+ flex-wrap: wrap;
|
|
|
+ font-size: 26rpx;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #000000;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ .info-item-b {
|
|
|
+ width: 50%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .info-item-q {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: flex-start;
|
|
|
+ justify-content: start;
|
|
|
+
|
|
|
+ .fwdz {
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: flex-start;
|
|
|
+ }
|
|
|
+
|
|
|
+ .gzt {
|
|
|
+ width: 312rpx;
|
|
|
+ height: 24rpx;
|
|
|
+ padding-top: 10rpx;
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ image {
|
|
|
+ width: 312rpx;
|
|
|
+ height: 24rpx;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+
|
|
|
+ .gzt-price,
|
|
|
+ .gzt-price-b {
|
|
|
+ width: 200rpx;
|
|
|
+ text-align: center;
|
|
|
+ position: absolute;
|
|
|
+ padding-top: 20rpx;
|
|
|
+
|
|
|
+ &::after {
|
|
|
+ content: '';
|
|
|
+ width: 0px;
|
|
|
+ height: 0rpx;
|
|
|
+ border: 14rpx solid;
|
|
|
+ border-color: transparent transparent #FE9E32;
|
|
|
+ position: absolute;
|
|
|
+ top: -14rpx;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ margin: auto;
|
|
|
+ }
|
|
|
+
|
|
|
+ text {
|
|
|
+ color:#FE9E32;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .gzt-price {
|
|
|
+ left: -100rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .gzt-price-b {
|
|
|
+ right: -100rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .rz {
|
|
|
+ margin-top: 10rpx;
|
|
|
+ margin-left: 10rpx;
|
|
|
+ width: 87rpx;
|
|
|
+ height: 26rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .hua2 {
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ &::before {
|
|
|
+ content: '';
|
|
|
+ width: 370rpx;
|
|
|
+ height: 629rpx;
|
|
|
+ border-radius: 20rpx 314rpx 315rpx 20rpx;
|
|
|
+ background: radial-gradient(ellipse at 0 50%, #e0f2f8,#f8f9ef, transparent);
|
|
|
+ // background: url($base-url + '/resource/icon/model1/hua2.png') no-repeat;
|
|
|
+ position: absolute;
|
|
|
+ bottom: -315rpx;
|
|
|
+ left: 0;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .hua3 {
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ &::before {
|
|
|
+ content: '';
|
|
|
+ width: 360rpx;
|
|
|
+ height: 629rpx;
|
|
|
+ background: radial-gradient(ellipse at 100% 50%, #FFE4E9,#fff4f5, transparent);
|
|
|
+ position: absolute;
|
|
|
+ bottom: -400rpx;
|
|
|
+ right: 0;
|
|
|
+ margin: auto;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .hua4 {
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ &::before {
|
|
|
+ content: '';
|
|
|
+ width: 272rpx;
|
|
|
+ height: 621rpx;
|
|
|
+ background: radial-gradient(ellipse at 100% 50%, #e0f2f8,#f8f9ef, transparent);
|
|
|
+ position: absolute;
|
|
|
+ bottom: -310rpx;
|
|
|
+ right: 0;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .hua5 {
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ &::before {
|
|
|
+ content: '';
|
|
|
+ width: 199rpx;
|
|
|
+ height: 298rpx;
|
|
|
+ background: radial-gradient(ellipse at 100% 50%, #FFE4E9,#fff4f5, transparent);
|
|
|
+ position: absolute;
|
|
|
+ bottom: -100rpx;
|
|
|
+ left: 0;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ transform: rotateY(180deg);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .hua6 {
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ &::before {
|
|
|
+ content: '';
|
|
|
+ width: 313rpx;
|
|
|
+ height: 629rpx;
|
|
|
+ position: absolute;
|
|
|
+ background: radial-gradient(ellipse at 0 50%, #FFE4E9,#fff4f5, transparent);
|
|
|
+ bottom: -315rpx;
|
|
|
+ right: 0;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ transform: rotateY(180deg);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .hua7 {
|
|
|
+ position: relative;
|
|
|
+ &::before {
|
|
|
+ content: '';
|
|
|
+ width: 344rpx;
|
|
|
+ height: 286rpx;
|
|
|
+ position: absolute;
|
|
|
+ background: url($base-url + '/resource/icon/model2/hua8.png') no-repeat;
|
|
|
+ bottom: -143rpx;
|
|
|
+ right: 0;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .hua8 {
|
|
|
+ position: relative;
|
|
|
+ &::before {
|
|
|
+ content: '';
|
|
|
+ width: 367rpx;
|
|
|
+ height: 372rpx;
|
|
|
+ position: absolute;
|
|
|
+ border-radius: 20rpx 150rpx 150rpx 20rpx;
|
|
|
+ background: radial-gradient(ellipse at 0% 50%, #FFE4E9,#fff7f2, transparent);
|
|
|
+ bottom: -143rpx;
|
|
|
+ left: 0;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .u-name {
|
|
|
+ font-size: 73rpx;
|
|
|
+ font-weight: 400;
|
|
|
+ color: #202E4F;
|
|
|
+ }
|
|
|
+ .u-bh {
|
|
|
+ justify-content: flex-start;
|
|
|
+ image {
|
|
|
+ width: 26rpx;
|
|
|
+ height: 26rpx;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ }
|
|
|
+ font-size: 28rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #202e4f;
|
|
|
+
|
|
|
+ }
|
|
|
+</style>
|
