Compare commits
10 Commits
8d0f7220d9
...
67859c569f
| Author | SHA1 | Date |
|---|---|---|
dongmu
|
67859c569f | 1 year ago |
|
dongmu
|
3ee987f1f9 | 1 year ago |
|
dongmu
|
6da146785a | 1 year ago |
|
dongmu
|
d859691873 | 1 year ago |
|
dongmu
|
be12953e05 | 1 year ago |
|
dongmu
|
ee9b78f42d | 1 year ago |
|
dongmu
|
3e012d89f8 | 1 year ago |
|
dongmu
|
2f6fed858a | 1 year ago |
苏杰豪
|
a0933c6d1d | 1 year ago |
|
苏杰豪
|
c84c34e3df | 1 year ago |
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,77 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import type { BannerItem } from '@/types/home'
|
||||||
|
import { ref } from 'vue'
|
||||||
|
|
||||||
|
const activeIndex = ref(0)
|
||||||
|
|
||||||
|
const onchange: UniHelper.SwiperOnChange = (ev) => {
|
||||||
|
// 排除空值 类型断言
|
||||||
|
activeIndex.value = ev.detail!.current
|
||||||
|
}
|
||||||
|
|
||||||
|
// 接收父组件 传过来的数据 props --- 指定泛型(一个尖括号一个花括号)
|
||||||
|
defineProps<{
|
||||||
|
list: BannerItem[]
|
||||||
|
}>()
|
||||||
|
|
||||||
|
// const props = defineProps<{
|
||||||
|
// list: BannerItem[]
|
||||||
|
// }>()
|
||||||
|
|
||||||
|
// console.log(props, 'props')
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<view class="carousel">
|
||||||
|
<swiper @change="onchange" :circular="true" :autoplay="false" :interval="3000">
|
||||||
|
<swiper-item v-for="item in list" :key="item.id">
|
||||||
|
<navigator url="/pages/index/index" hover-class="none" class="navigator">
|
||||||
|
<image mode="aspectFill" class="image" :src="item.imgUrl"></image>
|
||||||
|
</navigator>
|
||||||
|
</swiper-item>
|
||||||
|
</swiper>
|
||||||
|
<!-- 指示点 -->
|
||||||
|
<view class="indicator">
|
||||||
|
<text
|
||||||
|
v-for="(item, index) in list.length"
|
||||||
|
:key="item"
|
||||||
|
class="dot"
|
||||||
|
:class="{ active: index === activeIndex }"
|
||||||
|
></text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
/* 轮播图 */
|
||||||
|
.carousel {
|
||||||
|
height: 280rpx;
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
transform: translateY(0);
|
||||||
|
background-color: #efefef;
|
||||||
|
.indicator {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 16rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
.dot {
|
||||||
|
width: 30rpx;
|
||||||
|
height: 6rpx;
|
||||||
|
margin: 0 8rpx;
|
||||||
|
border-radius: 6rpx;
|
||||||
|
background-color: rgba(255, 255, 255, 0.4);
|
||||||
|
}
|
||||||
|
.active {
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.navigator,
|
||||||
|
.image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,8 @@
|
|||||||
|
export const environment = {
|
||||||
|
ENV: 'development',
|
||||||
|
APP_TITLE: '鸿森通货运平台',
|
||||||
|
APP_TARGET: 'http://192.168.0.166',
|
||||||
|
APP_PORT: ':8080',
|
||||||
|
APP_FILE_URL: 'http://106.58.179.30:19005/',
|
||||||
|
ENCRYPT: '',
|
||||||
|
}
|
||||||
@ -0,0 +1,8 @@
|
|||||||
|
export const environment = {
|
||||||
|
ENV: 'production',
|
||||||
|
APP_TITLE: '鸿森通货运平台',
|
||||||
|
APP_TARGET: 'https://hongsentong.com',
|
||||||
|
APP_PORT: '',
|
||||||
|
APP_FILE_URL: 'https://hongsentong.com/minio/',
|
||||||
|
ENCRYPT: 'encrypt',
|
||||||
|
}
|
||||||
@ -0,0 +1,8 @@
|
|||||||
|
export const environment = {
|
||||||
|
ENV: 'test',
|
||||||
|
APP_TITLE: '鸿森通货运平台',
|
||||||
|
APP_TARGET: 'http://112.112.149.146/',
|
||||||
|
APP_PORT: '18010',
|
||||||
|
APP_FILE_URL: 'http://112.112.149.146:19005/',
|
||||||
|
ENCRYPT: true,
|
||||||
|
}
|
||||||
@ -0,0 +1,73 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
// 获取屏幕边界到安全区域距离
|
||||||
|
const { safeAreaInsets } = uni.getSystemInfoSync()
|
||||||
|
console.log(safeAreaInsets, '安全区域')
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<view class="navbar" :style="{ paddingTop: safeAreaInsets?.top + 'px' }">
|
||||||
|
<!-- logo文字 -->
|
||||||
|
<view class="logo">
|
||||||
|
<image class="logo-image" src="@/static/images/logo.png"></image>
|
||||||
|
<text class="logo-text">新鲜 · 亲民 · 快捷</text>
|
||||||
|
</view>
|
||||||
|
<!-- 搜索条 -->
|
||||||
|
<view class="search">
|
||||||
|
<text class="icon-search">搜索商品</text>
|
||||||
|
<text class="icon-scan"></text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
/* 自定义导航条 */
|
||||||
|
.navbar {
|
||||||
|
background-image: url(@/static/images/navigator_bg.png);
|
||||||
|
background-size: cover;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
padding-top: 20px;
|
||||||
|
.logo {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
height: 64rpx;
|
||||||
|
padding-left: 30rpx;
|
||||||
|
padding-top: 20rpx;
|
||||||
|
.logo-image {
|
||||||
|
width: 166rpx;
|
||||||
|
height: 39rpx;
|
||||||
|
}
|
||||||
|
.logo-text {
|
||||||
|
flex: 1;
|
||||||
|
line-height: 28rpx;
|
||||||
|
color: #fff;
|
||||||
|
margin: 2rpx 0 0 20rpx;
|
||||||
|
padding-left: 20rpx;
|
||||||
|
border-left: 1rpx solid #fff;
|
||||||
|
font-size: 26rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.search {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 0 10rpx 0 26rpx;
|
||||||
|
height: 64rpx;
|
||||||
|
margin: 16rpx 20rpx;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 28rpx;
|
||||||
|
border-radius: 32rpx;
|
||||||
|
background-color: rgba(255, 255, 255, 0.5);
|
||||||
|
}
|
||||||
|
.icon-search {
|
||||||
|
&::before {
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.icon-scan {
|
||||||
|
font-size: 30rpx;
|
||||||
|
padding: 15rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,11 @@
|
|||||||
|
/** 首页-广告区域数据类型 */
|
||||||
|
export type BannerItem = {
|
||||||
|
/** 跳转链接 */
|
||||||
|
hrefUrl: string
|
||||||
|
/** id */
|
||||||
|
id: string
|
||||||
|
/** 图片链接 */
|
||||||
|
imgUrl: string
|
||||||
|
/** 跳转类型 */
|
||||||
|
type: number
|
||||||
|
}
|
||||||
@ -0,0 +1,5 @@
|
|||||||
|
import { environment } from '@/env/development'
|
||||||
|
// import { environment } from '@/env/production'
|
||||||
|
// import { environment } from '@/env/test'
|
||||||
|
|
||||||
|
export const ENV = environment
|
||||||
Loading…
Reference in new issue