@@ -92,7 +92,7 @@ | |||||
cancelText: "取消", | cancelText: "取消", | ||||
confirmText: "确认", | confirmText: "确认", | ||||
confirmColor: '#165DFF', | confirmColor: '#165DFF', | ||||
cancelColor: '#9E9E9E', | |||||
cancelColor: '#165DFF', | |||||
success: function (res) { | success: function (res) { | ||||
if (res.confirm) { | if (res.confirm) { | ||||
resolve(true) | resolve(true) | ||||
@@ -3,9 +3,11 @@ | |||||
<myCell v-show="cellVisible" :title="title_" isLink :border="false" :hasValue="value?true:false" | <myCell v-show="cellVisible" :title="title_" isLink :border="false" :hasValue="value?true:false" | ||||
@click="cellClick"></myCell> | @click="cellClick"></myCell> | ||||
<u-popup :show="show" mode="center" :round="10" @close="close" @open="open"> | <u-popup :show="show" mode="center" :round="10" @close="close" @open="open"> | ||||
<u-radio-group v-model="value_" iconPlacement="right" placement="column" @change="change" borderBottom> | |||||
<u-radio v-for="(item,index) in options" :key="index" :label="item.label" :name="item.value"></u-radio> | |||||
</u-radio-group> | |||||
<view style="max-height: 800rpx;overflow-y: auto;"> | |||||
<u-radio-group v-model="value_" iconPlacement="right" placement="column" @change="change" borderBottom> | |||||
<u-radio v-for="(item,index) in options" :key="index" :label="item.label" :name="item.value"></u-radio> | |||||
</u-radio-group> | |||||
</view> | |||||
</u-popup> | </u-popup> | ||||
</view> | </view> | ||||
</template> | </template> | ||||
@@ -79,7 +81,6 @@ | |||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
.u-radio-group { | .u-radio-group { | ||||
width: 560rpx; | width: 560rpx; | ||||
height: 680rpx; | |||||
overflow-y: auto; | overflow-y: auto; | ||||
padding: 12rpx 32rpx 24rpx 32rpx; | padding: 12rpx 32rpx 24rpx 32rpx; | ||||
@@ -1,29 +1,28 @@ | |||||
<template> | <template> | ||||
<view @touchmove.stop @touch.stop> | <view @touchmove.stop @touch.stop> | ||||
<myCell v-show="cellVisible" :multiple="multiple" :hasValue="value&&value.length?true:false" :cellValue="cellValue" :title="title_" isLink :border="false" @click="show = true"> | |||||
<myCell v-show="cellVisible" :multiple="multiple" :hasValue="value?true:false" :cellValue="cellValue" | |||||
:title="title_" isLink :border="false" @click="show = true"> | |||||
</myCell> | </myCell> | ||||
<u-popup :show="show" mode="bottom" :closeable="true" :round="10" @close="close" @open="open"> | <u-popup :show="show" mode="bottom" :closeable="true" :round="10" @close="close" @open="open"> | ||||
<view> | <view> | ||||
<view class="title"> | <view class="title"> | ||||
{{popupTitle}} | {{popupTitle}} | ||||
</view> | </view> | ||||
<view v-if="filterable" style="padding: 0 30rpx 30rpx 30rpx"> | |||||
<u-search v-model="searchText" :placeholder="searchPlaceholder" shape="round" | |||||
<view v-if="filterable" style="padding: 0rpx 30rpx 30rpx 30rpx;"> | |||||
<u-search height="90rpx" :inputStyle="{fontSize:'30rpx'}" v-model="searchText" :placeholder="searchPlaceholder" shape="square" | |||||
:showAction="false"></u-search> | :showAction="false"></u-search> | ||||
</view> | </view> | ||||
<u-radio-group v-if="!multiple" :value="value_" iconPlacement="right" placement="column" | |||||
@change="change" borderBottom> | |||||
<u-radio v-show="item.label.includes(searchText)" v-for="(item,index) in options" :key="index" | |||||
<u-radio-group v-if="!multiple" v-model="value_" iconPlacement="right" placement="column" borderBottom> | |||||
<u-radio labelSize="30rpx" v-show="item.label.includes(searchText)" v-for="(item,index) in options" :key="index" | |||||
:label="item.label" :name="item.value"></u-radio> | :label="item.label" :name="item.value"></u-radio> | ||||
</u-radio-group> | </u-radio-group> | ||||
<u-checkbox-group v-else v-model="value_" iconPlacement="right" placement="column" @change="change" | |||||
borderBottom> | |||||
<u-checkbox v-show="item.label.includes(searchText)" v-for="(item, index) in options" :key="index" | |||||
<u-checkbox-group v-else v-model="value_" iconPlacement="right" placement="column" borderBottom> | |||||
<u-checkbox labelSize="30rpx" v-show="item.label.includes(searchText)" v-for="(item, index) in options" :key="index" | |||||
:label="item.label" :name="item.value"> | :label="item.label" :name="item.value"> | ||||
</u-checkbox> | </u-checkbox> | ||||
</u-checkbox-group> | </u-checkbox-group> | ||||
<view style="padding: 36rpx 50rpx"> | <view style="padding: 36rpx 50rpx"> | ||||
<u-button @click="cofirm" type="primary" style="border-radius: 36rpx;height: 72rpx;" | |||||
<u-button @click="cofirm" type="primary" style="border-radius: 45rpx;height: 90rpx;font-weight: 700;font-size: 32rpx;" | |||||
text="确定"></u-button> | text="确定"></u-button> | ||||
</view> | </view> | ||||
</view> | </view> | ||||
@@ -51,8 +50,8 @@ | |||||
default: true, | default: true, | ||||
}, | }, | ||||
// cell回显默认文字 | // cell回显默认文字 | ||||
placeholder:{ | |||||
default:'请选择' | |||||
placeholder: { | |||||
default: '请选择' | |||||
}, | }, | ||||
// 弹框标题 | // 弹框标题 | ||||
popupTitle: { | popupTitle: { | ||||
@@ -80,15 +79,14 @@ | |||||
data() { | data() { | ||||
return { | return { | ||||
show: false, | show: false, | ||||
title_: this.title||this.placeholder, | |||||
title_: this.title || this.placeholder, | |||||
value_: this.value, | value_: this.value, | ||||
gruopValue: '', | |||||
searchText: '', | searchText: '', | ||||
cellValue:[], | |||||
cellValue: [], | |||||
}; | }; | ||||
}, | }, | ||||
mounted() { | mounted() { | ||||
if (this.multiple) this.gruopValue = [] | |||||
if (this.multiple) this.value_ = [] | |||||
if (!this.multiple) { | if (!this.multiple) { | ||||
let obj = this.options.find(e1 => e1.value == this.value) | let obj = this.options.find(e1 => e1.value == this.value) | ||||
if (obj) this.title_ = obj.label | if (obj) this.title_ = obj.label | ||||
@@ -102,7 +100,7 @@ | |||||
this.show = false | this.show = false | ||||
}, | }, | ||||
open() { | open() { | ||||
if (this.multiple) this.gruopValue = [] | |||||
if (this.multiple) this.value_ = [] | |||||
if (!this.multiple) { | if (!this.multiple) { | ||||
let obj = this.options.find(e1 => e1.value == this.value) | let obj = this.options.find(e1 => e1.value == this.value) | ||||
if (obj) this.title_ = obj.label | if (obj) this.title_ = obj.label | ||||
@@ -114,17 +112,14 @@ | |||||
this.searchText = '' | this.searchText = '' | ||||
this.show = true | this.show = true | ||||
}, | }, | ||||
change(e) { | |||||
this.gruopValue = e | |||||
}, | |||||
cofirm() { | cofirm() { | ||||
this.$emit("input", this.gruopValue) | |||||
this.$emit("change", this.gruopValue) | |||||
this.$emit("input", this.value_) | |||||
this.$emit("change", this.value_) | |||||
if (!this.multiple) { | if (!this.multiple) { | ||||
let obj = this.options.find(e1 => e1.value == this.gruopValue) | |||||
let obj = this.options.find(e1 => e1.value == this.value_) | |||||
if (obj) this.title_ = obj.label | if (obj) this.title_ = obj.label | ||||
} else { | } else { | ||||
let arr = this.options.filter(e1 => this.gruopValue.includes(e1.value)) | |||||
let arr = this.options.filter(e1 => this.value_.includes(e1.value)) | |||||
this.cellValue = arr.map(e => e.label) | this.cellValue = arr.map(e => e.label) | ||||
} | } | ||||
this.close() | this.close() | ||||
@@ -135,36 +130,24 @@ | |||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
.title { | .title { | ||||
color: #000000; | |||||
font-size: 32rpx; | |||||
color: #333; | |||||
font-size: 34rpx; | |||||
text-align: center; | text-align: center; | ||||
line-height: 100rpx; | line-height: 100rpx; | ||||
} | } | ||||
.u-radio-group { | |||||
width: 92%; | |||||
height: 680rpx; | |||||
overflow-y: auto; | |||||
padding: 0 30rpx; | |||||
.u-cell { | |||||
background-color: #fff; | |||||
border-radius: 20rpx 20rpx 0 0; | |||||
padding: 24rpx 0; | |||||
} | |||||
} | |||||
.u-checkbox-group { | |||||
.u-checkbox-group,.u-radio-group { | |||||
width: 92%; | width: 92%; | ||||
max-height: 680rpx; | |||||
min-height: 360rpx; | |||||
height: 780rpx; | |||||
overflow-y: auto; | overflow-y: auto; | ||||
padding: 0 30rpx; | padding: 0 30rpx; | ||||
box-shadow: inset 0 0 20rpx rgba(0, 0, 0, 0.08); | |||||
.u-cell { | |||||
background-color: #fff; | |||||
border-radius: 20rpx 20rpx 0 0; | |||||
padding: 24rpx 0; | |||||
.u-radio,.u-checkbox { | |||||
height: 98rpx; | |||||
box-sizing: border-box; | |||||
padding-bottom: 0rpx!important; | |||||
margin-top: 0rpx!important; | |||||
} | } | ||||
} | } | ||||
@@ -205,7 +205,7 @@ | |||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
.title { | .title { | ||||
color: #000000; | |||||
color: #333; | |||||
font-size: 32rpx; | font-size: 32rpx; | ||||
text-align: center; | text-align: center; | ||||
line-height: 100rpx; | line-height: 100rpx; | ||||
@@ -213,20 +213,7 @@ | |||||
.u-radio-group { | .u-radio-group { | ||||
width: 92%; | width: 92%; | ||||
height: 680rpx; | |||||
overflow-y: auto; | |||||
padding: 0 30rpx; | |||||
.u-cell { | |||||
background-color: #fff; | |||||
border-radius: 20rpx 20rpx 0 0; | |||||
padding: 24rpx 0; | |||||
} | |||||
} | |||||
.u-checkbox-group { | |||||
width: 92%; | |||||
height: 680rpx; | |||||
height: 780rpx; | |||||
overflow-y: auto; | overflow-y: auto; | ||||
padding: 0 30rpx; | padding: 0 30rpx; | ||||
@@ -57,25 +57,17 @@ | |||||
"path" : "pages/work/returnBed/detail", | "path" : "pages/work/returnBed/detail", | ||||
"style" : | "style" : | ||||
{ | { | ||||
"navigationBarTitleText": "查看详情", | |||||
"enablePullDownRefresh": false | |||||
} | |||||
}, | |||||
{ | |||||
"path" : "pages/work/returnBed/comfirm", | |||||
"style" : | |||||
{ | |||||
"navigationBarTitleText": "归寝确认", | |||||
"navigationBarTitleText": "归寝", | |||||
"enablePullDownRefresh": false | "enablePullDownRefresh": false | ||||
} | } | ||||
}, | }, | ||||
// 客流 | |||||
{ | { | ||||
"path": "pages/work/passengerFlow/index", | "path": "pages/work/passengerFlow/index", | ||||
"style": { | "style": { | ||||
"navigationBarTitleText": "客流" | "navigationBarTitleText": "客流" | ||||
} | } | ||||
}, | }, | ||||
// 客流 | |||||
{ | { | ||||
"path" : "pages/work/passengerFlow/detail", | "path" : "pages/work/passengerFlow/detail", | ||||
"style" : | "style" : | ||||
@@ -84,14 +76,6 @@ | |||||
"enablePullDownRefresh": false | "enablePullDownRefresh": false | ||||
} | } | ||||
}, | }, | ||||
{ | |||||
"path" : "pages/work/passengerFlow/add", | |||||
"style" : | |||||
{ | |||||
"navigationBarTitleText": "新增查询", | |||||
"enablePullDownRefresh": false | |||||
} | |||||
}, | |||||
// 点名 | // 点名 | ||||
{ | { | ||||
"path": "pages/work/rollCall/index", | "path": "pages/work/rollCall/index", | ||||
@@ -103,7 +87,7 @@ | |||||
"path" : "pages/work/rollCall/detail", | "path" : "pages/work/rollCall/detail", | ||||
"style" : | "style" : | ||||
{ | { | ||||
"navigationBarTitleText": "查看详情", | |||||
"navigationBarTitleText": "查看", | |||||
"enablePullDownRefresh": false | "enablePullDownRefresh": false | ||||
} | } | ||||
}, | }, | ||||
@@ -137,7 +121,8 @@ | |||||
{ | { | ||||
"path": "pages/my/index", | "path": "pages/my/index", | ||||
"style": { | "style": { | ||||
"navigationBarTitleText": "我的" | |||||
"navigationBarTitleText": "我的", | |||||
"navigationStyle": "custom" | |||||
} | } | ||||
} | } | ||||
], | ], | ||||
@@ -1,6 +1,74 @@ | |||||
<template> | <template> | ||||
<view> | |||||
我的 | |||||
<view style="padding: 0 30rpx;"> | |||||
<view class="header"> | |||||
<view style="padding-top: 44rpx;" class="headerContent"> | |||||
<u-avatar src="/static/image/test/test.png" size="180rpx"></u-avatar> | |||||
<view class="right"> | |||||
<view class="name"> | |||||
张云 | |||||
</view> | |||||
<view class="des"> | |||||
<image src="/static/image/school.png" mode=""></image> | |||||
山西科技大学 | 校长 | |||||
</view> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
<view class="whiteCard"> | |||||
<view class="title"> | |||||
个人信息 | |||||
</view> | |||||
<u-cell title="账号" :titleStyle="{fontSize:'28rpx',color:'#333'}" :border="false"> | |||||
<view slot="value" class="valueBox disabled"> | |||||
543asd25a1 | |||||
</view> | |||||
</u-cell> | |||||
<u-cell title="姓名" :titleStyle="{fontSize:'28rpx',color:'#333'}" :border="false" isLink | |||||
@click="cellClick('修改姓名')"> | |||||
<view slot="value" class="valueBox"> | |||||
杨云 | |||||
</view> | |||||
</u-cell> | |||||
<u-cell title="手机" :titleStyle="{fontSize:'28rpx',color:'#333'}" :border="false" isLink | |||||
@click="cellClick('修改手机号')"> | |||||
<view slot="value" class="valueBox"> | |||||
18633460001 | |||||
</view> | |||||
</u-cell> | |||||
<u-cell title="昵称" :titleStyle="{fontSize:'28rpx',color:'#333'}" :border="false" isLink | |||||
@click="cellClick('设置昵称')"> | |||||
<view slot="value" class="valueBox"> | |||||
未设置 | |||||
</view> | |||||
</u-cell> | |||||
<picker mode="date" :value="date" @change="dateChange"> | |||||
<u-cell title="出生日期" :titleStyle="{fontSize:'28rpx',color:'#333'}" :border="false" isLink> | |||||
<view slot="value" class="valueBox"> | |||||
{{date}} | |||||
</view> | |||||
</u-cell> | |||||
</picker> | |||||
</view> | |||||
<view class="btn" @click="loginOut"> | |||||
退出登录 | |||||
</view> | |||||
<u-popup :show="show" mode="center" :round="10"> | |||||
<view class="popupInfo"> | |||||
<view class="title"> | |||||
{{this.action}} | |||||
</view> | |||||
<u--input v-model="inputValue" placeholder="请输入" border="surround" clearable></u--input> | |||||
<view class="bottom"> | |||||
<view class="cancel" @click="cancel"> | |||||
取消 | |||||
</view> | |||||
<view class="confirm" @click="confirm"> | |||||
确定 | |||||
</view> | |||||
</view> | |||||
</view> | |||||
</u-popup> | |||||
</view> | </view> | ||||
</template> | </template> | ||||
@@ -8,15 +76,190 @@ | |||||
export default { | export default { | ||||
data() { | data() { | ||||
return { | return { | ||||
show: false, | |||||
action: '', | |||||
inputValue: '', | |||||
date: '1990-06-15', | |||||
} | } | ||||
}, | }, | ||||
mounted() {}, | |||||
methods: { | methods: { | ||||
cellClick(action) { | |||||
this.action = action | |||||
this.inputValue = '' | |||||
this.show = true | |||||
}, | |||||
confirm() { | |||||
switch (this.action) { | |||||
case '修改姓名': | |||||
if (!this.inputValue) { | |||||
this.TOAST('请输入姓名') | |||||
return | |||||
} | |||||
break | |||||
case '修改手机号': | |||||
if (!this.inputValue) { | |||||
this.TOAST('请输入手机号') | |||||
return | |||||
} | |||||
if (! | |||||
/^(?:(?:\+|00)86)?1(?:(?:3[\d])|(?:4[5-79])|(?:5[0-35-9])|(?:6[5-7])|(?:7[0-8])|(?:8[\d])|(?:9[1589]))\d{8}$/ | |||||
.test(this.inputValue)) { | |||||
this.TOAST('请输入正确的手机号') | |||||
return | |||||
} | |||||
break | |||||
case '设置昵称': | |||||
if (!this.inputValue) { | |||||
this.TOAST('请输入昵称') | |||||
return | |||||
} | |||||
break | |||||
} | |||||
}, | |||||
cancel() { | |||||
this.show = false | |||||
}, | |||||
dateChange(e) { | |||||
this.date = e.detail.value | |||||
}, | |||||
loginOut() { | |||||
this.CONFIRM('您是否确认退出登录?') | |||||
} | |||||
} | } | ||||
} | } | ||||
</script> | </script> | ||||
<style> | |||||
<style scoped lang="scss"> | |||||
uni-page-body { | |||||
background-image: url('/static/image/mybg.png'); | |||||
background-position: top; | |||||
background-size: 100% auto; | |||||
background-repeat: no-repeat; | |||||
} | |||||
.header { | |||||
padding-top: 88rpx; | |||||
color: #333; | |||||
.headerContent { | |||||
display: flex; | |||||
} | |||||
.right { | |||||
flex: 1; | |||||
padding-top: 24rpx; | |||||
padding-left: 36rpx; | |||||
.name { | |||||
font-size: 46rpx; | |||||
font-weight: 700; | |||||
} | |||||
.des { | |||||
display: flex; | |||||
font-size: 28rpx; | |||||
margin-top: 30rpx; | |||||
uni-image { | |||||
width: 34rpx; | |||||
height: 34rpx; | |||||
margin-right: 12rpx; | |||||
} | |||||
} | |||||
} | |||||
} | |||||
.whiteCard { | |||||
background-color: #fff; | |||||
border-radius: 20rpx; | |||||
margin-top: 50rpx; | |||||
// padding: 0 30rpx; | |||||
.title { | |||||
font-weight: 700; | |||||
color: #2388FF; | |||||
font-size: 42rpx; | |||||
padding: 50rpx 30rpx 30rpx; | |||||
} | |||||
} | |||||
.u-cell { | |||||
height: 90rpx; | |||||
position: relative; | |||||
</style> | |||||
&:not(&:last-child)::after { | |||||
content: ''; | |||||
display: block; | |||||
position: absolute; | |||||
height: 1rpx; | |||||
background-color: rgba(0, 0, 0, 0.1); | |||||
width: calc(100% - 60rpx); | |||||
left: 30rpx; | |||||
bottom: 0rpx; | |||||
} | |||||
.valueBox { | |||||
color: #333; | |||||
font-size: 30rpx; | |||||
font-weight: 700; | |||||
&.disabled { | |||||
font-weight: unset; | |||||
} | |||||
} | |||||
} | |||||
.btn { | |||||
height: 98rpx; | |||||
background-color: #fff; | |||||
line-height: 98rpx; | |||||
border-radius: 20rpx; | |||||
text-align: center; | |||||
color: #333; | |||||
margin-top: 30rpx; | |||||
font-size: 32rpx; | |||||
} | |||||
.popupInfo { | |||||
padding: 30rpx 30rpx 0rpx; | |||||
width: 540rpx; | |||||
box-sizing: border-box; | |||||
.title { | |||||
font-size: 34rpx; | |||||
font-weight: 700; | |||||
text-align: center; | |||||
margin-bottom: 30rpx; | |||||
margin-top: 16rpx; | |||||
} | |||||
.bottom { | |||||
margin-top: 30rpx; | |||||
display: flex; | |||||
line-height: 88rpx; | |||||
border-top: 1rpx solid rgba(0, 0, 0, 0.1); | |||||
margin-left: -30rpx; | |||||
margin-right: -30rpx; | |||||
position: relative; | |||||
&::after { | |||||
content: ''; | |||||
background-color: rgba(0, 0, 0, 0.1); | |||||
display: block; | |||||
position: absolute; | |||||
width: 1rpx; | |||||
height: 100%; | |||||
left: 50%; | |||||
top: 0; | |||||
} | |||||
&>* { | |||||
width: 50%; | |||||
text-align: center; | |||||
color: #165DFF; | |||||
font-weight: 32rpx; | |||||
} | |||||
} | |||||
} | |||||
</style> |
@@ -1,98 +0,0 @@ | |||||
<template> | |||||
<view style="padding-top: 30rpx;"> | |||||
<view class="whiteCard"> | |||||
<u--form labelPosition="top" :labelStyle="{fontSize:'32rpx',color:'#666'}" labelWidth="200" :model="form" :rules="rules" ref="uForm"> | |||||
<u-form-item label="摄像头(多选)" prop="name" borderBottom> | |||||
<view | |||||
style="width: 160%;margin-left: -30rpx;margin-right: -30rpx;margin-bottom: -20rpx;margin-top: -10rpx;"> | |||||
<selectSearch :value.sync="form.shexiangtou" | |||||
:options="[{value:1,label:'走廊尽头(海康)'},{value:2,label:'厨房(海康)'},{value:3,label:'走廊尽头(海康)'},{value:4,label:'厨房(海康)'}]" | |||||
placeholder="请选择摄像头" :filterable="false" multiple /> | |||||
</view> | |||||
</u-form-item> | |||||
<u-form-item label="查询时间段" prop="timeslot" borderBottom> | |||||
<uni-datetime-picker v-model="form.tick" type="datetimerange"> | |||||
<view class="demo-layout"> | |||||
<view> | |||||
{{form.tick.length?form.tick.join('-'):'请选择'}} | |||||
</view> | |||||
<image style="width: 30rpx;height:30rpx;" | |||||
src="@/static/image/earlyWarning/calendar.png" mode="aspectFill"></image> | |||||
</view> | |||||
</uni-datetime-picker> | |||||
</u-form-item> | |||||
<u-form-item label="系部/专业/班级" prop="timeslot" borderBottom> | |||||
<view | |||||
style="width: 160%;margin-left: -30rpx;margin-right: -30rpx;margin-bottom: -20rpx;margin-top: -10rpx;"> | |||||
<selectTree v-model="form.departCalss" :labels.sync="form.departCalssName"/> | |||||
</view> | |||||
</u-form-item> | |||||
<u-form-item labelPosition="left" label="分片类型(天/小时)" prop="timeslot" borderBottom> | |||||
<u-radio-group v-model="form.type"> | |||||
<u-radio v-for="(item,index) in [{value:'1',label:'天'},{value:'2',label:'小时'}]" :key="index" :label="item.label" | |||||
:name="item.value"></u-radio> | |||||
</u-radio-group> | |||||
</u-form-item> | |||||
</u--form> | |||||
</view> | |||||
<view style="padding: 36rpx 30rpx;position: fixed;bottom: 0;width: 100%;box-sizing: border-box;"> | |||||
<u-button @click="confirm" type="primary" style="border-radius: 36rpx;height: 72rpx;" | |||||
text="确定"></u-button> | |||||
</view> | |||||
</view> | |||||
</template> | |||||
<script> | |||||
import selectSearch from "@/components/selectSearch.vue" | |||||
import selectTree from "@/components/selectTree.vue" | |||||
export default { | |||||
components: { | |||||
selectSearch, | |||||
selectTree | |||||
}, | |||||
data() { | |||||
return { | |||||
form: { | |||||
shexiangtou: [], | |||||
tick: [], | |||||
}, | |||||
rules: [] | |||||
} | |||||
}, | |||||
methods: { | |||||
confirm(){ | |||||
this.CONFIRM(`是否确认新增查询?`).then(()=>{ | |||||
}) | |||||
} | |||||
} | |||||
} | |||||
</script> | |||||
<style scoped lang="scss"> | |||||
.whiteCard { | |||||
padding: 30rpx 30rpx; | |||||
margin: 15rpx 30rpx; | |||||
border-radius: 18rpx; | |||||
background-color: #ffffff; | |||||
font-size: 32rpx; | |||||
} | |||||
.demo-layout{ | |||||
display: flex; | |||||
padding: 15rpx 0; | |||||
justify-content: space-between; | |||||
align-items: center; | |||||
&:first-child{ | |||||
flex: 1; | |||||
padding-right:30rpx; | |||||
} | |||||
} | |||||
.u-radio-group{ | |||||
&>*:first-child{ | |||||
margin-right: 36rpx; | |||||
} | |||||
} | |||||
</style> |
@@ -21,7 +21,7 @@ | |||||
export default { | export default { | ||||
data() { | data() { | ||||
return { | return { | ||||
list: [{},{},{}], | |||||
list: [{},{},{},{},{},{},{},{},{}], | |||||
} | } | ||||
}, | }, | ||||
methods: {} | methods: {} | ||||
@@ -31,5 +31,19 @@ | |||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
.table{ | .table{ | ||||
padding: 30rpx; | padding: 30rpx; | ||||
tr:nth-child(2n+1){ | |||||
background-color: #F2F8FF!important; | |||||
} | |||||
tr:first-child{ | |||||
background-color: #F5F5F5!important; | |||||
} | |||||
th{ | |||||
color: #777777; | |||||
font-size: 28rpx; | |||||
} | |||||
td{ | |||||
color: #333333; | |||||
font-size: 28rpx; | |||||
} | |||||
} | } | ||||
</style> | </style> |
@@ -1,7 +1,7 @@ | |||||
<template> | <template> | ||||
<view style="height: 100%;"> | <view style="height: 100%;"> | ||||
<u-empty marginTop="100rpx" :show="false" mode="list" text="暂无数据"></u-empty> | <u-empty marginTop="100rpx" :show="false" mode="list" text="暂无数据"></u-empty> | ||||
<u-list @scrolltolower="scrolltolower" style="height: calc(100% - 0rpx);"> | |||||
<u-list @scrolltolower="scrolltolower" style="height: calc(100% - 29rpx);padding-top:29rpx"> | |||||
<u-list-item v-for="(item, index) in list" :key="index"> | <u-list-item v-for="(item, index) in list" :key="index"> | ||||
<view class="whiteCard"> | <view class="whiteCard"> | ||||
<view class="row1"> | <view class="row1"> | ||||
@@ -26,7 +26,7 @@ | |||||
</view> | </view> | ||||
</view> | </view> | ||||
<view class="bottom"> | <view class="bottom"> | ||||
<view class="btn" @click="NAV_TO('./passengerFlow/detail')"> | |||||
<view class="btn" @click="NAV_TO('./detail')"> | |||||
<image src="@/static/image/see.png" mode="aspectFill"></image> | <image src="@/static/image/see.png" mode="aspectFill"></image> | ||||
<text>分片详情</text> | <text>分片详情</text> | ||||
</view> | </view> | ||||
@@ -35,7 +35,6 @@ | |||||
</u-list-item> | </u-list-item> | ||||
<u-loadmore :status="status" /> | <u-loadmore :status="status" /> | ||||
</u-list> | </u-list> | ||||
<image class="addBtn" @click="NAV_TO('./passengerFlow/add')" src="@/static/image/add.png" mode="aspectFill"></image> | |||||
</view> | </view> | ||||
</template> | </template> | ||||
@@ -98,12 +97,14 @@ | |||||
.whiteCard { | .whiteCard { | ||||
background-color: #fff; | background-color: #fff; | ||||
border-radius: 18rpx; | border-radius: 18rpx; | ||||
margin: 12rpx 28rpx; | |||||
margin: 14rpx 28rpx; | |||||
padding: 30rpx; | padding: 30rpx; | ||||
padding-bottom: 24rpx; | |||||
color: #333333; | color: #333333; | ||||
.row1 { | .row1 { | ||||
font-size: 32rpx; | font-size: 32rpx; | ||||
font-weight: 700; | |||||
} | } | ||||
.row2 { | .row2 { | ||||
@@ -145,7 +146,7 @@ | |||||
display: flex; | display: flex; | ||||
border-top: 1rpx solid rgba(0, 0, 0, 0.1); | border-top: 1rpx solid rgba(0, 0, 0, 0.1); | ||||
margin-top: 24rpx; | margin-top: 24rpx; | ||||
padding-top: 22rpx; | |||||
padding-top: 24rpx; | |||||
position: relative; | position: relative; | ||||
.btn { | .btn { | ||||
@@ -1,154 +0,0 @@ | |||||
<template> | |||||
<view style="height: 100%;"> | |||||
<view class="title"> | |||||
<image src="@/static/image/home1.png" mode="aspectFill" style="width: 40rpx;height: 40rpx;margin-right: 8rpx;"> | |||||
</image> | |||||
寝室104 | |||||
</view> | |||||
<view class="time"> | |||||
2024年8月24日 18:00:00 ~ 18:59:00 | |||||
</view> | |||||
<view style="height: calc(100% - 300rpx);overflow: auto;"> | |||||
<u-checkbox-group v-model="checkboxValue" class="list" placement="column"> | |||||
<view v-for="(item, index) in list" :key="index" class="item"> | |||||
<u-checkbox :name="item.name" shape="circle" label=""></u-checkbox> | |||||
<view class="right"> | |||||
<image src="@/static/image/test/test.png" mode="aspectFill" style="width: 160rpx;height: 160rpx;"></image> | |||||
<view class="des"> | |||||
<view class="name"> | |||||
杨云 | |||||
</view> | |||||
<view class="depart"> | |||||
系部:安环部 | |||||
</view> | |||||
<view class="bottom"> | |||||
<view class="major">专业:环艺</view> | |||||
<view class="class">班级:第二班</view> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
</u-checkbox-group> | |||||
</view> | |||||
<view class="returnConfirm"> | |||||
<u-checkbox-group><u-checkbox shape="circle" label="全选" name="" | |||||
@change="radioChange"></u-checkbox></u-checkbox-group> | |||||
<view class="right"> | |||||
<u-button @click="returnConfirm" type="primary" | |||||
style="border-radius: 36rpx;height: 72rpx;margin-left:16rpx" :text="`确定归寝(${checkboxValue.length})`"></u-button> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
</view> | |||||
</template> | |||||
<script> | |||||
export default { | |||||
data() { | |||||
return { | |||||
list: [{ | |||||
name: 1 | |||||
}, { | |||||
name: 2 | |||||
}, { | |||||
name: 3 | |||||
}], | |||||
checkboxValue: [], | |||||
} | |||||
}, | |||||
methods: { | |||||
radioChange(e) { | |||||
if (e) { | |||||
let ids = this.list.map(e => e.name) | |||||
this.checkboxValue = ids | |||||
} else { | |||||
this.checkboxValue = [] | |||||
} | |||||
}, | |||||
returnConfirm() { | |||||
console.log(this.checkboxValue) | |||||
this.CONFIRM('是否确认归寝?').then(()=>{ | |||||
}) | |||||
} | |||||
} | |||||
} | |||||
</script> | |||||
<style scoped lang="scss"> | |||||
.title { | |||||
display: flex; | |||||
color: #333333; | |||||
padding: 26rpx; | |||||
background: #fff; | |||||
border-top: 1rpx solid rgba(0, 0, 0, 0.03); | |||||
font-size: 30rpx; | |||||
} | |||||
.time { | |||||
color: #333333; | |||||
font-size: 28rpx; | |||||
padding: 26rpx; | |||||
} | |||||
.list { | |||||
padding: 0 26rpx; | |||||
.item { | |||||
display: flex; | |||||
margin-bottom: 28rpx; | |||||
&:last-child { | |||||
margin-bottom: 0; | |||||
} | |||||
.right { | |||||
margin-left: 12rpx; | |||||
padding: 30rpx; | |||||
flex: 1; | |||||
background-color: #fff; | |||||
border-radius: 18rpx; | |||||
display: flex; | |||||
.des { | |||||
flex: 1; | |||||
padding-left: 24rpx; | |||||
font-size: 26rpx; | |||||
color: #333; | |||||
.name { | |||||
color: #333; | |||||
font-size: 32rpx | |||||
} | |||||
.depart { | |||||
margin-top: 28rpx; | |||||
} | |||||
.bottom { | |||||
margin-top: 18rpx; | |||||
display: flex; | |||||
justify-content: space-between; | |||||
.major {} | |||||
.class {} | |||||
} | |||||
} | |||||
} | |||||
} | |||||
} | |||||
.returnConfirm { | |||||
padding: 30rpx; | |||||
display: flex; | |||||
position: fixed; | |||||
bottom: 0rpx; | |||||
width: 100%; | |||||
box-sizing: border-box; | |||||
.right { | |||||
flex: 1; | |||||
} | |||||
} | |||||
</style> |
@@ -1,7 +1,8 @@ | |||||
<template> | <template> | ||||
<view> | <view> | ||||
<view class="title"> | <view class="title"> | ||||
<image src="@/static/image/home1.png" mode="aspectFill" style="width: 38rpx;height: 38rpx;margin-right: 8rpx;"> | |||||
<image src="@/static/image/home.png" mode="aspectFill" | |||||
style="width: 38rpx;height: 38rpx;margin-right: 8rpx;"> | |||||
</image> | </image> | ||||
寝室104 | 寝室104 | ||||
</view> | </view> | ||||
@@ -10,8 +11,9 @@ | |||||
</view> | </view> | ||||
<view class="list"> | <view class="list"> | ||||
<view v-for="(item, index) in list" :key="index" class="item"> | <view v-for="(item, index) in list" :key="index" class="item"> | ||||
<view class="right"> | |||||
<image src="@/static/image/test/test.png" mode="aspectFill" style="width: 160rpx;height: 160rpx;"></image> | |||||
<view class="topBox"> | |||||
<image src="@/static/image/test/test.png" mode="aspectFill" style="width: 160rpx;height: 160rpx;border-radius:10rpx"> | |||||
</image> | |||||
<view class="des"> | <view class="des"> | ||||
<view class="top"> | <view class="top"> | ||||
<view class="status"> | <view class="status"> | ||||
@@ -30,6 +32,9 @@ | |||||
</view> | </view> | ||||
</view> | </view> | ||||
</view> | </view> | ||||
<view class="returnTime"> | |||||
归寝时间:2024-08-15 11:59:12 | |||||
</view> | |||||
</view> | </view> | ||||
</view> | </view> | ||||
<view class="listTitlte"> | <view class="listTitlte"> | ||||
@@ -37,8 +42,9 @@ | |||||
</view> | </view> | ||||
<view class="list"> | <view class="list"> | ||||
<view v-for="(item, index) in list" :key="index" class="item"> | <view v-for="(item, index) in list" :key="index" class="item"> | ||||
<view class="right"> | |||||
<image src="@/static/image/test/test.png" mode="aspectFill" style="width: 160rpx;height: 160rpx;"></image> | |||||
<view class="topBox"> | |||||
<image src="@/static/image/test/test.png" mode="aspectFill" style="width: 160rpx;height: 160rpx;border-radius:10rpx"> | |||||
</image> | |||||
<view class="des"> | <view class="des"> | ||||
<view class="top"> | <view class="top"> | ||||
<view class="status error"> | <view class="status error"> | ||||
@@ -57,6 +63,9 @@ | |||||
</view> | </view> | ||||
</view> | </view> | ||||
</view> | </view> | ||||
<view class="returnTime"> | |||||
归寝时间:2024-08-15 11:59:12 | |||||
</view> | |||||
</view> | </view> | ||||
</view> | </view> | ||||
</view> | </view> | ||||
@@ -74,11 +83,10 @@ | |||||
}, { | }, { | ||||
name: 3 | name: 3 | ||||
}], | }], | ||||
checkboxValue:[], | |||||
checkboxValue: [], | |||||
} | } | ||||
}, | }, | ||||
methods: { | |||||
} | |||||
methods: {} | |||||
} | } | ||||
</script> | </script> | ||||
@@ -91,29 +99,33 @@ | |||||
border-top: 1rpx solid rgba(0, 0, 0, 0.03); | border-top: 1rpx solid rgba(0, 0, 0, 0.03); | ||||
font-size: 30rpx; | font-size: 30rpx; | ||||
} | } | ||||
.listTitlte{ | |||||
.listTitlte { | |||||
color: #777777; | color: #777777; | ||||
font-size:28rpx; | |||||
padding:18rpx 30rpx; | |||||
font-size: 28rpx; | |||||
padding: 18rpx 30rpx; | |||||
font-weight: 700; | |||||
} | } | ||||
.list { | .list { | ||||
padding: 0 26rpx; | padding: 0 26rpx; | ||||
margin-bottom: 16rpx; | margin-bottom: 16rpx; | ||||
&:last-child{ | |||||
&:last-child { | |||||
padding-bottom: 60rpx; | padding-bottom: 60rpx; | ||||
} | } | ||||
.item { | .item { | ||||
display: flex; | |||||
margin-bottom: 28rpx; | margin-bottom: 28rpx; | ||||
background-color: #fff; | |||||
padding: 30rpx; | |||||
&:last-child { | &:last-child { | ||||
margin-bottom: 0; | margin-bottom: 0; | ||||
} | } | ||||
.right { | |||||
padding: 30rpx; | |||||
.topBox { | |||||
flex: 1; | flex: 1; | ||||
background-color: #fff; | |||||
border-radius: 18rpx; | border-radius: 18rpx; | ||||
display: flex; | display: flex; | ||||
@@ -126,8 +138,9 @@ | |||||
.top { | .top { | ||||
color: #333; | color: #333; | ||||
font-size: 32rpx; | font-size: 32rpx; | ||||
display:flex; | |||||
.status{ | |||||
display: flex; | |||||
.status { | |||||
display: inline-block; | display: inline-block; | ||||
font-size: 24rpx; | font-size: 24rpx; | ||||
line-height: 1.8; | line-height: 1.8; | ||||
@@ -137,9 +150,13 @@ | |||||
border-radius: 8rpx; | border-radius: 8rpx; | ||||
margin-right: 12rpx; | margin-right: 12rpx; | ||||
} | } | ||||
.status.error{ | |||||
.status.error { | |||||
background-color: #EF2D2D; | background-color: #EF2D2D; | ||||
} | } | ||||
.name{ | |||||
font-weight: 700; | |||||
} | |||||
} | } | ||||
.depart { | .depart { | ||||
@@ -160,5 +177,12 @@ | |||||
} | } | ||||
} | } | ||||
} | } | ||||
.returnTime { | |||||
margin-top: 30rpx; | |||||
border-top: 1rpx solid rgba(0, 0, 0, 0.1); | |||||
font-size: 26rpx; | |||||
padding-top: 26rpx; | |||||
} | |||||
} | } | ||||
</style> | </style> |
@@ -3,8 +3,8 @@ | |||||
<view class="searchBox"> | <view class="searchBox"> | ||||
<selectRadio v-model="search.loudong" :options="[{value:1,label:'男生宿舍1号楼'},{value:2,label:'男生宿舍2号楼'},{value:3,label:'女生宿舍1号楼'},{value:4,label:'女生宿舍2号楼'}]" | <selectRadio v-model="search.loudong" :options="[{value:1,label:'男生宿舍1号楼'},{value:2,label:'男生宿舍2号楼'},{value:3,label:'女生宿舍1号楼'},{value:4,label:'女生宿舍2号楼'}]" | ||||
title="楼栋" /> | title="楼栋" /> | ||||
<selectSearch :value.sync="search.qinshi" :options="[{value:1,label:'寝室302'},{value:2,label:'寝室305'},{value:3,label:'寝室303'}]" | |||||
placeholder="请选择寝室" popupTitle="请选择寝室" search-placeholder="请输入寝室号"/> | |||||
<selectSearch v-model="search.qinshi" :options="[{value:1,label:'寝室302'},{value:2,label:'寝室305'},{value:3,label:'寝室303'}]" | |||||
placeholder="请选择寝室" popupTitle="选择寝室" search-placeholder="请输入宿舍号"/> | |||||
</view> | </view> | ||||
<u-empty marginTop="100rpx" :show="false" mode="list" text="暂无数据"></u-empty> | <u-empty marginTop="100rpx" :show="false" mode="list" text="暂无数据"></u-empty> | ||||
<u-list @scrolltolower="scrolltolower" style="height: calc(100% - 220rpx);"> | <u-list @scrolltolower="scrolltolower" style="height: calc(100% - 220rpx);"> | ||||
@@ -12,23 +12,18 @@ | |||||
<view class="whiteCard"> | <view class="whiteCard"> | ||||
<view class="row1"> | <view class="row1"> | ||||
<text class="room">寝室302</text> | <text class="room">寝室302</text> | ||||
<view class="peopleNum"> | |||||
<image src="@/static/image/peopleNum.png" mode="aspectFill"></image> | |||||
<text>寝室人数:6</text> | |||||
</view> | |||||
</view> | </view> | ||||
<view class="row2"> | <view class="row2"> | ||||
<text class="returnNum">归寝人数:4</text> | <text class="returnNum">归寝人数:4</text> | ||||
<text class="noReturnNum">未归寝人数:2</text> | <text class="noReturnNum">未归寝人数:2</text> | ||||
</view> | </view> | ||||
<view class="bottom"> | <view class="bottom"> | ||||
<view class="btn" @click="NAV_TO('./returnBed/detail')"> | |||||
<image src="@/static/image/see.png" mode="aspectFill"></image> | |||||
<text>查看</text> | |||||
<view class="peopleNum"> | |||||
<image src="@/static/image/peopleNum1.png" mode="aspectFill"></image> | |||||
<text>寝室人数:6</text> | |||||
</view> | </view> | ||||
<view class="btn" @click="NAV_TO('./returnBed/comfirm')"> | |||||
<image src="@/static/image/confirm.png" mode="aspectFill"></image> | |||||
<text>归寝确认</text> | |||||
<view class="btn" @click="NAV_TO('./detail')"> | |||||
<text>查看</text> | |||||
</view> | </view> | ||||
</view> | </view> | ||||
</view> | </view> | ||||
@@ -124,21 +119,6 @@ | |||||
font-size: 32rpx; | font-size: 32rpx; | ||||
font-weight: 700; | font-weight: 700; | ||||
} | } | ||||
.peopleNum { | |||||
uni-image { | |||||
width: 30rpx; | |||||
height: 30rpx; | |||||
position: relative; | |||||
top: 8rpx; | |||||
margin-right: 6rpx; | |||||
} | |||||
uni-text { | |||||
color: #2388FF; | |||||
font-size: 26rpx; | |||||
} | |||||
} | |||||
} | } | ||||
.row2 { | .row2 { | ||||
@@ -154,26 +134,33 @@ | |||||
.bottom { | .bottom { | ||||
display: flex; | display: flex; | ||||
justify-content: space-between; | |||||
border-top: 1rpx solid rgba(0, 0, 0, 0.1); | border-top: 1rpx solid rgba(0, 0, 0, 0.1); | ||||
margin-top: 24rpx; | margin-top: 24rpx; | ||||
padding-top: 22rpx; | |||||
padding-top: 30rpx; | |||||
position: relative; | position: relative; | ||||
::after{ | |||||
content: ""; | |||||
display: block; | |||||
position: absolute; | |||||
top: 26rpx;bottom: 0; | |||||
left: 0;right: 0; | |||||
margin: 0 auto; | |||||
width: 1rpx; | |||||
height: 32rpx; | |||||
background-color: rgba(0, 0, 0, 0.01); | |||||
.peopleNum { | |||||
padding-top: 4rpx; | |||||
uni-image { | |||||
width: 34rpx; | |||||
height: 34rpx; | |||||
position: relative; | |||||
top: 8rpx; | |||||
margin-right: 6rpx; | |||||
} | |||||
uni-text { | |||||
font-size: 26rpx; | |||||
} | |||||
} | } | ||||
.btn { | .btn { | ||||
width: 50%; | |||||
display: flex; | |||||
align-items: center; | |||||
justify-content: center; | |||||
text-align: center; | |||||
line-height: 60rpx; | |||||
background-color: #2388FF; | |||||
padding: 0 34rpx; | |||||
color: #fff; | |||||
border-radius: 30rpx; | |||||
font-size: 26rpx; | |||||
uni-image { | uni-image { | ||||
width: 34rpx; | width: 34rpx; | ||||
height: 34rpx; | height: 34rpx; | ||||
@@ -6,7 +6,8 @@ | |||||
<view style="padding: 26rpx;overflow: hidden;"> | <view style="padding: 26rpx;overflow: hidden;"> | ||||
<view class="cate"> | <view class="cate"> | ||||
<view class="cateList"> | <view class="cateList"> | ||||
<view v-for="item in cateList" :class="{active:item.value == cate}" :key="item.value" class="item" @click="cateItemClick(item)"> | |||||
<view v-for="item in cateList" :class="{active:item.value == cate}" :key="item.value" class="item" | |||||
@click="cateItemClick(item)"> | |||||
{{item.label}}({{item.value}}) | {{item.label}}({{item.value}}) | ||||
</view> | </view> | ||||
</view> | </view> | ||||
@@ -14,12 +15,14 @@ | |||||
</view> | </view> | ||||
<view style="height:calc(100% - 200rpx);overflow: auto;"> | <view style="height:calc(100% - 200rpx);overflow: auto;"> | ||||
<view class="list"> | <view class="list"> | ||||
<view v-for="(item, index) in list" :key="index" class="item"> | |||||
<view v-for="(item, index) in list" :key="index" class="item" @click="popupShow(item)"> | |||||
<view class="right"> | <view class="right"> | ||||
<image src="@/static/image/test/image2.png" mode="aspectFill" style="width: 160rpx;height: 160rpx;"></image> | |||||
<image src="@/static/image/test/image2.png" mode="aspectFill" | |||||
style="width: 160rpx;height: 160rpx;border-radius:10rpx"></image> | |||||
<view class="des"> | <view class="des"> | ||||
<view class="top"> | <view class="top"> | ||||
<view class="status" :style="{backgroundColor:cate == 1?'#0FAF76':cate == 2?'#EF2D2D':'#F49D19' }"> | |||||
<view class="status" | |||||
:style="{backgroundColor:cate == 1?'#0FAF76':cate == 2?'#EF2D2D':'#F49D19' }"> | |||||
{{cateList.find(e=>e.value == cate).label}} | {{cateList.find(e=>e.value == cate).label}} | ||||
</view> | </view> | ||||
<view class="name"> | <view class="name"> | ||||
@@ -38,7 +41,29 @@ | |||||
</view> | </view> | ||||
</view> | </view> | ||||
</view> | </view> | ||||
</view> | |||||
<u-popup :show="show" mode="center" :round="10"> | |||||
<view class="popupInfo"> | |||||
<image src="/static/image/test/image.png" mode="widthFix" style="width: 480rpx;border-radius:10rpx"></image> | |||||
<view class="top"> | |||||
<view class="status" :style="{backgroundColor:cate == 1?'#0FAF76':cate == 2?'#EF2D2D':'#F49D19' }"> | |||||
{{cateList.find(e=>e.value == cate).label}} | |||||
</view> | |||||
<view class="name"> | |||||
杨云 | |||||
</view> | |||||
</view> | |||||
<view class="depart"> | |||||
系部:安环部 | |||||
</view> | |||||
<view class="bottom"> | |||||
<view class="major">专业:环艺</view> | |||||
<view class="class">班级:第二班</view> | |||||
</view> | |||||
<view class="closeBox"> | |||||
<image @click="show = false" src="/static/image/close.png" class="close"></image> | |||||
</view> | |||||
</view> | |||||
</u-popup> | |||||
</view> | </view> | ||||
</template> | </template> | ||||
@@ -76,17 +101,81 @@ | |||||
], | ], | ||||
cate: 1, | cate: 1, | ||||
checkboxValue: [], | checkboxValue: [], | ||||
show: false, | |||||
popupInfo: {}, | |||||
} | } | ||||
}, | }, | ||||
methods: { | methods: { | ||||
cateItemClick(item){ | |||||
cateItemClick(item) { | |||||
this.cate = item.value | this.cate = item.value | ||||
}, | |||||
popupShow(item) { | |||||
this.popupInfo = item | |||||
this.show = true | |||||
} | } | ||||
} | } | ||||
} | } | ||||
</script> | </script> | ||||
<style scoped lang="scss"> | <style scoped lang="scss"> | ||||
.popupInfo { | |||||
padding: 30rpx; | |||||
box-sizing: border-box; | |||||
position: relative; | |||||
.top { | |||||
margin-top: 20rpx; | |||||
font-size: 32rpx; | |||||
display: flex; | |||||
.status { | |||||
display: inline-block; | |||||
font-size: 24rpx; | |||||
line-height: 1.8; | |||||
color: #fff; | |||||
padding: 0 12rpx; | |||||
border-radius: 8rpx; | |||||
margin-right: 12rpx; | |||||
} | |||||
.name { | |||||
font-size: 32rpx; | |||||
font-weight: 700; | |||||
} | |||||
} | |||||
.depart { | |||||
margin-top: 22rpx; | |||||
font-size: 26rpx; | |||||
} | |||||
.bottom { | |||||
font-size: 26rpx; | |||||
margin-top: 18rpx; | |||||
display: flex; | |||||
justify-content: space-between; | |||||
margin-bottom: 12rpx; | |||||
.major {} | |||||
.class {} | |||||
} | |||||
.closeBox { | |||||
width: 100%; | |||||
position: absolute; | |||||
left: 0; | |||||
bottom:-98rpx; | |||||
text-align: center; | |||||
.close { | |||||
width: 60rpx; | |||||
height: 60rpx; | |||||
} | |||||
} | |||||
} | |||||
.title { | .title { | ||||
display: flex; | display: flex; | ||||
color: #333333; | color: #333333; | ||||
@@ -112,7 +201,8 @@ | |||||
margin-right: 30rpx; | margin-right: 30rpx; | ||||
white-space: nowrap; | white-space: nowrap; | ||||
color: #333; | color: #333; | ||||
&.active{ | |||||
&.active { | |||||
background-color: #2388FF; | background-color: #2388FF; | ||||
color: #fff; | color: #fff; | ||||
} | } | ||||
@@ -158,7 +248,8 @@ | |||||
border-radius: 8rpx; | border-radius: 8rpx; | ||||
margin-right: 12rpx; | margin-right: 12rpx; | ||||
} | } | ||||
.name{ | |||||
.name { | |||||
font-size: 32rpx; | font-size: 32rpx; | ||||
font-weight: 700; | font-weight: 700; | ||||
} | } | ||||