tsg-app/pages/water/hdWater/hdWater.vue

157 lines
4.3 KiB
Vue

<template>
<view class="zbyq-box">
<view class="search-bar">
<u-search
shape="square"
:clearabled="true"
:showAction="false"
placeholder="请输入站点"
height="40px"
@change="inputChange"
v-model="formData.args"
></u-search>
<image
src="../../../static/images/filter.png"
style="width: 20px; height: 20px; margin-left: 20px;"
@click="popupOpen = true"
>
</image>
</view>
<view class="content">
<Table :list="list" :height="height" />
</view>
<u-popup :show="popupOpen" mode="right" @close="popupOpen=false" >
<view style="padding: 30px 20px; width:250px">
<text style="font-weight: bold;">按类型</text>
<view style="margin-bottom: 10px; margin-left: -5px;">
<u-checkbox-group
v-model="formData.sources"
@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>
<view style="display: flex;position:absolute;bottom:20px;right:20px">
<u-button text="重置" class="bottom-btn1"
@click="formData = {...formData,sources}"></u-button>
<u-button text="确认" color="#d9001b" class="bottom-btn2" @click="popConfirm"></u-button>
</view>
</view>
</u-popup>
</view>
</template>
<script>
import Table from "./table.vue"
import {disType} from "../../utils/dicType.js"
const adcd = uni.getStorageSync('value').adcd
const type = disType(adcd)
export default {
props:{
stcd:String,
height:Number,
default:''
},
components:{
Table
},
data() {
return {
popupOpen:false,
sources:["SH","SW"],
checkboxList1: [{
name: '山洪',
value: "SH"
},
{
name: '水文',
value: "SW"
},
],
formData:{
args:'',
sources:["SH","SW"],
// adcd:type == 1 ? undefined : adcd,
},
list:[], //搜索结果
saveList:[], //保存搜索结果
tableHeight:0
}
},
methods: {
inputChange(e){
console.log("e",e);
if(!e) this.list = this.saveList;
this.formData={...this.formData,value:e}
let filterData = this.list.filter(item => item.stnm.indexOf(e) > -1);
this.list = filterData;
},
checkboxChange(n) {
this.formData = {...this.formData,sources:n};
},
popConfirm(){
this.popupOpen = false
this.getList()
},
async getList(){
const adcd = uni.getStorageSync('value').adcd
let newAdcd = adcd.endsWith('000000000') ? "" : adcd
this.formData = {...this.formData,adcd:newAdcd}
console.log(1111,this.formData);
try{
const {data} = await uni.$http.post(
"/gunshiApp/xfflood/river/water/list",{...this.formData}
)
console.log("22weee",data);
if(data.code == 200){
this.list = [...data.data]
this.saveList = [...data.data]
}
}catch(e){
uni.$showMsg()
}
}
},
mounted() {
this.getList()
},
}
</script>
<style lang="scss" scoped>
.zbyq-box{
.search-bar{
display: flex;
align-items: center;
margin-top: 20px;
padding: 0 20px;
}
.content{
width: 100%;
margin-top: 10px;
// max-height: 580px;
overflow-y: auto;
}
.bottom-btn1{
width: 100px;
margin-left: 70px;
}
.bottom-btn2{
width: 100px;
margin-right: -12px;
margin-left: 10px;
}
}
</style>