1225 lines
38 KiB
Vue
1225 lines
38 KiB
Vue
<template>
|
||
<view class="" style="overflow-x: hidden;">
|
||
<u-navbar title-width="750" :is-back="false">
|
||
<view class="u-flex u-relative u-flex-1 u-row-center">
|
||
<view class="u-absolute u-flex" style="left: 30rpx;">
|
||
<u-icon name="arrow-left" @click="back" size="44"></u-icon>
|
||
<view class="u-m-l-20" @click="showFangqi">放弃</view>
|
||
</view>
|
||
<view class="font-lob u-font-40 color-000 font-bold " style="margin-left: 200rpx;">制作数字分身</view>
|
||
</view>
|
||
</u-navbar>
|
||
<view>
|
||
<image src="@/me/static/ymf/1b3d78fa5f92af069751ea64d493c0d85050b1e03cc5b-tPC378.png" mode=""></image>
|
||
<image src="@/me/static/ymf/390e926273eea85c894e613d42c9931ee2cd1f0a200fd-ApyNVV.png" mode=""></image>
|
||
<image src="@/me/static/ymf/79cbb0e34c24915f1883feaa3cf3179b0a1ceb1362a18-unU6xQ.png" mode=""></image>
|
||
<image src="@/me/static/ymf/cb319b604e49b816971b708b1231321318e0023610d8c-I24hXU.jpg" mode=""></image>
|
||
<image src="@/me/static/ymf/cf2d172a6da494b2e577f699254a780907b7c222246d7-ehahn1.png" mode=""></image>
|
||
<image src="@/me/static/ymf/eaae3095c9e433fb8a015aaebbe52047009dd863ff2b9-igSItK.png" mode=""></image>
|
||
<image src="@/me/static/ymf/f3c60c6f31c74bdf38ba2d8993bcb443ab9bc335cc875-xfx4CJ.png" mode=""></image>
|
||
<image src="@/me/static/ymf/c93b4cc9363d52cba140f7239516344ece9388141079a4-do8mFc.png" mode=""></image>
|
||
<image src="@/me/static/ymf/031da1e7f043de5d5e1ee355994a93e5ec983aca44dc-sZf0Vl_fw1200.jpg" mode=""></image>
|
||
<image src="@/me/static/ymf/c4e6c5023b94de32df2f51d9ebd633790cc6125a88e4-TIyAcR_fw1200.jpg" mode=""></image>
|
||
<image src="@/me/static/ymf/f7da7a8ca57f9f0d56bbb3d7be1d1c86f96304ce4b3a-iVbD8U_fw1200.jpg" mode=""></image>
|
||
<image src="@/me/static/ymf/2e521eee5a8c80ea6879028ee866c5d0531bc4f1d5e48-Bh95lN_fw1200.jpg" mode=""></image>
|
||
<image src="@/me/static/ymf/38cf4e97e52b50be9dcdcdc1352c497e1acc9266cd52-aUOrxn_fw1200.webp" mode=""></image>
|
||
<image src="@/me/static/ymf/73170e6a596b72538dbe743b06ef8b96e4885aff5b4c3-MsouS7_fw1200.jpg" mode=""></image>
|
||
<image src="@/me/static/ymf/e9f9cb6b95c21c714015f15c372f595367aa553f443a-WpOCNo_fw1200.webp" mode=""></image>
|
||
<image src="@/me/static/ymf/f5d96faaa94cb0151a5c95db44e27b80ed6eeac5cb32-rApi2S_fw1200.webp" mode=""></image>
|
||
<image src="@/me/static/ymf/0e114b9ac6afc2b4c0f29520178be64915a111e218a8b5-mbMpg2_fw1200.jpg" mode=""></image>
|
||
<image src="@/me/static/ymf/4783f7272bf31eeafbe1362605477de14b7cd3da24b0-ggkAnW_fw658webp.webp" mode=""></image>
|
||
<image src="@/me/static/ymf/8dce1d3c3a8287c35bc1bf394048d57a64acfa047d4e-6wXnWE_fw658webp.webp" mode=""></image>
|
||
<image src="@/me/static/ymf/ff919b6254e376cc902c89afdcc194ac2ab39c93793b-8TdL1Z_fw658webp.webp" mode=""></image>
|
||
<image src="@/me/static/ymf/3c9a5848127a67f98e25176a042511b89afd31daccc2f-5EHbxD_fw658webp.webp" mode=""></image>
|
||
<image src="@/me/static/ymf/6c9e57bcbcb047039a8edb30ecdd3b912bac99555a8fc-9EK0oO_fw658webp.webp" mode=""></image>
|
||
<image src="@/me/static/ymf/78a020586cfbb791918b767520a8ff3c2ab9660f1ee1b-GX4zcc_fw658webp.webp" mode=""></image>
|
||
<image src="@/me/static/ymf/babf535567728d84346fbb13348e94aae3ec8f82106e2-QKPJoe_fw658webp.webp" mode=""></image>
|
||
<image src="@/me/static/ymf/d1e4d760358ba0733faee6bcad1e23cb4a1d6d76ba290-O3hUrf_fw240webp.webp" mode=""></image>
|
||
<image src="@/me/static/ymf/dcb5a4b0b1060b569f9fc618e6e2708b584f7def1cadf-R7jpIr_fw658webp.webp" mode=""></image>
|
||
<image src="@/me/static/ymf/e4330f184149f502f4948ce3b60059edaffc9c3d94ca4-B11p5c_fw658webp.webp" mode=""></image>
|
||
<image src="@/me/static/ymf/fa22e2a27871e5f8841e8abb12cc4347a6b9440816068-3XsAnJ_fw658webp.webp" mode=""></image>
|
||
</view>
|
||
|
||
|
||
|
||
<view class="u-flex u-row-center donghua1" :style="{transform: 'translateX('+translateX+'rpx)'}">
|
||
<view class="u-flex" @click="changeKey('isFirst',true)">
|
||
<view class="color-fff first font-bold u-font-48">
|
||
1
|
||
</view>
|
||
<view class="u-p-l-20">
|
||
<view class="u-font-32 font-bold color-000">上传正面照片</view>
|
||
<view class="color-999 u-font-24 u-m-t-10">1张五官清晰的正面照片</view>
|
||
</view>
|
||
</view>
|
||
<view class="u-flex u-m-l-40" @click="changeKey('isFirst',false)">
|
||
|
||
<view class="color-fff first font-bold u-font-48" v-if="result&&result.mainPhoto">
|
||
2
|
||
</view>
|
||
<view class="color-fff two font-bold u-font-48" v-else>
|
||
2
|
||
</view>
|
||
<view class="u-p-l-20">
|
||
<view class="u-font-32 font-bold color-000">补充{{max}}张照片</view>
|
||
<view class="color-999 u-font-24 u-m-t-10">上传半身照效果最佳</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<template v-if="isFirst">
|
||
<view class="u-flex u-row-center u-m-t-60">
|
||
<view @click="upload" class="upload u-flex u-row-center u-col-center u-flex-col">
|
||
<u-icon v-if="!src" name="plus" color="rgb(170,170,170)" size="60"></u-icon>
|
||
<image :src="src" v-else mode="aspectFill"></image>
|
||
</view>
|
||
</view>
|
||
<view class="u-m-t-10 u-font-24 u-text-center" v-if="wating">
|
||
正面照片识别中，请耐心等待
|
||
</view>
|
||
<template v-if="result">
|
||
<view class="u-m-t-40 u-text-center">
|
||
<view class="u-font-32 color-000 font-bold">正面照片识别成功</view>
|
||
<view class="u-m-t-10 color-999 u-font-24">
|
||
可重新上传或继续补充多角度照片
|
||
</view>
|
||
<view class="u-flex u-row-center u-m-t-60" v-if="result.mainPhoto">
|
||
<view style="width:440rpx">
|
||
<my-button @click="changeKey('isFirst',false)">补充多角度照片</my-button>
|
||
</view>
|
||
</view>
|
||
<view class="u-flex u-row-center u-m-t-30">
|
||
<view style="width:440rpx">
|
||
<my-button type="cancel" @click="upload">重新上传正面照片</my-button>
|
||
</view>
|
||
</view>
|
||
<view style="height: 100rpx;"></view>
|
||
</view>
|
||
</template>
|
||
<template v-if="!result">
|
||
<view class="u-flex u-row-center">
|
||
<view class="u-m-t-20 u-font-24 color-999 u-p-l-20 u-p-r-20" style="width: 590rpx;">
|
||
请确定您对上传的照片拥有合法使用权利或已取得他人合法授权
|
||
</view>
|
||
</view>
|
||
<view class="u-flex u-row-center u-m-t-40">
|
||
<view style="width:440rpx">
|
||
<my-button @click="upload">添加一张正面照片</my-button>
|
||
</view>
|
||
</view>
|
||
<view class="u-font-24 u-text-center u-m-t-20 color-000">
|
||
*建议上传照片时勾选"原图"
|
||
</view>
|
||
|
||
<view class="bg-fff u-text-center color-999 shili" style="margin-top: 100rpx;">
|
||
<view class="u-absolute bg-fff">照片示例</view>
|
||
</view>
|
||
<view class="u-flex u-row-between u-p-l-40 u-p-r-40 " style="margin-top:160rpx;">
|
||
<view class="">
|
||
<view class="u-flex bg1" style="border-radius:30rpx ;overflow: hidden;">
|
||
<image src="/static/1.png" class="wh140" mode="aspectFill"></image>
|
||
</view>
|
||
<view class="u-m-t-10 u-font-24 u-text-center">五官清晰</view>
|
||
<view class="u-flex u-row-center u-m-t-20">
|
||
<view class="kuang u-flex u-row-center bg2">
|
||
<u-icon name="checkmark" color="#333"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="">
|
||
<view class="u-flex bg1" style="border-radius:30rpx ;overflow: hidden;">
|
||
<image src="/static/2.png" class="wh140" mode="aspectFill"></image>
|
||
</view>
|
||
<view class="u-m-t-10 u-font-24 u-text-center">不是正面</view>
|
||
<view class="u-flex u-row-center u-m-t-20">
|
||
<view class="kuang u-flex u-row-center bg3">
|
||
<u-icon name="close" size="20" color="#fff"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="">
|
||
<view class="u-flex bg1" style="border-radius:30rpx ;overflow: hidden;">
|
||
<image src="/static/3.png" class="wh140" mode="aspectFill"></image>
|
||
</view>
|
||
<view class="u-m-t-10 u-font-24 u-text-center">有遮挡</view>
|
||
<view class="u-flex u-row-center u-m-t-20">
|
||
<view class="kuang u-flex u-row-center bg3">
|
||
<u-icon name="close" size="20" color="#fff"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="">
|
||
<view class="u-flex bg1" style="border-radius:30rpx ;overflow: hidden;">
|
||
<image src="/static/4.png" class="wh140" mode="aspectFill"></image>
|
||
</view>
|
||
<view class="u-m-t-10 u-font-24 u-text-center">过于模糊</view>
|
||
<view class="u-flex u-row-center u-m-t-20">
|
||
<view class="kuang u-flex u-row-center bg3">
|
||
<u-icon name="close" size="20" color="#fff"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="u-font-24 color-999 u-m-t-40 u-p-l-40 u-p-r-40 u-text-center">
|
||
温馨提示:目前婴儿、老年人、眼镜等特征效果有不稳定性，我们正在努力优化
|
||
</view>
|
||
</template>
|
||
|
||
|
||
|
||
</template>
|
||
<template v-if="!isFirst">
|
||
<!-- <template v-if="!hasSubmit">
|
||
<view class="u-flex u-p-l-30 u-p-r-30 u-row-between u-flex-wrap">
|
||
<view class="box1" v-for="(item1,index1) in max" :key="index1">
|
||
<view class="u-absolute"></view>
|
||
<image :src="twoArr[index1].smallUrl" mode="aspectFill"></image>
|
||
</view>
|
||
</view>
|
||
</template> -->
|
||
|
||
<!-- <template v-else> -->
|
||
<template >
|
||
<template>
|
||
<view class="u-text-center color-999 u-m-t-40">已合格的照片</view>
|
||
<view class="u-flex u-p-l-30 u-p-r-30 u-flex-wrap u-m-t-20">
|
||
<view class="box1 u-m-r-10 u-relative" v-for="(item1,index1) in max" :key="index1">
|
||
<view v-if="successImgs[index1]" @click="delShow(successImgs[index1])" class="u-absolute u-flex"
|
||
style="right: 6rpx;top: 6rpx;">
|
||
<view class="u-flex u-row-center"
|
||
style="width:30rpx ;height: 30rpx; background-color: rgba(0, 0, 0, .5);border-radius: 50%;overflow: hidden;">
|
||
<u-icon name="close" color="#fff" size="20"></u-icon>
|
||
</view>
|
||
</view>
|
||
<image v-if="successImgs[index1]" :src="successImgs[index1].smallUrl" mode="aspectFill"></image>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<template>
|
||
<view class="u-text-center color-999 u-m-t-40">识别失败照片</view>
|
||
<view class="u-flex u-p-l-30 u-p-r-30 u-flex-wrap u-m-t-20">
|
||
<view class="box1 u-m-r-10" v-for="(item1,index1) in failImgs" :key="index1">
|
||
<view class="u-absolute"></view>
|
||
<image v-if="item1" :src="item1.smallUrl" mode="aspectFill"></image>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<template>
|
||
<view class="u-text-center color-999 u-m-t-40">上传失败照片</view>
|
||
<view class="u-flex u-p-l-30 u-p-r-30 u-flex-wrap u-m-t-20">
|
||
<view class="box1 u-m-r-10" v-for="(item1,index1) in noUploadArr" :key="index1">
|
||
<view class="u-absolute"></view>
|
||
<image v-if="item1" :src="item1.smallUrl" mode="aspectFill"></image>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
</template>
|
||
|
||
|
||
<view class="u-flex u-row-center">
|
||
<view class="u-m-t-20 u-font-24 color-999 u-p-l-20 u-p-r-20" style="width: 590rpx;">
|
||
请确定您对上传的照片拥有合法使用权利或已取得他人合法授权
|
||
</view>
|
||
</view>
|
||
<template v-if="!isFirst">
|
||
<view class="u-flex u-row-center u-m-t-40" v-if="!successImgs.length&&!failImgs.length">
|
||
<view style="width:440rpx">
|
||
<!-- <my-button @click="noPingguUpload">补充上传 {{max}} 张照片</my-button> -->
|
||
<my-button @click="uploadTwo">补充上传 {{max}} 张照片</my-button>
|
||
</view>
|
||
|
||
</view>
|
||
<view class="u-flex u-row-center u-m-t-40" v-if="twoArr.length>=20">
|
||
<view style="width:440rpx">
|
||
<my-button @click="pingggu">评估图片</my-button>
|
||
</view>
|
||
|
||
</view>
|
||
</template>
|
||
|
||
|
||
<view class="u-font-24 u-text-center u-m-t-20 color-999" v-if="isPinggu">
|
||
多角度照片识别中，请耐心等待
|
||
</view>
|
||
<template>
|
||
<view class="u-font-24 u-text-center u-m-t-20 color-000">
|
||
*建议上传照片时勾选"原图"
|
||
</view>
|
||
<view class="">
|
||
<view class="bg-fff u-text-center color-999 shili" style="margin-top: 60rpx;">
|
||
<view class="u-absolute bg-fff">正确示例</view>
|
||
</view>
|
||
<view class="u-flex u-row-between u-p-l-40 u-p-r-40 " style="padding-top: 60rpx;">
|
||
<view class="">
|
||
<view class="u-flex bg1" style="border-radius:30rpx ;overflow: hidden;">
|
||
<image src="/static/5.png" class="wh200" mode="aspectFill"></image>
|
||
</view>
|
||
<view class="u-m-t-10 u-font-24 u-text-center">多光线多背景</view>
|
||
<view class="u-flex u-row-center u-m-t-20">
|
||
<view class="kuang u-flex u-row-center bg2">
|
||
<u-icon name="checkmark" color="#333"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="">
|
||
<view class="u-flex bg1" style="border-radius:30rpx ;overflow: hidden;">
|
||
<image src="/static/6.png" class="wh200" mode="aspectFill"></image>
|
||
</view>
|
||
<view class="u-m-t-10 u-font-24 u-text-center">多视角</view>
|
||
<view class="u-flex u-row-center u-m-t-20">
|
||
<view class="kuang u-flex u-row-center bg2">
|
||
<u-icon name="checkmark" color="#333"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="">
|
||
<view class="u-flex bg1" style="border-radius:30rpx ;overflow: hidden;">
|
||
<image src="/static/7.png" class="wh200" mode="aspectFill"></image>
|
||
</view>
|
||
<view class="u-m-t-10 u-font-24 u-text-center">大头照</view>
|
||
<view class="u-flex u-row-center u-m-t-20">
|
||
<view class="kuang u-flex u-row-center bg2">
|
||
<u-icon name="checkmark" color="#333"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="">
|
||
<view class="bg-fff u-text-center color-999 shili" style="margin-top: 80rpx;">
|
||
<view class="u-absolute bg-fff">错误示例</view>
|
||
</view>
|
||
<view class="u-flex u-row-between u-p-l-40 u-p-r-40 " style="padding-top:60rpx;">
|
||
<view class="">
|
||
<view class="u-flex bg1" style="border-radius:30rpx ;overflow: hidden;">
|
||
<image src="/static/3.png" class="wh140" mode="aspectFill"></image>
|
||
</view>
|
||
<view class="u-m-t-10 u-font-24 u-text-center">面部有遮挡</view>
|
||
<view class="u-flex u-row-center u-m-t-20">
|
||
<view class="kuang u-flex u-row-center bg3">
|
||
<u-icon name="close" size="20" color="#fff"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="">
|
||
<view class="u-flex bg1" style="border-radius:30rpx ;overflow: hidden;">
|
||
<image src="/static/8.png" class="wh140" mode="aspectFill"></image>
|
||
</view>
|
||
<view class="u-m-t-10 u-font-24 u-text-center">头部过小</view>
|
||
<view class="u-flex u-row-center u-m-t-20">
|
||
<view class="kuang u-flex u-row-center bg3">
|
||
<u-icon name="close" size="20" color="#fff"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="">
|
||
<view class="u-flex bg1" style="border-radius:30rpx ;overflow: hidden;">
|
||
<image src="/static/9.png" class="wh140" mode="aspectFill"></image>
|
||
</view>
|
||
<view class="u-m-t-10 u-font-24 u-text-center">多人照片</view>
|
||
<view class="u-flex u-row-center u-m-t-20">
|
||
<view class="kuang u-flex u-row-center bg3">
|
||
<u-icon name="close" size="20" color="#fff"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="">
|
||
<view class="u-flex bg1" style="border-radius:30rpx ;overflow: hidden;">
|
||
<image src="/static/10.png" class="wh140" mode="aspectFill"></image>
|
||
</view>
|
||
<view class="u-m-t-10 u-font-24 u-text-center">Ai生成图</view>
|
||
<view class="u-flex u-row-center u-m-t-20">
|
||
<view class="kuang u-flex u-row-center bg3">
|
||
<u-icon name="close" size="20" color="#fff"></u-icon>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="u-m-t-40 u-font-24 u-flex u-row-center u-p-b-60">
|
||
<view class="color-999">
|
||
如遇问题，请点击
|
||
</view>
|
||
<view class="u-relative">
|
||
<button class="contact" open-type="contact">咨询客服</button>
|
||
<text class="color-000">咨询客服</text>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
</template>
|
||
<u-popup v-model="popshow" mode="bottom" :border-radius="40" :closeable="false">
|
||
<view class="u-p-t-40 color-000">
|
||
<view class="u-p-l-30 u-p-r-30 u-text-center u-font-32">
|
||
AIGC服务协议
|
||
</view>
|
||
<view class=" u-p-l-30 u-p-r-30 u-m-t-40">
|
||
欢迎使用百灵相机，您将上传照片用于AIGC服务，您应当在取得照片权利人的同意后再进行操作，您上传的照片将仅用于制作数字分身，不会用于其他用途，相关规则请您仔细阅读
|
||
<text @click="tofuwu">《用户服务协议》</text> <text @click="toyinsi">《隐私政策》</text>。
|
||
</view>
|
||
<view class="u-m-t-60" style="background-color:rgb(236,236,236) ;height: 2rpx;"></view>
|
||
<view class="u-font-32 u-p-t-30 u-p-b-30 u-text-center" @click="upload1">
|
||
我知道了
|
||
</view>
|
||
</view>
|
||
|
||
</u-popup>
|
||
<template v-if="!isFirst">
|
||
<view class="fixed_b" v-if="successImgs.length||failImgs.length">
|
||
<view class="u-flex-1 u-p-r-16">
|
||
<my-button type="cancel" @click="uploadTwo">补充上传</my-button>
|
||
</view>
|
||
<view class="u-flex-1 u-p-l-16 u-relative ">
|
||
<my-button @click="submit" v-if="!result.payed"> ￥{{peizhi.model_train_price/100}}马上生成</my-button>
|
||
<my-button @click="submit" v-else> 马上生成</my-button>
|
||
<!-- <view class="zhekou u-absolute">
|
||
<text class="" style="">￥{{peizhi.model_train_price/100}}</text><text>限时特惠</text>
|
||
</view> -->
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<my-pop ref="myPop" :closeable="false">
|
||
<view slot="top" class="">
|
||
<u-icon name="close" @click="myPopClose" color="#999"></u-icon>
|
||
</view>
|
||
<view style="margin-top: -20rpx;">
|
||
<view class="u-flex u-row-right">
|
||
<view class="u-flex u-relative">
|
||
<button open-type="contact" class="contact">客服</button>
|
||
<image style="width: 30rpx;height: 30rpx;" src="/static/serve.png" mode=""></image>
|
||
<view class="u-m-l-6">客服</view>
|
||
</view>
|
||
</view>
|
||
<view class="u-flex u-row-center">
|
||
<image style="width: 114rpx;height: 118rpx;" src="/static/success.png" mode=""></image>
|
||
</view>
|
||
<view class="u-text-center font-bold color-000 u-font-32">
|
||
支付成功
|
||
</view>
|
||
</view>
|
||
<view slot="bottom" class="u-m-t-60">
|
||
<view class="u-flex u-row-center">
|
||
<view class="" style="width: 440rpx;">
|
||
<my-button @click="toResult">确定</my-button>
|
||
</view>
|
||
</view>
|
||
<view style="padding: 0 40rpx;" class="u-flex u-row-center u-m-t-20">
|
||
<view class="color-999 u-font-24">制作数字分身需要消耗昂贵的算力资源，一旦付款即进入服务。生成人数较多时可能需要排队制作，还请耐心等待</view>
|
||
</view>
|
||
</view>
|
||
</my-pop>
|
||
<my-pop ref="mypopDel">
|
||
<view>
|
||
<view class="u-font-32 u-p-30 u-text-center">
|
||
确认要删除该训练图吗
|
||
</view>
|
||
<view class="u-flex u-row-center u-m-t-20">
|
||
<view class="u-flex" style="border-radius: 32rpx;overflow: hidden;">
|
||
<image :src="selItem.smallUrl" style="width: 260rpx;height: 280rpx;" mode="aspectFill"></image>
|
||
</view>
|
||
</view>
|
||
<view class="u-flex u-row-between u-m-t-60">
|
||
<view class="u-flex-1 u-p-r-30"><my-button @click="close" type="cancel">取消</my-button></view>
|
||
<view class="u-flex-1 u-p-l-30"><my-button @click="delTu">确定</my-button></view>
|
||
|
||
</view>
|
||
</view>
|
||
|
||
</my-pop>
|
||
<my-pop ref="myPopfangqi">
|
||
<view>
|
||
<view class="u-p-30">
|
||
<view class="u-font-32 font-bold color-000 u-text-center">
|
||
是否放弃制作分身
|
||
</view>
|
||
<view class="u-font-32 u-m-t-10 font-bold color-000 u-text-center">
|
||
此次上传的照片不会保存
|
||
</view>
|
||
</view>
|
||
<view class="u-flex u-row-between u-m-t-60">
|
||
<view class="u-flex-1 u-p-r-30"><my-button @click="closeFangqi" type="cancel">继续制作</my-button></view>
|
||
<view class="u-flex-1 u-p-l-30"><my-button @click="fangqiConfirm">我要放弃</my-button></view>
|
||
</view>
|
||
</view>
|
||
</my-pop>
|
||
<u-toast ref="uToast"></u-toast>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import config from '@/common/config/config.js'
|
||
export default {
|
||
data() {
|
||
return {
|
||
timer: null,
|
||
isPinggu: false,
|
||
isFinish: 0,
|
||
hasSubmit: false,
|
||
successImgs: [],
|
||
failImgs: [],
|
||
peizhi: uni.getStorageSync('config'),
|
||
wating: false,
|
||
nowupload: 0,
|
||
twoArr: [],
|
||
translateX: 200,
|
||
isFirst: true,
|
||
src: '',
|
||
popshow: false,
|
||
result: '',
|
||
id: '',
|
||
max: 20,
|
||
submiting: false,
|
||
selItem: '',
|
||
hasFinished: 0,
|
||
isDaican:false,
|
||
noUploadArr:[]
|
||
};
|
||
},
|
||
watch: {
|
||
hasFinished(newValue, oldValue) {
|
||
if (newValue >= 20) {
|
||
this.isPinggu = true
|
||
// this.pingggu()
|
||
}
|
||
}
|
||
},
|
||
onUnload() {
|
||
this.clear()
|
||
},
|
||
onLoad(opt) {
|
||
console.log(opt);
|
||
this.isDaican=opt.id?true:false
|
||
this.id = opt.id || undefined
|
||
if (this.id) {
|
||
this.$api({
|
||
url: 'model/info/' + this.id
|
||
}).then(res => {
|
||
console.log(res);
|
||
this.result = res.data
|
||
this.src = res.data.mainPhoto || res.data.smallUrl
|
||
res.data.modelPhotos = res.data.modelPhotos || []
|
||
// this.nowupload=res.data.modelPhotos.length-1
|
||
this.hasSubmit = true
|
||
this.hasFinished = res.data.modelPhotos.length
|
||
let index = 0
|
||
for (let i in res.data.modelPhotos) {
|
||
if (res.data.modelPhotos[i].suitable) {
|
||
// this.$set(this.successImgs,index,res.data.modelPhotos[i])
|
||
this.successImgs.push(res.data.modelPhotos[i])
|
||
// this.isHege+=1
|
||
// this.nowupload+=1
|
||
index++
|
||
} else {
|
||
this.failImgs.push(res.data.modelPhotos[i])
|
||
// this.isBuhege+=1
|
||
}
|
||
}
|
||
// if(res.data.modelPhotos.length<this.max){
|
||
// for(let i in res.data.modelPhotos){
|
||
// this.$set(this.twoArr,i,res.data.modelPhotos[i])
|
||
// }
|
||
// }else{
|
||
// let index=0
|
||
// for(let i in res.data.modelPhotos){
|
||
// if(res.data.modelPhotos[i].suitable){
|
||
// this.$set(this.successImgs,index,res.data.modelPhotos[i])
|
||
// index++
|
||
// }else{
|
||
// this.failImgs.push(res.data.modelPhotos[i])
|
||
// }
|
||
// }
|
||
// }
|
||
|
||
})
|
||
}
|
||
|
||
},
|
||
onReady() {
|
||
// this.$refs.myPop.open()
|
||
},
|
||
methods: {
|
||
fangqiConfirm(){
|
||
this.$api({
|
||
url:'model/delete/'+this.result.id||this.id
|
||
}).then(res=>{
|
||
this.$refs.uToast.show({
|
||
title: res.message,
|
||
type: res.code == 200 ? 'success' : 'error'
|
||
})
|
||
if(res.code==200){
|
||
if(this.isDaican){
|
||
uni.navigateBack()
|
||
}else{
|
||
uni.navigateBack({delta:2})
|
||
}
|
||
}
|
||
})
|
||
},
|
||
closeFangqi(){
|
||
this.$refs.myPopfangqi.close()
|
||
},
|
||
showFangqi() {
|
||
if(!this.result){
|
||
uni.navigateBack()
|
||
}else{
|
||
this.$refs.myPopfangqi.open()
|
||
}
|
||
},
|
||
back() {
|
||
uni.navigateBack()
|
||
},
|
||
clear() {
|
||
clearInterval(this.timer)
|
||
this.timer = null
|
||
},
|
||
toResult() {
|
||
this.$u.route({
|
||
url: '/pages/control-fenshen/wating-result',
|
||
params: {
|
||
id: this.result.id,
|
||
isPay: true
|
||
}
|
||
})
|
||
},
|
||
myPopClose(){
|
||
this.$refs.myPop.close()
|
||
},
|
||
close() {
|
||
this.$refs.mypopDel.close()
|
||
},
|
||
delShow(item) {
|
||
this.selItem = item
|
||
this.$refs.mypopDel.open()
|
||
},
|
||
delTu() {
|
||
const index = this.successImgs.findIndex(v => v.id == this.selItem.id)
|
||
this.$api({
|
||
url: 'model/del-photo/' + this.selItem.id
|
||
}).then(res => {
|
||
this.$refs.mypopDel.close()
|
||
this.$refs.uToast.show({
|
||
title: res.message,
|
||
type: res.code == 200 ? 'success' : 'error'
|
||
})
|
||
if (res.code == 200) {
|
||
this.nowupload -= 1
|
||
// this.$set(this.successImgs,index,'')
|
||
this.successImgs.splice(index, 1)
|
||
}
|
||
})
|
||
},
|
||
wxpay(data) {
|
||
const _this = this
|
||
uni.requestPayment({
|
||
provider: 'wxpay',
|
||
timeStamp: '' + data.timeStamp,
|
||
nonceStr: '' + data.nonceStr,
|
||
package: '' + data.packageValue,
|
||
signType: 'MD5',
|
||
paySign: '' + data.paySign,
|
||
success: function(res) {
|
||
// setTimeout(()=>{
|
||
// uni.switchTab({
|
||
// url:'/pages/index/index'
|
||
// })
|
||
// },1000)
|
||
// _this.$refs.uToast.show({
|
||
// title: '支付成功',
|
||
// type: 'success'
|
||
// })
|
||
_this.$refs.myPop.open()
|
||
// this.timer=setTimeout(()=>{
|
||
// uni.navigateTo({
|
||
// url:'/pages/success/success'
|
||
// })
|
||
// })
|
||
|
||
},
|
||
fail: function(err) {
|
||
console.log('fail:' + JSON.stringify(err));
|
||
// uni.showToast({
|
||
// icon: 'error',
|
||
// title: '支付失败'
|
||
// })
|
||
// _this.$refs.myPop.open()
|
||
_this.$refs.uToast.show({
|
||
title: '支付失败',
|
||
type: 'error'
|
||
})
|
||
// setTimeout(()=>{
|
||
// uni.navigateBack()
|
||
// },1000)
|
||
|
||
}
|
||
});
|
||
},
|
||
async submit() {
|
||
// if(this.successImgs.length<this.max){
|
||
// return this.$refs.uToast.show({
|
||
// title:'图片数量过少，请补充上传图片！',
|
||
// type: 'error'
|
||
// })
|
||
// }
|
||
if(this.successImgs.length<10){
|
||
return this.$refs.uToast.show({
|
||
title: '请上传至少10张有效图片',
|
||
})
|
||
}
|
||
const res1 = await this.$api({
|
||
url: "model/evaluation/" + this.result.id
|
||
})
|
||
if (res1.code != 200) {
|
||
return this.$refs.uToast.show({
|
||
title: res1.message,
|
||
type: res1.code == 200 ? 'success' : 'error'
|
||
})
|
||
}
|
||
if (this.result.payed) {
|
||
return this.$u.route({
|
||
url: '/pages/control-fenshen/wating-result',
|
||
params: {
|
||
id: this.result.id,
|
||
isPay: true
|
||
}
|
||
})
|
||
}
|
||
const res = await this.$api({
|
||
url: "trade/buy-model/" + this.result.id
|
||
})
|
||
if (res.code == 200) {
|
||
this.wxpay(res.data)
|
||
} else {
|
||
this.$refs.uToast.show({
|
||
title: res.message,
|
||
type: 'error'
|
||
})
|
||
}
|
||
},
|
||
pingggu() {
|
||
if (this.submiting) {
|
||
return
|
||
}
|
||
if (this.twoArr.length < 20) {
|
||
return this.$refs.uToast.show({
|
||
title: '请补充上传够20张图片！',
|
||
type: 'error'
|
||
})
|
||
}
|
||
this.successImgs = []
|
||
this.failImgs = []
|
||
this.isPinggu = true
|
||
for (let i in this.twoArr) {
|
||
if (this.twoArr[i].suitable) {
|
||
this.successImgs.push(this.twoArr[i])
|
||
} else {
|
||
this.failImgs.push(this.twoArr[i])
|
||
}
|
||
}
|
||
console.log(this.successImgs);
|
||
console.log(this.failImgs);
|
||
this.isPinggu = false
|
||
this.hasSubmit = true;
|
||
|
||
},
|
||
tofuwu() {
|
||
this.toFuwu()
|
||
},
|
||
toyinsi() {
|
||
this.toYinsi()
|
||
},
|
||
changeKey(key, val) {
|
||
if (this.result && this.result.mainPhoto) {
|
||
this[key] = val
|
||
this.translateX = val ? 200 : -200
|
||
}
|
||
|
||
},
|
||
upload() {
|
||
if (this.submiting) {
|
||
return
|
||
// return this.$refs.uToast.show({
|
||
// title: '上传中，请等待！',
|
||
// type: 'error'
|
||
// })
|
||
}
|
||
this.popshow = true
|
||
},
|
||
noPingguUpload() {
|
||
if (this.submiting) {
|
||
return
|
||
}
|
||
if (this.twoArr.length >= this.max) {
|
||
return
|
||
}
|
||
this.popshow = false
|
||
this.submiting = true
|
||
const _this = this
|
||
const token = uni.getStorageSync('token') || ''
|
||
let shengyu = _this.max - _this.hasFinished
|
||
uni.chooseImage({
|
||
count: shengyu, //图片可选择数量
|
||
sizeType: ['original', 'compressed'], //original 原图，compressed 压缩图，默认二者都有
|
||
sourceType: ['album','camera'], //album 从相册选图，camera 使用相机，默认二者都有。
|
||
fail: res => {
|
||
_this.submiting = false
|
||
console.log('fail');
|
||
},
|
||
success: res => {
|
||
uni.showLoading({
|
||
title: '上传中'
|
||
})
|
||
for (let i = 0; i < res.tempFilePaths.length; i++) {
|
||
if (_this.twoArr.length < _this.max) {
|
||
_this.twoArr.push({
|
||
smallUrl: res.tempFilePaths[i]
|
||
})
|
||
}
|
||
}
|
||
let isFinish = 0
|
||
console.log(shengyu);
|
||
const arr1 = res.tempFilePaths.slice(0, shengyu)
|
||
console.log(arr1);
|
||
for (let i in arr1) {
|
||
uni.uploadFile({
|
||
url: config.baseApi + 'model/supplement/' + _this.result.id,
|
||
method: 'POST',
|
||
filePath: res.tempFilePaths[i],
|
||
name: 'file',
|
||
header: {
|
||
'Authorization': token
|
||
},
|
||
success: (response) => {
|
||
console.log(response);
|
||
if (response.statusCode !== 200) {
|
||
const Index = this.twoArr.findIndex(v => v.smallUrl == res.tempFilePaths[i])
|
||
if (Index != -1) {
|
||
_this.twoArr.splice(Index, 1)
|
||
}
|
||
uni.hideLoading()
|
||
return _this.$refs.uToast.show({
|
||
title: '上传失败',
|
||
type: 'error'
|
||
})
|
||
}
|
||
console.log(res.tempFilePaths[0]);
|
||
const data = JSON.parse(response.data)
|
||
if (data.code == 200) {
|
||
isFinish += 1
|
||
_this.hasFinished += 1
|
||
const Index = _this.twoArr.findIndex(v => v
|
||
.smallUrl == res.tempFilePaths[i])
|
||
if (Index != -1) {
|
||
_this.twoArr[Index] = {
|
||
smallUrl: res.tempFilePaths[i],
|
||
...data.data
|
||
}
|
||
// _this.$set(_this.twoArr, Index, {
|
||
// smallUrl: res.tempFilePaths[i],
|
||
// ...data.data
|
||
// })
|
||
}
|
||
} else {
|
||
const Index = this.twoArr.findIndex(v => v.smallUrl == res.tempFilePaths[i])
|
||
if (Index != -1) {
|
||
_this.twoArr.splice(Index, 1)
|
||
}
|
||
// _this.$set(_this.failImgs,_this.isBuhege,{smallUrl:res.tempFilePaths[i],...data.data})
|
||
}
|
||
if (isFinish == res.tempFilePaths.length) {
|
||
_this.submiting = false
|
||
uni.hideLoading()
|
||
this.$refs.uToast.show({
|
||
title: '上传成功',
|
||
type: 'success'
|
||
})
|
||
}
|
||
|
||
}
|
||
})
|
||
}
|
||
|
||
}
|
||
})
|
||
},
|
||
uploadTwo() {
|
||
if(this.successImgs.length >= this.max){
|
||
return this.$refs.uToast.show({
|
||
title: '图片上传已满',
|
||
type: 'success'
|
||
})
|
||
}
|
||
if (this.submiting) {
|
||
return
|
||
}
|
||
if (this.hasSubmit && this.successImgs.length >= this.max) {
|
||
return
|
||
}
|
||
|
||
this.popshow = false
|
||
this.submiting = true
|
||
const _this = this
|
||
const token = uni.getStorageSync('token') || ''
|
||
const shen = _this.max - _this.successImgs.length
|
||
uni.chooseImage({
|
||
count: shen, //图片可选择数量
|
||
sizeType: ['original', 'compressed'], //original 原图，compressed 压缩图，默认二者都有
|
||
sourceType: ['album'], //album 从相册选图，camera 使用相机，默认二者都有。
|
||
fail: res => {
|
||
_this.submiting = false
|
||
console.log('fail');
|
||
},
|
||
complete: res => {
|
||
console.log(res);
|
||
console.log('complete');
|
||
},
|
||
success: res => {
|
||
uni.showLoading({
|
||
title: '上传中'
|
||
})
|
||
let isFinish = 0
|
||
// if (!_this.hasSubmit) {
|
||
// for (let i = 0; i < res.tempFilePaths.length; i++) {
|
||
// if (_this.twoArr.length < _this.max) {
|
||
// _this.twoArr.push({
|
||
// smallUrl: res.tempFilePaths[i]
|
||
// })
|
||
// }
|
||
// }
|
||
// } else {
|
||
// for (let i = 0; i < res.tempFilePaths.length; i++) {
|
||
// if (_this.successImgs.length < _this.max) {
|
||
// _this.successImgs.push({
|
||
// smallUrl: res.tempFilePaths[i]
|
||
// })
|
||
// }
|
||
// }
|
||
// }
|
||
for (let i = 0; i < res.tempFilePaths.length; i++) {
|
||
if (_this.successImgs.length < _this.max) {
|
||
_this.successImgs.push({
|
||
smallUrl: res.tempFilePaths[i]
|
||
})
|
||
}
|
||
}
|
||
|
||
// _this.$set(_this.twoArr,_this.nowupload+1,{smallUrl:res.tempFilePaths[0]})
|
||
// _this.nowupload+=1
|
||
const arr = res.tempFilePaths.slice(0, shen)
|
||
console.log(shen);
|
||
console.log(arr);
|
||
for (let i in arr) {
|
||
uni.uploadFile({
|
||
url: config.baseApi + 'model/supplement/' + (_this.result ? _this.result.id : _this.id),
|
||
method: 'POST',
|
||
filePath: res.tempFilePaths[i],
|
||
name: 'file',
|
||
header: {
|
||
'Authorization': token
|
||
},
|
||
fail(res) {
|
||
},
|
||
success: (response) => {
|
||
isFinish += 1
|
||
_this.submiting = false
|
||
if (isFinish == res.tempFilePaths.length) {
|
||
uni.hideLoading()
|
||
this.$refs.uToast.show({
|
||
title: '上传完毕',
|
||
type: 'success'
|
||
})
|
||
}
|
||
if (response.statusCode !== 200) {
|
||
const Index = _this.successImgs.findIndex(v => v
|
||
.smallUrl == res.tempFilePaths[i])
|
||
if (Index != -1) {
|
||
_this.successImgs.splice(Index, 1)
|
||
_this.noUploadArr.push({smallUrl:res.tempFilePaths[i]})
|
||
}
|
||
return
|
||
}
|
||
const data = JSON.parse(response.data)
|
||
const Index = _this.successImgs.findIndex(v => v.smallUrl == res.tempFilePaths[i])
|
||
if (data.code == 200) {
|
||
console.log(data.data);
|
||
_this.hasSubmit = true
|
||
if (data.data.suitable) {
|
||
if (Index != -1) {
|
||
// _this.successImgs[Index] = {
|
||
// smallUrl: res.tempFilePaths[i],
|
||
// ...data.data
|
||
// }
|
||
_this.$set(_this.successImgs,Index,{smallUrl:res.tempFilePaths[i],...data.data})
|
||
// _this.successImgs.push({
|
||
// smallUrl: res.tempFilePaths[i],
|
||
// ...data.data
|
||
// })
|
||
console.log(_this.successImgs);
|
||
}
|
||
} else {
|
||
if (Index != -1) {
|
||
_this.successImgs.splice(Index, 1)
|
||
}
|
||
_this.failImgs.push({
|
||
smallUrl: res.tempFilePaths[i],
|
||
...data.data
|
||
})
|
||
}
|
||
|
||
} else {
|
||
if (Index != -1) {
|
||
_this.successImgs.splice(Index, 1)
|
||
}
|
||
_this.failImgs.push({
|
||
smallUrl: res.tempFilePaths[i],
|
||
...data.data
|
||
})
|
||
// _this.$set(_this.failImgs,_this.isBuhege,{smallUrl:res.tempFilePaths[i],...data.data})
|
||
}
|
||
|
||
|
||
}
|
||
})
|
||
}
|
||
|
||
}
|
||
})
|
||
},
|
||
upload1(index) {
|
||
if (this.submiting) {
|
||
return
|
||
// return this.$refs.uToast.show({
|
||
// title: '上传中，请等待！',
|
||
// type: 'error'
|
||
// })
|
||
}
|
||
|
||
this.popshow = false
|
||
this.submiting = true
|
||
const _this = this
|
||
const token = uni.getStorageSync('token') || ''
|
||
uni.chooseImage({
|
||
count: 1, //图片可选择数量
|
||
sizeType: ['original', 'compressed'], //original 原图，compressed 压缩图，默认二者都有
|
||
sourceType: ['album','camera'], //album 从相册选图，camera 使用相机，默认二者都有。
|
||
crop: { //是否进行裁剪，此配置一般用于头像上传时裁剪成正方形等
|
||
width: 100,
|
||
height: 100
|
||
},
|
||
fail(res) {
|
||
_this.submiting = false
|
||
uni.hideLoading()
|
||
},
|
||
success: res => {
|
||
uni.showLoading({
|
||
title: '上传中'
|
||
})
|
||
_this.src = res.tempFilePaths[0]
|
||
// uni.showLoading({
|
||
// title:'图片上传中'
|
||
// })
|
||
uni.uploadFile({
|
||
url: config.baseUrl + (_this.result ? ('model/update-main-photo/' + (_this.result ? _this.result
|
||
.id : _this.id)) : 'model/init-model'),
|
||
method: 'POST',
|
||
filePath: res.tempFilePaths[0],
|
||
name: 'file',
|
||
header: {
|
||
'Authorization': token
|
||
},
|
||
success: (response) => {
|
||
this.submiting = false
|
||
console.log(response);
|
||
uni.hideLoading()
|
||
if (response.statusCode == 413) {
|
||
_this.isfinish=true
|
||
_this.src=_this.result.mainPhoto
|
||
return _this.$refs.uToast.show({
|
||
title: '图片超出大小限制',
|
||
type: 'error'
|
||
})
|
||
}
|
||
if (response.statusCode !== 200) {
|
||
_this.src=_this.result.mainPhoto
|
||
return _this.$refs.uToast.show({
|
||
title: '上传失败',
|
||
type: 'error'
|
||
})
|
||
}
|
||
console.log(res.tempFilePaths[0]);
|
||
const data = JSON.parse(response.data)
|
||
_this.$refs.uToast.show({
|
||
title: data.message,
|
||
type: data.code == 200 ? 'success' : 'error'
|
||
})
|
||
if (data.code == 200) {
|
||
if(typeof data.data=='string'){
|
||
_this.$set(_this.result, 'mainPhoto', data.data)
|
||
}else{
|
||
_this.result = data.data
|
||
}
|
||
_this.translateX = -200
|
||
_this.isFirst = false
|
||
// uni.pageScrollTo({
|
||
// scrollTop: 80,
|
||
// duration: 0,
|
||
// })
|
||
}else{
|
||
_this.src=_this.result.mainPhoto
|
||
_this.$refs.uToast.show({
|
||
title: data.message,
|
||
})
|
||
}
|
||
}
|
||
})
|
||
}
|
||
})
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.zhekou {
|
||
top: -20rpx;
|
||
right: 6rpx;
|
||
z-index: 10;
|
||
color: #fff;
|
||
padding: 0 20rpx;
|
||
border-radius: 50rpx 50rpx 0 50rpx;
|
||
font-size: 20rpx;
|
||
line-height: 40rpx;
|
||
background-color: rgb(255, 64, 28);
|
||
}
|
||
|
||
.fixed_b {
|
||
padding: 0;
|
||
left: 60rpx;
|
||
right: 60rpx;
|
||
bottom: 40rpx;
|
||
display: flex;
|
||
background-color: transparent;
|
||
z-index: 888;
|
||
}
|
||
|
||
.box1 {
|
||
overflow: hidden;
|
||
background-color: rgb(244, 244, 244);
|
||
border-radius: 20rpx;
|
||
width: 128rpx;
|
||
height: 140rpx;
|
||
margin-bottom: 10rpx;
|
||
|
||
image {
|
||
width: 130rpx;
|
||
height: 140rpx;
|
||
}
|
||
}
|
||
|
||
.donghua1 {
|
||
transition: all .3s linear;
|
||
}
|
||
|
||
.bg1 {
|
||
background-color: rgb(232, 200, 113);
|
||
}
|
||
|
||
.wh140 {
|
||
width: 140rpx;
|
||
height: 148rpx;
|
||
margin-bottom: -8rpx;
|
||
}
|
||
|
||
.upload {
|
||
width: 590rpx;
|
||
height: 590rpx;
|
||
border-radius: 40rpx;
|
||
background-color: rgb(244, 244, 244);
|
||
overflow: hidden;
|
||
|
||
image {
|
||
width: 590rpx;
|
||
height: 590rpx;
|
||
}
|
||
}
|
||
|
||
/deep/ .u-border-bottom::after {
|
||
border: none;
|
||
}
|
||
|
||
.u-font-48 {
|
||
font-size: 100rpx;
|
||
}
|
||
|
||
.wh200 {
|
||
width: 200rpx;
|
||
height: 200rpx;
|
||
}
|
||
|
||
.first::after {
|
||
position: absolute;
|
||
content: '';
|
||
display: block;
|
||
right: 0;
|
||
bottom: 20rpx;
|
||
width: 30rpx;
|
||
height: 30rpx;
|
||
border-radius: 50%;
|
||
background-color: $my-main-color;
|
||
opacity: .7;
|
||
}
|
||
|
||
.two {
|
||
color: #999;
|
||
}
|
||
|
||
.first {
|
||
transform: scaleX(1.2);
|
||
position: relative;
|
||
text-stroke: 2px #333;
|
||
/* 兼容Webkit(Chrome/Safari)内核浏览器的写法 */
|
||
-webkit-text-stroke: 2px #333;
|
||
}
|
||
|
||
.shili {
|
||
position: relative;
|
||
|
||
view {
|
||
position: absolute;
|
||
left: 50%;
|
||
top: 50%;
|
||
transform: translateX(-50%) translateY(-50%);
|
||
padding: 0 30rpx;
|
||
background-color: #fff;
|
||
z-index: 20;
|
||
}
|
||
}
|
||
|
||
.shili::after {
|
||
content: '';
|
||
display: block;
|
||
position: absolute;
|
||
left: 40rpx;
|
||
right: 40rpx;
|
||
height: 2px;
|
||
top: 50%;
|
||
margin-top: -1px;
|
||
background-color: rgb(232, 232, 232);
|
||
}
|
||
|
||
.bg2 {
|
||
background-color: rgb(251, 186, 4);
|
||
}
|
||
|
||
.bg3 {
|
||
background-color: rgb(33, 33, 33);
|
||
}
|
||
|
||
.kuang {
|
||
border: 2px solid #333;
|
||
border-radius: 10rpx;
|
||
width: 36rpx;
|
||
height: 36rpx;
|
||
}
|
||
</style> |