Skip to content

飞
飞鹤小程序
Commit bda7f085 authored by 张九刚's avatar 张九刚
Browse files
Options

feat: 更新页面组件，优化样式和资源路径，添加全局基础URL

parent 8e379ceb
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 2659 additions and 897 deletions
App.vue
View file @ bda7f085
......@@ -12,7 +12,7 @@ export default {
};
</script>
<style lang="less">
<style lang="less">
@import '/wxcomponents/vant/common/index.wxss';
/*每个页面公共css */
::-webkit-scrollbar {
......@@ -21,4 +21,16 @@ export default {
height: 0;
color: transparent;
}
::-ms-scrollbar {
display: none;
width: 0;
height: 0;
color: transparent;
}
::-moz-scrollbar {
display: none;
width: 0;
height: 0;
color: transparent;
}
</style>
cfg.js 0 → 100644
View file @ bda7f085
export const PRIVACY_URL = "https://secret.feihe.com/secret.html";
export const MEMBER_URL = "https://secret.feihe.com/index.html";
components/Layer.vue 0 → 100644
View file @ bda7f085
<template>
<view class="Layer-custom">
<!-- 遮罩层 -->
<view v-if="visible" class="layer-mask" @click="onMaskClick"></view>
<!-- 底部弹出层 -->
<view v-if="visible" class="layer-popup">
<view class="layer-panel">
<!-- 头部插槽或默认头部 -->
<slot name="header">
<view class="layer-header" v-if="!customHeader">
<text v-if="showCancel" @click="onCancel" class="layer-cancel"
>取消</text
>
<text v-if="title" class="layer-title">{{ title }}</text>
<text v-if="showConfirm" @click="onConfirm" class="layer-confirm"
>确定</text
>
</view>
</slot>
<!-- 内容插槽 -->
<view class="layer-content">
<slot></slot>
</view>
<!-- 底部插槽 -->
<slot name="footer"></slot>
</view>
</view>
</view>
</template>
<script setup>
import { ref, watch, defineEmits, defineProps } from "vue";
const props = defineProps({
modelValue: { type: Boolean, default: false },
title: { type: String, default: "" },
showCancel: { type: Boolean, default: true },
showConfirm: { type: Boolean, default: true },
maskClosable: { type: Boolean, default: true },
customHeader: { type: Boolean, default: false },
});
const emit = defineEmits([
"update:modelValue",
"confirm",
"cancel",
"open",
"close",
]);
const visible = ref(props.modelValue);
watch(
() => props.modelValue,
(val) => {
visible.value = val;
if (val) emit("open");
else emit("close");
}
);
function open() {
visible.value = true;
emit("update:modelValue", true);
emit("open");
}
function close() {
visible.value = false;
emit("update:modelValue", false);
emit("close");
}
function onConfirm() {
emit("confirm");
close();
}
function onCancel() {
emit("cancel");
close();
}
function onMaskClick() {
if (props.maskClosable) {
onCancel();
}
}
defineExpose({ open, close });
</script>
<style lang="less" scoped>
.layer-mask {
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 3999;
}
.layer-popup {
position: fixed;
left: 0;
right: 0;
bottom: 0;
z-index: 4000;
display: flex;
flex-direction: column;
align-items: center;
animation: layer-up 0.3s;
}
@keyframes layer-up {
from {
transform: translateY(100%);
}
to {
transform: translateY(0);
}
}
.layer-panel {
width: 100vw;
min-height: 20vh;
background: #f6f8fa;
border-top-left-radius: 48rpx;
border-top-right-radius: 48rpx;
overflow: hidden;
display: flex;
flex-direction: column;
}
.layer-header {
display: flex;
justify-content: space-between;
align-items: center;
height: 140rpx;
box-sizing: border-box;
background: #f6f8fa;
padding: 0 32rpx;
.layer-cancel {
color: #6f6d67;
font-size: 28rpx;
width: 136rpx;
height: 74rpx;
border-radius: 20rpx;
background: #ffffff;
display: flex;
align-items: center;
justify-content: center;
}
.layer-confirm {
color: #ffffff;
font-size: 28rpx;
width: 136rpx;
height: 74rpx;
border-radius: 20rpx;
background: #d3a358;
display: flex;
align-items: center;
justify-content: center;
}
.layer-title {
color: #222;
font-size: 32rpx;
font-weight: bold;
flex: 1;
text-align: center;
}
}
.layer-content {
flex: 1;
padding: 32rpx;
box-sizing: border-box;
}
</style>
\ No newline at end of file
components/PickerCustom.vue 0 → 100644
View file @ bda7f085
<template>
<view class="picker-custom">
<!-- 插槽内容，点击触发弹层 -->
<view @click="open">
<slot></slot>
</view>
<!-- 遮罩层 -->
<view v-if="show" class="picker-layer-mask" @click="close"></view>
<!-- 底部弹出层 -->
<view v-if="show" class="picker-layer-popup">
<view class="picker-layer-panel">
<!-- 可自定义头部 -->
<view class="picker-layer-header">
<text @click="close" class="picker-layer-cancel">取消</text>
<text @click="confirm" class="picker-layer-confirm">确定</text>
</view>
<view class="picker-layer-view-mask-top"></view>
<view class="picker-layer-view-mask-bottom"></view>
<!-- 多列picker-view -->
<picker-view
class="picker-layer-view"
mask-style="background: rgb(246, 248, 250); z-index: 0;"
indicator-style="border-radius: 10px; height: 50px;background:#ffffff; z-index:0"
:value="pickerValue"
@change="onChange"
>
<template v-if="mode === 'date'">
<picker-view-column>
<view v-for="(item, idx) in years" :key="idx" class="picker-layer-item">
{{ item }}年
</view>
</picker-view-column>
<picker-view-column>
<view v-for="(item, idx) in months" :key="idx" class="picker-layer-item">
{{ item }}月
</view>
</picker-view-column>
<picker-view-column>
<view v-for="(item, idx) in days" :key="idx" class="picker-layer-item">
{{ item === '请选择' ? item : `${item}日` }}
</view>
</picker-view-column>
</template>
<template v-else>
<picker-view-column v-for="(col, colIdx) in columns" :key="colIdx">
<view v-for="(item, idx) in col" :key="idx" class="picker-layer-item">
{{ item }}
</view>
</picker-view-column>
</template>
</picker-view>
</view>
</view>
</view>
</template>
<script setup>
import { ref, computed, watch } from "vue";
const props = defineProps({
mode: {
type: String,
default: 'custom', // 'date' | 'custom'
},
range: {
type: Array,
default: () => [],
},
value: {
type: [Number, Array],
default: 0,
},
onPickerChange: {
type: Function,
default: () => {},
},
onLayerVisibleChange: {
type: Function,
default: () => {},
},
});
const show = ref(false);
// date模式相关
const currentYear = new Date().getFullYear();
const years = computed(() => {
const arr = [];
for (let i = 1970; i <= currentYear; i++) {
arr.push(i);
}
return arr;
});
const months = computed(() => {
const arr = [];
for (let i = 1; i <= 12; i++) {
arr.push(i);
}
return arr;
});
const days = computed(() => {
const [yearIdx, monthIdx] = pickerValue.value;
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 = ['请选择'];
for (let i = 1; i <= dayCount; i++) {
arr.push(i);
}
return arr;
});
// custom模式相关
const columns = computed(() => {
if (Array.isArray(props.range[0])) {
return props.range;
} else {
return [props.range];
}
});
const defaultValue = computed(() => {
if (props.mode === 'date') {
// 默认选中今年1月1日
return [years.value.length - 1, 0, 0];
} else if (Array.isArray(props.value)) {
return props.value;
} else {
return [props.value];
}
});
const pickerValue = ref([...defaultValue.value]);
watch(
() => props.value,
(val) => {
if (props.mode === 'date') {
pickerValue.value = [...val];
} else if (Array.isArray(val)) {
pickerValue.value = [...val];
} else {
pickerValue.value = [val];
}
}
);
function open() {
pickerValue.value = [...defaultValue.value];
show.value = true;
props.onLayerVisibleChange(true);
}
function close() {
show.value = false;
props.onLayerVisibleChange(false);
}
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];
const dateStr = `${year}-${String(month).padStart(2, '0')}-${String(day).padStart(2, '0')}`;
props.onPickerChange(dateStr);
} else {
// 单列时只返回索引，否则返回数组
if (columns.value.length === 1) {
props.onPickerChange(pickerValue.value[0]);
} else {
props.onPickerChange([...pickerValue.value]);
}
}
}
function onChange(e) {
let val = e.detail.value;
if (props.mode === 'date') {
// 如果天数溢出，自动修正到最大天数
const maxDay = days.value.length;
if (val[2] >= maxDay) val[2] = maxDay - 1;
pickerValue.value = val;
} else {
pickerValue.value = val;
}
}
</script>
<style lang="less" scoped>
.picker-layer-mask {
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 3999;
}
.picker-layer-popup {
position: fixed;
left: 0;
right: 0;
bottom: 0;
z-index: 4000;
display: flex;
flex-direction: column;
align-items: center;
animation: picker-layer-up 0.3s;
}
@keyframes picker-layer-up {
from {
transform: translateY(100%);
}
to {
transform: translateY(0);
}
}
.picker-layer-panel {
width: 100vw;
height: 50vh;
background: #f6f8fa;
border-top-left-radius: 24rpx;
border-top-right-radius: 24rpx;
overflow: hidden;
display: flex;
flex-direction: column;
}
.picker-layer-header {
display: flex;
justify-content: space-between;
align-items: center;
height: 140rpx;
box-sizing: border-box;
background: #f6f8fa;
padding: 0 32rpx;
.picker-layer-cancel {
color: #6f6d67;
font-size: 28rpx;
width: 136rpx;
height: 74rpx;
border-radius: 20rpx;
background: #ffffff;
display: flex;
align-items: center;
justify-content: center;
}
.picker-layer-confirm {
color: #ffffff;
font-size: 28rpx;
width: 136rpx;
height: 74rpx;
border-radius: 20rpx;
background: #d3a358;
display: flex;
align-items: center;
justify-content: center;
}
.picker-layer-title {
color: #222;
font-size: 32rpx;
font-weight: bold;
}
}
.picker-layer-view {
flex: 1;
width: 100%;
}
.picker-layer-item {
height: 100rpx;
line-height: 100rpx;
text-align: center;
font-size: 32rpx;
color: #1d1e25;
}
.picker-layer-view-mask-top {
position: absolute;
top: 140rpx;
left: 0;
width: 100%;
height: calc(50% - 100rpx);
z-index: 1;
background: linear-gradient(
to bottom,
rgb(246, 248, 250) 0%,
rgba(255, 255, 255, 0.5) 100%
);
pointer-events: none;
}
.picker-layer-view-mask-bottom {
position: absolute;
bottom: 0rpx;
left: 0;
width: 100%;
height: calc(50% - 100rpx);
z-index: 1;
background: linear-gradient(
to top,
rgb(246, 248, 250) 0%,
rgba(255, 255, 255, 0.5) 100%
);
pointer-events: none;
}
</style>
\ No newline at end of file
components/RegisterLayer.vue 0 → 100644
View file @ bda7f085
<template>
<Layer
v-model="visible"
:customHeader="true"
@confirm="handleConfirm"
@cancel="handleCancel"
>
<view class="register-baby-info-content">
<view class="register-baby-info-title">选择宝宝的生日和预产期</view>
<view class="register-baby-info-desc">
为了提供更有价值的服务，我们会将宝宝信息关联科学分析，星妈会不会泄漏您的任何个人信息，请放心使用。
</view>
<PickerCustom
mode="date"
:value="dateValue"
:onPickerChange="onDateChange"
:onLayerVisibleChange="onLayerVisibleChange"
>
<view class="register-baby-info-picker">
<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
mode="selector"
:range="genderOptions"
:value="genderIndex"
:onPickerChange="onGenderChange"
:onLayerVisibleChange="onLayerVisibleChange"
>
<view class="register-baby-info-picker">
<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
mode="selector"
:range="fetusOptions"
:value="fetusIndex"
:onPickerChange="onFetusChange"
:onLayerVisibleChange="onLayerVisibleChange"
>
<view class="register-baby-info-picker">
<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">
<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" @click="handleBabyInfoConfirm">
完成
</view>
</view>
</Layer>
</template>
<script setup>
import { ref, watch, computed } from "vue";
import Layer from "./Layer.vue";
import PickerCustom from "./PickerCustom.vue";
const props = defineProps({
modelValue: Boolean,
});
const emit = defineEmits([
"update:modelValue",
"update:value",
"confirm",
"cancel",
]);
const visible = ref(props.modelValue);
const imageUrl = ref(props.value);
watch(
() => props.modelValue,
(val) => (visible.value = val)
);
watch(
() => visible.value,
(val) => emit("update:modelValue", val)
);
watch(
() => props.value,
(val) => (imageUrl.value = val)
);
function removeImage() {
imageUrl.value = "";
emit("update:value", "");
}
function handleConfirm() {
emit("confirm", imageUrl.value);
visible.value = false;
}
function handleCancel() {
emit("cancel");
visible.value = false;
}
const checked = ref({
option1: false,
option2: false,
});
// 宝宝信息相关
const date = ref("");
const gender = ref("");
const fetus = ref("");
const genderOptions = ["男", "女", "保密"];
const fetusOptions = ["单胎", "多胎"];
// date picker
const dateValue = ref([50, 0, 0]); // 默认选中今年1月1日
const dateDisplay = ref("");
function onDateChange(val) {
dateDisplay.value = val;
date.value = val;
}
// gender picker
const genderIndex = ref(0);
const genderDisplay = computed(() => gender.value);
function onGenderChange(idx) {
genderIndex.value = idx;
gender.value = genderOptions[idx];
}
// fetus picker
const fetusIndex = ref(0);
const fetusDisplay = computed(() => fetus.value);
function onFetusChange(idx) {
fetusIndex.value = idx;
fetus.value = fetusOptions[idx];
}
function onLayerVisibleChange() {}
function handleBabyInfoConfirm() {
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", {
date: date.value,
gender: gender.value,
fetus: fetus.value,
});
visible.value = false;
}
function openAgreement() {
// 跳转协议页面
uni.navigateTo({ url: "/pages/agreement/index" });
}
</script>
<style lang="less" scoped>
.register-baby-info-content {
margin: 0;
padding: 20rpx 32rpx 0 32rpx;
background: #f8fafc;
border-radius: 40rpx 40rpx 0 0;
display: flex;
flex-direction: column;
align-items: center;
}
.register-baby-info-title {
font-size: 40rpx;
font-weight: bold;
color: #222;
margin-bottom: 12rpx;
align-self: flex-start;
}
.register-baby-info-desc {
font-size: 26rpx;
color: #888;
margin-bottom: 36rpx;
text-align: left;
align-self: flex-start;
line-height: 1.6;
}
.register-baby-info-picker {
width: 654rpx;
background: #fff;
border-radius: 24rpx;
margin-bottom: 28rpx;
padding: 0 32rpx;
height: 94rpx;
box-sizing: border-box;
display: flex;
align-items: center;
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;
color: #bdbfc3;
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;
font-size: 24rpx;
color: #888;
margin: 24rpx 0 32rpx 0;
width: 100%;
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;
text-decoration: underline;
margin-left: 8rpx;
}
.register-baby-info-btn {
width: 654rpx;
background: #d3a358;
color: #fff;
border-radius: 46rpx;
font-size: 36rpx;
padding: 24rpx 0;
margin-bottom: 46rpx;
border: none;
box-shadow: 0 8rpx 32rpx 0 rgba(211, 163, 88, 0.1);
display: flex;
align-items: center;
justify-content: center;
}
</style>
\ No newline at end of file
components/TabBar.vue
View file @ bda7f085
......@@ -19,34 +19,35 @@
</template>
<script setup>
import { ref } from "vue";
import { ref, getCurrentInstance } from "vue";
const props = defineProps({
tabList: {
type: Array,
default: () => [
{
text: "首页",
iconPath: "/static/tabBar/icon_tab_home_normal.png",
selectedIconPath: "/static/tabBar/icon_tab_home_selected.png",
},
{
text: "品牌故事",
iconPath: "/static/tabBar/icon_tab_brand_normal.png",
selectedIconPath: "/static/tabBar/icon_tab_brand_selected.png",
},
{
text: "积分服务",
iconPath: "/static/tabBar/icon_tab_gift_normal.png",
selectedIconPath: "/static/tabBar/icon_tab_gift_selected.png",
},
{
text: "我的",
iconPath: "/static/tabBar/icon_tab_person_normal.png",
selectedIconPath: "/static/tabBar/icon_tab_person_selected.png",
},
],
const { proxy } = getCurrentInstance();
const $baseUrl = proxy.$baseUrl;
const tabList = ref([
{
text: "首页",
iconPath: $baseUrl + "tabBar/icon_tab_home_normal.png",
selectedIconPath: $baseUrl + "tabBar/icon_tab_home_selected.png",
},
{
text: "品牌故事",
iconPath: $baseUrl + "tabBar/icon_tab_brand_normal.png",
selectedIconPath: $baseUrl + "tabBar/icon_tab_brand_selected.png",
},
{
text: "积分服务",
iconPath: $baseUrl + "tabBar/icon_tab_gift_normal.png",
selectedIconPath: $baseUrl + "tabBar/icon_tab_gift_selected.png",
},
{
text: "我的",
iconPath: $baseUrl + "tabBar/icon_tab_person_normal.png",
selectedIconPath: $baseUrl + "tabBar/icon_tab_person_selected.png",
},
]);
const props = defineProps({
curTabIndex: {
type: Number,
default: 0,
......
main.js
View file @ bda7f085
......@@ -2,12 +2,17 @@ import App from "./App";
import apiRequest from "@/api/request.js";
import * as Pinia from 'pinia';
const BASE_URL = 'https://duiba.oss-cn-hangzhou.aliyuncs.com/fh/';
// #ifndef VUE3
import Vue from "vue";
import "./uni.promisify.adaptor";
// 全局挂载后使用
Vue.prototype.$api = apiRequest.api;
Vue.prototype.$baseUrl = BASE_URL;
Vue.config.productionTip = false;
App.mpType = "app";
......@@ -24,6 +29,7 @@ export function createApp() {
const app = createSSRApp(App);
app.use(Pinia.createPinia());
app.config.globalProperties.$api = apiRequest.api;
app.config.globalProperties.$baseUrl = BASE_URL;
return {
app,
Pinia
......
pages.json
View file @ bda7f085
{
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
"pages": [
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "首页"
"navigationBarTitleText": "首页",
"navigationStyle": "custom"
}
},
{
"path": "pages/person/person",
"style": {
"navigationBarTitleText": "",
"navigationStyle": "custom"
}
},
{
"path": "pages/webview/webview",
"style": {
"navigationBarTitleText": "",
"navigationStyle": "custom"
}
},
{
"path": "pages/search/search",
"style": {
"navigationBarTitleText": ""
"navigationStyle": "custom"
}
},
{
"path" : "pages/product/product",
"style" :
{
"navigationBarTitleText": "商品详情",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
}
}
],
......@@ -18,10 +43,10 @@
"navigationBarTitleText": "uni-app",
"navigationBarBackgroundColor": "#F8F8F8",
"backgroundColor": "#F8F8F8",
"navigationStyle": "custom",
"navigationStyle": "default",
"usingComponents": {
"van-tab": "wxcomponents/vant/tab/index",
"van-tabs": "wxcomponents/vant/tabs/index"
"van-tab": "wxcomponents/vant/tab/index",
"van-tabs": "wxcomponents/vant/tabs/index"
}
},
"uniIdRouter": {}
......
pages/index/index.vue
View file @ bda7f085
......@@ -18,7 +18,7 @@
export default {
data() {
return {
curTabIndex: 0,
curTabIndex: 3,
};
},
onLoad() {},
......
pages/person/person.vue 0 → 100644
View file @ bda7f085
This diff is collapsed.
pages/product/product.vue 0 → 100644
View file @ bda7f085
<template>
<view class="container">
<image mode="widthFix" class="productimg" :src="$baseUrl + 'brandpage/products/' + productId + '.jpg'"></image>
<view class="btnbox">
<image @tap="buyHandler" class="btnbuy" :src="$baseUrl + 'brandpage/btnbuy.png'"></image>
<button class="btnshare" open-type="share" style="background: none; border: none; padding: 0;">
<image class="btnshare" :src="$baseUrl + 'brandpage/btnshare.png'"></image>
</button>
</view>
</view>
</template>
<script>
export default {
data() {
return {
productId: ''
}
},
onLoad(options) {
// options 就是跳转时传递的参数对象
console.log('页面参数:', options);
this.productId = options.id;
},
methods: {
buyHandler() {
uni.navigateToMiniProgram({
appId: 'wx1234567890abcdef',
path: 'pages/index/index',
envVersion: 'release',
success(res) {
console.log('跳转成功', res)
},
fail(err) {
console.error('跳转失败', err)
}
})
},
shareHandler() {
}
},
onShareAppMessage() {
return {
title: '商品详情',
path: '/pages/product/product?id=123',
imageUrl: 'https://你的图片链接.jpg'
}
},
}
</script>
<style lang="less" scoped>
.container {
.productimg {
width: 750rpx;
}
.btnbox {
position: fixed;
left: 0;
width: 100%;
bottom: 0;
height: 150rpx;
display: flex;
justify-content: space-between;
.btnbuy {
width: 350rpx;
height: 75rpx;
margin-left: 20rpx;
}
.btnshare {
width: 350rpx;
height: 75rpx;
}
}
}
</style>
pages/search/search.vue
View file @ bda7f085
<template>
<view class="container">
<view class="searchBar" :style="`top:${statusBarHeight}px`">
<image @tap="backHandler" class="btnback" :src="baseImgUrl+'/static/searchpage/btnback.png'"></image>
<image @tap="backHandler" class="btnback" :src="$baseUrl+'searchpage/btnback.png'"></image>
<view class="input-view">
<view class="flexinput">
<image class="icon_search_yellow" :src="baseImgUrl+'/static/searchpage/icon_search_yellow.png'">
<image class="icon_search_yellow" :src="$baseUrl+'searchpage/icon_search_yellow.png'">
</image>
<input confirm-type="search" class="nav-bar-input" type="text" placeholder="输入搜索关键词"
<input confirm-type="search" maxlength="50" class="nav-bar-input" type="text" placeholder="输入搜索关键词"
@confirm="confirm" />
</view>
</view>
</view>
<view class="topbox" :style="`margin-top:${statusBarHeight+10}px`">
<view v-if="step === 1" class="recentbox">
<image class="icon_trash" :src="baseImgUrl+'/static/searchpage/icon_trash.png'"></image>
<image class="icon_trash" :src="$baseUrl+'searchpage/icon_trash.png'"></image>
<view class="title">最近搜索</view>
<view class="tagbox">
<view :key="index" v-for="(item,index) in recentTagsList" class="tag">{{item}}</view>
<view @tap="searchHandler(item)" :key="index" v-for="(item,index) in recentTagsList" class="tag">{{item}}</view>
</view>
</view>
<view v-if="step === 1" class="recentbox">
<view class="title">大家都在搜</view>
<view class="tagbox">
<view :key="index" v-for="(item,index) in oftenTagsList" class="tag">{{item}}</view>
<view @tap="searchHandler(item)" :key="index" v-for="(item,index) in oftenTagsList" class="tag">{{item}}</view>
</view>
</view>
<view v-if="step !== 1" class="tabbox">
<van-tabs :color="`#d3a358`" :active="tabIndex" @click="onTabChange">
<van-tabs :color="`#d3a358`" line-width="15px" :active="tabIndex" @click="onTabChange">
<van-tab title="内容" name="a"></van-tab>
<van-tab title="工具" name="b"></van-tab>
<van-tab title="商品" name="c"></van-tab>
......@@ -37,7 +37,7 @@
</view>
<view v-if="step !== 1" class="cardbox">
<view class="card" v-for="(item,index) in resultList[tabIndex]" :key="index">
<image class="pic" :src="baseImgUrl+item.bgUrl"></image>
<image class="pic" :src="$baseUrl+item.bgUrl"></image>
<view class="desc">
{{item.desc}}
</view>
......@@ -52,7 +52,7 @@
</template>
<script>
const baseImgUrl = "";
const recentTagsList=[
"功能营养","母婴","功能营养","母婴","功能营养","母婴","功能营养","母婴","功能营养","母婴"
]
......@@ -62,49 +62,49 @@
const resultList = [
[
{
bgUrl:"/static/searchpage/test.png",
bgUrl:"searchpage/test.png",
desc:"宝宝出生必做6件事，90 %爸妈漏掉第3条",
timeStr:"2025-03-10",
link:"www.baidu.com"
},
{
bgUrl:"/static/searchpage/test.png",
bgUrl:"searchpage/test.png",
desc:"宝宝出生必做6件事，90 %爸妈漏掉第3条",
timeStr:"2025-03-10",
link:"www.baidu.com"
},
{
bgUrl:"/static/searchpage/test.png",
bgUrl:"searchpage/test.png",
desc:"宝宝出生必做6件事，90 %爸妈漏掉第3条",
timeStr:"2025-03-10",
link:"www.baidu.com"
},
{
bgUrl:"/static/searchpage/test.png",
bgUrl:"searchpage/test.png",
desc:"宝宝出生必做6件事，90 %爸妈漏掉第3条",
timeStr:"2025-03-10",
link:"www.baidu.com"
},
{
bgUrl:"/static/searchpage/test.png",
bgUrl:"searchpage/test.png",
desc:"宝宝出生必做6件事，90 %爸妈漏掉第3条",
timeStr:"2025-03-10",
link:"www.baidu.com"
},
{
bgUrl:"/static/searchpage/test.png",
bgUrl:"searchpage/test.png",
desc:"宝宝出生必做6件事，90 %爸妈漏掉第3条",
timeStr:"2025-03-10",
link:"www.baidu.com"
},
{
bgUrl:"/static/searchpage/test.png",
bgUrl:"searchpage/test.png",
desc:"宝宝出生必做6件事，90 %爸妈漏掉第3条",
timeStr:"2025-03-10",
link:"www.baidu.com"
},
{
bgUrl:"/static/searchpage/test.png",
bgUrl:"searchpage/test.png",
desc:"宝宝出生必做6件事，90 %爸妈漏掉第3条",
timeStr:"2025-03-10",
link:"www.baidu.com"
......@@ -112,31 +112,31 @@
],
[
{
bgUrl:"/static/searchpage/test2.png",
bgUrl:"searchpage/test2.png",
desc:"秋风渐凉，宝宝的免疫力 也进入 “换季挑战期”",
timeStr:"2025-03-10",
link:"www.baidu.com"
},
{
bgUrl:"/static/searchpage/test2.png",
bgUrl:"searchpage/test2.png",
desc:"秋风渐凉，宝宝的免疫力 也进入 “换季挑战期”",
timeStr:"2025-03-10",
link:"www.baidu.com"
},
{
bgUrl:"/static/searchpage/test2.png",
bgUrl:"searchpage/test2.png",
desc:"秋风渐凉，宝宝的免疫力 也进入 “换季挑战期”",
timeStr:"2025-03-10",
link:"www.baidu.com"
},
{
bgUrl:"/static/searchpage/test2.png",
bgUrl:"searchpage/test2.png",
desc:"秋风渐凉，宝宝的免疫力 也进入 “换季挑战期”",
timeStr:"2025-03-10",
link:"www.baidu.com"
},
{
bgUrl:"/static/searchpage/test2.png",
bgUrl:"searchpage/test2.png",
desc:"秋风渐凉，宝宝的免疫力 也进入 “换季挑战期”",
timeStr:"2025-03-10",
link:"www.baidu.com"
......@@ -144,31 +144,31 @@
],
[
{
bgUrl:"/static/searchpage/test3.png",
bgUrl:"searchpage/test3.png",
desc:"3 个 0 成本游戏，让宝宝 越玩越聪明～",
timeStr:"2025-03-10",
link:"www.baidu.com"
},
{
bgUrl:"/static/searchpage/test3.png",
bgUrl:"searchpage/test3.png",
desc:"3 个 0 成本游戏，让宝宝 越玩越聪明～",
timeStr:"2025-03-10",
link:"www.baidu.com"
},
{
bgUrl:"/static/searchpage/test3.png",
bgUrl:"searchpage/test3.png",
desc:"3 个 0 成本游戏，让宝宝 越玩越聪明～",
timeStr:"2025-03-10",
link:"www.baidu.com"
},
{
bgUrl:"/static/searchpage/test3.png",
bgUrl:"searchpage/test3.png",
desc:"3 个 0 成本游戏，让宝宝 越玩越聪明～",
timeStr:"2025-03-10",
link:"www.baidu.com"
},
{
bgUrl:"/static/searchpage/test3.png",
bgUrl:"searchpage/test3.png",
desc:"3 个 0 成本游戏，让宝宝 越玩越聪明～",
timeStr:"2025-03-10",
link:"www.baidu.com"
......@@ -179,19 +179,19 @@
data() {
return {
baseImgUrl: baseImgUrl,
statusBarHeight: 38,
recentTagsList:recentTagsList,
oftenTagsList:oftenTagsList,
step:2,
step:1,
resultList:resultList,
tabIndex:0,
searchValue:''
}
},
mounted() {
const systemInfo = uni.getSystemInfoSync();
this.statusBarHeight = systemInfo.statusBarHeight || 38;
const menuButtonInfo = wx.getMenuButtonBoundingClientRect();
this.statusBarHeight = menuButtonInfo.top;
},
methods: {
backHandler() {
......@@ -202,10 +202,13 @@
this.tabIndex = evt.detail.index;
},
confirm(evt){
this.searchValue= evt.detail.value;
this.searchHandler(evt.detail.value);
},
searchHandler(){
searchHandler(_searchValue){
if(_searchValue){
this.searchValue=_searchValue;
}
this.step=2;
}
}
}
......@@ -215,6 +218,7 @@
@import '@/common.less';
:root{
--tab-font-size:28rpx;
--tabs-line-height:60rpx;
--tab-active-text-color:#1d1e25;
--tab-text-color:#a2a3a6;
}
......
pages/webview/webview.vue 0 → 100644
View file @ bda7f085
<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) => {
let url = "";
if (options.type) {
const type = options.type;
url = CFG[type];
} else {
url = options.url || "";
}
src.value = url;
});
</script>
\ No newline at end of file
static/my/book.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/my/code.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/my/cover_white_bg.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/my/doctor.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/my/literature.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/my/suyuan.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/searchpage/btnback.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/searchpage/icon_search_yellow.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/searchpage/icon_trash.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/searchpage/test.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/searchpage/test2.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/searchpage/test3.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/tabBar/icon_tab_brand_normal.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/tabBar/icon_tab_brand_selected.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/tabBar/icon_tab_gift_normal.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/tabBar/icon_tab_home_normal.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/tabBar/icon_tab_home_selected.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/tabBar/icon_tab_person_normal.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
static/tabBar/icon_tab_person_selected.png deleted 100644 → 0
View file @ 8e379ceb
This diff is collapsed.
views/Brand.vue
View file @ bda7f085
This diff is collapsed.
views/Home.vue
View file @ bda7f085
This diff is collapsed.
views/My.vue
View file @ bda7f085
This diff is collapsed.
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