550 lines
18 KiB
Vue
550 lines
18 KiB
Vue
|
<template>
|
|||
|
|
<view class="rain-box" style="overflow:hidden;height:100vh">
|
|||
|
|
<u-status-bar ></u-status-bar>
|
|||
|
|
<!-- <view style="height: var(--status-bar-height); width: 100%;"></view> -->
|
|||
|
|
<view class="nav-bar">
|
|||
|
|
<u-icon name="arrow-left" color="#000" size="20" @click="backTo" style="margin-left:10px"></u-icon>
|
|||
|
|
<view style="font-size:18px">
|
|||
|
|
雨情
|
|||
|
|
</view>
|
|||
|
|
<!-- <u-icon name="arrow-right" color="#000" size="28"></u-icon> -->
|
|||
|
|
<view @click="popupOpen = true" style="margin-right:10px">
|
|||
|
|
<image
|
|||
|
|
src="../../static/images/filter.png"
|
|||
|
|
style="width: 20px; height: 20px; "
|
|||
|
|
|
|||
|
|
>
|
|||
|
|
</image>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 搜索以及多级下拉 -->
|
|||
|
|
<view class="search-box">
|
|||
|
|
<view class="search-item">
|
|||
|
|
<view style="display:flex" v-show="limit == 1">
|
|||
|
|
<view class="" @click="handleClick" >
|
|||
|
|
{{selecetItem.adnm == "全部" ? "咸丰县" : selecetItem.adnm || columns[0][0].adnm}}
|
|||
|
|
</view>
|
|||
|
|
<u-icon name="arrow-down-fill" color="#000" size="20" v-show="switchIcon"></u-icon>
|
|||
|
|
<u-icon name="arrow-up-fill" color="#000" size="20" v-show="!switchIcon"></u-icon>
|
|||
|
|
</view>
|
|||
|
|
<view class="rain-input" style="width: 50%;">
|
|||
|
|
<u-input
|
|||
|
|
placeholder="请输入站点"
|
|||
|
|
prefixIcon="search"
|
|||
|
|
prefixIconStyle="font-size: 22px;color: #909399"
|
|||
|
|
@change="changeForm"
|
|||
|
|
:value="formData.stArg"
|
|||
|
|
></u-input>
|
|||
|
|
</view>
|
|||
|
|
<view style="display:flex" v-show="limit == 1">
|
|||
|
|
<view class="" @click="handleClick1" >
|
|||
|
|
{{selecetItem1.basName == "全部" ? "流域" : selecetItem1.basName || "流域"}}
|
|||
|
|
</view>
|
|||
|
|
<u-icon name="arrow-down-fill" color="#000" size="20" v-show="switchIcon1"></u-icon>
|
|||
|
|
<u-icon name="arrow-up-fill" color="#000" size="20" v-show="!switchIcon1"></u-icon>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<!-- 单纯下拉 -->
|
|||
|
|
<view class="time-select">
|
|||
|
|
<view :class="{'jiangyu':true,'noClick':rainTime}" @click="handleJiangyu" >
|
|||
|
|
<text>{{formData.orderType ? "按昨日降雨降序" :"按时段降雨降序"}}</text>
|
|||
|
|
<u-icon name="arrow-down-fill" color="#000" size="20" v-show="!jiangyu"></u-icon>
|
|||
|
|
<u-icon name="arrow-up-fill" color="#000" size="20" v-show="jiangyu"></u-icon>
|
|||
|
|
<view class="jiangyu-dropdown" v-show="this.jiangyu">
|
|||
|
|
<view :class="{'active': formData.orderType == 0,'no_f':true}" @click="rainsort(0)" style="border-top: 1px solid #dfdfdf;">
|
|||
|
|
<text >按时段降雨降序</text>
|
|||
|
|
<u-icon name="checkmark" color="#02a7f0" size="20" v-show="formData.orderType == 0"></u-icon>
|
|||
|
|
</view>
|
|||
|
|
<view :class="{'active':formData.orderType == 1,'no_f':true}" @click="rainsort(1)" >
|
|||
|
|
<text>按昨日降雨降序</text>
|
|||
|
|
<u-icon name="checkmark" color="#02a7f0" size="20" v-show="formData.orderType == 1"></u-icon>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="rain-time" @click="handleTime">
|
|||
|
|
<text>{{formData.timeType == 1 ? "1h" :
|
|||
|
|
formData.timeType == 3 ? "3h" :
|
|||
|
|
formData.timeType == 6 ? "6h" :
|
|||
|
|
formData.timeType == 12 ? "12h" :
|
|||
|
|
formData.timeType == 24 ? "24h" : ''
|
|||
|
|
|
|||
|
|
}}</text>
|
|||
|
|
<u-icon name="arrow-down-fill" color="#000" size="20" v-show="!rainTime"></u-icon>
|
|||
|
|
<u-icon name="arrow-up-fill" color="#000" size="20" v-show="rainTime"></u-icon>
|
|||
|
|
<view class="rain-time-dropdown" v-show="rainTime">
|
|||
|
|
<view :class="{'active': formData.timeType == 1,'no_f':true}" @click="timesort(1)" style="border-top: 1px solid #dfdfdf;">
|
|||
|
|
<text >1h</text>
|
|||
|
|
<u-icon name="checkmark" color="#02a7f0" size="20" v-show="formData.timeType == 1"></u-icon>
|
|||
|
|
</view>
|
|||
|
|
<view :class="{'active': formData.timeType == 3,'no_f':true}" @click="timesort(3)" >
|
|||
|
|
<text >3h</text>
|
|||
|
|
<u-icon name="checkmark" color="#02a7f0" size="20" v-show="formData.timeType == 3"></u-icon>
|
|||
|
|
</view>
|
|||
|
|
<view :class="{'active': formData.timeType == 6,'no_f':true}" @click="timesort(6)" >
|
|||
|
|
<text >6h</text>
|
|||
|
|
<u-icon name="checkmark" color="#02a7f0" size="20" v-show="formData.timeType == 6"></u-icon>
|
|||
|
|
</view>
|
|||
|
|
<view :class="{'active': formData.timeType == 12,'no_f':true}" @click="timesort(12)" >
|
|||
|
|
<text >12h</text>
|
|||
|
|
<u-icon name="checkmark" color="#02a7f0" size="20" v-show="formData.timeType == 12"></u-icon>
|
|||
|
|
</view>
|
|||
|
|
<view :class="{'active': formData.timeType == 24,'no_f':true}" @click="timesort(24)" >
|
|||
|
|
<text>24h</text>
|
|||
|
|
<u-icon name="checkmark" color="#02a7f0" size="20" v-show="formData.timeType == 24"></u-icon>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
<!-- 内容部分 -->
|
|||
|
|
<view style="width: 100%; height: 10px; background-color: #f7f7f7;">
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
<!-- 时间段 -->
|
|||
|
|
<view style="padding: 1% 0%;width:100vw; text-align: center; color: #f7b156;">
|
|||
|
|
统计时段:{{tm.stm}}至{{tm.etm}}
|
|||
|
|
</view>
|
|||
|
|
<view style="width:100%">
|
|||
|
|
<Table :list="rainList" :height='tableHeight'/>
|
|||
|
|
</view>
|
|||
|
|
<u-picker
|
|||
|
|
:show="show"
|
|||
|
|
ref="uPicker"
|
|||
|
|
:columns="columns"
|
|||
|
|
@confirm="confirm"
|
|||
|
|
@change="changeHandler"
|
|||
|
|
@cancel="cancel"
|
|||
|
|
keyName="adnm"
|
|||
|
|
>
|
|||
|
|
</u-picker>
|
|||
|
|
<u-picker
|
|||
|
|
:show="show1"
|
|||
|
|
ref="uPicker1"
|
|||
|
|
:columns="columns1"
|
|||
|
|
@confirm="confirm1"
|
|||
|
|
@cancel="cancel1"
|
|||
|
|
keyName="basName"
|
|||
|
|
>
|
|||
|
|
</u-picker>
|
|||
|
|
<u-popup :show="popupOpen" mode="right" @close="popupOpen=false" >
|
|||
|
|
<view style="padding: 30px 20px; ">
|
|||
|
|
<text style="font-weight: bold;">按类型</text>
|
|||
|
|
<view style="margin-bottom: 10px; margin-left: -5px;">
|
|||
|
|
<u-checkbox-group
|
|||
|
|
v-model="formData.source"
|
|||
|
|
@change="checkboxChange"
|
|||
|
|
>
|
|||
|
|
<u-checkbox
|
|||
|
|
:customStyle="{margin: '7px'}"
|
|||
|
|
v-for="(item, index) in checkboxList1"
|
|||
|
|
:key="index"
|
|||
|
|
:label="item.name"
|
|||
|
|
:name="item.value"
|
|||
|
|
>
|
|||
|
|
</u-checkbox>
|
|||
|
|
</u-checkbox-group>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<!-- <text style="font-weight: bold;">按时间</text>
|
|||
|
|
<view class="example-body" style="display: flex; align-items: center; margin-bottom: 10px; margin-top: 10px;">
|
|||
|
|
<uni-datetime-picker type="datetime" v-model="stm" @change="(e) => this.stm = e" />
|
|||
|
|
<text style="margin-left: 10px;">至</text>
|
|||
|
|
</view>
|
|||
|
|
<view class="example-body" style="width: 92%;">
|
|||
|
|
<uni-datetime-picker type="datetime" v-model="etm" @change="(e) => this.etm = e" />
|
|||
|
|
</view>
|
|||
|
|
<view style="display: flex; margin-top: 10px;">
|
|||
|
|
<u-button class="first-btn" text="昨日08:00~当前时间"></u-button>
|
|||
|
|
<u-button class="second-btn" text="今天08:00~当前时间"></u-button>
|
|||
|
|
</view> -->
|
|||
|
|
<view style="display: flex; position:absolute;bottom:20px;right:20px">
|
|||
|
|
<u-button text="重置" class="bottom-btn1"
|
|||
|
|
@click="formData = {...formData,source}"></u-button>
|
|||
|
|
<u-button text="确认" color="#d9001b" class="bottom-btn2" @click="popupOpen = false"></u-button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</u-popup>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import Table from "./Table"
|
|||
|
|
import filter from "../../static/images/filter.png"
|
|||
|
|
import moment from "moment"
|
|||
|
|
import {disType} from "../utils/dicType.js"
|
|||
|
|
const adcd = uni.getStorageSync('value').adcd
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
show: false,
|
|||
|
|
show1:false,
|
|||
|
|
switchIcon:true,
|
|||
|
|
switchIcon1:true,
|
|||
|
|
rainList:[],//雨情数据
|
|||
|
|
selecetItem:{},
|
|||
|
|
selecetItem1:{},
|
|||
|
|
jiangyu:false, //显示下拉
|
|||
|
|
rainTime:false, //显示下拉，
|
|||
|
|
selectJyOne:1,//选中降雨最后一个元素，
|
|||
|
|
selectTimeOne:4, //选中时间的最有一个元素
|
|||
|
|
popupOpen:false, //抽屉打开
|
|||
|
|
source:["SH","SW","QX","SK"],
|
|||
|
|
// checkboxValue1:["SH","SW","QX","SK"],
|
|||
|
|
// 基本案列数据
|
|||
|
|
checkboxList1: [{
|
|||
|
|
name: '山洪',
|
|||
|
|
value: "SH"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '水文',
|
|||
|
|
value: "SW"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '气象',
|
|||
|
|
value: "QX"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '水库',
|
|||
|
|
value: "SK"
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
stm: '', //开始时间，
|
|||
|
|
etm:"",//结束时间
|
|||
|
|
columns: //政区下拉
|
|||
|
|
[
|
|||
|
|
[{"adnm": "咸丰县", "adcd":adcd }],[]
|
|||
|
|
],
|
|||
|
|
columnData: [[]],
|
|||
|
|
columns1:[[]], //流域选择,
|
|||
|
|
formData:{ //表单数据
|
|||
|
|
timeType:24,
|
|||
|
|
orderType:1,
|
|||
|
|
basCode:'',
|
|||
|
|
source:["SH","SW","QX","SK"],
|
|||
|
|
stArg:'',
|
|||
|
|
adcd:disType(uni.getStorageSync('value').adcd) == 1 ? undefined :uni.getStorageSync('value').adcd,
|
|||
|
|
etm:moment().format("YYYY-MM-DD HH:mm"),
|
|||
|
|
stm:moment().subtract(1, 'day').format("YYYY-MM-DD HH:mm")
|
|||
|
|
// etm:moment().set({ hour: 8, minute: 0, second: 0, millisecond: 0 }).format("YYYY-MM-DD HH:mm"),
|
|||
|
|
// stm:moment().subtract(1, 'day').set({ hour: 8, minute: 0, second: 0, millisecond: 0 }).format("YYYY-MM-DD HH:mm")
|
|||
|
|
},
|
|||
|
|
tableHeight:0,
|
|||
|
|
limit:disType(uni.getStorageSync('value').adcd)
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
components:{
|
|||
|
|
Table
|
|||
|
|
},
|
|||
|
|
computed:{
|
|||
|
|
tm(){
|
|||
|
|
return {
|
|||
|
|
stm:moment().subtract(this.formData.timeType, 'hours').format("YYYY-MM-DD HH:mm"),
|
|||
|
|
etm:moment().format("YYYY-MM-DD HH:mm")
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
watch:{
|
|||
|
|
formData(newV, oldV){
|
|||
|
|
console.log("www",newV)
|
|||
|
|
this.getRainList()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
changeForm(e){
|
|||
|
|
this.formData = {...this.formData,stArg:e}
|
|||
|
|
},
|
|||
|
|
handleJiangyu(e){
|
|||
|
|
if(this.rainTime){
|
|||
|
|
e.stopPropagation();
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.jiangyu = !this.jiangyu
|
|||
|
|
},
|
|||
|
|
handleTime(e){
|
|||
|
|
if(this.jiangyu){
|
|||
|
|
e.stopPropagation();
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.rainTime = !this.rainTime
|
|||
|
|
},
|
|||
|
|
//按昨日降雨排序
|
|||
|
|
rainsort(e){
|
|||
|
|
this.formData = {...this.formData,orderType: e ? 1 : 0}
|
|||
|
|
},
|
|||
|
|
// 按小时排序
|
|||
|
|
timesort(e){
|
|||
|
|
this.formData = {
|
|||
|
|
...this.formData,
|
|||
|
|
stm:moment().subtract(e, 'hours').format("YYYY-MM-DD HH:mm"),
|
|||
|
|
etm:moment().format("YYYY-MM-DD HH:mm"),
|
|||
|
|
timeType:e
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
changeHandler(e) {
|
|||
|
|
const {
|
|||
|
|
columnIndex,
|
|||
|
|
value,
|
|||
|
|
values, // values为当前变化列的数组内容
|
|||
|
|
index,
|
|||
|
|
// 微信小程序无法将picker实例传出来，只能通过ref操作
|
|||
|
|
picker = this.$refs.uPicker
|
|||
|
|
} = e
|
|||
|
|
// 当第一列值发生变化时，变化第二列(后一列)对应的选项
|
|||
|
|
if (columnIndex === 0) {
|
|||
|
|
// picker为选择器this实例，变化第二列对应的选项
|
|||
|
|
picker.setColumnValues(1, this.columnData[index])
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 回调参数为包含columnIndex、value、values
|
|||
|
|
confirm(e) {
|
|||
|
|
console.log('confirm', e)
|
|||
|
|
this.show = false
|
|||
|
|
this.switchIcon=true;
|
|||
|
|
this.selecetItem = e.value[1];
|
|||
|
|
// this.formData.adcd = e.value[1].adcd;
|
|||
|
|
this.formData = {...this.formData,adcd:e.value[1].adcd}
|
|||
|
|
},
|
|||
|
|
cancel(e) {
|
|||
|
|
this.show = false
|
|||
|
|
},
|
|||
|
|
changeHandler1(e) {
|
|||
|
|
const {
|
|||
|
|
columnIndex,
|
|||
|
|
value,
|
|||
|
|
values, // values为当前变化列的数组内容
|
|||
|
|
index,
|
|||
|
|
// 微信小程序无法将picker实例传出来，只能通过ref操作
|
|||
|
|
picker = this.$refs.uPicker1
|
|||
|
|
} = e
|
|||
|
|
// 当第一列值发生变化时，变化第二列(后一列)对应的选项
|
|||
|
|
if (columnIndex === 0) {
|
|||
|
|
// picker为选择器this实例，变化第二列对应的选项
|
|||
|
|
picker.setColumnValues(1, this.columnData[index])
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 回调参数为包含columnIndex、value、values
|
|||
|
|
confirm1(e) {
|
|||
|
|
console.log('confirm', e)
|
|||
|
|
this.show1 = false
|
|||
|
|
this.switchIcon1=true;
|
|||
|
|
this.selecetItem1 = e.value[0];
|
|||
|
|
this.formData = {...this.formData,basCode:e.value[0].basCode};
|
|||
|
|
},
|
|||
|
|
cancel1(e) {
|
|||
|
|
this.show1 = false
|
|||
|
|
},
|
|||
|
|
handleClick(e){
|
|||
|
|
if(this.selecetItem1.basName && this.selecetItem1.basName != "全部"){
|
|||
|
|
e.stopPropagation();
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.show = true;
|
|||
|
|
this.switchIcon = !this.switchIcon
|
|||
|
|
},
|
|||
|
|
handleClick1(e){
|
|||
|
|
if(this.selecetItem.adnm&&this.selecetItem.adnm != "全部"){
|
|||
|
|
e.stopPropagation();
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.show1 = true;
|
|||
|
|
this.switchIcon1 = !this.switchIcon1
|
|||
|
|
},
|
|||
|
|
checkboxChange(n) {
|
|||
|
|
console.log('change', n);
|
|||
|
|
this.formData = {...this.formData,source:n};
|
|||
|
|
},
|
|||
|
|
changeLog(e) {
|
|||
|
|
console.log('change事件:', e);
|
|||
|
|
},
|
|||
|
|
// 获取行政区域选择
|
|||
|
|
async adnmList(){
|
|||
|
|
try{
|
|||
|
|
const {data} = await uni.$http.get(
|
|||
|
|
"/gunshiApp/xfflood/real/rain/adnmList"
|
|||
|
|
)
|
|||
|
|
if(data.code == 200){
|
|||
|
|
|
|||
|
|
const all = {
|
|||
|
|
adnm:'全部',
|
|||
|
|
adcd:''
|
|||
|
|
}
|
|||
|
|
this.columns = [[...this.columns[0]],[all,...data.data]];
|
|||
|
|
this.columnData = [[all,...data.data]];
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}catch(e){
|
|||
|
|
uni.$showMsg()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 获取流域
|
|||
|
|
async basNameList(){
|
|||
|
|
try{
|
|||
|
|
const {data} = await uni.$http.get(
|
|||
|
|
"/gunshiApp/xfflood/real/rain/basNameList"
|
|||
|
|
)
|
|||
|
|
if(data.code == 200){
|
|||
|
|
const all = {
|
|||
|
|
basName:'全部',
|
|||
|
|
basCode:''
|
|||
|
|
}
|
|||
|
|
this.columns1 = [[all,...data.data]];
|
|||
|
|
}
|
|||
|
|
}catch(e){
|
|||
|
|
uni.$showMsg()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 获取雨情列表
|
|||
|
|
async getRainList(){
|
|||
|
|
let obj = {
|
|||
|
|
...this.formData,
|
|||
|
|
timeType:undefined
|
|||
|
|
}
|
|||
|
|
try{
|
|||
|
|
const {data} = await uni.$http.post(
|
|||
|
|
"/gunshiApp/xfflood/real/rain/app/list",obj
|
|||
|
|
)
|
|||
|
|
if(data.code == 200){
|
|||
|
|
this.rainList = [...data.data];
|
|||
|
|
}
|
|||
|
|
}catch(e){
|
|||
|
|
uni.$showMsg()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
backTo(){
|
|||
|
|
uni.navigateBack({delta:1})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad() {
|
|||
|
|
this.adnmList();
|
|||
|
|
this.basNameList()
|
|||
|
|
this.getRainList()
|
|||
|
|
},
|
|||
|
|
onReady(){
|
|||
|
|
let that = this
|
|||
|
|
uni.getSystemInfo({
|
|||
|
|
success: (res) => {
|
|||
|
|
that.tableHeight = res.windowHeight - 280;
|
|||
|
|
console.log("this.tableHeight", that.tableHeight);
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.nav-bar{
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 44px;
|
|||
|
|
// margin-top: 30px;
|
|||
|
|
// padding-top: 40px;
|
|||
|
|
// padding-bottom: 10px;
|
|||
|
|
border-bottom: 1px solid #dfdfdf;
|
|||
|
|
// box-shadow: 0 5px 10px -8px #dfdfdf inset;
|
|||
|
|
}
|
|||
|
|
.search-box{
|
|||
|
|
width: 100%;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
.search-item{
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
margin-top: 20px;
|
|||
|
|
width: 90%;
|
|||
|
|
padding: 5px;
|
|||
|
|
height: 30px;
|
|||
|
|
background-color: #dddddd;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
.time-select{
|
|||
|
|
position: relative;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
margin-top: 20px;
|
|||
|
|
margin-bottom: 20px;
|
|||
|
|
.noClick{
|
|||
|
|
pointer-events: initial;
|
|||
|
|
}
|
|||
|
|
.jiangyu,.rain-time{
|
|||
|
|
display: flex;
|
|||
|
|
column-gap: 5px;
|
|||
|
|
margin-right: 20px;
|
|||
|
|
}
|
|||
|
|
.jiangyu{
|
|||
|
|
// position: relative;
|
|||
|
|
.jiangyu-dropdown{
|
|||
|
|
position: absolute;
|
|||
|
|
background-color: #fff;
|
|||
|
|
width: 100vw;
|
|||
|
|
left: 0;
|
|||
|
|
top: 35px;
|
|||
|
|
.active{
|
|||
|
|
color:#02a7f0
|
|||
|
|
}
|
|||
|
|
text{
|
|||
|
|
margin-right: 58%;
|
|||
|
|
}
|
|||
|
|
.no_f{
|
|||
|
|
border-bottom: 1px solid #dfdfdf;
|
|||
|
|
// border-top: 1px solid #dfdfdf;
|
|||
|
|
padding: 10px 15px;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
// justify-content: space-around;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.rain-time{
|
|||
|
|
// position: relative;
|
|||
|
|
.rain-time-dropdown{
|
|||
|
|
position: absolute;
|
|||
|
|
background-color: #fff;
|
|||
|
|
width: 100vw;
|
|||
|
|
// left: -10%;
|
|||
|
|
left: 0;
|
|||
|
|
top: 35px;
|
|||
|
|
.active{
|
|||
|
|
color:#02a7f0;
|
|||
|
|
text{
|
|||
|
|
margin-right: 80%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
.no_f{
|
|||
|
|
border-bottom: 1px solid #dfdfdf;
|
|||
|
|
// border-top: 1px solid #dfdfdf;
|
|||
|
|
padding: 10px 15px;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
// justify-content: space-around;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
.first-btn{
|
|||
|
|
margin-right: 5px;
|
|||
|
|
background-color: #f2f2f2;
|
|||
|
|
}
|
|||
|
|
.second-btn{
|
|||
|
|
background-color: #f2f2f2;
|
|||
|
|
}
|
|||
|
|
.bottom-btn1,.bottom-btn2{
|
|||
|
|
width: 100px;
|
|||
|
|
}
|
|||
|
|
.bottom-btn1{
|
|||
|
|
margin-left: 70px;
|
|||
|
|
}
|
|||
|
|
.bottom-btn2{
|
|||
|
|
margin-right: -12px;
|
|||
|
|
margin-left: 10px;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
</style>
|