14 changed files with 758 additions and 32 deletions
@ -0,0 +1,34 @@ |
|||||
|
/** |
||||
|
* 显示模态框 |
||||
|
* @param {string} msg |
||||
|
* @param {boolean} showCancel |
||||
|
* @param {string} confirmText |
||||
|
*/ |
||||
|
export const showModal = (msg, showCancel = false, confirmText = '知道了') => |
||||
|
uni.showModal({ |
||||
|
title: '提示', |
||||
|
content: msg, |
||||
|
showCancel, |
||||
|
confirmText, |
||||
|
confirmColor: '#1890ff', |
||||
|
}); |
||||
|
|
||||
|
/** |
||||
|
* 显示toast |
||||
|
* @param {string} msg |
||||
|
*/ |
||||
|
export const showToast = msg => |
||||
|
uni.showToast({ |
||||
|
title: msg, |
||||
|
icon: 'none', |
||||
|
duration: 3000, |
||||
|
}); |
||||
|
|
||||
|
// 显示加载动画
|
||||
|
export const showLoading = (msg = '努力加载中...') => uni.showLoading({ title: msg }); |
||||
|
|
||||
|
// 隐藏加载动画
|
||||
|
export const hideLoading = () => |
||||
|
setTimeout(() => { |
||||
|
uni.hideLoading(); |
||||
|
}, 1000); |
||||
@ -0,0 +1,32 @@ |
|||||
|
<template> |
||||
|
<view> |
||||
|
<view class="cu-timeline"> |
||||
|
<view class="cu-time">昨天</view> |
||||
|
<view class="cu-item cur cuIcon-noticefill"> |
||||
|
<view class="content bg-green shadow-blur"> |
||||
|
<text>22:22</text>【广州市】快件已到达地球 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="cu-item text-red cuIcon-attentionforbidfill"> |
||||
|
<view class="content bg-red shadow-blur">这是第一次，我家的铲屎官走了这么久。久到足足有三天！！</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="cu-timeline"> |
||||
|
<view class="cu-time">06-17</view> |
||||
|
<view class="cu-item"> |
||||
|
<view class="content"> |
||||
|
<text>01:30</text>【喵星】 MX-12138 已揽收，准备发往银河系 |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return {}; |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
@ -0,0 +1,124 @@ |
|||||
|
<template> |
||||
|
<view :class="[styleType === 'text'?'segmented-control--text' : 'segmented-control--button' ]" :style="{ borderColor: styleType === 'text' ? '' : activeColor }" |
||||
|
class="segmented-control"> |
||||
|
<view v-for="(item, index) in values" :class="[ styleType === 'text'?'segmented-control__item--text': 'segmented-control__item--button' , index === currentIndex&&styleType === 'button'?'segmented-control__item--button--active': '' , index === 0&&styleType === 'button'?'segmented-control__item--button--first': '',index === values.length - 1&&styleType === 'button'?'segmented-control__item--button--last': '' ]" |
||||
|
:key="index" :style="{ |
||||
|
backgroundColor: index === currentIndex && styleType === 'button' ? activeColor : '',borderColor: index === currentIndex&&styleType === 'text'||styleType === 'button'?activeColor:'transparent' |
||||
|
}" |
||||
|
class="segmented-control__item" @click="_onClick(index)"> |
||||
|
<text :style="{color: |
||||
|
index === currentIndex |
||||
|
? styleType === 'text' |
||||
|
? activeColor |
||||
|
: '#fff' |
||||
|
: styleType === 'text' |
||||
|
? '#000' |
||||
|
: activeColor}" |
||||
|
class="segmented-control__text">{{ item }}</text> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: 'UniSegmentedControl', |
||||
|
props: { |
||||
|
current: { |
||||
|
type: Number, |
||||
|
default: 0 |
||||
|
}, |
||||
|
values: { |
||||
|
type: Array, |
||||
|
default () { |
||||
|
return [] |
||||
|
} |
||||
|
}, |
||||
|
activeColor: { |
||||
|
type: String, |
||||
|
default: '#007aff' |
||||
|
}, |
||||
|
styleType: { |
||||
|
type: String, |
||||
|
default: 'button' |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
currentIndex: 0 |
||||
|
} |
||||
|
}, |
||||
|
watch: { |
||||
|
current(val) { |
||||
|
if (val !== this.currentIndex) { |
||||
|
this.currentIndex = val |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
created() { |
||||
|
this.currentIndex = this.current |
||||
|
}, |
||||
|
methods: { |
||||
|
_onClick(index) { |
||||
|
if (this.currentIndex !== index) { |
||||
|
this.currentIndex = index |
||||
|
this.$emit('clickItem', {currentIndex:index}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
@import '@/uni.scss'; |
||||
|
|
||||
|
.segmented-control { |
||||
|
/* #ifndef APP-NVUE */ |
||||
|
display: flex; |
||||
|
box-sizing: border-box; |
||||
|
/* #endif */ |
||||
|
flex-direction: row; |
||||
|
height: 36px; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
|
||||
|
.segmented-control__item { |
||||
|
/* #ifndef APP-NVUE */ |
||||
|
display: inline-flex; |
||||
|
box-sizing: border-box; |
||||
|
/* #endif */ |
||||
|
position: relative; |
||||
|
flex: 1; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
} |
||||
|
|
||||
|
.segmented-control__item--button { |
||||
|
border-style: solid; |
||||
|
border-top-width: 1px; |
||||
|
border-bottom-width: 1px; |
||||
|
border-right-width: 1px; |
||||
|
border-left-width: 0; |
||||
|
} |
||||
|
|
||||
|
.segmented-control__item--button--first { |
||||
|
border-left-width: 1px; |
||||
|
border-top-left-radius: 5px; |
||||
|
border-bottom-left-radius: 5px; |
||||
|
} |
||||
|
|
||||
|
.segmented-control__item--button--last { |
||||
|
border-top-right-radius: 5px; |
||||
|
border-bottom-right-radius: 5px; |
||||
|
} |
||||
|
|
||||
|
.segmented-control__item--text { |
||||
|
border-bottom-style: solid; |
||||
|
border-bottom-width: 3px; |
||||
|
} |
||||
|
|
||||
|
.segmented-control__text { |
||||
|
font-size: 16px; |
||||
|
line-height: 20px; |
||||
|
text-align: center; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,144 @@ |
|||||
|
<template> |
||||
|
<view> |
||||
|
<form class="padding-lr cu-form-group flex-direction"> |
||||
|
<view class="cu-form-group flex flex-direction padding-tb"> |
||||
|
<view class="title padding-bottom-sm"><span class="text-red padding-right-xs">*</span>出发时间</view> |
||||
|
<date-selector @change="getStartData" /> |
||||
|
</view> |
||||
|
<view class="cu-form-group flex flex-direction padding-tb"> |
||||
|
<view class="title padding-bottom-sm"><span class="text-red padding-right-xs">*</span>抵达时间</view> |
||||
|
<date-selector @change="getEndData" /> |
||||
|
</view> |
||||
|
<view class="cu-form-group flex flex-direction padding-top"> |
||||
|
<view class="text-xl padding-tb-sm">出行交通方式（必选）</view> |
||||
|
<radio-group class="block" @change="RadioChange"> |
||||
|
<view class="cu-list menu text-left"> |
||||
|
<view class="cu-item" v-for="(transport,index) in transports" :key="index"> |
||||
|
<label class="flex justify-between align-center"> |
||||
|
<radio class="round margin-right-xs" :checked="index === current" :value="transport.value"></radio> |
||||
|
<view class="flex-sub" style="font-size: 34rpx;">{{ transport.name }}</view> |
||||
|
</label> |
||||
|
</view> |
||||
|
</view> |
||||
|
</radio-group> |
||||
|
</view> |
||||
|
<view class="cu-form-group flex flex-direction padding-tb"> |
||||
|
<view class="title padding-bottom-sm"><span class="text-red padding-right-xs">*</span>乘坐航班车次或车牌号码及座位号（没有填无）</view> |
||||
|
<input placeholder="请输入" name="input" type="text" v-model="carNumber" /> |
||||
|
</view> |
||||
|
</form> |
||||
|
<view class="margin flex flex-wrap"> |
||||
|
<view @click="agree = !agree" class="iconfont agree-box" :class="[agree ? 'text-blue icon-check-square': 'text-gray icon-border']"></view> |
||||
|
<view class="text-df text-black flex-sub agree-text"> |
||||
|
以上信息是我本人填写，本人对信息的真实性和完整性负责。 |
||||
|
</view> |
||||
|
</view> |
||||
|
<button class="bg-cyan margin primary-btn" hover-class="cc-active" @tap="addStroke">确认提交</button> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { showToast } from 'common/script/util'; |
||||
|
import UniCalendar from 'components/uni-calendar/uni-calendar.vue'; |
||||
|
import DateSelector from './components/date-selector.vue'; |
||||
|
|
||||
|
export default { |
||||
|
components: {UniCalendar,DateSelector}, |
||||
|
data() { |
||||
|
return { |
||||
|
transports: [ |
||||
|
{ |
||||
|
value: '0', |
||||
|
name: '铁路', |
||||
|
}, |
||||
|
{ |
||||
|
value: '1', |
||||
|
name: '飞机', |
||||
|
}, |
||||
|
{ |
||||
|
value: '2', |
||||
|
name: '客运车辆', |
||||
|
}, |
||||
|
{ |
||||
|
value: '3', |
||||
|
name: '自驾', |
||||
|
}, |
||||
|
{ |
||||
|
value: '4', |
||||
|
name: '船', |
||||
|
}, |
||||
|
{ |
||||
|
value: '5', |
||||
|
name: '其他', |
||||
|
} |
||||
|
], |
||||
|
carNumber: '', |
||||
|
current: 0, |
||||
|
agree: false |
||||
|
}; |
||||
|
}, |
||||
|
methods: { |
||||
|
RadioChange: function(evt) { |
||||
|
for (let i = 0; i < this.transports.length; i++) { |
||||
|
if (this.transports[i].value === evt.target.value) { |
||||
|
this.current = i; |
||||
|
break; |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 获取出发时间 |
||||
|
* @param {string} start 开始时间 |
||||
|
* @param {string} end 截止时间 |
||||
|
*/ |
||||
|
getData(start, end) { |
||||
|
console.log('出发时间 start, end: ', start, end); |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 获取抵达时间 |
||||
|
* @param {string} start 开始时间 |
||||
|
* @param {string} end 截止时间 |
||||
|
*/ |
||||
|
getEndData(start, end) { |
||||
|
console.log('抵达时间 start, end: ', start, end); |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 提交基本信息 |
||||
|
*/ |
||||
|
addStroke() { |
||||
|
if (!this.transports) { |
||||
|
showToast('请选择身份'); |
||||
|
return; |
||||
|
} |
||||
|
if (!this.carNumber) { |
||||
|
showToast('请输入学号'); |
||||
|
return; |
||||
|
} |
||||
|
if (!this.agree) { |
||||
|
showToast('请确定是否为本人填写'); |
||||
|
return; |
||||
|
} |
||||
|
console.log('信息提交'); |
||||
|
uni.reLaunch({ |
||||
|
url: `/pages/index/index`, |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.agree-box{ |
||||
|
width: 70rpx; |
||||
|
} |
||||
|
.agree-text{ |
||||
|
line-height: 60rpx; |
||||
|
} |
||||
|
.primary-btn{ |
||||
|
border-radius: 15rpx; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,56 @@ |
|||||
|
<template> |
||||
|
<view> |
||||
|
<view @tap="$refs.calendar.open()" hover-class="cc-active"> |
||||
|
<view class="iconfont icon-calendar timer"><text class="padding-left-xs">{{ date }}</text></view> |
||||
|
</view> |
||||
|
<uni-calendar |
||||
|
:insert="false" |
||||
|
:range="true" |
||||
|
:show-month="true" |
||||
|
@confirm="handleChange" |
||||
|
ref="calendar" |
||||
|
/> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: 'DateSelector', |
||||
|
data() { |
||||
|
const start = this.$moment().format('YYYY-MM-DD'); |
||||
|
const end = this.$moment().format('YYYY-MM-DD'); |
||||
|
return { |
||||
|
start, |
||||
|
end, |
||||
|
}; |
||||
|
}, |
||||
|
|
||||
|
computed: { |
||||
|
date() { |
||||
|
const { start, end } = this; |
||||
|
return start === end ? start : `${start} - ${end}`; |
||||
|
}, |
||||
|
}, |
||||
|
|
||||
|
methods: { |
||||
|
/** |
||||
|
* 日历确认选择了时间段 |
||||
|
* @param {object} value 日历返回对象 |
||||
|
*/ |
||||
|
handleChange(value) { |
||||
|
const { before, after } = value.range; |
||||
|
this.start = before; |
||||
|
this.end = after; |
||||
|
this.menu = ''; |
||||
|
this.$emit('change', before, after); |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.timer{ |
||||
|
font-size: 34rpx!important; |
||||
|
color: $gray; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,213 @@ |
|||||
|
<template> |
||||
|
<view> |
||||
|
<form class="padding-lr cu-form-group flex-direction"> |
||||
|
<view class="cu-form-group flex flex-direction padding-tb"> |
||||
|
<view class="title padding-bottom-sm"><span class="text-red padding-right-xs">*</span>当前所在地区</view> |
||||
|
<input placeholder="请输入当前所在地区" name="input" type="text" v-model="area" /> |
||||
|
</view> |
||||
|
<view class="cu-form-group flex flex-direction padding-tb"> |
||||
|
<view class="title padding-bottom-sm"><span class="text-red padding-right-xs">*</span>当前所在城市</view> |
||||
|
<input placeholder="请输入当前所在城市" name="input" type="text" v-model="city" /> |
||||
|
</view> |
||||
|
<view class="cu-form-group flex flex-direction padding-top"> |
||||
|
<view class="title padding-bottom-sm"><span class="text-red padding-right-xs">*</span>当前状态</view> |
||||
|
<radio-group class="block" @change="StateChange"> |
||||
|
<view class="cu-list menu text-left"> |
||||
|
<view class="cu-item" v-for="(state,index) in status" :key="index"> |
||||
|
<label class="flex justify-between align-center"> |
||||
|
<radio class="round margin-right-xs" :checked="index === current" :value="state.value"></radio> |
||||
|
<view class="flex-sub" style="font-size: 34rpx;">{{ state.name }}</view> |
||||
|
</label> |
||||
|
</view> |
||||
|
</view> |
||||
|
</radio-group> |
||||
|
</view> |
||||
|
<view class="cu-form-group flex flex-direction padding-tb"> |
||||
|
<view class="title padding-bottom-sm">就诊医院（若无填无）</view> |
||||
|
<input placeholder="请输入就诊医院" name="input" type="text" v-model="hospital" /> |
||||
|
</view> |
||||
|
<view class="cu-form-group flex flex-direction padding-top"> |
||||
|
<view class="title padding-bottom-sm">最近14天是否有武汉居住史、旅游史或武汉亲戚来访</view> |
||||
|
<radio-group class="block" @change="TourChange"> |
||||
|
<view class="flex"> |
||||
|
<view class="flex-sub margin-tb-sm" v-for="(tour,index) in tours" :key="index"> |
||||
|
<label class="flex justify-between align-center"> |
||||
|
<radio class="round margin-right-xs" :checked="index === tourCurrent" :value="tour.value"></radio> |
||||
|
<text class="flex-sub" style="font-size: 34rpx;">{{ tour.name }}</text> |
||||
|
</label> |
||||
|
</view> |
||||
|
</view> |
||||
|
</radio-group> |
||||
|
</view> |
||||
|
|
||||
|
<view class="cu-form-group flex flex-direction padding-top"> |
||||
|
<view class="title padding-bottom-sm">最近14天是否有新冠肺炎患者或疑似患者接触史</view> |
||||
|
<radio-group class="block" @change="TouchChange"> |
||||
|
<view class="flex"> |
||||
|
<view class="flex-sub margin-tb-sm" v-for="(touch,index) in touches" :key="index"> |
||||
|
<label class="flex justify-between align-center"> |
||||
|
<radio class="round margin-right-xs" :checked="index === touchCurrent" :value="touch.value"></radio> |
||||
|
<text class="flex-sub" style="font-size: 34rpx;">{{ touch.name }}</text> |
||||
|
</label> |
||||
|
</view> |
||||
|
</view> |
||||
|
</radio-group> |
||||
|
</view> |
||||
|
<view class="cu-form-group flex flex-direction padding-tb"> |
||||
|
<view class="title padding-bottom-sm"><span class="text-red padding-right-xs">*</span>当前体温（℃）</view> |
||||
|
<input placeholder="请输入当前真实体温" name="input" type="number" v-model="temperature" /> |
||||
|
</view> |
||||
|
</form> |
||||
|
|
||||
|
<view class="margin flex flex-wrap"> |
||||
|
<view @click="agree = !agree" class="iconfont agree-box" :class="[agree ? 'text-blue icon-check-square': 'text-gray icon-border']"></view> |
||||
|
<view class="text-df text-black flex-sub agree-text"> |
||||
|
以上信息是我本人填写，本人对信息的真实性和完整性负责。 |
||||
|
</view> |
||||
|
</view> |
||||
|
<button class="bg-cyan margin primary-btn" hover-class="cc-active" @tap="addStroke">确认提交</button> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { showToast } from 'common/script/util'; |
||||
|
|
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
area: '', |
||||
|
city: '', |
||||
|
status: [ |
||||
|
{ |
||||
|
value: '0', |
||||
|
name: '正常', |
||||
|
}, |
||||
|
{ |
||||
|
value: '1', |
||||
|
name: '发烧（377.3度以上）', |
||||
|
}, |
||||
|
{ |
||||
|
value: '2', |
||||
|
name: '咳嗽', |
||||
|
}, |
||||
|
{ |
||||
|
value: '3', |
||||
|
name: '咽喉疼痛', |
||||
|
}, |
||||
|
{ |
||||
|
value: '4', |
||||
|
name: '流鼻涕', |
||||
|
}, |
||||
|
{ |
||||
|
value: '5', |
||||
|
name: '头痛', |
||||
|
}, |
||||
|
{ |
||||
|
value: '6', |
||||
|
name: '其他', |
||||
|
} |
||||
|
], |
||||
|
hospital: '', |
||||
|
tours: [ |
||||
|
{ |
||||
|
value: 1, |
||||
|
name: '是' |
||||
|
}, |
||||
|
{ |
||||
|
value: 0, |
||||
|
name: '否' |
||||
|
} |
||||
|
], |
||||
|
touches: [ |
||||
|
{ |
||||
|
value: 1, |
||||
|
name: '是' |
||||
|
}, |
||||
|
{ |
||||
|
value: 0, |
||||
|
name: '否' |
||||
|
} |
||||
|
], |
||||
|
temperature: '', |
||||
|
current: 0, |
||||
|
tourCurrent: 0, |
||||
|
touchCurrent: 0, |
||||
|
agree: false, |
||||
|
}; |
||||
|
}, |
||||
|
methods: { |
||||
|
// 状态 |
||||
|
StateChange: function(evt) { |
||||
|
for (let i = 0; i < this.status.length; i++) { |
||||
|
if (this.status[i].value === evt.target.value) { |
||||
|
this.current = i; |
||||
|
break; |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
// 旅游 |
||||
|
TourChange: function(evt) { |
||||
|
for (let i = 0; i < this.tours.length; i++) { |
||||
|
if (this.tours[i].value === evt.target.value) { |
||||
|
this.tourCurrent = i; |
||||
|
break; |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
// 接触 |
||||
|
TouchChange: function(evt) { |
||||
|
for (let i = 0; i < this.touches.length; i++) { |
||||
|
if (this.touches[i].value === evt.target.value) { |
||||
|
this.touchCurrent = i; |
||||
|
break; |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 提交基本信息 |
||||
|
*/ |
||||
|
addStroke() { |
||||
|
if (!this.area) { |
||||
|
showToast('请输入当前所在地区'); |
||||
|
return; |
||||
|
} |
||||
|
if (!this.city) { |
||||
|
showToast('请输入当前所在城市'); |
||||
|
return; |
||||
|
} |
||||
|
if (!this.status) { |
||||
|
showToast('请选择状态'); |
||||
|
return; |
||||
|
} |
||||
|
if (!this.temperature) { |
||||
|
showToast('请输入当前体温'); |
||||
|
return; |
||||
|
} |
||||
|
if (!this.agree) { |
||||
|
showToast('请确定是否为本人填写'); |
||||
|
return; |
||||
|
} |
||||
|
console.log('信息提交'); |
||||
|
uni.reLaunch({ |
||||
|
url: `/pages/index/index`, |
||||
|
}); |
||||
|
}, |
||||
|
|
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.agree-box{ |
||||
|
width: 70rpx; |
||||
|
} |
||||
|
.agree-text{ |
||||
|
line-height: 60rpx; |
||||
|
} |
||||
|
.primary-btn{ |
||||
|
border-radius: 15rpx; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,63 @@ |
|||||
|
<template> |
||||
|
<view class="wrap"> |
||||
|
<!-- 头部菜单 --> |
||||
|
<view class="nav-wrap slide-bottom"> |
||||
|
<uni-segmented-control |
||||
|
:active-color="activeColor" |
||||
|
:current="current" |
||||
|
:values="values" |
||||
|
@clickItem="handleClickNav" |
||||
|
class="nav" |
||||
|
/> |
||||
|
</view> |
||||
|
<!-- 内容区 --> |
||||
|
<view class="content"> |
||||
|
<!-- 今日打卡地图显示 --> |
||||
|
<history-map v-if="current === 0" /> |
||||
|
<!-- 打卡记录 时间轴显示 --> |
||||
|
<timeline v-else /> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
current: 0, |
||||
|
values: ['今日打卡', '打卡记录'], |
||||
|
activeColor: '#0897C7', |
||||
|
}; |
||||
|
}, |
||||
|
methods: { |
||||
|
handleClickNav({ currentIndex }) { |
||||
|
this.current = currentIndex; |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.wrap { |
||||
|
padding-top: 88rpx; |
||||
|
min-height: 100vh; |
||||
|
background-color: $white; |
||||
|
|
||||
|
.nav-wrap { |
||||
|
z-index: 999; |
||||
|
position: fixed; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
top: 0; |
||||
|
|
||||
|
display: flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
height: 88rpx; |
||||
|
background-color: $white; |
||||
|
.nav { |
||||
|
width: 540rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
|
After Width: | Height: | Size: 1.4 KiB |
Loading…
Reference in new issue