Commit edd6a505 authored by tao.huang's avatar tao.huang

feat: 新增webview

parent b97e902b
export const PRIVACY_URL = "https://secret.feihe.com/secret.html";
export const MEMBER_URL = "https://secret.feihe.com/index.html";
......@@ -38,7 +38,7 @@
</picker-view-column>
<picker-view-column>
<view v-for="(item, idx) in days" :key="idx" class="picker-layer-item">
{{ item }}
{{ item === '请选择' ? item : `${item}日` }}
</view>
</picker-view-column>
</template>
......@@ -103,7 +103,7 @@ const days = computed(() => {
const year = years.value[yearIdx] || years.value[0];
const month = months.value[monthIdx] || months.value[0];
const dayCount = new Date(year, month, 0).getDate();
const arr = [];
const arr = ['请选择'];
for (let i = 1; i <= dayCount; i++) {
arr.push(i);
}
......@@ -158,6 +158,12 @@ function confirm() {
close();
if (props.mode === 'date') {
const [yIdx, mIdx, dIdx] = pickerValue.value;
if(dIdx === 0) {
props.onPickerChange('');
return;
}
const year = years.value[yIdx];
const month = months.value[mIdx];
const day = days.value[dIdx];
......
......@@ -17,7 +17,16 @@
:onLayerVisibleChange="onLayerVisibleChange"
>
<view class="register-baby-info-picker">
<view class="register-baby-info-picker-value">{{ dateDisplay || '请选择宝宝的生日或预产期' }}</view>
<view
class="register-baby-info-picker-value"
:style="dateDisplay ? 'color: #1d1e25;' : ''"
>{{ dateDisplay || "请选择宝宝的生日或预产期" }}</view
>
<image
class="register-baby-info-picker-arrow"
:src="$baseUrl + 'registerLayer/icon_arrow_yellow.png'"
mode="aspectFit"
/>
</view>
</PickerCustom>
<PickerCustom
......@@ -28,7 +37,16 @@
:onLayerVisibleChange="onLayerVisibleChange"
>
<view class="register-baby-info-picker">
<view class="register-baby-info-picker-value">{{ genderDisplay || '请选择宝宝的性别' }}</view>
<view
class="register-baby-info-picker-value"
:style="genderDisplay ? 'color: #1d1e25;' : ''"
>{{ genderDisplay || "请选择宝宝的性别" }}</view
>
<image
class="register-baby-info-picker-arrow"
:src="$baseUrl + 'registerLayer/icon_arrow_yellow.png'"
mode="aspectFit"
/>
</view>
</PickerCustom>
<PickerCustom
......@@ -39,22 +57,59 @@
:onLayerVisibleChange="onLayerVisibleChange"
>
<view class="register-baby-info-picker">
<view class="register-baby-info-picker-value">{{ fetusDisplay || '请选择胎数' }}</view>
<view
class="register-baby-info-picker-value"
:style="fetusDisplay ? 'color: #1d1e25;' : ''"
>{{ fetusDisplay || "请选择胎数" }}</view
>
<image
class="register-baby-info-picker-arrow"
:src="$baseUrl + 'registerLayer/icon_arrow_yellow.png'"
mode="aspectFit"
/>
</view>
</PickerCustom>
<view class="register-baby-info-agreement">
<text>
我已阅读并同意
<text class="register-baby-info-link" @click="openAgreement"
>《星妈会敏感个人信息处理规则》</text
>
</text>
<image
class="register-baby-info-agreement-icon"
:src="$baseUrl + 'registerLayer/privacy_agree.png'"
mode="aspectFit"
/>
<image
class="register-baby-info-userInfo-icon"
:src="$baseUrl + 'registerLayer/user_agree.png'"
mode="aspectFit"
/>
<image
v-if="!checked.option1"
class="register-baby-info-agreement-checkbox checkbox-checked1"
:src="$baseUrl + 'registerLayer/circle_no.png'"
mode="aspectFit"
@click="checked.option1 = !checked.option1"
/>
<image
v-else
class="register-baby-info-agreement-checkbox checkbox-checked1"
:src="$baseUrl + 'registerLayer/circle_yes.png'"
mode="aspectFit"
@click="checked.option1 = !checked.option1"
/>
<image
v-if="!checked.option2"
class="register-baby-info-agreement-checkbox checkbox-checked2"
:src="$baseUrl + 'registerLayer/circle_no.png'"
mode="aspectFit"
@click="checked.option2 = !checked.option2"
/>
<image
v-else
class="register-baby-info-agreement-checkbox checkbox-checked2"
:src="$baseUrl + 'registerLayer/circle_yes.png'"
mode="aspectFit"
@click="checked.option2 = !checked.option2"
/>
</view>
<view
class="register-baby-info-btn"
:disabled="!checked"
@click="handleBabyInfoConfirm"
>
<view class="register-baby-info-btn" @click="handleBabyInfoConfirm">
完成
</view>
</view>
......@@ -92,15 +147,6 @@ watch(
(val) => (imageUrl.value = val)
);
function chooseImage() {
uni.chooseImage({
count: 1,
success: (res) => {
imageUrl.value = res.tempFilePaths[0];
emit("update:value", imageUrl.value);
},
});
}
function removeImage() {
imageUrl.value = "";
emit("update:value", "");
......@@ -114,11 +160,15 @@ function handleCancel() {
visible.value = false;
}
const checked = ref({
option1: false,
option2: false,
});
// 宝宝信息相关
const date = ref("");
const gender = ref("");
const fetus = ref("");
const checked = ref(false);
const genderOptions = ["男", "女", "保密"];
const fetusOptions = ["单胎", "多胎"];
......@@ -131,14 +181,14 @@ function onDateChange(val) {
date.value = val;
}
// gender picker
const genderIndex = ref(-1);
const genderIndex = ref(0);
const genderDisplay = computed(() => gender.value);
function onGenderChange(idx) {
genderIndex.value = idx;
gender.value = genderOptions[idx];
}
// fetus picker
const fetusIndex = ref(-1);
const fetusIndex = ref(0);
const fetusDisplay = computed(() => fetus.value);
function onFetusChange(idx) {
fetusIndex.value = idx;
......@@ -147,9 +197,42 @@ function onFetusChange(idx) {
function onLayerVisibleChange() {}
function handleBabyInfoConfirm() {
if (!checked.value) return;
if (!checked.value.option1 || !checked.value.option2) {
uni.showToast({
title: "请先阅读并同意协议",
icon: "none",
});
return;
}
console.log(date.value, gender.value, fetus.value);
if(!date.value) {
uni.showToast({
title: "请选择宝宝的生日或预产期",
icon: "none",
});
return;
}
if(!gender.value) {
uni.showToast({
title: "请选择宝宝的性别",
icon: "none",
});
return;
}
if(!fetus.value) {
uni.showToast({
title: "请选择胎数",
icon: "none",
});
return;
}
emit("confirm", {
imageUrl: imageUrl.value,
date: date.value,
gender: gender.value,
fetus: fetus.value,
......@@ -164,8 +247,8 @@ function openAgreement() {
<style lang="less" scoped>
.register-baby-info-content {
margin: 0 0 0 0;
padding: 48rpx 32rpx 0 32rpx;
margin: 0;
padding: 20rpx 32rpx 0 32rpx;
background: #f8fafc;
border-radius: 40rpx 40rpx 0 0;
display: flex;
......@@ -197,10 +280,11 @@ function openAgreement() {
box-sizing: border-box;
display: flex;
align-items: center;
box-shadow: 0 4rpx 24rpx 0 rgba(211,163,88,0.04);
box-shadow: 0 4rpx 24rpx 0 rgba(211, 163, 88, 0.04);
border: none;
margin-left: auto;
margin-right: auto;
position: relative;
}
.register-baby-info-picker-value {
font-size: 32rpx;
......@@ -208,6 +292,15 @@ function openAgreement() {
flex: 1;
text-align: center;
}
.register-baby-info-picker-arrow {
position: absolute;
right: 49rpx;
top: 50%;
transform: translateY(-50%);
width: 20rpx;
height: 12rpx;
}
.register-baby-info-agreement {
display: flex;
align-items: flex-start;
......@@ -215,7 +308,44 @@ function openAgreement() {
color: #888;
margin: 24rpx 0 32rpx 0;
width: 100%;
line-height: 1.7;
position: relative;
height: 109rpx;
.register-baby-info-agreement-icon {
width: 574rpx;
height: 55rpx;
display: block;
position: absolute;
top: 0;
left: 48rpx;
}
.register-baby-info-userInfo-icon {
width: 515rpx;
height: 23rpx;
display: block;
position: absolute;
bottom: 0rpx;
left: 48rpx;
}
.register-baby-info-agreement-checkbox {
width: 32rpx;
height: 32rpx;
display: block;
position: absolute;
top: 0;
left: 0;
}
.checkbox-checked1 {
left: 0rpx;
top: -2rpx;
}
.checkbox-checked2 {
left: 0;
top: 82rpx;
}
}
.register-baby-info-link {
color: #d3a358;
......@@ -229,9 +359,9 @@ function openAgreement() {
border-radius: 46rpx;
font-size: 36rpx;
padding: 24rpx 0;
margin-bottom: 32rpx;
margin-bottom: 46rpx;
border: none;
box-shadow: 0 8rpx 32rpx 0 rgba(211,163,88,0.10);
box-shadow: 0 8rpx 32rpx 0 rgba(211, 163, 88, 0.1);
display: flex;
align-items: center;
justify-content: center;
......
......@@ -2,7 +2,7 @@ import App from "./App";
import apiRequest from "@/api/request.js";
import * as Pinia from 'pinia';
const BASE_URL = 'https://yun.duiba.com.cn/fh/';
const BASE_URL = 'https://duiba.oss-cn-hangzhou.aliyuncs.com/fh/';
// #ifndef VUE3
import Vue from "vue";
......
......@@ -11,6 +11,12 @@
"style": {
"navigationBarTitleText": ""
}
},
{
"path": "pages/webview/webview",
"style": {
"navigationBarTitleText": ""
}
}
],
"globalStyle": {
......
<template>
<web-view :src="src" />
</template>
<script setup>
import { ref } from "vue";
import { onLoad } from "@dcloudio/uni-app";
import * as CFG from "@/cfg";
const src = ref("");
onLoad((options) => {
const type = options.type || "PRIVACY";
const url = CFG[type];
src.value = url;
});
</script>
\ No newline at end of file
......@@ -11,8 +11,8 @@
/>
</view>
<!-- 用户信息区域 -->
<view class="user-info">
<view class="user-header" @click="handleRegister">
<view class="user-info" @click="handleRegister">
<view class="user-header">
<view class="avatar-container">
<image class="avatar" :src="userInfo.avatar" mode="aspectFill" />
</view>
......@@ -77,7 +77,7 @@
<RegisterLayer
v-model="showRegisterLayer"
:value="registerImageUrl"
@update:value="val => registerImageUrl = val"
@update:value="(val) => (registerImageUrl = val)"
@confirm="onRegisterConfirm"
/>
</view>
......@@ -103,27 +103,27 @@ const babyDetail = ref([
const toolList = ref([
{
icon: $baseUrl + 'my/code.png',
icon: $baseUrl + "my/code.png",
title: "扫码积分",
url: "",
},
{
icon: $baseUrl + 'my/suyuan.png',
icon: $baseUrl + "my/suyuan.png",
title: "产品溯源",
url: "",
},
{
icon: $baseUrl + 'my/book.png',
icon: $baseUrl + "my/book.png",
title: "奶娃宝典",
url: "",
},
{
icon: $baseUrl + 'my/doctor.png',
icon: $baseUrl + "my/doctor.png",
title: "医生问诊",
url: "",
},
{
icon: $baseUrl + 'my/literature.png',
icon: $baseUrl + "my/literature.png",
title: "育儿百科",
url: "",
},
......@@ -141,9 +141,9 @@ const handleHot = (e) => {
console.log("handleHot", type);
if (type === "member") {
// navigateTo("/pages/my/member");
navigateTo("/pages/webview/webview?type=MEMBER_URL");
} else if (type === "privacy") {
// navigateTo("/pages/my/privacy");
navigateTo("/pages/webview/webview?type=PRIVACY_URL");
}
};
......@@ -164,6 +164,9 @@ const navigateTo = (url) => {
// 编辑个人资料
const handleEditProfile = () => {
if (!userInfo.value || JSON.stringify(userInfo.value) === "{}") {
return;
}
navigateTo("/pages/person/person");
};
......@@ -172,12 +175,12 @@ const handleRegister = () => {
if (!userInfo.value || JSON.stringify(userInfo.value) === "{}") {
showRegisterLayer.value = true;
}
return;
};
function onRegisterConfirm(imgUrl) {
// 这里可以处理图片上传后的逻辑
userInfo.value.avatar = imgUrl;
function onRegisterConfirm(data) {
console.log("onRegisterConfirm:", data);
showRegisterLayer.value = false;
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment